@charset "UTF-8";



.hero{ position: relative; }
.hero .cap{ position: absolute; bottom: 0; left: 0; background-color: rgba(0,0,0,.5); padding: 3px; font-size: 12px; color: #fff; line-height: 1; }
.mainContent .intro{ padding: 90px 0; text-align: center; }
.mainContent .intro .ttl{ font-size: 28px; line-height: 1.5; color: #606060; font-weight: normal; }
.mainContent .intro .ttl .marker{ color: #bea257; }
.mainContent .intro .ttl .marker .l-size{ font-size: 166%; line-height: 1; }
.mainContent .intro .txt{ font-size: 16px; line-height: 2; margin: 50px auto 0; }
.mainContent .navi-body{ background-color: #f9f7ee; padding: 90px 0; text-align: center; }
.mainContent .navi-body .copy{ font-size: 28px; line-height: 1.5; color: #bea257; }
.mainContent .navi-body .navi-list{ width: 100%; max-width: 1112px; margin: 50px auto 0; display: -ms-flex; display: flex; justify-content: space-between; }
.mainContent .navi-body .navi-list .navi{ width: 18.44%; }
.mainContent .point-list{ padding: 80px 0; max-width: 1400px; margin: 0 auto; }
.mainContent .point-list .point{ display: -ms-flex; display: flex; align-items: flex-start; }
.mainContent .point-list .point:nth-child(even){ flex-direction: row-reverse; }
.mainContent .point-list .point:nth-child(n+2){ margin-top: 70px; }
.mainContent .point-list .point .photo-body{ width: 50%; height: 465px; position: relative; overflow: hidden; }
.mainContent .point-list .point .photo-body .photo{ width: 700px; position: absolute; left: 50%; top: 0; margin-left: -350px; }
.mainContent .point-list .point .photo-body .caption{ position: absolute; bottom: 0; left: 0; background-color: rgba(0,0,0,.5); padding: 3px; font-size: 12px; color: #fff; line-height: 1; }
.mainContent .point-list .point .txt-body{ width: 510px; }
.mainContent .point-list .point:nth-child(odd) .txt-body{ margin-left: 46px; }
.mainContent .point-list .point:nth-child(even) .txt-body{ margin-right: 46px; }
.mainContent .point-list .point .txt-body .head{ display: -ms-flex; display: flex; align-items: center; }
.mainContent .point-list .point .txt-body .head .num-body{ background-color: #a88f6a; text-align: center; width: 90px; height: 90px; position: relative; }
.mainContent .point-list .point .txt-body .head .num-body::before{ content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: calc(100% - 8px); height: calc(100% - 8px); border: 1px solid rgba(255,255,255,0.7); }
.mainContent .point-list .point .txt-body .head .num-body .inner{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.mainContent .point-list .point .txt-body .head .num-body .sub{ font-size: 12px; line-height: 1.2; color: #ffffff; }
.mainContent .point-list .point .txt-body .head .num-body .num{ font-size: 50px; line-height: 1; font-family: "Oswald", serif; color: #ffffff; }
.mainContent .point-list .point .txt-body .head .ttl{ margin-left: 10px; flex: 1; color: #bea257; font-size: 28px; line-height: 1.5; font-weight: normal; }
.mainContent .point-list .point .txt-body .txt{ font-size: 16px; line-height: 1.88; margin-top: 20px; }
.mainContent .point-list .point .txt-body .note{ border: 2px solid #b9c8d0; padding: 20px; border-radius: 20px; position: relative; margin-top: 40px; font-size: 16px; line-height: 2; }
.mainContent .point-list .point .txt-body .note::before{ content: ""; position: absolute; left: 0; bottom: 100%; margin-bottom: -20px; background: url(../images/inspect/i01.png) center center no-repeat; background-size: contain; width: 35px; height: 62px; }

@media screen and (max-width: 1120px){
	.hero .cap{ font-size: 1.071vw; }
	.mainContent .intro .ttl{ font-size: 2.5vw; }
	.mainContent .intro .txt{ font-size: 1.429vw; }
	.mainContent .navi-body .copy{ font-size: 2.5vw; }
	.mainContent .point-list .point .photo-body{ height: auto;  }
	.mainContent .point-list .point .photo-body .photo{ position: relative; width: 100%; left: 0; margin-left: 0; }
	.mainContent .point-list .point .photo-body .caption{ font-size: 1.071vw; }
	.mainContent .point-list .point .txt-body{ width: 46%; }
	.mainContent .point-list .point:nth-child(odd) .txt-body{ margin-left: 4%; }
	.mainContent .point-list .point:nth-child(even) .txt-body{ margin-right: 4%; }
	.mainContent .point-list .point .txt-body .head .num-body{ width: 8.04vw; height: 8.04vw; }
	.mainContent .point-list .point .txt-body .head .num-body .sub{ font-size: 1.07vw; }
	.mainContent .point-list .point .txt-body .head .num-body .num{ font-size: 4.46vw; }
	.mainContent .point-list .point .txt-body .head .ttl{ font-size: 2.5vw; }
	.mainContent .point-list .point .txt-body .txt{ font-size: 1.429vw; }
	.mainContent .point-list .point .txt-body .note{ font-size: 1.429vw; }
}
@media screen and (max-width: 768px){
	.hero .cap{ font-size: 2.604vw; }
	.mainContent .intro{ padding: 10% 5%; }
	.mainContent .intro .ttl{ font-size: 4vw; }
	.mainContent .intro .txt{ font-size: 3.125vw; margin-top: 7%; text-align: left; }
	.mainContent .navi-body{ padding: 10% 5%; }
	.mainContent .navi-body .copy{ font-size: 4vw; }
	.mainContent .navi-body .navi-list{ margin-top: 7%; flex-wrap: wrap; justify-content: center; }
	.mainContent .navi-body .navi-list .navi{ width: 30%; margin: 0 1%; }
	.mainContent .navi-body .navi-list .navi:nth-child(n+4){ margin-top: 2%; }
	.mainContent .point-list{ padding: 10% 5%; }
	.mainContent .point-list .point{ display: block; }
	.mainContent .point-list .point:nth-child(n+2){ margin-top: 10%; }
	.mainContent .point-list .point .photo-body{ width: 100%; }
	.mainContent .point-list .point .photo-body .caption{ font-size: 2.604vw; }
	.mainContent .point-list .point .txt-body{ width: auto; margin-top: 3%; }
	.mainContent .point-list .point:nth-child(odd) .txt-body{ margin-left: 0; }
	.mainContent .point-list .point:nth-child(even) .txt-body{ margin-right: 0; }
	.mainContent .point-list .point .txt-body .head .num-body{ width: 14vw; height: 14vw; }
	.mainContent .point-list .point .txt-body .head .num-body .sub{ font-size: 1.56vw; }
	.mainContent .point-list .point .txt-body .head .num-body .num{ font-size: 6.51vw; }
	.mainContent .point-list .point .txt-body .head .ttl{ font-size: 4vw; }
	.mainContent .point-list .point .txt-body .txt{ font-size: 3.125vw; margin-top: 3%; }
	.mainContent .point-list .point .txt-body .note{ font-size: 3.125vw; }
}