@charset "utf-8";
/*--------------------------------------------------
* common
* header
* introduction
* Nav Tab
* comics
* official
* animation
---------------------------------------------------*/
/*--------------------------------------------------
* common
---------------------------------------------------*/
body {
	background: #FFF;
	color: #000;
}
#fullWrap {
	overflow: hidden;
	overflow: clip;
	position: relative;
}
.m-content {
	position: relative;
}
/*
* section title
*/
.cont-title {
   font-size: min(calc(24 / var(--vw-min) * 100vw), 24px);
   font-weight: bold;
   letter-spacing: 0.1em;
   height: min(calc(100 / var(--vw-min)* 100vw), 100px);
   display: flex;
   justify-content: center;
   align-items: center;
}
@media screen and (max-width:768px){
	.cont-title {
		font-size: calc(50 / var(--vw-min) * 100vw);
		height: calc(102 / var(--vw-min)* 100vw);
	 }
	 .cont-title.is-font28 {
		font-size: calc(28 / var(--vw-min) * 100vw);
	 }
}
.cont-titleIn {
	line-height: 1;
	display: inline-block;
	padding: min(calc(12 / var(--vw-min) * 100vw), 12px) min(calc(8 / var(--vw-min) * 100vw), 8px);
}
.cont-title.is-bgYellow .cont-titleIn,
#oModalBox .cont-title.is-bgYellow .cont-titleIn{
	color: #000;
	background-color: var(--color-yellow);
}
@media screen and (max-width:768px){
	.cont-titleIn {
		padding: calc(5 / var(--vw-min) * 100vw) calc(10 / var(--vw-min) * 100vw);
	}
}
/*
* section title bg
*/
.cont-titleBg {
	width: 100%;
	height: min(calc(100 / var(--vw-min)* 100vw), 100px);
	position: absolute;
	top: 0;
	z-index: -1;
}
@media screen and (max-width:768px){
	.cont-titleBg {
		height: min(calc(102 / var(--vw-min)* 100vw), 102px);
	}
}
.cont-titleBg::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
}
.cont-titleBg::before {
	-webkit-mask: url(../img/common/tit_comment.svg) repeat-x center left;
	mask: url(../img/common/tit_comment.svg) repeat-x center left;
	-webkit-mask-size: min(calc(731 / var(--vw-min) * 100vw), 731px) min(calc(100 / var(--vw-min) * 100vw), 102px);
	mask-size:min(calc(731 / var(--vw-min) * 100vw), 731px) min(calc(100 / var(--vw-min) * 100vw), 102px);
	animation: titTextScr 14.62s linear reverse infinite;
}
.cont-titleBg.-staff::before{
	-webkit-mask-image: url(../img/common/tit_comment_staff.svg);
	mask-image: url(../img/common/tit_comment_staff.svg);
	-webkit-mask-size: min(calc(809 / var(--vw-min) * 100vw), 809px) min(calc(100 / var(--vw-min) * 100vw), 102px);
	mask-size: min(calc(809 / var(--vw-min) * 100vw), 809px) min(calc(100 / var(--vw-min) * 100vw), 102px);
	animation: titTextScr_staff 16.18s linear reverse infinite;
}
.cont-titleBg.-ltr:before {
	animation-direction: normal;
}
@keyframes titTextScr {
	0% {
		-webkit-mask-position: 0 0;
		mask-position: 0 0;
	}
	100% {
		-webkit-mask-position: min(calc(731 / var(--vw-min) * 100vw), 731px) 0;
		mask-position: min(calc(731 / var(--vw-min) * 100vw), 731px) 0;
	}
}
@keyframes titTextScr_staff {
	0% {
		-webkit-mask-position: 0 0;
		mask-position: 0 0;
	}
	100% {
		-webkit-mask-position: min(calc(809 / var(--vw-min) * 100vw), 809px) 0;
		mask-position: min(calc(809 / var(--vw-min) * 100vw), 809px) 0;
	}
}
.m-contentBox {
	margin: min(calc(50 / var(--vw-min)* 100vw), 50px) 0;
	display: flex;
	justify-content: center;
}
@media screen and (max-width:768px){
	.m-contentBox {
		padding: 0 calc(48 / var(--vw-min) * 100vw);
		margin: calc(50 / var(--vw-min)* 100vw) 0;
	}
}
.m-contentBox-Lists {
	width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
	display: flex;
	flex-wrap: wrap;
	gap: min(calc(20 / var(--vw-min) * 100vw), 20px);
	justify-content: center;
}
@media screen and (max-width:768px){
	.m-contentBox-Lists {
		width: 100%;
		gap: calc(30 / var(--vw-min) * 100vw);
	}
}
.m-contentBox-Item {
	width: calc((100% - min(calc(40 / var(--vw-min) * 100vw), 40px)) / 3);
	position: relative;
}
@media screen and (max-width:768px){
	.m-contentBox-Item {
		width: calc((100% - calc(30 / var(--vw-min) * 100vw)) / 2);
	}
}
.divLink{
	cursor: pointer;
}
.m-contentBox-Item a,
.m-contentBox-Item .divLink {
   width: 100%;
   display: block;
   position: relative;
   background-color: var(--color-yellow);
   text-decoration: none;
   pointer-events: auto;
   transition: .3s ease;
}
.m-cast .m-contentBox-Item a,
.m-cast .m-contentBox-Item .divLink {
	display: flex;
	flex-direction: column-reverse;
	height: 100%;
	justify-content: center;
}
.is-red .m-contentBox-Item a,
.is-red .m-contentBox-Item .divLink {
	background-color: var(--color-red);
}

