@charset "utf-8";

/**------------------------------------
** TOP COMMON
------------------------------------**/
body{
	scrollbar-width: none;
	-ms-overflow-style: none;
}
body::-webkit-scrollbar{
	display: none;
}
#fullWrap {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	overflow: hidden;
	right: 0;
	bottom: 0;
	/* position: relative; */
}
#fullSections{
	position: absolute;
	top:0;
	left: 0;
	width: calc(100% - 50px);
	transition:all 0.6s cubic-bezier(0.13, 0.59, 0.31, 0.97);
	/* height:calc(var(--oneview_height) * 6); */
}

.section{
	position:relative;
	width:calc(100vw - 50px);
	height:var(--oneview_height);
}
.section__in {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	overflow: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.section__in::-webkit-scrollbar{
	display: none;
}
.section__scr {
	position: relative;
	left: 0;
	top: 0;
	min-height: calc(var(--oneview_height) + 50px);
	width: 100%;
}
.section__contentWrap{
	position: relative;
	min-height: min(51.6667vw, 930px);
}
.section__content{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 2;
}
.section__contentIn{
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	/* min-height: calc(51.6667vw + 50px); */
	/* min-height: 720px; */
	height: var(--oneview_height);
}



@media screen and (min-width: 768px){
	#book .section__content {
		position: static;
	}
	#kv .section__contentWrap,
	#movie .section__contentWrap,
	#voiceup .section__contentWrap,
	.storysection .section__contentWrap,
	#character .section__contentWrap,
	#staff .section__contentWrap,
	#cast .section__contentWrap
	/*#book .section__contentWrap*/{
		height: min(var(--oneview_height) + 50px);
	}
	#book .section__contentWrap {
		position: static;
	}
	#movie .section__MainContent{
		min-height: var(--oneview_height);
	}
	#voiceup .section__MainContent{
		min-height: var(--oneview_height);
	}
	.storysection .section__MainContent{
		min-height: var(--oneview_height);
	}

	#character .section__MainContent,
	#staff .section__MainContent,
	#cast .section__MainContent,
	#book .section__MainContent{
		min-height: max(640px, var(--oneview_height));
	}
	#character .section__contentIn,
	#staff .section__contentIn,
	#cast .section__contentIn,
	#book .section__contentIn{
		min-height: 640px;
	}
	#book .section__contentIn {
		height:auto;
		position: relative;
	}
	#book .mCSB_scrollTools_vertical {
		opacity:0;
		pointer-events: none;
	}
	.movieCont{
		justify-content: center!important;
		padding-left: 14.3478%;
	}
}




#fullWrap.kv #fullSections {
	top:0;
}
#fullWrap.movie #fullSections {
	top: calc(var(--oneview_height)*-1);
}
#fullWrap.voiceup #fullSections {
	top: calc(var(--oneview_height)*2*-1);
}
#fullWrap.story #fullSections {
	top: calc(var(--oneview_height)*3*-1);
}
#fullWrap.story_section2 #fullSections {
	top: calc(var(--oneview_height)*4*-1);
}
#fullWrap.story_section3 #fullSections {
	top: calc(var(--oneview_height)*5*-1);
}
#fullWrap.story_section4 #fullSections {
	top: calc(var(--oneview_height)*6*-1);
}
#fullWrap.story_section5 #fullSections {
	top: calc(var(--oneview_height)*7*-1);
}
#fullWrap.story_sectionlast #fullSections {
	top: calc(var(--oneview_height)*8*-1);
}
#fullWrap.character #fullSections {
	top: calc(var(--oneview_height)*9*-1);
}
#fullWrap.staff #fullSections {
	top: calc(var(--oneview_height)*10*-1);
}
#fullWrap.cast #fullSections {
	top: calc(var(--oneview_height)*11*-1);
}
#fullWrap.book #fullSections {
	top: calc(var(--oneview_height)*12*-1);
}

@media screen and (max-width: 767px){
	#fullSections{
		width: 93.3334%;
	}
	.section{
		width: 100%;
	}
	.section__contentWrap{
		min-height: auto;
	}
}

.mCSB_scrollTools {
	z-index: -1;
	opacity: 0;
}

.cont_h2Wrap{
	color: #fff;
	position: absolute;
	top: 0;
	right: 30px;
	width: 85px;
	height: 85px;
	z-index: 2;
}
.cont_h2Wrap:before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	padding-top: 100%;
	background: url(../img/common/h2_line.svg) no-repeat left bottom / cover;
}
.cont_h2{
	font-family: var(--font-eng);
	font-weight: 500;
	font-style: italic;
	text-align: right;
	line-height: 0.7;
	position: absolute;
	top: 0;
	margin-top: 24px;
	right: 54px;
	font-size: 20px;
}
.cont_h2__num{
	font-family: var(--font-eng);
	font-size: 48px;
	font-weight: 700;
	font-style: italic;
	line-height: 0.7;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 1em;
	text-align: center;
}

@media screen and (max-width: 767px){
	.cont_h2Wrap{
		top: 0;
		right: 0;
		margin-top: var(--sp-size-14);
		width: var(--sp-size-96);
		height: var(--sp-size-96);
	}
	.cont_h2{
		margin-top: var(--sp-size-30);
		right: var(--sp-size-64);
		font-size: var(--sp-size-24);
	}
	.cont_h2__num{
		font-size: var(--sp-size-48);
		right: var(--sp-size-8);
	}
}

.section__MainContent{
	position: relative;
	width: 100%;
	min-height: max(51.6667vw, var(--oneview_height));
	z-index: 2;
}

.section__contentLinks{
	position: absolute;
	top: 0;
}
.section__contentLinks a{
	color: #FFF;
	position: absolute;
}




.section__contentLinks{
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	pointer-events: none;
}
.section__contentLink_prev{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}
.section__contentLink_prev:before{
	content: '';
	position: absolute;
	top: 0;
	left: calc(50% - 0.5px);
	right: calc(50% - 0.5px);
	width: 1px;
	height: 8px;
	background-color: #fff;
}
.section__contentLink_prev a{
	pointer-events: auto;
	position: absolute;
	margin: 8px auto 0;
	top: 0;
	left: 0;
	right: 0;
}

.section__contentLink_next{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}
.section__contentLink_next:before{
	content: '';
	position: absolute;
	bottom: -50px;
	left: calc(50% - 0.5px);
	right: calc(50% - 0.5px);
	width: 1px;
	height: calc(8px + 50px);
	background-color: #fff;
}
.section__contentLink_next a{
	pointer-events: auto;
	position: absolute;
	margin: 0 auto 8px;
	bottom: 0;
	left: 0;
	right: 0;
}
.section__contentLinks  .com_linkCircle .com_linkCircle_in{
	background-color: rgba(0,0,0,50%);
}

@media screen and (min-width: 768px){
	.section__contentLinks .com_linkCircle .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	.section__contentLinks .com_linkCircle .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 1;
	}
	.section__contentLinks .com_linkCircle .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
}

