/* =================================
	lower CSS
================================= */

/*	header
============================== */
header.header div.header-inner {
	position:relative;
	text-align:left;
}
header.header div.header-inner p a,
header.header div.header-inner p span {
	display:block;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:contain;
}
header.header div.header-inner p span {
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
header.header div.header-inner p.logo a.lazy-done {
	-webkit-animation: flipInX 700ms;
	animation: flipInX 700ms;
}
header.header div.header-inner p.date span.lazy-done {
	-webkit-animation: flipInX 700ms;
	animation: flipInX 700ms;
}
header.header div.header-inner p {
	position:absolute;
	left:50%;
	z-index:5;
}
@media all and (min-width: 768px) {
header.header {
	background-position:center top;
}
header.header div.header-inner {
	height: 170px;
}
header.header div.header-inner p {
	margin-left:-190px;
}
header.header div.header-inner p.logo,
header.header div.header-inner p.logo a,
header.header div.header-inner p.date span {
	width:380px;
}
header.header div.header-inner p.logo,
header.header div.header-inner p.logo a {
	height:118px;
}
header.header div.header-inner p.date span {
	height:28px;
}
header.header div.header-inner p.logo {
	top: 25px;
}
header.header div.header-inner p.date {
	bottom: 22px;
}
}
@media all and (max-width: 767px) {
header.header {
	background-position:left top;
}
header.header div.header-inner {
	height: 108px;
}
header.header div.header-inner p {
	margin-left:-141px;
}
header.header div.header-inner p.logo,
header.header div.header-inner p.logo a,
header.header div.header-inner p.date span {
	width:282px;
}
header.header div.header-inner p.logo,
header.header div.header-inner p.logo a {
	height:88px;
}
header.header div.header-inner p.date span {
	height:21px;
}
header.header div.header-inner p.logo {
	top:10px;
}
header.header div.header-inner p.date {
	bottom:10px;
}
}

/*	slider menu
============================== */
div.menu {
	position:relative;
	z-index:5;
	background-color:hsla(0,0%,0%,1);
/*
	background-image: -webkit-gradient(linear, left top, right top, from(hsla(272,100%,78%,0)), color-stop(0.25, hsla(272,100%,78%,1)), color-stop(0.75, hsla(272,100%,78%,1)), to(hsla(272,100%,78%,0)));
	background-image: -webkit-linear-gradient(left, hsla(272,100%,78%,0), hsla(272,100%,78%,1) 25%, hsla(272,100%,78%,1) 75%, hsla(272,100%,78%,0));
	background-image: linear-gradient(to right, hsla(272,100%,78%,0), hsla(272,100%,78%,1) 50%, hsla(272,100%,78%,1) 75%, hsla(272,100%,78%,0));
*/
}
div.menu > nav {
	position:relative;
}
div.menu > nav div.outer {
	overflow:hidden;
}
div.menu > nav ul {
	list-style-type:none;
}
div.menu > nav div.outer ul {
	-webkit-transform: translateZ(0);
	display:table;
}
div.menu > nav div.outer ul li {
	display:table-cell;
}
div.menu > nav ul li a,
div.menu > nav ul li a span {
	display:block;
}
div.menu > nav ul li a {
	text-decoration:none;
}
div.menu > nav div.outer ul li a {
	text-align:center;
	line-height:1.25;
	color:#177bff;
	background-color:#fff;
	/* border-color:#99d6f0;
	border-style:solid; */
	padding:0.5em 1.25em;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.cmn div.menu > nav div.outer ul li a:after,
.cmn div.menu > nav div.outer ul li a span {
	white-space:nowrap;
}
.cmn div.menu > nav div.outer ul li a:after {
	display:block;
	font-weight:700;
}
.cmn div.menu > nav div.outer ul li a span {
	color:#000;
	font-weight:bold;
	/* プロポーショナルメトリクス */
	-moz-font-feature-settings: "palt";
	-webkit-font-feature-settings: "palt";
	font-feature-settings: "palt";
	/* font-feature-settings: "palt" 1, "halt" 1; */
	/* 字幅半角メトリクス
	-moz-font-feature-settings: "halt";
	-webkit-font-feature-settings: "halt";
	font-feature-settings: "halt"; */
}
div.menu > nav div.outer ul li a:hover,
.news div.menu > nav div.outer ul li.mnews a,
.about div.menu > nav div.outer ul li.mabout a,
.cast div.menu > nav div.outer ul li.mcast a,
.staff div.menu > nav div.outer ul li.mstaff a,
.story div.menu > nav div.outer ul li.mstory a,
.original div.menu > nav div.outer ul li.moriginal a,
.chart div.menu > nav div.outer ul li.mchart a,
.comment div.menu > nav div.outer ul li.mcomment a,
.bbs div.menu > nav div.outer ul li.mbbs a,
.extra div.menu > nav div.outer ul li.mextra a,
.gallery div.menu > nav div.outer ul li.mgallery a {
	color:#c00;
	text-shadow:1px 2px 2px hsla(0,0%,100%,0.5);
	background-color: #f9e401;
}
div.menu > nav div.outer ul li a:hover span,
.news div.menu > nav div.outer ul li.mnews a span,
.about div.menu > nav div.outer ul li.mabout a span,
.cast div.menu > nav div.outer ul li.mcast a span,
.staff div.menu > nav div.outer ul li.mstaff a span,
.story div.menu > nav div.outer ul li.mstory a span,
.original div.menu > nav div.outer ul li.moriginal a span,
.chart div.menu > nav div.outer ul li.mchart a span,
.comment div.menu > nav div.outer ul li.mcomment a span,
.bbs div.menu > nav div.outer ul li.mbbs a span,
.extra div.menu > nav div.outer ul li.mextra a span,
.gallery div.menu > nav div.outer ul li.mgallery a span {
	color:#000;
}

.cmn div.menu > nav div.outer ul li.mhome a:after {content:"TOP";}
.cmn div.menu > nav div.outer ul li.mnews a:after {content:"NEWS";}
.cmn div.menu > nav div.outer ul li.mabout a:after {content:"ABOUT";}
.cmn div.menu > nav div.outer ul li.mcast a:after {content:"CAST";}
.cmn div.menu > nav div.outer ul li.mstaff a:after {content:"STAFF";}
.cmn div.menu > nav div.outer ul li.mstory a:after {content:"STORY";}
.cmn div.menu > nav div.outer ul li.mchart a:after {content:"CHART";}
.cmn div.menu > nav div.outer ul li.moriginal a:after {content:"ORIGINAL";}
.cmn div.menu > nav div.outer ul li.mcomment a:after {content:"COMMENT";}
.cmn div.menu > nav div.outer ul li.mbbs a:after {content:"B B S";}
.cmn div.menu > nav div.outer ul li.mgallery a:after {content:"GALLERY";}
.cmn div.menu > nav div.outer ul li.mextra a:after {content:"EXTRA";}

@media all and (min-width: 768px) {
div.menu {
	background-position:center top;
	padding:12px 0;
}
div.menu > nav {
	width:980px;
	margin:0 auto;
}
div.menu > nav div.outer {
	margin:0 30px;
}
div.menu > nav div.outer ul li:not(:last-child) {
	padding-right:8px;
}
div.menu > nav div.outer ul li a {
	/* border-width:3px;
	border-radius:8px; */
	/* -webkit-box-shadow:0 0 15px hsla(0,0%,0%,0.3) inset;
	box-shadow:0 0 15px hsla(0,0%,0%,0.3) inset; */
}
.cmn div.menu > nav div.outer ul li a:after {
	font-size:83%;
}
.cmn div.menu > nav div.outer ul li a span {
	font-size:125%;
}
}
@media all and (max-width: 767px) {
div.menu {
	background-position:left top;
	background-size:30px;
	padding:6px 0;
}
div.menu > nav div.outer {
	margin:0 26px;
}
div.menu > nav div.outer ul li:not(:last-child) {
	padding-right:4px;
}
div.menu > nav div.outer ul li a {
	/* border-width:2px;
	border-radius:6px; */
	/* -webkit-box-shadow:0 0 10px hsla(0,0%,0%,0.3) inset;
	box-shadow:0 0 10px hsla(0,0%,0%,0.3) inset; */
}
.cmn div.menu > nav div.outer ul li a:after {
	font-size:75%;
}
.cmn div.menu > nav div.outer ul li a span {
	font-size:100%;
}
div.menu > nav div.outer ul li a span {
}
}
/* ctrl */
div.menu > nav ul.ctrl li {
	position:absolute;
	top:50%;
	margin-top:-19px;
}
div.menu > nav ul.ctrl li.ctrl-lef {
	left:0;
}
div.menu > nav ul.ctrl li.ctrl-rig {
	right:0;
}
div.menu > nav ul.ctrl li a {
	width:26px;
	height:38px;
	background-image:url(../img/arrow_menu.svg);
	background-repeat:no-repeat;
	background-size:156px 38px;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.menu > nav ul.ctrl li.ctrl-lef a {
	background-position:0 0;
}
div.menu > nav ul.ctrl li.ctrl-rig a {
	background-position:-26px 0;
}
div.menu > nav ul.ctrl li a.hidebtn {
	cursor:default;
}
div.menu > nav ul.ctrl li.ctrl-lef a.hidebtn {
	background-position:-104px 0;
}
div.menu > nav ul.ctrl li.ctrl-rig a.hidebtn {
	background-position:-130px 0;
}
@media all and (min-width: 768px) {
div.menu > nav ul.ctrl li.ctrl-lef a:not(.hidebtn):hover {
	background-position:-52px 0;
}
div.menu > nav ul.ctrl li.ctrl-rig a:not(.hidebtn):hover {
	background-position:-78px 0;
}
}
@media all and (max-width: 767px) {
}


/*	.wrap .contents
============================== */
div.wrap {
	background-repeat:repeat;
	/* background-color:#b2e0ff;
	background-color:#ffea00; */
}
div.wrap > div.contents {
	text-align:left;
	background-color:hsla(0,0%,100%,0.9);
}
@media all and (min-width: 768px) {
div.wrap {
	background-position:center top;
	padding:30px 0;
}
div.wrap > div.contents {
	/* width:924px; */
	margin:0 auto;
}
div.wrap > div.contents > div.contents-inner {
	padding:40px;
}
}
@media all and (max-width: 767px) {
div.wrap {
	background-position:left top;
	background-size:16px 270px;
	padding:15px 10px;
}
div.wrap > div.contents > div.contents-inner {
	padding: 10px;
}
}

/*	h1
============================== */
.story main > article > header,
.cast main > article > header {
    background-position:center top;
}
main > article > header {
	text-align:left;
	background-image:url(../img/cmn_h1_bg.jpg?0);
	background-position:center center;
	background-size:cover;
	background-color:#000;
}
.about main > article > header {
	background-image:url(../img/about_h1_bg.jpg?0)!important;
	background-position: center 420px;
}
.cast main > article > header {
	background-image:url(../img/cast_h1_bg.jpg?0)!important;
}
.comment main > article > header {
	background-image:url(../img/comment_h1_bg.jpg?0)!important;
}
.staff main > article > header {
	background-image:url(../img/staff_h1_bg.jpg?0)!important;
}
.extra_p main > article > header {
	background-image:url(../img/extra_h1_bg.jpg?0)!important;
}
.news main > article > header {
	background-image:url(../img/news_h1_bg.jpg?0)!important;
}
.original main > article > header {
	background-image:url(../img/original_h1_bg.jpg?0)!important;
}
.story main > article > header {
	background-image:url(../img/story_h1_bg.jpg?0)!important;
}
.report main > article > header {
	background-image:url(../img/report_h1_bg.jpg?0)!important;
	background-position: center -90px;
}
main > article > header > h1 {
	text-indent:110%;white-space:nowrap;overflow:hidden;
	background-image:url(../img/cmn_h1.png?2);
	background-position:left top;
	background-repeat:no-repeat;
	margin:0 auto;
}
@media all and (min-width: 768px) {
main > article > header {
	padding:15px 0;
}
main > article > header h1 {
	width: 570px;
	height:120px;
}
.about main > article > header h1 {background-position:0 -120px;}
.cast main > article > header h1 {background-position:0 -240px;}
.staff main > article > header h1 {background-position:0 -360px;}
.original main > article > header h1 {background-position:0 -480px;}
.chart main > article > header h1 {background-position:0 -600px;}
.comment main > article > header h1 {background-position:0 -720px;}
.bbs main > article > header h1 {background-position:0 -840px;}
.extra_p main > article > header h1 {background-position:0 -960px!important;}
.gallery main > article > header h1 {background-position:0 -1080px;}
.story main > article > header h1 {background-position: 0 -1440px;}
.report main > article > header h1 {background-position: 0px -1200px;}
.videos main > article > header h1 {background-position: 0px -1320px;}
.interview main > article > header h1 {background-position: 0px -1560px;}
}
@media (max-width: 767px) {
main > article > header {
	padding:11px 0;
}
main > article > header h1 {
	background-size: 285px 960px;
	width: 285px;
	height: 60px;
}
.about main > article > header h1 {background-position: 0 -60px;}
.cast main > article > header h1 {background-position: 0 -120px;}
.staff main > article > header h1 {background-position: 0 -180px;}
.original main > article > header h1 {background-position: 0 -240px;}
.chart main > article > header h1 {background-position: 0 -300px;}
.comment main > article > header h1 {background-position: 0 -360px;}
.bbs main > article > header h1 {background-position: 0 -420px;}
.extra main > article > header h1 {background-position:0 -720px;}
.gallery main > article > header h1 {background-position: 0 -540px;}
.story main > article > header h1 {background-position: 0 -720px;}
.report main > article > header h1 {background-position: 0 -600px;}
.videos main > article > header h1 {background-position: 0 -660px;}
.interview main > article > header h1 {background-position: 0 -780px;}
}




/*	kome
============================== */
main ul.kome li, main ul.kome2 li {
	color:#5e5e5e;
	line-height:1.5;
}
ul.kome li:not(:last-child), ul.kome2 li:not(:last-child) {
	margin-bottom:0.25em;
}
main div.nuri ul.kome li {
	color:#000;
}
main article#books ul.kome li {
	color:#c00;
}
main ul.kome li:before, main ul.kome2 li:before {
	display:block;
	float:left;
	font-family:serif;
}
main ul.kome li:before {
	content:"※";
}
main ul.kome2 li:nth-child(1):before {
	content:"※1";
}
main ul.kome2 li:nth-child(2):before {
	content:"※2";
}
main ul.kome li span, main ul.kome2 li span {
	display:block;
}
main ul.kome li span {
	padding-left:1.5em;
}
main ul.kome2 li span {
	padding-left:2.5em;
}
ul.kome:not(:last-child) {
	margin-bottom:1.5em;
}
@media all and (min-width: 768px) {
main ul.kome li, main ul.kome2 li {
	font-size:87.5%;
}
}
@media all and (max-width: 767px) {
main ul.kome li, main ul.kome2 li {
	font-size:83%;
}
}


/*	Youtube
============================== */
div.mov-outer {
	background-color:#000;
}
div.mov-inner {
	position:relative;
	height:0;
	padding-top:56.25%;
}
div.mov-inner iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

/*	sns footer
============================== */
.footer {
}
.footer div.footer-inner {
	text-align:left;
}
.footer-lef > aside {
	background-color:#000;
}
.footer .footer-lef > aside > section > div > div {
	background-color:#fff;
}
.footer .footer-lef > aside > section h2 a,
.footer .footer-lef > aside > section h2 a:after,
.footer .footer-lef > aside > section h2 a span {
	display:block;
}
.footer-lef > aside > section h2,
.footer-lef > aside > section h2 a span {
	background-repeat:no-repeat;
}
.footer .footer-lef > aside > section h2 {
	background-position:left top;
}
.footer .footer-lef > aside > section h2 a {
	position:relative;
	text-decoration:none;
}
.footer .footer-lef > aside > section h2 a span,
.footer .footer-rig > div.bn-insta a span {
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
.footer .footer-lef > aside > section h2 a:after {
	content:"";
	position:absolute;
	top:0;
	right:0;
	background-image:url(../img/sns_logos.svg);
	background-repeat:no-repeat;
}
.footer .footer-lef > aside.tw-outer > section h2 a:after {
	background-position:left top;
}
.footer .footer-lef > aside.fb-outer > section h2 a:after {
	background-position:right top;
}
.footer .footer-rig > div.bn-insta a, .footer .footer-rig > div.bn-insta a span {
	display:block;
}
.footer .footer-rig > div.bn-insta a {
	background-image:url(../img/cmn_footer_btn_ig.png);
	background-size:contain;
}
.footer .footer-rig > div.bn-insta a span {
	height:120px;
}
@media all and (min-width: 768px) {
.footer {
	padding:30px 0;
}
.footer .footer-inner {
	width:980px;
	margin:0 auto;
}
.footer-lef, .footer-lef aside.tw-outer {
	float:left;
}
.footer-rig, .footer-lef aside.fb-outer {
	float:right;
}
.footer-lef {
	width:668px;
}
.footer-rig {
	width:300px;
}
.footer-lef > aside {
	width:328px;
}
.footer-lef > aside > section {
	padding:0 12px 12px;
}
.footer-lef > aside > section h2,
.footer-lef > aside > section h2 a span {
	background-image:url(../img/sns_h2_pc.png);
}
.footer-lef > aside > section h2 a span {
	height:70px;
}
.footer-lef > aside.tw-outer > section h2 a span {
	background-position:0 -70px;
}
.footer-lef > aside.fb-outer > section h2 a span {
	background-position:0 -140px;
}
.footer .footer-lef > aside > section h2 a:after {
	width:70px;
	height:70px;
	background-size:140px 140px;
}
}
@media all and (max-width: 767px) {
.footer-lef > aside > section {
	padding:0 24px 10px;
}
.footer-lef > aside > section h2,
.footer-lef > aside > section h2 a span {
	background-image:url(../img/sns_h2_smp.png);
	background-size:200px 250px;
}
.footer-lef > aside > section h2 a span {
	height:50px;
}
.footer-lef > aside > section h2 {
}
.footer-lef > aside.tw-outer > section h2 a span {
	background-position:0 -50px;
}
.footer-lef > aside.fb-outer > section h2 a span {
	background-position:0 -100px;
}
.footer .footer-lef > aside > section h2 a:after {
	width:50px;
	height:50px;
	background-size:100px 100px;
}
div.fb-timeline {
????max-width:500px;
????margin:0 auto;
}
.footer .footer-rig > div.bn-insta {
	width:300px;
	margin:20px auto 10px;
}

}
@media all and (max-width: 479px) {
}



/*	SNS buttons
============================== */
.sns-btns {
	text-align:center;
}
.sns-btns .tw-share-btn, .sns-btns .fb {
	display:inline-block;
}
.sns-btns .tw-share-btn {
	padding-right:50px;
}
@media all and (min-width: 768px) {
.sns-btns {
	padding:20px 0;
}
}
@media all and (max-width: 767px) {
.sns-btns {
	padding:10px 0;
}
}

/*	figure
============================== */
.pic-main {
	position:relative;
}
.pic-main span,
.pic-main span img {
	display:block;
}
.pic-main span.pic {
	position:relative;
	height:0;
	background-position:center center;
	background-repeat:no-repeat;
	padding-top:66.1290322580645%;
}
.pic-m-tate span.pic {
	padding-top:133.333333333333333%;
}
.pic-main span.lazy-done {
	-webkit-animation: fadeIn 1000ms;
	animation: fadeIn 1000ms;
}
.pic-main span img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.pic-main figcaption {
	display:block;
	text-align:center;
	line-height:1.75;
	margin-top:20px;
}
.pic-main figcaption span {
	display:inline;
}
.pic-main figcaption > span {
	background-color:#fff04e;
}
@media all and (min-width: 768px) {
.pic-main {
	width:620px;
	margin:0 auto 50px;
}
.pic-m-tate {
	width:420px;
}
.pic-main span.lazy-done {
	-webkit-box-shadow:10px 10px 0 0 #f9e401;
	box-shadow:10px 10px 0 0 #f9e401;
}
/*
.column .pic-main span.lazy-done {
	-webkit-box-shadow:10px 10px 0 0 hsla(50,97%,53%,0.5);
	box-shadow:10px 10px 0 0 hsla(50,97%,53%,0.5);
}
*/
.pic-main figcaption {
	font-size:87.5%;
}
}
@media all and (max-width: 767px) {
.pic-main {
	margin:0 12px 20px;
}
.pic-m-tate {
	margin:0 15%;
	margin-bottom:20px;
}
.pic-main span.pic {
	background-size:cover;
}
.pic-main span.lazy-done {
	-webkit-box-shadow:6px 6px 0 0 #f9e401;
	box-shadow:6px 6px 0 0 #f9e401;
}
.column .pic-main span.lazy-done {
	-webkit-box-shadow:6px 6px 0 0 hsla(50,97%,53%,0.5);
	box-shadow:6px 6px 0 0 hsla(50,97%,53%,0.5);
}
.pic-main figcaption {
	font-size:83%;
}
}


/*	figure (large)
============================== */
.pic-large {
	position:relative;
}
.pic-large span,
.pic-large span img {
	display:block;
}
.pic-large span {
	position:relative;
	height:0;
	background-position:center center;
	background-repeat:no-repeat;
	padding-top:66.4502164502165%;
}
.pic-large span.lazy-done {
	-webkit-animation: fadeIn 1000ms;
	animation: fadeIn 1000ms;
}
.pic-large span img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
@media all and (min-width: 768px) {
}
@media all and (max-width: 767px) {
.pic-large span {
	background-size:cover;
}
}

/*	figure (sub)
============================== */
div.cmn-pic-sub figure {
	width:50%;
}
div.cmn-pic-sub figure.subpic-lef {
	float:left;
}
div.cmn-pic-sub figure.subpic-rig {
	float:right;
}
div.cmn-pic-sub figure span,
div.cmn-pic-sub figure span img {
	display:block;
}
div.cmn-pic-sub figure > span {
	/* border:1px solid #fff;
	background-color:#fff;
	background-image: -webkit-gradient(linear, center top, center bottom, from(#d9eafc), color-stop(0.5, #fff), to(#d9eafc));
	background-image: linear-gradient(#d9eafc, #fff 50%, #d9eafc); */
}
div.cmn-pic-sub figure > span span {
	position:relative;
	height:0;
	background-repeat:no-repeat;
	background-size:cover;
	padding-top:66.1290322580645%;
}
div.cmn-pic-sub figure > span span img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.cmn-pic-sub figure > span span.lazy-done {
	-webkit-animation: fadeIn 1000ms;
	animation: fadeIn 1000ms;
}
@media all and (min-width: 768px) {
div.cmn-pic-sub figure.subpic-lef > span {margin-right:12px}
div.cmn-pic-sub figure.subpic-rig > span {margin-left:12px}
div.cmn-pic-sub {
	margin-bottom:30px;
}
div.cmn-pic-sub figure > span span.lazy-done {
	-webkit-box-shadow:8px 8px 0 0 #ffb200;
	box-shadow:8px 8px 0 0 #ffb200;
}
}
@media all and (max-width: 767px) {
div.cmn-pic-sub {
	position:relative;
	margin:0 -12px 20px;
}
div.cmn-pic-sub figure.subpic-lef > span {margin-right:3px;}
div.cmn-pic-sub figure.subpic-rig > span {margin-left:3px;}

div.cmn-pic-sub figure > span span.lazy-done {
	-webkit-box-shadow:0 5px 0 0 #ffb200;
	box-shadow:0 5px 0 0 #ffb200;
}
}


/*	figure (three)
============================== */
div.cmn-pic-three figure {
	width:33.3%;
}
div.cmn-pic-three figure {
	float:left;
}

div.cmn-pic-three figure span,
div.cmn-pic-three figure span img {
	display:block;
}
div.cmn-pic-three figure > span {
}
div.cmn-pic-three figure > span span.pic {
	position:relative;
	height:0;
	background-repeat:no-repeat;
	background-size:cover;
	padding-top:66.1290322580645%;
}
div.cmn-pic-three figure > span span img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.cmn-pic-three figure > span span.lazy-done {
	-webkit-animation: fadeIn 1000ms;
	animation: fadeIn 1000ms;
}
div.cmn-pic-three figure figcaption {
	line-height:1.5;
	text-align:center;
	margin-top:0.75em;
}

@media all and (min-width: 768px) {
div.cmn-pic-three {
	margin-bottom:30px;
}
div.cmn-pic-three figure > span span.lazy-done {
	-webkit-box-shadow:8px 8px 0 0 #e61419;
	box-shadow:8px 8px 0 0 #e61419;
}
div.cmn-pic-three figure figcaption {
	font-size:87.5%;
}
}
@media all and (max-width: 767px) {
div.cmn-pic-three {
	margin-bottom:20px;
}
div.cmn-pic-three figure > span span.lazy-done {
	-webkit-box-shadow:5px 5px 0 0 #e61419;
	box-shadow:5px 5px 0 0 #e61419;
}
div.cmn-pic-three figure figcaption {
	font-size:75%;
}
}

/*	button
============================== */
p.btn a, p.btn a span {
	display:block;
}
p.btn a {
	position:relative;
	overflow:hidden;
	text-decoration:none;
	border-style:solid;
	border-color:#000;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	color:#000;
	background-color: #f9e401;
	/*	background-image:-webkit-linear-gradient(top,#b1fd18,#00ff78 80%,#06bbf2);
	background-image:linear-gradient(to bottom,#b1fd18,#00ff78 80%,#06bbf2); */
}
p.btn a span {
	font-weight:bold;
	text-align:center;
}
p.btn a span:before {
	content:"";
	display:block;
	position:absolute;
	top:50%;
	background-image:url(../img/arrow40.svg);
	background-repeat:no-repeat;
	background-color:#fff;
}
@media all and (min-width: 768px) {
p.btn {
	margin:0 120px;
}
p.btn:not(:last-child) {
	margin-bottom:30px;
}
p.btn a {
	border-radius:25px;
	height:50px;
	border-width:3px;
}
p.btn a span {
	font-size:112.5%;
	line-height:44px;
}
p.btn a:hover {
	color:#fff;
	background-color:#000;
	background-image:none;
}
p.btn a:hover span {
	text-shadow:0 2px 2px hsla(0, 0%, 0%, .2);
}
p.btn a span:before {
	left:6px;
	background-position:-124px -4px;
	background-size:160px 40px;
	border-radius:16px;
	width:32px;
	height:32px;
	margin-top:-16px;
}
}
@media all and (max-width: 767px) {
p.btn:not(:last-child) {
	margin-bottom:15px;
}
p.btn a {
	border-radius:18px;
	height:36px;
	border-width:2px;
}
p.btn a span {
	font-size:87.5%;
	line-height:32px;
}
p.btn a span:before {
	left:4px;
	background-position:-93px -3px;
	background-size:120px 30px;
	border-radius:12px;
	width:24px;
	height:24px;
	margin-top:-12px;
}
}


p.btn-caption {
	color:#c00;
	font-weight:bold;
	text-align:center;
	line-height:1.5;
}
p.btn-caption span {
	background-image: -webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(0.5, transparent), color-stop(0.5, hsla(56,100%,50%,0.5)), to(hsla(56,100%,50%,0.5)));
	background-image: linear-gradient(transparent 50%, hsla(56,100%,50%,0.5) 50%);
	padding:0 1em 0.25em;
}
@media all and (min-width: 768px) {
p.btn-caption:not(:last-child) {
	margin-bottom:30px;
}
}
@media all and (max-width: 767px) {
p.btn-caption {
	font-size:83%;
}
p.btn-caption:not(:last-child) {
	margin-bottom:20px;
}
}


/*	small button
============================== */
p.btn-s {
	position:relative;
	overflow:hidden;
}
p.btn-s a {
	display:block;
	color: #000;
	background-color:hsla(0,0%,100%,0.75);
	background-color:#f0d6a8;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
}
p.btn-s a:before {
	content:"";
	display:block;
	position:absolute;
	top:50%;
	background-image:url(../img/arrow40.svg);
	background-repeat:no-repeat;
	background-color:#fff;
}
@media all and (min-width: 768px) {
p.btn-s:not(:last-child) {
	margin-bottom:30px;
}
p.btn-s a {
	font-size:87.5%;
	height:32px;
	line-height:32px;
}
p.btn-s a:hover {
	background-color:#e5b36d;
	background-image:none;
}
p.btn-s a:before {
	left:6px;
	background-position:-20px 0;
	background-size:80px 20px;
	width:20px;
	height:20px;
	margin-top:-10px;
	border-radius:10px;
}
}
@media all and (max-width: 767px) {
p.btn-s {
}
p.btn-s:not(:last-child) {
	margin-bottom:15px;
}
p.btn-s a {
	font-size:83%;
	height:32px;
	line-height:32px;
}
p.btn-s a:before {
	left:6px;
	background-position:-20px 0;
	background-size:80px 20px;
	width:20px;
	height:20px;
	margin-top:-10px;
	border-radius:10px;
}
}

/*	ul button
============================== */
ul.btns {
	list-style-type:none;
}
ul.btns li {
	width:50%;
	float:left;
}
ul.btns li a, ul.btns li span {
	display:block;
}
ul.btns li a {
	position:relative;
	overflow:hidden;
	text-decoration:none;
	border-style:solid;
	border-color:#6270fa;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	color:#283cc8;
	background-color:#00ff78;
	background-image:-webkit-linear-gradient(top,#b1fd18,#00ff78 80%,#06bbf2);
	background-image:linear-gradient(to bottom,#b1fd18,#00ff78 80%,#06bbf2);
}
ul.btns li a span {
	font-weight:bold;
	text-align:center;
	text-shadow:0 0px 2px hsla(0, 0%, 100%, .9);
}
ul.btns li a span:before {
	content:"";
	display:block;
	position:absolute;
	top:50%;
	background-image:url(../img/arrow40.svg);
	background-repeat:no-repeat;
	background-color:#fff;
}
@media all and (min-width: 768px) {
ul.btns {
	margin:0 32px;
}
ul.btns li {
	width:50%;
	float:left;
	border-radius:22px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin-bottom:10px;
}
ul.btns li:nth-child(odd) > span {
	margin-right:6px;
}
ul.btns li:nth-child(even) > span {
	margin-left:6px;
}
ul.btns li a {
	border-radius:25px;
	height:50px;
	border-width:3px;
}
ul.btns li a:hover {
	color:#fff;
	background-color:#06bbf2;
	background-image:none;
}
ul.btns li a:hover span {
	text-shadow:0 2px 2px hsla(0, 0%, 0%, .2);
}
ul.btns li a span {
	font-size:100%;
	line-height:44px;
}
ul.btns li a span:before {
	left:6px;
	background-position:-124px -4px;
	background-size:160px 40px;
	border-radius:16px;
	width:32px;
	height:32px;
	margin-top:-16px;
}
}
@media all and (max-width: 767px) {
ul.btns {
	margin:6px 6px 0;
}
ul.btns li {
	margin-bottom:4px;
}
ul.btns li:nth-child(odd) > span {
	margin-right:2px;
}
ul.btns li:nth-child(even) > span {
	margin-left:2px;
}
ul.btns li a {
	border-radius:18px;
	height:36px;
	border-width:2px;
}
ul.btns li a span {
	text-indent:16px;
	font-size:87.5%;
	line-height:32px;
}
ul.btns li a span:before {
	left:4px;
	background-position:-93px -3px;
	background-size:120px 30px;
	border-radius:12px;
	width:24px;
	height:24px;
	margin-top:-12px;
}
}



/* =================================
	CAST STAFF CSS
================================= */

.cast div.wrap > div.contents,
.staff div.wrap > div.contents {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.cast main table tr.nocast th, .cast main table tr.nocast td {
	font-size:0.5em !important;
	padding-bottom:0;
}
@media all and (min-width: 768px) {
.cast div.wrap > div.contents,
.staff div.wrap > div.contents {
	padding:40px 32px;
}
}
@media all and (max-width: 767px) {
.cast div.wrap > div.contents,
.staff div.wrap > div.contents {
	padding:20px 10px;
}
}



main table {
	width:100%;
	border-collapse:collapse;
	border-spacing:0;
	padding:0;
}
.cast main table th, .cast main table td,
.staff main table th, .staff main table td {
	vertical-align:top;
	line-height:1.75;
	text-align:left;
	padding-bottom:0.5em;
}
.cast main table tr.mama th, .cast main table tr.mama td {
	vertical-align:middle;
	line-height:1.25;
}
.cast main table th, .cast main table td {
	vertical-align:bottom;
}
.staff main table th, .staff main table td {
	padding-bottom:0.75em;
}
.cast main table th ruby rt {
	font-weight:normal;
}
.staff main table td b {
/*	color:#0086cc; */
}
.cast main table th,
.staff main table th {
	text-align:right;
	font-weight:normal;
	color: #7e7300;
	white-space: nowrap;
	width: 43%;
	font-weight:bold;
}
.cast main table td:not(.naka) {
	font-weight:bold;
}
.cast main table td.naka,
.staff main table td.naka {
	font-family: sans-serif;
	color: #7f7f7f;
	text-align:center;
	width:2em;
}
@media all and (min-width: 768px) {
.cast main table th, .cast main table td,
.staff main table th, .staff main table td {
	font-size:125%;
}
.cast main table th,
.staff main table th {
	width:46%;
}
}
@media all and (max-width: 767px) {
.cast main table th, .cast main table td,
.staff main table th, .staff main table td {
	font-size:87.5%;
}
.staff main table, .staff main table tbody, .staff main table tr {
	display:block;
}
.staff main table th, .staff main table td {
	display:block;
	text-align:center;
}
.staff main table th {
	padding:0;
	margin: 0 auto;
}
.staff main table th span {
	background-image: -webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(0.5, transparent), color-stop(0.5, hsla(56,100%,50%,0.5)), to(hsla(56,100%,50%,0.5)));
	background-image: linear-gradient(transparent 50%, hsla(56,100%,50%,0.5) 50%);
	padding:0 0.5em;
}
.staff main table td.naka {
	display:none;
}
.staff main table td {
	width:100%;
}
}

.cast main p.p-etc {
	position:relative;
	width:100%;
	height:1.5em;
}
.cast main p.p-etc span {
	display:block;
	position:absolute;
	left:50%;
	line-height:1.5;
	margin-left:14%;
}
@media all and (max-width: 767px) {
.cast main p.p-etc {
	font-size:83%;
}
}

/* =================================
	COMMENT
================================= */

.comment div.wrap > div.contents,
.original div.wrap > div.contents {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.original div.wrap > div.contents section.unit div.inner ul {
	margin-left:1.5em;
	list-style-type:circle;
}
.original div.wrap > div.contents section.unit div.inner ul li {
	line-height:1.5;
}
.original div.wrap > div.contents section.unit div.inner ul li:not(:last-child) {
	margin-bottom:0.5em;
}
@media all and (min-width: 768px) {
.comment div.wrap > div.contents,
.original div.wrap > div.contents {
	padding:40px 32px;
}
}
@media all and (max-width: 767px) {
.comment div.wrap > div.contents,
.original div.wrap > div.contents {
	padding:20px 10px;
}
.original div.wrap > div.contents section.unit div.inner ul li {
	font-size:87.5%;
}
}



/* =================================
	section.unit
================================= */

main article div.contents > section.unit {
}
main article div.contents > section.unit h2 {
	line-height:1.5;
	color:#f9e401;
	background-color:#000;
	margin-bottom: 0.5em;
	padding-bottom:0.25em;
}
main article div.contents > section.unit h2 span {
	display:block;
	padding: 0.25em 0.75em;
	border-bottom:3px solid #f9e401;
}
@media all and (min-width: 768px) {
main article div.contents > section.unit:not(:last-child) {
	margin-bottom:30px;
}
main article div.contents > section.unit h2 {
	font-size:112.5%;
}
}
@media all and (max-width: 767px) {
main article div.contents > section.unit:not(:last-child) {
	margin-bottom:15px;
}
}



/* =================================
	CHART CSS
================================= */
div.chart span, div.chart span img {
	display:block;
}
div.chart span.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
@media all and (min-width: 768px) {
div.chart span img {
	height:1110px;
}
}
@media all and (max-width: 767px) {
div.chart span {
	position:relative;
	height:0;
	padding-top:120.1298701298701%;
	background-size:contain;
}
div.chart span img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}

/*	picture (Sub L-R)
============================== */

@media all and (min-width: 768px) {
div.pic-sub span {
	display:block;
	background-repeat:no-repeat;
}
div.pic-lef span {
	background-position:center top;
}
div.pic-rig span {
	background-position:center bottom;
}
div.pic-lef {
	float:left;
}
div.pic-rig {
	float:right;
}
div.pic-sub {
	border: solid #fff 0.35em;
}
div.pic-sub span img {
	display:block;
}
div.pic-cover {
	margin-bottom:30px;
}
.pic-sub, .pic-sub span {
    width: 370px;
    height: 247px;
}
div.pic-sub span img {
	width:280px;
	height:174px;
}
}

/*	bknm
============================== */
#bknm {
  width: 100%;
}

#bknm h3 {
  font-weight: bold;
}

#bknm ul {
  margin: 1.5em auto 0;
}

#bknm li {
  display: inline-block;
  position: relative;
}

#bknm li a {
  display: inline-block;
  text-align: center;
  position: relative;
  overflow: hidden;
  box-shadow: 2px 2px 5px hsla(234, 33%, 13%, 0.15);
  /* border: 1px solid #fff; */
}

