@charset "utf-8";
/*-----------------------------------------------
 * FIRSTVIEW
-------------------------------------------------*/
.firstview{
	width: 100%;
	position: relative;
}
.fv_visualWrap{
	width: 100%;
	position: relative;
}

/**
** VISUAL AREA
**/
.fv_visualArea{
	width: 100%;
	position: relative;
}


/*
* VISUAL CHANGE
*/
.visualChangeWrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 2;
}
.visualChangeLists{
	display: flex;
	justify-content: center;
	position: relative;
	z-index: 2;
}
.visualChangeList{
	padding: 0 4px;
	line-height: 1;
}
.btn_visualChange{
	display: inline-block;
	position: relative;
	padding: 8px 24px;
	line-height: 1;
	color: #FFF;
	font-family: var(--font-pagenini);
	transform: skewX(-25deg);
}
.btn_visualChange:before,
.btn_visualChange:after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--color-blue);
	pointer-events: auto;
}
.btn_visualChange:before{
	background-color: #959ea4;
}
.btn_visualChange:after{
    background: linear-gradient(var(--color-blue), var(--color-blue)) right center / 0 100% no-repeat;
    transition: background-size .35s ease;
}

.btn_visualChange.--is-active:after{
	background-position: left center;
	background-size: 100% 100%;
}
.btn_visualChange span{
	display: inline-block;
	position: relative;
	z-index: 2;
	transform: skewX(25deg);
}

/** hover **/
@media (hover: hover) and (pointer: fine){
	.btn_visualChange:hover::after{
		background-position: left center;
		background-size: 100% 100%;
	}
}


.visualChangeBarWrap{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background-color: #959ea4;
}
.visualChangeBar{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	height: 100%;
	background-color: var(--color-blue);
}

@media screen and (max-width: 767px){
	.visualChangeList{
		padding: 0 var(--sp-size-4);
	}
	.btn_visualChange{
		padding: var(--sp-size-8) var(--sp-size-20);
		letter-spacing: 0;
	}
	.visualChangeBarWrap{
		height: var(--sp-size-4);
	}
}


/*
* VISUAL IMAGE
*/
.visualImageWrap{
	width: 60%;/* 720 */
	margin: 0 auto;
	position: relative;
}
.visualImageList img{
	width: 100%;
}
@media screen and (max-width: 767px){
	.visualImageWrap{
		width: 82.9334%;/* 622 */
		padding-top: 12.8%;
	}
}


/**
** STICKY AREA
**/
.fv_stickyArea{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.fv_stickyCont{
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	height: min(100vh, 100%);
	min-height: 640px;
	z-index: 2;
	pointer-events: none;
}
.fv_sticky__visualFrame{
	width: 60%;/* 720 */
	margin: 0 auto;
	position: relative;
}

.fv_logo{
	position: absolute;
	top: 0;
	right: 0;
	margin-top: 64px;
	margin-right: calc(min(13.3334%, calc(96 / 640 * 100vh)) * -1);
	width: min(13.3334%, calc(96 / 640 * max(100vh, 640px)));/* 96 */
}
.fv_logo img{
	width: 100%;
}

.fv_onairText{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 64px;
	/*width: min(5.5556%, calc(40px * var(--max-persent)));*/
	width: min(5%, calc(40px * var(--max-persent)));
	padding: min(2.2223%, calc(16px * var(--max-persent))) min(1.1112%, calc(8px * var(--max-persent)));
	background: var(--gradient-180deg);
}
.fv_onairText img{
	width: 100%;
}


.fv_sticky__movieContWrap{
	position: absolute;
	bottom: 0;
	right: 0;
	width: 20%;
}
.fv_sticky__movieCont{
	content: '';
	width: 100%;
	margin: 0 10% 10% 0;
	position: absolute;
    bottom: 0;
    right: 0;
}
.fv_sticky__movieCont:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin-top: 10%;
	margin-left: 10%;
	background: var(--gradient-90deg);
}
.fv_sticky__movieIn{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.btn_fv_movie{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: auto;
	overflow: hidden;
	display: flex;
	align-content: center;
	justify-content: center;
}
.btn_fv_movie:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(110deg, rgba(62,58,57,1) 0%, rgba(99,150,201,1) 52%, rgba(169,210,241,1) 100%);
	opacity: 60%;
	transform: scale(110%);
	transition: .3s ease;
}
.btn_fv_movie:after{
	content: '';
	position: absolute;
	background: url(../img/top/movie_frame.svg) no-repeat center / contain;
	top: calc(2 / var(--def-ww) * 100vw);
	left: calc(2 / var(--def-ww) * 100vw);
	bottom: calc(2 / var(--def-ww) * 100vw);
	right: calc(2 / var(--def-ww) * 100vw);
}
.btn_fv_movie img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s ease;
}
.btn_fv_movie__play{
	width: min(30%, calc(72px * var(--max-persent)));/* 72 */
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: center
}
.btn_fv_movie__playIn{
	position: relative;
	width: 100%;
	padding-top: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.btn_fv_movie__playIn:before,
.btn_fv_movie__playIn:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-image: url(../img/top/movie_play__frame.svg);
	background-size: contain;
}
.btn_fv_movie__playIn:before{
	background-position: center top;
	animation: 8s ani_rotate__movIcon cubic-bezier(.22,-0.1,0,1.5) infinite;
}
.btn_fv_movie__playIn:after{
    transform: scale(-1, -1);
    background-position: center top;
	animation: 8s ani_rotate__movIcon_b cubic-bezier(.22,-0.1,0,1.5) infinite;
	animation-delay: 0.05s;
}
.btn_fv_movie__play_txt{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 12.5%;
	background: url(../img/top/movie_play__txt.svg) no-repeat center / contain;
	margin: auto;
}

@keyframes ani_rotate__movIcon {
	0%{transform: rotate(0deg);}
	90%,100%{transform:rotate(360deg)}
}
@keyframes ani_rotate__movIcon_b {
	0%{transform: rotate(0deg) scale(-1, -1);;}
	90%,100%{transform:rotate(360deg) scale(-1, -1);}
}

@media (hover: hover) and (pointer: fine){
	.btn_fv_movie:hover .btn_fv_movie__playIn:before,
	.btn_fv_movie:hover .btn_fv_movie__playIn:after{
		animation-play-state: paused;	
	}
	.btn_fv_movie:hover::before{
		opacity: 45%;
	}
}