@media screen and (max-width: 767px){
	.section__MainContent{
		min-height: var(--oneview_height);
	}
	.section__contentLink_prev:before,
	.section__contentLink_next:before{
		height: var(--sp-size-32);
	}

	.section__contentLink_next:before{
		bottom: 0;
	}

	.section__contentLink_prev a{
		margin-top: var(--sp-size-32);
	}
	.section__contentLink_next a{
		margin-bottom: var(--sp-size-32);
	}
}


/**------------------------------------
** TOP: #KV
------------------------------------**/
#kv .section__contentWrap{
	min-height: min(var(--oneview_height) + 50px);
}
@-moz-document url-prefix() {
	#kv .section__contentWrap{
		min-height: min(51.6667vw, 930px);
	}
}
.kv_Content{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 2;
}
.kv_ContentIn{
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	height: var(--oneview_height);
	min-height: min(51.6667vw, 930px);
	z-index: 2;
}
.kv__logo{
	position: absolute;
	bottom: 0;
	left: 55px;
	margin: 0 auto calc(min(1.7392%, 30px) + 30px);
	width:339px;
	height:173px;
	z-index: 2;
}
.kv__logo img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	filter: drop-shadow(0 0 2px #000);
}

.kv__txt_catch{
	position: absolute;
	top: 14%;
	left: 50%;
	width:92px;
	height:199px;
	z-index: 2;
	margin-left:-46px;
	background:url(../img/top/kv/kv__txt_catch2.png) no-repeat center center / contain;
	filter: drop-shadow(0 0 2px #000);
}

.kv__text_subCatch {
	position: absolute;
	left:471px;
	bottom:calc(min(1.7392%, 30px) + 113px);
	width:59px;
	height:93px;
	background:url(../img/top/kv/kv__txt_subcatch2.png) no-repeat center center / contain;
	z-index:2;
}

.kv__txt_director{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: min(2.174%, 38px) auto 0;
	width: 322px;
	width: min(28%, 483px);
	padding-top: 47px;
	padding-top: min(4.087%, 71px);
	background: url(../img/top/kv/kv__txt_director.svg) no-repeat center / contain;
	z-index: 2;
}

.kv__txt_releaseDay{
	position: absolute;
	bottom: 0;
	left: 414px;
	width: 190px;
	padding-top: calc(30px + 82px);
	z-index: 11;
	pointer-events: none;
}
.kv__txt_releaseDay a {
	position: absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background: url(../img/top/kv/releaseDay.svg) no-repeat right top / contain;
	pointer-events: auto;
	transition: all 0.3s ease;
}
@media screen and (min-width:768px){
	.kv__txt_releaseDay a:hover {
		opacity:0.7;
	}
}
.js-loani{
	opacity: 0;
	/* filter: blur(14px); */
	transition: opacity 0.8s cubic-bezier(.44,.3,.52,1), filter 0.8s cubic-bezier(.44,.3,.52,1).4s;
}
body.--loaded .js-loani{
	opacity: 1;
/*	filter: blur(0px);*/
}

@media screen and (max-width: 767px){
	.kv__txt_catch{
		display: none;
	}
	.kv_ContentIn{
		min-height: auto;
	}
	.kv__logo{
		top:unset;
		left:15.6vw;
		bottom:31.1333vw;
		width: 61.2vw;
		height:31.0666vw;
		margin: 0 auto calc(var(--sp-size-80) + 65px);
	}
	.kv__logo img{
		width: 100%;
		filter: unset;
		object-fit: contain;
		object-position: center;
	}
	.kv__txt_catch{
		margin: 7.4286% auto 0;
		width: 11.4667%;
		padding-top: 36.2667%;
	}
	.kv__text_subCatch {
		left: unset;
		right: 13.6666vw;
		bottom: 28.8666vw;
		width: 4.7333vw;
		height: 30.8vw;
		background: url(../img/top/kv/kv_catch_sp.svg) no-repeat center center / contain;
	}
	.kv__txt_director{
		top: unset;
		right: unset;
		bottom: 0;
		width: 58.5715%;
		padding-top: 8.4286%;
		background-image: url(../img/top/kv/kv__txt_director_sp.svg);
		background-position: left bottom;
		margin: 0 0 calc(3.7143% + var(--sp-size-96)) 4.5715%;
	}
	.kv__txt_releaseDay {
		right: 2.8572%;
		width: 30.2858%;
		left: unset;
		padding-top: 13.1429%;
		bottom: var(--sp-size-96);
	}
}


@media screen and (min-width: 768px){
	.kv__newsListsfullWrap{
		width: 100%;
		position: absolute;
		top: 0;
		bottom: 0;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
	}
	/* .kv__logo,.kv__txt_releaseDay{
		position: sticky;
	} */
	.kv__sticky{
		position: sticky;
		width: 100%;
		height: 100vh;
		bottom: 0;
		z-index: 2;
	}
}

.kv__newsListsWrap{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 30px;
	background-color: #005347;
	z-index: 2;
	display: flex;
	overflow: hidden;
	z-index: 12;
	transform: translateY(100%);
	opacity: 0;
	transition: opacity 1s cubic-bezier(.44,.3,.52,1) .2s, transform 0.8s cubic-bezier(.44,.3,.52,1) .2s;
}
body.--loaded .kv__newsListsWrap{
	transform: translateY(0%);
	opacity: 1;
}

.kv__newsLists_ttl{
	display: flex;
	height: 100%;
	align-items: center;
	line-height: 1;
	background-color: #fff;
	color: #005347;
	font-family: var(--font-eng);
	font-weight: 500;
	letter-spacing: 0.1em;
	padding: 0 20px;
}
.kv__newsLists{
	width: calc(100% - 200px - 4%);
	position: relative;
}
.kv__newsList{
	width: 100%;
	height: 100%;
	padding: 0 20px;
	position: absolute;
	top: 0;
	opacity: 0;
	transition: .3s ease;
	pointer-events: none;
}
.kv__newsList_link{
	display: flex;
	width: 100%;
	height: 100%;
	color: #FFF;
	line-height: 1;
	align-items: center;
	text-decoration: none;
	pointer-events: none;
}
.kv__newsList.-show{
	opacity: 1;
	pointer-events: auto;
}
.kv__newsList.-show .kv__newsList_link{
	pointer-events: auto;
}

.kv__newsList_date{
	font-family: var(--font-eng);
	padding-right: 20px;
	flex-shrink: 0;
}
.kv__newsList_ttl{
	width: 100%;
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}


.kv__newsLists_newslink{
	display: flex;
	align-items: center;
	margin-left: auto;
	padding-right: 6px;
}
.kv__newsLists_newslink a{
	display: inline-block;
	line-height: 1;
	background-color: #fff;
	color: #005347;
	font-family: var(--font-eng);
	font-size: 14px;
	font-weight: 600;
	padding: 2px 8px;
	letter-spacing: 0.1em;
	text-decoration: none;
}
.kv__newsLists_newslink a span{
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 767px){
	.kv__newsListsWrap{
		position: absolute;
		height: var(--sp-size-96);
	}
	.kv__newsLists_ttl{
		font-size: var(--sp-size-24);
		padding: 0;
		justify-content: center;
		width: var(--sp-size-88);
		flex-shrink: 0;
	}
	.kv__newsLists{
		width: calc(100% - var(--sp-size-88) - var(--sp-size-96));
	}
	.kv__newsList{
		padding: 0 var(--sp-size-12);
	}
	.kv__newsList_link{
		line-height: 1.4;
		flex-wrap: wrap;
		justify-content: center;
	}
	.kv__newsList_date{
		font-size: var(--sp-size-24);
		line-height: 0.85;
		padding-right: 0;
		padding-bottom: var(--sp-size-4);
		display: block;
		width: 100%;
	}
	.kv__newsList_ttl{
		font-size: var(--sp-size-20);
		display: -webkit-box;
		overflow: hidden;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		white-space: unset;
	}
	.kv__newsLists_newslink{
		padding-right: var(--sp-size-12);
	}
	.kv__newsLists_newslink a{
		font-size: var(--sp-size-24);
		padding: var(--sp-size-4) var(--sp-size-10);
		line-height: 1;
	}
}


/* KV__bnr */
.kv__bnr{
	width: calc((min(10%, 140px) + 40px) * 3);
	position: absolute;
	z-index: 12;
	left: 88px;
	top: 20px;
	display: flex;
	align-items: center;
}
.kv__bnr li {
	margin-right:8px;
}
.kv__bnr_size_l{
	width: 30%;
	flex-shrink: 0;
}
.kv__bnr a{
	display: block;
}
.kv__bnr a img{
	width: 100%;
}
/* KV__bnrP */
.kv__bnrP{
	width: auto;
	position: absolute;
	z-index: 12;
	right: 28px;
	top: 20px;
	bottom: 50px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	pointer-events: none;
}
.kv__bnrP li {
	margin-left: auto;
}
.kv__bnrP a{
	display: block;
	border: 2px solid #FFF;
	pointer-events: auto;
}
.kv__bnrP a img{
	width: 100%;
}
.kv__bnrP_voiceup{
	width: min(24.3479%, 280px);
}
.kv__bnrP_0916{
	width: min(31.3044%, 360px);
	margin-bottom: 5px;
}
.kv__bnrP_0912{
	width: min(31.3044%, 360px);
}

@media screen and (max-width: 767px){
	.kv__bnr{
		width:auto;
		/* bottom: 15vw; */
		left:1.1333vw;
		top: 5px;
		right: 24.0666vw;
		margin-top: 0;
		margin-right: 0;
		justify-content: space-between;
	}
	.kv__bnr li {
		margin:0 0.5vw 0 0;
	}
	.kv__bnrP{
		top: unset;
		bottom: 15vw;
		left: min(2.4vw, 18px);
		margin-top: 0;
		margin-right: 0;
		justify-content: space-between;
	}
	.kv__bnrP li {
		margin:0 0.5vw 0 0;
	}
	.kv__bnrP_voiceup,
	.kv__bnrP_0916,
	.kv__bnrP_0912{
		width: min(68.5715%, 480px);
	}
	.kv__bnrP li.kv__bnrP_underWrap{
		order: -1;
		margin-bottom: min(2.4vw, 18px);
	}
	.kv__bnrP li.kv__bnrP_0916{
		margin-bottom: var(--sp-size-8);
	}
}
.js-mouseOver{
	position: absolute;
	z-index: 10;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}


.kv__imgContWrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.kv__imgContIn{
	width: 100%;
	overflow: auto;
}
.kv__img{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-size: cover;
	opacity: 0;
	background-position: center;
	transition: background-position-y 4s cubic-bezier(.43,.56,.48,.92) ,background-position-x 4s cubic-bezier(.43,.56,.48,.92) ,filter .8s ease-in-out,transform .8s ease-in-out,-webkit-filter .8s ease-in-out,opacity 3.9s ease-in-out 0s;
}
.kv__img.-show{
	opacity: 1;
	transition-delay: 0s;
}


#kv__img1{
	background-image: url(../img/top/kv/kv4.jpg);
}
/*#kv__img2{
	background-color: #fff;
	background-image: url(../img/top/kv/kv2.jpg);
}
#kv__img3{
	background-color: red;
	background-image: url(../img/top/kv/kv3.jpg);
}
*/
@media screen and (max-width: 767px){
	.kv__imgCont{
		position: relative;
		width: 100%;
		height: var(--oneview_height);
	}
	.kv__imgContIn{
		overflow: hidden;
	}
	body.--loaded .kv__imgContIn{
		overflow: auto;
	}
	#kv__img1{
		background-image: url(../img/top/kv/kv4-s.jpg);
	}
}



