@charset "UTF-8";




/* ----------------------------
 == train animation style
---------------------------- */
.train {
	position: absolute;
	top: -110px;
	left: 52%;
	width: 100%;
  -webkit-animation: moveTrain 50s linear 2s;
  -moz-animation: moveTrain 50s linear 2s;
  -ms-animation: moveTrain 50s linear 2s;
  animation: moveTrain 50s linear 2s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.kiteki1 {
 	position: absolute;
 	top: 0;
 	left: 110px;
  -webkit-animation: moveKumo 4s linear 0;
  -moz-animation: moveKumo 4s linear 2s;
  -ms-animation: moveKumo 4s linear 2s;
  animation: moveKumo 4s linear 2s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.kiteki2 {
 	position: absolute;
 	top: 0;
 	left: 110px;
 	opacity: 0;
  -webkit-animation: moveKumo 4s linear 2s;
  -moz-animation: moveKumo 4s linear 4s;
  -ms-animation: moveKumo 4s linear 4s;
  animation: moveKumo 4s linear 4s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.trainPart {
	position: absolute;
	top: 0;
	left: 0;
}
.train1 {
	top: 0;
	left: 0px;
  -webkit-animation: moveTrainPart 4s ease 0;
  -moz-animation: moveTrainPart 4s ease 0;
  -ms-animation: moveTrainPart 4s ease 0;
  animation: moveTrainPart 4s ease 0;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.train2 {
	top: 0;
	left: 102px;
  -webkit-animation: moveTrainPart 3s ease 2s;
  -moz-animation: moveTrainPart 3s ease 2s;
  -ms-animation: moveTrainPart 3s ease 2s;
  animation: moveTrainPart 3s ease 2s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.train3 {
	top: 0;
	left: 158px;
  -webkit-animation: moveTrainPart 4s ease 1s;
  -moz-animation: moveTrainPart 4s ease 1s;
  -ms-animation: moveTrainPart 4s ease 1s;
  animation: moveTrainPart 4s ease 1s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.train4 {
	top: 0;
	left: 243px;
  -webkit-animation: moveTrainPart 4s ease 0;
  -moz-animation: moveTrainPart 4s ease 0;
  -ms-animation: moveTrainPart 4s ease 0;
  animation: moveTrainPart 4s ease 0;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.train5 {
	top: 0;
	left: 328px;
  -webkit-animation: moveTrainPart 4s ease 3s;
  -moz-animation: moveTrainPart 4s ease 3s;
  -ms-animation: moveTrainPart 4s ease 3s;  
  animation: moveTrainPart 4s ease 3s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
 @-webkit-keyframes moveTrainPart {
  0% {
    -webkit-transform: translateY(0);
  }
   45% {
    -webkit-transform: translateY(0);
  }
   50% {
    -webkit-transform: translateY(-2px);
  }
   55% {
    -webkit-transform: translateY(0);
  }
   100% {
    -webkit-transform: translateY(0);
  }
 }
 @-moz-keyframes moveTrainPart {
  0% {
    -moz-transform: translateY(0);
  }
   45% {
    -moz-transform: translateY(0);
  }
   50% {
    -moz-transform: translateY(-2px);
  }
   55% {
    -moz-transform: translateY(0);
  }
   100% {
    -moz-transform: translateY(0);
  }
 }
 @-ms-keyframes moveTrainPart {
  0% {
    -ms-transform: translateY(0);
  }
   45% {
    -ms-transform: translateY(0);
  }
   50% {
    -ms-transform: translateY(-2px);
  }
   55% {
    -ms-transform: translateY(0);
  }
   100% {
    -ms-transform: translateY(0);
  }
 }
 @keyframes moveTrainPart {
  0% {
    transform: translateY(0);
  }
   45% {
    transform: translateY(0);
  }
   50% {
    transform: translateY(-2px);
  }
   55% {
    transform: translateY(0);
  }
   100% {
    transform: translateY(0);
  }
 }

@-webkit-keyframes moveTrain {
  0% {
    -webkit-transform: translateX(0) rotateY(0);
  }
  33% {
    -webkit-transform: translateX(-110%) rotateY(0);
  }
  36% {
    -webkit-transform: translateX(-160%) rotateY(180deg);
  }
  82% {
    -webkit-transform: translateX(10%) rotateY(180deg);
  }
  83% {
    -webkit-transform: translateX(50%) rotateY(0);
  }
   100% {
    -webkit-transform: translateX(0) rotateY(0);
  }
 }
@-moz-keyframes moveTrain {
  0% {
    -moz-transform: translateX(0) rotateY(0);
  }
  33% {
    -moz-transform: translateX(-110%) rotateY(0); 
  }
  36% {
    -moz-transform: translateX(-160%) rotateY(180deg);
  }
  82% {
    -moz-transform: translateX(10%) rotateY(180deg);
  }
  83% {
    -moz-transform: translateX(50%) rotateY(0);
  }
   100% {
    -moz-transform: translateX(0) rotateY(0);
  }
 }
@-ms-keyframes moveTrain {
  0% {
    -ms-transform: translateX(0) rotateY(0);
  }
  33% {
    -ms-transform: translateX(-110%) rotateY(0);
  }
  36% {
    -ms-transform: translateX(-160%) rotateY(180deg);
  }
  82% {
    -ms-transform: translateX(10%) rotateY(180deg);
  }
  83% {
    -ms-transform: translateX(50%) rotateY(0);
  }
   100% {
    -ms-transform: translateX(0) rotateY(0);
  }
 }
@keyframes moveTrain {
  0% {
    transform: translateX(0) rotateY(0);
  }
  33% {
    transform: translateX(-110%) rotateY(0);
  }
  36% {
    transform: translateX(-160%) rotateY(180deg);
  }
  82% {
    transform: translateX(10%) rotateY(180deg);
  }
  83% {
    transform: translateX(50%) rotateY(0);
  }
   100% {
    transform: translateX(0) rotateY(0);
  }
 }

@-webkit-keyframes moveKumo {
  0% {
    -webkit-transform: translateX(-50px);
    opacity: 1;
  }
   50% {
    -webkit-transform: translateX(50px);
    opacity: 0.7;
  }
   100% {
    -webkit-transform: translateX(150px);
    opacity: 0;
  }
 }
@-moz-keyframes moveKumo {
  0% {
    -moz-transform: translateX(-50px);
    opacity: 1;
  }
   50% {
    -moz-transform: translateX(50px);
    opacity: 0.7;
  }
   100% {
    -moz-transform: translateX(150px);
    opacity: 0;
  }
 }
 @-ms-keyframes moveKumo {
  0% {
    -ms-transform: translateX(-50px);
    opacity: 1;
  }
   50% {
    -ms-transform: translateX(50px);
    opacity: 0.7;
  }
   100% {
    -ms-transform: translateX(150px);
    opacity: 0;
  }
 }
 @keyframes moveKumo {
  0% {
    transform: translateX(-50px);
    opacity: 1;
  }
   50% {
    transform: translateX(50px);
    opacity: 0.7;
  }
   100% {
    transform: translateX(150px);
    opacity: 0;
  }
 }

#pageTopAncer {
  -webkit-animation: moveTopkun 4s ease 1s;
  -moz-animation: moveTopkun 4s ease 1s;
  -ms-animation: moveTopkun 4s ease 1s;
  animation: moveTopkun 4s ease 1s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@-webkit-keyframes moveTopkun {
  0% {
    -webkit-transform: translateY(0);
  }
   50% {
    -webkit-transform: translateY(20px);
  }
   100% {
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes moveTopkun {
  0% {
    -moz-transform: translateY(0);
  }
   50% {
    -moz-transform: translateY(20px);
  }
   100% {
    -moz-transform: translateY(0);
  }
}
@-ms-keyframes moveTopkun {
  0% {
    -ms-transform: translateY(0);
  }
   50% {
    -ms-transform: translateY(20px);
  }
   100% {
    -ms-transform: translateY(0);
  }
}
@keyframes moveTopkun {
  0% {
    transform: translateY(0);
  }
   50% {
    transform: translateY(20px);
  }
   100% {
    transform: translateY(0);
  }
}










