@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700,900&display=swap&subset=japanese');


/* ------------------------
 for Wordpress styles
------------------------ */
/* --------------
 reset
-------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}
ol,ul{list-style:none}
caption,th{text-align:left}
img {max-width:100% !important; height:auto;vertical-align: bottom;}
iframe {max-width:100% !important; border:none;}

/* --------------
 clearfix
-------------- */
.cf:after,
div:after,ul:after,ol:after,dl:after,
header:after,footer:after,
nav:after,section:after,article:after,aside:after,
.ulList li:after {
	content: ""; 
	display: block;
	clear: both;
}

.none {
	display: none;
}

/* --------------
 base
-------------- */
html { background: #fff;}
body {
	color: #111;
	font: 16px/1.4  'Noto Sans JP', "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",'Lucida Grande',"メイリオ",Meiryo,sans-serif;
	background-color: #fff;
}
body * {
	box-sizing: border-box;
}

/* link */
a {
	color: #487ed3;
	text-decoration: none;
	word-break: break-all;
}
a:hover {
	color: #34538b !important;
}
a:hover img {
	-moz-opacity: 0.8;
	opacity: 0.8;
}

mark {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcf87e+0,fcf87e+100&0+49,0+49,1+50 */
	background: -moz-linear-gradient(top, rgba(252,248,126,0) 0%, rgba(252,248,126,0) 49%, rgba(252,248,126,1) 50%, rgba(252,248,126,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(252,248,126,0) 0%,rgba(252,248,126,0) 49%,rgba(252,248,126,1) 50%,rgba(252,248,126,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(252,248,126,0) 0%,rgba(252,248,126,0) 49%,rgba(252,248,126,1) 50%,rgba(252,248,126,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fcf87e', endColorstr='#fcf87e',GradientType=0 ); /* IE6-9 */
}


/* --------------
 modules css
-------------- */



/* ---------- font color */
.clRed { color:#c90000;}
.clBlue { color:#1d57aa;}
.clOg { color:#FB6500;}
.clGray { color: #666666;}
.clYlw { color: #EFBC0A;}
.clGrn { color: #40b516;}
.clPpl { color: #834cd8;}
.clSBlue { color: #16B7D1;}
.clPink { color: #ff1167; }
.clTeal { color: #21B3B1; }

.clNormal { color: #111; }

.clWt { color: #fff;}

.cl-tw { color: #1DA1F2; }
.cl-yt { color: #f00; }

.outlineWt {
	text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff,
	 1px 0 0 #fff, 0 1px 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
}

/* ---------- font weight */
.thin {	font-weight: 100;}
.demilight {	font-weight: 300;}
.normal {	font-weight: 400;}
.midium {	font-weight: 500;}
.bold {	font-weight: 700;}
.black {	font-weight: 900;}

/* ---------- align */
.alc { text-align: center !important;}
.alr { text-align: right !important;}
.all { text-align: left !important;}

.alt { vertical-align: top !important;}
.alb { text-align: bottom !important;}
.alba { vertical-align: baseline !important;}


.alj {	
	/* 文字均等割付 */
 text-align: justify !important;
 text-justify: inter-ideograph !important;
}



.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignleft {
	float: left;
}
.alignright {
	float: right;
}



/* ---------- float */
.noFloat { float: none !important;}
.flc { margin-left: auto; margin-right: auto; }


/* ---------- Cancele */
.both { clear: both;}

/* ---------- margin,padding */
.mb0 {	margin-bottom: 0px !important;}
.mb5 {	margin-bottom: 5px !important;}
.mb10 {	margin-bottom: 10px !important;}
.mb15 {	margin-bottom: 15px !important;}
.mb20 {	margin-bottom: 20px !important;}
.mb25 {	margin-bottom: 25px !important;}
.mb30 {	margin-bottom: 30px !important;}
.mb35 {	margin-bottom: 35px !important;}
.mb40 {	margin-bottom: 40px !important;}
.mb45 {	margin-bottom: 45px !important;}

.mb1rem {	margin-bottom: 1rem !important;}

.ml0 {	margin-left: 0px !important;}
.ml5 {	margin-left: 5px !important;}
.ml10 {	margin-left: 10px !important;}
.ml20 {	margin-left: 20px !important;}
.ml30 {	margin-left: 30px !important;}

.mr0 {	margin-right: 0px !important;}
.mr5 {	margin-right: 5px !important;}
.mr10 {	margin-right: 10px !important;}
.mr20 {	margin-right: 20px !important;}
.mr30 {	margin-right: 30px !important;}
.mr60 {	margin-right: 60px !important;}

.mt0 {	margin-top: 0px !important;}
.mt5 {	margin-top: 5px !important;}
.mt10 {	margin-top: 10px !important;}
.mt15 {	margin-top: 15px !important;}
.mt20 {	margin-top: 20px !important;}
.mt30 {	margin-top: 30px !important;}

.pb0 {	padding-bottom: 0px !important;}
.pb5 {	padding-bottom: 5px !important;}
.pb10 {	padding-bottom: 10px !important;}
.pb20 {	padding-bottom: 20px !important;}
.pb30 {	padding-bottom: 30px !important;}

.pt0 {	padding-top: 0px !important;}
.pt5 {	padding-top: 5px !important;}
.pt10 {	padding-top: 10px !important;}
.pt20 {	padding-top: 20px !important;}
.pt30 {	padding-top: 30px !important;}

.pl0 {	padding-left: 0px !important;}
.pl5 {	padding-left: 5px !important;}
.pl10 {	padding-left: 10px !important;}
.pl20 {	padding-left: 20px !important;}
.pl30 {	padding-left: 30px !important;}

.pr0 {	padding-right: 0px !important;}
.pr5 {	padding-right: 5px !important;}
.pr10 {	padding-right: 10px !important;}
.pr20 {	padding-right: 20px !important;}
.pr30 {	padding-right: 30px !important;}

/* ----- text */

.fs04 { font-size: 0.4em !important;}
.fs045 { font-size: 0.45em !important;}
.fs05 { font-size: 0.5em; }
.fs06 { font-size: 0.6em; }
.fs07 { font-size: 0.7em; }
.fs08 { font-size: 0.8em; }
.fs09 { font-size: 0.9em; }
.fs10 { font-size: 1.0em; }
.fs11 { font-size: 1.1em; }
.fs12 { font-size: 1.2em; }
.fs13 { font-size: 1.3em; }
.fs14 { font-size: 1.4em; }
.fs15 { font-size: 1.5em; }
.fs16 { font-size: 1.6em; }
.fs17 { font-size: 1.7em; }
.fs18 { font-size: 1.8em; }
.fs19 { font-size: 1.9em; }
.fs20 { font-size: 2.0em; }
.fs21 { font-size: 2.1em; }
.fs22 { font-size: 2.2em; }
.fs23 { font-size: 2.3em; }
.fs24 { font-size: 2.4em; }
.fs25 { font-size: 2.5em; }


.fs5vw { font-size: 5vw; }
.fs7vw { font-size: 7vw; }
.fs10vw { font-size: 10vw; }

@media screen and (min-width: 1001px) { /*以上の時*/
	
.fs5vw { font-size: 50px; }
.fs7vw { font-size: 70px; }
.fs10vw { font-size: 100px; }
}

/* ----- list */
.ulDisc {
	margin-left: 22px;
	line-height: 1.4;
	list-style: outside disc;
}
.ulSquare {
	margin-left: 22px;
	line-height: 1.4;
	list-style: outside square;
}

.olDecimal {
	margin-left: 22px;
	list-style: outside decimal;
}

.ulDisc li, .ulSquare li, .olDecimal li {
	margin-bottom: .3em;
}

/* ----- text */

/* ----- youtube */

.youtubeBox {
	position: relative;
	height: 0;
	padding: 0 ;
	padding-top: 56.27%;
}
.youtubeBox iframe {
 position: absolute;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
}


/* ----- bg */

.bgBox {
	padding: 10px;
}

.bg-gray1 {	background-color: #f2f2f2; }
.bg-gray2 {	background-color: #363636; }
.bg-gray3 {	background-color: #a0a0a0; }

/* ----- btn */


.btn-a {
	display: inline-block;
	padding: .5em .8em;
	background: #fff;
	color: #111;
	border: #888 solid 1px;
}


.btn-b {
	display: inline-block;
	padding: .3em .5em;
	border-radius: 10px;
	background: rgba(0,0,0,.2);
	box-shadow: 0 -2px 0 rgba(0,0,0,.2) inset;
	color: #111;
}
.btn-b:hover {
	background: rgba(0,0,0,.1);
	box-shadow: 0 2px 0 rgba(0,0,0,.2) inset;
	
}



.btn-youtube {
	display: block;
	background: #f00;
	color: #fff;
	padding: 1em;
}

.btn-youtube:nth-of-type(2n) {
	background: #34538b;
}


.btn-youtube:hover {
	opacity: .7;
	color: #fff !important;
}

/* ----- bdr */


.bdrAll1s{
	border: #111 solid 1px;
}

.bdrRed{ border-color: #ff0023 !important;}
.bdrBlue{ border-color: #008ad7 !important;}
.bdrGrn{ border-color: #179e0a !important;}
.bdrPpl{ border-color: #943bc7 !important;}
.bdrYlw{ border-color: #d6a93b !important;}

.bdrGray { border-color: #aaa !important;}

.bdrGold { border-color: #D8B611 !important; }

hr.hr-transparent {
	width: 100%;
	height: 0;
	border: 0;
	border-bottom: transparent solid 1px;
	margin: .25rem 0;
}


.inlineblock {
	display: inline-block;
}
.block {
	display: block;
}


.lh10 {	line-height: 1.0;}
.lh15 {	line-height: 1.5;}
.lh20 {	line-height: 2.0;}



/* ---------- pagenation */

.pagination {
	border: none !important;
	text-align: center;
}
.pagination a,
.pagination span{
	border: #aaa solid 1px;
	display: inline-block;
	width: 2em;
	height: 2em;
	line-height: 2;
	text-align: center;
}
.pagination a:hover {
	color: #fff;
	background: #34538b;
}
.pagination .current {
	color: #fff;
	background: #34538b;
}




/* --------------
 common
-------------- */
/* =container
------------------------------------------------------------------------ **/
#container {
	position: relative;
	display: block;
}


/* =header
-------------------------------------------------------------- **/
#headWrap {
	position: relative;
	z-index: 10000000;
}

#header {
	border-bottom: #34538b solid 1px;
	width: 100%;
}

#siteHeader img {
	vertical-align: middle;
}

/* =siteHeader
---------------------------------------------------- */
#logo {
	line-height: 1.1;
}
#logo a {
	display: block;
}
/* =globalNav 
---------------------------------------------------- */

#mainNav a.comingsoon {
	pointer-events: none !important;
	position: relative;
}
#mainNav a.comingsoon:before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(255,255,255,.5);
}
#mainNav a.comingsoon:after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url("../img/menu-comingsoon.png") no-repeat center;
	background-size: contain;
	transform: rotateZ(-5deg);
}


/* =contents
-------------------------------------------------------------- **/
#main {
}
.contents {
	padding: 3rem 0;overflow-x: hidden;
}

#clm_page {
	margin-top: 3rem;
}

.contents + .contents {
	border-top: #34538b solid 1px;
}

.contents p,
.contents ol,
.contents ul,
.contents dl,
.contents table {
	margin-bottom: 1rem;
}


/* 画像中央寄せ */
.ofi {
  object-fit: contain;
  font-family: 'object-fit: contain;';
	width: 100%;
	height: 100%;
}

.image169 {
	position: relative;
	padding-top: 56.25%;
	overflow: hidden;
}
.image169 img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.image43 {
	position: relative;
	padding-top: 75%;
	overflow: hidden;
}
.image43 img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}



/* =headline / titles
---------------------------------------------------- */
.contents h1 {
	font-size: 1.8em;
	padding-bottom: 1rem;
	margin-bottom: 1.5rem;
	line-height: 1.1em;
	text-align: center;
	position: relative;
	letter-spacing: .25em;
	text-indent: .25em;
}
.contents h2 {
	font-size: 1.6em;
	margin-top: 3rem;
	margin-bottom: 1.5rem;
	line-height: 1.1em;

}
/*.contents h2:not(.noBg):first-of-type {
	margin-top: 1.5rem;
}*/

.contents h2:not(.noBg) {
	position: relative;
	padding: .25em;
	color: #fff;
	z-index: 2;
	transform: skewX(-10deg);
	text-shadow: 1px 1px 1px rgba(0,0,0,.25);
}
.contents h2:not(.noBg):before {
	content: '';
	display: block;
	width: 95vw;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	border-left: #731520 solid 2vw;
	background: #34538b;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#34538b+0,34538b+100&1+0,0+100 */
	background: -moz-linear-gradient(left,  rgba(41,116,184,1) 50%, rgba(41,116,184,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(41,116,184,1) 50%,rgba(41,116,184,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(41,116,184,1) 50%,rgba(41,116,184,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2974b8', endColorstr='#002974b8',GradientType=1 ); /* IE6-9 */
	z-index: -1;
	transform: skewX(10deg);
}
/*.contents h2:not(.noBg):after {
	content: '';
	display: block;
	width: 1.5em;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	background: #731520;
	z-index: -1;
}*/

.contents h3 {
	font-size: 1.4em;
	margin-top: 2rem;
	margin-bottom: 1rem;
	line-height: 1.1em;
}
.contents h4 {
	font-size: 1.2em;
	margin-top: 1rem;
	margin-bottom: 1rem;
	line-height: 1.1em;
}
.contents h5 {
	font-size: 1.1em;
	margin-top: 1rem;
	margin-bottom: 1rem;
	line-height: 1.1em;
}







/* =table
---------------------------------------------------- */
table,
th,
td {
	border-collapse: collapse;
	border:1px solid #aaa;
}
table {
	width: 100%;
	background: #fff;
}
th,
td {
	padding: 5px 10px;
}
th {
	text-align: center;
	/*vertical-align: top;*/
	background: rgba(0,0,0,.1);
}

td {
}

.contents dt {
	font-weight: bold;
}
.contents dd {
	margin-left: .5em;
}
.contents dl > *:not(:first-child) { 
	margin-top: .5rem;
}

.contents dl.dlA dt {
	float: left;
	clear: both;
	margin-right: 1rem;
}

.contents dl dd > *:last-child {
	margin-bottom: 0;
}


/* =footer
-------------------------------------------------------------- **/
#footer {
	position: relative;
	clear: both;
	/*background: rgba(42,21,88,.9);*/
	color: #fff;
}

#footer a {
	color: #fff;
}


/* =siteFooter
---------------------------------------------------- */

#siteFooter {
	background: #000;
	border-top: #34538b solid 1px;
}

.footerNav {
	padding: .5rem;
}

/* =footer-sns
-------------------------------------------------------------- **/

#footer-sns {
	border-top: #34538b solid 1px;
}
#footer-sns a {
	display: inline-block;
	padding: .3em;
	color: #fff;
}

.footerNav a.comingsoon {
	opacity: .5;
	pointer-events: none;
}

/* =sns_area
-------------------------------------------------------------- **/
/*.snsBox {
	text-align: center;
}
.btnSns a {
	display: inline-block;
	padding: 8px 13px;
	border-radius: 5px;
	color: #fff !important;
	background: #ccc;
	box-shadow: 0 3px 0 #aaa;
	text-decoration: none;
	margin-bottom: 10px;
}
.btnSns a:hover {
	opacity: .7;
}
.btnTw a {
	background: #00acee;
	box-shadow: 0 3px 0 #0092ca;
}
.btnFb a {
	background: #3b5998;
	box-shadow: 0 3px 0 #2c4373;
}
.btnLine a {
	background: #00c300;
	box-shadow: 0 3px 0 #2f9427;
}

.postSns {
	margin-top: 20px;
	border-top: #aaa dashed 1px;
	padding-top: 10px;
}*/


/* =copyright
------------------------------------------ */
#copyright {
	padding: 5px 0;
	text-align: center;
	color: #fff;
	background: #000;
}
#copyright a {
	color: #FFF;
	text-shadow: 0 0 2px #000;
}

/* =pageTop
---------------------------------------------------- */
#pageTop {
	display: block;
	position: fixed;
	z-index: 1000;
}
#pageTop a {
	display: block;
	color: #fff;
	background: rgba(0,0,0,.3);
	padding: .3em .5em;
}

#pageTop a:hover {
	opacity: 0.8;
}



/* --------------
 home container
-------------- */

/* =teaser
---------------------------------------------------- */
body[id*="teaser"] .contents h2:not(.noBg) {
	font-size: 1.8em;
}
body[id*="teaser"] .contents h3:not(.noBg) {
	font-size: 1.5em;
}
body[id*="teaser"] .cast-profile,
.cast-profile{
	background: rgb(0,0,0,.05);
	padding: 1rem;
	margin-bottom: 1rem;
}
body[id*="teaser"] .cast-profile > .wp-block-group__inner-container > *:first-child {
	margin-top: 0;
}
body[id*="teaser"] .cast-profile > .wp-block-group__inner-container > *:last-child {
	margin-bottom: 0;
}
.profile-links a {
	display: inline-block;
	padding: .25em .5em;
	border-radius: 5px;
	border: #555 solid 1px;
	background: #fff;
	color: #111;	
}
.profile-links a:hover {
	background: #fafafa;
}

body[id*="teaser"] .contents .teaser-hero h4:not(.noBg) {
	padding-left: .5em;
	border-left: #aaa solid 3px;
}

/* =visual
---------------------------------------------------- */
#home-visual {
	background: #34538b;
	border-bottom: #34538b solid 1px;
}
#home-visual .inner {
	position: relative;
}




/* =visual renew
---------------------------------------------------- */

#home-visual.renew .inner {
	background: #fff;
}
#home-visual.renew .visual-img {
	text-align: center;
}
#home-visual.renew .visual-movie .visual-movie-first {
	margin-top: 1rem;
}
#home-visual.renew .visual-movie dl dt {
	background: #34538b;
	border-radius: 2em;
	padding: .5em 1em;
	display: inline-block;
	color: #fff;
	margin-bottom: .5rem;
}


/* =news
---------------------------------------------------- */

.bs-a {
	box-shadow: 5px 5px 0 rgba(0,0,0,.1);
	margin-bottom: 10px;
	margin-right: 5px;
	background: #fff;
	display: block;
	border: rgba(0,0,0,.1) solid 1px;
}

.newsList li .inner {
}
.newsList li a {
	color: #111;
}
.newsList li time {
	font-size: .8em;
	line-height: 1;
	color: #888;
}
.newsList-img {
	background: #34538b;
	border-bottom: #34538b solid 1px;
}
.newsList-txt {
	padding: 10px;
	font-size: .9em;
	line-height: 1.2;
}
.newsList-txt .cutTxt {
	height: 2.5em;
	height: calc( 2em * 1.2 );
	overflow-y: hidden;
}
.newsList-txt .moreTxt {
	font-size: .8em;
	color: #34538b;
}

/* =broadcast
---------------------------------------------------- */
#home-broadcast {
	padding-bottom: 0;
}
#home-broadcast dd {
	margin-left: 0;
}

.broadcast-first dt {
	background: #34538b;
	border-radius: 2em;
	padding: .5em 1em;
	display: inline-block;
	color: #fff;
	margin-bottom: .5rem;
}
.contents .broadcast-first dd,
.contents .broadcast-others dd {
	margin: 0;
}
.broadcast-others {
	margin-bottom: 2rem;
}


/* =other
---------------------------------------------------- */
.homeContList a,
.homeContTxtList a {
	color: #111;
}
.homeContList .inner {
	padding: 5px;
}
.homeContList .inner .homeContList-txt {
	padding: 5px;
}
.homeContList .inner .homeContList-txt p {
	margin: 0;
}

.homeContTxtList p {
	padding: 10px;
	margin: 0;
}

.homeContList-img {
	position: relative;
}
.homeContList-img:before,
.homeContList-img:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	width: 5%;
	height: 100%;
	background: url("../img/homeContList-img.png") no-repeat center;
	background-size: 100% 100%;
	z-index: 1;
}
.homeContList-img:before {
	left: 0;
}
.homeContList-img:after {
	transform: rotateZ(180deg);
	right: 0;
}

.homeContTxtList a.comingsoon {
	pointer-events: none;
	color: #aaa;
}


/* ------------------------------------------------------------------------------------
 cast
------------------------------------------------------------------------------------ */
.castList > li {
	margin-bottom: 2rem;
	padding-bottom: 2rem;
	border-bottom: #ccc solid 1px;
}



.itemBox {
/*	background: rgba(0,0,0,.05);
	padding: 1%;*/
}
.itemBox h3 {
	text-align: center;
}

.itemBox .itemList-ttl {
	text-align: center;
	background: rgba(0,0,0,.1);
	padding: .2em;
	font-size: 1.5em;
}

.cat-team .inner {
	border: #34538b solid 1px;
	padding: 10px;
	font-size: .9em;	
}


.cast-profile dl {
	margin-bottom: 0;
}

.cast-profile dl dd {
	margin-left: 0;
}
.cast-profile dl dd p {
	line-height: 1.4;
}
.cast-profile .profileTxt {
	background: rgba(255,255,255,.5);
	padding: 3%;
}


.cast-profile .toggle {
	cursor: pointer;
}

.cast-profile .toggle:hover {
	color: #34538b;
}

/* ------------------------------------------------------------------------------------
 hero
------------------------------------------------------------------------------------ */

.heroList > li {
	margin-bottom: 2rem;
	padding-bottom: 1rem;
	border-bottom: #ccc solid 1px;
}
.heroList > li.cat-nounderline {
	border-bottom-color: transparent;
}


.heroSlide img,
.charaImg img{
	max-height: 60vh;
}

.heroSlideThum {
	text-align: center;
}

.slick-slide img,
.heroSlideThum img {
	margin: auto;
}


.heroSlideThum > div:not(.current) {
	opacity: .5;
}


/* ------------------------------------------------------------------------------------
 kaiju
------------------------------------------------------------------------------------ */

.kaijuList > li {
	margin-bottom: 2rem;
}


.bg-kaiju {
	background: url("../img/bg-kaiju.png?0618") no-repeat center / cover;
}

.kaijuList.listCover {
	font-size: 0;
}
.kaijuList.listCover li {
	font-size: 1rem;
	margin-bottom: 1rem;
}
.kaijuList.listCover .selfRep {
	display: none;
}
.kaijuList.listCover .listItem {
	display: inline-block;
	padding: 0 5px;
}
.kaijuList.listCover .listItem.active {
	position: relative;
	z-index: 2;
}
.kaijuList.listCover .listItem.active:before {
	position: absolute;
	content: '';
	width: 1px;
	height: 10rem;
	background: #34538b;
	top: 80%;
	left: 50%;
	margin-left: -.5px;
	z-index: -1;
}
.kaijuList.listCover .listItem .bs-a {
	margin-left: -5px;
}
.kaijuList.listCover .listItem.active .bs-a {
	border-color: #34538b;
}
.kaijuList.listCover .bs-a:hover {
	cursor: pointer;
	box-shadow: 5px 5px 5px rgba(0,0,0,.1);
}
.kaijuList.listCover:not(.complete) .bs-a {
	display: none;
}
.kaijuList.listCover .kaijuName {
	font-weight: bold;
	text-align: center;
	position: relative;
	line-height: 1.1;
	min-height: 3em;
	min-height: calc(3em * 1.1);
}
.kaijuList.listCover .kaijuName .inner {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	transform: translateY(-50%);
	padding: 5px;
}
.kaijuList.listCover .kaijuSpan {
	display: inline-block;
	margin: 0 .5em;
}
.kaijuList.listCover .kaijuSpan:first-child {
	margin: 0;
}


.kaijuList.listCover .expandField {
	width: 100% !important;
	display: block;
	position: relative;
	overflow: hidden;
	margin: 0;
	float: left;
	z-index: 3;
	margin-bottom: 1rem;
}

.kaijuList.listCover .expandField {
	border: #34538b solid 1px;
	position: relative;
	background: #fff;
}
.kaijuList.listCover .expandField .selfRepInner {
	padding: 10px;
}


.kaijuList.listCover .expandField .btnPrev,
.kaijuList.listCover .expandField .btnNext {
	position: absolute;
	display: block;
	width: 20px;
	height: 40px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
}
.kaijuList.listCover .expandField .btnPrev {
	left: 0;
	background: url("../img/btnPrev.png") no-repeat center /contain;
}
.kaijuList.listCover .expandField .btnNext {
	right: 0;
	background: url("../img/btnNext.png") no-repeat center /contain;
}
.kaijuList.listCover .expandField .btnClose {
	position: absolute;
	display: block;
	width: 40px;
	height: 40px;
	top: 0;
	right: 0;
	background: url("../img/btnClose.png") no-repeat center /contain;
	cursor: pointer;
}

.kaijuList.listCover .expandField h2 .engName {
	font-size: .8rem;
	font-style: italic;
	color: #888;
	font-weight: normal;
}
.kaijuList.listCover .expandField dt .engName {
	font-size: .8rem;
	font-style: italic;
	color: #888;
	display: inline-block;
	margin-left: .5em;
	font-weight: normal;
}



.robotList .engName {
	font-size: .8rem;
	font-style: italic;
	color: #888;
	display: inline-block;
	margin-left: .5em;
	font-weight: normal;
}



.selfRepInner .slick-dots {
	position: static;
}


/* ------------------------------------------------------------------------------------
 movielist
------------------------------------------------------------------------------------ */

.movielistList dl {
	margin: 0;
}
.movielistList dd {
	margin: 0;
	padding: 10px;
	font-size: .9em;
	line-height: 1.2;
}

.movielistList li {
	margin-bottom: 1rem;
}
.movielistList li > * {
	height: 100%;
}


/* ------------------------------------------------------------------------------------
 story
------------------------------------------------------------------------------------ */
#storyNav {
	padding: .5rem;
	border: #ccc solid 1px;
	background: #fff;
	position: relative;
}
#storyNav ul {
	font-size: .9em;
	margin: 0;
	padding:  0 1.5em;
}
#storyNav li {
	display: inline-block;
}
#storyNav li a {
	display: block;
	padding: .5em;
	border: #aaa solid 1px;
	border-radius: 5px;
	margin: .2em;
	min-width: 4em;
	text-align: center;
}
#storyNav li.active a {
	color: #34538b;
	border-color: #34538b;
}

