@charset "utf-8";
/*-------------------------------------------------

	Main Visual

--------------------------------------------------*/
#mv {z-index: 2;padding-bottom: 8vw;}
#mv::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10vw;
	background: #000A6A;
}
#mv .mv_container {position: relative;}
#mv .mv_container .wrap {position: absolute;top: 45%;left: 10%;z-index: 2;transform: translateY(-50%);width: 70%;}
#mv .mv_container .wrap p {margin-bottom: 1%;font-weight: 600;font-size: 1.4vw;}
#mv .mv_container .wrap p.main {margin-bottom: 1%;font-weight: 600;font-size: 3vw;line-height: 1.4;}
#mv .mv_container .wrap small {display: block;font-size: 1.2vw;line-height: 1.5; margin-bottom: 8%;}
#mv .mv_container .wrap h1 {display: block;font-size: 1.6vw;line-height: 1.5;}
.image-crossfader {
	position: relative;
	z-index: -2;
	width: 60%;
	margin-left: auto;
	padding-top: 46.4%;
	overflow: hidden;
}
.image-crossfader::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 40%;
	height: 100%;
	background: linear-gradient(90deg, #fff, transparent);
}
.image-crossfader-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	opacity: 0;
	transform: scale(1.2);
	transition:
	opacity 1.5s cubic-bezier(0.455, 0.03, 0.515, 0.955),
	transform 3.5s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.image-crossfader-inner:nth-of-type(1) {background: url("../img/front/mv/slide01.webp") no-repeat center / cover;}
.image-crossfader-inner:nth-of-type(2) {background: url("../img/front/mv/slide02.webp") no-repeat center / cover;}
.image-crossfader-inner:nth-of-type(3) {background: url("../img/front/mv/slide03.webp") no-repeat center / cover;}

