@charset "utf-8";

html {
	overflow-y:scroll;
  	scroll-behavior: smooth;
}

/*@font-face {
  font-family: 'MyFont';
	src: url('RoNOWStd-MM.eot');
	src: url('RoNOWStd-MM.woff');
	src: url('RoNOWStd-MM.ttf');}
*/
body{
	background-color:#000;
	/*background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/sand.jpg") repeat-y;*/
	
}

#redbg{
	background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/sand.jpg") repeat-y;
}

a:link { color: #FFF; }
a:visited { color: #FFF; }
a:hover { color: #999; }
a:active { color: #FFF; }

a {
    outline: none;
	text-decoration: none;
}


.spmenu{ display:none;}


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

.pcmenu{display:none;}
.spmenu{display:inherit;}

}

/*header設定*/
#header{
	background: linear-gradient(rgba(0, 0, 0, 0.5) 1%,rgba(0, 0, 0, 0.5) 10%, rgba(0, 0, 0, 0.5) 80%, rgba(0, 0, 0, 0.5));
    position: relative;/*h1の中央寄せ配置の起点とするためのrelative*/
    height: 30vh;/*高さを全画面にあわせる*/
	padding: 200px 0;
} 

#video-area{
    position: absolute;
    z-index: -1;/*最背面に設定*/
    top: 0;
    right:0;
    left:0;
    bottom:0;
    overflow: hidden;
	
}

#video {
	
    /*天地中央配置*/
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}

/*見出し設定*/
h1{
    /*要素の配置*/
    position:absolute;
    /*要素を天地中央寄せ*/
    top: 15%;
    left: 50%;
    /*transform: translateX(-50%);*/
    transform: translateY(-50%) translateX(-50%);
    /*見た目の調整*/
    color:#fff;
    /*text-shadow: 0 0 15px #000;*/
	width: 700px;
}

.topcopy{
	font-size: 3em;
	text-align: center;
	font-weight: bold;
	color: #FFF;
	font-family:'MyFont Script';
    text-shadow: 0 0 10px #000;
}


.mainmds_mov{
	/*width: 650px;*/
	font-size: 3em;
	text-align: left;
	font-weight: bold;
	color: #A80A0A;
	/*font-family:'MyFont Script';*/
    /*text-shadow: 2px 2px 1px #FFF;*/
	margin: 0 auto 15px;
	
}

.maintext_mov{
	/*width: 650px;*/
	font-size: 1.5em;
	text-align: left;
	color: #000;
	font-family:'MyFont Script2';
	margin: 0 auto;
    /*text-shadow: 0 0 10px #FFF;*/
}



.mainmds{
	font-size: 2.5em;/*6em*/
	text-align: center;
	font-weight: bold;
	color: #FFF;
	/*font-family:'MyFont Script';*/
    background: rgb(168, 10, 10 ,0.7);
	padding: 10px 0;
}


.maintext{
	font-size: 1.8em;
	text-align: center;
	color: #FFF;
	font-family:'MyFont Script2';
    text-shadow: 0 0 15px #FFF;
}

.mainmds2{
	width: 650px;
	font-size: 3em;
	text-align: left;
	font-weight: bold;
	color: #A80A0A;
	/*font-family:'MyFont Script';*/
    text-shadow: 2px 2px 1px #FFF;
	margin: 0 auto 15px;
	
}

.maintext2{
	width: 650px;
	font-size: 1.5em;
	text-align: left;
	color: #000;
	font-family:'MyFont Script2';
	margin: 0 auto;
    text-shadow: 0 0 10px #FFF;
}

.mainmds_right{
	width: 480px;
	font-size: 3em;
	text-align: left;
	font-weight: bold;
	color: #A80A0A;
	/*font-family:'MyFont Script';*/
    text-shadow: 2px 2px 1px #FFF;
	margin: 0 auto 15px;
	
}

.maintext_right{
	width: 480px;
	font-size: 1.5em;
	text-align: left;
	color: #000;
	font-family:'MyFont Script2';
	margin: 0 auto;
    text-shadow: 0 0 10px #FFF;
}


/*——　文字の右にライン　——*/
.title-border-right {
display: flex;
align-items: center;
	
	font-size: 3em;
	text-align: left;
	font-weight: bold;
	color: #A80A0A;
	/*font-family:'MyFont Script';*/
    text-shadow: 2px 2px 1px #FFF;
	margin: 0 auto 15px;
}
.title-border-right:after {
border-top: 3px solid;
    text-shadow: 2px 2px 1px #FFF;
content: "";
flex-grow: 1;
}
.title-border-right:after {
margin-left: 1rem;
}



#container{
  background:#000;
  padding:0px 0 0px;
  text-align: center;
	
}

/*#video_area{
	position: relative;
}
*/

/*#video{
	width: 100%;
	height: 500px;
	position: relative;
	z-index: 3;
	background-color: rgba(0,0,0,0.9);
	top: 0;
	left: 0;
}

video{
	position: relative;
	z-index: -100;
}*/

