/* index */ #product-list{ background:url(/brand/tire/advan/product/parts/img/bg_product.jpg) 0 100px repeat-x #f6f7f9; width:100%; padding-top:100px; } #product-list .inner{ width:960px; margin:0 auto; position:relative; } #product-list .inner h1{ position:absolute; left:0; top:60px; z-index:10; height:45px; } #product-list .inner h1 span{ display:block; height:6px; width:60px; position: absolute; top:auto; bottom:0; left:0; background:#cd0000; } #product-list .inner .lineup{ background:url(/brand/tire/advan/product/parts/img/bg_productlist.jpg) 50% 0 no-repeat; padding-top:154px; height:421px; position:relative; } #product-list .inner .lineup li{ float:left; margin:0; padding:0; } #product-list .inner .lineup li a{ -webkit-transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; -o-transition: 0.3s all ease-in-out; -ms-transition: 0.3s all ease-in-out; transition: 0.3s all ease-in-out; } #product-list .inner .lineup li a img{ display:none } #product-list .inner .lineup li.elm01{ margin-left:48px; width:222px} #product-list .inner .lineup li.elm01 a{ background:url(/brand/tire/advan/product/parts/img/btn_product01.jpg); width:222px; height:350px; display:block} #product-list .inner .lineup li.elm02{ margin-left:62px; width:179px} #product-list .inner .lineup li.elm02 a{ background:url(/brand/tire/advan/product/parts/img/btn_product02.jpg); width:179px; height:386px; display:block} #product-list .inner .lineup li.elm03{ margin-left:38px; width:150px} #product-list .inner .lineup li.elm03 a{ background:url(/brand/tire/advan/product/parts/img/btn_product03.jpg); width:150px; height:386px; display:block} #product-list .inner .lineup li.elm04{ margin-left:30px; width:188px} #product-list .inner .lineup li.elm04 a{ background:url(/brand/tire/advan/product/parts/img/btn_product04.jpg); width:188px; height:350px; display:block} #product-list .inner .lineup li a:hover{ background:none; } #product-list .inner .sub-lineup{ padding-top:42px; /* background:url(/brand/tire/advan/product/parts/img/bg_productlist2.jpg) 50% 42px no-repeat; */ height:113px; position:relative; border-top:1px solid #ccc; margin:0 auto; width:884px; } #product-list .inner .sub-lineup li{ float:left; } #product-list .inner .sub-lineup li.elm01{ margin-left:97px; width:97px} #product-list .inner .sub-lineup li.elm02{ margin-left:48px; width:97px} #product-list .inner .sub-lineup li.elm03{ margin-left:48px; width:98px} #product-list .inner .sub-lineup li.elm04{ margin-left:45px; width:132px} /* #product-list .inner .sub-lineup li.elm05{ margin-left:51px; width:95px} */ /* rower */ #product-detail{ padding-top:35px; width:100%; } #product-detail.neova .box-lead, #product-detail.db .box-lead, #product-detail.sport .box-lead{ padding-bottom:50px; } #product-detail .ttl-mv{ background-color:#111; text-align:center; min-width:960px; height:500px; position:relative; overflow:hidden } #product-detail.neova .ttl-mv{ background:url(/brand/tire/advan/product/neova/parts/img/mv.jpg) 50% 0 no-repeat; } #product-detail.db .ttl-mv{ background:url(/brand/tire/advan/product/db/parts/img/mv.jpg) 50% 0 no-repeat; } #product-detail.sport .ttl-mv{ background:url(/brand/tire/advan/product/sport/parts/img/mv.jpg) 50% 0 no-repeat; } #product-detail.fleva .ttl-mv{ background:url(/brand/tire/advan/product/fleva/parts/img/mv.jpg) 50% 0 no-repeat; } #product-detail .ttl-mv img{ display:none} #product-detail .box-detail{ display:table; margin-bottom:60px; } #product-detail .box-detail section{ display:table-cell; width:480px; vertical-align:top; } #product-detail .box-detail section h3{ margin-bottom:40px; } #product-detail .box-detail section p{ font-size:10px; line-height:2; margin-bottom:20px; color:#999 } #product-detail .box-detail section p .ico{ margin:0 10px 0 0; vertical-align:middle } #product-detail .box-lead{ position:relative; padding:145px 0 160px; } #product-detail .box-lead h2{ margin-bottom:36px; } #product-detail .box-lead figure{ position:absolute; width:315px; right:0; top:65px; } #product-detail .box-lead p{ margin:36px 0; } #product-detail .box-lead p span{ display:none } #product-detail .btn-anchor{ margin:0; text-align:center; } #product-detail .btn-anchor span{ display:inline-block; background:url(/brand/tire/advan/common/img/ico_arrow2_sp.png) 100% 50% no-repeat; padding-right:2em; } #product-detail .btn-anchor a{ display:inline-block; padding:14px 40px; background:#cd0000; background-size:8px 14px; -webkit-background-size:8px 14px; font-size:14px; color:#fff; } #product-detail .btn-anchor a:hover{ text-decoration:none; background:#600 } #product-detail .btn-size{ border:1px solid #666; bottom:50px; color:#666; font-size:11px; left:115px; padding:5px 15px 5px 20px; position:absolute; white-space:nowrap; } #product-detail .btn-size:after{ content:'>'; padding-left:5px; } #product-detail .btn-size:hover{ color:#cd0000; border-color:#cd0000; text-decoration:none; } @media only screen and (max-width: 640px){ /* index */ #product-list{ background:url(/brand/tire/advan/product/parts/img/bg_product_sp.jpg) 0 45px; background-size: 100% auto; -webkit-background-size: 100% auto; width:100%; padding:45px 0 0; } #product-list .inner{ width: auto; margin:0 auto; position:relative; padding:0 } #product-list .inner h1{ position: static; left:0; top: auto; z-index:10; height: auto; padding:35px 0 20px 3.125%; line-height:1; } #product-list .inner h1 img{ height:16px; width: auto } #product-list .inner h1 span{ display:block; height:4px; width:48px; position: static; top:auto; background:#cd0000; margin-top:5px } #product-list .inner .lineup{ background: none; padding: 0 0 40px; height: auto; position:relative; background:#f6f7f9 } #product-list .inner .lineup li{ float:left; font-size:0; line-height:1; margin:0 !important } #product-list .inner .lineup li a{ background:none !important; width:auto !important; height:auto !important } #product-list .inner .lineup li a img{ display:block; } #product-list .inner .lineup li.elm01{ width:30%} #product-list .inner .lineup li.elm02{ width:25.3125%} #product-list .inner .lineup li.elm03{ width:20.625%} #product-list .inner .lineup li.elm04{ width:24.0625%} #product-list .inner .lineup li img{ width:100%; height:auto; } #product-list .inner .lineup li a:hover img{ opacity:1; } #product-list .inner .sub-lineup{ padding-top:0; background:#f6f7f9; height: auto; position:relative; border-top:1px solid #ccc; padding:20px 3.125% 0; width: auto; text-align:center; } #product-list .inner .sub-lineup li{ float:none; display:inline-block; } #product-list .inner .sub-lineup li img{ width:100%; height:auto } #product-list .inner .sub-lineup li.elm01{ margin:0 2% 10px; width:24%} #product-list .inner .sub-lineup li.elm02{ margin:0 2% 10px; width:24%} #product-list .inner .sub-lineup li.elm03{ margin:0 2% 10px; width:25%} #product-list .inner .sub-lineup li.elm04{ margin:0 2% 10px; width:35%} #product-list .inner .sub-lineup li.elm05{ margin:0 2% 10px; width:24%} /* rower */ #product-detail{ padding:45px 0; } #product-detail.neova .box-lead, #product-detail.db .box-lead, #product-detail.sport .box-lead{ padding-bottom:20px; } #product-detail .ttl-mv{ text-align:center; min-width:inherit; height:auto; position:relative; overflow:inherit } #product-detail .ttl-mv img{ position:static; display: block; left:0; top:0; margin-left:0; width:100%; height:auto; } #product-detail .box-lead{ position:relative; padding:10px 5% 20px; } #product-detail .box-lead h2{ margin-bottom:0; width:60%; display:table-cell; vertical-align:middle; } #product-detail .box-lead h2 img{ margin-bottom:20px; } #product-detail .box-lead figure{ position:inherit; width:40%; right: inherit; top: inherit; display:table-cell; padding:0 3%; box-sizing:border-box } #product-detail .box-lead h2 img, #product-detail .box-lead figure img{ width:100%; height:auto } #product-detail .box-lead p{ margin:0 0 20px; } #product-detail .box-lead p img{ width:100%; height:auto } #product-detail .box-lead p span{ font-size:13px; line-height:1.6; display:block; color:#aaa } #product-detail .box-detail{ display:block; margin-bottom:0; } #product-detail .box-detail section{ display:block; width:auto; padding:40px 5%; background:#111 } #product-detail .box-detail section+section{ background:none } #product-detail .box-detail figure{ text-align:center } #product-detail .box-detail figure img{ width:100%; height:auto; } #product-detail .box-detail section h3{ margin-bottom:20px; } #product-detail .box-detail section h3 img{ width:100%; height:auto; } #product-detail .box-detail section p{ font-size:12px; line-height:2; margin-bottom:10px; color:#999 } }