@charset "UTF-8";


/*  ===============================
		   base / reset
===============================*/

html{}

body{
	/* overflow: hidden; */
	min-width: 1024px;
	color: #FFF;
	font-family: 'Noto Serif JP', serif;
	font-size: 100%;
	font-weight: 400; /* Regular */
	line-height: 1.6;
}
h1,h2,h3,h4,h5,h6{ font-weight: inherit;}
a{ text-decoration: none;}

.sans{
	font-family: 'Noto Sans JP', sans-serif;
}

.inr--mv{
	position: relative;
	width: 1024px;
	top: 0;
}
.inr{
	position: relative;
	width: 664px;
}


.Gmain{
	overflow: hidden;
}


.inr--mv,
.inr{
	margin-right: auto;
	margin-left: auto;
}



/*  ===============================
			common
===============================*/


.red{ color: red !important }

/* br - device */
.br--pc{ display: block !important}
.br--sp{ display: none !important}
.br--450px{display: none !important}



/* display */
.dib{ display: inline-block;}


/* text-align */
.tac{ text-align: center !important}
.tar{ text-align: right !important}
.tal{ text-align: left !important}

/* font-weight */
.fwl{ font-weight: light !important}
.fwn{ font-weight: normal !important}
.fwb{ font-weight: bold !important}

/* text-decoration */
.tdu{ text-decoration: underline !important}





/* margin */
.m0{ margin: 0 !important}
.m1rem{ margin-top: 1rem !important}
.m2rem{ margin-top: 2rem !important}
.m3rem{ margin-top: 3rem !important}
.m4rem{ margin-top: 4rem !important}
.m5rem{ margin-top: 5rem !important}

.m1em{ margin-top: 1em !important}
.m2em{ margin-top: 2em !important}
.m3em{ margin-top: 3em !important}
.m4em{ margin-top: 4em !important}
.m5em{ margin-top: 5em !important}


/* margin-top */
.mt0{ margin-top: 0 !important}
.mt1rem{ margin-top: 1rem !important}
.mt2rem{ margin-top: 2rem !important}
.mt3rem{ margin-top: 3rem !important}
.mt4rem{ margin-top: 4rem !important}
.mt5rem{ margin-top: 5rem !important}

.mt1em{ margin-top: 1em !important}
.mt2em{ margin-top: 2em !important}
.mt3em{ margin-top: 3em !important}
.mt4em{ margin-top: 4em !important}
.mt5em{ margin-top: 5em !important}


/* margin-bottom */
.mb0{ margin-bottom: 0 !important}
.mb1rem{ margin-bottom: 1rem !important}
.mb2rem{ margin-bottom: 2rem !important}
.mb3rem{ margin-bottom: 3rem !important}
.mb4rem{ margin-bottom: 4rem !important}
.mt5rem{ margin-bottom: 5rem !important}

.mb1em{ margin-bottom: 1em !important}
.mb2em{ margin-bottom: 2em !important}
.mb3em{ margin-bottom: 3em !important}
.mb4em{ margin-bottom: 4em !important}
.mt5em{ margin-bottom: 5em !important}


/* margin-top and bottom */
.mtb0{
    margin-top:    0 !important;
    margin-bottom: 0 !important;
}

.mtb1rem{
    margin-top:    1rem !important;
    margin-bottom: 1rem !important;
}
.mtb2rem{
    margin-top:    2rem !important;
    margin-bottom: 2rem !important;
}
.mtb3rem{
    margin-top:    3rem !important;
    margin-bottom: 3rem !important;
}
.mtb4rem{
    margin-top:    4rem !important;
    margin-bottom: 4rem !important;
}
.mtb5rem{
    margin-top:    5rem !important;
    margin-bottom: 5rem !important;
}

.mtb1em{
    margin-top:    1em !important;
    margin-bottom: 1em !important;
}
.mtb2em{
    margin-top:    2em !important;
    margin-bottom: 2em !important;
}
.mtb3em{
    margin-top:    3em !important;
    margin-bottom: 3em !important;
}
.mtb4em{
    margin-top:    4em !important;
    margin-bottom: 4em !important;
}
.mtb5em{
    margin-top:    5em !important;
    margin-bottom: 5em !important;
}


