@charset "utf-8";
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 100;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 200;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 300;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 400;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}
::-moz-selection {
background:#59d0ee;
}
::selection { background: #59d0ee; }
body { font-family: "Yu Gothic", YuGothic, sans-self; }
a { color: #666; }
a:hover { text-decoration: none; }
#fullWrap {
	min-width: 1200px;
	overflow: hidden
}
header {
	min-width: 1200px;
	width: 100%;
	background-color: #FFF;
	position: fixed;
	z-index: 5980;
	left: 0px;
	top: 0px;
}
header #headerin {
	width: 1200px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
}
#headerin h1 {
	position: absolute;
	width: 160px;
	left: 1px;
	top: 0px;
}
#headerin h1 a {
	display: block;
	background-image: url(../images/header_logo.png);
	background-position: center center;
	background-repeat: no-repeat;
}
#headerin nav { margin-left: 161px; }
#headerin nav ul { display: table; }
#headerin nav li { display: table-cell; }
#headerin nav a,
#headerin nav a span {
	display: block;
	background-position: center center;
	background-repeat: no-repeat;
}
header,
header #headerin,
header #headerin h1,
header #headerin h1 a,
header #headerin nav ul,
header #headerin nav li header #headerin nav a,
header #headerin nav a span {
	height: 110px;
	transition: height 0.3s ease;
}
header.sc,
header.sc #headerin,
header.sc #headerin h1,
header.sc #headerin h1 a,
header.sc #headerin nav ul,
header.sc #headerin nav li header.sc #headerin nav a,
header.sc #headerin nav a span { height: 60px; }
header #headerin nav a span {
	text-indent: -9874px;
	opacity: 0;
	transition: all 0.3s ease !important;
}
#headerin nav a.active span,
#headerin nav li:not(.soon) a:hover span { opacity: 1; }
#headerin nav li.soon a {
	opacity: 0.4;
	cursor: default;
}
#nav1 { width: 78px; }
#nav2 { width: 78px; }
#nav3 { width: 108px; }
#nav4 { width: 116px; }
#nav5 { width: 76px; }
#nav6 { width: 94px; }
#nav7 { width: 90px; }
#nav8 { width: 74px; }
#nav9 { width: 82px; }
#nav10 { width: 48px; }
#nav11 { width: 98px; }
#nav12 { width: 74px; }
#nav13 { width: 74px; }
#nav1 a { background-image: url(../images/nav1.png); }
#nav2 a { background-image: url(../images/nav2.png); }
#nav3 a { background-image: url(../images/nav3.png); }
#nav4 a { background-image: url(../images/nav4.png); }
#nav5 a { background-image: url(../images/nav5.png); }
#nav6 a { background-image: url(../images/nav6.png); }
#nav7 a { background-image: url(../images/nav7.png); }
#nav8 a { background-image: url(../images/nav8.png); }
#nav9 a { background-image: url(../images/nav9.png); }
#nav10 a { background-image: url(../images/nav10.png); }
#nav11 a { background-image: url(../images/nav11.png); }
#nav12 a { background-image: url(../images/nav12.png); }
#nav13 a { background-image: url(../images/nav13.png); }
#nav1 span { background-image: url(../images/nav1_ov.png); }
#nav2 span { background-image: url(../images/nav2_ov.png); }
#nav3 span { background-image: url(../images/nav3_ov.png); }
#nav4 span { background-image: url(../images/nav4_ov.png); }
#nav5 span { background-image: url(../images/nav5_ov.png); }
#nav6 span { background-image: url(../images/nav6_ov.png); }
#nav7 span { background-image: url(../images/nav7_ov.png); }
#nav8 span { background-image: url(../images/nav8_ov.png); }
#nav9 span { background-image: url(../images/nav9_ov.png); }
#nav10 span { background-image: url(../images/nav10_ov.png); }
#nav11 span { background-image: url(../images/nav11_ov.png); }
#nav12 span { background-image: url(../images/nav12_ov.png); }
#nav13 span { background-image: url(../images/nav13_ov.png); }
#visual {
	min-height: 1248px;
	min-width: 1200px;
	background-image: url(../images/visual_bg.jpg);
	background-position: center center;
	background-size: cover;
	position: relative;
	overflow: hidden;
	margin-top: 60px;
}
@keyframes charaRotate { 0% {
 transform:rotate(0deg);
}
 100% {
 transform:rotate(360deg);
}
}
#visualChara {
	position: absolute;
	width: 100%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
#topics {
	height: 34px;
	border: 3px solid #FFF;
	position: absolute;
	left: 0px;
	top: 110px;
	right: 0px;
	background-color: rgba(255,255,255,0.8);
	overflow: hidden;
	transition: all 0.3s ease;
}
header.sc #topics { top: 60px; }
header.sc #sns { top: 63px; }

