@charset "utf-8";

.content-inner {
	background: #fff;
	z-index: 1;
	position: relative;
	overflow: hidden;
}

/*---------------------------------------------
    loading
*/

.loader {
	position: fixed;
	width: 100%;
	height: 100vh;
	z-index: 9999;
	left: 0;
	pointer-events: none;
}

.loader .bg {
	position: absolute;
	z-index: -1;
	width: 100%;
	height: 130%;
	background: #fff;
	animation: slideUpFadeOut 0.7s ease-in-out forwards 0.3s;
}

.loader .bg::before {
	display: block;
	width: 100%;
	height: 30%;
	position: absolute;
	background: linear-gradient(to bottom, #ffffff, transparent);
	bottom: -30%;
	left: 0;
	content: "";
}



.loader .loader-slide {
	width: 100%;
	/* height: 100%; */
	min-height: 90vh;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.loader .frame {
	border: 1px solid var(--site-color05);

}

.loader .frame,
.mv .frame {
	padding: 5px 12px;
	font-weight: 400;
	font-size: 1.3rem;
	letter-spacing: 0.33em;
}



.loader .catch,
.mv .catch {
	font-weight: 500;
	font-size: 2.2rem;
	letter-spacing: 0.13em;
	margin-block: 1.5vh 2vh;
}

.loader .logo-wrap,
.mv .logo-wrap {
	max-width: 44rem;
	width: 27vw;
}

.loader .frame,
.loader .catch,
.loader .logo-wrap {
	opacity: 1;
	animation: fadeOutText 1.2s ease forwards 0.3s;
}

@keyframes slideUpFadeOut {
	0% {
		transform: translateY(0);
	}

	100% {
		transform: translateY(-130%);
	}
}


@keyframes fadeOutText {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@media screen and (max-width: 820px) {


	.loader .frame,
	.mv .frame {
		font-size: 1.2rem;
		letter-spacing: 0.3em;
		line-height: 1.5;
	}

	.loader .catch,
	.mv .catch {
		font-size: 2rem;
		text-align: center;
		letter-spacing: 0.13em;
	}

	.loader .logo-wrap,
	.mv .logo-wrap {
		max-width: 70%;
		width: 100%;
	}

	.loader .bg::before {
		bottom: -14%;
		height: 15%;
	}
}


/*---------------------------------------------
    mv
*/


.mv .video-wrap {
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	position: fixed;
}

.mv .video-wrap video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -1000;
	overflow: hidden;
	transform: translate(-50%, -50%) scale(1.05);
}

.mv .mv-wrap {
	z-index: 1;
	position: relative;
	background: rgba(0, 0, 0, 0.5);
}

.mv .mv-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	/* height: 100vh; */
	min-height: 90vh;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
}

.mv .mv-inner::before {
	display: block;
	width: 100%;
	height: 30%;
	position: absolute;
	bottom: 0;
	left: 0;
	content: "";
}

.mv .mv-head-wrap {
	display: flex;
	align-items: center;
	gap: 6px;
	justify-content: center;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	width: 100%;
	top: 3vh;
}

.mv .head-logo-wrap {
	width: 4vw;
}

.mv .mv-head-wrap p {
	font-size: 1.5rem;
	letter-spacing: 0.24em;
	color: #fff;
}

.mv .frame {
	background-color: rgba(255, 255, 255, 0.26);
	font-weight: 400;
	letter-spacing: 0.33em;
	color: #fff;
}

.mv .catch {
	color: #fff;
}

.mv .lead {
	color: #fff;
	font-weight: 500;
	font-size: 1.8rem;
	line-height: 2.89;
	text-align: center;
	letter-spacing: 0.21em;
	padding-block: 17.3rem 60rem;
	position: relative;
	z-index: 1;
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0) 0%,
			rgba(0, 0, 0, 0.7)50%,
			rgba(0, 0, 0, 0.7) 100%);
	width: 100%;
	max-width: 100%;
}

.mv .lead::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 40%;
	bottom: -1px;
	left: 0;
	background: linear-gradient(to top, #ffffff, transparent);
}

@media screen and (max-width: 820px) {

	.mv .video-wrap video {
		height: 100%;
	}

	.mv .mv-head-wrap {
		top: 3vh;
	}

	.mv .head-logo-wrap {
		width: 100%;
		max-width: 50px;
	}

	.mv .mv-head-wrap p {
		font-size: 1.3rem;
		letter-spacing: 0.24em;
	}

	.mv .lead {
		padding-block: 15.9rem;
		font-weight: 500;
		font-size: 1.6rem;
		line-height: 2.38;
		text-align: center;
		letter-spacing: 0.21em;
	}

	.mv .mv-inner,
	.loader .loader-slide {
		min-height: 85vh;
	}
}


/*---------------------------------------------
    intro
*/
.intro {
	padding-top: 7.3rem;
	margin-bottom: 11rem;
	position: relative;
}

