@charset "UTF-8";

.index-sec {
	display: grid;
	gap: min(var(--vw, 1vw) * 48 / 390 * 100, 72px) 0;
}

.index-sec-head {
	position: relative;
	z-index: 1;
	display: grid;
	gap: min(var(--vw, 1vw) * 12 / 390 * 100, 18px) 0;
	margin: 0 min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
	container-type: inline-size;
}

.index-sec-en {
	position: relative;
	display: inline-grid;
	justify-self: start;
	font-size: 11.7cqi;
	font-weight: 300;
	line-height: 1.2;
	color: transparent;
	text-transform: uppercase;
	letter-spacing: 0;
	background-image: linear-gradient(
		281deg,
		#fff 0%,
		#fff 25%,
		#0062c2 45%,
		#fff 50%,
		#0062c2 55%
	);
	background-position: 100% 50%;
	background-clip: text;
	background-size: 500% 100%;

	--bg-size: "";
}

.index-sec-en::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	color: transparent;
	white-space: pre-wrap;
	content: attr(data-text);
	background-image: linear-gradient(
		281deg,
		#133453 14.72%,
		#00a483 58.4%,
		#ae9cb5 100%
	);
	background-repeat: no-repeat;
	background-position: -150% -50%;
	background-clip: text;
	background-size: var(--bg-size);
	mix-blend-mode: lighten;
}

.index-sec-head.is-active .index-sec-en {
	background-position: 0 50%;
	transition: background 2s;
}

.index-sec-head.is-active .index-sec-en::before {
	background-position: 0 50%;
	transition: background 0.5s 0.5s;
}

.index-sec-jp {
	font-size: clamp(
		1.23rem,
		calc(
			1.5rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				3.75
		),
		2.25rem
	);
	font-weight: 700;
	line-height: 1.8;
	color: #133453;
	letter-spacing: 0.02em;
}

.index-kv {
	position: relative;
	z-index: 1;
	margin: var(--margin-top, 0) calc(50% - var(--vw, 1vw) * 50)
		var(--margin-bottom, 0);
	overflow: hidden;

	--margin-top: min(var(--vw, 1vw) * 64 / 390 * 100, 96px);
}

.index-kv::before,
.index-kv::after {
	position: absolute;
	top: 0;
	right: 0;
	content: "";
}

.index-kv::before {
	z-index: 1;
	width: 100%;
	height: 21.07%;
	clip-path: polygon(0 0, 100% 0, 100% 58.33%, 0 100%);
	background-color: #00a483;
	mix-blend-mode: color-burn;
}

.index-kv::after {
	z-index: 2;
	width: 32.3%;
	height: 48.53%;
	clip-path: polygon(100% 0, 0 0, 100% 100%);
	background-color: #0062c2;
	mix-blend-mode: color-burn;
}

.index-kv-bg {
	height: calc(var(--vw, 1vw) * 626.4 / 390 * 100);
}

.index-kv-bg img {
	height: 100%;
	object-fit: cover;
	object-position: bottom center;
}

.index-kv-main {
	position: absolute;
	bottom: -2.1%;
	left: 10.25%;
	z-index: 3;
}

.index-kv-copy {
	width: calc(var(--vw, 1vw) * 189.93 / 390 * 100);
	opacity: 0;
}

.index-kv-name {
	width: calc(var(--vw, 1vw) * 126.6 / 390 * 100);
	margin-top: calc(var(--vw, 1vw) * 32 / 390 * 100);
	opacity: 0;
}

.index-kv-people {
	width: calc(var(--vw, 1vw) * 245.13 / 390 * 100);
	margin: calc(var(--vw, 1vw) * 82.92 / 390 * 100) 0 0
		calc((var(--sw) + calc(var(--vw, 1vw) * 44 / 390 * 100)) * -1.1);
}

.is-loaded .index-kv-copy,
.is-loaded .index-kv-name {
	opacity: 1;
	transition: opacity 1s cubic-bezier(0.39, 0.57, 0.56, 1) 0.5s;
}

.index-message {
	display: grid;
	gap: min(var(--vw, 1vw) * 72 / 390 * 100, 108px) 0;
	padding: 0 min(var(--vw, 1vw) * 12 / 390 * 100, 18px);
	margin-top: min(var(--vw, 1vw) * 122 / 390 * 100, 183px);
}

.index-message-fig {
	width: min(var(--vw, 1vw) * 258 / 390 * 100, 387px);
	margin: 0 auto;
}

.index-message-body {
	display: grid;
	gap: 2em 0;
}

.index-message-txt {
	font-size: clamp(
		0.82rem,
		calc(
			1rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 2.5
		),
		1.5rem
	);
	font-weight: bold;
	line-height: 2;
	color: #133453;
	letter-spacing: 0.04em;
}

.index-bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	overflow-x: clip;
	pointer-events: none;
}

.index-bg-wrapper {
	position: sticky;
	top: 0;
	width: 100%;
	height: calc(100% - min(var(--vw, 1vw) * 31 / 390 * 100, 46.5px));
}

.index-bg-center,
.index-bg-layer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.index-bg-center::before,
.index-bg-center::after,
.index-bg-layer::before,
.index-bg-layer::after {
	position: absolute;
	content: "";
}