/**------------------------------------
** TOP: #MOVIE
------------------------------------**/
#movie .section__contentWrap{
	min-height: min(var(--oneview_height) + 50px);
}
@-moz-document url-prefix() {
	#movie .section__contentWrap{
		min-height: min(51.6667vw, 930px);
	}
}
.movie_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/top/movie/bg.jpg) no-repeat center center / cover;
	z-index: -1;
}
.movieContWrap{
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 2;
	padding: 80px 0;
}
.movieCont{
	width: 100%;
	display: flex;
	justify-content: flex-end;
}
.movieThumbs{
	width: 71.3044%;
	display: flex;
	align-items: center;
}
.movieLists{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.movieList{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
	transition: .4s ease;
}
.btn_movie{
	width: 100%;
	padding-top: 56.25%;
	overflow: hidden;
	position: relative;
	display: block;
	pointer-events: none;
}
.btn_movie:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: #000;
	opacity: 50%;
	z-index: 2;
	transition: .3s ease;
}
.btn_movie img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s ease;
}
.icon_play{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 76px;
	height: 76px;
	border-radius: 70%;
	border: 1px solid #FFF;
	color: #FFF;
	background-color: rgba(0,0,0,50%);
	z-index: 3;
	transition: .3s ease;
}
.icon_play span{
	position: absolute;
	top: 0px;
	left: 0;
	bottom: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-eng);
	font-size: 12px;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-align: center;
}

/* hover */
.btn_movie:hover::before{
	opacity: 40%;
}
.btn_movie:hover img{
	transform: scale(1.05);
}
.btn_movie:hover .icon_play{
	background-color: rgba(255,255,255,60%);
	color: #111111;
}

/* ACTIVE */
.movieList.--isSelect{
	opacity: 1;
	pointer-events: auto;
}
.movieList.--isSelect .btn_movie{
	pointer-events: auto;
}


