@charset "utf-8";




.fixed {
  position: fixed !important;
  top: 75px !important;
}


#scrHeader{ width:100%; position:fixed; z-index:51; height:40px; 
background:#111; top:-75px; box-sizing:border-box;
    background: -moz-linear-gradient(top, #000000, rgba(255,255,255,0));
background: -webkit-linear-gradient(top, #000000, rgba(255,255,255,0));
background: linear-gradient(to bottom, #000000, rgba(255,255,255,0));
}
#scrHeader > .inner{ width:1000px; margin:0 auto; position:relative;}

#scrHeader nav{ width: 700px; position:absolute;  top:7px; left: 150px;}

#scrHeader nav ul{ width: 100%;}

#scrHeader nav ul{ text-align: center; margin-bottom: 30px;}
#scrHeader nav ul li{ display: inline-block; margin-right: 40px; font-size: 14px;}
#scrHeader nav ul li:last-child{margin-right: 0;}

#scrHeader nav ul li a{color: #fff;transition: all  0.2s ease;
font-family: futura-pt, sans-serif;
font-weight: 400;
font-style: normal;
    letter-spacing: 0.3em
}

#scrHeader nav ul a:hover{ color: #888;}

.scrLogo{ position: absolute; width: 95px; left:0;top: 5px;}
.scrCart{ position: absolute; width: 30px; right:0;top: 5px;}



@media(max-width:750px){

#scrHeader{ display: none;}
#scrHeader > .inner{ width:auto;}

}






/* ---------------------------------------------------------------------------------
pagetop　未使用 */

#pagetop{ position:absolute;}

#gotop {
  position: fixed;
  bottom: 0px;
  right: 20px;
  width: 137px;
  height: 77px;
  z-index: 5;
}

#btnscrollArea{ position:relative;}




/* ---------------------------------------------------------------------------------
footer */

footer{ background: #000;position: relative;z-index: 11;}
footer >.inner{ width: 1030px; margin: 0 auto;}
.ftBg{ background: url(../images/footerBG.jpg) repeat-x center top; height:177px; background-size: auto 100%;}

.ftbox01{ position: relative;}
.gotoTop{ width: 80px; display: block; position: absolute; top: -10px;; right: 0px;}

.ftbox01 nav{ text-align: center; padding: 30px;}
.ftbox01 nav li{ display: inline-block; margin-right: 30px; font-size: 16px;}
.ftbox01 nav li a{ color: #fff; }
.ftbox01 nav li a:hover{ color: #fff; opacity: 0.6; }

footer p.houjin{ text-align: center; color: #fff; margin-bottom: 30px; }
footer .copy p{ text-align: center; color: #fff; padding-bottom: 30px;}
footer p.houjin a{ color: #fff;  }







/* ---------------------------------------------------------------------------------
footer  */














@media(max-width:750px){

footer >.inner{ width: auto; margin: 0 auto;}
    
.ftbox01 nav{  display: none;}
.gotoTop{ width: 100px; display: block; position: absolute; top: 20px; right: 20px;
    }
footer p.houjin{ text-align: center; color: #fff; margin-bottom: 30px; padding-top: 70px;}
footer .copy p{ text-align: center; color: #fff; padding-bottom: 60px;}
    
}




















.ftBnrArea{background: #575646; padding: 42px 0;}

.ftBnrArea .fb1_Wide{
width: 840px; margin: 0 auto 16px auto;;
 display: grid;
grid-template-columns: repeat(1, 1fr);
column-gap: 20px;
row-gap: 20px;}

.ftBnrArea .fb3{
width: 840px; margin: 0 auto;
    display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 16px;
row-gap: 20px;}

.ftBnrArea ul li{ box-sizing: border-box; }






@media(max-width:750px){

.ftBnrArea{background: #575646; padding: 30px 0;}

.ftBnrArea .fb1_Wide{
width: auto; margin: 0 20px 20px 20px;;
 display: grid;
grid-template-columns: repeat(1, 1fr);
column-gap: 20px;
row-gap: 20px;}

.ftBnrArea .fb3{
width: auto; margin: 0 20px 0;
    display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 20px;
row-gap: 20px;}
}