@media screen and (max-width: 767px) {
	.fv_stickyCont{
		height: min(100dvh, 100%);
		min-height: unset;
	}
	.fv_sticky__visualFrame{
		width: 82.9334%;/* 622 */
	}
	.fv_logo{
		margin-top: min(16vw, 120px);
		width: var(--sp-size-96);/* 96 */
		margin-right: calc(var(--sp-size-48) * -1);/* 48 */
	}
	.fv_onairText{
		margin-top: min(16vw, 120px);
		width: var(--sp-size-40);
		margin-left: -3.2155%;/* -20 */
		padding: var(--sp-size-16) var(--sp-size-8);
	}
	.fv_sticky__movieContWrap{
		display: none;
	}
}


/**
* fv_infoWrap
**/
.fv_infoWrap{
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
.fv_infoInWrap{
	width: 60%;/* 720 */
	margin: 0 auto;
	position: relative;
}
.fv_onairInfoTxtWrap{
	margin-top: max(-2.2223%, calc(-16px * var(--max-persent)));/* -16 */
	text-align: center;
	display: block;
	text-align: center;
	position: relative;
}
.fv_onairInfoTxt{
	display: inline-block;
	padding: min(0.6667vw, calc(8px * var(--max-persent))) min(2vw, calc(24px * var(--max-persent)));
	line-height: 1;
	font-size: min(2.6667vw, calc(32px * var(--max-persent)));
	font-weight: 700;
	color: #FFF;
	transform: skewX(-25deg);
	background-color: #5b91c4;
}
.fv_onairInfoTxt::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(137deg, var(--gradient-color));
	opacity: 70%;
}
.fv_onairInfoTxt span{
	position: relative;
	z-index: 1;
	display: inline-block;
	transform: skewX(25deg);
}

.fv_aoexSeriesLists{
	display: flex;
	justify-content: center;
	margin-top: min(5.5556%, calc(40px * var(--max-persent)));/* 40 */
}
.fv_aoexSeriesList{
	width: min(48.8889%, calc(352px * var(--max-persent)));/* 352 */
	padding: 0 min(3.3334%, calc(24px * var(--max-persent)));/* 24 */
}
.fv_aoexSeriesList__title{
	width: 100%;
	text-align: center;
}
.fv_aoexSeriesList__title img{
	width: 100%;
}
.fv_aoexSeriesList__date{
	margin-top: 3.9474%;/* 12 */
	text-align: center;
}
.fv_aoexSeriesList__date span{
	display: inline-block;
	padding: min(0.6667vw, calc(8px * var(--max-persent))) min(1.3334vw, calc(16px * var(--max-persent)));
	text-align: center;
	background-color: #484849;
	line-height: 1;
	font-size: min(2vw, calc(24px * var(--max-persent)));/* 24 */
	color: #FFF;
}

@media screen and (max-width: 767px) {
	.fv_infoInWrap{
		width: 100%;
	}
	.fv_onairInfoTxtWrap{
		margin-top: calc(var(--sp-size-32) * -1);
	}
	.fv_onairInfoTxt{
		padding: var(--sp-size-16) var(--sp-size-32);
		font-size: var(--sp-size-32);
	}
	.fv_aoexSeriesLists{
		margin-top: var(--sp-size-32);
	}
	.fv_aoexSeriesList{
		width: 42.6667%;/* 320 */
		padding: 0 var(--sp-size-32);
	}
	.fv_aoexSeriesList__date{
		margin-top: var(--sp-size-24);
	}
	.fv_aoexSeriesList__date span{
		padding: var(--sp-size-12) var(--sp-size-8);
		font-size: var(--sp-size-24);
	}
}



/*-----------------------------------------------
 * MOVIE
-------------------------------------------------*/
#movie{
	padding-top: 200px;
}
.movieAreaWrap{
	width: 100%;
	/*padding-top: min(56.25%, 675px);*/
	padding: min(16%, 200px) 0;
	position: relative;
	overflow: hidden;
}
.movieAreaWrap:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(110deg, rgba(62, 58, 57, 1) 0%, rgba(99, 150, 201, 1) 52%, rgba(169, 210, 241, 1) 100%);
	opacity: 60%;
	z-index: 2;
}

.movieContent{
	position: relative;
	z-index: 3;
}
.btn_moviePlay{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
}
.btn_moviePlay:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(110deg, rgba(62, 58, 57, 1) 0%, rgba(99, 150, 201, 1) 52%, rgba(169, 210, 241, 1) 100%);
	opacity: 60%;
	transform: scale(110%);
}
.btn_moviePlay img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.btn_movie__play{
	width: min(17.6471%, 120px);
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: center
}

.btn_movie__playIn{
	position: relative;
	width: 100%;
	padding-top: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.btn_movie__playIn:before,
.btn_movie__playIn:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-image: url(../img/top/movie_play__frame.svg);
	background-size: contain;
}
.btn_movie__playIn:before{
	background-position: center top;
	animation: 8s ani_rotate__movIcon cubic-bezier(.22,-0.1,0,1.5) infinite;
}
.btn_movie__playIn:after{
    transform: scale(-1, -1);
    background-position: center top;
	animation: 8s ani_rotate__movIcon_b cubic-bezier(.22,-0.1,0,1.5) infinite;
	animation-delay: 0.05s;
}
.btn_movie__play_txt{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 12.5%;
	background: url(../img/top/movie_play__txt.svg) no-repeat center / contain;
	margin: auto;
}

.moviebg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	transform: scale(1.5);
}
.bg_ytplayer{
	position: absolute;
	top: -50%;
	left: -50%;
	width: 200%;
	height: 200%;
	transition: .3s ease .2s;
	pointer-events: none;
}
body.--yt-apmov-stop .bg_ytplayer{
	opacity: 0;
	transition-delay: 0s;
}

/*
@media (hover: hover) and (pointer: fine){
	.movieAreaWrap:hover .bg_ytplayer{
		opacity: 0;
	}
	.movieAreaWrap:hover .btn_movie__playIn:before,
	.movieAreaWrap:hover .btn_movie__playIn:after{
		animation-play-state: paused;
	}
}
*/

@media screen and (max-width: 767px) {
	#movie{
		padding-top: min(16%, 120px);
	}
	.movieAreaWrap{
		/*padding-top: 56.25%;*/
	}
	.btn_movie__play{
		width: min(16vw, 120px);
	}
	.moviebg{
		transform: unset;
	}
}

/*-----------------------------------------------
 * COMMON
-------------------------------------------------*/
.main{
	padding-bottom: 200px;
}
@media screen and (max-width: 767px){
	.main{
		padding-bottom: var(--sp-size-192);
	}
}


/**
* CONTENT
**/
.content{
	padding-top: 200px;
}

@media screen and (max-width: 767px) {
	.content{
		padding-top: min(16vw, 120px);
	}
}


