:root {
      --ivory: #f0ede7;
      --paper: #fbfaf7;
      --greige: #dbd6cd;
      --warm-gray: #807f79;
      --charcoal: #383b39;
      --ink-soft: #5e605b;
      --gold: #a99b83;
      --gold-light: #d2c7b6;
      --line: rgba(74, 72, 67, .17);
      --blue: #335167;
      --serif: "Noto Serif JP", serif;
      --sans: "Noto Sans JP", sans-serif;
      --en: "Cormorant Garamond", serif;
      --page: min(1180px, calc(100% - 10vw));
      --space-xl: clamp(92px, 11vw, 180px);
      --space-lg: clamp(64px, 8vw, 120px);
      --space-md: clamp(36px, 5vw, 72px);
    }

    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--charcoal);
      background: var(--ivory);
      font-family: var(--sans);
      font-weight: 300;
      line-height: 1.9;
      letter-spacing: .05em;
    }
    *, *::before, *::after { box-sizing: border-box; }
    img { max-width: 100%; display: block; }
    a { color: inherit; }
    a:focus-visible, button:focus-visible, iframe:focus-visible {
      outline: 2px solid var(--gold);
      outline-offset: 4px;
    }
    #location, #plan, #quality, #outline { scroll-margin-top: 112px; }

