@charset "UTF-8";

.lp_wrap .change .on li {
  position: absolute;
}
.lp_wrap .change .on li.trigger {
  opacity: 0;
  transition: 0.8s 0.4s ease;
}
.lp_wrap .change .on li.trigger ~ li {
  transform: translateX(-100%);
  transition: 0.6s 0.8s ease;
}
.lp_wrap .change .on li.trigger.move,
.lp_wrap .change .on li.trigger.move ~ li {
  opacity: 1;
  transform: translateX(0);
}
.lp_wrap .change .on li:nth-child(1) {
  top: 0%;
  left: 0%;
  width: 100%;
}
.lp_wrap .change .on li:nth-child(2) {
  top: 15.5%;
  left: 0%;
  width: 64.125%;
}
.lp_wrap .change .icon li {
  position: absolute;
}
.lp_wrap .change .icon li:nth-child(1) {
  top: 59%;
  left: 13%;
  width: 32.875%;
  animation: change-icon 2.0s 0.0s ease infinite;
}
.lp_wrap .change .icon li:nth-child(2) {
  top: 59%;
  right: 14.2%;
  width: 33.875%;
  animation: change-icon 2.0s 1.0s ease infinite;
}
@keyframes change-icon{
  0%,100%{
    transform: translateY(0);
  }
  50%{
    transform: translateY(5%);
  }
}
.lp_wrap .change .yajirushi {
  position: absolute;
  top: 65.5%;
  left: 24.625%;
  width: 50.75%;
}
.lp_wrap .change .red {
  position: absolute;
  top: 72.4%;
  left: 57.5%;
  width: 27.75%;
  animation: change-red 2.0s 1.0s ease infinite;
}
@keyframes change-red{
  0%,100%{
    opacity: 0;
  }
  50%{
    opacity: 1;
  }
}
.lp_wrap .change .problem li {
  position: absolute;
}
.lp_wrap .change .problem li.trigger,
.lp_wrap .change .problem li.trigger ~ li {
  opacity: 0;
  transform: translateY(20%);
  transition: 0.6s;
}
.lp_wrap .change .problem li.trigger.move,
.lp_wrap .change .problem li.trigger.move ~ li {
  opacity: 1;
  transform: translateY(0%);
}
.lp_wrap .change .problem li:nth-child(1) {
  top: 93.5%;
  left: 9%;
  width: 25.125%;
  z-index: 2;
}
.lp_wrap .change .problem li:nth-child(2) {
  top: 93.5%;
  left: 37.375%;
  width: 25.25%;
  z-index: 2;
}
.lp_wrap .change .problem li:nth-child(3) {
  top: 93.5%;
  right: 9%;
  width: 25.125%;
  z-index: 2;
}