/* =================================
	TOP CSS
================================= */

/*	loading
============================== */
div.loading-wrap, div.loading-inner {
	-webkit-transition-duration:700ms;
	-webkit-transition-timing-function:ease-out;
	transition-duration:700ms;
	transition-timing-function:ease-out;
	-webkit-transition-property:opacity;
	transition-property:opacity;
	display:none;
}
div.loading-wrap {
	text-align:left;
	background-color:hsla(56,100%,50%,0.95);
	z-index:100;
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
div.loading-inner {
	text-align:left;
	background-image:url(../img/idx_loading.png?1);
	background-position:center center;
	background-repeat:no-repeat;
/*	background-color:hsla(0,0%,0%,0.25); */
	position:fixed;
	z-index:101;
}


div.loading-inner ul li span,
div.loading-inner ul li span img {
	display:block;
}

div.loading-inner ul li {
	position:absolute;
	display:none;
}

div.loading-inner ul li.appear {
	display:block;
	-webkit-animation: bounceInDown 700ms;
	animation: bounceInDown 700ms;
}

div.loading-inner ul li span {
	background-position:center center;
	background-repeat:no-repeat;
}

div.loading-inner ul li.ld-start {
	left:0;
	bottom:0;
	display:block;
}

div.loading-inner ul li.ld-start span {
	background-image:url(../img/idx_loading_start.gif?0);
}

div.loading-inner ul li.ld-nagi span {
	background-image:url(../img/idx_loading_nagi.png);
}
div.loading-inner ul li.ld-no span {
	background-image:url(../img/idx_loading_no.png);
}
div.loading-inner ul li.ld-o span {
	background-image:url(../img/idx_loading_o.png);
}
div.loading-inner ul li.ld-itoma span {
	background-image:url(../img/idx_loading_itoma.png);
}
div.loading-inner ul li.ld-ruby span {
	background-image:url(../img/idx_loading_ruby.png);
}

@media all and (min-width: 768px) {

div.loading-inner {
	width:640px;
	height:480px;
	left:50%;
	top:50%;
	margin-left:-320px;
	margin-top:-240px;
}


div.loading-inner ul li.ld-start span, div.loading-inner ul li.ld-start span img {
	width:640px;
	height:240px;
}

div.loading-inner ul li.ld-nagi {
	left:19px;
	top:72px;
}
div.loading-inner ul li.ld-no {
	left:208px;
	top:142px;
}
div.loading-inner ul li.ld-o {
	left:263px;
	top:121px;
}
div.loading-inner ul li.ld-itoma {
	left:341px;
	top:94px;
}
div.loading-inner ul li.ld-ruby {
	left:155px;
	top:24px;
}
div.loading-inner ul li.ld-nagi span, div.loading-inner ul li.ld-nagi span img {
	width:164px;
	height:196px;
}
div.loading-inner ul li.ld-no span, div.loading-inner ul li.ld-no span img {
	width:34px;
	height:44px;
}
div.loading-inner ul li.ld-o span, div.loading-inner ul li.ld-o span img {
	width:54px;
	height:60px;
}
div.loading-inner ul li.ld-itoma span, div.loading-inner ul li.ld-itoma span img {
	width:180px;
	height:114px;
}
div.loading-inner ul li.ld-ruby span, div.loading-inner ul li.ld-ruby span img {
	width:292px;
	height:70px;
}

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

div.loading-inner {
	position:fixed;
	width:100%;
	height:0;
	padding-top:75%;
	top:50%;
	margin-top:-50%;
	background-size:cover;
}
div.loading-inner ul {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.loading-inner ul li span {
	background-size:cover;
}

div.loading-inner ul li.ld-start {
	width:100%;
	top:50%;
}
div.loading-inner ul li span,
div.loading-inner ul li span img {
	width:100%;
	height:100%;
}

div.loading-inner ul li.ld-nagi {
	width:25.625%;
	height:40.833333333333333%;
	left:2.96875%;
	top:15%;
}
div.loading-inner ul li.ld-no {
	width:5.3125%;
	height:9.16666666666667%;
	left:32.5%;
	top:29.583333333333333%;
}
div.loading-inner ul li.ld-o {
	width:8.4375%;
	height:12.5%;
	left:41.09375%;
	top:25.2083333333333333%;
}
div.loading-inner ul li.ld-itoma {
	width:28.125%;
	height:23.75%;
	left:53.28125%;
	top:19.583333333333333%;
}
div.loading-inner ul li.ld-ruby {
	width:45.625%;
	height:14.583333333333333%;
	left:24.21875%;
	top:5%;
}

}




@keyframes bounceInDown {
	from, 60%, 75%, 90%, to {
		animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
	}

	0% {
		opacity: 0;
		transform: translate3d(0, -2000px, 0);
	}

	60% {
		opacity: 1;
		transform: translate3d(0, 25px, 0);
	}

	75% {
		transform: translate3d(0, -10px, 0);
	}

	90% {
		transform: translate3d(0, 5px, 0);
	}

	to {
		transform: none;
	}
}


/*	background
============================== */
html, body, div#con-body {
	background-color:#fff000;
}


/*	header
============================== */
div.header header {
	position:relative;
	text-align:left;
	background-repeat:no-repeat;
}
div.header header.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
div.header header h1 {
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.header header ul.sns-share {
	list-style-type:none;
}
div.header header ul.sns-share li {
	position:absolute;
	left:0;
	width:100%;
	height:100%;
}
div.header header ul.sns-share li.shr-tw {
	top:59.077809798270893%;
}
div.header header ul.sns-share li.shr-ln {
	top:71.613832853025937%;
}
div.header header ul.sns-share li.shr-fb {
	top:84.14985590778098%;
}
div.header header ul.sns-share li a {
	display:block;
	text-decoraion:none;
	text-indent:110%;white-space:nowrap;overflow:hidden;
	width:9.081632653061224%;
	height:11.38328530259366%;
}
@media all and (min-width: 768px) {
div.header header {
	width:980px;
	margin:0 auto;
}
div.header header h1 {
	height:694px;
}
}
@media all and (max-width: 767px) {
div.header header {
	height:0;
	padding-top:70.8163265306122%;
	background-size:cover;
}
div.header header h1 {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}

/*	countdown
============================== */
/*
@media all and (min-width: 768px) {
div.cdwn-outer {
	height:30px;
}
}
*/

div.cdwn-outer {
	text-align:left;
}
div.countdown {
/*	background-image:url(../img/cdwn_bg.png?0);*/
	background-image:url(../img/cdwn_bg_final.png?0);
	background-repeat:no-repeat;
	background-position:center top;
}
div.countdown-day0 {
	background-image:url(../img/cdwn_bg_day0.png?0);
}

div.countdown-day0 p.countdown-pre b#cd-day10,
div.countdown-day0 p.countdown-pre b#cd-day1 {
	display:none;
}

@media all and (min-width: 768px) {
div.cdwn-outer {
	width:980px;
	background-position:center top;
	background-repeat:no-repeat;
	margin:0 auto;
}
div.countdown {
}
div.countdown p {
	position:relative;
	height:114px;
}
}
@media all and (max-width: 767px) {
div.cdwn-outer {
}
div.countdown {
	position:relative;
	height:0;
	padding-top:11.6326530612245%;
	background-size:contain;
}
div.countdown p.countdown-pre,
div.countdown p.countdown-aft {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}

div.countdown p.countdown-pre span,
div.countdown p.countdown-pre b,
div.countdown p.countdown-pre b img {
	display:block;
}
div.countdown p.countdown-pre b {
	position:absolute;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
div.countdown p.countdown-pre span.cd-txt {
	display:none;
}
div.countdown p.countdown-pre b span {
}
div.countdown p.countdown-pre b span:not(.cd-txt) {
	background-image:url(../img/cdwn_num.png);
}
div.countdown p.countdown-pre b:first-child span {
	background-image:url(../img/cdwn_num.png);
}
@media all and (min-width: 768px) {
div.countdown p.countdown-pre b {
	top:14px;
	width:54px;
	height:86px;
}
div.countdown p.countdown-pre b span,
div.countdown p.countdown-pre b span img {
	width:54px;
	height:86px;
}
div.countdown p.countdown-pre b:first-child {left:59px;}
div.countdown p.countdown-pre b#cd-day10 {left:297px;}
div.countdown p.countdown-pre b#cd-day1 {left:353px;}
div.countdown p.countdown-pre b#cd-hour10 {left:450px;}
div.countdown p.countdown-pre b#cd-hour1 {left:506px;}
div.countdown p.countdown-pre b#cd-minute10 {left:646px;}
div.countdown p.countdown-pre b#cd-minute1 {left:702px;}
div.countdown p.countdown-pre b#cd-second10 {left:811px;}
div.countdown p.countdown-pre b#cd-second1 {left:867px;}


div.countdown-day0 p.countdown-pre b:first-child {left:135px;}
div.countdown-day0 p.countdown-pre b#cd-hour10 {left:373px;}
div.countdown-day0 p.countdown-pre b#cd-hour1 {left:429px;}
div.countdown-day0 p.countdown-pre b#cd-minute10 {left:569px;}
div.countdown-day0 p.countdown-pre b#cd-minute1 {left:625px;}
div.countdown-day0 p.countdown-pre b#cd-second10 {left:734px;}
div.countdown-day0 p.countdown-pre b#cd-second1 {left:790px;}



div.countdown p.countdown-pre b span:not(.cd-txt) {
	background-size:162px 258px;
}
}

div.countdown p.countdown-pre b:first-child span {



	background-position:right bottom !important;



}

div.countdown p.countdown-pre b.cd-one span {background-position:left top;}
div.countdown p.countdown-pre b.cd-two span {background-position:center top;}
div.countdown p.countdown-pre b.cd-three span {background-position:right top;}
div.countdown p.countdown-pre b.cd-four span {background-position:left center;}
div.countdown p.countdown-pre b.cd-five span {background-position:center center;}
div.countdown p.countdown-pre b.cd-six span {background-position:right center;}
div.countdown p.countdown-pre b.cd-seven span {background-position:left bottom;}
div.countdown p.countdown-pre b.cd-eight span {background-position:center bottom;}
div.countdown p.countdown-pre b.cd-nine span {background-position:right bottom;}
div.countdown p.countdown-pre b.cd-zero span {background-image:url(../img/cdwn_num_0.png);background-size:cover !important;}


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

div.countdown p.countdown-pre b {
	top:12.280701754385965%;
	width:5.510204081632653%;
	height:75.43869649122807%;
}
div.countdown p.countdown-pre b:first-child {left:6.020408163265306%;}
div.countdown p.countdown-pre b#cd-day10 {left:30.306122448979592%;}
div.countdown p.countdown-pre b#cd-day1 {left:36.020408163265306%;}
div.countdown p.countdown-pre b#cd-hour10 {left:45.918367346938776%;}
div.countdown p.countdown-pre b#cd-hour1 {left:51.63265306122449%;}
div.countdown p.countdown-pre b#cd-minute10 {left:65.918367346938776%;}
div.countdown p.countdown-pre b#cd-minute1 {left:71.63265306122449%;}
div.countdown p.countdown-pre b#cd-second10 {left:82.755102040816327%;}
div.countdown p.countdown-pre b#cd-second1 {left:88.469387755102041%;}


div.countdown-day0 p.countdown-pre b:first-child {left:13.775510204081633%;}
div.countdown-day0 p.countdown-pre b#cd-hour10 {left:38.061224489795918%;}
div.countdown-day0 p.countdown-pre b#cd-hour1 {left:43.775510204081633%;}
div.countdown-day0 p.countdown-pre b#cd-minute10 {left:58.061224489795918%;}
div.countdown-day0 p.countdown-pre b#cd-minute1 {left:63.775510204081633%;}
div.countdown-day0 p.countdown-pre b#cd-second10 {left:74.897959183673469%;}
div.countdown-day0 p.countdown-pre b#cd-second1 {left:80.612244897959184%;}


div.countdown p.countdown-pre b span:not(.cd-txt) {
	position:relative;
	height:0;
	padding-top:159.2592592592593%;
	background-size:300% 300%;
}
div.countdown p.countdown-pre b span img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}


div.countdown-ended {
	position:relative;
	background-image:none;
}
div.countdown p.countdown-aft {
	display:none;
	background-image:url(../img/cdwn_after.png);
	background-repeat:no-repeat;
	background-position:center top;
	background-size:contain;
}


/* for last OA */
/*
div.countdown p.countdown-pre b:first-child {
	display:none;
}
*/


/*	main
============================== */
main {
	text-align:left;
/*
	background-image: -moz-linear-gradient(top, #fff000, #ffd400);
	background-image: -webkit-linear-gradient(top, #fff000, #ffd400);
	background-image: linear-gradient(#fff000, #ffd400);
*/
}
@media all and (min-width: 768px) {
main {
}
}
@media all and (max-width: 767px) {

}


/*	.unit
============================== */
article.unit, article.unit header {
	position:relative;
}
article.unit header h2 {
	margin:0 auto;
}
article.unit header h2 span,
article.unit header div span,
article.unit header div span img {
	display:block;
}
article.unit header h2 > span {
	background-repeat:no-repeat;
	background-position:center top;
}
article.unit header h2 > span.lazy-done {
	-webkit-animation: flipInX 700ms;
	animation: flipInX 700ms;
}
article.unit header div.illusts {
	position:absolute;
}
article.unit header div.illusts span {
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center top;
}
article.unit header div.illusts span.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
article.unit header h2 span span {
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 768px) {
article.unit header h2 > span {
	height:111px;
}
}
@media all and (max-width: 767px) {article.unit header h2 {
	width:41.333333333333333%;
	width:39%;
}
article.unit header h2 > span {
	background-size:cover;
	position:relative;
	height:0;
	padding-top:48.3870967741935%;
}
article.unit header h2 span span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
article.unit header div.illusts span {
	background-size:cover;
	position:relative;
	height:0;
}
article.unit header div.illusts span img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}

/*	pc size float
============================== */
@media all and (min-width: 768px) {
div.pc-wrap {
	position:relative;
	padding:30px 0 20px;
}
div.pc-wrap:before, div.pc-wrap:after {
	content:"";
	display:block;
	position:absolute;
}
div.pc-wrap:before {
	right:0;
	top:0;
	width:40%;
	height:80%;
	background-image:url(../img/idx_menu_bg.png?1);
	background-repeat:repeat-x;
	background-position:right bottom;
	background-size:cover;
	background-color:#10e0fc;
}
div.pc-wrap:after {
	left:0;
	bottom:0;
	width:25%;
	height:60%;
	background-image:url(../img/idx_bg_yline.png);
}
div.pc-wrap-inner {
	width:980px;
	margin:0 auto;
}
div.pc-wrap-inner article.trailer {
	width:480px;
	float:left;
}
div.pc-wrap-inner div.menu {
	width:487px;
	float:right;
}
}


/*	trailer
============================== */
article.trailer div.mov-outer {
	position:relative;
	z-index:5;
/*
	background-color:#fff000;
	border-color:#fff000;
	border-style:solid;
	border-left-width:4px;
	border-right-width:4px;
	border-bottom-width:4px;
*/
}
@media all and (min-width: 768px) {
article.trailer header h2 > span.lazy-done {
	background-image:url(../img/idx_trailer_h2.png?0);
}
article.trailer header div.ill-lef span, article.trailer header div.ill-lef span img {
	width:138px;
	height:111px;
}
article.trailer header div.ill-rig span, article.trailer header div.ill-rig span img {
	width:104px;
	height:80px;
}
article.trailer header div.ill-lef {
	left:0;
	top:0;
}
article.trailer header div.ill-rig {
	right:10px;
	top:10px;
}
article.trailer div.mov-inner iframe {
	width:480px;
	height:269px;
}
}
@media all and (max-width: 767px) {
article.trailer {
	padding:0 20px 12px;
}
article.trailer:before, article.trailer:after {
	content:"";
	display:block;
	position:absolute;
	width:25%;
	height:60%;
	background-position:left bottom;
}
article.trailer:before {
	right:0;
	top:16%;
	background-image:url(../img/idx_bg_square.png);
}
article.trailer:after {
	left:0;
	bottom:0;
	background-image:url(../img/idx_bg_yline.png);
}
article.trailer header h2 > span.lazy-done {
	background-image:url(../img/idx_trailer_h2_smp.png?0);
}
article.trailer header div.ill-rig {
	right:16%;
	top:20%;
	width:13.866666666666667%;
}
article.trailer header div.ill-rig span {
	padding-top:76.9230769230769%;
}
article.trailer header div.ill-lef {
	left:9.06666666666667%;
	bottom:0;
	width:23.33333333333333%;
}
article.trailer header div.ill-lef span {
	padding-top:80%;
}
article.trailer div.mov-inner {
	position:relative;
	height:0;
	padding-top:56.25%;
}
article.trailer div.mov-inner iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}


/*	topics
============================== */
article.crsl-topics {
	/* background-color:hsla(0,0%,100%,0.5); */
}
article.crsl-topics header {
	position:relative;
}
article.crsl-topics header:before,
article.crsl-topics:after {
	content:"";
	display:block;
	position:absolute;
}
article.crsl-topics header:before {
	right:0;
	bottom:0;
	width:74%;
	height:64%;
	background-image:url(../img/idx_topics_bg.png);
	background-repeat:repeat-x;
	background-position:left bottom;
	background-color:#36fff9;
}
article.crsl-topics:after {
	left:0;
	bottom:0;
	width:50%;
	height:40%;
	background-color:#cdff00;
}
@media all and (min-width: 768px) {
article.crsl-topics {
	padding:30px 0;
}
article.crsl-topics header {
	margin-bottom:20px;
}
article.crsl-topics header:before {
	height:96px;
}
article.crsl-topics header h2 > span.lazy-done {
	background-image:url(../img/idx_topics_h2.png?0);
}
}
@media all and (max-width: 767px) {
article.crsl-topics {
	padding:12px 0 12px;
}
article.crsl-topics header {
	margin-bottom:10px;
}
article.crsl-topics header:before {
	height:64%;
	background-size:291px 120px;
}
article.crsl-topics header h2 > span.lazy-done {
	background-image:url(../img/idx_topics_h2_smp.png?0);
}
}


.crsl-topics .outer {
	position:relative;
	z-index:5;
	-webkit-transform: translateZ(0);
	height:220px;
	overflow:hidden;
}
.crsl-topics .outer ul {
	position:absolute;
	list-style-type:none;
	display:table;
	/* width:100%; */
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.crsl-topics .outer ul.inner li {
	display:table-cell;
}
.crsl-topics .outer ul.inner li,
.crsl-topics .outer ul.inner li a {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.crsl-topics ul li a,
.crsl-topics ul li a span,
.crsl-topics ul li a span img {
	display:block;
}
.crsl-topics .outer ul.inner li a {
	text-decoration:none;
	background-color:#fff;
	//
	-webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function:ease-in-out;
	transition-duration: 0.5s;
	transition-timing-function:ease-in-out;
	transition-property:opacity;
	opacity:0.5;
}
.crsl-topics .outer ul.inner li.outstanding a {
	opacity:1;
}
.crsl-topics .outer ul.inner li a dl dd span.thumb {
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
}
.crsl-topics .outer ul.inner li a dl dt {
/*	color:#fff; */
	background-color:#fff000;
	line-height:1.25;
	position:relative;
	padding:0.25em;
}
.crsl-topics .outer ul.inner li a dl dd {
}
.crsl-topics .outer ul.inner li a dl dt:before,
.crsl-topics .outer ul.inner li a dl dt span {
	display:block;
}
.crsl-topics .outer ul.inner li a dl dt:before {
	font-family:'Press Start 2P', 'sans serif';
	font-weight:normal;
}
.crsl-topics .outer ul.inner li a dl dt span {
	position:absolute;
	right:0.25em;
	top:50%;
	margin-top:-0.625em;
	font-size:83%;
}
/* */
.crsl-topics .outer ul.inner li.tp-news a dl dt:before {content:"NEWS";}
.crsl-topics .outer ul.inner li.tp-topics a dl dt:before {content:"TOPICS";}
.crsl-topics .outer ul.inner li.tp-interview a dl dt:before {content:"INTERVIEW";}
.crsl-topics .outer ul.inner li.tp-story a dl dt:before {content:"STORY";}
.crsl-topics .outer ul.inner li.tp-trailer a dl dt:before {content:"TRAILER";}
.crsl-topics .outer ul.inner li.tp-video a dl dt:before {content:"VIDEO";}
.crsl-topics .outer ul.inner li.tp-comics a dl dt:before {content:"COMICS";}
.crsl-topics .outer ul.inner li.tp-about a dl dt:before {content:"ABOUT";}
.crsl-topics .outer ul.inner li.tp-chart a dl dt:before {content:"CHART";}
/* */
.crsl-topics .outer ul li a dl dd span.txt {
	line-height:1.5;
	color:#333;
}
@media all and (min-width: 768px) {
.crsl-topics .outer ul.inner li {
	padding-right:15px;
}
.crsl-topics ul li a,
.crsl-topics ul li a span.thumb,
.crsl-topics ul li a span.thumb img {
	width:240px;
}
.crsl-topics ul li a span.thumb,
.crsl-topics ul li a span.thumb img {
	height:160px;
}
.crsl-topics .outer ul li a dl dd span.txt {
	padding:0.75em;
	font-size:87.5%;
}
}
@media all and (max-width: 767px) {
.crsl-topics .outer ul.inner li {
	padding-right:6px;
}
.crsl-topics ul li a,
.crsl-topics ul li a span.thumb,
.crsl-topics ul li a span.thumb img {
	width:180px;
}
.crsl-topics ul li a span.thumb,
.crsl-topics ul li a span.thumb img {
	height:120px;
}
.crsl-topics .outer ul li a dl dd span.txt {
	padding:0.5em;
	font-size:83%;
}
}


/*	arrow
============================== */
@media all and (min-width: 768px) {
.crsl-topics ul.ctrl-arrow {
	width:100%;
}
.crsl-topics ul.ctrl-arrow li {
	position:absolute;
	z-index:6;
	bottom:30px;
}
.crsl-topics ul.ctrl-arrow li.ctrl-lef {
	left:50%;
	margin-left:-174px;
}
.crsl-topics ul.ctrl-arrow li.ctrl-rig {
	right:50%;
	margin-right:-174px;
}
.crsl-topics ul.ctrl-arrow li a {
	position:relative;
	display:block;
	background-image:url(../img/arrow40.svg);
	background-repeat:no-repeat;
	background-size:160px 40px;
	width:40px;
	height:40px;
	background-color:#000;
	text-indent:110%;white-space:nowrap;overflow:hidden;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.crsl-topics ul.ctrl-arrow li a:hover {
	background-color:#fff;
	border:2px solid #000;
}
.crsl-topics ul.ctrl-arrow li.ctrl-lef a {
	background-position:2px 0;
}
.crsl-topics ul.ctrl-arrow li.ctrl-rig a {
	background-position:-42px 0;
}
.crsl-topics ul.ctrl-arrow li.ctrl-lef a:hover {
	background-position:-80px -2px;
}
.crsl-topics ul.ctrl-arrow li.ctrl-rig a:hover {
	background-position:-120px -2px;
}
}
@media all and (max-width: 767px) {
.crsl-topics ul.ctrl-arrow {
	display:none;
}
}





/*	.menu
============================== */
div.menu {
	position:relative;
}
div.menu nav ul {
	position:relative;
	z-index:5;
	list-style-type:none;
}
div.menu nav ul li {
	position:relative;
	float:left;
}
div.menu nav ul li.nolink {
	opacity:0.5;
}
div.menu nav ul li.nolink span a {
	cursor:default;
}
div.menu nav ul li span,
div.menu nav ul li span a {
	display:block;
}
div.menu nav ul li > span a {
	background-position:center center;
	background-repeat:no-repeat;
}
div.menu nav ul li span a.lazy-done {
	-webkit-animation: flipInX 700ms;
	animation: flipInX 700ms;
}
div.menu nav ul li > span a span {
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.menu ul li a time {
	display:none;
}
div.menu ul li a.lazy-done > time {
	display:block;
	text-align:center;
	color:#fff;
	/* font-family:'Fjalla One', 'sans serif';
	font-weight:normal; */
	font-size:83%;
	line-height:22px;
	position:absolute;
	background-image:url(../img/idx_icon_news.png);
	width:70px;
	height:32px;
	z-index:10;
}
@media all and (min-width: 768px) {
div.menu nav ul li {
	width:157px;
	margin-right:8px;
	margin-bottom:10px;
}
div.menu nav ul li:nth-child(3n) {
	margin-right:0;
}
div.menu nav ul li > span a {
	background-size:cover;
}
div.menu nav ul li > span a span {
	height:120px;
}
div.menu ul li a.lazy-done time {
	right:-2px;
	top:-13px;
}
}
@media all and (max-width: 767px) {
div.menu {
	padding:12px 0 6px 6px;
}
div.menu:before {
	content:"";
	display:block;
	position:absolute;
	width:50%;
	height:100%;
	right:0;
	top:0;
	background-image:url(../img/idx_menu_bg.png?1);
	background-repeat:repeat-x;
	background-position:right bottom;
	background-size:cover;
	background-color:#19fffa;
}
div.menu nav {
	padding-right:15%;
}
div.menu nav ul li {
	width:33.333333333333333%;
	margin-bottom:6px;
}
div.menu nav ul li:nth-child(3n-2) > span {
	margin-right:2px;
}
div.menu nav ul li:nth-child(3n-1) > span {
	margin-left:1px;
	margin-right:1px;
}
div.menu nav ul li:nth-child(3n) > span {
	margin-left:2px;
}
div.menu nav ul li > span a {
	position:relative;
	height:0;
	padding-top:76.66666666666667%;
	background-size:contain;
}
div.menu nav ul li > span a span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.menu ul li a.lazy-done time {
	right:-1px;
	top:-15px;
}
}



/*	story
============================== */
article.story {
	padding-top:30px;
	padding-bottom:20px;
}
article.story a.pics {
	display:block;
	position:relative;
	background-repeat:no-repeat;
	background-size:cover;
}
article.story a.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
article.story a.pics > span, article.story a.pics > span img {
	display:block;
}
article.story a.pics h3 {
	display:none;
	position:absolute;
	line-height:1.5;
	color:#fff;
	width:100%;
	background-image:-webkit-linear-gradient(top,hsla(0,0%,0%,0.05),hsla(0,0%,0%,0.75));
	background-image:linear-gradient(to bottom,hsla(0,0%,0%,0.05),hsla(0,0%,0%,0.75));
	bottom:0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding:0 0.75em 0.25em;
	text-shadow:1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000;
}
article.story a.lazy-done h3 {
	display:block;
}

@media all and (min-width: 768px) {
div.story-wrap {
	position:relative;
}
div.story-wrap:after {
	content:"";
	display:block;
	position:absolute;
	width:85%;
	height:60%;
	background-color:#fc0;
	right:0;
	bottom:0;
}
article.story {
	position:relative;
	z-index:2;
	width:980px;
	margin:0 auto;
}
article.story header {
	float:right;
	width:487px;
}
article.story header div.ill-lef span, article.story header div.ill-lef span img {
	width:140px;
	height:90px;
}
article.story header div.ill-rig span, article.story header div.ill-rig span img {
	width:150px;
	height:136px;
}
article.story header div.ill-lef {
	left:8px;
	bottom:6px;
}
article.story header div.ill-rig {
	right:10px;
	bottom:0;
}
article.story header h2 > span.lazy-done {
	background-image:url(../img/idx_story_h2.png?0);
}
article.story a.pics {
	width:480px;
	float:left;
}
article.story a.lazy-done > span {
	border:4px solid #fff;
}
article.story a.pics > span img {
	height:316px;
}
article.story a.pics h3 span:first-child {
	font-size:225%;
}
article.story div.accordion-box {
	width:487px;
	float:right;
}
article.story p.accordion-btn {
	display:none;
}
article.story .accordion-inner p {
	height:8em;
	overflow:hidden;
}
article.story .accordion-inner p > span {
	display:block;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
}
p.btn-more {
	width:60%;
	margin:0 auto;
}
p.btn-more a, p.btn-more a span {
	display:block;
}
p.btn-more a {
	position:relative;
	overflow:hidden;
	text-decoration:none;
	border-style:solid;
	border-color:#6270fa;
	border-radius:25px;
	height:50px;
	border-width:3px;
	-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);
}
p.btn-more a:hover {
	color:#fff;
	background-color:#06bbf2;
	background-image:none;
}
p.btn-more a:hover span {
	text-shadow:0 2px 2px hsla(0, 0%, 0%, .2);
}
p.btn-more a span {
	font-size:100%;
	line-height:44px;
	font-weight:bold;
	text-align:center;
	text-shadow:0 0px 2px hsla(0, 0%, 100%, .9);
}
p.btn-more a span:before {
	content:"";
	display:block;
	position:absolute;
	top:50%;
	background-image:url(../img/arrow40.svg);
	background-repeat:no-repeat;
	background-color:#fff;
	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) {
article.story {
	padding:12px 10px 0;
}
article.story header:before {
	content:"";
	display:block;
	position:absolute;
	width:100%;
	height:12px;
	background-color:#fc0;
	bottom:0;
}
article.story header div.ill-rig {
	right:10.7%;
	bottom:0;
	width:22.4%;
}
article.story header div.ill-rig span {
	padding-top:90.4761904761905%;
}
article.story header div.ill-lef {
	left:9.06666666666667%;
	bottom:4%;
	width:22.4%;
}
article.story header div.ill-lef span {
	padding-top:64.2857142857143%;
}
article.story header h2 > span.lazy-done {
	background-image:url(../img/idx_story_h2_smp.png?0);
}
article.story a.pics h3 span:first-child {
	font-size:200%;
}
article.story a.pics > span {
	position:relative;
	height:0;
	padding-top:66.66666666666667%;
}
article.story a.pics > span img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
article.story section.accordion-unit {
	border-style:solid ;
	border-color:#fc0;
	border-left-width:8px;
	border-right-width:8px;
	border-bottom-width:8px;
}
article.story p.btn-more {
	display:none;
}
}




/*	accordion
============================== */
.accordion-inner p {
	line-height:1.6;
}
.accordion-inner {
	background-color:#fff;
}
@media all and (min-width: 768px) {
.accordion-inner {
	padding:15px;
	-webkit-box-shadow:8px 8px 0 0 #ffb200;
	box-shadow:8px 8px 0 0 #ffb200;
	margin-bottom:12px;
}
.accordion-inner p {
	display:none;
}
.accordion-inner p:first-child {
	display:block;
}
}
@media all and (max-width: 767px) {
.accordion-unit {
	background-color:#fc0;
	overflow:hidden;
}
.accordion-unit .accordion-btn {
	position:relative;
	z-index:5;
	cursor:pointer;
	text-shadow:1px 2px 2px hsla(0,0%,100%,.5);
	font-weight:bold;
	line-height:1.5;
	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);
	padding:0.5em 1em;
}
.accordion-unit .accordion-btn:after {
	content:"";
	background-image:url(../img/arrow16.svg);
	display:block;
	width:24px;
	height:24px;
	background-color:#fff;
	background-size:24px 150px;
	border-radius:12px;
	position:absolute;
	top:50%;
	right:12px;
	margin-top:-12px;
}
.accordion-open .accordion-btn:after {
	background-position:center top;
}
.accordion-close .accordion-btn:after {
	background-position:0 -60px;
}
.accordion-unit .accordion-box {
	-webkit-transition-duration:500ms;
	-webkit-transition-timing-function:ease-in-out;
	transition-duration:500ms;
	transition-timing-function:ease-in-out;
	-webkit-transition-property:height;
	transition-property:height;
}
.accordion-open .accordion-box {
	height:auto;
}
.accordion-close .accordion-box {
	height:0;
}
.accordion-inner p {
	font-size:87.5%;
}
.accordion-inner p:not(:last-child) {
	margin-bottom:1.6em;
}
.accordion-inner {
	padding:15px;
}
}



/*	banner
============================== */

div.bn-one span a.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
div.bn-one span,
div.bn-one span a, div.bn-one span a img {
	display:block;
}
@media all and (min-width: 768px) {
div.bn-one {
	width:924px;
	padding-top:20px;
	margin:0 auto 30px;
}
div.bn-one span a img {
	width:924px;
	height:176px;
}
}
@media all and (max-width: 767px) {
div.bn-one {
	padding:10px 10px;
}
div.bn-one span a {
	position:relative;
	height:0;
	padding-top:19%;
	background-size:cover;
}
div.bn-one span a img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}



/*	special menu
============================== */
div.sp-menu {
	position:relative;
}
div.sp-menu:before {
	z-index:1;
	content:"";
	position:absolute;
	background-image:url(../img/idx_spmenu_bg.png?0);
	background-position:left top;
	background-color:hsla(324,100%,50%,0);
}
div.sp-menu nav {
	position:relative;
	z-index:3;
}
div.sp-menu nav ul li span, div.sp-menu nav ul li a {
	display:block;
}
div.sp-menu nav ul li a {
	background-size:cover;
}
div.sp-menu nav ul li span a span {
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.sp-menu nav ul li span a.lazy-done {
	-webkit-animation: flipInX 700ms;
	animation: flipInX 700ms;
}
@media all and (min-width: 768px) {
div.sp-menu {
	padding:30px 0;
}
div.sp-menu:before {
	left:30%;
	right:0;
	top:60px;
	bottom:0;
}
div.sp-menu nav {
	width:980px;
	margin:0 auto;
}
div.sp-menu nav ul li {
	float:left;
}
div.sp-menu nav ul li.sp-one, div.sp-menu nav ul li.sp-two,
div.sp-menu nav ul li.sp-three {
	width:478px;
	margin-bottom:30px;
}
div.sp-menu nav ul li.sp-four {
	width:318px;
	margin-bottom:30px;
}
div.sp-menu nav ul li.sp-five, div.sp-menu nav ul li.sp-six,
div.sp-menu nav ul li.sp-seven, div.sp-menu nav ul li.sp-eight {
	width:233px;
}

div.sp-menu nav ul li:not(.sp-nine) span a span {
	height:191px;
}

div.sp-menu nav ul li.sp-one {
	margin-right:24px;
}
div.sp-menu nav ul li.sp-five, div.sp-menu nav ul li.sp-six, div.sp-menu nav ul li.sp-seven {
	margin-right:16px;
}

div.sp-menu nav ul li.sp-nine {
	width:184px;
	height:191px;
	position:relative;
}
div.sp-menu nav ul li.sp-nine span a {
	position:absolute;
	left:2px;
	top:18px;
}
div.sp-menu nav ul li.sp-nine span a span {
	width:180px;
	height:203px;
}
}
@media all and (max-width: 767px) {
div.sp-menu {
	padding:12px 0;
}
div.sp-menu:before {
	left:24px;
	right:24px;
	top:36px;
	bottom:36px;
}
div.sp-menu nav ul li.sp-one {
	padding-right:20%;
}
div.sp-menu nav ul li.sp-two {
	padding-left:20%;
}
div.sp-menu nav ul li.sp-three {
	margin:0 12px 10px;
}
div.sp-menu nav ul li.sp-one, div.sp-menu nav ul li.sp-two, div.sp-menu nav ul li.sp-four {
	margin-bottom:10px;
}
div.sp-menu nav ul li.sp-five, div.sp-menu nav ul li.sp-six {
	margin-bottom:20px;
}
div.sp-menu nav ul li.sp-five, div.sp-menu nav ul li.sp-six,
div.sp-menu nav ul li.sp-seven, div.sp-menu nav ul li.sp-eight {
	width:50%;
}
div.sp-menu nav ul li.sp-four {
	width:55.2%;
}
div.sp-menu nav ul li.sp-nine {
	width:44.8%;
}
div.sp-menu nav ul li.sp-nine, div.sp-menu nav ul li.sp-five, div.sp-menu nav ul li.sp-seven {
	float:left;
}
div.sp-menu nav ul li.sp-four, div.sp-menu nav ul li.sp-six, div.sp-menu nav ul li.sp-eight {
	float:right;
}
div.sp-menu nav ul li.sp-five > span, div.sp-menu nav ul li.sp-seven > span {
	padding-left:12px;
	padding-right:4px;
}
div.sp-menu nav ul li.sp-six > span, div.sp-menu nav ul li.sp-eight > span {
	padding-left:4px;
	padding-right:12px;
}
div.sp-menu nav ul li.sp-four > span {
	padding-left:1.866666666666667%;
}
div.sp-menu nav ul li.sp-nine > span {
	padding-right:5.466666666666667%;
	padding-left:7.333333333333333%;
}
div.sp-menu nav ul li span a {
	position:relative;
	height:0;
}
div.sp-menu nav ul li.sp-one span a, div.sp-menu nav ul li.sp-two span a, div.sp-menu nav ul li.sp-three span a {
	padding-top:40%;
}
div.sp-menu nav ul li.sp-four span a {
	padding-top:60%;
}
div.sp-menu nav ul li.sp-five {
	clear:both;
}
div.sp-menu nav ul li.sp-nine span a {
	padding-top:107.5%;
}
div.sp-menu nav ul li.sp-five span a, div.sp-menu nav ul li.sp-six span a, div.sp-menu nav ul li.sp-seven span a, div.sp-menu nav ul li.sp-eight span a {
	padding-top:81.9241982507289%;
}
div.sp-menu nav ul li span a span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}


/* -- 190920 -- */

.mov-end { position:relative; z-index:5; width:100%; height:0; padding-top:56.25%; }
.mov-end-inner { position:absolute; display:block; left:0; top:0; width:100%; height:100%; background-position:center center; background-repeat:no-repeat; background-size:cover; text-indent:-9999px; }


/*	affiliate
============================== */
div.affiliate {
	position:relative;
}
div.affiliate:after {
	content:"";
	display:block;
	background-image:url(../img/cmn_bg_default.png);
	background-repeat:repeat;
	background-position:left top;
	background-color:hsla(48,100%,50%,0.5);
	position:absolute;
	left:0;
	bottom:0;
}
div.affiliate article {
	text-align:left;
	position:relative;
	z-index:1;
}
div.affiliate article ul li a, div.affiliate article ul li a span, div.affiliate article ul li a img {
	display:block;
}
div.affiliate article ul li a.lazy-done {
	-webkit-animation: fadeIn 700ms;
	animation: fadeIn 700ms;
}
div.affiliate article ul li a span {
	background-size:cover;
}
div.affiliate ul li a img {
}
@media all and (min-width: 768px) {
div.affiliate {
	padding:40px 0;
}
div.affiliate:after {
	width:70%;
	height:50%;
	background-size:cover;
}
div.affiliate article {
	width:624px;
	margin:0 auto;
}
div.affiliate article ul li {
	float:left;
	width:300px;
	/* margin-bottom:12px; */
}
div.affiliate article ul li:nth-child(odd) {
	margin-right:24px;
}
div.affiliate article ul li a img {
	width:300px;
	height:120px;
}
}
@media all and (max-width: 767px) {
div.affiliate article {
	padding:20px 12px;
}
div.affiliate:after {
	width:60%;
	height:70%;
	background-size:contain;
}
div.affiliate article ul {
	width:240px;
	margin:0 auto;
}
div.affiliate article ul li:first-child {
	margin-bottom:10px;
}
div.affiliate article ul li:nth-child(odd) {
/*	margin-right:6px; */
}
div.affiliate article ul li a img {
	width:147px;
	height:39px;
	width:240px;
	height:96px;
}
}

/* -- 191007 -- */

div.affiliate article {
	width:300px;
}
div.affiliate article ul li:nth-child(odd) {
	margin-right:0;
}
