@charset "utf-8";
picture{
  display:block;
  font-size:0;
}

#splash {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background: url("../img/index/loading_bg_50th.png") center;
	background-size: 416px auto;
  text-align:center;
  color:#fff;
	opacity: 0;
}
.loadiiing #splash {
	opacity: 1;
}
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40.776%;
  transform: translate(-50%, -50%);
}
.logo_fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@media screen and (max-width: 767px) {
	#splash {
	}
	#splash_logo {
    width:69.733%;
  }
	#splash_logo img {
  }
}


.contents{
	width: 100%;
  height:100vh;
  overflow: hidden;
	transition: opacity .4s;
	opacity: 0;
}
.contents.view{
  height:auto;
  overflow: inherit;
	opacity: 1;
}/**/

body #foot{
	display: none;
}
body.loaded #foot{
	display: block;
}
body h1{
	display: none;
}
body.loaded h1{
	display: block;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}