#mainbg_sp{
	position: relative;
	width: 100%;
	height: 780px;
	background: url("../images/topbg.jpg") center right/ cover no-repeat;
	padding: 0px 0 0px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}


#mainbg{
	position: relative;
	width: 100%;
	height: 780px;
	background: url("../images/topbg.jpg") center right/ cover no-repeat;
	margin-top: 77px;
	/*background: -moz-linear-gradient(left,rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 80%,rgba(0, 0, 0, 0)), url("../images/mainartbg.jpg") 70% top / cover no-repeat;
	background: -webkit-linear-gradient(left,rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 80%,rgba(0, 0, 0, 0)), url("../images/mainartbg.jpg") 70% top / cover no-repeat;
	background: linear-gradient(to right,rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 80%,rgba(0, 0, 0, 0)), url("../images/mainartbg.jpg") 70% top / cover no-repeat;*/
	/*background: linear-gradient(rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 1)), url("../images/mainartbg.jpg") 35% 20% / cover no-repeat;*/
	/*background: url("../images/mainartbg.jpg") 70% center / cover no-repeat;*/
	padding: 0px 0 0px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}

#game_mainbg{
	position: relative;
	width: 100%;
	/*height: 780px;*/
	background: linear-gradient(rgba(0, 0, 0, 0.4) 1%,rgba(0, 0, 0, 0.4) 10%, rgba(0, 0, 0, 0.4) 80%, rgba(0, 0, 0, 0.4)), url("../images/gamebk.jpg") center center/ cover no-repeat;
	
	padding: 0px 0 0px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}

#gametop{
	text-align: center;
	padding: 30px 0;
}

#ttl{
	position: absolute;
	top: 50%;
   left: 5%;
   transform: translateY(-50%);
	text-align: left;
}

.td_cnt{
	text-align: left;
	margin-left: 5%;
}

#plday{
	position: relative;
	width: 100%;
	
	/*background: url("../images/PBbg_plday.jpg") center center/ cover no-repeat;*/
	background: #5A5141;
	padding: 30px 0 30px;
	/*margin-top: -100px;-150px*/
	text-align: center;
	border-bottom: 5px solid #333;
	border-top: 5px solid #333;
}


.lineset {
	position: relative;
	/*position: absolute;*/
	width: 100%;
	height: 25px;
	object-fit: cover;
	margin: 0px 0 -5px;
	z-index: 100;
	text-align: center;
}



#gamebg{
	position: relative;
	width: 100%;
	/*height: 800px;*/
	background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/Background.jpg") center center / cover no-repeat fixed;
	padding: 100px 0 100px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}

#gc_mainbg{
	position: relative;
	width: 100%;
	/*height: 800px;*/
	background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/Dragoness_Overview_Background.jpg") center center / cover no-repeat;
	padding: 100px 0 100px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}


#gc_actionbg{
	position: relative;
	width: 100%;
	/*height: 800px;*/
	background: linear-gradient(rgba(0, 0, 0, 0.3) 1%,rgba(0, 0, 0, 0.3) 10%, rgba(0, 0, 0, 0.3) 80%, rgba(0, 0, 0, 0.3)), url("../images/features-background.jpg") center center/ cover no-repeat fixed;
	padding: 100px 0 100px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}




.gc_main{
	position: relative;
	width: 700px;
	color: #FFF;
	font-size: 1.7em;
	font-family:'MyFont Script';
	margin: 0 auto;
	/*margin-top: -100px;-150px*/
	text-align: left;
	padding: 20px;
	/*border: 3px #FFFFFF solid ;
	border-radius: 20px;
	background-color: rgba(0,0,0,0.8);*/
	/*background-color: rgba(255,255,255,0.8);*/
}

.txtstr{
	/*font-size: 1.1em;*/
	font-weight: bold;
	font-family:'MyFont Script';
	font-size: 2.3em;
	text-align: center;
	line-height: 1.5em;
		color: transparent;
	background : rgba(255,255,255,1);
	text-shadow : 
		0 0 0.1em rgba(200,200,200,0.05),
		0.01em 0.04em 0.03em rgba(0,70,91,0.4);
	-webkit-background-clip : text;
	margin-bottom: 30px;
}

.txtstr_cl{
	/*font-size: 1.1em;*/
	font-weight: bold;
	color: #b22222;
}

.txtnml{
	width: 600px;
	margin: 0 auto;
	text-align: center;
}


/*.inmds{
	font-size:5em;
	text-align:center;
	line-height:0.95em;
	font-weight:bold;
	color: #2f4f4f; 
	text-shadow:
		-1px 0 white,
		0 1px white,
		1px 0 white,
		0 -1px white;
	font-family:'MyFont Script';
	margin-bottom: 50px;
}*/

