/**************** MOBILE ****************/

/* モニター幅750px以下 */

/**************** MOBILE ****************/

@media only screen and (max-width:750px){

header {display:none;}

/*-----------#header-------------*/
	#header {
		width:100%;
		height:auto;
		background:url(../img/headbg.jpg) right top no-repeat;
		margin-bottom: 2em;
	}
	#headwrap {
		width:94%;
		margin: 0 auto;
	}
	#headwrap h1 img {
		width: 450px;
		margin-bottom: 1.5em;
	}
	#headwrap p#schedule { text-align: center;}
	#headwrap p#schedule img { width:100%;}
	#headwrap p#start { margin-bottom: 200px;}
	#headwrap p#start img { width: inherit;}
	
	#headwrap p#headtxt { display: none;}

	
/*Gnavi AREA*/
	
	#global-nav {
		width:100%;
		height:208px;
		background-image:url(../img/navi_bg.png);
		background-size:contain;
		background-repeat: repeat-x;
		margin: 0;
		padding: 0;
	}
	#global-nav ul {
		display: flex;
		flex-wrap : wrap;
		justify-content:center;
		width:100%;
		margin: 0;
		padding: 0 0 0 0;
		height:208px;
		align-content: flex-start;
	}
	#global-nav ul li {
		width:auto;
		margin: 25px 15px 0 15px;
		padding: 0;
		border: 0px #000 solid;
		height: 59px;
	}
	#global-nav ul li span { display: none;}
	#global-nav ul li img { margin: 0; padding: 0;}

	#global-nav ul::after {
	display: block;
	content:"";
	width: 30%;
	margin: 0;
	height: 1;
	}
	
		
/*SNS AREA*/
	#sns {
		width:auto;
		margin: 10em auto 2.5em auto;
	}
	#sns ul {
		display: flex;
		justify-content:center;
		margin-bottom: 2em;
	}
	#sns ul li img {
		width:4em;
		margin: 0 0.5em;
	}
	#sns p {
		text-align: center;
		margin-bottom: 10px;
	}
	#sns p.twbnr img {
		width:90%;
	}
	#sns p.lnkbnr img {
		width:90%;
	}

/*----------- MAIN wrapper AREA-------------*/

	#wrapper {
		background-image:url(../img/mainBG.jpg);
		background-repeat: repeat-y;
		background-size: cover;
	}
	

	article h1 img {
		width:inherit;
	}
	
/*----------- INTRODUCTION AREA-------------*/
	#introduction {
		width:100%;
		padding-top: 0;
		text-align: center;
		color: #000;
		margin-bottom: 3em;
	}

	#introduction * {
		color: #000;
	}
	#introduction .wrap {
		width:94%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
	}
	
	#introduction .wrap section {
		width:100%;
		margin-bottom: 2em;
	}
	#introduction .wrap section h1 {
		background:url(../img/intro_txtbg.png) left center no-repeat;
		color: #fff;
		text-align: left;
		font-size: 130%;
		margin-bottom: 0;
		font-weight: 700;
		padding: 0.5em;
		line-height: 1.3;
	}

	#introduction .wrap section p {
		margin: 0;
	}
	#introduction .wrap section p img {
		width:100%;
		height:auto;
	}
	#introduction .wrap section p.introtext {
		font-size: 90%;
		text-align: left;
		background-color: hsla(0,0%,100%,0.61);
		padding: 0.5em;
	}
	
	#introduction .arasuji {
		width:94%;
		margin: 0 auto 2em auto;
		padding-top: 1em;
		background-color: hsla(0,0%,100%,0.61);
	}
	#introduction .arasuji h1 {
		margin-bottom: 1em;
	}
	#introduction .arasuji section p {
		text-align: left;
		font-size: 90%;
		padding: 1em 1em;
	}


/*----------- STORY AREA-------------*/
	#story {
		width:94%;
		padding-top: 2em;
		text-align: center;
		color: #000;
		margin: 0 auto;
	}
	#story .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
	}

	@keyframes tabAnim{
	0%{top:-100%;}
	100%{top:0;}
	}
