/* =================================
	99.9 Top CSS
================================= */

div.cover div.wrap div.menu {
	background-image:-moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
	background-image:-ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,1)),to(rgba(254,254,254,0)));
	background-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}
@media all and (min-width: 768px) {
div.cover div.under {
	padding-bottom:100px;
}
}
@media all and (max-width: 767px) {
div.cover div.under {
	padding-bottom:60px;
}
}

/*	under
============================== */
div.under aside.sns-bn div.sns-timeline div.inner {
	background-color:#fff;
}
div.under aside.sns-bn div.sns-btns div.tw {
	float:left;
}
div.under aside.sns-bn div.sns-btns div.fb {
	float:right;
}

div.under aside.sns-bn div.bn2018 span
{
	background-repeat: no-repeat;
	background-size: contain;
}
div.under aside.sns-bn div.recta div {
	width:300px;
	height:250px;
	overflow:hidden;
}
div.under aside.sns-bn div.sns-timeline p.btn-tw a {
	display:block;
}

@media all and (min-width: 768px) {
div.under aside.sns-bn {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
	background-image:url(../img/top_bg_under.png);
	background-position:center top;
	background-repeat:no-repeat;
	width:700px;
	padding-top:80px;
	margin:0 auto;
}


/*
div.under aside.sns-bn div.sns-timeline {
	float:left;
	width:607px;
	padding-top:1px;
}

div.under aside.sns-bn div.sns-timeline p.btn-tw a {
	width:156px;
	height:380px;
}
div.under aside.sns-bn div.sns-timeline div.inner {
	float:left;
	width:450px;
	height:380px;
}

*/

div.under aside.sns-bn div.sns-btns {
	display: flex;
  justify-content: center;
	padding-top:30px;
	width:100%;
}
div.under aside.sns-bn div.sns-btns div.tw {
	padding-right:10px;
}
div.under aside.sns-bn div.sns-btns div.fb {
	padding-right:0;
}

div.under aside.sns-bn div.bn2018 span
{
	width:300px;
	height:250px;
}

/*
div.under aside.sns-bn div.recta {
	position:absolute;
	left:623px;
	top:132px;
}
*/

}

@media all and (max-width: 767px) {
	div.under {
		background-color:#fff;
	}
	div.under aside.sns-bn div.sns-timeline {
		background-color:#225486;
		background-image:url(../img/cmn_tw_timeline.png);
		background-repeat:no-repeat;
		background-position:center top;
		padding:0 0 10px;
	}
	div.under aside.sns-bn div.sns-timeline p.btn-tw a {
		height:42px;
	}
	div.under aside.sns-bn div.sns-timeline div.inner {
		width:260px;
		height:380px;
		margin:0 auto;
	}
	div.under aside.sns-bn div.sns-btns {
		padding:12px 0 10px;
	}
	div.under aside.sns-bn div.sns-btns div.tw {
		padding-left:12%;
	}
	div.under aside.sns-bn div.sns-btns div.fb {
		padding-right:5%;
	}
	div.under aside.sns-bn div.bn2018{
		background-color:#d6e0ea;
		margin-top:10px;
		padding-top:10px;
	}

	div.under aside.sns-bn div.bn2018 span {
		width:200px;
		height:167px;
		margin:0 auto;
	}

	div.under aside.sns-bn div.recta {
		background-color:#d6e0ea;
		padding:10px 0;
	}
	div.under aside.sns-bn div.recta div {
		margin:0 auto;
	}
}


/*	poster
============================== */