.intro .btn-web {
	margin-block: 0;
}

.intro .intro-contents {
	margin: 0 auto;
	position: relative;
	margin-top: 21.2rem;
}

.intro .intro-contents::before {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: calc((100% - 70vw) / 2 + 70vw);
	max-width: 1500px;
	height: 100%;
	content: '';
	background: url(../img/intro_bg.jpg) no-repeat top right /cover;
}

.intro .intro-inner {
	width: 63vw;
}

.intro .intro-sub-inner {
	max-width: 980px;
	margin-left: auto;
	position: relative;
}

.intro .intro-img-wrap {
	max-width: 338px;
	width: 30vw;
	position: absolute;
	top: -51px;
	left: -19%;
}

.intro .intro-text-wrap {
	max-width: 67%;
	margin-left: auto;
	padding-block: 13.3rem 9.3rem;
}

.intro .intro-text-wrap .intro-ttl {
	font-weight: 700;
	font-size: 2.6rem;
	margin-bottom: 3rem;
}

.intro .intro-text-wrap p {
	line-height: 2.05;
}

.intro .intro-text-wrap p:nth-of-type(n + 2) {
	margin-top: 3rem;
}

.intro .intro-en01,
.intro .intro-en02 {
	font-size: 1.5rem;
	font-style: normal;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: 0.14em;
	mix-blend-mode: multiply;
}

.intro .intro-en01 {
	position: absolute;
	left: 13%;
	top: 30px;
}

.intro .intro-en02 {
	position: relative;
	left: -20%;
}

.intro .intro-en02 span {
	position: absolute;
	top: 53%;
	left: 290px;
	display: block;
	width: 86%;
}

.intro .supervisor-wrap {
	display: flex;
	padding-block: 8.9rem 8.9rem;
	gap: 5.3rem;
	justify-content: center;
}

.intro .supervisor-wrap li {
	flex: 1;
	max-width: 403px;
}

.intro .supervisor-wrap li:last-child::before,
.intro .supervisor-wrap li:last-child::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	margin: auto 0;
	left: -8.5rem;
	width: 120px;
	height: 2px;
	background: var(--site-color04);
	opacity: 0.38;
	transform: rotate(45deg);
}

.intro .supervisor-wrap li:last-child::after {
	transform: rotate(-45deg);
}

.intro .supervisor-wrap .supervisor-ttl {
	font-size: 1.8rem;
	font-weight: 600;
	text-align: center;
	margin-bottom: 4rem;
	position: relative;
}

.intro .supervisor-wrap .supervisor-ttl::before {
	position: absolute;
	bottom: -20px;
	left: 50%;
	height: 14px;
	width: 1px;
	content: '';
	background-color: var(--site-color06);
}

.intro .supervisor-wrap .img-wrap {
	max-width: 277px;
	margin: 0 auto;
}

.intro .supervisor-wrap .catch-wrap {
	display: flex;
	margin-block: 2rem 1rem;
	gap: 2rem;
	align-items: center;
	justify-content: center;
}

.intro .supervisor-wrap li:first-child .catch-wrap .img-wrap {
	max-width: 70px;
	margin: 0;
}

.intro .supervisor-wrap .catch-wrap .img-wrap {
	max-width: 120px;
	object-fit: contain;
	margin: 0;
}

.intro .supervisor-wrap .catch-wrap .catch {
	font-size: 2rem;
	font-weight: 600;
	color: var(--site-color02);
}

.intro .supervisor-wrap .catch-wrap .catch .text-sm {
	font-size: 1.6rem;
}

.intro .supervisor-wrap .description {
	font-weight: 400;
	font-size: 1.4rem;
	text-align: justify;
}