.index-bg-center::before,
.index-bg-layer::before {
	opacity: 0;
	transition:
		transform 1s,
		opacity 1s;
}

.index-bg-center {
	z-index: 5;
	background: linear-gradient(
		0deg,
		rgb(255 255 255 / 0%) 0%,
		rgb(255 255 255 / 0%) 9%,
		#fff 10%,
		#fff 90%,
		rgb(255 255 255 / 0%) 91%,
		rgb(255 255 255 / 0%) 100%
	);
}

.index-bg-center::before,
.index-bg-center::after {
	left: 50%;
	width: calc(var(--vw, 1vw) * 915 / 390 * 100);
	aspect-ratio: 1/1;
	background-color: #fff;
	border-radius: 50%;
}

.index-bg-center::before {
	top: min(var(--vw, 1vw) * 36 / 390 * 100, 54px);
	transform: translateX(-50%) scale(0);
}

.index-bg-center::after {
	bottom: min(var(--vw, 1vw) * 36 / 390 * 100, 54px);
	transform: translateX(-50%) scale(1);
}

.index-bg-layer::before {
	transition: transform 0.5s;
	transform: scale(0);
}

.index-bg-layer-1 {
	z-index: 1;
}

.index-bg-layer-1::before,
.index-bg-layer-1::after {
	width: min(var(--vw, 1vw) * 1470 / 390 * 100, 2205px);
	aspect-ratio: 1/1;
	background-color: #133453;
	border-radius: 50%;
}

.index-bg-layer-1::before {
	top: min(var(--vw, 1vw) * 4 / 390 * 100, 6px);
	left: calc(50% - min(var(--vw, 1vw) * 769 / 390 * 100, 1153.5px));
}

.index-bg-layer-1::after {
	bottom: min(var(--vw, 1vw) * 4 / 390 * 100, 6px);
	left: calc(50% - min(var(--vw, 1vw) * 701 / 390 * 100, 1051.5px));
}

.index-bg-layer-2 {
	z-index: 2;
}

.index-bg-layer-2::before,
.index-bg-layer-2::after {
	width: min(var(--vw, 1vw) * 870 / 390 * 100, 1305px);
	aspect-ratio: 145/123;
	background-color: #7ac9cc;
	border-radius: min(var(--vw, 1vw) * 870 / 390 * 100, 1305px) /
		min(var(--vw, 1vw) * 738 / 390 * 100, 1107px);
}

.index-bg-layer-2::before {
	top: 0;
	left: calc(50% - min(var(--vw, 1vw) * 307 / 390 * 100, 460.5px));
}

.index-bg-layer-2::after {
	bottom: 0;
	left: calc(50% - min(var(--vw, 1vw) * 563 / 390 * 100, 844.5px));
}

.index-bg-layer-3 {
	z-index: 3;
}

.index-bg-layer-3::before,
.index-bg-layer-3::after {
	width: min(var(--vw, 1vw) * 993 / 390 * 100, 1489.5px);
	aspect-ratio: 993/859;
	background-color: #ae9cb5;
	border-radius: min(var(--vw, 1vw) * 993 / 390 * 100, 1489.5px) /
		min(var(--vw, 1vw) * 859 / 390 * 100, 1288.5px);
}

.index-bg-layer-3::before {
	top: min(var(--vw, 1vw) * 35 / 390 * 100, 52.5px);
	left: calc(50% - min(var(--vw, 1vw) * 390 / 390 * 100, 585px));
}

.index-bg-layer-3::after {
	bottom: min(var(--vw, 1vw) * 35 / 390 * 100, 52.5px);
	left: calc(50% - min(var(--vw, 1vw) * 603 / 390 * 100, 904.5px));
}

.index-bg-layer-4 {
	z-index: 4;
}

.index-bg-layer-4::before,
.index-bg-layer-4::after {
	width: min(var(--vw, 1vw) * 615.3 / 390 * 100, 922.95px);
	aspect-ratio: 615.3/493.8;
	background-color: #00a483;
	border-radius: min(var(--vw, 1vw) * 615.3 / 390 * 100, 922.95px) /
		min(var(--vw, 1vw) * 493.8 / 390 * 100, 740.7px);
}

.index-bg-layer-4::before {
	top: min(var(--vw, 1vw) * 22 / 390 * 100, 33px);
	left: calc(50% - min(var(--vw, 1vw) * 470.8 / 390 * 100, 706.2px));
	transform: scale(0) rotate(-4.4deg);
}

.index-bg-layer-4::after {
	bottom: min(var(--vw, 1vw) * 23 / 390 * 100, 34.5px);
	left: calc(50% - min(var(--vw, 1vw) * 245.6 / 390 * 100, 368.4px));
	transform: rotate(175.5deg);
}

.index-concept {
	display: grid;
	gap: min(var(--vw, 1vw) * 32 / 390 * 100, 48px) 0;
}

.index-concept-wrap {
	justify-self: center;
	padding: min(var(--vw, 1vw) * 16 / 390 * 100, 24px);
	background-color: rgb(207 214 222 / 40%);
	border-radius: min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
	opacity: 0;
	transition:
		transform 0.5s,
		opacity 0.3s;
	transform: translateY(min(var(--vw, 1vw) * 80 / 390 * 100, 120px));
}