/*-----------------------------------------------
 * NEWS
-------------------------------------------------*/
.newsLists{
	width: 100%;
}
.newsList{
	padding: 12px 0;
}
.newsList__link{
	width: 100%;
	padding: 12px 48px 12px 0;
	display: flex;
	align-items: center;
	text-decoration: none;
	position: relative;
}
.newsList__link:before,
.newsList__link:after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 2px;
}
.newsList__link:before{
	background-color: #777;
}
.newsList__link:after{
	background: linear-gradient(var(--color-blue), var(--color-blue)) right center / 0 100% no-repeat;
	transition: background-size .4s ease;
}

.newsList__link_arrow{
	position: absolute;
	top: 2px;
	right: 0;
	bottom: 0;
	width: 40px;
	height: 8px;
	margin: auto 0;
	-webkit-mask: url(../img/common/arrow_r.svg) no-repeat right bottom / cover;
	mask: url(../img/common/arrow_r.svg) no-repeat right bottom / cover;
	background-color: #2b2b2b;
	transition: transform .3s ease;
}
.newsList__link_arrow:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	background: linear-gradient(var(--color-blue), var(--color-blue)) right center/ 0 100% no-repeat;
	transition: background-size .3s ease .25s;
}


@media screen and (max-width: 767px) {
	.newsList{
		padding: var(--sp-size-16) 0;
	}
	.newsList__link{
		padding: var(--sp-size-16) 48px var(--sp-size-16) 0;
		flex-direction: column;
		align-items: unset;
	}
}


.newsDate{
	display: inline-flex;
	align-items: center;
	position: relative;
	font-family: var(--font-pagenini);
	flex-shrink: 0;
	padding-right: 32px;
}
.newsDate_y{
	display: inline-block;
	background-color: #484849;
	color: #FFF;
	font-size: 14px;
	line-height: 0.9091;
	writing-mode: vertical-rl;
	text-orientation: sideways;
	padding: 0.125em 0.2em 0.125em 0.03em;
	transition: background-color .3s ease;
}
.newsDate_md{
	display: inline-block;
	font-size: 36px;
	line-height: 0.9091;
	letter-spacing: 0;
	padding: 0 0.225em 0 0.225em;
	color: #2b2b2b;
	transition: color .3s ease;
}
.newsTitle__title{
	font-weight: 500;
	line-height: 2;
	color: #2b2b2b;
	transition: color .3s ease;
}

.newsList .newsTitle__title{
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

@media (hover: hover) and (pointer: fine){
	.newsList__link:hover::after,
	.newsList__link:hover .newsList__link_arrow:before{
		background-position: left center;
		background-size: 100% 100%;
	}
	.newsList__link:hover .newsDate_y{
		transition-delay: .2s;
		background-color: var(--color-blue);
	}
	.newsList__link:hover .newsDate_md,
	.newsList__link:hover .newsTitle__title{
		transition-delay: .225s;
		color: var(--color-blue);
	}
	.newsList__link:hover .newsList__link_arrow{
		transform: translateX(12.5%);
	}
}


@media screen and (max-width: 767px) {
	.newsDate{
		padding-right: 0;
		margin-bottom: var(--sp-size-12);
	}
	.newsDate_y{
		writing-mode: unset;
		text-orientation: unset;
		font-size: var(--sp-size-24);
		padding: 0;
		line-height: 1;
	}
	.newsDate_md{
		font-size: var(--sp-size-24);
		line-height: 1;
		padding-left: var(--sp-size-12);
	}
	.toMore{
		padding-left: var(--sp-size-16);
		padding-right: var(--sp-size-16);
	}
}


#news .toMore{
	text-align: right;
}

/* SCROLL ANI */
.content.js-scrani .newsList{
	opacity: 0;
	transform: translateY(50%);
	transition: .6s ease;
}
.content.js-scrani.is-ani .newsList{
	opacity: 1;
	transform: translateY(0%);
}
.content.js-scrani.is-ani .newsList:nth-of-type(1){
	transition-delay: .5s;
}
.content.js-scrani.is-ani .newsList:nth-of-type(2){
	transition-delay: .55s;
}
.content.js-scrani.is-ani .newsList:nth-of-type(3){
	transition-delay: .6s;
}

#news.content.js-scrani .toMore {
	opacity: 0;
	transform: translateX(-25px);
	transition: .3s ease .7s;
}
#news.content.js-scrani.is-ani .toMore{
	opacity: 1;
	transform: translateX(0%);
}

/*-----------------------------------------------
 * INTRODUCTION
-------------------------------------------------*/
#introduction > .cont_h2{
	position: relative;
	z-index: 2;
}
#introduction > .contentIn{
	width: 66.6667%;
	max-width: calc(800px * var(--max-persent));
	margin-top: -48px;
}
.introContWrap{
	width: 100%;
	position: relative;
	padding: 0 5%;
}
.introTextWrap{
	width: 100%;
	padding: 120px 11.1112% 80px;
	background-color: #fff;
	color: #2b2b2b;
	font-size: 20px;
	font-weight: 500;
	line-height: 2.4;
	position: relative;
}
.introTextWrap:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 32px;
	height: 2px;
	background: var(--gradient-90deg);
	margin: 72px auto 0;
}
.introText{
	width: 100%;
	display: inline-block;
	text-align: center;
	position: relative;
	z-index: 2;
	text-shadow: #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px, #FFF 0 0 5px;
}

@media screen and (max-width: 767px) {
	#introduction > .contentIn{
		width: 93.6%;/* 702 */
		margin-top: calc(var(--sp-size-80) * -1);
	}
	.introContWrap{
		padding: 0 var(--sp-size-24);
	}
	.introTextWrap{
		padding: min(16vw, 120px) var(--sp-size-48) var(--sp-size-192);
		font-size: var(--sp-size-24);
	}
	.introTextWrap:before{
		width: var(--sp-size-64);
		margin-top: var(--sp-size-80);
	}
}


/* introChara */
.introCharaWrap{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: none;
}
.introChara{
	position: absolute;
}
.introChara img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	position: absolute;
	top: 0;
	left: 0;
}
.introChara.-c1{
	width: 23.75%;/* 190 */
	padding-top: 51.5%;/* 412 */
	top: 0;
	left: 0;
	margin-top: 64px;
	margin-left: -6%;/* -48 */
}
.introChara.-c2{
	width: 35.25%;/* 282 */
	padding-top: 24.25%;/* 194 */
	top: 0;
	right: 0;
	margin-top: calc(25% + 64px);/* 264 */
	margin-right: -8%;/* -64 */
}
.introChara.-c3{
	width: 33.125%;/* 265 */
	padding-top: 34%;/* 272 */
	bottom: 0;
	left: 0;
	margin-bottom: 15%;/* 120 */
	margin-left: -12%;/* -96 */
}
.introChara.-c4{
	width: 29.25%;/* 234 */
	padding-top: 50.75%;/* 406 */
	bottom: 0;
	right: 0;
	margin-bottom: -12%;/* -96 */
	margin-right: -8%;/* -64 */
}