.tab_wrap{width:100%; margin:0 auto;}
input[type="radio"]{display:none;}
.tab_area{font-size: 0;padding: 0; margin:0;}
.tab_area label{
	font-family: "Kazesawa-Semibold";
	font-size: 12pt;
	font-weight: 700;
	width:10%;
	margin:0;
	display:inline-block;
	padding:0.2em 0;
	color:#FFF;
	background:#ee0b24;
	text-align:center;
	cursor:pointer;
	transition:ease 0.2s opacity;
}
.tab_area label.yet { color:#FFF; background:#e3d6d3;}
.tab_area label:hover{opacity:0.5;}


	.panel_area{
		overflow:hidden;
		width:100%;
		height:340px;
		position:relative;
		margin-bottom: 4em;
	}

	.tab_panel{
		width:100%; 
		background-image: url(../img/story_bg.png);
		background-repeat: repeat-x;
		background-position: bottom bottom;
		overflow:hidden;
		position:absolute;
		height:100%;
		padding: 1em 0 0;
	}

	.tab_panel h1 {
		font-size: 160%;
		font-weight: 800;
		color: #ee0b24;
		font-family:"Yu Mincho","游明朝","Hiragino Mincho ProN","ヒラギノ明朝 ProN","Hiragino Mincho Pro","ヒラギノ明朝 Pro";
	}
	.tab_panel h2 {
		font-size: 140%;
		font-weight: 800;
		margin-bottom: 1em;
		color: #ee0b24;
		font-family:"Yu Mincho","游明朝","Hiragino Mincho ProN","ヒラギノ明朝 ProN","Hiragino Mincho Pro","ヒラギノ明朝 Pro";
	}
	
	.tab_panel ul {
		display: flex;
		flex-wrap: nowrap;
		margin-bottom: 1.6em;
	}
	.tab_panel ul li {
		width:33.333333%;
	}
	.tab_panel ul li img {
		width:100%;
	}
	
	.tab_panel p {
		width:92%;
		margin: auto;
		text-align:left;
		padding:0;
		color: #000;
}

#tab1:checked ~ .tab_area .tab1_label{background:#000; color:#fff;}
#tab1:checked ~ .panel_area #panel1{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab2:checked ~ .tab_area .tab2_label{background:#000; color:#fff;}
#tab2:checked ~ .panel_area #panel2{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab3:checked ~ .tab_area .tab3_label{background:#000; color:#fff;}
#tab3:checked ~ .panel_area #panel3{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab4:checked ~ .tab_area .tab4_label{background:#000; color:#fff;}
#tab4:checked ~ .panel_area #panel4{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab5:checked ~ .tab_area .tab5_label{background:#000; color:#fff;}
#tab5:checked ~ .panel_area #panel5{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab6:checked ~ .tab_area .tab6_label{background:#000; color:#fff;}
#tab6:checked ~ .panel_area #panel6{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab7:checked ~ .tab_area .tab7_label{background:#000; color:#fff;}
#tab7:checked ~ .panel_area #panel7{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab8:checked ~ .tab_area .tab8_label{background:#000; color:#fff;}
#tab8:checked ~ .panel_area #panel8{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab9:checked ~ .tab_area .tab9_label{background:#000; color:#fff;}
#tab9:checked ~ .panel_area #panel9{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab10:checked ~ .tab_area .tab10_label{background:#000; color:#fff;}
#tab10:checked ~ .panel_area #panel10{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab11:checked ~ .tab_area .tab11_label{background:#000; color:#fff;}
#tab11:checked ~ .panel_area #panel11{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab12:checked ~ .tab_area .tab12_label{background:#000; color:#fff;}
#tab12:checked ~ .panel_area #panel12{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab13:checked ~ .tab_area .tab13_label{background:#000; color:#fff;}
#tab13:checked ~ .panel_area #panel13{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab14:checked ~ .tab_area .tab14_label{background:#000; color:#fff;}
#tab14:checked ~ .panel_area #panel14{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab15:checked ~ .tab_area .tab15_label{background:#000; color:#fff;}
#tab15:checked ~ .panel_area #panel15{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab16:checked ~ .tab_area .tab16_label{background:#000; color:#fff;}
#tab16:checked ~ .panel_area #panel16{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab17:checked ~ .tab_area .tab17_label{background:#000; color:#fff;}
#tab17:checked ~ .panel_area #panel17{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab18:checked ~ .tab_area .tab18_label{background:#000; color:#fff;}
#tab18:checked ~ .panel_area #panel18{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab19:checked ~ .tab_area .tab19_label{background:#000; color:#fff;}
#tab19:checked ~ .panel_area #panel19{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab20:checked ~ .tab_area .tab20_label{background:#000; color:#fff;}
#tab20:checked ~ .panel_area #panel20{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
	

	
	
/*----------- CHART AREA-------------*/
	#chart {
		width:94%;
		padding-top: 2em;
		text-align: center;
		margin: 0 auto 3em auto;
	}
	#chart .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
	}
	#chart .wrap img {width:100%;}
	
	#chart section#PC {
		display: none;
	}
	
	
	