.index-concept-wrap.is-active {
	opacity: 1;
	transform: translateY(0);
}

.index-concept-lead {
	font-size: clamp(
		0.82rem,
		calc(
			1rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 2.5
		),
		1.5rem
	);
	font-weight: bold;
	line-height: 1.6;
	color: #133453;
}

.index-concept-img {
	width: 100%;
	aspect-ratio: 576/578;
	margin: 0 auto;
}

.index-sec:has(.index-numbers) {
	margin-top: min(var(--vw, 1vw) * 98 / 390 * 100, 147px);
}

.index-sec:has(.index-numbers) .index-sec-en {
	--bg-size: 66.66% 86.45%;
}

.index-numbers {
	border-top: 1px solid #133453;
}

.index-numbers-blc {
	display: grid;
	gap: min(var(--vw, 1vw) * 24 / 390 * 100, 36px) 0;
	padding: min(var(--vw, 1vw) * 40 / 390 * 100, 60px) 0;
	border-bottom: 1px solid #d0d6de;
}

.index-numbers-fig {
	overflow: hidden;
	border-radius: min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
}

.index-numbers-main {
	display: grid;
	font-family: "メイリオ", Meiryo, sans-serif;
}

.index-numbers-hdg {
	font-size: clamp(
		1.02rem,
		calc(
			1.25rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				3.13
		),
		1.88rem
	);
	font-weight: 700;
	line-height: 1.8;
	color: #133453;
	letter-spacing: 0.03em;
}

.index-numbers-article {
	margin-top: min(var(--vw, 1vw) * 16 / 390 * 100, 24px);
}

.index-numbers-txt {
	font-size: clamp(
		0.82rem,
		calc(
			1rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 2.5
		),
		1.5rem
	);
	line-height: 1.5;
}

.index-numbers-note {
	position: relative;
	padding-left: 1.05em;
	margin-top: 0.25em;
	font-size: clamp(
		0.71rem,
		calc(
			0.88rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				1.88
		),
		1.31rem
	);
	line-height: 1.5;
}

.index-numbers-note::before {
	position: absolute;
	top: 0;
	left: 0;
	content: "※";
}

.index-numbers-link {
	display: inline-grid;
	grid-template-columns:
		auto min(var(--vw, 1vw) * 16.6 / 390 * 100, 24.9px)
		min(var(--vw, 1vw) * 9 / 390 * 100, 13.5px);
	gap: 0 min(var(--vw, 1vw) * 16 / 390 * 100, 24px);
	align-items: center;
	justify-content: flex-start;
	margin-top: min(var(--vw, 1vw) * 32 / 390 * 100, 48px);
}

.index-numbers-link-txt {
	font-size: clamp(
		0.82rem,
		calc(
			1rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 2.5
		),
		1.5rem
	);
	font-weight: bold;
	line-height: 1;
	letter-spacing: 0.04em;
	transition: color 0.3s;
}

.index-numbers-link-external {
	filter: brightness(0) invert(0);
	transition: filter 0.3s;
}

.index-numbers-link-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 1/2;
	overflow: hidden;
}

.index-numbers-link-arw {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.index-numbers-link-arw:first-child {
	transform: translateX(0%);
	animation: transform-left-center 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)
		both 0.15s;
}

.index-numbers-link-arw:last-child {
	transform: translateX(-100%);
	animation: transform-center-right 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)
		both;
}

.index-numbers-link:focus-visible .index-numbers-link-txt {
	color: #0062c2;
}

.index-numbers-link:focus-visible .index-numbers-link-external {
	filter: brightness(1) invert(0);
}

.index-numbers-link:focus-visible .index-numbers-link-arw:first-child {
	animation: transform-center-right 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)
		both 0s;
}

.index-numbers-link:focus-visible .index-numbers-link-arw:last-child {
	animation: transform-left-center 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)
		both 0.15s;
}

.index-numbers-result {
	grid-row: 2/3;
	grid-column: 1/2;
	margin-left: auto;
}

.index-numbers-result-row {
	display: flex;
	gap: 0 min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
	align-items: baseline;
}

.index-numbers-result-modifier {
	font-size: clamp(
		1.02rem,
		calc(
			1.25rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				3.13
		),
		1.88rem
	);
	font-weight: bold;
	line-height: 1;
	color: #133453;
	letter-spacing: 0.03em;
}

.index-numbers-result-value {
	font-size: clamp(
		3.28rem,
		calc(
			4rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 10
		),
		6rem
	);
	line-height: 1;
	color: #0062c2;
}

.index-numbers-result-unit {
	line-height: 1;
	color: #133453;
}

.index-numbers-result-unit-en {
	font-size: clamp(
		1.64rem,
		calc(
			2rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 5
		),
		3rem
	);
}

.index-numbers-result-unit-jp {
	font-size: clamp(
		1.02rem,
		calc(
			1.25rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				3.13
		),
		1.88rem
	);
	font-weight: bold;
	letter-spacing: 0.03em;
}