@media screen and (max-width: 767px) {
	.introChara.-c1{
		width: min(25.3334vw, 190px);
		padding-top: min(54.9334vw, 412px);
		margin-left: max(-3.2vw, -24px);
		margin-top: var(--sp-size-64);
		overflow: hidden;
	}
	.introChara.-c1 img{
		left: max(-4.8vw, -36px);
	}
	.introChara.-c2{
		width: min(37.6vw, 282px);
		padding-top: min(25.8667vw, 194px);
		margin-right: max(-3.2vw, -24px);
		margin-top: var(--sp-size-192);
		overflow: hidden;
	}
	.introChara.-c2 img{
		left: var(--sp-size-48);
	}
	.introChara.-c3{
		width: min(35.3334vw, 265px);
		padding-top: min(36.2667vw, 272px);
		margin-bottom: max(-16vw, -120px);
		margin-left: max(-7.4667vw, -56px);
	}
	.introChara.-c4{
		width: min(234px, 31.2vw);
		padding-top: min(54.1334vw, 406px);
		margin-bottom: max(-24vw, -180px);
		margin-right: max(-3.2vw, -24px);
		overflow: hidden;
	}
	.introChara.-c4 img{
		left: var(--sp-size-12);
	}
}

/* SCRANI */
.introText.js-scrani{
	opacity: 0;
	filter: blur(8px);
	transform: translateY(25px);
	transition: opacity .4s ease, filter .4s ease .15s, transform .4s ease .1s;
}
.introChara.js-scrani{
	opacity: 0;
	transform: scale(0.8);
	filter: blur(8px);
	transition: opacity .6s ease, filter .6s ease .15s, transform 1.2s ease;
}
.introText.js-scrani.is-ani,
.introChara.js-scrani.is-ani{
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0px);
}
/*-----------------------------------------------
 * #CHARACTER
-------------------------------------------------*/
#character{
	width: 100%;
}
#character .cont_h2 {
	margin-bottom: 80px;
}
@media screen and (max-width: 767px){
	#character .cont_h2 {
		margin-bottom: var(--sp-size-80)
	}
}
#character .contentIn{
	width: 100%;
	max-width: 100%;
	padding-top: 0;
}

/* contbg */
#character .contentbg{
	width: 100%;
	height: 320px;
	position: absolute;
    top: 0;
    z-index: -1;
	background: linear-gradient(0deg, rgba(169, 210, 240, 1) 0%, rgba(255, 255, 255, 1) 100%);
}
@media screen and (max-width: 767px){
	#character .contentbg{
		height: min(53.3334vw, 400px);
	}
}
.contentbg:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-gradation-blue);
    opacity: 40%;
}

/* charaCont */
.characterCont{
	width: 100%;
	display: flex;
}

/* charamain */
.characterMainWrap{
	width: 63.3333%; /* 760px */
	margin-left: 16.6667%; /* 200px */
	transform: scale(1.05);
	transition: transform 1s ease;
}
.content.is-ani .characterMainWrap{
	transition-delay: .8s;
	transform: scale(1);
}
.character_mainList{
	width: 100%;
	display: flex;
	opacity: 0!important;
	transition: .2s ease;
}
.character_mainList.swiper-slide-active{
	opacity: 1!important;
	transition-delay: .1s;
}
.character_mainImage,
.character_mainText{
	width: 50%;
	opacity: 0;
	transition: .6s ease .15s;
}
.character_mainImage{
	transform: translateX(15%);
}
.character_mainText{
	transform: translateX(-15%);
}
.character_mainList.swiper-slide-active .character_mainImage,
.character_mainList.swiper-slide-active .character_mainText{
	opacity: 1;
	transform: translateX(0%);
}


.character_mainImageIn{
	width: 100%;
	text-align: center;
}
.character_mainImageIn img{
	width: 100%;
	max-width: 400px;
}

.character_mainText{
	padding-top: 120px;
	transition: .4s ease .15s;
}
.character_name{
	font-size: 40px;
	font-weight: 500;
	line-height: 1;
}
.character_cv{
	margin-top: 24px;
	display: flex;
	align-items: center;
	line-height: 1;
	font-size: 20px;
}
.character_cv span.narrow{
	width: auto;
	font-size: 16px;
	font-weight: 700;
	line-height: 0.8;
	background-color: #000;
	color: #fff;
	margin-top: 0.25em;
	margin-right: calc(0.75em * 0.8);
}
.character_detail{
	margin-top: 32px;
	font-size: 16px;
	line-height: 2;
}

@media screen and (max-width: 767px){
	.characterMainWrap{
		width: 73.3334%; /* 550px */
		margin-left: 0;
	}
	.character_mainList{
		flex-direction: column;
	}
	.character_mainImage{
		width: min(87.2728%, 480px);
		margin-left: var(--sp-size-64);
	}
	.character_mainText{
		width: 100%;
		padding-left: var(--sp-size-48);
	}
	.character_mainImageIn img{
		max-width: 100%;
	}
	.character_mainText{
		margin-top: -44.6216%; /* -224px */
	}
	.character_name{
		font-size: var(--sp-size-48);	
		text-shadow: 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff;	
	}
	.character_cv{
		margin-top: var(--sp-size-24);
		font-size: var(--sp-size-24);
	}
	.character_cv span.narrow{
		font-size: var(--sp-size-20);
	}
	.character_cv span.narrowIn{
		text-shadow: 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff;	
	}
	.character_detail{
		margin-top: var(--sp-size-40);
		font-size: var(--sp-size-24);
		text-shadow: 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff, 0px 0px var(--sp-size-8) #fff;	
	}
}


/* charaThumb */
.characterThumbWrap{
	width: 20%; /* 240px */
	padding-top: 80px;
}
.swiper-pagination-bullets.swiper-pagination-horizontal.characterThumbLists{
	width: min(70%, 168px); /* 168px */
	display: grid;
	gap: min(0.6667vw, 8px);
	grid-template-columns: repeat(2, 1fr);
	margin: 0 auto;
}
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.characterThumbList{
	width: 100%;
	padding-top: 100%;
	position: relative;
	opacity: 1;
	margin: unset;
}
.characterThumb{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	transition: .3s ease;
	overflow: hidden;
}
.swiper-pagination-bullet-active .characterThumb{
	background-color: var(--color-light-blue);
}
.characterThumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s ease;
}
.characterThumb:hover img{
	transform: scale(1.1);
}
.swiper-pagination-bullet-active .characterThumb img{
	transform: scale(1.05);
}
.characterThumb:after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	-webkit-mask: url(../img/top/character_thumbframe.svg) no-repeat center / cover;
	mask: url(../img/top/character_thumbframe.svg) no-repeat center / cover;
	background-color: #000;
	transition: .3s ease;
}
.swiper-pagination-bullet-active .characterThumb:after{
	background-color: #fff;
}