.inmds{
	font-family:'MyFont Script';
	margin-bottom: 30px;
	font-size:5em;
	text-align:center;
	line-height:0.95em;
	font-weight:bold;
	color: #FFF;
	text-shadow: 
		0 0 0.05em #F06292,
		0 0 0.10em #F06292,
		0 0 0.15em #F06292,
		0 0 0.30em #F06292;
	filter: saturate(80%);
}

.mdsimg{
	text-align: center;
	margin-bottom: 30px;
}

.gifarea{
	text-align: center;
	margin-bottom: 30px;
}

.gifarea img{
	border: 0px solid #FFF;
}

.imgarea{
	text-align: center;
	margin-top: 40px;
}

.imgarea img{
	border: 1px solid #FFF;
}


#myth_bg{
	position: relative;
	width: 100%;
	/*height: 800px;*/
	background: linear-gradient(rgba(0, 0, 0, 0.8) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.8)), url("../images/myth_bg.jpg") center center/ cover no-repeat;
	/*background: -moz-linear-gradient(left,rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 80%,rgba(0, 0, 0, 0)), url("../images/mainartbg.jpg") 70% top / cover no-repeat;
	background: -webkit-linear-gradient(left,rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 80%,rgba(0, 0, 0, 0)), url("../images/mainartbg.jpg") 70% top / cover no-repeat;
	background: linear-gradient(to right,rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 80%,rgba(0, 0, 0, 0)), url("../images/mainartbg.jpg") 70% top / cover no-repeat;*/
	/*background: linear-gradient(rgba(0, 0, 0, 0.8) 1%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 1)), url("../images/mainartbg.jpg") 35% 20% / cover no-repeat;*/
	/*background: url("../images/mainartbg.jpg") 70% center / cover no-repeat;*/
	padding: 30px 0 10px;
	/*margin-top: -100px;-150px*/
	text-align: center;
	height: 700px;
}



#myth_main{
	position: absolute;
	width: 45%;
	color: #FFF;
	font-size: 1.5em;
	font-family:'MyFont Script';
	/*margin: 0 auto;*/
	/*margin-top: -100px;-150px*/
	text-align: left;
	
    top: 50%;
    right: 5%;
    /*transform: translateX(-50%);*/
    transform: translateY(-50%);
}

#myth_mds{
	font-size: 1.8em;
	color: #cafefe;
	margin-bottom: 20px;
	line-height: 1.5em;
}

#myth_gyou{
	line-height: 1.5em;
}

.boxmain{
	width: 100%;
display:flex;
justify-content: center;	
}


.boxleft{
	float: left;
	width: 40%;
}

.boxright{
	float: left;
	width: 40%;
}

.boxtxt{
	color: #FFF;
	font-size: 1.5em;
	line-height: 1.5em;
	text-align: left;
	width: 90%;
	margin-left: 3%;
	margin-top: 20px;
	font-family:'MyFont Script';
}

.imgspc{
	margin-left: 3%;
}


#gaiyoubg{
	position: relative;
	width: 100%;
	height: 800px;
	
	background: -moz-linear-gradient(left,rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0) 10%,rgba(0, 0, 0, 0.8)), url("../images/DCE_main.jpg") center center / cover no-repeat;
	background: -webkit-linear-gradient(left,rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0) 10%,rgba(0, 0, 0, 0.8)), url("../images/DCE_main.jpg") center center / cover no-repeat;
	background: linear-gradient(to right,rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0) 10%,rgba(0, 0, 0, 0.8)), url("../images/DCE_main.jpg") center center / cover no-repeat;
	
	
	/*background: linear-gradient(rgba(0, 0, 0, 0.5) 1%,rgba(0, 0, 0, 0.5) 10%, rgba(0, 0, 0, 0.5) 80%, rgba(0, 0, 0, 0.5)), url("../images/DCE_main.jpg") center center / cover no-repeat;*/
	/*background: linear-gradient(rgba(255, 255, 255, 0.5) 1%,rgba(255, 255, 255, 0.5) 10%, rgba(255, 255, 255, 0.5) 80%, rgba(255, 255, 255, 0.5)), url("../images/DCE_main.jpg") center center / cover no-repeat;*/	
	
	/*margin-top: -100px;-150px*/
	text-align: center;
}

.gaiyoubox{
	width: 600px;
	position: absolute;
   top: 50%;
   right: 5%;
   transform: translateY(-50%);	
	
}

.gaiyoumds{
	color: #FFF;
	font-size: 2.5em;
	font-weight: bold;
    text-shadow: 0 0 10px #000;
	margin-bottom: 10px;
	text-align: left;
}

.big{
	font-size: 2em;
}

.gaiyoutxt{
	color: #FFF;
	font-size: 1.5em;
	text-align: left;
    text-shadow: 0 0 10px #000;
}

.whitebg{
	background: #FFF;
	width: 100%;
	margin: 0 auto;
	padding: 50px 0;
	
  display: flex;
  justify-content: center;
  align-items: center;	
}