/* Header / navigation: production page markup and link structure are retained. */
    #gHead { top: 0; }
    #gHead .gh-menu { z-index: 30; }
    #gHead .farst_class .tit { color: #111; }

    .proposal-main {
      overflow: hidden;
      padding-top: 96px;
      background: var(--ivory);
    }
    .proposal-main section { position: relative; }
    .section-inner { width: var(--page); margin-inline: auto; }
    .eyebrow {
      margin: 0 0 18px;
      color: var(--gold);
      font-family: var(--en);
      font-size: clamp(17px, 1.6vw, 22px);
      font-weight: 500;
      letter-spacing: .18em;
      line-height: 1;
      text-transform: uppercase;
    }
    .section-title {
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(30px, 4.4vw, 62px);
      font-weight: 400;
      line-height: 1.55;
      letter-spacing: .11em;
    }
    .lead {
      margin: 32px 0 32px;
      color: var(--ink-soft);
      font-size: clamp(14px, 1.3vw, 17px);
      line-height: 2.25;
      letter-spacing: .08em;
    }
    .gold-rule { width: 74px; height: 1px; margin: 30px 0; background: var(--gold); }

    .hero-proposal {
      min-height: min(930px, calc(100svh - 30px));
      display: grid;
      align-items: end;
      isolation: isolate;
      background: #9f9a91;
      color: #fff;
    }
    .hero-proposal::before {
      content: "";
      position: absolute;
      z-index: 5;
      inset: 0;
      width: auto;
      background: #fff;
      clip-path: none;
      pointer-events: none;
      animation: heroWhiteReveal 5.6s cubic-bezier(.4,0,.2,1) 0s forwards;
    }
    @keyframes heroWhiteReveal {
      0%, 6% { opacity: 1; }
      100% { opacity: 0; visibility: hidden; }
    }
    .hero-media {
      position: absolute;
      z-index: 1;
      inset: 0;
      overflow: hidden;
      clip-path: none;
      background: #aaa39a;
    }
    .hero-frame, .hero-shade { position: absolute; inset: 0; }
    .hero-frame {
      background-position: center;
      background-size: cover;
      opacity: 0;
      transform: scale(1.035);
      animation: heroCross 15s infinite;
    }
    .hero-frame:nth-child(1) { background-image: url("assets/kakogawa-premium/ai-daytime-exterior.png"); animation-delay: 0s; }
    .hero-frame:nth-child(2) { background-image: url("assets/kakogawa-premium/ai-bright-living.png"); animation-delay: 5s; }
    .hero-frame:nth-child(3) { background-image: url("assets/kakogawa-premium/ai-daytime-streetscape.png"); animation-delay: 10s; }
    @keyframes heroCross {
      0%, 30% { opacity: 1; transform: scale(1.035); }
      38%, 100% { opacity: 0; transform: scale(1.1); }
    }
    .hero-shade {
      z-index: 1;
      background:
        linear-gradient(90deg, rgba(40,42,40,.62) 0%, rgba(54,56,53,.32) 40%, rgba(72,74,70,.08) 68%, transparent 82%),
        linear-gradient(0deg, rgba(40,39,35,.45) 0%, transparent 48%);
    }
    .hero-content {
      position: relative;
      top: -70px;
      z-index: 3;
      width: var(--page);
      margin-inline: auto;
      padding: clamp(210px, 27vh, 280px) 0 clamp(76px, 10vh, 108px);
      opacity: 0;
      transform: translateY(14px);
      animation: heroCopyReveal 1.35s cubic-bezier(.22,1,.36,1) 2.05s forwards;
    }
    @keyframes heroCopyReveal { to { opacity: 1; transform: none; } }
    .hero-number {
      position: absolute;
      z-index: 0;
      left: auto;
      right: 0;
      top: clamp(34px, 5vh, 58px);
      color: transparent;
      background: linear-gradient(135deg, rgba(255,255,255,.64), rgba(255,255,255,.22));
      -webkit-background-clip: text;
      background-clip: text;
      font-family: var(--en);
      font-size: clamp(170px, 21vw, 300px);
      font-weight: 400;
      line-height: .72;
      letter-spacing: -.06em;
      -webkit-text-stroke: 1px rgba(255,255,255,.16);
    }
    .hero-kicker {
      display: flex;
      align-items: center;
      gap: 18px;
      margin-bottom: 38px;
      color: rgba(255,255,255,.92);
      font-family: var(--en);
      font-size: 15px;
      letter-spacing: .22em;
    }
    .hero-kicker::before { content: ""; width: 54px; height: 1px; background: rgba(255,255,255,.76); }
    .hero-kicker-pc { display: inline; }
    .hero-kicker-sp { display: none; }
    .hero-copy {
      position: relative;
      z-index: 1;
      max-width: 900px;
      margin: 0;
      font-family: var(--serif);
      font-size: clamp(44px, 5.1vw, 74px);
      font-weight: 400;
      line-height: 1.52;
      letter-spacing: .09em;
      text-shadow: 0 5px 28px rgba(38,35,30,.24);
    }
    .hero-emphasis {
      display: inline-block;
      margin: 0 .06em;
      color: #e7c07b;
      font-family: var(--en);
      font-size: 1.34em;
      font-weight: 500;
      line-height: .8;
      letter-spacing: 0;
      text-shadow: 0 5px 24px rgba(42,36,27,.3);
    }
    .hero-sub {
      max-width: 630px;
      margin: 28px 0 0;
      color: rgba(255,255,255,.9);
      font-size: clamp(16px, 1.45vw, 20px);
      line-height: 2;
      letter-spacing: .09em;
    }
    .hero-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 14px 34px;
      align-items: center;
      margin-top: 44px;
      padding-top: 22px;
      border-top: 1px solid rgba(255,255,255,.45);
      font-size: clamp(18px, 1.75vw, 24px);
      letter-spacing: .12em;
    }
    .hero-meta strong { font-family: var(--en); font-size: 32px; font-weight: 500; }
    .hero-caption {
      position: absolute;
      z-index: 2;
      right: 28px;
      bottom: 28px;
      max-width: calc(100% - 56px);
      margin: 0;
      color: rgba(255,255,255,.86);
      font-size: 12px;
      letter-spacing: .12em;
      writing-mode: horizontal-tb;
      text-align: right;
      text-shadow: 0 1px 4px rgba(0,0,0,.6);
    }

    .intro-proposal {
      /* PC / SP both use half of the former vertical padding. */
      padding: calc(var(--space-xl) / 2) 0;
      background:
        radial-gradient(circle at 84% 18%, rgba(255,255,255,.82) 0, rgba(255,255,255,0) 38%),
        linear-gradient(125deg, #fbfaf7 0%, #f0ede7 34%, #d9cfbf 68%, #f5f2ed 100%);
    }
    .intro-proposal::after {
      content: "DESIGN YOUR LIFE";
      position: absolute;
      right: -1vw;
      bottom: -2vw;
      color: rgba(255,255,255,.42);
      font-family: var(--en);
      font-size: clamp(68px, 10vw, 150px);
      line-height: .8;
      letter-spacing: .03em;
      white-space: nowrap;
      pointer-events: none;
    }
    .intro-mobile-break { display: none; }
    .intro-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 210px 1fr; gap: clamp(48px, 9vw, 140px); align-items: center; }
    .intro-grid > div:first-child { padding: 44px 32px; border: 1px solid rgba(74,72,67,.18); background: rgba(251,250,247,.42); }
    .intro-index { color: var(--gold); font-family: var(--en); font-size: clamp(92px, 10vw, 144px); line-height: .72; }
    .intro-side { max-width: 760px; padding: 28px 0; }
    .intro-side .lead { max-width: 700px; }

    .location-proposal { padding: calc(var(--space-xl) / 2) 0; background: var(--ivory); }
    .location-hero { display: grid; grid-template-columns: .76fr 1.24fr; min-height: 680px; background: transparent; }
    .location-photo-wrap { order: 2; }
    .location-photo { min-height: 620px; background: url("https://www.showa-jutaku.co.jp/homenew/sg_kakogawaekimae_p/assets/hero-station.png") center/cover; box-shadow: 40px 40px 0 var(--greige); }
    .location-photo-note { margin: 12px 0 0; color: #8c857b; font-size: 12px; line-height: 1.6; letter-spacing: .04em; text-align: right; }
    .location-copy { position: relative; z-index: 2; order: 1; display: flex; flex-direction: column; justify-content: center; padding: clamp(42px, 6vw, 84px) clamp(30px, 5vw, 70px) clamp(42px, 6vw, 84px) 0; background: transparent; color: var(--charcoal); }
    .location-copy .eyebrow { color: var(--gold); }
    .location-copy .lead { color: var(--ink-soft); }

    @media (min-width: 961px) {
      .location-copy {
        padding: clamp(21px, 3vw, 42px) clamp(15px, 2.5vw, 35px) clamp(21px, 3vw, 42px) 0;
      }
      .location-copy h2 {
        font-size: clamp(22px, 2.35vw, 34px);
        white-space: nowrap;
      }
    }

    .big-number { margin: 0 -11vw 0 0; color: var(--charcoal); font-family: var(--en); font-size: clamp(120px, 18vw, 260px); font-weight: 400; line-height: .7; letter-spacing: -.05em; }
    .big-number small { margin-left: .14em; color: var(--gold); font-size: .22em; letter-spacing: .08em; }
    .location-title-break { display: none; }
    .location-copy h2 { margin: 38px 0 0; color: var(--charcoal); font-family: var(--serif); font-size: clamp(25px, 3vw, 42px); font-weight: 400; line-height: 1.6; letter-spacing: .08em; }
    .access-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 0; border-top: 0 !important; }
    .access-card { position: relative; border-top: 0 !important; background: var(--paper); box-shadow: 0 16px 36px rgba(73,65,55,.06); }
    .access-card:nth-child(even) { transform: translateY(52px); }
    .access-card img { width: 100%; aspect-ratio: 1.55; object-fit: cover; }
    .access-card-body { padding: 22px 20px 26px; }
    .access-card h3 { min-height: 3.4em; margin: 0; font-size: 16px; font-weight: 400; line-height: 1.7; }
    .access-grid .walk { margin: 14px 0 0; color: var(--ink-soft); font-size: 18px !important; line-height: 1.4; }
    .walk strong { margin: 0 4px 0 8px; color: var(--charcoal); font-family: var(--en); font-size: 38px; font-weight: 500; line-height: 1; }
    .access-grid .distance { color: #8c857b; font-size: 18px !important; line-height: 1.4; }
    
    .access-grid::before,
    .access-grid::after,
    .access-card::before,
    .access-card::after {
      content: none !important;
      border: 0 !important;
      background: none !important;
    }
    .access-grid .walk,
    .access-grid .walk * {
      font-size: inherit;
    }
    .access-grid .walk strong {
      font-size: 38px !important;
    }
    .access-grid span.distance {
      font-size: 18px !important;
    }
    .note { margin: 18px 0 0; color: #8c857b; font-size: 12px; }
    .map-shell { margin-top: 106px; padding: clamp(28px, 5vw, 64px); background: #e6e1d9; }
    .map-shell h3 { margin: 0 0 24px; font-family: var(--serif); font-size: 24px; font-weight: 400; letter-spacing: .11em; }
    .map-frame { display: block; width: 100%; height: 420px; border: 0; background: #f8f6f1; }

    .land-plan-proposal {
      padding: calc(var(--space-xl) / 3) 0 var(--space-xl);
      background:
        radial-gradient(circle at 86% 12%, rgba(255,255,255,.94) 0, rgba(255,255,255,0) 36%),
        linear-gradient(128deg, #fbfaf7 0%, #f1eee8 48%, #ded6ca 100%);
    }
    .land-plan-proposal::before {
      content: "FOUR RESIDENCES";
      position: absolute;
      left: -12px;
      bottom: 24px;
      color: rgba(255,255,255,.5);
      font-family: var(--en);
      font-size: clamp(62px, 8vw, 118px);
      line-height: .78;
      letter-spacing: .04em;
      white-space: nowrap;
      pointer-events: none;
    }
    .land-plan-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(360px,.85fr) minmax(500px,1.15fr); gap: clamp(42px,6vw,88px); align-items: center; }
    .land-plan-copy .section-title { font-size: clamp(30px,3vw,40px); letter-spacing: .075em; }
    .land-plan-copy .eyebrow { color: var(--gold); }
    .land-plan-copy .gold-rule { background: var(--gold); }
    .land-plan-copy .lead { max-width: 470px; }
    .plan-facts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 36px; }
    .plan-fact { padding: 10px 15px; border: 1px solid rgba(169,155,131,.32); background: rgba(255,255,255,.42); color: var(--charcoal); font-size: 15px; letter-spacing: .1em; }
    .land-plan-card { position: relative; padding: clamp(18px,2.4vw,32px); border-top: 0; background: rgba(255,255,255,.92); box-shadow: 0 28px 76px rgba(70,64,54,.12); }
    .land-plan-card::before, .land-plan-card::after { content: none; pointer-events: none; }
    .land-plan-card::before { left: 12px; top: 12px; border-left: 1px solid rgba(169,155,131,.5); border-top: 1px solid rgba(169,155,131,.5); }
    .land-plan-card::after { right: 12px; bottom: 12px; border-right: 1px solid rgba(169,155,131,.5); border-bottom: 1px solid rgba(169,155,131,.5); }
    .land-plan-stage { position: relative; overflow: hidden; border: 0; background: #fff; }
    .land-plan-image { display: block; width: 100%; height: auto; }
    .land-plan-note { margin: 16px 0 0; padding-left: 14px; border-left: 2px solid rgba(169,155,131,.52); color: #7e786f; font-size: 12px; line-height: 1.9; }

    .quality-proposal { padding: var(--space-xl) 0; background: var(--paper); }
    .quality-grid { position: relative; min-height: 760px; }
    .quality-proposal .quality-photo {
      width: 78%;
      height: 720px;
      min-height: 720px;
      background: url("assets/kakogawa-premium/ai-daytime-streetscape.png") 62% center/cover;
    }
    .quality-proposal .quality-photo::after { content: none; }
    .quality-copy { position: absolute; z-index: 2; right: 0; top: 50%; width: 49%; padding: clamp(46px, 5vw, 72px); transform: translateY(-50%); background: rgba(251,250,247,.96); box-shadow: 0 24px 70px rgba(70,64,54,.12); }
    .quality-copy .section-title { font-size: clamp(24px, 2.85vw, 37px); letter-spacing: .02em; }
     .quality-copy .section-title .title-line { display: block; white-space: nowrap; }
    .spec-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 42px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .spec-row { display: block; min-width: 0; padding: 22px 12px; border-right: 1px solid var(--line); }
    .spec-row:last-child { border-right: 0; }
    .spec-row span { color: var(--ink-soft); font-size: 15px; }
    .spec-row strong { display: block; margin-top: 12px; font-family: var(--en); font-size: clamp(30px, 3.6vw, 48px); font-weight: 500; line-height: 1; }
    .spec-row strong small { display: block; margin: 9px 0 0; font-family: var(--sans); font-size: 12px; font-weight: 400; letter-spacing: .08em; }

    .performance-embed { background: #fff; }
    .performance-embed iframe { display: block; width: 100%; height: 1092px; min-height: 0; border: 0; }

    .closing-proposal {
      padding: calc(var(--space-xl) * .75) 0;
      text-align: center;
      background:
        radial-gradient(circle at 18% 78%, rgba(255,255,255,.78) 0, rgba(255,255,255,0) 36%),
        linear-gradient(135deg, #f7f4ef 0%, #ded4c5 44%, #cfc2ae 72%, #f4f0e9 100%);
    }
    .closing-proposal .section-title { max-width: 900px; margin-inline: auto; }
    .closing-proposal .lead {
      max-width: 760px;
      margin-inline: auto;
      color: var(--charcoal);
      font-family: var(--serif);
      font-size: clamp(19px, 2vw, 27px);
      font-weight: 400;
      line-height: 1.7;
      letter-spacing: .08em;
    }
    .closing-name-pc { display: block !important; }
    .closing-name-sp { display: none !important; }
    .cta-row { display: grid; grid-template-columns: repeat(2, minmax(0, 360px)); justify-content: center; gap: 18px; margin-top: 52px; }
    .cta {
      position: relative;
      display: grid;
      min-height: 86px;
      padding: 20px 56px 20px 30px;
      place-content: center;
      border: 1px solid var(--gold);
      background: transparent;
      color: var(--charcoal);
      font-size: 14px;
      text-decoration: none;
      letter-spacing: .12em;
      transition: color .35s ease, background .35s ease, transform .35s ease;
    }
    .cta::after { content: "→"; position: absolute; right: 26px; top: 50%; transform: translateY(-50%); color: var(--gold); transition: transform .35s ease; }
    /* 青：資料請求／赤：来場予約 */
    .closing-proposal .cta--request { background: #335167; border-color: #335167; color: #fff; }
    .closing-proposal .cta--reservation { background: #b4434d; border-color: #b4434d; color: #fff; }
    .closing-proposal .cta::after { color: #fff; }
    .closing-proposal .cta:hover { filter: brightness(.88); transform: translateY(-2px); }
    .closing-proposal .cta:hover::after { transform: translate(5px,-50%); }


    @media (min-width: 768px) {
      .hero-meta { position: relative; border-top-color: transparent; }
      .hero-meta::before {
        content: "";
        position: absolute;
        top: -1px;
        left: 0;
        width: 80%;
        border-top: 1px solid rgba(255,255,255,.45);
      }
      .hero-copy { font-size: clamp(40px, 4.7vw, 68px); text-align: left; }
      .hero-emphasis { font-size: 2em; }
      .closing-proposal .section-title { font-size: clamp(27px, 3.5vw, 48px); }
      .closing-proposal .lead { font-size: clamp(22px, 1.8vw, 28px); }
      .closing-proposal .cta { font-size: 16px; }
    }

    .outline-proposal { padding: 0 0 var(--space-lg); background: var(--paper); }
    .outline-proposal h2 { margin: 0 0 34px; font-family: var(--serif); font-size: 26px; font-weight: 400; letter-spacing: .11em; }
    .sales-status { display: grid; grid-template-columns: minmax(190px,.42fr) 1fr; gap: 0; margin-bottom: 42px; border: 1px solid var(--gold-light); background: #f5f1ea; }
    .sales-status__label { display: grid; padding: 24px; place-items: center; background: linear-gradient(135deg,#d7cbb9,#b9aa92); color: #fff; font-family: var(--serif); font-size: 18px; letter-spacing: .14em; text-align: center; }
    .sales-status__body { padding: 24px 30px; color: var(--ink-soft); font-size: 14px; line-height: 2; }
    .sales-status__body strong { display: block; margin-bottom: 4px; color: var(--charcoal); font-size: 14px; font-weight: 500; }
    .outline-table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.9; }
    .outline-table th, .outline-table td { padding: 15px 18px; border-bottom: 1px solid var(--line); vertical-align: top; }
    .outline-table th { width: 24%; background: #f1eee8; font-weight: 500; text-align: left; }
    .outline-notes { margin: 26px 0 0; color: var(--ink-soft); font-size: 13px; line-height: 2; }

    .reveal { opacity: 0; transform: translateY(26px); transition: opacity .9s ease, transform .9s cubic-bezier(.22,1,.36,1); }
    .reveal.is-visible { opacity: 1; transform: none; }

    #footer { background: #335167; }
    #footer img { width: auto; }

    @media (max-width: 960px) {
      :root { --page: calc(100% - 40px); --space-xl: 92px; --space-lg: 72px; }
      .proposal-main { padding-top: 76px; }
      .hero-proposal { min-height: 820px; }
      .hero-media { inset: 0; }
      .hero-content { width: var(--page); margin-inline: auto; padding: 220px 0 88px; }
      .hero-number { top: 92px; right: 0; }
      .hero-copy { font-size: clamp(34px, 9vw, 52px); line-height: 1.65; }
      .hero-sub { max-width: 92%; }
      .hero-caption { right: 18px; bottom: 22px; max-width: calc(100% - 36px); }
      .intro-grid, .location-hero { grid-template-columns: 1fr; }
      .intro-grid { gap: 44px; }
      .intro-grid > div:first-child { width: 190px; }
      .intro-index { font-size: 112px; }
      .location-photo { min-height: 62vw; box-shadow: 22px 22px 0 var(--greige); }
      .location-copy { padding: 52px 30px 58px; }
      .big-number { margin-right: 0; }
      .access-grid { grid-template-columns: repeat(2, 1fr); }
      .access-card:nth-child(even) { transform: none; }
      .land-plan-grid { grid-template-columns: 1fr; }
      .land-plan-copy .lead { max-width: 720px; }
      .land-plan-stage { min-height: 0; }
      .quality-grid { min-height: auto; }
      .quality-proposal .quality-photo { width: 90%; height: 70vw; min-height: 70vw; }
      .quality-copy { position: relative; top: auto; right: auto; width: 80%; margin: -90px 0 0 auto; padding: 52px; transform: none; }
      .performance-embed iframe { height: 1220px; min-height: 0; }
    }
    /* TOPのスマートフォン専用画像（推奨ファイルサイズ：1920×1080px）。
       PC画像とは別ファイルを指定し、幅767px以下で自動的に切り替えます。
       画像の表示領域はcoverのため、端がトリミングされることがあります。 */
    @media (max-width: 767px) {
      .land-plan-proposal { padding-top: 0; }
      .performance-embed { overflow: hidden; }
      .performance-embed iframe { height: 0; min-height: 0 !important; }
      .hero-content { top: -110px; }
      .hero-kicker-pc { display: none; }
      .hero-kicker-sp { display: inline; }
      .hero-copy { font-size: 28px !important; }
      .hero-emphasis { font-size: 2em !important; }
      .closing-name-pc { display: none !important; }
      .closing-name-sp { display: block !important; }
      .proposal-main { padding-top: 0; }
      .location-title-break { display: initial; }
      .intro-proposal {
        padding-top: calc(var(--space-xl) / 2);
        padding-bottom: calc(var(--space-xl) * .75);
      }
      /* Compact horizontal intro number panel for phones. */
       .location-proposal { padding-top: calc(var(--space-xl) / 4); padding-bottom: calc(var(--space-xl) / 4); }
       .location-copy { padding-bottom: 29px; }
       .intro-mobile-break { display: initial; }
      .intro-grid { gap: 24px; }
      .intro-grid > div:first-child {
        display: flex;
        align-items: center;
        gap: 12px;
        width: fit-content;
        max-width: 100%;
        min-height: 0;
        padding: 12px 16px;
      }
      .intro-grid .intro-index { flex: 0 0 auto; font-size: 66px; line-height: 1; }
      .intro-grid > div:first-child .eyebrow {
        flex: 0 0 auto;
        min-width: 0;
        white-space: nowrap;
        margin: 0;
        font-size: clamp(14px, 3.7vw, 17px);
        line-height: 1.35;
      }
      .intro-side { padding: 0; }
      .hero-frame:nth-child(1) { background-image: url("assets/kakogawa-premium/ai-daytime-exterior-sp.png"); }
      .hero-frame:nth-child(2) { background-image: url("assets/kakogawa-premium/ai-bright-living-sp.png"); }
      .hero-frame:nth-child(3) { background-image: url("assets/kakogawa-premium/ai-daytime-streetscape-sp.png"); }
      body.menu-open { overflow: hidden; }
      body.menu-open #gNav {
        visibility: visible !important;
        opacity: 1 !important;
        transform: translateX(0) !important;
      }
      body.menu-open .gh-menu-bar.mod-top { transform: translateY(8px) rotate(45deg); }
      body.menu-open .gh-menu-bar.mod-middle { opacity: 0; }
      body.menu-open .gh-menu-bar.mod-bottom { transform: translateY(-8px) rotate(-45deg); }
    }
    @media (max-width: 560px) {
.hero-proposal { min-height: 700px; }
      .hero-proposal::before { inset: 0; width: auto; clip-path: none; }
      .hero-media { inset: 0; height: auto; clip-path: none; }
      .hero-frame:nth-child(1) { background-position: 60% center; }
      .hero-frame:nth-child(2) { background-position: 58% center; }
      .hero-frame:nth-child(3) { background-position: 55% center; }
      .hero-shade { background: linear-gradient(0deg, rgba(47,43,37,.74), rgba(93,82,67,.14) 74%); }
      .hero-content { width: auto; margin: 0 20px; padding: 250px 0 40px; }
      .hero-number { left: auto; right: -4px; top: 78px; font-size: 148px; }
      .hero-kicker { gap: 12px; font-size: 12px; }
      .hero-kicker::before { width: 32px; }
      .hero-copy { color: #fff; font-size: 28px !important; letter-spacing: .03em; line-height: 1.6; }
      .hero-emphasis { font-size: 2em !important; }
      .hero-sub { margin-top: 20px; font-size: 15px; }
      .hero-meta { gap: 8px 18px; margin-top: 30px; font-size: 18px; }
      .hero-meta strong { font-size: 28px; }
      .hero-caption { top: auto; right: 12px; bottom: 18px; max-width: calc(100% - 24px); color: rgba(255,255,255,.88); writing-mode: horizontal-tb; font-size: 10px; }
      .section-title { font-size: 29px; line-height: 1.65; }
      .lead { margin-top: 24px; font-size: 14px; line-height: 2.1; }
      .intro-index { font-size: 86px; }
      .intro-proposal::after {
        left: 50%;
        right: auto;
        bottom: 12px;
        width: calc(100% - 24px);
        font-size: clamp(34px, 10vw, 44px);
        letter-spacing: .02em;
        text-align: center;
        transform: translateX(-50%);
      }
      .location-photo { min-height: 86vw; }
      .location-copy { padding-inline: 0; }
      .access-grid { margin-top: 72px; }
      .access-grid { gap: 12px; }
      .access-card-body { padding: 16px 14px 20px; }
      .access-card h3 { font-size: 14px; }
      .access-grid span.distance {
        display: block;
        font-size: 14px !important;
        line-height: 1.4;
        white-space: nowrap;
        letter-spacing: 0;
      }
      .walk strong { font-size: 32px; }
      .land-plan-proposal::before {
        left: 50%;
        bottom: 16px;
        width: calc(100% - 24px);
        font-size: clamp(34px, 10vw, 44px);
        letter-spacing: .02em;
        text-align: center;
        transform: translateX(-50%);
      }
      .land-plan-grid { gap: 42px; }
      .plan-facts { display: grid; grid-template-columns: 1fr 1fr; }
      .land-plan-card { padding: 12px; }
      .land-plan-stage { min-height: 0; }
      .quality-proposal .quality-photo { width: 100%; height: 92vw; min-height: 92vw; margin: 0; }
      .quality-copy { width: calc(100% - 24px); margin: -42px 0 0 auto; padding: 34px 24px; }
      .quality-copy .section-title { font-size: clamp(20px, 5.45vw, 27px); letter-spacing: 0; }
      .spec-list { grid-template-columns: 1fr; }
      .spec-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 0;
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }
      .spec-row span { flex: 0 0 auto; }
      .spec-row strong {
        display: flex;
        align-items: baseline;
        gap: 6px;
        margin-top: 0;
        font-size: clamp(48px, 14vw, 64px);
        line-height: .9;
      }
      .spec-row strong small {
        display: inline;
        margin: 0;
        font-size: 13px;
        white-space: nowrap;
      }
      .spec-row:last-child { border-bottom: 0; }
      .cta-row { grid-template-columns: 1fr; }
      .cta { min-height: 78px; }
      .performance-embed {
        overflow: hidden;
      }
      .performance-embed iframe {
        height: 0;
        min-height: 0 !important;
      }
      .map-frame { height: 360px; }
      .sales-status { grid-template-columns: 1fr; }
      .sales-status__label { min-height: 78px; }
      .outline-table, .outline-table tbody, .outline-table tr, .outline-table th, .outline-table td { display: block; width: 100%; }
      .outline-table th { padding-bottom: 8px; border-bottom: 0; }
      .outline-table td { padding-top: 8px; }
    }


/* Campaign banner: shared SHOWA GROUP reservation campaign */
.secCampaign {
  width: 100%;
  margin: 0;
  padding: 2% 0 0;
  background: #faf8f4;
}
.secCampaign .inner {
  width: min(1100px, calc(100% - 40px));
  margin: 0 auto;
}
.secCampaign .booking_kyanpen {
  margin: 0 auto;
}
.secCampaign .booking_kyanpen a {
  display: block;
}
.secCampaign .booking_kyanpen img {
  width: 100%;
  height: auto;
}
.secCampaign .booking_kyanpen iframe {
  display: block;
  width: 100%;
  height: 150px;
  margin: 0;
  border: 0;
  background: transparent;
}

@media (max-width: 769px) {
  .secCampaign {
    padding: 5% 0 0;
  }
  .secCampaign .inner {
    width: 96%;
    margin: 0 2%;
  }
  .secCampaign .booking_kyanpen {
    margin: 0 auto;
  }
  .secCampaign .booking_kyanpen iframe {
    height: 180px;
  }
}

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      .hero-proposal::before { animation: none; opacity: 0; visibility: hidden; }
      .hero-content { animation: none; opacity: 1; transform: none; }
      .hero-frame { animation: none; opacity: 0; transform: none; }
      .hero-frame:first-child { opacity: 1; }
      .reveal { opacity: 1; transform: none; transition: none; }
      .cta { transition: none; }
    }


/* Nearby properties: direct markup, no other property page loaded */
.nearby-properties { padding: 72px 0 84px; background: #fff; }
.nearby-properties__inner { width: min(1100px, calc(100% - 40px)); margin-inline: auto; }
.nearby-properties__eyebrow { margin: 0 0 7px; color: #a99b83; font: 500 18px/1.4 "Cormorant Garamond", serif; letter-spacing: .16em; text-align: center; }
.nearby-properties h2 { margin: 0 0 35px; color: #383b39; font: 500 clamp(23px, 3vw, 32px)/1.6 "Noto Serif JP",serif; letter-spacing: .1em; text-align: center; }
.nearby-properties__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.nearby-properties__card { display: flex; flex-direction: column; min-width: 0; min-height: 228px; padding: 26px 24px 22px; color: #383b39; background: #fbfaf7; border: 1px solid #dbd6cd; text-decoration: none; transition: box-shadow .2s ease, transform .2s ease; }
.nearby-properties__card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(56,59,57,.10); }
.nearby-properties__card:focus-visible { outline: 2px solid #a99b83; outline-offset: 4px; }
.nearby-properties__tag { color: #807f79; font-size: 11px; letter-spacing: .1em; }
.nearby-properties__card strong { display: block; margin: 14px 0 12px; font-size: 17px; font-weight: 500; line-height: 1.7; letter-spacing: .03em; }
.nearby-properties__detail { color: #5e605b; font-size: 13px; line-height: 1.8; }
.nearby-properties__more { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: auto; padding-top: 18px; color: #335167; border-top: 1px solid rgba(74,72,67,.17); font-size: 12px; font-weight: 500; }
.nearby-properties__more span { font-size: 21px; line-height: 1; }
@media (max-width: 767px) {
  .nearby-properties { padding: 48px 0 60px; }
  .nearby-properties__inner { width: calc(100% - 32px); }
  .nearby-properties__grid { grid-template-columns: 1fr; gap: 12px; }
  .nearby-properties__card { min-height: 180px; padding: 20px; }
  .nearby-properties h2 { margin-bottom: 24px; }
}

/* -----------------------------------------------
   sec06 / 近隣のおすすめ物件
   美乃利 style.css の sec06 / picup_list 定義を移植。
   他セクションへの影響防止のため .proposal-main .sec06 に限定。
   ----------------------------------------------- */
.proposal-main .sec06 {
  width: 100%;
  margin-top: 0;
  padding: 0;
  background: transparent;
  color: #383b39;
  font-weight: 400;
  letter-spacing: normal;
  line-height: normal;
}
.proposal-main .sec06 .bg01 {
  width: 100%;
  padding: 5% 0 0;
  background-repeat: repeat;
  background-size: cover;
}
.proposal-main .sec06 .inner { width: 1100px; max-width: 100%; margin: 0 auto; }
.proposal-main .sec06 .inner > h2 {
  font-family: inherit;
  font-size: 160%;
  font-weight: 400;
  line-height: 2;
  letter-spacing: normal;
  text-align: center;
  color: #006a6c;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 2%;
}
.proposal-main .sec06 .inner > h2::before,
.proposal-main .sec06 .inner > h2::after { border-top: 1px solid #006a6c; content: ""; width: 35%; flex-shrink: 1; }
.proposal-main .sec06 .inner > h2::before { margin-right: 1em; }
.proposal-main .sec06 .inner > h2::after { margin-left: 1em; }
.proposal-main .sec06 .picup_list {
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
}
.proposal-main .sec06 .picup_list .list_in {
  width: 45%;
  margin: 3% 2%;
  float: left;
  background: #fff;
  box-shadow: 0 5px 25px 0 rgba(0,0,0,.5);
  display: inline-block;
  padding: 0;
  list-style: none;
}
.proposal-main .sec06 .picup_txt01::after { display: none; }
.proposal-main .sec06 .picup_txt01 {
  font-size: 100%; width: 100%; text-align: center;
  line-height: 1.4; color: #116f8b; margin: 2% 0;
}
.proposal-main .sec06 .picup_txt01 span { font-size: 130%; }
.proposal-main .sec06 .picup_txt02 { font-size: 100%; width: 100%; clear: both; }
.proposal-main .sec06 .picup_list .bukken {
  width: 80%; margin: 1% 10%; border-top: thin solid gray;
  border-bottom: thin solid gray; padding: 3% 0;
}
.proposal-main .sec06 .picup_list dt { width: 26%; font-size: 100%; float: left; text-align: center; color: #116f8b; }
.proposal-main .sec06 .picup_list dd { width: 73%; font-size: 100%; float: left; }
.proposal-main .sec06 .picup_btn01 { margin-bottom: 0; clear: both; }
.proposal-main .sec06 .picup_btn01 a {
  display: block; text-align: center; color: #fff;
  border: 1px solid #000; background: #000;
  font-size: 100%; font-weight: bold; padding: 6px 3px;
  position: relative; transition: .4s;
  text-decoration: none;
}
.proposal-main .sec06 .picup_btn01 a:hover { color: #000; background: #fff; }
.proposal-main .sec06 .picup_btn01 a::after {
  content: ""; position: absolute; top: 0; right: 10px; bottom: 0;
  margin: auto; width: 9px; height: 9px;
  border-top: 2px solid #fff; border-right: 2px solid #fff;
  transform: rotate(45deg); transition: .3s ease-in-out;
}
.proposal-main .sec06 .picup_btn01 a:hover::after { border-color: #000; }
.proposal-main .sec06 .picup_list img { display: block; max-width: 100%; height: auto; }
.proposal-main .sec06 .picup_list a { text-decoration: none; }
.proposal-main .sec06 .picup_list dl::after { content: ""; display: block; clear: both; }
/* Optional fallback only when near/ cannot be loaded. */
.proposal-main .sec06 .nearby-fallback { display: block; min-height: 160px; padding: 24px; color: #116f8b; }
.proposal-main .sec06 .nearby-fallback span { display: block; margin-top: 20px; }
@media only screen and (max-width: 769px) {
  .proposal-main .sec06 { width: 100%; margin: auto; padding: 0; }
  .proposal-main .sec06 .bg01 { width: 100%; padding: 0; }
  .proposal-main .sec06 .inner { display: flex; flex-direction: column; width: 96%; margin: 0 2%; }
  .proposal-main .sec06 .inner > h2 { font-size: 130%; line-height: 2; margin: 2% 0; }
  .proposal-main .sec06 .inner > h2::before,
  .proposal-main .sec06 .inner > h2::after { width: 20%; }
  .proposal-main .sec06 .inner > h2::before { margin-right: .5em; }
  .proposal-main .sec06 .inner > h2::after { margin-left: .5em; }
  .proposal-main .sec06 .picup_list .list_in { float: left; width: 90%; margin: 1% 5% 5%; }
  .proposal-main .sec06 .picup_txt01 { font-size: 90%; margin-top: 0; float: none; }
  .proposal-main .sec06 .picup_txt01 span { font-size: 120%; }
  .proposal-main .sec06 .picup_txt02 { font-size: 90%; }
  .proposal-main .sec06 .picup_list .bukken { width: 94%; margin: 1% 3%; padding: 3% 0; }
  .proposal-main .sec06 .picup_list dt { font-size: 80%; }
  .proposal-main .sec06 .picup_list dd { font-size: 80%; }
  .proposal-main .sec06 .picup_btn01 { font-size: 100%; width: 100%; margin: 1% 0 0; }
}

/* PC: keep the hero description on one line without changing font size. */
@media (min-width: 768px) {
  .hero-proposal .hero-sub {
    max-width: none;
    white-space: nowrap;
  }
}