.index-sec:has(.index-future) {
	margin-top: min(var(--vw, 1vw) * 132 / 390 * 100, 198px);
}

.index-sec:has(.index-future) .index-sec-en {
	--bg-size: 58.89% 90.97%;
}

.index-future {
	display: grid;
	gap: min(var(--vw, 1vw) * 24 / 390 * 100, 36px) 0;
}

.index-future-wrap {
	position: relative;
	z-index: 1;
	display: grid;
	gap: min(var(--vw, 1vw) * 24 / 390 * 100, 36px) 0;
	padding: min(var(--vw, 1vw) * 40 / 390 * 100, 60px)
		min(var(--vw, 1vw) * 32 / 390 * 100, 48px)
		min(var(--vw, 1vw) * 24 / 390 * 100, 36px);
	overflow: hidden;
	background-color: #fff;
	border-radius: min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
	box-shadow: 0 0 min(var(--vw, 1vw) * 16 / 390 * 100, 24px) rgb(19 52 83 / 20%);
	transition: transform 0.5s;
}

.index-future-bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	pointer-events: none;
	background-color: #133453;
	opacity: 0;
	transition: opacity 1s;
}

.index-future-fig {
	overflow: hidden;
	border-radius: min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
}

.index-future-bottom {
	display: grid;
	grid-template-columns: auto min(var(--vw, 1vw) * 56 / 390 * 100, 84px);
	gap: 0 min(var(--vw, 1vw) * 16 / 390 * 100, 24px);
	align-items: center;
}

.index-future-hdg {
	font-family: "メイリオ", Meiryo, sans-serif;
	font-size: clamp(
		0.92rem,
		calc(
			1.13rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				2.5
		),
		1.69rem
	);
	font-weight: 700;
	line-height: 1.5;
	color: var(--color);
	letter-spacing: 0.03em;

	--color: #133453;
}

.index-future-circle {
	position: relative;
	display: grid;
	place-content: center;
	place-items: center;
	aspect-ratio: 1/1;
	overflow: hidden;
	background-color: #0062c2;
	border-radius: 50%;
}

.index-future-icn {
	position: relative;
	width: min(var(--vw, 1vw) * 14 / 390 * 100, 21px);

	--color: #fff;

	aspect-ratio: 1/1;
}

.index-future-icn::before,
.index-future-icn::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 2px;
	content: "";
	background-color: var(--color);
	border-radius: 1px;
}

.index-future-icn::before {
	transform: translate(-50%, -50%);
}

.index-future-icn::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.index-future-card:focus-visible .index-future-wrap {
	transform: perspective(min(var(--vw, 1vw) * 500 / 1280 * 100, 625px))
		rotateY(3deg);
}

.index-future-card:focus-visible .index-future-bg {
	opacity: 1;
}

.index-future-card:focus-visible .index-future-bg::before {
	mask-position: 0 0;
}

.index-future-card:focus-visible .index-future-circle {
	background-color: #fff;
}

.index-future-card:focus-visible .index-future-hdg {
	--color: #fff;
}

.index-future-card:focus-visible .index-future-icn {
	--color: #133453;
}

.index-future-modal {
	position: relative;
	display: grid;
	gap: min(var(--vw, 1vw) * 16 / 390 * 100, 24px) 0;
	padding: min(var(--vw, 1vw) * 16 / 390 * 100, 24px);
	overflow: hidden;
	background-color: #133453;
	filter: drop-shadow(
		0 0 min(var(--vw, 1vw) * 16 / 390 * 100, 24px) 0 rgb(19 52 83 / 20%)
	);
	border-radius: min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
}

.index-future-modal::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 81.79%;
	height: 68.92%;
	content: "";
	background: linear-gradient(
		310deg,
		#133453 53.16%,
		#00a483 61.04%,
		#7ac9cc 70.3%,
		#ae9cb5 88.77%
	);
	mix-blend-mode: lighten;
}

.index-future-modal-wrap {
	max-height: calc(
		(var(--svh, 1vh) * 84) - min(var(--vw, 1vw) * 104 / 390 * 100, 156px)
	);
	overflow-y: auto;
	-ms-overflow-style: none;
}

.index-future-modal-wrap::-webkit-scrollbar {
	display: none;
}

.index-future-modal-inner {
	position: relative;
	z-index: 5;
	display: grid;
	gap: min(var(--vw, 1vw) * 24 / 390 * 100, 36px) 0;
}

.index-future-modal-fig {
	overflow: hidden;
	border-radius: min(var(--vw, 1vw) * 8 / 390 * 100, 12px);
}

.index-future-modal-article {
	display: grid;
	gap: min(var(--vw, 1vw) * 16 / 390 * 100, 24px) 0;
	font-family: "メイリオ", Meiryo, sans-serif;
}

.index-future-modal-hdg {
	font-size: clamp(
		1.23rem,
		calc(
			1.5rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 *
				3.75
		),
		2.25rem
	);
	font-weight: 700;
	line-height: 1.9;
	color: #fff;
	letter-spacing: 0.02em;
}

.index-future-modal-txt {
	font-size: clamp(
		0.82rem,
		calc(
			1rem + (min(var(--vw, 1vw), var(--svh, 1vh)) * 100 - 390px) * 0.01 * 2.5
		),
		1.5rem
	);
	font-weight: 700;
	line-height: 2;
	color: #fff;
	letter-spacing: 0.04em;
}

