.sample-box-13 {
border: 2px solid #da4033;
border-radius: 4px;
margin: 2em 0;
padding: 2em;
position: relative;
}
.sample-box-13::before {
background-color: #fff;
color: #da4033;
content: "POINT";
font-weight: bold;
left: 1em;
padding: 0 .5em;
position: absolute;
top: -1em;
} .booklink-box, .kaerebalink-box{
padding:25px;
margin-bottom: 10px;
border:double #CCC;
overflow: hidden;
font-size:small;
}
.booklink-image, .kaerebalink-image{
margin:0 15px 0 0;
float:left;
min-width: 160px;
text-align: center;
}
.booklink-image img, .kaerebalink-image img{
margin:0 auto;
text-align:center;
}
.booklink-info, .kaerebalink-info{
margin:0;
line-height:120%;
overflow: hidden;
}
.booklink-name, .kaerebalink-name{
margin-bottom:24px;
line-height:1.5em;
}
.booklink-powered-date, .kaerebalink-powered-date{
font-size:8px;
margin-top:10px;
font-family:verdana;
line-height:120%;
}
.booklink-detail, .kaerebalink-detail{font-size: 12px;}
.booklink-powered-date, .kaerebalink-detail{margin-bottom:15px;}
.booklink-link2, .kaerebalink-link1{margin-top:10px;}
.booklink-link2 a,
.kaerebalink-link1 a{
width:30%;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
display:inline-block;
margin:5px 2px 0 0;
padding:10px 1px;
text-align:center;
float:left;
text-decoration:none;
font-weight:800;
text-shadow:1px 1px 1px #dcdcdc;
font-size:12px;
color: #fff !important;
}
.booklink-link2 a:hover,
.kaerebalink-link1 a:hover{opacity: 0.6;}
.booklink-link2 a:active
.kaerebalink-link1 a:active{
position:relative;
top:1px;
} .shoplinkamazon a{color:#FF9901 !important;border: 1px solid #FF9901 !important;}
.shoplinkrakuten a{color:#c20004 !important;border: 1px solid #c20004 !important;}
.shoplinkkindle a{color:#007dcd !important;border: 1px solid #007dcd !important;}
.shoplinkkakakucom a{color:#314995 !important;border: 1px solid #314995;}
.shoplinkyahoo a{color:#7b0099 !important;border: 1px solid #7b0099 !important;} .shoplinkyahoo img{display:none;}
.shoplinkyahoo a{font-size:10px;}
.booklink-footer{display: none;}
@media screen and (max-width: 680px) {
.booklink-box, .kaerebalink-box{padding:15px;}
.booklink-image, .kaerebalink-image{
width: 100px !important;
min-width: initial;
}
.booklink-name > a, .kaerebalink-name > a{
font-size: 15px;
font-weight: bold;
}
.booklink-name, .kaerebalink-name{margin-bottom:12px;}
.booklink-powered-date, .kaerebalink-powered-date{margin-top:5px;}
.booklink-link2 a,
.kaerebalink-link1 a{
width:calc(100% - 4px);
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
margin: 2px 0px;
padding:10px 0px;
}
} .box17{
margin:2em 0;
position: relative;
padding: 0.5em 1.5em;
border-top: solid 2px black;
border-bottom: solid 2px black;
}
.box17:before, .box17:after{
content: '';
position: absolute;
top: -10px;
width: 2px;
height: -webkit-calc(100% + 20px);
height: calc(100% + 20px);
background-color: black;
}
.box17:before {left: 10px;}
.box17:after {right: 10px;}
.box17 p {
margin: 0; 
padding: 0;
} img.black {
border: 3px solid #000000;
} .marker_yellow_hoso {
background: linear-gradient(transparent 60%, #ffff66 60%);
} .box26 {
position: relative;
margin: 2em 0;
padding: 0.5em 1em;
border: solid 3px #006400;
border-radius: 5px;
}
.box26 p {
margin: 0; 
padding: 0;
} .box27 {
position: relative;
margin: 2em 0;
padding: 0.5em 1em;
border: solid 3px #62c1ce;
}
.box27 .box-title {
position: absolute;
display: inline-block;
top: -27px;
left: -3px;
padding: 0 9px;
height: 25px;
line-height: 25px;
vertical-align: middle;
font-size: 17px;
background: #62c1ce;
color: #ffffff;
font-weight: bold;
border-radius: 5px 5px 0 0;
}
.box27 p {
margin: 0; 
padding: 0;
}
.page .entry-title {
display: none;
} @import url("http://fonts.googleapis.com/earlyaccess/notosansjp.css");
body {
font-family: 'Noto Sans JP', sans-serif;
font-size: 100%;
font-weight:400;
letter-spacing: 0.1em;
} #custom_header > .wrap { opacity: 1 !important; }
#custom_header .wow { visibility: visible !important; animation: none !important; opacity: 1 !important; }
#custom_header { background-color: #71d7dc; background-size: cover !important; }
@media (min-width: 768px) {
#custom_header { min-height: 38.6vw; background-size: 100% auto !important; }
#custom_header > .wrap { padding: 7% 2%; }
#custom_header .header-text { width: 44%; max-width: 500px; margin-left: 0; }
#custom_header .en { font-size: clamp(24px, 3vw, 42px); }
}
@media (max-width: 767px) {
#custom_header { background-image: url(https://gukkin222.com/wp-content/uploads/2017/07/gukkin222_header_sp_4.jpg) !important; background-position: center -18vw !important; background-size: 100% auto !important; padding: 0; }
#custom_header > .wrap { padding: calc(20vw + 10px) 20px 24px; }
#custom_header .header-text { width: 100%; max-width: none; margin: 0; }
#custom_header .en { font-size: 28px; line-height: 1.15; letter-spacing: 0; }
#custom_header .ja { font-size: 13px; line-height: 1.8; }
#custom_header .btn-wrap { margin: 20px 0 0; }
}