@media print {
header.poster, li.mstory span.lazy, div.case3 span.lazy {
	display:none;
	visibility:hidden;
}
}
header.poster {
	background-color:#fff;
}
header.poster h1 {
	position:relative;
	background-position:center top;
	background-repeat:no-repeat;
}
header.poster h1 img {
	background-size:cover;
}
@media all and (min-width: 768px) {
header.poster h1 {
	width:922px;
	margin:0 auto;
}
header.poster h1, header.poster h1 img {
	width:922px;
	height:690px;
}
}
@media all and (max-width: 767px) {
header.poster h1 {
	height:0;
	padding-top:74.84%;
	background-size: cover;
}
header.poster h1 img {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}


/*	nav main
============================== */

@media all and (min-width: 768px) {
div.menu nav {
	position:relative;
	width:922px;
	height:388px;
	margin:0 auto;
	/* background-image:url(../img/top_pre_dammy.jpg);
	background-position:464px 194px; */
	background-repeat:no-repeat;
}
div.menu nav ul li {
	position:absolute;
}
div.menu nav ul.main li, div.menu nav ul.sub li.mhanadan {
	background-image:url(../img/bg_cube_blu.png);
	background-position:center center;
}
div.menu nav ul li a, div.menu nav ul li > span, div.menu nav ul li a > span {
	display:block;
	background-repeat:no-repeat;
}
div.menu nav ul.main li a > span.mnew {
	position:absolute;
	right:0;
	top:0;
	background-image:url(../img/top_ico_update.png);
	background-position:right top;
	width:72px;
	height:72px;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.menu nav ul li.mintro a, div.menu nav ul li.mcast a, div.menu nav ul li.mstaff a, div.menu nav ul li.mstory a,
div.menu nav ul li.mchart a, div.menu nav ul li.mbbs a, div.menu nav ul li.mpres a, div.menu nav ul li.mnews a {
	background-image:url(../img/top_menu.png);
}
div.menu nav ul li.mrepo, div.menu nav ul li.minter, div.menu nav ul li.msong {
	background-image:none;
}
div.menu nav ul li.mintro, div.menu nav ul li.mstory {
	top:0;
}
div.menu nav ul li.mintro, div.menu nav ul li.mcast, div.menu nav ul li.mchart, div.menu nav ul li.mrepo {
	left:0;
}
div.menu nav ul li.mstory, div.menu nav ul li.mpres {
	left:464px;
}
div.menu nav ul li.mnews {
	left:696px;
}
div.menu nav ul li.mcast, div.menu nav ul li.mstaff {
	top:97px;
}
div.menu nav ul li.mstaff, div.menu nav ul li.mbbs {
	left:232px;
}
div.menu nav ul li.mchart, div.menu nav ul li.mbbs, div.menu nav ul li.mpres, div.menu nav ul li.mnews {
	top:194px;
}
div.menu nav ul li.mrepo, div.menu nav ul li.minter, div.menu nav ul li.mhanadan, div.menu nav ul li.msong{
	top:388px;
}
div.menu nav ul li.minter {
	left:306px;
}
div.menu nav ul li.mhanadan, div.menu nav ul li.minsta, div.menu nav ul li.msong {
	left:612px;
}
div.menu nav ul li.minsta {
	top:516px;
}
div.menu nav ul li.mintro a {
	width:458px;
	height:91px;
}
div.menu nav ul li.mstory a, div.menu nav ul li.mstory a > span {
	width:458px;
	height:188px;
}
div.menu nav ul li.mcast a, div.menu nav ul li.mstaff a {
	width:226px;
	height:91px;
}
div.menu nav ul li.mchart a, div.menu nav ul li.mbbs a, div.menu nav ul li.mpres a, div.menu nav ul li.mnews a {
	width:226px;
	height:188px;
}
div.menu nav ul li.mrepo a, div.menu nav ul li.minter a {
	width:300px;
	height:250px;
}
div.menu nav ul li.msong a {
	width:310px;
	height:250px;
}
div.menu nav ul li.mhanadan a, div.menu nav ul li.minsta a {
	width:310px;
	height:122px;
}
div.menu nav ul li.mcast a {
	background-position:0 -97px;
}
div.menu nav ul li.mstaff a {
	background-position:-232px -97px;
}
div.menu nav ul li.mstory a {
	background-position:-464px 0;
}
div.menu nav ul li.mstory a > span {
	display:block;
	background-repeat:no-repeat;
	background-position:141px 12px;
}
div.menu nav ul li.mchart a {
	background-position:0 -194px;
}
div.menu nav ul li.mbbs a {
	background-position:-232px -194px;
}
div.menu nav ul li.mpres a {
	background-position:-464px -194px;
}
div.menu nav ul li.mnews a {
	background-position:-696px -194px;
}
div.menu nav ul li.minter a span.lazy {
	background-position:-300px 0;
}
div.menu nav ul li.msong a span.lazy {
	background-position:-600px 0;
}
div.menu nav ul li.minsta a {
	background-position:0 -128px;
}
}
@media all and (max-width: 767px) {
div.menu nav ul.main {
	display:block;
	border-left:5px solid #fff;
}
div.menu nav ul:after {
	content:"";
	clear:both;
	display:block;
}
div.menu nav ul.main li {
	float:left;
	width:50%;
	background-image:url(../img/bg_cube_blu.png);
	background-position:center center;
	background-size:112px;
	border-right:5px solid #fff;
	border-bottom:5px solid #fff;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
div.menu nav ul.main li a, div.menu nav ul.main li > span {
	display:block;
	padding:15px;
	font-size:83%;
	font-weight:bold;
	color:#fff;
	line-height:1.5;
}
div.menu nav ul.main li > span.soon {
	color:#7b99b2;
	background-color:#b2c2d6;
}
div.menu nav ul.main li a {
	text-decoration:none;
	text-shadow:0 2px 2px #000;
	background-image:-moz-linear-gradient(top, rgba(20,40,70,0.7) 0%, rgba(20,40,70,0) 100%);
	background-image:-ms-linear-gradient(top, rgba(20,40,70,0.7) 0%, rgba(20,40,70,0) 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(20,40,70,0.7)),to(rgba(20,40,70,0)));
	background-image: linear-gradient(to bottom, rgba(20,40,70,0.7) 0%, rgba(20,40,70,0) 100%);
}
div.menu nav ul.main li a span.mnew {
	color:#fff47b;
}
div.menu nav ul.main li a span.mnew:before {
	content:"　";
}
}


/*	nav sub (smp)
============================== */

div.menu ul li.mhanadan a, div.menu ul li.minsta a {
	background-image:url(../img/top_btn_pre.png);
	background-repeat:no-repeat;
}
div.menu ul.sub {
	margin:0 auto;
}
div.menu ul.sub li.mhanadan {
	background-image:url(../img/bg_cube_blu.png);
	background-position:center center;
}
div.menu ul.sub li.mgoods {
	background-image:url(../img/top_btn_goods.jpg);
	background-position:center top;
	background-size:cover;
}
div.menu ul.sub li {
	float:left;
}
div.menu ul.sub li:first-child, div.menu ul.sub li:nth-child(2) {
	margin-right:6px;
}
div.menu ul.sub li a {
	display:block;
}
@media all and (min-width: 768px) {
div.menu ul.sub {
	width:924px;
	margin-bottom:12px;
}
div.menu ul.sub li a {
	width:310px;
	height:122px;
}
div.menu ul.sub li.minsta a {
	width:300px;
	background-position:-15px -128px;
}
div.menu ul.sub li.mgoods a {
	width:300px;
	
}
}
@media all and (max-width: 767px) {
div.menu ul.sub li.mhanadan {
	background-size:112px;
}
div.menu ul.sub {
	width:300px;
	margin-bottom:6px;
}
div.menu ul.sub li a {
	background-size:147px 115px;
	width:147px;
	height:58px;
}
div.menu ul.sub li.minsta a {
	width:127px;
	background-position:-10px -61px;
}
}




div.menu nav p.msacas a {
	display:block;
}
@media all and (min-width: 768px) {
div.menu nav p.msacas {
	position:absolute;
	left:464px;
	top:194px;
}
div.menu nav p.msacas a span {
	background-repeat:no-repeat;
}
div.menu nav p.msacas a span img {
	width:458px;
	height:188px;
}
}
@media all and (max-width: 767px) {
div.menu nav p.msacas {
	width:300px;
	margin:0 auto 5px;
}
div.menu nav p.msacas a span {
	background-size:300px 123px;
}
div.menu nav p.msacas a img {
	width:300px;
	height:123px;
}
}



/*	whats new
============================== */
section.whats-new p {
	float:left;
}
section.whats-new p a {
	display:block;
	background-image:url(../img/top_btn_update.png);
	background-color:#fff;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
section.whats-new div#listScroll {
	background-color:#0f2c4a;
	overflow:hidden;
}
div#listScroll ul, div#listScroll ul li, div#listScroll ul li a,
div#listScroll dl, div#listScroll dl dt, div#listScroll dl dd {
	display:inline;
	white-space:nowrap;
}
div#listScroll ul li {
	padding-right:2em;
}
div#listScroll ul li a {
	color:#ccedff;
	text-decoration:none;
}
div#listScroll ul li a dl dt {
	padding-right:1em;
}
@media all and (min-width: 768px) {
section.whats-new {
	width:922px;
	height:50px;
	margin:0 auto 14px;	
}
section.whats-new p a {
	width:110px;
	height:50px;
}
section.whats-new div#listScroll {
	height:50px;
}
div#listScroll ul li a:hover dl dd {
	text-decoration:underline;
}
div#listScroll ul, div#listScroll ul li a dl dt, div#listScroll ul li a dl dd {
	font-size:100%;
	line-height:50px;
}
}
@media all and (max-width: 767px) {
section.whats-new {
	padding-right:5px;
	height:35px;
	margin-bottom:7px;
}
section.whats-new p a {
	background-size:77px 35px;
	background-position:right center;
	width:82px;
	height:35px;
}
section.whats-new div#listScroll {
	height:35px;
}
div#listScroll ul, div#listScroll ul li a dl dt, div#listScroll ul li a dl dd {
	font-size:87.5%;
	line-height:35px;
}
}


