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

menu

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


@media screen and (min-width : 769px){


#menuBtn,#menuBtn2,#menuPlate{ display: none;}

.menuAll{
width: 50%;
position: absolute;
top: 50%; left: 2%;
transform: translateY(-70%);
z-index: 6;
}

.menuAll2{
width: 35%;
position: absolute;
top: 25%; left: 2%;
z-index: 6;
}

#menu{ display: none;}

#menu2{
width: 100%;
}

#menu2 ul {
list-style: none outside none;
margin: 0;
padding: 0;
position: relative;
}

#menu2 ul li {
position: relative;
transition: all 0.3s ease;
text-align: left;
font-family: "industry", sans-serif;
font-weight: 700;
font-style: normal;
font-size: 2.7vw;
line-height: 1.3em;
letter-spacing: -0.1vw;
padding: 0;
}

#menu2 ul li a{
cursor: pointer;
transition: all 0.3s ease;
color: #0d0000;
}

#menu2 ul li a:hover{ transform: translateX(5px); opacity: 1; color: #fe4897;}

#snsIcon{
width: 120px; height: 60px;
position: absolute;
top: 10px; left: 20px;
z-index: 52;
display: flex;
align-items: center;
}

#btnpagetop{
background: url("../images/btn_pagetop.png") no-repeat center;
background-size: contain;
width: 80px; height: 80px;
position: fixed;
bottom: 0; right: 0;
z-index: 50;
transition: all 0.3s ease;
mix-blend-mode: difference;
}

#btnpagetop a{
width: 100%; height: 100%;
display: block;
}

}

@media screen and (max-width : 768px){

#menuBtn{
background:url("../images/nav/menu_btn01.png");
background-size: 100% 100%;
width:60px; height:60px;
cursor:pointer;
position: fixed;
top:0; left:0;
z-index:55;
filter: drop-shadow(0 0 4px rgba(0,0,0,0.2));
}

#menuBtn2{
background:url("../images/nav/menu_btn02.png");
background-size:100% 100%;
width:60px; height:60px;
cursor:pointer;
position: fixed;
top:0; left:0;
z-index:60;
display:none;
}

#menuPlate{
background: #000;
width: 100%; height: 60px;
position: fixed;
top:0; left:0;
z-index:39;
}

.menuAll,.menuAll2{
background: #000 url("../images/nav/menu_bg.png") no-repeat center bottom;
background-size: 100% auto;
width: 100%; height: 100vh;
position: fixed;
top: 0; left: 0;
padding: 0;
z-index: 40;
display:none;
overflow-y: auto;
}

#menu2{ display: none;}

#menu{
width: 100%;
padding: 70px 0;
position: absolute;
top: 20%; left: 0;
z-index: 2;
}

#menu ul {
list-style: none outside none;
margin: 0;
padding: 0;
position: relative;
}


#menu ul li {
width: 100%;
line-height: 1.2em;
position: relative;
cursor: pointer;
text-align: center;
font-family: "industry", sans-serif;
font-weight: 700;
font-style: normal;
font-size: 9vw;
}

#menu ul li a{
width: 100%; height: 100%;
display: block;
}

#menu ul li.topbtn{ margin: 5vw 0 0 0; font-size: 8vw;}

#btnpagetop{
background: url("../images/btn_pagetop.png") no-repeat center;
background-size: contain;
width: 60px; height: 60px;
position: fixed;
bottom: 0; right: 0;
z-index: 50;
transition: all 0.3s ease;
mix-blend-mode: difference;
}

#btnpagetop a{
width: 100%; height: 100%;
display: block;
}


}