@media screen and (min-width: 768px){
	.movieSelectListsWrap{
		width: 14.3478%;
	}
	.movieCont.-h .movieSelectListsWrap{
		margin: auto 0;
	}
}
.movieSelectLists{
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.movieSelectList{
	font-size: 14px;
	line-height: 2;
}
.movieSelectList:not(:last-child){
	margin-bottom: 8px;
}
.movieSelectList_link{
	display: block;
	padding-left: min(2.5vw, 30px);
	text-decoration: none;
	color: #FFF;
	position: relative;
}
.movieSelectList_link:before{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	top: 0;
	width: 0;
	height: 1px;
	background-color: #fff;
	margin: auto 0;
	transition: all .3s ease;

}

@media screen and (min-width: 768px){
	.movieSelectList_link:hover::before{
		width: min(1vw, 12px);
	}
	.movieSelectList_link.--isSelect:before{
		width: min(2vw, 24px);
	}
}


@media screen and (max-width: 767px){
	.movie_bg{
		background-image: url(../img/top/movie/bg_sp.jpg);
	}
	.movieContWrap{
		padding: 22.8572% 0;
	}
	.movieCont{
		display: block;
	}
	.movieThumbs{
		display: block;
		width: 100%;
	}
	.movieLists{
		width: 100%;
	}
	.icon_play{
		width: var(--sp-size-96);
		height: var(--sp-size-96);
	}
	.icon_play span{
		font-size: var(--sp-size-24);
	}
	.movieSelectLists{
		width: 100%;
	}
	.movieSelectLists{
		width: 100%;
		height: auto;
		flex-direction: unset;
		justify-content: center;
	}
	.movieSelectList{
		font-size: var(--sp-size-24);
		line-height: 1.5;
		padding: 0 var(--sp-size-4);
	}
	.movieSelectList:not(:last-child){
		margin-bottom: 0;
	}
	.movieSelectList_link{
		padding: var(--sp-size-40) var(--sp-size-8) 0;
	}
	.movieSelectList_link:before{
		width: 1px;
		height: 0;
		bottom: unset;
		right: 0;
		margin: 0 auto;
	}
	.movieSelectList_link.--isSelect:before{
		height: var(--sp-size-32);
	}
}

/**------------------------------------
** TOP: sectionNavLists
------------------------------------**/
@media screen and (min-width: 768px){
	.sectionNavWrap{
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: 72px;
		overflow: hidden;
		pointer-events: none;
		z-index: 10;
	}
	.sectionNavLists{
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: center;
		margin-left: -8px;
	}
	.sectionNavList{
		width: 72px;
		height: 72px;
		position: relative;
	}
	.sectionNavList_circle{
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.sectionNavLists .com_linkCircle{
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		pointer-events: auto;
		color: #FFF;
	}
	.sectionNavLists .com_linkCircle_out,
	.sectionNavLists .com_linkCircle_in{
		top: 0;
		bottom: 0;
		margin: auto;
	}

	.sectionNavList_line{
		position: absolute;
		left: 0;
		right: 0;
		width: 1px;
		height: 50%;
		background-color: #353535;
		opacity: 1;
		margin: 0 auto;
		transition: all .3s ease;
		z-index: -1;
	}
	.com_linkCircle:hover .sectionNavList_line{
		opacity: 0;
	}
	.sectionNavList_line--top{
		top: 0;
	}
	.sectionNavList_line--btm{
		bottom: 0;
	}

	#fullWrap.kv .com_linkCircle_out{
		background:rgba(0,0,0,.5);
	}

	/* #kv_active */
	#fullWrap.kv #secNav_top .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.kv #secNav_top .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.kv #secNav_top .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(1);
		transition-delay: .05s;
	}
	#fullWrap.kv #secNav_top .sectionNavList_line{
		opacity: 0;
	}

	/* #movie_active */
	#fullWrap.movie #secNav_movie .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.movie #secNav_movie .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.movie #secNav_movie .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.movie #secNav_movie .sectionNavList_line{
		opacity: 0;
	}

	/* #voiceup_active */
	#fullWrap.voiceup #secNav_voiceup .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.voiceup #secNav_voiceup .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.voiceup #secNav_voiceup .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.voiceup #secNav_voiceup .sectionNavList_line{
		opacity: 0;
	}

	/* #story_active */
	#fullWrap.story #secNav_story .com_linkCircle_out,
	#fullWrap.story_section2 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section3 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section4 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section5 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section6 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section7 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section8 #secNav_story .com_linkCircle_out,
	#fullWrap.story_section9 #secNav_story .com_linkCircle_out,
	#fullWrap.story_sectionlast #secNav_story .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.story #secNav_story .com_linkCircle_in,
	#fullWrap.story_section2 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section3 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section4 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section5 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section6 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section7 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section8 #secNav_story .com_linkCircle_in,
	#fullWrap.story_section9 #secNav_story .com_linkCircle_in,
	#fullWrap.story_sectionlast #secNav_story .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.story #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section2 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section3 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section4 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section5 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section6 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section7 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section8 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_section9 #secNav_story .com_linkCircle_txt span,
	#fullWrap.story_sectionlast #secNav_story .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.story #secNav_story .sectionNavList_line,
	#fullWrap.storysection2 #secNav_story .sectionNavList_line,
	#fullWrap.storysection3 #secNav_story .sectionNavList_line,
	#fullWrap.storysection4 #secNav_story .sectionNavList_line,
	#fullWrap.storysection5 #secNav_story .sectionNavList_line,
	#fullWrap.storysection6 #secNav_story .sectionNavList_line,
	#fullWrap.storysection7 #secNav_story .sectionNavList_line,
	#fullWrap.storysection8 #secNav_story .sectionNavList_line,
	#fullWrap.storysection9 #secNav_story .sectionNavList_line,
	#fullWrap.storysectionlast #secNav_story .sectionNavList_line{
		opacity: 0;
	}

	/* #character_active */
	#fullWrap.character #secNav_character .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.character #secNav_character .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.character #secNav_character .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.character #secNav_character .sectionNavList_line{
		opacity: 0;
	}

	/* #staff_active */
	#fullWrap.staff #secNav_staff .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.staff #secNav_staff .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.staff #secNav_staff .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.staff #secNav_staff .sectionNavList_line{
		opacity: 0;
	}

	/* #staff_active */
	#fullWrap.cast #secNav_cast .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.cast #secNav_cast .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.cast #secNav_cast .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.cast #secNav_cast .sectionNavList_line{
		opacity: 0;
	}

	/* #book_active */
	#fullWrap.book #secNav_book .com_linkCircle_out{
		width: 72px;
		height: 72px;
	}
	#fullWrap.book #secNav_book .com_linkCircle_in{
		width: 72px;
		height: 72px;
		opacity: 0;
	}
	#fullWrap.book #secNav_book .com_linkCircle_txt span{
		opacity: 1;
		transform: scale(100%);
		transition-delay: .05s;
	}
	#fullWrap.book #secNav_book .sectionNavList_line{
		opacity: 0;
	}
}


/**------------------------------------
** TOP: #STORY
------------------------------------**/
.storyContWrap .section__contentLinks{
	left: 0;
}
.story_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	z-index: -1;
}
.storyContWrap{
	z-index: 2;
	width: 100%;
	padding: 80px 30px 20px 80px;
	display: flex;
}
.storyTxtWrap{
	z-index: 2;
	display: flex;
	pointer-events: none;
}

.storyTxt{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	-webkit-text-orientation: upright;
	text-orientation: upright;
	min-height: 300px;
	font-size: 14px;
	line-height: 2.3572;
	letter-spacing: 0.5em;
}
.storyTxt span{
	font-family: var(--font-sans);
}
span.storyTxt_num{
	font-family: var(--font-serif);
	text-combine-upright: all;
	font-style: normal;
	display: inline-block;
	padding-bottom: 0.5em;
	letter-spacing: -0.5em;
	line-height: 1;
}

