@charset "utf-8";
.loading{
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:20000;
	background:#000;
	display:flex;
	justify-content:center;
	align-items:center;
	overflow: hidden;
}
.loading__icon{
	width:450px;
	height:450px;
	background:url(../img/top/loading_icon.png) no-repeat center center / contain;
}
@keyframes loadings {
	from {
		background-position:center top;
	}
	to {
		background-position:center bottom;
	}
}
@media screen and (max-width:768px){
	.loading__icon{
		width:60vw;
		height:60vw;
	}
}
.kv {
	position: relative;
	width:100%;
	z-index:100;
	background:#000;
/*	padding-top:57.6%;*/
}
.kv__inner {
	display: flex;
}
@media screen and (max-width:768px){
	.kv__inner {
		flex-direction: column;
		height: 198.4vw;
/*		min-height:100vh;
		min-height:100svh;*/
	}
}
.kv__left {
	width:24.75%;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	position: sticky;
	left:0;
	top:0;
	max-height:100vh;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.kv__left {
		display: flex;
		position:absolute;
		background:transparent;
		order:1;
		right:0;
		bottom:0;
		width:100%;
		max-height:unset;
		align-items: flex-end;
		justify-content: unset;
		z-index:1000;
		pointer-events: none;
	}
}
.kv__title {
	height:100%;
	margin-right:22%;
	width:50%;
	background:url(../img/common/logo_v.png) no-repeat center right / contain;
	position: relative;
}
@media screen and (max-width:768px){
	.kv__title {
		top:101.3333vw;
		right:1vw;
		height:27.84vw;
		width:98vw;
		background:url(../img/common/logo_h-k.png) no-repeat center right / contain;
		position:absolute;
		margin-right:0;
	}
}
.kv__leftL {
	width:6.415%;
	display: flex;
	height:100%;
	flex-direction: column;
	justify-content: space-between;
	position: relative;
	margin-left:-1px;
}
@media screen and (max-width:768px){
	.kv__leftL {
		width:100%;
		height:2.4875vw;
		flex-direction: row;
		justify-content:center;
		align-items: center;
		position: absolute;
		left:0;
		top:135.2981vw;
		right:0;

	}
}
.kv__leftL:before {
	content:'';
	position: absolute;
	display: block;
	width:35.2941%;
	right:-80%;
	top:0;
	bottom:0;
	-webkit-mask: url(../img/common/title_en-sub.svg) no-repeat right top / contain;
	mask: url(../img/common/title_en-sub.svg) no-repeat right top / contain;
	background: #000;
	z-index:50;
}
@media screen and (max-width:768px){
	.kv__leftL:before {
/*		position: relative;
		display: block;
		width:11.3333vw;
		right:unset;
		height:1.3333vw;
		top:unset;
		bottom:unset;
		-webkit-mask: url(../img/common/title_en-sub-h.svg) no-repeat right top / contain;
		mask: url(../img/common/title_en-sub-h.svg) no-repeat right top / contain;
		background: var(--color-blue);
		margin-right:1.4666vw;*/
		display: none;
	}
}
.kv__enTitle {
	height:60%;
	width:100%;
	-webkit-mask:url(../img/common/title_en.svg) no-repeat left top / contain;
	mask:url(../img/common/title_en.svg) no-repeat left top / contain;
	background: #000
}
@media screen and (max-width:768px){
	.kv__enTitle {
		height:2.4875vw;
		width:100%;
		-webkit-mask:url(../img/common/title_en-h.svg) no-repeat center center / contain;
		mask:url(../img/common/title_en-h.svg) no-repeat center center / contain;
		background:#fff;
	}
}
.kv__scroll{
	height:25%;
	padding-bottom:3px;
	position:relative;
	margin-left:1px;
}
.kv__scrollLink{
	height:100%;
	position:relative;
	display:block;
	pointer-events:auto;
}
.kv__scrollLink:before{
	content:'';
	position:absolute;
	left:50%;
	top:48.4%;
	bottom:6.8%;
	width:1px;
	margin-left:-6%;
	background:rgba(0,0,0,.3);
}
.kv__scrollLink:after{
	content:'';
	position:absolute;
	left:50%;
	top:48.4%;
	bottom:52.6%;
	width:1px;
	margin-left:-6%;
	background:#000;
	animation:scroll_v 2s ease-in-out infinite;
}
.kv__scroll-img{
	height:100%;
	width:auto;
}
@media screen and (max-width:768px){
	.kv__scroll {
		display: none;
	}
}
.kv__btns {
	width:15%;
	display: flex;
	justify-content: center;
	align-content: flex-start;
	background:#000;
	flex-wrap: wrap;
	max-height:100vh;
	position: sticky;
	left:0;
	top:0;
	background: var(--color-blue);
}
.kv__btns:before {
	content:'';
	position: relative;
	width:100%;
	display: block;
	height:50%;
}
@media screen and (max-width:768px){
	.kv__btns {
		width:100%;
		height:16vw;
		justify-content:flex-start;
		background:transparent;
		max-height:unset;
		position:absolute;
		right:0;
		top:unset;
		bottom:39.2vw;
	}
	.kv__btns:before {
		display: none;
	}
}
.kv__inBtns{
	display:block;
	z-index:50;
	pointer-events:auto;
	order:2;
}
@media screen and (max-width:768px){
	.kv__inBtns{
		display:flex;
		pointer-events:auto;
		padding-left:3.3333vw;
	}
}
.kv__inBtn{
	width:min(80px,6.25vw);
	height:min(96px,7.5vw);
	padding:0 0 min(16px,1.25vw) 0;
}
@media screen and (max-width:768px){
	.kv__inBtn{
		width:16vw;
		height:16vw;
		padding:0;
		margin-right:6.4vw;
	}
}
.kv__inBtnLink{
	display:flex;
	justify-content:center;
	align-items:center;
	color:#000;
	text-decoration:none;
	font-size:min(24px,1.875vw);
	width:min(80px,6.25vw);
	height:min(80px,6.25vw);
	padding-bottom:1px;
}
@media screen and (max-width:768px){
	.kv__inBtnLink{
		padding-top:1px;
		font-size:4vw;
		width:16vw;
		height:16vw;
		color:var(--color-blue);
	}
}
.kv__inBtnLink:hover{
	color:#000;
}
.kv__inBtnLink:before{
	background:#000;
}
.kv__inBtnLink:hover:before{
	background:#000;
}
@media screen and (max-width:768px){
	.kv__inBtnLink:hover{
		color:var(--color-blue);
	}
	.kv__inBtnLink:before{
		background:var(--color-blue);
	}
	.kv__inBtnLink:hover:before{
		background:var(--color-blue);
	}
}
.lang {
	position: absolute;
	left:50%;
	bottom:min(4%,20px);
	display: flex;
	margin-left:max(-38px,-2.9687vw);
	pointer-events: auto;
}
@media screen and (max-width:768px){
	.lang {
		position: absolute;
		left:76vw;
		bottom:0;
		top:6vw;
		display: flex;
		margin-left:0;
	}
}
.lang a {
	display: flex;
	justify-content: center;
	align-items: center;
	width:min(38px,2.9687vw);
	height:min(20px,1.5625vw);
	border:1px solid #000;
	background:#000;
	position: relative;
	transition:all 0.3s ease;
	z-index:50;
}
@media screen and (max-width:768px){
	.lang a {
		width:10vw;
		height:5vw;
		border-color:var(--color-blue);
	}
}
.lang a:hover {
	background:#017771;
}
.lang a:before {
	content:'';
	height:12px;
	display: block;
	width:100%;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.lang a:before {
		height:2.5vw;
	}
}
.lang a:first-child:before {
	-webkit-mask:url(../img/common/text_jpn.svg) no-repeat center center / 80% 90%;
	mask:url(../img/common/text_jpn.svg) no-repeat center center / 80% 90%;
}
.lang a:last-child:before {
	-webkit-mask:url(../img/common/text_eng.svg) no-repeat center center / 80% 90%;
	mask:url(../img/common/text_eng.svg) no-repeat center center / 80% 90%;
}
.lang a.active {
	background:var(--color-blue);
	pointer-events: none;
}
.lang a.active:before {
	background:#000;
}
.kv__catch{
	width:2.9vw;
	position: absolute;
	right:0;
	top:50%;
	bottom:0;
	z-index:18;
	margin-left:auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	padding:1%;
}
@media screen and (max-width:768px){
	.kv__catch{
		width:10vw;
		position: absolute;
		right:0;
		top:-146vw;
		bottom:0;
		z-index:50;
		margin-left:auto;
		display: flex;
		flex-direction: row-reverse;
		justify-content:flex-start;
		align-items: flex-start;
		padding:0.8vh 0.5vw 0;
	}
}
.kv__catch-t {
	width:100%;
	height:100%;
	-webkit-mask:url(../img/top/catch_t.svg) no-repeat right top / contain;
	mask:url(../img/top/catch_t.svg) no-repeat right top / contain;
	background:#000;
}
@media screen and (max-width:768px){
	.kv__catch-t {
		width:25%;
		margin-right:25%;
		height:100%;
	}
}
.kv__catch-b {
	width:50%;
	height:28.1481%;
	-webkit-mask:url(../img/top/catch_b.svg) no-repeat right bottom / contain;
	mask:url(../img/top/catch_b.svg) no-repeat right bottom / contain;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.kv__catch-b {
		width:25%;
		margin-right:25%;
		-webkit-mask-position:right top;
		mask-position:right top;
		height:100%;
	}
}
.kv__catch-c {
	width:100%;
	height:100%;
	-webkit-mask:url(../img/top/catch_c.svg) no-repeat right top / contain;
	mask:url(../img/top/catch_c.svg) no-repeat right top / contain;
	background:#000;
}
@media screen and (max-width:768px){
	.kv__catch-c {
		width:80%;
		/*margin-right:25%;*/
		-webkit-mask-position:right top;
		mask-position:right top;
		height:100%;
		background:#fff;
	}
}
.kv__img {
	flex:1;
	display: block;
	position: relative;
	z-index:30;
	pointer-events: none;
}
@media screen and (max-width:768px){
	.kv__img {
		width:100%;
	}
}
.kv__img-img {
	width:100%;
	height:auto;
}
.kv__startdate {
	width:4%;
	z-index:18;
	margin-left:auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	padding:0;
	position: sticky;
	left:0;
	top:0;
	background:#000;
	max-height:100vh;
}
@media screen and (max-width:768px){
	.kv__startdate {
		width:100%;
		border-top:1px solid var(--color-blue);
		margin-left:0;
		position:absolute;
		top:unset;
		bottom:0;
		background:transparent;
	}
}
.kv__startdate:before {
	content:'';
	position: absolute;
	left:50%;
	top:50%;
	bottom:0;
	width:0px;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.kv__startdate:before {
		display: none;
	}
}
.kv__startdateUpper {
	width:100%;
	height:100%;
	padding:10% 0;
	/*border-bottom:1px solid var(--color-blue);*/
	display: flex;
	align-items: center;
}
@media screen and (max-width:768px){
	.kv__startdateUpper {
		width:90vw;
		height:13vw;
		padding:0;
		border:none;
		/*border-right:1px solid var(--color-blue);*/
	}
}
.kv__startdateText {
	width:100%;
	height:100%;
	-webkit-mask: url(../img/top/startdate-p.svg) no-repeat center center / contain;
	mask: url(../img/top/startdate-p.svg) no-repeat center center / contain;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.kv__startdateText {
		width:100%;
		height:13vw;
		-webkit-mask: url(../img/top/startdate-s.svg) no-repeat center center / 100% auto;
		mask: url(../img/top/startdate-s.svg) no-repeat center center / 100% auto;
	}
}

