@charset "UTF-8";

.lp_wrap .appearance {
  overflow: hidden;
}
.lp_wrap .appearance .wt_icon {
  position: absolute;
  top: 59.5%;
  right: 0%;
  width: 48.698%;
}
.lp_wrap .appearance .wt_icon.trigger img {
  transition: 0.8s;
  opacity: 0;
  transform: translateY(-20%);
}
.lp_wrap .appearance .wt_icon.trigger.move img {
  opacity: 1;
  transform: translateY(0);
}
.lp_wrap .appearance .light1 {
  position: absolute;
  top: -100%;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(22deg, transparent 0%, transparent 20%, rgb(62, 226, 220) 35%, rgb(251, 233, 149) 41%, rgb(248, 187, 228) 47%, rgb(182, 194, 232) 53%, rgb(62, 226, 220) 59%, rgb(251, 233, 149) 65%, transparent 80%);
  mix-blend-mode: soft-light;
  filter: blur(30px);
}
.lp_wrap .appearance .wt_icon.trigger.move ~ .light1 {
  animation: 1.6s appearance_light 0.4s ease-in-out;
}
.lp_wrap .appearance .light2 {
  position: absolute;
  top: -100%;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(42deg, transparent 0%, transparent 20%, rgb(62, 226, 220) 35%, rgb(251, 233, 149) 41%, rgb(248, 187, 228) 47%, rgb(182, 194, 232) 53%, rgb(62, 226, 220) 59%, rgb(251, 233, 149) 65%, transparent 80%);
  mix-blend-mode: soft-light;
  filter: blur(40px);
}
.lp_wrap .appearance .wt_icon.trigger.move ~ .light2 {
  animation: 3s appearance_light 1.2s ease-in-out;
}
@keyframes appearance_light {
  from {
    top: -100%;
  }
  to {
    top: 100%;
  }
}