#topics:hover { height: 102px; }
#topics h2 {
	border-right-width: 3px;
	border-bottom-width: 3px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	position: absolute;
	height: 34px;
	left: -3px;
	top: 0px;
	background-image: url(../images/h2_topics.png);
	width: 86px;
	background-position: center center;
}
#topics ul {
	margin-left: 108px;
	margin-right: 250px;
}
#topics li {
	line-height: 34px;
	height: 34px;
}
#topics li a {
	line-height: 36px;
	display: block;
	height: 34px;
	font-size: 12px;
	text-decoration: none;
}
#topics li a span { color: #c370be; }
#topics li a strong { text-decoration: underline; }
#topics li a:hover strong { text-decoration: none; }
#sns {
	width: 246px;
	border-left: solid 3px #FFF;
	border-bottom: solid 3px #FFF;
	position: absolute;
	top: 113px;
	right: 0px;
	transition: all 0.3s ease;
}
#sns ul {
	height: 34px;
	width: 246px;
	display: table;
}
#sns li {
	border-right-width: 3px;
	border-right-style: solid;
	border-right-color: #FFF;
	display: table-cell;
}
#sns img { display: block; }
#sns li a img { transition: opacity 0.3s ease; }
#sns li a:hover img { opacity: 0.5; }
.visualLogo {
	height: 264px;
	width: 630px;
	margin-top: -132px;
	margin-left: -315px;
	position: absolute;
	left: 50%;
	top: 50%;
	background-image: url(../images/visual_logo.png);
	pointer-events:none;
}
.visualCatch {
	background-image: url(../images/visual_catch1.png), url(../images/visual_catch2.png);
	background-position: right top, left top;
	background-repeat: no-repeat, no-repeat;
	height: 596px;
	margin-top: -298px;
	position: absolute;
	top: 50%;
	right: 50px;
	left: 50px;
	pointer-events:none;
}
#startDate {
	position: absolute;
	left: 40px;
	bottom: 45px;
	pointer-events:none;
}

#radio {
	position: absolute;
	right: 40px;
	bottom: 45px;
}

#radio a:hover {
	opacity: 0.6;
}

#radiocp {
	position: absolute;
	right: 40px;
	bottom: 210px;
}

#radiocp a:hover {
	opacity: 0.6;
}

#contentBlock {
	clear: both;
	z-index: 1;
	position: relative;
}
#contentBlock li {
	float: left;
	width: 50%;
	position: relative;
	transform-style: preserve-3d;
	transform: perspective(300px);
}
#contentBlock li:hover { z-index: 10; }
#contentBlock li a {
	display: block;
	height: 100%;
	width: 100%;
	background-position: center center;
	background-size: cover;
	position: relative;
}
#contentBlock li a:before {
	content: '';
	left: 4px;
	top: 4px;
	bottom: 4px;
	right: 4px;
	position: absolute;
	border: dashed 1px #FFF;
}
#contentBlock #cont2,
#contentBlock #cont3,
#contentBlock #cont4,
#contentBlock #cont5 { width: 25%; }
#cont6 a { background-image: url(../images/cont6.jpg); }
#cont1 a { background-image: url(../images/cont1.jpg); }
#cont2 a { background-image: url(../images/cont2.jpg); }
#cont3 a { background-image: url(../images/cont3.jpg); }
#cont5 a { background-image: url(../images/cont5.jpg); }
#contnew1 a { background-image: url(../images/contnew1.jpg); }
#contnew2 a { background-image: url(../images/contnew2.jpg); }

#contentBlock li a span {
	display: block;
	position: absolute;
	left: 15px;
	top: 15px;
	right: 15px;
	bottom: 15px;
	background-position: center center;
	background-repeat: no-repeat;
	text-indent: -9489px;
	transform: translateZ(40px);
}
#cont1 a span { background-image: url(../images/btn_cont1.png); }
#cont6 a span { background-image: url(../images/btn_cont1.png); }
#cont2 a span { background-image: url(../images/btn_cont2.png); }
#cont3 a span { background-image: url(../images/btn_cont3.png); }
#cont5 a span { background-image: url(../images/btn_cont5.png); }
#contnew1 a span { background-image: url(../images/btn_cont1.png); }
#contnew2 a span { background-image: url(../images/btn_cont1.png); }

footer { padding-top: 100px; }
#footerLogo {
	height: 116px;
	width: 326px;
	margin-right: auto;
	margin-left: auto;
}
#copyright {
	font-weight: bold;
	text-align: center;
	padding-top: 55px;
	padding-bottom: 55px;
	font-size: 10px;
}
#loading {
	overfrow: hidden;
	position: fixed;
	min-height: 620px;
	min-width: 1200px;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	z-index: 10002;
}
#loading .visualLogo,
#loading .visualCatch { display: none; }
/*SUB*/
#subLoad {
	background-color: #FFF;
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 25000;
}
#subHeader {
	margin-top: 60px;
	height: 410px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}
