@charset "utf-8";


/* Don't Edit */
/* body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}
table {font-size:inherit;font:100%;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;} */


article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display: block;
}

* {
	margin: 0;
	padding: 0;
	word-break: normal;
	-webkit-font-smoothing:subpixel-antialiased;
}

html {
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	background-color: #000;
	color: #fff;
	font-weight:normal;
	font-size:17px;
	line-height:1.8;
	-webkit-text-size-adjust: 100%;
		font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif;
}

/*--------------------
	Text
--------------------*/

p {
}

figure,figcaption {
	font-weight: bold;
}

h1 {
	/* margin: 1em 0 2em 0;
	font-size: 123.1%; */
}


h1 img {
}

h2 {
}

h3 {
}

h4 {
}

address {
}



/*--------------------
	List
--------------------*/

li {
	list-style-type: none;
}
a.bnr:hover {

}

dt,
dd {
	font-weight: bold;
}

/* Opera Hack */
html:first-child li,
html:first-child dt,
html:first-child dd {
	font-size: 1em;
}

li li,
li p,
li pre,
li dt,
li dd,
dd li,
dd p,
dd pre,
dd dt,
dd dd {
	font-size: 100% !important;
}

li ul,
li ol,
li dl,
li p,
dd ul,
dd ol,
dd dl,
dd p {

}

a.mo:hover{
opacity:0.7;;
}

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

/*--------------------
	link
--------------------*/

a {
	color: #d00;
	text-decoration:none;
	outline:none!important;
}

/*--------------------
	Others
--------------------*/

img {
	border: none;
}

hr {
	height: 1px;
	border: 1px solid #fff;
}


/*----------------------------------------
	for PC
----------------------------------------*/

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

#wrapper{overflow:hidden;position:relative;min-width:1200px;}

#loadingBg {position: fixed;left: 0;top: 0;width: auto;min-width: 100%;height: 100vh;min-height: 100%;background: #000;z-index:100;pointer-events: none;}
#loading {position: fixed;top: 50%;left: 0%;width: 100%;padding: 50px 0px;margin: -70px 0 0 0px;z-index:101}
#loading #percent {margin-bottom: 5px;text-align: center;font-size: 16px;z-index:101;color:#fff;}
#loading #gauge {width: 0px;height: 3px;background: #43565d;z-index:101;}
#loading .loading-icon{position:absolute;top:50%;left:50%;margin-left:-150px;margin-top:-380px;width:300px;display:none;}

#menu-btn{display:none;}  /* for sp */

.background-movie__wrap{position:absolute;min-width:1200px;}



/*  */


