@charset "utf-8";

html {
  overflow-y:scroll;
	scroll-behavior: smooth;
}

body{
	background-color:#000;

}

a:link { color: #fff; }
a:visited { color: #fff; }
a:hover { color: #DDD; }
a:active { color: #fff; }

a {
    outline: none;
	text-decoration: none;
}

#art a:hover img{
opacity:0.8;
filter:alpha(opacity=90);
-ms-filter: "alpha( opacity=90 )";
}

:target:before {
   content:"";
   display:block;
   height:50px;/* ヘッダの高さ = 50px */
   margin:-50px 0 0;/* ヘッダの高さ = 50px */
} 

/* メインボックス*/


#main_area{
	position: relative;
	width: 100%;
	height: 850px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 60px;
}

.trailer{
	position: absolute;
	top: 10%;
	left: 60%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}


.c_main{
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	padding: 50px 0px;
}

#seihin_main{
	margin: 100px auto 30px;
	width: 960px;
	font-size: 280%;
	font-weight: bold;
	color: #FFF;
}

#tenpolist{
	float: left;
	width: 550px;
}

#tenpolist p{
	margin-bottom: 20px;
}

#tenpo_tbk{
	background:  linear-gradient(rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.6) 70%, rgba(0, 0, 0, 0.7)),url("../images/seihinbk.jpg") center 40% / cover;
	margin-left: auto;
	margin-right: auto;
}


#tenpo_tl{
	position: relative;
	width: 960px;
	height: 350px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 80px;
}


.game_pk{
	float: right;
	
}

.title_logo{
	position: absolute;
	top:8%;
	left:30%;
	z-index: 1;
}


p.resizeimage img {
	width: 100%;
	margin-top: -3px;
	margin-bottom: -6px;
}

#main_area_back{
	background: url("../images/top_main.png") right 80% / cover;
	margin-left: auto;
	margin-right: auto;
}

#tt_logo{
	position: absolute;
	top:40px;
	right: 8%;
	text-align: center;
}

#release{
	font-size: 300%;
	font-weight: bold;
	padding: 20px 0px 50px 0px;
}

.trailer{
	position: absolute;
	top:420px;
	right: 13px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

#track_back{
	background:  linear-gradient(rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 70%, rgba(0, 0, 0, 0.6)),url("../images/tracks.jpg") center center / cover;
	margin-left: auto;
	margin-right: auto;
}


#track_title{
	position: relative;
	width: 100%;
	height: 350px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 60px;
}

.trackbox{
	float: left;
	width: 310px;
	margin-bottom: 10px;
}

.trackbox p{
	font-size: 130%;
	font-weight: bold;
	margin-top: -5px;
}

.comingsoon{
	color: #666;
}

/* メインボックス*/
#home_main {
width: 900px;
/*margin-top:-90px;
*/margin-right: auto;
margin-left: auto;
padding-top:30px;
padding-bottom:30px;
}

.clearText {
	margin-bottom:-1.5em;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

#cate{
background-color: #222;
	width:100%;
	padding-top:5px;
	padding-bottom:5px;
    position: fixed;
    top: 0;
    right:0;
	margin-bottom:30px;
	z-index: 2;
	border-bottom: solid 4px #D70909;
}



.cate_space{
	margin-left: 20px;/*30*/
}

.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;
}


#contents {
　　width: 740px;
　　margin-right: auto;
　　margin-left: auto;
}

/*#header {
    position: fixed;
    top: 0;
    left:0;
}
*/
#navi {
　　position:absolute;
　　height:60px;
　　z-index:1;
　　width: 100%;
　　background-color: #222;
	text-align:center;
	color:#fff;
	margin:0.5em;
	font-size:160%;
/*	font-weight:bold;
*/	vertical-align:middle;
}

#navi a{
	margin-left: 5px;
}



#kounyu a{
	margin-right: 20px;
	background: #222;
	padding: 5px 15px;
	color: #D8524E;
	border: solid 1px #D8524E;
	font-weight: bold;
}

