@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,p,h1,h2,h3,h4,h5,h6,th,td,pre,code,blockquote,form,fieldset,legend,input,textarea,figcaption,figure{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#FFF}hr{display:none}img{vertical-align:bottom}select,input,button,textarea{font-size:99%}table{font-size:inherit;font:100%;border-collapse:collapse;border-spacing:0}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}.hd{display:block;width:0;height:0;overflow:hidden}.cf:before,.cf:after{content:"";display:table}.cf:after{clear:both}.cf{*zoom:1}article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section,main{display:block}*{margin:0;padding:0;box-sizing:border-box;max-height:999999px;outline:none;}*:focus{outline:none;}button{background-color:transparent;border:none;cursor:pointer;outline:none;padding:0;}
:root{
	/* font */
	--font-eng-work: 'Work Sans', sans-serif;
	--font-eng-wall: 'Wallpoet', sans-serif;
	--font-ja-sans: 'Noto Sans JP', sans-serif;

	/* color */
	--color-lightblue: #5ec5b9;

	/* sp-size */
	--sp-size-2: min(0.2667vw, 2px);
	--sp-size-4: min(0.5334vw, 4px);
	--sp-size-6: min(0.8vw, 6px);
	--sp-size-8: min(1.0667vw, 8px);
	--sp-size-10: min(1.3334vw, 10px);
	--sp-size-12: min(1.6vw, 12px);
	--sp-size-16: min(2.1334vw, 16px);
	--sp-size-20: min(2.6667vw, 20px);
	--sp-size-24: min(3.2vw, 24px);
	--sp-size-26: min(3.4667vw, 26px);
	--sp-size-28: min(3.7334vw, 28px);
	--sp-size-30: min(4vw, 30px);
	--sp-size-32: min(4.2667vw, 32px);
	--sp-size-36: min(4.8vw, 36px);
	--sp-size-40: min(5.3334vw, 40px);
	--sp-size-48: min(6.4vw, 48px);
	--sp-size-56: min(7.4667vw, 56px);
	--sp-size-64: min(8.5334vw, 64px);
	--sp-size-72: min(9.6vw, 72px);
	--sp-size-80: min(10.6667vw, 80px);
	--sp-size-96: min(12.8vw, 96px);
	--sp-size-192: min(25.6vw, 192px);

	/* max-zoom */
	--max-zoom: 1.25;
}
body{
	-webkit-text-size-adjust:100%;
	background-color:#000;
	color:#fff;
	font-family:'Noto Serif JP', serif;
	font-size:16px;
	font-weight:normal;
	letter-spacing:0.025em;
	line-height:2;
	word-break:break-all;
}
a{color:#fff;}
a:hover{text-decoration:none;}
.ah{transition:opacity .3s ease;}
.ah:hover{opacity:.7;}
::selection{
	background:#000;
	color:#fff;
}
::-moz-selection{
	background:#000;
	color:#fff;
}
@media screen and (max-width:768px){
	html{
		font-size:62.5%;
		height:-webkit-fill-available;
	}
	body{
		font-size:10px;
		font-size:1rem;
		min-width:320px;
		min-height:100vh;
		min-height:-webkit-fill-available;
	}
	.pc{display:none;}
	.ah:hover{opacity:1;}
}
@media screen and (min-width:769px){
	.sp{display:none;}
	::-webkit-scrollbar{
		width:8px;
		height:8px;
	}
	::-webkit-scrollbar-track{
		border-radius:0px;
		background:#000;
	}
	::-webkit-scrollbar-thumb{
		background:#FFF;
		border-radius:0px;
		margin:2px;
		box-shadow:none;
	}
}
.ro{
	font-family: 'Work Sans', sans-serif;
}
.general__btn{
	width:320px;
	height:64px;
	margin:0 auto;
}
.general__btn a,
.general__btn_link{
	display:block;
	height:64px;
	position:relative;
	border:1px solid rgba(255,255,255,.4);
	text-decoration:none;
}
.general__btn a:before,
.general__btn_link:before{
	content:'';
	position:absolute;
	left:-1px;
	top:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-left:1px solid #FFF;
	border-top:1px solid #FFF;
	transition:all 0.3s ease;
}
.general__btn a:after,
.general__btn_link:after{
	content:'';
	position:absolute;
	right:-1px;
	bottom:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-right:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transition:all 0.3s ease;
}
.general__btn a strong,
.general__btn_link strong{
	font-weight:400;
	display:block;
	height:62px;
	position:relative;
}
.general__btn a span:before,
.general__btn_link span:before{
	content:'';
	position:absolute;
	right:-1px;
	top:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-right:1px solid #FFF;
	border-top:1px solid #FFF;
	transition:all 0.3s ease;
}
.general__btn a span:after,
.general__btn_link span:after{
	content:'';
	position:absolute;
	left:-1px;
	bottom:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-left:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transition:all 0.3s ease;
}
.general__btn a span,
.general__btn_link span{
	display:flex;
	height:62px;
	justify-content:center;
	align-items:center;
	font-size:16px;
	position:relative;
	line-height:1;
	padding-top:2px;
}
.general__btn a strong:before,
.general__btn_link strong:before{
	content:'';
	position:absolute;
	right:-40px;
	top:50%;
	height:1px;
	width:60px;
	background:#FFF;
	transition:all 0.3s ease;
}
.general__btn a:hover:before,
.general__btn a:hover:after,
.general__btn_link:hover::before,
.general__btn_link:hover::after{
	width:100%;
}
.general__btn a:hover span:before,
.general__btn a:hover span:after,
.general__btn_link:hover span:before,
.general__btn_link:hover span:after{
	height:100%;
}
.general__btn a:hover strong:before,
.general__btn_link:hover strong:before{
	transform:translateX(10px);
}
@media screen and (max-width:768px){
	.general__btn{
		width:68.2666vw;
		height:12.8vw;
	}
	.general__btn a,
	.general__btn_link{
		height:12.8vw;
	}
	.general__btn a:before,
	.general__btn_link::before{
		width:2.1333vw;
		height:2.1333vw;
	}
	.general__btn a:after,
	.general__btn_link:after{
		width:2.1333vw;
		height:2.1333vw;
	}
	.general__btn a strong,
	.general__btn_link strong{
		height:calc(12.8vw - 2px);
	}
	.general__btn a span:before,
	.general__btn_link span:before{
		width:2.1333vw;
		height:2.1333vw;
	}
	.general__btn a span:after,
	.general__btn_link span:after{
		width:2.1333vw;
		height:2.1333vw;
	}
	.general__btn a span,
	.general__btn_link span{
		height:calc(12.8vw - 2px);
		font-size:1.2rem;
	}
	.general__btn a strong:before,
	.general__btn_link strong:before{
		right:-6.4vw;
		width:9.6vw;
	}
}
.footer{
	height:100vh;
	min-height:640px;
	background:rgba(0,0,0,.8);
	position:relative;
	z-index:6;
	display:flex;
	justify-content:space-between;
	flex-direction:column;
	padding:80px 160px;
	min-width:1200px;
}
.footer__bnrs{
	display:flex;
	justify-content:center;
}
.footer__bnrs li{
	margin:0 20px 40px;
	max-width: 240px;
}
.footer__bnrs li img {
	width:100%;
	height:auto;
}
.footer__aniplex{
	text-align:center;
	margin-bottom:40px;
}
.footer__aniplex img{
	width:140px;
	height:auto;
}
.footer__caution{
	text-align:center;
	font-size:12px;
	color:rgba(255,255,255,.4);
	line-height:1;
	margin-bottom:40px;
}
.footer__links{
	display:flex;
	justify-content:center;
	margin-bottom:80px;
}
.footer__links li{
	padding:0 30px;
	position:relative;
	height:16px;
}
.footer__links li:not(:last-child):after{
	content:'';
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	width:1px;
	background:rgba(255,255,255,.4);
}
.footer__links li a{
	text-decoration:none;
	display:block;
	line-height:1.3333;
	font-size:12px;
}
.footer__links li a:hover{
	text-decoration:underline;
}
.footer__copyright{
	font-size:12px;
	line-height:1;
	color:rgba(255,255,255,.4);
	text-align:center;
}
.footer__share{
	position:absolute;
	left:29px;
	top:50%;
	margin-top:-124px;
	width:62px;
}
.footer__share dt{
	height:62px;
	display:flex;
	width:100%;
	justify-content:center;
	align-items:center;
	font-size:14px;
}
.footer__share dd{
	height:62px;
}
.footer__share dd a{
	display:block;
	height:62px;
	position:relative;
}
.footer__share dd a:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	box-sizing:border-box;
	width:8px;
	height:8px;
	border-left:1px solid #FFF;
	border-top:1px solid #FFF;
	transform:translate(27px,27px);
	opacity:0;
	transition:all 0.3s ease;
}
.footer__share dd a:after{
	content:'';
	position:absolute;
	right:0;
	bottom:0;
	box-sizing:border-box;
	width:8px;
	height:8px;
	border-right:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transform:translate(-27px,-27px);
	opacity:0;
	transition:all 0.3s ease;
}
.footer__share dd a:hover:before,
.footer__share dd a:hover:after{
	transform:translate(0,0);
	opacity:1;
}
.footer__share--twitter{
	background:url(../img/common/sns_tw_w.svg) no-repeat center center / 20px auto;
}
.footer__share--facebook{
	background:url(../img/common/sns_fb_w.svg) no-repeat center center / 20px auto;
}
.footer__share--line{
	background:url(../img/common/sns_line_w.svg) no-repeat center center / 20px auto;
}
.footer__totop{
	position:absolute;
	right:40px;
	top:40px;
	width:120px;
	height:120px;
	border:1px solid rgba(255,255,255,.4);
	border-radius:50%;
}
.footer__totop:before{
	content:'';
	position:absolute;
	top:-40px;
	height:60px;
	width:1px;
	left:50%;
	background:#FFF;
	transition:all 0.3s ease;
}
.footer__totop a{
	display:flex;
	text-decoration:none;
	justify-content:center;
	align-items:center;
	font-size:14px;
	height:120px;
	position:relative;
	z-index:10;
	text-align: center;
	padding-top:10px;
}
.totop-circle{
	position:absolute;
	left:-1px;
	width:120px;
	top:0px;
	height:120px;
	display:block;
	transform:rotate(-90deg);
}
.totop-circle circle{
	fill:transparent;
	stroke:#FFF;
	stroke-width:1px;
	stroke-dasharray:0 400;
	transition:all 0.3s ease;
}
.footer__totop:hover:before{
	transform:translateY(-10px);
}
.footer__totop:hover .totop-circle circle{
	stroke-dasharray:400 400;
}
@media screen and (max-width:768px){
	.footer{
		height:auto;
		min-height:1px;
		display:block;
		padding:32vw 3.2vw 12.8vw;
		min-width:1px;
	}
	.footer__bnrs{
		flex-wrap:wrap;
		margin-bottom:6.4vw;
	}
	.footer__bnrs li{
		width:50%;
		max-width: 50%;
		margin:0;
		padding:0 3.2vw 6.4vw;
	}
	.footer__bnrs li img{
		width:100%;
		height:auto;
	}
	.footer__aniplex{
		text-align:center;
		margin-bottom:6vw;
	}
	.footer__aniplex img{
		width:33.8666vw;
		height:auto;
	}
	.footer__caution{
		font-size:1rem;
		color:rgba(255,255,255,.4);
		line-height:2;
		margin-bottom:6vw;
	}
	.footer__links{
		margin-bottom:12.8vw;
	}
	.footer__links li{
		padding:0 3.5vw;
		height:1rem;
	}
	.footer__links li a{
		line-height:1;
		font-size:1rem;
	}
	.footer__copyright{
		font-size:1rem;
	}
	.footer__share{
		left:6.4vw;
		top:9.6vw;
		margin-top:0;
		width:51.2vw;
		display:flex;
	}
	.footer__share dt{
		height:12.8vw;
		width:12.8vw;
		font-size:1.4rem;
		justify-content:flex-start;
	}
	.footer__share dd{
		height:12.8vw;
		width:12.8vw;
	}
	.footer__share dd a{
		height:12.8vw;
	}
	.footer__share--twitter{
		background-size:5.3333vw auto;
	}
	.footer__share--facebook{
		background-size:5.3333vw auto;
	}
	.footer__share--line{
		background-size:5.3333vw auto;
	}
	.footer__totop{
		position:absolute;
		right:3.2vw;
		top:6.4vw;
		width:16vw;
		height:16vw;
		border-radius:50%;
	}
	.footer__totop:before{
		top:-6.4vw;
		height:8vw;
	}
	.footer__totop a{
		font-size:1rem;
		height:16vw;
		text-align:center;
		line-height:1.6;
		padding-top:2vw;
	}
	.totop-circle{
		display:none;
	}
}
.sub__logo{
	position:absolute;
	left:10px;
	right:10px;
	height:63px;
	top:50px;
	display:flex;
	justify-content:center;
	z-index:30;
}
.sub__logo a{
	display:block;
	height:75px;
	width:450px;
	background:url(../img/common/logo_horizontal.svg) no-repeat center center / contain;
	transform:translateX(30px);
	opacity:0;
}
.sub__logo.-b a{
	background-image: url(../img/common/logo_horizontal_black.svg);
}
.c .sub__logo a{
	transform:translateX(0);
	opacity:1;
	transition:all 0.3s;
	transition-delay:0.9s;
}
@media screen and (max-width:768px){
	.sub__logo{
		position:absolute;
		left:0;
		right:0;
		top: 0;
		width: min(53.3334%, 400px);
		padding-top: min(8.5334%, 64px);
		margin-top: 12.8%;
		height: auto;
		display: block;
		margin-left: auto;
		margin-right: auto;
		z-index:30;
		overflow: hidden;
	}
	.sub__logo a{
		position: absolute;
		top: 0;
		left: 0;
		height:100%;
		width:100%;
		transform:translateX(30px);
	}
}
.paging__nav{
	position:relative;
	min-height:48px;
	margin-bottom:56px;
}
.paging__nav--prev{
	width:120px;
	height:48px;
	position:absolute;
	left:0;
	top:0;
}
.paging__nav--next{
	width:120px;
	height:48px;
	position:absolute;
	right:0;
	top:0;
}
.paging__nav a{
	display:block;
	height:48px;
	border:1px solid rgba(255,255,255,.4);
	position:relative;
	text-decoration:none;
}
.paging__nav a.active{
	pointer-events:none;
}
.paging__nav a strong{
	display:block;
	font-weight:400;
	height:46px;
	position:relative;
}
.paging__nav a span{
	display:flex;
	height:46px;
	justify-content:center;
	align-items:center;
	position:relative;
	padding-top:2px;
}
.paging__nav a:before{
	content:'';
	position:absolute;
	left:-1px;
	top:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-left:1px solid #FFF;
	border-top:1px solid #FFF;
	transition:all 0.3s ease;
}
.paging__nav a:after{
	content:'';
	position:absolute;
	right:-1px;
	bottom:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-right:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transition:all 0.3s ease;
}
.paging__nav a span:before{
	content:'';
	position:absolute;
	right:-1px;
	top:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-right:1px solid #FFF;
	border-top:1px solid #FFF;
	transition:all 0.3s ease;
}
.paging__nav a span:after{
	content:'';
	position:absolute;
	left:-1px;
	bottom:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-left:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transition:all 0.3s ease;
}
.paging__nav--prev a strong:before{
	content:'';
	position:absolute;
	left:-40px;
	top:50%;
	height:1px;
	width:60px;
	background:#FFF;
	transition:all 0.3s ease;
}
.paging__nav--next a strong:before{
	content:'';
	position:absolute;
	right:-40px;
	top:50%;
	height:1px;
	width:60px;
	background:#FFF;
	transition:all 0.3s ease;
}
.paging__nav a:hover:before,
.paging__nav a:hover:after,
.paging__nav a.active:before,
.paging__nav a.active:after{
	width:100%;
}
.paging__nav a span:hover:before,
.paging__nav a span:hover:after,
.paging__nav a.active span:before,
.paging__nav a.active span:after{
	height:100%;
}

.paging__nav--next a:hover strong:before{
	transform:translateX(10px);
}
.paging__nav--prev a:hover strong:before{
	transform:translateX(-10px);
}
.paging__nav--lists{
	display:flex;
	justify-content:center;
	flex-wrap: wrap;
	padding:0 140px;
}
.paging__nav--lists li{
	width:48px;
	margin:0 12px 24px;
}
@media screen and (max-width:768px){
	.paging__nav{
		position:relative;
		min-height:25.6vw;
		margin-bottom:0;
	}
	.paging__nav--prev{
		width:26.6666vw;
		height:9.6vw;
		left:6.4vw;
	}
	.paging__nav--next{
		width:26.6666vw;
		height:9.6vw;
		right:6.4vw;
	}
	.paging__nav a{
		display:block;
		height:9.6vw;
		font-size:1.2rem;
	}
	.paging__nav a strong{
		height:calc(9.6vw - 2px);
	}
	.paging__nav a span{
		height:calc(9.6vw - 2px);
		padding-top:0;
	}
	.paging__nav a:before,
	.paging__nav a:after,
	.paging__nav a span:before,
	.paging__nav a span:after{
		width:2.1333vw;
		height:2.1333vw;
	}
	.paging__nav--prev a strong:before{
		left:-6.4vw;
		width:9.6vw;
	}
	.paging__nav--next a strong:before{
		right:-6.4vw;
		width:9.6vw;
	}
	.paging__nav--lists{
		padding:16vw 0 0;
	}
	.paging__nav--lists li{
		width:9.6vw;
		margin:0 1.6vw 6.6666vw;
	}
}
#movieWrap{
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
	top:50vh;
	pointer-events:none;
	min-width:1200px;
}
#sub #movieWrap{
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
	top:0;
	pointer-events:none;
}
.movieWrap__box{
	width:100%;
	height:100vh;
	position:sticky;
	left:0;
	top:0;
	display:flex;
	justify-content:center;
	align-items:center;
	overflow:hidden;
}
.movieWrap__box--inner{
	flex-shrink:0;

}
.movieWrap__box--inner {
	position: relative;
}