/*
* contentBox title
*/
.m-contentBox-nameTitleArea {
	width: 100%;
	height: 100%;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: min(calc(20 / var(--vw-min) * 100vw), 20px);
}
@media screen and (max-width:768px){
	.m-contentBox-nameTitleArea {
		padding: calc(15 / var(--vw-min) * 100vw) calc(20 / var(--vw-min) * 100vw);
	}
}
.m-cast .m-contentBox-nameTitleArea,
.m-animator .m-contentBox-nameTitleArea {
	height: auto;
}
.m-contentBox-nameTitle {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}
.m-contentBox-name {
	font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
	font-weight: 700;
	display: inline-block;
}
@media screen and (max-width:768px){
	.m-contentBox-name {
		font-size: calc(24 / var(--vw-min) * 100vw);
		display: inline-block;
	}
}
.m-contentBox-post {
	font-size: min(calc(12 / var(--vw-min) * 100vw), 12px);
	line-height: 1.5;
	display: inline-block;
	margin-top: min(calc(12 / var(--vw-min) * 100vw), 12px);
}
.m-contentBox-post.-center{
	text-align: center;
}
@media screen and (max-width:768px){
	.m-contentBox-post {
		font-size: calc(16 / var(--vw-min) * 100vw);
		display: inline-block;
		margin-top: calc(12 / var(--vw-min) * 100vw);
	}
}
/*
* contentBox title btn
*/
.m-contentBox-Item-Btn {
	width: min(calc(16 / var(--vw-min) * 100vw), 16px);
	height: min(calc(16 / var(--vw-min) * 100vw), 16px);
	border-radius: 50%;
	position: absolute;
	top: 0;
	right:  min(calc(20 / var(--vw-min) * 100vw), 20px);
	bottom: 0;
	margin: auto;
}
@media screen and (max-width:768px){
	.m-contentBox-Item-Btn {
		width: calc(16 / var(--vw-min) * 100vw);
		height: calc(16 / var(--vw-min) * 100vw);
		right:  calc(20 / var(--vw-min) * 100vw);
	}
}
.m-contentBox-Item-Btn::before,
.m-contentBox-Item-Btn::after {
	content: "";
	position: absolute;
	top: 0;
	right:  0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.m-contentBox-Item-Btn::before {
	width: min(calc(2 / var(--vw-min) * 100vw), 2px);
	height: min(calc(8 / var(--vw-min) * 100vw), 8px);
}
@media screen and (max-width:768px){
	.m-contentBox-Item-Btn::before {
		width: calc(2 / var(--vw-min) * 100vw);
		height: calc(8 / var(--vw-min) * 100vw);
	}
}
.m-contentBox-Item-Btn::after {
	width: min(calc(8 / var(--vw-min) * 100vw), 8px);
	height: min(calc(2 / var(--vw-min) * 100vw), 2px);
}
@media screen and (max-width:768px){
	.m-contentBox-Item-Btn::after {
		width: calc(8 / var(--vw-min) * 100vw);
		height: calc(2 / var(--vw-min) * 100vw);
	}
}
/*
* contentBox thumbImg
*/
.m-contentBox-Item-thumb {
	width: 100%;
	height: auto;
	position: relative;
	border: min(calc(5 / var(--vw-min) * 100vw), 5px) solid var(--color-yellow);
	overflow: hidden;
	transition: .3s ease;
}
.is-red .m-contentBox-Item-thumb {
	border-color: var(--color-red);
}
.m-contentBox-Item-thumb-img {
	width: 100%;
	height: 100%;
	position: relative;
}
.m-contentBox-Item-thumb-img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: .3s ease;
	pointer-events: none;
}