.image-crossfader-inner.is-visible {z-index: 1;opacity: 1;transform: scale(1.02);}
#mv .block {
	align-items: center;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 10;
	transform: translateY(45%);
	width: 100%;
	padding-right: 4vw;
}
#mv .block figure {width: 35%;}
@media only screen and ( max-width : 767px ) {
	#mv {padding: 10vw 0 0;}
	#mv .mv_container .wrap {position: initial;transform: none;width: 100%;padding: 0 5vw;}
	#mv .mv_container .wrap p {margin-bottom: 2%;font-size: 3.4vw;}
	#mv .mv_container .wrap p.main {margin-bottom: 5%;font-size: 6vw;}
	#mv .mv_container .wrap h1 {margin-bottom: 5%;font-size: 2vw;}
	#mv .mv_container .wrap small {font-size: 3.2vw; margin-bottom: 6%}
	.image-crossfader {width: 100%;margin-left: 0;padding-top: 85%;}
	.image-crossfader::before {display: none;}
	.image-crossfader-inner:nth-of-type(1) {background: url("../img/front/mv/slide01-sp.webp") no-repeat center / cover;}
	.image-crossfader-inner:nth-of-type(2) {background: url("../img/front/mv/slide02-sp.webp") no-repeat center / cover;}
	.image-crossfader-inner:nth-of-type(3) {background: url("../img/front/mv/slide03-sp.webp") no-repeat center / cover;}
	#mv .block {position: initial;transform: none;padding: 0;}
	#mv .block figure {display: none;}
}
/*-------------------------------------------------

	News

--------------------------------------------------*/
#news {
	display: flex;
	gap: clamp(20px, calc(20px + 50 * ((100vw - 375px) / 1545)), 70px);
	width: 60%;
	padding: clamp(20px, calc(20px + 10 * ((100vw - 375px) / 1545)), 30px);
	padding-bottom: clamp(40px, calc(40px + 20 * ((100vw - 375px) / 1545)), 60px);
	padding-left: clamp(30px, calc(30px + 20 * ((100vw - 375px) / 1545)), 50px);
	box-shadow: 0 3px 6px rgba(0, 0, 0, 16%);
	background: #fff;
}
#news .title_wrap h2 {margin-bottom: 5px;font-size: clamp(22px, calc(22px + 10 * ((100vw - 375px) / 1545)), 32px);}
#news .title_wrap h2.bottomBorder.isActive::before {width: 48px;}
#news .title_wrap p {letter-spacing: .1em;}
#news .container {display: flex;flex: 1;justify-content: space-between;align-items: flex-end;gap: 10px;}
#news .container ul {flex: 1;}
#news .container ul li {display: inline-flex;align-items: center;position: relative;margin-bottom: 15px;}
#news .container ul li:last-child {margin-bottom: 0;}
#news .container ul li dl {display: flex;align-items: center;gap: clamp(20px, calc(20px + 10 * ((100vw - 375px) / 1545)), 30px);}
#news .container ul li dl dt time {padding-top: 5px;letter-spacing: .1em;}
#news .container ul li dl dd {flex: 1;letter-spacing: .1em;}
#news .container a.view {
	position: relative;
	padding-right: 10%;
	font-size: clamp(16px, calc(16px + 6 * ((100vw - 375px) / 1545)), 22px);
	letter-spacing: .05em;
}
#news .container a.view::after {
	content: '';
	position: absolute;
	bottom: 5px;
	left: 65%;
	width: clamp(37px, calc(37px + 20 * ((100vw - 375px) / 1545)), 57px);
	height: 100%;
	background: url(../img/common/Icon_arrowR-blk.svg) no-repeat bottom / 100%;
	transition: .3s;
}
#news .container a.view:hover::after {left: 70%;}
@media only screen and ( max-width : 1024px ) {
	#news {display: block;padding: 20px;}
	#news .title_wrap {margin-bottom: 30px;}
	#news .container {display: block;}
	#news .container ul {margin-bottom: 30px;}
}
@media only screen and ( max-width : 767px ) {
	#news {position: initial;width: 100%;}
}
/*-------------------------------------------------

	Question

--------------------------------------------------*/
#question {
	padding-top: clamp(200px, calc(200px + 90 * ((100vw - 375px) / 1545)), 290px);
	padding-bottom: clamp(50px, calc(50px + 40 * ((100vw - 375px) / 1545)), 90px);
	background: #FDF8F5 url(../img/front/question/img_human.svg) no-repeat center bottom / 50%;
}
#question::before,
#question::after {content: '';position: absolute;left: 50%;z-index: -1;transform: translateX(-50%);}
#question::before {
	top: 99.5%;
	width: 180px;
	height: 65px;
	aspect-ratio: 2;
	clip-path: polygon(50% 100%,100% 0,0 0);
	background: #FDF8F5;
}
#question::after {
	top: 5%;
	background: url(../img/front/question/bg.svg) no-repeat center / 100%;
	width: 50%;
	max-width: 610px;
	height: 100%;
}
#question .container h2 {
	margin-bottom: clamp(40px, calc(40px + 30 * ((100vw - 375px) / 1545)), 70px);
	font-weight: 600;
	font-size: clamp(22px, calc(22px + 10 * ((100vw - 375px) / 1545)), 32px);
	line-height: 1.5;
	text-align: center;
}
#question .container .wrap ul {display: grid;gap: clamp(20px, calc(20px + 20 * ((100vw - 375px) / 1545)), 40px);}
#question .container .wrap ul li {
	font-weight: 600;
	font-size: clamp(16px, calc(16px + 8 * ((100vw - 375px) / 1545)), 24px);
	text-align: center;
}
@media only screen and ( max-width : 767px ) {
	#question {padding-top: 70px;background-size: 80%;}
}
/*-------------------------------------------------

	Interview │ インタビュー

--------------------------------------------------*/
#interview {background: linear-gradient(#fff 0 25%, #FDF8F5 25% 70%, #fff 70% 100%);}
#interview h2 {
	margin-bottom: clamp(40px, calc(40px + 20 * ((100vw - 375px) / 1545)), 60px);
	font-weight: 600;
	font-size: clamp(18px, calc(18px + 19 * ((100vw - 375px) / 1545)), 37px);
	text-align: center;
}
#interview h2 span {
	display: inline-block;
	position: relative;
	padding: 0 clamp(40px, calc(40px + 20 * ((100vw - 375px) / 1545)), 60px);
	line-height: 1.4;
	text-align: center;
}
#interview h2 span::before,
#interview h2 span::after {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 27px;
	height: 100%;
	background: no-repeat center / 100%;
}
#interview h2 span::before {left: 0;background-image: url(../img/front/interview/img_frameL.svg);}
#interview h2 span::after {right: 0;background-image: url(../img/front/interview/img_frameR.svg);}
#interview .container figure {margin-bottom: clamp(40px, calc(40px + 30 * ((100vw - 375px) / 1545)), 70px);}
#interview .container a.read {margin: 0 auto;text-align: center;}
@media only screen and ( max-width : 1024px ) {
}
/*-------------------------------------------------

	Common Block

--------------------------------------------------*/
.common_block {overflow: hidden;}
.common_block ul {display: grid;gap: clamp(100px, calc(100px + 100 * ((100vw - 375px) / 1545)), 200px);}
.common_block ul li {align-items: flex-start;}
.common_block ul li:nth-child(odd) {flex-direction: row-reverse;}
.common_block ul li:last-child {padding-bottom: 8%;}
.common_block ul li figure {position: relative;width: 50%;}
.common_block ul li figure::before {
	content: '';
	position: absolute;
	top: 20%;
	left: 20%;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: #EAEBFA;
}
.common_block ul li:nth-child(2) figure::before {display: none;}
.common_block ul li .container {width: 45%;}
.common_block ul li .container .wrap h3 {
	margin-bottom: clamp(30px, calc(30px + 20 * ((100vw - 375px) / 1545)), 50px);
	font-weight: 600;
	font-size: clamp(22px, calc(22px + 10 * ((100vw - 375px) / 1545)), 32px);
}
.common_block ul li .container .wrap .content p {margin-bottom: clamp(30px, calc(30px + 20 * ((100vw - 375px) / 1545)), 50px);}
@media only screen and ( max-width : 767px ) {
	.common_block ul li figure {width: 100%;margin-bottom: 30px;}
	.common_block ul li .container {width: 100%;}
}