@charset "UTF-8"; /* sale */ @import url(../settings.less); /*================================================*/ .gnav_header_in { li.icon-nav { a { padding: 10px 10px; } } } .right { text-align: left; } h2.title { background: none; border-bottom: 1px solid @main-color; border-top: none; } h3 { padding-bottom: 10px; margin-bottom: 20px; font-size: 2.0rem; border-bottom: 1px solid #333; } div#mynavi_area .mynavi_list li { background: none; position: relative; padding-left: 20px; } div#mynavi_area .mynavi_list li:before{ position: absolute; top: 0; left: 0; display: block; width: 10px; height: 10px; content:'\f058'; font-family: FontAwesome; } .point_announce { display: none; } .cartin_btn, .favorite_btn { text-align: center; } .alignC { text-align: center; } .alignR { text-align: right; } .btn_area { text-align: center; li { display: inline-block; vertical-align: top; } } .flow_area { text-align: center; margin-bottom: 30px; } input[type="text"], input[type="password"] { margin: 0 5px; padding: 10px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #ddd; box-sizing: border-box; } input[type="radio"] { margin-right: 10px; } #ec_contents { .contents { width: 1200px; @media screen and ( max-width: @break-max-width ) { width: 100%; padding: 0 15px; box-sizing: border-box; } #main_image { width: 1200px; margin: 0 auto 80px auto; @media screen and ( max-width: @break-max-width ) { width: 100%; margin-bottom: 0 } } .top_menu { display: none; } } #recommend_area { padding: 70px 0; background: #fff; ul { width: 1200px; margin: 0 auto; @media screen and ( max-width: @break-max-width ) { padding: 0 15px; width: 100%; box-sizing: border-box; } .list_inner { padding: 0 0 30px 0; border: 1px solid #ddd; h3 { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; height: 100px; background: #eee; vertical-align: middle; line-height: 1.5em; font-weight: bold; font-size: 1.8rem; width: 100%; } p.mini.comment { height: 3.0em; } .productImage { margin-bottom: 20px; } .productContents { .comment { margin-bottom: 20px; } .sale_price { margin-bottom: 20px; em, span { display: block; } em { margin-bottom: 10px; } span { font-size: 1.8rem; font-weight: bold; } } } } } } } #detailarea { width: 1200px; margin: 0 auto 80px auto; @media screen and ( max-width: @break-max-width ) { width: 100%; margin: 0 0 20px 0; padding: 0 15px; box-sizing: border-box; background: #fff; } } .product_name_area { width: 1200px; margin: 0 auto; @media screen and ( max-width: @break-max-width ) { width: 100%; padding: 0 15px; box-sizing: border-box; } } #detailphotobloc { float: left; width: 500px; @media screen and ( max-width: @break-max-width ) { float: none; width: 100%; box-sizing: border-box; img { width: 100%; } } } #detailrightbloc { float: right; width: 670px; @media screen and ( max-width: @break-max-width ) { float: none; width: 100%; } .status_icon { margin-bottom: 10px; li { display: inline-block; background: none; } } dl { display: table; width: 100%; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #ddd; dd,dt { display: table-cell; vertical-align: top; } dt { width: 150px; } } .classlist { ul { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #ddd; display: table; width: 100%; li { display: table-cell; vertical-align: top; } li.dt_title { width: 150px; } } } } div#undercolumn.inner_contents, div#undercolumn_cart, div#undercolumn_login, div#undercolumn_customer, div#undercolumn_entry, div#undercolumn_shopping { width: 1200px; margin: 0 auto 80px auto; @media screen and ( max-width: @break-max-width ) { width: 100%; } } div#undercolumn h2.title { width: 1200px; margin: 0 auto 30px auto; @media screen and ( max-width: @break-max-width ) { width: 100%; margin-bottom: 20px; } } .product_list { .listrightbloc { float: right; width: 1030px; } } div#undercolumn_cart { .point_announce { line-height: 1.8em; margin-bottom: 20px; } .form_area { p { margin-bottom: 20px; } .btn_area { text-align: center; li { display: inline-block; vertical-align: top; } } } .table02 { th,td { vertical-align: middle; i.quant { float: left; vertical-align: middle; margin-right: 10px; } ul { display: inline; li { display: inline; float: left; margin-right: 5px; } } } } } .cartin { margin-bottom: 10px; } div#undercolumn_login { p { line-height: 1.8em; } .login_area h3 { margin-bottom: 30px; padding: 10px 0 10px 15px; font-size: 2.0rem; border-left: 5px solid @main-color; font-weight: bold; line-height: 1.3em; color: @main-color; background: none; } .login_area h4 { margin-bottom: 15px; padding: 0; font-size: 1.8rem; font-weight: bold; line-height: 1.3em; color: @main-color; background: none; } .inputtext { margin-bottom: 20px; } .login_area { margin-bottom: 50px; } .inputbox { margin-bottom: 30px; padding: 20px; background: #eee; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .formlist { margin-bottom: 15px; dt,dd { float: left; vertical-align: top; } dt { width: 160px; } dd { width: 1000px; } } input[type="text"], input[type="password"] { width: 100%; box-sizing: border-box; } } div#undercolumn_customer { p { line-height: 1.8em; } form { p.top { margin-bottom: 10px; } .zipimg { img { margin-right: 10px; vertical-align: middle; } .mini { font-size: 1.2rem; } } .box300 { margin-bottom: 10px; width: 100%; } select { margin-bottom: 10px; } } } div#undercolumn_entry { margin-bottom: 80px; p { line-height: 1.8em; margin-bottom: 10px; } form { textarea { width: 100%; } .btn_area { padding-top: 20px; } p.top { margin-bottom: 10px; } .zipimg { img { margin-right: 10px; vertical-align: middle; } .mini { font-size: 1.2rem; } } .box300 { margin-bottom: 10px; width: 100%; } select { margin-bottom: 10px; } } } div#undercolumn_shopping { p { line-height: 1.8em; margin-bottom: 10px; } .information { margin-bottom: 20px; } .mini { font-size: 1.2rem; } .add_multiple { margin-bottom: 10px; } h3 { margin-bottom: 15px; font-size: 1.8rem; font-weight: bold; line-height: 1.3em; color: @main-color; } .pay_area, .pay_area02, .point_area { margin-bottom: 30px; } .point_announce { ul { border-top: 1px solid #ddd; li { padding: 10px; border-bottom: 1px solid #ddd; } } } .point { padding: 2px 12px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: @main-color; background: @accent-color; } .price { font-weight: bold; color: #f00; } textarea { padding: 10px; width: 100%; box-sizing: border-box; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #ddd; } .btn_area { margin-bottom: 10px; } } #mypagecolumn { width: 1000px !important; margin: 0 auto 100px auto; } @media screen and ( max-width: @break-max-width ) { .empty { margin-bottom: 10px; } .form_area { a.btn_sub { display: none; //display: inline-block; margin: 0 auto 10px auto; padding: .9em 2.5em .95em; background: @button-bgcolor; color: @button-color !important; text-decoration: none !important; line-height: 1.4em; -webkit-transition: all 0.8s ease; -moz-transition: all 0.8s ease; -o-transition: all 0.8s ease; i.fa-chevron-right { margin: 0 0 0 20px; } } } #search_area { display: none; } .mailtextBox { width: 93.2% !important; margin: 0 !important; padding: 10px !important; background: #fff !important; border-radius: 7px 7px 0 0 !important; -moz-border-radius: 7px 7px 0 0 !important; -webkit-border-radius: 7px 7px 0 0 !important; border: #A9ABAD solid 1px !important; border-bottom: none!important; display: block !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; } .passtextBox { width: 100% !important; margin: 0 !important; padding: 10px !important; background: #fff !important; border-radius: 0 0 7px 7px !important; -moz-border-radius: 0 0 7px 7px !important; -webkit-border-radius: 0 0 7px 7px !important; border: #A9ABAD solid 1px !important; display: block !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; } #search_area { display: none; } } @media screen and ( max-width: @break-max-width ) { } /*================================================== [ utility ] $clearfix ==================================================*/ .clearfix:after, #detailarea:after { content:" "; display:block; clear:both; }