@charset "UTF-8";

.lp_wrap .intro .hydrav {
  position: absolute;
  top: 26.9%;
  left: 0;
  width: 33.333%;
}
.lp_wrap .intro .hydrav.trigger img {
  transition: 1s 0.5s;
  transform: translateY(0);
}
.lp_wrap .intro .hydrav.trigger.move img {
  transform: translateY(-110%);
}
.lp_wrap .intro .hydraex {
  position: absolute;
  top: 26.9%;
  left: 33.334%;
  width: 33.333%;
}
.lp_wrap .intro .hydrav.trigger ~ .hydraex img {
  transition: 1s 0.9s;
  transform: translateY(0);
}
.lp_wrap .intro .hydrav.trigger.move ~ .hydraex img {
  transform: translateY(-110%);
}
.lp_wrap .intro .hydraaz {
  position: absolute;
  top: 26.9%;
  right: 0;
  width: 33.333%;
}
.lp_wrap .intro .hydrav.trigger ~ .hydraaz img {
  transition: 1s 1.3s;
  transform: translateY(0);
}
.lp_wrap .intro .hydrav.trigger.move ~ .hydraaz img {
  transform: translateY(-110%);
}
.lp_wrap .intro .item1 {
  position: absolute;
  top: 31.75%;
  left: 0;
  width: 38.667%;
}
.lp_wrap .intro .hydrav.trigger ~ .item1 img {
  transition: 0.8s 0.5s;
  transform: translateY(0);
  opacity: 1;
}
.lp_wrap .intro .hydrav.trigger.move ~ .item1 img {
  transform: translateY(100%);
  opacity: 0;
}
.lp_wrap .intro .item2 {
  position: absolute;
  top: 47.3%;
  left: 26.8%;
  width: 48.133%;
}
.lp_wrap .intro .hydrav.trigger ~ .item2 img {
  transition: 0.8s 0.9s;
  transform: translateY(0);
  opacity: 1;
}
.lp_wrap .intro .hydrav.trigger.move ~ .item2 img {
  transform: translateY(100%);
  opacity: 0;
}
.lp_wrap .intro .item3 {
  position: absolute;
  top: 31.95%;
  right: 0;
  width: 38.267%;
}
.lp_wrap .intro .hydrav.trigger ~ .item3 img {
  transition: 0.8s 1.3s;
  transform: translateY(0);
  opacity: 1;
}
.lp_wrap .intro .hydrav.trigger.move ~ .item3 img {
  transform: translateY(100%);
  opacity: 0;
}
.lp_wrap .intro .head {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
}