/* margin-left and right */

.mr1rem{
	margin-right: 1rem;
}

.mlr0{
    margin-left:  0 !important;
    margin-right: 0 !important;
}

.mlr1rem{
    margin-left:  1rem !important;
    margin-right: 1rem !important;
}
.mlr2rem{
    margin-left:  2rem !important;
    margin-right: 2rem !important;
}
.mlr3rem{
    margin-left:  3rem !important;
    margin-right: 3rem !important;
}
.mlr4rem{
    margin-left:  4rem !important;
    margin-right: 4rem !important;
}
.mlr5rem{
    margin-left:  5rem !important;
    margin-right: 5rem !important;
}

.mlr1em{
    margin-left:  1em !important;
    margin-right: 1em !important;
}
.mlr2em{
    margin-left:  2em !important;
    margin-right: 2em !important;
}
.mlr3em{
    margin-left:  3em !important;
    margin-right: 3em !important;
}
.mlr4em{
    margin-left:  4em !important;
    margin-right: 4em !important;
}
.mlr5em{
    margin-left:  5em !important;
    margin-right: 5em !important;
}



/* padding */
.p0{ padding: 0 !important}

.p1rem{ padding: 1rem !important}
.p2rem{ padding: 2rem !important}
.p3rem{ padding: 3rem !important}
.p4rem{ padding: 4rem !important}
.p5rem{ padding: 5rem !important}

.p1em{ padding: 1em !important}
.p2em{ padding: 2em !important}
.p3em{ padding: 3em !important}
.p4em{ padding: 4em !important}
.p5em{ padding: 5em !important}

/* padding-top */
.pt0{ padding-top: 0 !important}

.pt1rem{ padding-top: 1rem !important}
.pt2rem{ padding-top: 2rem !important}
.pt3rem{ padding-top: 3rem !important}
.pt4rem{ padding-top: 4rem !important}
.pt5rem{ padding-top: 5rem !important}

.pt1em{ padding-top: 1em !important}
.pt2em{ padding-top: 2em !important}
.pt3em{ padding-top: 3em !important}
.pt4em{ padding-top: 4em !important}
.pt5em{ padding-top: 5em !important}

/* padding-bottom */
.pb0{ padding-bottom: 0 !important}

.pb1rem{ padding-bottom: 1rem !important}
.pb2rem{ padding-bottom: 2rem !important}
.pb3rem{ padding-bottom: 3rem !important}
.pb4rem{ padding-bottom: 4rem !important}
.pb5rem{ padding-bottom: 5rem !important}

.pb1em{ padding-bottom: 1em !important}
.pb2em{ padding-bottom: 2em !important}
.pb3em{ padding-bottom: 3em !important}
.pb4em{ padding-bottom: 4em !important}
.pb5em{ padding-bottom: 5em !important}

/* padding-right */
.pr0{ padding-right: 0 !important}

.pr1rem{ padding-right: 1rem !important}
.pr2rem{ padding-right: 2rem !important}
.pr3rem{ padding-right: 3rem !important}
.pr4rem{ padding-right: 4rem !important}
.pr5rem{ padding-right: 5rem !important}

.pr1em{ padding-right: 1em !important}
.pr2em{ padding-right: 2em !important}
.pr3em{ padding-right: 3em !important}
.pr4em{ padding-right: 4em !important}
.pr5em{ padding-right: 5em !important}

/* padding-left */
.pl0{ padding-left: 0 !important}

.pl1rem{ padding-left: 1rem !important}
.pl2rem{ padding-left: 2rem !important}
.pl3rem{ padding-left: 3rem !important}
.pl4rem{ padding-left: 4rem !important}
.pl5rem{ padding-left: 5rem !important}

.pl1em{ padding-left: 1em !important}
.pl2em{ padding-left: 2em !important}
.pl3em{ padding-left: 3em !important}
.pl4em{ padding-left: 4em !important}
.pl5em{ padding-left: 5em !important}




/* margin-top and bottom */
.ptb0{
    padding-top:    0 !important;
    padding-bottom: 0 !important;
}

