@charset "UTF-8";

.lp_wrap .last .photo {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
}
.lp_wrap .last .photo .overlay {
  position: absolute;
  inset: 0%;
}
@property --last_photo {
  syntax: "<number>";
  inherits: false;
  initial-value: -0.3;
}
.lp_wrap .last.trigger .photo img {
  --last_photo: -0.3;
  transition: --last_photo 2s;
}
.lp_wrap .last.trigger.move .photo img {
  --last_photo: 1.4;
}
.lp_wrap .last.trigger .photo .base {
  -webkit-mask: radial-gradient(circle at 0% 0%, #000000 calc(var(--last_photo) * 100%), transparent calc(var(--last_photo) * 100% + 30%));
  mask: radial-gradient(circle at 0% 0%, #000000 calc(var(--last_photo) * 100%), transparent calc(var(--last_photo) * 100% + 30%));
}
.lp_wrap .last.trigger .photo .overlay {
  filter: brightness(200%);
  -webkit-mask: radial-gradient(circle at 0% 0%, transparent calc(var(--last_photo) * 100% - 30%), #000000 calc(var(--last_photo) * 100%), transparent calc(var(--last_photo) * 100% + 30%));
  mask: radial-gradient(circle at 0% 0%, transparent calc(var(--last_photo) * 100% - 30%), #000000 calc(var(--last_photo) * 100%), transparent calc(var(--last_photo) * 100% + 30%));
}
.lp_wrap .last .on {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
}
.lp_wrap .last .head {
  position: absolute;
  top: 8%;
  left: 7.6%;
  width: 13.333%;
}
.lp_wrap .last.trigger .head {
  transition: 0.6s 0.6s;
  transform: translateY(5%);
  opacity: 0;
}
.lp_wrap .last.trigger.move .head {
  transform: translateY(0%);
  opacity: 1;
}