@charset "UTF-8";
.contents {
    opacity: 0;
}
.contents.contents__show {
    opacity: 1;
    transition: opacity .6s ease;
}
@media screen and (max-width: 750px) {
  .contents.contents__show #top #mainvisual {
    opacity: 1;
    transition: opacity ease 1s;
    transition-delay: .5s; } }



/*========================================================================================
common
========================================================================================*/
#Container {
    /*margin: 0 auto 0px;*/
}
.pc {
	display: block;
}
.sp {
	display: none;
}
.contents h1, .contents h2, .contents h3, .contents h4, .contents div figcaption, .contents p, .contents a, .contents span, .contents li, .contents div, strong, em{
font-weight: 600;
}
.link a:hover img, .link a:focus img, a:hover img, a:focus img {
    opacity: 1;
    filter: alpha(opacity=100);
}
.link a:hover img, a:hover img {
    opacity: .8;
transition: all 0.22s cubic-bezier(0.43, 0.15, 0.18, 0.54);
}
.hover:hover{
opacity: .8;
transition: all 0.22s cubic-bezier(0.43, 0.15, 0.18, 0.54);
}
h1, h2, h3, h4 {
font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
margin-bottom: 0;
}
.contents{
background: url("../image/bg01.jpg") 0 0 repeat-y;
font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
letter-spacing: .005em;
margin: 0 auto 80px!important;
}
section{
margin: 0 65px;
}
.flex {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
justify-content: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.pagetop{
border-bottom: 2px solid #41210f;
}
.pagetop p{
text-align: right;
margin: 0 65px 0 0;
}
.pagetop a{
background: url("../image/pagetop.png") 0 0 no-repeat;
background-size: 100% auto;
display: inline-block;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
width: 104px;
height: 28px;
}
#nav_top ul{
background: url("../image/nav_bg.png") 0 0 no-repeat;
font-size: 0;
margin: 0 0 55px;
padding: 0 65px;
height: 70px;
}
#nav_top li{
height: 70px;
}
#nav_top li a{
display: block;
height: 70px;
}
#nav_top li:first-child a{
background: url("../image/nav1.png") 0 0 no-repeat;
width: 234px;
}
#nav_top li:first-child a.cur {
background: url("../image/nav1_on.png") 0 0 no-repeat;
width: 234px;
pointer-events: none;
}
#nav_top li:nth-child(2) a{
background: url("../image/nav2.png") 0 0 no-repeat;
width: 324px;
}
#nav_top li:nth-child(2) a.cur{
background: url("../image/nav2_on.png") 0 0 no-repeat;
width: 324px;
pointer-events: none;
}
#nav_top li:nth-child(3) a{
background: url("../image/nav3.png") 0 0 no-repeat;
width: 292px;
}
#nav_top li:nth-child(3) a.cur{
background: url("../image/nav3_on.png") 0 0 no-repeat;
width: 292px;
pointer-events: none;
}
#nav_top li:hover a.cur{
opacity: 1!important;
}
#nav_btm{
margin: 80px 0;
}
#nav_btm li:first-child{
margin-right: 30px;
}
#powerup #nav_btm{
margin: 42px 0 80px;
}
@media screen and (max-width: 750px) {
#Container {
    margin: 15px 0 0;
}
.pc {
	display: none;
}
.sp {
	display: block;
}
#contents{
width: 100%;
margin: 0 auto 0!important;
}
.link a:hover img, .link a:focus img, a:hover img, a:focus img {
    opacity: 1;
    filter: alpha(opacity=100);
}
.hover:hover{
opacity: 1;
}
section{
margin: 0 4%;
}
.pagetop{
border-bottom: none;
}
.pagetop p{
text-align: center;
margin: 0;
padding: 0 0 13.33vw;
}
.pagetop a{
background: url("../image/pagetop_sp.png") 0 0 no-repeat;
background-size: 100% auto;
display: inline-block;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
width: 24vw;
height: 3.066vw;
}
#nav_top{
display: none;
}
#nav_btm,
#powerup #nav_btm{
margin: 10% 0;
margin: 10.66vw 0 13.33vw;
}
#nav_btm ul{
display: inherit;
justify-content: inherit;
-ms-flex-align: inherit;
-webkit-align-items: inherit;
align-items: inherit;
margin: 0 6% 0;
}
#nav_btm li:first-child{
margin-right: 0;
}
#nav_btm li{
margin-bottom: 5.33vw;
}
#nav_btm li:last-child{
margin-bottom: 0;
}
}
/*========================================================================================
top
========================================================================================*/
#top #points .lead {
color: #312e2c;
font-size: 18px;
line-height: 1.6;
text-align: center;
margin: 0 0 55px;
}
#top #points .lead em {
color: #e60012;
font-size: 26px;
font-style: normal;
padding: 0 15px;
display: inline-block;
position: relative;
}
#top #points .lead em:before {
background: url("../../image/echo1.png") 0 0 no-repeat;
background-size: 100% auto;
margin: auto;
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 12px;
height: 27px;
}
#top #points .lead em:after {
background: url("../../image/echo2.png") 0 0 no-repeat;
background-size: 100% auto;
margin: auto;
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 12px;
height: 27px;
}
#top #points .lead .ls{
letter-spacing: -.02em;
}
#top #points .lead .ls2{
letter-spacing: -.04em;
}
@media screen and (max-width: 750px) {
#top #points{
margin: 0 4%;
}
#top #points .lead {
font-size: 3.73vw;
line-height: 2;
margin: 5% 0 5%;
}
#top #points .lead em {
font-size: 5.3vw;
padding: 0 12px;
}
#top #points .lead em:before,
#top #points .lead em:after{
width: 9px;
height: 21px;
}
}
#top #points .points{
background: url("../../image/points_bg.jpg") 0 0 no-repeat;
margin: 0 0 70px;
padding: 30px 0 0;
box-sizing: border-box;
width: 850px;
height: 756px;
}
#top #points .points .cnt{
background: url("../../image/points.png") 0 0 no-repeat;
margin: 0 auto 29px;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
width: 790px;
height: 486px;
}
#top #points .points .bnr{
background: url("../../image/points_bnr.png") 0 0 no-repeat;
margin: 0 auto;
width: 790px;
height: 181px;
}
#top #points .points .bnr p{
color: #41210f;
font-size: 16px;
line-height: 1.6;
letter-spacing: .06em;
padding: 28px 30px;
}
#top #points .points .bnr p em{
color: #e60012;
font-size: 20px;
font-style: normal;
}
#top #points .points .bnr .btn_iv{
padding: 0 0 0 30px;
}
@media screen and (max-width: 750px) {
#top #points .points{
background: url("../../image/points_bg_sp.jpg") 0 0 no-repeat;
background-size:  cover;
margin: 0 0 15%;
padding: 2.66vw 0 2.66vw;
box-sizing: border-box;
width: 100%;
height: auto;
}
#top #points .points .cnt{
background: url("../../image/points_sp.png") 0 0 no-repeat;
background-size: 100% auto;
margin: 0 auto 2.66vw;
padding: 193% 0 0;
width: 87vw;
height: 0;
}
#top #points .points .bnr{
background: url("../../image/points_bnr_sp.png") 0 0 no-repeat;
background-size: 100% auto;
margin: 0 auto;
width: 87vw;
height: 94vw;
}
#top #points .points .bnr p{
color: #41210f;
font-size: 3.73vw;
line-height: 1.6;
letter-spacing: normal;
padding: 60% 5% 5%;
}
#top #points .points .bnr p em{
color: #e60012;
font-size: 4.8vw;
font-style: normal;
}
#top #points .points .bnr .btn_iv{
margin:  0 auto;
padding: 0 0;
display: block;
width: 92%;
}
#top #points .points .bnr .btn_iv img{
width: 100%;
}
}