/*
* m-content color
*/
/* yellow */
.m-content.is-yellow .cont-titleBg {
	background-color: #fff;
	border-top: min(calc(1 / var(--vw-min)* 100vw), 1px) solid #000;
	border-bottom: min(calc(1 / var(--vw-min)* 100vw), 1px) solid #000;
}
.m-content.is-yellow .cont-titleBg::before {
	background-color: #000;
}
.m-content.is-yellow .cont-titleIn {
	background-color: var(--color-yellow);
}
.m-content.is-yellow .m-contentBox-nameTitle {
	color: #000;
	transition: .3s ease;
}
.m-content.is-yellow .m-contentBox-Item-Btn {
	border: min(calc(2 / var(--vw-min)* 100vw), 2px) solid #000;
	transition: .3s ease;
}
.m-content.is-yellow .m-contentBox-Item-Btn::before,
.m-content.is-yellow .m-contentBox-Item-Btn::after {
	background-color: #000;
	transition: .3s ease;
}
/* red */
.m-content.is-red .cont-titleBg {
	background-color: #fff;
}
.m-content.is-red .cont-titleBg::before {
	background-color: #000;
}
.m-content.is-red .cont-titleIn {
	background-color: var(--color-red);
	color: #fff;
}
.m-content.is-red .m-contentBox-nameTitle {
	color: #000;
	transition: .3s ease;
}
.m-content.is-red .m-contentBox-Item-Btn {
	border: min(calc(2 / var(--vw-min)* 100vw), 2px) solid #000;
	transition: .3s ease;
}
.m-content.is-red .m-contentBox-Item-Btn::before,
.m-content.is-red .m-contentBox-Item-Btn::after {
	background-color: #000;
	transition: .3s ease;
}
/* official color */
.m-content.official.is-yellow .cont-titleBg {
	background-color: var(--color-yellow);
	border-top: min(calc(1 / var(--vw-min)* 100vw), 1px) solid #000;
	border-bottom: min(calc(1 / var(--vw-min)* 100vw), 1px) solid #000;
}
.m-content.official.is-yellow .cont-titleBg::before {
	background-color: #000;
}
/* 
* photo swiper
*/
.m-contentSwiper {
	width: 100%;
	height: min(calc(170 / var(--vw-min) * 100vw), 170px);
} 
.m-contentSwiper-Lists {
	transition-timing-function: linear;
  }
.m-contentSwiper-Item img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	object-fit: cover;
	margin: auto;
	pointer-events: none;
	pointer-events: none;
}
.m-contentSwiper-Item {
	width: min(calc(300 / var(--vw-min) * 100vw), 300px);
	height: min(calc(170 / var(--vw-min) * 100vw), 170px);
	background-color: #000;
	overflow: hidden;
}
@media screen and (max-width:768px){
	.m-contentSwiper-Item {
		width: calc(300 / var(--vw-min) * 100vw);
		height: calc(170 / var(--vw-min) * 100vw);
	}
}


