/* Start Navigation Bar */

/* ----------------------------------- */
/* Global Navigation */
/* ----------------------------------- */

#sub-menu-sp{display:none;}/*SP用*/

.gnav-wrapper {
position:absolute;
top:0;
right:0;
width: 100%;
height:var(--height-gnav);
margin: 0 auto 0;
z-index: 10;
}
.gnav-wrapper .wrpnav{
position: relative;
width: 100%;
}
.gnav {
height:var(--height-gnav);
position: absolute;
top:0;
left:50%;
width: 100%;
display: flex;
justify-content:center;
margin:0 auto;
letter-spacing:.08em;
transform:translateX(-50%);
}
.gnav > li,
.gnav > li.has-children{
text-align: center;
transition: all .3s ease-in-out;
}
.gnav > li{
width:calc((1080px - (198px*2)) / 6);
border-right:1px solid var(--color-line-second);
}
.gnav > li.nav-w-w{
width:198px;
}
.gnav > li:first-child{
border-left:1px solid var(--color-line-second);
}
.gnav > li > a{
position: relative;
display: inline-block;
text-decoration: none;
height:var(--height-gnav);
}
.gnav > li:hover > a::after,
.gnav > li > a::after,
.gnav > li.has-children > a::after,
.gnav > li a.current::after{
position:absolute;
left:0;
top:110%;
content:"";
width:100%;
height:2px;
background: var(--color-base-1);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s; 
-moz-transition: all 0.3s; 
-ms-transition: all 0.3s; 
-o-transition: all 0.3s;
transition: all 0.3s;
}
.gnav > li a.current::after,.gnav > li:hover > a::after{display: inline-block;opacity: 1;visibility: visible;}
.gnav > li a.current::after,.gnav > li:hover > a::after{transform: scale(1,1);}
.gnav > li:last-child a {
}
.gnav > li:hover .megamenu {
max-height: 9999px;
opacity: 1;
padding: 60px 0 30px;
padding: 30px 0 00px;
}

/*----------------------------*/

/*  megamenu  */

/*----------------------------*/

.megamenu {
background:red;
background:hsla(60,3%,96%,1);
background:rgba(0,0,0,.9);
background:rgba(204,0,0,.9);
background:rgba(249,249,247,.9);
background:rgba(0,0,0,.9);
max-height: 0;
opacity: 0;
overflow: hidden;
width: 100%;
position: absolute;
top:calc(100% + 18px);
top:calc(100% + 27px);
left: 0;
transition: all .2s ease-in;
z-index: 999;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.megamenu-inner {
width:70%;
max-width:1200px;
margin:0 auto;
padding:0;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.megamenu-inner li {
padding: 0 0 0 15px;
margin:0 3rem 30px;
position:relative;
font-size:var(--size-font-base);
}
.megamenu-inner li::before{
content:"";
position:absolute;
top:50%;
left:0;
width:9px;
height:6px;
background:var(--color-base-1);
clip-path: polygon(0 0, 100% 50% ,0 100% );
transform:translateY(-50%);
}
.megamenu-inner a,
.megamenu-inner a:visited {
border-left: none;
color:#fff;
}

/*モーダルメニュースクロール時 背景のコンテンツを固定*/

.fixed {
position: fixed;
width: 100%;
height: 100%;
}