@media screen and (max-width: 767px){
	.story_bg{
		height: auto;
		padding-top: min(59%, 413px);
		background-repeat: no-repeat;
		background-position: center top;
		background-size: contain;
	}
	.section.storysection:nth-of-type(even) .story_bg{
		top: unset;
		bottom: 0;
		background-position: center bottom;
	}
	.storyContWrap{
		width: 100%;
		padding-top: min(59%, 413px);
		padding-right: min(6.8572%, 48px);
		padding-bottom: min(18.5715%, 130px);
		padding-left: min(6.8572%, 48px);
		align-items: center;
	}
	.storyContWrap .storyTxtWrap{
		width: 100%;
		justify-content: center;
	}
	.section.storysection:nth-of-type(even) .storyContWrap{
		padding-top: min(18.5715%, 130px);
		padding-bottom: min(59%, 413px);
	}
	.storyTxt{
		padding: var(--sp-size-30) 0;
		min-height: min(87.2vw, 654px);
		font-size: var(--sp-size-24);
		line-height: 2.0834;
	}
}


/** story1 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story1{
		align-items: flex-end;
	}
	.storyContWrap.-story1 .storyTxtWrap{
		width: 100%;
		justify-content: flex-end;
	}
}
.story_bg.-storybg1{
	background-image: url(../img/top/story/bg_sec1.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg1{
		background-image: url(../img/top/story/bg_sec1_sp.jpg);
	}
}

/** story2 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story2{
		align-items: flex-end;
	}
	.storyContWrap.-story2 .storyTxtWrap{
		width: 100%;
		justify-content: flex-start;
	}
}
.story_bg.-storybg2{
	background-image: url(../img/top/story/bg_sec2.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg2{
		background-image: url(../img/top/story/bg_sec2_sp.jpg);
	}
}

/** story3 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story3{
		align-items: center;
	}
	.storyContWrap.-story3 .storyTxtWrap{
		width: 100%;
		justify-content: flex-end;
	}
}
.story_bg.-storybg3{
	background-image: url(../img/top/story/bg_sec3.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg3{
		background-image: url(../img/top/story/bg_sec3_sp.jpg);
	}
}

/** story4 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story4{
		align-items: flex-end;
	}
	.storyContWrap.-story4 .storyTxtWrap{
		width: 100%;
		justify-content: flex-end;
	}
}
.story_bg.-storybg4{
	background-image: url(../img/top/story/bg_sec4.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg4{
		background-image: url(../img/top/story/bg_sec4_sp.jpg);
	}
}

/** story5 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story5{
		align-items: flex-end;
	}
	.storyContWrap.-story5 .storyTxtWrap{
		width: 100%;
		justify-content: flex-end;
	}
}
.story_bg.-storybg5{
	background-image: url(../img/top/story/bg_sec5.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg5{
		background-image: url(../img/top/story/bg_sec5_sp.jpg);
	}
}

/** story6 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story6{
		align-items: flex-end;
	}
	.storyContWrap.-story6 .storyTxtWrap{
		width: 100%;
		justify-content: flex-end;
	}
}
.story_bg.-storybg6{
	background-image: url(../img/top/story/bg_sec6.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg6{
		background-image: url(../img/top/story/bg_sec6_sp.jpg);
	}
}

/** story7 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story7{
		align-items: center;
	}
	.storyContWrap.-story7 .storyTxtWrap{
		width: 100%;
		justify-content: flex-start;
	}
}
.story_bg.-storybg7{
	background-image: url(../img/top/story/bg_sec7.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg7{
		background-image: url(../img/top/story/bg_sec7_sp.jpg);
	}
}

/** story8 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story8{
		align-items: flex-end;
	}
	.storyContWrap.-story8 .storyTxtWrap{
		width: 100%;
		justify-content: flex-start;
	}
}
.story_bg.-storybg8{
	background-image: url(../img/top/story/bg_sec8.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg8{
		background-image: url(../img/top/story/bg_sec8_sp.jpg);
	}
}

/** story9 **/
@media screen and (min-width: 767px){
	.storyContWrap.-story9{
		align-items: center;
	}
	.storyContWrap.-story9 .storyTxtWrap{
		width: 100%;
		justify-content: center;
	}
}
.story_bg.-storybg9{
	background-image: url(../img/top/story/bg_sec9.jpg);
}
@media screen and (max-width: 767px){
	.story_bg.-storybg9{
		background-image: url(../img/top/story/bg_sec9_sp.jpg);
	}
}


/** storylast **/
#story_sectionlast .cont_h2Wrap{
	z-index: 3;
}
.storyContWrap.-storylast{
	padding: min(19.3549vh, 120px) 0;
	align-items: center;
	justify-content: center;
}
.storySection6_imgSlideWrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.storySection6_imgSlideLists{
	animation-play-state: paused;
}
#fullWrap.story_sectionlast .storySection6_imgSlideLists{
	animation-play-state: running;
}
.storySection6_imgSlide{
	position: absolute;
	width: 100%;
	left: 0;
	height: min(19.3549vh, 120px);
}
.storySection6_imgSlide--top{
	top: 0;
}
.storySection6_imgSlide--bottom{
	bottom: 0;
}
.storySection6_imageWrap {
    width: 198px;
}
.storySection6_image {
    padding: 32px 0;
}
.storySection6_image img {
    width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.story_bg.-storybglast{
	background-image: url(../img/top/story/bg.jpg);
}
@media screen and (max-width: 767px){
	#story_sectionlast.section .storyContWrap.-storylast{
		padding: 22.8572% 0;
	}
	.storySection6_imgSlide,
	.storySection6_imgSlideLists{
		/* height: min(16vw, 120px); */
		height: 120px;
	}
	.storySection6_imageWrap{
		width: 42.8572%;
		margin: 0 auto;
		display: block;
	}
	.storySection6_image{
		width: 100%;
	}
	.story_bg.-storybglast{
		height: 100%;
		padding-top: unset;
		background-image: url(../img/top/story/bg_sp.jpg);
		background-position: center;
		background-size: cover;
		top: 0;
		bottom: 0;
	}
}


/**------------------------------------
** TOP: #STAFF / #CAST
------------------------------------**/
#staff .section__contentWrap,
#cast .section__contentWrap{
	min-height: min(var(--oneview_height) + 50px);
}
@-moz-document url-prefix() {
	#staff .section__contentWrap,
	#cast .section__contentWrap{
		min-height: min(51.6667vw, 930px);
	}
}
.staffcastContWrap{
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 2;
	padding: 80px 0;
}
.staff_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: calc(100% + 50px);
	background: url(../img/top/staff/bg.jpg) no-repeat center center / cover;
	z-index: -1;
}
.cast_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: calc(100% + 50px);
	background: url(../img/top/cast/bg.jpg) no-repeat center center / cover;
	z-index: -1;
}
.staffcastListsWrap{
	padding: 96px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 420px;
}
.staffcastLists{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	-webkit-text-orientation: upright;
	text-orientation: upright;
	color: #FFF;
}
.staffcastList{
	font-size: 20px;
	line-height: 1.667;
	letter-spacing: 0.5em;
}
.staffcastList:not(:last-child){
	margin-left: 40px;
}
.staffcastList dt{
	font-size: 60%;
	margin-left: 8px;
}


