@charset "UTF-8";
/*モバイル*/
@media (max-width: 767px){




.header{
display: none;
}


   .gnav_header{
       display: block;
position: relative;
height: 100px; } 

    
    
    
.gnav_header a:first-of-type{
    
    
    
    /* TwoDucksサイト開設したらflexにする */
    display: none;
    
    
    
position: absolute;
width: 50px;
height: 50px;
top: 25px;
left: 30px;
background-color: #DAC556;
padding: 5px;
border-radius: 30px;
align-items: center;   /* 縦中央 */


}


.gnav_header a:nth-of-type(2){
display: block;
position: absolute;
width: 170px;
top: 25px;    
    
left: 50%;
transform: translate(-50%);
}




#gNav{
position: fixed;
top: 0;
right: -100%;
width: 100%;
z-index: 9!important;
transition: .3s;
background-color:#fff; 
height: 70vh; /* 環境にあわせる */
overflow-x: scroll;
border-bottom: 30px solid #000;

}

    
    
.gnav_img {
display: block;
position: relative;
height: 100px; 
    } 


.gnav_img img{
width: 170px;
    position: absolute;
top: 25px;    
left: 50%;
transform: translate(-50%);
}


#gNav::-webkit-scrollbar {
width: 10px;
}


#gNav::-webkit-scrollbar-track {
border-radius: 10px;
box-shadow: inset 0 0 6px rgba(0, 0, 0, .1);

}


#gNav::-webkit-scrollbar-thumb {
background-color: #000;
border-radius: 10px;
box-shadow:0 0 0 1px rgba(255, 255, 255, .3);

}


#gNav.open{
right: 0%;
background:rgba(250,250,250,0.95);

}


#gNav ul{
width: 100%;
height: auto;
display: flex;
flex-direction: column;
margin: 0;
justify-content: center;
border-top: #ccc solid 2px;
padding: 0;
padding-bottom: 50px;

}





#gNav ul li{
display: block;
width: 100%;
}

#gNav ul  lavel{
color: #1A3444;
}




label{
display: block;
padding: 10px;
background-color: #fff;
border-bottom: #ccc solid 1px;
margin: 0;
color: #06233E;

}



.gnav_contents p{
margin: 0;
font-size:  0.8em;
text-align: left;
border-bottom: solid 1px #ccc;

}

.gnav_contents a{
color: #444;
text-decoration: none;
display: block;
padding: 12px 30px;
}



.gnav_contents table{
width:97%;
margin: 0px auto;
padding: 0;
height: auto;
}



.gnav_contents table th {
font-size:  0.8em;
text-align: left;
padding-top: 10px;
margin: 0;
}

.gnav_contents table td {
width: 50%;
font-size:  0.8em;
text-align: left;
border: solid 1px #ccc;
}



.gnav_contents table a{
display: block;
padding: 12px;
color: #06233E;
text-decoration: none; 
}

.gnav_contents a:hover{
color: #888;
}


/*ボタン*/

.openbtn{
position: fixed;
top: 25px;
right: 20px;
background:#000;
cursor: pointer;
width: 50px;
height:50px;
border-radius: 5px;
z-index: 10;
}

.openbtn span{
display: inline-block;
transition: all .4s;/*アニメーションの設定*/
position: absolute;
left: 14px;
height: 2px;
border-radius: 5px;
background: #fff;
width: 45%;
}


.openbtn span:nth-of-type(1) {
top:13px;	
}

.openbtn span:nth-of-type(2) {
top:20px;
}

.openbtn span:nth-of-type(3) {
top:27px;
}

.openbtn span:nth-of-type(3)::after {
content:"Menu";/*3つ目の要素のafterにMenu表示を指定*/
position: absolute;
top:5px;
left:-0.55em;
color: #fff;
font-size: 0.6rem;
text-transform: uppercase;
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active{
background: none;
}

.openbtn.active span:nth-of-type(1) {
top: 14px;
right: 15px;
transform: translateY(6px) rotate(-45deg);
width: 35%;
background: #000;
}

.openbtn.active span:nth-of-type(2) {
opacity: 0;
}

.openbtn.active span:nth-of-type(3){
top: 26px;
right: 15px;
transform: translateY(-6px) rotate(45deg);
width: 35%;
background: #000;
}

.openbtn.active span:nth-of-type(3)::after {
content:"Close";/*3つ目の要素のafterにClose表示を指定*/
transform: translateY(0) rotate(-45deg);
top:5px;
left:-0.2em;
color: #000;

}





footer{
margin-top: 50px;
padding:  0;
height: auto;
}


.pc_footer {
display: none;
}


.mobile_footer
{
display: block;
width: 100%;
margin: 0 auto;
text-align: center;
padding-top: 30px;
}


.mobile_footer a{
text-decoration: none;
color: #06233E;
font-size: 0.8em;
border-right: 1px solid #06233E;
padding: 0 10px;
margin: 0;

}

.mobile_footer a:nth-of-type(n + 4){
border: none;
}

.mobile_footer span a{	
display: block;
width: 120px;
margin: 0 auto;
border: none;
margin-top: 20px;
}


}