@charset "utf-8";

html {
	scroll-behavior: smooth;
}


/* page_head
----------------------------------------------------------- */

.teiki-page_head {
	margin-bottom: 20px;
	background: center / cover url(../../images/teiki/teiki-head_bg.webp);
}
.teiki-page_head__title {
	padding: .65em .5em;
	background: center / cover url(../../images/teiki/teiki-head_title_bg.webp);
	font-size: min(2.25rem,6vw);
	font-weight: 500;
	text-align: center;
	line-height: 1.2;
}
.teiki-page_head__title .fs--large {
	font-size: 133.3333%;
}
.teiki-page_head__body {
	padding: 20px 20px 40vw;
	background: center bottom / 100% auto url(../../images/teiki/teiki-head_img01_sp.webp) no-repeat;
	font-size: min(1.625rem,4.5vw);
}

@media only screen and (min-width: 768px) {
	.teiki-page_head__body {
		padding: 60px 20% 60px 40px;
		background: right center / auto 100% url(../../images/teiki/teiki-head_img01.webp) no-repeat;
		line-height: 1.8;
	}
}


/* title
----------------------------------------------------------- */

.teiki-title_block {
	position: relative;
	margin-bottom: 25px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	text-align: center;
}
.teiki-title_block.navy {
	background: var(--color-primary);
	color: var(--color-white);
}
.teiki-title_block.no-round {
	border-radius: 0;
}
.teiki-title_block.pink {
	background: #cc6666;
	color: var(--color-white);
}
.teiki-title_block.tabekata {
	margin-bottom: 0;
	background: center bottom / cover url(../../images/teiki/teiki-tabekata_title.webp);
}
.teiki-title_block:not(.tabekata)::after {
	position: absolute;
	content: '';
	left: calc(50% - 16px);
	bottom: -18px;
	width: 32px;
	height: 20px;
	background: inherit;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.teiki-title_block h2 {
	padding: 1em .5em;
	font-size: min(3rem,6.5vw);
	font-weight: 500;
	line-height: 1.2;
}
.teiki-title_block.tabekata h2 {
	padding: .75em .5em 2.5em;
}
.teiki-title_block .fs--large {
	font-size: 120%;
}
.teiki-title_block .fs--xlarge {
	font-size: 136%;
}

@media only screen and (min-width: 768px) {
	.teiki-title_block h2 {
		padding: .4em .5em;
	}
	.teiki-title_block.tabekata h2 {
		padding: .2em .5em 1.5em;
	}
}


/* contnent
----------------------------------------------------------- */

.teiki-contnent {
	margin-bottom: 20px;
}
.teiki-contnent--sky {
	background: #e8edf3;
}
.teiki-contnent--tabekata {
	background: center / cover url(../../images/teiki/teiki-tabekata_bg.webp);
}

.teiki-contnent + .teiki-title_block {
	margin-top: 60px;
}


/* osusume
----------------------------------------------------------- */

.teiki-osusume {
	padding: 20px;
}



/* tabekata
----------------------------------------------------------- */

.teiki-tabekata {
	padding: 20px;
}
.teiki-tabekata__list {
	display: flex;
	flex-direction: column;
	gap: 60px;
	max-width: 75%;
	margin-inline: auto;
}
.teiki-tabekata__list li {
	position: relative;
}

@media only screen and (max-width: 767px) {
	.teiki-tabekata__list li:not(:last-child)::after {
		position: absolute;
		content: '';
		left: calc(50% - 24px);
		bottom: -60px;
		width: 50px;
		height: 44px;
		background: center / contain url(../../images/teiki/icon_arrow.svg) no-repeat;
		transform: rotate(90deg);
	}
}

@media only screen and (min-width: 768px) {
	.teiki-tabekata__list {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 40px 80px;
		max-width: 980px;
	}
	.teiki-tabekata__list li {
		width: calc((100% - 80px) / 2);
	}
	.teiki-tabekata__list li:first-child::after {
		position: absolute;
		content: '';
		top: calc(50% - 26px);
		right: -70px;
		width: 60px;
		height: 52px;
		background: center / contain url(../../images/teiki/icon_arrow.svg) no-repeat;
	}
}


/* point
----------------------------------------------------------- */

.teiki-point {
	padding: 20px;
}


@media only screen and (min-width: 768px) {
}


/* 
----------------------------------------------------------- */




@media only screen and (min-width: 768px) {
}


/* 
----------------------------------------------------------- */




@media only screen and (min-width: 768px) {
}