/*----------- CAST AREA-------------*/
	#cast {
		width:94%;
		padding-top: 4em;
		text-align: center;
		color: #fff;
		margin: 0 auto;
	}
	#cast * {color: #fff;}
	#cast .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: inherit;
		
	}
	
	#cast .wrap section {
		width:100%;
		margin-bottom: 2em;
		background-color: #000;
	}
	#cast .wrap section h1 {
		text-align: center;
		font-size: 250%;
		font-weight: 600;
		margin-bottom: 0;
	}
	
	#cast .wrap section h2 {
		text-align: center;
		font-size: 150%;
		font-weight: 600;
		margin: 0 0 0.5em;
	}#cast .wrap section h2 span {
		font-size:65%;
	}
	
	#cast .wrap section .castphoto {
		margin-bottom: 0.5em;
	}
	#cast .wrap section .castphoto img {
		width:100%;
	}
	
	#cast .wrap section p.casttxt {
		text-align: left;
		padding: 1em;
	}
	
	
	#cast #wrap2 {
		width:100%;
		background-color: #000000;
		padding: 2em 0;
		font-size: 140%;
	}
	#cast #wrap2 div {
		width:100%;
		margin: 0 auto;
		display: inherit;
	}
	#cast #wrap2 div section {
		width: 100%;
	}
	#cast #wrap2 div section h1 {
		font-size: 160%;
		font-weight: 600;
		margin-bottom: 0.5em;
		line-height: 1.1;
	}

	#cast #wrap2 div section h1 span {
		font-size: 70%;
		font-weight: normal;
		display: inline-block;
		margin-bottom: 0.5em;
	}
	
	


}


/**************** MOBILE ****************/

/* モニター幅450px以下 */

/**************** MOBILE ****************/

@media only screen and (max-width:550px){
	
	#header {
		width:100%;
		height:auto;
		background:url(../img/headbg.jpg);
		background-position: center top;
		background-size:contain;
		background-repeat: no-repeat;
	}
	#headwrap {
		width:94%;
		margin: 0 auto;
	}
	#headwrap h1 img {
			width: 90%;
		}
	#headwrap p#schedule img { width:100%;}
	#headwrap p#start img { width:70%; margin-bottom: 0;}
	#headwrap p#start { margin-bottom: 100px;}
	
	
	/*Gnavi AREA*/
	
	#global-nav {
		width:100%;
		height:auto;
		padding-bottom: 30px;
		background-image:url(../img/navi_bg.png);
		background-repeat: repeat-x;
		background-size: contain;
	}
	
	#global-nav ul {
		display: flex;
		height:auto;
		flex-wrap : wrap;
		justify-content:center;
		width:100%;
		margin: 0;
		padding: 0 0 0 0;
		align-content: flex-start;
	}
	
	#global-nav ul li {
		width:auto;
		margin: 30px auto 0 auto;
	}
	
	article#introduction h1 img,
	article#cast h1 img {
		width:80%;
	}
	article#introduction .arasuji h1 img {
		width:inherit;
	}
	
	.panel_area{
		overflow:hidden;
		width:100%;
		height:320px;
		position:relative;
		margin-bottom: 4em;
	}
	
}




/**************** PC ****************/

@media only screen and (min-width:751px){
	

	

/*-----------#header-------------*/
	#header {
		width:100%;
		height:auto;
		background:url(../img/headbgPC.jpg) center top no-repeat;
		margin-bottom: 0;
		padding-bottom: 2em;
		margin-top: 128px;
	}
	#headwrap {
		width:1100px;
		margin: 0 auto;
		position: relative;
	}
	#headwrap h1 img {
		width: 500px;
		margin-bottom: 1.5em;
	}
	#headwrap p#schedule { text-align: left;}
	#headwrap p#schedule img { width:auto;}
	#headwrap p#start { margin-bottom: 85px; padding-top: 40px;}
	
	#headwrap p#headtxt { 
		position: absolute;
		right: 50px;
		top:70px;
	}
	
	
/*Gnavi AREA*/
	
	#global-nav {
		width:100%;
		height:104px;
		background-image:url(../img/navi_bg.png);
		background-repeat: repeat-x;
		margin: 0;
		padding: 0;
	}
	#global-nav ul {
		width:1100px;
		display: flex;
		flex-wrap : wrap;
		justify-content :space-between;
		margin: 0 auto;
		vertical-align: middle;
	}
	#global-nav ul li {
		width:auto;
		margin: 20px 20px 0 20px;
	}#global-nav ul li span { display: none;}
	
	

	
		