#bknm li a:after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -ms-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

#bknm li a:hover:after {
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
  background-position: center;
}

#bknm li span.epn {
  padding: 4% 5%;
  font-size: 70%;
  color: #f9e403;
  position: absolute;
  bottom: -4px;
  right: -4px;
  margin: 0 auto;
  z-index: 1;
  background-color: #000;
}

#bknm li span.epn strong {
  font-size: 160%;
  letter-spacing: -0.05em;
}



#bknm {
  margin: 5% auto 0;
  box-shadow: none;
}

#bknm h3 {
  font-size: 4vw;
  margin: 0 0 7%;
  padding: 0.5em;
  background-color: #000;
  color: #fff;
}

#bknm ul {
  margin: 0 auto;
  padding: 0 2% 0 0;
}

#bknm li {
  width: 29%;
  height: auto;
  margin: 0 0 3% 3%;
}

#bknm li a {
  width: 100%;
  height: 0;
  padding: 66.66666666666% 0 0;
}

#bknm li a img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

#bknm li span {
  font-size: 3.5vw;
}
@media all and (min-width: 768px) {
  #bknm li {
    width: 21%;
  }
  #bknm h3 {
    font-size: 1.5rem;
    margin: 0 0 4%;
  }
  #bknm li span.epn strong {
    letter-spacing: 0.02em;
  }
}