.btnWrap_sc_comment{
	width: 24px;
	position: relative;
	display: inline-block;
	margin-top: 8px;
	padding-top: 136px;
}
.btnWrap_sc_comment:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 1px;
	height: 64px;
	margin: 0 auto;
	background-color: var(--color-gray);
}
.btn_sc_comment{
	position: absolute;
	width: 72px;
	height: 72px;
	left: -24px;
	bottom: 0;
	border-radius: 50%;
	border: 1px solid #FFF;
	background-color: rgba(0,0,0,50%);
	color: #FFF;
	transition: .3s ease;
	writing-mode: horizontal-tb;
}
.btn_sc_comment span{
	position: absolute;
	top: 0px;
	left: 0;
	bottom: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-eng);
	font-size: 12px;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: -0.015em;
	text-align: center;
}
@media screen and (min-width: 768px){
	.btn_sc_comment:hover{
		background-color: rgba(255,255,255,100%);
		color: #111;
	}
}


@media screen and (max-width: 767px){
	.staff_bg{
		background-image: url(../img/top/staff/bg_sp.jpg);
	}
	.cast_bg{
		background-image: url(../img/top/cast/bg_sp.jpg);
	}

	.staffcastContWrap{
		padding: 22.8572% 0;
	}
	.staffcastListsWrap{
		padding: 6.8572% 0;
		min-height: min(58.6667vw, 440px);
	}
	.staffcastList{
		font-size: var(--sp-size-26);
	}
	.staffcastList:not(:last-child){
		margin-left: var(--sp-size-24);
	}
	.staffcastList dt{
		font-size: var(--sp-size-20);
		margin-left: var(--sp-size-4);
	}

	.btnWrap_sc_comment{
		margin-top: var(--sp-size-8);
		width: var(--sp-size-32);
		padding-top: min(27.7334vw, 208px);
	}
	.btnWrap_sc_comment:before{
		height: min(14.9334vw, 112px);
	}
	.btn_sc_comment{
		width: var(--sp-size-96);
		height: var(--sp-size-96);
		left: calc(var(--sp-size-32) * -1);
	}
	.btn_sc_comment span{
		font-size: var(--sp-size-24);
		transform: scale(70%);
		white-space: nowrap;
	}
}


/*.Staff */
#staff .staffcastListsWrap{
	flex-direction: column;
	align-items: unset;
	min-height: 490px;
	padding: 0 72px;
}
.staffLists{
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	color: #FFF;
}
.staffLists:first-child .staffList{
	padding-top: 0;
}
.staffLists:last-child .staffList{
	padding-bottom: 0;
}
.staffList{
	display: flex;
	flex-wrap: wrap;
	padding: min(1.3334vw, 16px);
	font-size: min(1.3334vw, 16px);
}
.staffList.--director{
	width: 100%;
	justify-content: center;
}
.staffList.--director dd.w100{
	width: 100%;
}
.staffList.--director .btnWrap_sc_comment{
	display: block;
	margin: 0 auto;
	padding-top: 96px;
}
.staffList.--director .btnWrap_sc_comment:before{
	height: 24px;
}
.staffList dt:after{
	content: '：';
}
@media screen and (max-width: 767px){
	#staff .staffcastListsWrap{
		min-height: min(90.6667vw, 680px);
		padding: 0 var(--sp-size-20);
	}
	.staffList{
		font-size: var(--sp-size-20);
		padding: var(--sp-size-20);
		line-height: 1;
	}
	.staffList.--director .btnWrap_sc_comment{
		padding-top: min(16vw, 120px);
	}
	.staffList.--director .btnWrap_sc_comment:before{
		padding-top: var(--sp-size-24);
	}

}


/* Cast */
.castCont{
	display: flex;
}
.castContIn{
	display: flex;
	margin-left: 48px;
}
.castCont .cast_ttl{
	order: 2;
	font-size: 12px;
	line-height: 1.667;
}
.castList:not(:last-child){
	margin-left: 12px;
}

@media screen and (max-width: 767px){
	.castCont .cast_ttl{
		font-size: var(--sp-size-20);
		margin-left: var(--sp-size-8);
	}
}
@media screen and (min-width: 767px){
	.castList{
		font-size: 18px;
	}
	.castLists1{
		order: -1;
		width: 84px;
	}
	.castLists2{
		order: 2;
		width: 288px;
	}
	.castLists3{
		order: 3;
		width: 140px;
	}
}
@media screen and (max-width: 767px){
	.castCont{
		flex-wrap: wrap;
	}
	.castContIn{
		width: 100%;
		justify-content: center;
		margin-left: 0;
		padding: var(--sp-size-32) 0;
	}
	.castList:not(:last-child){
		margin-left: var(--sp-size-32);
	}
}




/*StaffCast Comment*/
.commentModal{
	position: absolute;
	width:100%;
	left:0;
	top:0;
	min-height:100%;
	padding: 60px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
}
.commentModal h2{
	width:100%;
	font-size: 32px;
	font-weight: 600;
	padding-bottom: 40px;
	color: #fff;
}
.commentModal h2 div {
	width: 91.6667%;
	max-width: 1650px;
	margin:0 auto;
	padding: 0 25px;
}
.commentModal p {
	width: 91.6667%;
	max-width: 1650px;
	padding:0 25px;
}
.staff_job{
	font-size: 20px;
}
.staff_name{
	padding-left: 24px;
}
.commentModal p{
	font-size: 16px;
	line-height: 2;
}

@media screen and (max-width: 767px){
	.commentModal{
		padding: 6.4% 6.4% 10.4%;
	}
	.commentModal h2{
		font-size: var(--sp-size-48);
		padding-bottom: var(--sp-size-40);
	}
	.commentModal h2 div {
		width: 100%;
		padding: 0;
	}
	.staff_job{
		font-size: var(--sp-size-32);
	}
	.staff_name{
		padding-left: var(--sp-size-24);
	}
	.commentModal p {
		padding: 0;
	}
	.commentModal p{
		width: 100%;
		font-size: var(--sp-size-24);
	}
}


/**------------------------------------
** TOP: #BOOKS
------------------------------------**/
#book .section__contentWrap{
	min-height: min(var(--oneview_height) + 50px);
}
@-moz-document url-prefix() {
	#book .section__contentWrap{
		min-height: min(51.6667vw, 930px);
	}
}
.bookContWrap{
	display: flex;
	/* justify-content: center; */
	align-items: center;
	z-index: 2;
	padding: 80px 0;
}
.book_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/top/book/bg.jpg) no-repeat center center / cover;
	z-index: -1;
}

.bookCont{
	margin: 0 auto;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	-webkit-text-orientation: upright;
	text-orientation: upright;
}

.bookImage{
	-ms-writing-mode: unset;
	writing-mode: unset;
	-webkit-text-orientation: unset;
	text-orientation: unset;
	width: auto;
	height: min(52.9032vh, 492px); /*328px*/
	margin-left: 32px;
	position: relative;
	padding-right: 96px;
}
.bookImage img{
	width: auto;
	height: 100%;
	vertical-align: baseline;
}