/*--------------------------------------------------
* header
---------------------------------------------------*/
.header{
	width: 100%;
	position: relative;
	background-color: #fff;
	overflow: hidden;
	overflow: clip;
}
.header__contWrap{
	width: 100%;
	max-width: 1200px;
	position: relative;
	z-index: 1;
	margin: 0 auto;
	background-color: #FFF;
}
.header__contWrap img{
	width: 100%;
}
.header__contBg--deco1{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	padding-top: 12.4167%;/* 149 */
}
.header__contBg--deco1:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/common/header_img1-deco1.png) no-repeat center top / cover;
}
.header__contBg--deco2{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin-bottom: 10.75%;/* 129 */
	padding-top: 4.75%;/* 57 */
}
.header__contBg--deco2:before,
.header__contBg--deco2:after{
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	right: 50%;
	bottom: 0;
	background-color: #000;
}

.header__contBg--line{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../img/common/header_img_bg-line2.png) no-repeat center / cover;
}

.headerBg_line{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../img/common/header_img_bg-line.png) no-repeat center / cover;
	opacity: 20%;
}

.header__visualCont{
	position: absolute;
	top: 0;
	height: 100%;/* 506 */
}
.header__visual{
	position: absolute;
}
.header__visual img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/** LEFT **/
.header__visualCont.-l{
	left: 0;
	width: 32.4167%;/* 389 */
}
.header__visual.-l01{
	width: 69.4088%;/* 270 */
	height: 75.0989%;/* 380 */
	top: 0;
	left: 0;
	z-index: 1;
}
.header__visual.-l02{
	width: 23.1363%;/* 90 */
	height: 24.9012%;/* 126 */
	bottom: 0;
	left: 0;
}
.header__visual.-l03{
	width: 23.1363%;
	height: 24.9012%;
	left: 23.1363%;
	bottom: 0;
}
.header__visual.-l04{
	width: 23.1363%;
	height: 24.9012%;
	left: 46.2726%;
	bottom: 0;
}
.header__visual.-l05{
	width: 30.5913%;/* 119 */
	height: 33.2016%;/* 168 */
	right: 0;
	top: 0%;
}
.header__visual.-l06{
	width: 30.5913%;/* 119 */
	height: 33.2016%;/* 168 */
	right: 0;
	top: 33.2016%;
}
.header__visual.-l07{
	width: 30.5913%;/* 119 */
	height: 33.5969%;/* 170 */
	bottom: 0;
	right: 0;
}


/** RIGHT **/
.header__visualCont.-r{
	right: 0;
	width: 32.4167%;/* 389 */
	height: 100%;/* 506 */
}
.header__visual.-r01{
	width: 23.1363%;/* 90 */
	height: 25.0989%;/* 127 */
	top: 0;
	right: 0;
}
.header__visual.-r02{
	width: 23.3932%;/* 91 */
	height: 25.0989%;/* 127 */
	right: 23.1363%;
	top: 0;
}
.header__visual.-r03{
	width: 30.5913%;/* 119 */
	height: 33.2016%;/* 168 */
	top: 0;
	left: 0;
}
.header__visual.-r04{
	width: 30.5913%;/* 119 */
	height: 33.5969%;/* 170 */
	bottom: 0;
	left: 0;
}
.header__visual.-r05{
	width: 30.5913%;/* 119 */
	height: 33.2016%;/* 168 */
	left: 0;
	top: 33.2016%;
}
.header__visual.-r06{
	width: 22.8792%;/* 89 */
	height: 25.0989%;/* 127 */
	right: 46.5296%;
	top: 0;
}
.header__visual.-r07{
	width: 69.4088%;/* 270 */
	height: 74.9012%;/* 379 */
	bottom: 0;
	right: 0;
}