#top #nutrition .ttl{
text-align: center;
margin:  0 0 40px;
}
#top #nutrition .sttl{
text-align: center;
margin:  0 0 15px;
}
#top #nutrition .lead{
color: #41210f;
font-size: 18px;
line-height: 2.3;
text-align: center;
margin: 0 0 40px;
}
#top #nutrition .lead em{
color: #e60012;
background: linear-gradient(transparent 0%, #face9d 0%);
font-size: 18px;
font-style: normal;
padding: 5px;
}
#top #nutrition .caption{
color: #41210f;
font-size: 16px;
line-height: 1;
text-align: center;
margin: 0 0 25px;
}
#top #nutrition .caption small{
font-size: 12px;
}
#top #nutrition .caption small sup{
font-size: 9px;
vertical-align: text-top;
margin-right: 2px;
}
#top #nutrition .graph{
text-align: center;
}
@media screen and (max-width: 750px) {
#top #nutrition .ttl{
text-align: center;
margin:  0 0 4.8vw;
}
#top #nutrition .sttl{
text-align: center;
margin: 0 8% 2%;
}
#top #nutrition .lead{
font-size: 3.73vw;
line-height: 2;
text-align: center;
margin: 0 0 6.66vw;
}
#top #nutrition .lead em{
color: #e60012;
background: linear-gradient(transparent 0%, #face9d 0%);
font-size: 3.77vw;
font-style: normal;
padding: 4px;
}
#top #nutrition .caption{
color: #41210f;
font-size: 2.66vw;
line-height: 1.8;
text-align: center;
margin: 0 0 4%;
}
#top #nutrition .caption small{
font-size: 2.6vw;
}
#top #nutrition .caption small sup{
font-size: 1.8vw;
vertical-align: text-top;
margin-right: 2px;
}
#top #nutrition .graph img{
width:96%;
margin: 0 0 5.33vw;
}
}



