@charset "UTF-8";

.box_main {margin:0px;}
.box_main > header {margin-top:2rem;}
.index > nav, .index > aside, .index > p {padding:25px 30px;}
.index > .info {padding:40px 30px 0px 30px;}
.index > .info:last-child {padding:0px 30px 40px 30px;}
h1, .head_h, header > nav, footer > nav {border:none;}
h1, .head_h {font-size:1.6rem;}

.box_menu {z-index:9998;position:fixed;display:flex;flex-direction:column;box-sizing:border-box;width:min(100%,640px);margin:0px;overscroll-behavior:none;scrollbar-gutter:stable;}
.box_menu > div:first-child {margin-top:2rem;}
.menu:not(.acc) {flex-grow:0;flex-shrink:0;padding-right:15px;font-size:1rem;}
.menu:not(.acc):last-child {border-bottom:solid 16px #225577;}
.menu.end {flex-grow:1;margin-bottom:-1px;}
.menu.end > .list {padding-top:0.31rem;}
.menu.end > .list > li:first-child {display:none;}
.menu.end > .list > li:first-child > a {margin:0;}
.menu.end > .list > li:nth-of-type(2) {margin-top:0px;} 
.acc.menu > .list {padding-top:1rem;padding-bottom:0.62rem;}
.acc.menu > .list > li:not(:first-child) {margin-top:1.12rem;}

input#menu_mobile:not(:checked) ~ .box_menu {height:0%;transition:height 0.2s ease;overflow:hidden;}
input#menu_mobile:checked ~ .box_menu {height:100%;transition:height 0.2s ease;overflow-y:scroll;}
.toggle.mobile {z-index:9999;position:fixed;display:block;width:min(100%,640px);padding:0.25rem 0px;text-align:center;font-size:1.5rem;font-weight:bold;color:#fdfdfb;background-color:#225577;}

@media (prefers-color-scheme: dark) {
/* #e8e8e6,#e2e2e0 #d8d8d6,#d2d2d0 #d8d8d6,#dcdcda */
html {background-color:#0e0e16;color:#d8d8d6;}
header > nav > ul.inline {border-top:solid 2px #0e0e16;}
h1, .head_h, header > nav, footer > nav, article > section, main > aside {background-color:#18181a;}
h1, .head_h, .head_b, .head_h2, h2, h4, h5, h6 {color:#dcdcda;}
.toggle.filter2, .toggle.tips, a:not([class^="img"]) {color:#99c3ff;}
.toggle.top:hover, .toggle.sub:hover, .toggle.filter2:hover, .toggle.tips:hover, a:not([class^="img"]):hover, .att > span {color:#dfa1a1;}
.toggle.sub {color:#d2d2d0;}
.cbox::before {background-color:initial;}
.toggle.mobile {color:#d2d2d0;background-color:#313f49;}
.menu:not(.acc) {color:#d2d2d0;background-color:#38383a;}
.menu:not(.acc) > .toggle:hover {border-bottom:dotted 2px #999999;color:#444444;}
input:checked ~ .acc.menu > .list > li > a:hover {border-bottom:dotted 1px #dfa1a1;color:#dfa1a1;position:static;transition:color 0s;}
}
