@charset "utf-8";

@media screen and (max-width:768px) {
	body {
		background-color: #e9edf0;
	}
}

/* kv */
.kv {
	height: 100%;
	height: 100vh;
	height: 100dvh;
	overflow: hidden;
}
.kv__inner,
.kv__blocks {
	height: 100%;
}
.kv__blocks {
	display: grid;
	grid-template-columns: 20fr 93fr 31fr;
	position: relative;
}
.kv__blocks::before {
	content: '';
	display: block;
	height: 100%;
	background-color: #e19577;
}
.scroll-down {
	color: #263747;
	text-decoration: none;
  position: absolute;
	bottom: calc(1.5 * var(--fontCoef));
  left: 7%;
  transform: rotate(90deg) translate(-100%, 50%) ;
  transform-origin: left bottom;
}
.scroll-down .text {
  padding-right: calc(6.4 * var(--fontCoef));
  font-size: calc(1.4 * var(--fontCoef));
  position: relative;
}
.scroll-down .text .icon,
.scroll-down .text::before,
.scroll-down .text::after {
  content: '';
  display: block;
  position: absolute;
}
.scroll-down .text .icon {
	width: calc(5.2 * var(--fontCoef));
  height: calc(0.1 * var(--fontCoef));
  background-color: #ccc;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
}
.scroll-down .text::before {
  width: calc(5.2 * var(--fontCoef));
  height: calc(0.1 * var(--fontCoef));
  background-color: #263747;
  animation: scroll-bar 3s infinite linear;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
	z-index: 1;
}
.scroll-down .text::after {
  aspect-ratio: 1;
  width: calc(1 * var(--fontCoef));
  border-radius: 50%;
  animation: scroll-dot 3s infinite linear;
  top: 50%;
  right: calc(5.2 * var(--fontCoef));
  background-color: #263747;
  transform: translate(0, -50%) scale(0.1);
}
.block-main {
	height: 100%;
	position: relative;
}
.kv-slider {
	height: 100%;
}
.slide {
	position: relative;
}
.slide img {
	height: 100%;
	object-fit: cover;
	object-position: center;
	position: absolute;
	left: 0;
	top: 0;
}
.indicator-container {
	position: absolute;
	left: 100%;
	bottom: 2.4rem;
	transform: translate(2.75rem, 0);
}
.indicator-container > li {
	line-height: 1.6;
}
.indicator-button {
	aspect-ratio: 1/1;
	width: 0.5rem;
	height: 0.5rem;
	padding: 0;
	border: 0;
	outline: none;
	border-radius: 50%;
	background-color: #b9bfc4;
}
.indicator-button.is-active {
	background-color: #263747;
}
.site-name {
	color: #fff;
	font-size: 7.7rem;
	text-transform: uppercase;
	line-height: 1.11;
	opacity: 0.7;
	position: absolute;
	top: 7.8rem;
	left: 0;
	transform: rotate(90deg) translate(0, -72%);
	transform-origin: top left;
}
.site-copy {
	color: #fff;
	font-size: 3.6rem;
	line-height: 1.56;
	letter-spacing: 0.025em;
	position: absolute;
	top: 8.8rem;
	right: 2.6rem;
}
.block-logo {
	display: flex;
	justify-content: center;
	padding-top: var(--headerHeight);
	background-color: #e9edf0;
}
.site-logo {
	width: 26.6%;
	padding: 6.76rem 0;
}
@media screen and (max-width:768px) {
	.kv {
		height: auto;
		background-color: #e9edf0;
	}
	.kv__blocks {
		min-height: calc(100% - var(--headerHeight));
		min-height: calc(100vh - var(--headerHeight));
		min-height: calc(100dvh - var(--headerHeight));
		grid-template-columns: 250fr 125fr;
	}
	.kv__blocks::before {
		display: none;
	}
	.block-main {
		padding-bottom: calc(13.2 * var(--fontCoef));
	}
	.kv-slider {
		padding-top: calc(7.5 * var(--fontCoef));
	}
	.indicator-container {
		gap: calc(1 * var(--fontCoef));
		bottom: auto;
		top: 100%;
		left: auto;
		right: 0;
		transform: none;
	}
	.indicator-button {
		width: calc(0.4 * var(--fontCoef));
		height: calc(0.4 * var(--fontCoef));
	}
	.block-logo {
		padding-top: 0;
	}
	.site-logo {
		width: 46.4%;
		padding-top: calc(4 * var(--fontCoef));
		pointer-events: none;
	}
	.site-name {
		font-size: calc(4.484 * var(--fontCoef));
		top: 0;
		left: calc(3.2 * var(--fontCoef));
		transform: rotate(90deg) translate(0, -100%);
	}	
	.site-copy {
		width: 100%;
		color: #263747;
		font-size: calc(2 * var(--fontCoef));
		top: auto;
		right: auto;
		bottom: calc(3.8 * var(--fontCoef));
		left: calc(4.4 * var(--fontCoef));
		pointer-events: none;
	}
	.scroll-down {
		bottom: 0;
		left: auto;
		right: calc(-5.5 * var(--fontCoef));
		transform: rotate(90deg) translate(-100%, 0);
	}
	.scroll-down .text {
		padding-right: calc(4.8 * var(--fontCoef));
		font-size: calc(1 * var(--fontCoef));
	}
	.scroll-down .text .icon {
		width: calc(4.4 * var(--fontCoef));
		height: calc(0.1 * var(--fontCoef));
	}
	.scroll-down .text::before {
    width: calc(4.4 * var(--fontCoef));
		height: calc(0.1 * var(--fontCoef));
		animation: scroll-bar 3s infinite linear;
	}
	.scroll-down .text::after {
		width: calc(0.8 * var(--fontCoef));
		animation: scroll-dot 3s infinite linear;
	}
}

