@charset "UTF-8";

html {
  font-size: 62.5%;
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  background-color: #001c63;
  font-family: var(--ui-font);
}

img {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
}

/* 読み込み中画面 */
.loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  height: 100dvh;
  width: 100%;
  font-size: clamp(
    14px,
    calc(28px / var(--max-design-width) * 100vw),
    calc(28px * var(--scale))
  );
  color: #fff;
  font-weight: 700;
  background-color: #001c63;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  overflow: hidden;
  touch-action: none;
  overscroll-behavior: none;
  pointer-events: auto;
}

body.loading-active {
  overflow: hidden !important;
  touch-action: none !important;
  overscroll-behavior: none !important;
}

.bold {
  font-weight: 700;
}

.container {
  max-width: 500px;
  margin: auto;
  min-height: 100vh;
}
.layout-inner {
  width: 90%;
  margin: 0 auto;
}
.layout-inner--wide {
  width: 90%;
  margin: 0 auto;
}

.hero__bg {
  background-image: url("../img/bg.jpg");
  background-size: 100% 100%;
  padding-bottom: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
}
.hero__title {
  width: 110%;
  margin-left: -5%;
}
.hero__description {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: clamp(
    10px,
    calc(20px / var(--max-design-width) * 100vw),
    calc(20px * var(--scale))
  );
}
.hero__description--text {
  font-size: clamp(
    12px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  color: #011b63;
  position: absolute;
  top: 37%;
  left: 50%;
  transform: translate(-50%, -40%);
  margin: 0;
  width: 100%;
  text-align: center;
  z-index: 2;
  font-weight: 600;
  line-height: 1.5;
}
.hero__frame {
  display: block;
  width: 100%;
  height: auto;
  z-index: 1;
}
.hero__description--num {
  font-size: clamp(
    20px,
    calc(48px / var(--max-design-width) * 100vw),
    calc(48px * var(--scale))
  );
}
.hero__description--unit {
  font-size: clamp(
    14px,
    calc(36px / var(--max-design-width) * 100vw),
    calc(36px * var(--scale))
  );
}
.hero__description--emphasis {
  font-size: clamp(
    16px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
}
.hero__target-products {
  padding-top: 10px;
}

/* スキャン方法・応募履歴セクション */
.info-section {
  background-image: url(../img/info-section_bg.jpg);
  background-size: cover;
  background-position: center;
  min-height: 800px; /* 最小高さを確保してレイアウトシフト防止 */
  padding: clamp(
      60px,
      calc(120px / var(--max-design-width) * 100vw),
      calc(120px * var(--scale))
    )
    0;
}
.info-section__howto-scan {
  background: linear-gradient(
    110deg,
    #fff5cb 0%,
    #ffffff 30%,
    #ffffff 70%,
    #fff5cb 100%
  );
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    60px,
    calc(140px / var(--max-design-width) * 100vw),
    calc(140px * var(--scale))
  );
  padding-bottom: clamp(
    40px,
    calc(80px / var(--max-design-width) * 100vw),
    calc(80px * var(--scale))
  );
  box-shadow: 15.32px 12.85px 20px 0px #b57e1c;
}

.section__title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.info-section__howto-scan-title {
  width: 85%;
  top: -5%;
}

.info-section__howto-scan-item {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  align-items: center;
  gap: 11.3%;
  padding-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  width: 90%;
  margin: 0 auto;
}
.info-section__howto-scan-desc {
  font-size: clamp(
    16px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

.info-section__howto-scan-point {
  display: flex;
  flex-direction: column;
  align-items: center;
  column-gap: 30px;
  border-top: 2px solid #083e8e;
  width: 91%;
  margin: 0 auto;
  margin-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  padding-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
}
.info-section__howto-scan-point-title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #003f98;
}
.info-section__howto-scan-point-list {
  font-size: clamp(
    14px,
    calc(24px / var(--max-design-width) * 100vw),
    calc(24px * var(--scale))
  );
  font-weight: 600;
  line-height: 1.3;
  padding-top: clamp(
    15px,
    calc(30px / var(--max-design-width) * 100vw),
    calc(30px * var(--scale))
  );
  display: flex;
  flex-direction: column;
  gap: clamp(
    10px,
    calc(20px / var(--max-design-width) * 100vw),
    calc(20px * var(--scale))
  );
}
.info-section__howto-scan-point-list li {
  padding-left: 1em;
  text-indent: -1em;
}
.info-section__howto-scan-point-note {
  font-size: clamp(
    11px,
    calc(22px / var(--max-design-width) * 100vw),
    calc(22px * var(--scale))
  );
  font-weight: 600;
  line-height: 1.3;
  padding-top: clamp(
    10px,
    calc(20px / var(--max-design-width) * 100vw),
    calc(20px * var(--scale))
  );
}
.info-section__howto-scan-point-note {
  padding-left: 1em;
  text-indent: -1em;
}

/** #history **/
.info-section__history {
  width: 100%;
  margin-top: clamp(
    30px,
    calc(60px / var(--max-design-width) * 100vw),
    calc(60px * var(--scale))
  );
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
  box-shadow: 15.32px 12.85px 20px 0px #b57e1c;
}
.history-ttl {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 45px;
  background: #003f98;
  color: #fff;
  font-size: 17px;
  font-weight: bold;
}

.history-calendar {
  padding: 10px;
}
.calendar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  width: 150px;
}
.calendar-header-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto 15px;
}
.calendar-header .prev-btn,
.calendar-header .next-btn {
  display: block;
  width: 10px;
  height: 10px;
  padding: 0;
  border: none;
  border-top: 2px solid #083e8e;
  border-right: 2px solid #083e8e;
  background: transparent;
  transform: rotate(45deg);
}
.calendar-header .prev-btn._passive,
.calendar-header .next-btn._passive,
.calendar-header .prev-btn._passive:hover,
.calendar-header .next-btn._passive:hover {
  opacity: 0.2;
}
.calendar-header .prev-btn {
  transform: rotate(-135deg);
}
.calendar-year-month {
  color: #083e8e;
  font-weight: bold;
}
.calendar-year {
  font-size: 13px;
  letter-spacing: -0.04em;
}
.calendar-year::after {
  display: inline-block;
  content: ".";
}
.calendar-month {
  margin-left: -2px;
  font-size: 24px;
  letter-spacing: -0.08em;
}
.calendar-table {
  width: 100%;
  color: #083e8e;
  border-collapse: separate;
}
.calendar-table thead th {
  height: 20px;
}
.calendar-table td {
  height: 50px;
  padding: 3px;
  border-top: 1px solid #083e8e;
  border-left: 1px solid #083e8e;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
}
.calendar-table td button {
  font-size: 15px;
  font-weight: bold;
}
.calendar-table td:last-child {
  border-right: 1px solid #083e8e;
}
.calendar-table tr:last-child td {
  border-bottom: 1px solid #083e8e;
}
.calendar-table tbody tr:first-child td:first-child {
  border-top-left-radius: 10px;
}
.calendar-table tbody tr:first-child td:last-child {
  border-top-right-radius: 10px;
}
.calendar-table tbody tr:last-child td:first-child {
  border-bottom-left-radius: 10px;
}
.calendar-table tbody tr:last-child td:last-child {
  border-bottom-right-radius: 10px;
}
.calendar-table .present-icon,
.calendar-table .history-icon {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  width: 100%;
  height: 100%;
  color: #083e8e;
  padding: 0;
}