@media screen and (max-width: 820px) {
	.intro {
		margin-block: 0 7rem;
		padding-top: 3.7rem;
	}

	.intro .intro-contents {
		margin-top: 19rem;
		background: url(../img/intro_bg_sp.jpg) top center / cover;
	}


	.intro .intro-contents::before {
		content: unset;
	}

	.intro .intro-inner {
		max-width: 83rem;
		width: 100%;
	}

	.intro .intro-img-wrap {
		width: 49vw;
		top: -8rem;
		left: -5%;
	}

	.intro .intro-text-wrap {
		max-width: 100%;
		padding-block: 20.3rem 6rem;
	}

	.intro .intro-text-wrap p {
		line-height: 1.8;
	}

	.intro .intro-text-wrap .intro-ttl {
		margin-bottom: 2rem;
		font-size: 2rem;
		text-align: center;
	}

	.intro .intro-en01 {
		left: 37%;
		top: 30px;
	}

	.intro .intro-en02 {
		left: -2%;
	}

	.intro .intro-en02 span {
		left: 82%;
	}

	.intro .supervisor-wrap {
		flex-direction: column;
		padding-block: 6rem 3.6rem;
		gap: 7.3rem;
	}

	.intro .supervisor-wrap li {
		max-width: 100%;
	}

	.intro .supervisor-wrap li:last-child::before,
	.intro .supervisor-wrap li:last-child::after {
		top: -37px;
		bottom: unset;
		right: 0;
		left: 0;
		margin: 0 auto;
		width: 7rem;
	}

	.intro .supervisor-wrap .catch-wrap {
		flex-direction: column;
		gap: 4px;
		margin-block: 2rem;
	}

	.intro .supervisor-wrap .catch-wrap .catch {
		text-align: center;
		font-size: 1.8rem;
	}

	.intro .supervisor-wrap .acc-list-content {
		max-width: 87%;
		margin: 0 auto;
	}

	/*----------------------------------------------
	more content settings
*/
	.more-content-gradation {
		position: relative;
		height: auto;
		max-height: 12rem;
		overflow: hidden;
		transition: max-height 1s;
	}

	.more-content-gradation::after {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		display: block;
		width: 100%;
		height: 100%;
		transition: 0.3s;
		background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(249, 246, 238, 0.8));
	}

	.more-content-gradation.is-open::after {
		display: none;
	}

	.acc-list-more-btn {
		max-width: 31rem;
		border-radius: 10px;
		text-align: center;
		position: relative;
		transition: opacity 0.3s;
		cursor: pointer;
		font-size: 1.3rem;
		z-index: 1;
		display: inline-block;
		left: 50%;
		transform: translateX(-50%);
		color: #231815;
	}

	.acc-list-more-btn::before,
	.acc-list-more-btn::after {
		content: "";
		background: #231815;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
	}

	.acc-list-more-btn::before {
		width: 10px;
		height: 1px;
		left: -15px;
	}

	.acc-list-more-btn::after {
		width: 1px;
		height: 10px;
		left: -10px;
		transition: transform 0.3s;
	}

	.acc-list-more-btn:hover {
		opacity: 0.6;
	}

	.acc-list-more-btn.is-open::after {
		transform: rotate(90deg);
	}

}

/*---------------------------------------------
    curriculum
*/
.curriculum .curriculum-inner {
	background: url(../img/curriculum_bg.jpg) no-repeat top center /cover;
	padding-bottom: 14.8rem;
	position: relative;
	margin-top: 23rem;
}


.curriculum .video-wrap {
	position: absolute;
	max-width: 660px;
	width: 100%;
	margin: 0 auto;
	top: -141px;
	z-index: 1;
	left: 50%;
	transform: translateX(-50%);
}

.curriculum .video-wrap .play-btn {
	display: block;
	width: 13%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
}

.curriculum .video-wrap .play-btn.playActive {
	display: none;
}


.curriculum .curriculum-list-wrap {
	display: flex;
	flex-direction: column;
	gap: 5rem;
	padding-top: 30.8rem;

}

.curriculum .curriculum-list-wrap li {
	position: relative;
}

.curriculum .curriculum-list-wrap .curriculum-list-inner {
	display: flex;
	background: #fff;
	padding: 6.8rem 6.8rem 5rem 6.6rem;
	max-width: 81%;
	outline: 3px solid rgba(191, 167, 85, .44);
	outline-offset: -9px;
	border: 1px solid rgba(191, 167, 85, .44);
}

.curriculum .curriculum-list-wrap .deco {
	position: absolute;
	display: inline-block;
	font-size: 1.6rem;
	color: #fff;
	z-index: 1;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0.14em;
	padding: 5px;
	top: 0px;
	left: 56px;
	width: 182px;
	text-align: center;
}

.curriculum .curriculum-list-wrap .deco::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: -1;
	background: var(--site-color04);
	transform: scaleY(0.9) perspective(0.5em) rotateX(-1.3deg);
	transform-origin: bottom;
	width: 100%;
	border-radius: 0 0 5px 5px;
}

.curriculum .curriculum-list-wrap li:nth-child(even) .deco {
	right: 67px;
	left: unset;
}

.curriculum .curriculum-list-wrap .curriculum-text-wrap {
	max-width: 69%;
}

.curriculum .curriculum-list-wrap .curriculum-list-ttl {
	font-weight: 600;
	font-size: 2.2rem;
	color: var(--site-color02);
	margin-bottom: 3.4rem;
}

.curriculum .curriculum-list-wrap .img-wrap {
	position: absolute;
	max-width: 437px;
	width: 43vw;
	right: 0;
	top: 0;
	bottom: 0;
	display: flex;
	align-items: center;
}

/* 画像左 */
.curriculum .curriculum-list-wrap li:nth-child(2n) .curriculum-list-inner {
	margin-left: auto;
	flex-direction: row-reverse;
}

.curriculum .curriculum-list-wrap li:nth-child(2n) .img-wrap {
	left: 0;
}

.curriculum .program-wrap {
	display: flex;
	gap: 4rem;
	justify-content: space-between;
	align-items: center;
	margin-top: 6.9rem;
	padding-inline: 5%;
}

