@charset "UTF-8";

.lp_wrap .offer {
  background: url(../image/offer_bg.png) no-repeat center top/ 100%;
}



.lp_wrap .offer .item {
  position: absolute;
  top: 13.4%;
  left: 52.7%;
  width: 44.9333%;
  transition: 0.6s;
  opacity: 0;
  transform: translateY(20%);
}

.lp_wrap .offer .item.trigger.move {
  opacity: 1;
  transform: translateY(0);
}

.lp_wrap .offer .name {
  position: absolute;
  top: 36.3%;
  left: 60.7%;
  width: 30.1333%;
  z-index: 1;
  transition: 0.8s 0.4s;
  clip-path: inset(0 100% 0 0);
}

.lp_wrap .offer .item.trigger.move~.name {
  clip-path: inset(0);
}

.lp_wrap .offer .marker {
  position: absolute;
  top: 38.45%;
  left: 59.6%;
  width: 34.14333%;
  transition: 0.6s 0.8s;
  clip-path: inset(0 100% 0 0);
}

.lp_wrap .offer .item.trigger.move~.marker {
  clip-path: inset(0);
}

.lp_wrap .offer .btn {
  position: absolute;
  top: 53.1%;
  left: 8.2%;
  max-width: 83.4666%;
  width: 100%;
  animation: 2s offer_btn ease-in-out infinite;
}
.lp_wrap .offer .btn2 {
  position: absolute;
  top: 24.8%;
  left: 8.2%;
  max-width: 83.4666%;
  width: 100%;
  animation: 2s offer_btn ease-in-out infinite;
}

@keyframes offer_btn {

  0%,
  20%,
  100% {
    transform: scale(1);
  }

  10% {
    transform: scale(0.92);
  }
}

.cashback-link {
  position: absolute;
  bottom: min(calc(800 / 750 * 100vw), 800px);
  width: min(calc(508 / 750 * 100vw), 508px);
  left: 50%;
  transform: translateX(-50%);
}

/* モーダルの背景 */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.6);
}

.modal-content {
  position: fixed;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  width: min(calc(700 / 750 * 100vw), 700px);
  height: min(calc(657 / 750 * 100vw), 657px);
  padding:
    min(calc(36 / 750 * 100vw), 36px) min(calc(4 / 750 * 100vw), 4px) min(calc(50 / 750 * 100vw), 50px) min(calc(34 / 750 * 100vw), 34px);
  overflow: hidden;
  z-index: 1001;
  box-sizing: border-box;
}

.modal-txt {
  overflow-y: auto;
  height: calc(min(calc(600 / 750 * 100vw), 600px));
  padding-right: min(calc(47 / 750 * 100vw), 47px);
}

.close {
  color: #aaa;
  position: fixed;
  top: min(calc(7 / 750 * 100vw), 7px);
  left: min(calc(10 / 750 * 100vw), 10px);
  font-size: min(calc(18 / 750 * 100vw), 18px);
  font-weight: bold;
  cursor: pointer;
  line-height: 1;
  z-index: 2001;
}

.close:hover {
  color: #000;
}

/* テキスト部分 */
.modal-content h2 {
  text-align: center;
  margin-bottom: min(calc(20 / 750 * 100vw), 20px);
}

.modal-content p {
  line-height: 1.6;
  margin-bottom: min(calc(24 / 750 * 100vw), 24px);
  font-size: min(calc(15 / 750 * 100vw), 15px);
  letter-spacing: -0.06em;
}

.lp_wrap .offer.offer_normal {
  z-index: 1;
  margin-bottom: -11%;
  background: none;
}

.lp_wrap .offer.offer_normal .btn {
  position: absolute;
  top: 79.5%;
  left: 8.2%;
  width: 83.4666%;
  animation: 2s offer_btn ease-in-out infinite;
}