@charset "utf-8";

#GHead {
	position: relative;
	z-index: 9000;
}

#Contents {
	padding-top: 0;
}

/*================================================================
admission-mv
================================================================*/
.admission-mv {
	padding: 80px 0;
	background: var(--bg01);
}

.admission-mv__sub-title {
	margin: 0;
	font-size: 45px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--white);
	text-align: center;
	letter-spacing: 0.04em;
}

.entrance-exam-topics2026 h1.admission-mv__title {
	margin: 24px 0 0;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 18px;
}

.admission-mv__title-label {
	padding: 17px 34px 22px;
	background: var(--gradient);
	display: inline-block;
	font-size: 60px;
	font-weight: 700;
	line-height: 1;
	color: var(--white);
	letter-spacing: 0.04em;
}

.admission-mv__title-main {
	display: inline-block;
	font-size: 65px;
	font-weight: 700;
	line-height: 1.1;
	color: var(--white);
	letter-spacing: 0.04em;
}

.admission-mv__deco {
	position: absolute;
	z-index: 1;
}

.admission-mv__deco img {
	width: 100%;
	height: auto;
	display: block;
}

.admission-mv__deco--01 {
	width: 542px;
	top: -42px;
	left: -600px;
}

.admission-mv__deco--02 {
	width: 460px;
	top: -71px;
	right: -560px;
}

/*================================================================
point01
================================================================*/
.point01 {
	--point01-scale: 1;
	margin: 0;
	padding: 100px 0 0;
	background: var(--white);
}

.point01 .wrap {
	position: relative;
	z-index: 1;
}

.point01__head {
	margin: 0 0 -40px;
	position: relative;
	z-index: 2;
}

.point01__point {
	width: calc(256px * var(--point01-scale));
	margin: 0;
}

.point01__point img {
	width: 100%;
	height: auto;
	display: block;
}

.point01__content {
	width: 1264px;
	height: calc(606px * var(--point01-scale));
	margin: 0;
	position: relative;
	z-index: 2;
	transform: scale(var(--point01-scale));
	transform-origin: left top;
}

.point01__lead {
	width: 560px;
	position: absolute;
	top: 80px;
	left: 0;
	z-index: 4;
}

.point01__title {
	margin: 0;
	font-size: 62px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0;
}

.point01__title-highlight {
	padding: 0 10px;
	background: linear-gradient(transparent 0, transparent 56%, var(--marker) 56%, var(--marker) 100%);
	display: inline-block;
	line-height: 1;
}

.point01__title em {
	padding: 0 10px;
	background: linear-gradient(transparent 0, transparent 68%, var(--marker) 68%, var(--marker) 100%);
	display: inline-block;
	font-size: 140px;
	font-weight: 700;
	font-style: normal;
	line-height: 1;
	color: var(--red);
	letter-spacing: 0;
}

.point01__title small {
	font-size: 64px;
	font-weight: 700;
}

.point01__visual {
	position: relative;
}

.point01__highlight {
	width: 514px;
	height: 428px;
	pointer-events: none;
	opacity: 0;
	position: absolute;
	top: -150px;
	left: 520px;
	z-index: 4;
	transform: translateY(24px);
}

.point01__highlight img {
	width: 100%;
	height: auto;
	display: block;
}

.point01__highlight.is-animated {
	animation: point01HighlightFade 0.8s ease forwards;
}

.point01__graph {
	width: 100%;
	padding: 0;
	position: relative;
	z-index: 2;
}

.point01__graph-body {
	display: flex;
	align-items: flex-end;
}

.point01__graph-history {
	width: 643px;
	height: 215px;
	opacity: 0;
	position: relative;
	display: flex;
	align-items: flex-end;
	transform: translateX(-40px);
	clip-path: inset(0 100% 0 0);
}

.point01__graph-history img {
	width: 100%;
	height: auto;
	display: block;
}

.point01__graph-bar-item {
	position: relative;
	display: flex;
	align-items: flex-end;
	overflow: visible;
}

.point01__graph-bar-item--2024 {
	width: 188px;
	height: 298px;
}

.point01__graph-bar-item--2025 {
	width: 188px;
	height: 469px;
	margin: 0 0 0 24px;
}

.point01__graph-bar-item--2026 {
	width: 188px;
	height: 606px;
	margin: 0 0 0 24px;
}