#news #subHeader { background-image: url(../images/hbg_news.jpg); }
#world #subHeader { background-image: url(../images/hbg_world.jpg); }
#character #subHeader { background-image: url(../images/hbg_character.jpg); }
#caststaff #subHeader { background-image: url(../images/hbg_caststaff.jpg); }
#movie #subHeader { background-image: url(../images/hbg_movie.jpg); }
#episode #subHeader { background-image: url(../images/hbg_episode.jpg); }
#special #subHeader { background-image: url(../images/hbg_special.jpg); }
#radiop #subHeader { background-image: url(../images/hbg_news.jpg); }
#event #subHeader { background-image: url(../images/hbg_event.jpg); }
#bd #subHeader { background-image: url(../images/hbg_bd.jpg); }
#onair #subHeader { background-image: url(../images/hbg_onair.jpg); }
#cd #subHeader { background-image: url(../images/hbg_cd.jpg); }
#blu-ray #subHeader { background-image: url(../images/hbg_blu-ray.jpg); }
#goods #subHeader { background-image: url(../images/hbg_goods.jpg); }
#subHeader h2 {
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: center center;
	height: 80px;
	width: 226px;
	margin-left: -113px;
	position: absolute;
	left: 50%;
	bottom: 0px;
}
#news #subHeader h2 { background-image: url(../images/h2_news.gif); }
#world #subHeader h2 { background-image: url(../images/h2_world.gif); }
#character #subHeader h2 { background-image: url(../images/h2_character.gif); }
#caststaff #subHeader h2.cast {
	background-image: url(../images/h2_cast.gif);
	margin-left: -485px;
}
#caststaff #subHeader h2.staff {
	background-image: url(../images/h2_staff.gif);
	margin-left: 0px;
}
#movie #subHeader h2 { background-image: url(../images/h2_movie.gif); }
#episode #subHeader h2 { background-image: url(../images/h2_episode.gif); }
#special #subHeader h2 { background-image: url(../images/h2_special.gif); }
#radiop #subHeader h2 { background-image: url(../images/h2_radio.gif); }
#event #subHeader h2 { background-image: url(../images/h2_event.gif); }
#bd #subHeader h2 { background-image: url(../images/h2_bd.gif); }
#onair #subHeader h2 { background-image: url(../images/h2_onair.gif); }
#episode #subHeader h2 { background-image: url(../images/h2_episode.gif); }
#cd #subHeader h2 { background-image: url(../images/h2_cd.gif); }
#blu-ray #subHeader h2 { background-image: url(../images/h2_blu-ray.gif); }
#goods #subHeader h2 { background-image: url(../images/h2_goods.gif); }
#news #subContent {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 70px;
	padding-bottom: 50px;
}
#movie #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}
#world #subContent {
	width: 1090px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 90px;
	padding-bottom: 90px;
	position: relative;
}
#caststaff #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 80px;
	padding-bottom: 120px;
	position: relative;
	color: #666;
	font-weight: 500;
}
#character #subContent {
	width: 100%;
	padding-top: 50px;
	padding-bottom: 40px;
	position: relative;
	color: #666;
	font-weight: 500;
}
#onair #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#onair .main {
	padding-bottom: 50px;
}

#cd #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#cd .main {
	padding-bottom: 50px;
}

#cd .main .jk1 {
	width: 475px;
	float: left;
}

#cd .main .jk1 a {
	width: 475px;
	height: 475px;
	background: url("../images/cd_01.jpg") no-repeat;
    display: block;
    text-indent: -9999px;	
}
#cd .main .jk1 a:hover {
	background: url("../images/cd_01_02.jpg") no-repeat;
}


#cd .main .jk2 {
	width: 475px;
	float: left;
	margin-left: 20px;
}
#cd .main p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 35px;
	padding-top: 40px;
}

#cd .main .opT {
	font-size: 20px;
	line-height: 34px;
	color: #42b6d7;
}
#cd .main .edT {
	font-size: 20px;
	line-height: 34px;
	color: #d46dab;
}
#cd h3 {
	color: #42b6d7;
	font-size: 20px;
	font-weight: bold;
}


#episode #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#episode .main {
	padding-bottom: 50px;
}

#episode .mainE {
	padding-bottom: 15px;
}
#episode .mainE p {
	font-size: 16px;
	line-height: 24px;
	padding-bottom: 10px;
	padding-top: 20px;
	text-align: center;
}
#episode .mainE .opT {
	font-size: 20px;
	line-height: 24px;
	color: #42b6d7;
}
#episode .mainE .edT {
	font-size: 20px;
	line-height: 24px;
	color: #d46dab;
}

#episode .main .ep1 {
	width: 475px;
	float: left;
}
#episode .main .ep2 {
	width: 475px;
	float: left;
	margin-left: 20px;
}
#episode .main p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 35px;
	padding-top: 20px;
}

#episode .main .opT {
	font-size: 20px;
	line-height: 34px;
	color: #42b6d7;
}
#episode .main .edT {
	font-size: 20px;
	line-height: 34px;
	color: #d46dab;
}
#episode .imgBox{
width: 970px;
padding: 10px 0 15px;
}

#episode .imgBox .imgClick{
overflow: hidden;
margin-top: 10px;
}

#episode .imgClick li{
float: left;
padding-right: 10px;
padding-bottom: 5px;
}

#episode .imgClick li:nth-child(5){
padding-right: 0;
}

#event #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#event .main {
	padding-bottom: 50px;
}

#event .main p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 35px;
	padding-top: 40px;
}

#event h3 {
	color: #42b6d7;
	font-size: 20px;
	font-weight: bold;
}


#special #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#special .main {
	padding-bottom: 50px;
}

#special .mainE {
	padding-bottom: 15px;
}
#special .mainE p {
	font-size: 16px;
	line-height: 24px;
	padding-bottom: 10px;
	padding-top: 20px;
	text-align: center;
}
#special .mainE .opT {
	font-size: 20px;
	line-height: 24px;
	color: #42b6d7;
}
#special .mainE .edT {
	font-size: 20px;
	line-height: 24px;
	color: #d46dab;
}