.kv__extradate {
	display: none;
}

@media screen and (max-width:768px){
	.kv__extradate {
		width: 100%;
		display: block;
	}
}

.kv__startdateLower {
	height:40%;
	display: flex;
	width:100%;
}
@media screen and (max-width:768px){
	.kv__startdateLower {
		flex:1;
		width:auto;
		height:8vw;
		position: relative;
	}
	.kv__startdateLower:before {
		content:'';
		position: absolute;
		right:47.3333vw;
		top:0;
		bottom:0;
		width:0px;
		background:var(--color-blue);
	}
}
.kv__startdateStreaming {
	width:100%;
	height:100%;
	-webkit-mask:url(../img/top/streaming-p.svg) no-repeat center center / auto 85%;
	mask:url(../img/top/streaming-p.svg) no-repeat center center / auto 85%;
	order:1;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.kv__startdateStreaming {
		-webkit-mask:url(../img/top/streaming-s.svg) no-repeat center center / 112% auto;
		mask:url(../img/top/streaming-s.svg) no-repeat center center / 112% auto;
		border-left:1px solid var(--color-blue);
	}
}
.kv__startdateBroadcast {
	width:50%;
	height:100%;
	-webkit-mask:url(../img/top/broadcast-p.svg) no-repeat center center / auto 85%;
	mask:url(../img/top/broadcast-p.svg) no-repeat center center / auto 85%;
	background: var(--color-blue);
}
@media screen and (max-width:768px){
	.kv__startdateBroadcast {
		width:auto;
		flex:1;
		-webkit-mask:url(../img/top/broadcast-s.svg) no-repeat center center / 85% auto;
		mask:url(../img/top/broadcast-s.svg) no-repeat center center / 85% auto;
		border-right:1px solid var(--color-blue);
	}
}
.introduction {
	height:100vh;
	min-height:720px;
	position: relative;
	display: flex;
	align-items: center;
	overflow: hidden;
	z-index:99;
}
@media screen and (max-width:768px){
	.introduction {
		min-height:100vw;
		position: relative;
		display: flex;
		align-items: center;
	}
}
.introduction__bg {
	position: absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
.introduction__bg--a {
	background:url(../img/introduction/introduction_bg1.jpg) no-repeat center center / cover;
}
@media screen and (max-width:768px){
	.introduction__bg--a {
		background-image:url(../img/introduction/introduction_bg1-v.jpg);
	}
}
.introduction__bg--b {
	background:url(../img/introduction/introduction_bg2.jpg) no-repeat center center / cover;
	opacity:0;
	transition: opacity 0.5s ease;
}
@media screen and (max-width:768px){
	.introduction__bg--a {
		background-image:url(../img/introduction/introduction_bg2-v.jpg);
	}
}
#introduction.ib3 .introduction__bg--b{
	opacity:1;
}
.introduction__title {
	height:24.37px;
	position: absolute;
	left:34px;
	top:38px;
	right:0;
}
@media screen and (max-width:768px){
	.introduction__title {
		height:4.2717vw;
		left:0;
		top:5vw;
		right:0;
	}
}
.introduction__title:before {
	content:'';
	position: absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	-webkit-mask: url(../img/introduction/introduction_title.svg) no-repeat left top / contain;
	mask: url(../img/introduction/introduction_title.svg) no-repeat left top / contain;
	background:#FFF;
}
.introduction__title:after {
	content:'';
	position: absolute;
	left:0;
	bottom:-100%;
	/*height:min(7.2px,0.5575vw);*/
	height:7.2px;
	width:100%;
	-webkit-mask:url(../img/common/title_en-h.svg) no-repeat left top / contain;
	mask:url(../img/common/title_en-h.svg) no-repeat left top / contain;
	background:#FFF;
}
@media screen and (max-width:768px){
	.introduction__title:after {
		height:1.3333vw;
	}
}
.introduction__container {
	width:100%;
	padding-bottom:30px;
	position: relative;
}
.introduction__swiper-slide{
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-content:flex-start;
	position:relative;
	flex-wrap:wrap;
	align-items:flex-start;
	padding:0 30px;
	width: auto;
}
@media screen and (max-width:768px){
	.introduction__swiper-slide{
		padding:0;
		width: 100vw;
	}
}
.introduction1__text{
	width:14px;
	margin:0 8px;
	display:flex;
	align-items:flex-start;
	position:relative;
}
@media screen and (max-width:768px){
	.introduction1__text{
		width:3vw;
		margin:0 2vw;
		display:flex;
		align-items:flex-start;
		position:relative;
	}
}
.introduction1__text:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	height:0;
	background:#fff;
}
#introduction.i1 .introduction1__text:before{
	animation:textmask 0.4s linear forwards;
}
.introduction1__text:nth-child(1):before{
	animation-delay:0.1s !important
}
.introduction1__text:nth-child(2):before{
	animation-delay:0.15s !important
}
.introduction1__text:nth-child(3):before{
	animation-delay:0.2s !important
}
.introduction1__text:nth-child(4):before{
	animation-delay:0.25s !important
}
.introduction1__text:nth-child(5):before{
	animation-delay:0.3s !important
}
.introduction1__text:nth-child(6):before{
	animation-delay:0.35s !important
}
.introduction1__text:nth-child(7):before{
	animation-delay:0.4s !important
}
.introduction1__text:nth-child(8):before{
	animation-delay:0.45s !important
}
.introduction1__text:nth-child(9):before{
	animation-delay:0.5s !important
}
.introduction1__text:nth-child(10):before{
	animation-delay:0.55s !important
}
.introduction1__text:nth-child(11):before{
	animation-delay:0.6s !important
}
.introduction1__text:nth-child(12):before{
	animation-delay:0.65s !important
}
.introduction1__text img{
	width:100%;
	height:auto;
	opacity:0;
}
#introduction.i1 .introduction1__text img {
	animation:textopen 0.4s linear forwards;
}
.introduction1__text:nth-child(1) img{
	animation-delay:0.1s !important
}
.introduction1__text:nth-child(2) img{
	animation-delay:0.15s !important
}
.introduction1__text:nth-child(3) img{
	animation-delay:0.2s !important
}
.introduction1__text:nth-child(4) img{
	animation-delay:0.25s !important
}
.introduction1__text:nth-child(5) img{
	animation-delay:0.3s !important
}
.introduction1__text:nth-child(6) img{
	animation-delay:0.35s !important
}
.introduction1__text:nth-child(7) img{
	animation-delay:0.4s !important
}
.introduction1__text:nth-child(8) img{
	animation-delay:0.45s !important
}
.introduction1__text:nth-child(9) img{
	animation-delay:0.5s !important
}
.introduction1__text:nth-child(10) img{
	animation-delay:0.55s !important
}
.introduction1__text:nth-child(11) img{
	animation-delay:0.6s !important
}
.introduction1__text:nth-child(12) img{
	animation-delay:0.65s !important
}
.introduction2__texts{
	display:flex;
	flex-direction:row-reverse;
	justify-content:center;
	align-content:flex-start;
	position:relative;
	flex-wrap:wrap;
	align-items:flex-start;
}
.introduction2__text{
	width:14px;
	margin:0 8px;
	display:flex;
	align-items:flex-start;
	position:relative;
}
@media screen and (max-width:768px){
	.introduction2__text{
		width:3vw;
		margin:0 2vw;
		display:flex;
		align-items:flex-start;
		position:relative;
	}
}
.introduction2__text:first-child {
	width:27px;
}
@media screen and (max-width:768px){
	.introduction2__text:first-child {
		width:6vw;
	}
}
.introduction2__text:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	height:0;
	background:#fff;
}
#introduction.i2 .introduction2__text:before,
#introduction.i3 .introduction2__text:before{
	animation:textmask 0.4s linear forwards;
}
.introduction2__text:nth-child(1):before{
	animation-delay:0.1s !important
}
.introduction2__text:nth-child(2):before{
	animation-delay:0.15s !important
}
.introduction2__text:nth-child(3):before{
	animation-delay:0.5s !important
}
.introduction2__text:nth-child(4):before{
	animation-delay:0.55s !important
}
.introduction2__text:nth-child(5):before{
	animation-delay:0.6s !important
}
.introduction2__text:nth-child(6):before{
	animation-delay:0.65s !important
}
.introduction2__text:nth-child(7):before{
	animation-delay:0.7s !important
}
.introduction2__text:nth-child(8):before{
	animation-delay:0.75s !important
}
.introduction2__text:nth-child(9):before{
	animation-delay:0.8s !important
}
.introduction2__text:nth-child(10):before{
	animation-delay:0.85s !important
}
.introduction2__text:nth-child(11):before{
	animation-delay:0.9s !important
}
.introduction2__text:nth-child(12):before{
	animation-delay:0.95s !important
}
.introduction2__text img{
	width:100%;
	height:auto;
	opacity:0;
}
#introduction.i2 .introduction2__text img,
#introduction.i3 .introduction2__text img {
	animation:textopen 0.4s linear forwards;
}
.introduction2__text:nth-child(1) img{
	animation-delay:0.1s !important
}
.introduction2__text:nth-child(2) img{
	animation-delay:0.15s !important
}
.introduction2__text:nth-child(3) img{
	animation-delay:0.5s !important
}
.introduction2__text:nth-child(4) img{
	animation-delay:0.55s !important
}
.introduction2__text:nth-child(5) img{
	animation-delay:0.6s !important
}
.introduction2__text:nth-child(6) img{
	animation-delay:0.65s !important
}
.introduction2__text:nth-child(7) img{
	animation-delay:0.7s !important
}
.introduction2__text:nth-child(8) img{
	animation-delay:0.75s !important
}
.introduction2__text:nth-child(9) img{
	animation-delay:0.8s !important
}
.introduction2__text:nth-child(10) img{
	animation-delay:0.85s !important
}
.introduction2__text:nth-child(11) img{
	animation-delay:0.9s !important
}
.introduction2__text:nth-child(12) img{
	animation-delay:0.95s !important
}
.introduction3__texts{
	display:flex;
	flex-direction:row-reverse;
	justify-content:center;
	align-content:flex-start;
	position:relative;
	align-items:flex-start;
}
.introduction3__text{
	width:14px;
	margin-left:18px;
	position:relative;
}
@media screen and (max-width:768px){
	.introduction3__text{
		width:3vw;
		margin-left:4vw;
		position:relative;
	}
}
.introduction3__text:nth-child(6) {
	width:28px;
}
@media screen and (max-width:768px){
	.introduction3__text:nth-child(6) {
		width:6vw;
	}
}
.introduction3__text:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	height:0;
	background:#fff;
}
#introduction.i3 .introduction3__text:before{
	animation:textmask 0.4s linear forwards;
}
.introduction3__text:nth-child(1):before{
	animation-delay:0.1s !important
}
.introduction3__text:nth-child(2):before{
	animation-delay:0.15s !important
}
.introduction3__text:nth-child(3):before{
	animation-delay:0.2s !important
}
.introduction3__text:nth-child(4):before{
	animation-delay:0.25s !important
}
.introduction3__text:nth-child(5):before{
	animation-delay:0.3s !important
}
.introduction3__text:nth-child(6):before{
	animation-delay:0.7s !important
}
.introduction3__text:nth-child(7):before{
	animation-delay:0.75s !important
}
.introduction3__text:nth-child(8):before{
	animation-delay:1.2s !important
}
.introduction3__text:nth-child(9):before{
	animation-delay:1.25s !important
}
.introduction3__text:nth-child(10):before{
	animation-delay:1.3s !important
}
.introduction3__text:nth-child(11):before{
	animation-delay:1.35s !important
}
.introduction3__text:nth-child(12):before{
	animation-delay:1.4s !important
}
.introduction3__text img{
	width:100%;
	height:auto;
	opacity:0;
}
#introduction.i3 .introduction3__text img {
	animation:textopen 0.4s linear forwards;
}
.introduction3__text:nth-child(1) img{
	animation-delay:0.1s !important
}
.introduction3__text:nth-child(2) img{
	animation-delay:0.15s !important
}
.introduction3__text:nth-child(3) img{
	animation-delay:0.2s !important
}
.introduction3__text:nth-child(4) img{
	animation-delay:0.25s !important
}
.introduction3__text:nth-child(5) img{
	animation-delay:0.3s !important
}
.introduction3__text:nth-child(6) img{
	animation-delay:0.7s !important
}
.introduction3__text:nth-child(7) img{
	animation-delay:0.75s !important
}
.introduction3__text:nth-child(8) img{
	animation-delay:1.2s !important
}
.introduction3__text:nth-child(9) img{
	animation-delay:1.25s !important
}
.introduction3__text:nth-child(10) img{
	animation-delay:1.3s !important
}
.introduction3__text:nth-child(11) img{
	animation-delay:1.35s !important
}
.introduction3__text:nth-child(12) img{
	animation-delay:1.4s !important
}
.introduction__navs {
	position: absolute;
	bottom:40px;
	left:50%;
	width:300px;
	display: flex;
	justify-content: center;
	align-items:flex-end;
	height:30px;
	margin-left:-150px;
}
@media screen and (max-width:768px){
	.introduction__navs {
		position: absolute;
		bottom:unset;
		top:50%;
		margin-top:32.4vw;
		left:50%;
		width:40vw;
		display: flex;
		justify-content: center;
		align-items:flex-end;
		height:12.8vw;
		margin-left:-20vw;
	}
}
.introduction__bullet {
	display: flex;
	justify-content: center;
	flex-direction: row-reverse;
}
@media screen and (max-width:768px){
	.introduction__bullet {
		padding-bottom:0.7vw;
	}
}
.introduction__bullet li {
	margin:0 8px;
}
@media screen and (max-width:768px){
	.introduction__bullet li {
		margin:0 2vw;
	}
}
.introduction__bullet li a {
	display: block;
	width:8px;
	height:8px;
	text-decoration: none;
	background:#FFF;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.introduction__bullet li a {
		width:2.4vw;
		height:2.4vw;
	}
}
@media screen and (hover:hover){
	.introduction__bullet li a:hover {
		transform:scale(1.5);
	}
}
.introduction__bullet li a.is-active {
	transform:scale(1.5);
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.introduction__bullet li a.is-active {
		transform:scale(1.2);
	}
}
.introduction__arrow {
	position: absolute;
	left:0;
	right:0;
	bottom:0;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
}
.introduction__arrow li {}
.introduction__arrow li a {
	width:20px;
	height:20px;
	display: block;
	position: relative;
	pointer-events: auto;
}
.introduction__arrow li a.is-disable {
	opacity:0.1;
	pointer-events: none;
}
.introduction__arrow li:first-child a:before {
	content: '';
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 6px 10.4px 6px 0;
	border-color: transparent #FFFFFF transparent transparent;
	left:0;
	bottom:0;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.introduction__arrow li:first-child a:before {
		border-width: 2vw 3.4666vw 2vw 0;
	}
}
.introduction__arrow li:last-child a:before {
	content: '';
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 6px 0 6px 10.4px;
	border-color: transparent transparent transparent #FFFFFF;
	right:0;
	bottom:0;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.introduction__arrow li:last-child a:before {
		border-width: 2vw 0 2vw 3.4666vw;
	}
}
.introduction__arrow li a:hover:before {
	transform:scale(1.5);
}
.movie {
	height:100vh;
	min-height:720px;
	position: relative;
	display: flex;
	align-items: center;
	z-index:98;
}
@media screen and (max-width:768px){
	.movie {
		min-height:100vh;
		height:auto;
	}
}
.movie__bg{
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
@media screen and (max-width:768px){
	.movie__bg{
		position:absolute;
		left:0;
		top:0;
		right:0;
		bottom:0;
	}
}
.movie__bg:before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
.movie__bgin {
	position: sticky;
	left:0;
	top:0;
	width:100%;
	height:100vh;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}
.movie__bg--embed{
	width:100%;
	height:100%;
}
.movie__title {
	height:54.66px;
	position: absolute;
	left:34px;
	top:38px;
	right:0;
}
@media screen and (max-width:768px){
	.movie__title {
		height:8.7733vw;
		left:0;
		top:7.4666vw;
	}
}
.movie__title:before {
	content:'';
	position: absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	-webkit-mask: url(../img/movie/movie_title.svg) no-repeat left top / contain;
	mask: url(../img/movie/movie_title.svg) no-repeat left top / contain;
	background:var(--color-blue);
}
.movie__title:after {
	content:'';
	position: absolute;
	left:0;
	bottom:-30px;
	height:8.38px;
	width:100%;
	-webkit-mask:url(../img/common/title_en-h.svg) no-repeat left top / contain;
	mask:url(../img/common/title_en-h.svg) no-repeat left top / contain;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.movie__title:after {
		bottom:-4vw;
		height:1.3636vw;
	}
}
.movie__container {
	padding:0 80px;
	width:100%;
}
@media screen and (max-width:768px){
	.movie__container {
		padding:0 0 12.8vw;
	}
}
.movie__swiper {
	margin:0;
	overflow: visible;
}
@media screen and (max-width:768px){
	.movie__swiper {
		margin:0;
		width:100%;
		overflow:hidden;
		padding-top:32.5333vw;
	}
}
@media screen and (max-width:768px){
	.movie__swiper-wrapper {
		display: block;
		width:100%;
	}
}
.movie__swiper-slide {
	height:420px;
	width: 260px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top:120px;
}
@media screen and (max-width:768px){
	.movie__swiper-slide {
		height:auto;
		width: 100%;
		display: flex;
		flex-direction:row;
		flex-wrap: wrap;
		justify-content: center;
		position:relative;
		padding-top:0;
		padding-bottom:8vw;
	}
}
.movie__swiper-slide a {
	width:160px;
	height:160px;
	display: flex;
	position: relative;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.movie__swiper-slide a {
		width:28.5333vw;
		height:28.5333vw;
	}
}
@media screen and (hover:hover){
	.movie__swiper-slide a:hover {
		transform:scale(1.1)
	}
}
.movie__swiper-slide a:before {
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	-webkit-mask:url(../img/common/btn_circle.svg) no-repeat center center / contain;
	mask:url(../img/common/btn_circle.svg) no-repeat center center / contain;
	background:var(--color-blue);
	pointer-events:none;
}
@media screen and (hover:hover){
	.movie__swiper-slide a:hover:before{
		animation:inBtn_r 1s ease-in-out infinite;
	}
}
.movie__swiper-slide a .n-a {
	display: block;
	height:46px;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.movie__swiper-slide a .n-a {
		height:8.5333vw;
	}
}
.n-a0 {
	-webkit-mask:url(../img/number/a0.svg) no-repeat center center / contain;
	mask:url(../img/number/a0.svg) no-repeat center center / contain;
}
.n-a1 {
	-webkit-mask:url(../img/number/a1.svg) no-repeat center center / contain;
	mask:url(../img/number/a1.svg) no-repeat center center / contain;
}
.n-a2 {
	-webkit-mask:url(../img/number/a2.svg) no-repeat center center / contain;
	mask:url(../img/number/a2.svg) no-repeat center center / contain;
}
.n-a3 {
	-webkit-mask:url(../img/number/a3.svg) no-repeat center center / contain;
	mask:url(../img/number/a3.svg) no-repeat center center / contain;
}
.n-a4 {
	-webkit-mask:url(../img/number/a4.svg) no-repeat center center / contain;
	mask:url(../img/number/a4.svg) no-repeat center center / contain;
}
.n-a5 {
	-webkit-mask:url(../img/number/a5.svg) no-repeat center center / contain;
	mask:url(../img/number/a5.svg) no-repeat center center / contain;
}
.n-a6 {
	-webkit-mask:url(../img/number/a6.svg) no-repeat center center / contain;
	mask:url(../img/number/a6.svg) no-repeat center center / contain;
}
.n-a7 {
	-webkit-mask:url(../img/number/a7.svg) no-repeat center center / contain;
	mask:url(../img/number/a7.svg) no-repeat center center / contain;
}
.n-a8 {
	-webkit-mask:url(../img/number/a8.svg) no-repeat center center / contain;
	mask:url(../img/number/a8.svg) no-repeat center center / contain;
}
.n-a9 {
	-webkit-mask:url(../img/number/a9.svg) no-repeat center center / contain;
	mask:url(../img/number/a9.svg) no-repeat center center / contain;
}
.movie__swiper-slide a .n-a img {
	height:100%;
	width: auto;
	opacity:0;
}
.movie__time {
	padding-top:10px;
	font-size:22px;
	color:var(--color-blue);
}
@media screen and (max-width:768px){
	.movie__time {
		pointer-events: none;
		position: absolute;
		padding-top:0;
		left:50%;
		top:0;
		margin-left:20vw;
		font-size:4.6vw;
		height:28.5333vw;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}
.movie__name {
	text-align: center;
	font-size:26px;
	color:var(--color-blue);
	position: absolute;
	left:0;
	bottom:0;
	right:0;
	font-weight: 500;
	line-height:1.4;
}
@media screen and (max-width:768px){
	.movie__name {
		font-size:4.2vw;
		position:relative;
		left:unset;
		bottom:unset;
		right:unset;
		font-weight: 500;
		width:100%;
		order:1;
		padding-top:1em;
	}
}
.movie__navs {
	position: absolute;
	bottom:40px;
	left:50%;
	width:300px;
	display: flex;
	justify-content: center;
	align-items:flex-end;
	height:30px;
	margin-left:-150px;
	transition: all 0.3s ease;
}
.movie__navs.is-disable {
	opacity:0;
	pointer-events: none;
}
.movie__navs p {
	font-size:20px;
	line-height:0.7;
	color:var(--color-blue);
}
.movie__arrow {
	position: absolute;
	left:0;
	right:0;
	bottom:0;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
}
.movie__arrow li {}
.movie__arrow li a {
	width:20px;
	height:20px;
	display: block;
	position: relative;
	pointer-events: auto;
}
.movie__arrow li a.is-disable {
	opacity:0.1;
	pointer-events: none;
}
.movie__arrow li:first-child a:before {
	content: '';
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 6px 10.4px 6px 0;
	border-color: transparent var(--color-blue) transparent transparent;
	left:0;
	bottom:0;
	transition: all 0.3s ease;
}
.movie__arrow li:last-child a:before {
	content: '';
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 6px 0 6px 10.4px;
	border-color: transparent transparent transparent var(--color-blue);
	right:0;
	bottom:0;
	transition: all 0.3s ease;
}
.movie__arrow li a:hover:before {
	transform:scale(1.5);
}
@media screen and (max-width:768px){
	.movie__navs {
		display: none;
	}
}
.movie-new:before {
	content:'';
	position: absolute;
	top:60px;
	left:50%;
	width:100px;
	margin-left:-50px;
	height:39px;
	-webkit-mask:url(../img/movie/movie_new.svg) no-repeat center center / contain;
	mask:url(../img/movie/movie_new.svg) no-repeat center center / contain;
	background:#FFF;
}
@media screen and (max-width:768px){
	.movie-new:before {
		top:0;
		left:50%;
		width:19.4666vw;
		margin-left:-37.6vw;
		height:28.5333vw;
		-webkit-mask:url(../img/movie/movie_new.svg) no-repeat center center / contain;
		mask:url(../img/movie/movie_new.svg) no-repeat center center / contain;
		background:#FFF;
	}
}
.staffcast {
	position: relative;
	background:var(--color-blue);
	min-height:100vh;
	overflow: hidden;
	z-index:97;
}
.staffcast__header{
	height:192px;
	background:url(../img/staff/staffcast_header.svg) no-repeat center bottom / cover;
}
.staffcast__content{
	padding-top:12px;
}
@media screen and (max-width:768px){
	.staffcast__content{
		padding-top:9.6vw;
	}
}
.staffcast__staff {
	margin-bottom:55px;
}
.staffcast__cast {
	padding-top:88px;
	position: relative;
	padding-bottom:100px;
}
.staffcast__cast:before {
	content:'';
	position: absolute;
	width:634px;
	top:0;
	left:50%;
	margin-left:-317px;
	height:1px;
	background:#000;
}
.staffcast__products {
	padding-top:88px;
	position: relative;
	padding-bottom:100px;
}
.staffcast__products dt{
	line-height:1.3;
	white-space: nowrap;
}
@media screen and (max-width:768px){
	.staffcast__products dt{
		width:60%;
	}
	.staffcast__products dd{
		width:40%;
	}
}
.staffcast__products:before {
	content:'';
	position: absolute;
	width:634px;
	top:0;
	left:50%;
	margin-left:-317px;
	height:1px;
	background:#000;
}
.staffcast__content{
	padding-top:12px;
}
.staffcast__enMTitle {
	height:8px;
	-webkit-mask: url(../img/common/title_en-h.svg) no-repeat center center / contain;
	mask: url(../img/common/title_en-h.svg) no-repeat center center / contain;
	background:#000;
	margin-bottom:60px;
}
@media screen and (max-width:768px){
	.staff__enMTitle {
		height: 2vw;
		margin-bottom:6vw;
	}
}
.staff__title {
	height:43px;
	-webkit-mask: url(../img/staff/staff_staff_title.svg) no-repeat center center / contain;
	mask: url(../img/staff/staff_staff_title.svg) no-repeat center center / contain;
	background:#000;
	margin-bottom:72px;
}

@media screen and (max-width:768px){
	.staff__title{
		height:5.2266vw;
		margin-bottom:9.6vw;
	}
}
.cast__title {
	height:43px;
	-webkit-mask: url(../img/staff/staff_cast_title.svg) no-repeat center center / contain;
	mask: url(../img/staff/staff_cast_title.svg) no-repeat center center / contain;
	background:#000;
	margin-bottom:72px;
}
@media screen and (max-width:768px){
	.cast__title{
		height:5.2266vw;
		margin-bottom:9.6vw;
	}
}
.staffcast__lists {
	font-weight: 700;
}
.staffcast__list {
	display: flex;
	flex-wrap: wrap;
}
.staffcast__list.nextMargin {
	margin-bottom:42px;
}
.staffcast__staff .staffcast__list:first-child {
	margin-bottom:44px;
}
@media screen and (max-width:768px){
	.staffcast__staff .staffcast__list:first-child {
		margin-bottom:6.4vw;
	}
}
.staffcast__listTerm {
	width:50%;
	padding-right:14px;
	font-size:22px;
	color:#FFF;
	height:44px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	letter-spacing: 0.05em;
	text-align: right;
}
@media screen and (max-width:768px){
	.staffcast__listTerm {
		padding-right:2.4vw;
		font-size:3.8vw;
		height:7.2vw;
	}
}
.staffcast__listData {
	width:50%;
	padding-left:14px;
	font-size:22px;
	color:#000;
	height:44px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	letter-spacing: 0.05em;
	position: relative;
}
@media screen and (max-width:768px){
	.staffcast__listData {
		padding-left:2.4vw;
		font-size:3.8vw;
		height:6.4vw;
	}
}
.staffcast__listData:nth-of-type(n+2) {
	margin-left:50%;
}
.staffcast__listData small {
	font-size:18px;
}
@media screen and (max-width:768px){
	.staffcast__listData small {
		font-size:3vw;
	}
}
.staffcast__listData a {
	display: block;
	margin-left:30px;
	width: 30px;
	height:24px;
	background:url(../img/common/comment.svg) no-repeat center center / contain;
	transform-origin:left center;
	transition: all 0.3s ease;
	align-items: center;
}
@media screen and (max-width:768px){
	.staffcast__listData a {
		margin-left:4vw;
		width: 5.3333vw;
		height:4.8vw;
	}
}
.staffcast__listData a:hover {
	transform: scale(1.2)
}
.character {
	background:#000;
	font-family: 'UDKakugoC60Pro-R','FOT-UD角ゴC60 Pro R', sans-serif;
	overflow-x:auto;
	overflow-y: visible;
	z-index:95;
}
@media screen and (max-width:768px){
	.character {
		overflow:unset;
	}
}
.character__wrap {
	display: flex;
	height:720px;
	min-height:100vh;
	/*align-items: center;*/
	justify-content: center;
	flex-wrap: wrap;
	padding:35px 35px 80px;
	position: relative;
	min-width:120vh;
}
@media screen and (max-width:768px){
	.character__wrap {
		display: block;
		padding:6.4vw 0 6.4vw;
		min-width:unset;
		min-height:unset;
		height:unset;
	}
}
.character__inwrap {
	height:100%;
	position: relative;
	width: 100%;
	padding-bottom:60px;
}
@media screen and (max-width:768px){
	.character__inwrap {
		padding-bottom:0;
	}
}
.character__cont {
	padding:0;
	display: flex;
	flex-wrap: wrap;
	width:100%;
	height:100%;
	opacity:1;
	flex-shrink:0;
	position: relative;
}
@media screen and (max-width:768px){
	.character__cont {
		padding:0 0 12.8vw !important;
		width:100% !important;
		height:auto;
		display: block;
		position: relative;
		left:unset;
		top:unset;
		margin:0 !important;
	}
}
@media screen and (max-width:768px){
	.character__inwrap {
		height:auto;
		position: relative;
		width: 100%
	}
}
.character__t {
	height:80px;
	display: flex;
	justify-content: space-between;
	position: relative;
	width:100%;
}
@media screen and (max-width:768px){
	.character__t {
		height:12.8vw;
		position: relative;
		top:unset;
		left:unset;
		right:unset;
	}
}
.character__title{
	height:25px;
	width:400px;
	position:relative;
}
@media screen and (max-width:768px){
	.character__title{
		height:4vw;
		width:100%;
		position:relative;
	}
}
.character__title:before{
	content:'';
	position:absolute;
	left:-7px;
	bottom:-151px;
	width:7px;
	height:134px;
	-webkit-mask:url(../img/common/title_en.svg) no-repeat right top / contain;
	mask:url(../img/common/title_en.svg) no-repeat right top / contain;
	background:var(--color-blue);
	transform:rotate(-90deg);
	transform-origin:right top;
}
@media screen and (max-width:768px){
	.character__title:before{
		left:-1.4vw;
		bottom:-28vw;
		width:1.4vw;
		height:25vw;
	}
}
.character__title:after{
	content:'';
	position: absolute;
	height:25px;
	width:400px;
	-webkit-mask:url(../img/character/character_title.svg) no-repeat left center / auto 25px;
	mask:url(../img/character/character_title.svg) no-repeat left center / auto 25px;
	background: var(--color-blue);
}
@media screen and (max-width:768px){
	.character__title:after{
		height:4vw;
		width:100%;
		mask-size:contain;
		-webkit-mask-size:contain;
	}
}
.character__enname {
	height:48px;
	flex:1;
	padding-left:50px;
	display: flex;
	justify-content: flex-end;
	align-items: flex-start;
}
@media screen and (max-width:768px){
	.character__enname {
		display:none;
	}
}
.character__enname img {
	max-height:48px;
	width: auto;
	opacity:0;
	max-width: 100%;
}
.character__t.on .character__enname img{
	animation:charaFlash 0.1s linear forwards;
}
.character__r {
	background:var(--color-blue);
	width:320px;
	order:3;
	margin-left:10px;
	height:100%;
	position: relative;
}
@media screen and (max-width:768px){
	.character__r {
		width:94.6666vw;
		order:unset;
		margin:0 auto 2.1333vw;
		height:18.9333vw;
	}
}
.character__rLists {
	display: flex;
	flex-direction: column;
	width:100%;
}
@media screen and (max-width:768px){
	.character__rLists {
		flex-direction: row;
	}
}
.character__rList dt {
	border-bottom:2px solid #000;
	height:32px;
	display: flex;
	align-items: center;
}
@media screen and (max-width:768px){
	.character__rList dt {
		height:4.4vw;
	}
	.cr--name {
		width:66vw;
		border-right:2px solid #000;
	}
}
.cr--name dt:before {
	content:'';
	height:10px;
	width:100%;
	-webkit-mask:url(../img/character/text_name.svg) no-repeat center center / contain;
	mask:url(../img/character/text_name.svg) no-repeat center center / contain;
	background:#000;
}
@media screen and (max-width:768px){
	.cr--name dt:before {
		height:2vw;
	}
}
.character__janame {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top:28px;
	height:224px;
	border-bottom:2px solid #000;
}
@media screen and (max-width:768px){
	.character__janame {
		align-items: flex-end;
		padding-top:28px;
		height:14.6666vw;
		border:none;
		padding-bottom:1vw;
	}
}
.character__janame img {
	height:95px;
	width:auto;
	opacity:0;
}
@media screen and (max-width:768px){
	.character__janame img {
		height:10.6666vw;
		width:auto;
		opacity:0;
	}
}
.character__cont.on .character__janame img{
	animation:charaFlash 0.1s linear forwards;
	/*animation-delay:0.2s;*/
}
@media screen and (max-width:768px){
	.cr--profile {
		display: none;
	}
}
.cr--profile dt:before {
	content:'';
	height:10px;
	width:100%;
	-webkit-mask:url(../img/character/text_profile.svg) no-repeat center center / contain;
	mask:url(../img/character/text_profile.svg) no-repeat center center / contain;
	background:#000;
}
@media screen and (max-width:768px){
	.character__janame img {
		height:10.6666vw;
		width:auto;
		opacity:0;
	}
}
.character__profile {
	height: calc(100% - 364px);
	padding: 30px 15px;
	line-height: 1.7;
	letter-spacing: 0.08em;
	font-size: 15px;
	font-weight: 300;
	font-family: 'UDKakugoC60Pro-R','FOT-UD角ゴC60 Pro R', sans-serif;
}
.character__profile p {
	opacity:0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.character__cont.on .character__profile p{
	animation:charaFlash 0.1s linear forwards;
	/*animation-delay:0.4s;*/
}
@media screen and (min-width:769px){
	.cr--cv {
		border-top: 2px solid #000;
		position: absolute;
		bottom:0;
		right:0;
		left:0;
	}
}

@media screen and (max-width:768px){
	.cr--cv {
		flex:1;
	}
}
.cr--cv dt:before {
	content:'';
	height:10px;
	width:100%;
	-webkit-mask:url(../img/character/text_cv.svg) no-repeat center center / contain;
	mask:url(../img/character/text_cv.svg) no-repeat center center / contain;
	background:#000;
}
@media screen and (max-width:768px){
	.cr--cv dt:before {
		height:2vw;
	}
}
.character__cv {
	display: flex;
	justify-content: center;
	align-items: center;
	height:70px;
}
@media screen and (max-width:768px){
	.character__cv {
		height:14.6666vw;
	}
}
.character__cv p {
	font-size:16px;
	opacity:0;
}
@media screen and (max-width:768px){
	.character__cv p {
		font-size:3.2vw;
	}
}
.character__cont.on .character__cv p{
	animation:charaFlash 0.1s linear forwards;
}
.character__cv .nodata {
	font-size:10px;
}
@media screen and (max-width:768px){
	.character__cv .nodata {
		font-size:2.4vw;
	}
}
.character__c {
	flex:1;
	background:#FFF url(../img/character/character_bg.png);
	order:1;
	position: relative;
	overflow: hidden;
}
@media screen and (max-width:768px){
	.character__c {
		display: block;
		width:94.6666vw;
		height:94.6666vw;
		margin:0 auto 2.1333vw;
	}
}
.character__mainImg {
	position: absolute;
	left:0;
	top:20px;
	right:0;
	bottom:20px;
	display: flex;
	justify-content: center;
}
@media screen and (max-width:768px){
	.character__mainImg {
		top:4.2666vw;
		bottom:4.2666vw;
	}
}
.character__mainImg img {
	height:100%;
	width:auto;
	opacity: 0;
}
.character__mainImgList {
	display: flex;
	justify-content: center;
	align-items: center;
}
.character__mainImg .swiper-slide-active img{
	animation:charaFlash 0.1s linear forwards;
	animation-delay:0.3s;
}
.character__mainImg .swiper-slide {
	opacity:1 !important;
}
.character__nav {
	position: absolute;
	left:18px;
	right:18px;
	top:50%;
	height:23px;
	margin-top:-18px;
	justify-content: space-between;
	display: flex;
	z-index:50;
	pointer-events: none;
}
@media screen and (max-width:768px){
	.character__nav {
		left:3.2vw;
		right:3.2vw;
		height:5.28vw;
		margin-top:-4.4vw;
	}
}
.character__nav li {
	height:23px;
	width:23px;
	pointer-events: auto
}
@media screen and (max-width:768px){
	.character__nav li {
		height:5.28vw;
		width:5.28vw;
	}
}
.character__nav li a {
	display: block;
	height:23px;
	position: relative;
}
@media screen and (max-width:768px){
	.character__nav li a {
		height:5.28vw;
	}
}
.character__nav li a:before {
	content:'';
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url(../img/common/c_arrow.svg) no-repeat center center / contain;
}
@media screen and (min-width:769px){
	.character__nav li a:hover {
		animation:charaFlash 0.1s linear forwards;
	}
}
.character__nav li:last-child a:before {
	transform:rotateY(180deg);
}
.character__l {
	background:var(--color-blue);
	width:320px;
	margin-right:10px;
	height:100%;
	overflow: hidden;
	position: relative;
}
@media screen and (max-width:768px){
	.character__l {
		width:94.6666vw;
		height:auto;
		margin:0 auto;
	}
}
.character__l:before {
/*	content:'';
	position: absolute;
	left:0;
	bottom:0;
	width:200%;
	height:2px;
	background:#000;
	transform-origin:left bottom;
	transform:rotate(-20.2414deg);*/
}
@media screen and (max-width:768px){
	.character__l:before {
		display: none;
	}
}
.character__thumbLists {
	background:#000;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.character__thumbLists li {
	width:calc((100% - 4px) / 3);
	background:var(--color-blue);
	margin-bottom:2px;
	position: relative;
}
@media screen and (max-width:768px){
	.character__thumbLists li {
		width:calc((100% - 10px) / 6);
	}
}
.character__thumb {
	position: relative;
	padding-top:100%;
}
.character__thumb a {
	display: flex;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	transition:all 0.3s ease;
}
.character__thumb a.active,
.character__thumb a:hover {
	background: #FFF url(../img/character/character_bg.png);
}
@media screen and (min-width: 769px){
	.character__thumb a.active,
	.character__thumb a:hover {
		animation:charaFlash 0.1s linear forwards;
	}
}
.character__thumb a.nodata {
	pointer-events: none;
}
.character__thumb a.nodata:before {
	content:'NO DATA';
	font-size:10px;
	font-weight: 700;
}
@media screen and (max-width:768px){
	.character__thumb a.nodata:before {
		font-size:2.1333vw;
	}
}
.character__thumb a img {
	width:100%;
	height:100%;
	object-fit: cover;
	filter:grayscale(1);
}
.character__thumb a:hover img,
.character__thumb a.active img {
	filter:grayscale(0);
}
.character__thumbNext {
	height:32px;
	border-bottom:2px solid #000;
	background:#000;
}
@media screen and (max-width:768px){
	.character__thumbNext {
		display: none;
	}
}
.character__thumbNext a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:30px;
	position: relative;
	background:var(--color-blue);
}
@media screen and (max-width:768px){
	.character__thumbNext a {
		height:12vw;
	}
}
.character__thumbNext a:before {
	content:'';
	display: block;
	width:60px;
	height:12px;
	-webkit-mask:url(../img/character/thumb_arrow.svg) no-repeat center center / contain;
	mask:url(../img/character/thumb_arrow.svg) no-repeat center center / contain;
	background:#000;
}
@media screen and (max-width:768px){
	.character__thumbNext a:before {
		width:22.4vw;
		height:4.2666vw;
	}
}
.character__thumbNext a.soon {
	opacity:0.5;
	pointer-events: none;
	filter: grayscale(1);
}
.character__mProfile {
	display: none;
}
@media screen and (max-width:768px){
	.character__mProfile {
		position:fixed;
		left:0;
		right:0;
		top:0;
		bottom:0;
		background:rgba(0,0,0,.8);
		z-index:500;
		overflow: auto;
		display: flex;
		justify-content: center;
		align-items: center;
		opacity:0;
		pointer-events: none;
	}
	.character__mProfile.on {
		opacity:1;
		pointer-events: auto;
	}
	.character__mProfilein {
		height:103.3333vw;
		width:90%;
		margin:0 auto;
		position: relative;
		padding-top:24.8vw;
		opacity:0;
	}
	.character__mProfile.on .character__mProfilein {
		animation:charaFlash 0.1s linear forwards;
		animation-delay:0.3s;
	}
	.cmodal__close a{
		position:absolute;
		right:0;
		top:0;
		width:10vw;
		height:10vw;
		display:block;
		overflow:hidden
	}
	.cmodal__close a:before,
	.cmodal__close a:after{
		content:'';
		position:absolute;
		left:50%;
		top:50%;
		width:120px;
		height:1px;
		margin-top:-1px;
		background:var(--color-blue);
		margin-left:-60px;
		transition:all 0.3s ease
	}
	.cmodal__close a:before{
		transform:rotate(45deg)
	}
	.cmodal__close a:after{
		transform:rotate(-45deg)
	}
	.character__profileTitle {
		height:2.1333vw;
		-webkit-mask: url(../img/character/text_profile.svg) no-repeat center center / contain;
		mask: url(../img/character/text_profile.svg) no-repeat center center / contain;
		background:var(--color-blue);
		margin-bottom:10.4vw;
	}
	.character__profileText {
		font-size:4.2666vw;
		color:var(--color-blue);
		display: table;
	}
	.character__profileName {
		position: absolute;
		left:0;
		right:0;
		bottom:0;
	}
	.character__profileName img {
		display: block;
		width:100%;
		height:auto;
	}
}
.btn-change {
	position: absolute;
	width:72px;
	height:72px;
	background:url(../img/character/btn_change.svg) no-repeat center center / contain;
	bottom:0px;
	right:20px;
	transition: all 0.3s ease;
	opacity:0;
	pointer-events: none;
}
@media screen and (max-width: 768px){
	.btn-change {
		width:14.4vw;
		height:14.4vw;
		right:3.2vw;
		bottom:16vw;
	}
}
.character__mainImg .swiper-slide-active .btn-change{
	animation:charaFlash 0.1s linear forwards;
	animation-delay:0.3s;
	pointer-events: auto;
}
@media screen and (min-width:769px){
	.btn-change:hover {
		transform:scale(0.9);
	}
}
.character__mainImgLists .swiper-slide-active img.c {
	opacity:0 !important;
}
@media screen and (max-width:768px){
	.character__btns {
		width:14.4vw;
		position: absolute;
		right:3.2vw;
		bottom:3.2vw;
		z-index:60;
	}
	.character__btns li {
		height:14.4vw;
		margin-top:3.2vw;
	}
	.character__btns li a {
		display: block;
		height:14.4vw;
		position: relative;
	}
	.character__openProf {
		-webkit-mask: url(../img/common/btn_circle_b.svg) no-repeat center center / contain;
		mask: url(../img/common/btn_circle_b.svg) no-repeat center center / contain;
		background:#000;
		opacity:0;
	}
	.character__cont.on .character__openProf{
		animation:charaFlash 0.1s linear forwards;
	}
	.character__openProf:before {
		content:'';
		height:2vw;
		position: absolute;
		left:0;
		top:50%;
		right:0;
		margin-top:-1vw;
		-webkit-mask: url(../img/character/text_profile.svg) no-repeat center center / contain;
		mask: url(../img/character/text_profile.svg) no-repeat center center / contain;
		background:var(--color-blue);
	}
}
.comics{
	background:#ccc;
	overflow: hidden;
	z-index:91;
}
.comics__wrap {
	position: relative;
	padding-bottom:60px;
}
.comics__header{
	height:192px;
	padding:50px 40px;
	background:url(../img/comics/comics_header.svg) no-repeat center bottom / cover;
}
.comics__title{
	height:56px;
	position:relative;
	background:url(../img/comics/comics_title.svg) no-repeat left center / auto 56px;
}
.comics__title:before{
	content:'';
	position:absolute;
	left:-7px;
	bottom:-156px;
	width:7px;
	height:134px;
	-webkit-mask:url(../img/common/title_en.svg) no-repeat right top / contain;
	mask:url(../img/common/title_en.svg) no-repeat right top / contain;
	background:#000;
	transform:rotate(-90deg);
	transform-origin:right top;
}
.comics__content{
	min-height:calc(var(--oneview_height) - 192px);
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom:60px;
}
.comic__lists {
	width:970px;
	padding-top:40px;
	display: flex;
	/*justify-content: center;*/
	align-items: center;
	flex-wrap: wrap;
}
.comic__lists li {
	margin:0 10px 20px;
	width:calc(25% - 20px);
}
.comic__lists li a img {
	display: block;
	transition: all 1s ease;
	width:100%;
	height:auto;
}
.comic__lists li a:hover img {
	transform:scale(1.15);
}
@media screen and (max-width:768px){
	.comics{
		padding-bottom:0;
	}
	.comics__header{
		height:100vw;
		padding:56.5333vw 0 12.8vw;
		background:url(../img/comics/comics_header-s.svg) no-repeat center top / contain;
	}
	.comics__title{
		height:8.6666vw;
		position:relative;
		background:url(../img/comics/comics_title.svg) no-repeat left center / auto 8.6666vw;
	}
	.comics__title:before{
		left:-1.4vw;
		bottom:-29vw;
		width:1.4vw;
		height:25vw;
	}
	.comics__wrap {
		padding-bottom:12.8vw;
		min-height:calc(100% + 50px + 50vw);
	}
	.comics__content{
		padding:0;
	}
	.comic__lists {
		width:100%;
		padding-top:0;
	}
	.comic__lists li {
		width:48%;
		margin:0 1% 10px;
	}
}
@keyframes charaFlash {
	0%,40%,80% {
		opacity:0;
	}
	20%,60%,100% {
		opacity:1;
	}
}
.menuBtn {
	transform:translateX(-150%);
	transition: all 0.3s ease;
}
.menuBtn.on {
	transform:translateX(0);
}

.kv__inBtn-extra {
	height:min(160px,24.8148vh);
	position: absolute;
	left:50%;
	top:calc(25px);
	transform:translateX(-50%);
	pointer-events: auto;
}
@media screen and (max-width:768px){
	.kv__inBtn-extra {
		display: none;
	}
}
.kv__inBtn-extra img {
	display: block;
	height:min(160px,24.8148vh);
	width:auto;
}
@media screen and (max-width:768px){
	.kv__inBtn-extra img {
		height:40.8vw;
	}
}
.kv__inBtn-extra a {
	display: block;
	transition:all 0.3s ease;
}
.kv__inBtn-extra a:hover {
	transform:scale(1.1);
}

.kv__inBtn-jf {
	height:min(64px,8.8148vh);
	position: absolute;
	left:50%;
	top:min(200px,31.4603vh);
	transform:translateX(-50%);
	pointer-events: auto;
}
@media screen and (max-width:768px){
	.kv__inBtn-jf {
		left:3vw;
		top:-140vw;
		transform:unset;
		justify-content: center;
		flex-direction: column;
		display: flex;
		height:auto;
		padding:0;
		z-index: 500
	}
}
.kv__inBtn-jf img {
	display: block;
	height:min(64px,8.8148vh);
	width:auto;
}
@media screen and (max-width:768px){
	.kv__inBtn-jf img {
		height:12.9vw;
	}
}
.kv__inBtn-jf a {
	display: block;
	transition:all 0.3s ease;
}
.kv__inBtn-jf a:hover {
	transform:scale(1.1);
}
.movie__swiper-slide .movieNum {
	display: flex;
}

.onair__to1st {
	margin:0 auto 100px;
	display: table;
}
@media screen and (max-width:768px){
	.onair__to1st {
		margin:0 auto 12.8vw;
	}
}
.onair__to1st a {
	display: flex;
	position: relative;
	justify-content: center;
	align-items: center;
	width:100%;
	height:50px;
	padding:0 36px;
	border-radius: 25px;
	background:var(--color-blue);
	transition: all 0.3s ease;
	text-decoration: none;
	font-size:22px;
}
@media screen and (max-width:768px){
	.onair__to1st a {
		height:9vw;
		border-radius: 5vw;
		font-size:4vw;
		padding:0 6vw;
	}
}
.onair__to1st a:hover {
	background:#000;
	color:var(--color-blue);
}
@media screen and (max-width:768px){
	.onair__to1st a:before {
		top:3vw;
		bottom:3vw;
	}
}