@charset "UTF-8";
* {}
div,p,dl,ol,ul {}

a {color:#165e83; text-decoration:none;}
a:hover {text-decoration:underline;}
.click a,.click_half a {color:#333; text-decoration:none; display:block;}
.navigation-menu li a {color:#fff; text-decoration:none; display:block;}
.wp_article a {color:#555; text-decoration:none; display:block;}
#footer a {line-height:2; white-space:nowrap;}

img {border:none; max-width:100%; height:auto;}
.eyecatch img {width:100%; height:130px; margin:0px 0px 2px 0px; object-fit:cover; object-position:50% 40%;}
#ad img {width:300px; margin:0px 0px 15px 0px;}

li {margin-bottom:5px;}
.navigation-menu li {margin-bottom:0px; list-style:none;}

hr {border-width:1px 0px 0px 0px; border-style:solid; border-color:#555;}
strong {color:#a22041;}
.blue {color:#fff; margin:0px 2px; padding:2px; border-radius:3px; background-color:#4c6473;}
.red {color:#fff; margin:0px 2px; padding:2px; border-radius:3px; background-color:#a25768;}

html {height:100%;}

body {
height:100%;
color:#555;
font-family:sans-serif;
font-size:15px;
-webkit-text-size-adjust:100%;
background-color:#fff !important;
}

.cboth {clear:both;}

table.chart {
border-collapse:collapse;
}

table.chart th {
padding:10px 10px 10px 10px;
border-top:1px dotted #aaa;
border-bottom:1px dotted #aaa;
font-weight:normal;
color:#000;
text-align:center;
}

table.chart td {
padding:10px 10px 10px 10px;
border-top:1px dotted #aaa;
border-bottom:1px dotted #aaa;
}

#outline {
width:1101px;
margin:0px auto;
}

#header {
width:70%;
margin:30px 0px 0px 0px;
float:left;
}

#menu {
width:30%;
margin:30px 0px 0px 0px;
position:relative;
z-index:100;
float:left;
}

.hamburger-menu-toggle {
width:50px;
height:50px;
padding:5px;
background-color:#f8f4e6;
border:2px solid #333;
cursor:pointer;
display:flex;
flex-direction:column;
justify-content:space-around;
position:relative;
z-index:101;
float:right;
}

.hamburger-menu-toggle .line {
display:block;
width:100%;
height:4px;
background-color:#333;
transition:all 0.3s ease;
}

.navigation-menu {
width:30%;
height:100%;
padding:120px 10px 0px 10px;
background-color:#333;
transform:translateX(100%);
transition:transform 0.4s ease-in-out;
position:fixed;
top:0;
right:0;
left:auto;
z-index:99;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
}

.navigation-menu.active {
transform:translateX(0);
}

.hamburger-menu-toggle.active .line:nth-child(1) {
transform:translateY(12px) rotate(45deg);
}

.hamburger-menu-toggle.active .line:nth-child(2) {
opacity:0;
}

.hamburger-menu-toggle.active .line:nth-child(3) {
transform:translateY(-12px) rotate(-45deg);
}

#main {
width:750px;
margin:0px 50px 70px 0px;
float:left;
}

#ad {
width:300px;
margin:30px 0px 70px 0px;
text-align:center;
float:left;
}

#footer {
padding:0px 0px 10px 0px;
font-size:14px;
text-align:center;
clear:both;
}

h1 {
margin:40px 0px 60px 0px;
padding:0px 25px 0px 25px;
border-left:10px solid #333;
color:#333;
font-size:28px;
font-weight:normal;
letter-spacing:0.2em;
}

h2 {
margin:60px 0px 30px 0px;
padding:2px 25px 2px 25px;
border:1px solid #333;
border-left:7px solid #333;
color:#000;
font-size:20px;
font-weight:normal;
letter-spacing:0.2em;
}

h3 {
margin:40px 0px 20px 0px;
padding:2px 25px 2px 25px;
border:1px solid #333;
color:#000;
font-size:16px;
font-weight:normal;
letter-spacing:0.1em;
}

.subtitle {
margin:10px 0px 0px 0px;
border-bottom:1px dotted #aaa;
text-align:right;
}

.date {
margin:10px 0px 0px 0px;
border-bottom:1px dotted #aaa;
text-align:right;
}

.box {
margin:30px 0px 30px 0px;
padding:10px 10px 10px 10px;
border-top:1px dotted #aaa;
border-bottom:1px dotted #aaa;
}

.click {
width:80%;
margin:40px 10% 0px 10%;
padding:7px;
box-sizing:border-box;
border:2px solid #555;
font-size:14px;
font-weight:bold;
text-align:center;
background-color:#f8f4e6;
}

.click_half {
width:48%;
margin:12px 1% 0px 1%;
padding:5px;
box-sizing:border-box;
border:2px solid #555;
font-size:14px;
font-weight:bold;
text-align:center;
background-color:#f8f4e6;
float:left;
}

div#wp_report,div#wp_blognatl,div#wp_blogngy {
width:100%;
font-size:12px;
font-weight:bold;
display:grid;
grid-template-columns:repeat(3, calc((100% - 2 * var(--grid-gap)) / 3));
gap:var(--grid-gap);
--grid-gap:20px;
}

.wp_article {
margin-bottom:5px;
display:inline-block;
vertical-align:top;
}

.post {
width:48%;
margin:0px 1% 0px 0px;
display:inline-block;
vertical-align:top;
}

@media screen and (max-width:820px) {

body {
font-size:16px;
margin:0px 20px 0px 20px;
}

#outline,#main,#ad,#footer {
width:100%;
}

.navigation-menu {
width:70%;
}

#ad img {
margin:0px 1% 15px 1%;
}

.click {
width:90%;
margin:40px 5% 0px 5%;
}

.click_half {
width:96%;
margin:12px 2% 0px 2%;
}

.eyecatch img {
height:180px;
}

.post {
width:100%;
}

}