.movieWrap__box--yt{
	width:calc(100% + 200px);
	height:calc(100% + 200px);
	margin:-100px -100px;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:768px){
	#movieWrap{
		top:75vh;
		min-width:320px;
	}
	.movieWrap__box--yt{
		transform:scale(1.2);
	}
}
.backto__list{
	width:200px;
	height:48px;
	margin:0 auto 60px;
}
.backto__list a{
	display:block;
	height:48px;
	position:relative;
	border:1px solid rgba(255,255,255,.4);
	text-decoration:none;
}
.backto__list a:before{
	content:'';
	position:absolute;
	left:-1px;
	top:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-left:1px solid #FFF;
	border-top:1px solid #FFF;
	transition:all 0.3s ease;
}
.backto__list a:after{
	content:'';
	position:absolute;
	right:-1px;
	bottom:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-right:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transition:all 0.3s ease;
}
.backto__list a strong{
	font-weight:400;
	display:block;
	height:46px;
	position:relative;
}
.backto__list a span:before{
	content:'';
	position:absolute;
	right:-1px;
	top:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-right:1px solid #FFF;
	border-top:1px solid #FFF;
	transition:all 0.3s ease;
}
.backto__list a span:after{
	content:'';
	position:absolute;
	left:-1px;
	bottom:-1px;
	width:8px;
	height:8px;
	box-sizing:border-box;
	border-left:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transition:all 0.3s ease;
}
.backto__list a span{
	display:flex;
	height:46px;
	justify-content:center;
	align-items:center;
	font-size:16px;
	position:relative;
	line-height:1;
	padding-top:2px;
}
.backto__list a strong:before{
	content:'';
	position:absolute;
	left:-40px;
	top:50%;
	height:1px;
	width:60px;
	background:#FFF;
	transition:all 0.3s ease;
}
.backto__list a:hover:before,
.backto__list a:hover:after{
	width:100%;
}
.backto__list a span:hover:before,
.backto__list a span:hover:after{
	height:100%;
}
.backto__list a:hover strong:before{
	transform:translateX(-10px);
}
@media screen and (max-width:768px){
	.backto__list{
		width:44vw;
		height:9.6vw;
		left:6.4vw;
		margin-bottom:9.6vw;
	}
	.backto__list a{
		display:block;
		height:9.6vw;
	}
	.backto__list a strong{
		height:calc(9.6vw - 2px);
	}
	.backto__list a span{
		height:calc(9.6vw - 2px);
		padding-top:0;
		font-size:1.2rem;
	}
	.backto__list a:before,
	.backto__list a:after,
	.backto__list a span:before,
	.backto__list a span:after{
		width:2.1333vw;
		height:2.1333vw;
	}
	.backto__list a strong:before{
		left:-6.4vw;
		width:9.6vw;
	}
}