#special .main .ep1 {
	width: 475px;
	float: left;
}
#special .main .ep2 {
	width: 475px;
	float: left;
	margin-left: 20px;
}

#special .main .opT {
	font-size: 20px;
	line-height: 34px;
	color: #42b6d7;
}
#special .main .edT {
	font-size: 20px;
	line-height: 34px;
	color: #d46dab;
}



#special .main p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 15px;
	padding-top: 20px;
}

#special h3 {
	color: #42b6d7;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	padding-bottom: 40px;
}

#special h4 {
	color: #d46dab;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	padding-bottom: 20px;
}

#special h4 a:link {
	color: #d46dab;
}
#special h4 a:visited {
	color: #d46dab;
}
#special h4 a:hover {
	color: #666666;
}

#special .keyword_b {
	color: #42b6d7;
	font-size: 20px;
	font-weight: bold;
}

#special .purple {
	color: #735587;
	font-size: 16px;
	font-weight: bold;
}

#special .keywordBox {
	border-bottom: 1px dotted #42b6d7;
	margin-bottom: 40px;
	padding-bottom: 20px;
}

#special .comicBox {
	width: 580px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 20px;
}


#radiop #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#radiop .main {
	padding-bottom: 50px;
}

#radiop .mainE {
	padding-bottom: 15px;
}
#radiop .mainE p {
	font-size: 16px;
	line-height: 24px;
	padding-bottom: 10px;
	padding-top: 20px;
	text-align: center;
}
#radiop .mainE .opT {
	font-size: 20px;
	line-height: 24px;
	color: #42b6d7;
}
#radiop .mainE .edT {
	font-size: 20px;
	line-height: 24px;
	color: #d46dab;
}

#radiop .main .ep1 {
	width: 475px;
	float: left;
}
#radiop .main .ep2 {
	width: 475px;
	float: left;
	margin-left: 20px;
}

#radiop .main .opT {
	font-size: 20px;
	line-height: 34px;
	color: #42b6d7;
}
#radiop .main .edT {
	font-size: 20px;
	line-height: 34px;
	color: #d46dab;
}

#radiop .main p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 15px;
	padding-top: 20px;
}

#radiop h3 {
	color: #42b6d7;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	padding-bottom: 40px;
}

#radiop h4 {
	color: #d46dab;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	padding-bottom: 20px;
}

#radiop h4 a:link {
	color: #d46dab;
}
#radiop h4 a:visited {
	color: #d46dab;
}
#radiop h4 a:hover {
	color: #666666;
}

#radiop .keyword_b {
	color: #42b6d7;
	font-size: 20px;
	font-weight: bold;
}

#radiop .purple {
	color: #735587;
	font-size: 16px;
	font-weight: bold;
}

#radiop .keywordBox {
	border-bottom: 1px dotted #42b6d7;
	margin-bottom: 40px;
	padding-bottom: 20px;
}

#radiop .comicBox {
	width: 580px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 20px;
}

#bd #subContent {
	width: 970px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 85px;
	padding-bottom: 50px;
}

#bd .main {
	padding-bottom: 50px;
}

#bd .main p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 35px;
	padding-top: 40px;
}

#bd h3 {
	color: #42b6d7;
	font-size: 20px;
	font-weight: bold;
}


