@charset "utf-8";
/*--------------------------------------------------
* common
* header
* introduction
* Nav Tab
* comics
* official
* animation
---------------------------------------------------*/
/*--------------------------------------------------
* common
---------------------------------------------------*/
#fullWrap {
	overflow: hidden;
	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);
}
@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;
}
.comics .cont-titleBg::before,
.official .cont-titleBg::before {
	-webkit-mask: url(../img/common/tit_bg.svg) repeat-x center left;
	mask: url(../img/common/tit_bg.svg) repeat-x center left;
	-webkit-mask-size: min(calc(968 / var(--vw-min) * 100vw), 968px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	mask-size:min(calc(968 / var(--vw-min) * 100vw), 968px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	animation: titTextScr 25s linear infinite;
}
@keyframes titTextScr {
	0% {
		-webkit-mask-position: 0 0;
		mask-position: 0 0;
	}
	100% {
		-webkit-mask-position: min(calc(968 / var(--vw-min) * 100vw), 968px) 0;
		mask-position: min(calc(968 / var(--vw-min) * 100vw), 968px) 0;
	}
}
/* staff titBg */
.m-staff .cont-titleBg::before {
	-webkit-mask: url(../img/common/tit_staff_bg.svg) repeat-x center left;
	mask: url(../img/common/tit_staff_bg.svg) repeat-x center left;
	-webkit-mask-size: min(calc(1500 / var(--vw-min) * 100vw), 1500px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	mask-size:min(calc(1500 / var(--vw-min) * 100vw), 1500px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	animation: staffTitTextScr 25s linear infinite;
}
@keyframes staffTitTextScr {
	0% {
		-webkit-mask-position: 0 0;
		mask-position: 0 0;
	}
	100% {
		-webkit-mask-position: min(calc(1500 / var(--vw-min) * 100vw), 1500px) 0;
		mask-position: min(calc(1500 / var(--vw-min) * 100vw), 1500px) 0;
	}
}
/* cast titBg */
.m-cast .cont-titleBg::before {
	-webkit-mask: url(../img/common/tit_cast_bg.svg) repeat-x center left;
	mask: url(../img/common/tit_cast_bg.svg) repeat-x center left;
	-webkit-mask-size: min(calc(1428 / var(--vw-min) * 100vw), 1428px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	mask-size:min(calc(1428 / var(--vw-min) * 100vw), 1428px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	animation: castTitTextScr 25s linear infinite;
}
@keyframes castTitTextScr {
	0% {
		-webkit-mask-position: 0 0;
		mask-position: 0 0;
	}
	100% {
		-webkit-mask-position: min(calc(1428 / var(--vw-min) * 100vw), 1428px) 0;
		mask-position: min(calc(1428 / var(--vw-min) * 100vw), 1428px) 0;
	}
}
/* animator titBg */
.m-animator .cont-titleBg::before {
	-webkit-mask: url(../img/common/tit_animator_bg.svg) repeat-x center left;
	mask: url(../img/common/tit_animator_bg.svg) repeat-x center left;
	-webkit-mask-size: min(calc(1579 / var(--vw-min) * 100vw), 1579px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	mask-size:min(calc(1579 / var(--vw-min) * 100vw), 1579px) min(calc(100 / var(--vw-min) * 100vw), 100px);
	animation: animatorTitTextScr 25s linear infinite;
}
@keyframes animatorTitTextScr {
	0% {
		-webkit-mask-position: 0 0;
		mask-position: 0 0;
	}
	100% {
		-webkit-mask-position: min(calc(1579 / var(--vw-min) * 100vw), 1579px) 0;
		mask-position: min(calc(1579 / var(--vw-min) * 100vw), 1579px) 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(45 / var(--vw-min) * 100vw);
		margin: calc(50 / var(--vw-min)* 100vw) 0;
	}
}
.m-contentBox-Lists {
	width: min(calc(1010 / var(--vw-min) * 100vw), 1010px);
	display: flex;
	flex-wrap: wrap;
}
@media screen and (max-width:768px){
	.m-contentBox-Lists {
		width: 100%;
	}
}
.m-contentBox-Item {
	width: calc(100% / 3);
	position: relative;
	display: flex;
	padding: 0 min(calc(10 / var(--vw-min) * 100vw), 10px);
}
@media screen and (max-width:768px){
	.m-contentBox-Item {
		width: calc(100% / 2);
		padding: 0 calc(10 / var(--vw-min) * 100vw);
	}
}
.m-contentBox-Item:nth-child(n+4) {
	margin-top: min(calc(20 / var(--vw-min) * 100vw), 20px);
}
@media screen and (max-width:768px){
	.m-contentBox-Item:nth-child(n+3) {
		margin-top: calc(20 / var(--vw-min) * 100vw);
	}
}
.m-contentBox-Item a {
   width: 100%;
   display: block;
   position: relative;
   background-color: #000;
   text-decoration: none;
   pointer-events: auto;
   transition: .3s ease;
}
.m-cast .m-contentBox-Item a {
	display: flex;
	flex-direction: column-reverse;
}
/*
* 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);
	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);
}
@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 #000;
	overflow: hidden;
	transition: .3s ease;
}
.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: var(--color-yellow);
	transition: .3s ease;
}
.m-content.is-yellow .m-contentBox-Item-Btn {
	border: min(calc(2 / var(--vw-min)* 100vw), 2px) solid var(--color-yellow);
	transition: .3s ease;
}
.m-content.is-yellow .m-contentBox-Item-Btn::before,
.m-content.is-yellow .m-contentBox-Item-Btn::after {
	background-color: var(--color-yellow);
	transition: .3s ease;
}
/* red */
.m-content.is-red .cont-titleBg {
	background-color: #000;
}
.m-content.is-red .cont-titleBg::before {
	background-color: #fff;
}
.m-content.is-red .cont-titleIn {
	background-color: var(--color-red);
	color: #fff;
}
.m-content.is-red .m-contentBox-nameTitle {
	color: #fff;
	transition: .3s ease;
}
.m-content.is-red .m-contentBox-Item-Btn {
	border: min(calc(2 / var(--vw-min)* 100vw), 2px) solid #fff;
	transition: .3s ease;
}
.m-content.is-red .m-contentBox-Item-Btn::before,
.m-content.is-red .m-contentBox-Item-Btn::after {
	background-color: #fff;
	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
---------------------------------------------------*/
.headerWrap  {
	width: 100%;
	height: var(--header-height);
	position: relative;
	display: flex;
}
.header__logo {
	width: min(calc(230 / var(--vw-min) * 100vw), 230px);
	height: min(calc(90 / var(--vw-min) * 100vw), 90px);
	position: absolute;
	top: min(calc(152 / var(--vw-min) * 100vw), 152px);
	left: min(calc(70 / var(--vw-min) * 100vw), 70px);
	z-index: 1;
	background: url(../img/common/header_logo.png)no-repeat center/contain;
}
@media screen and (max-width:768px){
	.header__logo {
		width: calc(290 / var(--vw-min) * 100vw);
		height: calc(116 / var(--vw-min) * 100vw);
		top: auto;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto auto calc(54 / var(--vw-min) * 100vw);
	}
}
.header__Tylogo img {
	width: 100%;
	pointer-events: none;	
}
.header__Tylogo {
	width: min(calc(500 / var(--vw-min) * 100vw), 500px);
	height: min(calc(290 / var(--vw-min) * 100vw), 290px);
	position: absolute;
	top: min(calc(15 / var(--vw-min) * 100vw), 15px);
	right: 0;
	left: 0;
	z-index: 1;
	margin: auto;
}
@media screen and (max-width:768px){
	.header__Tylogo {
		width: calc(512 / var(--vw-min) * 100vw);
		height: calc(301 / var(--vw-min) * 100vw);
		top: calc(70 / var(--vw-min) * 100vw);
	}
}
.headerLeft,
.headerRight {
	width: 50%;
	height: 100%;
	position: relative;
}
.headerLeft {
	background-color: var(--color-red);
}
.headerRight {
	background-color: var(--color-yellow);
	overflow: hidden;
}
.headerCont-img img {
	width: 100%;
	pointer-events: none;
	opacity: 0.3;
}
.headerCont-img {
	height: var(--header-height);
	position: absolute;
	top: 0;
	overflow: hidden;
}


.headerLeft > .headerCont-img {
	left: 0;
	right: 0;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
}
.headerRight > .headerCont-img{
	width: 104.6667%;
	max-width: 628px;
	left: 0;
}
.headerRight > .headerCont-img img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left center;
}

@media screen and (max-width:768px){
	.headerRight > .headerCont-img{
		width: 100%;
	}
}



/*--------------------------------------------------
* introduction
---------------------------------------------------*/
.introduction {
	padding: min(calc(140 / var(--vw-min) * 100vw), 140px) 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(1010 / var(--vw-min) * 100vw), 1010px);
	display: flex;
	flex-wrap: wrap;
}
@media screen and (max-width:768px){
	.contNav__tabLists {
		width: 100%;
		justify-content: center;
	}
}
.contNav__tabItem {
	width: calc(100% / 3);
	height: min(calc(60 / var(--vw-min) * 100vw), 60px);
	position: relative;
	padding: 0 min(calc(10 / var(--vw-min) * 100vw), 10px);
}
@media screen and (max-width:768px){
	.contNav__tabItem {
		width: calc(100% / 2);
		height: calc(60 / var(--vw-min) * 100vw);
		padding: 0 calc(10 / var(--vw-min) * 100vw);
	}
	.contNav__tabItem:nth-child(n+3) {
		margin-top: calc(20 / 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;
   background-color: #000;
   padding: min(calc(20 / var(--vw-min) * 100vw), 20px);
   text-decoration: none;
   pointer-events: auto;
   transition: .3s ease;
}
@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(20 / var(--vw-min) * 100vw), 20px);
	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);
	}
}
/*--------------------------------------------------
* comics
---------------------------------------------------*/
.comics .cont-titleIn {
	width: min(calc(138 / var(--vw-min) * 100vw), 138px);
	height: min(calc(45 / var(--vw-min) * 100vw), 45px);
	position: relative;
	font-size: 0;
	color: unset;
}
.comics .cont-titleIn::before {
	content: "";
	display: block;
	width: min(calc(122 / var(--vw-min) * 100vw), 122px);
	height: min(calc(36 / var(--vw-min) * 100vw), 36px);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	-webkit-mask:url(../img/common/tit_comics.svg)no-repeat center/ cover;
	mask:url(../img/common/tit_comics.svg)no-repeat center/ cover;
	background-color: #000;
}
.comics__Lists {
	width: min(calc(1070 / var(--vw-min) * 100vw), 1070px);
	display: flex;
	flex-wrap: wrap;
}
@media screen and (max-width:768px){
	.comics__Lists {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
	}
}
.comics__item {
	width: calc(100% / 8);
	padding: min(calc(5 / var(--vw-min) * 100vw), 5px);
}
@media screen and (max-width:768px){
	.comics__item {
		width: calc(100% / 5);
		padding: calc(5 / var(--vw-min) * 100vw);
	}
}
.comics__item a {
	pointer-events: auto;

}
.booksList__img img {
	width: 100%;
	pointer-events: none;
}



.comicsCont_img{
	width: 100%;
	text-align: center;
}
.comicsCont_img img{
	max-width: 100%;
}
.comicsCont_btn{
	text-align: center;
	margin-top: 20px;
}
.comicsCont_btn-link{
	display: inline-block;
	text-decoration: none;
	line-height: 1;
	padding: 20px 24px 20px 48px;
	position: relative;
	border: 2px solid #000;
	background-color: #000;
	color: var(--color-yellow);
	font-weight: 500;
	font-size: 20px;
}
.comicsCont_btn-link > span{
	display: inline-block;
	position: relative;
	line-height: 1;
	padding-right: 24px;
}
.comicsCont_btn-link > span:after{
	content: '';
	position: absolute;
	top: 2px;
	right: 0;
	bottom: 0;
	width: 12px;
	height: 8px;
	-webkit-mask: url(../img/common/arrow_b_t.svg) no-repeat center / contain;
	mask: url(../img/common/arrow_b_t.svg) no-repeat center / contain;
	background-color: var(--color-yellow);
	transform: rotate(90deg);
	margin: auto 0;
}
@media (hover: hover) and (pointer: fine){
	.comicsCont_btn-link,
	.comicsCont_btn-link > span:after{
		transition: .3s ease;
	}
	.comicsCont_btn-link:hover{
		background-color: var(--color-yellow);
		color: #000;
	}
	.comicsCont_btn-link:hover > span:after{
		transform: rotate(90deg) translateY(-50%);
		background-color: #000;
	}
}
@media screen and (max-width: 767px){
	#comics .m-contentBox{
		padding-left: 0;
		padding-right: 0;
	}
	.comicsWrap{
		width: 99.2%;/* 744 */
		margin: 0 auto;
	}
	.comicsCont_btn{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
	}
	.comicsCont_btn-link{
		padding:  min(calc(20 / var(--vw-min) * 100vw), 24px)  min(calc(24 / var(--vw-min) * 100vw), 24px)  min(calc(20 / var(--vw-min) * 100vw), 20px)  min(calc(48 / var(--vw-min) * 100vw), 48px);
		font-size: min(calc(24 / var(--vw-min) * 100vw), 24px);
	}
	.comicsCont_btn-link > span{
		padding-right: min(calc(28 / var(--vw-min) * 100vw), 28px);
	}
	.comicsCont_btn-link > span:after{
		top: min(calc(2 / var(--vw-min) * 100vw), 2px);
		width: min(calc(14 / var(--vw-min) * 100vw), 14px);
		height: min(calc(10 / var(--vw-min) * 100vw), 10px);
	}
}

/*--------------------------------------------------
* official
---------------------------------------------------*/
.official .cont-titleIn {
	width: min(calc(300 / var(--vw-min) * 100vw), 300px);
	height: min(calc(45 / var(--vw-min) * 100vw), 45px);
	position: relative;
	font-size: 0;
	color: unset;
}
.official .cont-titleIn::before {
	content: "";
	display: block;
	width: min(calc(285 / var(--vw-min) * 100vw), 285px);
	height: min(calc(36 / var(--vw-min) * 100vw), 36px);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	-webkit-mask:url(../img/common/tit_official.svg)no-repeat center/ cover;
	mask:url(../img/common/tit_official.svg)no-repeat center/ cover;
	background-color: #000;
}
.twi-timeline {
	width: 100%;
	background-color: var(--color-yellow);
}
.twi-timelineWrap {
	width: 100%;
	position: relative;
	margin: 0 auto;
}
.twi-timeline__Cont {
	width: 100%;
	position: relative;
	padding: min(calc(50 / var(--vw-min)* 100vw), 50px) 0;
	margin: 0 auto;
	overflow: hidden;
}
@media screen and (max-width:768px){
	.twi-timeline__Cont {
		padding: calc(50 / var(--vw-min)* 100vw) 0;
	}
}
.twi-timeline__item {
	width: min(calc(1000 / var(--vw-min)* 100vw), 1000px);
	height: min(calc(680 / var(--vw-min)* 100vw), 680px);
	background-color: #fff;
	margin: 0 auto;
}
@media screen and (max-width:768px){
	.twi-timeline__item {
		width: calc(650 / var(--vw-min)* 100vw);
		height: calc(800 / var(--vw-min)* 100vw);
	}
}
.twi-timeline__item iframe {
	width: 100% !important;
	height: 100%;
	border: unset;
	overflow-x: unset;
}
/*--------------------------------------------------
* アニメーション
---------------------------------------------------*/
@media (hover: hover) and (pointer: fine) {
	.contNav__tabItem a:hover {
		color: #000;
		background-color: #fff;
		border: min(calc(1 / var(--vw-min) * 100vw), 1px) solid #000;
	} 
	.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-red .m-contentBox-Item a:hover .m-contentBox-nameTitle  {
		color: #000;
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-Btn,
	.m-content.is-red .m-contentBox-Item a: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 a:hover .m-contentBox-Item-Btn::after,
	.m-content.is-red .m-contentBox-Item a:hover .m-contentBox-Item-Btn::before, 
	.m-content.is-red .m-contentBox-Item a: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-red .m-contentBox-Item a:hover .m-contentBox-Item-Btn::before {
		opacity: 0;
		transform:translateY(10px);
	}
	.m-content.is-yellow .m-contentBox-Item a:hover {
		background-color: var(--color-yellow);
	}
	.m-content.is-red .m-contentBox-Item a:hover {
		background-color: var(--color-red);
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-thumb {
		border: min(calc(5 / var(--vw-min) * 100vw), 5px) solid var(--color-yellow);
	}
	.m-content.is-yellow .m-contentBox-Item a:hover .m-contentBox-Item-thumb-img img {
		transform: scale(1.1);
	}
}
/*-----------------------------------
* ローディング後
------------------------------------*/
.header__Tylogo.js-fani,
.header__logo.js-fani,
.intro__cont-text.js-fani {
	opacity: 0;
	transform-origin: 50% 50%;
	transform: scale(0.8);
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.headerLeft.js-fani {
	transform: translateX(-150%);
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.headerRight.js-fani {
	transform: translateX(150%);
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.headerLeft.js-fani.is-ani {
	transform: translateX(0);
}
.headerRight.js-fani.is-ani {
	transform: translateX(0);
}
.header__Tylogo.js-fani.is-ani,
.header__logo.js-fani.is-ani,
.intro__cont-text.js-fani.is-ani {
	opacity: 1;
	transform: scale(1);
	transition-delay: 0.5s;
}
.contNav__tabWrap.js-fani,
.m-content.js-fani,
.footer.js-fani {
	opacity: 0;
	transition: .4s cubic-bezier(0.25, 1, 0.5, 1);
}
.contNav__tabWrap.js-fani.is-ani,
.m-content.js-fani.is-ani,
.footer.js-fani.is-ani {
	opacity: 1;
	transition-delay: 0.5s;
}