.curriculum .program-wrap .img-wrap {
	max-width: 37rem;
}

.curriculum .program-wrap .text-wrap {
	flex-basis: 53%;
}

.curriculum .program-wrap .text-wrap .catch-wrap {
	margin-bottom: 3.8rem;
}

.curriculum .program-wrap .text-wrap .catch {
	font-weight: 600;
	font-size: 2.2rem;
	text-align: center;
	padding-block: 2.5rem;
	display: block;
}

@media screen and (max-width: 820px) {
	.curriculum .curriculum-inner {
		background: url(../img/curriculum_bg_sp.jpg) no-repeat top center /cover;
		margin-top: 10.2rem;
		padding-bottom: 7rem;
	}


	.curriculum .video-wrap {
		top: -72px;
	}

	.curriculum .curriculum-list-wrap {
		gap: 12.2rem;
		padding-top: 18.2rem;
	}

	.curriculum .curriculum-list-wrap .curriculum-list-inner {
		max-width: 100%;
		padding: 6rem 3rem 9rem;
		outline: 1px solid rgba(191, 167, 85, .44);
	}

	.curriculum .curriculum-list-wrap .deco {
		left: 50%;
		transform: translateX(-50%);
		padding: 0 1.5rem;
		font-size: 1.4rem;
	}

	.curriculum .curriculum-list-wrap .deco::before {
		transform: scaleY(0.9) perspective(0.5em) rotateX(-1.3deg);
		max-width: 100%;
	}

	.curriculum .curriculum-list-wrap li:nth-child(even) .deco {
		left: 50%;
		right: unset;
	}

	.curriculum .curriculum-list-wrap .curriculum-list-ttl {
		font-weight: 700;
		font-size: 1.8rem;
		text-align: center;
		margin-bottom: 2.5rem;
	}

	.curriculum .curriculum-list-wrap .curriculum-text-wrap {
		max-width: 100%;
	}

	.curriculum .curriculum-list-wrap .img-wrap,
	.curriculum .curriculum-list-wrap li:nth-child(2n) .img-wrap {
		max-width: 82%;
		width: 100%;
		top: unset;
		right: 0;
		left: 0;
		bottom: -15%;
		margin: 0 auto;
	}

	.curriculum .program-wrap {
		margin-top: 13.6rem;
		flex-direction: column;
		padding-inline: 2%;
	}

	.curriculum .program-wrap .img-wrap {
		max-width: 87%;
	}

	.curriculum .program-wrap .text-wrap .catch {
		font-weight: 700;
		font-size: 1.8rem;
		padding-block: 1.8rem;
	}

	.curriculum .program-wrap .text-wrap .catch-wrap {
		margin-bottom: 3rem;
	}

}

/*---------------------------------------------
    hero-area
*/
.hero-area {
	position: relative;
	margin-bottom: 8rem;
}

.hero-area-inner {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}


.hero-area .text-wrap {
	position: absolute;
	color: #fff;
	font-size: 1.8rem;
	margin: 0;
	padding: 0;
	text-align: center;
	z-index: 10;
}

.hero-area .text-wrap p {
	text-align: center;
	color: #fff;
	font-weight: 600;
	font-size: 2.2rem;
}

.hero-area .text-wrap .catch {
	font-weight: 700;
	font-size: 2.6rem;
	margin-bottom: 4rem;
}

@media screen and (max-width: 820px) {
	.hero-area {
		margin-bottom: 1rem;
	}

	.hero-area .text-wrap .catch {
		font-weight: 600;
		font-size: 2rem;
		margin-bottom: 1.5rem;
	}

	.hero-area .text-wrap p {
		font-size: 1.7rem;
		line-height: 1.8;
	}
}

/*---------------------------------------------
    charms
*/

.charms {
	margin-block: 13.3rem 28.5rem;
}

.charms .charms-list-wrap {
	margin-top: 6.5rem;
	display: flex;
	flex-direction: column;
	gap: 7.3rem;
}

.charms .charms-list-wrap .question {
	position: relative;
	padding: 5.8rem 5.4rem 5.4rem 20.7rem;
	background: url(../img/charms_bg_texture.png) no-repeat top left / cover;
	max-width: 69%;
	font-weight: 500;
	font-size: 2rem;
	color: var(--site-color06);
}


.charms .charms-list-wrap .question p {
	margin: 0;
	position: relative;
	z-index: 1;
}

.charms .charms-list-wrap .question .vertical {
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-orientation: sideways;
	position: absolute;
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 1.5;
	letter-spacing: 0.14em;
	opacity: 0.7;
	mix-blend-mode: darken;
	right: 10px;
	top: 40px;
}

.charms .charms-list-wrap .question .vertical::before,
.charms .charms-list-wrap .question .vertical::after {
	content: "";
	right: 0;
	left: 0;
	margin: auto;
	position: absolute;
	display: block;
	background-color: var(--site-color04);
}

