@charset "utf-8";

.header-wrap { width: 100%; height: 525px; position:relative;}

.gnav { display: block; position: absolute; top: 485px; left: 0;}

#movieFront{
	width: 100%;
	height: 525px;
	background: url(../img/header_movieFront.png);
	position: absolute;
	z-index: 3;
}

/*  video */

.mainMovie{
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 525px;
	min-width:1080px;
	overflow: hidden;
	background: url(../img/bg_main.jpg);
	background-size:cover;
}

.mainMovie video{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width:100%;
	height:auto;
}


.index{
	width: 980px;
	height: 525px;
	margin:0 auto;
	z-index: 10;
	position:relative;
}

.logo {
	display: block;
	position: absolute;
	top: 5px;
	left: 0 px;
	width: 277px;
	height: 115px;
}
.sns-list { display: block; position: absolute; top: 20px; right: 0px; width: 162px; }
.darius-jp { display: block; position: absolute; top: 80px; right: 0; }

.twitter-timeline iframe { background-color: #ffffff; }

.copy_t{
	position: absolute;
	top: 334px;
	left: 0px;
}

.infomation{
	position: absolute;
	top : 320px;
	left: 15px;
	background: url(../img/index/header_info.png) left top no-repeat;
	width: 561px;
	height: 157px;
}

.btn-twitter { position: absolute; bottom: -5px; right: 30px; }

.inner_info{
	position:relative;
	height: 146px;
	overflow: hidden;
}

.movie_btn{
	position: absolute;
	top : 267px;
	right: -3px;
}

.top-products { position: relative; height: 263px; }
.top-products .spr { display: block; background: url(../img/index/item2.png) no-repeat; }
.spr.top-p-title { position: absolute; top: 19; left: 19px; width: 900px; height: 28px; background-position: 0 0; }
 .spr.top-p-name { position: absolute; top: 48px; left: 19px; width: 751px; height: 59px; background-position: 0 -28px; }
 .spr.top-p-more { position: absolute; top: 48px; left: 770px; width: 146px; height: 59px; background-position: -751px -28px; }
  .spr.top-p-ps4 { position: absolute; top: 106px; left: 19px; width: 364px; height: 138px; background-position: 0 -86px; }
 .spr.top-p-vita { position: absolute; top: 106px; left: 383px; width: 288px; height: 138px; background-position: -364px -86px; }
  .spr.top-p-win { position: absolute; top: 106px; left: 671px; width: 250px; height: 138px; background-position: -651px -86px; }

h2.content-title { position: relative; width: 100%; padding: 15px 0 15px 25px; font-size: 16px; line-height: 1; color: #fff; background: rgba(255,255,255,0.2); border-radius: 2px; }

.top-line1 { height: 275px; }
.top-line2 { height: 305px; }
.btn-more { position: absolute; bottom: 20px; right: 20px; width: 195px; display: block; margin: 20px auto 0; padding: 10px 0; text-align: center; font-size: 14px; line-height: 1; color: #4981ff; background: #fff; border: 1px solid #4981ff; border-radius: 4px; 
  -webkit-transition: 0.2s ease-in-out;
     -moz-transition: 0.2s ease-in-out;
       -o-transition: 0.2s ease-in-out;
  	      transition: 0.2s ease-in-out;
}
.btn-more:hover { box-shadow: 0 0 10px 5px #4981ff; }
.info-thumb { float: left; width: 220px; height: 150px; margin: 20px 15px 0 0; }
.info-thumb2 { float: left; width: 220px; height: 180px; margin: 20px 15px 0 0; }

.colabo-title { padding: 10px 0 0; }
.colabo-title li { float: left; width: 313px; }
.colabo-title li.right-line { border-right: 1px solid #999; }
.colabo-title h3 { color: #fff; font-size: 12px; line-height: 1; text-align: center; margin: 0 0 0; text-shadow: 0 1px 3px #002985; }
.colabo-title p { padding: 0 20px; }
.colabo-title p span { font-size: 11px; }