.whiteboxleft{
	float: left;
	width: 45%;
	color: #000;
	margin-right: 3%;
	margin-left: 5%;
}

.whiteboxright{
	float: right;
	width: 50%;
	color: #000;
}

.whitemds{
	font-size: 3em;
	text-align: left;
	font-weight: bold;
}

.whitetxt{
	font-size: 1.5em;
	text-align: left;
}

.blackbg{
	background: #000;
	width: 100%;
	margin: 0 auto;
	padding: 50px 0;
	
  display: flex;
  justify-content: center;
  align-items: center;	
}


.blackboxleft{
	float: left;
	width: 50%;
	color: #FFF;
}

.blackboxright{
	float: right;
	width: 45%;
	color: #FFF;
	margin-right: 5%;
	margin-left: 3%;
}

.blackmds{
	font-size: 3em;
	text-align: left;
	font-weight: bold;
}

.blacktxt{
	font-size: 1.5em;
	text-align: left;
}

/*.whitebg{
	position: relative;
	width: 100%;
	padding: 50px 0;
	background: #FFF;
	text-align: center;
}
*/
/*.whiteboxleft{
	float: left;
	width: 40%;
	margin-left: 5%;
}

.whiteboxright{
	float: right;
	width: 50%;
}*/




#movtop{
	margin-top: 30px;
	margin-right: 12%;
}

#movtop img{
	border: #F12626 solid 1px;
}

.catch{
	position: relative;
	color: #FFF;
	font-size: 2.8em;
	width: 900px;
	margin: 0 auto;
	top: 20%;
	font-family:'MyFont Script';
	line-height: 1.5em;
	text-align: center;
}

#game01bg{
	position: relative;
	width: 100%;
	height: 500px;
	background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/iss-panel-1.jpg") 20% center / cover no-repeat;
	/*background: url("../images/mainartbg.jpg") 70% center / cover no-repeat;*/
	padding: 100px 0 100px;
}

#game02bg{
	position: relative;
	width: 100%;
	height: 500px;
	background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/iss-panel-2.jpg") 60% center / cover no-repeat;
	/*background: url("../images/mainartbg.jpg") 70% center / cover no-repeat;*/
	padding: 100px 0 100px;
}

#game03bg{
	position: relative;
	width: 100%;
	height: 500px;
	background: linear-gradient(rgba(0, 0, 0, 0) 1%,rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0)), url("../images/iss-panel-3.jpg") 5% center / cover no-repeat;
	/*background: url("../images/mainartbg.jpg") 70% center / cover no-repeat;*/
	padding: 100px 0 100px;
}

.gamebox_mov{
	position: absolute;
	top: 10%;
	left: 8%;
	/*padding: 20px 20px;*/
}

.gamebox_movbg{
	background: rgba(0, 0, 0, 0.6);
	padding: 20px 20px;
}

.newmov{
	margin-top: 40px;
	margin-left: 100px;
	
}

.newmov_pc{
	position: absolute;
	top: 57%;
	right: 8%;
	/*margin-top: 40px;
	margin-left: 50px;*/
}


.gamebox{
	position: absolute;
	top: 10%;
	left: 8%;
}

.gamebox2{
	position: absolute;
	top: 10%;
	right: 5%;

}



#storybg{
	position: relative;
	width: 100%;
	height: 900px;
	background: linear-gradient(rgba(0, 0, 0, 1) 1%,rgba(0, 0, 0, 0.5) 10%, rgba(0, 0, 0, 0.5) 80%, rgba(0, 0, 0, 1)), url("../images/section-3-background.jpg") 55% center / cover no-repeat;
	/*background: url("../images/mainartbg.jpg") 70% center / cover no-repeat;*/
	padding: 70px 0 60px;

}

#storytxt{
	position: relative;
	color: #FFF;
	font-size: 2em;
	width: 900px;
	margin: 0 auto;
	top: 20%;
	font-family:'MyFont Script';
	line-height: 1.5em;
}

.gyoukan{
	margin-top: 0.5em;
}

/*.gallery_main a:hover img{
opacity:0.85;
filter:alpha(opacity=90);
-ms-filter: "alpha( opacity=90 )";
}*/


p.resizeimage img {
	width: 100%;
	margin-top: 80px;
	margin-bottom: -5px;
}


#cate{
	background-color: rgba(0,0,0,0.8);
	width:100%;
/*	padding-top:2px;
	padding-bottom:2px;*/
    position: fixed;
    top: 0;
    right:0;
	/*margin-bottom:30px;*/
	padding-top: 10px;
	padding-bottom: 5px;
	z-index: 10;
}

.cate_space{
	margin-left: 30px;
}


#kounyu a{
	/*margin-right: 20px;*/
	background: #000;
	padding: 5px 15px;
	color: #FFDF87;
	border: solid 1px #FFDF87;
	font-weight: bold;
}