/**
 * header
 */
.header {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 999;
}
@media screen and (min-width:769px){
	.header {
		transition: opacity .4s ease-in-out;
	}
	.header.is-hide {
		pointer-events: none;
		opacity: 0;
	}
}

.header {
	width: 100%;
	top: 0;
	left: 0;
}

/* bg */
/* .header:before {
	content: "";
	background-color: rgba(0,0,0,.8);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	position: fixed;
	width: 74.4%;
	height: 100%;
	top: 0;
	right: 0;
	z-index: 0;
	transform: translateX(100%);
	transition: transform .6s cubic-bezier(0.25, 1, 0.5, 1);
}
.header.is-active:before {
	transform: translateX(0);
} */

/* inner */
.header .header__inner {
	-webkit-overflow-scrolling: touch;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overscroll-behavior: contain;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 1;
	opacity: 0;
	pointer-events: none;
	transition: opacity .6s cubic-bezier(0.25, 1, 0.5, 1);
}
.header.is-active .header__inner {
	opacity: 1;
	pointer-events: auto;
}

.header .headerNav {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}
.header .headerNav__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: auto;
	min-height: 100%;
	margin: 0 auto;
}
.header .headerNav__cont {
	width: 100%;
	min-height: 100vh;
	padding: 160px 0;
	padding-right: 80px;
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
}
.header .header__logo{
	position: absolute;
	bottom: 0;
	left: 0;
	width: min(33.3334%, 400px);
	height: 63px;
	margin-left: min(3.3334%, 40px);
	margin-bottom: min(3.3334%, 40px);
}
.header .header__logo_link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
}
.header .header__logo_link img{
	object-fit: contain;
	object-position: left bottom;
}

