BODY#main{background-color:darkseagreen}
BODY#menu{background-color:rgba(143,188,143,0.6);}
DIV#head{}
DIV#honbun{z-index:1;}
DIV#mokuji{z-index:10;width:215px;top:25px;right:0px;bottom:10px;position:fixed; border-style:dotted;transform: translateX(110%);}
DIV.img{margin-top:20px;margin-left:40px;margin-bottom:10px;font-size:smaller;max-width:100%;}
DIV.banner{display:flex;flex-direction:row}
DIV.banner div:nth-of-type(1){margin-right:3px}
DIV.banner div:nth-of-type(2){margin-right:3px}
DIV.banner div:nth-of-type(3){margin-right:auto}
DIV.banner div:nth-of-type(4){margin-right:3px}
Ul.main{padding-left:20px}
Li.main{margin-bottom:15px}
Li.none{list-style:none}
Li.sub{margin-bottom:10px}
DIV#foot{ }
Iframe{border:none;width:100%;height:100%;}
Figure{max-width:100%;}
P.rightsmall{text-align:right;font-size:smaller;}
P.leftsmall{text-align:left;font-size:smaller;}
P.right{text-align:right}
H1.main{text-shadow:#888 5px 5px 2px;font-style: italic}		
H2{text-shadow:#888 5px 5px 2px;color:#006600}
aside.normal{padding:10px;margin-left:40px;border-style:dotted;border-color:gray}
table.normal{margin-left:20px;border-collapse:collapse}
table.normal td{border:solid 1px}

input {position:fixed;top:4px;right:34px;}
input#check:checked ~ DIV#mokuji {transform: translateX(0%)} 
label {display: block;width: 25px;height: 22px;
position:fixed;top:4px;right:4px;}
span,span::before,span::after {display: block;height: 3px;width: 25px;background-color:gray;content: "";
position: absolute;}
span::before {top: 8px;}
span::after {top:16px;}
@media screen and (min-width:820px) {
  DIV#honbun{padding-right:220px;}
DIV#mokuji {transform: translateX(0%)} 
label {display: none;}
input {display: none;}
}