#top #nutrition .table .ttl{
color: #41210f;
font-size: 14px;
line-height: 1;
letter-spacing: .05em;
text-align: left;
margin: 0 0 16px;
}
#top #nutrition .table .att{
margin: 0 0 50px;
}
#top #nutrition .table .att li{
color: #41210f;
font-size: 10px;
letter-spacing: .1em;
margin: 0 0 1em;
/*font-feature-settings: "palt";*/
}
#top #nutrition .table table.pc{
margin: 0 0 22px;
border: 1px solid #a38659;
display: table;
}
#top #nutrition .table table th{
background: #f9ebd6;
color: #41210f;
font-size: 14px;
line-height: 1;
text-align: center;
padding: 13px 15px 12px;
width: 16.6%;
}
#top #nutrition .table table td{
background: #ffffff;
color: #41210f;
font-size: 14px;
line-height: 1;
text-align: center;
width: 16.6%;
}
#top #nutrition .table table sub{
font-size: 70%;
vertical-align: baseline;
}
#top #nutrition .bnr_area{
background: #fff;
display: block;
}
@media screen and (max-width: 750px) {
#top #nutrition .table{
margin: 0 2%;
}
#top #nutrition .table .ttl{
color: #41210f;
font-size: 3vw!important;
line-height: 1;
text-align: left;
margin: 0 0 3%;
}
#top #nutrition .table .att{
margin: 0 0 8%;
}
#top #nutrition .table .att li{
color: #41210f;
font-size: 2.2vw;
line-height: 1.6;
margin: 0 0 1em;
font-feature-settings: "palt";
}
#top #nutrition .table .att li .nowrap{
white-space: nowrap;
}
#top #nutrition .table table.pc{
display: none;
}
#top #nutrition .table table.sp{
margin: 0 0 3%;
border: 1px solid #a38659;
display: table;
width: 100%;
}
#top #nutrition .table table th{
background: #f9ebd6;
color: #41210f;
font-size: 2.6vw;
padding: 1.69vw 5px 1.54vw;
width: 16.6%;
}
#top #nutrition .table table td{
background: #ffffff;
color: #41210f;
font-size: 2.6vw;
padding: 2.4vw 5px;
text-align: center;
width: 16.6%;
}
#top #nutrition .table table sub{
font-size: 2vw;
vertical-align: baseline;
}
#top #nutrition .bnr_area{
margin: 0 2%;
display: block;
}
#top #nutrition .bnr_area img{
width: 100%;
}
}







