@charset "utf-8";

/* sec0Top
====================================================*/
div#sec0Top{}
/*  loadig
--------------------------*/
/*logo*/
div#logo{
	width:100%;
	height:100vh;
	position:fixed;
	top:0;
	left:0;
	text-align:center;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	align-content:center;
	z-index:9999;
	animation-name:logo;
	animation-delay:10.0s;
	animation-duration:0.2s;
	animation-timing-function:ease-in-out;
	animation-iteration-count:1;
	animation-direction:normal;
	animation-fill-mode:forwards;
	animation-play-state:running;
}
@keyframes logo{
	0%{opacity:1;top:0;}
	50%{opacity:0;top:0;}
	100%{opacity:0;top:-100vh;}
}
div#logo div{
	width:100%;
	height:auto;
	position:relative;
}
div#logo img{
	width:80vw;
	height:auto;
	min-width:260px;
	margin:0 auto 100px auto;
	display:block;
}
/*text*/
div#text {
	width:100%;
	text-align:center;
	color:#fff;
	letter-spacing:3px;
	text-align:center;
	animation-name:text;
	animation-duration:10s;
	animation-timing-function:ease-in-out;
	animation-iteration-count:1;
	animation-direction:normal;
	animation-fill-mode:forwards;
	animation-play-state:running;
}
@keyframes text {
	0% {opacity:0;}
	50% {opacity:1;}
	60% {opacity:1;}
	100% {opacity:0;}
}
div#text span{
	letter-spacing:2px;
}
.dot {
	height:2px;
	width:2px;
	display:inline-block;
	margin-left:-4px;
	background:#fff;
	animation:dots 1.5s infinite ease-in-out;
}
.dot:nth-child(2) {animation-delay:0.5s;}
.dot:nth-child(3) {animation-delay:1s;}
@keyframes dots {
	0% {opacity:0.2; transform:scale(1,1);}
	50% {opacity:1; transform:scale(1.0,1.0);}
	100% {opacity:0.2; transform:scale(1,1);}
}
/*background*/
div#loading span{
	width:100%;
	height:100vh;
	position:fixed;
	top:0;
	left:0;
	margin:0;
	display:block;
	animation-duration:0.8s;
	animation-timing-function:ease-in-out;
	animation-iteration-count:1;
	animation-direction:normal;
	animation-fill-mode:forwards;
	animation-play-state:running;
}
/*1:bg*/
div#loading span:nth-child(1){
	background:#222;
	z-index:3;
	animation-name:loading1;
	animation-delay:10.0s;
}

@keyframes loading1{
	0%{opacity:1;top:0;}
	50%{opacity:0;top:0;}
	100%{opacity:0;top:-100vh;}
}
/*2:bg*/
div#loading span:nth-child(2){
	background:#666;
	z-index:2;
	animation-name:loading2;
	animation-delay:10.4s;
}
@keyframes loading2{
	0%{opacity:1;top:0;}
	50%{opacity:1;top:-100vh;}
	100%{opacity:0;top:-100vh;}
}
/*3:bg*/
div#loading span:nth-child(3){
	background:#222;
	z-index:1;
	animation-name:loading3;
	animation-delay:10.7s;
}
@keyframes loading3{
	0%{opacity:0.8;top:0;}
	50%{opacity:0.8;top:-100vh;}
	100%{opacity:0;top:-100vh;}
}

/*  fullScreen
--------------------------*/
div#fullScreen{
	width:100%;/*heightはindex.jsで制御*/
	position:relative;
	/*background: transparent url(../img/pattern.png) repeat top 0 left 0;*/
	background-image: url("../img/sec07Bg.jpg");
	background-size: cover;
	background-position:center;
}
/* h2 */
div.secBlock h1{
	width:300px;
	height:auto;
	position:fixed;
	top: 50%;
	left:50%;
	margin-top:-50px;
	margin-left:-150px;
	display:block;
}
div.secBlock h1 img{
	width:100%;
	height:auto;
	display:block;
}
/* apollo logo */
div.secBlock span:nth-child(1){
	width:60px;
	height:auto;
	position:fixed;
	top: 50%;
	left:50%;
	margin-top:-120px;
	margin-left:-30px;
	z-index:1;
}
div.secBlock img#apolloLogo{
	width:100%;
	height:auto;
	display:block;
	animation: motion1 0.4s infinite;
}
@keyframes motion1{
	0% {
		transform: translate(1px, 1px);
	}
	25% {
		transform: translate(1px, -1px);
	}
	50% {
		transform: translate(-1px, -1px);
	}
	75% {
		transform: translate(-1px, 1px);
	}
	100% {
		transform: translate(1px, 1px);
	}
}
div.secBlock p > span:nth-child(2){
	width:auto;
	height:auto;
	position:fixed;
	bottom:30px;
	right:25px;
	line-height:1.4;
	text-align:right;
	font-size:20px;
	letter-spacing:2px;
	color:#f5e933;
	display:block;
}
/*  indexSNSLinks
--------------------------*/
ul#indexSNSLinks{
	width:150px;
	height:auto;
	top:0;
	right:10px;
	position:fixed;
	text-align:center;
	display:flex;
	flex-wrap: wrap;
}
ul#indexSNSLinks li{
	width:33.33%;
	height:auto;
}
ul#indexSNSLinks li a{
	width:100%;
	height:50px;
	display:flex;
	flex-wrap: wrap;
	align-items: center;
}
ul#indexSNSLinks li a img{
	width:auto;
	height:25px;
	margin:0 auto;
	display:block;
}
ul#indexSNSLinks li:nth-child(2) a img{
	width:auto;
	height:29px;
	margin:0 auto;
	display:block;
}
/*  register
--------------------------*/
ul#members{
	width:400px;
	height:auto;
	position:fixed;
	top:50%;
	left:50%;
	margin-top:80px;
	margin-left:-200px;
	text-align:center;
	font-size:14px;
	letter-spacing:3px;
	display:block;
}
ul#members li{
	width:48%;
	height:auto;
	font-size:14px;
	letter-spacing:3px;
	display:inline-block;
}
ul#members li a{
	color:#fff;
}
/*  copyright
--------------------------*/
p#copyright{
	width:100%;
	position:absolute;
	bottom:2px;
	left:0;
	margin:0;
	text-align:center;
	display:block;
}
p#copyright small{
	font-size:12px;
	color:#fff;
	letter-spacing:1px;
}