@charset "utf-8";
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 100;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 200;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 300;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 400;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}
@font-face {
	font-family: "Helvetica Neue";
	src: local("Helvetica Neue Regular");
	font-weight: 100;
}
@font-face {
	font-family: "Helvetica Neue";
	src: local("Helvetica Neue Regular");
	font-weight: 200;
}
html{ font-size: 62.5% !important; }
body {
	font-family: "Yu Gothic", YuGothic, "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	font-weight: normal;
	font-size: 10px; 
	font-size: 1rem;
	line-height: 1.8;
	letter-spacing: 0.07em;
	color: #000;
	background: #fff;
	-webkit-text-size-adjust: 100%;
	word-wrap: break-word;
	min-width: 320px;
}
a{ color: #000; }
a:hover{ text-decoration: none; }
.sp{ display: block; }
.pc{ display: none; }
img{ width: 100%; }
/*-- ▼BLUR ANIMATION▼ --*/
.bAni{
	transition: 1.5s ease;
	filter: blur(15px);
	opacity: 0;
}
.bAni.active{
	transition-delay: .3s;
	opacity: 1;
	filter: blur(0px);
}
/*-- ▼LOADING▼ --*/
#loading {
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 10000;
}
#loadingIn{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	background: #000;
	z-index: 1;
	transition: .8s cubic-bezier(.7,0,.170,1);
	transform: scaleY(1);
}
#loading.active #loadingIn{
	transform: scaleY(0);
	transition-delay: .8s;
}
#fullWrap{
	position: relative;
}
body#sub #fullWrap {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
body#sub footer { margin-top: auto; }
/*-----------------------------------------------
HEADER-NAV
-------------------------------------------------*/
header{
	width: 80px;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	pointer-events: none;
}
@media screen and (max-width:480px) {
	header{
		width: 65px;
	}
}/*-- END --*/
.headerIn{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.triggerBox{
	width: 100%;
	padding-top: calc(100% + 8px);
	position: relative;
	pointer-events: auto;
	background: url(../img/common/logo_kos_sp.png) no-repeat 0 0 / 100%;
}
.navTrigger{
	width: 30px;
	margin: auto;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
}
.navTrigger:before{
	content: "";
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 1px solid #000;
	box-sizing: border-box;
}
.navTrigger small {
	display: block;
	background: url(../img/common/t_menu_sp.png) no-repeat center / 20px;
	width: 30px;
	height: 6px;
	margin: 4px auto 0;
	transition: .3s ease;
}
.navTrigger .lineBox{
	display: block;
	width: 10px;
	height: 6px;
	position: absolute;
	margin: auto;
	top: 12px;
	left: 0;
	right: 0;
}
.navTrigger .lineBox > span {
	width: 100%;
	height: 1px;
	position: absolute;
	left: 0;
	display: block;
	background-color: #000;
	transition: .3s ease;
}
.navTrigger .lineBox > span:nth-child(1){ top: 0; }
.navTrigger .lineBox > span:nth-child(2){ bottom: 0; }
.navTrigger.active .lineBox > span:nth-child(1){
	transform: rotate(45deg);
	top: 3px;
}
.navTrigger.active .lineBox > span:nth-child(2){
	transform: rotate(-45deg);
	bottom: 2px;
}
.navBox{
	width: 0;
	height: 100%;
	position: fixed;
	z-index: 1;
	background: #fff;
	top: 0;
	left: 80px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: 80px 0;
	pointer-events: auto;
	transition: .6s cubic-bezier(0.02, 0.88, 0.58, 1);
}
@media screen and (max-width:480px) { 
	.navBox{
		left: 65px;
	}
}/*-- END --*/
.navBox.active{
	width: calc(100% - 80px);
}
@media screen and (max-width:480px) { 
	.navBox.active{
		width: calc(100% - 65px);
	}
}/*-- END --*/
ul.navBox_list{
	width: 340px;
	margin-left: 10%;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 50px;
}
@media screen and (max-width:480px) {
	ul.navBox_list{
		width: 100%;
		padding-left: 40px;
		padding-right: 10px;
		margin-left: 0;
	}
}/*-- END --*/
ul.navBox_list li{
	width: 50%;
	height: 50px;
}
ul.navBox_list li a{
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: left center;
	position: relative;
	background-size: 100%;
}
ul.navBox_list li.n0 a{
	background-image: url(../img/common/n0_sp.png);
}
ul.navBox_list li.n1 a{
	background-image: url(../img/common/n1_sp.png);
}
ul.navBox_list li.n2 a{
	background-image: url(../img/common/n2_sp.png);
}
ul.navBox_list li.n3 a{
	background-image: url(../img/common/n3_sp.png);
}
ul.navBox_list li.n4 a{
	background-image: url(../img/common/n4_sp.png);
}
ul.navBox_list li.n5 a{
	background-image: url(../img/common/n5_sp.png);
}
ul.navBox_list li.n6 a{
	background-image: url(../img/common/n6_sp.png);
}
ul.navBox_list li.n7 a{
	background-image: url(../img/common/n7_sp.png);
}
ul.navBox_list li.n8 a{
	background-image: url(../img/common/n8_sp.png);
}
ul.navBox_list li.n9 a{
	background-image: url(../img/common/n9_sp.png);
}
ul.navBox_list li.n10 a{
	background-image: url(../img/common/n10_sp.png);
}
ul.navBox_list li.nTw a{
	background-image: url(../img/common/ntw_sp.png);
}
.navBox_share ul{
	display: flex;
}
.navBox_share ul li{
	width: 44px;
	height: 44px;
	margin-right: 5%;
}
.navBox_share ul li a{
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
}
.navBox_share ul li.tw a{
	background-image: url(../img/common/sns_tw.svg);
	background-size: 17px;
}
.navBox_share ul li.fb a{
	background-image: url(../img/common/sns_fb.svg);
	background-size: 17px;
}
.navBox_share ul li.line a{
	background-image: url(../img/common/sns_li.svg);
	background-size: 17px;
}
.navBox_share{
	padding-left: 10%;
}
@media screen and (max-width:480px) {
	.navBox_share{
		padding-left: 36px;
	}
}/*-- END --*/
.navAni{
	opacity: 0;
	transition: .4s ease;
	transform: translateX(-20px);
}
.navAni.active{
	transition-delay: .6s;
	opacity: 1;
	transform: translateX(0);
}
/*-----------------------------------------------
FOOTER
-------------------------------------------------*/
footer{
	width: calc(100% - 80px);
	margin-left: 80px;
	position: relative;
	z-index: 1;
}
@media screen and (max-width:480px) { 
	footer{
		width: calc(100% - 65px);
		margin-left: 65px;
	}
}/*-- END --*/
body#sub footer small{
	display: block;
	width: 100%;
	height: 50px;
	text-align: center;
	line-height: 50px;
	transform: scale(.7);
	color: #000;
}
.pagetop {
	width: 30px;
	margin: auto;
	position: absolute;
	bottom: 20px;
	right: 0;
	left: 0;
}
.pagetop a{
	display: block;
	width: 100%;
	position: relative;
}
.pagetop a:before {
	content: "";
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 1px solid #000;
	box-sizing: border-box;
}
.pagetop a .lineBox {
	display: block;
	width: 6px;
	position: absolute;
	margin: auto;
	top: 14px;
	left: 0;
	right: 0;
}
.pagetop a .lineBox > span{
	position: absolute;
	width: 100%;
	height: 1px;
	background: #000;
	display: block;
	top: 0;
}
.pagetop a .lineBox span:nth-child(1){
	transform: rotate(130deg);
	left: -2px;
}
.pagetop a .lineBox span:nth-child(2){
	transform: rotate(-130deg);
	right: -2px;
}
.pagetop a > small {
	display: block;
	background: url(../img/common/t_top_sp.png) no-repeat center / 20px;
	width: 30px;
	height: 6px;
	margin: 4px auto 0;
}
.movieBtn{
	width: 100%;
	height: auto;
	position: relative;
	padding-top: 56.25%;
}
.movieBtn a{
	background-repeat: no-repeat;
	background-position: center;
	background-size: 136%;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.movieBtn a:after{
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: #000;
	top: 0;
	left: 0;
	z-index: 1;
	opacity: .5;
}
.modalBtn_circle{
	display: block;
	width: 50px;
	height: 50px;
	border: 1px solid #fff;
	border-radius: 50%;
	position: absolute;
	z-index: 2;
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
.modalBtn_circle:after {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	box-shadow: none;
}
.modalBtn_circle:after {
	animation: ripple 1.5s ease-in-out infinite;
}
@keyframes ripple {
	0%  { opacity:1; transform:scale(1); box-shadow: 0 0 0 1px rgba(255,255,255,0); }
	100%{ opacity:0; transform:scale(2); box-shadow: 0 0 0 1px rgba(255,255,255,1); }
}
.modalBtn_circle:before{
	content: "";
	position: absolute;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: 100%;
	margin: auto;
	top: 0;
	bottom: 0;
	z-index: 2;
	background-image: url(../img/common/icon_play.svg);
	width: 10px;
	height: 13px;
	left: 20px;
}
/*-----------------------------------------------
INDEX
-------------------------------------------------*/
#leftBox{
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 80px;
	background-color: #fff;
	z-index: 9998;
}
body#sub #leftBox{
	background-color: #d4d4d4;
}
@media screen and (max-width:480px) { 
	#leftBox{
		width: 65px;
	}
}/*-- END --*/
h1.leftLogo,
.leftLogo > h1{
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
#visualBox{
	width: calc(100% - 80px);
	margin-left: 80px;
	position: relative;
	z-index: 1;
}
.m_startdate{
	position: absolute;
	width: 92%;
	top: 3%;
	right: 3%;
	line-height: 1;
	z-index: 2;
}

