@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP:600');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP&subset=japanese');
::selection {
	background: #000;
	color: #fff;
}
::-moz-selection {
 background: #000;
 color:#fff;
}
* { outline: none; }
body {
	font-family: "游明朝体", "Yu Mincho", YuMincho, 'Noto Serif JP', serif;
	font-weight: 600;
	font-size: 14px;
	color: #FFF;
	background-color: #2792be;/*	min-width: 1200px;*/
	overflow-y:scroll;
}
a {
	color: #000;
	display: block;
	text-decoration: none;
}
a:hover { text-decoration: none; }
.sp { display: none; }
#topWrap {
	min-width: 1200px;
	min-height: 620px;
	position: relative;
	opacity: 1;
}
.main {
	position: fixed;
	left: 220px;
	top: 0;
	bottom: 0;
	right: 0;
	min-height: 620px;
	overflow: hidden;
}
#mv {
	height: 100%;
	overflow: auto;
}
#scene {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 100%;
	min-width: 980px;
	overflow: hidden;
	width: 100%;
}
#scene li {
	display: block;
	position: absolute;
	z-index: 6;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	height: 100%;
	width: 100%;
}
#visual1 {
	background: url(../images/mv2.jpg) no-repeat center top / 100% auto;
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0;
}
#indexStoppedParts {
	position: absolute;
	z-index: 1000;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	min-width: 980px;
	min-height: 620px
}
#main_title {
	/*width: 487px;*/
	width: 280px;
	/*height: 140px;*/
	position: absolute;
	top: 50%;
	/*left: 50%;*/
	/*margin-top: -70px;*/
	/*margin-left: -243.5px;*/
	margin-top: -30px;
	right: 20px;
}
#startDate {
	position: absolute;
	width: 464px;
	height: 94px;
	right: 0px;
	bottom: 0;
	margin-right: 20px;
	margin-bottom: 0px;
}
#copyRight {
	position: absolute;
	width: 220px;
	height: 10px;
	right: 0;
	bottom: 3px;
	margin-right: 20px;
	margin-bottom: 10px;
	font-size: 10px;
	color: #fff;
	text-align: right;
	text-shadow: black 1px 1px 3px, black -1px 1px 3px,  black 1px -1px 3px, black -1px -1px 3px;
}
#adv_top {
	width: 170px;
	height: 40px;
	position: absolute;
	bottom: 25px;
	left: 20px;
	z-index: 5;
}
#adv_top a:hover { opacity: 0.6; }

#adv2_top {
	width: 170px;
	height: 40px;
	position: absolute;
	bottom: 25px;
	left: 200px;
	z-index: 5;
}
#adv2_top a:hover { opacity: 0.6; }

