@charset "UTF-8";

/*-------------------------
__page_style
-------------------------*/

.hoshou{}
.hoshou h2{ font-size: 2.3em; font-weight: 700; color: #004d9e; vertical-align: middle; margin-bottom: 10px; margin: 0 auto 20px; text-align: center;}
.hoshou h2 span{ vertical-align: middle;}

.hoshou .box01{ margin-bottom: 50px; text-align: center;}
.hoshou .box01 .inner{ width: 860px; height: 310px; background-image: url("images/box01_back@2x.jpg"); background-size: cover; position: relative; margin-bottom: 10px;}
.hoshou .box01 .inner .title01{ position: absolute; top: 20px; left: 40px;}
.hoshou .box01 .inner .title02{ position: absolute; top: 115px; left: 40px;}
.hoshou .box01 p.gray_text{ color: #666666; font-size: 1.4em; line-height: 1.7em;}

.hoshou .box02{ border: 4px solid #004d9e; position: relative; width: 100%; height: auto; padding: 35px; box-sizing: border-box; margin-bottom: 20px;}
.hoshou .box02 .inner{ background-image: url(images/box02_back@2x.png); background-size: 140px 140px; background-position: right top; background-repeat: no-repeat;}
.hoshou .box02 .inner h3{ display: inline-block; background-color: #004d9e; color: #fff; font-size: 2.5em; padding: 18px 40px 12px; box-sizing: border-box; font-weight: 700; border-radius: 30px; position: absolute; top: -28px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); text-align: center;}
.hoshou .box02 .inner .sarani{ width: 140px; height: 60px; position: absolute; top: 0; left: 0; position: absolute; top: -40px; left: 130px;}
.hoshou .box02 .inner .title01{ font-size: 2.6em; color: #004d9e; font-weight: 700; margin: 20px 0 15px; text-align: center;}
.hoshou .box02 .inner .title01 span{ font-size: 1.6em;}
.hoshou .box02 .inner .btm{}
.hoshou .box02 .inner .btm .photo{}
.hoshou .box02 .inner .btm .photo img{}
.hoshou .box02 .inner .btm .text{ position: absolute; top: 130px; right: 35px; width: 280px;}
.hoshou .box02 .inner .btm .text .title02{ font-size: 2.2em; line-height:1.5em; font-weight: 700; margin:0 0 15px 60px; text-align: center;}
.hoshou .box02 .inner .btm .text p.gray_text{ color: #666666; font-size: 1.4em; line-height: 1.7em; padding-left:1em; text-indent:-1em;}

.hoshou .box03{ position: relative; margin-bottom: 30px; text-align: center;}
.hoshou .box03 .inner{}
.hoshou .box03 .inner .title01{ margin-bottom: 10px;}
.hoshou .box03 .inner .illust01{ position: absolute; top: 80px; left: -10px;}
.hoshou .box03 .inner .illust02{ position: absolute; top: 80px; right: -10px;}
.hoshou .box03 .inner .btm{ background-image: url(images/box04_back.gif); background-repeat: repeat; padding: 25px; box-sizing: border-box; display: flex;}
.hoshou .box03 .inner .btm .point_box{ border: 4px solid #004d9e; background-color: #fff; border-radius: 5px; width:calc(100% - 25px / 2); filter: drop-shadow(2px 2px 3px rgba(30,0,0,.4));}
.hoshou .box03 .inner .btm .point_box:nth-child(1){ margin-right: 25px;}
.hoshou .box03 .inner .btm .point_box:nth-child(2){}
.hoshou .box03 .inner .btm .point_box .title{ background-color: #004d9e; color: #fff; font-size: 2em; padding: 10px 0; box-sizing: content-box; font-weight: bold;}
.hoshou .box03 .inner .btm .point_box .point_box_inner{ padding: 10px; box-sizing: border-box;}
.hoshou .box03 .inner .btm .point_box dl{ display: flex; align-items: center; justify-content: center; margin: 10px 0;}
.hoshou .box03 .inner .btm .point_box dl dt{ margin-right: 10px;}
.hoshou .box03 .inner .btm .point_box dl dt span{ color: #fff; font-size: 1.8em; background-color: #fa8200; font-weight: 700; padding: 5px 20px 3px; box-sizing: border-box; border-radius: 20px;}
.hoshou .box03 .inner .btm .point_box dl dd{ color: #004d9e; font-size: 2.5em; font-weight: 700;}
.hoshou .box03 .inner .btm .point_box p{ color: #004d9e; font-size: 2.5em; line-height: 1.5em; font-weight: 700;}
.hoshou .box03 .inner .btm .point_box p span{ display: inline-block; color: #fff; font-size: 0.8em; line-height: 1em; background-color: #fa8200; font-weight: 700; padding: 10px 20px 5px; box-sizing: border-box; border-radius: 20px;}

.hoshou .title01{ margin-bottom: 10px;}
.hoshou .color_orange{ color: #ea5514; font-weight: bold;}
.hoshou .color_blue{ color: #0062b1; font-weight: bold;}

.hoshou .box04,
.hoshou .box05{ border: 6px solid #ea5514;}

.hoshou .kashi_detail{ box-sizing: border-box; border-radius: 15px; padding: 35px; position: relative; margin-bottom: 20px;}
.hoshou .kashi_detail .icon{ position: absolute; top: -20px; left: 20px;}
.hoshou .kashi_detail .title{ margin-bottom: 20px; margin-left: 90px;}
.hoshou .kashi_detail .title .title01{ display: inline; font-size: 3em; color: #ea5514; font-weight: 700; margin-right: 10px;}
.hoshou .kashi_detail .title .title02{ display: inline; font-size: 2em; font-weight: 700;}
.hoshou .kashi_detail .com{ display: flex; justify-content: space-between;}
.hoshou .kashi_detail .com .com01{ width: 42px;}
.hoshou .kashi_detail .com .com02{ width: calc(100% - 62px); font-size: 1.4em; line-height: 1.7em; margin-bottom: 10px;}
.hoshou .kashi_detail .btm{ display: flex; justify-content: space-between;}
.hoshou .kashi_detail .btm .left{ width: 203px;}
.hoshou .kashi_detail .btm .right{ width: calc(100% - 270px); border: 3px dashed #ea5514; border-radius: 10px; padding: 20px; box-sizing: border-box; position: relative;}
.hoshou .kashi_detail .btm .right p{font-size: 1.4em; line-height: 1.7em;}
.hoshou .kashi_detail .btm .right p img{ width: 100%; height: auto;}
.hoshou .kashi_detail .btm .right::before{ content: ""; display: block; width: 15px; height: 15px; background-color: #ea5514; border-radius: 50%; position: absolute; top: 90px; left: -65px;}
.hoshou .kashi_detail .btm .right::after{ content: ""; display: block; border-bottom: 3px dashed #ea5514; width: 50px; position: absolute; top: 96px; left: -50px;}

.hoshou .box06{ border: 6px solid #f39700; box-sizing: border-box; border-radius: 15px; padding: 40px; margin-bottom: 40px;}
.hoshou .box06 .title .title01{ color: #f39700;}
.hoshou .box06 .btm{ display: block!important;}
.hoshou .box06 .btm ul li:nth-child(2),
.hoshou .box06 .btm ul li:nth-child(3){ margin-bottom: 25px;}
.hoshou .box06 .btm ul li img{ width: 100%; height: auto;}
.hoshou .box06 .btm p{ font-size: 1.7em; color: #fff; background-color: #f39700; padding: 10px 0; font-weight: 700; border-radius: 10px; text-align: center;}

.hoshou .box07{ margin-bottom: 40px;}
.hoshou .box07 a img{ transition: all .3s;}
.hoshou .box07 a:hover img{ opacity:0.5;}

.hoshou h4{font-size: 2em;font-weight: 700;line-height: 1em;color: #004D9E;margin-bottom: 18px;padding: 16px 0 21px 16px;background-image: url("/images/shop/line_02@2x.png");-webkit-background-size: contain;background-size: contain;background-position: bottom;background-repeat: no-repeat;position: relative;}
.hoshou h4::before{content: "";width: 5px;height: 20px;background-color: #004D9E;position: absolute;top: 16px;left: 0;}
.hoshou h4::after{content: "";width: 110px;height: 62px;background-image: url("/images/shop/character_01@2x.png");-webkit-background-size: contain;background-size: contain;background-repeat: no-repeat;position: absolute;bottom: 6px;right: 0;}

.hoshou .box08{ display: flex; margin-bottom: 30px;}
.hoshou .box08 dl{ width:calc(100% - 25px / 2);}
.hoshou .box08 dl:nth-child(1){ margin-right: 25px;}
.hoshou .box08 dl dt{ margin-bottom: 10px; text-align: center;}
.hoshou .box08 dl dt a{ display: block; height: 170px; text-decoration: none; color: #fff; position: relative; transition: all .3s;}
.hoshou .box08 dl dt a:hover{ opacity:0.5;}
.hoshou .box08 dl:nth-child(1) dt a{ background-image: url(images/media.jpg); background-size: cover; background-position: center;}
.hoshou .box08 dl:nth-child(2) dt a{ background-image: url(images/photo.jpg); background-size: cover; background-position: center;}
.hoshou .box08 dl dt a span{ display: inline-block; font-size: 2.1em; background-color: #004d9e; padding: 12px 15px 9px; font-weight: 700; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
.hoshou .box08 dl:nth-child(1) dt a span{ width: 290px;}
.hoshou .box08 dl dd{  font-size: 1.4em; line-height: 1.6em;}

.hoshou .box09{ margin-bottom: 30px;}
.hoshou .box09 .inner{ background-image: url(images/contact.jpg); background-size: cover; background-position: center; padding: 50px 0; text-align: center;}
.hoshou .box09 .inner a{ display: inline-block; background-color: #38a4e7; color: #fff; text-decoration: none; font-size: 2em; line-height: 1.4em; font-weight: 700; padding: 20px 60px; box-sizing: border-box; border-radius: 5px; margin-bottom: 10px; transition: all .3s;}
.hoshou .box09 .inner a span{ }
.hoshou .box09 .inner a span:before{ content: ""; background-image: url(images/box08_icon@2x.png); background-size: 28px 28px; padding-left: 30px;}
.hoshou .box09 .inner a:hover{ opacity:0.5;}
.hoshou .box09 .inner p{ font-size: 1.7em; line-height: 1.4em; color: #fff;}

.hoshou .box10{ width:100%; height:300px; overflow-x: hidden; overflow-y: scroll; font-size: 1.3em; line-height: 1.6em; padding: 20px; box-sizing: border-box; border: 1px solid #ddd; margin-bottom: 50px;}
.hoshou .box10 dl{ margin-bottom: 15px;}
.hoshou .box10 dl dt{ font-weight: 700; color: #004d9e;}
.hoshou .box10 dl dd{}
.hoshou .box10 ul li{ padding-left:1em; text-indent:-1em;}



/* ==============メディア掲載============== */

.media{ text-align: left;}
.media h2{font-size: 18px; font-weight: 700; text-align: left; color: #004D9E; margin-bottom: 18px; padding-bottom: 18px; position: relative;}
.media h2:after{content: ""; width: 100%; height: 17px; background-image: url(/images/shop/line_01@2x.png); -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; position: absolute; left: 0; bottom: 0;}
.media ul li{ display: flex; margin-bottom: 40px;}
.media ul li .pic{ border: 4px solid #EBEBEB; width: auto; height: 240px; margin-right: 25px;}
.media ul li .pic a{ display: block;}
.media ul li .pic a img{transition: all .3s;}
.media ul li .pic a:hover img{opacity: 0.5;}
.media ul li .data{ width: 100%;}
.media ul li .data h3{ background-color: #004D9E; padding: 15px 15px 13px; box-sizing: border-box; margin-bottom: 20px;}
.media ul li .data h3 span{ font-size: 18px; font-weight: 700; color: #fff;}
.media ul li .data p{ font-size: 15px; line-height: 21px; margin-bottom: 30px;}
.media ul li .data a{ width: 160px; font-size: 15px; line-height: 21px; display: block; margin: 0 auto; background-color: #9ABADD; color: #fff; text-decoration: none; padding: 10px 15px; box-sizing: border-box; border-radius: 5px; transition: all .3s;}
.media ul li .data a:hover{opacity: 0.5;}
.media ul li .data a span{ display: inline-block; background-image:url(images/arrow.png); background-size:20px 20px; background-repeat:no-repeat; background-position:right; padding-right:25px;}

/* ==============検査時の様子============== */

.gallery{}
.gallery h2{font-size: 18px; font-weight: 700; text-align: left; color: #004D9E; margin-bottom: 18px; padding-bottom: 18px; position: relative;}
.gallery h2:after{content: ""; width: 100%; height: 17px; background-image: url(/images/shop/line_01@2x.png); -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; position: absolute; left: 0; bottom: 0;}
.gallery ul{display:flex;ms-flex-wrap:wrap;flex-wrap:wrap;margin:0 0 20px;}
.gallery ul li{width:calc((100% - 108px)/5);margin:0 27px 25px 0;}
.gallery ul li:nth-child(5n){margin-right:0;}