.calendar-table .history-icon img {
  display: block;
  width: 16px;
}
.calendar-table .present-icon img {
  display: block;
  width: 20px;
}

.history-apply-count {
  width: fit-content;

  color: #e60012;
  font-size: 14px;
  font-weight: bold;
}
.history-apply-count span {
  margin-left: 15px;
  font-size: 24px;
}

/* 景品セクション */
.prize-section {
  background-image: url(../img/prize-section_bg.jpg);
  background-size: 100% 100%;
  padding: clamp(
      60px,
      calc(120px / var(--max-design-width) * 100vw),
      calc(120px * var(--scale))
    )
    0;
}
.prize-section__title {
  width: min(
    calc(470px * var(--scale)),
    calc(470px / var(--max-design-width) * 100vw)
  );
  top: -3%;
}
.prize-section__content {
  background: linear-gradient(
    110deg,
    #fff5cb 0%,
    #ffffff 30%,
    #ffffff 70%,
    #fff5cb 100%
  );
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    60px,
    calc(140px / var(--max-design-width) * 100vw),
    calc(140px * var(--scale))
  );
  padding-bottom: clamp(
    40px,
    calc(80px / var(--max-design-width) * 100vw),
    calc(80px * var(--scale))
  );
}
.prize-section__img-wrap {
  margin-top: clamp(
    25px,
    calc(50px / var(--max-design-width) * 100vw),
    calc(50px * var(--scale))
  );
}
.prize-section__note-list {
  font-size: clamp(
    11px,
    calc(22px / var(--max-design-width) * 100vw),
    calc(22px * var(--scale))
  );
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: clamp(
    15px,
    calc(30px / var(--max-design-width) * 100vw),
    calc(30px * var(--scale))
  );
}
.prize-section__note-list li {
  padding-left: 1em;
  text-indent: -1em;
}

