@charset "UTF-8";

.lp_wrap .area {
  overflow: hidden;
  clip-path: inset(0%);
}
.lp_wrap .hydra_v .inner {
  height: min(6350px, 846.7dvw);
  height: min(6350px, 846.7vw);
}
.lp_wrap .area::before {
  content: "";
  display: block;
  position: fixed;
  top: 0%;
  width: 100%;
  max-width: 750px;
  height: 100vh;
  height: 100dvh;
  z-index: -1;
}
.lp_wrap .hydra_v .inner.area::before {
  background: url("../image/hydra-v-bg.jpg") 50% center/cover no-repeat;
}
.lp_wrap .inner .clip {
  position: relative;
}
.lp_wrap .inner .clip .cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
}
.lp_wrap .hydra_v .slider_wrap {
  position: absolute;
  top: 29.94%;
  left: 0%;
  width: 100%;
  z-index: 1;
}
.lp_wrap .hydra_v .slider_wrap img {
  width: 93.81%;
  margin: auto;
}
.lp_wrap .hydra_v .slider_wrap .slick-slide {
  position: relative;
}
.lp_wrap .hydra_v .plant {
  position: absolute;
  top: 12.4%;
  left: 13.6%;
  width: 72.76%;
}
.lp_wrap .hydra_v .deco1 {
  position: absolute;
  top: 18.6%;
  left: -2.9%;
  width: 40.273%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco2 {
  position: absolute;
  top: 36.5%;
  left: 69.2%;
  width: 32.32%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco3 {
  position: absolute;
  top: 38%;
  left: -0.2%;
  width: 41.12%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco4 {
  position: absolute;
  top: 27%;
  left: 74.4%;
  width: 26.737%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco5 {
  position: absolute;
  top: 16%;
  left: 17.1%;
  width: 12.354%;
  animation: 1.6s deco1 -1.2s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco6 {
  position: absolute;
  top: 3%;
  left: 10.4%;
  width: 26.737%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco7 {
  position: absolute;
  top: 28%;
  left: 67.2%;
  width: 35.365%;
  animation: 1.6s deco1 -0.6s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco8 {
  position: absolute;
  top: 34%;
  left: -1.7%;
  width: 44.842%;
  animation: 1.6s deco1 -1.2s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco9 {
  position: absolute;
  top: 9%;
  left: -0.2%;
  width: 33.334%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco10 {
  position: absolute;
  top: 38%;
  left: 69%;
  width: 32.828%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco11 {
  position: absolute;
  top: 25%;
  left: 67.9%;
  width: 33.165%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco12 {
  position: absolute;
  top: 5%;
  left: 7%;
  width: 30.29%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco13 {
  position: absolute;
  top: 37%;
  left: -0.1%;
  width: 38.242%;
  animation: 1.6s deco1 -1.2s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco14 {
  position: absolute;
  top: 9.3%;
  left: -2.7%;
  width: 42.642%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco15 {
  position: absolute;
  top: 29.8%;
  left: 60.7%;
  width: 42.642%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco16 {
  position: absolute;
  top: 9%;
  left: 0.2%;
  width: 32.319%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco17 {
  position: absolute;
  top: 36%;
  left: 68.4%;
  width: 32.151%;
  animation: 1.6s deco1 -0.6s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco18 {
  position: absolute;
  top: 45%;
  left: 6.7%;
  width: 18.106%;
  animation: 1.6s deco1 -1.2s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco19 {
  position: absolute;
  top: 13%;
  left: 0.8%;
  width: 33.505%;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco20 {
  position: absolute;
  top: 39%;
  left: 66.8%;
  width: 33.505%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .slider_wrap .slick-arrow {
  position: absolute;
  top: 103.5%;
  width: 28.428%;
  z-index: 1;
}
.lp_wrap .hydra_v .slider_wrap .slick-arrow.prev {
  left: 22.1%;
}
.lp_wrap .hydra_v .slider_wrap .slick-arrow.next {
  right: 20.2%;
}
.lp_wrap .hydra_v .deco li {
  position: absolute;
  z-index: 1;
}
.lp_wrap .hydra_v .deco li:nth-child(1) {
  top: 44.9%;
  left: 65.5%;
  width: 42.9333%;
  z-index: 2;
  animation: 1.6s deco1 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco li:nth-child(2) {
  top: 60.03%;
  left: -12.3%;
  width: 40%;
  animation: 1.6s deco1 -0.9s ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .deco li img {
  animation: 1.2s deco2 ease-in-out alternate infinite;
}
.lp_wrap .hydra_v .movie1 {
  position: absolute;
  top: 56.38%;
  right: 0;
  width: 88%;
  z-index: 1;
}
.lp_wrap .hydra_v .copy {
  position: absolute;
  top: 57.45%;
  left: 15.7%;
  width: 24.133%;
  z-index: 1;
}
.lp_wrap .hydra_v .photo {
  position: absolute;
  top: 45%;
  left: 0;
  width: 80%;
  z-index: 1;
}
.lp_wrap .hydra_v .let li {
  position: absolute;
  z-index: 2;
}
.lp_wrap .hydra_v .let li:nth-child(1) {
  top: 47.42%;
  left: 84.3%;
  width: 10%;
  transition: 0.6s;
  clip-path: inset(0 0 100% 0);
}
.lp_wrap .hydra_v .let li:nth-child(2) {
  top: 47.68%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.1s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(3) {
  top: 48.41%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.2s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(4) {
  top: 49.1%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.3s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(5) {
  top: 49.83%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.4s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(6) {
  top: 50.5%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.5s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(7) {
  top: 51.22%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.6s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(8) {
  top: 51.89%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.7s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(9) {
  top: 52.58%;
  left: 86.4%;
  width: 5.467%;
  transition: 0.6s 0.8s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(10) {
  top: 49.45%;
  left: 74.4%;
  width: 10%;
  transition: 0.6s 0.9s;
  clip-path: inset(0 0 100% 0);
}
.lp_wrap .hydra_v .let li:nth-child(11) {
  top: 49.78%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(12) {
  top: 50.48%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1.1s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(13) {
  top: 51.17%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1.2s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(14) {
  top: 51.88%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1.3s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(15) {
  top: 52.7%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1.4s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(16) {
  top: 53.35%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1.5s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li:nth-child(17) {
  top: 53.98%;
  left: 76.5%;
  width: 5.467%;
  transition: 0.6s 1.6s;
  opacity: 0;
}
.lp_wrap .hydra_v .let li.trigger.move,
.lp_wrap .hydra_v .let li.trigger.move ~ li {
  clip-path: inset(0);
  opacity: 1;
}
.lp_wrap .hydra_v .circle {
  position: absolute;
  top: 66.82%;
  left: -12.5%;
  width: 119.067%;
  z-index: 1;
  animation: 3s hydra_v_circle ease-in-out alternate infinite;
}
@keyframes hydra_v_circle {
  from {
    transform: scale(0.85);
  }
  to {
    transform: scale(1);
  }
}
.lp_wrap .hydra_v .circle img {
  animation: 20s cycle1 linear infinite;
}
.lp_wrap .hydra_v .point2 {
  position: absolute;
  top: 65.51%;
  left: 1.8%;
  width: 96.4%;
  z-index: 1;
}
.lp_wrap .hydra_v .movie2 {
  position: absolute;
  top: 84.27%;
  left: 10%;
  width: 80%;
  z-index: 1;
}
.lp_wrap .hydra_v .icon {
  position: absolute;
  top: 83.37%;
  left: 61.7%;
  width: 35.733%;
  z-index: 1;
}
.lp_wrap .hydra_v .icon.trigger img {
  transition: 0.6s;
  opacity: 0;
  transform: translateY(-20%);
}
.lp_wrap .hydra_v .icon.trigger.move img {
  opacity: 1;
  transform: translateY(0);
}
.lp_wrap .hydra_v .arrow {
  position: absolute;
  top: 87.65%;
  left: 22.8%;
  width: 33.067%;
  z-index: 1;
}