#articleList li { margin-bottom: 60px; }
#articleList li .thumb {
	background-color: #DADADA;
	height: 120px;
	width: 120px;
	float: left;
	position: relative;
	z-index: 1;
}
#articleList li .thumb:after {
	content: '';
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	border: solid 12px #FFF;
	opacity: 0.4;
}
#articleList li a {
	display: block;
	height: 120px;
	text-decoration: none;
	padding: 15px;
	position: relative;
}
#articleList li a:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 50%;
	width: 0;
	transition: all 0.3s ease;
}
#articleList li a:after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	bottom: 0;
	width: 0;
	transition: all 0.3s ease;
}
#articleList li:nth-child(odd) a:before,
#articleList li:nth-child(odd) a:after {
	background-color: #59d0ee;
	opacity: 0.1;
}
#articleList li:nth-child(even) a:before,
#articleList li:nth-child(even) a:after {
	background-color: #735587;
	opacity: 0.1;
}
#articleList li a:hover:before {
	width: 100%;
	left: 0;
}
#articleList li a:hover:after {
	width: 100%;
	right: 0;
}
#articleList li .detailDt {
	margin-left: 150px;
	padding-top: 6px;
	padding-bottom: 6px;
	height: 108px;
	position: relative;
	z-index: 1;
}
#articleList li .date {
	font-size: 20px;
	height: 36px;
	line-height: 36px;
}
#articleList li:nth-child(odd) .date { color: #59d0ee; }
#articleList li:nth-child(even) .date { color: #735587; }
#articleList li .title {
	font-size: 18px;
	line-height: 36px;
	color: #666;
}
.paging {
	display: table;
	height: 40px;
	padding-top: 20px;
	padding-bottom: 60px;
	margin-right: auto;
	margin-left: auto;
}
.paging li {
	height: 40px;
	width: 40px;
	padding-right: 5px;
	padding-left: 5px;
	display: table-cell;
}
.paging a {
	display: block;
	height: 40px;
	width: 40px;
	font-size: 18px;
	line-height: 40px;
	color: #FFF;
	text-align: center;
	border-radius: 20px;
	box-sizing: border-box;
	border: dashed 1px #FFF;
	background-color: #40CCFF;
	text-decoration: none;
	transition: all .3s ease;
	font-weight: bold;
}
.paging a:hover,
.paging li.active a {
	border-color: #40CCFF;
	background-color: #FFF;
	color: #40CCFF;
}
#subFooter {
	padding: 0px;
	height: 780px;
	position: relative;
}
#subFooterin {
	padding: 0px;
	height: 860px;
	background-image: url(../images/sub_footer_chara.png);
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	transform-style: preserve-3d;
	transform: perspective(700px);
	left: 0;
	top: -40px;
	bottom: -40px;
	right: 0px;
}
#subFooterLogo {
	background-image: url(../images/footer_logo.png);
	height: 116px;
	width: 326px;
	margin-top: -58px;
	margin-left: -163px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateZ(150px) scale(0.7);
}
#subFooterLogo .cr {
	font-size: 10px;
	font-weight: bold;
	display: block;
	position: absolute;
	top: 117px;
	right: -146px;
	transform: translateZ(100px) scale(1);
}
#subFooterCatch {
	height: 492px;
	width: 101px;
	margin-top: -246px;
	position: absolute;
	top: 50%;
	right: 80px;
	background-image: url(../images/footer_catch.png);
}
#subFooterStartdate {
	height: 74px;
	width: 364px;
	position: absolute;
	left: 39px;
	bottom: 80px;
	background-image: url(../images/sub_footer_startdate.png);
}
#articleList li #articleOnce {
	display: block;
	padding: 15px;
	height: 120px;
}
#news #subContent article {
	padding-right: 15px;
	padding-left: 15px;
}
#news #subContent article p {
	font-size: 16px;
	line-height: 34px;
	padding-bottom: 35px;
}
.centerImage {
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 50px;
}
#backTo {
	height: 64px;
	width: 64px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 30px;
	padding-bottom: 30px;
}
#backTo a {
	display: block;
	height: 64px;
	width: 64px;
	background-color: #40CCFF;
	border: 1px dashed #FFF;
	box-sizing: border-box;
	border-radius: 32px;
	text-align: center;
	line-height: 64px;
	font-size: 14px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	transition: all 0.3s ease;
}
#backTo a:hover {
	background-color: #FFF;
	color: #40CCFF;
	border-color: #40CCFF;
}
#movieList li {
	height: 700px;
	width: 970px;
}
#movieList li .ytBox {
	height: 546px;
	width: 970px;
}
#movieList li h3 {
	padding-top: 20px;
	font-size: 24px;
}
#movieList h3 .movCount { font-size: 14px; }
#movieList li:nth-child(odd) h3 .movCount { color: #59d0ee; }
#movieList li:nth-child(even) h3 .movCount { color: #735587; }
#world1 {
	background-image: url(../images/world1.jpg);
	height: 346px;
	width: 498px;
	margin-left: 300px;
	position: relative;
	transform-style: preserve-3d;
	transform: perspective(300px);
}
#world1 h3 {
	background-image: url(../images/h3_whats.png);
	height: 86px;
	width: 238px;
	margin-top: -43px;
	margin-left: -119px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateZ(40px) scale(0.8);
}
#world1 p {
	background-image: url(../images/world1_text.png);
	height: 257px;
	width: 595px;
	position: absolute;
	left: 329px;
	top: 220px;
	transform: translateZ(80px) scale(0.7);
	transform-origin: left top;
}
#world2 {
	height: 553px;
	width: 498px;
	position: absolute;
	top: 610px;
	right: 0px;
	background-image: url(../images/world2.jpg);
	transform-style: preserve-3d;
	transform: perspective(300px);
	background-repeat: no-repeat;
}
#world2 h3 {
	background-image: url(../images/h3_story.png);
	margin-top: -145px;
	margin-left: -55px;
	position: absolute;
	left: 50%;
	top: 50%;
	height: 92px;
	width: 111px;
	transform: translateZ(40px) scale(0.8);
}
#world2 p {
	background-image: url(../images/world2_text.png);
	position: absolute;
	height: 181px;
	width: 523px;
	left: -400px;
	top: -20px;
	transform: translateZ(80px) scale(0.7);
	transform-origin: center top;
}
#worldText { padding-top: 263px; }
.wt {
	padding-left: 60px;
	line-height: 39px;
	font-size: 16px;
	padding-bottom: 39px;
}
#castList {
	float: left;
	width: 485px;
}
#castList dt {
	clear: both;
	color: #40ccff;
	float: left;
	line-height: 45px;
	height: 32px;
}
#castList dd {
	font-size: 24px;
	padding-bottom: 50px;
	float: left;
	height: 32px;
}
#staffList {
	float: left;
	width: 485px;
}
#staffList dt {
	clear: both;
	color: #735587;
	float: left;
	line-height: 45px;
	height: 32px;
}
#staffList dd {
	font-size: 24px;
	padding-bottom: 50px;
	float: left;
	height: 32px;
}
#staffList dd span { font-size: 14px; }
#staffList .staffLastP { padding-top: 60px; }
#staffList .staffLast { clear: both; }
#staffList dd .opsub {
	line-height: 26px;
	display: inline-block;
}
#characterList1 { padding-bottom: 70px; }
#characterList1 li {
	float: left;
	min-height: 282px;
	width: 50%;
	position: relative;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	transform: perspective(300px);
	transform-style: preserve-3d;
	-webkit-backface-visibility: hidden;
}
#characterList1 li:hover { z-index: 101; }
#characterList1 li a {
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	overflow: hidden;
}
.characterFace {
	background-position: center center;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	right: 0px;
	bottom: 0px;
	background-size: cover;
	transform: translate(0px);
	pointer-events: none;
}
.characterName {
	position: absolute;
	top: 0;
	left: 0;
	right: 0px;
	bottom: 0px;
	transform: translateZ(100px) scale(0.65);
	transform-origin: center center;
	background-position: right bottom;
	background-repeat: no-repeat;
	pointer-events: none;
	transition:all 0.3s ease;
}
.characterCatch {
	position: absolute;
	top: 0;
	left: 0px;
	bottom: 0px;
	right: 0;
	transform: translateZ(100px) scale(0.65);
	transform-origin: center center;
	background-position: left bottom;
	background-repeat: no-repeat;
	pointer-events: none;
	transition:all 0.3s ease;
}
#chara01 { background-image: url(../images/chara01_bg.jpg); }
#chara02 { background-image: url(../images/chara02_bg.jpg); }
#chara03 { background-image: url(../images/chara12_bg.jpg); }
#chara04 { background-image: url(../images/chara04_bg.jpg); }
#chara05 { background-image: url(../images/chara11_bg.jpg); }
#chara06 { background-image: url(../images/chara10_bg.jpg); }
#chara07 { background-image: url(../images/chara03_bg.jpg); }
#chara08 { background-image: url(../images/chara06_bg.jpg); }
#chara09 { background-image: url(../images/chara05_bg.jpg); }
#chara10 { background-image: url(../images/chara08_bg.jpg); }
#chara11 { background-image: url(../images/chara09_bg.jpg); }
#chara12 { background-image: url(../images/chara13_bg.jpg); }
#chara13 { background-image: url(../images/chara07_bg.jpg); }