#storyNav .storyNav-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	opacity: .3;
}
#storyNav .storyNav-arrow:hover {
	opacity: 1;
}
#storyNav .storyNav-arrow.prev {
	left: 0;
}
#storyNav .storyNav-arrow.next {
	right: 0;
}

#storyNav .storyNav-arrow.prev.slick-disabled {
	display: none !important;
}

.storyMovie {
	margin-bottom: 1rem;
}




/* ------------------------------------------------------------------------------------
 news (single)
------------------------------------------------------------------------------------ */

#post .postTtl {
	font-size: 1.5rem;
	letter-spacing: .05em;
	text-indent: .05em;
}



/* =anime
------------------------------------------------------------------ */

.effect {
	transition: 1s all ease;
}
.effect:not(.processed) {
	opacity: 0;
}

.effect-fadein.processed {
	opacity: 1;
}

.effect-movetop {
	transform: translateY(5vh);
}
.effect-movetop.processed {
	opacity: 1;
	transform: translateY(0);	
}

.hiddenX {
	overflow-x: hidden !important;
}

.effect-r2l {
	transform: translateX(10%);
}
.effect-r2l.processed {
	opacity: 1;
	transform: translateX(0);	
}
.effect-l2r {
	transform: translateX(-10%);
}
.effect-l2r.processed {
	opacity: 1;
	transform: translateX(0);	
}

.effect-standup {
	transform: rotateX(90deg);
}
.effect-standup.processed {
	opacity: 1;
	transform: rotateX(0);
}

.effect-open {
	transform: rotateY(90deg);
}
.effect-open.processed {
	opacity: 1;
	transform: rotateY(0);
}

