@charset "utf-8";

/* ----------------------------------------------------------------------------------------------------------
 #ec common
---------------------------------------------------------------------------------------------------------- */

/* smartphone
------------------------------------------------------------*/
#ec {
}
#ec a {
	text-decoration: underline;
}
#ec img {
	width: 100%;
}


/* PC
------------------------------------------------------------*/
@media print, screen and (min-width: 768px) {
#ec {
}
#ec a {
	text-decoration: underline;
}
.sp_only {
	display: none;
}	

}/* PC End */



/* ----------------------------------------------------------------------------------------------------------
 #ec #kv
---------------------------------------------------------------------------------------------------------- */

/* smartphone
------------------------------------------------------------*/
#ec #kv {
}
#ec #mainArea {
	position: relative;
	width: 100%;
	height: 30vw;
	margin: 0 auto 16vw;
} 
#ec .h2Bg {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 1;
}
#ec h2 {
	position: absolute;
	width: 100%;
	top: 17.63333vw;
	left: 0;
	z-index: 2;
	font-weight: 700;
	font-size: 10.66667vw;
	text-align: center;
	color: #fff;
	line-height: 1.24;
	text-shadow: 0px 0px 3.73333vw rgba(0, 0, 0, 0.95);
}
#ec h2 span {
	display: block;
	font-size: 4vw;
	font-weight: normal;
	letter-spacing: -0.06em;
	text-shadow: 0px 0px 2.13333 rgba(0, 0, 0, 0.95);
}


/* PC
------------------------------------------------------------*/
@media print, screen and (min-width: 768px) {
#ec #kv {
}
#ec #mainArea {
	position: relative;
	width: 1100px;
	height: 400px;
	margin: 0 auto 100px;
} 
#ec .h2Bg {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 1;
}
#ec h2 {
	position: absolute;
	width: 100%;
	top: 182px;
	left: 0;
	z-index: 2;
	font-weight: 700;
	font-size: 80px;
	text-align: center;
	color: #fff;
	letter-spacing: 0.05em;
	line-height: 1.24;
	text-shadow: 0px 0px 28px rgba(0, 0, 0, 0.95);
}
#ec h2 span {
	display: block;
	font-size: 25px;
	font-weight: normal;
	letter-spacing: -0.06em;
	text-shadow: 0px 0px 16px rgba(0, 0, 0, 0.95);
}
}/* PC End */



/* smartphone
------------------------------------------------------------*/
#ec .ecBox {
	width: 81.33333vw;
	margin: 0 auto 8vw;
}

#ec .ecBox p {
	width: 100%;
	margin: 0 auto 12vw;	
}

