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

.fadein{
	opacity: 0;
	transform: translate(0,30px); 
	-webkit-transform: translate(0,30px);
	transition: 2.0s;
}
.fadein_txt{
	opacity: 0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
	transition: 2.0s;
}
.fadein-left{
	opacity: 0;
	transform: translate(-90%,0); 
	-webkit-transform: translate(-90%,0);
	transition: 1.5s;
}
.fadein-right{
	opacity: 0;
	transform: translate(90%,0); 
	-webkit-transform: translate(90%,0);
	transition: 1.5s;
}
.fadein-big{
	opacity: 0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
	transition: 2.0s;
	transform: scale(1.3);
}
.fadein-small{
	opacity: 0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
	transition: 2.0s;
	transform: scale(0.7);
}
.fadein-i{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
	transform: scale(1);
}
.fadein-bound{
	opacity: 0;
}
.fadein-bound-move{
  -webkit-animation: bound 1s ease 0.3s 1 forwards;
  animation: bound 1s ease 0.3s 1 forwards;
}


@media screen and (orientation: landscape) {
.anm001 {
  -webkit-animation: titlefade 5s ease 1s 1 forwards;
  animation: titlefade 5s ease 1s 1 forwards;
    opacity: 0;
}
.anm002{
  -webkit-animation: fade001 3s ease 5s 1 forwards;
  animation: fade001 3s ease 5s 1 forwards;
    opacity: 0;
}
}
@media screen and (orientation: portrait) {
   /* 縦向きの場合のスタイル */
.anm001 {
  -webkit-animation: fade001 2.5s ease 1s 1 forwards;
  animation: fade001 2.5s ease 1s 1 forwards;
    opacity: 0;
}
.anm002{
  -webkit-animation: fade001 3s ease 3.5s 1 forwards;
  animation: fade001 3s ease 3.5s 1 forwards;
    opacity: 0;
}
.anm003{
  -webkit-animation: fade001 5s ease 5s 1 forwards;
  animation: fade001 5s ease 5s 1 forwards;
    opacity: 0;
	position:relative;
	z-index:200;
}
}

@-webkit-keyframes titlefade {
  0% {
    opacity: 0;
  }
  35% {
    opacity: 1;
	transform: scale(1);
  }
  45% {
    opacity: 1;
	transform: scale(0.8);
  }
  100% {
    opacity: 0;
	transform: scale(3);
  }
  }
@keyframes titlefade {
  0% {
    opacity: 0;
  }
  35% {
    opacity: 1;
	transform: scale(1);
  }
  45% {
    opacity: 1;
	transform: scale(0.8);
  }
  100% {
    opacity: 0;
	transform: scale(3);
  }
  }
@-webkit-keyframes fade001 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
  }
@keyframes fade001 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes bound {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 1;
	transform: scale(1.2);
  }
  80% {
    opacity: 1;
	transform: scale(1);
  }
  90% {
    opacity: 1;
	transform: scale(1.2);
  }
  100% {
    opacity: 1;
	transform: scale(1);
  }
  }
@keyframes bound {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 1;
	transform: scale(1.2);
  }
  80% {
    opacity: 1;
	transform: scale(1);
  }
  90% {
    opacity: 1;
	transform: scale(1.2);
  }
  100% {
    opacity: 1;
	transform: scale(1);
  }
  }