/*========================================================================================
powerup
========================================================================================*/
#powerup  #about .ttl{
text-align: center;
margin:  0 0 35px;
}
#powerup .lead{
color: #41210f;
font-size: 18px;
line-height: 2.3;
text-align: center;
margin: 0 0 35px;
}
#powerup .lead em{
color: #e60012;
background: linear-gradient(transparent 0%, #face9d 0%);
font-size: 18px;
font-style: normal;
padding: 5px;
}
@media screen and (max-width: 750px) {
#powerup  #about .ttl{
text-align: center;
margin:  8% 4% 5%;
}
#powerup .lead{
color: #41210f;
font-size: 3.73vw;
line-height: 2.1;
text-align: center;
margin: 0 0 5%;
}
#powerup .lead em{
color: #e60012;
background: linear-gradient(transparent 0%, #face9d 0%);
font-size: 3.73vw;
font-style: normal;
padding: 5px;
}
}
#powerup .sec_type1{
padding: 58px 0 0;
}
#powerup .sec_type1 .ttl{
text-align: center;
margin: 0 0 35px;
}
#powerup .sec_type1 .list_type1{
font-size: 0;
}
#powerup .sec_type1 .list_type1 li{
display: inline-block;
text-align: center;
margin-bottom: 38px;
position: relative;
vertical-align: top;
width: 410px;
}
#powerup .sec_type1 .list_type1 li:nth-child(odd){
margin-right: 29px;
}
#powerup .sec_type1 .list_type1 li img{
width: 100%;
}
#powerup .sec_type1 .list_type1 li .link_text{
color: #607d33;
font-size: 16px;
line-height: 1;
margin: auto;
padding: 0 14px 0 9px;
display: inline-block;
position: absolute;
bottom: 21px;
left: 0;
right: 0;
width: 8em;
}
#powerup #eiyoup .list_type1 li .link_text{
color: #f39c47;
}
#powerup .sec_type1 .list_type1 li .link_text:before{
background-image: url("../../powerup/image/icon_arrow.png");
background-position: 0 center;
background-repeat: no-repeat;
background-size: 100% auto;
margin: auto 0 auto;
content: "";
display: inline-block;
position: absolute;
top: 0;
left: 0;
width: 9px;
height: 1em;
}
#powerup #eiyoup .list_type1 li .link_text:before{
background-image: url("../../powerup/image/icon_arrow2.png");
}
#powerup .sec_type1 .list_type1 li .link_text:after{
background-image: url("../../powerup/image/icon_blank.png");
background-position: 0 center;
background-repeat: no-repeat;
background-size: 100% auto;
margin: auto 0 auto;
content: "";
display: inline-block;
position: absolute;
top: 0;
right: 0;
width: 15px;
height: 1em;
}
#powerup #eiyoup .list_type1 li .link_text:after{
background-image: url("../../powerup/image/icon_blank2.png");
}
#powerup .sec_type1 .list_type1 li a:hover .link_text{
opacity: .8!important;
}
#powerup #eiyoup .list_type1 li{
/*margin-bottom: 0;*/
}
@media screen and (max-width: 750px) {
#powerup .sec_type1{
margin: 0 6%;
padding: 13.33vw 0 0;
}
#powerup .sec_type1 .ttl{
text-align: center;
margin: 0 0 6.66vw;
}
#powerup .sec_type1 .list_type1{
font-size: 0;
}
#powerup .sec_type1 .list_type1 li{
display: block;
margin-bottom: 7.733vw;
width: 100%;
}
#powerup .sec_type1 .list_type1 li:nth-child(odd){
margin-right: 0;
}
#powerup .sec_type1 .list_type1 li:last-child{
margin-bottom: 0;
}
#powerup .sec_type1 .list_type1 li img{
width: 100%;
}
#powerup .sec_type1 .list_type1 li .link_text{
font-size: 3.46vw;
padding: 0 3.07vw 0 1.87vw;
bottom: 4.4vw;
width: 9em;
}
#powerup .sec_type1 .list_type1 li .link_text:before{
width: 1.87vw;
height: 1em;
    bottom: 0.1em;
    left: -1vw;
}
#powerup .sec_type1 .list_type1 li .link_text:after{
right: -0.54vw;
width: 3.07vw;
height: 1em;
    bottom: 0.1em;
}
#powerup .sec_type1 .list_type1 li a:hover .link_text{
opacity: 1!important;
}
#powerup #eiyoup{
margin: 0 6% 16vw;
}
}