.index-future-modal-link {
	display: inline-block;
	margin-top: min(var(--vw, 1vw) * 16 / 390 * 100, 24px);
}

.index-future-modal-link a {
	display: inline;
	padding-bottom: 0.1em;
	line-height: 1;
	background-image: linear-gradient(#fff, #fff);
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 100% 2px;
	transition:
		background-size 0.3s,
		color 0.5s;
}

.index-future-modal-link a:focus-visible {
	background-position: bottom right;
	background-size: 0 2px;
}

.index {
	margin-bottom: min(var(--vw, 1vw) * 120 / 390 * 100, 180px);
}

.index-content {
	position: relative;
	z-index: 1;
	padding: var(--padding-top, 0) calc(var(--vw, 1vw) * 50 - 50%)
		var(--padding-bottom, 0);
	margin: var(--margin-top, 0) calc(50% - var(--vw, 1vw) * 50)
		var(--margin-bottom, 0);

	--margin-top: min(var(--vw, 1vw) * 80 / 390 * 100, 120px);
	--padding-bottom: min(var(--vw, 1vw) * 154 / 390 * 100, 231px);
	--padding-top: min(var(--vw, 1vw) * 155 / 390 * 100, 232.5px);
}

.index-content.is-active .index-bg-center::before,
.index-content.is-active .index-bg-center::after {
	opacity: 1;
	transform: translateX(-50%) scale(1);
}

.index-content.is-active .index-bg-layer::before,
.index-content.is-active .index-bg-layer::after {
	opacity: 1;
}

.index-content.is-active .index-bg-layer-1::before,
.index-content.is-active .index-bg-layer-1::after {
	transform: scale(1);
}

.index-content.is-active .index-bg-layer-2::before,
.index-content.is-active .index-bg-layer-2::after {
	transform: scale(1);
}

.index-content.is-active .index-bg-layer-3::before,
.index-content.is-active .index-bg-layer-3::after {
	transform: scale(1);
}

.index-content.is-active .index-bg-layer-4::before {
	transform: scale(1) rotate(-4.4deg);
}

@media screen and (width >= 960px) {
	.index-sec {
		gap: min(var(--vw, 1vw) * 48 / 1280 * 100, 60px) 0;
	}

	.index-sec-head {
		gap: min(var(--vw, 1vw) * 20 / 1280 * 100, 25px) 0;
		margin: 0 min(var(--vw, 1vw) * 106 / 1280 * 100, 132.5px);
	}

	.index-sec-en {
		font-size: min(
			calc(4rem + 0.01 * 1.25 * (var(--vw, 1vw) * 100 - 1280px)),
			4.5rem
		);
	}

	.index-sec-jp {
		font-size: min(
			calc(2rem + 0.01 * 0.63 * (var(--vw, 1vw) * 100 - 1280px)),
			2.25rem
		);
		line-height: 1.5;
		letter-spacing: 0.06em;
	}

	.index-kv {
		--margin-top: calc(52px + min(var(--vw, 1vw) * 32 / 1280 * 100, 40px));
	}

	.index-kv::before {
		height: 28.72%;
		clip-path: polygon(0 0, 100% 0, 100% 13.46%, 0 100%);
	}

	.index-kv::after {
		width: 46.09%;
		height: 100%;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 43.9% 100%);
	}

	.index-kv-bg {
		height: auto;
	}

	.index-kv-main {
		bottom: 4.3%;
		left: 4.99%;
	}

	.index-kv-copy {
		width: calc(var(--vw, 1vw) * 375.88 / 1280 * 100);
	}

	.index-kv-name {
		width: calc(var(--vw, 1vw) * 157 / 1280 * 100);
		margin-top: calc(var(--vw, 1vw) * 32 / 1280 * 100);
	}

	.index-kv-people {
		width: calc(var(--vw, 1vw) * 245.13 / 1280 * 100);
		margin: calc(var(--vw, 1vw) * 25.5 / 1280 * 100)
			calc(var(--vw, 1vw) * -40 / 1280 * 100) 0 auto;
	}

	.index-message {
		grid-template-columns: auto min(var(--vw, 1vw) * 617 / 1280 * 100, 771.25px);
		gap: 0 min(var(--vw, 1vw) * 112 / 1280 * 100, 140px);
		padding: 0 min(var(--vw, 1vw) * 49 / 1280 * 100, 61.25px);
		margin-top: min(var(--vw, 1vw) * 128 / 1280 * 100, 160px);
	}

	.index-message-fig {
		width: min(var(--vw, 1vw) * 258 / 1280 * 100, 322.5px);
		margin-top: min(var(--vw, 1vw) * 97.5 / 1280 * 100, 121.87px);
		margin-right: 0;
	}

	.index-message-wrap {
		position: sticky;
		top: 50%;
	}

	.index-message-logo {
		transform: translateY(max(var(--vw, 1vw) * -97.5 / 1280 * 100, -121.88px));
	}

	.index-message-txt {
		font-size: min(
			calc(1rem + 0.01 * 0.38 * (var(--vw, 1vw) * 100 - 1280px)),
			1.13rem
		);
	}

	.index-bg {
		height: calc(100% - min(var(--vw, 1vw) * 145 / 1280 * 100, 181.25px));
	}

	.index-bg-wrapper {
		height: calc(100% - min(var(--vw, 1vw) * 94 / 1280 * 100, 117.5px));
	}

	.index-bg-center::before,
	.index-bg-layer::before {
		clip-path: inset(0 0 50% 0);
	}

	.index-bg-center::after,
	.index-bg-layer::after {
		clip-path: inset(50% 0 0 0);
	}

	.index-bg-center::before,
	.index-bg-center::after {
		width: calc(var(--vw, 1vw) * 2182 / 1280 * 100);
	}

	.index-bg-center::before {
		top: min(var(--vw, 1vw) * 37 / 1280 * 100, 46.25px);
	}

	.index-bg-center::after {
		bottom: min(var(--vw, 1vw) * 110 / 1280 * 100, 137.5px);
	}

	.index-bg-layer-1::before,
	.index-bg-layer-1::after {
		width: min(var(--vw, 1vw) * 2820 / 1280 * 100, 3525px);
	}

	.index-bg-layer-1::before {
		top: 0;
		left: calc(50% - min(var(--vw, 1vw) * 1600 / 1280 * 100, 2000px));
	}

	.index-bg-layer-1::after {
		bottom: min(var(--vw, 1vw) * 81 / 1280 * 100, 101.25px);
		left: calc(50% - min(var(--vw, 1vw) * 1221 / 1280 * 100, 1526.25px));
	}

	.index-bg-layer-2::before,
	.index-bg-layer-2::after {
		width: min(var(--vw, 1vw) * 2820 / 1280 * 100, 3525px);
		aspect-ratio: 1/1;
		border-radius: 50%;
	}

	.index-bg-layer-2::before {
		left: calc(50% - min(var(--vw, 1vw) * 1293 / 1280 * 100, 1616.25px));
	}

	.index-bg-layer-2::after {
		bottom: min(var(--vw, 1vw) * 81 / 1280 * 100, 101.25px);
		left: calc(50% - min(var(--vw, 1vw) * 1528 / 1280 * 100, 1910px));
	}

	.index-bg-layer-3::before,
	.index-bg-layer-3::after {
		width: min(var(--vw, 1vw) * 2820 / 1280 * 100, 3525px);
		aspect-ratio: 1/1;
		border-radius: 50%;
	}

	.index-bg-layer-3::before {
		top: min(var(--vw, 1vw) * 65 / 1280 * 100, 81.25px);
		left: calc(50% - min(var(--vw, 1vw) * 1303 / 1280 * 100, 1628.75px));
	}

	.index-bg-layer-3::after {
		bottom: min(var(--vw, 1vw) * 138 / 1280 * 100, 172.5px);
		left: calc(50% - min(var(--vw, 1vw) * 1518 / 1280 * 100, 1897.5px));
	}

	.index-bg-layer-4::before,
	.index-bg-layer-4::after {
		width: min(var(--vw, 1vw) * 2448.5 / 1280 * 100, 3060.62px);
		aspect-ratio: 1.51/1;
		border-radius: min(var(--vw, 1vw) * 2448.5 / 1280 * 100, 3060.62px) /
			min(var(--vw, 1vw) * 1622 / 1280 * 100, 2027.5px);
	}

	.index-bg-layer-4::before {
		top: min(var(--vw, 1vw) * 67.25 / 1280 * 100, 84.06px);
		left: calc(50% - min(var(--vw, 1vw) * 1444 / 1280 * 100, 1805px));
	}

	.index-bg-layer-4::after {
		bottom: min(var(--vw, 1vw) * 140.3 / 1280 * 100, 175.37px);
		left: calc(50% - min(var(--vw, 1vw) * 1005.5 / 1280 * 100, 1256.87px));
	}

	.index-concept {
		gap: min(var(--vw, 1vw) * 32 / 1280 * 100, 40px) 0;
	}

	.index-concept-wrap {
		padding: min(var(--vw, 1vw) * 16 / 1280 * 100, 20px);
		border-radius: min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
		transform: translateY(min(var(--vw, 1vw) * 80 / 1280 * 100, 100px));
	}

	.index-concept-lead {
		font-size: min(
			calc(1rem + 0.01 * 0.38 * (var(--vw, 1vw) * 100 - 1280px)),
			1.13rem
		);
	}

	.index-concept-img {
		width: min(var(--vw, 1vw) * 576 / 1280 * 100, 720px);
	}

	.index-sec:has(.index-numbers) {
		margin-top: min(var(--vw, 1vw) * 128 / 1280 * 100, 160px);
	}

	.index-sec:has(.index-numbers) .index-sec-en {
		--bg-size: 52.41% 96.75%;
	}

	.index-numbers {
		margin: 0 min(var(--vw, 1vw) * 106 / 1280 * 100, 132.5px);
	}

	.index-numbers-blc {
		grid-template-columns: min(var(--vw, 1vw) * 312 / 1280 * 100, 390px) 1fr;
		gap: 0 min(var(--vw, 1vw) * 48 / 1280 * 100, 60px);
		align-items: flex-start;
		padding: min(var(--vw, 1vw) * 48 / 1280 * 100, 60px) 0;
	}

	.index-numbers-fig {
		border-radius: min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
	}

	.index-numbers-main {
		grid-template-columns: 1fr auto;
		gap: min(var(--vw, 1vw) * 24 / 1280 * 100, 30px)
			min(var(--vw, 1vw) * 12 / 1280 * 100, 15px);
		align-items: center;
	}

	.index-numbers-hdg {
		font-size: min(
			calc(1.38rem + 0.01 * 0.5 * (var(--vw, 1vw) * 100 - 1280px)),
			1.54rem
		);
	}

	.index-numbers-article {
		grid-column: span 2;
		margin-top: 0;
	}

	.index-numbers-txt {
		font-size: min(
			calc(1rem + 0.01 * 0.38 * (var(--vw, 1vw) * 100 - 1280px)),
			1.13rem
		);
	}

	.index-numbers-note {
		font-size: min(
			calc(0.88rem + 0.01 * 0.31 * (var(--vw, 1vw) * 100 - 1280px)),
			0.98rem
		);
	}

	.index-numbers-link {
		grid-template-columns:
			auto min(var(--vw, 1vw) * 16.6 / 1280 * 100, 20.75px)
			min(var(--vw, 1vw) * 9 / 1280 * 100, 11.25px);
		gap: 0 min(var(--vw, 1vw) * 16 / 1280 * 100, 20px);
		margin-top: min(var(--vw, 1vw) * 32 / 1280 * 100, 40px);
	}

	.index-numbers-link-txt {
		font-size: min(
			calc(1rem + 0.01 * 0.38 * (var(--vw, 1vw) * 100 - 1280px)),
			1.13rem
		);
	}

	.index-numbers-result {
		grid-row: 1/2;
		grid-column: 2/3;
	}

	.index-numbers-result-row {
		gap: 0 min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
	}

	.index-numbers-result:has(.index-numbers-result-row:nth-of-type(2))
		.index-numbers-result-row {
		justify-content: flex-end;
	}

	.index-numbers-result-modifier {
		font-size: min(
			calc(1.38rem + 0.01 * 0.5 * (var(--vw, 1vw) * 100 - 1280px)),
			1.54rem
		);
	}

	.index-numbers-result-value {
		font-size: min(
			calc(4rem + 0.01 * 1.25 * (var(--vw, 1vw) * 100 - 1280px)),
			4.5rem
		);
	}

	.index-numbers-result-unit-en {
		font-size: min(
			calc(2rem + 0.01 * 0.63 * (var(--vw, 1vw) * 100 - 1280px)),
			2.25rem
		);
	}

	.index-numbers-result-unit-jp {
		font-size: min(
			calc(1.38rem + 0.01 * 0.5 * (var(--vw, 1vw) * 100 - 1280px)),
			1.54rem
		);
	}

	.index-sec:has(.index-future) {
		margin-top: min(var(--vw, 1vw) * 100 / 1280 * 100, 125px);
	}

	.index-sec:has(.index-future) .index-sec-en {
		--bg-size: 43.2% 114.93%;
	}

	.index-future {
		grid-template-columns: repeat(
			2,
			min(var(--vw, 1vw) * 368 / 1280 * 100, 460px)
		);
		gap: min(var(--vw, 1vw) * 40 / 1280 * 100, 50px);
		justify-content: center;
	}

	.index-future-card:nth-of-type(1) {
		transition-delay: 0s;
	}

	.index-future-card:nth-of-type(2) {
		transition-delay: 0.15s;
	}

	.index-future-card:nth-of-type(3) {
		transition-delay: 0.3s;
	}

	.index-future-card:nth-of-type(4) {
		transition-delay: 0.45s;
	}

	.index-future-wrap {
		grid-template-rows: min(var(--vw, 1vw) * 286 / 1280 * 100, 357.5px) auto;
		gap: min(var(--vw, 1vw) * 24 / 1280 * 100, 30px) 0;
		height: 100%;
		padding: min(var(--vw, 1vw) * 40 / 1280 * 100, 50px)
			min(var(--vw, 1vw) * 24 / 1280 * 100, 30px)
			min(var(--vw, 1vw) * 24 / 1280 * 100, 30px);
		border-radius: min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
		box-shadow: 0 0 min(var(--vw, 1vw) * 16 / 1280 * 100, 20px)
			rgb(19 52 83 / 20%);
	}

	.index-future-bg::before {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 85.86%;
		height: 100%;
		aspect-ratio: 316/428;
		content: "";
		background: linear-gradient(
			310deg,
			#133453 53.16%,
			#00a483 62.58%,
			#7ac9cc 70.3%,
			#ae9cb5 88.77%
		);
		mix-blend-mode: lighten;
		mask-image: linear-gradient(
			135deg,
			#000,
			#000 33%,
			rgb(0 0 0 / 0%) 66%,
			rgb(0 0 0 / 0%) 100%
		);
		mask-position: 100% 100%;
		mask-size: 300% 300%;
		transition:
			mask 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
			-webkit-mask 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	}

	.index-future-fig {
		margin: 0 min(var(--vw, 1vw) * 16 / 1280 * 100, 20px);
		border-radius: min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
	}

	.index-future-bottom {
		grid-template-columns: auto min(var(--vw, 1vw) * 56 / 1280 * 100, 70px);
		gap: 0;
	}

	.index-future-hdg {
		font-size: min(
			calc(1.13rem + 0.01 * 0.44 * (var(--vw, 1vw) * 100 - 1280px)),
			1.26rem
		);
		text-align: center;
	}

	.index-future-hdg span:not(.br) {
		display: inline-block;
	}

	.index-future-icn {
		width: min(var(--vw, 1vw) * 14 / 1280 * 100, 17.5px);
	}

	.index-future-modal {
		gap: 0;
		padding: min(var(--vw, 1vw) * 32 / 1280 * 100, 40px);
		background: linear-gradient(
			333deg,
			#ae9cb5 8.92%,
			rgb(122 201 204 / 90%) 20.5%,
			rgb(0 164 131 / 80%) 29.95%,
			#133453 39.75%
		);
		filter: drop-shadow(
			0 0 min(var(--vw, 1vw) * 16 / 1280 * 100, 20px) 0 rgb(19 52 83 / 20%)
		);
		border-radius: min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
	}

	.index-future-modal::before {
		content: none;
	}

	.index-future-modal-wrap {
		max-height: calc(var(--svh, 1vh) * 84);
		overflow-y: none;
	}

	.index-future-modal-inner {
		grid-template-columns: auto 1fr;
		gap: 0 min(var(--vw, 1vw) * 32 / 1280 * 100, 40px);
	}

	.index-future-modal-fig {
		max-width: min(var(--vw, 1vw) * 764 / 1280 * 100, 955px);
		max-height: calc(
			var(--svh, 1vh) * 84 - min(var(--vw, 1vw) * 64 / 1280 * 100, 80px)
		);
		aspect-ratio: 764/576;
		border-radius: min(var(--vw, 1vw) * 8 / 1280 * 100, 10px);
	}

	.index-future-modal-article {
		grid-template-rows: auto 1fr auto;
		gap: min(var(--vw, 1vw) * 16 / 1280 * 100, 20px) 0;
		align-content: flex-start;
		max-height: calc(
			(var(--svh, 1vh) * 84) - min(var(--vw, 1vw) * 168 / 1280 * 100, 210px)
		);
		margin-top: min(var(--vw, 1vw) * 24 / 1280 * 100, 30px);
		overflow-y: auto;
		-ms-overflow-style: none;
	}

	.index-future-modal-article::-webkit-scrollbar {
		display: none;
	}

	.index-future-modal-hdg {
		font-size: min(
			calc(1.25rem + 0.01 * 0.44 * (var(--vw, 1vw) * 100 - 1280px)),
			1.41rem
		);
	}

	.index-future-modal-txt {
		font-size: min(
			calc(1rem + 0.01 * 0.38 * (var(--vw, 1vw) * 100 - 1280px)),
			1.13rem
		);
	}

	.index-future-modal-link {
		margin-top: min(var(--vw, 1vw) * 16 / 1280 * 100, 20px);
	}

	.index {
		margin-bottom: min(var(--vw, 1vw) * 156 / 1280 * 100, 195px);
	}

	.index-content {
		--margin-top: min(var(--vw, 1vw) * 80 / 1280 * 100, 100px);
		--padding-bottom: 0;
		--padding-top: min(var(--vw, 1vw) * 282 / 1280 * 100, 352.5px);
	}
}