#kounyu a:hover{
	color: #000;
	background: #FFDF87;
	transition:all 1.0s;
}


.buy{
	font-weight: bold;
	background-color: #31BD29;
	color: #FFF;
	padding: 10px 19px 10px 15px;
	margin-left: 30px;
}

.buy a:hover{color: #fff;}

h1 {
　　font-size: 36px;
　　color: #FFF;
　　background-color: #222;
　　text-align: center;
　　padding: 5px;
}


#navi {
　　position:absolute;
　　height:60px;
　　z-index:1;
　　width: 100%;
　　background-color: #222;
	text-align:center;
	color:#fff;
	margin:0.5em;
	font-size:180%;
	vertical-align:middle;
}

#navi a{
	margin-left: 5px;
		font-family:'MyFont Script';
}


.u_line{
   text-decoration: none;
   border-bottom: 1px solid #FFF;
   padding-bottom: 0.3px;
   }

.spec_left{
	float:left;
	}


.red{
	color: #FE6534;
	font-weight: bold;
}

.tokucho{
	width: 860px;
	text-align: left;
	margin: 0 auto;
/*	margin-left: 20px;
*/}

.space{
	margin: 20px 0;
}

/*コピーライト*/

#tenpo{
	width: 960px;
	text-align:center;
/*margin-top:30px;*/
padding-top:10px;
padding-bottom:10px;
	margin-right: auto;
	margin-left: auto;

}

#shop_kounyu{
	color: #FFF;
	text-align: center;
	font-size: 270%;
	font-weight: bold;
	margin-bottom: 10px;
}

#shop_list{
	width: 100%;
	margin: 0px auto;
	text-align: center;

	padding-top: 40px;
	padding-bottom: 50px;
}

#shop{
	text-align: center;
	margin: 50px 0 0px;
}

#shop a{
	margin-bottom: 10px;
}


#footer{
	width: 100%;
	background: #222;
	padding-bottom: 50px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#5d5d5d+0,5d5d5d+50,5d5d5d+100&0.1+1,1+25,1+75,0.1+100 */
/* IE6-9 */
}

#inc_logo{
	width: 960px;
	height: 60px;
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    layout-grid-line:200px;
	padding-bottom: 0px;
	padding-top: 20px;
}

#inc_logo img{
    vertical-align:middle;
}

#inc_logo img{
    vertical-align:middle;
}


.logo_space{
	margin-left: 30px;
}


#copy{
	width: 950px;
	margin-right: auto;
	margin-left: auto;
	margin-top:20px;
	margin-bottom:20px;
	color:#fff;
	font-size:90%;
	text-align: center;
}

/*ギャラリー*/

#gallerybg{
	position: relative;
	width: 100%;
	/*height: 800px;*/
	background: #000;
	padding: 100px 0 100px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}

.gallery_main{
	text-align: center;
	width: 960px;
	margin: 0px auto 0px;
	
}

.gallery_main img{
	border: 1px #999 solid;

}

#home_main{
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	padding: 50px 0;
	text-align: center;
}

#movie{
	margin-bottom: 30px;
	text-align: center;
}

.ss_img{
	margin-bottom: 7px;
}

/*.ss_space{
	margin-left: 10px;
}*/

.gallery_img{
	margin-bottom: 10px;
	/*background-color: #FFF;*/
}
#movie{
	margin-bottom: 30px;
	text-align: center;
}

.movie01 {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

.movie01::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100vh;
	background: linear-gradient(rgba(0, 0, 0, 1) 1%,rgba(0, 0, 0, 0.6) 10%, rgba(0, 0, 0, 0.6) 80%, rgba(0, 0, 0, 1));
	/*background-color: rgba(0,0,0,0.4);*/
	/*background-image: radial-gradient(#111 30%, transparent 31%), radial-gradient(#111 30%, transparent 31%);*/
	/*background-size: 4px 4px;*/
	/*background-position: 0 0, 2px 2px;*/
}

.ss_img{
	margin-bottom: 7px;
}

.ss_space{
	margin-left: 10px;
}



#mlogo{
	position: relative;
	text-align: center;
	padding-top: 180px;
}


#gamebg{
	/*position: relative;*/
	width: 100%;
	height: auto;
	background: url("../images/background.jpg") center center / cover no-repeat #FFF fixed;
	padding: 50px 0 50px;
	margin: 0px 0 ;
}

.star{
	background-color: #FFF;
	text-align: center;
	margin: 0 auto;
	padding: 120px 0 0;

}


.gametxt{
	width: 900px;
	margin: 0 auto;
	font-size: 170%;
	margin-top: 130px;
	text-shadow:1px 1px 5px #ffffff;
}


.mds{
	font-size: 200%;
	font-weight: bold;
	margin-bottom: 15px;
	border-bottom: solid #FFF 2px ;
	display: inline-block;
}

.hbn{
	font-size: 145%;
}

.ctg{
	font-weight: bold;
}