.filmarks{
	width: 40%;
	top: 0px;
	left: 0%;
	line-height: 1;
	z-index: 2;
}

@media screen and (max-width:480px) { 
	#visualBox{
		width: calc(100% - 65px);
		margin-left: 65px;
	}
}/*-- END --*/
body#index .copyR small {
	display: block;
	width: 100%;
	height: 40px;
	text-align: center;
	line-height: 40px;
	transform: scale(.7);
	color: #000;
}
.visualBox_first_img{
	position: relative;
	z-index: 1;
}
.visualBox_first_catch{
	position: absolute;
	width: 3.6%;
	margin: auto;
	right: 0;
	left: 0;
	top: 15%;
	max-width: 24px;
	z-index: 2;
}
#visualBoxIn{
	position: relative;
	overflow: hidden;
	background-color: #000;
}
ul.changeList{
	position: relative;
	z-index: 1;
	width: 100%;
	height: auto;
	padding-top: 133%;
}
ul.changeList li{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: none;
	opacity: 0;
}
ul.changeList li.active{
	opacity: 1;
}
ul.changeList li:nth-child(1){
	transition: .8s ease;
	z-index: 1;
	display: block;
}
ul.changeList li:nth-child(2){
	z-index: 2;
}
ul.changeList li:nth-child(3){
	transition: .6s ease;
	z-index: 3;
}
ul.changeList li:nth-child(4){
	z-index: 4;
}
ul.changeList li:nth-child(5){
	transition: .6s ease;
	z-index: 5;
}
ul.changeList li:nth-child(6){
	z-index: 6;
}
.changeList_movie{
	left: 50%;
	transform: translateX(-50%);
}
.changeList_movie video {
	position: absolute;
	width: 100%;
	height: 100%;
}
.messageBg_1{
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
	background: #000;
	transition: .5s cubic-bezier(0.02, 0.88, 0.58, 1);
}
/*.changeList_message_1:before{
	content: "";
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
	background: #000;
	transition: .5s cubic-bezier(0.02, 0.88, 0.58, 1);
}*/
.messageBg_2{
	content: "";
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	right: 0;
	z-index: 1;
	background: #b42350;
	transition: .5s cubic-bezier(0.02, 0.88, 0.58, 1);
}
/*.changeList_message_2:before{
	content: "";
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	right: 0;
	z-index: 1;
	background: #b42350;
	transition: .5s cubic-bezier(0.02, 0.88, 0.58, 1);
}*/
.changeList_message_1.active .messageBg_1,
.changeList_message_2.active .messageBg_2{
	width: 100%;
}
.changeList_message_1 .messageTxt {
	position: absolute;
	z-index: 2;
	font-size: calc(1em + 1vw);
	line-height: 2.5;
	letter-spacing: 0.25em;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	width: 65vw;
}
.changeList_message_2 .messageTxt{
	position: absolute;
	z-index: 2;
	color: #fff;
	font-size: calc(1em + 1vw);
	line-height: 4;
	letter-spacing: 0.8em;
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	white-space: nowrap;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	opacity: 1;
}
.messageTxt{
	transition: 1.5s ease;
	filter: blur(15px);
	opacity: 0;
}
ul.changeList li.active .messageTxt{
	transition-delay: .3s;
	opacity: 1;
	filter: blur(0px);
}
.startDate{
	position: absolute;
	left: 3%;
	bottom: 2%;
	z-index: 2;
}
.startDateIn p{
	margin-bottom: 0px;
}
.startDateIn p:last-of-type{
	margin-bottom: 0;
}
.startDateIn p span{
	font-size: calc(0.8em + .1vw);
	line-height: 0;
	color: #fff;
	background-color: #000;
	font-weight: bold;
	letter-spacing: 0.25em;
}
.startDateIn .fan{
	background-color: #D2384E;
}

