@font-face {
      font-family: "Wanted Sans";
      src: url("fonts/WantedSansVariable.woff2") format("woff2");
      font-weight: 400 900;
      font-style: normal;
      font-display: swap;
}

[hidden]{display:none!important}.auth-header-actions{display:flex;align-items:center;gap:8px}.auth-header-actions a{display:inline-flex;min-height:44px;align-items:center;padding:0 15px;border:1px solid #d8ecf0;border-radius:999px;background:#fff;color:#075a4e;font-weight:850;text-decoration:none}.auth-header-actions a.is-join{border-color:#00856f;background:#00856f;color:#fff}.guest-member-card{display:grid;gap:11px;padding:20px;border:1px solid #d8ecf0;border-radius:22px;background:linear-gradient(145deg,#fff,#f3fbff)}.guest-member-card span,.member-lock-panel>span{color:#00856f;font-size:13px;font-weight:900}.guest-member-card h2,.member-lock-panel h2{margin:0;color:#075a4e;font-size:21px;line-height:1.35}.guest-member-card p,.member-lock-panel p{margin:0;color:#5f7480;font-size:14px;line-height:1.55}.guest-member-card a,.member-lock-panel a{display:flex;min-height:50px;align-items:center;justify-content:center;border-radius:14px;background:#00856f;color:#fff;font-weight:850;text-decoration:none}.guest-member-card a.is-secondary{border:1px solid #d8ecf0;background:#fff;color:#075a4e}.member-card--live{padding:10px}.member-card--live .gwl-member-pass{box-shadow:none}.rail-action--button{width:100%;border:0;font:inherit;cursor:pointer}.member-lock-panel{display:grid;justify-items:center;gap:12px;padding:34px;border:1px solid #d8ecf0;border-radius:24px;background:linear-gradient(145deg,#fff,#f3fbff);text-align:center}.member-lock-panel a{min-width:210px;padding:0 22px}.member-lock-panel--compact{padding:25px}.sample-badge{display:inline-flex;margin-right:7px;padding:5px 9px;border-radius:999px;background:#e5fff9;color:#007565;font-size:12px}.footer a{color:inherit}.footer-legal{display:block;margin-top:10px;color:#5f7480;font-size:12px;line-height:1.55}

    :root {
      --bg: #f3fbff;
      --bg-cream: #fff9e8;
      --surface: #ffffff;
      --surface-soft: #f6fcff;
      --line: #d8ecf0;
      --text: #12333a;
      --muted: #5f7480;
      --soft: #8aa0a8;
      --green-950: #06342f;
      --green-900: #075a4e;
      --green-800: #00856f;
      --green-700: #10a783;
      --green: var(--green-800);
      --mint: #dcfff4;
      --gold: #ffcf33;
      --gold-soft: #fff3a6;
      --orange: #ff8a2a;
      --coral: #ff6b5e;
      --teal: #00c7b7;
      --purple: #9b5de5;
      --blue: #00a9f4;
      --peach: #ffe0d4;
      --sage: #e9fff2;
      --champagne: #fff6b8;
      --shadow-card: 0 18px 42px rgba(0, 128, 160, .1);
      --shadow-soft: 0 10px 26px rgba(0, 128, 160, .07);
      --shadow-focus: 0 14px 30px rgba(0, 133, 111, .22);
      --radius-sm: 8px;
      --radius-md: 12px;
      --radius-lg: 16px;
      --radius-xl: 22px;
      --radius-pill: 999px;
      --container: 1280px;
      --rail: 320px;
      --asset: "assets/images/index1_pc_ver3_bright";
      --font-ui: "Wanted Sans", "Pretendard", "Noto Sans KR", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      min-height: 100vh;
      overflow-x: hidden;
      background:
        radial-gradient(circle at 4% 5%, rgba(0, 187, 249, .22), transparent 30%),
        radial-gradient(circle at 86% 8%, rgba(255, 207, 51, .32), transparent 26%),
        radial-gradient(circle at 72% 34%, rgba(0, 245, 212, .18), transparent 28%),
        radial-gradient(circle at 92% 72%, rgba(255, 138, 42, .14), transparent 24%),
        linear-gradient(180deg, #fffdf7 0%, var(--bg) 48%, #fff4dc 100%);
      color: var(--text);
      font-family: var(--font-ui);
      letter-spacing: 0;
      -webkit-font-smoothing: antialiased;
      text-rendering: geometricPrecision;
      padding-top: 94px;
    }

    a,
    button {
      color: inherit;
      font: inherit;
    }

    a {
      text-decoration: none;
    }

    button {
      border: 0;
      cursor: pointer;
      background: none;
    }

    .wide-inner {
      width: min(var(--container), calc(100vw - 48px));
      margin: 0 auto;
    }

    #top {
      scroll-margin-top: 106px;
    }

    .topbar {
      position: fixed;
      inset: 0 0 auto 0;
      z-index: 50;
      height: 82px;
      border-bottom: 1px solid rgba(216, 236, 240, .95);
      background: rgba(255, 253, 245, .95);
      backdrop-filter: blur(18px);
      box-shadow: 0 8px 28px rgba(0, 128, 160, .06);
    }

    .topbar-inner {
      height: 100%;
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 34px;
    }

    .brand {
      color: var(--green-900);
      font-size: 32px;
      font-weight: 860;
      line-height: 1;
      white-space: nowrap;
    }

    .nav {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }

    .nav a {
      min-height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 20px;
      border-radius: var(--radius-pill);
      color: #263b3f;
      font-size: 17px;
      font-weight: 780;
      white-space: nowrap;
      transition: background .2s ease, color .2s ease, transform .2s ease;
    }

    .nav a:hover {
      background: linear-gradient(135deg, #e8f9ff, var(--mint));
      color: var(--green-900);
      transform: translateY(-1px);
    }

    .nav a.is-primary {
      background: var(--green-800);
      color: #fff;
      box-shadow: var(--shadow-focus);
    }

    .nav-ico {
      width: 22px;
      height: 22px;
      display: grid;
      place-items: center;
      border-radius: 7px;
      background: rgba(255, 255, 255, .7);
      color: currentColor;
      font-size: 15px;
      line-height: 1;
    }

    .top-actions {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .search-pill {
      width: 176px;
      height: 46px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 0 16px 0 18px;
      border-radius: var(--radius-pill);
      background: linear-gradient(135deg, #fff, #f4fcff);
      border: 1px solid var(--line);
      color: var(--soft);
      font-size: 14px;
      font-weight: 650;
      box-shadow: var(--shadow-soft);
    }

    .round-btn,
    .avatar {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      border: 1px solid var(--line);
      background: linear-gradient(135deg, #fff, #f6fcff);
      color: var(--green-900);
      font-size: 20px;
      font-weight: 780;
      box-shadow: var(--shadow-soft);
      position: relative;
    }

    .round-btn .badge {
      position: absolute;
      top: -2px;
      right: -2px;
      min-width: 18px;
      height: 18px;
      border-radius: 9px;
      background: #dd302f;
      color: #fff;
      font-size: 11px;
      line-height: 18px;
      text-align: center;
      border: 2px solid #fff;
    }

    .avatar {
      overflow: hidden;
      color: #fff;
      background: linear-gradient(135deg, var(--blue), var(--gold) 55%, var(--green-700));
    }

    .quick {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 16px;
      margin: 24px auto 0;
    }

    .quick-card {
      min-height: 154px;
      padding: 13px 12px 12px;
      display: grid;
      justify-items: center;
      align-content: start;
      gap: 6px;
      border-radius: 22px;
      background:
        radial-gradient(circle at 50% 18%, rgba(255, 255, 255, .98), rgba(255, 255, 255, 0) 42%),
        linear-gradient(180deg, rgba(255, 255, 255, .97), var(--tint, rgba(255, 249, 239, .92)));
      border: 1px solid rgba(231, 220, 201, .78);
      box-shadow: 0 16px 36px rgba(0, 169, 244, .1);
      position: relative;
      overflow: hidden;
      transition: transform .2s ease, box-shadow .2s ease;
    }

    .quick-card::before {
      content: "";
      position: absolute;
      inset: 9px auto auto 50%;
      width: 62px;
      height: 5px;
      border-radius: 999px;
      transform: translateX(-50%);
      background: var(--accent, var(--green-800));
      background: linear-gradient(90deg, color-mix(in srgb, var(--accent, var(--green-800)) 88%, white), color-mix(in srgb, var(--accent, var(--green-800)) 48%, #ffe7c6));
      opacity: .9;
    }

    .quick-card:hover {
      transform: translateY(-2px);
      box-shadow: 0 20px 42px rgba(120, 87, 47, .12);
    }

    .quick-icon {
      width: 100px;
      height: 100px;
      border-radius: 24px;
      object-fit: cover;
      background: rgba(255, 253, 247, .96);
      box-shadow: 0 10px 24px rgba(0, 128, 160, .12);
    }

    .quick-label {
      color: #112f35;
      font-size: 17px;
      font-weight: 820;
      line-height: 1.2;
      white-space: nowrap;
    }

    .quick-desc {
      color: var(--muted);
      font-size: 12px;
      font-weight: 620;
      line-height: 1.35;
      text-align: center;
    }

    .hero-grid {
      display: block;
      margin-top: 22px;
    }

    .hero-cards {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 8px;
      min-height: 342px;
      overflow: hidden;
      border-radius: 26px;
      border: 1px solid rgba(216, 236, 240, .9);
      background: var(--surface);
      box-shadow: var(--shadow-card);
    }

    .hero-card {
      min-height: 342px;
      position: relative;
      overflow: hidden;
      background: #eefbff;
      isolation: isolate;
    }

    .hero-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background-image: var(--photo);
      background-size: cover;
      background-position: center;
      filter: brightness(1.18) saturate(1.08);
      transform: scale(1.01);
      transition: transform .4s ease;
      z-index: -2;
    }

    .hero-card::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(0, 169, 244, .12) 34%, rgba(6, 52, 47, .58) 100%),
        linear-gradient(90deg, rgba(255, 207, 51, .16), transparent 54%);
      z-index: -1;
    }

    .hero-card:hover::before {
      transform: scale(1.07);
    }

    .hero-copy {
      position: absolute;
      inset: auto 15px 16px 15px;
      color: #fff;
      padding: 0 2px;
      text-shadow: 0 2px 12px rgba(0, 40, 28, .42);
    }

    .hero-chip {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      padding: 0 11px;
      border-radius: var(--radius-pill);
      background: rgba(255, 248, 235, .8);
      border: 1px solid rgba(255, 255, 255, .58);
      color: var(--green-900);
      font-size: 13px;
      font-weight: 780;
      backdrop-filter: blur(8px);
    }

    .hero-title {
      margin: 12px 0 8px;
      font-size: 21px;
      font-weight: 840;
      line-height: 1.23;
      word-break: keep-all;
    }

    .hero-desc {
      margin: 0 0 13px;
      min-height: 58px;
      color: rgba(255, 255, 255, .94);
      font-size: 13px;
      font-weight: 560;
      line-height: 1.38;
      word-break: keep-all;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }

    .tiny-cta {
      min-height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 13px;
      border-radius: var(--radius-pill);
      background: #fff;
      color: var(--green-900);
      font-size: 13px;
      font-weight: 780;
      box-shadow: 0 8px 18px rgba(0, 0, 0, .12);
    }

    .tiny-cta.is-secondary {
      background: rgba(255, 255, 255, .28);
      color: #fff;
      border: 1px solid rgba(255, 255, 255, .72);
      box-shadow: none;
      backdrop-filter: blur(8px);
    }

    .member-card,
    .benefit-summary,
    .panel {
      border: 1px solid var(--line);
      background: rgba(255, 255, 255, .95);
      box-shadow: var(--shadow-soft);
      border-radius: 24px;
    }

    .member-card {
      overflow: hidden;
    }

    .member-head {
      min-height: 70px;
      padding: 18px 20px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      background: linear-gradient(135deg, #ffb238, #fff067 52%, #ff8a2a);
      color: #3a2600;
    }

    .member-head h2,
    .section-title h2 {
      margin: 0;
      font-size: 26px;
      font-weight: 840;
      line-height: 1.15;
      word-break: keep-all;
    }

    .grade {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      padding: 0 12px;
      border-radius: var(--radius-pill);
      background: rgba(255, 255, 255, .55);
      border: 1px solid rgba(255, 255, 255, .65);
      font-size: 12px;
      font-weight: 780;
    }

    .member-body {
      display: grid;
      grid-template-columns: 138px 1fr;
      gap: 16px;
      padding: 18px;
      align-items: center;
    }

    .qr {
      width: 138px;
      height: 138px;
      object-fit: cover;
      border-radius: 18px;
      border: 8px solid #fff;
      box-shadow: 0 8px 20px rgba(18, 45, 36, .12);
    }

    .member-meta strong {
      display: block;
      margin-bottom: 8px;
      color: var(--green-900);
      font-size: 19px;
      font-weight: 820;
    }

    .member-meta {
      color: #3f4c47;
      font-size: 14px;
      font-weight: 620;
      line-height: 1.55;
    }

    .benefit-summary {
      padding: 18px;
    }

    .benefit-top {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      margin-bottom: 14px;
    }

    .benefit-top h2 {
      margin: 0;
      font-size: 22px;
      font-weight: 840;
    }

    .text-link {
      color: var(--green-800);
      font-size: 14px;
      font-weight: 780;
      white-space: nowrap;
    }

    .benefit-metrics {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    .metric {
      min-height: 86px;
      padding: 12px 8px;
      display: grid;
      justify-items: center;
      align-content: center;
      gap: 5px;
      border-radius: 18px;
      background: var(--surface-soft);
      color: var(--muted);
      text-align: center;
      font-size: 13px;
      font-weight: 660;
    }

    .metric strong {
      color: var(--text);
      font-size: 20px;
      font-weight: 830;
      line-height: 1;
    }

    .metric-ico {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      background: var(--gold-soft);
      color: var(--green-900);
      font-size: 18px;
    }

    .booking {
      margin-top: 22px;
      padding: 22px 24px 24px;
      border-radius: 26px;
      border: 1px solid rgba(216, 236, 240, .92);
      background: rgba(255, 255, 255, .96);
      box-shadow: var(--shadow-soft);
    }

    .booking-spotlight {
      min-height: 178px;
      margin-bottom: 18px;
      display: grid;
      grid-template-columns: 1.1fr .9fr;
      overflow: hidden;
      border-radius: 22px;
      border: 1px solid var(--line);
      background: linear-gradient(135deg, #fff9e8 0%, #dcfff4 48%, #e5f8ff 100%);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62), 0 12px 28px rgba(0, 169, 244, .09);
    }

    .booking-spotlight__visual {
      display: block;
      min-height: 178px;
      background:
        linear-gradient(90deg, rgba(255, 255, 255, .28), rgba(255, 207, 51, .1)),
        url("images/index1_pc_ver3_bright/reserv-screen-1-bright-v1.jpg?v=20260703bright") center / cover;
      filter: brightness(1.08) saturate(1.16);
    }

    .booking-spotlight__copy h2 a {
      color: inherit;
      text-decoration: none;
    }

    .booking-spotlight__copy {
      padding: 24px;
      display: grid;
      align-content: center;
      gap: 12px;
      color: var(--text);
    }

    .booking-spotlight__copy h2 {
      margin: 0;
      color: var(--green-900);
      font-size: 25px;
      font-weight: 840;
      line-height: 1.22;
      word-break: keep-all;
    }

    .booking-spotlight__copy p {
      margin: 0;
      color: var(--muted);
      font-size: 15px;
      font-weight: 620;
      line-height: 1.45;
    }

    .spotlight-pill-row {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .spotlight-pill {
      justify-self: start;
      min-height: 32px;
      display: inline-flex;
      align-items: center;
      padding: 0 12px;
      border-radius: var(--radius-pill);
      background: rgba(255, 255, 255, .92);
      color: var(--green-900);
      box-shadow: 0 8px 20px rgba(94, 79, 48, .07);
      font-size: 13px;
      font-weight: 820;
    }

    .tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--line);
    }

    .tab {
      min-height: 46px;
      padding: 0 20px;
      border-radius: var(--radius-pill);
      background: rgba(247, 248, 242, .88);
      color: var(--muted);
      font-size: 16px;
      font-weight: 760;
    }

    .tab.is-active {
      background: var(--green-800);
      color: #fff;
      box-shadow: var(--shadow-focus);
    }

    .filter-grid {
      display: grid;
      grid-template-columns: 1.25fr 1fr 1fr .8fr 1.2fr;
      gap: 14px;
      margin-top: 16px;
      align-items: end;
    }

    .booking-discovery {
      display: grid;
      grid-template-columns: minmax(180px, .55fr) minmax(320px, 1.45fr);
      gap: 14px;
      margin-top: 16px;
    }

    .booking-discovery .field input {
      width: 100%;
      min-width: 0;
      border: 0;
      outline: 0;
      background: transparent;
      color: var(--text);
      font: inherit;
    }

    .field-group {
      display: grid;
      gap: 8px;
      min-width: 0;
    }

    .field-label {
      color: var(--muted);
      font-size: 14px;
      font-weight: 700;
    }

    .field {
      min-height: 56px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 0 16px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: #fbfcf7;
      color: var(--text);
      font-size: 16px;
      font-weight: 690;
      white-space: nowrap;
      min-width: 0;
    }

    .field span:first-child {
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .field select {
      width: 100%;
      min-width: 0;
      border: 0;
      outline: 0;
      background: transparent;
      color: inherit;
      font: inherit;
      cursor: pointer;
    }

    .btn-main,
    .secondary-cta {
      min-height: 56px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      border-radius: 16px;
      font-size: 17px;
      font-weight: 820;
    }

    .btn-main {
      background: var(--green-800);
      color: #fff;
      box-shadow: var(--shadow-focus);
    }

    .btn-main.is-disabled { pointer-events: none; opacity: .55; box-shadow: none; }

    .secondary-cta {
      width: 100%;
      background: linear-gradient(135deg, #fff, #f0fbff);
      color: var(--green-900);
    }

    .section {
      margin-top: 38px;
    }

    .section-title {
      margin-bottom: 18px;
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 20px;
    }

    .section-title p {
      margin: 8px 0 0;
      color: var(--muted);
      font-size: 16px;
      font-weight: 580;
      line-height: 1.5;
      word-break: keep-all;
    }

    .content-stack {
      display: grid;
      gap: 38px;
    }

    .score-card,
    .reserve-card,
    .partner-card,
    .park-card,
    .community-card {
      border-radius: 24px;
      border: 1px solid var(--line);
      background: var(--surface);
      box-shadow: var(--shadow-soft);
      overflow: hidden;
      transition: transform .2s ease, box-shadow .2s ease;
    }

    .reserve-card:hover,
    .partner-card:hover,
    .park-card:hover,
    .community-card:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-card);
    }

    .score-card {
      padding: 20px;
    }

    .score-meta {
      margin: -2px 0 16px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 720;
    }

    .score-meta strong {
      color: var(--text);
    }

    .score-top {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      overflow: hidden;
      border-radius: 18px;
      background: var(--surface-soft);
      border: 1px solid var(--line);
    }

    .score-cell {
      min-height: 106px;
      display: grid;
      align-content: center;
      justify-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 15px;
      font-weight: 680;
      text-align: center;
      border-right: 1px solid var(--line);
    }

    .score-cell:last-child {
      border-right: 0;
    }

    .score-cell strong {
      color: var(--green-900);
      font-size: 34px;
      font-weight: 840;
      line-height: 1;
    }

    .score-cell .red {
      color: #d53331;
    }

    .spark {
      width: 118px;
      height: 42px;
    }

    .score-details {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
      margin: 16px 0;
    }

    .score-details span {
      min-height: 58px;
      padding: 10px;
      border-radius: 15px;
      background: #fbfaf4;
      color: var(--muted);
      font-size: 13px;
      font-weight: 640;
      line-height: 1.35;
    }

    .score-details strong {
      display: block;
      margin-top: 3px;
      color: var(--text);
      font-size: 15px;
      font-weight: 800;
    }

    .best-hole {
      margin: 14px 0 16px;
      padding: 14px;
      display: grid;
      grid-template-columns: 48px 1fr;
      align-items: center;
      gap: 12px;
      border-radius: 18px;
      background: rgba(225, 241, 231, .72);
      border: 1px solid rgba(192, 220, 202, .9);
    }

    .best-hole__num {
      width: 48px;
      height: 48px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: var(--green-800);
      color: #fff;
      font-size: 22px;
      font-weight: 840;
    }

    .best-hole strong {
      display: block;
      color: var(--text);
      font-size: 17px;
      font-weight: 840;
    }

    .best-hole span {
      color: var(--muted);
      font-size: 13px;
      font-weight: 660;
    }

    .recent-holes {
      margin: 0 0 16px;
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 8px;
    }

    .recent-holes span {
      min-height: 44px;
      display: grid;
      place-items: center;
      border-radius: 13px;
      background: #fbfaf4;
      border: 1px solid var(--line);
      color: var(--text);
      font-size: 13px;
      font-weight: 820;
      line-height: 1.1;
    }

    .recent-holes small {
      display: block;
      color: var(--muted);
      font-size: 10px;
      font-weight: 760;
    }

    .reserve-list {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 16px;
    }

    .partner-list-state {
      grid-column: 1 / -1;
      min-height: 120px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      border: 1px dashed var(--line);
      border-radius: var(--radius-lg);
      background: var(--surface-soft);
      color: var(--muted);
      font-size: 15px;
      font-weight: 720;
      text-align: center;
    }

    .partner-list-state.is-error {
      background: #fff8ed;
      color: #80550e;
    }

    .reserve-img,
    .partner-img,
    .park-thumb {
      background-size: cover;
      background-position: center;
      position: relative;
    }

    .reserve-img {
      height: 150px;
    }

    .status,
    .rating {
      position: absolute;
      top: 12px;
      left: 12px;
      min-height: 30px;
      display: inline-flex;
      align-items: center;
      padding: 0 10px;
      border-radius: var(--radius-pill);
      background: var(--mint);
      color: var(--green-900);
      font-size: 13px;
      font-weight: 780;
      box-shadow: var(--shadow-soft);
    }

    .status.orange {
      background: #fff1d4;
      color: #8a5200;
    }

    .reserve-body {
      padding: 16px;
      color: var(--muted);
      font-size: 14px;
      font-weight: 570;
      line-height: 1.45;
    }

    .reserve-head {
      display: flex;
      align-items: start;
      justify-content: space-between;
      gap: 10px;
    }

    .reserve-title {
      display: -webkit-box;
      min-width: 0;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .partner-address {
      min-height: 40px;
      margin-top: 6px;
    }

    .partner-benefit-count {
      font-size: 15px;
    }

    .reserve-rating {
      color: #9d6d00;
      font-size: 13px;
      font-weight: 840;
      white-space: nowrap;
    }

    .reserve-benefit {
      margin-top: 10px;
      padding: 9px 10px;
      border-left: 3px solid #e3b33e;
      border-radius: 0 12px 12px 0;
      background: #fff8e4;
      color: #6f4a00;
      font-size: 13px;
      font-weight: 760;
      word-break: keep-all;
    }

    .reserve-actions {
      margin-top: 14px;
      padding-top: 12px;
      border-top: 1px solid var(--line);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
    }

    .reserve-action {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 38px;
      padding: 0 14px;
      border-radius: 12px;
      background: var(--green-800);
      color: #fff;
      font-size: 14px;
      font-weight: 820;
      text-decoration: none;
      white-space: nowrap;
    }

    .reserve-action.is-secondary {
      background: #fff;
      color: var(--green-900);
      border: 1px solid var(--line);
    }

    .reserve-title,
    .park-name {
      margin: 0 0 8px;
      color: var(--text);
      font-size: 18px;
      font-weight: 820;
      line-height: 1.25;
      word-break: keep-all;
    }

    .reserve-meta {
      margin: 10px 0;
      display: flex;
      flex-wrap: wrap;
      gap: 8px 14px;
    }

    .price {
      color: var(--green-900);
      font-size: 20px;
      font-weight: 830;
    }

    .partner-band {
      padding: 44px 0;
      background: linear-gradient(135deg, rgba(255, 241, 226, .74), rgba(234, 247, 239, .82));
      border-block: 1px solid rgba(234, 223, 206, .86);
    }

    .partner-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .partner-card {
      display: grid;
      grid-template-columns: 42% 1fr;
      min-height: 184px;
    }

    .partner-img {
      min-height: 184px;
    }

    .partner-copy {
      padding: 18px;
      display: grid;
      align-content: center;
      gap: 8px;
    }

    .type-label {
      color: var(--muted);
      font-size: 13px;
      font-weight: 840;
    }

    .partner-copy h3 {
      margin: 0;
      color: var(--text);
      font-size: 22px;
      font-weight: 840;
      line-height: 1.22;
      word-break: keep-all;
    }

    .place-meta {
      color: var(--muted);
      font-size: 13px;
      font-weight: 680;
      line-height: 1.35;
      word-break: keep-all;
    }

    .coupon {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      min-height: 32px;
      padding: 0 11px;
      border-radius: var(--radius-pill);
      background: #fff3a6;
      color: #684300;
      font-size: 13px;
      font-weight: 840;
    }

    .park-grid {
      display: grid;
      grid-template-columns: 1.35fr repeat(2, minmax(0, .82fr));
      grid-template-rows: repeat(2, 220px);
      gap: 18px;
    }

    .park-card {
      position: relative;
    }

    .park-card.feature {
      grid-row: span 2;
    }

    .park-card.more {
      padding: 24px;
      display: grid;
      align-content: space-between;
      background: linear-gradient(135deg, #ffffff, #fff4dc 44%, #dcfff4);
    }

    .park-card.more::after {
      display: none;
    }

    .park-card.more h3 {
      margin: 0 0 10px;
      color: var(--text);
      font-size: 24px;
      font-weight: 840;
      line-height: 1.25;
      word-break: keep-all;
    }

    .park-card.more p {
      margin: 0;
      color: var(--muted);
      font-size: 15px;
      font-weight: 680;
      line-height: 1.5;
    }

    .more-arrow {
      justify-self: end;
      width: 54px;
      height: 54px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: var(--green-800);
      color: #fff;
      font-size: 24px;
      font-weight: 840;
    }

    .park-thumb {
      width: 100%;
      height: 100%;
    }

    .park-card::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(255, 255, 255, .06) 8%, rgba(6, 52, 47, .52));
    }

    .park-info {
      position: absolute;
      inset: auto 18px 18px 18px;
      z-index: 1;
      color: #fff;
    }

    .park-info h3 {
      margin: 0 0 8px;
      font-size: 24px;
      font-weight: 840;
      line-height: 1.2;
      word-break: keep-all;
    }

    .park-info p {
      margin: 0;
      color: rgba(255, 255, 255, .84);
      font-size: 14px;
      font-weight: 720;
      line-height: 1.45;
    }

    .chips {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .chip {
      min-height: 36px;
      display: inline-flex;
      align-items: center;
      padding: 0 14px;
      border-radius: var(--radius-pill);
      border: 1px solid var(--line);
      background: var(--surface);
      color: var(--muted);
      font-size: 14px;
      font-weight: 850;
    }

    .chip.is-active {
      background: var(--green-800);
      color: #fff;
      border-color: var(--green-800);
    }

    .community-grid {
      display: grid;
      grid-template-columns: 1.2fr .8fr .9fr;
      gap: 18px;
    }

    .section-badge {
      width: fit-content;
      min-height: 38px;
      margin-bottom: 12px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 0 16px;
      border-radius: var(--radius-pill);
      background: var(--mint);
      color: var(--green-900);
      font-size: 14px;
      font-weight: 840;
    }

    .community-card {
      padding: 20px;
    }

    .community-card h3 {
      margin: 0 0 6px;
      color: var(--text);
      font-size: 23px;
      font-weight: 840;
    }

    .community-card p {
      margin: 0 0 16px;
      color: var(--muted);
      font-size: 15px;
      font-weight: 720;
      line-height: 1.5;
    }

    .post {
      min-height: 58px;
      display: grid;
      grid-template-columns: 44px 1fr auto;
      align-items: center;
      gap: 12px;
      border-top: 1px solid var(--line);
      color: var(--muted);
      font-size: 13px;
      font-weight: 750;
    }

    .post:first-of-type {
      border-top: 0;
    }

    .post-img {
      width: 38px;
      height: 38px;
      border-radius: 14px;
      background: linear-gradient(135deg, #fff0cf, #dff2e4);
      border: 1px solid var(--line);
    }

    .post-title {
      display: block;
      color: var(--text);
      font-size: 15px;
      font-weight: 780;
      line-height: 1.35;
      word-break: keep-all;
    }

    .tournament {
      min-height: 218px;
      padding: 22px;
      display: grid;
      align-content: end;
      gap: 12px;
      border-radius: 20px;
      color: var(--green-950);
      background:
        linear-gradient(135deg, rgba(255, 249, 232, .82), rgba(220, 255, 244, .72)),
        url("images/index1_pc_ver3_bright/tournament-bright-v1.jpg?v=20260703bright") center / cover;
      border: 1px solid rgba(216, 236, 240, .88);
      box-shadow: var(--shadow-soft);
    }

    .tournament strong {
      font-size: 24px;
      font-weight: 840;
      line-height: 1.25;
      word-break: keep-all;
    }

    .tournament-date {
      width: fit-content;
      padding: 10px 12px;
      border-radius: 14px;
      background: rgba(255, 255, 255, .72);
      border: 1px solid rgba(234, 223, 206, .9);
      color: var(--green-900);
      font-size: 13px;
      font-weight: 760;
    }

    .tournament .tiny-cta {
      background: var(--green-800);
      color: #fff;
      box-shadow: 0 10px 22px rgba(10, 107, 76, .18);
    }

    .cta-line {
      margin-top: 18px;
      padding: 20px 24px;
      min-height: 76px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      border-radius: 24px;
      border: 1px solid var(--line);
      background: var(--surface-soft);
      color: var(--text);
      font-size: 19px;
      font-weight: 840;
      word-break: keep-all;
    }

    .footer {
      margin-top: 52px;
      padding: 38px 0;
      border-top: 1px solid var(--line);
      background: rgba(255, 253, 246, .9);
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.1fr repeat(3, .7fr) 1.1fr;
      gap: 28px;
      color: var(--muted);
      font-size: 14px;
      font-weight: 720;
      line-height: 1.8;
    }

    .footer-brand {
      margin-bottom: 12px;
      color: var(--green-900);
      font-size: 28px;
      font-weight: 840;
      line-height: 1;
    }

    .footer h3 {
      margin: 0 0 10px;
      color: var(--text);
      font-size: 16px;
      font-weight: 840;
    }

    .download {
      display: inline-flex;
      align-items: center;
      min-height: 36px;
      margin-top: 8px;
      padding: 0 14px;
      border-radius: var(--radius-pill);
      background: var(--green-800);
      color: #fff;
      font-size: 13px;
      font-weight: 840;
    }

    .app-box {
      display: grid;
      grid-template-columns: 1fr 120px;
      gap: 14px;
      align-items: center;
    }

    .app-box img {
      width: 120px;
      height: 82px;
      object-fit: cover;
      border-radius: 16px;
      border: 1px solid var(--line);
    }

    .desktop-rail {
      display: none;
    }

    @media (min-width: 1121px) {
      body {
        padding-right: var(--rail);
      }

      .wide-inner {
        width: min(var(--container), calc(100vw - var(--rail) - 48px));
        margin-left: max(24px, calc(50vw - 160px - 640px));
        margin-right: auto;
      }

      .topbar {
        right: var(--rail);
      }

      .desktop-rail {
        position: fixed;
        top: 82px;
        right: 0;
        bottom: 0;
        z-index: 45;
        width: var(--rail);
        display: flex;
        flex-direction: column;
        gap: 14px;
        padding: 18px;
        overflow-x: hidden;
        overflow-y: auto;
        background:
          radial-gradient(circle at 78% 6%, rgba(255, 207, 51, .32), transparent 34%),
          radial-gradient(circle at 18% 18%, rgba(0, 169, 244, .14), transparent 32%),
          linear-gradient(180deg, #f6fcff 0%, #fff9e8 58%, #dcfff4 100%);
        border-left: 1px solid rgba(216, 236, 240, .95);
        box-shadow: -10px 0 32px rgba(0, 128, 160, .08);
      }

      .desktop-rail .member-card,
      .desktop-rail .benefit-summary {
        box-shadow: 0 12px 28px rgba(0, 128, 160, .09);
      }

      .desktop-rail .rail-title {
        color: var(--muted);
        font-size: 12px;
        font-weight: 760;
        text-transform: uppercase;
        letter-spacing: .04em;
      }

      .desktop-rail .rail-name {
        margin: 4px 0 10px;
        color: var(--green-900);
        font-size: 28px;
        font-weight: 830;
      }

      .desktop-rail .rail-note {
        color: var(--muted);
        font-size: 14px;
        font-weight: 590;
        line-height: 1.45;
      }

      .rail-actions {
        margin-top: auto;
        padding-top: 14px;
        border-top: 1px solid rgba(234, 223, 206, .86);
        display: flex;
        justify-content: space-between;
        gap: 10px;
      }

      .rail-action {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        color: var(--green-900);
        font-size: 13px;
        font-weight: 700;
      }
    }

    @media (max-width: 1390px) {
      .wide-inner {
        width: min(1240px, calc(100vw - var(--rail) - 36px));
        margin-left: 18px;
        margin-right: auto;
      }

      .nav a {
        padding: 0 14px;
        font-size: 15px;
      }

      .search-pill {
        display: none;
      }

      .quick-card {
        min-height: 144px;
      }

      .quick-icon {
        width: 88px;
        height: 88px;
      }

      .hero-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-height: auto;
      }

      .hero-card {
        min-height: 220px;
      }

      .hero-title {
        font-size: 19px;
      }

      .hero-desc {
        min-height: 44px;
        margin-bottom: 10px;
      }

      .hero-desc,
      .tiny-cta {
        font-size: 12px;
      }

      .filter-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }

      .filter-grid .btn-main {
        grid-column: 1 / -1;
      }

      .partner-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }

      .partner-card {
        grid-template-columns: 1fr;
      }

      .partner-img {
        min-height: 160px;
      }

      .footer-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

    .pc-only-block {
      display: none;
    }

    @media (min-width: 1024px) and (max-width: 1120px) {
      .wide-inner {
        width: min(var(--container), calc(100vw - 48px));
        margin-right: auto;
        margin-left: auto;
      }
    }

    @media (max-width: 1023px) {
      body {
        padding-top: 0;
        background:
          radial-gradient(circle at 16% 16%, rgba(255, 211, 202, .38), transparent 34%),
          radial-gradient(circle at 84% 0%, rgba(255, 231, 181, .34), transparent 30%),
          linear-gradient(180deg, #fffdf7 0%, #f7fbf4 100%);
      }

      .topbar,
      .desktop-rail,
      main {
        display: none !important;
      }

      .pc-only-block {
        min-height: 100vh;
        min-height: 100svh;
        display: grid;
        place-items: center;
        padding: 28px;
      }

      .pc-only-card {
        width: min(100%, 420px);
        border-radius: 24px;
        background: rgba(255, 255, 255, .94);
        border: 1px solid rgba(234, 223, 206, .95);
        box-shadow: 0 18px 44px rgba(94, 79, 48, .12);
        padding: 34px 26px 30px;
        text-align: center;
        color: var(--text);
      }

      .pc-only-logo {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 42px;
        padding: 0 18px;
        margin-bottom: 18px;
        border-radius: 999px;
        background: #eaf6df;
        color: var(--green-900);
        font-size: 21px;
        font-weight: 850;
        letter-spacing: 0;
      }

      .pc-only-card h1 {
        margin: 0 0 12px;
        font-size: 27px;
        line-height: 1.22;
        font-weight: 850;
        color: var(--green-900);
        letter-spacing: 0;
      }

      .pc-only-card p {
        margin: 0;
        font-size: 17px;
        line-height: 1.65;
        font-weight: 650;
        color: var(--muted);
        word-break: keep-all;
      }

      .pc-only-sub {
        margin-top: 10px !important;
      }

      .pc-only-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 168px;
        height: 52px;
        margin-top: 24px;
        padding: 0 22px;
        border-radius: 999px;
        background: var(--green);
        color: #fff;
        font-size: 16px;
        font-weight: 800;
        text-decoration: none;
        box-shadow: 0 12px 24px rgba(0, 87, 63, .18);
      }
    }