.book_about{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 96px;
	writing-mode: horizontal-tb;
}
.book_about:before{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 24px;
	height: 1px;
	margin: auto 0;
	background-color: var(--color-gray);
}
.book_about__link{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 72px;
	height: 72px;
	border: 1px solid #FFF;
	border-radius: 50%;
	background-color: rgba(0,0,0,5);
	color: #FFF;
	margin: auto 0;
	transition: .3s ease;
}
.book_about__link span{
	position: absolute;
	top: 0px;
	left: 0;
	bottom: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-eng);
	font-size: 12px;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: -0.015em;
	text-align: center;
}
@media screen and (min-width: 768px){
	.book_about__link:hover{
		background-color: rgba(255,255,255,100%);
		color: #111;
	}
}


.bookTxt_catch{
	font-size: 20px;
	line-height: 1.5;
	margin-left: 1.5em;
}
.bookTxt_catch span{
	display: inline-block;
	line-height: 1;
	background-color: #000;
}
.bookTxt_catch span.kagi{
	padding-top: 0.5em;
	text-indent: -1em;
}

.book_ttl{
	font-size: 20px;
	line-height: 1.5;
	margin-left: 1.5em;
}

.book_detail{
	font-size: 14px;
	line-height: 2.1429;
}
.tate_txt__yoko{
	writing-mode: vertical-rl;
	-webkit-text-orientation: unset;
	text-orientation: unset;
}


@media screen and (max-width: 767px){
	.bookContWrap{
		padding: 22.8572% 0;
	}
	.book_bg{
		height: 100%;
		background-image: url(../img/top/book/bg_sp.jpg);
	}
	
	.bookImage{
		width: min(29.3334vw, 200px);
		height: auto;
		margin-left: var(--sp-size-26);
		padding-right: 0;
		display: flex;
	}
	.bookImage_img{
		position: relative;
		width: min(29.3334vw, 200px);
		padding-top: min(37.7334vw, 283px);
	}
	.bookImage .bookImage_img img{
		width: 100%;
		height: 100%;
		object-fit: contain;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	.book_about{
		position: relative;
		width: 100%;
		height: min(17.0667vw, 128px);
		top: unset;
		left: 0;
	}
	.book_about:before{
		width: 1px;
		right: 0;
		height: var(--sp-size-32);
		margin: 0 auto;
	}
	.book_about__link{
		width: var(--sp-size-96);
		height: var(--sp-size-96);
		top: unset;
		left: 0;
		margin: 0 auto;
	}
	.book_about__link span{
		font-size: var(--sp-size-24);
	}

	.bookTxt_catch{
		font-size: var(--sp-size-26);
		line-height: 1.4;
		margin-left: var(--sp-size-32);
		white-space: nowrap;
	}

	.book_ttl{
		font-size: var(--sp-size-24);
		margin-left: var(--sp-size-20);
		white-space: nowrap;
	}
	.book_detail{
		font-size: var(--sp-size-20);
		line-height: 1.8;
	}
	.tate_txt__yoko{
		white-space: nowrap;
	}
}


/** Footer **/
.sp_footerWrap{
	display: block;
}
.sp_footerCont{
	display: none;
}
@media screen and (max-width: 767px){

	.sp_footerWrap{
		width: 100%;
		display: block;
		/*min-height: calc(var(--oneview_height) + 50px);*/
		position: relative;
		padding: 26.8572% 0 36vw;
		background: #000;
		z-index: 2;
	}
	.sp_footerWrap img{
		width: 100%;
	}
	.sp_footerLogo{
		width: 75.4286%;
		margin: 15% auto 0;
	}
	.sp_footer_company{
		width: 42.1429%;
		margin: 25.3334% auto 0;
	}
	.sp_footer_copy{
		margin: var(--sp-size-32) auto 0;
		text-align: center;
		line-height: 2;
		font-size: var(--sp-size-20);
	}

	@-moz-document url-prefix() {
		.sp_footerWrap{
			min-height: var(--oneview_height);
		}
	}
	.sp_footerCont {
		display: block;

	}
}



/**------------------------------------
** TOP: Loading
------------------------------------**/
.tLoading{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10000;
}
.tLoadingIn{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.tLoading_bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	transition: filter 1.2s ease-in;
}
.tLoading_logo{
	width: min(45%, 810px);
	text-align: center;
	margin: auto;
	position: relative;
	z-index: 2;
	transition: filter .4s ease-in, transform 1.8s ease;
}
.tLoading_logo img{
	max-width: 100%;
	animation: tLoading_logo 1.6s cubic-bezier(.44,.3,.52,1) forwards;
}
@keyframes tLoading_logo {
	0%{transform:scale(0.98);opacity: 0;filter: blur(8px);}
	100%{transform:scale(1);opacity: 100%;filter: blur(0px);}	
}

.tLoading.-loaded .tLoading_logo{
	transform: scale(1.6);
	filter: blur(12px);
}
@media screen and (min-width: 768px){
	.tLoading.-loaded .tLoading_bg{
		filter: blur(100px);
	}
}

@media screen and (max-width: 767px){
	.tLoading_logo{
		width: 60%;
	}
}
.mvtk {
	padding:50px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
/*	height:320px;*/
	background:url(../img/top/movie/bg.jpg) no-repeat right top / cover;
}
.mvtk__bnr {
	width:100%;
	margin:0 0 30px;
}
.mvtk__bnr a {
	display: block;
	margin:0 auto;
	width:640px;
}
.mvtk__bnr img {
	display: block;
	width:100%;
	height:auto;
}
@media screen and (max-width:767px){
	.mvtk {
		padding:6.4vw 0;
		background:unset;
		height:auto;
	}
	.mvtk__bnr {
		margin:0 0 4vw;
	}
	.mvtk__bnr a {
		width:92%;
	}
}


/**------------------------------------
** TOP: #CHARACTER
------------------------------------**/
#character .section__contentWrap{
	min-height: min(var(--oneview_height) + 50px);
}
@-moz-document url-prefix() {
	#character .section__contentWrap{
		min-height: min(51.6667vw, 930px);
	}
}
.character_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/top/character/bg.jpg) no-repeat center center / cover;
	z-index: -1;
}
#character .cont_h2{
	width: 200%;
}
.characterContWrap{
	display: flex;
	/* justify-content: center; */
	align-items: center;
	z-index: 2;
	padding: 60px 0;
}
.characterContentIn{
	width: 100%;
	padding: 0 calc(72px + 1.7392%);
}