/** header__content **/
.header__content{
	position: absolute;
	width: 35.1667%;/* 422 */
	height: 100%;/* 506 */
	margin: 0 auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.header__content img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.header__contTitle{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.header__contTitle > span{
	display: block;
	position: absolute;
}
.header__contTitle--logo{
	width: 86.9669%;/* 367 */
	height: 28.4585%;/* 144 */
	left: 7.109%;/* 30 */
	top: 6.917%;/* 35 */
}
.header__contTitle--txt1{
	width: 91.9432%;/* 388 */
	height: 54.7431%;/* 277 */
	bottom: 3.9526%;/* 20 */
	left: 0;
	right: 0;
	margin: 0 auto;
}
.header__contTitle--txt2{
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}


/**
* ANIMATION
**/
/* header__contBg--img1 */
.header__contBg--img1 img{
	opacity: 0;
	transform: scale(20%);
	transition: transform .5s cubic-bezier(.48,.04,.26,1.34), opacity .3s ease;
}
.--is-loaded .header__contBg--img1 img{
	opacity: 1;
	transform: scale(100%);
}






/* deco */
.header__contBg--deco1:before{
	transform: translateY(-100%);
	transition: transform .4s ease .6s;
}
.--is-loaded .header__contBg--deco1:before{
	transform: translateY(0%);
}


.header__contBg--deco2:before{
	transition: right .4s cubic-bezier(.56,.18,.39,1) .4s;
}
.header__contBg--deco2:after{
	transition: left .4s cubic-bezier(.56,.18,.39,1) .4s;
}

.--is-loaded .header__contBg--deco2:before{
	right: 0%;
}
.--is-loaded .header__contBg--deco2:after{
	left: 0%;
}



/* header__contBg--line */
.header__contBg--line{
	opacity: 0;
	transform: scale(300%);
	filter: brightness(400%);
	transition: opacity .3s ease, transform .6s ease, filter 1.2s ease;
}
.--is-loaded .header__contBg--line{
	opacity: 1;
	transform: scale(100%);
	filter: brightness(100%);
}


/* header__visual */
.header__visual{
	opacity: 0;
	transition: opacity .3s ease, transform .45s ease;
	overflow: hidden;
}
.header__visual img{
	transition: transform .8s ease;
}
.header__visual.-l01{
	transform: translateX(-50%);
}
.header__visual.-l01 img{
	transform: scale(110%);
}
.header__visual.-l02{
	transform: translateY(-50%);
}
.header__visual.-l03{
	transform: translateY(50%);
}
.header__visual.-l04{
	transform: translateX(50%);
}
.header__visual.-l05{
	transform: translateY(-50%);
}
.header__visual.-l06{
	transform: translateX(-50%);
}
.header__visual.-l07{
	transform: translateY(50%);
}



.header__visual.-r01{
	transform: translateY(50%);
}
.header__visual.-r02{
	transform: translateY(-50%);
}
.header__visual.-r03{
	transform: translateY(-50%);
}
.header__visual.-r04{
	transform: translateY(50%);
}
.header__visual.-r05{
	transform: translateX(50%);
}
.header__visual.-r06{
	transform: translateX(-50%);
}
.header__visual.-r07{
	transform: translateX(50%);
}
.header__visual.-r07 img{
	transform: scale(110%);
}

.--is-loaded .header__visual.-l01,
.--is-loaded .header__visual.-r07{
	opacity: 1;
	transform: translateX(0%);
	transition-delay: .2s;
}
.--is-loaded .header__visual.-l01 img,
.--is-loaded .header__visual.-r07 img{
	transform: scale(100%);
	transition-delay: .45s;
}

.--is-loaded .header__visual.-l02,
.--is-loaded .header__visual.-r01{
	opacity: 1;
	transform: translateY(0%);
	transition-delay: .25s;
}

.--is-loaded .header__visual.-l03,
.--is-loaded .header__visual.-r02{
	opacity: 1;
	transform: translateX(0%);
	transition-delay: .3s;
}

.--is-loaded .header__visual.-l04,
.--is-loaded .header__visual.-r06{
	opacity: 1;
	transform: translateY(0%);
	transition-delay: .35s;
}

.--is-loaded .header__visual.-l05,
.--is-loaded .header__visual.-r04{
	opacity: 1;
	transform: translateY(0%);
	transition-delay: .4s;
}

.--is-loaded .header__visual.-l06,
.--is-loaded .header__visual.-r05{
	opacity: 1;
	transform: translateX(0%);
	transition-delay: .45s;
}

.--is-loaded .header__visual.-l07,
.--is-loaded .header__visual.-r03{
	opacity: 1;
	transform: translateY(0%);
	transition-delay: .5s;
}





.header__contTitle--logo{
	opacity: 0;
	transform: translateY(-25%);
	transition: opacity .3s ease, transform .3s ease;
}
.header__contTitle--logo img,
.header__contTitle--txt1 img{
	transform: scale(80%);
	transition: transform .3s cubic-bezier(.48,.04,.26,1.34);
}
.header__contTitle--txt1{
	opacity: 0;
	transition: opacity .3s ease;
}
.header__contTitle--txt2{
	opacity: 0;
	transition: opacity .45s ease;
}


.--is-loaded .header__contTitle--logo{
	opacity: 1;
	transform: translateY(0%);
	transition-delay: .6s;
}
.--is-loaded .header__contTitle--logo img{
	transform: scale(100%);
	transition-delay: .75s;
}

.--is-loaded .header__contTitle--txt1{
	opacity: 1;
	transition-delay: .65s;
}
.--is-loaded .header__contTitle--txt1 img{
	transform: scale(100%);
	transition-delay: .8s;
}
.--is-loaded .header__contTitle--txt2{
	opacity: 1;
	transition-delay: .8s;
}


/*--------------------------------------------------
* introduction
---------------------------------------------------*/
.introduction {
	padding: min(calc(50 / var(--vw-min) * 100vw), 50px) 0 min(calc(50 / var(--vw-min) * 100vw), 50px);
}
@media screen and (max-width:768px){
	.introduction {
		padding: calc(50 / var(--vw-min) * 100vw) calc(30 / var(--vw-min) * 100vw);
	}
}
.intro__cont-text {
	font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
	letter-spacing: 0.1em;
	line-height: 2;
	text-align: center;
	font-weight: bold;
	width: min(calc(770 / var(--vw-min) * 100vw), 770px);
	margin: 0 auto;
}
@media screen and (max-width:768px){
	.intro__cont-text {
		font-size: calc(24 / var(--vw-min) * 100vw);
		width: 100%;
	}
}



/*--------------------------------------------------
* Nav Tab
---------------------------------------------------*/
.contNav__tabWrap {
	margin-bottom: min(calc(50 / var(--vw-min) * 100vw), 50px);
	display: flex;
	justify-content: center;
}
@media screen and (max-width:768px){
	.contNav__tabWrap {
		padding: 0 calc(50 / var(--vw-min) * 100vw);
		margin-bottom: calc(50 / var(--vw-min) * 100vw);
		display: flex;
		justify-content: center;
	}
}
.contNav__tabLists {
	width: min(calc(1000 / var(--vw-min) * 100vw), 1000px);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: min(calc(8 / var(--vw-min) * 100vw), 8px);
}
@media screen and (max-width:768px){
	.contNav__tabLists {
		width: 100%;
		justify-content: center;
		gap: calc(12 / var(--vw-min) * 100vw);
	}
}
.contNav__tabItem {
	width: calc((100% - min(calc(16 / var(--vw-min) * 100vw), 16px)) / 3);
	min-height: min(calc(60 / var(--vw-min) * 100vw), 60px);
	position: relative;
}
@media screen and (max-width:768px){
	.contNav__tabItem {
		width: calc((100% - calc(12 / var(--vw-min) * 100vw)) / 2);
		min-height: calc(60 / var(--vw-min) * 100vw);
	}
}
.contNav__tabItem a {
	font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
	color: #fff;
	width: 100%;
	height: 100%;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-color: #000;
	padding: min(calc(12 / var(--vw-min) * 100vw), 12px) min(calc(20 / var(--vw-min) * 100vw), 20px);
	text-decoration: none;
	pointer-events: auto;
	transition: .3s ease;
	line-height: 1.2;
	overflow: hidden;
	border: min(calc(1 / var(--vw-min) * 100vw), 1px) solid #000;
}
@media screen and (max-width:768px){
	.contNav__tabItem a {
		font-size: calc(24 / var(--vw-min) * 100vw);
		padding: calc(20 / var(--vw-min) * 100vw);
	 }
}
.contNav__tabItem a::before {
	content: "";
	width: min(calc(15 / var(--vw-min) * 100vw), 15px);
	height: min(calc(9 / var(--vw-min) * 100vw), 9px);
	position: absolute;
	top: 0;
	bottom: 0;
	right: min(calc(8 / var(--vw-min) * 100vw), 8px);
	margin: auto;
	-webkit-mask: url(../img/common/deco_arrow.png)no-repeat center/contain;
	mask: url(../img/common/deco_arrow.png)no-repeat center/contain;
	background-color: #fff;
	transition: .3s ease;
}
@media screen and (max-width:768px){
	.contNav__tabItem a::before {
		width: calc(15 / var(--vw-min) * 100vw);
		height: calc(9 / var(--vw-min) * 100vw);
		right: calc(20 / var(--vw-min) * 100vw);
	}
}



/*--------------------------------------------------
* アニメーション
---------------------------------------------------*/
@media (hover: hover) and (pointer: fine) {
	.contNav__tabItem a:hover {
		color: #000;
		background-color: #fff;
	} 
	.contNav__tabItem a:hover::before {
		background-color: #000;
		transform:translateY(min(calc(3 / var(--vw-min) * 100vw), 3px));
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-nameTitle,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-nameTitle{
		color: #fff;
	}
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-nameTitle,
	.m-content.is-red .m-contentBox-Item .divLink:hover .m-contentBox-nameTitle  {
		color: #000;
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-Btn,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn {
		border-color: #fff;
	}
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-Item-Btn,
	.m-content.is-red .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn {
		border: min(calc(2 / var(--vw-min)* 100vw), 2px) solid #000;
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-Btn::before,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn::before, 
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-Btn::after,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn::after {
		background-color: #fff;
	}
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-Item-Btn::before,
	.m-content.is-red .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn::before, 
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-Item-Btn::after,
	.m-content.is-red .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn::after {
		background-color: #000;
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-Btn::before,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn::before, 
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-Item-Btn::before, 
	.m-content.is-red .m-contentBox-Item .divLink:hover .m-contentBox-Item-Btn::before {
		opacity: 0;
		transform:translateY(10px);
	}
	.m-content.is-yellow .m-contentBox-Item a:hover,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover {
		background-color: var(--color-red)
	}
	.m-content.is-red .m-contentBox-Item a:hover,
	.m-content.is-red .m-contentBox-Item .divLink:hover {
		background-color: var(--color-yellow);
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-thumb,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-Item-thumb {
		border: min(calc(5 / var(--vw-min) * 100vw), 5px) solid var(--color-red);
	}
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-Item-thumb,
	.m-content.is-red .m-contentBox-Item .divLink:hover .m-contentBox-Item-thumb {
		border-color: var(--color-yellow);
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-thumb-img img,
	.m-content.is-yellow .m-contentBox-Item .divLink:hover .m-contentBox-Item-thumb-img img {
		transform: scale(1.1);
	}
}




/*-----------------------------------
* ローディング後
------------------------------------*/
.header__Tylogo,
.header__logo,
.intro__cont-text {
	opacity: 0;
	transform-origin: 50% 50%;
	transform: scale(0.8);
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.headerLeft {
	transform: translateX(-150%);
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.headerRight {
	transform: translateX(150%);
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.headerLeft.is-ani {
	transform: translateX(0);
}
.headerRight.is-ani {
	transform: translateX(0);
}
.header__Tylogo.is-ani,
.header__logo.is-ani,
.intro__cont-text.is-ani {
	opacity: 1;
	transform: scale(1);
	transition-delay: 0.5s;
}
.contNav__tabWrap,
.footer {
	opacity: 0;
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.contNav__tabWrap.is-ani,
.footer.is-ani {
	opacity: 1;
	transition-delay: 0.5s;
}


/*----------------------------
* SCROLL ANIMATION
----------------------------*/
.cont-title{
	opacity: 0;
	transform: translateY(50%);
	transition: transform .4s ease, opacity .3s ease;
}
.is-ani .cont-title{
	opacity: 1;
	transform: translateY(0%);
}
#oModalBox .cont-title{
	opacity: 1;
	transform: translateY(0%);
}



/**
* modal
**/
.modalCont{
	display: flex;
	align-items: flex-start;
}
.modalCont__nameTitle{
	width: min(calc(316 / var(--vw-min) * 100vw), 316px);
	position: relative;
	padding: min(calc(20 / var(--vw-min) * 100vw), 20px);
	background-color: #000;
	color: var(--color-yellow);
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}
.modalCont__nameTitle--name{
	font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
	display: inline-block;
	margin-bottom: 0.6em;
}
.modalCont__nameTitle--post{
	display: inline-block;
	font-size: min(calc(12 / var(--vw-min) * 100vw), 12px);
	line-height: 1.5;
}
.modalCont__nameTitle--post.-center{
	text-align: center;
}
.modalContIn{
	width: min(calc(750 / var(--vw-min) * 100vw), 750px);
	padding-left: min(calc(30 / var(--vw-min) * 100vw), 30px);
}
.modalCont__image{
	width: 100%;
}
.modalCont__image img{
	width: 100%;
}
.modalCont_text{
	font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
	font-weight: 700;
	line-height: 1.875;
	margin-top: min(calc(30 / var(--vw-min) * 100vw), 30px);
}
@media screen and (max-width:768px){
	.modalCont{
		width: 100%;
		flex-direction: column;
		padding: 0 calc(50 / var(--vw-min) * 100vw);
	}
	.modalCont__nameTitle{
		width: 100%;
		padding: calc(16 / var(--vw-min) * 100vw) calc(20 / var(--vw-min) * 100vw);
	}
	.modalCont__nameTitle--name{
		font-size: calc(24 / var(--vw-min) * 100vw);
		margin-bottom: 0.5em;
	}
	.modalCont_text{
		font-size: calc(16 / var(--vw-min) * 100vw);
	}
	.modalContIn{
		width: 100%;
		padding-left: 0;
		margin-top: calc(30 / var(--vw-min) * 100vw);
	}
	.modalCont_text{
		font-size: calc(20 / var(--vw-min) * 100vw);
		line-height: 2;
		margin-top: calc(30 / var(--vw-min) * 100vw);
	}
}
.modalCont_text_staff{
	margin-top: 0;
}



#staff .m-contentBox-nameTitleArea{
	padding-right: min(calc(44 / var(--vw-min) * 100vw), 44px);
}

.cont-titleWrap.m-staff{
	opacity: 0;
	transition: .3s ease;
}
.cont-titleWrap.m-staff .cont-titleBg.-staff::before{
	animation-play-state: paused;
}
#oModalBox[data-omodal-option="-staff"] .cont-titleWrap.m-cast{
	opacity: 0;
}
#oModalBox[data-omodal-option="-staff"] .cont-titleWrap.m-cast .cont-titleBg:not(.-staff)::before{
	animation-play-state: paused;
}


#oModalBox[data-omodal-option="-staff"] .cont-titleWrap.m-staff{
	opacity: 1;
}
#oModalBox[data-omodal-option="-staff"] .cont-titleWrap.m-staff .cont-titleBg.-staff::before{
	animation-play-state: running;
}