/* contents */
.section__inner {
	max-width: var(--globalContentWidth);
	margin: 0 auto;
	padding-top: calc(8 * var(--fontCoef));
	padding-bottom: calc(8 * var(--fontCoef));
}
.section-services .section__inner,
.section-access .section__inner {
	padding-right: var(--globalContentPadding);
}
.section-features .section__inner {
	padding-left: var(--globalContentPadding);
}
.section-greeting .section__inner,
.section-process .section__inner,
.section-faq .section__inner,
.section-company .section__inner {
	padding-left: var(--globalContentPadding);
	padding-right: var(--globalContentPadding);
}
.grid-block {
	display: grid;
}
.section-title {
	padding-left: calc(4.8 * var(--fontCoef));
	position: relative;
}
.section-title__main {
	font-size: calc(2.8 * var(--fontCoef));
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.06em;
	position: absolute;
	top: 0;
	left: 0;
}
.section-title__sub {
	color: #ccd3d8;
	font-size: calc(7 * var(--fontCoef));
	letter-spacing: 0.06em;
	line-height: 1.3;
}
.section-title + * {
	margin-top: calc(2 * var(--fontCoef));
}
.block-title {
	font-size: calc(2.2 * var(--fontCoef));
	letter-spacing: 0.025em;
	font-weight: 600;
	line-height: 1.5;
}
.block-title + * {
	margin-top: calc(0.4 * var(--fontCoef));
}
.grid-block .text > .block + .block {
	margin-top: calc(4 * var(--fontCoef));
}
.grid-block > .text {
	gap: calc(4 * var(--fontCoef));
}
.block p {
	font-size: calc(1.6 * var(--fontCoef));
	line-height: 2;
}
.table-multi {
	margin-top: calc(6 * var(--fontCoef));
}
.table-multi th,
.table-multi td {
	padding: 1em 1em 1em 0;
	font-size: calc(1.6 * var(--fontCoef));
	text-align: left;
}
.table-multi tr:first-of-type th,
.table-multi tr:first-of-type td {
	border-top: 0;
}
.table-multi th {
	vertical-align: top;
	min-width: calc(11.2 * var(--fontCoef));
}
.table-caption {
	margin-top: calc(6 * var(--fontCoef));
	font-size: calc(1.6 * var(--fontCoef));
	line-height: 2;
}
.table-caption + .table-caption {
	margin-top: 1em;
}
@media screen and (max-width:768px) {
	.section__inner {
		padding-top: calc(5.6 * var(--fontCoef));
		padding-bottom: calc(5.6 * var(--fontCoef));
	}
	.container section:last-of-type .section__inner {
		padding-bottom: calc(2.8 * var(--fontCoef));
	}
	.section-services .section__inner,
	.section-access .section__inner,
	.section-features .section__inner,
	.section-greeting .section__inner,
	.section-process .section__inner,
	.section-faq .section__inner,
	.section-company .section__inner {
		padding-left: 0;
		padding-right: 0;
	}
	section.section-greeting .grid-block,
	section.section-features .grid-block,
	section.section-services .grid-block,
	section.section-access .grid-block,
	section.section-company .grid-block {
		grid-template-columns: 100%;
	}
	section.section-greeting .grid-block,
	section.section-features .grid-block,
	section.section-services .grid-block {
		gap: calc(6.4 * var(--fontCoef));
	}
	section.section-access .grid-block,
	section.section-company .grid-block {
		gap: calc(3.2 * var(--fontCoef));
	}
	.grid-block .pic {
		order: 2;
	}
	.section-features .grid-block .pic,
	.section-services .pic-block {
		padding-left: var(--globalContentPadding);
		padding-right: var(--globalContentPadding);

	}
	.grid-block .text {
		padding-left: var(--globalContentPadding);
		padding-right: var(--globalContentPadding);
	}
	.section-title {
		display: flex;
		justify-content: center;
		width: 100%;
		padding-left: 0;
		padding-top: calc(0.8 * var(--fontCoef));
	}
	.section-title + * {
		margin-top: calc(3.2 * var(--fontCoef));
	}
	.section-title__main {
		width: 100%;
		font-size: calc(2 * var(--fontCoef));
		text-align: center;
		left: 50%;
		transform: translate(-50%, 0);
	}
	.section-title__sub {
		font-size: calc(5 * var(--fontCoef));
	}
	.block-title {
    font-size: calc(1.8 * var(--fontCoef));
	}
	.block p {
		font-size: calc(1.4 * var(--fontCoef));
	}
	.block p.title-text,
	.block p .title-text {
		font-size: calc(1.6 * var(--fontCoef));
	}
	.block p .small {
		font-size: calc(1.2 * var(--fontCoef));
	}
	.table-multi th,
	.table-multi td {
		font-size: calc(1.2 * var(--fontCoef));
	}
	.table-multi th {
		min-width: calc(8 * var(--fontCoef));
	}
	.table-caption {
		margin-top: calc(1.6 * var(--fontCoef));
		font-size: calc(1.4 * var(--fontCoef));
	}
}