.charms .charms-list-wrap .question .vertical::before {
	width: 1px;
	height: 25px;
	top: -40px;
}

.charms .charms-list-wrap .question .vertical::after {
	height: 5px;
	width: 5px;
	transform: rotate(45deg);
	top: -15px;
}

.charms .charms-list-wrap .answer {
	border: 2px solid #9B8642;
	background-color: #fff;
	max-width: 80rem;
	margin-left: auto;
	margin-top: -16px;
	z-index: 1;
	position: relative;
}

.charms .charms-list-wrap .answer-inner {
	position: relative;
	padding: 2.2rem 5rem 7.4rem 6rem;
}

.charms .charms-list-wrap .answer::before,
.charms .charms-list-wrap .answer::after,
.charms .charms-list-wrap .answer-inner::before,
.charms .charms-list-wrap .answer-inner::after {
	content: "";
	position: absolute;
	width: 25px;
	height: 25px;
	display: block;
	background-color: #9B8642;
}

.charms .charms-list-wrap .answer::before {
	border-bottom-right-radius: 100px;
	top: 0;
	left: 0;
}

.charms .charms-list-wrap .answer::after {
	border-bottom-left-radius: 100px;
	top: 0;
	right: 0;
}

.charms .charms-list-wrap .answer-inner::before {
	border-top-right-radius: 100px;
	bottom: 0;
	left: 0;
}

.charms .charms-list-wrap .answer-inner::after {
	border-top-left-radius: 100px;
	bottom: 0;
	right: 0;
}

.charms .charms-list-wrap .answer .deco-wrap {
	max-width: 50px;
	margin-inline: auto;
}

.charms .charms-list-wrap .answer .catch {
	margin-block: 2.3rem 3rem;
	font-weight: 600;
	font-size: 2.2rem;
	text-align: center;
	color: var(--site-color02);
}

@media screen and (max-width: 820px) {

	.charms {
		margin-block: 9.2rem 17rem;
	}

	.charms .charms-list-wrap {
		margin-top: 4rem;
		gap: 4rem;
	}

	.charms .charms-list-wrap .question {
		max-width: 110%;
		padding: 33px 33px 33px 57px;
		font-weight: 700;
		font-size: 1.8rem;
		margin-left: calc(50% - 50vw);
	}

	.charms .charms-list-wrap .question .vertical {
		font-size: 1.2rem;
	}

	.charms .charms-list-wrap .answer {
		margin-top: 1.6rem;
	}

	.charms .charms-list-wrap .answer-inner {
		padding: 2.3rem 2rem 2.3rem;
	}

	.charms .charms-list-wrap .answer .deco-wrap {
		max-width: 20%;
	}

	.charms .charms-list-wrap .answer .catch {
		font-weight: 700;
		font-size: 1.8rem;
		margin-bottom: 2.5rem;
	}
}

/*---------------------------------------------
    point
*/
.point {
	margin-top: -20rem;
	padding-top: 20rem;
}

.point-content-wrap {
	position: relative;
	max-width: 100rem;
	margin: 0 auto;
	background-color: #FFF6F6;
	border-top: solid 3px #E9546B;
	border-bottom: solid 3px #E9546B;
	padding: 17.2rem 5rem 6rem;
	margin-bottom: 4.6rem;
}


.point .point-hero-img {
	max-width: 86rem;
	width: 100%;
	position: absolute;
	top: -168px;
	right: 0;
	left: 0;
	margin: 0 auto;
}

.point .point-inner {
	display: flex;
	gap: 3.8rem;
	align-items: flex-end;
}

.point .point-inner .left-wrap,
.point .point-inner .right-wrap {
	flex: 1;
}

.point .point-inner .left-wrap {
	max-width: 427px;
}

.point .point-inner .left-wrap p {
	font-weight: 350;
	font-size: 2.1rem;
	text-align: center;
	color: var(--site-color02);
	position: relative;
	min-height: 20rem;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 5rem;
}

.point .point-inner .left-wrap p span.font-min {
	font-weight: 700;
	font-size: 2.6rem;
}

.point .point-inner .left-wrap p::before,
.point .point-inner .left-wrap p::after,
.point .point-inner .left-wrap p .deco::before,
.point .point-inner .left-wrap p .deco::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	display: block;
	top: 0;
}

.point .point-inner .left-wrap p::before {
	background-image: url(../img/point_deco.svg);
	width: 100%;
	height: 22rem;
}

.point .point-inner .left-wrap p .deco::after {
	transform: scale(-1, 1);
	right: 0;
}

.point .point-inner .left-wrap p::after {
	bottom: 0;
	top: unset;
	transform: scale(-1, -1) translateX(50%);
}

.point .point-inner .right-wrap .catch {
	font-weight: bold;
	font-size: 2.2rem;
	margin-bottom: 3.8rem;
}