@media screen and (max-width: 767px){
	.header .headerNav__cont{
		padding: min(28.8%, 216px) min(12.8%, 96px);
	}
	.header .header__logo{
		right: 0;
		bottom: unset;
		top: 0;
		margin-top: 12.8%;
		margin-left: auto;
		margin-right: auto;
		width: min(53.3334%, 400px);
		padding-top: min(8.5334%, 64px);
		height: auto;
	}
	.header .header__logo_link img{
		object-position: center;
	}
}



/* headerNavLists */
.headerNavLists__item:not(:first-child) {
	margin-top: 0.4em;
}
.headerNavLists__item > a {
	display: flex;
	justify-content: flex-end;
	font-size: 16px;
	position: relative;
	text-decoration: none;
	line-height:1.25;
	padding:5px 40px 5px 0;
	text-align: right
}
.headerNavLists__item > a:after {
	content: "";
	background-color: #fff;
	width: 0;
	height: 1px;
	margin: auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
}
.headerNavLists__text {
	position: relative;
}
@media screen and (max-width:768px){
	.headerNavLists__item:not(:first-child) {
		margin-top: 0.8em;
	}
	.headerNavLists__item > a {
		font-size: 4.26666vw;
		padding-right: 10.66666vw;
	}
}

/* blank */
.headerNavLists__item > a.is-blank .headerNavLists__text:after {
	content: "";
	background-color: #fff;
	display: block;
	-webkit-mask: url(../img/common/icon_blank.svg) no-repeat center / contain;
	mask: url(../img/common/icon_blank.svg) no-repeat center / contain;
	width: 16px;
	height: 12px;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	right: -1.4em;
}
@media screen and (max-width:768px){
	.headerNavLists__item > a.is-blank .headerNavLists__text:after {
		width: 4.26666vw;
		height: 3.2vw;
	}
}