/*========================================================================================
lineup
========================================================================================*/
#lineup  #about .ttl{
text-align: center;
margin:  0 0 30px;
}
#lineup #about .lead {
color: #41210f;
font-size: 18px;
line-height: 2.3;
text-align: center;
margin: 0 0 30px;
}
#lineup #nav_inpage ul{
text-align: center;
margin: 0 0 55px;
}
#lineup #nav_inpage li {
display: inline-block;

}
#lineup #nav_inpage li a{
border-left: 1px solid #bfaf9d;
padding: 3px 0;
display: block;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
height: 16px;
}
#lineup #nav_inpage li:first-child a{
border-left: none;
background: url("../../lineup/image/nav1.png") center center no-repeat;
width: 152px;
}
#lineup #nav_inpage li:nth-child(2) a{
background: url("../../lineup/image/nav2.png") center center no-repeat;
width: 138px;
}
#lineup #nav_inpage li:nth-child(3) a{
background: url("../../lineup/image/nav3.png") center center no-repeat;
width: 120px;
}
#lineup #nav_inpage li:nth-child(4) a{
background: url("../../lineup/image/nav4.png") center center no-repeat;
width: 138px;
}
#lineup #nav_inpage li:nth-child(5) a{
background: url("../../lineup/image/nav5.png") center center no-repeat;
width: 187px;
}
#lineup .prd_section{
background: url("../../lineup/image/line.png") center bottom no-repeat;
}
#lineup .hdr{
margin: 55px 0 10px;
}
#lineup .prd_list{
font-size: 0;
text-align: center;
}
#lineup .prd_list li{
margin: 0 41px 40px 0;
text-align: center;
display: inline-block;
vertical-align: top;
width: 181px;
}
#lineup .prd_list li:nth-child(4n),
#lineup .prd_list li:last-child{
margin-right: 0;
}
#lineup .prd_list li p{
color: #41210f;
font-size: 15px;
line-height: 1.4;
}
#lineup .prd_list li p.name{
border-bottom: 1px dashed #41210f;
font-size: 20px;
margin: 0 0 20px;
padding: 10px 0;
}
#lineup .prd_list li p.name span.reg{
line-height: 1;
font-size: 18px;
position: relative;
bottom: -.3em;
}
#lineup .prd_list li .prd_img{
margin: 0 auto 18px;
display: table-cell;
text-align: center;
vertical-align: middle;
width: 181px;
height: 181px;
}
#lineup #section03 li .prd_img{
height: 111px;
}
#lineup .prd_list li p.caption{
margin: 18px 0 16px;
}
#lineup .prd_list li p.caption sub{
font-size: 12px;
vertical-align: baseline;
}
#lineup .prd_list li p.caption small{
font-size: 12px;
}
#lineup .prd_section .prd_list .label{
color: #fff;
font-size: 12px;
line-height: 1;
text-align: center;
margin: 0 0 5px;
padding: 5px;
}
#lineup #section01 .prd_list .label{
background: #ec6d5e;
}
#lineup #section02 .prd_list .label{
background: #f39c47;
}
#lineup #section03 .prd_list .label{
background: #bb2530;
}
#lineup #section04 .prd_list .label{
background: #607d33;
}
#lineup #section05 .prd_list .label{
background: #ad7627;
}
@media screen and (max-width: 750px) {
#lineup #about .ttl{
text-align: center;
margin:  8% 4% 5%;
}
#lineup #about .lead{
color: #41210f;
font-size: 3.73vw;
line-height: 2;
text-align: center;
margin: 0 0 7%;
}
#lineup #nav_inpage ul{
text-align: center;
margin: 0 4% 0 4%;
}
#lineup #nav_inpage li {
display: inline-block;
margin: 0 0 6.66vw;
width: 33%;
box-sizing: border-box;
}
#lineup #nav_inpage li:first-child {
width: 34%;
}
#lineup #nav_inpage li:nth-child(3){
padding-left: 5vw;
}
#lineup #nav_inpage li:nth-child(4){
padding-left: 9vw;
}
#lineup #nav_inpage li:last-child{
padding-left: 6vw;
}
#lineup #nav_inpage li:nth-child(4) ,
#lineup #nav_inpage li:last-child{
margin-bottom: 0;
}
#lineup #nav_inpage li:last-child{
width: 42%;
}
#lineup #nav_inpage li a{
border-left: none;
padding: 0 0;
display: block;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
height: 8.93vw;
width: 100%!important;
}
#lineup #nav_inpage li:first-child a{
border-left: none;
background: url("../../lineup/image/nav1_sp.png") center center no-repeat;
background-size: auto 100% ;
width: 100%;
}
#lineup #nav_inpage li:nth-child(2) a{
background: url("../../lineup/image/nav2_sp.png") center center no-repeat;
background-size: auto 100% ;
width: 138px;
}
#lineup #nav_inpage li:nth-child(3) a{
background: url("../../lineup/image/nav3_sp.png") center center no-repeat;
background-size: auto 100% ;
width: 120px;
}
#lineup #nav_inpage li:nth-child(4) a{
background: url("../../lineup/image/nav4_sp.png") center center no-repeat;
background-size: auto 100% ;
width: 138px;
}
#lineup #nav_inpage li:nth-child(5) a{
background: url("../../lineup/image/nav5_sp.png") center center no-repeat;
background-size: auto 100% ;
width: 187px;
}
#lineup .prd_section{
background: url("../../lineup/image/line.png") center bottom no-repeat;
margin: 0 6.66vw;
}
#lineup .hdr{
margin: 10% 0 4%;
}
#lineup .hdr img{
width: 70.5%;
}
#lineup .prd_list{
font-size: 0;
text-align: center;
margin: 0 0 5%;
padding: 0 0 5%;
}
#lineup .prd_list li{
margin: 0 9% 5.33vw 0;
text-align: center;
display: inline-block;
width: 45%;
}
#lineup .prd_list li:nth-child(2n),
#lineup .prd_list li:last-child{
margin-right: 0;
}
#lineup .prd_list li p{
color: #41210f;
font-size: 3.46vw;
line-height: 1.4;
}
#lineup .prd_list li p.name{
border-bottom: 1px dashed #41210f;
font-size: 4.26vw;
line-height: 1.3;
margin: 0 0 10%;
padding: 6px 0;
}
#lineup .prd_list li p.name span.reg {
font-size: 3.5vw;
}
#lineup .prd_list li .prd_img{
margin: 0 0 9%;
height: 38.93vw;
width: 40vw;
max-width: inherit;
display: table-cell;
text-align: center;
vertical-align: middle;
}
#lineup #section03 li .prd_img{
height: 24vw;
}
#lineup .prd_list li .prd_img img{
height: 100%;
width: auto;
}
#lineup .prd_list li .prd_img.width img{
width: 100%;
height: auto;
}
#lineup .prd_list li p.caption{
margin: 9% 0 8%;
}
#lineup .prd_list li p.caption sub{
font-size: 2vw;
vertical-align: baseline;
}
#lineup .prd_list li p.caption small{
font-size: 2vw;
}
#lineup .prd_section .prd_list .label{
font-size: 2.66vw;
text-align: center;
margin: 0 0 1.066vw;
padding: 1.2vw 1vw 1.2vw;
}
}




