.dpno{
display:block;
position:absolute;
top:-100px;
right:0px;
}


#nop{
display:inline-block;
vertical-align:middle;
text-align:center;
padding:0;
margin:5px 0 0 5px;
cursor:pointer;
position:absolute;
top:46px;
right:20px;
}
#nop img{
width:40px;
}

#sub1{
display:none;
}

@media screen and (max-width:767px){
#nop{
display:inline-block;
vertical-align:middle;
text-align:center;
padding:0;
margin:5px 0 0 5px;
cursor:pointer;
position:absolute;
top:22px;
right:20px;
}
}

#ncl{
display:none;
position:fixed;
z-index:1;
top:0;
left:0;
width:100%;
height:100%;
background:rgb(0,0,0);
opacity:0;
}

#nav_ckbx:checked ~ #ncl{
display:block;
opacity:0.5;
}

#nav_ckbx:checked ~ #nav_cnt{
opacity:1;
left:0;
transform:translateX(0%);
box-shadow:8px 0 5px rgba(0,0,0,0.3);
width:250px;
background:rgba(80,80,80,1);
}

#nav_ckbx:checked ~ #nav_cnt #sub1{
display:block;
list-style:none;
width:100%;
background:rgba(80,80,80,0.5);
padding:0;
}

.m_menu{
list-style:none;
display:block;
margin:0;
padding:0;
}

#mn0{
display:block;
width:auto;
}

nav{
display:block;
width:100%;
position: relative;
text-align:left;
margin: 0 auto;
box-sizing:border-box;
z-index:2;
}
nav{
display:block;
width:100%;
position: relative;
text-align:left;
margin: 0 auto;
box-sizing:border-box;
z-index:2;
}



.nvpd{
display:block;
width:auto;
padding:10px;
margin:0;
}

.nvpd > ul > li > li{
display:block;
width:auto;
}

.nvpd > ul > li > span:hover{
width:auto;
height:40px;
line-height:35px;
}
.nvpd > ul > li > a:hover{
width:auto;
height:40px;
line-height:35px;
box-shadow:inset 0 -2px 0 rgba(255,255,255,1);
}

.nvpd > ul > li > a{
display:block;
width:auto;
height:40px;
line-height:35px;
font-weight:none;
padding:0;
text-align:left;
text-decoration:none;
font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
font-size:18px;
color:#FFF;
background:rgba(200,200,200,0);
position:relative;
letter-spacing:2px;
}
.nvpd > ul > li > span{
display:block;
width:auto;
height:40px;
line-height:35px;
font-weight:none;
padding:0;
text-align:left;
text-decoration:none;
font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
font-size:18px;
color:#FFF;
background:rgba(200,200,200,0);
position:relative;
letter-spacing:2px;
}

a.l_sub{
display:block;
width:90%;
height:40px;
line-height:35px;
font-weight:none;
padding:10px 0 0 20px;
margin:0 0 2px 0;
text-align:left;
text-decoration:none;
font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
font-size:18px;
color:#FFF;
background:rgba(200,200,200,0.2);
position:relative;
letter-spacing:2px;
}
a.l_sub:hover{
background:rgba(0,0,0,0.5);
}

#nav_ckbx{display:block;}

#nav_cnt{
position:fixed;
top:0;
left:-250px;
opacity:0;
z-index:2;
width:250px;
height:100%;
overflow:auto;
background:rgba(80,80,80,0);
transition:0.3s ease-in-out;
transform:translateX(-120%);
box-shadow:8px 0 5px rgba(0,0,0,0);
}