#kounyu a:hover{
	color: #222;
	background: #D8524E;
}



.u_line{
   text-decoration: none;
   border-bottom: 1px solid #FFF;
   padding-bottom: 0.3px;
   }

#logo{
	position:absolute;
    top: 12px;  
    left: 10px;
	    vertical-align:middle;
	height: 70px;

	}
	
#logo img{
    vertical-align:middle;
}


#sns{
	position:absolute;
    top: 15px;  
    right: 10px;
	}



.spec_left{
	float:left;
	}




/*コピーライト*/

#tenpobg{
	width: 100%;
	background: url("../images/bg_foot01.jpg") center top / cover;
}

#tenpo{
	width: 960px;
	text-align:center;
	padding-top:30px;
	padding-bottom:30px;
	margin-right: auto;
	margin-left: auto;

}

.tenpo_buy{
	font-size: 230%;
	font-weight: bold;
}


#footerbg{
	width: 100%;
	background: url("../images/bg_foot02.png") center top / cover;
	
}

#footer{
	width: 900px;
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	margin-right: auto;
	margin-left: auto;

}


#inc_logo{
	width: 960px;
	height: 80px;
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    layout-grid-line:200px;
	padding-bottom: 20px;
	padding-top: 10px;
}

#inc_logo img{
    vertical-align:middle;
}

.logo_space{
	margin-left: 30px;
}


#copy{
	width: 940px;
	margin-right: auto;
	margin-left: auto;
	margin-top:10px;
	margin-bottom:10px;
	color:#fff;
	font-size:90%;
	text-align: center;
}


/*ゲームの特徴_TOP*/

#gamebg{
	width: 100%;
	background: url(../images/game_bg.jpg) top center / cover no-repeat;
	color: #333;
}

#game_main{
	width: 955px;
	margin-left: auto;
	margin-right: auto;
	padding: 80px 0;
	font-size: 130%;
	
}

.game_l{
	color:#CA192D;
	font-size: 180%;
	font-weight: bold;
	margin-bottom: 10px;
}

.gamebox{
	background-color: rgba(255,255,255,0.9);
	padding: 20px;
	border: solid 4px #CA192D;
}


/*ギャラリー*/

#gallery_area{
background-image: url(../images/crossword.png);
}


#gallery_main{
width: 960px;
margin-right: auto;
margin-left: auto;
	padding-bottom: 10px;
	padding-top: 20px;
}

.w_bg{
	position:relative;
	float: left;
	background-color: #fff;
	width: 310px;
	height: 176px;
	margin-right: 10px;
	margin-bottom: 10px;
}

.w_bg_mov{
	position:relative;
	float: left;
	background-color: #fff;
	width: 630px;
	height: 360px;
	margin-right: 10px;
	margin-bottom: 10px;
}




.on_text{
	color: #FFF;
	font-weight: bold;
	position:absolute;
	top: 0px;
	left: 0px;
	padding: 10px;
	background-color: #FBB014;
	font-size: 130%;
}

#trailer{
	width: 960px;
	margin-top: -13px;
	padding-left: 23px;
	padding-bottom: 10px;
}

#art{
	width: 960px;
	text-align: center;
	margin-top: 10px;
	padding-bottom: 10px;
}

.img_space{
	margin-left: 5px;
}

.img_line{
border: 1px #999 solid; /* 写真の境界線 */
	
}

.center{
	padding-top: 30px;
	text-align: center;
}




.fade-up {
  transition: opacity 0.7s;
  -moz-transition: opacity 0.7s;
  -webkit-transition: opacity 0.7s;
  -o-transition: opacity 0.7s;
  transition: transform 0.7s;
  -moz-transition: transform 0.7s;
  -webkit-transition: transform 0.7s;
  -o-transition: transform 0.7s;
	color: #FFF;
}
#movie{
	float: left;
	width: 960px;
	margin-top: 20px;
}