.menu-bar{position:fixed;width:100%;z-index:1;top:0;z-index:90;transition:all 0.4s;padding:50px 40px;box-sizing:border-box;min-width:1160px;}
.menu-bar.stylechange{background:rgba(0,0,0,0.7);}
.menu__btn{margin:0 16px;display:inline-block;vertical-align: middle;position:relative;}
.menu__btn a{color:#fff;font-size:19px;font-weight:500;transition:all 0.4s; text-shadow: 0 0 5px #000,0 0 8px #000;}

/* メニュー */

.menu-bar__inner{padding:0 20px;margin:0 auto;transition: all 1s;width:auto;}
.menu-bar h1{display:inline-block;vertical-align: middle;}
.menu-logo img{display:block;margin:-40px 0 -20px -20px;transition:all 0.4s;height:auto;width:8vw;transform:scale(1);}
.menu-bar h1{display:inline-block;vertical-align: middle;}

.menu-bar.stylechange{background:rgba(0,0,0,0.7);padding:0 0;}
.menu-bar.stylechange .menu__btn a{font-size:16px;}
.menu-bar.stylechange	.menu-logo img{display:block;margin:0vw 20px 0 20px;width:5vw;transition:all 0.4s;transform:scale(1);}

.menu__wrap-btn{display:inline-block;vertical-align:middle;}

/* .menu__btn.icon-new:before{bottom:-20%;left:40%;top:auto;right:auto;}
.menu__btn.icon-new:after{bottom:-20%;left:40%;top:auto;right:auto;} */

.menu__btn.icon-new:before{top:-3px;right:-8px;width:6px;height:6px;}
.menu__btn.icon-new:after{top:-3px;right:-8px;width:6px;height:6px;}


/* メニュー下ライン */

.menu__btn a::after {position: absolute;bottom: -4px;left: 0;content: '';width: 100%;height: 2px;background: #fff;transform: scale(0, 1);transform-origin: left top;transition: transform .3s;}
.menu__btn a:hover::after {transform: scale(1, 1);}

.news .menu__btn.news a::after {transform: scale(1, 1);}
.story .menu__btn.story a::after {transform: scale(1, 1);}
.battle .menu__btn.battle a::after {transform: scale(1, 1);}
.system .menu__btn.system a::after {transform: scale(1, 1);}
.movie .menu__btn.movie a::after {transform: scale(1, 1);}
.product .menu__btn.product a::after {transform: scale(1, 1);}
.dlc .menu__btn.dlc a::after {transform: scale(1, 1);}

body.top .menu__btn.top{display:none;}
body.top .menu-logo img{transform:scale(0);width:0;}




.menu-reserve{right:30px;top:50%;position:absolute;margin:0;color:#000;transition:all 0.2s;background:url(../img/product/btn-bg.jpg);transform: translate(0,-50%);padding:8px 40px;box-shadow:0 0 8px rgba(0,0,0,0.5);}
/* .menu-reserve:hover{background:#c83000 center center;} */

.stylechange .menu-reserve{right:30px;top:50%;padding:5px 40px;}

/*  */

.btn.default-style{padding:10px 80px;border:2px solid #fff;display:inline-block;color:#fff;margin-top:30px;letter-spacing: 0.5em;transition:all 0.4s;display:inline-block;position:relative;}
.btn.default-style:after{content:'';display:inline-block;width:16px;background:url(../img/common/direct-w.svg);height:16px;background-size:100%;position:absolute;right:10px;top:50%;transform: translate(0,-50%);}

.btn.default-style:hover{background-color:#fff;color:#000;}
.btn.default-style:hover:after{content:'';display:inline-block;width:16px;background:url(../img/common/direct-b.svg);height:16px;background-size:100%;position:absolute;right:10px;top:50%;transform: translate(0,-50%);}


.btn.default-style.size-min{font-size:12px;}
.btn.default-style.size-min:after{width:12px;height:12px;}

.centering{text-align:center;}

/*---- footer ----*/

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

footer .footer__inner {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;}

.btn-twitter-footer{width:340px;margin:0 auto 20px;}

.background__wrap{position:fixed;top:0;left:0;width:100%;z-index: 0;min-width:1200px;}
.background-movie .movie{width:100%;height:100%;display:block;}


/* lower_common */

#contents{z-index: 1;position: relative;}

.background-text{position:absolute;right:40px;top:30px;}

.headline-catch{color:#fff;font-size:50px;margin-bottom:40px;text-align:center;line-height:1.3;}

.headline{color:#fff;font-size:50px;margin-bottom:70px;text-align:center;}
.headline:after{content:'';margin:0 auto;display:block;background-image:url(../img/top/common-titbar.png);height:4px;background-position:center;background-repeat: no-repeat;}

.section__wrap{position:relative;z-index:1;}

.infobox .title{display:block;font-size:50px;color:#fff;text-align:left;margin-bottom:0;}
.infobox .title .ruby{font-size:12px;vertical-align: middle;margin-left:20px;}
.infobox .text{display:block;color:#fff;line-height:2;}

.animation-trigger{position:absolute;top:0;left:0;}

.acd-check{display: none;}
.acd-label{background: #333;color: #fff;display: block;margin-top: 2em;padding: 10px;text-align: center;}
.acd-content{border: 1px solid #333;height: 0;opacity: 0;padding:40px 30px;transition: .5s;visibility: hidden;border-top:0;}
.acd-check:checked + .acd-label + .acd-content{height: auto;opacity: 1;padding:40px 30px;visibility: visible;}

.hide_pc{display:none!important;}
.header-sp{display:none;}

#cboxContent{margin-top:0!important;}

#cboxClose{text-align:-9999px!important;width:100px!important;height:100px!important;background-color:#24340e!important;right:0!important;top:0!important;background:url(../img/common/icon-close.jpg) no-repeat!important;background-size:60%!important;background-position:center center!important;position:fixed!important;outline:none!important;}

.icon-new:before{content:'';display:block;border-radius:100px;width:12px;height:12px;background:rgba(255, 221, 0, 0.81);position:absolute;top:0;right:0;z-index:11;}
.icon-new:after{content:'';display:block;border-radius:100px;width:12px;height:12px;background:rgba(255, 221, 0, 0.61);position:absolute;top:0;right:0;animation: anime01 1.5s ease;animation-iteration-count: infinite;z-index:10;}

@keyframes anime01 {
	0% {transform:scale(1);}
	100% {transform:scale(4);opacity:0.2;}
}


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

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

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

.footer__wrap .btn_manual{border:3px solid #fff;color:#fff;padding:20px 40px;display: block;width:320px;margin:40px auto 80px;position:relative;transition: all 0.5s;letter-spacing: 0.4em;font-size: 18px;}
.footer__wrap .btn_manual:after{content:'';display:inline-block;width:16px;background:url(../img/common/direct-w.svg);height:16px;background-size:100%;position:absolute;right:10px;top:50%;transform: translate(0,-50%);}


.footer__wrap .btn_manual:hover{background-color:#fff;color:#000;}
.footer__wrap .btn_manual:hover:after{background:url(../img/common/direct-b.svg);}


}

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

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




	body{font-size:15px;color:#eee;}

	#loadingBg {position: fixed;left: 0;top: 0;width: auto;min-width: 100%;height: auto;min-height: 100%;background: #000000;z-index:100;pointer-events: none;}
	#loading {position: fixed;top: 50%;left: 0%;width: 100%;padding: 50px 0px;margin: -70px 0 0 0px;z-index:101}
	#loading #percent {margin-bottom: 5px;text-align: center;font-size: 16px;z-index:101;color:#fff;}
	#loading #gauge {width: 0px;height: 5px;background: #43565d;z-index:101;}
	#loading .loading-icon{position:absolute;top:50%;left:50%;margin-left:-30px;margin-top:-120px;width:60px;}

	.header-sp{position:fixed;top:0;left:0;width:100%;z-index:100;}
	.header-sp .head-logo-sp{width:20%;display:block;position:absolute;left:2%;top:10px;}


	#wrapper{overflow:hidden;width:100%;}

	.close #menu-btn{display:block;right:10px;bottom:40px;width:64px;height:64px;background:url(../img/common/menu-open.jpg);position:fixed;z-index:90;transition:all 0.5s;background-size:100%;transition:all 0.2;}

	.open #menu-btn{display:block;right:10px;bottom:40px;width:50px;height:50px;background:url(../img/common/menu-close.jpg);position:fixed;z-index:10;transition:all 0.5s;background-size:100%;z-index: 101;}

	#menu-btn.new:after{content:'';display:block;width:31px;height:30px;background:url(../img/common/icon-menuupdate.png);position:absolute;top:0;right:0;background-size:100%;}
	.open #menu-btn.new:after{opacity:0;}



	.menu-bar{position:fixed;width:200px;background:#000;height:100vh;z-index:1;box-shadow:3px 0 8px rgba(0,0,0,0.6);left:-200px;opacity:0;z-index:2;transition:all 0.5s;top:0;}
	.content-area{position:relative;overflow:hidden;z-index:0;width:100%;}

	.menu-reserve{width:100%;display:block;line-height:1.2;text-align:center;background:url(../img/product/btn-bg.jpg);color:#000;padding:2.8vw 0;}

/* .menu-reserve{right:30px;top:50%;position:absolute;margin:0;color:#000;transition:all 0.2s;transform: translate(0,-50%);padding:8px 40px;} */

	.close #menu-bgwrap{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000;opacity:0;z-index:100;transition:all 0.5s;pointer-events: none;}
	.open #menu-bgwrap{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000;opacity:0.7;z-index:1;
	pointer-events: all;z-index:100;}

	.open .menu-bar{position:fixed;width:200px;background:#000;height:100vh;z-index:1;box-shadow:3px 0 8px rgba(0,0,0,0.6);left:0px;opacity:1;z-index:101;border-right: 1px solid #333;}
	.menu-bar__inner{position:absolute;top:0;width:100%;padding:0 0 20px;}
	/* .open .content-area{position:relative;overflow:hidden;z-index:0;min-width:920px;} */



	.menu__btn{margin:0 auto;text-align:center;position:relative;border-bottom:1px solid #222;border-top:1px solid #111;}
	.menu__btn a{color:#fff;width:100%;display:block;padding:2.8vw 0;}

	.menu__btn.new:after{content:'UPDATE';display:block;position:absolute;margin-right:-30px;right:0;bottom:15px;background:#fffa53;color:#333;padding:3px 5px;width:60px;line-height:1;text-align:center;border-radius:20px;font-size:9px;transition:all 0.5s;font-style: italic;}

	.menu-logo img{display:block;margin:24px auto 20px;width:75%;}

	.menu__btn.icon-new:before{top:45%;right:15px;width:6px;height:6px;}
	.menu__btn.icon-new:after{top:45%;right:15px;width:6px;height:6px;}


	/* lower_common */

	#contents{z-index: 1;position: relative;}

	.background-text{position:absolute;right:5%;top:5%;width:34%;z-index:0;}

	.headline-catch{color:#fff;font-size:36px;margin-bottom:30px;text-align:center;line-height:1.3;}

	.headline{color:#fff;font-size:30px;margin-bottom:40px;text-align:center;}
	.headline:after{content:'';margin:0 auto;display:block;background-image:url(../img/top/common-titbar.png);height:4px;background-position:center;background-repeat: no-repeat;width:50%;}

	.section__wrap{position:relative;z-index:1;}

	.infobox .title{display:block;font-size:50px;color:#fff;text-align:left;margin-bottom:0;}
	.infobox .title .ruby{font-size:12px;vertical-align: middle;margin-left:20px;}
	.infobox .text{display:block;color:#fff;line-height:2;}

	.animation-trigger{position:absolute;top:0;left:0;}









	/*---- footer ----*/
	.footer__wrap { background-color:#000;overflow:hidden;position:relative;z-index:10;}
	.footer__inner { padding:5% 5%;text-align:center;}
	.footer__wrap .img_attention{font-size:9px;margin-bottom:30px;color:#aaa;text-align:center;}

	/* .footer__wrap{position:relative;z-index:10;} */

	#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 auto;font-size:8px;line-height: 1.6; letter-spacing: 0.5px; text-align: left;color:#fff;width:90%;}
	.rights_txt br{display:none;}
	.rights_mark { height: 8px;}

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

	.btn-twitter-footer{width:80%;margin:0 auto 5vw;}


	 #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;}


	.background__wrap{position:fixed;top:0;left:0;width:100%;z-index: 0;}
	.background-movie .movie{width:100%;height:100%;display:block;}

	/*  */

	.btn.default-style{padding:8px 8px;border:1px solid #fff;display:inline-block;color:#fff;margin:30px auto 0;letter-spacing: 0.5em;transition:all 0.4s;display:block;position:relative;width:80%;box-sizing: border-box;text-align:center;}
	.btn.default-style:after{content:'';display:inline-block;width:16px;background:url(../img/common/direct-w.svg);height:16px;background-size:100%;position:absolute;right:10px;top:50%;transform: translate(0,-50%);}


	.btn.default-style.size-min{font-size:10px;}
	.btn.default-style.size-min:after{width:12px;height:12px;}

	.acd-check{display: none;}
	.acd-label{background: #333;color: #fff;display: block;margin-top: 2em;padding: 10px;text-align: center;}
	.acd-content{border: 1px solid #333;height: 0;opacity: 0;padding:40px 30px;transition: .5s;visibility: hidden;border-top:0;}
	.acd-check:checked + .acd-label + .acd-content{height: auto;opacity: 1;padding:40px 30px;visibility: visible;}


	#cboxContent{margin-top:0!important;}

	#cboxClose{text-align:-9999px!important;width:60px!important;height:60px!important;background-color:#24340e!important;left:50%!important;bottom:20px!important;top:auto!important;background:url(../img/common/icon-close.jpg) no-repeat!important;background-size:60%!important;background-position:center center!important;position:fixed!important;outline:none!important;transform:translate(-50%,0);z-index:100;}

	.icon-new:before{content:'';display:block;border-radius:100px;width:10px;height:10px;background:rgba(255, 221, 0, 0.81);position:absolute;top:0;right:0;z-index:11;}
	.icon-new:after{content:'';display:block;border-radius:100px;width:10px;height:10px;background:rgba(255, 221, 0, 0.61);position:absolute;top:0;right:0;animation: anime01 1.5s ease;animation-iteration-count: infinite;z-index:10;}

	@keyframes anime01 {
		0% {transform:scale(1);}
		100% {transform:scale(4);opacity:0.2;}
	}


	.icon-out:after{content:'';display:inline-block;background-image:url('../img/common/icon_out_y.svg');background-repeat:no-repeat;width:17px;height:15px;background-size:100%;margin-left:0.5em;margin-bottom:-0.1em;}

	.icon-out-w:after{content:'';display:inline-block;background-image:url('../img/common/icon_out_w.svg');background-repeat:no-repeat;width:17px;height:15px;background-size:100%;margin-left:0.5em;margin-bottom:-0.1em;}

	.icon-out-y:after{content:'';display:inline-block;background-image:url('../img/common/icon_out_ye.svg');background-repeat:no-repeat;width:17px;height:15px;background-size:100%;margin-left:0.5em;margin-bottom:-0.1em;}

	.footer__wrap .btn_manual{border:3px solid #fff;color:#fff;padding:17px 40px;display: block;width:300px;margin:40px auto 80px;position:relative;transition: all 0.5s;box-sizing:border-box;letter-spacing: 0.5em;font-size: 18px;}
	.footer__wrap .btn_manual:after{content:'';display:inline-block;width:16px;background:url(../img/common/direct-w.svg);height:16px;background-size:100%;position:absolute;right:10px;top:50%;transform: translate(0,-50%);}



	.hide_sp{display:none!important;}




}



/* op */


.clearfix:after{content:'';display:block;clear:both;}
#cboxOverlay {background: #000!important;opacity: 0.7!important;}



.sans-serif{font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
}

@media screen and (-webkit-min-device-pixel-ratio:0){
*{
-webkit-font-smoothing:antialiased;
}
}

_::content, _:future, *:not(*:root) {
font-weight:normal;
-webkit-font-smoothing:subpixel-antialiased;
}

span.nobr {
white-space: nowrap;
}


a,img,div,li{outline: none;}
a:focus,img:focus,div:focus,li:focus{outline: none;}

will-change: transform;



}
