@charset "utf-8";
/**
* BTN
**/
.storyBtnListsWrap{
	width:100%;
	position:relative;
	margin-bottom:48px;
}
.storyBtnListsInWrap{
	padding-left:0;
	padding-right:0;
	padding-bottom:min(calc(36 / var(--vw-min) * 100vw),36px);
	overflow:auto;
}
@media screen and (max-width:767px){
	.storyBtnListsWrap{
		margin-bottom:var(--sp-size-48);
	}
	.storyBtnListsInWrap{
		padding-left:min(calc(48 / var(--vw-min) * 100vw),48px);
		padding-right:min(calc(48 / var(--vw-min) * 100vw),48px);
		padding-bottom:min(calc(24 / var(--vw-min) * 100vw),24px);
		overflow:auto;
	}
}
.wp-pagenavi{
	flex-wrap:wrap;
}
@media screen and (max-width:767px){
	.wp-pagenavi{
		padding-left:min(calc(48 / var(--vw-min) * 100vw),48px);
		justify-content:flex-start;
	}
}
.wp-pagenavi:before{
	content:'Episode:';
	font-family:var(--font-en);
	font-weight:700;
	display:block;
	font-size:min(calc(18 / var(--vw-min) * 100vw),18px);
	color:var(--color-main-brown);
	padding-top:0.25em;
}
@media screen and (max-width:767px){
	.wp-pagenavi:before{
		width:100%;
		font-size:min(calc(24 / var(--vw-min) * 100vw),24px);
		text-indent:max(calc(-48 / var(--vw-min) * 100vw),-48px)
	}
}
@media screen and (max-width:767px){
	.articleContentWrap{
		width:min(calc(652 / var(--vw-min) * 100vw),652px);
		margin:0 auto;
	}
	.articleContentIn{
		padding:0 min(calc(48 / var(--vw-min) * 100vw),48px)min(calc(60 / var(--vw-min) * 100vw),60px);
	}
}
.cont_h3{
	position:absolute;
	right:5.4054%;
	top:max(calc(-40 / var(--vw-min) * 100vw),-40px);
	font-size:min(calc(77 / var(--vw-min) * 100vw),77px);
	font-family:var(--font-en);
	z-index:50;
}
.cont_h3__txt .hash{
	font-family:var(--font-tsuku);
}
.story__header{
	padding-bottom:min(calc(26 / var(--vw-min) * 100vw),26px);
}
@media screen and (max-width:767px){
	.story__header{
		padding:min(calc(80 / var(--vw-min) * 100vw),80px) 0 min(calc(42 / var(--vw-min) * 100vw),42px);
	}
}
.story__name{
	font-size:min(calc(24 / var(--vw-min) * 100vw),24px);
	font-weight:700;
	color:var(--color-main-brown);
	letter-spacing:0.02em;
}
@media screen and (max-width:767px){
	.story__name{
		font-size:min(calc(28 / var(--vw-min) * 100vw),28px);
		display:flex;
		justify-content:center;
	}
}
.story__content{

}
.story__contentWrap{
	width:100%;
	position:relative;
	padding:8px;
	line-height:0;
	margin-bottom:min(calc(16 / var(--vw-min) * 100vw),16px);
}
@media screen and (max-width:767px){
	.story__contentWrap{
		padding:3.3445%;/* 20 */
		margin-bottom:min(calc(28 / var(--vw-min) * 100vw),28px);
	}
}
.story__contentFrameWrap{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
}
.story__contentFrame,
.story__contentFrame span{
	position:absolute;
}
.story__contentFrame span{
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:var(--color-main-brown);
	transition:.4s cubic-bezier(.17,.67,.65,1);
}
.story__contentFrame.-t{
	top:0;
	right:0;
	left:48px;
	height:2px;
}
.story__contentFrame.-r{
	top:0;
	right:0;
	bottom:128px;
	width:2px;
}
.story__contentFrame.-b{
	bottom:0;
	left:0;
	right:48px;
	height:2px;
}
.story__contentFrame.-l{
	bottom:0;
	left:0;
	top:128px;
	width:2px;
}
@media screen and (max-width:767px){
	.story__contentFrame.-t{
		left:var(--sp-size-96);
		height:var(--sp-size-4);
	}
	.story__contentFrame.-r{
		bottom:min(calc(230 / var(--min-ww) * 100vw),230px);
		width:var(--sp-size-4);
	}
	.story__contentFrame.-b{
		right:var(--sp-size-96);
		height:var(--sp-size-4);
	}
	.story__contentFrame.-l{
		top:min(calc(230 / var(--min-ww) * 100vw),230px);
		width:var(--sp-size-4);
	}
}
.story__contentImg{
	width:100%;
	position:relative;
}
.story__contentImg img{
	height:auto;
	width:100%;
	display:block;
}
.story__imgNav{
	position:absolute;
	top:50%;
	left:max(calc(-24 / var(--vw-min) * 100vw),-24px);
	right:max(calc(-24 / var(--vw-min) * 100vw),-24px);
	height:min(calc(80 / var(--vw-min) * 100vw),80px);
	margin-top:max(calc(-40 / var(--vw-min) * 100vw),-40px);
	display:flex;
	justify-content:space-between;
	z-index:500;
	pointer-events:none;
}
@media screen and (max-width:767px){
	.story__imgNav{
		left:max(calc(-32 / var(--vw-min) * 100vw),-32px);
		right:max(calc(-32 / var(--vw-min) * 100vw),-32px);
		height:min(calc(96 / var(--vw-min) * 100vw),96px);
		margin-top:max(calc(-48 / var(--vw-min) * 100vw),-48px);
	}
}
.story__imgNav li{
	width:min(calc(36 / var(--vw-min) * 100vw),36px);
	height:min(calc(80 / var(--vw-min) * 100vw),80px);
}
@media screen and (max-width:767px){
	.story__imgNav li{
		width:min(calc(42 / var(--vw-min) * 100vw),42px);
		height:min(calc(96 / var(--vw-min) * 100vw),96px);
	}
}
.story__imgNav li a{
	display:block;
	height:min(calc(80 / var(--vw-min) * 100vw),80px);
	position:relative;
	pointer-events:auto;
}
@media screen and (max-width:767px){
	.story__imgNav li a{
		height:min(calc(96 / var(--vw-min) * 100vw),96px);
	}
}
.story__imgNav li a:before{
	content:'';
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	transition:all 0.3s ease;
}
.story__imgNavLeft a:before{
	background:url(../img/common/arrow_prev.png) no-repeat center center / contain;
}
.story__imgNavRight a:before{
	background:url(../img/common/arrow_next.png) no-repeat center center / contain;
}
@media screen and (hover:hover){
	.story__imgNavLeft a:hover:before{
		transform:translateX(max(calc(-10 / var(--vw-min) * 100vw),-10px));
	}
	.story__imgNavRight a:hover:before{
		transform:translateX(min(calc(10 / var(--vw-min) * 100vw),10px));
	}
}
.story__imgThumbLists{
	display:flex;
	flex-wrap:wrap;
	margin:0 min(calc(-3 / var(--vw-min) * 100vw),-3px) min(calc(16 / var(--vw-min) * 100vw),16px);
}
@media screen and (max-width:767px){
	.story__imgThumbLists{
		margin-bottom:min(calc(24 / var(--vw-min) * 100vw),24px);
	}
}
.story__imgThumbList{
	width:calc(100% / 6);
	padding:0 min(calc(3 / var(--vw-min) * 100vw),3px);
}
.story__imgThumbList a{
	display:block;
	overflow:hidden;
	position:relative;
}
.story__imgThumbList a.is-active{
	pointer-events:none;
}
.story__imgThumbList a:before{
	content:'';
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	background:var(--color-main-red);
	opacity:.6;
	transition:all 0.3s ease;
	z-index:10;
}
@media screen and (hover:hover){
	.story__imgThumbList a:hover:before{
		opacity:.3;
	}
}
.story__imgThumbList a.is-active:before{
	opacity:0;
}
.story__imgThumbList a img{
	width:100%;
	height:auto;
	display:block;
	transition:all 0.3s ease;
}
@media screen and (hover:hover){
	.story__imgThumbList a:hover img{
		transform:scale(1.1);
	}
}
.story__text{
	padding-top:min(calc(30 / var(--vw-min) * 100vw),30px);
	margin-bottom:min(calc(16 / var(--vw-min) * 100vw),16px);
}
@media screen and (max-width:767px){
	.story__text{
		margin-bottom:min(calc(24 / var(--vw-min) * 100vw),24px);
		font-size:min(calc(24 / var(--vw-min) * 100vw),24px);
	}
}
.story__staffBox{
	padding-top:min(calc(38 / var(--vw-min) * 100vw),38px);
	position:relative;
}
.story__staffBoxin{
	position:relative;
	padding-top:min(calc(54 / var(--vw-min) * 100vw),54px);
}
@media screen and (max-width:767px){
	.story__staffBoxin{
		padding-top:min(calc(72 / var(--vw-min) * 100vw),72px);
	}
}
.story__staffBoxin .cont_h2__ja-icon{
	left:0;
}
@media screen and (max-width:767px){
	.story__staffBoxin .cont_h2__ja-icon{
		left:50%;
		right:unset;
		transform:translateX(-50%);
	}
}
.story__staffBoxin .cont_h2__ja-icon i{
	width:min(calc(10 / var(--vw-min) * 100vw),10px);
	height:min(calc(10 / var(--vw-min) * 100vw),10px);
}
@media screen and (max-width:767px){
	.story__staffBoxin .cont_h2__ja-icon i{
		width:min(calc(14 / var(--vw-min) * 100vw),14px);
		height:min(calc(14 / var(--vw-min) * 100vw),14px);
	}
}
.story__staffTitle{
	position:absolute;
	left:0;
	top:min(calc(40 / var(--vw-min) * 100vw),40px);
	font-family:var(--font-en);
	font-size:min(calc(64 / var(--vw-min) * 100vw),64px);
	font-weight:700;
	line-height:1;
}
@media screen and (max-width:767px){
	.story__staffTitle{
		left:max(calc(-60 / var(--vw-min) * 100vw),-60px);
		top:min(calc(36 / var(--vw-min) * 100vw),36px);
		font-size:min(calc(72 / var(--vw-min) * 100vw),72px);
	}
}
.story__staffTitleTxt{
	display:inline-block;
	line-height:0.714286;
	letter-spacing:-0.025em;
	color:#FFF;
	-webkit-text-stroke:2px var(--color-main-brown);
}
@media screen and (max-width:767px){
	.story__staffTitleTxt{
		-webkit-text-stroke:1px var(--color-main-brown);
	}
}
.story__staffLists{
	padding-bottom:min(calc(40 / var(--vw-min) * 100vw),40px)
}
@media screen and (max-width:767px){
	.story__staffLists{
		padding-bottom:min(calc(36 / var(--vw-min) * 100vw),36px)
	}
}
.story__staffList{
	width:100%;
	display:flex;
}
@media screen and (max-width:767px){
	.story__staffList{
		font-size:min(calc(24 / var(--vw-min) * 100vw),24px);
	}
}
.story__staffList dt{
	width:50%;
	padding-right:min(calc(10 / var(--vw-min) * 100vw),10px);
	text-align:right;
	font-weight:700;
	color:var(--color-main-red);
}
.story__staffList dd{
	width:50%;
	padding-left:min(calc(10 / var(--vw-min) * 100vw),10px);
}