#ec .ecBox h3 {
	width: 100%;
	height:8vw;
	background: #000;
	padding: 0 1.6vw;
	box-sizing: border-box;
	font-size: 4vw;
	line-height: 8vw;
	color: #fff;
	margin-bottom: 5.33333vw;
	text-align: left;
	font-weight: normal;
}
#ec .ecBox h4 {
	width: 100%;
	box-sizing: border-box;
	font-size: 4vw;
	margin-bottom: 2.66667vw;
	text-align: center;
	font-weight: normal;
}
#ec .ecBox .listArea {
	padding-bottom: 6.66667vw;
}
#ec .ecBox .ecTable01 {
	display: table;
	border-collapse: collapse;
	width: 100%;
}
#ec .ecBox .ecTable01 dl {
	display: table-row;
}
#ec .ecBox .ecTable01 dl dt {
	display: table-cell;
	width: 16vw;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	vertical-align: middle;
	padding: 3.33333vw 2vw;
	font-size: 4vw;
	line-height: 1.2;
	text-align: center;
	box-sizing: border-box;
	color: #fff;
}
#ec .ecBox .ecTable01 dl:first-child dt {
	background: #b2b2b2;
	font-size: 2.66667vw;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 1.5vw 2vw;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(2) dt {
	background: #facf08;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(3) dt {
	background: #ff5d27;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(4) dt {
	background: #e10000;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(2) dt {
	background: #aa80cf;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(3) dt {
	background: #91029a;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(4) dt {
	background: #1e205e;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(2) dt {
	background: #57c6c3;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(3) dt {
	background: #326895;
}
#ec .ecBox #bbR.ecTable01 dl:first-child,
#ec .ecBox #bsR.ecTable01 dl:first-child{
	display: none;
}
#ec .ecBox .ecTable01 dl dd {
	display: table-cell;
	width: 65.33333vw;
	border-bottom: 1px solid #000;
	vertical-align: middle;
	padding: 3.33333vw 2vw;
	font-size: 4vw;
	box-sizing: border-box;
}
#ec .ecBox .ecTable01 dl:first-child dd {
	background: #b2b2b2;
	color: #fff;
	text-align: center;
	font-size: 2.66667vw;
	border-bottom: 1px solid #fff;
	padding: 5px;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(2) dd p {
	color: #facf08;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(3) dd p {
	color: #ff5d27;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(4) dd p {
	color: #e10000;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(2) dd p {
	color: #aa80cf;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(3) dd p {
	color: #91029a;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(4) dd p {
	color: #1e205e;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(2) dd p {
	color: #57c6c3;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(3) dd p {
	color: #326895;
}
#ec .ecBox a {
	display: block;
	width: 60vw;
	height: 16vw;
	border: 1px solid #000;
	text-align: center;
	line-height: 16vw;
	font-size: 4vw;
	font-weight: 400;
	color: #000;
	background: url("../../common/images/arrow.svg") 94% center / 1.06667vw 2.66667vw no-repeat;
	margin: 0 auto 12vw;
	box-sizing: border-box;
	text-decoration: none;
}
/*#ec .ecBox a {
	display: block;
	width: 60vw;
	height: 20vw;
	border: 1px solid #000;
	text-align: center;
	font-size: 4vw;
	font-weight: 400;
	color: #000;
	background: url("../../common/images/arrow.svg") 94% center / 1.06667vw 2.66667vw no-repeat;
	margin: 0 auto 12vw;
	box-sizing: border-box;
	text-decoration: none;
}*/
#ec .ecBox .ecTable02 {
	width: 100%;
	display: table;
}
#ec .ecBox .ecTable02 dl {
	display: table-row;
}
#ec .ecBox .ecTable02 dl dt {
	display: table-cell;
	width: 17.33333vw;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	padding: 3.33333vw 0;
	font-size: 4vw;
	text-align: center;
	box-sizing: border-box;
	vertical-align: middle;
}
#ec .ecBox .ecTable02 dl:first-child dt {
	background: #b2b2b2;
	color: #fff;
	font-size: 2.66667vw;
	padding: 1.5vw 0;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
#ec .ecBox .ecTable02 dl dd {
	display: table-cell;
	width: 64vw;
	border-bottom: 1px solid #000;
	padding: 3.33333vw 2vw;
	font-size: 4vw;
	text-align: left;
	box-sizing: border-box;
	vertical-align: middle;
}
#ec .ecBox .ecTable02 dl:first-child dd {
	background: #b2b2b2;
	color: #fff;
	font-size: 2.66667vw;
	text-align: center;
	padding: 1.5vw 2vw;
	border-bottom: 1px solid #fff;
}
#ec .ecBox #mR.ecTable02 dl:first-child {
	display: none;
}


/* PC
------------------------------------------------------------*/
@media print, screen and (min-width: 768px) {
#ec .ecBox {
	width: 860px;
	margin: 0 auto 70px;
}
#ec .ecBox:after {
	content: "";
	display: block;
	clear: both;
}
	
#ec .ecBox p {
	width: 500px;
	margin: 0 auto 70px;	
}
	