#gimg{
	float: left;
	width: 500px;
	margin-left: 20px;
}


#specbg{
	position: relative;
	width: 100%;
	/*height: 500px;*/
	background: linear-gradient(rgba(0, 0, 0, 0.7) 20%, rgba(0, 0, 0, 0.5) 80%, rgba(0, 0, 0, 0.7)),url("../images/specbg.jpg") left center / cover no-repeat;
	padding: 60px 0 80px;
}

.spec1main{
	color: #FFF;
	width: 880px;
	margin: 0 auto;
	padding: 40px 0 20px;
	text-align: left;
	font-family:'MyFont Script2';
}

.speccntttl{
	color: #FFF;
	font-size: 150%;
	font-weight: bold;
	margin-top: 20px;
	height: 60px;
}

.specttl{
	background: #B41E23;
	color: #FFF;
	font-size: 180%;
	margin-bottom: 5px;
	/*font-weight: bold;*/
	text-align: center;
	padding: 10px 0;
}

.specttl2{
	background: #3A7FA8;
	color: #FFF;
	font-size: 180%;
	margin-bottom: 5px;
	/*font-weight: bold;*/
	text-align: center;
	padding: 10px 0;
}

.specbkg{
	background: rgba(0, 0, 0, 0.5);
	width: 100%;
	padding: 0px 0 0;

}

.spectext{
	font-size: 160%;
	margin-bottom: 15px;
	border-bottom: #FFF solid 1px;
	padding-bottom: 10px;
}

.spectextbgx{
	font-size: 160%;

}


dl {
list-style:none;
	font-size: 150%;
	margin-bottom: 15px;
}

.dl_bd{
	border-bottom: #FFF solid 1px;
}

ul {
list-style:none;
	font-size: 160%;
	margin-bottom: 15px;
}

/*li{
	border-bottom: #FFF solid 1px;

}*/

.li_bd{
	border-top: #FFF solid 1px;
	padding-top: 10px;
}

.li_bd2{
	border-top: #FFF solid 1px;
	padding-top: 10px;
	border-bottom: #FFF solid 1px; 
}


.specbd{
	margin-top: 10px;

}

span.dan {
	float:left;
	width: 9em;
	background: #FFF;
	margin: 0 0 10px;
	color: #000;
	/*font-weight: bold;*/
	text-align: center;
	
}

span.dan2 {
	display: block;
	margin-left: 110px;
	margin: 0 0 10px;
}

span.dan3{
	float:left;
	width: 9em;
	height: 3em;
	display: flex;
  justify-content: center;
  align-items: center;
	background: #FFF;
	margin: 0 0 10px;
	color: #000;
	/*font-weight: bold;*/
	text-align: center;
	
}

#shop{
	text-align: center;

	margin: 50px 0 0px;
}

#shop a{
	margin-bottom: 10px;
}





#smain{
	width: 850px;
	margin: 0 auto;
}

#stext{
	/*float: left;*/
	color: #FFF;
	margin-left: 10px;
}





#toplogo{
	float: left;
	text-align: left;
	margin-left: 25px;
	padding-top: 5px;
}

#ccnt{
	float: right;
	text-align: center;
	margin-right: 25px;
	margin-top: 17px;
}

#ccnt a:hover{
	transition:all 1.0s;
}

.btna a:hover{
	transition:all 1.0s;
}

#cate div{
    vertical-align:middle;
}

#t_main{
	text-align: center;
	width: 960px;
	padding-top: 50px;
	padding-bottom: 50px;
	margin: 0px auto;
}

ul {
list-style:none;
	font-size: 160%;
	margin-bottom: 15px;
}

li{
	border-bottom: #FFF solid 1px;
}

.li_bd{
	border-top: #FFF solid 1px;
	padding-top: 10px;
}

.specbd{
	margin-top: 10px;

}

span.dan {
	float:left;
	width: 10em;
	background: #FFF;
	margin: 0 0 10px;
	color: #000;
	font-weight: bold;
	text-align: center;
	
}

span.dan2 {
	display: block;
	margin-left: 110px;
	margin: 0 0 10px;
color: #FFF;
}

span.dan3{
	float:left;
	width: 10em;
	height: 3em;
	display: flex;
  justify-content: center;
  align-items: center;
	background: #FFF;
	margin: 0 0 10px;
	color: #000;
	font-weight: bold;
	text-align: center;
	
}

.cnt{
	text-align: center;
}

.ps4ver{
	text-align: center;
	margin: 50px 0 0;
}


.catebg{
	background-color: rgba(0,0,0,0.5);
	padding: 50px 0;
	width: 100%;
	margin: 50px 0 50px;
}

.catebg img{
	border: 1px rgba(255,255,255,0.5) solid;
}

.cateboxl{
	float: left;
	width: 40%;
	margin-left: 5%;
}


.cateboxr{
	float: right;
	width: 45%;
	margin-right: 5%;
}