#chara01 .characterName { background-image: url(../images/chara01_name.png); }
#chara02 .characterName { background-image: url(../images/chara02_name.png); }
#chara03 .characterName { background-image: url(../images/chara12_name.png); }
#chara04 .characterName { background-image: url(../images/chara04_name.png); }
#chara05 .characterName { background-image: url(../images/chara11_name.png); }
#chara06 .characterName { background-image: url(../images/chara10_name.png); }
#chara07 .characterName { background-image: url(../images/chara03_name.png); }
#chara07 .characterName { background-image: url(../images/chara03_name.png); }
#chara08 .characterName { background-image: url(../images/chara06_name.png); }
#chara09 .characterName { background-image: url(../images/chara05_name.png); }
#chara10 .characterName { background-image: url(../images/chara08_name.png); }
#chara11 .characterName { background-image: url(../images/chara09_name.png); }
#chara12 .characterName { background-image: url(../images/chara13_name.png); }
#chara13 .characterName { background-image: url(../images/chara07_name.png); }

#chara01 .characterCatch { background-image: url(../images/chara01_catch.png); }
#chara02 .characterCatch { background-image: url(../images/chara02_catch.png); }
#chara03 .characterCatch { background-image: url(../images/chara12_catch.png); }
#chara04 .characterCatch { background-image: url(../images/chara04_catch.png); }
#chara05 .characterCatch { background-image: url(../images/chara11_catch.png); }
#chara06 .characterCatch { background-image: url(../images/chara10_catch.png); }
#chara07 .characterCatch { background-image: url(../images/chara03_catch.png); }
#chara08 .characterCatch { background-image: url(../images/chara06_catch.png); }
#chara09 .characterCatch { background-image: url(../images/chara05_catch.png); }
#chara10 .characterCatch { background-image: url(../images/chara08_catch.png); }
#chara11 .characterCatch { background-image: url(../images/chara09_catch.png); }
#chara12 .characterCatch { background-image: url(../images/chara13_catch.png); }
#chara13 .characterCatch { background-image: url(../images/chara07_catch.png); }

