@charset "UTF-8";

.lp_wrap .repeat .graph {
  position: absolute;
  top: 39.9%;
  left: 19.3%;
  width: 61.3333%;
  opacity: 0.8;
  aspect-ratio: 1 / 1;
}
.lp_wrap .repeat .graph svg {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transform:rotate(-90deg);
}
.lp_wrap .repeat .graph svg circle {
  fill: transparent;
  stroke: #e5015a;
  stroke-width: 30;
  stroke-dasharray: 1600;
  stroke-dashoffset: 1600;
}
.lp_wrap .repeat .graph.trigger.move svg circle {
  animation: 1.6s repeat_graph ease-in-out forwards;
}
@keyframes repeat_graph {
  0% {
    stroke-dashoffset: 1600;
  }
  100%{
    stroke-dashoffset: 340;
  }
}
.lp_wrap .repeat .fk li {
  position: absolute;
  opacity: 0;
  transform: translateY(10%);
}
.lp_wrap .repeat .fk li:nth-child(1) {
  top: 37.4%;
  left: 6.7%;
  width: 29.333%;
  transition: 0.6s;
}
.lp_wrap .repeat .fk li:nth-child(2) {
  top: 43.86%;
  left: 66.7%;
  width: 29.333%;
  transition: 0.6s 0.3s;
}
.lp_wrap .repeat .fk li:nth-child(3) {
  top: 66.6%;
  left: 11.3%;
  width: 33.333%;
  transition: 0.6s 0.6s;
}
.lp_wrap .repeat .fk li:nth-child(4) {
  top: 72.55%;
  left: 53.3%;
  width: 29.333%;
  transition: 0.6s 0.9s;
}
.lp_wrap .repeat .fk li.trigger.move,
.lp_wrap .repeat .fk li.trigger.move ~ li {
  opacity: 1;
  transform: translateY(0);
}