/*========================================================================================
menu
========================================================================================*/
#menubtn ,
.nav__sp{
display: none;
}
@media screen and (max-width: 750px) {
html.stop {
overflow: hidden;
-ms-touch-action: none;
touch-action: none;
}
#menubtn {
display: block;
background: url("../image/menu_btn_bg.jpg") 0 0 no-repeat;
background-size: cover;
width: 13.7vw;
height: 13.7vw;
position: fixed;
top: 0;
right: 0;
z-index: 9000;
opacity: 0;
transition: all 0.1s cubic-bezier(0.38, 0.84, 0.76, 1.01);
}
#menubtn p {
opacity: 0;
position: relative;
background: #fff;
height: 0.8vw;
width: 50%;
margin: 0 auto;
top: calc(50% - 2px);
}
#menubtn p:before, #menubtn p:after {
content: "";
display: block;
background: #fff;
height: 0.8vw;
width: 100%;
position: absolute;
}
#menubtn p:before {
top: -2.1vw;
}
#menubtn p:after {
top: 2.1vw;
}
#menubtn.mShow {
opacity: 1;
}
#menubtn.mShow p {
opacity: 1;
}

.nav__sp {
display: none;
position: fixed;
background: rgba(0,0,0,.5);

width: 100%;
height: 100vh;
top: 0;
left: 0;
z-index: 15000;
overflow: auto;
}
.nav__sp .nav_inner{
background: url("../image/menu_bg.jpg") 0 0 no-repeat;
background-size: cover;
}
.nav__sp #closeBtn_top {
display: block;
position: absolute;
top: 4vw;
right: 4vw;
width: 10.7vw;
height: 10.7vw;
padding: 2.7vw;
z-index: 10001;
box-sizing: border-box;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-tap-highlight-color: transparent;
}
.nav__sp #closeBtn_top:before, .nav__sp #closeBtn_top:after {
content: "";
display: block;
background: #f00000;
width: calc(100% - 5.4vw);
height: 0.8vw;
position: absolute;
top: calc(50% - 2px);
}
.nav__sp #closeBtn_top:after {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.nav__sp ul {
height: auto;
padding: 16vw 6.66vw 10.4vw;
}
.nav__sp ul li {
width: 100%;
text-align: left;
}
.nav__sp ul li.cur {
opacity: .6;
}
.nav__sp ul li a {
display: block;
position: relative;
color: #401e13;
font-size: calc(100vw / 24) !important;
padding: 7vw 0 0;
line-height: 1.4;
-webkit-tap-highlight-color: transparent;
}
.nav__sp ul li a img {
width: 100%
}
.nav__sp #closeBtn_btm{
padding: 0 8vw 10.66vw;
}
}