@media screen and (width >= 1280px) {
	.index-bg-center {
		background: linear-gradient(
			0deg,
			rgb(255 255 255 / 0%) 0%,
			rgb(255 255 255 / 0%) 24%,
			#fff 25%,
			#fff 75%,
			rgb(255 255 255 / 0%) 76%,
			rgb(255 255 255 / 0%) 100%
		);
	}
}

@media (hover: hover) and (pointer: fine) {
	.index-numbers-link:hover .index-numbers-link-txt {
		color: #0062c2;
	}

	.index-numbers-link:hover .index-numbers-link-external {
		filter: brightness(1) invert(0);
	}

	.index-numbers-link:hover .index-numbers-link-arw:first-child {
		animation: transform-center-right 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)
			both 0s;
	}

	.index-numbers-link:hover .index-numbers-link-arw:last-child {
		animation: transform-left-center 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)
			both 0.15s;
	}

	.index-future-card:hover .index-future-wrap {
		transform: perspective(min(var(--vw, 1vw) * 500 / 1280 * 100, 625px))
			rotateY(3deg);
	}

	.index-future-card:hover .index-future-bg {
		opacity: 1;
	}

	.index-future-card:hover .index-future-bg::before {
		mask-position: 0 0;
	}

	.index-future-card:hover .index-future-circle {
		background-color: #fff;
	}

	.index-future-card:hover .index-future-hdg {
		--color: #fff;
	}

	.index-future-card:hover .index-future-icn {
		--color: #133453;
	}

	.index-future-modal-link a:hover {
		background-position: bottom right;
		background-size: 0 2px;
	}
}