#ec .ecBox h3 {
	width: 100%;
	height: 55px;
	background: #000;
	padding: 0 20px;
	box-sizing: border-box;
	font-size: 25px;
	line-height: 55px;
	color: #fff;
	margin-bottom: 30px;
	text-align: left;
	font-weight: normal;
}
#ec .ecBox h4 {
	width: 100%;
	box-sizing: border-box;
	font-size: 20px;
	margin-bottom: 50px;
	text-align: center;
	font-weight: normal;
}
#ec .ecBox .listArea {
	padding-bottom: 50px;
}
#ec .ecBox .listArea:after {
	content: "";
	display: block;
	clear: both;
}
#ec .ecBox .ecTable01 {
	display: table;
	border-collapse: collapse;
	float: left;
	width: 425px;
}
#ec .ecBox #bsL.ecTable01 {
	margin-right: 10px;
}
#ec .ecBox #bbL.ecTable01 {
	width: 100%;
}
#ec .ecBox .ecTable01 dl {
	display: table-row !important;
}
#ec .ecBox .ecTable01 dl dt {
	display: table-cell;
	width: 66px;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	vertical-align: middle;
	padding: 10px 5px;
	font-size: 20px;
	line-height: 1.2;
	text-align: center;
	box-sizing: border-box;
	color: #fff;
}
#ec .ecBox .ecTable01 dl:first-child dt {
	background: #b2b2b2;
	font-size: 15px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 5px;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(2) dt {
	background: #facf08;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(3) dt {
	background: #ff5d27;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(4) dt {
	background: #e10000;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(2) dt {
	background: #aa80cf;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(3) dt {
	background: #91029a;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(4) dt {
	background: #1e205e;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(2) dt {
	background: #57c6c3;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(3) dt {
	background: #326895;
}
#ec .ecBox .ecTable01 dl dd {
	display: table-cell;
	width: 359px;
	border-bottom: 1px solid #000;
	vertical-align: middle;
	padding: 10px 10px;
	font-size: 15px;
	box-sizing: border-box;
}
#ec .ecBox #bbL.ecTable01 dl dd {
	width: 794px;
}
#ec .ecBox .ecTable01 dl:first-child dd {
	background: #b2b2b2;
	color: #fff;
	text-align: center;
	border-bottom: 1px solid #fff;
	padding: 5px;
	font-size: 15px;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(2) dd p {
	color: #facf08;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(3) dd p {
	color: #ff5d27;
}
#ec .ecBox #bbL.ecTable01 dl:nth-child(4) dd p {
	color: #e10000;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(2) dd p {
	color: #aa80cf;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(3) dd p {
	color: #91029a;
}
#ec .ecBox #bsL.ecTable01 dl:nth-child(4) dd p {
	color: #1e205e;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(2) dd p {
	color: #57c6c3;
}
#ec .ecBox #bsR.ecTable01 dl:nth-child(3) dd p {
	color: #326895;
}
#ec .ecBox a {
	display: block;
	width: 350px;
	height: 80px;
	border: 1px solid #000;
	text-align: center;
	line-height: 80px;
	font-size: 25px;
	font-weight: 400;
	color: #000;
	background: url("../../common/images/arrow.svg") 95% center / 9px 20px no-repeat;
	margin: 0 auto 70px;
	box-sizing: border-box;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all  0.3s ease;
}
/*#ec .ecBox a {
	display: block;
	width: 480px;
	height: 100px;
	border: 1px solid #000;
	text-align: center;
	font-size: 25px;
	font-weight: 400;
	color: #000;
	background: url("../../common/images/arrow.svg") 95% center / 9px 20px no-repeat;
	margin: 0 auto 70px;
	box-sizing: border-box;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all  0.3s ease;
}*/
#ec .ecBox a:hover {
	opacity: 0.7;
}
#ec .ecBox .ecTable02 {
	width: 405px;
	float: left;
	display: table;
}
#ec .ecBox #mL.ecTable02 {
	margin-right: 50px;
}
#ec .ecBox .ecTable02 dl {
	display: table-row !important;
}
#ec .ecBox .ecTable02 dl dt {
	display: table-cell;
	width: 100px;
	height: 80px;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	padding: 12px 10px;
	font-size: 20px;
	text-align: center;
	box-sizing: border-box;
	vertical-align: middle;
}
#ec .ecBox .ecTable02 dl:first-child dt {
	height: 34px;
	background: #b2b2b2;
	color: #fff;
	font-size: 15px;
	padding: 5px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