.ptb1rem{
    padding-top:    1rem !important;
    padding-bottom: 1rem !important;
}
.ptb2rem{
    padding-top:    2rem !important;
    padding-bottom: 2rem !important;
}
.ptb3rem{
    padding-top:    3rem !important;
    padding-bottom: 3rem !important;
}
.ptb4rem{
    padding-top:    4rem !important;
    padding-bottom: 4rem !important;
}
.ptb5rem{
    padding-top:    5rem !important;
    padding-bottom: 5rem !important;
}

.ptb1em{
    padding-top:    1em !important;
    padding-bottom: 1em !important;
}
.ptb2em{
    padding-top:    2em !important;
    padding-bottom: 2em !important;
}
.ptb3em{
    padding-top:    3em !important;
    padding-bottom: 3em !important;
}
.ptb4em{
    padding-top:    4em !important;
    padding-bottom: 4em !important;
}
.ptb5em{
    padding-top:    5em !important;
    padding-bottom: 5em !important;
}

/* padding-left and right */
.plr0{
    padding-left:  0 !important;
    padding-right: 0 !important;
}

.plr1rem{
    padding-left:  1rem !important;
    padding-right: 1rem !important;
}
.plr2rem{
    padding-left:  2rem !important;
    padding-right: 2rem !important;
}
.plr3rem{
    padding-left:  3rem !important;
    padding-right: 3rem !important;
}
.plr4rem{
    padding-left:  4rem !important;
    padding-right: 4rem !important;
}
.plr5rem{
    padding-left:  5rem !important;
    padding-right: 5rem !important;
}

.plr1em{
    padding-left:  1em !important;
    padding-right: 1em !important;
}
.plr2em{
    padding-left:  2em !important;
    padding-right: 2em !important;
}
.plr3em{
    padding-left:  3em !important;
    padding-right: 3em !important;
}
.plr4em{
    padding-left:  4em !important;
    padding-right: 4em !important;
}
.plr5em{
    padding-left:  5em !important;
    padding-right: 5em !important;
}



/* btn */

.btn {
    position: relative;
    display: inline-block;
	width: auto;
	margin-left: 8px;
	padding: 5px 1rem;
    color: #000;
    font-size: 1rem;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	line-height: 1;
    /* line-height: 40px; */
    text-align: center;
    text-decoration: none;
    background-color: #00FFFF;
    transition: all .1s;
	cursor: pointer;
}
.btn:before,
.btn:after {
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    content: '';
    border: 13px solid transparent;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
}
.btn:before {
    right: 100%;
    border-right-color: #00FFFF;
}
.btn:after {
    left: 100%;
    border-left-color: #00FFFF;
}
.btn:hover {
    opacity: .7;
}



/* label */
.label{}



/* new label */
.label--new{
	color: #FFF;
	background-color: #E003FD;
}






/* fade in animation + js */

.fadeIn,
.fadeIn--first-view{
	visibility: hidden;
	opacity: 0;
	transition: 1s
}

.fadeIn--late{
	transition: .8s;
	transition-delay: .5s;
}

/* 上昇 */
.fadeIn--up{
    transform: translateY(10vw);
}

/* 降下 */
.fadeIn--down{
	transform: translateY(-10vw);
}

/* 回転 */
.fadeIn--rotate{
	transform: rotate( 180deg );
}



.fadeIn.is-active,
.fadeIn--first-view.is-active{
	transform: translateY(0) rotate( 0deg );
	visibility: visible;
	opacity: 1;
}



/* br 要 responsive */

.br--pc{ display: block;}
.br--sp{ display: none;}



/* animation
===============================
*/


@keyframes rotation{
	0%{ transform: rotate(0)}
	100%{ transform: rotate(360deg)}
}

@keyframes centerRotation{
	0%{   transform: translate(-50%,-50%) rotate(0)}
	100%{ transform: translate(-50%,-50%) rotate(360deg)}
}




/*  ===============================
		  block / element
===============================*/


/* loading
===============================
*/