/**
* scrAni - set
**/
.cont_h3{
	opacity:0;
	transition:.3s ease;
}
.articleContentIn{
	opacity:0;
	transform:scale(90%);
	transition:.6s ease;
	transform-origin:center top;
}
.articleContentIn__cont{
	opacity:0;
	transition:.4s ease;
}

.btn_linkWrap{
	opacity:0;
	transform:translateY(10%);
	transition:.4s ease;
}

/* scrAni - ani */
.content.is-ani .cont_h3{
	opacity:1;
	transition-delay:1s;
}

.content.is-ani .articleContentIn{
	transition-delay:0.5s;
	opacity:1;
	transform:scale(100%);
}
.content.is-ani .articleContentIn__cont{
	transition-delay:1.15s;
	opacity:1;
}

/**
* scrAni - set
**/
.content.is-ani .btn_linkWrap{
	opacity:1;
	transform:translateY(0%);
	transition-delay:1.3s;
}
.articleContentWrap:not(:last-of-type) .articleContentIn{
	padding-bottom:min(calc(60 / var(--vw-min) * 100vw),60px);
}
.articleContentWrap:not(:last-of-type) > .articleContentIn:after{
	display:none;
}
/* scrAni */
.story__contentImg{
	opacity:0;
	transform:scale(0.8);
	transition:transform .6s cubic-bezier(.64,.39,.46,1) 1.4s,opacity .6s cubic-bezier(.64,.39,.46,1) 1.4s;
}
.story__contentFrame span{
	transition:.4s cubic-bezier(.17,.67,.65,1) 1s;
}
.story__contentFrame.-t span{
	width:0%;
	margin-left:auto;
}
.story__contentFrame.-r span{
	height:0%;
}
.story__contentFrame.-b span{
	width:0%;
}
.story__contentFrame.-l span{
	height:0%;
	margin-top:auto;
}
.story__imgThumbLists{
	opacity:0;
	transform:scale(0.8);
	transition:all 0.6s ease;
}
.story__text{
	opacity:0;
	transform:scale(0.8);
	transition:all 0.6s ease;
}
.story__staffBox{
	opacity:0;
	transform:scale(0.8);
	transition:all 0.6s ease;
}

#story.is-ani .story__contentImg{
	opacity:1;
	transform:scale(1);
	transition-delay:1.4s
}
#story.is-ani .story__contentFrame.-t span,
#story.is-ani .story__contentFrame.-b span{
	width:100%;
	transition-delay:1.1s;
}
#story.is-ani .story__contentFrame.-r span,
#story.is-ani .story__contentFrame.-l span{
	height:100%;
	transition-delay:1.1s;
}
#story.is-ani .story__title{
	opacity:1;
	transform:translateY(0%);
}
#story.is-ani .story__imgThumbLists{
	opacity:1;
	transform:scale(1);
}
#story.is-ani .story__imgThumbLists{
	opacity:1;
	transform:scale(1);
	transition-delay:1.5s;
}
#story.is-ani .story__text{
	opacity:1;
	transform:scale(1);
	transition-delay:1.6s;
}
#story.is-ani .story__staffBox{
	opacity:1;
	transform:scale(1);
	transition-delay:1.7s;
}