/* フッター */
.footer {
  background-color: #dddddd;
  padding: clamp(
      20px,
      calc(40px / var(--max-design-width) * 100vw),
      calc(40px * var(--scale))
    )
    0;
  text-align: center;
  max-width: 500px;
  margin: 0 auto;
  font-size: clamp(
    14px,
    calc(28px / var(--max-design-width) * 100vw),
    calc(28px * var(--scale))
  );
}

/* product.html*/
.product-section {
  background-image: url("../img/product-section_bg.jpg");
  background-size: 100% 100%;
  padding: clamp(
      20px,
      calc(80px / var(--max-design-width) * 100vw),
      calc(80px * var(--scale))
    )
    0;
}
.product-section__text {
  font-size: clamp(
    16px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  margin-top: 10px;
  color: #fff;
  text-align: center;
}
.product-section__title {
  width: 70%;
  margin: 0 auto;
}

.product-box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  width: 100%;
  margin-top: clamp(
    30px,
    calc(60px / var(--max-design-width) * 100vw),
    calc(60px * var(--scale))
  );
  padding: 0 15px;
}
.product-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  max-width: 300px;
  padding: clamp(
      15px,
      calc(30px / var(--max-design-width) * 100vw),
      calc(30px * var(--scale))
    )
    0;

  border-radius: 10px;
  border: 3px solid #fff;
  background: #fff;
}
.product-item:has(input:checked) {
  border: 3px solid #e60012;
  background: #fffcd0;
}
.product-item input {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.product-item-img {
  width: min(
    calc(78px * var(--scale)),
    calc(78px / var(--max-design-width) * 100vw)
  );
}
.product-item-name {
  display: flex;
  align-items: center;
  height: 2em;
  margin-top: 10px;
  font-size: clamp(
    10px,
    calc(30px / var(--max-design-width) * 100vw),
    calc(30px * var(--scale))
  );
  font-weight: bold;
  text-align: center;
  line-height: 1.3;
}

/* scan.html */
body.scan main {
  display: block;
  height: 100%;
  background: transparent;
}
body.scan .scan-contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 370px;
  width: 100%;
  height: 100%;
  padding-top: 35px;
  position: relative;
  top: 0;
  z-index: 100;
}
body.scan .scan-back-btn {
  width: 42px;
  position: absolute;
  top: 10px;
  left: 10px;
}
body.scan .scan-txt {
  width: 250px;
  margin: 0 auto;
  padding: clamp(15px, 4vw, 20px);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.8);
  color: #333;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
}
body.scan .scan-txt span:first-of-type {
  color: #e10d0d;
}
body.scan .scan-txt span:nth-of-type(2) {
  margin-top: 10px;
  font-size: 12px;
  display: block;
}

body.scan .scan-caution {
  display: block;
  padding: 20px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.8);
  font-weight: bold;
  text-align: center;
}
body.scan .ascene-container {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}
.mindar-ui-scanning .scanning {
  width: 100%;
  max-width: 300px;
  height: 300px;
}
.a-modal,
.a-enter-vr-button {
  display: none !important;
}
.mindar-ui-scanning {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 90vw !important;
  max-width: 500px !important;
  min-width: 220px !important;
  height: auto !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
  padding: 2rem 1.5rem !important;
}