#characterList2 {
	width: 940px;
	margin-right: auto;
	margin-left: auto;
}
#characterList2 li {
	height: 138px;
	width: 138px;
	margin-right: 25px;
	margin-bottom: 35px;
	margin-left: 25px;
	float: left;
}
#characterList2 li a {
	display: block;
	height: 138px;
	width: 138px;
}
#characterList2 li a img { transition: all 0.5s ease; }
#characterList2 li a:hover img { transform: rotateY(360deg); }
#modal {
	position: fixed;
	z-index: 10050;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	overflow: auto;
	display: none;
	transition:all 0.3s ease;
}
#modalIn {
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	min-width: 1200px;
	min-height: 620px;
}
#modalIn:before {
	content: '';
	position: absolute;
	top: 0px;
	left: 0px;
	height: calc(50% + 1px);
	width: 0px;
	z-index: 1;
	background-color: #B1B1B1;
	transition: all 0.7s ease;
	opacity: 0;
}
#modalIn:after {
	content: '';
	position: absolute;
	bottom: 0px;
	right: 0px;
	height: 50%;
	width: 0px;
	z-index: 1;
	background-color: #FFF;
	transition: all 0.7s ease;
	opacity: 0;
}
#modalIn #charaNext,
#modalIn #charaPrev {
	width:30px;
	height:30px;	
	position:absolute;
	transform:rotate(45deg);
	display:block;
	z-index:300;
	opacity:0;
}
#modalIn #charaNext {
	border-top:solid 1px #B1B1B1;
	border-right:solid 1px #B1B1B1;
	right:47px;
	bottom:47px;
}
#modalIn #charaPrev {
	border-left:solid 1px #B1B1B1;
	border-bottom:solid 1px #B1B1B1;
	left:47px;
	bottom:47px;
}
#modalIn #charaNext:hover,
#modalIn #charaPrev:hover {
	opacity:0.6;
}
#modal.active { display: block; }
#modal.activeline #modalIn:before,
#modal.activeline #modalIn:after {
	width: 100%;
	transition: all 0.5s ease;
	opacity: 1
}
#enNameBox {
	height: 170px;
	width: 50%;
	position: absolute;
	right: 0px;
	bottom: 50%;
	z-index: 2;
	background-position: right bottom;
	background-repeat: no-repeat;
	display: none;
}
#modalCharaIn {
	height: 620px;
	width: 1200px;
	margin-top: -310px;
	margin-left: -600px;
	position: absolute;
	z-index: 110;
	left: 50%;
	top: 50%;
	display: none;
}
#modalCharaBody {
	height: 620px;
	width: 1200px;
	background-position: center center;
	background-repeat: no-repeat;
}
#modalCharaName {
	position: absolute;
	height: 180px;
	width: 462px;
	left: 738px;
	top: 220px;
	background-position: left center;
	background-repeat: no-repeat;
}

#modalCharaCatch {
	height: 100px;
	position: absolute;
	left: 90px;
	top: 260px;
	width: 600px;
	background-position: left center;
	background-repeat: no-repeat;
}

#modalCharaCatch2 {
	height: 149px;
	position: absolute;
	left: 90px;
	top: 260px;
	width: 600px;
	background-position: left center;
	background-repeat: no-repeat;
}


#modalCharaIn p {
	font-size: 16px;
	line-height: 35px;
	position: absolute;
	left: 738px;
	top: 380px;
}



.chara01 #modalIn:before { background-color: #4BD0F6; }
.chara02 #modalIn:before { background-color: #C8A1E3; }
.chara03 #modalIn:before { background-color: #f68656; }
.chara04 #modalIn:before { background-color: #3981ed; }
.chara05 #modalIn:before { background-color: #f1d68d; }
.chara06 #modalIn:before { background-color: #d94537; }
.chara07 #modalIn:before { background-color: #f190b1; }
.chara08 #modalIn:before { background-color: #eccdd7; }
.chara09 #modalIn:before { background-color: #f5b764; }
.chara10 #modalIn:before { background-color: #332e2a; }
.chara11 #modalIn:before { background-color: #5a0067; }
.chara12 #modalIn:before { background-color: #b1b1b1; }
.chara13 #modalIn:before { background-color: #615152; }

.chara01 #modalIn #charaNext,
.chara01 #modalIn #charaPrev {border-color:#4BD0F6;}
.chara02 #modalIn #charaNext,
.chara02 #modalIn #charaPrev {border-color:#C8A1E3;}
.chara03 #modalIn #charaNext,
.chara03 #modalIn #charaPrev {border-color:#f68656;}
.chara04 #modalIn #charaNext,
.chara04 #modalIn #charaPrev {border-color:#3981ed;}
.chara05 #modalIn #charaNext,
.chara05 #modalIn #charaPrev {border-color:#f1d68d;}
.chara06 #modalIn #charaNext,
.chara06 #modalIn #charaPrev {border-color:#d94537;}
.chara07 #modalIn #charaNext,
.chara07 #modalIn #charaPrev {border-color:#f190b1;}
.chara08 #modalIn #charaNext,
.chara08 #modalIn #charaPrev {border-color:#eccdd7;}
.chara09 #modalIn #charaNext,
.chara09 #modalIn #charaPrev {border-color:#f5b764;}
.chara10 #modalIn #charaNext,
.chara10 #modalIn #charaPrev {border-color:#332e2a;}
.chara11 #modalIn #charaNext,
.chara11 #modalIn #charaPrev {border-color:#5a0067;}
.chara12 #modalIn #charaNext,
.chara12 #modalIn #charaPrev {border-color:#b1b1b1;}
.chara13 #modalIn #charaNext,
.chara13 #modalIn #charaPrev {border-color:#615152;}

