@charset "utf-8";
/******************************************************

@common.css
Copyright (c) ULM Co.,Ltd. - http://www.ulm-design.com

******************************************************/
@font-face {
  font-family: "YuGothic M";
  src: local("Yu Gothic Medium");
}

html, body{
	font-family:  "游ゴシック体", YuGothic, "YuGothic M", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 13px;
	letter-spacing: 1px;
	
    word-break: break-all;
    word-wrap: break-word;
	
	/*文字のアンチエイリアス設定*/
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/*********************************

.wrapper

*********************************/
.wrapper{
	width: 100%;
	min-width: 1024px;
	position: relative;
}


/*********************************

.contents

*********************************/
.contents {
	width:100%;
	min-height:700px;
	padding: 100px 0 100px 0;
}

.contents.hide{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;

	transform: scale(1.2);
	-webkit-transform:scale(1.2);
	opacity: 0;

}

.contentsInner{
	width: 1280px;
	margin: 0 auto;
}

.contentsPreloader{
	position: fixed;
	z-index: 1000;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	width: 0%;
	height: 100%;
	display: none;
	background-color: #fff;
}

#onairPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg0.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}
#staffcastPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg1.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}
#storyPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg2.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}
#characterPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg3.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}
#mechaPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg0.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}
#bookPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg1.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}
#musicPreload{
	background-image: url(../img/common/preloader_bg_pt.png), url(../img/common/bg2.png);
	background-attachment: fixed, fixed;
	background-repeat:repeat, no-repeat;
	background-position: center center, center center;
	background-size: 64px 64px, auto 80%;
}

.contentsTtl{
	padding: 40px 0 0 30px;
}

/*********************************

.header

*********************************/
.header{
	width:100%;
	height:100px;
	background:#fff url(../img/common/header/bg2.png) repeat-x;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	position: fixed;
	z-index: 1000;
	top: 0px;
	left: 0px;
	right: 0px;
}

.headerTtl{
	width: 300px;
	height: 100px;
	background: url(../img/common/header/bg_left.png);
}

.headerTtl a{
	padding: 12px 0 0 5px;
	display: block;
}

.headerTtl a img{
	width: 258px;
}


.headerHousou{
	pointer-events: none;
	position: relative;
	z-index: 1;
	width: 297px;
	height: 100px;
	background: url(../img/common/header/bg_right.png);
}

.headerHousou img{
	width: 175px;
	margin: 12px 0 0 55px;
}


.headerInner{
	width: 1280px;
	height: 100px;
	margin: 0 auto;
	background:#0a4d6a url(../img/common/header/bg.png) repeat-x;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
}



/*----------

.globalNavi

----------*/
.globalNavi {
    width: 744px;
    height: 100px;
    margin: 0px -43px 0 -10px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
	font-family: "FOT-筑紫A丸ゴシック Std B", "TsukuARdGothicStd-B";
}

.globalNavi li {
	height: 50px;
	line-height: 50px;
	padding: 0;
	font-weight: bold;
}

.globalNavi li:nth-child(7){
	margin: 0 0 0 0px;
}

.globalNavi li:nth-child(n + 7) a,.globalNavi li:nth-child(n + 7) span{
	padding: 0 30px;
}

.globalNavi li a {
	height: 50px;
	padding: 0 22px;
	cursor: pointer;
	display: block;
	color:#fff;
	text-shadow: 1px 1px 3px rgba(14,52,77,0.7);
	position: relative;
	z-index: 1;
}

