@charset "UTF-8";
a:focus { outline: none; }

body {
	position: relative;
	width: 100%;
	min-width: 1240px;
	font-family: "Noto Sans Japanese", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background: #000;
}

/*
 INDEX
-----------------------------------------------------*/

/* TOP VISUAL ---------------------------------------*/
.top {
	width: 100%;
	height: 100vh;
	min-height: 680px; /* 760 */
}
	.topInner {
		position: relative;
		width: 100%;
		height: 100vh;
		min-height: 680px; /* 760 */
		background: url(../img/top/mainVisual.jpg) no-repeat center 0;
		background-size: auto 100%;
	}
		.top h1 {
			position: absolute;
			width: 387px;
			height: 225px;
			top: 120px;
			left: 50%;
			margin: 0 0 0 -47.7%;
		}
		.release {
			position: absolute;
			width: 387px;
			height: 47px;
			top: 357px;
			left: 50%;
			margin: 0 0 0 -47.7%;
		}
		.information {
			position: absolute;
			width: 387px;
			top: 457px;
			left: 50%;
			margin: 0 0 0 -47.7%;
			text-align: center;
			background:rgba(255,255,255,0.8);
			padding:8px 10px;
			line-height:1.4;
			font-size:14px;
			color:#000;
			text-decoration: none;
		}
		.topBnr {
			position: absolute;
			width: 360px;
			height: 90px;
			bottom: 96px;
			left: 50%;
			margin: 0 0 0 -46.8%;
		}
		.topCopy {
			position: absolute;
			width: 368px;
			height: 183px;
			top: 111px;
			right: 50%;
			margin: 0 -47.1% 0 0;
		}
		.movie {
			position: absolute;
			width: 360px;
			height: 200px;
			bottom: 96px;
			right: 50%;
			margin: 0 -46.8% 0 0;
			background: #000
		}
			.movie_thum:after {
				position: absolute;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				background: url(../img/top/movieFrame.png) no-repeat 0 0;
				cursor: pointer;
				content: "";
			}
			.new {
				position: absolute;
				top: -12px;
				left: 16px;
				z-index:1;
			}

			.movie:hover .movie_thum > img {
				opacity: .6 ;
			}

/* BANNER AREA -----------------------------------*/
.bannerArea {
	width: 100%;
	padding: 68px 0 0;
	text-align: center;
}
	.bannerArea ul {
		width: 1160px;
		margin: 0 auto;
		letter-spacing: -.4em;
	}
	.bannerArea li {
		display: inline-block;
		width: 216px;
		height: 60px;
		margin: 0 0 20px 20px;
	}
	.bannerArea li:nth-child( 5n+1 ) {
		margin: 0 0 20px;
	}

/* TOP INTRODUCTION ------------------------------*/
.top_intro {
	position: relative;
	width: 1240px;
	height: 540px;
	margin: 60px auto 80px;
	background: url(../img/top/top_intro_img01.jpg) no-repeat 0 0;
	opacity: 0;
}
	.top_intro_box {
		position: absolute;
		width: 640px;
		height: 278px;
		padding: 60px 0 0;
		top: 160px;
		right: 0;
		text-align: center;
		background: url(../img/top/top_intro_bg01.png) no-repeat 0 0;
		opacity: 0;
	}
		.top_intro_box p a {
			display: block;
			width: 360px;
			height: 80px;
			margin: 30px auto 0;
			line-height: 1;
		}
		.top_intro_box p a:hover {
			opacity: .7;
		}

/* TOP PRODUCT -----------------------------------*/
.top_product{
	width: 100%;
	padding: 80px 0 160px;
	opacity: 0;
}
	.top_product_box {
		position: relative;
		width: 1160px;
		height: 462px;
		margin: 0 auto;
		padding: 59px 0 0;
		background: url(../img/top/top_product_bg01.png) no-repeat 0 0;
	}
		.top_product_box h2 {
			margin: 0 0 37px;
			text-align: center;
		}
		.top_product_title {
			margin: 0 0 40px 400px;
		}
		.top_product_release {
			margin: 0 0 20px 400px;
		}
		.top_product_price {
			margin: 0 0 31px 400px;
		}
		.top_product_box_inner {
			position: absolute;
			width: 700px;
			margin: 0 0 0 400px;
			padding: 30px 0 0;
			border-top: 1px solid rgba(255, 255, 255, .4);
		}
			.top_product_box_inner p {
				color: #fff;
				font-size: 16px;
				line-height: 2;
			}
			.top_product_box_inner p a {
				color: #d4ab32;
				text-decoration: none;
			}
		    .top_product_box_inner p a:hover {
			    text-decoration: underline;
		    }
			.top_product_btn {
				position: absolute;
				width: 200px;
				height: 48px;
				top: 40px;
				right: 0;
			}
			.top_product_btn a:hover {
				opacity: .7;
			}
		.top_product_img {
			position: absolute;
			width: 300px;
			height: 330px;
			top: 130px;
			left: 60px;
		}

/* SNS -------------------------------------------*/
.snsBtn {
	width: 100%;
	padding: 0 0 160px;
}
	.snsBtn ul {
		width: 100%;
		letter-spacing: -.4em;
		text-align: center;
	}
	.snsBtn li {
		display: inline-block;
		margin: 0 12px;
		letter-spacing: normal;
	}
	.snsBtn a:hover {
		opacity: .7;
	}
/* TOP BACKGROUND --------------------------------*/
.background {
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: -1;
}
	.bgPatern {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background: url(../img/top/bg_patern.png);
		z-index: 3;
	}
	.bg01 {
		display: none;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 1;
	}

	.bg01 {
		display: block;
		background: url(../img/top/bg01.jpg) no-repeat 0 0;
		background-size: cover;
		z-index: 2;
	}