@charset "utf-8";
/* CSS Document */

/************************************************************************************
HTML,BODY
*************************************************************************************/
html,body {
	width:100%;
	height:100%;
	min-height:100%; /* html fit brows */
	overflow-x:hidden;
	overflow-y:hidden;
}
html>/**/body {   /* for Firefox */
	overflow-y:hidden; !important
}
body {
	text-align:center;
	font-size:75%;/*12px*/
	line-height:150%;
	font-family:'Raleway','メイリオ','Meiryo','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','sans-serif';
	background-color:#000;
}

/************************************************************************************
WELCOME
*************************************************************************************/
#welcome {
	width:100%;
	height:100%;
	background-color:#ffffff;
	position:absolute; top:0px;
	left:0px;
	z-index:9998;
	display:none;
}
#welcome img {
	width:300px;
	height:73px;
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-150px;
	margin-top:-36.5px;
}
.QOverlay {
	background-color: #000000;
	z-index: 9999;
}
.QLoader {
	background-color: #CCCCCC;
	height: 1px;
}

/************************************************************************************
CONTAINER
*************************************************************************************/
#container {
	width:100%;
	height:100%;
	min-height:100%; /* html fit brows */
	margin:0 auto;
	overflow-x:hidden;
	overflow-y:hidden;
	display:none;
}

/************************************************************************************
ANIMATION
*************************************************************************************/
.animation {
	z-index:0;
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}
.animation div{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}
.animation div img{
	width:100%;
	height:auto;
}

/************************************************************************************
BG
*************************************************************************************/
.bg {
	width:100%;
	height:auto;
	min-width:320px;
	min-height:100%;
    z-index: 0;
    position:fixed;
}

/************************************************************************************
VIDEO
*************************************************************************************/
video {
	position:fixed;
	right:0;
	bottom:0;
	/*min-width:100%;
	min-height:100%;*/
	width:100%;
	height:100%;
	z-index:0;
}
/************************************************************************************
PLAY
*************************************************************************************/
p#playButton {
	width:256px;
	height:256px;
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-128px;
	margin-left:-128px;
	z-index:-1;
}
/************************************************************************************
NAV
*************************************************************************************/
a.ghostButton {
	width:240px;
	color:#ffffff;
	text-align:center;
	line-height:30px;
	padding:10px 30px;
	margin:24px auto 0;
	background-color:transparent;
	border:2px #fff solid;
	border-radius:1px;
	box-shadow:0px 0px 6px 1px rgba(0,0,0,0.1);
	cursor:pointer;
	transition:all 0.4s;
	-webkit-transition:all 0.4s;
	display:block;
	opacity:0.5;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	
	text-decoration:none;
	font-size:16px;
	font-weight:300;
	position:absolute;
	bottom:10%;
	left:50%;
	margin-left:-152px;
	
}
a.ghostButton:hover {
	opacity:1.0;
	filter:alpha(opacity=100);
	-moz-opacity:1.0;
}