﻿@charset "utf-8";

#wrapper { position: relative; z-index: 1000; background: #fff;}

/*----------------------------------------------*/
#sp_nav {}
.gnav_bar2 { position: relative; width:100%; height:68px; border-bottom: 1px solid #e5e5e5;}
.gnav-sp .gnav_bar2 { height:59px; border-bottom: none;}

/*----------------------------------------------*/
#btn-menu { display:none;}
#btn-menu { position:absolute; top:7px; right:16px; width:55px; height:55px; z-index:100003; padding:0;}
#btn-menu a { position: relative; display: block; width:55px; height:55px; padding:0 19px;}
@media only screen and (max-width: 1180px) { 
#btn-menu { display:block;}
.lang #btn-menu { display:none;}
}
@media only screen and (max-width: 768px) { 
.lang #btn-menu { display:block;}
}
@media only screen and (min-width: 769px) { 
#btn-menu {top: 65px;right: 2%;}
}

/* 展開後：×ボタン */
.nav-open a { margin-left:20px; background:url(spnavi_back@2x.png) no-repeat center; background-size:39px;}
.nav-open .menu-trigger,
.nav-open .menu-trigger span { display: block; box-sizing: border-box;}
.nav-open .menu-trigger { position: relative; width: 18px; height: 18px;}
.nav-open .menu-trigger span { position: absolute; width: 18px; height: 2px; background-color: #fff;}
.nav-open .menu-trigger span:nth-of-type(1) { top: 25px; right:13px; transform: rotate(-45deg);}
.nav-open .menu-trigger span:nth-of-type(2) { top: 25px; right:13px; transform: rotate(45deg);}
.nav-open .menu-trigger span:nth-of-type(3) { display:none;}

/* 展開前：三本線 */
.nav-close a { background:url(spnavi@2x.png) no-repeat center; background-size:55px;}
@media only screen and (max-width: 415px) { 
.nav-close a { background-size:45px;}
}
.nav-close .menu-trigger,
.nav-close .menu-trigger span { display: block; box-sizing: border-box;}
.nav-close .menu-trigger { position: relative; width: 24px; height: 55px;}
.nav-close .menu-trigger span { position: absolute; width: 18px; height: 2px; background-color: #fff;}
.nav-close .menu-trigger span:nth-of-type(1) { top: 16px;}
.nav-close .menu-trigger span:nth-of-type(2) { top: 22px;}
.nav-close .menu-trigger span:nth-of-type(3) { top: 28px; width: 12px; display:block;}

/*----------------------------------------------*/
#nav-off-canvas { display:none;}
@media only screen and (max-width: 768px) {
#nav-off-canvas { display:block;}
}
#nav-off-canvas img {margin: 0; padding: 0;}
#nav-off-canvas { position:fixed; top:0px;　width:100%; height:100%; z-index:100; display: none;}
#nav-off-canvas .bg { position: fixed; width:100%; height:100%; background-color: #000; opacity: 0.28; z-index: 100;}
#nav_bg { position: absolute; width:100%; height:100%; background-color: #000; opacity: 0.28; z-index: 100000; display: none;}
#nav-off-canvas .nav-inner { position:fixed; top:0; right:0; width:90%; height:100%; background: #f5f5f5; overflow: hidden; display: none; z-index:100;}
#nav-off-canvas .js-nav-block { position:absolute; top:0; width:100%; height:100%; background: #f5f5f5; overflow: auto; overflow-x: hidden;}
#nav-off-canvas .js-nav-block ul li { display: block; width:100%;}
#nav-off-canvas .js-nav-block ul li a { display: block; font-size: 14px; letter-spacing: 0px; line-height: 49px; padding:0 0 0 30px; color:#000; background-color: #f5f5f5; border-bottom:1px solid #ddd;}
#nav-off-canvas .js-nav-block ul li:last-child a { border-bottom: none;}
#nav-off-canvas .js-nav-block ul li a:hover,
#nav-off-canvas .js-nav-block ul li a:focus { text-decoration:none; background:#eee;}
#nav-off-canvas .js-nav-block ul li a.label { background-image: url(arrow.png); background-repeat: no-repeat; background-position: 94% center; background-size: 4px auto;}
#nav-off-canvas .js-nav-block ul li a.party { color:#fff; background: #00A9C9 url(spnavi_party@2x.png) no-repeat 95% bottom; background-size:56px; border-bottom: none;}
#nav-off-canvas .js-nav-block ul li a.party:hover,
#nav-off-canvas .js-nav-block ul li a.party:focus { background: #666 url(spnavi_party@2x.png) no-repeat 95% bottom; background-size:56px;}
#nav-off-canvas .js-nav-block ul li a.language { background-color: #e5e5e5; background-image: url(arrow.png); background-repeat: no-repeat; background-position: 94% center; background-size: 4px auto;}
#nav-off-canvas .js-nav-block ul li a.backbtn { padding:0; text-align: center; font-size:18px; background-color: #fff; background-image: url(arrow_back.png); background-repeat: no-repeat; background-position: 6% center; background-size: 4px auto;}
#nav-off-canvas .js-nav-block ul li a.language_sub { background-color: #e5e5e5;}
@media only screen and (max-width: 1180px) {
#nav-off-canvas .js-nav-block ul li.mn01{ display:none;}
#nav-off-canvas .js-nav-block ul li.mn02{ display:none;}
#nav-off-canvas .js-nav-block ul li.mn06{ display:none;}
#nav-off-canvas .js-nav-block ul li.mn07{ display:none;}
#nav-off-canvas .js-nav-block ul li.mn08{ display:none;}
#nav-off-canvas .js-nav-block ul li.mn10{ display:none;}
}
@media only screen and (max-width: 980px) {
#nav-off-canvas .js-nav-block ul li.mn08{ display:block;}
}
@media only screen and (max-width: 768px) {
#nav-off-canvas .js-nav-block ul li.mn01{ display:block;}
#nav-off-canvas .js-nav-block ul li.mn02{ display:block;}
#nav-off-canvas .js-nav-block ul li.mn06{ display:block;}
#nav-off-canvas .js-nav-block ul li.mn07{ display:block;}
}