.characterLists{
	width: 100%;
	max-width: 1546px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.characterList{
	width: calc(20% - 8px);
	height: clamp(140px, 21.875vh, 11.6667vw);
	max-height: 224px;
	overflow: hidden;
	position: relative;
}
.characterList.-main{
	width: calc(100% / 3 - 20px / 3);
	height: min(37.5vh, 20vw);
}
.characterList .btn_charamodal{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.characterList .btn_charamodal img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s ease;
}
.characterList .btn_charamodal:hover img{
	transform: scale(1.15) rotate(2deg);
}

@media screen and (max-width: 767px){
	.character_bg{
		background-image: url(../img/top/character/bg_sp.jpg);
	}
	.characterContWrap{
		padding: 22.8572% 0;
	}
	.characterContentIn{
		padding: 0 min(8.8572%, 62px);
	}
	.characterLists{
		gap: var(--sp-size-10);
	}
	.characterList{
		width: calc(100% / 3 - var(--sp-size-20) / 3);
		height: min(11.4vh, min(15.2vw, 114px));
	}
	.characterList.-main{
		width: calc(100% / 3 - var(--sp-size-20) / 3);
		height: min(32vw, 240px);
	}
}


/* character_modal */
.modalBox.-charaModal{
	-webkit-backdrop-filter: unset;
	backdrop-filter: unset;
	background: url(../img/top/character/bg.jpg) no-repeat center center / cover;
}
.charaModal{
	position: absolute;
	width:100%;
	left:0;
	top:0;
	min-height:100%;
	padding: 60px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
}
.charaModalIn{
	width: 100%;
	max-width: 780px;
	padding: 40px;
	margin: 0 auto;
}
.charaModal_cDetail{
	display: flex;
	justify-content: space-between;
}
.charaModal_cDetail_txt{
	flex-shrink: 0;
	order: -1;
	writing-mode: vertical-rl;
    -webkit-text-orientation: upright;
    text-orientation: upright;
	height: 310px;
	letter-spacing: 0.25em;
}
.charaModal_cDetail_txt h2{
	font-size: 32px;
	font-weight: 700;
	padding-left: 10px;
	letter-spacing: 0.45em;
}
.charaModal_cDetail_txt h2 .cv{
	font-size: 50%;
	letter-spacing: 0.25em;
}
.charaModal_cDetail_txt p{
	font-size: 14px;
	line-height: 2.2;
}
.charaModal_cDetail_cimg{
	width: 75.7143%;
	padding-left: 5.7143%;
}
.charaModal_cDetail_cimg img{
	width: 100%;
}

.charaModal_vDetail{
	width: 100%;
	padding-top: 40px;
}
.charaModal_vDetail h2{
	font-size: 24px;
	font-weight: 700;
}
.charaModal_vDetail_cv{
	display: inline-block;
	padding-right: 24px;
}
.charaModal_vDetail_chara{
	display: inline-block;
	padding-left: 24px;
	font-size: 16px;
}
.charaModal_vDetail p{
	padding-top: 20px;
	font-size: 14px;
	line-height: 2.2;
	letter-spacing: 0;
}

@media screen and (max-width: 767px){
	.modalBox.-charaModal{
		background-image: url(../img/top/character/bg_sp.jpg);
	}
	.charaModalIn{
		padding: var(--sp-size-50) var(--sp-size-40);
		max-width: 100%;
	}
	.charaModal_cDetail_txt{
		height: min(52vw, 390px);
	}
	.charaModal_cDetail_txt h2{
		font-size: var(--sp-size-32);
		padding-left: var(--sp-size-10);
	}
	.charaModal_cDetail_txt h2 .cv{
		font-size: var(--sp-size-20);
	}
	.charaModal_cDetail_txt p{
		font-size: var(--sp-size-20);
	}
	.charaModal_cDetail_cimg{
		width: 62.6866%;
		padding-left: 2.9581%;
	}
	.charaModal_vDetail{
		padding-top: var(--sp-size-50);
	}
	.charaModal_vDetail h2{
		font-size: var(--sp-size-24);
	}
	.charaModal_vDetail_cv{
		padding-right: var(--sp-size-26);
	}
	.charaModal_vDetail_chara{
		padding-left: var(--sp-size-24);
		font-size: var(--sp-size-20);
	}
	.charaModal_vDetail p{
		padding-top: var(--sp-size-20);
		font-size: var(--sp-size-20);
	}

	.charaModal.-p2 .charaModalIn{
		padding: var(--sp-size-50);
	}
	.charaModal.-p2 .charaModal_cDetail{
		flex-direction: column;
		justify-content: center;
	}
	.charaModal.-p2 .charaModal_cDetail_txt{
		order: 2;
		padding-top: 56px;
		display: flex;
		align-items: center;
	}
	.charaModal.-p2 .charaModal_cDetail_cimg{
		width: 66.6667%;
		margin: 0 auto;
		padding: 0;
	}
}


/**------------------------------------
** TOP: #voiceup
------------------------------------**/
#voiceup .cont_h2{
	width: 200%;
}
.voiceupWrap{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.voiceupCont{
	width: 50%;
	max-width: 530px;
	height: 100%;
	margin-left: auto;
	margin-right: 48px;
	padding-top: 64px;
	padding-bottom: 40px;
	display: flex;
	flex-direction: column;
}
.voiceupCont_ttl{
	flex-shrink: 0;
	width: 393px;
	margin: 0 auto;
	padding-bottom: 16px;
}
.voiceupCont_ttl img{
	width: 100%;
}

.voiceupWrap iframe{
	width: 536px;
	max-width: 100%;
	height: 100%;
	margin: auto;
	background-color: #FFF;
	border: 4px solid #f28d8d;
}

.voiceupCont_link{
	flex-shrink: 0;
	padding-top: 24px;
	text-align: center;
}
.voiceupCont_link a{
	display: inline-block;
	padding: 12px 36px;
	line-height: 1;
	font-size: 20px;
	font-weight: 500;
	color: #FFF;
	text-decoration: none;
	border-radius: 30px;
	background-color: #f28d8d;
}

.voiceupBanners{
	position: absolute;
	bottom: 108px;
	left: 92px;
	right: calc(min(50%,530px) + 68px);
}
.voiceupBannerLists{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.voiceupBannerLists li{
	width: 156px;
	padding: 4px;
}
.voiceupBannerLists li a{
	display: block;
	width: 100%;
}
.voiceupBannerLists li a img{
	width: 100%;
}

@media screen and (max-width: 767px){
	.voiceupWrap{
		display: flex;
		flex-direction: column;
	}
	.voiceupCont{
		width: 82.9334%; /* 628 */
		padding-top: min(21.3334%, 160px);
		padding-bottom: var(--sp-size-20);
		margin-right: auto;
		margin-left: auto;
	}
	.voiceupCont_ttl{
		width: min(88.6943%, 557px);
		padding-bottom: var(--sp-size-24);
	}

	.voiceupWrap iframe{
		width: 100%;
		border-width: var(--sp-size-4);
	}
	.voiceupCont_link{
		padding-top: var(--sp-size-20);
	}
	.voiceupCont_link a{
		padding: var(--sp-size-24) var(--sp-size-40);
		font-size: var(--sp-size-32);
		color: #f28d8d;
		background-color: #FFF;
	}
	
	.voiceupBanners{
		flex-shrink: 0;
		position: relative;
		left: 0;
		right: 0;
		bottom: unset;
		width: 100%;
		padding-bottom: min(21.3334%, 160px);
	}
	.voiceupBannerLists{
		justify-content: center;
	}
	.voiceupBannerLists li{
		width: min(24.5334%, 184px);
	}
}

.voiceup_bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/top/voiceup/bg.jpg) no-repeat left center / cover;
	z-index: -1;
}
.voiceup_bg:after{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border: 15px solid #f28d8d;
}

@media screen and (max-width: 767px){
	.voiceup_bg{
		background: #f28d8d;
	}
	.voiceup_bg:before{
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		padding-top: 86.7143%;
		background: url(../img/top/voiceup/bg_sp.jpg) no-repeat left top / cover;
	}
	.voiceup_bg:after{
		border-width: var(--sp-size-16);
	}
}