@charset "utf-8";
/* CSS Document */

* { margin: 0; padding: 0; }
body {
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
color: #2c2c2c;
font-size:62.5%;
background-color: #fff;
}
img { max-width:100%; }
a:link { color: #0c419a; text-decoration: underline; }
a:visited { color: #0c419a; text-decoration: underline; }
a:hover { color: #0c419a; text-decoration: none; }
a:active { color: #0c419a; text-decoration: underline; }
ol li, ul li { list-style: none; font-size: 1rem; line-height: 1.8; padding-bottom:3%; }
ol, ul { margin-bottom:3%; }
dl { font-size: 1rem; line-height: 1.8; margin-bottom:6%; }
strong { font-weight: normal;}
a img:hover {
filter: alpha(opacity=70);
-moz-opacity:0.7;
opacity:0.7;
}

/* ------------------------------------------------
   Module 
------------------------------------------------ */

.cf:before,
.cf:after {
content: " ";
display: table;
}
.cf:after {
clear: both;
}
.cf  {
*zoom: 1;
}
.ta-c { text-align: center; }
.ta-l { text-align: left; }
.ta-r { text-align: right; }
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mt-40 { margin-top: 40px; }
.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }
.mb-40 { margin-bottom: 40px; }
.ml-10 { margin-left: 10px; }
.ml-20 { margin-left: 20px; }
.ml-30 { margin-left: 30px; }
.ml-40 { margin-left: 40px; }
.mr-10 { margin-right: 10px; }
.mr-20 { margin-right: 20px; }
.mr-30 { margin-right: 30px; }
.mr-40 { margin-right: 40px; }

@media screen and (min-width: 992px) {
.row {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.col-6 {
max-width: 50%;
padding: 0 1% 2% 1%;
box-sizing: border-box;
}
}

.serif { font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }
.txt-red { color: #d42e2e; }
.txt-marker { background-color: #ffff99; padding: 4px 0; }
.txt-small { font-size: 0.8rem; }
.txt-large { font-size: 1.4rem; }
.txt-underline { text-decoration: underline; }
.txt-bold { font-weight: bold; }

hr {
width: 100%;
height: 5px;
background: repeating-linear-gradient(45deg, #4f4f4f, #4f4f4f 3px, #000000 3px, #000000 6px)
}

/* -------------------------------------------------------------------- */

header {
position: relative;
/* margin-bottom: 6%; */
}
header h1 {
background-color: #f4f4f2;
font-size: 1.6rem;
font-weight: normal;
padding: 15px;
text-align: center;
}
h2 {
padding: 3% 6%;
margin-bottom:6%;
border-top: 1px solid #2c2c2c;
border-bottom: 1px solid #2c2c2c;
font-size: 1.6rem;
font-weight: bold;
text-align: left;
line-height: 1.6;
}
h3 {
padding: 2% 3%;
margin-bottom:6%;
font-size: 1.5rem;
font-weight: normal;
text-align: left;
position: relative;
padding: 0.5em;
}
h3:after {
width: 100%;
position: absolute;
bottom: -5px;
left: 0;
content: '';
height: 10px;
background: repeating-linear-gradient(-45deg, #ccc, #ccc 3px, #fff 3px, #fff 6px);
}
.txt-by {
font-size: 0.8rem;
text-align: right;
padding: 1% 2%;
box-sizing: border-box;
}
.txt-by a,
.txt-by span {
color: #6c6c6c;
text-decoration: none;
}
.source dt {
float: left;
}
.source dd {
padding-left: 4em;
}
.container {
width: 700px;
margin: 0 auto 3%;
}
.container-in {
padding: 0 5% 3% 5%;
}
p {
font-size: 1rem;
line-height: 1.8;
margin-bottom: 4%;
word-wrap: break-word;
}
.container figure {
margin-bottom: 3%;
}
dl.review dt {
font-size: 1.2rem;
font-weight: bold;
margin-bottom:3%;
}
#side-banner {
position: fixed;
bottom: 0;
right: 20px;
margin-bottom: 3.5%;
}
#side-banner a {
text-decoration: none;
display: block;
width: 250px;
}
#side-banner a:hover {
text-decoration: none;
}

/* ---------- max991 ------------------------------------------------ */

@media screen and (max-width: 991px) {
h1 {
font-size: 2.4rem;
}
h2, h3 {
font-size: 1.2rem;
}
h2 br,
h3 br {
display: none;
}
.container {
width: 100%;
}

}