.point .point-inner .right-wrap .catch span {
	font-size: 1.8rem;
}


.point-inner .right-wrap .caption {
	margin-top: 2rem;
	word-break: break-all;
	font-size: 1rem;
}


@media screen and (max-width: 820px) {
	.point {
		margin-top: -10rem;
		padding-top: 10rem;
	}

	.point-content-wrap {
		padding-right: calc(var(--s1) + var(--s-2));
		padding-left: calc(var(--s1) + var(--s-2));
		padding-top: 5.6rem;
		padding-bottom: 3rem;
		margin-bottom: 6rem;
		box-sizing: border-box;
	}

	.point .point-inner {
		flex-direction: column;
		gap: 2.5rem;
	}

	.point .point-inner .left-wrap {
		max-width: 100%;
		margin: 0 auto;
	}

	.point .point-inner .left-wrap p {
		min-height: 30vh;
		font-size: 1.8rem;
		margin-bottom: 2rem;
	}

	.point .point-inner .left-wrap p::before {
		height: 27vh;
		top: 0;
		bottom: 0;
		margin: auto;
	}

	.point .point-inner .left-wrap p span.font-min {
		font-size: 2.3rem;
	}

	.point-inner .left-wrap .img-wrap {
		background-color: #fff;
	}

	.point-inner .left-wrap .img-wrap picture {
		display: block;
        text-align: center;
	}

	.point-inner .left-wrap .caption {
		word-break: break-all;
		font-size: 1rem;
		padding: 1rem 1rem 2rem;
		text-align: center;
	}

	.point-inner .left-wrap .caption div {
		text-align: left;
		display: inline-block;
	}

	.point .point-hero-img {
		max-width: 87%;
		top: -8%;
	}


	.point .point-inner .right-wrap .catch {
		font-size: 1.8rem;
		margin-bottom: 3rem;
	}


}


/*---------------------------------------------
    learning
*/
.learning .learning-content-wrap {
	padding-block: 6.7rem 12.1rem;
	margin-top: 12rem;
	background: url(../img/learning_bg.jpg) no-repeat right /cover;
}

.learning .learning-cycle-wrap {
	margin-block: 5.8rem 2.8rem;
	position: relative;
}

.learning .learning-cycle-wrap .circle {
	position: absolute;
	max-width: 750px;
	width: 100%;
	height: 750px;
	border: solid 4px rgba(191, 167, 86, 0.4);
	border-radius: 50%;
	left: -53%;
	top: -20px;
}

.learning .learning-cycle-wrap .circle::before {
	position: absolute;
	content: "";
	background: url(../img/circle_arrow.png) no-repeat center / contain;
	width: 25px;
	height: 30px;
	display: block;
	right: 25%;
	bottom: 28px;
}

.learning-cycle-text {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
	display: flex;
	justify-content: center;
	flex-direction: column;
	left: -4.5vw;
	top: -13vh;
}

.learning .learning-cycle-text .catch {
	font-size: 2.5rem;
	color: var(--site-color02);
	margin-bottom: 2.5rem;
}

.learning .learning-cycle-text p span {
	display: block;
}


/* -- learning アコーディオン -- */
.learning .learning-sp-ac-btn {
	pointer-events: none;
	color: var(--site-color02);
	font-weight: 600;
	font-size: 2.3rem;
	padding-left: 10rem;
	width: 37%;
	position: relative;
}

.learning .learning-sp-ac-btn::before {
	content: counter(number, decimal-leading-zero);
	color: #fff;
	background-color: var(--site-color04);
	position: absolute;
	width: 8rem;
	height: 8rem;
	font-weight: 400;
	font-size: 3.4rem;
	font-family: var(--font-serif);
	line-height: 0.71;
	text-align: center;
	letter-spacing: 0.14em;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 0;
}

.learning .learning-list-wrap .learning-list:nth-child(1) .learning-sp-ac-btn,
.learning .learning-list-wrap .learning-list:nth-child(5) .learning-sp-ac-btn {
	width: 48%;
}

.learning .learning-list-wrap .learning-list:nth-child(2) .learning-sp-ac-btn,
.learning .learning-list-wrap .learning-list:nth-child(4) .learning-sp-ac-btn {
	width: 40%;
}

.learning .learning-sp-ac-btn span {
	position: relative;

}

.learning .learning-sp-ac-btn span::before {
	position: absolute;
	content: "";
	height: 1px;
	width: 180px;
	top: 0;
	right: -240px;
	bottom: 0;
	margin: auto 0;
	display: block;
	background-color: var(--site-color04);
}

.learning .learning-ac-content {
	background-color: #fff;
	border: 1px solid var(--site-color04);
	border-left: 5px solid var(--site-color04);
	max-width: 57.6rem;
	width: 100%;
	padding: 2.5rem 2rem 2.5rem 11rem;
	z-index: 1;
}


.learning .learning-ac-content p {
	position: relative;
}