.cateboxl2{
	float: left;
	width: 45%;
	margin-left: 5%;
}


.cateboxr2{
	float: right;
	width: 40%;
	margin-right: 5%;
}



.catetxt{
	color: #FFF;
	font-size: 150%;
	margin-top: 30px;
}

.catetxtsp{
	color: #FFF;
	font-size: 150%;
	margin-top: 0px;
}


.catemds{
	font-size: 180%;
	font-weight: bold;
	margin-bottom: 10px;
}

.catemds2{
	font-size: 160%;
	font-weight: bold;
	margin-bottom: 5px;
}

.upg{
	font-size: 130%;
	color: #FFF;
	margin-top: 10px;
}

@font-face {
  font-family: 'MyFont Script';
  font-style: normal;
  font-weight: 400;
  src: url("../font/A-OTF-ReimPr6-Medium.otf") format('woff');
}


@font-face {
  font-family: 'MyFont Script2';
  font-style: normal;
  font-weight: 400;
  src: url("../font/A-OTF-KaiminTuStd-Medium.otf") format('woff');
}


.swiper-container{
  text-align: center;
}
.swiper-container .swiper-slide img{
  max-width: 100%;
  width: 100%;
  height: auto;
}
.swiper-container .swiper-slide {
  position: relative;
  width: 100%;
}
.swiper-container .swiper-slide:before {
  content:"";
  display: block;
  padding-top: 56.25%;
}
.swiper-container .swiper-slide iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#thumbs {
  height: 20%;
  box-sizing: border-box;
  padding: 10px 0;
}
#thumbs .swiper-slide {
  width: 20%;
  height: 100%;
  opacity: 0.2;
  cursor: pointer;
}
#thumbs .swiper-slide:before {
  content:none;
}
#thumbs .swiper-slide-active {
  opacity: 1;
}

/* タブ */
.tab{
    list-style:none;
    padding:0;
    margin:0 auto 20px auto;
    width:79.9%;
    display:flex;

}
.tab li{
    width:50%;
    background: linear-gradient(180deg, rgba(135,135,135,1) 0%, rgba(55,55,55,1) 100%);;
    margin-right:5px;
    border:3px solid #FFF;
    text-align: center;
    padding:10px 0;/*10px 0*/
	color: #FFF;
	font-weight: bold;
	font-size: 1.5em;
}

/*.textsd{
	text-shadow:1px 1px 0 #000,-1px 1px 0 #000,1px -1px 0 #000,-1px -1px 0 #000, 1px 1px 1px #000;
}*/

.tab li.active{
    background:linear-gradient(180deg, rgba(233,156,50,1) 0%, rgba(233,87,50,1) 100%);;
}
/* ページャー */
.tab_sub{
    margin:20px auto;
    padding:0;
    display:flex;
    list-style:none;
    width:80%;
	text-align: right;
}
.tab_sub li{
    padding:5px;
    border:1px solid #dfdfdf;
    margin-right:5px;
}
.tab_sub li.active{
    background:#f79b9b;
}
 
.list .inner,
.list .inner table{
    display:none;
	text-align: center;	
}
.list .inner.active{
    display:block;
	text-align: center;
}

.list .inner table.active{
    display:table;
	margin: 0 auto;


}

.active th{
	text-align: center;
}


.skillmds{
	font-size: 3.5em;
	font-weight: bold;
	color: #FFF;
	
}

.modetxt{
	color: #FFF;
	font-size: 1.5em;
	margin: 30px auto 30px;
}

.sys_cnt{
	text-align: center;
	margin: 0px auto;
	padding-top: 50px;
	padding-bottom: 30px;
}

.special_txt{
	color: #FFF;
	font-size: 1.8em;
	width: 900px;
	margin: 0 auto 30px;
	text-align: center;
}


.sys_txt{
	color: #FFF;
	font-size: 1.8em;
	width: 900px;
	margin: 0 auto 30px;
}

.sys_atatack{
	text-align: center;
}



.sys_atspc{
	margin-left: 20px;
}

.sys_boxmain{
	width: 90%;
	margin: 0 auto;
	padding-bottom: 0px;
	
  display: flex;
  justify-content: center;
  align-items: center;	
}

.sys_boxL{
	float: left;
	width: 40%;
	color: #FFF;
	font-size: 1.7em;
	text-align: left;
	font-family:'MyFont Script';
	line-height: 1.5em;
}

.sys_boxR{
	float: right;
	width: 50%;
	color: #FFF;
	font-size: 1.8em;
	margin-left: 50px;
}

.sys_boxL2{
	float: left;
	width: 50%;
	color: #FFF;
	font-size: 1.7em;
}

.sys_boxR2{
	float: right;
	margin-left: 50px;
	text-align: left;
	width: 40%;
	color: #FFF;
	font-size: 1.8em;
	line-height: 1.5em;
	font-family:'MyFont Script';
}


.yellow_r{
	color: yellow;
}