/* hover, is-active */
.headerNavLists__item > a {
	color: #fff;
	transition: color .3s ease-in-out;
}
.headerNavLists__item > a:is(:hover, .is-active) {
	color: #5ec5b9;
}
.headerNavLists__item > a.is-blank .headerNavLists__text:after {
	transition: background-color .3s ease-in-out;
}
.headerNavLists__item > a.is-blank:is(:hover, .is-active) .headerNavLists__text:after {
	background-color: #5ec5b9;
}
.headerNavLists__item > a:after {
	transition: width .3s ease-in-out;
}
.theader .headerNavLists__item > a:is(:hover, .is-active):after {
	width: 40px;
	background-color: var(--color-lightblue);
}
.headerNavLists__item > a.is-blank:after {
	width: 0;
}
.headerNavLists__text {
	transition: transform .3s ease-in-out;
}
.theader .headerNavLists__item > a:is(:hover, .is-active) .headerNavLists__text {
	transform: translateX(-1em);
}
.theader .headerNavLists__item > a.is-blank:is(:hover, .is-active) .headerNavLists__text {
	transform: translateX(0);
}

/* add */
.header .headerNavLists{
	width: 640px;
	display: flex;
	flex-wrap: wrap;
	margin-left: auto;
}
.header .headerNavLists.-snsLists{
	margin-top: auto;
	justify-content: flex-end;
}
.header .headerNavLists__item{
	width: 50%;
	padding-top: 20px;
	padding-right: 56px;
	padding-bottom: 20px;
	display: flex;
	justify-content: flex-end;
}
.header .headerNavLists__link{
	display: inline-flex;
	align-items: flex-end;
	position: relative;
	padding-right: 0;
	font-size: 28px;
	line-height: 0.71429;
	padding-bottom: 1px;
}
.headerNavLists__linkIn{
	display: inline-flex;
	align-items: flex-start;
	position: relative;
}
.header .headerNavLists__text{
	padding-right: 12px;
	flex-shrink: 0;
	position: relative;
}
.header .headerNavLists__item > a.is-blank .headerNavLists__text{
	padding-right: 24px;
}
.header .headerNavLists__item > a.is-blank .headerNavLists__text::after{
	right: 0;
}
.header .headerNavLists__num{
	order: 1;
	font-size: 10px;
	letter-spacing: 0;
	line-height: 0.71429;
}