.learning .learning-ac-content p::before {
	content: "";
	position: absolute;
	background-image: url(../img/flow06.png);
	background-repeat: no-repeat;
	background-size: contain;
	width: 80px;
	height: 67px;
	left: -95px;
	top: 0;
	bottom: 0;
	margin: auto 0;
}

.learning .learning-list-inner {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}


/* -- 流れ -- */
.learning .learning-list-wrap {
	display: flex;
	flex-direction: column;
	gap: 2.8rem;
	width: 100%;
}

.learning .learning-list-wrap .learning-list {
	counter-increment: number;
}


.learning .learning-list-wrap .learning-list:nth-child(1) .learning-ac-content p::before {
	background-image: url(../img/flow01.png);
}

.learning .learning-list-wrap .learning-list:nth-child(2) .learning-ac-content p::before {
	background-image: url(../img/flow02.png);
}

.learning .learning-list-wrap .learning-list:nth-child(3) .learning-ac-content p::before,
.learning .learning-list-wrap .learning-list:nth-child(4) .learning-ac-content p::before {
	background-image: url(../img/flow03.png);
}

.learning .learning-list-wrap .learning-list:nth-child(5) .learning-ac-content p::before {
	background-image: url(../img/flow05.png);
}

.learning .learning-list.everyday .learning-list-inner {
	justify-content: space-between;
}

.learning .learning-list.everyday .labrl {
	padding: 1rem;
	background-color: var(--site-color04);
	color: #fff;
	font-size: 2.1rem;
	border-radius: 50vh;
	min-width: 120px;
	text-align: center;
	margin-right: 1vw;
}

.learning .learning-list.everyday .learning-sp-ac-btn {
	padding-left: 0;
}

.learning .learning-list.everyday .learning-sp-ac-btn::before {
	content: unset;
}

.learning .learning-list.everyday .learning-sp-ac-btn span::before {
	width: 130px;
}


@media screen and (max-width: 820px) {
	.learning .learning-content-wrap {
		background: url(../img/learning_bg_sp.jpg) top center / contain;

		margin-top: 7rem;
		padding-block: 4rem 5rem;
	}

	.learning .learning-cycle-wrap {
		margin-block: 1.7rem;
	}

	.learning .learning-bottom-wrap {
		display: flex;
		flex-direction: column-reverse;
	}

	.learning .learning-cycle-text {
		position: relative;
		left: unset;
		margin-block: 3.5rem 2.5rem;
		top: 0;
	}

	.learning .learning-cycle-text .catch {
		font-weight: 600;
		font-size: 2rem;
		text-align: center;
		margin-bottom: 1rem;
	}

	.learning .learning-cycle-text p {
		text-align: center;
	}

	.learning .learning-cycle-text p span {
		display: inline;
	}

	.learning .learning-list-wrap {
		gap: 1.8rem;
	}

	.learning .learning-list {
		border: 1px solid var(--site-color04);
		background-color: #fff;
	}

	/* -- learning アコーディオン -- */
	.learning .learning-list-inner {
		display: block;
	}

	.learning .learning-sp-ac-btn {
		position: relative;
		pointer-events: all;
		font-weight: 700;
		font-size: 1.8rem;
		padding-left: 0;
		padding: 1.5rem 1.5rem 1.5rem 6.2rem;
		width: 100%;
	}

	.learning .learning-sp-ac-btn::before {
		font-size: 2.2rem;
		width: 4rem;
		height: 4rem;
		left: 10px;
	}

	.learning .learning-list-wrap .learning-list:nth-child(1) .learning-sp-ac-btn,
	.learning .learning-list-wrap .learning-list:nth-child(2) .learning-sp-ac-btn,
	.learning .learning-list-wrap .learning-list:nth-child(3) .learning-sp-ac-btn,
	.learning .learning-list-wrap .learning-list:nth-child(4) .learning-sp-ac-btn,
	.learning .learning-list-wrap .learning-list:nth-child(5) .learning-sp-ac-btn {
		width: 100%;
	}

	.learning .learning-sp-ac-btn span {
		display: block;
	}

	.learning .learning-sp-ac-btn span::before,
	.learning .learning-sp-ac-btn span::after {
		position: absolute;
		content: '';
		top: 0;
		bottom: 0;
		margin: auto;
		right: 10px;
		width: 22px;
		height: 1px;
		background: var(--site-color04);
	}

	.learning .learning-sp-ac-btn span::after {
		transform: rotate(-90deg);
		transition: transform 0.3s;
	}

	.learning .learning-sp-ac-btn.active span::after {
		transform: rotate(0deg);
	}

	.learning .learning-ac-content {
		display: none;
		border: none;
		position: unset;
		padding: 0;
		position: relative;
		width: 100%;
	}

	.learning .learning-ac-content p {
		padding: 17% 1.5rem 1.9rem;
		border-top: 1px solid #E4D5A4;

	}

	.learning .learning-ac-content p::before {
		bottom: unset;
		left: 50%;
		width: 12rem;
		height: 100%;
		transform: translateX(-50%);
		background-image: url(../img/flow06_sp.png);
	}

	.learning .learning-list-wrap .learning-list:nth-child(1) .learning-ac-content p::before,
	.learning .learning-list-wrap .learning-list:nth-child(2) .learning-ac-content p::before,
	.learning .learning-list-wrap .learning-list:nth-child(5) .learning-ac-content p::before {
		width: 22vw;
	}

	.learning .learning-list-wrap .learning-list:nth-child(3) .learning-ac-content p::before,
	.learning .learning-list-wrap .learning-list:nth-child(4) .learning-ac-content p::before {
		background-image: url(../img/flow03_sp.png);
	}


	/* -- 流れ -- */
	.learning .learning-list-wrap {
		position: relative;
	}

	.learning .learning-list-wrap::before {
		position: absolute;
		content: "";
		width: 4px;
		height: 100%;
		left: 50%;
		background-color: #E4D5A4;
	}

	.learning .learning-list-wrap li:last-child::after {
		position: absolute;
		content: "";
		width: 33px;
		height: 33px;
		bottom: -34px;
		left: 42%;
		background: url(../img/learning_arrow.svg) no-repeat center / contain;
	}


	.learning .learning-list.everyday {
		position: relative;
	}

	.learning .learning-list.everyday .labrl {
		margin: 0;
		position: absolute;
		font-size: 1.6rem;
		min-width: 111px;
		text-align: center;
		padding-block: 0;
		top: -16px;
		left: 50%;
		transform: translateX(-50%);
	}

	.learning .learning-list.everyday .learning-sp-ac-btn {
		padding: 2rem;
	}

	.learning .learning-list.everyday .learning-sp-ac-btn span::before {
		width: 23px;
	}


}