.point01__graph-bar-mask {
	width: 100%;
	height: 0;
	opacity: 0;
	position: absolute;
	right: 0;
	bottom: 0;
	overflow: hidden;
}

.point01__graph-bar-mask img {
	width: 100%;
	height: auto;
	position: absolute;
	right: 0;
	bottom: 0;
	display: block;
}

.point01__graph-value {
	width: 175px;
	margin: 0;
	opacity: 0;
	position: absolute;
	top: -71px;
	left: 50%;
	transform: translateX(-50%);
}

.point01__graph-value img {
	width: 100%;
	height: auto;
	display: block;
}

.point01__graph.is-animated .point01__graph-history {
	animation: point01HistoryFlow 0.9s ease forwards;
}

.point01__graph.is-animated .point01__graph-bar-item--2024 .point01__graph-bar-mask {
	animation: point01BarGrow2024 0.55s ease 0.95s forwards;
}

.point01__graph.is-animated .point01__graph-bar-item--2025 .point01__graph-bar-mask {
	animation: point01BarGrow2025 0.55s ease 1.45s forwards;
}

.point01__graph.is-animated .point01__graph-bar-item--2026 .point01__graph-bar-mask {
	animation: point01BarGrow2026 0.55s ease 1.95s forwards;
}

.point01__graph.is-animated .point01__graph-bar-item--2026 .point01__graph-value {
	animation: point01ValueFade 0.45s ease 2.35s forwards;
}

.point01__note {
	margin: 40px 0 0;
	padding: 44px;
	background: var(--gray01);
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 2;
}

.point01__note-text {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0;
}

.point01__note-accent {
	margin: 0;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.6;
	color: var(--secondary);
	letter-spacing: 0;
}

.point01__deco {
	position: absolute;
	z-index: 1;
}

.point01__deco img {
	width: 100%;
	height: auto;
	display: block;
}

.point01__deco--01 {
	width: 484px;
	top: 40px;
	left: -618px;
}

.point01__deco--02 {
	width: 528px;
	bottom: -690px;
	left: -714px;
}

.point01__deco--03 {
	width: 463px;
	top: 40px;
	right: -654px;
}

.point01__deco--04 {
	width: 667px;
	top: 730px;
	right: -785px;
}

.point01__deco--05 {
	width: 206px;
	right: -380px;
	bottom: -668px;
}

/*================================================================
point01 animation
================================================================*/
@keyframes point01HistoryFlow {
	0% {
		opacity: 0;
		transform: translateX(-40px);
		clip-path: inset(0 100% 0 0);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
		clip-path: inset(0 0 0 0);
	}
}

@keyframes point01BarGrow2024 {
	0% {
		height: 0;
		opacity: 0;
	}

	100% {
		height: 298px;
		opacity: 1;
	}
}

@keyframes point01BarGrow2025 {
	0% {
		height: 0;
		opacity: 0;
	}

	100% {
		height: 469px;
		opacity: 1;
	}
}

@keyframes point01BarGrow2026 {
	0% {
		height: 0;
		opacity: 0;
	}

	100% {
		height: 606px;
		opacity: 1;
	}
}

@keyframes point01ValueFade {
	0% {
		opacity: 0;
		transform: translateX(-50%) translateY(12px);
	}

	100% {
		opacity: 1;
		transform: translateX(-50%) translateY(0);
	}
}