@media screen and (max-width: 767px){
	.characterThumbWrap{
		padding-top: var(--sp-size-96);
		width: 26.6666%; /* 200px */
	}
	.swiper-pagination-bullets.swiper-pagination-horizontal.characterThumbLists{
		width: 100%;
		gap: var(--sp-size-8);
	}
}


/*
* Scroll Animation
*/
/* contbg */
#character .contentbg{
	width: 0%;
}
#character.content.is-ani .contentbg{
	width: 100%;
}


/*-----------------------------------------------
 * MUSIC
-------------------------------------------------*/
#music > .contentIn{
	width: 100%;
	max-width: 100%;
	padding-top: 24px;
}

.musicCont{
	width: 66.6667%;
	max-width: calc(800px * var(--max-persent));
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
.musicLists{
	width: 100%;
	display: flex;
	justify-content: center;
}
.musicList{
	width: 50%;
	padding: 0 3%;
}
.musicList__link{
	display: block;
	text-decoration: none;
}
.musicList__img{
	width: 100%;
	padding-top: 100%;
	position: relative;
	margin-bottom: 24px;
	overflow: hidden;
}
.musicList__img img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s ease;
}
.music_genre{
	font-family: var(--font-pagenini);
	line-height: 1;
	font-size: 26px;
	text-align: center;
	margin-bottom: 20px;
	color: var(--color-gray);
}
.music_artist{
	font-size: 20px;
	font-weight: 700;
	text-align: center;
	color: var(--color-blue);
	margin-bottom: 12px;
	line-height: 1;
}
.music_title{
	font-size: 20px;
	text-align: center;
	color: var(--color-gray);
}

.music_arrow{
	margin-top: 32px;
}
.music_arrowIcon{
	width: 40px;
	height: 8px;
	margin-left: auto;
	position: relative;
	-webkit-mask: url(../img/common/arrow_r.svg) no-repeat right bottom / cover;
	mask: url(../img/common/arrow_r.svg) no-repeat right bottom / cover;
	background-color: #2b2b2b;
	transition: transform .3s ease;
}
.music_arrowIcon:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	background: linear-gradient(var(--color-blue), var(--color-blue)) right center/ 0 100% no-repeat;
	transition: background-size .3s ease;
}
@media (hover: hover) and (pointer: fine){
	.musicList__link:hover .musicList__img img{
		transform: scale(1.1) rotate(4deg);
	}
	.musicList__link:hover .music_arrowIcon{
		transform: translateX(12.5%);
	}
	.musicList__link:hover .music_arrowIcon:before{
		background-position: left center;
		background-size: 100% 100%;
	}
}

@media screen and (max-width: 767px) {
	#music > .contentIn{
		padding-top: var(--sp-size-24);
	}
	.musicCont{
		width: 93.6%;
		max-width: 100%;
	}
	.musicList{
		padding: 0 3.4189%;
	}
	.musicList__img{
		margin-bottom: var(--sp-size-24);
	}
	.music_genre{
		font-size: var(--sp-size-32);
	}
	.music_artist{
		font-size: var(--sp-size-26);
		margin-bottom: var(--sp-size-16);
	}
	.music_title{
		font-size: var(--sp-size-24);
	}
	.music_arrow{
		margin-top: var(--sp-size-32);
	}
}

.musicBGWrap{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	padding-top: min(29.3334% ,calc(352px * var(--max-persent)));
	display: flex;
	align-items: center;
	margin-top: 24px;
}
.musicBG{
	width: 100%;
	height: 62.5%;
	margin: auto 0;
	background: var(--gradient-90deg) right center/ 0 100% no-repeat;
	transition: background-size .4s ease .6s;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
#music.is-ani .musicBG{
	background-position: left center;
	background-size: 100% 100%;
}
@media screen and (max-width: 767px) {
	.musicBGWrap{
		padding-top: calc(303 / var(--def-ww) * 100vw);
	}
}


/** SCRANI **/
#music.content.js-scrani .musicList__img{
	transform: scale(0.9);
	opacity: 0;
	filter: blur(8px);
	transition: opacity .6s ease .6s, transform .8s ease .6s, filter .6s ease 1s;
}
.music_genre,
.music_artist,
.music_title,
.music_arrow{
	opacity: 0;
	transition: .6s ease .8s;
}
#music.content.js-scrani.is-ani .musicList__img{
	transform: scale(1);
	opacity: 1;
	filter: blur(0px);
}
#music.content.js-scrani.is-ani .music_genre,
#music.content.js-scrani.is-ani .music_artist,
#music.content.js-scrani.is-ani .music_title,
#music.content.js-scrani.is-ani .music_arrow{
	opacity: 1;
}



/*-----------------------------------------------
 * LOADING
-------------------------------------------------*/
#tloading{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #f0f3f4 url(../img/common/bg.png) no-repeat center / cover;
	z-index: 10000;
}
.tloading__logoWrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: .3s ease;
}
.tloading__logo{
	width: min(16.6667%, 320px);
	opacity: 0;
	animation: ldglogoopacity .8s ease .2s forwards;
	transition: .3s ease;
}
.tloading__logo img{
	width: 100%;
	animation: ldglogolight 2s linear infinite;
}
@keyframes ldglogoopacity {
	0%{opacity: 0;filter: blur(8px);}
	100%{opacity: 100%;filter: blur(0);}
}
@keyframes ldglogolight {
	0%,50%,100%{
		filter:brightness(100%);
	}
	20%,40%,60%,80%{
		filter:brightness(110%);
	}
	30%,70%{
		filter: brightness(90%);
	}
}
@media screen and (max-width: 767px){
	.tloading__logo{
		width: 42.6667%;
	}
}


.tloading__image{
	width: 100%;
	height: 100%;
	transition: width 3.2s ease;
	position: relative;
	margin: 0 auto;
	overflow: hidden;
}
.tloading__image_layer{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-repeat: no-repeat;
	background-size: cover;
	opacity: 0;
	background-position: center 100%;
	transition: background-position 1.6s ease, opacity .4s ease;
}
.tloading__image_layer.-ldg_visual1_layer0{
	background-image: url(../img/top/visual/loading_visual1_layer0.png);
}
.tloading__image_layer.-ldg_visual1_layer1{
	transform: scale(1.1);
	filter: blur(4px);
	background-image: url(../img/top/visual/loading_visual1_layer1.png);
	transition: background-position 1.6s ease, opacity .4s ease, transform .8s ease, filter .6s ease;
}
.tloading__image_layer.-ldg_visual1_layer2{
	transform: scale(1.2);
	filter: blur(4px);
	background-image: url(../img/top/visual/loading_visual1_layer2.png);
	transition: background-position 1.6s ease, opacity .4s ease, transform .4s ease, filter .6s ease;
}