.header .headerNavLists__link:after{
	top: unset;
	width: 8px;
}
.header .headerNavLists__item.is-ani > a:is(:hover, .is-active):after {
	width: 100%;
	background-color: var(--color-lightblue);
}

/* line-2 */
.header .headerNavLists__link.-line-2{
	padding-bottom: 0;
}
.header .headerNavLists__link.-line-2 .headerNavLists__text{
	display: inline-block;
	line-height: 0.8;
}
@media screen and (min-width: 769px){
	.header .headerNavLists__link.-line-2 .headerNavLists__text{
		line-height: 1;
	}
	.header .headerNavLists__link.-line-2:after{
		bottom: 3px;
	}
}

@media screen and (max-width: 768px){
	.header .headerNavLists{
		width: 100%;
		flex-direction: column;
	}
	.header .headerNavLists__item{
		width: 100%;
		padding-right: 0;
		padding-top: var(--sp-size-40);
		padding-bottom: var(--sp-size-40);
	}
	.header .headerNavLists__link{
		font-size: var(--sp-size-56);
	}
	.header .headerNavLists__text{
		padding-right: var(--sp-size-24);
	}
	.header .headerNavLists__item > a.is-blank .headerNavLists__text{
		padding-right: var(--sp-size-48);
	}
	.header .headerNavLists__num{
		font-size: var(--sp-size-24);
	}
	.header .headerNavLists__link:after{
		width: var(--sp-size-16);
	}
}