/*	h2
============================== */
.story h2,
.gallery h2 {
	padding: 0.3em 0.4em 0.4em 0.4em;
	background-color: #000;
	color: #fff;
}
.story h2.epnm,
.gallery h2.epnm {
  /* font-weight: bold; */
  /* letter-spacing: .07em; */
  margin: -40px -40px 0.5em -40px;
  font-size: 300%;
}
@media all and (max-width: 767px) {
  .story h2.epnm,
	.gallery h2.epnm {
    letter-spacing: 0;
    padding: 0.2em 0 0.05em;
    margin: -10px -10px 10px -10px;
  }
}
.story h2 span.num,
.gallery h2 span.num {
  padding: 0 .2em;
  letter-spacing: 0;
  display: inline-block;
}
@media all and (max-width: 767px) {
  .story h2 span.num,
	.gallery h2 span.num {
    color: #f9e403;
    font-size: 150%;
  }
}
@media all and (min-width: 768px) {
  .story h2 span.num,
	.gallery h2 span.num {
    color: #f9e403;
    font-size: 150%;
  }
}
strong {
  font-size: 165%;
}
strong.kng {
  letter-spacing: 0.08em;
}


.oa {
  text-align: center;
  color: #fff;
  font-family: urw-din, source-han-sans-japanese, sans-serif;
  font-weight: 900;
  font-style: normal;
  letter-spacing: 0.1em;
}

@media all and (max-width: 767px) {
	.oa {
		margin-bottom: 3%;
		font-size: 7vw;
		letter-spacing: 0.1em;
	}
}