/* a0 */
#tloading.-a0 .tloading__logoWrap{
	opacity: 0;
}

/* a1 */
#tloading.-a1 .tloading__logo{
	animation-play-state: paused;
}
#tloading.-a1 .tloading__logo img{
	animation-play-state: paused;
}
#tloading.-a1 .tloading__image_layer{
	background-position: center 0%;
}
#tloading.-a1 .tloading__image_layer.-ldg_visual1_layer0{
	opacity: 1;
}

@media (orientation: landscape){
	.tloading__imageWrap{
		width: 100%;
		height: 100%;
		position: relative;
	}

	/* a2 */
	#tloading.-a2 .tloading__image{
		width: 60%;
	}

	/* a3 */
	#tloading.-a3 .tloading__image_layer.-ldg_visual1_layer1{
		transform: scale(1);
		filter: blur(0px);
		opacity: 1;
	}

	/* a4 */
	#tloading.-a4 .tloading__image_layer{
		background-position: center 100%;
		transition-duration: 2.4s;
	}
	#tloading.-a4 .tloading__image_layer.-ldg_visual1_layer2{
		transition: background-position 2.4s ease, opacity 1.2s ease, transform 1.2s ease, filter 1.6s ease;
	}

	/* a5 */
	#tloading.-a5 .tloading__image_layer.-ldg_visual1_layer2{
		transform: scale(1);
		filter: blur(0px);
		opacity: 1;
	}
}


/* 縦画面 */
@media (orientation: portrait){
	.tloading__imageWrap{
		width: 140%;
		height: 100%;
		position: relative;
		margin-left: -20%;
		margin-top: 0;
	}
	.tloading__image{
		transition: width 3.2s ease, height 3.2s ease, margin-top 3.2s ease;
	}

	/* a2 */
	#tloading.-a2 .tloading__image{
		width: 82.9334vw;/* 622 */
		height: 117.2vw;/* 879 */
		margin-top: 12.8vw;/* 96  */
	}

	/* a3 */
	#tloading.-a3 .tloading__image_layer.-ldg_visual1_layer1{
		transform: scale(1);
		filter: blur(0px);
		opacity: 1;
	}

	/* a4 */
	#tloading.-a4 .tloading__image_layer{
		background-position: center 100%;
		transition-duration: 2.4s;
	}
	#tloading.-a4 .tloading__image_layer.-ldg_visual1_layer2{
		transition: background-position 2.4s ease, opacity 1.2s ease, transform 1.2s ease, filter 1.6s ease;
	}

	/* a5 */
	#tloading.-a5 .tloading__image_layer.-ldg_visual1_layer2{
		transform: scale(1);
		filter: blur(0px);
		opacity: 1;
	}
}
/*movie*/

/* MOVIE */
.movieList{
	width: 56.6667%;
    max-width: calc(680px* 1.6);
	padding: 0;
	position: relative;
	margin: 0 3.3334%;
	
}
.movieListIn{
	width: 100%;
	padding-top: 56.25%;
	position: relative;
	transition: .3s ease;
}

.js-movieSwiper.-runSwiper .movieListIn{
	transform: scale(80%);
	position: relative;
	filter: grayscale(100%);
	overflow: hidden;
	background: #FFF;

}
.movieList.swiper-slide-prev .movieListIn{
	transform: scale(80%);
	transform-origin: right center;
	z-index: 1;
	position: relative;
}
.movieList .movieListIn .btn_movieList__img{
	opacity: 0.6;
}
.movieList.swiper-slide-active .movieListIn{
	filter: grayscale(0%);
}
.movieList.swiper-slide-active .movieListIn .btn_movieList__img{
	opacity: 1;
}
.movieList.swiper-slide-active .movieListIn {
	transform: scale(100%);
	transform-origin: center center;
}
.movieList.swiper-slide-next .movieListIn {
	transform: scale(80%);
	transform-origin: left center;
}

.btn_movieList{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: .3s ease;
}
.btn_movieList:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: var(--color-blue);
	mix-blend-mode: hard-light;
	z-index: 2;
}
.btn_movieList__img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.btn_movieList__img img{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s ease .225s;
}
.movieTitle{
	text-align: center;
	display: inline-block;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 3;
	margin: auto;
	margin-top: 38%;
	font-family: var(--font-serif);
	font-size: 16px;
	color: #FFF;
	pointer-events: none;
}
.btn_movieList__img:after{
	content: '';
	position: absolute;
	background: url(../img/top/movie_frame.svg) no-repeat center / contain;
	top: calc(6 / var(--def-ww) * 100vw);
	left: calc(6 / var(--def-ww) * 100vw);
	bottom: calc(6 / var(--def-ww) * 100vw);
	right: calc(6 / var(--def-ww) * 100vw);
	z-index: 3;
	pointer-events: none;
}

@media screen and (max-width: 767px){
	.movieList{
		width: 80.8%; /* 606px */
	}
	.movieTitle{
		font-size: var(--sp-size-24);
	}
}
.btn_moviePlay::before {
	transition: opacity .4s ease;
}

