html{
background:#000;
}
body{
min-width:960px;
font-size:62.5%;
color:#efefef;
}
.inner{
width:960px;
margin:0 auto;
position:relative;
}
a{ text-decoration:none
}
.wrapper{
padding-top:100px;
overflow:hidden;
}
.sp{
display:none
}
/* ------------------------------------------------------------ */
/* header
/* ------------------------------------------------------------ */
header{
min-width:960px;
background:#000;
width:100%;
position:absolute;
z-index:10000;
top:0;
left:0;
border-bottom:1px solid #cd0000;
height:100px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
}
header #btn-menu{
display:none
}
header .inner{
padding:30px 0 22px;
}
header .logo{
width:212px;
margin: 8px 10px 0 0;
float:left;
}
header .logo img{
width:100%;
height:auto
}
header nav{
position:relative;
float:left;
padding-top:32px;
line-height:1;
display:inline-block;
width:728px;
}
header nav .g-nav{
display:inline-block
}
header nav li{
float:left;
font-size:13px;
}
header nav li+li{
margin-left:25px;
}
header nav li a{
color:#666;
}
header nav li.current a,
body.product ul.g-nav li.product a,
body.history ul.g-nav li.history a,
body.original_equipment ul.g-nav li.original_equipment a{
color:#cd0000;
}
header nav li a:hover{
text-decoration:none;
color:#cd0000
}
header nav .sml{
position:absolute;
right:-10px;
top:26px;
}
header nav .btn-lang{
position:absolute;
right:60px;
top:28px;
line-height:1;
font-size:11px;
display:block;
padding:6px 10px;
background:#333;
color:#666;
border-radius:30px;
display:none;
}
header nav .btn-lang:hover{
text-decoration:none;
background:#cd0000;
color:#fff
}
header.fixed{
position:fixed;
height:auto
}
/* header.fixed .inner{
padding:10px 0;
}
header.fixed nav{
padding-top:14px;
}
header.fixed nav .sml{
top:6px;
}
header.fixed nav .btn-lang{
top:8px;
} */
header nav .line {
background:#f00; height:2px; display:block; position:absolute; width:50px; top:67px; left:0; display:none
}
/* header.fixed nav .line{
top:46px;
} */
/* header.fixed .logo{
width:100px;
margin: 0 30px 0 0;
float:left;
}
header.fixed .logo img{
width:100%;
height:auto
}
header.fixed nav{
float:left;
width:830px;
}
header.fixed nav .g-nav li{
padding-top:3px
}
header.fixed nav .g-nav li+li{
font-size:15px;
margin-left:20px
} */
#headerSearch{
position:absolute;
top:-12px;
right:0;
}
#headerSearch input[type=text] {
width: 195px;
padding: 4px;
background: #808080;
border-radius: 3px;
box-shadow: 1px 1px 3px #646363 inset;
border: none;
color: #fff;
margin-right: 5px;
}
#headerSearch input {
float: left;
}
#headerSearch input[type=image] {
margin-top: -2px;
}
#headerSearch input {
float: left;
}
.column, article, aside, footer{
clear:both;
position:relative;
text-align:center
}
#overlay{
background:rgba(0,0,0,.8);
-webkit-background:rgba(0,0,0,.8);
position:fixed;
width:100%;
height:100%;
top:0;
left:0;
z-index:50;
display:none
}
/* ------------------------------------------------------------ */
/* footer
/* ------------------------------------------------------------ */
footer{
padding:30px 0;
}
body#top footer{
border-top:1px solid #cd0000;
}
footer .sitemap{
margin-bottom:30px;
float:left;
}
footer .sitemap li{
float:left;
font-size:12px;
line-height:1
}
footer .sitemap li a{
color:#999;
display:inline-block;
padding:0 12px;
}
footer .sitemap li:before{
content:'/';
font-weight:bold;
color:#cd0000;
}
footer #crumb{
font-size:10px;
color:#666;
margin:-30px 0 40px;
}
footer #crumb li{
float:left;
margin-right:5px;
}
footer #crumb li a{
color:#666;
text-decoration:none
}
footer #crumb li+li:before{
content:'>';
color:#666;
font-size:10px;
margin-right:5px;
}
.sml li{
float:left;
line-height:1
}
.sml li+li{
margin-left:3px;
}
.sml li a{
display:block;
width:26px;
height:26px;
/* background:#999 */
background:url(/brand/tire/advan/common/img/btn_twitter.png) 50% 50% no-repeat;
}
.sml li+li a{
display:block;
background:url(/brand/tire/advan/common/img/btn_facebook.png) 50% 50% no-repeat;
}
.sml li a img{
display:none
}
.sml li a:hover{
background-color:#cd0000
}
footer .sml{
margin-bottom:50px;
}
footer small{
color:#333;
font-size:10px;
}
#crumbOut {
border-top:1px solid #cd0000;
padding:10px 0 0;
}
#crumbOut #crumb{
font-size:10px;
color:#666;
margin: 0 auto;
position: relative;
width: 960px;
}
#crumbOut #crumb li{
float:left;
margin-right:5px;
}
#crumbOut #crumb li a{
color:#666;
text-decoration:none
}
#crumbOut #crumb li+li:before{
content:'>';
color:#666;
font-size:10px;
margin-right:5px;
}
/* #btn-pagetop
/* ------------------------------------------------------------ */
#btn-pagetop{
display:block;
width:36px;
height:36px;
position: absolute;
left:50%;
top:auto;
bottom:30px;
margin-left:400px;
z-index:1000;
}
#btn-pagetop.fixed{
position:fixed;
left:50%;
top:auto;
bottom:30px;
margin-left:400px;
z-index:1000;
}
/* ------------------------------------------------------------ */
/* 下層共通
/* ------------------------------------------------------------ */
.lower .wrapper{
width:960px;
margin:0 auto;
background:none;
padding:160px 0 100px;
}
.lower .ttl-style{
display:inline-block;
height:45px;
position:relative;
color:#999;
font-size:30px;
margin-bottom:60px;
}
.lower .ttl-style:after{
content:'';
display:block;
height:6px;
width:60px;
position: absolute;
top:auto;
bottom:0;
left:0;
background:#cd0000;
}
/* Smart Phone */
@media only screen and (max-width: 640px){
body.product ul.g-nav li.product a,
body.original_equipment ul.g-nav li.original_equipment a{
color:#fff;
}
header nav .g-nav li:nth-of-type(2){
padding: 16px 3.125%;
}
.pc{
display:none !important
}
.sp{
display:inherit
}
body{
min-width:320px;
font-size:62.5%;
color:#efefef;
}
.inner{
width:100%;
margin:0 auto;
position:relative;
}
.wrapper{
padding-top:45px;
overflow: inherit;
}
.sp{
display:block
}
.pc{
display:none
}
.lower .wrapper{
width:auto;
margin:0 auto;
background:none;
padding:60px 0 45px;
}
.lower .wrapper .inner{
width:auto;
padding:0;
}
.lower .ttl-style{
display:inline-block;
position:relative;
color:#999;
font-size:22px;
line-height:1.8;
margin-bottom:30px;
}
.lower .ttl-style:after{
content:'';
display:block;
height:6px;
width:40px;
position: absolute;
top:auto;
bottom:0;
left:0;
background:#cd0000;
}
/* header
------------------------------------------------------------ */
header{
position:absolute;
z-index:10000;
padding:12px 0;
top:0;
left:0;
border-bottom:1px solid #cd0000;
box-sizing:border-box;
-webkit-box-sizing:border-box;
height:45px;
min-width:inherit;
}
header #btn-menu{
background: url(/brand/tire/advan/common/img/ico_menu.png) 0 0 no-repeat;
background-size: 44px auto;
-webkit-background-size: 44px auto;
width:44px;
height:44px;
position:absolute;
top:-12px;
right:0;
display:block
}
header #btn-menu.opend{
background-position: 0 100%;
background-color:#cd0000
}
header .inner{
padding:0
}
header .logo{
width:120px;
margin: 0 0 0 3.125%;
}
header .logo img{
width:100%;
height:auto
}
header nav{
background:#cd0000;
width:100%;
height:auto;
top:8px;
left:0;
padding:0;
display:none
}
header nav .g-nav{
display:block;
font-size:16px;
}
header nav .g-nav li{
display:block;
float:none;
}
header nav .g-nav li a{
display:block;
padding:16px 3.125%;
color:#fff;
background: url(/brand/tire/advan/common/img/ico_arrow2_sp.png) 94% 50% no-repeat;
background-size:8px 14px;
-webkit-background-size:8px 14px;
}
header nav .line{
display:none !important
}
header nav .g-nav li+li{
margin:0;
border-top:1px solid #9f1111
}
header nav .btn-lang{
position:relative;
float:right;
padding:10px 22px;
margin-top:5px;
top:0;
right:3.125%;
background:#600;
color:#fff;
}
header nav .btn-lang:hover{
background:#600;
}
header nav .sml{
position:relative;
float:left;
top:0;
right:0;
margin-left:3.125%
}
header nav .sml li a{
width:28px;
height:28px;
display:block;
padding:6px;
}
header nav .sml li a img{
display:block;
width:100%;
height:auto;
}
header nav .sml li+li{
margin-left:10px;
}
header nav .sub-item{
padding:10px 3.125%;
background:#920000;
}
/* fixed */
header.fixed{
/* position: absolute; */
}
header.fixed .inner{
padding:0;
}
#headerSearch{
display:none;
}
/* footer
------------------------------------------------------------ */
footer{
padding:10px 0 20px;
}
body#top footer{
border-top:1px solid #cd0000;
}
footer .sitemap{
margin-bottom:20px;
float:none;
border-bottom:1px solid #333;
}
footer .sitemap li{
float:left;
font-size:12px;
line-height:1;
width:50%;
text-align:left;
border-top:1px solid #333;
box-sizing:border-box;
}
footer .sitemap li:nth-child(2n+1){
border-right:1px solid #333;
}
footer .sitemap li a{
color:#999;
display:block;
padding:10px 12px;
}
footer .sitemap li:before{
display:none
}
/* top's footer ----------------------- */
#top footer{
padding-top:0;
}
#top footer .sitemap li:first-child,
#top footer .sitemap li:nth-child(2){
border-top:none
}
/* #crumb ----------------------------- */
#crumbOut {
border-top:1px solid #cd0000;
}
#crumbOut #crumb{
font-size:10px;
color:#666;
margin:0 3.125% 0;
width: auto;
}
#crumbOut #crumb li{
float:left;
margin-right:5px;
}
#crumbOut #crumb li a{
color:#666;
text-decoration:none
}
#crumbOut #crumb li+li:before{
content:'>';
color:#666;
font-size:10px;
margin-right:5px;
}
.sml li{
float:left;
line-height:1
}
.sml li+li{
margin-left:3px;
}
.sml li a{
display:block;
width:26px;
height:26px;
/* background:#999 */
}
.sml li{
float:left;
line-height:1
}
.sml li+li{
margin-left:3px;
}
.sml li a{
display:block;
width:26px;
height:26px;
/* background:#999 */
background:url(/brand/tire/advan/common/img/btn_twitter.png) 50% 50% no-repeat;
}
.sml li a:hover{
background:#cd0000
}
footer .sml{
margin-bottom:50px;
}
footer small{
color:#333;
font-size:10px;
clear:both;
}
#btn-pagetop{
display:block;
width:36px;
height:36px;
position: absolute;
right:3.215%;
top:auto;
bottom:30px;
z-index:1000;
margin:0;
left:auto;
}
#btn-pagetop.fixed{
position:fixed;
left:50%;
top:auto;
bottom:30px;
margin-left:400px;
z-index:1000;
}
}