/* animation */
.header .headerNavLists__text {
	opacity: 0;
	transform: translateX(20px);
	transition: opacity .4s ease, transform .4s ease;
}
.header .headerNavLists__item.is-ani .headerNavLists__text {
	opacity: 1;
	transform: translateX(0);
}

@media screen and (max-width:768px){
	.header .headerNavLists__text {
		transform: translateX(30%);
	}
}

/* navBtn */
.navBtnWrap {
	width: 80px;
	height: 80px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
}
.navBtn {
	background-color: #000;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	height: 100%;
	position: relative;
	text-decoration: none;
	transition: background-color .3s ease;
}
.navBtn.is-active {
	background-color: #5ec5b9;
}
.navBtn__lineWrap {
	width: 50%;
	height: 15%; /* 12px */
	margin-top: 0;
	position: relative;
	z-index: 1;
}
.navBtn--line {
	background-color: #FFF;
	display: block;
	width: 100%;
	height: 16.6667%;
	margin: auto;
	position: absolute;
	transition: all .3s ease-in-out;
}
.navBtn--line:nth-child(1) {
	top: 0;
	bottom: 100%;
}
.navBtn--line:nth-child(2) {
	bottom: 0;
	top: 100%;
}
.navBtn:after {
	content: "MENU";
	color: #FFF;
	font-size: 14px;
	letter-spacing: 0.01em;
	line-height: 0.71429;
	margin-top: 22.5%;/* 18px */
	transition: all .3s ease-in-out;
}

.navBtn_bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.navBtn_bgline{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #FFF;
	opacity: 40%;
	transition: .3s ease;
}
.navBtn_bg__dotWrap{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transition: .3s ease;
}
.navBtn_bg__dot{
	position: absolute;
	width: 5px;
	height: 5px;
	background-color: #FFF;
	transition: .3s ease;
}
.navBtn_bg__dot.-tl{
	top: 0;
	left: 0;
}
.navBtn_bg__dot.-tr{
	top: 0;
	right: 0;
}
.navBtn_bg__dot.-bl{
	bottom: 0;
	left: 0;
}
.navBtn_bg__dot.-br{
	bottom: 0;
	right: 0;
}

@media screen and (max-width:768px){
	.navBtnWrap {
		width: var(--sp-size-96);
		height: var(--sp-size-96);
	}
	.navBtn:after {
		font-size: var(--sp-size-20);
	}
}

@media (hover: hover) and (pointer: fine) {
	.navBtn:hover .navBtn--line,
	.navBtn:hover .navBtn_bg__dot{
		background-color: var(--color-lightblue);
	}
	.navBtn:hover .navBtn_bg__dotWrap{
		transform: scale(90%);
	}
	.navBtn:hover:after{
		color: var(--color-lightblue);
	}
}

/* active */
.navBtn.is-active .navBtn--line {
	background-color: #000;
}
.navBtn.is-active .navBtn--line:nth-child(1) {
	bottom: 0;
	transform: rotate(15deg);
}
.navBtn.is-active .navBtn--line:nth-child(2) {
	top: 0;
	transform: rotate(-15deg);
}
.navBtn.is-active:after {
	content: "CLOSE";
	color: #000;
}
.navBtn.is-active .navBtn_bgline{
	transform: rotate(45deg);
	border-color: #000;
}
.navBtn.is-active .navBtn_bg__dotWrap{
	transform: scale(75%);
}
.navBtn.is-active .navBtn_bg__dot{
	transform: scale(133.3334%) rotate(90deg);
	background-color: #000;
}


/** subloading -navBtn **/
#sub .header {
	opacity: 0;
}
#sub .c .header {
	opacity: 1;
	transition: all 0.3s;
    transition-delay: 0.9s;
}


/** headerNav__bg **/
.headerNav__bg{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../img/common/navbg.jpg) no-repeat center top / cover;
}
.headerNav__bg:before{
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/common/navbg_line.svg) repeat;
	opacity: 40%;
}
@media screen and (max-width: 768px){
	.headerNav__bg{
		background-image: url(../img/common/navbg_sp.jpg);
		background-position: left top;
	}
}


/*-----------------------------------------------
 * INPAGE COMMON
-------------------------------------------------*/
.inPContent{
	width: 100%;
	min-width: 1200px;
	position: relative;
	padding-bottom: 160px;
	background: #000;
	z-index: 4;
	min-height: 100vh;
}