@media (hover: hover) and (pointer: fine) {
    .btn_moviePlay:hover::before {
        opacity: 45%;
    }
}
#movie .toMore {
	text-align: center;
	z-index: 2;
}
/* ONAIR */
#onair {
	padding-bottom:min(calc(80 / var(--def-ww) * 100vw),80px);
}
@media screen and (max-width:768px){
	#onair {
		padding-top:min(calc(160 / var(--def-ww) * 100vw),160px);
	}
}
#onair .contentIn {
	padding-top:min(calc(50 / var(--def-ww) * 100vw),50px);
}
#onair .contentIn:not(:last-child) {
	margin-bottom:min(calc(50 / var(--def-ww) * 100vw),50px);
}
#onair .cont_h3 {
	position: relative;
	display: flex;
	align-items: center;
}
#onair .cont_h3:before {
	content: '';
	display: block;
	height: 2px;
	margin-right:min(calc(50 / var(--def-ww) * 100vw),50px);
	background: var(--gradient-90deg);
	width:min(calc(40 / var(--def-ww) * 100vw),40px);
}
@media screen and (max-width:768px){
	#onair .cont_h3:before {
		display: none;
	}
}
#onair .cont_h3:after {
	content: '';
	display: block;
	height: 2px;
	margin-left:min(calc(50 / var(--def-ww) * 100vw),50px);
	background: var(--gradient-270deg);
	flex:1;
}
@media screen and (max-width:768px){
	#onair .cont_h3:after {
		margin-left:min(calc(32 / var(--def-ww) * 100vw),32px);
		background: var(--gradient-270deg);
		flex:1;
	}
}
.onair__catch {
	font-size:min(calc(28 / var(--def-ww) * 100vw),28px);
	text-align: center;
	padding:min(calc(48 / var(--def-ww) * 100vw),48px) 0;
	letter-spacing: 0.12em;
	font-weight: 700;
}
@media screen and (max-width:768px){
	.onair__catch {
		font-size:min(calc(38 / var(--def-ww) * 100vw),38px);
		padding:min(calc(32 / var(--def-ww) * 100vw),32px) 0;
	}
}
.onair__lists {
	padding:0 min(calc(100 / var(--def-ww) * 100vw),100px);
}
@media screen and (max-width:768px){
	.onair__lists {
		padding:0;
	}
}
.onair__list {
	padding:1.5em 0;
	border-bottom:1px solid var(--color-blue);
	display: flex;
	font-size:min(calc(20 / var(--def-ww) * 100vw),20px);
}
@media screen and (max-width:768px){
	.onair__list {
		padding:1.2em 0;
		display: block;
		font-size:min(calc(28 / var(--def-ww) * 100vw),28px);
	}
}
.onair__listBC {
	width:min(calc(240 / var(--def-ww) * 100vw),240px);
	font-weight: 700;
	color:var(--color-blue);
	letter-spacing: 0.12em;
}
@media screen and (max-width:768px){
	.onair__listBC {
		width:100%;
	}
}
.onair__listTM {
	flex:1;
	letter-spacing: 0.12em;
}
@media screen and (max-width:768px){
	.onair__listTM {
		width:100%;
	}
}
.onair__caution {
	padding:1em min(calc(100 / var(--def-ww) * 100vw),100px) 0;
}
@media screen and (max-width:768px){
	.onair__caution {
		padding:1em 0 0;
		padding-left:1em;
		text-indent: -1em;
	}
}

/*streaming*/
.streamingListWrap:first-child{
	margin-top: min(calc(30 / var(--def-ww)* 100vw), 30px);
}
.streamingListWrap:not(:last-child){
	margin-bottom: min(calc(60 / var(--def-ww) * 100vw),60px);
}
.streamingList__text{
	margin-bottom: min(calc(20 / var(--def-ww) * 100vw),20px);
	font-weight: 700;
    color: #FFF;
    letter-spacing: 0.12em;
	font-size: min(calc(20 / var(--def-ww) * 100vw),20px);
	background: var(--gradient-90deg);
	padding: 0 min(calc(10 / var(--def-ww) * 100vw),10px);
}
@media screen and (max-width:768px){
	.streamingList__text{
		font-size: min(calc(24 / var(--def-ww) * 100vw),24px);
	}
}
.streamingList{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.streamingList__item{
	position: relative;
	width: calc((100% - 60px) / 3);
}
.streamingList__item:not(:nth-child(3n)){
	margin-right: 30px;
}
@media screen and (max-width:768px){
	.streamingList{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.streamingList__item{
		position: relative;
		width: calc((100% - calc(20 / var(--def-ww) * 100vw)) / 2);
	}
	.streamingList__item:not(:nth-child(3n)){
		margin-right: 0;
	}
}
.streaming__link{
	width: 100%;
	padding: min(calc(20 / var(--def-ww) * 100vw),20px) min(calc(28 / var(--def-ww) * 100vw),28px) min(calc(20 / var(--def-ww) * 100vw),20px) 0;
	display: flex;
	align-items: center;
	text-decoration: none;
	position: relative;
	height: 100%;
	line-height: 1.3;
}
.streaming__link:before,
.streaming__link:after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 1px;
}
.streaming__link:before{
	background-color: #777;
}
.streaming__link:after{
	background: linear-gradient(var(--color-blue), var(--color-blue)) right center / 0 100% no-repeat;
	transition: background-size .4s ease;
}

.streaming__link_arrow{
	position: absolute;
	top: 2px;
	right: 0;
	bottom: 0;
	width: 20px;
    height: 4px;
	margin: auto 0;
	-webkit-mask: url(../img/common/arrow_r.svg) no-repeat right bottom / cover;
	mask: url(../img/common/arrow_r.svg) no-repeat right bottom / cover;
	background-color: #2b2b2b;
	transition: transform .3s ease;
}
.streaming__link_arrow:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	background: linear-gradient(var(--color-blue), var(--color-blue)) right center/ 0 100% no-repeat;
	transition: background-size .3s ease .25s;
}
.streaming__name{
	transition: all .3s ease;
	font-size: min(calc(20 / var(--def-ww) * 100vw),20px);
}
@media (hover: hover) and (pointer: fine){
	.streaming__link:hover::after,
	.streaming__link:hover .streaming__link_arrow:before{
		background-position: left center;
		background-size: 100% 100%;
	}

	.streaming__link:hover .streaming__name{
		transition-delay: .225s;
		color: var(--color-blue);
	}
	.streaming__link:hover .streaming__link_arrow{
		transform: translateX(12.5%);
	}
}



/**/
.onair_ondmandLists{
	display: grid;
    gap: min(0.6667vw, 8px);
	grid-template-columns: repeat(4, 1fr);
}
@media screen and (max-width:768px){
	.onair_ondmandLists{
		grid-template-columns: repeat(2, 2fr);
	}
}
.onair_ondmandList{
	position: relative;
	padding: min(calc(6 / var(--def-ww) * 100vw),6px);
}
.onair_ondmandList:before,
.onair_ondmandList:after,
.onair_ondmandList__linkline:before,
.onair_ondmandList__linkline:after{
	content: '';
	position: absolute;
	background-color: var(--color-light-blue);
}
.onair_ondmandList:before{
	width: 100%;
	height: min(calc(2 / var(--def-ww) * 100vw),2px);
	top: min(calc(4 / var(--def-ww) * 100vw),4px);
	left: 0;
	right: 0;
}
.onair_ondmandList:after{
	width: 100%;
	height: min(calc(2 / var(--def-ww) * 100vw),2px);
	bottom: min(calc(4 / var(--def-ww) * 100vw),4px);
	left: 0;
	right: 0;
}
.onair_ondmandList__linkline:before{
	width: min(calc(2 / var(--def-ww) * 100vw),2px);
	height: 100%;
	left: min(calc(4 / var(--def-ww) * 100vw),4px);
	top: 0;
	bottom: 0;
}
.onair_ondmandList__linkline:after{
	width: min(calc(2 / var(--def-ww) * 100vw),2px);
	height: 100%;
	right:min(calc(4 / var(--def-ww) * 100vw),4px);
	top: 0;
	bottom: 0;
}
.onair_ondmandList__link{
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: min(calc(20 / var(--def-ww) * 100vw),20px) 0;
	font-size: min(calc(16 / var(--def-ww) * 100vw),16px);
	text-align: center;
	text-decoration: none;
    transition: background-color .3s ease, color .3s ease, filter .4s ease .6s;
}
.onair_ondmandList__linktxt{
	width: 100%;
	display: block;
	padding: 0 min(calc(10 / var(--def-ww) * 100vw),10px);
	padding-bottom: min(calc(20 / var(--def-ww) * 100vw),20px);
	position: relative;
	line-height: 1.6;
}
@media screen and (max-width:768px){
	.onair_ondmandList__link{
		padding:min(calc(10 / var(--def-ww) * 100vw),10px);
	}
	.onair_ondmandList__linktxt{
		padding-bottom: 0;
	}
}

