*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
p {
  font-weight: normal;
}


img {
  max-width: 100%;
  height: auto;
  display: block;
}
body {
  font-family:"Noto Sans JP", sans-serif; 
  font-size: 100%;
  -webkit-text-size-adjust:100%;
  color:#1A1A1A;
	/* background-color: #009FAF; */
}

video {
  width: 100%;
}

ul,nav,li{
  list-style: none;
}

a {
  text-decoration: none;
}
/* ここまでリセット */

/* js */

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0px);
}

.fadein2 {
  opacity: 0;
  transform : translate(0px, 0px);
  transition : all 1200ms;
  width: 100%;
  margin: 0 auto;
}

.fadein2.scrollin{
  opacity: 1;
  transform: translate(0, 0px);
  width: 100%;
}
/* js */

.bg-white{
	background-color: white;
}


/*========= ローディング画面のためのCSS ===============*/
#splash {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: #009FAF;
	z-index: 99999;
	text-align:center;
	color:#fff;
}

#splash-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50%;
}

@media(max-width:768px){

	#splash-logo {
		width: 80%;
	}

}


#splash-logo  img{
  width: 100%;
	margin: 0 auto;
	text-align: center;
	display: inline-block;
}

/* #splash-logo::after {
	position: absolute;
  top: 0;
	left: 0;
	content: "";
  background-color: yellow;
	width: 100%;
	height: 100%;
	z-index: -1;
} */

.logo-outer{
	position: relative;
	width: 100%;
	margin: 0 auto;
	max-width: 506px;
}

.logo-outer_white-img{
	position: absolute;
	top: 0;
	left: 0;
}

.slide-in {
	overflow: hidden;
}

.slide-in_inner {
	display: inline-block;

}

/*左右のアニメーション*/
/* .leftAnime{
  opacity: 0;
} */

.leftAnimeInner {
	animation-name:slideTextX-100;
	animation-duration:2.8s;
	animation-fill-mode:forwards;
  opacity: 0;
}


@keyframes slideTextX-100 {
  from {
		transform: translateX(-100%); /*要素を左の枠外に移動*/
		opacity: 0;
  }

  to {
	transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}





/*========= 画面遷移のためのCSS ===============*/

/*画面遷移アニメーション*/

.splashbg{
	display: block;
	content: "";
	position:fixed;
	z-index: 999;
		width: 100%;
		height: 100vh;
		top: 0;
	left: 0;
	  background: #009FAF;
}

.splashbg2{
	display: block;
	content: "";
	position:fixed;
	z-index: 999;
		width: 100%;
		height: 100vh;
		top: 0;
	left: 0;
	  background: #009FAF;
}

/*bodyにappearクラスがついたら出現*/
body.appear .splashbg{
    transform: scaleY(0);
		animation-name:PageAnime;
		animation-duration:1.2s;
		animation-timing-function:ease-in-out;
		animation-fill-mode:forwards;
}

@keyframes PageAnime{
	0% {
		transform-origin:bottom;
		transform:scaleY(0);
	}
	50% {
		transform-origin:bottom;
		transform:scaleY(1);
	}
	50.001% {
		transform-origin:top;
	}
	100% {
		transform-origin:top;
		transform:scaleY(0);
	}
}

/*画面遷移の後現れるコンテンツ設定*/
#container{
	/* opacity: 0; */
}

/*bodyにappearクラスがついたら出現*/
body.appear #container{
	animation-name:PageAnimeAppear;
	animation-duration:1s;
	animation-delay: 0.8s;
	animation-fill-mode:forwards;
	opacity: 0;
}

@keyframes PageAnimeAppear{
		0% {
		opacity: 0;
		}
		100% {
		opacity: 1;
	}
}

.d-none{
	display: none;
 }