.globalNavi li a:after {
    content: "";
    display: block;
    width: 100%;
    height: 0%;
    background: rgba(14,52,77,0.4);
    position: absolute;
    z-index: -1;
    top: 0px;
    left: 18px;
    -moz-transform-origin: 0 100%;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 -30%;
    -moz-transform: skewX(-25deg);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.globalNavi li a:before {
content: "";
    display: block;
    width: 100%;
    height: 0%;
    background: rgba(14,52,77,0.2);
    position: absolute;
    z-index: -1;
    top: 0px;
    left: 7px;
    -moz-transform-origin: 0 100%;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 -30%;
    -moz-transform: skewX(10deg);
    -webkit-transform: skewX(10deg);
    transform: skewX(10deg);
    -webkit-transition: all 0.2s ease 0.1s;
    -moz-transition: all 0.2s ease 0.1s;
    -ms-transition: all 0.2s ease 0.1s;
    -o-transition: all 0.2s ease 0.1s;
    transition: all 0.2s ease 0.1s;
}

.globalNavi li a:hover:after,.globalNavi li a:hover:before{
	height: 100%;
}

.globalNavi li span{
	color:#fff;
}

.globalNavi li span.coming{
	opacity: 0.5;
}

.globalNavi li p img {
	display: block;
}

.globalNavi  .fa-twitter{
	line-height: 50px;
    font-size: 20px;
}



/*********************************

.footer

*********************************/
.footer{
	width:100%;
	background-color: #fff;
	background-image:url("../img/common/footer/bg_img.png"),url("../img/common/footer/bg_pt.png");
	background-repeat: no-repeat,repeat;
	background-position: center top,center center;
	position: relative;
	z-index: 100;
}

.pageTop{
    width: 80px;
    height: 80px;
    position: absolute;
    z-index: 2;
    top: -84px;
    left: 50%;
    margin-left: -40px;
}

.footer:after{
    content: "";
    width: 100%;
    height: 44px;
    background: url(../img/common/footer/bg_top.png) no-repeat;
	background-position: center center;
    top: -44px;
    left: 0px;
    right: 0px;
    display: block;
    position: absolute;
}

.footerInner{
	width: 1280px;
	margin: 0 auto;
}

.footerTtl{
	width: 480px;
	margin: 0 auto;
}

.footerTtl a img{
	width: 480px;
}

.cc{
	font-size:12px;
	color:#000;
	text-align:center;
	padding:20px 0;
}

/*----------

.footerNavi

----------*/
.footerNavi {
	width: 760px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;

	justify-content: center;
	margin: 0 auto 30px auto;
	font-family: "FOT-筑紫A丸ゴシック Std D", "TsukuARdGothicStd-D";
}

.footerNavi li {
	padding:10px 20px;
	line-height: 30px;

}

.footerNavi li a {
	cursor: pointer;
	color:#574742;
	font-weight: bold;
}

.footerNavi li span{
	color:#000;
}

.footerNavi li span.coming{
	opacity: 0.3;
}

.footerNavi li p img {
	display: block;
}

.footerNavi  .fa-twitter{
	line-height: 30px;
    font-size: 20px;
}




/*----------

.banner

----------*/
.bannerContainer {
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	justify-content: center;
	margin: 0 auto 30px auto;
}

.bannerContainer li {
	padding: 0 10px 0 0;
}

.bannerContainer li:nth-last-child(1) {
	padding:0;
}

.bannerContainer li a img{
	width:180px;
	height:60px;
}


/*----------

.social

----------*/
.socialContainer {
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	justify-content: center;
}

.socialContainer li {
	display: block;
	padding: 0 10px 0 0;
	height: 20px;
}

.socialContainer li:nth-last-child(1) {padding: 0;}

.twitterBtn {}
.facebookBtn {}
.lineBtn {}


/*********************************

.preloader

*********************************/
.preloader {
	width:100%;
	height:100%;
	background:#fff;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index:1000;
}

.preloaderAnime{
	width: 32px;
	height: 32px;
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	margin: -16px 0 0 -16px;
}

.preloaderInner{
	width:500px;
	height:282px;
	position:absolute;
	z-index:1;
	top:50%;
	left:50%;
	margin-top:-141px;
	margin-left:-250px;
}

.preloaderLogo{
	width:500px;
	height:282px;
	background:url(../img/common/preloader.png) no-repeat;
	background-position:0px 0px;
}

.preloaderLogo.animation{
	animation: preloaderAnime 0.6s steps(15) forwards;
	-webkit-animation:preloaderAnime 0.6s steps(15) forwards;
}

@-webkit-keyframes preloaderAnime {
	to {background-position:-7500px 0px;}
}
@-moz-keyframes preloaderAnime {
	to {background-position:-7500px 0px;}
}

.progressBar{
	width:0px;
	height:1px;
	position:absolute;
	left:0px;
	top:50%;
	background:#25b6a3;
	z-index:1;
}



iframe[name="google_conversion_frame"] { position: absolute; top: 0; }


/*********************************

other

*********************************/
/*----------

img

----------*/
img {
	vertical-align: baseline;
	
	/*IEで画像が荒れる対策*/
	-ms-interpolation-mode: bicubic;
	
	/*ドラッグ禁止*/
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

/*----------

modules

----------*/
a {text-decoration: none;}
a:hover {}

