@charset "utf-8";

/*.async-hide { opacity: 0 !important}*/

/*----------------------------------------
	for PC
----------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Work+Sans');

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

	body{background-color:#222;}
	#wrapper{background-color:#000;min-width:1024px;}


	/* common */

	#wrapper{overflow:hidden;}
	.inner_centering{width:1024px;margin:0 auto;z-index:10;position:relative;}



	/* header */

	header{background: transparent url(../img/common/menu_bg.jpg);height:94px; box-shadow:0px 4px 2px rgba(0,0,0,0.4);position:relative;z-index:90;transition: all 0.5s ;}

	header .logo{background:transparent url(../img/common/menu_logo.png);background-size:100%;width:200px;height:86px;margin-top:5px;display:block;float:left;}
	header ul {display:block;float:left;height:94px;}
	header ul li{display:block;line-height:1;height:100%;float:left;position:relative;}
	header ul li a{color:#fff;display:block;padding:36px 18px;position:relative;z-index:1;}

	header ul li.top{display:none;}
	header ul .text{height:0;}

	header ul li.story_character a{padding:14px 10px;}
	header ul li.story_character a:after{content:url(../img/common/menu_story_character.png);display:block;}
	header ul li.story_character .text{text-indent:-9999px;display:block;}

	header ul li.action a{padding:25px 10px;}
	header ul li.action a:after{content:url(../img/common/menu_action.png);display:block;}
	header ul li.action .text{text-indent:-9999px;display:block;}

	header ul li.news{margin-left:10px;}

	header ul li.reserve{background-color:#f18800;position:absolute;right:0;top:0;}


	header ul li.story_character:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:3px;left:12px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	header ul li.action:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:3px;left:4px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	header ul li.system:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:3px;left:-24px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	header ul li.news:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:3px;left:-35px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	header ul li.movie:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:3px;left:-28px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	header ul li.product:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:3px;left:-25px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}


	 /*ページ表示 */

	body.story_character header ul li.story_character:after{opacity:1;}
	body.action header ul li.action:after{opacity:1;}
	body.system header ul li.system:after{opacity:1;}
	body.news header ul li.news:after{opacity:1;}
	body.movie header ul li.movie:after{opacity:1;}
	body.product header ul li.product:after{opacity:1;}

	header ul li.story_character:hover:after{opacity:1;}
	header ul li.action:hover:after{opacity:1;}
	header ul li.system:hover:after{opacity:1;}
	header ul li.news:hover:after{opacity:1;}
	header ul li.movie:hover:after{opacity:1;}
	header ul li.product:hover:after{opacity:1;}



	/* header_fix */

	.fixed header{background-image:none;background-color:rgba(6, 22, 72, 0.8); box-shadow:0px 4px 4px rgba(0,0,0,0.3); height:auto;position:fixed;z-index:90;width:100%;top:0;}
	.fixed header .logo{background:transparent url(../img/common/menu_logo.png);margin:0px 20px 0 0;width:120px;height:45px;display:block;float:left;background-size:100%;}
	.fixed header ul {display:block;float:left;height:auto;}
	.fixed header ul li{display:inline-block;vertical-align: middle;line-height:0;margin:0px 15px 0px;}
	.fixed header ul li a{color:#fff;display:inline-block;font-size:14px;padding:25px 0;}

	.fixed header ul li.top{display:inline-block;}

	.fixed header ul li.story_character a:after{display:none;}
	.fixed header ul li.story_character .text{text-indent:0px;display:block;}

	.fixed header ul li.action a:after{display:none;}
	.fixed header ul li.action .text{text-indent:0px;display:block;}

	.fixed header ul li.news{margin-left:25px;}
	.fixed header ul li.reserve{padding:0 0px;}
	.fixed header ul li.reserve a{padding:25px 30px;}


	.fixed #wrapper{margin-top:94px;}


	.fixed header ul li.top:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:-58px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	.fixed header ul li.story_character:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:2px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	.fixed header ul li.action:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:-45px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	.fixed header ul li.system:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:-45px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	.fixed header ul li.news:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:-58px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	.fixed header ul li.movie:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:-58px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}

	.fixed header ul li.product:after{content:'';background-image:url(../img/common/menu_marker.png);display:block;width:156px;height:74px;bottom:0;left:-52px;position:absolute;z-index:0;opacity:0;transition:all 0.5s;}


	/* fix時のページ表示 */

	.fixed.top header ul li.top:after{opacity:1;}
	.fixed.story_character header ul li.story_character:after{opacity:1;}
	.fixed.action header ul li.action:after{opacity:1;}
	.fixed.system header ul li.system:after{opacity:1;}
	.fixed.news header ul li.news:after{opacity:1;}
	.fixed.movie header ul li.movie:after{opacity:1;}
	.fixed.product header ul li.product:after{opacity:1;}


	.fixed header ul li.top:hover:after{opacity:1;}
	.fixed header ul li.story_character:hover:after{opacity:1;}
	.fixed header ul li.action:hover:after{opacity:1;}
	.fixed header ul li.system:hover:after{opacity:1;}
	.fixed header ul li.news:hover:after{opacity:1;}
	.fixed header ul li.movie:hover:after{opacity:1;}
	.fixed header ul li.product:hover:after{opacity:1;}



	/* header_state */
	/* li.movie{opacity:0.5;} */
	/* li.product{opacity:0.5;} */


	/*---- footer ----*/
	#footer { background-color:#333;color:#ddd;position:relative;z-index:20;}
	#footer .img_attention{font-size:12px;margin-bottom:30px;color:#fff;}
	#footer .cero{height:60px;margin-bottom:-10px;}

	#footer .inner_centering {padding:20px 0 60px;text-align:center;}
	.bnr_footer img{width:300px;margin:0 10px 0;}
	.footer_link { line-height: 160%; letter-spacing: 2px; color: #fff;margin-top:1em;border-bottom:1px solid #aaa;padding-bottom:2px;}

	#footer .btn_reserve{background-color:#f18800;color:#fff;padding:10px 40px;display:inline-block;margin:30px 10px 20px;border-radius:30px;}

	.footer_logoheight{ height: 40px; margin: 0 1.5%;}
	.footer_logoheight.steam{ height: 40px; margin-bottom:-6px;}
	.footer_logoheight.shibusawa{ height: 48px; margin-bottom:-6px;}
	.rights_txt { margin:20px 0;font-size:10px;line-height: 1.6; letter-spacing: 0.5px; text-align: center;color:#fff;}
	.rights_mark { height: 8px;}

	.btn_twitter{background-color:#28a4e0;display:inline-block;color:#fff;padding:5px 40px 5px 5px;border-radius:80px;font-size:18px;margin:0 2px;}
	.btn_twitter .icon{border-radius:50%;width:42px;display:inline-block;vertical-align:middle;margin-right:0.6em;}
	.btn_twitter p{display:inline-block;line-height:1.2;vertical-align:middle;}


	 #footer #language{margin:0px 0 0px;padding:20px 0;color:#fff;text-align:center;font-size:14px;}
	 #footer #language a{color:#333;padding:3px 20px;border-radius:20px;margin:0 2px;border:2px solid #fff;color:#fff;box-sizing:border-box;}

	 li.new:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 13px;box-shadow:0px 0px 5px rgba(221, 0, 0, 0.8),0px 0px 5px rgba(0,0,0,0.8);background-size:100%;border-radius:20px;font-size:14px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;position:absolute;bottom:-10px;left:50%;margin-left:-30px;z-index:50;line-height:1.2;}

	 .fixed li.new:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:0px 10px;box-shadow:0px 0px 5px rgba(221, 0, 0, 0.8),0px 0px 5px rgba(0,0,0,0.8);background-size:100%;border-radius:20px;font-size:12px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;position:absolute;bottom:-7px;left:50%;margin-left:-26px;z-index:50;line-height:1.2;}




	/*common_PC*/

	.btn_mouseover{transition:all 0.2s;}
	.btn_mouseover:hover{transform:scale(0.95,0.95);}

	.btn_eff01:before {content: "";position: absolute;height: 150px;width: 80px;background: #fff;left: -100px;top: -40px;transform: rotate(37deg);transition: all .3s;opacity: 0.4;}
	.btn_eff01:hover:before {left:110%;}
	.btn_eff01:hover {transform:scale(1.02)}

	.btn_eff02{position:relative;overflow:hidden;}
	.btn_eff02:before {content: "";position: absolute;height: 100%;width: 110%;background: #fff;left: -115%;top: 0px;transition: all .3s;opacity: 0.3;transform:skew(10deg, 0deg);}
	.btn_eff02:hover:before {left:-5%;}
	.btn_eff02 .text {position:relative;z-index:1;}

	/* .btn_eff02:hover .txt{color:#000;} */

	.btn_eff03{position:relative;overflow:hidden;}
	.btn_eff03:before {content: "";position: absolute;height: 100%;width: 110%;background: #e65300;left: -115%;top: 0px;transition: all .3s;opacity: 0.4;transform:skew(10deg, 0deg);}
	.btn_eff03:hover:before {left:-5%;}
	.btn_eff03 .text {position:relative;z-index:1;}

	.btn_eff04{position:relative;overflow:hidden;}
	.btn_eff04:before {content: "";position: absolute;height: 100%;width: 110%;background: #ffed00;left: -115%;top: 0px;transition: all .3s;opacity: 0.2;transform:skew(10deg, 0deg);}
	.btn_eff04:hover:before {left:-5%;}
	.btn_eff04 .text {position:relative;z-index:1;}

	.hide_pc{display:none!important;}


	#manual{text-align:center;padding:80px 0;}
	#manual a{color:#000;background-color:#fff;font-size:19px;border-radius:50px;transition:all 0.5s;padding:4px;display:block;width:300px;margin:0 auto;background: linear-gradient(#fff, #fffed3);}

	#manual .line{border:2px solid #777;font-size:21px;border-radius:50px;padding:10px 50px;}
	#manual a:hover{color:#000;background-color:#fff;}

	#manual a .line:after{content:'';display:inline-block;background-image:url('../img/common/icon_out_b.svg');background-repeat:no-repeat;width:18px;height:17px;background-size:100%;margin-left:0.5em;margin-bottom:-0.1em;}


}

/*----------------------------------------
	for SP
----------------------------------------*/

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


	#wrapper{overflow:hidden;}
	.inner_centering{width:92%;margin:0 auto;z-index:10;position:relative;}

	#colorbox{width:100%;overflow:hidden!important;}

	#header_sp{height:37px;background-color:#0c2b46;background-image:url(../img/common/header_bg_sp.jpg);background-size:cover;}
	#header_sp .kt_logo{background-image:url(https://www.gamecity.ne.jp/img/svg/kt_b.svg);width:40px;height:25.53px;background-size:100%;position:absolute;top:6px;left:7px;}



	/* header */

	header{height:100vh; background-color:rgba(3, 18, 31, 0.9);position:fixed;z-index:90;transition: all 0.5s ;top:0;overflow:hidden;width:100%;}
	header.close{height:0px;}

	header .logo{background:transparent url(../img/common/menu_logo.png);width:36%;padding-top:15.25%;display:block;margin:15px auto 20px;background-size:100%;}
	header ul {display:block;height:94px;}
	header ul li{display:inline-block;vertical-align: middle;line-height:1;margin:0px 0px 0px;width:100%;text-align:center;position:relative;}
	header ul li .text{height:0px;}

	header ul li::before {content: '';position: absolute;top: 0;left: 0;right: 0;width: 100%;height: 1px;margin: 0 auto;text-align: center;background-image: -webkit-linear-gradient(left, transparent, #405888 25%, #405888 75%, transparent);background-image: linear-gradient(to right, transparent, #405888 25%, #405888 75%, transparent);
	}

	header ul li:last-child::after{content: '';position: absolute;bottom: 0;left: 0;right: 0;width: 100%;height: 1px;margin: 0 auto;text-align: center;background-image: -webkit-linear-gradient(left, transparent, #405888 25%, #405888 75%, transparent);background-image: linear-gradient(to right, transparent, #405888 25%, #405888 75%, transparent);
	}

	header ul li a{color:#fff;display:block;padding:20px 0;}

	header ul li.top{display:none;}

	header ul li.story_character a:after{content:'';background-image:url(../img/common/menu_story_character_sp.png);background-size:100%;display:block;width:175px;height:64px;margin:0 auto;}
	header ul li.story_character .text{text-indent:-9999px;display:block;}

	header ul li.action a:after{content:'';background-image:url(../img/common/menu_action_sp.png);background-size:100%;display:block;width:147px;height:40px;margin:0 auto;}
	header ul li.action .text{text-indent:-9999px;display:block;}


 header li.new a:before{content:'NEW';color:#373320;background-image:url(../img/common/new_bg.jpg);padding:2px 10px;box-shadow:0px 0px 5px rgba(221, 0, 0, 0.8),0px 0px 5px rgba(0,0,0,0.8);background-size:100%;border-radius:20px;font-size:11px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;position:absolute;top:50%;margin-top:-9px;left:15px;z-index:50;line-height:1.2;}

	header ul li.reserve{background-color:#f18800;border-radius:50px;margin:20px auto 0;width:100%;}
		header ul li.reserve a{padding:17px 0;}

	/* header_state */
	/* li.movie{opacity:0.5;} */






	/* #menu_btn:before{content:'1';color:#373320;background-image:url(../img/common/new_bg.jpg);box-shadow:0px 0px 5px rgb(0, 0, 0);background-size:100%;border-radius:20px;font-size:16px;font-weight:800;font-family: 'Work Sans', cursive;display:inline-block;position:absolute;top:-4px;right:-4px;z-index:50;width:20px;height:20px;text-align:center;line-height:1.3;} */

	#menu_btn.close{width:60px;height:60px;background:transparent url(../img/common/menu_icon.jpg);position:fixed;right:10px;top:10px;background-size:100%;z-index:100;box-shadow:1px 1px 3px rgba(0,0,0,0.5);}

	#menu_btn{width:60px;height:60px;background:transparent url(../img/common/menu_icon_close.jpg);position:fixed;right:10px;top:10px;background-size:100%;z-index:100;box-shadow:1px 1px 3px rgba(0,0,0,0.5);}




	/*---- footer ----*/
	#footer { background-color:#333;overflow:hidden;}
	#footer .img_attention{font-size:9px;margin-bottom:30px;color:#fff;}

	#footer .inner_centering {padding:20px 0 20px;text-align:center;}
	.bnr_footer img{width:300px;margin:0 10px 0;}
	.footer_link { line-height: 160%; letter-spacing: 2px; color: #fff;margin-top:1em;}

	.footer_logoheight{ height: 20px; margin: 0 1.5%;}
	.footer_logoheight.steam{ height: 40px; margin-bottom:-6px;}
	.footer_logoheight.shibusawa{ height: 30px; margin-bottom:-6px;}
	.rights_txt { margin:20px 0;font-size:8px;line-height: 1.6; letter-spacing: 0.5px; text-align: left;color:#fff;}
	.rights_txt br{display:none;}
	.rights_mark { height: 8px;}

	#footer .cero{height:40px;margin-bottom:-5px;}




	 #footer #language{margin:0px 0 0px;padding:16px 0 30px;color:#fff;text-align:center;background-color:#333;font-size:12px;}
	 #language .tit{text-align:center;display:block;padding-bottom:10px;font-size:15px;}
	 #footer #language a{color:#333;padding:3px 10px;border-radius:20px;margin:0 1px;border:1px solid #fff;color:#fff;box-sizing:border-box;}


	 	#footer .btn_reserve{background-color:#f18800;color:#fff;padding:10px 30px;display:inline-block;margin:0px 2px 0px;border-radius:30px;font-size:12px;}


	.btn_twitter{background-color:#28a4e0;display:inline-block;color:#fff;padding:5px 20px 5px 5px;border-radius:80px;margin:0 2px;}
	.btn_twitter .icon{border-radius:50%;width:31px;display:inline-block;vertical-align:middle;margin-right:0.6em;}
	.btn_twitter p{display:inline-block;line-height:1.2;vertical-align:middle;font-size:12px;}

	#manual{text-align:center;padding:40px 0;background-color:#000;}
	#manual a{color:#fff;background-color:#000;font-size:19px;border-radius:50px;transition:all 0.5s;padding:4px;display:inline-block;margin:0 auto;border:2px solid #aaa;}

	#manual .line{font-size:14px;border-radius:50px;padding:3px 30px;}
	#manual a:hover{color:#000;background-color:#fff;}

	#manual a .line:after{content:'';display:inline-block;background-image:url('../img/common/icon_out.svg');background-repeat:no-repeat;width:18px;height:17px;background-size:100%;margin-left:0.5em;margin-bottom:-0.1em;}



	/*  */

	.hide_sp{display:none!important;}



}

	.clearfix:after{content:'';display:block;clear:both;}


	/* forVita */

.vita #press{display:none;}
.vita header{display:none;}
.vita #wrapper{padding-top:0px;}
.vita .bnr_about{display:none!important;}

#cboxOverlay {background: #000!important;opacity: 0.7!important;}