@charset "UTF-8";



/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●　タブレット　769〜1024　●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
@media screen and ( max-width : 1024px ) {
#menu{
display: block;
position: fixed;
z-index: 5;
left: -1000%;
top: 0;
width: 100%;
transition: all .5s;
-ms-overflow-style: none;    /* IE, Edge 対応 */
scrollbar-width: none;       /* Firefox 対応 */
}

#menu.active{
left: 0;
}

#icon{
display: flex;
position: fixed;
z-index: 1000;
top: 10px;
left: 10px;
width: 50px;
height: 50px;
flex-direction: column;
justify-content: center;
transition: all .3s ease 0s;
opacity: 1;
background-color:#006532;
border-radius: 3px;
}

#icon span{
display: block;
margin: 0 auto;
width: 30px;
height: 3px;
background-color: #fff;
opacity: 1;
transition: all .3s ease 0s;
}

#icon span:first-of-type{
margin-bottom:7px;
}

#icon span:last-of-type{
margin-top: 7px;
}

#icon.active span:nth-of-type(1){
transform: rotate(45deg);
margin-top: 10px;
background-color: #fff;
opacity: 1;
}

#icon.active span:nth-of-type(2){
margin-left: 10px;
transform: rotate(-45deg);
margin-top: -10px;
background-color: #fff;
opacity: 1;
}

#icon.active span:nth-of-type(3){
opacity: 0;
background-color: #fff;
}

.submenu{
max-width: 350px;
margin-left: 10px;
margin-right: 10px;
display: block;
margin-top:70px;
color:#fff;
background-color: #009D72;
opacity: .9;
}

.submenu li{
display: block;
margin:auto;
}

.submenu li a{
display: block;
padding: 10px 20px;
}

.submenu li:last-of-type{
border:none;
}

.submenu a{
padding-bottom: 30px;
font-size:18px;
color:#fff;
}
	
	
}