@keyframes point01HighlightFade {
	0% {
		opacity: 0;
		transform: translateY(24px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

/*================================================================
point02
================================================================*/
.point02 {
	margin: 0;
	padding: 120px 0 0;
}

.point02__content {
	margin: 0;
}

.point02__head {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
}

.point02__point {
	width: 256px;
	margin: 0;
	flex: 0 0 256px;
}

.point02__point img {
	width: 100%;
	height: auto;
	display: block;
}

.point02__title {
	margin: 0;
	font-size: 84px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.02em;
}

.point02__title span {
	padding: 0;
	position: relative;
	display: inline-block;
	line-height: 1;
}

.point02__title span::after {
	width: 0;
	height: 40px;
	background: var(--marker);
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
	z-index: -1;
}

.point02.is-title-animated .point02__title span::after {
	animation: point02TitleLine 0.6s ease forwards;
}

.point02__cards {
	margin: 64px 0 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px;
}

.point02__card {
	padding: 32px 32px 48px;
	background: var(--bg01);
	position: relative;
	display: flex;
	justify-content: center;
}

.point02__card-arrow {
	width: 125px;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 0;
}

.point02__card-arrow img {
	width: 100%;
	height: auto;
	display: block;
}

.point02__text {
	padding: 0 0 28px;
	position: relative;
	display: inline-flex;
	justify-content: center;
	align-items: flex-end;
	gap: 12px;
}

.point02__text::after {
	width: 0;
	height: 16px;
	background: var(--marker);
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
}

.point02.is-cards-animated .point02__text::after {
	animation: point02CardLine 0.7s ease forwards;
}

.point02__card-name {
	margin: 0;
	font-size: clamp(32px, calc(4.6875vw - 16px), 44px);
	font-weight: 700;
	font-style: italic;
	line-height: 1;
	color: var(--white);
	letter-spacing: 0.01em;
	z-index: 1;
}

.point02__card-value {
	margin: 0;
	font-size: 0;
	line-height: 1;
	white-space: nowrap;
	transform: translate(0, 8px);
}

.point02__card-number {
	font-size: clamp(72px, calc(4.6875vw - 16px), 72px);
	font-weight: 700;
	font-style: italic;
	line-height: 1;
	color: var(--marker);
	letter-spacing: -0.02em;
}

.point02__card-unit {
	margin: 0 0 0 4px;
	font-size: 40px;
	font-weight: 700;
	font-style: italic;
	line-height: 1;
	color: var(--marker);
}

.point02__list {
	margin: 64px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: space-between;
}

.point02__item {
	padding: 0 24px 8px 24px;
	position: relative;
	white-space: nowrap;
	box-sizing: border-box;
}

.point02__item::before {
	width: 20px;
	height: 20px;
	background: var(--black);
	position: absolute;
	content: "";
	bottom: 18px;
	left: 0;
	z-index: 1;
}

.point02__item-arrow {
	width: 95px;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 0;
}

.point02__item-arrow img {
	width: 100%;
	height: auto;
	display: block;
}

.point02__item-name,
.point02__item-value {
	position: relative;
	z-index: 1;
}

.point02__item-name {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.02em;
}

.point02__item-value {
	margin: 0 0 0 6px;
	font-size: 0;
	line-height: 1;
}

.point02__item-number {
	font-size: 40px;
	font-weight: 700;
	line-height: 1;
	color: var(--red);
	letter-spacing: -0.02em;
}

.point02__item-unit {
	margin: 0 0 0 2px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	color: var(--red);
}

/*================================================================
point02 animation
================================================================*/
@keyframes point02TitleLine {
	0% {
		width: 0;
	}

	100% {
		width: 100%;
	}
}

@keyframes point02CardLine {
	0% {
		width: 0;
	}

	100% {
		width: 100%;
	}
}

/*================================================================
reason
================================================================*/
.reason .back01 {
	padding: 160px 0 0;
	background: var(--primary) url(../img/reason_back01.png) no-repeat center top / auto 300px;
}

@media screen and (min-width: 1921px) {
	.reason .back01 {
		background: var(--primary) url(../img/reason_back01.png) no-repeat center top / 100% 300px;
	}
}

.reason .back02 {
	padding: 80px 0 0;
	background: var(--white) url(../img/reason_back02.png) no-repeat center top / auto 300px;
}

@media screen and (min-width: 1921px) {
	.reason .back02 {
		background: var(--white) url(../img/reason_back02.png) no-repeat center top / 100% 300px;
	}
}

.reason .back02 .reason03 .reason__card {
	margin: 0 auto;
}

/*================================================================
reason heading
================================================================*/
.reason__heading {
	margin: 0 0 100px;
	padding: 0;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	z-index: 3;
}

.reason__section-title {
	margin: 0;
	padding: 24px 56px;
	background: var(--gradient);
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
	position: relative;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-size: 48px;
	font-weight: 700;
	line-height: 1;
	color: var(--white);
	letter-spacing: 0.04em;
}

.reason__section-title::after {
	width: 0;
	height: 0;
	border-top: 56px solid #4e92ce;
	border-right: 24px solid transparent;
	border-left: 24px solid transparent;
	position: absolute;
	content: "";
	bottom: -56px;
	left: 50%;
	transform: translateX(-50%);
}

.reason__section-title span {
	margin: 0 0 0 8px;
	font-size: 88px;
	line-height: 1;
}

.reason__section-title strong {
	margin: 0;
	font-size: 64px;
	line-height: 1;
}

.reason__head {
	height: 100px;
	padding: 40px 0;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	flex: 1 1 auto;
}

.reason__head::after {
	width: 100%;
	height: 2px;
	background: var(--gradient);
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
}

.reason__lead {
	margin: 0;
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.04em;
}

.reason .reason__title {
	margin: 0;
	font-size: 48px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.04em;
}

.reason__card {
	width: 100%;
	max-width: 1180px;
	margin: 80px auto 0;
	padding: 0 40px;
	opacity: 0;
	background: var(--white);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
	position: relative;
	box-sizing: border-box;
	z-index: 2;
	transition:
		opacity 0.8s ease,
		transform 0.8s ease;
	transform: translateY(48px);
}

.reason__card.is-animated {
	opacity: 1;
	transform: translateY(0);
}

.reason__top {
	display: flex;
	align-items: flex-start;
	gap: 54px;
}

.reason__label {
	width: 150px;
	height: 177px;
	padding: 24px 0 0;
	background: var(--gradient);
	position: relative;
	flex: 0 0 150px;
	color: var(--white);
	text-align: center;
	box-sizing: border-box;
	z-index: 3;
}

.reason__label::after {
	width: 0;
	height: 0;
	border-right: 77px solid transparent;
	border-bottom: 40px solid var(--white);
	border-left: 77px solid transparent;
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
}

.reason__label span {
	display: block;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.08em;
}

.reason__label strong {
	margin: 4px 0 0;
	display: block;
	font-size: 56px;
	font-weight: 700;
	line-height: 1;
}

.reason__body {
	padding: 40px 0;
}

.reason__text {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.8;
	letter-spacing: 0.02em;
}

/* reason animation
------------------------------------------------------ */
.reason .js-reason-heading {
	opacity: 0;
	transition:
		opacity 0.8s ease,
		transform 0.8s ease;
	transform: translateY(48px);
}

.reason .js-reason-heading.is-animated {
	opacity: 1;
	transform: translateY(0);
}

.reason .js-reason-card {
	opacity: 0;
	transition:
		opacity 0.8s ease,
		transform 0.8s ease;
	transform: translateY(48px);
}

.reason .js-reason-card.is-animated {
	opacity: 1;
	transform: translateY(0);
}

.reason .js-reason-badge {
	opacity: 0;
	transition:
		opacity 0.7s ease,
		transform 0.7s ease;
	transform: scale(0.86);
}

.reason .js-reason-badge.is-animated {
	opacity: 1;
	transform: scale(1);
}

/*================================================================
reason01
================================================================*/
.reason01 {
	margin: 0;
	position: relative;
}

.reason01__deco {
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.reason01__deco img,
.reason01__visual img,
.reason01__badge img {
	width: 100%;
	height: auto;
	display: block;
}

.reason01__deco--01 {
	width: 466px;
	top: 220px;
	left: -600px;
}

.reason01__deco--02 {
	width: 171px;
	top: -70px;
	right: -290px;
}

.reason01 .reason__body {
	min-height: 515px;
	margin: 28px 0 0;
	padding: 0;
	position: relative;
}

.reason01__visual {
	width: 390px;
	margin: 0;
	position: absolute;
	bottom: 0;
	left: -40px;
	z-index: 0;
}

.reason01__text {
	position: absolute;
	z-index: 2;
}

.reason01__text--01 {
	top: 9px;
	left: 224px;
}

.reason01__text--02 {
	top: 144px;
	left: 285px;
}

.reason01__text--02 .reason01__text-lead {
	margin: 0 0 -12px;
}

.reason01__text--03 {
	top: 286px;
	left: 365px;
}

.reason01__text--03 .reason01__text-lead {
	margin: 0 0 -12px;
}

.reason01__text-lead {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.04em;
}

.reason01__text-main {
	margin: 0;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.1;
	white-space: nowrap;
	letter-spacing: 0.02em;
}

.reason01__marker {
	background: linear-gradient(transparent 0, transparent 58%, #fff100 58%, #fff100 100%);
	display: inline-block;
}

.reason01__red {
	font-size: 56px;
	color: #e9281c;
}

.reason01__equal {
	margin: 0;
	font-size: 42px;
	font-weight: 700;
	line-height: 1;
}

.reason01__black-large {
	font-size: 54px;
	line-height: 1;
}

.reason01__text-note {
	margin: 8px 0 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.02em;
}

.reason01__source {
	position: absolute;
	bottom: 34px;
	left: 362px;
	z-index: 2;
}

.reason01__source p {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.02em;
}

.reason01__badge {
	width: 31%;
	max-width: 336px;
	opacity: 0;
	position: absolute;
	right: 0;
	bottom: 32px;
	z-index: 2;
	transition:
		opacity 0.7s ease,
		transform 0.7s ease;
	transform: scale(0.86);
}

.reason01__badge.is-animated {
	opacity: 1;
	transform: scale(1);
}

/*================================================================
reason02
================================================================*/
.reason02 {
	margin: 0;
	padding: 0;
	position: relative;
}

.reason02__deco {
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.reason02__deco img {
	width: 100%;
	height: auto;
	display: block;
}

.reason02__deco--01 {
	width: 460px;
	top: 90px;
	left: -580px;
}

.reason02__deco--02 {
	width: 504px;
	top: -30px;
	right: -630px;
}

.reason02__deco--03 {
	width: 1183px;
	right: -1360px;
	bottom: 100px;
}

.reason02__intro {
	margin: 0;
}

.reason02 .reason02__intro-title {
	margin: 0 0 8px;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.04em;
}

.reason02__intro-title span {
	margin: 0 0 0 18px;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.reason02__intro-title strong {
	margin: 0 0 0 4px;
	font-size: 24px;
}

.reason02__charts {
	margin: 24px 0 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 40px;
}

.reason02__chart {
	text-align: center;
}

.reason02__chart-circle {
	width: 290px;
	height: 290px;
	margin: 0 auto;
	position: relative;
}

.reason02__chart-circle svg {
	width: 100%;
	height: 100%;
	display: block;
	transform: rotate(-90deg);
}

.reason02__chart-track,
.reason02__chart-bar {
	fill: none;
	stroke-width: 36;
}

.reason02__chart-track {
	stroke: #d9d9d9;
}

.reason02__chart-bar {
	transition: stroke-dashoffset 1.5s cubic-bezier(0.22, 1, 0.36, 1);
	stroke-dasharray: 816.814;
	stroke-dashoffset: 816.814;
	stroke-linecap: butt;
}

.reason02__chart-bar--education {
	stroke: #16a8db;
}

.reason02__chart-bar--growth {
	stroke: #5b6ebe;
}

.reason02__chart-bar--admission {
	stroke: #7657a3;
}

.reason02__chart.is-animated .reason02__chart-bar {
	stroke-dashoffset: var(--chart-offset);
}

.reason02__chart-percent {
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 76px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	letter-spacing: -0.04em;
	transform: translate(-50%, -50%);
}

.reason02__chart-percent span {
	font-size: 38px;
	letter-spacing: -0.03em;
}

.reason02__chart-percent--education {
	color: #16a8db;
}

.reason02__chart-percent--growth {
	color: #5b6ebe;
}

.reason02__chart-percent--admission {
	color: #7657a3;
}

.reason02__chart-label {
	margin: 24px 0 0;
	padding: 10px 24px;
	border-radius: 999px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--white);
	letter-spacing: 0.08em;
}

.reason02__chart-label--education {
	background: #16a8db;
}

.reason02__chart-label--growth {
	background: #5b6ebe;
}

.reason02__chart-label--admission {
	background: #7657a3;
}

.reason02__chart-text {
	margin: 16px 0 0;
	display: inline-flex;
	justify-content: start;
	font-size: clamp(16px, 1.5625vw, 20px);
	font-weight: 700;
	text-align: left;
	letter-spacing: 0.01em;
}

/*================================================================
reason03
================================================================*/
.reason03 {
	margin: 0;
	padding: 0;
	position: relative;
}

.reason03__deco {
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.reason03__deco img {
	width: 100%;
	height: auto;
	display: block;
}

.reason03__deco--01 {
	width: 215px;
	top: 220px;
	left: -350px;
}

.reason03__deco--02 {
	width: 188px;
	top: 220px;
	right: -391px;
}

.reason03 .reason__body {
	padding: 40px 0;
}

.reason03__grid {
	display: grid;
	align-items: start;
	grid-template-columns: fit-content(100%) 433px;
	column-gap: 40px;
}

.reason__left,
.reason__right {
	min-width: 0;
	position: relative;
}

.reason03__photo {
	margin: 32px 0 0;
}

.reason03__photo img {
	width: 100%;
	height: auto;
	display: block;
}

.reason03__figure {
	width: 433px;
	height: 433px;
	margin: -16px 0 -24px;
	position: relative;
}

.reason03__figure-ring,
.reason03__figure-front {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.reason03__figure-ring {
	opacity: 0;
	z-index: 1;
}

.reason03__figure-ring svg {
	width: 100%;
	height: 100%;
	display: block;
}

.reason03__ring-path {
	opacity: 0;
	fill: none;
	stroke-width: 26;
	stroke-linecap: butt;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
}

.reason03__ring-path--left-half {
	stroke: url(#reason03-ring-gradient-left-half);
}

.reason03__ring-path--right-half {
	stroke: url(#reason03-ring-gradient-right-half);
}

.reason03__figure-ring.is-animated {
	opacity: 1;
}

.reason03__figure-ring.is-animated .reason03__ring-path--left-half,
.reason03__figure-ring.is-animated .reason03__ring-path--right-half {
	animation: reason03RingDraw .95s ease forwards;
}

.reason03__figure-front {
	opacity: 0;
	z-index: 2;
	transition: opacity .7s ease, transform .7s cubic-bezier(.16, 1, .3, 1);
	transform: scale(.86);
	transform-origin: center center;
}

.reason03__figure-front.is-animated {
	opacity: 1;
	transform: scale(1);
}

.reason03__figure-center {
	margin: 0;
	background: linear-gradient(90deg, #18a8db 0%, #6e86d6 52%, #a47bc0 100%);
	-webkit-background-clip: text;
	background-clip: text;
	position: absolute;
	top: 190px;
	left: 50%;
	display: inline-block;
	font-size: 56px;
	font-weight: 700;
	line-height: 1;
	color: transparent;
	letter-spacing: .08em;
	transform: translateX(-50%);
	-webkit-text-fill-color: transparent;
}

.reason03__figure-node {
	width: 122px;
	height: 122px;
	margin: 0;
	border-radius: 50%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
	color: var(--white);
	letter-spacing: .04em;
}

.reason03__figure-node--university {
	background: #5f6fc1;
	top: 18px;
	left: 50%;
	transform: translateX(-50%);
}

.reason03__figure-node--company {
	background: #16a8db;
	top: 250px;
	left: 18px;
}

.reason03__figure-node--local {
	background: #7b5aa6;
	top: 250px;
	right: 18px;
}

@keyframes reason03RingDraw {
	0% {
		opacity: 1;
		stroke-dashoffset: 1;
	}

	100% {
		opacity: 1;
		stroke-dashoffset: 0;
	}
}

/*================================================================
reason04
================================================================*/
.reason04 {
	margin: 0;
	padding: 0;
	position: relative;
}

.reason04__deco {
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.reason04__deco img {
	width: 100%;
	height: auto;
	display: block;
}

.reason04__deco--01 {
	width: 537px;
	top: -240px;
	left: -660px;
}

.reason04__deco--02 {
	width: 618px;
	top: 50px;
	right: -711px;
}

.reason04 .reason__body {
	padding: 48px 0 54px;
}

.reason04__grid {
	display: grid;
	align-items: center;
	grid-template-columns: 1fr 548px;
	column-gap: 64px;
}

.reason04 .reason__text {
	line-height: 2;
	letter-spacing: 0.03em;
}

.reason04__photo {
	margin: 0;
}

.reason04__photo img {
	width: 100%;
	height: auto;
	display: block;
}

/*================================================================
reason05
================================================================*/
.reason05 {
	margin: 0;
	padding: 0;
	position: relative;
}

.reason05__deco {
	pointer-events: none;
	position: absolute;
	z-index: 1;
}

.reason05__deco img {
	width: 100%;
	height: auto;
	display: block;
}

.reason05__deco--01 {
	width: 413px;
	bottom: -100px;
	left: -590px;
}

.reason05__deco--02 {
	width: 206px;
	bottom: 170px;
	right: -461px;
}

.reason05__grid {
	display: grid;
	align-items: center;
	grid-template-columns: 1fr 548px;
	column-gap: 64px;
}

.reason05 .reason__text {
	line-height: 2;
	letter-spacing: 0.03em;
}

.reason05__photo {
	margin: 0;
}

.reason05__photo img {
	width: 100%;
	height: auto;
	display: block;
}