.chara01 #enNameBox { background-image: url(../images/chara01_enname.png); }
.chara02 #enNameBox { background-image: url(../images/chara02_enname.png); }
.chara01 #modalCharaBody { background-image: url(../images/chara01_body.png); }
.chara02 #modalCharaBody { background-image: url(../images/chara02_body.png); }
.chara03 #modalCharaBody { background-image: url(../images/chara12_body.png); }
.chara04 #modalCharaBody { background-image: url(../images/chara04_body.png); }
.chara05 #modalCharaBody { background-image: url(../images/chara11_body.png); }
.chara06 #modalCharaBody { background-image: url(../images/chara10_body.png); }
.chara07 #modalCharaBody { background-image: url(../images/chara03_body.png); }
.chara08 #modalCharaBody { background-image: url(../images/chara06_body.png); }
.chara09 #modalCharaBody { background-image: url(../images/chara05_body.png); }
.chara10 #modalCharaBody { background-image: url(../images/chara08_body.png); }
.chara11 #modalCharaBody { background-image: url(../images/chara09_body.png); }
.chara12 #modalCharaBody { background-image: url(../images/chara13_body.png); }
.chara13 #modalCharaBody { background-image: url(../images/chara07_body.png); }

.chara01 #modalCharaName { background-image: url(../images/chara01_modalname.png); }
.chara02 #modalCharaName { background-image: url(../images/chara02_modalname.png); }
.chara03 #modalCharaName { background-image: url(../images/chara12_modalname.png); }
.chara04 #modalCharaName { background-image: url(../images/chara04_modalname.png); }
.chara05 #modalCharaName { background-image: url(../images/chara11_modalname.png); }
.chara06 #modalCharaName { background-image: url(../images/chara10_modalname.png); }
.chara07 #modalCharaName { background-image: url(../images/chara03_modalname.png); }
.chara08 #modalCharaName { background-image: url(../images/chara06_modalname.png); }
.chara09 #modalCharaName { background-image: url(../images/chara05_modalname.png); }
.chara10 #modalCharaName { background-image: url(../images/chara08_modalname.png); }
.chara11 #modalCharaName { background-image: url(../images/chara09_modalname.png); margin: -25px 0 0 0 }
.chara12 #modalCharaName { background-image: url(../images/chara13_modalname.png); }
.chara13 #modalCharaName { background-image: url(../images/chara07_modalname.png); }

.chara01 #modalCharaCatch { background-image: url(../images/chara01_modalcatch.png); }
.chara02 #modalCharaCatch { background-image: url(../images/chara02_modalcatch.png); }
.chara03 #modalCharaCatch { background-image: url(../images/chara12_modalcatch.png); }
.chara04 #modalCharaCatch { background-image: url(../images/chara04_modalcatch.png); }
.chara05 #modalCharaCatch { background-image: url(../images/chara11_modalcatch.png); }
.chara06 #modalCharaCatch { background-image: url(../images/chara10_modalcatch.png); }
.chara07 #modalCharaCatch { background-image: url(../images/chara03_modalcatch.png); }
.chara08 #modalCharaCatch { background-image: url(../images/chara06_modalcatch.png); }
.chara09 #modalCharaCatch { background-image: url(../images/chara05_modalcatch.png); }
.chara10 #modalCharaCatch { background-image: url(../images/chara08_modalcatch.png); }
.chara11 #modalCharaCatch { background-image: url(../images/chara09_modalcatch.png); }
.chara12 #modalCharaCatch { background-image: url(../images/chara13_modalcatch.png); }
.chara13 #modalCharaCatch { background-image: url(../images/chara07_modalcatch.png); }

.chara01 #modalCharaMovie {
	height: 200px;
	position: absolute;
	left: 90px;
	top: 380px;
	width: 380px;
	display: none;
}
.chara02 #modalCharaMovie,
.chara03 #modalCharaMovie,
.chara04 #modalCharaMovie,
.chara05 #modalCharaMovie,
.chara06 #modalCharaMovie,
.chara07 #modalCharaMovie,
.chara08 #modalCharaMovie,
.chara09 #modalCharaMovie,
.chara10 #modalCharaMovie,
.chara11 #modalCharaMovie,
.chara12 #modalCharaMovie,
.chara13 #modalCharaMovie{
	display: none;
}

#characterClose {
	height: 43px;
	width: 43px;
	position: absolute;
	top: 40px;
	right: 40px;
	z-index: 300;
	opacity:0;
}
#visualLight {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	opacity: 0.5;
	pointer-events:none;
}

.iconD {
	width: 200px;
	float: left;
	margin-left: 5px;
	padding-bottom: 30px;
}

.iconR {
	width: 825px;
	margin: 0 auto;
	padding-bottom: 40px;
}

.songBdBox {
	padding: 40px;
	background: url(../images/song_bg.jpg) 0 0 no-repeat;
	line-height: 30px;
}

.eventRed {
	color: #FF0004;
	font-weight: bold;
}

.eventGray {
	color: #ccc;
}
#imgModal {
	background: rgba(255,255,255,0.8);
	position: fixed;
	z-index: 12000;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	overflow: auto;
	display:none;
}
#modalin {
	min-height: 900px;
	min-width: 600px;
	width:100%;
	height:100%;
	position:absolute;
}
#modalin a {
	position:absolute;
	left:50%;
	top:50%;
	display:block;
	transform:translate(-50%,-50%);
}
#modalClose {
	position: absolute;
	top: 0px;
	right: 0px;
	z-index:5000;
}