#oa_heder {
	position: absolute;
	right: 0;
	bottom: 0;
	margin-right: 495px;
	content: "";
	background-image: url("../images/oa.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #000;
	height: 90px;
	width: 20px;
}
#commonCont {
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 999;
	opacity: 1;/*overflow: hidden;*/
	/*min-height: 620px;*/
}
#pLeft {
	width: 220px;
	height: 100%;
	background-color: #fff;
	min-height: 620px;
	position: relative;
}
#pLeft h1 {
	width: 82px;
	height: 218px;
	position: absolute;
	top: 0;
	left: 50%;
	margin-top: 40px;
	margin-left: -41px;
}
#pLeft p {
	width: 94px;
	height: 31px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: 80px;
	margin-left: -47px;
}
#pLeft a { height: 31px; }
#menuBtn {
	width: 220px;
	height: 130px;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -110px;
	z-index: 30;
}
#menuBtn a {
	width: 40px;
	height: 100px;
	margin: auto;
}
#menuBtn a:hover #top_arw_btn {
	transform: rotateZ( 360deg ) translate(0, 0);
	animation: none;
}
#menu_icon {
	width: 46px;
	height: 15px;
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -23.5px;
	margin-top: 0;
}
@keyframes dip {  0% {
top: -5px;
}
 50% {
top: 5px;
}
 100% {
top: -5px;
}


}
#top_arw_btn {
	width: 7px;
	height: 33px;
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -3.5px;
	margin-top: 50px;
	transition: all .4s ease;
	transform: rotateZ( 0deg );
	animation: dip 1.5s linear infinite;
}
/*--MEUN BEGIN--*/
#menuCont {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 10000;
	background-color: #000;
	overflow: auto;
	display: none;
}
#menuFlame {
	width: 100%;
	height: 100%;
	min-width: 1200px;
	min-height: 680px;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
}
#menuCont_bg01 {
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	content: " ";
	background-image: url(../images/menu_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
/*#menuCont_bg02 { 
	content: " ";
	width:  100%;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
	height: 700px;
    transform: skewY(-8deg) translateX(-100%);
    margin-bottom: -300px;
    transition: all .3s ease-in-out;
}
#menuCont_bg02.active {
	transform: skewY(-8deg) translateX(0%);
}*/
#menuContIn {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	margin-left: 100px;
	z-index: 30000;
}
/*#menu_chara {
	content: " ";
	background-image: url(../images/menu_chara.png);
	background-repeat: no-repeat;
	background-position: right bottom;
	width:  100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 20000;
	display: none;
}*/
#backBtn {
	padding-top: 50px;
	width: 26px;
	height: 150px;
}
#backBtn a:hover #menu_arw { transform: rotateZ( 360deg ); }
#menu_arw {
	width: 7px;
	margin: auto;
	padding-bottom: 10px;
	transition: .4s;
	transform: rotateZ( 0deg );
}
/*#menuContIn nav {
	transition: all 0.5s cubic-bezier(0.84, 0.03, 0.25, 1);
}*/
/*#menuContIn nav .active { transform: translateX(0); }*/
#menuContIn nav ul {
	width: 400px;
	display: -ms-grid;
	display: grid;
	grid-auto-flow: column;
	-ms-grid-rows: auto auto auto auto auto auto auto;
	grid-template-rows: auto auto auto auto auto auto auto;
	-ms-grid-columns: auto auto;
	grid-template-columns: auto auto;
}
#menuContIn nav li {
	margin: 10px 0;
	width: 200px;
}
#menuContIn nav li a img {
	display: block;
	transition: all 0.3s ease;
}
#menuContIn nav li a:hover img { transform: translateX(10px); }
#tw_nav { position: relative; }
#tw_nav a:after {
	content: " ";
	background-image: url(../images/tw.svg);
	background-repeat: no-repeat;
	background-position: center center;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 0;
	right: 0;
	margin-right: 3px;
	transition: all 0.3s ease;
}
#tw_nav a:hover:after { transform: translateX(10px) rotateY(360deg); }
#menu_logo {
	width: 94px;
	height: 31px;
	position: absolute;
	right: 0;
	bottom: 0;
	margin-right: 80px;
	margin-bottom: 50px;
	z-index: 30000;
}
#adv {
	width: 170px;
	height: 40px;
	float: left;
}
#adv a:hover { opacity: 0.6; }
#adv2 {
	width: 170px;
	height: 40px;
	float: left;
	padding-left: 10px;
}
#adv2 a:hover { opacity: 0.6; }
#share {
	width: 150px;
	height: 30px;
	float: left;
	padding: 5px 0;
}
#share li {
	float: left;
	margin-right: 20px;
	width: 30px;
	height: 30px;
}
#share li a {
	display: block;
	height: 30px;
	background-repeat: no-repeat;
	background-position: center center;
	transition: all .3s ease-in-out;
}
#share li a:hover { transform: translateY(-10px); }
#share>#tw a {
	content: " ";
	background-image: url(../images/tw.svg);
}
#share>#fb a {
	content: " ";
	background-image: url(../images/fb.svg);
}
#share>#ln a {
	content: " ";
	background-image: url(../images/ln.svg);
}
/*--MENU END--*/
#mainWrap {
	height: 100%;
	min-width: 580px;
	margin-left: 220px;
	padding-right: 400px;
	position: relative;
	z-index: 11;
	opacity: 1;
	background: #2792be;
}
.centerCont { padding: 100px 5% 0; }
.centerCont #general_h2 { height: 30px; }
.centerCont p {
	padding-top: 60px;
	font-size: 16px;
	line-height: 36px;
	font-weight: normal;
	letter-spacing: 5px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
}
#s_title {
	font-size: 39px !important;
	padding-top: 50px !important;
	line-height: 50px !important;
	font-weight: normal;
	letter-spacing: 5px;
	transform: scale(0.8, 1);
}
.centerCont p span {
	font-size: 30px;
	position: relative;
}
.centerCont .hurigana:before {
	content: "おろち";
	width: 50px;
	height: 12px;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 1px;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: -11px;
	margin-left: 29px;
}
#csList {
	padding-top: 100px;
	font-weight: normal;
	letter-spacing: 1px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
}
#csList li {
	font-size: 18px;
	color: #fff;
	line-height: 42px;
	padding-bottom: 30px;
	letter-spacing: 4px;
}
#csList span {
	font-size: 26px;
	color: #fff;
	line-height: 20px;
}
#csList .ex_height {
	padding-bottom: 50px;
	position: relative;
}
#csList .s_subtext {
	font-size: 14px !important;
	color: #fff !important;
	position: absolute;
	top: 35px;
	left: 200px;
}
.mediaBox01 { padding-top: 80px; }
.mediaBox02 {
	padding-top: 80px;
	padding-bottom: 80px;
}
.mmTitle {
	background-color: #fff;
	color: #000;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2px;
	transform: scale(0.8, 1);
	font-weight: bold;
	width: 70px;
	text-align: center;
	padding-top: 1px;
	transform-origin: left center;
}
.mmTitle2 {
	background-color: #fff;
	color: #000;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2px;
	transform: scale(0.8, 1);
	font-weight: bold;
	width: 120px;
	text-align: center;
	padding-top: 1px;
	transform-origin: left center;
}
.mediaBox01 p,
.mediaBox02 p {
	line-height: 30px !important;
	padding-top: 20px !important;
	padding-bottom: 10px;
}
.mediaBox01 ul,
.mediaBox02 ul { padding-top: 30px; }
.mediaBox01 li,
.mediaBox02 li {
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
}
.mm_subtext {
	font-size: 12px !important;
	padding-bottom: 10px;
}
#moviBox { padding-top: 60px; }
#moviBox p {
	padding-top: 10px !important;
	padding-bottom: 20px;
}
.mov a {
	display: block;
	height: 350px;
	width: 650px;
	background-color: #FFF;
}
#newsBox {
	padding-left: 60px;
	padding-right: 60px;
}
#newsBox #general_h2 { padding-top: 100px; }
#newsBox ul {
	padding-top: 40px;
	position: relative;
	padding-bottom: 100px;
}
#newsBox li { }
#newsBox li a {
	display: block;
	;
	position: relative;
}
#newsBox li a:before {
	content: "";
	position: absolute;
	top: 0;
	left: -280px;
	bottom: 0;
	z-index: 0;
	right: -60px;
	pointer-events: none;
}
#newsBox li a:hover:before {
	background-color: #002a51;
	opacity: 0.8;
	color: #FFF;
}
.news_list {
	position: relative;
	padding: 14px 0;
}
#newsBox li p {
	color: #fff;
	font-size: 16px;
	font-weight: normal;
	letter-spacing: 1px;
	transform: scale(0.8, 1);
	padding-top: 0 !important;
	z-index: 20;
	margin-right: calc(-25% + 70px);
}
#newsBox li a:after {
	content: "";
	width: 31px;
	height: 31px;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -15.5px;
	background-image: url(../images/arw04.png);
	background-position: center center;
	background-repeat: no-repeat;
}
#newsBox li a:hover:after { background-image: url(../images/arw03.png); }
.news_date {
	position: absolute;
	top: 0;
	left: 0;
	line-height: 70px;
	width: 134px;
	text-align: center;
	transform-origin: left center;
}
.ub01 {
	content: "";
	width: 89px;
	height: 1px;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;/*	margin-bottom: -3px;*/
}
.ub02 {
	content: "";
	width: 6px;
	height: 6px;
	background-color: #fff;
	transform: rotate(45deg);
	position: absolute;
	bottom: 0;
	left: 0;
	margin-bottom: -2px;
	margin-left: 95px;
}
.ub03 {
	content: "";
	height: 1px;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	/*	margin-bottom: -3px;*/
	margin-left: 108px;
}
.news_title {
	line-height: 42px;
	padding-left: 157px;
	transform-origin: left center;
}
.n_arw {
	padding-left: 0 !important;
	float: right !important;
	padding-right: 100px;
	padding-bottom: 37px;
}
.ndBox { z-index: 0 !important; }
#news_detail { margin-bottom: 90px; }
#news_detail p {
	padding-top: 50px;
	font-size: 14px;
	line-height: 50px;
	font-weight: normal;
	letter-spacing: 1px;
	transform: scale(0.8, 1);
	margin-left: -12.5%;
	margin-right: -12.5%;
}
#news_detail p a { display: inline; }
#news_detail p a:link {
	text-decoration: underline;
	color: #fff;
}
#news_detail p a:visited {
	text-decoration: underline;
	color: #fff;
}
#news_detail p a:hover {
	text-decoration: none;
	color: #fff;
}
#n_backBtn {
	margin-bottom: 100px;
	padding-top: 60px;
}
#n_backBtn a {
	color: #fff;
	border: 1px solid #fff;
	font-weight: normal;
	font-size: 14px;
	line-height: 30px;
	text-align: center;
	display: block;
	transition: all .3s ease;
}
#n_backBtn a:hover {
	background: #fff;
	color: #000;
}
#commonCont02 {
	width: 400px;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	overflow-x: hidden;
	overflow-y: hidden;
}
#rCont_bg {
	content: "";
	width: 1200px;
	height: 100%;
	background-image: url(../images/r_bg.jpg);
	background-size: cover;
	background-position: left top;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
}
#r_btmCont {
	width: 400px;
	height: 175px;
	position: absolute;
	bottom: 0;
	left: 0;
}
#r_logo {
	width: 185px;
	height: 49px;
	margin: auto;
	padding-top: 0 !important;
	transform: none !important;
}
#r_copyRight {
	color: #fff;
	font-size: 10px !important;
	padding-top: 50px !important;
	line-height: 30px !important;
	text-align: center;
}
#r_Wrap {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: 12;
}
#r_WrapIn {
	width: 100%;
	height: 100%;
	min-width: 1200px;
	/*min-height: 620px;*/
	position: absolute;
	top: 0;
	left: 0;
}
#ytBox {
	width: 95%;
	padding-top: 56.25%;
	position: relative;
}
#ytBox iframe {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
}
#intro_eng {
	padding-top: 70px !important;
	line-height: 30px !important;
	padding-bottom: 100px;
}
#story_eng {
	padding-top: 80px !important;
	line-height: 30px !important;
	padding-bottom: 100px;
}
.scList_eng {
	padding-top: 85px !important;
	padding-bottom: 100px;
}
.ex_height_eng {
	padding-bottom: 60px !important;
	position: relative;
}
.s_subtext_eng {
	font-size: 15px !important;
	color: #fff;
	position: absolute;
	top: 40px;
	left: 200px;
}
.mmTitle_eng01 {
	width: 140px;
	background-color: #fff;
	color: #000;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2px;
	transform: scale(0.8, 1);
	font-weight: bold;
	text-align: center;
	padding-top: 1px;
	transform-origin: left center;
}
.mmTitle_eng02 {
	width: 120px;
	background-color: #fff;
	color: #000;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2px;
	transform: scale(0.8, 1);
	font-weight: bold;
	text-align: center;
	padding-top: 1px;
	transform-origin: left center;
}
#eng_title {
	width: 75px;
	height: 15px;
	padding-top: 70px !important;
}
#eng_title_mm {
	width: 75px;
	height: 15px;
	margin-bottom: 55px !important;
	padding-top: 0 !important;
}
#story { padding: 100px 5% 0; }
#storyh1 { height: 30px; }
#story p {
	padding-top: 30px;
	font-size: 16px;
	line-height: 44px;
	font-weight: normal;
	letter-spacing: 0.25em;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
}
#story p span {
	font-size: 39px;
	position: relative;
}
#story .hurigana:before {
	content: "おろち";
	width: 50px;
	height: 12px;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 1px;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: -11px;
	margin-left: 43px;
}
.news_list_detail {
	position: relative;
	padding: 14px 0;
}
.news_list_detail .news_date,
.news_list_detail .news_title { font-size: 20px !important; }
.news_list_detail .ub01 {
	content: "";
	width: 104px !important;
	height: 1px;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
}
.news_list_detail .ub02 {
	content: "";
	width: 7px;
	height: 7px;
	background-color: #fff;
	transform: rotate(45deg);
	position: absolute;
	bottom: 0;
	left: 0;
	margin-bottom: -3px;
	margin-left: 110px;
}
.news_list_detail .ub03 {
	content: "";
	height: 1px;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	margin-left: 123px;
	right: 0;
}
/*.news_list_detail .news_title{
	width: calc(100% - 200px);
	line-height: 42px;
    padding-left: 120px;
	 transform-origin:left center;
}*/
.mm_engBox { padding-top: 0 !important; }
.mediaBox01 .mmb,
.mediaBox02 .mmb {
	font-size: 20px !important;
	line-height: 34px !important;
	padding-top: 30px !important;
}
#main_titleWrap {
	position: absolute;
	top: 0;
	min-width: 980px;
	min-height: 620px;
	height: 100%;
	z-index: 9999;
}
#bk_mask {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 1;
}
#bk_mask_common {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 1;
	z-index: 9999999;
}
#bk_mask_common02 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 1;
	z-index: 9999999;
	margin-left: 220px;
}
#loading {
	position: fixed;
	z-index: 5000;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: #000;
	display: none;
}
.modal {
	overflow: auto;
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	background: rgba(0,0,0,1);
	z-index: 12000;
	display: none;
}
.modalin {
	min-height: 620px;
	min-width: 1200px;
	position: absolute;
	width: 100%;
	height: 100%;
}
.modalin iframe {
	display: block;
	width: 960px;
	height: 540px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -270px;
	margin-left: -480px;
}
.modalClose {
	position: absolute;
	height: 70px;
	width: 70px;
	top: 0;
	right: 0;
	z-index: 5001;
	margin-top: 40px;
	margin-right: 70px;
}
.modalClose a img {
	transition: all 0.3s ease;
	transform-origin: right top;
}
.modalClose a:hover img { opacity: .7; }
#newsBox.ndBox ul { padding-bottom: 0; }
#news_detail img {
	max-width: 100%;
	height: auto;
	display: inline-block;
	margin-top: 40px;
}
#m_bottom_cont {
	height: 40px;
	width: 100%;
	position: absolute;
	bottom: 25px;
	left: 0;
}
nav {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-42%);
}
/*============================== CHARACTER ===============================*/
#character { position: relative; }
#charaCont {
	padding-top: 70px;
	padding-bottom: 120px;
}
#cl_title {
	height: 50px;
	max-width: 600px;
	border: 1.2px solid #fff;
	margin: auto;
}
#cl_title h3 {
	height: 50px;
	max-width: 600px;
	font-size: 24px;
	line-height: 50px;
	font-weight: normal;
	letter-spacing: 0.2em;
	transform: scale(0.8, 1);
	text-align: center;
	box-sizing: border-box;
}
#chara_list {
	max-width: 600px;
	margin: auto;
	padding-top: 10px;
	padding-bottom: 30px;
	display: flex;
	flex-wrap: wrap;
}
#chara_list li {
	width: calc(50% - 5px);
	max-width: 295px;
	height: 45px;
	margin-bottom: 10px;
	position: relative;
	overflow: hidden;
}
#chara_list li:nth-child(even) { margin-left: 10px; }
#chara_list li.hasPic { height: 120px; }
#chara_list li a {
	display: block;
	height: 45px;
	background-color: #fff;
	transition: all 0.3s ease;
}
#chara_list li.hasPic a { height: 120px; }
#chara_list li.hasPic a:hover { transform: scale(1.05); }
#chara_list li a:hover { opacity: .7; }
#chara_list li a strong {
	display: block;
	font-size: 22px;
	line-height: 45px;
	font-weight: bold;
	letter-spacing: 0.2em;
	transform: scale(0.8, 1);
	text-align: center;
	margin: 0px -21.5%;
}
.c_name {
	width: 45%;
	height: 120px;
	position: absolute;
	right: 0;
	top: 0;
}
#chara_list li.hasPic a strong { line-height: 120px; }
#c1 a { background: url(../images/character/c_thumb1.png) no-repeat left center; }
#c2 a { background: url(../images/character/c_thumb2.png) no-repeat left center; }
#c3 a { background: url(../images/character/c_thumb3.png) no-repeat left center; }
#c4 a { background: url(../images/character/c_thumb4.png) no-repeat left center; }
#c5 a { background: url(../images/character/c_thumb5.png) no-repeat left center; }
#c6 a { background: url(../images/character/c_thumb6.png) no-repeat left center; }
#c7 a { background: url(../images/character/c_thumb7.png) no-repeat left center; }
#c8 a { background: url(../images/character/c_thumb8.png) no-repeat left center; }
#c9 a { background: url(../images/character/c_thumb9.png) no-repeat left center; }
#c10 a { background: url(../images/character/c_thumb10.png) no-repeat left center; }
#c11 a { background: url(../images/character/c_thumb11.png) no-repeat left center; }
#c12 a { background: url(../images/character/c_thumb12.png) no-repeat left center; }
#c13 a { background: url(../images/character/c_thumb13.png) no-repeat left center; }
#c14 a { background: url(../images/character/c_thumb14.png) no-repeat left center; }
#c15 a { background: url(../images/character/c_thumb15.png) no-repeat left center; }
#c16 a { background: url(../images/character/c_thumb16.png) no-repeat left center; }
#c17 a { background: url(../images/character/c_thumb17.png) no-repeat left center; }
#c18 a { background: url(../images/character/c_thumb18.png) no-repeat left center; }
#c19 a { background: url(../images/character/c_thumb19.png) no-repeat left center; }
#c20 a { background: url(../images/character/c_thumb20.png) no-repeat left center; }
#c21 a { background: url(../images/character/c_thumb21.png) no-repeat left center; }
#c22 a { background: url(../images/character/c_thumb22.png) no-repeat left center; }
#CharaModal article { display: none; }
.c_main_img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-90%, -50%);
}
.c_info_box {
	width: 400px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(40%, -50%);
}
.c_info_box h2,
.c_str_box h2 {
	font-size: 22px;
	line-height: 45px;
	font-weight: bold;
	letter-spacing: 0.25em;
	transform: scale(0.8, 1);
	margin: 0px -21.5%;
	padding-bottom: 15px;
}
.c_info_box p,
.c_str_box p {
	font-size: 14px;
	line-height: 42px;
	font-weight: bold;
	letter-spacing: 0.25em;
	transform: scale(0.8, 1);
	margin: 0px -21.5%;
}
.c_str_box {
	width: 520px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
/*============================== MUSIC ===============================*/

#music article {
	padding-top: 50px;
	margin: auto;
	max-width: 660px;
	padding-bottom: 100px;
}
#music article h3 {
	font-size: 22px;
	line-height: 42px;
	font-weight: normal;
	letter-spacing: 0.25em;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
}
#music article h3 span { font-size: 16px; }
#music article img {
	display: block;
	margin: 30px auto;
}
#music article p { padding-top: 0; }
#music article a {
	display: inline-block;
	color: #fff;
	text-decoration: underline;
	transition: all .3s ease;
}
#music article a:hover {
	opacity: .7;
	text-decoration: none;
}
#music article h4 {
	display: block;
	height: 45px;
	background-color: #fff;
	margin-bottom: 30px;
}
#music article h4 span {
	display: block;
	font-size: 22px;
	line-height: 45px;
	font-weight: bold;
	letter-spacing: 0.2em;
	transform: scale(0.8, 1);
	text-align: center;
	margin: 0px -12.5%;
	color: #000;
}
/*============================== STAFFCAST ===============================*/
#staffcast { position: relative; }
#staffcast article { padding-bottom: 80px; }
#sc_tab {
	width: 280px;
	height: 30px;
	border: 1px solid #fff;
	display: flex;
	position: absolute;
	right: 30px;
	top: 95px;
}
#sc_tab li {
	width: 50%;
	height: 30px;
	background: #000;
}
#sc_tab li.active { background: #fff; }
#sc_tab li.active a { color: #000; }
#sc_tab li a {
	height: 30px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	color: #fff;
	font-size: 18px;
	font-weight: normal;
	letter-spacing: 4px;
	line-height: 33px;
	text-align: center;
}
.comm_link {
	width: 180px;
	height: 30px;
	display: inline-block;
	vertical-align: middle;
	margin-left: 15px;
}
.comm_link a {
	height: 20px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	color: #fff;
	font-size: 16px;
	font-weight: normal;
	letter-spacing: 4px;
	line-height: 20px;
	text-align: center;
	border: 1px solid #fff;
	transition: all .3s ease;
}
.comm_link a:hover { opacity: .7; }
.comm_info_box { width: 100%; }
#CommModal article {
	display: none;
	width: 1050px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.comm_info_box h2 {
	font-size: 22px;
	line-height: 45px;
	font-weight: normal;
	letter-spacing: 0.25em;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	padding-bottom: 20px;
}
.comm_info_box p {
	font-size: 16px;
	line-height: 44px;
	font-weight: normal;
	letter-spacing: 0.25em;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	padding-bottom: 20px;
}
.comm_q { opacity: .3; }
.comm_img {
	float: left;
	margin-top: 10px;
}
.isImg .comm_info_box {
	width: 700px;
	float: left;
	margin-left: 30px;
}
/*============================== SCROLL BAR =============================*/
/*.mCSB_container {
	width: 100% !important;
	height: 100% !important;
}*/
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: rgba(135,135,135,0.5) !important; }
.mCSB_scrollTools .mCSB_draggerRail { background-color: rgba(135,135,135,0.5) !important; }
.h_controll .mCSB_container { height: 100% !important; }
.mCSB_outside + .mCSB_scrollTools { right: -4px !important; }
#onair .onairL {
	font-size: 22px;
	line-height: 40px;
	margin-bottom: 12px;
}
#onair .onairL:first-of-type { white-space: nowrap; }
#onair .onairL:not(:first-of-type) { padding-top: 0; }
#onair p span { font-size: 16px; }
#onair .onairM {
	padding-top: 25px;
	font-size: 18px;
}
#onair .onairS {
	padding-top: 0;
	font-size: 12px;
	line-height: 20px;
	padding-bottom: 50px;
}
#onair dl { margin: 40px 0 10px; }
#onair dl p {
	padding-top: 0;
	font-size: 22px;
}
#onair dt,
#onair dd { float: left; }
#onair dt {
	width: 300px;
	clear: both;
}
#onair dd { margin-bottom: 20px; }
#music img {
	max-width: 520px;
	height: auto;
}
/*============================== EPISODES ===============================*/
#episodes article {
	padding-top: 50px;
	margin: auto;
	max-width: 660px;
	padding-bottom: 100px;
}
#ep_list {
	width: 100%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#ep_list li {
	width: calc((100% - 30px) / 2);
	margin-bottom: 30px;
}
#ep_list li a {
	display: block;
	height: 100%;
}
#ep_list .thumbs img {
	display: block;
	width: 100%;
	height: auto;
	transition: all .3s ease;
}
#ep_list li a:hover .thumbs img { transform: scale(1.02); }
#ep_list .ep_title {
	padding-top: 10px;
	font-size: 16px;
	line-height: 32px;
	color: #fff;
	letter-spacing: 0.05em;
	word-break: break-all;
}
#imgBox {
	width: 100%;
	margin: auto;
}
.imgClick {
	padding-top: 5px;
	padding-bottom: 50px;
	width: 100%;
	margin: auto;
}
.imgClick li {
	margin-right: 6px;
	margin-bottom: 6px;
	float: left;
	width: calc((100% - 12px) / 3);
	background: #fff;
}
.imgClick li:nth-child(3n) { margin-right: 0; }
.imgClick li:nth-child(3n + 1) { clear: both }
.imgClick li a { display: block; }
.imgClick li a:hover { opacity: 0.9; }
.imgClick li a img { width: 100%; }
.imgClick li a.active {
	opacity: 0.7;
	pointer-events: none;
}
#ep_deital h3 { background: #fff; }
#ep_deital h3 span {
	display: block;
	font-size: 18px;
	line-height: 22px;
	font-weight: bold;
	letter-spacing: 5px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	color: #000;
	padding: 9px 0;
	text-align: center;
}
#ep_disc { padding-top: 40px; }
#ep_disc ul {
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 20px;
}
#ep_disc li { margin: 0px -1.8%; }
#ep_disc li b {
	display: block;
	font-size: 16px;
	line-height: 22px;
	font-weight: 400;
	letter-spacing: 1px;
	transform: scale(0.8, 1);
	color: #fff;
	margin-right: 10px;
}
#ep_text {
	font-size: 16px;
	line-height: 42px;
	font-weight: normal;
	letter-spacing: 1px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	color: #fff;
}
.hurigana2:before {
	content: "まち";
	width: 50px;
	height: 12px;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 1px;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: -11px;
	margin-left: 29px;
}
/*============================== GOODS ===============================*/
#goods article {
	padding-top: 50px;
	margin: auto;
	max-width: 660px;
	padding-bottom: 100px;
}
#goods_list {
	width: 100%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#goods_list li {
	width: calc((100% - 30px) / 2);
	margin-bottom: 30px;
}
#goods_list li a {
	display: block;
	height: 100%;
}
#goods_list .thumbs img {
	display: block;
	width: 100%;
	height: auto;
	transition: all .3s ease;
}
#goods_list li a:hover .thumbs img { transform: scale(1.02); }
#goods_list .g_name {
	padding-top: 10px;
	font-size: 16px;
	line-height: 32px;
	color: #fff;
	letter-spacing: 0.05em;
	word-break: break-all;
}
#g_deital h3 {
	background: #fff;
	margin-top: 20px;
}
#g_deital h3 span {
	display: block;
	font-size: 18px;
	line-height: 22px;
	font-weight: bold;
	letter-spacing: 5px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	color: #000;
	padding: 9px 0;
	text-align: center;
}
#g_disc { padding-top: 20px; }
#g_text a:link {
	text-decoration: underline;
	color: #fff;
}
#g_text a {
	color: #fff;
	display: inline;
	text-decoration: none;
}
#g_text {
	font-size: 16px;
	line-height: 42px;
	font-weight: normal;
	letter-spacing: 1px;
	transform: scale(0.8, 1);
	margin: 0px -12.5%;
	color: #fff;
}
.dl a { display: inline; }
.dl a:hover { opacity: 0.7; }
#special h3 {
	text-align: center;
	padding: 40px 0px;
	font-size: 26px;
	margin: 0 -12.5%;
	transform: scale(0.8, 1);
	letter-spacing: 0.1em;
}
#special dl {
	width: 100%;
	margin: 0 auto;
	padding-bottom: 35px;
}
#special dt {
	padding-left: 40px;
	position: relative;
	min-height: 30px;
	line-height: 30px;
	font-size: 20px;
	transform-origin: left top;
	transform: scale(0.8, 1);
	margin: 0 -25% 10px 0;
	letter-spacing: 0.1em;
}
#special dt:before {
	content: '';
	position: absolute;
	left: 0;
	top: 15px;
	width: 30px;
	height: 1px;
	background: #FFF;
}
#special dd { padding-bottom: 50px; }
#special dd ul {
	display: flex;
	justify-content: space-between;
}
#special dd li { width: calc(50% - 15px); }
.specialMovie {
	width: 100%;
	padding-top: 56.25%;
	position: relative;
}
.specialMovie iframe {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
}
.toCpd { padding-top: 20px !important; }
.toCpd a {
	color: #fff;
	border: 1px solid #fff;
	font-weight: normal;
	font-size: 16px;
	line-height: 30px;
	text-align: center;
	display: block;
	transition: all .3s ease;
	font-weight: 600;
}
.toCpd a:hover {
	background: #fff;
	color: #2792be;
}

#n_backBtnBD {
	margin-bottom: 30px;
	padding-top: 0;
}
#n_backBtnBD a {
	color: #fff;
	border: 1px solid #fff;
	font-weight: normal;
	font-size: 20px;
	line-height: 60px;
	text-align: center;
	display: block;
	transition: all .3s ease;
	width: 100%;

}
#n_backBtnBD a:hover {
	background: #fff;
	color: #000;
}


#n_backBtnBD2 {
	margin-bottom: 50px;
	padding-top: 10px;
}
#n_backBtnBD2 a {
	color: #fff;
	border: 1px solid #fff;
	font-weight: normal;
	font-size: 16px;
	line-height: 40px;
	text-align: center;
	display: block;
	transition: all .3s ease;
	width: 100%;

}
#n_backBtnBD2 a:hover {
	background: #fff;
	color: #000;
}


#n_backBtnBDB {
	margin-bottom: 50px;
	padding-top: 10px;
}
#n_backBtnBDB a {
	color: #fff;
	border: 1px solid #fff;
	font-weight: normal;
	font-size: 14px;
	line-height: 30px;
	text-align: center;
	display: block;
	transition: all .3s ease;
	width: 100%;

}
#n_backBtnBDB a:hover {
	background: #fff;
	color: #000;
}