@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: #FFDF87; }
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{
	position: relative;
	width: 100%;
	height: 800px;
	background: url("../images/topbg.jpg") 70% 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: 0px 0 0px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}


#ttl{
	position: absolute;
	top: 50%;
   left: 0%;
   transform: translateY(-50%);
	text-align: left;
}

#lempo_mainbg{
	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/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: 80px 0 80px;
	/*margin-top: -100px;-150px*/
	text-align: center;
}



#lempo_main{
	position: relative;
	width: 940px;
	color: #FFF;
	font-size: 2em;
	font-family:'MyFont Script';
	margin: 0 auto;
	/*margin-top: -100px;-150px*/
	text-align: left;
}

.lempo_b{
	font-size: 1.3em;
	
}


#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: 40px;
}


#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:160%;
	vertical-align:middle;
}

#navi a{
	margin-left: 5px;
}


.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;
}

/*ギャラリー*/

.gl_mov{
	position: relative;
	text-align: center;
	width: 92%;
}

.gallery_main{
	position: relative;
	text-align: center;
	width: 100%;
	margin: 0px auto 0px;
	padding: 0px 0 0px;
	left: 0%;
	right: 0%;
	background-color: #000;
}



.gallery_main img{
	margin-bottom: -5px;
	border-bottom: rgba(202, 254, 254, .5) 1px solid;
	border-top: rgba(202, 254, 254, .5) 1px solid;
	box-shadow: 0px 0px 10px rgba(202, 254, 254, .5);
}

.gallery_left{
	text-align: left;
}


.movline img{
	border: rgba(202, 254, 254, .5) 1px solid;
	text-align: center;
	margin: 0 auto;
}

/*.gallery_main{
	position: relative;
	text-align: center;
	width: 92%;
	margin: 0px auto 0px;
	padding: 40px 0 40px;
	left: 4%;
	right: 4%;
}

.gallery_main img{
	border: rgba(255, 255, 255, .6) 1px solid;
}

.gallery_left{
	text-align: left;
}
*/

#home_main{
	width: 960px;
	margin-right: auto;
	margin-left: auto;
	padding: 50px 0;
	text-align: center;
}

#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") center 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-KaiminTuStd-Bold.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;
}