@charset "utf-8";

/******************************
 GlobalNavArea 
******************************/
.gnav{
    position: relative;
    z-index: 10000;
    width: 100%;
	box-sizing:border-box;
	border-top:solid 1px #1E1E1E;
	border-bottom:solid 1px #1E1E1E;
	background-color:#141414;
}
.gnav ul.lv1{
    z-index:200;
    display: flex;
    flex-flow: row wrap;
    align-content: center;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 1200px;
	margin:0 auto;
	text-align:center;
	background:url(../img/navLine.jpg) no-repeat right center;
}
.gnav ul.lv1 > li{
    position: relative;
    width: 100%;
    max-width: 127px;
    height: 40px;
    display: table;
	text-align:center;
	font-size:77%;
	font-weight:bold;
	background:url(../img/navLine.jpg) no-repeat left center;
}
.gnav ul.lv1 > li.home {
	width:50px;
}
.gnav ul.lv1 li a,
.gnav ul.lv1 li span{
	display:table-cell;
    vertical-align: middle;
    width: 100%;
    height: 40px;
    line-height: 1.2;
}

/***** Link *******/
.gnav a:link,.gnav a:visited 		{color: #BFBFBF;text-shadow:-1px -1px 0px #000000;}
.gnav a:hover,.gnav a:active		{color: #000; background-color:#9D1414;text-shadow:none;}
.gnav a.active:link					{text-decoration: none; background-color:#EFEFEF;}
.gnav li.home a:link,.gnav li.home a:visited 	{background:url(../img/ic_home.svg) no-repeat center center;background-size: 16px 15px;}
.gnav li.home a:hover,.gnav li.home a:active	{background:url(../img/ic_home_ov.svg) no-repeat center center;background-size: 16px 15px;}

.gnav ul.lv1 ul.lv2 {
    display: none;
    width: 100%;
    max-width: 127px;
    position: absolute;
    top: 40px;
    left: 0;
    background-color:#141414;
}
.gnav ul.lv1 ul.lv2 li{
    border-top:solid 1px #323232;
    border-top:solid 1px #000;
    position: relative;
    width: 100%;
    max-width: 127px;
    height: 40px;
    display: table;
	text-align:center;
	font-weight:bold;
	background:url(../img/navLine.jpg) no-repeat left center;
}


/******************************
 G Nav
******************************/
#g_navoverlay{
    background-color:#000;
    opacity:0;
    position:fixed;
    top:0;
    left:0;
	right:0;
	bottom:0;
    width:100%;
    display:none;
    z-index:10;
}
#g_navoverlay{
height:100%;　 /* IE対策のため指定*/
min-height:100%; /* 最小値100%指定*/
}
body > #g_navoverlay{
height:auto;　/* height:100%を解除 */
}
.gnav li.home a {
    text-indent: -9999px;
}






/* ---SP--- */
@media screen and (max-width: 768px) {
    .gnav {
        position: absolute;
        top:0;
        left:0;
        border-top: none;
        border-bottom: none;
        -webkit-transition: .35s ease-in-out;
        -moz-transition: .35s ease-in-out;
        transition: .35s ease-in-out;
        padding:50px 0;
    }
    #bg_overlay {
        position: fixed;
        z-index: 15;
        top: -5000px;
        right: -5000px;
        bottom: -5000px;
        left: -5000px;
        display: none;
        background: #000;
        opacity: 0.6;
    }
    .mmd_box {
        max-width: 100%;
        top: 0;
        left: 0;
        margin-left: 0;
        background-color: #fdf7ef;
        padding: 0;
        position: relative;
        box-shadow: 0 0 0 ;
    }
    .gnav ul.lv1 > li.home {
        width: 100%;
    }
    .gnav li.home a {
        text-indent: initial;
    }
    .gnav li.home a:link,.gnav li.home a:visited 	{background-image:none;}
    .gnav li.home a:hover,.gnav li.home a:active	{background-image:none;background-color:#9D1414;}
    .gnav ul.lv1 {
        display: block;
        flex-flow: initial;
        align-content: initial;
        align-items: initial;
        justify-content: initial;
        width: 100%;
        max-width: 100%;
        text-align: left;
        background:none;
    }
    .gnav ul.lv1 > li {
        position: relative;
        width: 100%;
        max-width: 100%;
        height: auto;
        display: block;
        text-align: left;
        font-size: 14px;
        background: none;
           border-top: solid 1px #1E1E1E;
        border-bottom: solid 1px #1E1E1E;
        background-color: #141414;
    }
    .gnav ul.lv1 ul.lv2 {
        display: block;
        width: 100%;
        max-width: 100%;
        position: relative;
        top: 0;
        left: 0;
        padding-left:30px;
    }
    .gnav ul.lv1 ul.lv2 li {
        border-top: solid 1px #323232;
        border-top: solid 1px #000;
        position: relative;
        max-width: 100%;
        height: auto;
        display: block;
        text-align: left;
        background: none;
    }
    .gnav ul.lv1 li a,
    .gnav ul.lv1 li span {
        display: block;
        width: 100%;
        height: auto;
        padding:10px 20px;
    }
    .gnav ul.lv1 li.home span {
        padding: 0;
    }
    
    
    
    
    
    ul.lv2 {
        width: 100%;
    }


    
    /* ナビゲーション */
    header .sp_nav_btn {
        display: block;
    }

    .gnav li > span::before,
    .gnav li > span::after{
        display: block;
        content: '';
        background-color: #2C221F;
        position: absolute;
        z-index:1;width: 11px;
        height: 1px;
        top: 50%;
        right: 14px;
    }
    .gnav li > span::before{
        width: 1px;
        height: 11px;
        top: 50%;
        right: 19px;
        margin-top:-5px;
    }
    .gnav li > span.open::before{
        display: none;
    }

    /* このクラスを、jQueryで付与・削除する */
    .gnav.active {
        transform: translateY(0%);
        -webkit-transition: .35s ease-in-out;
        -moz-transition: .35s ease-in-out;
        transition: .35s ease-in-out;
    }
    .sp_nav_btn {
        display: block;
        position: absolute;
        left: 15px;
        top: 10px;
        width: 40px;
        height: 40px;
        cursor: pointer;
        z-index: 10010;
        text-align: center;
    }
    .sp_nav_btn span {
        display: block;
        position: absolute;    /* .navToggleに対して */
        width: 30px;
        border-bottom: solid 3px #FFF;
        -webkit-transition: .35s ease-in-out;
        -moz-transition: .35s ease-in-out;
        transition: .35s ease-in-out;
        left: 6px;
    }
    .sp_nav_btn span::before{
        content:"";
        display: block;
        position: absolute;    /* .navToggleに対して */
        width: 30px;
        border-bottom: solid 3px #FFF;
        -webkit-transition: .35s ease-in-out;
        -moz-transition: .35s ease-in-out;
        transition: .35s ease-in-out;
    }
    .sp_nav_btn span {
        top: 14px;
    }
    .sp_nav_btn span::before {
        top: 10px;
    }
    /* 最初のspanをマイナス45度に */
    .sp_nav_btn.active span {
        top: 18px;
        left: 6px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    /* 2番目と3番目のspanを45度に */
    .sp_nav_btn.active span::before{
        top: 0px;
        left: 0px;
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        transform: rotate(90deg);
    }
    
    
    
    
    
}