@charset "utf-8";
/*------------------------------------------------------------
	interview_detail
------------------------------------------------------------*/
.whiteText {
	color: #FFF !important;
}
#main .mainVisual {
	padding: 4.8rem 0;
	position: relative;
	z-index: 3;
	background: #0c0b09 url(../img/interview/bg01.png) no-repeat right bottom / 119.4rem;
}
#main .mainVisual .imgBox {
	flex-direction: row-reverse;
	align-items: flex-start;
}
#main .mainVisual .mainImg  {
	width: calc(50% + 6.8rem);
	position: relative;
	box-shadow: 0 0 2rem rgba(150, 150, 150, 0.1);
}
#main .mainVisual .mainImg::before {
	width: 100%;
	height: 100%;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	mix-blend-mode: overlay;
	background: linear-gradient(126deg,#d9a569 0%, #aac06f 31.53%, #5db542 70.44%, #5ac3bf 100%);
	opacity: 0.5;
}
#main .mainVisual .mainImg02::before {
	background: linear-gradient(126deg,#8bd969 0%, #8ad86b 0%, #6fc0b4 16.76%, #6cbdb4 36.11%, #4292b5 84.13%, #9e5ac3 100%);
}
#main .mainVisual .mainImg03::before {
	background: linear-gradient(126deg,#8bd969 0%, #8ad86b 0%, #6fc0b4 16.76%, #6cbdb4 36.11%, #4292b5 84.13%, #9e5ac3 100%);
	opacity: 1;
}
#main .mainVisual .textBox {
	padding: 1.8rem 3rem 0 4rem;
	flex: 1;
}
#main .mainVisual .pageTitle {
	margin-bottom: 4.5rem;
	font-size: 1.8rem;
	font-weight: 500;
}
#main .mainVisual .pageTitle .en {
	display: block;
	font-size: 4.4rem;
	line-height: 1.2;
}
#main .mainVisual .colorfulTxt {
	margin: 0 -10rem 4.8rem 0;
	font-size: 4.4rem;
	letter-spacing: 0.1em;
	line-height: 1.522;
	position: relative;
}
#main .infoText {
	font-size: 1.6rem;
	font-weight: 700;
	letter-spacing: 0;
}
#main .infoText .text01 {
	margin-bottom: 0.5rem;
	display: block;
	font-size: 1.8rem;
}
#main .infoText .en {
	margin-right: 1.5rem;
	font-size: 3.2rem;
}
.comBg {
	padding: 1.2rem 0 0;
}
.comTopBox {
	padding: 12.3rem 0 7rem;
}
.comTopBox .imgBox p {
	margin: 0;
	text-align: left;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 2.1;
}
.comTopBox .imgBox .image {
	position: relative;
	z-index: 1;
}
.comTopBox .imgBox .image img {
	width: 12.6rem;
}
.comTopBox .imgBox .image span {
	margin-top: 0.4rem;
	display: block;
	font-weight: 500;
	font-size: 1.3rem;
}
#main .heading {
	margin-bottom: 7rem;
	position: relative;
	z-index: 1;
}
#main .heading span {
	margin: 0 auto;
	width: fit-content;
	display: block;
	text-align: center;
}
#main .heading .en {
	display: block;
	font-size: 3.4rem;
}
#main .heading .en::after {
	margin: 1.5rem auto 1.3rem;
	content: "";
	display: block;
	width: 2.7rem;
	height: 1px;
	background: #fff;
}
#main .heading .jp {
	font-weight: 400;
	font-size: 2.8rem;
	line-height: 1.714;
	background: linear-gradient(30deg,#fff 0%, #2f71b9 50.25%, #fff 100%);
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
	width: fit-content;
}
#main .heading.special .en {
	color: #0d0907;
}
#main .heading.special .en::after  {
	margin-bottom: 1.1rem;
	background: #0d0907;
}
#main .heading.special .jp {
	background: linear-gradient(60deg,#0d0907 0%, #2f71b9 49.75%, #0d0907 100%);
		color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
	width: fit-content;
}
#main .chapterDl {
	position: relative;
	z-index: 3;
}
#main .chapterDl dt,
#main .chapterDl dd {
	display: flex;
	color: #0d0907;
	gap: 4.2rem;
	align-items: flex-start;
}
#main .chapterDl dt {
	margin-bottom: 4.5rem;
}
#main .chapterDl dt p,
#main .chapterDl dd p {
	line-height: 2.333;
	letter-spacing: 0;
}
#main .chapterDl dt p {
	font-weight: 700;
}
#main .chapterDl .people {
	width: 10rem;
	flex-shrink: 0;
	text-align: center;
	font-size: 1.4rem;
	font-weight: 500;
}
#main .chapterDl .people img {
	margin-bottom: 0.4rem;
	border-radius: 100%;
	display: block;
	filter: drop-shadow(0 0 2rem rgba(150, 150, 150, 0.1));
}
#main .chapterDl .people .bigTxt {
	font-size: 1.7rem;
	font-weight: 700;
}
#main .chapterDl dd .people .bigTxt {
	font-weight: 500;
}
#main .chapterDl dd {
	margin-bottom: 8rem;
	justify-content: flex-end;
}
#main .chapterDl dd + dd {
	margin-top: -4rem;
}
#main .chapterDl .textBox {
	padding: 2.9rem 4rem;
	max-width: 59.8rem;
	border-radius: 1rem;
	background: #eaee93;
	position: relative;
	box-shadow: 0 0 2rem rgba(150, 150, 150, 0.1);
}
#main .chapterDl .textBox p + p {
	margin-top: 3.4rem;
}
#main .chapterDl .textBox::before {
	width: 7rem;
	height: 7.3rem;
	content: "";
	position: absolute;
	left: -4rem;
	top: -1.4rem;
	background: url(../img/interview/icon01.png) no-repeat left top / 100%;
}
#main .chapterDl dd .textBox {
	background: #e2eaee;
}
#main .chapterDl dd .textBox::before {
	left: calc(100% - 3rem);
	background-image: url(../img/interview/icon02.png);
}
#main .chapterDl dd .photo {
	margin: 2.3rem 0 1.1rem;
}
#main .chapter02 {
	background: #fff;
}
#main .chapterWrap {
	padding-bottom: 17rem;
	position: relative;
}
#main .chapterWrap .bigPhoto {
	position: relative;
	z-index: 3;
}
#main .chapterWrap .bigPhoto02 {
	width: 70.3rem;
	margin: 17.7rem auto 8.8rem;
	position: relative;
	z-index: 3;
}
#main .chapter03 {
	padding-bottom: 0.8rem;
}
#main .infoBox {
	margin: 0 auto;
	width: 99.6rem;
	align-items: flex-start;
	position: relative;
	z-index: 1;
}
#main .infoBox .textBox {
	flex: 1;
}
#main .infoBox .textBox p {
	font-size: 1.8rem;
	line-height: 2.111;
	letter-spacing: 0;
}
#main .infoBox .textBox .tips {
	margin-top: 3.4rem;
	font-size: 1.6rem;
}
#main .infoBox .photo {
	margin: -0.8rem 0 0;
	width: 14.4rem;
	position: relative;
	z-index: 1;
}
.comTopBox .imgBox .image,
#main .infoBox .photo {
	position: relative;
	z-index: 3;
}
.comTopBox .imgBox .image::after,
#main .infoBox .photo::after {
	content: "";
	width: 99.6rem;
	height: 99.6rem;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-41.7% ,-29%);
	background: url(../img/common/bg01.png) no-repeat center top / 100%;
	z-index: -1;
}
#main .infoBox .photo::after {
	transform: translate(-52.7% ,-44%);
}
#main .ribbon01 {
	left: calc(50% - 27rem);
	top: 2.4rem;
	opacity: 1;
}
#main .ribbon02 {
	top: 4.5rem;
	transform: translateX(calc(-50% - 5.5rem));
}
#main .ribbon03 {
	width: 109.6rem;
	left: calc(50% - 32rem);
	top: -35.7rem;
	opacity: 0.75;
	z-index: 1;
}
#main .ribbon04 {
	width: 174.6rem;
	left: calc(50% - 85rem);
	top: 45.3rem;
	opacity: 1;
	position: absolute;
	z-index: 1;
	transform: rotate(-11deg);
}
#main .ribbon05 {
	width: 109rem;
	left: calc(50% - 84rem);
	bottom: 50.5rem;
	position: absolute;
	z-index: 1;
}
#main .chapter03  .ribbon04 {
	width: 211rem;
	left: calc(50% - 98rem);
	bottom: 105rem;
	top:auto;
	z-index: 1;
	pointer-events: none;
}
#main .ribbon06 {
	position: absolute;
	pointer-events: none;
	width: 168.1rem;
	left: calc(50% - 83.6rem);
	top: -40.8rem;
	z-index: 1;
}
#main .comSlideBox {
	padding: 15rem 0 5.2rem;
}
#main .comSlideBox .head {
	margin-bottom: 6rem;
	font-size: 92px;
	text-align: center;
}
#main .comSlideBox .slideBox {
	margin-bottom: 7.7rem;
	position: relative;
	z-index: 3;
}
#main .comSlideBox .slideUl li {
	margin: 0 4.7rem;
	width: 34.5rem !important;
}
#main .comSlideBox li a {
	display: block;
}
#main .comSlideBox .slideUl .photo {
	margin-bottom: 1.6rem;
	position: relative;
}
#main .comSlideBox .slideUl .infoText {
	margin: 0 !important;
	padding: 1rem 1.6rem;
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	z-index: 2;
}
#main .comSlideBox .slideUl .infoText::after {
	width: 100%;
	height: 100%;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	background: linear-gradient(to bottom,rgba(0, 0, 0, 0) 0%,#000 100%);
	opacity: 0.7;
	z-index: -1;
}
#main .comSlideBox .infoText .en {
	font-size: 3.6rem;
}
#main .comSlideBox .infoText .text01 {
	margin-bottom: 0;
}
#main .comSlideBox .colorfulTxt {
	font-weight: 400;
	font-size: 2.4rem;
	letter-spacing: 0.1em;
	line-height: 1.8333;
}
#main .comSlideBox .comBtn a{
	margin-right: -2.2rem;
}
#main .comSlideBox .slick-list {
	overflow: visible !important;
}
#main .ribbon10 {
	transform: scaleX(-1) rotate(11deg);
	top: auto;
	left: calc(50% - 76rem);
	bottom: 55.3rem;
	width: 164rem;
}
#main .chapter03 .ribbon11 {
	left: calc(50% - 114.4rem);
	bottom: 165rem;
	transform: rotate(11deg) scaleX(-1);
}
#main .ribbon07 {
	opacity: 1;
	transform: rotate(14deg);
	mix-blend-mode: overlay;
}
#main .chapter03 .ribbon12 {
	opacity: 1;
	transform: rotate(22deg);
}
@media all and (min-width: 897px) {
	.comTopBox .imgBox .image::after {
		transform: translate(-41.7% ,-66%);
	}
	.comTopBox .head {
		margin-bottom: 4.3rem;
		font-size: 3.8rem;
	}
	.comTopBox .imgBox {
		margin: 0 1.5rem 0 1.5rem;
		display: flex;
		justify-content: space-between;
	}
	.comTopBox .imgBox .text {
		flex: 1
	}
	.comTopBox .imgBox .image .text {
		font-size: 1.6rem;
	}
	.comTopBox .imgBox .image {
		margin: -3.4rem -0.7rem 0 0;
		width: 17.6rem;
		text-align: center;
	}
	.topBox03 {
		padding-bottom: 4.5rem;
	}
	.topBox03 .imgBox .image03 {
		margin: -2.8rem 0.3rem 0 0
	}
	.topBox04 .imgBox .image {
		margin-top: -4.1rem;
		width: 20.6rem;
	}
	.topBox04 .imgBox .image img {
		width: 19rem;
	}
	.comSlideBox a img {
		transition: 0.3s;
	}
	.comSlideBox .photo {
		overflow: hidden;
	}
	.comSlideBox a:hover .photo img {
		transform: scale(1.05);
	}
	#main .ribbon07 {
		width: 172rem;
		left: calc(50% - 89rem);
		top: 109.4rem;
		opacity: 1;
		transform: rotate(14deg);
		mix-blend-mode: overlay;
	}
	#main .ribbon08 {
		width: 130rem;
		left: calc(50% - 91.3rem);
		bottom: auto;
		top: -18rem;
	}
	#main .ribbon09 {
		width: 168.6rem;
		left: calc(50% - 97rem);
		top: 52.3rem;
		transform: none;
	}
	#main .chapter03 .ribbon12 {
		width: 155rem;
		left: calc(50% - 58rem);
		top: auto;
		opacity: 1;
		transform: rotate(22deg);
		bottom: 83rem;
	}
}
@media all and (min-width: 1440px) {
	#main .mainVisual .imgBox {
		padding-left: calc((100%  - 144rem) / 2)
	}
}
@media all and (max-width: 896px) {	
	.whiteTextSp {
		color: #FFF !important;
	}
	.blackTextSp {
		color: #0d0907 !important;
	}
	#main .mainVisual {
		padding: 0;
		background-size: 91%;
		background-position: right -9.6rem bottom 6.9rem;
	}
	#main .mainVisual .pageTitle .en {
		margin-bottom: 0.4rem;
		font-size: 2.2rem;
	}
	#main .mainVisual .pageTitle {
		margin-bottom: 1.4rem;
		font-size: 1rem;
	}
	#main .mainVisual .colorfulTxt {
		margin-bottom: 1.6rem;
		font-size: 2.2rem;
		letter-spacing: 0.1em;
		line-height: 1.454;
	}
	#main .mainVisual .imgBox {
		display: block;
	}
	#main .mainVisual .mainImg {
		padding-left: 2.4rem;
		width: auto;
	}
	#main .mainVisual .textBox {
		padding: 2.3rem 2.4rem;
	}
	#main .infoText {
		margin: 0 0.6rem;
		font-size: 1.3rem;
	}
	#main .infoText .text01 {
		margin-bottom: 0;
		font-size: 1.3rem;
	}
	#main .infoText .en {
		font-size: 2.4rem;
	}
	#main .scrollText p {
		font-size: 9.6rem;
	}
	.comBg {
		padding: 0;
	}
	.comTopBox {
		padding: 3rem 0 6.2rem;
	}
	.comTopBox .imgBox p {
		font-size: 1.3rem;
		line-height: 1.77;		
	}
	.comTopBox .imgBox .image {
		margin: 1rem 0 0 auto;
		width: 11rem;
	}
	.comTopBox .imgBox .image img {
		width: 8.7rem;
	}
	.comTopBox .imgBox .image span {
		font-size: 1rem;
	}
	#main .infoBox .photo::after {
		width: 50rem;
		height: 50rem;
		transform: translate(-60%,-63%);
	}
	.comTopBox .imgBox .image::after {
		width: 50rem;
		height: 50rem;
		transform: translate(-49%,-61%);
		opacity: 0.7;
	}
	#main .heading {
		margin-bottom: 3.5rem;
		position: relative;
		z-index: 1;
	}
	#main .heading .en {
		font-size: 1.6rem;
	}
	#main .heading .en::after {
		margin: 0.5rem auto 0.3rem;
		width: 1.2rem;
	}
	#main .heading .jp {
		font-size: 2rem;
		line-height: 1.4;
	}
	#main .chapterDl dt,
	#main .chapterDl dd {
		gap: 2.4rem;
	}
	#main .chapterDl dt {
		margin-bottom: 3rem;
	}
	#main .chapterDl dt p,
	#main .chapterDl dd p {
		line-height: 1.769;
	}
	#main .chapterDl .people {
		width: 8rem;
		font-size: 1.2rem;
	}
	#main .chapterDl .people > span {
		margin: 0 -0.5rem;
		display: block;
	}
	#main .chapterDl .people .bigTxt {
		font-size: 1.5rem;
	}
	#main .chapterDl .textBox {
		padding: 1rem 1.8rem 1rem 1.5rem;
	}
	#main .chapterDl .textBox::before {
		left: -3.7rem;
		top: -1.7rem;
	}
	#main .chapterDl dd .photo {
		margin: 1.3rem -0.3rem 0.6rem 0;
	}
	#main .chapterDl dd {
		margin-bottom: 3.2rem;
	}
	#main .chapterDl dd + dd{
		margin-top: 0;
	}
	#main .chapterDl .textBox p + p {
		margin-top: 2.3rem;
	}
	#main .bigPhoto {
		margin: 4rem 0 0;
		aspect-ratio: 327/100;
	}
	#main .chapterWrap .bigPhoto02 img,
	#main .bigPhoto img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#main .chapterWrap {
		padding-bottom: 7.6rem;
	}
	#main .heading.special .en::after {
		margin-bottom: 0.2rem;
	}
	#main .chapterWrap .bigPhoto02 {
		margin: 4.2rem 0 7.4rem;
		width: 100%;
		aspect-ratio: 327/232;
	}
	#main .infoBox {
		width: auto;
		display: block;
	}
	#main .infoBox .textBox p {
		font-size: 1.3rem;
		line-height: 1.769;
	}
	#main .infoBox .textBox .tips {
		margin-top: 1.5rem;
		font-size: 1.2rem;
	}
	#main .infoBox .photo {
		margin: 3.3rem 0 0 auto;
		width: 8.7rem;
	}
	#main .comSlideBox {
		padding: 6.4rem 0 4.5rem;
	}
	#main .comSlideBox .head {
		margin-bottom: 3.2rem;
		font-size: 4rem;
	}
	#main .comSlideBox .slideUl li {
		margin: 0 2.4rem 0 0;
		width: 32.7rem !important;
		display: block !important;
	}
	#main .comSlideBox .slideUl .photo {
		margin-bottom: 1.2rem;
	}
	#main .comSlideBox .infoText .en {
		font-size: 3.3rem;
	}
	#main .comSlideBox .slideUl .infoText {
		font-size: 1.5rem;
	}
	#main .comSlideBox .infoText .text01 {
		font-size: 1.6rem;
	}
	#main .comSlideBox .colorfulTxt {
		margin-right: -2rem;
	}
	#main .comSlideBox .comBtn a {
		margin: 0 0 0 auto;
	}
	#main .largeText02 p {
		font-size: 9.2rem;
	}
	#main .chapter03 {
		padding-bottom: 0.5rem;
	}
	#main .comSlideBox .slideBox {
		margin-bottom: 2.8rem;
		position: relative;
	}
	#main .comSlideBox .arrowList li {
		width: 3rem;
		height: 3rem;
		position: absolute;
		left: -1.5rem;
		top: 24rem;
		cursor: pointer;
	}
	#main .comSlideBox .arrowList li.next {
		left: auto;
		right: -1.5rem;
	}
	#main .ribbon01 {
		width: 87vw;
		left: auto;
		top: 23.7rem;
		opacity: 1;
		right: -7.2rem;
	}
	#main .ribbon02 {
		width: 122vw;
		top: 75.5rem;
		transform: rotate(-3deg);
		left: -7vw;
	}
	#main .ribbon03 {
		width: 120vw;
		left: 5vw;
		top: auto;
		bottom: 1.3rem;
	}
	#main .ribbon04 {
		width: 117vw;
		left: 8vw;
		top: auto;
		bottom: 43%;
	}
	#main .ribbon05 {
		width: 95vw;
		left: 8vw;
		bottom: auto;
		top: 102rem;
	}
	#main .chapter03 .ribbon04 {
		width: 155vw;
		left: -26vw;
		bottom: 100.3rem;
		top: auto;
	}
	#main .ribbon06 {
		width: 154vw;
		left: -22vw;
		top: 10rem;
	}
}
/* interview02 */
@media all and (min-width: 897px) {
	#main.interview02 .ribbon01 {
		left: calc(50% - 32.9rem);
		top: 22.8rem;
	}
	#main.interview02 .ribbon02 {
		top: 45rem;
	}
	#main.interview02 .ribbon03 {
		top: 0.9rem;
	}
	#main.interview02 .ribbon04 {
		bottom: 116rem;
		top: auto;
		width: 178rem;
		left: calc(50% - 87rem);
	}
	#main.interview02 .ribbon05 {
		bottom: auto;
		top: 53.6rem;
	}
	#main.interview02 .chapter03 .ribbon04 {
		bottom: 75rem;
	}
}
@media all and (max-width: 896px) {
	#main.interview02 .ribbon05 {
		bottom: auto;
		top: 15rem;
	}
	#main.interview02 .chapter03 .ribbon04 {
		bottom: 38.3rem;
	}
}
/* interview04 */
#main.interview04 .ribbon08 {
	top: 33rem;
}
#main.interview04 .ribbon09 {
	top: auto;
	bottom: 52.6rem;
}
#main.interview04 .ribbon10 {
	bottom: 179.2rem;
}
#main.interview04 .chapter03 .ribbon11 {
	bottom: 95rem;
}
#main.interview04 .chapter03 .ribbon12 {
	bottom: 59.5rem;
}
@media all and (min-width: 897px) {
	#main.interview04 .ribbon10 {
		left: calc(50% - 73.6rem);
	}
	#main.interview04 .chapter03 .ribbon11 {
		width: 213rem;
	}
}
/* interview05 */
#main.interview05 .ribbon08 {
	top: 37rem;
}
#main.interview05 .ribbon09 {
	top: 192.6rem;
}
#main.interview05 .chapter03 .ribbon11 {
	top: 46rem;
}
#main.interview05 .ribbon10 {
	top: -6.6rem;
	bottom: auto;
}
#main.interview05 .chapter03 .ribbon12 {
	bottom: 7rem;
}
@media all and (min-width: 897px) {
	#main.interview05 .ribbon10 {
		left: calc(50% - 74rem);
	}
}
/* interview06 */
#main .mainVisual .mainImg06::before {
	background: linear-gradient(135deg, #8bd969 0%, #8ad86b 0%, #6fc0b4 16.76%, #6cbdb4 36.11%, #4292b5 84.13%, #9e5ac3 100%);
	opacity: 0.5;
}
@media all and (min-width: 897px) {
	.topBox03 .imgBox .image04 {
		margin-top: -4.1rem;
		width: 20.6rem;
	}
	.comTopBox .imgBox .image04 img {
		width: 19rem;
	}
	.comTopBox .imgBox .image04 .text {
		margin-top: 0.9rem;
	}
	#main .ribbon13 {
		width: 130rem;
		left: calc(50% - 91.3rem);
		bottom: auto;
		top: 30rem;
		position: absolute;
		pointer-events: none;
	}
	#main .ribbon14 {
		top: 5rem;
	}
	#main .ribbon15 {
		top: -8rem;
		bottom: auto;
	}
	#main .chapter03 .ribbon16 {
		bottom: 110rem;
	}
}
@media all and (max-width: 896px) {
	.comTopBox .imgBox .image04 {
		width: 12.4rem;
	}
	.comTopBox .imgBox .image04 img {
		width: 100%;
	}
	#main .ribbon13 {
		top: 75rem;
	}
}