/* メインビジュアル */
.sec-kv { position: relative; overflow-x: clip; height: calc(708px * var(--kv-scale, 1)); background: var(--c-blue-gray); font-family: "A1 Gothic", "A P-OTF A1Gothic Std", var(--font-jp); font-weight: 500; color: var(--c-pony-blue); }
.sec-kv .kv-box { position: absolute; left: 50%; top: 0; width: 1440px; height: 708px; margin-left: -720px; transform-origin: 50% 0; transform: scale(var(--kv-scale, 1)); }
.sec-kv .kv-clip { position: absolute; inset: 0; overflow: hidden; }
.sec-kv .kv-band { position: absolute; left: 0; bottom: 0; width: 100%; height: 170px; background: #C3DAEE; }

.sec-kv .kv-brand { position: absolute; left: 94px; top: 142px; width: 460.89px; height: 198.25px; }
.sec-kv .kv-tagline { position: absolute; left: 34px; top: 0; font-size: 28px; line-height: 1.4; letter-spacing: 1.4px; white-space: nowrap; }
.sec-kv .kv-logo { position: absolute; left: 0; top: 55px; width: 460.89px; height: 143.248px; font-size: 0; font-weight: inherit; }
.sec-kv .kv-logo img { width: 460.89px; height: 143.248px; }

.sec-kv .kv-copy { position: absolute; left: 665px; top: 129px; width: 775px; height: 214px; }
.sec-kv .kv-title { font-size: 52.8px; line-height: 1.4; letter-spacing: -0.528px; white-space: nowrap; }
.sec-kv .kv-sub { position: absolute; left: 4px; top: 160px; font-size: 38.4px; line-height: 1.4; letter-spacing: -0.768px; white-space: nowrap; }

.sec-kv .kv-sub::after { content: ""; position: absolute; left: 0; top: 52px; width: 426px; height: 3px; background: var(--c-pony-blue); }

.sec-kv .kv-since { position: absolute; left: -28.61px; top: -19.4px; width: 107.45px; height: 40.74px; transform: rotate(-3deg); display: flex; align-items: center; justify-content: center; }
.sec-kv .kv-since-bg { position: absolute; left: 0.75px; top: -3.8px; width: 104px; height: 38.098px; transform: scaleX(-1); }
.sec-kv .kv-since-text { position: relative; top: -8.2px; left: -1px; white-space: nowrap; letter-spacing: 0.63px; line-height: 1.5; }
.sec-kv .kv-since-s { font-size: 13px; font-weight: 700; }
.sec-kv .kv-since-n { font-size: 20px; letter-spacing: -0.8px; }

.sec-kv .kv-illust { position: absolute; max-width: none; }
.sec-kv .kv-illust-assess { left: 158px; top: 376px; width: 387px; height: 453.132px; }
.sec-kv .kv-illust-photo { left: 614px; top: 372px; width: 392px; height: 297.934px; }
.sec-kv .kv-illust-listing { left: 1060px; top: 336px; width: 303px; height: 361.397px; }
.sec-kv .kv-illust-plant { left: 72px; top: 503px; width: 66px; height: 147.95px; }

.sec-kv .kv-badges { position: absolute; left: 50%; top: 0; z-index: 3; width: 1440px; height: 708px; margin-left: -720px; transform-origin: 50% 0; transform: scale(var(--kv-scale, 1)); pointer-events: none; }
.sec-kv .kv-badge { pointer-events: auto; position: absolute; box-sizing: border-box; width: 165.6px; height: 165.6px; border-radius: 50%; overflow: hidden; text-align: center; white-space: nowrap; }
.sec-kv .kv-badge > span { position: absolute; left: 50%; transform: translateX(-50%); }

.sec-kv .kv-badge-cashback { left: 51px; top: 610.4px; background: var(--c-clozy-blue); border: 1.15px solid var(--c-white); color: var(--c-white); }
.sec-kv .kv-badge-cashback .kv-badge-head { top: 30.94px; font-size: 22.77px; line-height: 1.5; letter-spacing: 1.1385px; }
.sec-kv .kv-badge-cashback .kv-badge-main { top: 48.53px; font-size: 0; line-height: 0; letter-spacing: 2.3805px; }
.sec-kv .kv-badge-cashback .kv-badge-num { font-size: 47.61px; line-height: 1.5; }
.sec-kv .kv-badge-cashback .kv-badge-unit { font-size: 38.295px; line-height: 1.5; }
.sec-kv .kv-badge-cashback .kv-badge-rest { top: 106.49px; font-size: 22.77px; line-height: 1.5; letter-spacing: 1.1385px; }

.sec-kv .kv-badge-free { left: 225.8px; top: 610.4px; background: var(--c-white); border: 1.15px solid var(--c-pony-blue); }
.sec-kv .kv-badge-free .kv-badge-head { top: -1.55px; width: 165px; height: 64px; box-sizing: border-box; padding: 10px 8px 3px; border-radius: 3.105px; background: var(--c-pony-blue); color: var(--c-white); font-size: 17px; line-height: 1.3; letter-spacing: 0.85px; display: flex; align-items: center; justify-content: center; }
.sec-kv .kv-badge-free .kv-badge-lead { top: 62.74px; font-size: 22.77px; line-height: 1.5; letter-spacing: 1.1385px; }
.sec-kv .kv-badge-free .kv-badge-main { top: 88.62px; font-size: 31.05px; line-height: 1.5; letter-spacing: 1.5525px; }

@media (max-width: 767px) {

  .sec-kv { height: calc(600px * var(--kv-scale, 1)); }
  .sec-kv .kv-box, .sec-kv .kv-badges { width: 390px; height: 600px; margin-left: -195px; }
  .sec-kv .kv-band { height: 344px; }
  .sec-kv .kv-brand { left: 0; top: 0; width: 390px; height: auto; }
  .sec-kv .kv-tagline { left: 86px; top: 66px; font-size: 16px; letter-spacing: 0.8px; }
  .sec-kv .kv-logo { left: 79px; top: 95px; width: 232px; height: 72.107px; }
  .sec-kv .kv-logo img { width: 232px; height: 72.107px; }
  .sec-kv .kv-copy { left: 0; top: 0; width: 390px; height: auto; }
  .sec-kv .kv-title { position: absolute; left: 13px; top: 403px; font-size: 26px; letter-spacing: -0.26px; }
  .sec-kv .kv-sub { left: 14px; top: 480.5px; font-size: 22px; letter-spacing: -0.44px; }
  .sec-kv .kv-sub-ru { letter-spacing: -2.64px; }
  .sec-kv .kv-sub-da { letter-spacing: -0.66px; }
  .sec-kv .kv-sub-ke { letter-spacing: -6.16px; }

  .sec-kv .kv-sub::after { top: 30.5px; width: 244px; height: 1.5px; }

  .sec-kv .kv-since { left: -8.43px; top: 372.9px; transform: rotate(-3deg) scale(0.75); }
  .sec-kv .kv-illust-photo { left: 110px; top: 189.34px; width: 159.869px; height: 121.506px; }
  .sec-kv .kv-illust-listing { left: 233.57px; top: 203.32px; width: 151.079px; height: 180.196px; }
  .sec-kv .kv-illust-assess { left: -18.4px; top: 241.37px; width: 139.383px; height: 163.201px; }
  .sec-kv .kv-illust-plant { display: none; }

  .sec-kv .kv-badge { transform-origin: 0 0; transform: scale(0.5928); }
  .sec-kv .kv-badge-cashback { left: 181px; top: 521.24px; }
  .sec-kv .kv-badge-free { left: 283px; top: 521px; }
}