.loading{
	overflow: hidden;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    height: calc(var(--vh, 1vh) * 100);
    background: #000;
    z-index: 1000;
}
	.is-active.loading{
		opacity: 1;
	}
	.is-passive.loading{
		opacity: 0;
		transition: 1.5s;
	}

.loading_inr{
    width: 300px;
    height: 450px;
    }

.loading_centering{

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate( -50% , -50% )
}

.loading_logo{
    width: 169px;
}
.loading_langCircle{
    will-change: animation,transform;
    animation: 15s linear infinite centerRotation;
}

@keyframes rotation{
    0%{ transform: translate( -50% , -50% ) rotate(0);}
    100%{ transform: translate( -50% , -50% ) rotate(360deg);}
}





.char_wrap{
    display: flex;
    justify-content: center;
	/* transform: translateY(-80px) */
}

.char{
    display: flex;
	flex-direction: column;
	align-items: center;

	flex: 0 0 auto;
    width: auto;
}


.loading_char{
    will-change: transform,animation;
    /* margin-top: -1rem; */
}
	.char:nth-of-type(odd) .loading_char{ animation: 3s linear infinite goDown;}
	.char:nth-of-type(even) .loading_char{ animation: 3s linear infinite reverse goDown;}
	.char:nth-of-type(odd) .upsideDown .loading_char{ animation: 3s linear infinite reverse goDown;}
	.char:nth-of-type(even) .upsideDown .loading_char{ animation: 3s linear infinite goDown;}
	.char:nth-of-type(even) .uppercase .loading_char{ animation: 3s linear infinite goDown_uppercase;}
	.char:nth-of-type(odd) .uppercase .loading_char{ animation: 3s linear infinite goDown_uppercase;}
	/* .char:nth-of-type(odd) .uppercase.upsideDown .loading_char{ animation: 3s linear infinite reverse goDown_uppercase;} */

.uppercase{
    margin-top: -16px
}

.upsideUp{
	transform: translateY(-80px)
}

.upsideDown{
    transform: rotate(180deg)
}

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

@keyframes goDown_uppercase{
    0%{ transform: translateY( 0 );}
    100%{ transform: translateY( calc(100% - 16px) );}
}

@keyframes goDown_uppercase_{
    0%{ transform: translateY( 0 );}
    100%{ transform: translateY( calc(100% - 16px) );}
}




/* modal
===============================
*/


.modal_target{
	display: none;
}
	.is-active.modal_target{
		display: block;
	}

.modal_wrap{
	opacity: 0;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	background-color: rgba(0,0,0,85%);
	transition: .4s;
	z-index: -1;
}
	.is-active.modal_wrap{
		opacity: 1;
		z-index: 10000;
		transition: .8s;
	}
.modal_inr{
	position: relative;
	/* margin-top: 10vh; */
	width: 1024px;
	max-height: 70vh;
	top: 50%;
	left: 50%;
	transform: translate( -50% , -50% );
}

.modal_content{
	overflow: scroll;
	width: 526px;
	max-height: 70vh;
	margin: auto;

}


.closeBtn_wrap{
	position: absolute;
}

.closeBtn{
	position: relative;
	cursor: pointer;
	width: 90px;
	height: 90px;
	margin-left: auto;
	margin-top: 2.5rem;
	margin-right: 2.5rem;
}

.closeBtn::before,
.closeBtn::after{
	content: "";
	display: block;
	margin-top: ;
	width: 90px;
	height: 1px;
	background-color: #00FFFF;
}

.closeBtn::before{
	transform: translateY(calc(90px / 2)) rotate(45deg);
}
.closeBtn::after{
	transform: translateY(calc(90px / 2)) rotate(-45deg);
}





/* global
===============================
*/

/* Ghdr */

.Ghdr{
	width: 1024px;
	position: fixed;
	top: 0;
	margin: auto;
	z-index: 100;
	/* overflow: hidden; */
}

.brand{
	width: 118px;
}


.Gsvg--pc{
	position: absolute;
	width: 100%;
	top: 0;
	/* left: calc( ( 100vw - 1024px ) / 2); */
}

.Gsvg--sp{
	display: none;
}


