@charset "utf-8";

.sub-visual {width: 100%; height:360px; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.sub-visual01 {background-image: url('../img/sub/sub_visual01.jpg');}
.sub-visual02 {background-image: url('../img/sub/sub_visual02.jpg');}
.sub-visual03 {background-image: url('../img/sub/sub_visual03.jpg');}
.sub-visual04 {background-image: url('../img/sub/sub_visual04.jpg');}
.sub-visual .text-box {display: flex; justify-content: center; align-items: center; height: 100%; text-align: center;}
.sub-visual h2 {font-family: 'poppins'; font-size: 75px; font-weight: 700; line-height: 1em; background-clip: text; -webkit-background-clip: text; color: transparent;}
.sub-visual01 h2 {background-image: url('../img/sub/sub_visual_text_bg01.jpg');}
.sub-visual02 h2 {background-image: url('../img/sub/sub_visual_text_bg02.jpg');}
.sub-visual03 h2 {background-image: url('../img/sub/sub_visual_text_bg03.jpg');}
.sub-visual04 h2 {background-clip: unset; -webkit-background-clip: unset; color: #fff;}

.real-cont {padding: 117px 0 180px;}
.real-cont.type02 {padding-bottom: 0;}
.page-title {position: relative; max-width: 1600px; margin: 0 auto 60px; padding: 0 15px 55px; border-bottom: 1px solid #ddd;}
.page-title:after {position: absolute; bottom: -3px; left: 50%; transform: translateX(-50%); content: ''; width: 32px; height: 5px; background: #000;}
.page-title h3 {font-family: 'wanted sans'; font-size: 22px; font-weight: 600; line-height: 1em; color: rgba(0,0,0,0.3); text-align: center; margin-bottom: 17px;}
.page-title p {font-family: 'wanted sans'; font-size: 32px; line-height: 1.5em; color: #000; text-align: center;}
.page-title p b {font-weight: 600;}

/* sub01 */
.about .cont01 ul {display: flex; justify-content: center; flex-wrap: wrap;}
.about .cont01 ul li {max-width: 320px; width: 100%; margin-right: 85px;}
.about .cont01 ul li:nth-child(2) {margin-top: 60px;}
.about .cont01 ul li:nth-child(3) {margin-right: 0;}
.about .cont01 ul li .img-box {margin-bottom: 15px;}
.about .cont01 ul li .text-box {text-align: center; padding: 0 10px;}
.about .cont01 ul li .text-box p.num {font-family: 'wanted sans'; font-size: 36px; font-weight: 700; line-height: 1em; color: #ddd; margin-bottom: 12px;} 
.about .cont01 ul li .text-box p {font-size: 24px; line-height: 1.58em; color: #333;}
.about .backdrop {max-width: 1871px; width: 100%; height: 138px; background-image: url('../img/sub/about_bg.png'); background-repeat: no-repeat; background-position: center bottom; background-size: contain; margin: 75px auto 0;}

/* sub02 */
.area ul {display: flex; justify-content: center; flex-wrap: wrap; margin: -10px;}
.area ul li {width: 100%; margin: 10px;}
.area ul li .inner {position: relative;}
.area ul li .img-box {width: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.area ul li .text-box {position: absolute; top: 0; left: 0; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; padding: 50px;}
.area ul li .text-box p.num {font-family: 'wanted sans'; font-size: 22px; font-weight: 600; line-height: 1em; color: #fff; opacity: 0.6; text-align: right;}
.area ul li .text-box p {font-family: 'wanted sans'; font-size: 24px; font-weight: 600; line-height: 1.16em; color: #fff;}

.area .cont01 {margin-bottom: 138px;}
.area .cont01 ul li {max-width: 520px;}
.area .cont01 ul li .img-box {height: 320px;}
.area .cont01 ul li:nth-child(1) .img-box {background-image: url('../img/sub/area_img01.jpg');}
.area .cont01 ul li:nth-child(2) .img-box {background-image: url('../img/sub/area_img02.jpg');}
.area .cont01 ul li:nth-child(3) .img-box {background-image: url('../img/sub/area_img03.jpg');}

.area .cont02 ul li {max-width: 250px;}
.area .cont02 ul li .img-box {height: 240px;}
.area .cont02 ul li:nth-child(1) .img-box {background-image: url('../img/sub/area_method_img01.jpg');}
.area .cont02 ul li:nth-child(2) .img-box {background-image: url('../img/sub/area_method_img02.jpg');}
.area .cont02 ul li:nth-child(3) .img-box {background-image: url('../img/sub/area_method_img03.jpg');}
.area .cont02 ul li:nth-child(4) .img-box {background-image: url('../img/sub/area_method_img04.jpg');}
.area .cont02 ul li:nth-child(5) .img-box {background-image: url('../img/sub/area_method_img05.jpg');}
.area .cont02 ul li:nth-child(6) .img-box {background-image: url('../img/sub/area_method_img06.jpg');}
.area .cont02 ul li .text-box {padding: 38px 40px 35px;}

/* sub04 */
.contact .map iframe {width:100%; height: 420px; margin-bottom: 30px;}
.contact .details {display: flex; justify-content: space-between; flex-wrap: wrap;}
.contact .details .btn-wrap ul {display: flex;}
.contact .details .btn-wrap ul li {margin-left: 8px;}
.contact .details .btn-wrap ul li:nth-child(1) {margin-left: 0;}
.contact .details .btn-wrap ul li a {position: relative; display: inline-block; width: 160px; line-height: 53px; font-family: 'wanted sans'; font-size: 18px; padding-left: 30px; border: 1px solid #000; background: #fff; color: #000; transition: all 0.5s;}
.contact .details .btn-wrap ul li a:hover {background: #000; color: #fff;}
.contact .details .btn-wrap ul li a:after {position: absolute; top: 50%; right: 24px; margin-top: -7px; content: ''; width: 8px; height: 14px; background-image: url('../img/sub/contact_arrow.png'); background-repeat: no-repeat; background-position: right center; transition: all 0.5s;}
.contact .details .btn-wrap ul li a:hover:after {background-image: url('../img/sub/contact_arrow_hover.png');}
.contact .details .info {width: 1%; flex: 1 1 auto;}
.contact .details .info dl {display: flex; margin-bottom: 8px;}
.contact .details .info dt {max-width: 63px; width: 100%; font-family: 'wanted sans'; font-size: 22px; font-weight: 600; line-height: 1.3em; color: #000;}
.contact .details .info dd {width: calc(100% - 63px); font-family: 'wanted sans'; font-size: 22px; line-height: 1.3em; color: #666;}