.yellow_b{
	color: yellow;
	font-size: 1.4em;
}

.yellow_mds{
	color: yellow;
	font-size: 1.4em;
	font-weight: bold;
}

.gamebg_tab{
	position: relative;
	/*width: 100%;*/
	width: 960px;
	margin: 0 auto;
	text-align: center;
	padding: 70px 0 60px;

}






.center{
	text-align: center;
}


.tabimg1{
	float: left;
	margin-left: 5%;
	width: 50%;
/*	top: 50%;
	left: 5%;
	transform:translateY(-50%);
*/}

.gametxt_tab{
	/*float: right;
	right: 5%;
	margin-right: 5%;*/
	color: #FFF;
	font-size: 1.5em;
	width: 900px;
	/*top: 25%;
	right: 5%;*/
	/*transform:translateY(-50%);*/
	/*transform  : translate(-50%,-50%);*/
	
	font-family:'MyFont Script';
	line-height: 1.5em;
	z-index: 15;
    text-shadow: 0 0 10px #000;
}

.tab450{
	width: 450px;
}

.gamemds{
	color: #DAD180;
	text-align: center;
	font-size: 1.5em;
	font-weight: bold;
	margin: 10px 0 20px;
	line-height: 1.5em;
	z-index: 15;
    text-shadow: 0 0 10px #000;
}

.gametxt{
	position: absolute;
	color: #FFF;
	font-size: 1.5em;
	width: 500px;
	top: 50%;
	right: 5%;
	transform:translateY(-50%);
	/*transform  : translate(-50%,-50%);*/
	
	font-family:'MyFont Script';
	line-height: 1.5em;
	z-index: 15;
    text-shadow: 0 0 10px #000;
}




.tab-wrap {
    display: flex;
    flex-wrap: wrap;
		text-align: center;

}
.tab-label {
    color: White;
    background: LightGray;
	font-size: 2em;
    margin-right: 5px;
    padding: 3px 12px;
    order:-1;
	text-align: center;

}
.tab-content {
    width: 100%;
    display: none;
		text-align: center;

}
.tab-switch:checked+.tab-label {
    background: DeepSkyBlue;
		text-align: center;

}
.tab-switch:checked+.tab-label+.tab-content {
    display: block;
		text-align: center;

}
.tab-switch {
    display: none;
		text-align: center;

}


/*適用タブ*/
.tab-group{
  display: flex;
  justify-content: center;
	color: #FFF;
	font-family:'MyFont Script';
	text-align: center;
}
.tab{
  flex-grow: 1;
  padding:5px;
  list-style:none;
  border:solid 1px #CCC;
	background-color: #000;
  text-align:center;
  cursor:pointer;
}
.panel-group{
  /*height:100px;
  border:solid 1px #CCC;
  border-top:none;
  background:#eee;*/


}
.panel{
  display:none;
	text-align: center;
}
.tab.is-active{
  background: #7E1710;
  color:#FFF;
  transition: all 0.2s ease-out;
	text-align: center;
}
.panel.is-show{
  display:block;
	text-align: center;
}

.tabbox{
	/*top: 5%;*/
	/*right: 5%;*/
	width: 960px;
	text-align: center;
}

.tab{
	text-align: center;
}

.menu-btn {
    position: fixed;
    top: 15px;
    right: 15px;
    display: flex;
    height: 150px;/*60-100px*/
    width: 150px;/*60-100px*/
    justify-content: center;
    align-items: center;
    z-index: 2500;
    background-color: #ffffff;/*3584bb*/
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 8px;/*3px[5]*/
    width: 75px;/*25px[50]*/
    border-radius: 5px;/*3px[5]]*/
    background-color: #000;/*ffffff*/
    position: absolute;
}
.menu-btn span:before {
    bottom: 30px;/*8px-20*/
}
.menu-btn span:after {
    top: 30px;/*8px-20*/
}

#menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}


#menu-btn-check {
    display: none;
}

.menu-content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    background-color: #000;
}
.menu-content ul {
    padding: 190px 10px 0;/*top140*/
}
.menu-content ul li {
    border-bottom: solid 1px #ffffff;
    list-style: none;
}
.menu-content ul li a {
	font-family:'MyFont Script';
    display: block;
    width: 100%;
    font-size: 280%;/*15px*/
    box-sizing: border-box;
    color:#ffffff;
    text-decoration: none;
    padding: 9px 15px 10px 10px;
    position: relative;
}
/*.menu-content ul li a::before {
    content: "";
    width: 20px;
    height: 20px;
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 50px;
}*/

.menu-content {
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 100%;/*leftの値を変更してメニューを画面外へ*/
    z-index: 2000;
    /*background-color: #3584bb;*/
	background: rgba(0, 0, 0, 0.7);
    transition: all 0.5s;/*アニメーション設定*/
}

#menu-btn-check:checked ~ .menu-content {
    left: 0;/*メニューを画面内へ*/
}