/* 各セクション */

/* section-greeting */
.section-greeting {
	background-color: #fff;
}
.section-greeting .grid-block {
	grid-template-columns: 538fr 604fr;
	/* grid-template-columns: 502fr 604fr; */
	gap: calc(5.6 * var(--fontCoef));
	word-break: auto-phrase;
}

/* section-features */
.section-features {
	background-color: #ccd3d8;
}
.section-features .grid-block {
	grid-template-columns: 573fr 654fr;
	gap: calc(8.8 * var(--fontCoef));
	word-break: auto-phrase;
}
.section-features .section-title__sub {
	color: #fff;
}
@media screen and (max-width:768px) {
	
}

/* section-services */
.section-services {
	background-color: #fff;
}
.section-services .section-title__sub {
	color: #e19577;
}
.section-services .grid-block {
	grid-template-columns: 590fr 655fr;
	gap: calc(7.2 * var(--fontCoef));
}
.section-services .service-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: calc(1.2 * var(--fontCoef)) calc(1.6 * var(--fontCoef));
}
.section-services .pic-block {
	position: relative;
}
.section-services .pic-block .pic:nth-of-type(1) {
	width: 90%;
}
.section-services .pic-block .pic:nth-of-type(2) {
	width: 42%;
	position: absolute;
	right: 0;
	top: 0;
	transform: translate(0, 57%);
}
.section-services ul + ul {
	margin-top: calc(3.2 * var(--fontCoef));
}
.section-services .service-list {
	margin-top: calc(3.6 * var(--fontCoef));
}
.section-services .service-list > li {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding: 0.8em 1.5em;
	font-size: calc(1.6 * var(--fontCoef));
	text-align: center;
}
.section-services .service-list > li:nth-of-type(1) {
	background-color: #dad2d9;
}
.section-services .service-list > li:nth-of-type(2) {
	background-color: #d6e0e7;
}
.section-services .service-list > li:nth-of-type(3) {
	background-color: #f8e5d6;
}
.section-services .service-list > li:nth-of-type(4) {
	background-color: #e0e0e0;
}
.section-services .service-list > li:nth-of-type(5) {
	background-color: #d8dacb;
}
.section-services .service-list > li:nth-of-type(6) {
	background-color: #f0dee0;	
}
.section-services .service-list > li {
	word-break: auto-phrase;
}
.section-services .list-disc > li {
	line-height: 2;
	font-size: calc(1.6 * var(--fontCoef));
}
@media screen and (max-width:768px) {
	.section-services .pic-block .pic:nth-of-type(2) {
		right: var(--globalContentPadding);
	}
	.section-services .service-list {
		margin-top: calc(0.8 * var(--fontCoef));
		grid-template-columns: 100%;
		gap: calc(0.8 * var(--fontCoef));
	}
}