.onair_ondmandList__linktxt:after{
	content: '';
	position: absolute;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	-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;
    transition: .3s ease;
    background-color:var(--color-light-blue);
}
@media screen and (max-width:768px){
	.onair_ondmandList__linktxt:after{
		right: 0;
		left: unset;
		bottom: 0;
		top: 0;
		margin: auto;
		width: 2vw;
        height: 3vw;
	}
}
.onair_ondmandList__link:hover{
	background-color: var(--color-light-blue);
	color: #000;
}
.onair_ondmandList__link:hover .onair_ondmandList__linktxt:after{
	background-color: #000;
}
.onair_ondmandList__year{
	font-size: 80%;
}

/* SCROLL ANI */
.content.js-scrani .newsList{
	opacity: 0;
	transform: translateY(50%);
	transition: .6s ease;
}
.content.js-scrani.is-ani .newsList{
	opacity: 1;
	transform: translateY(0%);
}
.content.js-scrani.is-ani .newsList:nth-of-type(1){
	transition-delay: .5s;
}
.content.js-scrani.is-ani .newsList:nth-of-type(2){
	transition-delay: .55s;
}
.content.js-scrani.is-ani .newsList:nth-of-type(3){
	transition-delay: .6s;
}

#news.content.js-scrani .toMore {
	opacity: 0;
	transform: translateX(-25px);
	transition: .3s ease .7s;
}
#news.content.js-scrani.is-ani .toMore{
	opacity: 1;
	transform: translateX(0%);
}



/*-----------------------------------------------
 * STAFFCAST
-------------------------------------------------*/
@media screen and (max-width:768px){
	#staffcast {
		padding-top:min(calc(160 / var(--def-ww) * 100vw),160px);
	}
}
#staffcast .contentIn {
	padding-top:min(calc(50 / var(--def-ww) * 100vw),50px);
}
#staffcast .contentIn:not(:last-child) {
	margin-bottom:min(calc(50 / var(--def-ww) * 100vw),50px);
}
#staffcast .cont_h3 {
	position: relative;
	display: flex;
	align-items: center;
}
#staffcast .cont_h3:before {
	content: '';
	display: block;
	height: 2px;
	margin-right:min(calc(50 / var(--def-ww) * 100vw),50px);
	background: var(--gradient-90deg);
	width:min(calc(40 / var(--def-ww) * 100vw),40px);
}
@media screen and (max-width:768px){
	#staffcast .cont_h3:before {
		display: none;
	}
}
#staffcast .cont_h3:after {
	content: '';
	display: block;
	height: 2px;
	margin-left:min(calc(50 / var(--def-ww) * 100vw),50px);
	background: var(--gradient-270deg);
	flex:1;
}
@media screen and (max-width:768px){
	#staffcast .cont_h3:after {
		margin-left:min(calc(32 / var(--def-ww) * 100vw),32px);
		background: var(--gradient-270deg);
		flex:1;
	}
}

/* LIST */
.staffcastLists{
	display: flex;
	flex-wrap: wrap;
}
.staffcastList{
	width: 50%;
	padding: 8px 16px;
	line-height: 2;
}
.staffcastList:nth-child(odd){
	padding-left: 32px;
}
.staffcastList:nth-child(even){
	padding-left: 48px;
}
.staffcastList dt{
	font-weight: 700;
	color: var(--color-blue);
}
.staffcastList > dd{
	font-size: 18px;
}
.staffcastList > dd.-flex{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
}

@media screen and (max-width: 767px){
	.staffcastList{
		padding: var(--sp-size-12) var(--sp-size-16);
	}
	.staffcastList:nth-child(odd){
		padding-left: 0;
	}
	.staffcastList:nth-child(even){
		padding-left: var(--sp-size-16);
		padding-right: 0;
	}
	.staffcastList > dt{
		font-size: var(--sp-size-20);
	}
	.staffcastList > dd{
		font-size: var(--sp-size-24);
	}
}


/* scrollAni */
.content.js-scrani .cont_h3{
	opacity: 0;
	transition: .4s ease .4s;
}
.staffcastLists{
	opacity: 0;
	filter: blur(8px);
	transition: opacity .4s ease, filter .4s ease .15s;
}

.content.js-scrani.is-ani .cont_h3{
	opacity: 1;
}

.contentIn.is-ani .staffcastLists{
	opacity: 1;
	filter: blur(0px);
}



/*-----------------------------------------------
 * FIXED - BANNER
-------------------------------------------------*/
.fixed_bannerWrap{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: none;
	opacity: 0;
	transition: .6s ease .6s;
	z-index: 2;
}
body.is-loaded .fixed_bannerWrap{
	opacity: 1;
}
.fixed_bannerInWrap{
	position: sticky;
	top: 0;
	width: 100%;
	height: min(100vh, 100%);
    height: min(100dvh, 100%);
}
.fixed_banner{
	position: absolute;
	bottom: 0;
	right: 0;
	margin-right: min(2.6667%, 32px);
	margin-bottom: min(2.6667%, 32px);
	width: min(16.6667%, 200px);
	border-radius: 50%;
}
.fixed_banner a{
	width: 100%;
	display: block;
	transition: .3s ease;
	border-radius: 50%;
	border: 1px solid var(--color-blue);
	overflow: hidden;
}
.fixed_banner a img{
	width: 100%;
	pointer-events: auto;
}
@media (hover: hover) and (pointer: fine){
	.fixed_banner a:hover {
		filter: brightness(150%);
	}
}

@media screen and (max-width: 767px){
	.fixed_banner{
		width: min(32vw, 240px);
		margin-bottom: var(--sp-size-24);
		margin-right: unset;
		margin-left: var(--sp-size-24);
		right: unset;
		left: 0;
	}
}