:root{ --bgcol:6DFF8D;
--menu-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
a {text-decoration:none;}
.bigfont { font-size:2.4vw; }
.sub1font { font-size:1.8vw; }
.sub2font { font-size:1.5vw; }
.normalfont { font-size:1.2vw; }
.smallfont { font-size:1vw; }
.flex {display:flex;}
.flexmin100 { min-height:100vh; display:flex; flex-direction: column !important; margin:0;}
.flexshrink0 { flex-shrink:0; width:90%; margin:10px 5%;}
.headerpart { background-color:var(--bgcol); width:95%; padding:10px 2.5%; }
.menubutton { display:none;  background-image:var(--menu-icon-bg); width:0px;}
.topicon { height:40px; width:auto; vertical-align:middle; display:inline-block;}
.toptitle {vertical-align:middle; display:inline-block; margin-left:20px;}
.menupart { display:inline-block; vertical-align:middle; text-align:right; width: calc(90vw - 200px);}
.menupart { color:black; } .menupart a { color:black; }
.menuitem { display:inline-block; padding:2px 10px; color:black; position:relative;}
.menuitem.active > a,.menusub .subitem.active > a{ color:grey; }
.menuitem .icon { display:inline-block; vertical-align:middle; color:black;}
.menusub { position:absolute; left:0; text-align:left; background-color:var(--bgcol);}.subitem { padding:5px 10px; margin-left:10px;} 
.subtitle { font-weight:bold; margin-bottom:10px;}
.para { line-height:1.2; text-align:justify; margin-bottom:5px;width:100%;}
.footer { margin-top:auto; padding:10px 0px; text-align:center; background-color:var(--bgcol);}
.contentpart { display:inline-block; margin:10px 0px;}
.contentleft { width:65%; display:inline-block; }
.contentleft .content .subtitle { margin-top:15px; margin-bottom:8px;} .contentleft .content .codepart{line-height:1.5; background-color:#eeeeee; padding:5px 8px; border-radius:5px;}
.contentleft .content img { margin-bottom:10px;}
.contentright { margin-left:2%; width:30%; display:inline-block;}
.contentright .box { margin:10px 0; border:1px solid #6DFF8D; border-radius:5px; }
.katpart .item { width:30%; display:inline-block; margin-bottom:10px;}
.wbigfull { width:100%; } .wbig1_3 { width:33%; } .wbig2_3 { width:66%; } .wbig4_5 { width:80%; } 
.marh-auto { margin-left:auto; margin-right:auto;}
.t-center { text-align:center;} .t-right{text-align:right;}
.para ol {margin-block-start:8px; margin-block-end:8px; padding-inline-start:30px;}
.v-mid { vertical-align:middle;} .v-top {  vertical-align:top; }
.listpart .item { margin-bottom:10px; border:1px solid #6DFF8D; cursor:pointer;}.listpart .item .pcontent{ padding:5px 8px; } .listpart a {color:black; }
.listpart .item .title { font-weight:bold }
.pagingitem  { border:1px solid #6DFF8D; margin:5px 8px; display:inline-block;} .pagingitem.active  { border:0; }
.pagingitem a { padding:5px; }
.other { color:grey;} .buttoncopy {margin-top:5px; margin-bottom:8px;}
.flexrow {display:flex; flex-direction:row!important; align-items:center;}
.flexrow .pcontent { flex-grow:1; min-width:0; } .listpart .item .appicon { width:100px; } .listpart .item .appicon img { width:100%; height:auto;}
.youtubepart { width:800px; max-width:100%; margin-bottom:20px;} .youtubepart iframe{width:100%; aspect-ratio:16/9; }
.para.list ol { margin-block-start:2px; margin-block-end:4px;}
.contentright .listpart a{ color:blue;} .contentright .listpart .list{ margin:4px 10px;}
.arrowtop { position:fixed; bottom:30px; right:20px; font-size:20px; font-weight:bold; padding:10px 18px; background-color:rgba(109,255,141,0.7); cursor:pointer; border-radius:10px; }
@media only screen and (max-width : 767px){
 .bigfont { font-size:3.5vw; }
 .sub1font { font-size:2.7vw; }
  .sub2font { font-size:2.4vw; }
 .normalfont { font-size:2vw; }
 .smallfont { font-size:1.5vw; }
 .flexshrink0 { flex-shrink:0; width:96%; margin:5px 2%;}
 .menubutton { display:inline-block; width: 35px; height: 35px; background-repeat: no-repeat;
  background-position: center; background-size: 100%; vertical-align:middle; margin-right:10px;}
 .menupart { background-color:var(--bgcol); display:block; text-align:left;}
 .menuitem { position:static; display:block; padding:5px;}
 .menusub { position:static;  margin-left:20px;} .subitem { padding:2px 0px;} 
 .menupart.hide { display:none;}
 .menuitem .icon { display:none; }
 .wmobfull { width:100% }
 .contentleft { width:100%; }
.contentright { width:0%; display:none;}
}

@media only screen and (min-width : 768px){
 .menusub { display:none; }
 .menuitem:hover .menusub { display:block;}
 .wbigpipara { width:58%; display:inline-block;} .wbigpiimg { width:36%; margin-left:2%; display:inline-block;}
}