@media screen and (min-width:769px) {
.Ghdr{
	width: 1024px;
	left: max( calc( ( 100vw - 1024px ) / 2 ) , 0 );
}
	.Ghdr::before,
	.Ghdr::after{
		content: "";
		position: fixed;
		top: 0;
		width: 100vw;
		height: 80px;
		background-color: #000;
		z-index: 100;
	}

	.Ghdr::before{
		width: calc( ( 100vw - 1024px ) / 2 );
		/* left: calc( ( 100vw - 1024px ) / -2 ); */
		left: 0;

	}

	.Ghdr::after{
		width: calc( ( 100vw - 1024px ) / 2 );
		/* right: calc( ( 100vw - 1024px ) / -2 ); */
		right: 0;
	}


}

.Ghdr_inr{
	display: flex;
	justify-content: space-between;

	position: relative;
	z-index: 1;
	padding: 1rem 1rem 0 1rem;
}



/* Gnavi */

.Gnavi{
	width: auto;

}

.Gnavi_inr{
	display: flex;
	justify-content: flex-end;
}
.Gnavi_item{
	margin-right: 1.5rem;
}

.Gnavi_item--movie{ color: #E003FD;}
.Gnavi_item--story{ color: #00FF00;}
.Gnavi_item--cast{ color: #00FFFF;}
.Gnavi_item--staff{ color: #00FFFF;}
.Gnavi_item--theater{ color: #FFA500;}
.Gnavi_item--goods{ color: #F03CA0;}

.Gnavi_anchor{
	text-decoration: none;
	font-size: 13px;
	font-family: 'Prata', serif;
	font-weight: 500;
	letter-spacing: .1rem;
}


.Gnavi_sns{
	display: none;
}

/* Gmain */
.Gmain{
	position: relative;
	background: no-repeat center / cover url(../images/bg_big.jpg);
}


/* Gfooter */
.Gftr{
	padding-top: 120px;
	padding-bottom: 32px;
}


/* section & mv
===============================
*/

/* b-main-view */
.mv{
	height: 741px;
	background-color: #0c0d2f;
}

.mv_inr{
	max-width: none;
	height: 100%;
}


.mv_bg{
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	text-align: center;
}

.mv_inr::before,
.mv_bg::before{
	content: "";
	display: block;
}



@media screen and (min-width:769px) {
	.mv_bg,
	.mv_bg::before{
		position: absolute;
		width: 100%;
		height: 100%;
		min-width: 1024px;
		max-width: 1317px;
		max-height: 741px;
	}
}




.mv_inr{}
.mv_bg::before{
	background: no-repeat center / cover url(../images/mv_eve.png);
}



.mv_bg img{
	max-width: none;
	object-fit: cover;
	width: 100%;
	height: 100%;
}




@media screen and (min-width:1317px) {
	.mv{
		height: 100vh;
		max-height: 1080px;
	}
	.mv_bg,
	.mv_bg::before{
		position: absolute;
		width: 100%;
		height: 100%;
		max-width: 1920px;
		max-height: 1080px;
	}

	.mv_bg::before{
		background: no-repeat center / auto 100% url(../images/mv_eve--big.png);
	}
}



.mv_body{
	position: absolute;
	height: 100%;
	top: 0;
	left: 0;
	padding: 80px 30px;
	z-index: 1;
}

.mv_opwindow{
	width: 202px;
	padding: .8rem;
	background-color: rgba(0,0,0,.6);
}

.mv_opwindow_ttl{
	padding-bottom: .3rem;
	margin-bottom: .8rem;
	letter-spacing: .05rem;
	color: #00FFFF;
	border-bottom: 1px solid #00FFFF;
}


.mv_info{
	margin-top: 1rem;
}
	.mv_info--sp{
		display: none;
		background-color: rgba(0,0,0,.6);
		padding: .8rem;
	}
.mv_info_ttl{
	font-size: 13px;
}

.mv_text{
	color: #DDD;
	font-size: 13px;
	letter-spacing: .01rem;
}


.mv_copy{
	position: absolute;
	display: flex;
	flex-flow: column wrap;
	align-items: flex-end;
	bottom: 60px;
	right: 20px;
}
.mv_copy_label{
	display: inline-block;
	position: relative;
	overflow:hidden;
	margin-top: 1rem;
	padding: .5rem;
	transition: all 1.5s linear;
}

	.mv_copy_label:last-child,
	.mv_copy_label:first-child{
		margin-top: 0;
	}

	.mv_copy_label::before{
		content: "";
		position: absolute;
		width: 0;
		height: 100%;
		right: 0;
		bottom: 0;
		z-index: 0;
		transition: all 1s ease-in-out;

	}
	.mv_copy_label.is-active::before{
		width: 100%;
		background: #000;
	}



.mv_copy_textImg{
	opacity: 0;
	position: relative;
	z-index: 1;
	transition: all 1s 1s;
}

.mv_copy_textImg.is-active{
	opacity: 1;
}




/* news */
.mv_news{
	position: absolute;
	bottom: 310px;
	right: 20px;
	letter-spacing: 1px;
}


.news_heading{
	text-align: center;
	font-size: 1.125rem;
	margin-bottom: 1.5rem;
}

.news_list--mv{
	overflow-y: scroll;
	height: 240px;
}


.news_item{
	margin-top: 1.5rem;
}
	.news_item:first-child{
		margin-top: 0;
	}

.news_date{
	line-height: 1.2;
	color: #00FFFF;
	font-size: .875rem;
	font-family: 'Prata', serif;
}

.news_ttl{
	color: #DDD;
	font-size: .75rem;
	font-weight: 403;
	text-decoration: underline;
}






.mv_logo,
.mv_info,
.mv_news,
.mv_copy,
.mv_bg::before{
	opacity: 0;
	transition: 1s;
}

.mv_bg::before{
	transition: 1.5s;
}


.is-active .mv_logo,
.is-active .mv_info,
.is-active .mv_news,
.is-active .mv_copy,
.is-active .mv_bg::before{ opacity: 1;}


.is-active .mv_logo{ transition-delay: 0s; }
.is-active .mv_info{ transition-delay: .3s;  }
.is-active .mv_news{ transition-delay: .6s;  }
.is-active .mv_copy{ transition-delay: .9s;  }
.is-active .mv_bg::before{  transition-delay: 2s;}





/* b-section */

.sec{}

.sec--story{ background: no-repeat center / cover url(../images/story_bg.jpg) fixed;}
.sec--theater{ background: no-repeat center / cover url(../images/theater_bg.jpg) fixed;}



@media screen and (min-width:769px) {
	.sec--news{
		display: none;
	}

	.sec--movie{
		padding-top: 110px;
		padding-bottom: 195px;
	}

	.sec--story{
		padding-top: 90px;
		padding-bottom: 170px;
	}

	.sec--cast{
		/* padding-top: 325px; */
		padding-top: 120px;
		padding-bottom: 75px;
	}

	.sec--staff{
		padding-top: 100px;
		padding-bottom: 300px;
	}

	.sec--theater{
		padding-top: 90px;
		padding-bottom: 80px;
	}
	.sec--goods{
		padding-top: 160px;
	}
}


/* sec_elem */

.sec_hdr{
	position: relative;
}

.sec_ttl_circle{
	position: absolute;
	width: auto;
	display: inline-block;
	animation: 15s linear infinite rotation;

}

.sec_ttl{
	opacity: 0;
	z-index: -1;
	transition: transform .8s cubic-bezier(0,.78,.64,1.18) , opacity 1s;
}

	.is-active.sec_ttl{
		display: block;
		opacity: 1;
		z-index: 1;
	}


	.sec_ttl_circle{
		top: 7rem;
		left: 3.5rem;
	}

@media screen and (min-width:769px) {

	.sec_ttl{
		position: absolute;
		transform: translateY(-100vh);
	}

		.sec:nth-of-type(odd) .sec_ttl{
			margin-left: 0;
			right: 0;
		}
		.sec--movie .sec_ttl{
			right: -65px !important;
		}

		.is-active.sec_ttl{
			transform: translateY(4rem);
		}





	
		.sec:nth-of-type(odd) .sec_ttl_circle{
				left: auto;
				right: -9.5rem;
		}

		.sec--movie .sec_ttl_circle{
			right: calc( -9.5rem + -58px ) !important;
		}
}


.sec_body{}
	.sec_body--story,
	.sec_body--staff,
	.sec_body--goods{
		width: 476px;
		margin-left: auto;
	}


	.sec_body--movie{
		padding-top: 124px;
	}

	.sec_body--story{
		padding-top: 120px;
	}
	.sec_body--cast{
		padding-top: 65px;
	}
	.sec_body--staff{
		padding-top: 55px;
	}
	.sec_body--theater{}

	.sec_body--goods{
		padding-top: 42px;
	}





/* b-content */

.movie{
	margin-top: 32px;
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 100%;
}
.movie:first-child{
	margin-top: 0;
}


.movie_hdr{
	margin-bottom: .3rem;
}
.movie_ttl{
	font-size: 1.125rem;
	font-weight: 400;
	/* regular */
}
.movie_ttl_label{
	display: inline-block;
	margin-left: 1rem;
	padding: 0 .3rem;
	font-size: 1rem;
	font-weight: 400;
	/* regular */
	line-height: 1.2;
}

 
.movie_video{
	width: 100%;
	max-width: 100%;
	display: none;
}
.is-active.movie_video{ display: block;}





.movie_thumb{
	position: relative;
	cursor: pointer;
	z-index: 1;
}

.movie_text{
	text-align: right;
	font-size: .8rem;
}



.movie_thumb:hover{
	opacity: .8;
}


.movie_img{}




.story_text{
	font-size: 17px;
	line-height: 2.45;
	letter-spacing: .025rem;
}


.storySlide_wrap{
	/* overflow-x: hidden; */
}



.storySlide{
	width: 105%;
	margin: 110px auto 0;
	transform: rotate(-7deg) translate(-2.5%, 0);
}

.storySlide_item{
	width: auto !important;
	display: inline-block;
}

.swiper-wrapper {
	will-change: transform , transition-duration;
	transition-timing-function: linear !important;
}





/* b-cast */

.cast{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}


.cast_item{
	width: 50%;
	margin-top: 120px;
	display: flex;
	flex-flow: wrap column;
	align-items: flex-start;
}
.cast_item--big{
	width: 100%;
	margin-top: 0;
}
.cast_item--left{ padding-right: 94px}
.cast_item--right{ padding-left: 94px}

.cast_thumb{}
.cast_img{
	width: 238px;
	box-shadow: 0 0 0 1px #00FFFF;
}
.cast_ttl{
	margin-top: 2rem;
	font-size: 25px;
	font-weight: 500;
	letter-spacing: .075rem;
	color: #00FFFF;
}
.cast_text{
	margin-top: 12px;
	font-size: 12px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: .03rem;

}
.cast_text--big{
	width: 492px;
}

.cast_comment{
	width: auto;
	flex: 0 0 auto;
	margin-top: 20px;
}
.cast_comment--sp{ display: none;}


/* staff */
.staff{
	display: flex;
	flex-wrap: wrap;
	margin-top: 55px;
}
	.staff:first-child{
		margin-top: 0;
	}




.staff_dt{
	width: 45%;
	padding-right: 2rem;
	text-align: right;
	font-size: 13px;
	line-height: 24px;
	margin-bottom: 1.3rem;
}
.staff_dd{
	width: 55%;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start
}

.staff_ttl{
	display: inline-block;
	width: auto;
	font-size: 24px;
	line-height: 1;
	margin-bottom: 1.3rem;
}
.staff_comment{
	display: inline-block;
	width: auto;
	margin-left: 1.5rem;
}
.staff_text{
	font-size: 14px;
	letter-spacing: .05rem;
}



/* b-profile */
.profile{}
.profile_ttl{
	padding-bottom: .5rem;
	margin-bottom: 1rem;
	font-size: 28px;
	letter-spacing: .05rem;
	color: #00FFFF;
	border-bottom: 1px solid #00FFFF;
}
	.profile_ttl--staff{
		font-weight: bold;
	}

.profile_subTtl{
	margin-left: 1.5rem;
	font-size: 15px;
	letter-spacing: .05rem;
}

.profile_text{
	font-size: 13px;
	line-height: 2;
	letter-spacing: .005rem;
}
	.profile_text--staff{
		font-size: 12px;
		letter-spacing: .05rem;
	}

.profile_staff{
	display: flex;
	margin-top: 3rem;
}

.profile_thumb{
	width: auto;
	padding-right: 1rem;
}






/* theater */
.theater_ttl{
	font-size: 20px;
	font-weight: 500;
	line-height: 45px;
	letter-spacing: .05rem;
}
.theater_copy{
	margin-top: 1rem;
	color: #FFA500;
	font-size: .9375rem;
	letter-spacing: 1px;
}

.theaterList{
	margin-top: 30px;
}

.theaterList_heading{
	margin-bottom: 25px;
}

.theaterList{}
.theaterList_ttl{
	margin-top: 26px;
	margin-bottom: .8rem;
	font-size: 1.125rem;
	font-weight: bold;
}
	.theaterList_ttl:first-child{
		margin-top: 20px;
	}

.theaterList_item{
	display: flex;
	margin-bottom: .8rem;

	font-size: 13px;
	font-weight: 500;
}

.theaterList_anchor{
	position: relative;
	/*margin-left: 1rem;*/
	display: inline-block;
	font-size: 16px;
}

.theaterList_anchor--null{
	width: calc(100% - 4rem);
}

.theaterList_emphasis{
	margin-left: 3.6rem;
}

.theaterList_misc{
	margin-left: 1rem;
}

.theater_ftrTexts{
	margin-top: 26px;
	line-height: 2.2;
	font-size: .9375rem;
	font-weight: 300;
	letter-spacing: 1px;
}

/* pc only */

.theaterList_anchor[href]::after{
	position: absolute;
	content: "";
	display: inline-block;
	width: 100%;
	height: 1px;
	left: 0;
	bottom: -1px;
	background-color: #FFA500;
	transition: .1s;
}


@media screen and (min-width:769px) {
	.theaterList_anchor[href]::after{
		width: 0;
	}
}

.theaterList_anchor[href]:hover::after{
	width: 100%;
	transition: .5s;
}

.theaterList_subText{
	font-weight: 300;
}
.theaterList_note{
	font-size: 12px;
}




/* goods */
.goods_list{
	display: flex;
	flex-wrap: wrap;
}

.goods_item{
	width: 50%;
	margin-top: 50px;
	text-align: center;
}


	.goods_item:first-child{ margin-top: 0;}
	@media screen and (min-width:769px) {
	.goods_item:nth-of-type(odd){ padding-right: .4rem;}
	.goods_item:nth-of-type(even){ padding-left: .4rem;}
	.goods_item:nth-of-type(2){ margin-top: 0;}
	}


.goods_imgs{
	text-align: center;
}
.goods_img{
	margin-bottom: 1rem;
}
.goods_ttl{
	font-size: 1.125rem;
	color: #F03CA0;
	font-weight: bold;
	margin-bottom: .5rem;
}
.goods_text{
	font-size: .6875rem;
	line-height: 2;
	letter-spacing: 1px;
}

.goods_ftrTexts{
	margin-top: 60px;
	padding: 28px;
	background-color: rgba(0,0,0,.7);
}
.goods_afterTtl{
	font-size: 1.375rem;
	margin-bottom: .5rem;
	color: #F03CA0;
	letter-spacing: 1px;
	font-weight: 600;
}
.goods_afterText{
	font-size: .9375rem;
	line-height: 2;
	letter-spacing: 1px;
	font-weight: 300;
}



/* header drawer */

.menu_btn{
	display: none;
}


/* footer sns */
.sns{
	margin-bottom: 1.5rem;
	display: flex;
	justify-content: center;
}

.sns_item{
	padding: 0 1rem;
}

/* footer copyrights */

.copyrights{
	text-align: center;
	font-size: 12px;
}



/* debug */

.modal_content::-webkit-scrollbar,
.storySlide_wrap::-webkit-scrollbar {
	display: none;
}