.topicsList{
	padding: 0 20px;
}
.topicsList__link{
	display: block;
	text-decoration: none;
	padding: 20px 20px 20px 0;
	position: relative;
	height: 96px;
	overflow: hidden;
}
.topicsList__link--day{
	color: #b42350;
	font-size: 10px;
	font-size: 1rem;
	display: block;
}
.topicsList__link--ttl {
	color: #000;
	font-size: 11px;
	font-size: 1.1rem;
	height: 40px;
	overflow: hidden;
	display: block;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.topicsList__link:before {
	content: "";
	background: url(../img/sub/arrow2_b.png) no-repeat 0 0 / 100%;
	width: 19px;
	height: 6px;
	position: absolute;
	right: 0;
	bottom: 14px;
}
.topicsList__link:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: #ccc;
	z-index: 1;
}
.topicsLists .owl-controls{
	display: none !important;
}
/*-----------------------------------------------
MODAL
-------------------------------------------------*/
.modalBox {
	position: fixed;
	overflow: auto;
	z-index: 99999;
	top: 0;
	left: 0;
	background: rgba(0,0,0,.75);
	width: 100%;
	height: 100%;
	display: none;
	-webkit-overflow-scrolling: touch;
}
.closeBtn {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	pointer-events: none;
}
.closeBtn a{
	display: block;
	width: 40px;
	height: 40px;
	position: absolute;
	border-radius: 50%;
	border: 1px solid #fff;
	top: 20px;
	right: 20px;
	pointer-events: auto;
	transition: .3s ease;
}
.closeBtn a:before{
	content: "";
	background: url(../img/common/close.png) no-repeat 0 0 / 100%;
	width: 14px;
	height: 14px;
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transition: .3s ease;
}
.closeBtn a:hover{
	background-color: #b42350;
}
.closeBtn a:hover:before{
	transform: rotate(90deg);
}
.oneModal {
	width: 100%;
	height: 100%;
	z-index: 1;
	display: none;
}
.oneModalIn {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: auto;
	margin: 0 auto;
	min-height: 100vh;
	min-height: 100%;
	position: relative;
}
.oneModalIn_cont{
	width: 100%;
}
.ytBox{
	width: 100%;
	position: relative;
	height: auto;
	padding-top: 62.5%;
	margin: 60px 0;
}
.ytBox iframe{
	position: absolute;
	width: 100%;
	height: 100%;
	display: block;
	top: 0;
	left: 0;
}
/*-----------------------------------------------
SUB
-------------------------------------------------*/
#contBox {
	width: calc(100% - 80px);
	margin-left: 80px;
	position: relative;
	z-index: 1;
	padding: 0 30px;
	margin-bottom: 50px;
}
@media screen and (max-width:480px) { 
	#contBox{
		width: calc(100% - 65px);
		margin-left: 65px;
		padding: 0 18px;
	}
}/*-- END --*/
#contBox > h2{
	margin-top: 40px;
	margin-bottom: 34px;
	max-width: 480px;
}
.introCatch{
	max-width: 480px;
	margin-bottom: 9%;
	margin-top: 60px;
}
.contBox_introIn p{
	font-size: 13px;
	font-size: 1.3rem;
	margin-bottom: 9%;
	line-height: 2;
}
.tabListBox{
	position: relative;
	width: calc(100% + 60px);
	margin-bottom: 60px;
	margin-left: -30px;
}
@media screen and (max-width:480px) { 
	.tabListBox{
		position: relative;
		width: calc(100% + 36px);
		margin-bottom: 36px;
		margin-left: -18px;
	}
}/*-- END --*/
ul.tabList{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	height: 100%;
}
ul.tabList li{
	width: 50%;
	height: 100%;
	position: relative;
	margin-bottom: 20px;
}
ul.tabList li.w100sp{
	width: 100%;
}
ul.tabList li:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	left: 0;
	top: 5px;
	background: #000;
}
ul.tabList li a{
	display: block;
	height: 100%;
	position: relative;
	margin: 0 auto;
	padding-top: 24px;
	text-decoration: none;
}
ul.tabList li a > span.circle{
	display: block;
	width: 11px;
	height: 11px;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	margin: auto;
}
ul.tabList li a > span.circle:before{
	content: "";
	width: 7px;
	height: 7px;
	background-color: #fff;
	border: 1px solid #000;
	border-radius: 50%;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	transition: .3s ease;
	box-sizing: border-box;
}
ul.tabList li a:hover > span.circle:before,
ul.tabList li a.active > span.circle:before{
	width: 100%;
	height: 100%;
}
ul.tabList li a > span.circle:after{
	content: "";
	width: 5px;
	height: 5px;
	background-color: #b42350;
	border-radius: 50%;
	position: absolute;
	top: 3px;
	right: 0;
	left: 0;
	margin: auto;
	transform: scale(0);
	transition: .3s ease;
}
ul.tabList li a:hover > span.circle:after,
ul.tabList li a.active > span.circle:after{
	transform: scale(1);
}
ul.tabList li a > span.txt{ 
	display: block;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: left 0;
	transition: .3s ease;
	height: 12px;
	overflow: hidden;
}
ul.tabList li a:hover > span.txt,
ul.tabList li a.active > span.txt{
	background-position: left -12px;
}
ul.tabList li a.t_aitsumuguhoshi > span.txt{ background-image: url(../img/sub/t_aitsumuguhoshi.png); }
ul.tabList li a.t_aitsumuguhoshi{ width: 97px; }
ul.tabList li a.t_2ndseason > span.txt{ background-image: url(../img/sub/t_2ndseason.png); }
ul.tabList li a.t_2ndseason{ width: 67px; }
ul.tabList li a.t_1stseason > span.txt{ background-image: url(../img/sub/t_1stseason.png); }
ul.tabList li a.t_1stseason{ width: 63px; }
ul.tabList li a.t_cast > span.txt{ background-image: url(../img/sub/t_cast.png); }
ul.tabList li a.t_cast{ width: 27px; }
ul.tabList li a.t_staff > span.txt{ background-image: url(../img/sub/t_staff.png); }
ul.tabList li a.t_staff{ width: 33px; }
.tabCont{
	display: none;
}
.storyBox p {
	font-size: 13px;
	font-size: 1.3rem;
	margin-bottom: 9%;
	line-height: 2;
}
.storyBox > h3{
	max-width: 480px;
	margin-bottom: 9%;
}
.tabCont.active .bAni{
	opacity: 1;
	filter: blur(0px);
}
.csBox > h3{
	max-width: 480px;
	margin-bottom: 9%;
}
ul.csList li{
	margin-bottom: 24px;
}
ul.csList li .charaName{
	color: #b42350;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1;
	margin-right: 10px;
}
#cast ul.csList li .charaName{
	display: inline-block;
}
ul.csList li .castName{
	color: #000;
	font-size: 15px;
	font-size: 1.5rem;
}
#cast ul.csList li .castName{
	display: inline-block;
}
ul.csList li .castName span{
	font-size: 10px;
	font-size: 1.0rem;
	line-height: 1;
	display: block;
	margin-top: 6px;
}
ul.sub_movList{
	position: relative;
	width: calc(100% + 60px);
	margin-bottom: 60px;
	margin-left: -30px;
}
@media screen and (max-width:480px) { 
	ul.sub_movList{
		position: relative;
		width: calc(100% + 36px);
		margin-bottom: 36px;
		margin-left: -18px;
	}
}/*-- END --*/
ul.sub_movList li{
	position: relative;
	margin-bottom: 20px;
}
ul.sub_movList li .sub_movBox{
	display: flex;
	position: relative;
}
ul.sub_movList li:nth-child(even) .sub_movBox{
	flex-direction: row-reverse;
}
ul.sub_movList li .sub_movThumb,
ul.sub_movList li .sub_movPlay{
	width: 50%;
	z-index: 1;
	position: relative;
	overflow: hidden;
}
ul.sub_movList .sub_movThumb > span{
	display: block;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	transition: .8s cubic-bezier(0.02, 0.88, 0.58, 1);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
ul.sub_movList li:hover .sub_movThumb > span{
	transform: scale(1.2);
}
ul.sub_movList .sub_movThumb:before{
	content: "";
	display: block;
	width: 100%;
	padding-top: 56.25%;
}
ul.sub_movList li a{
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 2;
}
.sub_movPlay:before{
	content: "";
	background: url(../img/sub/t_play.png) no-repeat 0 0 / 100%;
	width: 20px;
	height: 8px;
	position: absolute;
	margin: auto;
	top: -52px;
	right: 0;
	bottom: 0;
	left: 0;
}
.sub_movPlay:after{
	content: "";
	width: calc(50% + 15px);
	height: 1px;
	background: #000;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: -30px;
}
ul.sub_movList li:nth-child(even) .sub_movPlay:after{
	right: -30px;
	left: auto;
}
.sub_movPlay_circle{
	display: block;
	width: 30px;
	height: 30px;
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border:1px solid #000;
	border-radius: 50%;
}
.sub_movPlay_circle:before {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	box-shadow: none;
	animation: ripple_b 1.5s ease-in-out infinite;
}
@keyframes ripple_b {
	0%  { opacity:1; transform:scale(1); box-shadow: 0 0 0 1px rgba(0,0,0,0); }
	100%{ opacity:0; transform:scale(2); box-shadow: 0 0 0 1px rgba(0,0,0,1); }
}
.sub_movPlay_circle:after{
	content: "";
	background: url(../img/common/icon_play_b.svg) no-repeat 0 0 / 100%;
	width: 6px;
	height: 8px;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 12px;
}
.sub_movTtl{
	padding: 8px;
	text-align: center;
	font-size: 12px;
	font-size: 1.2rem;
}
.newsListBox,
.newsDetailBox{
	margin-top: -18px;
}
ul.newsList li a{
	display: block;
	position: relative;
	padding: 18px 0 ;
	text-decoration: none;
}
ul.newsList li a:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: #ccc;
	z-index: 1;
}
.newsList_data{
	color: #b42350;
	font-size: 12px;
	font-size: 1.2rem;
	display: block;
}
.newsList_title{
	color: #000;
	font-size: 12px;
	font-size: 1.2rem;
	display: block;
}
.newsList_arrow{
	background: url(../img/sub/arrow2_b.png) no-repeat 0 0 / 100%;
	width: 19px;
	height: 6px;
	position: absolute;
	right: 0;
	bottom: 18px;
}
.newsDetailBox{
	position: relative;
}
.newsDetail{
	position: relative;
	margin-bottom: 40px;
}
.newsDetail:before{
	content: "";
	position: absolute;
	width: 100%;
	height: 1px;
	left: 0;
	bottom: 0;
	background: #ccc;
}
.newsDetail > h3 {
	position: relative;
	padding: 18px 0;
}
.newsDetail > h3 .newsList_title{
	font-size: 13px;
	font-size: 1.3rem;
}
.newsDetail > h3:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: #ccc;
	z-index: 1;
}
.newsDetail_txtArea{
	padding: 30px 0;
}
.newsDetail_txtArea img{
	width: 100%;
	max-width: 100%;
	height:auto;
}
.newsDetail_txtArea p{
	font-size: 12px;
	font-size: 1.2rem;
	margin-bottom: 20px;
}
.newsDetail_txtArea p strong{
	background: #000;
	color: #fff;
}
.newsDetail_txtArea p.center{
	text-align: center;
}
.newsDetail_txtArea p.right{
	text-align: right;
}
.newsDetail_txtArea p.inBorder{
	padding: 18px;
	border: 1px solid #000;
}
.newsDetail_txtArea p a.linkA{
	text-decoration: none;
	padding: 6px 26px;
	color: #b42350;
	border: 1px solid #b42350;
	display: inline-block;
	transition: .3s ease;
}
.newsDetail_txtArea p a{
	text-decoration: none;
	color: #b42350;
}
.newsDetail_txtArea p iframe{
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	top: 0;
	left: 0;
}
.newsDetail_txtArea p .ifWrap{
	width: 100%;
	height: auto;
	padding-top: 56.25%;
	position: relative;
	display: inline-block;
}
.backTo{
	text-align: center;
	margin-bottom: 40px;
}
.backTo a{
	border: 1px solid #000;
	text-align: center;
	display: inline-block;
	color: #000;
	text-decoration: none;
	font-weight: bold;
	transition: .3s ease;
	padding: 6px 26px;
}
.contBox_onairIn > h3{
	max-width: 480px;
	margin-bottom: 26px;
}
ul.contBox_onairList li > h4{
	color: #b42350;
	font-size: 12px;
	font-size: 1.2rem;
	margin-bottom: 6px;
	font-weight: bold;
}
ul.contBox_onairList li > p{
	font-size: 12px;
	font-size: 1.2rem;
	color: #000;
	margin-bottom: 4px;
}
ul.contBox_onairList li > p.comment{
	font-size: 10px;
	font-size: 1rem;
	margin-bottom: 0;
}
.oaLink{
	margin-top: 10px;
}
.oaLink a{
	text-decoration: none;
	padding: 3px 16px;
	color: #b42350;
	border: 1px solid #b42350;
	display: inline-block;
	transition: .3s ease;
	font-size: 10px;
	font-size: 1rem;
}
ul.contBox_onairList li{
	margin-bottom: 26px;
}
ul.contBox_onairList li:last-child{
	margin-bottom: 0;
}
.contBox_onairIn{
	margin-bottom: 46px;
}
ul.seriesList li a > span.txt{
	font-size: 10px;
	font-size: 1rem;
	text-align: center;
	height: auto;
}
ul.seriesList li a:hover > span.txt,
ul.seriesList li a.active > span.txt{
	color: #b42350;
}
ul.productsList{
	display: flex;
	flex-wrap: wrap;
	width: calc(100% + 18px);
	margin-left: -9px;
}
ul.productsList li{
	width: 50%;
	padding: 0 9px;
	margin-bottom: 30px;
	position: relative;
}
ul.productsList li a{
	text-decoration: none;
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	padding-bottom: 30px;
}
ul.productsList li a:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: #ccc;
	z-index: 1;
}
ul.productsList li a:before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 1px;
	background: #b42350;
	z-index: 2;
	transition: .5s cubic-bezier(0.02, 0.88, 0.58, 1);
}
ul.productsList li a:hover:before{
	width: 100%;
}
.products_thumb{
	display: block;
	width: 100%;
	padding-top: 100%;
	overflow: hidden;
	margin-bottom: 14px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.products_ttl{
	display: block;
	font-size: 12px;
	font-size: 1.2rem;
	color: #000;
	transition: .3s ease;
}
ul.productsList li a:hover .products_ttl{
	color: #b42350;
}
.products_arrow {
	background: url(../img/sub/arrow2_b.png) no-repeat 0 0 / 100%;
	width: 19px;
	height: 6px;
	position: absolute;
	right: 0;
	bottom: 12px;
}
.productsDetail {
	position: relative;
	margin-bottom: 40px;
}
.productsDetail:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 1px;
	left: 0;
	bottom: 0;
	background: #ccc;
}
.productsDetail > h3 {
	position: relative;
	padding-bottom: 18px;
	font-size: 13px;
	font-size: 1.3rem;
	color: #000;
}
.productsDetail > h3:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: #ccc;
	z-index: 1;
}
.productsDetail_txtArea {
	padding: 30px 0;
}
@media screen and (max-width:480px) { 
	.productsDetail_txtArea img{
		width: 100%;
		max-width: 100%;
	}
}/*-- END --*/
.productsDetail_txtArea p{
	font-size: 12px;
	font-size: 1.2rem;
	margin-bottom: 20px;
}
.productsDetail_txtArea p.bh{
	margin-bottom: 10px;
}
.productsDetail_txtArea p strong{
	background: #000;
	color: #fff;
}
.productsDetail_txtArea p.center{
	text-align: center;
}
.productsDetail_txtArea p.bTxt{
	font-weight: bold;
}
.productsDetail_txtArea p.right{
	text-align: right;
}
.productsDetail_txtArea p.inBorder{
	padding: 18px;
	border: 1px solid #000;
}
.productsDetail_txtArea p a.linkA{
	text-decoration: none;
	padding: 6px 26px;
	color: #b42350;
	border: 1px solid #b42350;
	display: inline-block;
	transition: .3s ease;
}
.productsDetail_txtArea p a{
	text-decoration: none;
	color: #b42350;
}
.productsDetail_txtArea p iframe{
	width: 100% !important;
	height: 100% !important;
	position: absolute;
	top: 0;
	left: 0;
}
.productsDetail_txtArea p .ifWrap{
	width: 100%;
	height: auto;
	padding-top: 56.25%;
	position: relative;
	display: block;
}
.productsDetail_list{
	padding: 18px;
	border: 1px solid #000;
	margin-bottom: 20px;
	font-size: 12px;
	font-size: 1.2rem;
}
.productsDetail_list dt{
	color: #b42350;
	font-weight: bold;
	display: block;
}
.productsDetail_list dd{
	color: #000;
	display: block;
	margin-bottom: 10px;
}
.pbold{font-weight:bold;}
.bookBox{
	margin-bottom: 40px;
}
.bookBox:last-of-type{
	margin-bottom: 0;
}
.bookBox > h3{
	font-weight: bold;
	font-size: 14px;
	font-size: 1.4rem;
	color: #fff;
	margin-bottom: 20px;
}
.bookBox > h3 span{
	background: #000;
}
.bookDetailTxt{
	font-size: 12px;
	font-size: 1.2rem;
	display: block;
	margin-bottom: 20px;
}
#characters {
}
.characterBox {
	margin:0 2%;
	padding-bottom:2em;
}
.characterBoxin {
	margin-bottom: 1.6em;
}
.characterBoxin h3 {
	font-size:18px;
	font-size:1.8rem;
	letter-spacing: 0.05em;
	line-height:1;
	color: #b42350;
	margin-bottom:1em;
}
.characterBoxin h3 span {
	font-size: 12px;
	font-size:1.2rem;
	color: #000;
}
.characterBoxin h3 span:before {
	content:':';
	display: inline-block;
	padding:0 0.6em;
}
.characterVisual {
	margin-bottom:1.3em;
}
.characterText {
	font-size: 12px;
	font-size: 1.2em;
	line-height:2;
	letter-spacing: 0.05em;
}
.theaterBox {
	margin:0 auto;
}
.theaterBoxin {
	margin-bottom:2.3em;
}
.theaterBoxin h3 {
	font-size:17px;
	font-size:1.7rem;
	letter-spacing: 0.05em;
	line-height: 1;
	margin-bottom:0.5em;
	color:#b42350;
}
.theaterBoxin h3:before {
	content:'◆';
}
.theaterBoxin h3:after {
	content:'：';
}
.theaterBoxin__topText {
	margin-bottom:1.5em;
	font-size:13px;
	font-size:1.3rem;
	letter-spacing:0.05em
}
.theaterBoxin__topImg {
	text-align: center;
	margin-bottom:1.8em;
}
.theaterBoxin__mainText {
	font-size: 13px;
	font-size:1.3rem;
	letter-spacing: 0.05em;
	line-height:2;
	margin-bottom:1em;
}
.theaterBoxin__caution {
	font-size: 12px;
	font-size:1.2rem;
	letter-spacing: 0.05em;
	line-height:2;
	margin-bottom:2em;
}
.theaterLists {
	padding-bottom:2em;
}
.theaterLists h3 {
	font-size:17px;
	font-size:1.7rem;
	letter-spacing: 0.05em;
	line-height: 1;
	margin-bottom:1em;
	color:#b42350;
	text-align: center;
}
.theaterLists h3:before {
	content:'◆';
}
.theaterListsTable {
	width:calc(100% + 18px);
	margin-right:-18px;
	overflow: auto;
	display: none;
	padding-bottom:2em;
}
.theaterListsTable table {
	min-width: 100%;
}
.theaterListsTable th {
	white-space: nowrap;
	border:5px solid #FFF;
	padding:6px 10px;
	background:#b42350;
	text-align: left;
	color:#FFF;
	font-size:13px;
	font-size:1.3rem;
}
.theaterListsTable td {
	white-space: nowrap;
	border:5px solid #FFF;
	padding:6px 10px;
	text-align: center;
	color:#000;
	font-size:13px;
	font-size:1.3rem;
	position:relative;
	border-bottom:1px solid #FFF;
}
.theaterListsTable td:after {
	content:'';
	position: absolute;
	left:-3px;
	right:-2px;
	bottom:-1px;
	height:1px;
	background:#b42350;
}
.theaterListsTable td:first-child:after {
	left:0;
}
.theaterListsTable td:last-child:after {
	right:0;
}