/* section-process */
.section-process {
	background-color: #ccd3d8;
}
.section-process .section-title__main {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em 1em;
}
.section-process .section-title__sub {
	color: #fff;
}
.section-process .process-steps__list {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: calc(4.44 * var(--fontCoef));
	counter-reset: step;
}
.section-process .process-steps__list > li {
	display: grid;
	grid-template-columns: 100%;
	grid-template-rows: auto 1fr;
	padding: calc(2.4 * var(--fontCoef)) calc(1.6 * var(--fontCoef));
	background-color: #fff;
	position: relative;
}
.section-process .process-steps__list > li::before,
.section-process .process-steps__list > li::after {
	content: '';
	display: block;
	position: absolute;
}
.section-process .process-steps__list > li::before {
	aspect-ratio: 1;
	width: calc(1.18 * var(--fontCoef));
	border-top: calc(0.2 * var(--fontCoef)) solid #fff;
	border-right: calc(0.2 * var(--fontCoef)) solid #fff;
	top: 50%;
	right: calc(-1.2 * var(--fontCoef));
	transform: translate(100%, -50%) rotate(45deg);
}
.section-process .process-steps__list > li::after {
	width: 97%;
	height: calc(1.44 * var(--fontCoef));
	background: repeating-linear-gradient(to bottom, #fff 0% 20%, transparent 20% 40%);
	top: 100%;
	left: 50%;
	transform: translate(-50%, calc(0.445 * var(--fontCoef)));
}
.section-process .process-steps__list > li:last-of-type:before {
	display: none;
}
.section-process .process-steps__list .number {
	display: block;
	text-align: center;
}
.section-process .process-steps__list .number::before {
	counter-increment: step;
  content: counter(step);
	color: #adb4ba;
	font-size: calc(3.8 * var(--fontCoef));
}
.section-process .process-steps__list .title {
	margin-top: calc(1.6 * var(--fontCoef));
	font-size: calc(1.5 * var(--fontCoef));
	text-align: center;
	word-break: auto-phrase;
}
.section-process .process-steps__list .icon {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 176/ 60;
	margin: calc(3.2 * var(--fontCoef)) auto 0;
}
.section-process .process-steps__list .icon span {
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.section-process .process-steps__list > li:nth-of-type(1) .icon span {
	aspect-ratio: 103/55;
	width: calc(10.3 * var(--fontCoef));
	background-image: url(../img/index/process_icon1.svg);
}
.section-process .process-steps__list > li:nth-of-type(2) .icon span {
	aspect-ratio: 42.5/59.9;
	width: calc(4.25 * var(--fontCoef));
	background-image: url(../img/index/process_icon2.svg);
}
.section-process .process-steps__list > li:nth-of-type(3) .icon span {
	aspect-ratio: 61.7/56;
	width: calc(6.17 * var(--fontCoef));
	background-image: url(../img/index/process_icon3.svg);
}
.section-process .process-steps__list > li:nth-of-type(4) .icon span {
	aspect-ratio: 66.5/60;
	width: calc(6.65* var(--fontCoef));
	background-image: url(../img/index/process_icon4.svg);
}
.section-process .process-steps__list > li:nth-of-type(5) .icon span {
	aspect-ratio: 113/54;
	width: calc(11.3 * var(--fontCoef));
	background-image: url(../img/index/process_icon5.svg);
}
.section-process .process-steps__list .text {
	margin-top: calc(3.2 * var(--fontCoef));
	font-size: calc(1.5 * var(--fontCoef));
}
@media screen and (max-width:1400px) {
	/* .section-process .process-steps__list {
		grid-template-columns: repeat(3, 1fr);
	} */
}
@media screen and (max-width:768px) {
	.section-process .process-steps__list {
		grid-template-columns: 100%;
		gap: calc(6.4 * var(--fontCoef));
	}
	.section-process .process-steps__list > li::before {
		height: calc(1.185 * var(--fontCoef));
		top: 100%;
		left: 50%;
		transform: translate(-50%, calc(3.25 * var(--fontCoef))) rotate(135deg);
	}
	.section-process .process-steps__list > li::after {
		height: calc(1.44 * var(--fontCoef));
	}
	.section-process .section-title__main {
		justify-content: center;
		gap: calc(2 * var(--fontCoef));
		
	}
	.section-process .section-title__main small {
		font-size: calc(1.2 * var(--fontCoef));
	}
	.process-steps__list {
		padding-left: var(--globalContentPadding);
		padding-right: var(--globalContentPadding);
	}
	.section-process .process-steps__list > li {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: calc(4.8 * var(--fontCoef));
		align-items: start;
	}
	.section-process .process-steps__list .title {
		margin-top: 0;
		padding: 0 1em;
	}
	.section-process .process-steps__list .icon {
    margin: calc(2.4 * var(--fontCoef)) auto 0;
	}
	.section-process .process-steps__list .text {
		margin-top: calc(2.4 * var(--fontCoef));
		font-size: calc(1.4 * var(--fontCoef));
	}
}

/* section-faq */
.section-faq {
	background-color: #fff;
}
.faq-list {

}
.faq-list__item {
	display: grid;
	grid-template-columns: 100%;
	gap: calc(2 * var(--fontCoef));
}
.faq-list__item + .faq-list__item {
	margin-top: calc(8.8 * var(--fontCoef));
	position: relative;
}
.faq-list__item + .faq-list__item::before {
	content: '';
	display: block;
	width: 100%;
	height: calc(0.1 * var(--fontCoef));
	background-color: #ccd3d8;
	position: absolute;
	top: calc(-4.4 * var(--fontCoef));
	transform: translate(0, -50%);
}
.faq-list__item strong {
	color: #de6b79;
}
.question-block,
.answear-block {
	display: flex;
	align-items: stretch;
}
.question-block::before,
.answear-block::before {
	aspect-ratio: 1/1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(4.8 * var(--fontCoef));
	height: calc(4.8 * var(--fontCoef));
	font-family: "Bellefair", serif;
	font-weight: 400;
	font-style: normal;
	color: #fff;
	font-size: calc(3 * var(--fontCoef));
	line-height: 1;
	flex-shrink: 0;
} 
.question-block::before {
	content: 'Q';
	background-color: #ccd3d8;
}
.answear-block::before {
	content: 'A';
	background-color: #e19577;
}
.faq-list__item .text {
	display: flex;
	align-items: center;
	margin-top: calc(-0.5 * var(--fontCoef));
	padding-left: calc(1.4 * var(--fontCoef));
}
.faq-list__item p {
	font-size: calc(1.6 * var(--fontCoef));
}
.faq-list__item .question-block .text p {
	font-size: calc(1.8 * var(--fontCoef));
}
@media screen and (max-width:768px) {
	.faq-list {
		padding-left: var(--globalContentPadding);
		padding-right: var(--globalContentPadding);
		gap: calc(2 * var(--fontCoef));
	}
	.question-block::before, .answear-block::before {
		width: calc(3.4 * var(--fontCoef));
		height: calc(3.4 * var(--fontCoef));
		font-size: calc(2 * var(--fontCoef));
	}
	.faq-list__item + .faq-list__item {
		margin-top: calc(5.8 * var(--fontCoef));
	}
	.faq-list__item + .faq-list__item::before {
		top: calc(-2.9 * var(--fontCoef));
	}
	.faq-list__item p {
		font-size: calc(1.4 * var(--fontCoef));
	}
}

/* section-access */
.section-access {
	background-color: #e9edf0;
}
.section-access .section-title__sub {
	color: #fff;
}
.section-access .grid-block {
	grid-template-columns: 651fr 590fr;
	gap: calc(7.6 * var(--fontCoef));
}
@media screen and (max-width:768px) {
	.section-access .grid-block .pic {
		order: 0;
	}
	.section-access .grid-block .pic img {
		display: block;
		margin-top: calc(3.2 * var(--fontCoef));
	}
	.section-access .table-box {
		margin-top: 0;
	}
	.section-access .table-multi {
		margin-top: 0;
	}
}

/* section-company */
.section-company {
	background-color: #fff;
}
.section-company .section-title__sub {
	color: #e9edf0;
}
.section-company .grid-block {
	grid-template-columns: 584fr 537fr;
}
@media screen and (max-width:768px) {
	.table-company {
		margin-top: 0;
	}
	.section-company .grid-block .pic {
		padding-left: var(--globalContentPadding);
		padding-right: var(--globalContentPadding);
	}
	.section-company .table-caption {
		margin-top: calc(3.2 * var(--fontCoef));
		padding-left: var(--globalContentPadding);
		padding-right: var(--globalContentPadding);
	}
}
