@charset "Shift_JIS";

body {
color:#000;
font-size:16px;
min-width:431px;
max-width:1300px;
border : 3px solid blue;
background-color:#5d99ff;
margin:0px 150px 0px 150px;
padding:0px 5px 0px 5px;
}

#headtop {
background-color:#00c;
}

#headtop h1 {
font-size:12px;
line-height:12px;
font-weight:400;
color:#f5f6ff;
margin:0;
padding:2px 5px;
}

#topname {
padding-left:10px;
background-color:#007cf9;
}

#topname a {
display:block;
background-image:url(kitaname.webp);
background-position:left top;
background-repeat:no-repeat;
width:300px;
height:39px;
overflow:hidden;
text-indent:100%;
white-space:nowrap;
}

#hostleft {
background-color:#fff;
text-align:left;
}

#hostcenter {
background-color:#fff;
text-align:center;
}

.boxlock {
background:none 0 0 /auto auto repeat scroll padding-box border-box #fff;
border:#6091d3 solid 2px;
border-radius:10px;
margin-left:auto;
margin-right:auto;
text-align:left;
color:#282828;
max-width:980px;
padding:2px;
}

h2 {
clear:both;
font-size:12px;
font-weight:bolder;
background-color:#1e90ff;
color:#191929;
text-align:center;
margin:0;
padding:0;
}

h3,h4,h5 {
clear:both;
border-bottom-color:#0080c0;
border-bottom-width:1px;
border-bottom-style:solid;
font-size:16px;
background-image:linear-gradient(to bottom, #0156c9, #8080ff);
margin-top:0;
margin-bottom:3px;
text-align:center;
color:#fff;
}

#footers {
background-color:#007cf9;
}

#footeron {
background-color:#039;
color:#ecf;
font-size:12px;
text-align:center;
}

table.postlate th {
background-color:#33d;
width:350px;
font-size:16px;
color:#fff;
text-align:center;
}

table.postlate td {
color:#0000cb;
width:175px;
font-size:16px;
text-align:center;
font-weight:700;
}

table.postlate th,table.postlate td {
border-collapse:collapse;
border:1px solid #008bf4;
}

table.postlate tr:nth-child(2) {
background-color:#3cf;
}

table.info th {
background-color:#4b0082;
color:#fff;
width:225px;
font-size:16px;
text-align:center;
}

table.info td {
width:580px;
font-size:16px;
text-align:left;
}

table.info th,table.info td {
border-collapse:#4b0082;
border:1px solid #4b0082;
line-height:1.5;
}

table.kyujin th {
width:200px;
font-size:16px;
text-align:center;
background-color:#390;
color:#fff;
}

table.kyujin td {
width:650px;
font-size:16px;
text-align:left;
}

table.kyujin th,table.kyujin td {
border-collapse:collapse;
border:1px solid #191960;
line-height:1.5;
}

img {
max-width:100%;
}

img.imgpin {
max-width:100%;
display:block;
margin:auto;
}

a:link,a:visited {
color:#1c91fc;
text-decoration:none;
}

.menu-btn {
position: fixed;
top: 10px;
right: 10px;
display: flex;
height: 45px;
width: 45px;
justify-content: center;
align-items: center;
z-index: 90;
background-color: #3584bb;
}
.menu-btn span,.menu-btn span:before,.menu-btn span:after {
content: '';
display: block;
height: 5px;
width: 25px;
top: 12px;
left: 9px;
border-radius: 3px;
background-color: #fff;
position: absolute;
}
.menu-btn span:before {
top: 8px;
bottom: 5px;
left: 0px;
}
.menu-btn span:after {
top: 16px;
left: 0px;
}

#menu-btn-check:checked ~ .menu-btn span {
background-color: rgba(255, 255, 255, 0);
}
#menu-btn-check:checked ~ .menu-btn span::before {
bottom: 8px;
transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
top: 8px;
transform: rotate(-45deg);
}

#menu-btn-check {
display: none;
}

.menu-content {
width: 100%;
height: 100%;
position: fixed;
overflow: auto;
top: 0;
left: 0;
z-index: 80;
background-color: #191936;
}
.menu-content ul {
padding: 40px 10px 0;
font-size:20px;
}
.menu-content ul li {
border-bottom: solid 1px #f8f8ff;
list-style: none;
}
.menu-content ul li a {
display: block;
width: 100%;
font-size: 15px;
box-sizing: border-box;
color:#fff;
text-decoration: none;
padding: 9px 15px 10px 0;
position: relative;
font-size:18px;
}
.menu-content ul li a::before {
content: "";
width: 7px;
height: 7px;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
transform: rotate(45deg);
position: absolute;
right: 11px;
top: 16px;
}

.menu-content {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 100%;
z-index: 80;
background-color: #191936;
transition: all 0.5s;
}

#menu-btn-check:checked ~ .menu-content {
left: 0;
}
