@charset "UTF-8";


/* ========================================================
  
  common

======================================================== */
.l-header {
	position: absolute;
	inset: 0 0 auto 0;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}


/* ========================================================
  
  FV

======================================================== */
.l-fv {
	width: 100%;
	height: 100vh;
	min-height: min(calc(100vw * 0.6), 780px);
}
.l-fv__img {

	&::after {
		position: absolute;
		content: "";
		background-color: #FFF;
		width: 100%;
		height: 0;
		clip-path: polygon(0 0, 50% 100%, 100% 0, 100% 100%, 0 100%);
		inset: auto 0 -0.5px 0;
		transition: height 1s 1s;
	}
	&.is-animated {
		&::after {
			height: 90px;
		}
	}
}

/* Tablet,Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 960px) {

.l-fv {
	width: 100svw;
	height: 100svh;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.l-fv {
	height: calc(100svh - 13vw);
	min-height: calc(100vw * 1.4);
	max-height: calc(100vw * 1.9);
}

.l-fv__img {
	&.is-animated {
		&::after {
			height: 6vw;
		}
	}
}
}


/*-----------------------------------------------
 FV - slide
-----------------------------------------------*/
.l-fv__slide {
	width: 100%;
	height: 100%;

	.splide__track,
	.splide__list,
	.splide__slide {
		width: 100%;
		height: 100%;
	}

	.splide__slide {
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;

		&::before,
		&::after {
			position: absolute;
			content: "";
			background: linear-gradient(to bottom, rgb(0 0 0 / 0.4), rgb(0 0 0 / 0) 30%);
			width: 100%;
			height: 100%;
			inset: 0;
			pointer-events: none;
		}
		&::after {
			background: linear-gradient(to top, rgb(0 0 0 / 0.5), rgb(0 0 0 / 0) 50%);
		}
		&.slide1 {background-image: url(../images/top/fv-img01@2x.jpg);	}
		&.slide2 {background-image: url(../images/top/fv-img02@2x.jpg);	}
		&.slide3 {background-image: url(../images/top/fv-img03@2x.jpg);	}
		&.slide4 {background-image: url(../images/top/fv-img04@2x.jpg);	}
	}

	.splide__pagination {
		position: absolute;
		flex-direction: column;
		row-gap: 1.2em;
		color: #FFF;
		font: var(--font-en);
		font-size: 105%;
		letter-spacing: .14em;

		counter-reset: pagination-num;
		right: 3%;
		top: 50%;
		translate: 0 -50%;

		.splide__pagination__page {
			position: relative;
			padding-bottom: 1em;

			&::before {
				content: counter( pagination-num, decimal-leading-zero );
				counter-increment: pagination-num;
				opacity: 0.6;
				transition: opacity .5s;
			}
			&::after {
				position: absolute;
				content: "";
				background-color: currentColor;
				width: 1.6em;
				height: 1px;
				rotate: -22deg;
				inset: auto 0 0 0;
			}
			&.is-active {
				&::before {
					opacity: 1;
				}
			}
		}
		> li:last-child {
			.splide__pagination__page {
				padding-bottom: 0;
				&::after {
					display: none;
				}
			}
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.l-fv__slide {

	.splide__slide {
		
		&.slide1 {background-image: url(../images/top/fv-img01-sp@2x.jpg);	}
		&.slide2 {background-image: url(../images/top/fv-img02-sp@2x.jpg);	}
		&.slide3 {background-image: url(../images/top/fv-img03-sp@2x.jpg);	}
		&.slide4 {background-image: url(../images/top/fv-img04-sp@2x.jpg);	}
	}

	.splide__pagination {
		row-gap: 1.2em;
		font-size: 2.4vw;

		inset: auto 5% 14vw auto;
		translate: none;
	}
}
}


/*-----------------------------------------------
 FV - copy
-----------------------------------------------*/
.l-fv__copy {
	position: absolute;
	width: 45%;
	max-width: max-content;
	left: 9%;
	top: 58%;
	translate: 0 -50%;
	opacity: 0;
	transition: opacity .8s .2s;

	.l-fv__copy-jp {
		filter: drop-shadow(0 0 10px rgb(0 0 0 / 0.6));
		transform: translateZ(0);
	}
}
.l-fv__open {
	position: absolute;
	width: 32%;
	max-width: max-content;
	right: 3.2%;
	bottom: 10%;
	filter: drop-shadow(0 0 10px rgb(0 0 0 / 0.4));
	transform: translateZ(0);
	opacity: 0;
	transition: opacity .8s .2s;
}
.l-fv__img.is-animated {
	.l-fv__copy,
	.l-fv__open {
		opacity: 1;
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) and (orientation: portrait) {

.l-fv__copy {
	width: 65%;
}
.l-fv__open {
	width: 38%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.l-fv__copy {
	width: 85%;
	left: 50%;
	top: 50%;
	translate: -50% -50%;
}
.l-fv__open {
	width: 60%;
	inset: auto auto 8% 8%;
}
}

@media only screen and (min-width: 768px) and (max-width: 1500px) and (min-aspect-ratio: 1024/750) {

}



/* ========================================================
  
  deco

======================================================== */



/* ========================================================
  
  page common

======================================================== */

/*---------------------------------------------------------
 p-title01
---------------------------------------------------------*/
.p-title01 {
	position: relative;
	display: flex;
	align-items: center;
	font-size: min(3.2vw,250%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	letter-spacing: .06em;
	margin-bottom: 1em;

	> span {
		color: var(--color-base);
		font-size: 160%;
	}
	.u-font--en {
		position: relative;
		align-self: flex-end;
		font-size: 46%;
		letter-spacing: -0.12em;
		padding: .5em .4em;
		z-index: 1;
		margin-left: -0.35em;

		&::before {
			position: absolute;
			content: "";

			width: .5em;
			height: 2.5em;
			background: #FFF;
			border-left: 1px solid currentColor;

			left: 0;
			top: 45%;
			rotate: 35deg;
			transform-origin: center;
			translate: 0 -50%;
			z-index: -1;
		}
	}
	&.pos-l {

		.u-font--en {
			padding-left: 0;
			margin-left: 0;
			margin-right: -0.1em;

			&::before {
				border-left: none;
				border-right: 1px solid currentColor;

				left: auto;
				right: 0;
				top: 45%;
				rotate: -35deg;
			}
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-title01 {
	flex-wrap: wrap;
	font-size: 5vw;
}
}

/*---------------------------------------------------------
 p-title02
---------------------------------------------------------*/
.p-title02 {
	position: relative;
	display: flex;
	align-items: flex-end;
	column-gap: .8em;
	font-size: min(2.6vw,200%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	letter-spacing: .15em;
	margin-bottom: 5%;
	margin-bottom: 2em;

	&.pos-c {
		justify-content: center;
	}
	.c-hdg--en {
		color: var(--color-taq);
		z-index: -1;

		&::before {
			position: absolute;
			content: "";
			width: .2em;
			height: .7em;
			background: #FFF;
			border-left: 1px solid currentColor;
			right: -0.1em;
			bottom: -0.2em;
			rotate: 35deg;
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-title02 {
	font-size: 3.5vw;
}
}



/* ========================================================
  
  main

======================================================== */



/*---------------------------------------------------------
 Info
---------------------------------------------------------*/

/* Info - point
-----------------------------------------------*/
.info__point {
	position: relative;
	display: flex;
	justify-content: center;
	column-gap: 1.1em;
	color: var(--color-nvy);
	font-size: min(2.8vw,187%);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	letter-spacing: .15em;
	margin-bottom: 1em;

	> li {
		position: relative;

		&:nth-of-type(2) {
			color: var(--color-taq);
			padding-left: 1.2em;

			&::after {
				position: absolute;
				display: block;
				content: "";
				background-color: #cfcfcf;
				width: 1px;
				height: .7em;
				left: 0;
				top: 50%;
				translate: 0 -50%;
			}
		}
	}
	& span {
		position: relative;

		&::before {
			position: absolute;
			content: "";
			background: url(../images/top/underline-slash.svg) repeat-x left top;
			background-size: auto 100%;
			width: 100%;
			height: 0.21em;
			left: 0;
			bottom: -0.4em;
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.info__point {
	font-size: 105%;
}
}

/* Info - info__inner
-----------------------------------------------*/
.info__inner {
	display: grid;
	row-gap: 2em;
	max-width: 880px;
	margin-inline: auto;
}

.info .c-cta-wrap {
	margin-top: 3.5%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.info__inner {
	justify-content: space-between;
	grid-template-columns: 48% 48%;
}

.info .c-timetable {
	font-size: min(1.55vw,87%);
}

.info .c-cta-tel a {
	display: flex;
	align-items: center;
	column-gap: .8em;
}
.info .c-cta-cap {
	margin-bottom: 0;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {


}

/* Info - info__acs
-----------------------------------------------*/
.info__acs {
	display: flex;
	gap: .5em 5%;
	text-align: left;
	font-size: min(1.6vw,1rem);
	font-weight: var(--fw-bold);
	letter-spacing: .1em;
	line-height: 1.4;
	white-space: nowrap;
	margin-top: 1.4em;
}
.info__acs li {
	display: flex;
	align-items: center;
	gap: 1em;
}
.info__acs li img {
	width: 4.4em;
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.info__acs {
	font-size: 80%;
}
}


/*---------------------------------------------------------
 Opening
---------------------------------------------------------*/
.opening {
	max-width: 1010px;
	margin: 4% auto 0;
}
.opening__box {
	position: relative;
	text-align: center;
	background-color: var(--color-blu-100);
	padding: 3.5% 5%;

	&:nth-of-type(1) {
		display: flex;
		justify-content: center;
		column-gap: 2%;
	}
	&:nth-child(2) {
		color: #FFF;
		background-color: var(--color-nvy);

		&::before {
			position: absolute;
			content: "";
			background-color: var(--color-org);
			width: 2.5em;
			aspect-ratio: 1;
			clip-path: polygon(100% 0, 100% 100%, 0 100%);
			right: 0;
			bottom: 0;
		}

		> dl {
			display: flex;
			justify-content: center;
			column-gap: 3%;
		}
		& p {
			font-size: min(2.2vw,150%);
			font-weight: var(--fw-bold);
			line-height: 1.5;
			letter-spacing: .05em;
			margin-top: .6em;
		}
	}
}
.opening__menu {
	display: flex;
	column-gap: 3%;
	color: var(--color-nvy);
	font-size: min(1.7vw,110%);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	letter-spacing: .05em;
	white-space: nowrap;

	> li {
		background-color: #fff;
		padding: .6em 1.2em;
		border-radius: .5em;

		> span {
			display: block;
			font-size: 125%;

			> span {
				font-size: 118%;
			}
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.opening {
	margin-top: 8%;
}
.opening__box {
	padding: 7% 5%;

	&:nth-of-type(1) {
		flex-wrap: wrap;
		row-gap: .5em;

		> * {
			width: 80%;
		}
	}
	&:nth-child(2) {

		> dl {
			flex-wrap: wrap;
			row-gap: .5em;
		}
		& p {
			font-size: 110%;
		}
	}
}
.opening__menu {
	display: block;
	font-size: 100%;
	margin-top: 3%;

	> li:nth-of-type(n+2) {
		margin-top: .5em;
	}
}
}


/*---------------------------------------------------------
 sp-menu
---------------------------------------------------------*/

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.sp-menu {
	width: 90%;
	max-width: 1360px;
	border-bottom: var(--bdr-solid);
	margin: auto;

	.c-menu-sp {
		display: none;
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

}


/*---------------------------------------------------------
 Concept
---------------------------------------------------------*/
.concept {
	.c-bg-color {
		background: linear-gradient(to top, var(--color-gry-200), transparent);
		height: 270px;
		inset: auto 0 -1px 0;
	}
}

/* Concept - text
-----------------------------------------------*/
.cpt__inner {
	position: relative;
	padding: min(15vw,140px) 0 50px;
}
.cpt__copy {
	font-size: min(2.4vw,156%);

	> span {
		display: block;
		font-size: 280%;
		line-height: 1.25;
		margin-top: .2em;

		> span {
			color: var(--color-nvy-300);
		}
		> span:first-child {
			color: var(--color-taq);
		}
	}
}
.cpt__txt {
	width: 38%;
	max-width: 460px;
	margin: auto;
	translate: 8% 0;
}
.cpt__chk {
	max-width: max-content;
	font-size: min(2.2vw,156%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	letter-spacing: .06em;
	margin-left: auto;
	margin-top: 3em;

	> li {
		position: relative;
		padding-left: 1.5em;
		margin-top: .2em;

		&::before {
			position: absolute;
			content: "";
			background: url(../images/common/icon-chk01.svg) no-repeat;
			background-size: contain;
			width: 1.2em;
			height: 1em;
			left: 0;
			top: .2em;
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.cpt__inner {
	padding: 52vw 0 58vw;
}
.cpt__copy {
	font-size: 4vw;
}
.cpt__txt {
	width:  80%;
}
.cpt__chk {
	font-size: 110%;
}
}

/* Concept - deco
-----------------------------------------------*/
.cpt__photo {
	> li {
		position: absolute;
		width: 18vw;
		max-width: max-content;

		&:nth-of-type(1) {
			left: 0;
			top: 80px;
		}
		&:nth-of-type(2) {
			right: 3%;
			top: 0;
		}
		&:nth-of-type(3) {
			left: 7%;
			bottom: 0;
		}
		&:nth-of-type(4) {
			right: 0;
			bottom: 0;
		}
	}
}
.cpt__bbl {
	> li {
		position: absolute;
		color: #40588b;
		font-size: min(1.8vw,150%);
		line-height: 1.4;
		letter-spacing: .1em;
		font-feature-settings: "palt";
		white-space: nowrap;
		background-color: #fff;
		padding: .7em 1.3em;
		border: 1px solid currentColor;
		border-radius: .7em;
		translate: -50% -50%;
		opacity: 0;
		margin-top: 0.5em;
		transition: opacity 1.5s, margin 1.5s;

		&::before {
			position: absolute;
			content: "";
			background-color: inherit;
			border-right: 1px solid currentColor;
			width: 1.2em;
			aspect-ratio: 1;
			left: 60%;
			bottom: 0;
			rotate: 45deg;
			translate: -50% calc(50% + 1px);
		}

		&:nth-of-type(1) {
			left: 18%;
			top: 50%;

			&::before {
				rotate: 135deg;
			}
		}
		&:nth-of-type(2) {
			left: 71%;
			top: 16%;

			&::before {
				left: 36%;
			}
		}
		&:nth-of-type(3) {
			left: 84%;
			top: 53%;
		}
		& b {
			font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック';
			font-weight: 700;
		}
	}
	&.is-animated {
		> li {
			opacity: 1;
			margin: 0;
		}
	}
}
.cpt__circle {
	position: absolute;
	width: 80%;
	max-width: 360px;
	aspect-ratio: 1;
	inset: 54% auto auto 42%;
	translate: -50% -50%;

	&::before {
		position: absolute;
		content: "";
		background: url(../images/top/cpt-circle.svg) no-repeat;
		background-size: contain;
		width: 100%;
		height: 100%;
		inset: 0;
		opacity: 0;
		scale: 0.7;
		transition: opacity 2s, scale 2s;
		transition-delay: .2s;
		z-index: -1;
	}
	> img {
		position: absolute;
		width: 50%;
		translate: -50% -50%;

		&:nth-of-type(1) {
			left: 108%;
			top: 16%;
		}
		&:nth-of-type(2) {
			left: -2%;
			top: 88%;
		}
	}
	&.is-animated {
		&::before {
			opacity: 1;
			scale: 1;
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.cpt__photo {
	> li {
		width: 32vw;

		&:nth-of-type(1) {
			left: 0;
			top: 13vw;
		}
		&:nth-of-type(2) {
			width: 25vw;
			right: 0;
			top: 20vw;
		}
		&:nth-of-type(3) {
			width: 40vw;
			left: 4%;
			bottom: 20vw;
		}
		&:nth-of-type(4) {
			width: 35vw;
			right: 16%;
		}
	}
}
.cpt__bbl {
	> li {
		font-size: 4.2vw;

		&:nth-of-type(1) {
			left: 38%;
			top: 10vw;
		}
		&:nth-of-type(2) {
			left: 75%;
			top: 48vw;
		}
		&:nth-of-type(3) {
			left: 66%;
			top: 150vw;
		}
	}
}
.cpt__circle {
	width: 62vw;
	top: 50%;
}
}


/*---------------------------------------------------------
 Reason
---------------------------------------------------------*/
.rsn-ttl {
	margin-bottom: 3%;

	.c-hdg--en {
		color: #FFF;
	}
	.c-hdg--bld {
		text-align: right;

		> span {
			display: inline-block;
			font-size: 200%;
			margin-left: .2em;

			&::first-letter {
				color: var(--color-taq);
			}
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.reason {
	padding-top: 0;
}
.rsn-ttl {
	margin-bottom: 6%;

	.c-hdg--bld {
		text-align: left;
		max-width: max-content;
		margin-left: auto;

		> span {
			display: block;
			margin-left: 0;
		}
	}
}
}


/* Reason - rsn-list
-----------------------------------------------*/
.rsn-list {
	display: flex;
	flex-wrap: wrap;
	gap: 1.05rem;
}
.rsn-list__item {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 6.6em;
	max-height: 238px;
	font-size: min(2.7vw,250%);
	color: #FFF;
	background-color: var(--color-taq);
	padding: 1.2em 2% .8em;

	&::before {
		position: absolute;
		content: "";
		background: url(../images/top/rsn-icon01.svg) no-repeat;
		background-size: contain;
		width: 3em;
		height: 3em;
		right: 3%;
		bottom: 5%;
	}
	.c-txt--ccl {
		position: absolute;
		width: min(6.6em);
		font-size: 46%;
		letter-spacing: .01em;
		background-color: var(--color-nvy);
		padding-top: .3em;
		left: 0;
		top: -0.4em;
		translate: -50% 0;
	}
}
.rsn-list__txt {
	position: relative;
	font-weight: var(--fw-bold);
	line-height: 1.2;
	letter-spacing: normal;
	font-feature-settings: "palt";
	white-space: nowrap;

	> span {
		font-size: 120%;

		> span {
			color: #ffffd1;
		}
	}
	> sup {
		display: inline-block;
		writing-mode: vertical-rl;
		font-size: 66%;
		vertical-align: -0.25em;
	}
	> sub {
		display: inline;
		font-size: 66%;
		vertical-align: .03em;
		margin-left: .1em;
	}
	> small {
		display: block;
		font-size: 77%;
		letter-spacing: .05em;
	}
}
.rsn-list__img {
	position: absolute;
	width: auto;
	height: 100%;
	right: 0;
	top: 0;

	> img {
		width: auto;
		height: 100%;
		object-fit: cover;
	}
}

.rsn-list__item {
	&:nth-of-type(1) {
		padding-left: 25%;

		.rsn-list__img {
			width: 39%;
			height: auto;
			inset: auto auto 15% 6%;

			> img {
				height: auto;
			}
		}
		.rsn-list__txt {
			> span {
				font-size: 140%;
				letter-spacing: .05em;
			}
		}
	}
	&:nth-of-type(2) {
		&::before {
			background-image: url(../images/top/rsn-icon02.svg);
		}
	}
	&:nth-of-type(3) {
		justify-content: flex-end;

		&::before {
			background-image: url(../images/top/rsn-icon03.svg);
			inset: 1% 3% auto auto;
		}
	}
	&:nth-of-type(4) {
		justify-content: flex-end;
		padding-left: 3%;

		&::before {
			background-image: url(../images/top/rsn-icon04.svg);
			inset: 10% 51% auto auto;
		}
		.rsn-list__txt {
			> span {
				letter-spacing: .05em;
			}
			> span:nth-child(2) {
				font-size: 140%;
			}
		}
	}
	&:nth-of-type(5) {
		justify-content: center;

		&::before {
			display: none;
		}
		.rsn-list__txt {
			> span:first-child {
				font-size: 140%;
			}
			> sub {
				font-size: 85%;
			}
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.rsn-list {
	column-gap: 1.2%;
}
.rsn-list__item {
	width: 50%;

	&:nth-of-type(2),
	&:nth-of-type(3) {
		width: 23.6%;
	}
	&:nth-of-type(5) {
		width: 48.5%;
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.rsn-list {
	gap: .5em 2.4%;
}
.rsn-list__item {
	width: 100%;
	height: 5.9em;
	font-size: 5.2vw;
	padding: 1.2em 5% .8em;

	&:nth-of-type(1) {
		padding-left: 50%;
	}
	&:nth-of-type(2),
	&:nth-of-type(3) {
		width: 48.8%;
	}
}
}


/*---------------------------------------------------------
 Wide
---------------------------------------------------------*/
.wide-ttl {
	.c-hdg--bld {
		> span:first-of-type {
			color: var(--color-nvy-300);
		}
		> span:last-of-type {
			display: block;
			font-size: 200%;
		}
	}
}

/* Wide - lead
-----------------------------------------------*/

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.wide-lead__img {
	position: absolute;
	width: 66%;
	left: 41%;
	top: 0;
	z-index: -1;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.wide-lead__img {
	width: 90vw;
	margin: -8% -5% -14% auto;
}
}

/* Wide - wide-intro
-----------------------------------------------*/
.wide-intro {
	max-width: 1130px;
	margin-inline: auto;
}
.wide-intro__point {
	font-size: min(2.2vw,150%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	letter-spacing: .06em;
	margin-bottom: .4em;

	> li {
		position: relative;
		padding-left: 2.3em;

		&::before {
			position: absolute;
			content: "";
			background: url(../images/common/icon-chk02.svg) no-repeat;
			background-size: contain;
			width: 1.8em;
			height: 7em;
			left: 0;
			top: .2em;
		}
		> span {
			font-size: 133%;
			margin-right: .2em;
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.wide-intro {
	display: grid;
	align-items: flex-end;
	grid-template-columns: 48% 47%;
	column-gap: 5%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.wide-intro {
	width: 92%;
}
.wide-intro__point {
	font-size: 105%;
}
.wide-intro__img {
	margin-bottom: 5%;
}
}

/* Wide - wide-injury
-----------------------------------------------*/
.wide-injury {
	background-color: var(--color-nvy-300);
	padding: 3.8%;
	margin-top: 4%;

	> .c-hdg--bld {
		text-align: center;
		color: #FFF;
		margin-bottom: 1.5em;
	}
}

.injury-list {
	display: flex;
	column-gap: 1.6%;
	color: #FFF;
	font-size: min(2.4vw,200%);
	font-weight: var(--fw-bold);
	line-height: 1.2;
	letter-spacing: .06em;
	font-feature-settings: "palt";

	> li {
		flex: 1;
		text-align: center;
		background-color: var(--color-nvy);
		border-radius: .6em;
		padding: 1px 1% .8em;

		> img {
			width: 2.5em;
			margin: -7% auto .5em;
		}
	}
}

.care-list {
	display: flex;
	column-gap: 1.6%;
	margin-top: 3.5%;

	> li {
		display: grid;
		justify-content: space-between;
		grid-template-columns: 37% 63%;
		flex: 1;
		background-color: #FFF;
		border-radius: .6em;
		overflow: hidden;
	}
	.c-hdg--bld {
		color: var(--color-nvy);
		font-size: min(1.5vw,125%);

		> span {
			display: block;
			font-size: 160%;
		}
	}
}
.care-list__img {
	> img {
		height: 100%;
		object-fit: cover;
	}
}
.care-list__txt {
	align-self: center;
	padding: 1.5em 7%;

	> p {
		line-height: 1.6;
		font-feature-settings: "palt";
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.wide-injury {
	padding: 8% 6%;
	margin-top: 8%;

	> .c-hdg--bld {
		margin-bottom: 1.2em;
	}
}

.injury-list {
	justify-content: center;
	flex-wrap: wrap;
	gap: .6em 2%;
	font-size: 110%;

	> li {
		width: 32%;
		flex: none;
	}
}

.care-list {
	display: block;
	width: 95%;
	margin: 6% auto 0;

	> li {
		display: block;
		grid-template-columns: 40% 60%;
		margin-top: 4%;
	}
	.c-hdg--bld {
		font-size: 100%;

		> span {
			font-size: 130%;
		}
	}
}
.care-list__img {
	height: 40vw;

	> img {
		width: 100%;
	}
}
.care-list__txt {
	padding: 1.2em 8%;
}
}

/* Wide - wide-other
-----------------------------------------------*/
.wide-other {
	max-width: 1180px;
	margin-inline: auto;

	.c-hdg--radi {
		width: 90%;
		max-width: 710px;
		box-shadow: 0 0 10px 5px rgb(0 0 0 / 0.05);
		margin-bottom: 4%;
	}
}
.wide-other__list {

	> li {
		display: grid;
		align-items: center;
		justify-content: space-between;
		grid-template-columns: 35% 62%;
	}
	.c-hdg--bld {
		color: var(--color-nvy);
	}
	& p {
		line-height: 1.6;
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.wide-other__list {
	display: flex;
	column-gap: 5%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.wide-other__list {
	display: grid;
	row-gap: 1.4em;
}
}


/*---------------------------------------------------------
 Message
---------------------------------------------------------*/
.msg__img {
	position: absolute;
	width: 56%;
	max-width: max-content;
	right: 45%;
	top: 0;
	z-index: -1;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.msg__img {
	position: absolute;
	width: 78%;
	inset: 12vw auto auto 0;
}
}

/* Message - msg__inner
-----------------------------------------------*/
.msg-name {
	display: flex;
	align-items: center;
	column-gap: .8em;
	font-size: min(2vw,125%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	letter-spacing: .15em;
	white-space: nowrap;
	margin-top: 1.6em;

	> dd {
		font-size: 160%;
		letter-spacing: .15em;

		&:last-child {
			align-self: flex-end;
			font-size: 70%;
			font-weight: normal;
			letter-spacing: .1em;
			padding-bottom: .4em;
		}
	}
}
.msg__cutout {
	> img {
		will-change: filter;
		filter: drop-shadow(10px 10px 10px rgb(0 0 0 / 0.1));
	}
}
.msg-record {
	font-size: min(1.8vw,112%);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	margin-top: 6%;

	> dt {
		width: 22em;
		text-align: center;
		color: #FFF;
		background-color: var(--color-nvy);
		padding: .2em 1.6em;
		border-radius: 2em;
		margin-bottom: 1.2em;
	}
	> dd {
		display: flex;
		column-gap: 1em;
		margin-top: 1.8em;

		& span {
			color: var(--color-nvy-300);
		}
	}
	.icon {
		width: 3.4em;
		padding-right: 1em;
		box-sizing: content-box;
		border-right: 1px solid #d6d6d6;
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.msg__inner {
	position: relative;
	width: 68%;
	max-width: 810px;
	padding: 50px 0;
	margin-left: auto;
}
.msg__cutout {
	position: absolute;
	width: 50%;
	left: 60%;
	bottom: 0;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.message {
	padding-bottom: 14%;

	.p-title02 {
		margin-bottom: 48vw;
	}
}
.msg__copy {
	font-size: 156%;
	line-height: 1.6;
	white-space: nowrap;
	margin-left: 44%;
}
.msg-prof {
	display: flex;
}
.msg-name {
	display: block;
	font-size: 100%;

	> dd {
		&:last-child {
			margin-top: .4em;
		}
	}
}
.msg-record {
	font-size: 100%;

	> dd {
		margin-top: 1.4em;
	}
}
}


/*---------------------------------------------------------
 Symptoms
---------------------------------------------------------*/
.symptoms {
	color: #FFF;

	.c-bg-color {
		background-color: rgb(0 0 0 / 0.9);
		transition: background-color 3s;

		&.is-animated {
			background-color: rgb(0 0 0 / 0.7);
		}
	}
	.c-hdg--radi {
		max-width: max-content;
		margin-left: 0;
	}
	.c-hdg--bld {
		font-size: min(3.8vw,300%);
		white-space: nowrap;
	}
	.c-list {
		width: 100%;
		font-size: min(1.8vw,112%);

		& a {
			text-decoration: underline;

			/* WP導入後解除 */
			text-decoration: none;
			pointer-events: none;

			&:hover {
				text-decoration: none;
				color: var(--color-taq);
			}
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.symp__inner {
	display: flex;
	column-gap: 8%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.symptoms {
	.c-hdg--bld {
		font-size: 150%;
		margin-bottom: 1em;
	}
	.c-list {
		grid-template-columns: repeat(2,49%);
		font-size: 90%;
	}
}
}


/*---------------------------------------------------------
 Price
---------------------------------------------------------*/
.price {

	.p-title01 {
		justify-content: center;
		color: var(--color-org);

		.u-font--en {
			color: var(--color-base);

			&::before {
				background-color: var(--color-gry-200);
			}
		}
		&::before {
			position: absolute;
			content: "";
			background: url(../images/top/price-icon.svg) no-repeat;
			background-size: contain;
			width: 5.3em;
			width: min(17%,212px);
			aspect-ratio: 212/256;
			left: 15%;
			top: 50%;
			translate: -50% -50%;
			z-index: -1;
		}
	}
	.u-bdr--b {
		border-color: #d6d6d6;
	}
	.c-btn-bg {
		> a {
			background-color: var(--color-org);
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.price {
	.p-title01 {
		&::before {
			width: 25%;
		}
	}
}
}

/* Price - table
-----------------------------------------------*/
.price-tbl {
	width: 100%;
	text-align: center;
	font-size: min(2vw,150%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	border-collapse: separate;
	border-spacing: .25em;
	margin-inline: auto;

	& th,
	& td {
		background-color: #FFF;
		padding: .5em;
	}
	& th {
		color: #FFF;
		background-color: var(--color-taq);
		> small {
			display: block;
			font-size: 75%;
		}
	}

	+ aside {
		margin-top: .4em;

		> small {
			display: block;
			line-height: 1.6;
			margin-top: .2em;
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.price-tbl {
	font-size: 100%;
	border-spacing: .25em;
	writing-mode: vertical-lr;

	& th,
	& td {
		writing-mode: horizontal-tb;
	}
	& th p,
	& td p {
		display: block;
		width: 100%;
	}
	& br {
		display: none;
	}
}
_::-webkit-full-page-media, _:future, :root {
.price-tbl {
	& th,
	& td {
		min-height: 2.4em;
	}
	& th p,
	& td p {
		writing-mode: horizontal-tb;
		white-space: nowrap;
	}
}
}
}

/* Price - base
-----------------------------------------------*/
.price-base {
	.price-tbl {
		& thead {
			& th:first-child {
				background-color: transparent;
			}
		}
		& th {
			width: 22%;
			
			&:first-child {
				width: 35%;
			}
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {


}

/* Price - self
-----------------------------------------------*/
.price__inner {
	position: relative;
}
.price-self {
	.c-hdg--bld {
		> span {
			color: var(--color-org);
		}
	}
}
.price-self__ttl {
	position: relative;
	text-align: center;
	margin-bottom: 2em;

	.c-txt--ccl {
		position: absolute;
		color: #FFF;
		font-size: min(1.8vw,125%);
		background-color: var(--color-org);
		width: min(6.25em);
		padding-top: .2em;
		left: 78%;
		top: 50%;
		translate: 0 -50%;
	}
}
.price-bbl {
	text-align: center;
	font-size: 87%;

	.c-hdg--en {
		color: var(--color-taq);
		letter-spacing: -0.1em;
	}
	&::before,
	&::after {
		background-color: var(--color-taq);
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.price-self {
	.price-tbl {
		width: 66%;
		max-width: 834px;
	}
}
.price-self__ttl {
	padding: 0 22%;
}

.price-bbl {
	position: absolute;
	padding: 3em 0;
	left: 7.8%;
	top: 50%;
	translate: -50% -50%;

	&::before,
	&::after {
		height: 3.5em;
		transform-origin: right center;
	}
	&::after {
		inset: 0 1em auto auto;
		rotate: -65deg;
	}
	&::before {
		inset: auto 1em 0 auto;
		rotate: 65deg;
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.price-self__ttl {
	margin-bottom: 6%;

	.c-txt--ccl {
		font-size: 85%;
		left: 75%;
		top: -12%;
		translate: none;
	}
}
.price-bbl {
	.c-hdg--en {
		font-size: 5vw;
	}
}
}


/*---------------------------------------------------------
 Equipment
---------------------------------------------------------*/
.equipment {
	.p-title01 {
		color: var(--color-nvy-300);

		.u-font--en {
			color: var(--color-nvy-300);
		}
	}
}
.equ-lead {
	margin-left: 3.4%;
	margin-right: 3.4%;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.equipment {
	.p-title01 {
		justify-content: center;
	}
}
}

/* Equipment - equ-list
-----------------------------------------------*/
.equ-list {
	display: grid;
	row-gap: 1em;
}
.equ-list__item {
	position: relative;

	&::before {
		position: absolute;
		content: "";
		background: url(../images/top/equ-bg01@2x.jpg) no-repeat center center;
		background-size: cover;
		width: 100%;
		height: calc(100% - min(12vw,175px));
		inset: auto 0 0 0;
		z-index: -1;
	}
	&:nth-of-type(2)::before {
		background-image: url(../images/top/equ-bg02@2x.jpg);
	}
	&:nth-of-type(3)::before {
		background-image: url(../images/top/equ-bg03@2x.jpg);
	}
}
.equ-list__img {
	position: relative;
	max-width: max-content;
	margin: auto;
}
.equ-list__txt {
	color: #FFF;
	padding: 1em 10% 18%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.equ-list {
	justify-content: space-between;
	grid-template-columns: repeat(3,32.7%);
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.equ-list__item {
	&::before {
		height: calc(100% - 32vw);
	}
}
.equ-list__txt {
	padding: 1em 8% 12%;
}
}


/*---------------------------------------------------------
 Process
---------------------------------------------------------*/
.process {
	color: #FFF;

	&::before,
	&::after {
		position: absolute;
		content: "";
		background-color: var(--color-nvy-300);
		width: 100%;
		height: min(7.2vw,110px);
		inset: auto 0 calc(100% - 1px) 0;
		clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 calc(100% - 1px));
		z-index: -1;
	}
	&::before {
		background-color: var(--color-gry-200);
		scale: -1 1;
		z-index: -2;
	}

	.c-bg-color {
		background-color: var(--color-nvy-300);
	}
	.p-title01 {
		justify-content: center;

		> span {
			color: #FFF;
		}
		.u-font--en {
			color: #FFF;

			&::before {
				background-color: var(--color-nvy-300);
			}
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.process {
	padding-top: 0;
	
	.p-title01 {
		justify-content: flex-end;
	}
}
}

/* process - list
-----------------------------------------------*/
.process-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: min(5vw,4.5em) 2.6%;

	> li {
		position: relative;
		width: 23%;
		text-align: center;
		padding-right: 5%;

		&::before {
			position: absolute;
			content: "";
			background: url(../images/top/process-arw.svg) no-repeat center center;
			background-size: contain;
			width: 25%;
			height: 100%;
			right: 0;
			top: 0;
		}
		.c-hdg--bld {
			font-size: min(2.1vw,200%);
			white-space: nowrap;
		}
		> img {
			margin: auto;
		}
		> p {
			position: relative;
			line-height: 1.6;
		}
		&:last-child {
			&::before {
				display: none;
			}
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.process-list {
	row-gap: 1em;

	> li {
		display: grid;
		justify-content: space-between;
		align-items: center;
		grid-template-columns: 26% 68%;
		text-align: left;
		width: 100%;
		padding-right: 0;
		padding-bottom: 12%;

		&::before {
			width: 11vw;
			height: 90vw;
			transform-origin: left bottom;
			rotate: 90deg;
			inset: auto 0 12vw 0;
		}
		.c-hdg--bld {
			font-size: 130%;
		}
	}
}
}


/*---------------------------------------------------------
 QA
---------------------------------------------------------*/

/* QA - l-qa
-----------------------------------------------*/

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.l-qa__q {
	.c-hdg--bld {
		font-size: min(2.2vw,150%);
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {


}


/*---------------------------------------------------------
 Instagram
---------------------------------------------------------*/
.instagram {
	padding-top: 0;

	.c-bg-tri {
		inset: auto 0 0 0;
	}
}
.insta-ttl {
	display: flex;
	justify-content: center;
	text-align: center;
	color: var(--color-gry-200);
	line-height: 0.7;
	margin-bottom: 6%;

	.insta-ttl__icon {
		width: 0.44em;
		margin-left: .1em;
	}
	> a {
		display: inline-flex;
	}
	.c-icon {
		color: var(--color-base);
		font-size: 25%;
		margin-left: .4em;
	}
}
.insta__inner {
	max-width: 1164px;
	margin-inline: auto;

	> p {
		font-weight: var(--fw-bold);
		margin-bottom: .8em;
	}
}

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

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {


}