#ec .ecBox .ecTable02 dl dd {
	display: table-cell;
	width: 305px;
	height: 80px;
	border-bottom: 1px solid #000;
	padding: 12px 10px;
	font-size: 15px;
	text-align: left;
	box-sizing: border-box;
	vertical-align: middle;
}
#ec .ecBox .ecTable02 dl:first-child dd {
	height: 34px;
	background: #b2b2b2;
	color: #fff;
	font-size: 15px;
	text-align: center;
	padding: 5px;
	border-bottom: 1px solid #fff;
}

}/* PC End */



/* ----------------------------------------------------------------------------------------------------------
 genre
---------------------------------------------------------------------------------------------------------- */
.genre{
	padding-bottom:13.33vw;
}
.genre ul{
	margin-bottom:2.66vw;
	padding:0;
  width: 100%;
}
.genre ul li{
	float:left;
	list-style:none;
	line-height:0;
	width:50%;
}
.genre ul li:hover {
}
.genre ul li img{
	width:100%;
}
.genre table{
	width:100%;
}
.genre table + table{
	margin-top:4vw;
}
.genre table th{
	color:#000;
	padding:0.66vw 1.6vw;
	font-weight:normal;
	text-align:center;
	font-size:4vw;
	border-bottom:1px solid #000;
	border-right:1px solid #000;
  vertical-align: middle;
}
.genre table .ttl01{
	color:#fff;
	font-size:2.66vw;
	background:#b2b2b2;
	border-bottom:none;
	border-right:1px solid #fff;
}
.genre table .ttl02{
	border:none;
	padding:1.866vw 0 0;
	width:100%;
}
.genre table + table .ttl02{
	padding:0;
}
.genre table .ttl02 span{
	color:#fff;
	font-size:2.66vw;
	font-weight:normal;
	background:#666666;
	text-align:left;
	width:100%;
	padding:0.933vw 0 0.4vw 1.2vw;
	box-sizing:border-box;
	line-height:1;
	display:block;
}
.genre table th .txt01{
	font-size:3.2vw;
  display: block;
	font-weight:normal;
}
.genre table td{
	font-size:4vw;
	border-bottom:1px solid #000;
	padding:3.33vw 2.133vw;
	height:auto;
	width:70%;
  vertical-align: middle;
}
#event{
	display:none;
}
.clearfix:after {  
  content: ".";   
  display: block;   
  height: 0;   
  clear: both;   
  visibility: hidden;  
}  
.clearfix { display: inline-table; }  
#ec .ecBox a.playBtn {
  margin-top: 8vw;
}



/* PC
------------------------------------------------------------*/
@media print, screen and (min-width: 768px) {
.genre{
	padding-bottom:100px;
}
.genre ul{
	padding:0;
	margin-bottom:20px;
  width: 100%;
}
.genre ul li{
	float:left;
	list-style:none;
	line-height:0;
	cursor:pointer;
  width: 50%;
}
.genre ul li.active{
	cursor:default;
}
.genre table{
	width:100%;
}
.genre table + table{
	margin-top:30px;
}
.genre table th{
	color:#000;
	padding:4px 17px;
	font-weight:normal;
	text-align:center;
	font-size:20px;
	border-bottom:1px solid #000;
	border-right:1px solid #000;
  vertical-align: middle;
}
.genre table .ttl01{
	color:#fff;
	font-size:15px;
	background:#b2b2b2;
	border-bottom:none;
	border-right:1px solid #fff;
}
.genre table .ttl02{
	border:none;
	padding:11px 0 0;
	width:100%;
}
.genre table + table .ttl02{
	padding:0;
}
.genre table .ttl02 span{
	color:#fff;
	font-size:20px;
	font-weight:normal;
	background:#666666;
	text-align:left;
	width:100%;
	padding:7px 0 3px 12px;
	box-sizing:border-box;
	line-height:1;
	display:block;
}
.genre table th .txt01{
	font-size:15px;
	display:inline;
	font-weight:normal;
}
.genre table td{
	font-size:15px;
	border-bottom:1px solid #000;
	padding:12px 17px;
	height:67px;
	box-sizing:border-box;
	width:82%;
  vertical-align: middle;
}
#event{
	display:none;
}
#ec .ecBox a.playBtn {
  margin-top: 50px;
}

}/* PC End */