@media screen and (max-width: 768px){
	.inPContent{
		min-width: 100%;
		padding-top: min(34.1334%, 256px);
	}
}

/* inPage BG */
.inPbgWrap{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
.inPbg__inner{
	position: sticky;
	top: 0;
	left: 0;
	overflow: hidden;
	width: 100%;
	height: 100vh;
	max-height: 100%;
}
.inPbg__image{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.inPbg__image:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/common/navbg_line.svg) repeat;
	opacity: 40%;
	z-index: 2;
}
.inPbg__image:after{
	content: '';
	position: absolute;
	top: 0;
	right: -105%;
	width: 75%;
	height: 100%;
	background-color: var(--color-lightblue);
	mix-blend-mode: difference;
	transform: skewX(-15deg);
	transform-origin: center center;
	transition: right 0.4s;
	z-index: 2;
}
.inPbg__image img{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left top;
}
.inPbg__bg{
	position: absolute;
	right: -50%;
	top: 0;
	width: 150%;
	height: 100%;
	background: #000;
	transform-origin: left top;
	transform: skewX(-15deg);
	transform-origin: left top;
	transition: right 0.4s;
	z-index: 3;
}


/* loaded */
#fullWrap.c .inPbg__image:after{
	transition-delay: .3s;
	right: -25%;
}
#fullWrap.c .inPbg__bg{
	right: 100%;
}



/** inp_title **/
.inPage__title{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;
	mix-blend-mode: difference;
	font-size: 120px;
	line-height: 0.665;
	font-weight: 400;
	font-family: var(--font-eng-work);
	letter-spacing: -0.05em;
	width: 100%;
}
.inPage__title span{
	display: inline-block;
	position: absolute;
	left: -0.05em;
	transform: translateX(60px);
    opacity: 0;
}

@media screen and (max-width: 768px){
	.inPage__title{
		position: relative;
		font-size: min(14.9334vw, 112px);
		overflow: hidden;
		mix-blend-mode: unset;
	}
	.inPage__title span{
		position: relative;
		left: 0;
		margin-left: -0.05em;
	}
}

/* active */
#fullWrap.c .inPage__title span{
	transform: translateX(0);
	opacity: 1;
	transition: all 0.3s;
	transition-delay: 0.75s;
}

/** content **/
.inPage__content{
	position: relative;
	width: 100%;
	padding-top: 160px;
	overflow: hidden;
}

@media screen and (max-width: 768px){
	.inPage__content{
		padding-top: var(--sp-size-96);
	}
}


/*-----------------------------------------------
 * COMMON MODAL
-------------------------------------------------*/
/**
 * modalBox
 * 基盤のモーダル
 */
 .modalBox{
	-webkit-overflow-scrolling: touch;
	background-color: rgba(0, 0, 0, 90%);
	display: none;
	width: 100%;
	height: 100%;
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.oneModal{
	display: none;
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}

/* oneModalIn */
.oneModalIn{
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	width: 100%;
	min-height: 100%;
	margin: 0 auto;
	position: relative;
}
.oneModalIn__cont{
	padding: 50px 0;
}
@media screen and (max-width:768px){
	.oneModalIn{
		min-width: 100%;
	}
	.oneModalIn__cont{
		width: 100%;
		padding: 30px 0;
	}
}

/* modalClose */
.modalClose{
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index: 2;
	pointer-events: none;
}
.modalClose a{
	display:block;
	position:absolute;
	right:0;
	top:0;
	width:80px;
	height:80px;
	overflow:hidden;
	pointer-events: auto;
}
.modalClose a:before,
.modalClose a:after{
	content:'';
	position:absolute;
	height:2px;
	top:50%;
	left:50%;
	width:200px;
	background:#FFF;
	margin-left:-100px;
	margin-top:-1px;
}
.modalClose a:before{
	transform:rotate(45deg);
}
.modalClose a:after{
	transform:rotate(-45deg);
}
@media screen and (max-width:768px){
	.modalClose a{
		width:12.8vw;
		height:12.8vw;
	}
	.movieModal__inner{
		position:absolute;
		left:0;
		right:0;
		top:50%;
		bottom:auto;
		height:56.25vw;
		margin-top:-28.125vw;
	}
}


/* imageModal */
#imgModal .oneModalIn__cont{
	width: 100%;
}
.modalImgWrap{
	width: 66.6667%;
	max-width: 800px;
	margin: 0 auto;
	height: calc(100vh - 200px);
	height: calc(100svh - 200px);
	position: relative;
}
.modalImgIn{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.modalImgIn img{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	object-fit: scale-down;
}
@media screen and (max-width: 768px){
	.modalImgWrap{
		width: 93.6%;
	}
}