/*SNS AREA*/
	#sns {
		width:auto;
		margin: 10em auto 2.5em auto;
	}
	#sns ul {
		display: flex;
		justify-content:center;
		margin-bottom: 1em;
	}
	#sns ul li img {
		width:27px;
		margin: 0 0.5em;
	}
	#sns p {
		text-align: center;
		margin-bottom: 10px;
	}
	#sns p.twbnr img {
		width:200px;
	}
	#sns p.lnkbnr img {
		width:464px;
	}

/*----------- MAIN wrapper AREA-------------*/

	div#wrapper {
		background-image:url(../img/mainbgPC.jpg);
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size:cover;
		margin: 0;
	}
	
	
/*----------- INTRODUCTION AREA-------------*/
	#introduction {
		width:1100px;
		padding-top: 2em;
		text-align: center;
		color: #000;
		margin: 0 auto 3em auto;
	}

	#introduction * {
		color: #000;
	}
	#introduction .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
	}
	
	#introduction .wrap section {
		width:49%;
		margin-bottom: 2em;
	}
	#introduction .wrap section h1 {
		background:url(../img/intro_txtbg.png) left center no-repeat;
		color: #fff;
		text-align: left;
		font-size: 130%;
		margin-bottom: 0;
		font-weight: 700;
		padding: 0.5em;
		line-height: 1.3;
	}

	#introduction .wrap section p {
		margin: 0;
	}
	#introduction .wrap section p img {
		width:100%;
		height:auto;
	}
	#introduction .wrap section p.introtext {
		font-size: 90%;
		text-align: left;
		background-color: hsla(0,0%,100%,0.61);
		padding: 0.5em;
	}
	
	#introduction .arasuji {
		width:94%;
		margin: 0 auto 2em auto;
		padding-top: 1em;
		background-color: hsla(0,0%,100%,0.61);
	}
	#introduction .arasuji h1 {
		margin-bottom: 1em;
	}
	#introduction .arasuji section p {
		text-align: left;
		font-size: 90%;
		padding: 1em 1em;
	}


/*----------- STORY AREA-------------*/
	#story {
		width:1100px;
		padding-top: 4em;
		text-align: center;
		color: #000;
		margin: 0 auto;
	}
	#story .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
	}

	@keyframes tabAnim{
	0%{top:-100%;}
	100%{top:0;}
	}