/* タブレット */
@media (min-width: 821px) and (max-width: 1240px) {


	.learning .learning-ac-content {
		width: 47vw;
	}

	.learning .learning-sp-ac-btn {
		width: 34%;
	}

	.learning .learning-sp-ac-btn::before {
		left: 2%;
	}

	.learning .learning-list-wrap .learning-list:nth-child(1) .learning-sp-ac-btn,
	.learning .learning-list-wrap .learning-list:nth-child(5) .learning-sp-ac-btn {
		width: 43%;
	}

	.learning .learning-list-wrap .learning-list:nth-child(2) .learning-sp-ac-btn,
	.learning .learning-list-wrap .learning-list:nth-child(4) .learning-sp-ac-btn {
		width: 36%;
	}


	.learning-cycle-text {
		left: 1vw;
	}

	.learning .learning-cycle-wrap .circle {
		top: -5vh;
		left: unset;
		right: 73vw;
		max-width: 100%;
		height: 70vh;
		min-height: 750px;
	}
}


/*---------------------------------------------
    faq
*/
.faq {
	margin-block: 11.5rem 9.2rem;
}

.faq .faq-content {
	max-width: 70rem;
	margin: 0 auto;
	margin-block: 3.8rem 9.8rem;
}

.faq .faq-content li {
	border-top: 1px solid var(--site-color04);
	border-bottom: 1px solid var(--site-color04);
}

.faq .faq-content li:nth-child(n+2) {
	border-top: unset;
}

.faq .faq-content .faq-ac-btn {
	font-weight: 600;
	font-size: 2.2rem;
	padding-block: 2.3rem;
	position: relative;
	padding-left: 4rem;
}


.faq .faq-content .faq-ac-btn span::before {
	position: absolute;
	content: 'Q.';
	font-family: var(--font-serif);
	font-size: 2.2rem;
	left: 0;
}



.faq .faq-content .faq-ac-btn::before,
.faq .faq-content .faq-ac-btn::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	margin: auto 0;
	right: 20px;
	width: 23px;
	height: 2px;
	background: var(--site-color04);
}

.faq .faq-content .faq-ac-btn:hover {
	cursor: pointer;
}

.faq .faq-content .faq-ac-btn::after {
	transform: rotate(-90deg);
	transition: transform 0.3s;
}

.faq .faq-content .faq-ac-btn.active::after {
	transform: rotate(0deg);
}



.faq .faq-content .faq-ac-content {
	display: none;
	padding: 0 0 3rem 4rem;
}

@media screen and (max-width: 820px) {
	.faq {
		margin-block: 7rem 4.2rem;
	}

	.faq .faq-content {
		margin-bottom: 6.5rem;
	}

	.faq .faq-content .faq-ac-btn {
		font-weight: 700;
		font-size: 1.8rem;
		padding-right: 50px;
		padding-block: 2.6rem;
	}

	.faq .faq-content .faq-ac-btn span::before {
		font-size: 1.8rem;
		left: 1rem;
	}

	.faq .faq-content .faq-ac-content {
		margin: 0;
	}
}