@charset "utf-8";
/* ------------------------------------------------------------ common */
#bread-list{ margin: 1% 2.5%; }
#bread{ display: flex; align-items: center; }
#bread li{ font-size: 14px; }
#bread a{ position: relative; padding: 0 35px 0 0; color: #000; }
#bread a:after{ position: absolute; right: 12px; top: 8px; content: ""; width: 7px; height: 7px; border-top: 1px solid #000; border-right: 1px solid #000; transform: rotate(45deg); }

.toppage{ margin: 107px auto 160px; }
.arrow-btn__link{ position: relative; margin: 0 auto; width: 390px; height: 80px; display: flex; align-items: center; justify-content: center; font-size: 16px; border: 1px solid #000; border-radius: 100px; color: #000; }
.arrow-btn__link img{ position: absolute; right: 20px; top: 50%; transform: translate(0,-50%); }
.arrow-btn__link:hover{ background: #DCF3E8; }

.pagers{ display:flex; gap:11px; justify-content:center; }
.pagers a{ display:flex; align-items:center; justify-content:center; width:43px; height:43px; border:1px solid #E3E3E3; text-decoration:none; color:#000; font-size:16px; background:#fff; font-family:"neue-haas-grotesk-display", sans-serif; font-weight:500; font-style:normal; }
.pagers a.is-active,
.pagers a:hover{ color:var(--main-color); background: #DCF3E8; border-color: var(--main-color); }

.line-title{ position: relative; margin: 0 0 65px; padding: 0 0 20px; text-align: center; font-size: 30px; font-family: 'Noto-Sans-JP-Medium'; }
.line-title:before{ position: absolute; content: ""; left: 50%; bottom: 0; transform: translate(-50%,0); width: 88px; height: 2px; background: #0AA360; }


/* ------------------------------------------------------------ fv */
.fv-split__wrap{ position: relative; display: flex; align-items: center; }
.fv-split__wrap:before{ z-index: -1; position: absolute; content: ""; left: 0; bottom: -100px; width: 443px; height: 472px; background: #F7F3EF; border-radius: 0 20px 20px 0; }
.fv-split__meta{ position: relative; padding-left: 2.5%; }
.fv-split__title{ font-size: 36px; font-family: 'Noto-Sans-JP-Bold'; }
.fv-split__title span{ display: block; padding: 15px 0 0; font-size: 16px; color: var(--main-color); font-family: "neue-haas-grotesk-display", sans-serif; font-weight: 600; font-style: normal; }
.fv-split__img{ width: 80%; margin: 0 0 0 auto; }
.fv-split__img img{ width: 100%; height: auto; border-radius: 20px 0 0 20px; }

#fv-normal{ position: relative; padding: 110px 0; text-align: center; }
#fv-normal:before{ z-index: -1; position: absolute; content: ""; left: 0; top: 0; width: 95%; height: 100%; background: #F7F3EF; border-radius: 0 20px 20px 0; }
.fv-normal_title{ font-size: 36px; font-family: 'Noto-Sans-JP-Bold'; }
.fv-normal_title span{ display: block; padding: 15px 0 0; color: var(--main-color); font-family: "neue-haas-grotesk-display", sans-serif; font-weight: 600; font-style: normal; }


/* ------------------------------------------------------------ cta */
.cta{ background:#F8F7F1; padding:40px 0; }
.cta-box{ width:750px; margin:0 auto; background:#fff; border-radius:19px; padding:40px 40px 56px; text-align:center; }
.cta-ttl{ margin:0 0 18px; font-size:29px; font-family:'Noto-Sans-JP-Bold'; line-height:1.5; }
.cta-txt{ margin:0 0 30px; font-size:18px; line-height:1.5; }

.cta-btn{}
.cta-btn-link{ position:relative; display:flex; justify-content:center; align-items:center; width:368px; height:70px; margin:0 auto; background:#F39801; border-radius:100px; color:#fff!important; text-decoration:none; font-family:'Noto-Sans-JP-Bold'; font-size:18px; box-shadow:0 6px 0 #D88700; transition:all 0.4s; }
.cta-btn-item{ position:absolute; left:30px; top:50%; transform:translate(0,-50%); }
.cta-btn-link:hover{ transform: translateY(5px); }




/* ------------------------------------------------------------ mobile ------------------------------------------------------------ */
@media only screen and (max-width: 768px) {
	
/* ------------------------------------------------------------ common */
	#bread-list{ overflow-x: scroll; margin: 5%; }
	#bread { width: 700px; }
	#bread li{ font-size: 11px; }
	#bread a{ padding:0 24px 0 0; }
	#bread a::after{ right: 10px; top: 7px; width: 5px; height: 5px; }
	
	.toppage{ margin: 50px 0; }
	.arrow-btn__link{ width: 90%; height: 60px; font-size: 15px; }
	
	.line-title{ margin: 0 0 35px; font-size: 20px; }
	.line-title:before{ width: 55px; }
	
	.pagers{ gap: 5px; }
	.pagers a{ width: 30px; height: 30px; }
	

/* ------------------------------------------------------------ fv */
	.fv-split__wrap{ align-items: flex-start; flex-direction: column; }
	.fv-split__wrap::before{ bottom: initial; width: 85%; height: 150px; top: 0; }
	.fv-split__meta{ width: 100%; padding: 25px 30px 20px; }
	.fv-split__title{ font-size: 27px; }
	.fv-split__title span{ padding: 12px 0 0; font-size: 14px; }
	.fv-split__img{ width: 95%; }
	
	#fv-normal{ padding: 50px 0; }
	.fv-normal_title{ font-size: 25px; }
	.fv-normal_title span{ font-size: 14px; }


/* ------------------------------------------------------------ cta */
	.cta{ padding: 32px 0; }
	.cta-box{ width: calc(100% - 32px); padding: 28px 20px 36px; border-radius: 16px; }
	.cta-ttl{ margin: 0 0 14px; font-size: 20px; line-height: 1.4; }
	.cta-txt{ margin: 0 0 22px; font-size: 14px; line-height: 1.6; }
	
	.cta-btn-link{ width: 100%; height: 55px; font-size: 16px; box-shadow: 0 5px 0 #D88700; }
	.cta-btn-item{ left: 18px; }

		
}