.guide-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(
    calc(250px * var(--scale)),
    calc(250px / var(--max-design-width) * 100vw)
  );
  transform: translate(-50%, -50%);
  opacity: 0.4;
  pointer-events: none;
}
/* スキャン完了 */
.scan_complete {
  min-height: 100vh;
  height: 100vh;
  background-image: url("../img/scan_complete01_bg.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.scan_complete__contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  min-height: 0;
}
.scan_complete__icon {
  width: min(
    calc(330px * var(--scale)),
    calc(330px / var(--max-design-width) * 100vw)
  );
  margin-top: clamp(35px, calc(70px / 750px * 100vw), calc(70px * 0.666));
}
.scan_complete__text {
  width: min(
    calc(576px * var(--scale)),
    calc(576px / var(--max-design-width) * 100vw)
  );
}

.is-hidden {
  display: none !important;
}

/* スキャン完了 抽選中画面 */
.lottery {
  background-image: url("../img/scan_lottery_bg.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.scan_lottery__contents {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  min-height: 0;
}
.scan_lottery__video {
  width: 100%;
}
.scan_lottery__video video {
  width: 100%;
  height: auto;
}

/* スキャン完了 あたり画面 */
.lottery--win {
  background-image: url("../img/scan_win_bg.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.lottery__win-title {
  width: min(
    calc(480px * var(--scale)),
    calc(480px / var(--max-design-width) * 100vw)
  );
  margin: 0 auto;
}
.lottery__win-prize {
  width: min(
    calc(670px * var(--scale)),
    calc(670px / var(--max-design-width) * 100vw)
  );
}
.lottery__win-expire {
  font-size: clamp(
    14px,
    calc(28px / var(--max-design-width) * 100vw),
    calc(28px * var(--scale))
  );
  font-weight: 600;
  text-align: center;
  margin-top: clamp(
    20px,
    calc(30px / var(--max-design-width) * 100vw),
    calc(30px * var(--scale))
  );
}

/* スキャン完了 はずれ画面 */
.lottery--lose {
  background-image: url("../img/scan_lose_bg.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.lottery__lose-title {
  width: min(
    calc(480px * var(--scale)),
    calc(480px / var(--max-design-width) * 100vw)
  );
  margin: 0 auto;
}
.lottery__lose-message {
  width: min(
    calc(630px * var(--scale)),
    calc(630px / var(--max-design-width) * 100vw)
  );
  margin: clamp(
      30px,
      calc(60px / var(--max-design-width) * 100vw),
      calc(60px * var(--scale))
    )
    auto 0 auto;
}
.lottery__lose-btn-wrap {
  position: relative;
}
.lottery__lose-btn-wrap img {
  position: absolute;
  left: 50%;
  bottom: 28%;
  transform: translateX(-50%);
  width: min(
    calc(480px * var(--scale)),
    calc(480px / var(--max-design-width) * 100vw)
  );
  height: min(
    calc(180px * var(--scale)),
    calc(180px / var(--max-design-width) * 100vw)
  );
  pointer-events: none;
  z-index: 10;
}

/* =====================
   モーダル
====================== */
.modal {
  display: none;
  position: fixed;
  z-index: 10000;
  top: 0;
  left: 50%;
  width: 100vw;
  height: 100vh;
  max-width: 500px;
  transform: translateX(-50%);
  justify-content: center;
  align-items: center;
}
.modal[aria-hidden="false"] {
  display: flex;
}
.modal__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  max-width: 500px;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
}
.modal__content {
  position: relative;
  z-index: 2;
  background-image: url("../img/scan_win_bg.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  width: 90vw;
  max-width: 460px;
  max-height: 90vh;
  padding: 2.5rem 1.5rem 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  transform: translateY(0);
  animation: modal-fadein 0.25s;
}
.modal__close {
  background: rgba(0, 0, 0, 0.5);
  border: none;
  font-size: 3.4rem;
  color: #fff;
  cursor: pointer;
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 3;
  line-height: 1;
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, color 0.2s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}
.modal__close:hover {
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
}
.modal__body {
  width: 100%;
  margin-top: clamp(
    25px,
    calc(50px / var(--max-design-width) * 100vw),
    calc(50px * var(--scale))
  );
  text-align: center;
  color: #222;
  font-size: 1.6rem;
}
.modal__body .lottery__win-title {
  width: min(calc(420px * 0.66), calc(420px / 750px * 100vw));
  margin: 0 auto;
}
.modal__body .lottery__win-prize {
  width: min(calc(590px * 0.666), calc(590px / 750px * 100vw));
  margin: clamp(
      20px,
      calc(40px / var(--max-design-width) * 100vw),
      calc(40px * var(--scale))
    )
    auto 0 auto;
}
.modal__body .btn--receive {
  margin-top: 2.5rem;
}
@keyframes modal-fadein {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* *********************************
 LP用スタイル
****************************** */
body.lp .hero__text {
  margin-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
}
body.lp .hero__products {
  margin-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
}
body.lp .summary-contents {
  background: linear-gradient(110deg, #fff 0%, #fff5cb 50%, #ffffff 100%);
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    60px,
    calc(140px / var(--max-design-width) * 100vw),
    calc(140px * var(--scale))
  );
  padding-bottom: clamp(
    40px,
    calc(80px / var(--max-design-width) * 100vw),
    calc(80px * var(--scale))
  );
  box-shadow: 15.32px 12.85px 20px 0px #b57e1c;
}
body.lp .campaign-details-section {
  background-image: url(../img/info-section_bg.jpg);
  padding: clamp(
      60px,
      calc(120px / var(--max-design-width) * 100vw),
      calc(120px * var(--scale))
    )
    0;
}
body.lp .summary-contents__title {
  width: min(
    calc(590px * var(--scale)),
    calc(590px / var(--max-design-width) * 100vw)
  );
  top: -7%;
}

body.lp .summary__text {
  font-size: clamp(
    12px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  color: #011b63;
  margin: 0;
  width: 100%;
  text-align: center;
  z-index: 2;
  font-weight: 600;
  line-height: 1.5;
}
body.lp .summary__num {
  font-size: clamp(
    20px,
    calc(48px / var(--max-design-width) * 100vw),
    calc(48px * var(--scale))
  );
}
body.lp .summary__unit {
  font-size: clamp(
    14px,
    calc(36px / var(--max-design-width) * 100vw),
    calc(36px * var(--scale))
  );
}
body.lp .summary__emphasis {
  font-size: clamp(
    16px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
}
body.lp .summary-contents__procedure {
  background-color: #fff;
  color: #001c63;
  position: relative;
  text-align: center;
  font-weight: 500;
  line-height: 1.7;
  border-radius: 20px;
  font-size: clamp(
    12px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  padding: clamp(
      20px,
      calc(40px / var(--max-design-width) * 100vw),
      calc(40px * var(--scale))
    )
    clamp(
      15px,
      calc(30px / var(--max-design-width) * 100vw),
      calc(30px * var(--scale))
    );
  margin-top: clamp(
    30px,
    calc(60px / var(--max-design-width) * 100vw),
    calc(60px * var(--scale))
  );
}
body.lp .summary-contents__procedure::before {
  content: "";
  position: absolute;
  width: min(
    calc(93px * var(--scale)),
    calc(93px / var(--max-design-width) * 100vw)
  );
  max-width: 93px;
  height: auto;
  aspect-ratio: 93 / 146;
  top: -7%;
  left: 2%;
  background-image: url(../img/LP/lp_summary_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
body.lp .summary__emphasis--red {
  background-color: #de0010;
  color: #fff;
  padding: 0 0.3rem;
}

/* 景品内容 */
body.lp .prize-section__content {
  background: linear-gradient(
    110deg,
    #fff5cb 0%,
    #ffffff 30%,
    #ffffff 70%,
    #fff5cb 100%
  );
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    60px,
    calc(140px / var(--max-design-width) * 100vw),
    calc(140px * var(--scale))
  );
  padding-bottom: clamp(
    40px,
    calc(80px / var(--max-design-width) * 100vw),
    calc(80px * var(--scale))
  );
  box-shadow: 15.32px 12.85px 20px 0px #b57e1c;
  margin-top: clamp(
    60px,
    calc(120px / var(--max-design-width) * 100vw),
    calc(120px * var(--scale))
  );
}

/* application-sectionセクション */
body.lp .application-section {
  background-image: url(../img/prize-section_bg.jpg);
  padding: clamp(
      100px,
      calc(200px / var(--max-design-width) * 100vw),
      calc(200px * var(--scale))
    )
    0
    clamp(
      60px,
      calc(120px / var(--max-design-width) * 100vw),
      calc(120px * var(--scale))
    )
    0;
}
body.lp .method-contents {
  background: linear-gradient(150deg, #123e9b 0%, #1956d2 50%, #123e9b 100%);
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    60px,
    calc(140px / var(--max-design-width) * 100vw),
    calc(140px * var(--scale))
  );
  padding-bottom: clamp(
    40px,
    calc(80px / var(--max-design-width) * 100vw),
    calc(80px * var(--scale))
  );
  box-shadow: 15.32px 12.85px 20px 0px #00040f;
  color: #fff;
}
body.lp .method-contents__title {
  width: min(
    calc(450px * var(--scale)),
    calc(450px / var(--max-design-width) * 100vw)
  );
  top: -3%;
}
body.lp .method-contents__procedure-list dt {
  font-family: "Shippori Mincho", serif;
  font-weight: 800;
  font-style: normal;
  font-size: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  line-height: 1.5;
}
body.lp .method-contents__procedure-list dt span {
  font-size: clamp(
    32px,
    calc(64px / var(--max-design-width) * 100vw),
    calc(64px * var(--scale))
  );
  margin-right: clamp(
    8px,
    calc(16px / var(--max-design-width) * 100vw),
    calc(16px * var(--scale))
  );
}
body.lp .method-contents__procedure-list dd {
  font-weight: 500;
  font-size: clamp(
    16px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  margin-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  line-height: 1.5;
}
body.lp .method-contents__procedure-item {
  border-top: solid 1px #fff;
  padding: clamp(
      30px,
      calc(60px / var(--max-design-width) * 100vw),
      calc(60px * var(--scale))
    )
    0;
}
body.lp .method-contents__procedure-item:first-child {
  border-top: none;
  padding-bottom: clamp(
    30px,
    calc(60px / var(--max-design-width) * 100vw),
    calc(60px * var(--scale))
  );
  padding-top: 0;
}

/* 応募規約ボックス */
body.lp .terms-box-contents {
  margin-top: clamp(
    60px,
    calc(120px / var(--max-design-width) * 100vw),
    calc(120px * var(--scale))
  );
}
body.lp .terms-box {
  background: #fff;
  color: #011b63;
  border-radius: 18px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  padding: 2rem 1.5rem;
  max-width: 500px;
  margin: 32px auto 0 auto;
}
body.lp .terms-box__body {
  max-height: 220px;
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 1.4rem;
  line-height: 1.7;
}
body.lp .terms-box__body a {
  color: #011b63;
  cursor: pointer;
}
body.lp .terms-box-contents__title {
  width: min(
    calc(515px * var(--scale)),
    calc(515px / var(--max-design-width) * 100vw)
  );
  margin: 0 auto;
}

/* お問い合わせ */
body.lp .contact-contents {
  background: linear-gradient(150deg, #123e9b 0%, #1956d2 50%, #123e9b 100%);
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    60px,
    calc(140px / var(--max-design-width) * 100vw),
    calc(140px * var(--scale))
  );
  padding-bottom: clamp(
    40px,
    calc(80px / var(--max-design-width) * 100vw),
    calc(80px * var(--scale))
  );
  box-shadow: 15.32px 12.85px 20px 0px #00040f;
  color: #fff;
  margin-top: clamp(
    80px,
    calc(160px / var(--max-design-width) * 100vw),
    calc(160px * var(--scale))
  );
}
body.lp .contact-contents_ttl {
  width: min(
    calc(515px * var(--scale)),
    calc(515px / var(--max-design-width) * 100vw)
  );
  top: -5%;
}
body.lp .contact-info__office {
  background-color: #fff;
  color: #011b63;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.05em;
  border-radius: 10px;
  font-size: clamp(
    16px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  padding: clamp(
      20px,
      calc(40px / var(--max-design-width) * 100vw),
      calc(40px * var(--scale))
    )
    clamp(
      16px,
      calc(32px / var(--max-design-width) * 100vw),
      calc(32px * var(--scale))
    );
}
body.lp .contact-info__mail {
  font-size: clamp(
    16px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  margin-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
body.lp .contact-info__mail::before {
  content: "";
  display: inline-block;
  width: min(
    calc(60px * var(--scale)),
    calc(60px / var(--max-design-width) * 100vw)
  );
  height: min(
    calc(60px * var(--scale)),
    calc(60px / var(--max-design-width) * 100vw)
  );
  margin-right: 8px;
  background-image: url(../img/LP/lp_mail_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

body.lp .contact-info__period {
  display: grid;
  grid-template-areas:
    "A B"
    ". C";
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  align-items: start;
  line-height: 1.5;
  gap: 0.2em;
  font-size: clamp(
    16px,
    calc(32px / var(--max-design-width) * 100vw),
    calc(32px * var(--scale))
  );
  margin-top: clamp(
    15px,
    calc(30px / var(--max-design-width) * 100vw),
    calc(30px * var(--scale))
  );
}
body.lp .contact-info__period-label {
  grid-area: A;
}
body.lp .contact-info__period-date:first-of-type {
  grid-area: B;
}
body.lp .contact-info__period-date:last-of-type {
  grid-area: C;
}
body.lp .contact-info__note {
  font-size: clamp(
    12px,
    calc(24px / var(--max-design-width) * 100vw),
    calc(24px * var(--scale))
  );
  margin-top: clamp(
    10px,
    calc(20px / var(--max-design-width) * 100vw),
    calc(20px * var(--scale))
  );
  text-indent: -1em;
  padding-left: 1em;
}
body.lp .contact-info__desc {
  border: solid 1px #fff;
  border-radius: 20px;
  font-size: clamp(
    13px,
    calc(26px / var(--max-design-width) * 100vw),
    calc(26px * var(--scale))
  );
  padding: clamp(
      15px,
      calc(30px / var(--max-design-width) * 100vw),
      calc(30px * var(--scale))
    )
    clamp(
      12px,
      calc(24px / var(--max-design-width) * 100vw),
      calc(24px * var(--scale))
    );
  margin-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  line-height: 1.5;
}
body.lp .contact-info__note {
  line-height: 1.5;
  font-size: clamp(
    12px,
    calc(24px / var(--max-design-width) * 100vw),
    calc(24px * var(--scale))
  );
}

/* LP用フッター */
body.lp .footer {
  padding: clamp(
      20px,
      calc(40px / var(--max-design-width) * 100vw),
      calc(40px * var(--scale))
    )
    0;
  text-align: center;
  max-width: 500px;
  margin: 0 auto;
  font-size: clamp(
    10px,
    calc(20px / var(--max-design-width) * 100vw),
    calc(20px * var(--scale))
  );
}

/* ティザー */
body.lp .prize-section__content.teaser {
  background: linear-gradient(110deg, #ffffff 0%, #fff5cb 50%, #ffffff 100%);
  border-radius: 20px;
  position: relative;
  padding-top: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  padding-bottom: clamp(
    20px,
    calc(40px / var(--max-design-width) * 100vw),
    calc(40px * var(--scale))
  );
  box-shadow: 15.32px 12.85px 20px 0px #b57e1c;
  margin-top: clamp(
    15px,
    calc(30px / var(--max-design-width) * 100vw),
    calc(30px * var(--scale))
  );
}

.prize-section__img-wrap.teaser {
  margin-top: 0;
}

.hero__bg.teaser {
  background-image: url("../img/bg_teaser.jpg");
}