.theaterListsTable2 {
	width:calc(100% + 18px);
	margin-right:-18px;
	overflow: auto;
	padding-bottom:2em;
}
.theaterListsTable2 table {
	min-width: 100%;
}
.theaterListsTable2 th {
	white-space: nowrap;
	border:5px solid #FFF;
	padding:6px 10px;
	background:#b42350;
	text-align: left;
	color:#FFF;
	font-size:13px;
	font-size:1.3rem;
}
.theaterListsTable2 td {
	white-space: nowrap;
	border:5px solid #FFF;
	padding:6px 10px;
	text-align: left;
	color:#000;
	font-size:13px;
	font-size:1.3rem;
	position:relative;
	border-bottom:1px solid #FFF;
}
.theaterListsTable2 td:after {
	content:'';
	position: absolute;
	left:-3px;
	right:-2px;
	bottom:-1px;
	height:1px;
	background:#b42350;
}
.theaterListsTable2 td:first-child:after {
	left:0;
}
.theaterListsTable2 td:last-child:after {
	right:0;
}



.theaterLists h4 a {
	display: block;
	color:#b42350;
	text-decoration: none;
	font-size:1.4rem;
	text-align: left;
	border-bottom:1px solid #b42350;
	font-weight: 5600;
	margin-bottom:5px;
	position: relative;
	padding:5px 0;
	margin-right:-18px;
}
.theaterLists h4 a:before {
	content:'▼';
	position: absolute;
	right:18px;
	top:0;
	bottom:0;
	box-sizing: border-box;
	padding:5px;
	transition:all 0.5s ease;
}
.theaterLists h4 a.on {
	border-bottom:none;
	margin-bottom:0;
}
.theaterLists h4 a.on:before {
	transform: rotate(180deg);
}
.twitter__l--title {
	font-weight: 700;
	margin-bottom:0.5em;
	font-size:1.3rem;
}
.twitter__l2--title {
	font-size:1.3rem;
	padding-top:1.5em;
}
.twitter__l--title:nth-of-type(n + 2) {
	padding-top:40px;
}