@charset "UTF-8";

.lp_wrap .choice .octagon {
  position: absolute;
  top: 5.65%;
  left: 0%;
  width: 100%;
  animation: 20s cycle1 linear infinite;
}
.lp_wrap .choice .head {
  position: absolute;
  top: 3.3%;
  left: 0%;
  width: 100%;
}
.lp_wrap .choice .fk {
  position: absolute;
  top: 25.5%;
  left: 26%;
  width: 46.933%;
}
.lp_wrap .choice .fk.trigger img {
  transition: 0.6s;
  opacity: 0;
  transform: translateY(-20%);
}
.lp_wrap .choice .fk.trigger.move img {
  opacity: 1;
  transform: translateY(0);
}
.lp_wrap .choice .hand {
  position: absolute;
  top: 31.7%;
  left: 59.3%;
  width: 52%;
}
.lp_wrap .choice .hand.trigger img {
  transform-origin: 100% 0%;
  transform: translateX(100%) rotate(25deg);
}
.lp_wrap .choice .hand.trigger.move img {
  animation: 2s choice_hand ease-in-out forwards;
}
@keyframes choice_hand {
  0% {
    transform: translateX(100%) rotate(25deg);
  }
  50%, 60% {
    transform: translateX(0%) rotate(5deg);
  }
  80% {
    transform: translateX(0%) rotate(-10deg);
  }
  100% {
    transform: translateX(0%) rotate(0deg);
  }
}
.lp_wrap .choice .slider_wrap {
  position: absolute;
  bottom: 0%;
  left: 0%;
  width: 100%;
}
.lp_wrap .choice .slider_wrap .slick-dots {
  bottom: 84.6%;
  height: 31.364%;
}
.lp_wrap .choice .slider_wrap .slick-dots li {
  display: inline-flex;
  width: 26.667%;
  height: 100%;
  margin: 0 1.6%;
  z-index: 1;
  transition: 0.3s;
  background: url("../image/choice-dots1.png") center center/contain no-repeat;
}
.lp_wrap .choice .slider_wrap .slick-dots li:nth-of-type(2) {
  background: url("../image/choice-dots2.png") center center/contain no-repeat;
}
.lp_wrap .choice .slider_wrap .slick-dots li:nth-of-type(3) {
  background: url("../image/choice-dots3.png") center center/contain no-repeat;
}
.lp_wrap .choice .slider_wrap .slick-dots li.slick-active {
  background: url("../image/choice-dots1-on.png") center center/contain no-repeat;
}
.lp_wrap .choice .slider_wrap .slick-dots li:nth-of-type(2).slick-active {
  background: url("../image/choice-dots2-on.png") center center/contain no-repeat;
}
.lp_wrap .choice .slider_wrap .slick-dots li:nth-of-type(3).slick-active {
  background: url("../image/choice-dots3-on.png") center center/contain no-repeat;
}
.lp_wrap .choice .slick-dotted.slick-slider {
  margin-bottom: 0;
}