/*	float btn
============================== */
@media print {
div.btn-flo ul {
	display:none;
}
}
div.btn-flo ul {
	list-style-type:none;
}
div.btn-flo ul:after {
	content:"";
	display:block;
	clear:both;
}
div.btn-flo ul li {
	float:left;
}
div.btn-flo ul li > span {
	background-repeat:no-repeat;
}
div.case2 ul li:nth-child(2n-2) > div, div.case3 ul li:nth-child(3n-2) > span {
	background-position:left top;
}
div.case3 ul li:nth-child(3n-1) > span {
	background-position:center top;
}
div.case2 ul li:nth-child(2n) > span, div.case3 ul li:nth-child(3n) > span {
	background-position:right top;
}
div.btn-flo ul, div.btn-flo ul li > span, div.btn-flo ul li > span > a, div.btn-flo ul li > span > a > span, div.btn-flo ul li > span > a > img {
	display:block;
}
div.btn-flo ul li > span > a, div.btn-flo ul li > div.cal-outer > a {
	overflow:hidden;
}
div.btn-flo ul li > span > a.ico-new {
	background-image:url(../img/top_ico_update.png);
	background-position:right top;
	background-repeat:no-repeat;
}
@media all and (min-width: 768px) {
div.btn-flo {
	width:922px;
	margin:0 auto;
}
div.btn-flo ul li {
	margin-bottom:8px;
}
div.case2 ul li {
	margin-right:8px;
}
div.case3 ul li {
	margin-right:8px;
}
div.case2 ul li:nth-child(even), div.case3 ul li:nth-child(3n) {
	margin-right:0;
}
div.btn-flo ul li > span > a > span, div.btn-flo ul li > span > a > img {
	position:absolute;
}
div.case3 ul li > span > a, div.case3 ul li > span > a > img {
	width:302px;
	height:250px;
}
div.case2 ul li div.cal-outer div.cal-inner a, div.case2 ul li > span > a, div.case2 ul li > span > a > img {
	display:block;
	width:457px;
	height:188px;
}
}
@media all and (max-width: 767px) {
div.btn-flo {
	padding:0 5px;
}
div.btn-flo ul li > span, div.btn-flo ul li > div.cal-outer {
	background-size:cover;
	position:relative;
	height:0;
}
div.case2 ul li > div.cal-outer, div.case2 ul li > span {
	padding-top:41.137855579%;
}
div.case3 ul li > span {
	padding-top:82.78145695%;
}
div.btn-flo ul li > span > a, div.btn-flo ul li > div.cal-outer a {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.btn-flo ul li > span > a.ico-new {
	background-size:cover;
}
div.btn-flo ul li > span > a > img {
	width:100%;
	height:100%;
}
div.case3 ul li {
	width:33.3333%;
	margin-bottom:6px;
}
div.case2 ul li {
	width:50%;
	margin-bottom:6px;
}
div.case2 ul li div.cal-outer, div.case2 ul li:first-child span {
	margin-right:3px;
}
div.case2 ul li:nth-child(2n) > span {
	margin-left:3px;
}
div.case3 ul li:nth-child(3n-2) > span {
	margin-right:4px;
}
div.case3 ul li:nth-child(3n-1) > span {
	margin-left:2px;
	margin-right:2px;
}
div.case3 ul li:nth-child(3n) > span {
	margin-left:4px;
}
}
@media all and (max-width: 479px) {
div.case3 ul li, div.case2 ul li {
	margin-bottom:5px;
}
div.case2 ul li div.cal-outer, div.case2 ul li:first-child span {
	margin-right:2px;
}
div.case2 ul li:nth-child(2n) > span {
	margin-left:2px;
}
div.case3 ul li:nth-child(3n-2) > span {
	margin-right:2px;
}
div.case3 ul li:nth-child(3n-1) > span {
	margin-left:1px;
	margin-right:1px;
}
div.case3 ul li:nth-child(3n) > span {
	margin-left:2px;
}
}



p.bn-long, p.bn-long2 {
	background-position:center top;
	background-repeat:no-repeat;
	background-size:cover;
	position:relative;
	height:0;
	padding-top:13.2321%;
	margin-bottom:6px;
}
p.bn-long {
	background-image:url(../img/top_bn_data.png);
}
p.bn-long2 {
	background-image:url(../img/top_bn_dvd.png);
}
p.bn-long a, p.bn-long2 a {
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}



/*	202005_spot
============================== */
@media all and (min-width: 768px) {

.mov-box{width:640px;height:360px;padding-bottom:15px;}

}

@media all and (max-width: 767px) {
.mov-box{width: 98%;padding-bottom:0.5em;}
}


.mov-box{margin:0 auto;}

.mov-box .trailer{width: 100%;
  position: relative;
  padding-top: 56.25%;
}

.mov-box .trailer iframe {
  position: absolute;
  top: 0;
right:0; left:0;
  width: 100% !important;
  height: 100% !important;
}