.tab_wrap{width:100%; margin:0 auto;}
input[type="radio"]{display:none;}
.tab_area{font-size: 0;padding: 0; margin:0;}
.tab_area label{
	font-family: "Kazesawa-Semibold";
	font-size: 12pt;
	font-weight: 700;
	width:10%;
	margin:0;
	display:inline-block;
	padding:0.2em 0;
	color:#FFF;
	background:#ee0b24;
	text-align:center;
	cursor:pointer;
	transition:ease 0.2s opacity;
}
.tab_area label.yet { color:#FFF; background:#e3d6d3;}
.tab_area label:hover{opacity:0.5;}


	.panel_area{
		overflow:hidden;
		width:100%;
		height:420px;
		position:relative;
		margin-bottom: 4em;
	}

	.tab_panel{
		width:100%; 
		background-image: url(../img/story_bg.png);
		background-repeat: repeat-x;
		background-position: center bottom;
		overflow:hidden;
		position:absolute;
		height:100%;
		padding: 0 0 0 0;
	}

	.tab_panel h1 {
		font-size: 160%;
		font-weight: 800;
		color: #ee0b24;
		font-family:"Yu Mincho","游明朝","Hiragino Mincho ProN","ヒラギノ明朝 ProN","Hiragino Mincho Pro","ヒラギノ明朝 Pro";
	}
	.tab_panel h2 {
		font-size: 140%;
		font-weight: 800;
		margin-bottom: 1em;
		color: #ee0b24;
		font-family:"Yu Mincho","游明朝","Hiragino Mincho ProN","ヒラギノ明朝 ProN","Hiragino Mincho Pro","ヒラギノ明朝 Pro";
	}
	
	.tab_panel ul {
		display: flex;
		flex-wrap: nowrap;
		margin-bottom: 1.6em;
	}
	.tab_panel ul li {
		width:33.333333%;
	}
	.tab_panel ul li img {
		width:100%;
	}
	
	.tab_panel p {
		width:92%;
		margin: auto;
		text-align:left;
		padding:0;
		color: #000;
}

#tab1:checked ~ .tab_area .tab1_label{background:#000; color:#fff;}
#tab1:checked ~ .panel_area #panel1{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab2:checked ~ .tab_area .tab2_label{background:#000; color:#fff;}
#tab2:checked ~ .panel_area #panel2{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab3:checked ~ .tab_area .tab3_label{background:#000; color:#fff;}
#tab3:checked ~ .panel_area #panel3{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab4:checked ~ .tab_area .tab4_label{background:#000; color:#fff;}
#tab4:checked ~ .panel_area #panel4{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab5:checked ~ .tab_area .tab5_label{background:#000; color:#fff;}
#tab5:checked ~ .panel_area #panel5{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab6:checked ~ .tab_area .tab6_label{background:#000; color:#fff;}
#tab6:checked ~ .panel_area #panel6{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab7:checked ~ .tab_area .tab7_label{background:#000; color:#fff;}
#tab7:checked ~ .panel_area #panel7{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab8:checked ~ .tab_area .tab8_label{background:#000; color:#fff;}
#tab8:checked ~ .panel_area #panel8{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab9:checked ~ .tab_area .tab9_label{background:#000; color:#fff;}
#tab9:checked ~ .panel_area #panel9{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab10:checked ~ .tab_area .tab10_label{background:#000; color:#fff;}
#tab10:checked ~ .panel_area #panel10{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab11:checked ~ .tab_area .tab11_label{background:#000; color:#fff;}
#tab11:checked ~ .panel_area #panel11{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab12:checked ~ .tab_area .tab12_label{background:#000; color:#fff;}
#tab12:checked ~ .panel_area #panel12{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab13:checked ~ .tab_area .tab13_label{background:#000; color:#fff;}
#tab13:checked ~ .panel_area #panel13{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab14:checked ~ .tab_area .tab14_label{background:#000; color:#fff;}
#tab14:checked ~ .panel_area #panel14{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab15:checked ~ .tab_area .tab15_label{background:#000; color:#fff;}
#tab15:checked ~ .panel_area #panel15{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab16:checked ~ .tab_area .tab16_label{background:#000; color:#fff;}
#tab16:checked ~ .panel_area #panel16{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab17:checked ~ .tab_area .tab17_label{background:#000; color:#fff;}
#tab17:checked ~ .panel_area #panel17{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab18:checked ~ .tab_area .tab18_label{background:#000; color:#fff;}
#tab18:checked ~ .panel_area #panel18{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab19:checked ~ .tab_area .tab19_label{background:#000; color:#fff;}
#tab19:checked ~ .panel_area #panel19{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
#tab20:checked ~ .tab_area .tab20_label{background:#000; color:#fff;}
#tab20:checked ~ .panel_area #panel20{animation:tabAnim ease 0.4s forwards; -ms-animation:tabAnim ease 0.4s forwards; z-index:1;}
	

	
	
/*----------- CHART AREA-------------*/
	#chart {
		width:1100px;
		padding-top: 2em;
		text-align: center;
		margin: 0 auto 3em auto;
	}
	#chart .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
	}
	#chart .wrap img {width:100%;}
	
	#chart section#smp {
		display: none;
	}
	
	
/*----------- CAST AREA-------------*/
	#cast {
		width:1100px;
		padding-top: 4em;
		text-align: center;
		color: #fff;
		margin: 0 auto;
	}
	#cast * {color: #fff;}
	#cast .wrap {
		width:100%;
		margin: 0 auto;
		padding: 2em 0;
		display: flex;
		flex-wrap: wrap;
		justify-content :space-around;
	}
	
	#cast .wrap section {
		width:49%;
		margin-bottom: 4em;
		background-color: #000;
	}
	#cast .wrap section h1 {
		text-align: center;
		font-size: 250%;
		font-weight: 600;
		margin-bottom: 0;
	}
	
	#cast .wrap section h2 {
		text-align: center;
		font-size: 150%;
		font-weight: 600;
		margin: 0 0 0.5em;
		padding: 0 1em;
	}#cast .wrap section h2 span {
		font-size:65%;
	}
	
	#cast .wrap section .castphoto {
		margin-bottom: 0.5em;
	}
	#cast .wrap section .castphoto img {
		width:100%;
	}
	
	#cast .wrap section p.casttxt {
		text-align: left;
		padding: 1em;
	}
	
	
	#cast #wrap2 {
		width:100%;
		background-color: #000000;
		padding: 2em 0;
		font-size: 140%;
	}
	#cast #wrap2 div {
		width:100%;
		margin: 0 auto;
		display: inherit;
	}
	#cast #wrap2 div section {
		width: 100%;
	}
	#cast #wrap2 div section h1 {
		font-size: 160%;
		font-weight: 600;
		margin-bottom: 0.5em;
		line-height: 1.1;
	}

	#cast #wrap2 div section h1 span {
		font-size: 70%;
		font-weight: normal;
		display: inline-block;
		margin-bottom: 0.5em;
	}
	
	
	}
}