@charset "UTF-8";
/*
Theme Name: Cloud9 Agcy
Theme URI:
Author: BEN
Author URI:
Description: 合同会社CLOUD9（いい部屋ネット恵庭店）用のオリジナルWordPressテーマ。恵庭・千歳・北広島を中心に不動産管理・賃貸仲介・売買・空き家管理サービスを提供。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: Proprietary
License URI:
Text Domain: cloud9-agcy
Tags: business, real-estate, one-page, responsive
*/

:root {
  --cloud-white: #FAFAFA;
  --jet: #1D1D1B;
  --white: #FFFFFF;
  --n100: #F0F0EE;
  --n200: #DDDCDA;
  --n300: #C5C4C0;
  --n400: #8A8985;
  --n500: #5C5B57;
  --n600: #3A3935;
  --accent: #2BA5B5;
  --accent-hover: #3DC0D1;
  --accent-tint: #EBF7F9;
  --accent-dark: #1B7A87;
  --ff-en: 'Manrope', sans-serif;
  --ff-jp: 'Noto Sans JP', sans-serif;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--cloud-white); color:var(--jet); font-family:var(--ff-jp); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; }

/* ─── PAGE SYSTEM ─── */
/* SPA用の display:none / .active 切替はWPテーマでは不要（1ページ=1テンプレートのため常時表示） */
main > .page,
.page-id-9 > .page { display:block; }

/* ─── NAV ─── */
.nav { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(250,250,250,0.95); backdrop-filter:blur(12px); border-bottom:0.5px solid var(--n200); height:72px; display:flex; align-items:center; justify-content:space-between; padding:0 64px; }
.nav-logo { cursor:pointer; flex-shrink:0; position:relative; z-index:102; display:flex; align-items:center; }
.nav-logo img { height:36px; width:auto; display:block; }
.nav-links { display:flex; gap:0; align-items:center; font-weight:500; font-size:14px; height:100%; }
.nav-links > a:not(.nav-cta), .nav-item { cursor:pointer; transition:color 0.2s; padding:0 20px; height:72px; display:flex; align-items:center; }
.nav-links > a:not(.nav-cta):hover, .nav-item:hover { color:var(--n500); }
.nav-item::after { content:''; width:4px; height:4px; border-right:1px solid var(--n400); border-bottom:1px solid var(--n400); transform:rotate(45deg); margin-left:6px; transition:transform 0.2s; }
.nav-item:hover::after { transform:rotate(-135deg); }
/* Desktop: trigger is inline, accordion arrow hidden */
.mobile-accordion-trigger { display:contents; }
.mobile-accordion-trigger > span:first-child { display:contents; }
.accordion-arrow { display:none; }
.drawer-cta { display:none; }
.nav-cta { background:#2BA5B5; color:var(--cloud-white); padding:10px 24px; text-decoration:none; display:inline-flex; align-items:center; align-self:center; height:auto; font-size:13px; font-weight:500; border:none; cursor:pointer; font-family:var(--ff-jp); letter-spacing:0.5px; transition:all 0.3s; margin-left:12px; flex-shrink:0; }
.nav-cta:hover { background:transparent; color:#2BA5B5; outline:1px solid #2BA5B5; }

/* Mega menu panel */
.mega-panel { position:fixed; top:72px; left:0; right:0; background:var(--white); border-bottom:1px solid var(--n200); box-shadow:0 12px 40px rgba(29,29,27,0.08); padding:40px 64px; opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity 0.25s, visibility 0.25s, transform 0.25s; z-index:99; pointer-events:none; }
.nav-item:hover .mega-panel { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
.mega-inner { max-width:1280px; margin:0 auto; display:grid; gap:48px; }
.mega-inner.cols-3 { grid-template-columns:1fr 1fr 1fr; }
.mega-inner.cols-4 { grid-template-columns:1fr 1fr 1fr 1fr; }
.mega-inner.cols-2 { grid-template-columns:280px 280px; justify-content:start; }
.mega-col { display:flex; flex-direction:column; gap:4px; padding-left:16px; border-left:2px solid var(--n200); }
.mega-col:hover { border-left-color:var(--accent); }
.mega-col-title { font-family:var(--ff-en); font-weight:300; font-size:10px; letter-spacing:4px; text-transform:uppercase; color:var(--accent); margin-bottom:12px; }
.mega-link { display:flex; align-items:center; gap:12px; padding:10px 0; cursor:pointer; transition:all 0.2s; color:var(--jet); }
.mega-link:hover { color:var(--accent); }
.mega-link-icon { width:36px; height:36px; background:var(--accent); border-radius:6px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-family:var(--ff-en); font-size:10px; font-weight:600; color:var(--white); transition:background 0.2s; }
.mega-link:hover .mega-link-icon { background:var(--accent-dark); }
.mega-link-text { display:flex; flex-direction:column; }
.mega-link-text span:first-child { font-size:14px; font-weight:600; letter-spacing:0.3px; }
.mega-link-text span:last-child { font-size:11px; font-weight:400; color:var(--n500); margin-top:2px; line-height:1.4; }
.mega-link:hover .mega-link-text span:last-child { color:var(--jet); }
.mega-divider { width:100%; height:0.5px; background:var(--n200); margin:8px 0; }
.mega-cta { display:inline-flex; align-items:center; justify-content:center; gap:8px; width:180px; height:40px; font-size:12px; font-weight:600; color:var(--white); background:var(--accent); border-radius:4px; margin-top:12px; transition:all 0.2s; cursor:pointer; }
.mega-cta:hover { gap:14px; background:var(--accent-dark); }
.mega-cta::after { content:'→'; }

/* Mobile hamburger */
.nav-hamburger { display:none; width:44px; height:44px; cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:6px; z-index:102; -webkit-tap-highlight-color:transparent; }
.nav-hamburger span { display:block; width:22px; height:1.5px; background:var(--jet); transition:all 0.3s ease; transform-origin:center; }
.nav-hamburger.active span:nth-child(1) { transform:translateY(7.5px) rotate(45deg); }
.nav-hamburger.active span:nth-child(2) { opacity:0; transform:scaleX(0); }
.nav-hamburger.active span:nth-child(3) { transform:translateY(-7.5px) rotate(-45deg); }
.mobile-overlay { display:none; position:fixed; inset:0; background:rgba(49,47,44,0.3); z-index:98; opacity:0; transition:opacity 0.3s; }
.mobile-overlay.active { display:block; opacity:1; }


/* ─── SHARED COMPONENTS ─── */
.section { padding:160px 80px; max-width:1440px; margin:0 auto; }
.section-label { font-family:var(--ff-en); font-weight:300; font-size:10px; letter-spacing:6px; text-transform:uppercase; color:#2BA5B5; }
.section-heading { font-weight:700; font-size:clamp(28px,3vw,44px); line-height:1.2; letter-spacing:1.5px; margin-top:12px; margin-bottom:48px; }
.section-heading-number { font-family:var(--ff-en); font-weight:300; font-size:clamp(64px,6vw,96px); line-height:1; letter-spacing:-2px; color:var(--n300); }
.section-desc { font-size:14px; line-height:1.8; color:var(--n500); }

/* Page Header */
.page-header { padding:160px 80px 80px; max-width:1440px; margin:0 auto; }
.page-header h1 { font-weight:700; font-size:clamp(32px,3.5vw,48px); letter-spacing:2px; line-height:1.2; }
.page-header .subtitle { font-size:15px; line-height:2; color:var(--n500); margin-top:16px; }

/* Buttons */
.btn-primary { background:#2BA5B5; color:var(--cloud-white); padding:14px 32px; font-size:13px; font-weight:500; border:1px solid #2BA5B5; cursor:pointer; font-family:var(--ff-jp); letter-spacing:1px; transition:all 0.3s; display:inline-block; }
.btn-primary:hover { background:transparent; color:#2BA5B5; }
.btn-secondary { background:transparent; color:var(--jet); padding:14px 32px; font-size:13px; font-weight:500; border:1px solid var(--n200); cursor:pointer; font-family:var(--ff-jp); letter-spacing:1px; transition:all 0.3s; display:inline-block; }
.btn-secondary:hover { border-color:var(--jet); }
.service-link { font-family:var(--ff-en); font-weight:500; font-size:13px; letter-spacing:1px; color:#2BA5B5; display:inline-flex; align-items:center; gap:8px; transition:gap 0.3s; cursor:pointer; }
.service-link:hover { gap:14px; }
.service-link::after { content:'→'; }

/* Cards */
.card { border:0.5px solid var(--n200); background:var(--white); overflow:hidden; transition:border-color 0.3s; }
.card:hover { border-color:var(--n400); }
.card-img { aspect-ratio:16/10; background:var(--n200); }
.card-content { padding:28px; display:flex; flex-direction:column; gap:12px; }

/* CTA */
.cta-section { background:#1B7A87; color:var(--cloud-white); padding:120px 80px; text-align:center; }
.cta-inner { max-width:820px; margin:0 auto; }
.cta-heading { font-size:clamp(32px,3.5vw,52px); font-weight:700; line-height:1.25; letter-spacing:2px; margin-bottom:24px; }
.cta-body { font-size:14px; line-height:1.8; color:var(--n300); margin-bottom:40px; }
.cta-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.btn-cta-primary { background:var(--cloud-white); color:var(--jet); padding:14px 36px; font-size:13px; font-weight:500; border:1px solid var(--cloud-white); font-family:var(--ff-jp); letter-spacing:1px; cursor:pointer; transition:all 0.3s; }
.btn-cta-primary:hover { background:transparent; color:var(--cloud-white); }
.btn-cta-secondary { background:transparent; color:var(--cloud-white); padding:14px 36px; font-size:13px; font-weight:500; border:1px solid rgba(255,255,255,0.5); font-family:var(--ff-jp); letter-spacing:1px; cursor:pointer; transition:all 0.3s; }
.btn-cta-secondary:hover { border-color:var(--cloud-white); }

/* Footer */
.footer { padding:80px; border-top:0.5px solid var(--n200); max-width:1440px; margin:0 auto; }
.footer-top { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:40px; }
.footer-brand { display:flex; flex-direction:column; gap:20px; }
.footer-logo { display:flex; align-items:center; }
.footer-logo img { height:32px; width:auto; display:block; }
.footer-info { font-size:12px; line-height:2; color:var(--n500); }
.footer-col { display:flex; flex-direction:column; gap:8px; }
.footer-col-title { font-family:var(--ff-en); font-weight:300; font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--n400); margin-bottom:4px; cursor:default; }
.footer-col a { color:var(--n500); font-size:13px; transition:color 0.2s; cursor:pointer; padding:2px 0; }
.footer-col a:hover { color:var(--jet); }
.footer-bottom { padding-top:40px; margin-top:40px; border-top:0.5px solid var(--n200); display:flex; justify-content:space-between; align-items:center; font-size:12px; color:var(--n400); }
.footer-bottom-links { display:flex; gap:24px; }
.footer-bottom-links a { color:var(--n400); font-size:12px; cursor:pointer; transition:color 0.2s; }
.footer-bottom-links a:hover { color:var(--jet); }
/* Mobile footer accordion toggle (hidden on desktop) */
.footer-col-toggle { display:none; }

/* ─── HERO ─── */
.hero { padding:160px 80px 80px; min-height:100vh; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; max-width:1440px; margin:0 auto; }
.hero-left { display:flex; flex-direction:column; gap:48px; }
.hero-label { font-family:var(--ff-en); font-weight:300; font-size:11px; letter-spacing:6px; text-transform:uppercase; color:var(--accent); opacity:0; animation:fadeUp 0.5s 0.1s forwards; }
.hero-headline { font-weight:700; font-size:clamp(48px,5.5vw,80px); line-height:1.15; letter-spacing:2px; opacity:0; animation:fadeUp 0.5s 0.2s forwards; }
.hero-right { display:flex; flex-direction:column; gap:32px; padding-bottom:12px; opacity:0; animation:fadeUp 0.5s 0.3s forwards; }
.hero-body { font-size:15px; line-height:2; color:var(--n600); font-weight:400; letter-spacing:0.3px; }
.hero-actions { display:flex; gap:16px; }
.hero-image-wrapper { grid-column:1/-1; aspect-ratio:16/7; background:var(--n200); overflow:hidden; opacity:0; animation:fadeUp 0.5s 0.4s forwards; }
.hero-image-wrapper img { width:100%; height:100%; object-fit:cover; display:block; }
.hero-pickup-news { grid-column:1/-1; opacity:0; animation:fadeUp 0.5s 0.5s forwards; }
.hero-pickup-inner { display:flex; align-items:center; gap:32px; padding:28px 32px; border:0.5px solid var(--n200); background:var(--white); cursor:pointer; transition:border-color 0.3s; }
.hero-pickup-inner:hover { border-color:var(--n400); }
.hero-pickup-badge { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.hero-pickup-badge .badge-label { font-family:var(--ff-en); font-weight:600; font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--cloud-white); background:#2BA5B5; padding:6px 14px; }
.hero-pickup-badge .badge-date { font-family:var(--ff-en); font-weight:300; font-size:12px; letter-spacing:2px; color:var(--n400); }
.hero-pickup-title { font-weight:700; font-size:15px; letter-spacing:0.5px; flex:1; line-height:1.5; }
.hero-pickup-arrow { font-family:var(--ff-en); font-size:18px; color:var(--n400); flex-shrink:0; transition:transform 0.3s; }
.hero-pickup-inner:hover .hero-pickup-arrow { transform:translateX(4px); }

/* ─── SERVICE GRID ─── */
.section-header { display:grid; grid-template-columns:1fr 1fr; gap:80px; margin-bottom:80px; align-items:end; }
.section-header-left { display:flex; flex-direction:column; gap:16px; }
.service-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.service-card { border:0.5px solid var(--n200); background:var(--white); overflow:hidden; display:flex; flex-direction:column; transition:border-color 0.3s; }
.service-card:hover { border-color:var(--n400); }
.service-img { aspect-ratio:4/3; background:var(--n100); flex-shrink:0; }
.service-content { padding:32px; display:flex; flex-direction:column; gap:16px; flex:1; }
.service-tag { font-family:var(--ff-en); font-weight:300; font-size:10px; letter-spacing:5px; text-transform:uppercase; color:var(--n400); }
.service-title { font-weight:700; font-size:22px; letter-spacing:1px; line-height:1.3; }
.service-body { font-size:13px; line-height:1.8; color:var(--n500); flex:1; }

/* ─── PICKUP SECTION ─── */
.section-pickup { background:var(--n100); }
.pickup-header { display:flex; justify-content:space-between; align-items:end; margin-bottom:64px; }
.pickup-scroll { display:flex; gap:24px; overflow-x:auto; padding-bottom:32px; scroll-snap-type:x mandatory; -ms-overflow-style:none; scrollbar-width:none; }
.pickup-scroll::-webkit-scrollbar { display:none; }
.pickup-card { min-width:320px; flex-shrink:0; scroll-snap-align:start; background:var(--white); border:0.5px solid var(--n200); overflow:hidden; transition:transform 0.3s; cursor:pointer; }
.pickup-card:hover { transform:translateY(-4px); }
.pickup-card-img { aspect-ratio:3/4; background:var(--n200); }
.pickup-card-body { padding:24px; }
.pickup-card-meta { font-family:var(--ff-en); font-weight:300; font-size:10px; letter-spacing:3px; color:var(--n400); text-transform:uppercase; margin-bottom:8px; }
.pickup-card-title { font-weight:700; font-size:16px; letter-spacing:0.5px; margin-bottom:4px; }
.pickup-card-sub { font-family:var(--ff-en); font-weight:400; font-size:12px; color:var(--n500); }
.pickup-card-price { font-family:var(--ff-en); font-weight:600; font-size:32px; letter-spacing:-1px; line-height:1; margin-top:16px; }
.pickup-card-price span { font-family:var(--ff-jp); font-weight:400; font-size:12px; letter-spacing:1px; color:var(--n500); margin-left:4px; }

/* ─── NEWS GRID ─── */
.news-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:24px; }
.news-card { background:var(--white); border:0.5px solid var(--n200); overflow:hidden; display:flex; flex-direction:column; transition:border-color 0.3s; cursor:pointer; }
.news-card:hover { border-color:var(--n400); }
.news-card:first-child { grid-row:1/3; }
.news-card-img { aspect-ratio:16/10; background:var(--n200); flex-shrink:0; }
.news-card:first-child .news-card-img { flex:1; aspect-ratio:auto; min-height:300px; }
.news-card-content { padding:28px; display:flex; flex-direction:column; gap:12px; }
.news-tag-row { display:flex; gap:12px; align-items:center; }
.news-tag { font-family:var(--ff-en); font-weight:500; font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:4px 10px; background:#EBF7F9; color:#1B7A87; }
.news-date { font-family:var(--ff-en); font-weight:300; font-size:11px; letter-spacing:2px; color:var(--n400); }
.news-title { font-weight:700; font-size:16px; line-height:1.5; letter-spacing:0.5px; }
.news-card:first-child .news-title { font-size:22px; line-height:1.4; }
.news-excerpt { font-size:13px; line-height:1.7; color:var(--n500); }

/* ─── FAQ ─── */
.faq-layout { display:grid; grid-template-columns:380px 1fr; gap:80px; }
.faq-left { position:sticky; top:120px; align-self:start; }
.faq-item { border-bottom:0.5px solid var(--n200); padding:24px 0; }
.faq-question { font-weight:500; font-size:15px; line-height:1.6; cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
.faq-question::after { content:'+'; font-family:var(--ff-en); font-weight:300; font-size:20px; color:var(--n400); transition:transform 0.3s; }
.faq-item.open .faq-question::after { transform:rotate(45deg); }
.faq-answer { font-size:13px; line-height:1.8; color:var(--n500); max-height:0; overflow:hidden; transition:max-height 0.4s ease, padding 0.4s ease; }
.faq-item.open .faq-answer { max-height:200px; padding-top:16px; }

/* FAQ Category Filter */
.faq-cat-btn { background:transparent; border:1px solid var(--n200); padding:8px 20px; font-size:13px; font-weight:500; font-family:var(--ff-jp); cursor:pointer; transition:all 0.2s; color:var(--n500); letter-spacing:0.5px; }
.faq-cat-btn:hover { border-color:var(--n400); color:var(--jet); }
.faq-cat-btn.active { background:#2BA5B5; color:var(--cloud-white); border-color:#2BA5B5; }
.faq-cat-group { transition:opacity 0.3s ease; }
.faq-cat-group.hidden { display:none; }
/* フィルタ時も「先頭グループは上余白なし / 2つ目以降は80px」を維持するため、可視グループ同士の隣接にのみマージンを付与 */
.faq-cat-group:not(.hidden) ~ .faq-cat-group:not(.hidden) { margin-top:80px; }

/* ─── ABOUT PAGE ─── */
.about-intro { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-intro-text { display:flex; flex-direction:column; gap:24px; }
.about-intro-text h2 { font-size:clamp(28px,3vw,40px); font-weight:700; line-height:1.3; letter-spacing:1.5px; }
.about-intro-text p { font-size:14px; line-height:2; color:var(--n500); }
.about-image { aspect-ratio:4/3; background:var(--n200); }
/* 数字カード：区切り線インライン型 */
.stats-grid { display:flex; justify-content:center; gap:0; margin-top:64px; }
.stat-card { flex:1; max-width:240px; text-align:center; padding:0 32px; border-right:1px solid var(--n200); }
.stat-card:last-child { border-right:none; }
.stat-number { font-family:var(--ff-en); font-weight:700; font-size:40px; letter-spacing:-1.5px; line-height:1; margin-bottom:8px; color:var(--accent); }
.stat-label { font-size:10px; color:var(--n500); line-height:1.6; }
@media (max-width:640px) {
  .stats-grid { margin-top:40px; }
  .stat-card { padding:0 12px; }
  .stat-number { font-size:28px; letter-spacing:-1px; margin-bottom:4px; }
  .stat-label { font-size:9px; line-height:1.5; }
}
/* チームセクション：コンパクトカード 4列 */
.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px 20px; margin-top:36px; }
.team-card { text-align:center; padding:24px 0; }
.team-avatar { width:136px; height:136px; border-radius:50%; background:var(--n200); margin:0 auto 10px; overflow:hidden; position:relative; }
.team-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.team-name { font-weight:600; font-size:12px; margin-bottom:1px; letter-spacing:0.3px; }
.team-role { font-size:10px; color:var(--n500); }
/* チーム：もっと見るアコーディオン */
.team-more { display:none; }
.team-more.open { display:grid; grid-template-columns:repeat(4,1fr); gap:12px 20px; }
.team-toggle { display:flex; align-items:center; justify-content:center; gap:6px; margin-top:24px; font-size:12px; font-weight:500; color:var(--n500); cursor:pointer; transition:color 0.2s; letter-spacing:0.5px; }
.team-toggle:hover { color:var(--jet); }
.team-toggle::after { content:'+'; font-family:var(--ff-en); font-weight:300; font-size:16px; transition:transform 0.3s; }
.team-toggle.open::after { transform:rotate(45deg); }

/* ─── CONTACT PAGE ─── */
.contact-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.contact-info { display:flex; flex-direction:column; gap:32px; }
.contact-info-item { display:flex; gap:16px; align-items:flex-start; }
.contact-info-icon { width:24px; height:24px; flex-shrink:0; margin-top:4px; display:flex; align-items:center; justify-content:center; }
.contact-form { display:flex; flex-direction:column; gap:24px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.form-group { display:flex; flex-direction:column; gap:8px; }
.form-group label { font-size:13px; font-weight:500; }
.form-group input, .form-group textarea, .form-group select { border:1px solid var(--n200); padding:12px 16px; font-size:14px; font-family:var(--ff-jp); background:var(--white); outline:none; transition:border-color 0.2s; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { border-color:#2BA5B5; }
.form-group textarea { min-height:160px; resize:vertical; }

/* ─── CAREER PAGE ─── */
.career-values { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:64px; }
.career-value-card { border:0.5px solid var(--n200); padding:40px 32px; display:flex; flex-direction:column; gap:16px; }
.career-value-card h3 { font-size:20px; font-weight:700; letter-spacing:1px; }
.career-value-card p { font-size:13px; line-height:1.8; color:var(--n500); }
.job-list { display:flex; flex-direction:column; gap:24px; margin-top:64px; }
.job-card { border:0.5px solid var(--n200); padding:32px; display:flex; justify-content:space-between; align-items:center; transition:border-color 0.3s; }
.job-card:hover { border-color:var(--n400); }
.job-card-info { display:flex; flex-direction:column; gap:8px; }
.job-card-title { font-weight:700; font-size:18px; letter-spacing:0.5px; }
.job-card-meta { display:flex; gap:16px; font-size:12px; color:var(--n500); }
.job-card-tag { font-family:var(--ff-en); font-size:10px; letter-spacing:2px; padding:4px 10px; background:var(--n100); color:var(--n600); }

/* ─── NEWS LIST PAGE ─── */
.news-list-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.news-list-card { border:0.5px solid var(--n200); background:var(--white); overflow:hidden; transition:border-color 0.3s; cursor:pointer; }
.news-list-card:hover { border-color:var(--n400); }
.news-list-card .card-img { aspect-ratio:3/2; background:var(--n200); }
.news-list-card .card-content { padding:24px; display:flex; flex-direction:column; gap:12px; }

/* ─── NEWS DETAIL ─── */
.article-layout { max-width:768px; margin:0 auto; padding:160px 80px 80px; }
.article-meta { display:flex; gap:16px; align-items:center; margin-bottom:32px; }
.article-body { font-size:15px; line-height:2.2; color:var(--n600); }
.article-body h2 { font-size:24px; font-weight:700; color:var(--jet); margin:48px 0 24px; letter-spacing:1px; }
.article-body p { margin-bottom:24px; }
.article-body blockquote { border-left:2px solid var(--n300); padding-left:24px; margin:32px 0; font-style:italic; color:var(--n500); }
/* ─── COLUMN DETAIL（コラム記事詳細） ─── */
.article-title { font-size:clamp(24px,2.6vw,34px); font-weight:700; line-height:1.45; letter-spacing:0.5px; color:var(--jet); margin:0 0 24px; }
.article-lede { font-size:15px; line-height:2.0; color:var(--n600); margin-bottom:40px; }
.article-hero-img { aspect-ratio:16/9; width:100%; margin:0 0 48px; }
.article-toc { background:var(--n100); border-left:3px solid var(--turquoise,#2BA5B5); padding:28px 32px; margin:0 0 48px; }
.article-toc-label { font-family:var(--ff-en); font-size:11px; letter-spacing:3px; color:var(--n400); margin-bottom:6px; text-transform:uppercase; }
.article-toc-title { font-size:16px; font-weight:700; color:var(--jet); margin-bottom:16px; letter-spacing:1px; }
.article-toc ol { list-style:none; padding:0; margin:0; counter-reset:toc; }
.article-toc ol li { counter-increment:toc; padding:8px 0; border-bottom:0.5px dashed var(--n200); font-size:14px; line-height:1.7; }
.article-toc ol li:last-child { border-bottom:none; }
.article-toc ol li::before { content:counter(toc) ". "; font-family:var(--ff-en); font-weight:600; color:var(--turquoise,#2BA5B5); margin-right:8px; }
.article-toc ol li a { color:var(--n700,var(--jet)); text-decoration:none; transition:color 0.2s; cursor:pointer; }
.article-toc ol li a:hover { color:var(--turquoise,#2BA5B5); }
/* ── パンくずバー：グローバルナビ直下に配置（SEO最適 ol/li 構造） ── */
/* 固定ナビ(.nav)の高さ72pxぶんを padding-top で確保して隠れないようにする */
.breadcrumb-bar {
  padding:88px 80px 16px;   /* 72(nav) + 16(breathing) / 下16 */
  background:var(--cloud-white);
  max-width:1440px;
  margin:0 auto;
}
.breadcrumb-bar .breadcrumb {
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  font-family:var(--ff-en);
  font-size:12px;
  color:var(--n400);
  line-height:1.5;
}
.breadcrumb-bar .breadcrumb-item { display:inline-flex; }
.breadcrumb-bar .breadcrumb-item a {
  color:var(--n400);
  text-decoration:none;
  transition:color 0.2s;
}
.breadcrumb-bar .breadcrumb-item a:hover { color:var(--jet); }
.breadcrumb-bar .breadcrumb-item.is-current > span { color:var(--jet); font-weight:500; }
.breadcrumb-bar .breadcrumb-sep {
  color:var(--n300);
  user-select:none;
  font-size:12px;
}

/* パンくず直後のヒーロー／本文は上余白を詰める（.breadcrumb-bar自体で72pxを確保済み） */
.breadcrumb-bar + .page-header,
.breadcrumb-bar + .content-page,
.breadcrumb-bar ~ .page .page-header,
.breadcrumb-bar ~ .page .content-page { padding-top:40px; }

/* 旧記事内 .breadcrumb（本文中のパンくず）用の互換スタイル */
.entry-content .breadcrumb { font-family:var(--ff-en); font-size:12px; color:var(--n400); margin-bottom:24px; }
.entry-content .breadcrumb a { color:var(--n400); transition:color 0.2s; cursor:pointer; }
.entry-content .breadcrumb a:hover { color:var(--jet); }

/* ─── PROPERTY LIST PAGE ─── */
.property-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.property-card { border:0.5px solid var(--n200); background:var(--white); overflow:hidden; transition:all 0.3s; cursor:pointer; }
a.property-card, a.pickup-card { text-decoration:none; color:inherit; display:block; }
.property-card:hover { border-color:var(--n400); transform:translateY(-4px); }
.property-card .prop-img { aspect-ratio:4/5; background:var(--n200); }
.property-card .prop-body { padding:20px; }
.property-card .prop-meta { font-family:var(--ff-en); font-size:10px; letter-spacing:3px; color:var(--n400); text-transform:uppercase; margin-bottom:8px; }
.property-card .prop-title { font-weight:700; font-size:15px; margin-bottom:4px; }
.property-card .prop-sub { font-family:var(--ff-en); font-size:12px; color:var(--n500); }
.property-card .prop-price { font-family:var(--ff-en); font-weight:600; font-size:28px; letter-spacing:-1px; margin-top:12px; }
.property-card .prop-price span { font-family:var(--ff-jp); font-weight:400; font-size:11px; color:var(--n500); margin-left:4px; }

/* ─── PROPERTY DETAIL ─── */
.prop-detail-header { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
.prop-detail-gallery { aspect-ratio:4/3; background:var(--n200); }
.prop-detail-info { display:flex; flex-direction:column; gap:24px; }
.prop-detail-info h1 { font-size:32px; font-weight:700; letter-spacing:1.5px; }
.prop-detail-price { font-family:var(--ff-en); font-weight:600; font-size:48px; letter-spacing:-2px; }
.prop-detail-price span { font-family:var(--ff-jp); font-weight:400; font-size:14px; color:var(--n500); margin-left:8px; }
.prop-detail-table { width:100%; margin-top:24px; }
.prop-detail-table tr { border-bottom:0.5px solid var(--n200); }
.prop-detail-table th { text-align:left; padding:12px 0; font-size:13px; font-weight:500; width:120px; color:var(--n500); vertical-align:top; }
.prop-detail-table td { padding:12px 0; font-size:14px; vertical-align:top; }

/* ─── PORTAL CARDS ─── */
.portal-cards { display:flex; flex-direction:column; gap:16px; max-width:680px; }
.portal-card { display:flex; align-items:center; gap:24px; padding:32px; border:.5px solid var(--n200); background:var(--white, #fff); text-decoration:none; color:var(--jet); transition:border-color .2s, box-shadow .2s; }
.portal-card:hover { border-color:var(--n300); box-shadow:0 4px 24px rgba(29,29,27,.06); }
.portal-card-inner { flex:1; }
.portal-card-name { font-weight:700; font-size:18px; letter-spacing:.5px; }
.portal-card-desc { font-size:13px; color:var(--n500); line-height:1.8; margin-top:8px; }
.portal-card-url { font-family:var(--ff-en); font-weight:300; font-size:11px; letter-spacing:1px; color:var(--n400); margin-top:8px; }
.portal-card-arrow { font-family:var(--ff-en); font-size:24px; font-weight:300; color:var(--n300); transition:color .2s, transform .2s; flex-shrink:0; }
.portal-card:hover .portal-card-arrow { color:var(--jet); transform:translateX(4px); }

/* ─── COMPANY TABLE (about page) ─── */
.company-table th { width:160px; padding:16px 32px 16px 0; }
.company-table td { padding:16px 0; }
.company-table .note { display:block; font-size:12px; color:var(--n400); margin-top:4px; }

/* ─── PROPERTY PHOTO CAROUSEL ─── */
.prop-carousel { margin-top:24px; position:relative; overflow:hidden; }
.prop-carousel-track { display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; -ms-overflow-style:none; scrollbar-width:none; padding-bottom:8px; }
.prop-carousel-track::-webkit-scrollbar { display:none; }
.prop-carousel-item { flex:0 0 calc(25% - 9px); aspect-ratio:4/3; background:var(--n200); cursor:pointer; scroll-snap-align:start; border:2px solid transparent; transition:border-color 0.3s, opacity 0.3s; overflow:hidden; }
.prop-carousel-item:hover { opacity:0.85; }
.prop-carousel-item.active { border-color:#2BA5B5; }
.prop-carousel-item img { width:100%; height:100%; object-fit:cover; }
.prop-carousel-nav { position:absolute; top:50%; transform:translateY(-50%); width:36px; height:36px; background:rgba(29,29,27,0.7); color:var(--cloud-white); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:16px; z-index:2; transition:background 0.2s; }
.prop-carousel-nav:hover { background:rgba(29,29,27,0.9); }
.prop-carousel-nav.prev { left:0; }
.prop-carousel-nav.next { right:0; }

/* ─── PRIVACY / SIMPLE CONTENT ─── */
.content-page { max-width:768px; margin:0 auto; padding:160px 80px 80px; }
.content-page h1 { font-size:32px; font-weight:700; letter-spacing:1.5px; margin-bottom:16px; }
.content-page .lead { font-size:14px; line-height:1.8; color:var(--n500); margin-bottom:48px; }
.content-page h2 { font-size:20px; font-weight:700; letter-spacing:1px; margin:40px 0 16px; }
.content-page p { font-size:14px; line-height:2; color:var(--n600); margin-bottom:16px; }

/* ─── STATUS PAGE (404, thanks 等) ─── */
.status-page { min-height:60vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:160px 80px 80px; }
.status-page h1 { font-size:clamp(36px,4vw,56px); font-weight:700; letter-spacing:2px; margin-bottom:16px; }
.status-page p { font-size:15px; color:var(--n500); line-height:1.8; margin-bottom:32px; }

/* ─── 404 PAGE (Variation B: イラスト+親しみ型) ─── */
.v404-b { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:160px 40px 80px; background:var(--cloud-white); }
.v404-b-illustration { width:260px; height:260px; margin-bottom:40px; animation:bob 5s ease-in-out infinite; }
@keyframes bob { 0%,100% { transform:translateY(0) rotate(-1deg); } 50% { transform:translateY(-10px) rotate(1deg); } }
.v404-b-label { margin-bottom:16px; }
.v404-b-heading { font-size:clamp(28px,3vw,36px); font-weight:700; letter-spacing:1.5px; line-height:1.3; text-align:center; margin-bottom:20px; }
.v404-b-heading .accent { color:var(--accent); }
.v404-b-message { font-size:14px; line-height:2; color:var(--n500); max-width:520px; text-align:center; margin-bottom:40px; }
.v404-b-actions { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }

/* ─── THANKS PAGE (Variation A: 大型タイポ+グラデ) ─── */
.vthx-a { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:160px 40px 80px; text-align:center; position:relative; overflow:hidden; background:linear-gradient(135deg, var(--accent-dark) 0%, var(--accent) 50%, var(--accent-hover) 100%); color:var(--white); }
.vthx-a::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle at 15% 20%, rgba(255,255,255,0.1) 0%, transparent 50%), radial-gradient(circle at 85% 80%, rgba(255,255,255,0.08) 0%, transparent 50%); }
.vthx-a-label { font-family:var(--ff-en); font-weight:300; font-size:11px; letter-spacing:8px; text-transform:uppercase; color:rgba(255,255,255,0.8); margin-bottom:32px; position:relative; z-index:2; }
.vthx-a-heading { font-family:var(--ff-en); font-weight:300; font-size:clamp(64px,10vw,160px); line-height:0.95; letter-spacing:-2px; margin-bottom:48px; position:relative; z-index:2; animation:fadeUp 1s ease-out forwards; opacity:0; }
.vthx-a-jp { font-family:var(--ff-jp); font-size:clamp(20px,2vw,28px); font-weight:700; letter-spacing:2px; line-height:1.5; margin-bottom:24px; position:relative; z-index:2; }
.vthx-a-message { font-size:14px; line-height:2; color:rgba(255,255,255,0.85); max-width:520px; margin-bottom:48px; position:relative; z-index:2; }
.vthx-a-button { background:var(--white); color:var(--accent-dark); padding:14px 40px; font-size:13px; font-weight:600; letter-spacing:1px; border:none; cursor:pointer; font-family:var(--ff-jp); transition:all 0.3s; position:relative; z-index:2; }
.vthx-a-button:hover { background:transparent; color:var(--white); outline:1px solid var(--white); }

/* ─── CONTENT-PAGE h3 (プライバシーポリシー用) ─── */
.content-page h3 { font-size:16px; font-weight:700; letter-spacing:0.5px; margin:32px 0 12px; color:var(--n600); }

/* ─── MANAGEMENT HUB ─── */
.mgmt-hub-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:64px; }
.mgmt-hub-card { border:0.5px solid var(--n200); background:var(--white); overflow:hidden; transition:all 0.3s; cursor:pointer; }
.mgmt-hub-card:hover { border-color:var(--n400); transform:translateY(-4px); }
.mgmt-hub-card .hub-img { aspect-ratio:16/10; background:var(--n200); overflow:hidden; }
.mgmt-hub-card .hub-img img { width:100%; height:100%; object-fit:cover; display:block; }
.mgmt-hub-card .hub-body { padding:32px; display:flex; flex-direction:column; gap:16px; }
.mgmt-hub-card .hub-body h3 { font-size:22px; font-weight:700; letter-spacing:1px; }
.mgmt-hub-card .hub-body p { font-size:13px; line-height:1.8; color:var(--n500); }
.mgmt-tab-nav { display:flex; gap:0; border-bottom:1px solid var(--n200); margin-bottom:48px; }
.mgmt-tab { padding:16px 32px; font-size:14px; font-weight:500; cursor:pointer; color:var(--n400); border-bottom:2px solid transparent; transition:all 0.2s; }
.mgmt-tab.active, .mgmt-tab:hover { color:#2BA5B5; border-bottom-color:#2BA5B5; }

/* Service LP sections */
.lp-strengths { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:48px; }
.lp-strength-card { text-align:center; padding:32px 24px; }
.lp-strength-icon { width:64px; height:64px; background:#EBF7F9; border-radius:50%; margin:0 auto 20px; display:flex; align-items:center; justify-content:center; }
.lp-strength-card h3 { font-size:16px; font-weight:700; margin-bottom:12px; }
.lp-strength-card p { font-size:13px; line-height:1.8; color:var(--n500); }
.lp-problems { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:48px; max-width:960px; margin-left:auto; margin-right:auto; }
.lp-problem-item { border:0.5px solid var(--n200); padding:24px 32px; display:flex; align-items:center; gap:16px; }
.lp-problem-icon { width:48px; height:48px; background:#EBF7F9; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.lp-problem-item span { font-size:14px; }
.lp-flow { display:grid; grid-template-columns:repeat(6,1fr); gap:16px; margin-top:48px; }
.lp-flow-step { text-align:center; position:relative; }
.lp-flow-step::after { content:'→'; position:absolute; right:-12px; top:50px; font-family:var(--ff-en); font-size:16px; color:var(--n300); }
.lp-flow-step:last-child::after { display:none; }
.lp-flow-num { font-family:var(--ff-en); font-size:11px; color:var(--n400); letter-spacing:2px; margin-bottom:8px; }
.lp-flow-icon { width:56px; height:56px; background:#EBF7F9; border-radius:50%; margin:0 auto 12px; display:flex; align-items:center; justify-content:center; }
.lp-flow-step h3, .lp-flow-step h4 { font-size:13px; font-weight:700; margin-bottom:4px; }
.lp-flow-step p { font-size:11px; color:var(--n500); line-height:1.5; }
.lp-support-layout { display:grid; grid-template-columns:1fr 1fr; gap:64px; margin-top:48px; align-items:center; }
.lp-support-img { aspect-ratio:1; background:var(--n100); }
.lp-support-list { display:flex; flex-direction:column; gap:16px; }
.lp-support-item { display:flex; align-items:center; gap:12px; font-size:14px; }
.lp-support-item::before { content:'✓'; color:var(--n400); font-family:var(--ff-en); }
.lp-quality { display:grid; grid-template-columns:repeat(5,1fr); gap:24px; margin-top:48px; }
.lp-quality-card { text-align:center; }
.lp-quality-icon { width:56px; height:56px; background:#EBF7F9; border-radius:50%; margin:0 auto 16px; display:flex; align-items:center; justify-content:center; }
.lp-quality-card h3, .lp-quality-card h4 { font-size:14px; font-weight:700; margin-bottom:8px; }
.lp-quality-card p { font-size:12px; line-height:1.7; color:var(--n500); }

/* Tenant guide */
.tenant-guide-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:48px; max-width:900px; margin-left:auto; margin-right:auto; }
.tenant-guide-link { border:0.5px solid var(--n200); padding:24px 28px; display:flex; align-items:center; gap:16px; cursor:pointer; transition:border-color 0.3s; }
.tenant-guide-link:hover { border-color:var(--n400); }
.tenant-guide-link .tg-icon { width:44px; height:44px; background:var(--n100); border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.tenant-guide-link span { font-size:14px; font-weight:500; flex:1; }
.tenant-guide-link::after { content:'→'; color:var(--n400); font-size:18px; }
.tenant-contact-table { width:100%; border-collapse:collapse; margin-top:48px; max-width:900px; margin-left:auto; margin-right:auto; }
.tenant-contact-table th, .tenant-contact-table td { border:0.5px solid var(--n200); padding:20px 24px; text-align:left; font-size:13px; }
.tenant-contact-table thead th { background:var(--n100); font-weight:500; font-size:12px; color:var(--n500); }
.tenant-contact-table .tc-title { font-weight:700; font-size:14px; display:block; margin-bottom:4px; }
.tenant-contact-table .tc-sub { font-size:12px; color:var(--n500); }
.tenant-contact-table .tc-tel { font-family:var(--ff-en); font-weight:600; font-size:16px; }
.manner-layout { display:grid; grid-template-columns:1fr 1fr; gap:64px; margin-top:48px; }
.manner-col h3 { font-size:18px; font-weight:700; margin-bottom:24px; padding-bottom:12px; border-bottom:0.5px solid var(--n200); }
.manner-item { display:flex; gap:16px; margin-bottom:24px; }
.manner-item .m-icon { width:40px; height:40px; background:var(--n100); border-radius:50%; flex-shrink:0; margin-top:2px; display:flex; align-items:center; justify-content:center; }
.manner-item h4 { font-size:14px; font-weight:700; margin-bottom:4px; }
.manner-item p { font-size:12px; line-height:1.7; color:var(--n500); }
.leave-flow { max-width:700px; margin:48px auto 0; }
.leave-step { display:flex; gap:24px; padding-bottom:32px; position:relative; }
.leave-step::before { content:''; position:absolute; left:20px; top:44px; bottom:0; width:1px; background:var(--n200); }
.leave-step:last-child::before { display:none; }
.leave-step .ls-num { width:40px; height:40px; background:#2BA5B5; color:var(--cloud-white); font-family:var(--ff-en); font-size:12px; display:flex; align-items:center; justify-content:center; border-radius:50%; flex-shrink:0; position:relative; z-index:1; }
.leave-step .ls-content h3, .leave-step .ls-content h4 { font-size:15px; font-weight:600; margin-bottom:4px; margin-top:8px; }
.leave-step .ls-content p { font-size:13px; line-height:1.7; color:var(--n500); }
.leave-notes { max-width:700px; margin:32px auto 0; display:flex; flex-direction:column; gap:16px; }
.leave-note { border:0.5px solid var(--n200); padding:24px; }
.leave-note h3, .leave-note h4 { font-size:13px; font-weight:700; margin-bottom:4px; }
.leave-note p { font-size:12px; line-height:1.7; color:var(--n500); }

/* Broker page */
.broker-cards { display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:48px; }
.broker-card { border:0.5px solid var(--n200); padding:32px; }
.broker-card-header { display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.broker-card-header .bc-icon { width:44px; height:44px; background:var(--n100); border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.broker-card-header h3 { font-size:18px; font-weight:700; }
.broker-card p { font-size:13px; line-height:1.8; color:var(--n500); margin-bottom:16px; }
.broker-link-list { display:flex; flex-direction:column; gap:8px; }
.broker-link-item { border:0.5px solid var(--n200); padding:14px 20px; display:flex; justify-content:space-between; align-items:center; font-size:13px; transition:border-color 0.2s; }
.broker-link-item:hover { border-color:var(--n400); }
.broker-link-item::after { content:'→'; color:var(--n400); }
.broker-contact-item { display:flex; align-items:flex-start; gap:16px; margin-bottom:12px; }
.broker-contact-item .bci-icon { width:36px; height:36px; background:var(--n100); border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.broker-contact-item h4 { font-size:13px; font-weight:700; margin-bottom:2px; }
.broker-contact-item p { font-size:12px; color:var(--n500); }
.broker-flow { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:48px; }
.broker-flow-step { text-align:center; position:relative; }
.broker-flow-step::after { content:'→'; position:absolute; right:-16px; top:60px; color:var(--n300); }
.broker-flow-step:last-child::after { display:none; }
.broker-flow-step .bf-num { font-family:var(--ff-en); font-size:11px; color:var(--n400); letter-spacing:2px; margin-bottom:8px; }
.broker-flow-step .bf-icon { width:64px; height:64px; background:var(--n100); border-radius:50%; margin:0 auto 16px; display:flex; align-items:center; justify-content:center; }
.broker-flow-step h3, .broker-flow-step h4 { font-size:15px; font-weight:600; margin-bottom:8px; }
.broker-flow-step p { font-size:12px; line-height:1.6; color:var(--n500); }
.broker-consign { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:48px; }
.broker-consign-card { text-align:center; padding:24px; }
.broker-consign-card .bcc-icon { width:56px; height:56px; background:var(--n100); border-radius:50%; margin:0 auto 16px; display:flex; align-items:center; justify-content:center; }
.broker-consign-card h3, .broker-consign-card h4 { font-size:15px; font-weight:700; margin-bottom:8px; }
.broker-consign-card p { font-size:12px; line-height:1.7; color:var(--n500); }
.broker-form { max-width:640px; margin:48px auto 0; border:0.5px solid var(--n200); padding:40px; }
.broker-form .form-group { margin-bottom:20px; }

@media (max-width:1024px) {
  .mgmt-hub-grid { grid-template-columns:1fr; }
  .lp-strengths { grid-template-columns:1fr; }
  .lp-problems { grid-template-columns:1fr; }
  .lp-flow { grid-template-columns:repeat(3,1fr); }
  .lp-flow-step::after { display:none; }
  .lp-support-layout { grid-template-columns:1fr; }
  .lp-quality { grid-template-columns:repeat(2,1fr); }
  .tenant-guide-grid { grid-template-columns:1fr; }
  .manner-layout { grid-template-columns:1fr; }
  .broker-cards { grid-template-columns:1fr; }
  .broker-flow { grid-template-columns:repeat(2,1fr); }
  .broker-flow-step::after { display:none; }
  .broker-consign { grid-template-columns:1fr; }
  /* モバイル：固定ナビ(72px)下に十分なクリアランスを確保（72+12=84px） */
  .breadcrumb-bar { padding:84px 24px 12px; font-size:11px; }
  .breadcrumb-bar .breadcrumb { gap:6px; font-size:11px; }
  .breadcrumb-bar + .page-header,
  .breadcrumb-bar + .content-page,
  .breadcrumb-bar ~ .page .page-header,
  .breadcrumb-bar ~ .page .content-page { padding-top:32px; }
}

/* ─── ANIMATIONS ─── */
@keyframes fadeUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
.reveal { opacity:0; transform:translateY(32px); transition:opacity 0.7s, transform 0.7s; }
.reveal.visible { opacity:1; transform:translateY(0); }
.stagger > * { opacity:0; transform:translateY(20px); transition:opacity 0.5s, transform 0.5s; }
.stagger.visible > *:nth-child(1) { transition-delay:0s; }
.stagger.visible > *:nth-child(2) { transition-delay:0.1s; }
.stagger.visible > *:nth-child(3) { transition-delay:0.15s; }
.stagger.visible > *:nth-child(4) { transition-delay:0.2s; }
.stagger.visible > * { opacity:1; transform:translateY(0); }

/* ─── RESPONSIVE ─── */
@media (max-width:1280px) {
  .footer-top { grid-template-columns:1fr 1fr 1fr 1fr; gap:32px; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:1080px) {
  .nav { padding:0 20px; }
  .nav.drawer-open { background:var(--cloud-white); border-bottom-color:var(--n200); backdrop-filter:none; -webkit-backdrop-filter:none; }
  .nav.drawer-open::after { content:''; position:absolute; bottom:0; left:0; right:0; height:1px; background:var(--n200); z-index:103; }
  .nav-links { display:none; }
  .nav-links.mobile-open {
    display:flex; flex-direction:column; position:fixed; top:0; left:0; right:0; bottom:0;
    background:var(--cloud-white); padding:88px 0 0; gap:0; overflow-y:auto; z-index:98;
    -webkit-overflow-scrolling:touch; align-items:stretch;
  }

  /* Mobile nav items: large touch targets, full width, left aligned */
  .nav-links.mobile-open > a {
    height:auto; padding:20px 24px; border-bottom:0.5px solid var(--n200);
    font-size:16px; font-weight:600; letter-spacing:0.5px;
    display:flex; align-items:center; justify-content:flex-start; min-height:56px; width:100%;
    -webkit-tap-highlight-color:transparent;
  }
  .nav-links.mobile-open > a:active { background:var(--n100); }

  /* Mobile nav-item (accordion parent) */
  .nav-links.mobile-open .nav-item {
    height:auto; padding:0; border-bottom:0.5px solid var(--n200);
    flex-direction:column; align-items:stretch; font-size:16px; font-weight:600;
    width:100%;
  }
  .nav-links.mobile-open .nav-item::after { display:none; }
  .nav-links.mobile-open .mobile-accordion-trigger { display:flex !important; }
  .nav-links.mobile-open .accordion-arrow { display:flex !important; }

  /* Accordion trigger bar */
  .nav-links.mobile-open .nav-item > .mobile-accordion-trigger {
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 24px; min-height:56px; cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .nav-links.mobile-open .nav-item > .mobile-accordion-trigger:active { background:var(--n100); }
  .nav-links.mobile-open .nav-item > .mobile-accordion-trigger .accordion-arrow {
    width:20px; height:20px; display:flex; align-items:center; justify-content:center;
    font-family:var(--ff-en); font-size:18px; font-weight:300; color:var(--n400);
    transition:transform 0.3s;
  }
  .nav-links.mobile-open .nav-item.accordion-open > .mobile-accordion-trigger .accordion-arrow {
    transform:rotate(180deg);
  }

  /* Accordion panel (sub-links) */
  .nav-links.mobile-open .mega-panel {
    position:static; opacity:1; visibility:visible; transform:none;
    padding:0; border:none; backdrop-filter:none; background:var(--cloud-white); box-shadow:none;
    pointer-events:auto;
    max-height:0; overflow:hidden; transition:max-height 0.35s ease;
  }
  .nav-links.mobile-open .nav-item.accordion-open .mega-panel {
    max-height:800px;
  }
  .nav-links.mobile-open .mega-inner {
    grid-template-columns:1fr !important; gap:0; padding:8px 0;
  }
  .nav-links.mobile-open .mega-col { padding:0; gap:0; border-left:none; }
  .nav-links.mobile-open .mega-col-title {
    padding:12px 24px 4px 40px; font-size:10px; margin-bottom:0;
  }
  .nav-links.mobile-open .mega-link {
    padding:14px 24px 14px 40px; gap:14px; min-height:52px;
    border-bottom:0.5px solid var(--n200);
  }
  .nav-links.mobile-open .mega-link:last-child { border-bottom:none; }
  .nav-links.mobile-open .mega-link:active { background:rgba(43,165,181,0.06); }
  .nav-links.mobile-open .mega-link-icon {
    width:32px; height:32px; font-size:9px; border-radius:4px;
  }
  .nav-links.mobile-open .mega-link-text span:first-child { font-size:14px; }
  .nav-links.mobile-open .mega-link-text span:last-child { font-size:11px; }
  .nav-links.mobile-open .mega-divider { display:none; }
  /* モバイルドロワー：Contact列をまるごと非表示 */
  .nav-links.mobile-open .mega-col-contact { display:none; }

  /* CTA button at bottom */
  .nav-links.mobile-open .nav-cta { display:none; }
  .nav-links.mobile-open .drawer-cta {
    display:flex; flex-direction:column;
    margin:auto 0 0; width:100%;
    border-top:3px solid var(--accent);
    background:var(--white);
  }
  .drawer-cta-tel {
    display:flex; align-items:center; justify-content:center; gap:14px;
    padding:16px 24px; color:var(--jet);
    text-decoration:none; border-bottom:.5px solid var(--n100);
  }
  .drawer-cta-tel-txt { display:flex; flex-direction:column; line-height:1.2; }
  .drawer-cta-tel-lbl { font-size:10px; color:var(--n400); letter-spacing:.5px; }
  .drawer-cta-tel-num { font-family:var(--ff-en); font-weight:700; font-size:20px; letter-spacing:.5px; color:var(--jet); margin-top:2px; }
  .drawer-cta-form {
    display:flex; align-items:center; justify-content:center;
    gap:10px; padding:18px 24px;
    background:var(--accent); color:var(--white);
    font-weight:700; font-size:14px; letter-spacing:1px;
    text-decoration:none;
  }

  .nav-hamburger { display:flex; }
  .section, .page-header, .content-page, .article-layout { padding-left:24px; padding-right:24px; }
  .hero { padding:120px 24px 40px; grid-template-columns:1fr; gap:40px; min-height:auto; }
  .hero-image-wrapper { grid-column:auto; }
  .hero-pickup-news { grid-column:auto; }
  .hero-pickup-inner { flex-direction:column; align-items:flex-start; gap:12px; padding:20px; }
  .hero-pickup-badge { flex-wrap:wrap; }
  .section-header { grid-template-columns:1fr; gap:24px; }
  .service-grid { grid-template-columns:1fr; }
  .service-card:first-child { grid-row:auto; }
  .news-grid { grid-template-columns:1fr; }
  .news-card:first-child { grid-row:auto; }
  .faq-layout { grid-template-columns:1fr; gap:40px; }
  .faq-left { position:static; }
  .footer { padding:40px 24px; }
  .footer-top { grid-template-columns:1fr; gap:0; }
  .footer-brand { padding-bottom:32px; margin-bottom:8px; border-bottom:0.5px solid var(--n200); }

  /* Footer columns: accordion style on mobile */
  .footer-col { border-bottom:0.5px solid var(--n200); gap:0; overflow:hidden; }
  .footer-col-title {
    display:flex; justify-content:space-between; align-items:center;
    padding:18px 0; margin-bottom:0; cursor:pointer;
    font-size:11px; letter-spacing:3px;
    -webkit-tap-highlight-color:transparent;
  }
  .footer-col-toggle { display:block; font-size:16px; font-weight:300; color:var(--n400); transition:transform 0.3s; }
  .footer-col.footer-col-open .footer-col-toggle { transform:rotate(180deg); }
  .footer-col a {
    max-height:0; overflow:hidden; padding:0; opacity:0;
    transition:max-height 0.3s, padding 0.3s, opacity 0.3s;
    font-size:14px;
  }
  .footer-col.footer-col-open a {
    max-height:48px; padding:10px 0 10px 16px; opacity:1;
  }
  .footer-col.footer-col-open a:last-child { padding-bottom:18px; }

  .footer-bottom { flex-direction:column; gap:16px; align-items:flex-start; margin-top:32px; padding-top:32px; }
  .footer-bottom-links { gap:16px; }
  .about-intro { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:1fr; }
  .team-grid, .team-more.open { grid-template-columns:repeat(3,1fr); gap:20px; }
  .contact-layout { grid-template-columns:1fr; }
  .career-values { grid-template-columns:1fr; }
  .property-grid { grid-template-columns:repeat(2,1fr); }
  .prop-detail-header { grid-template-columns:1fr; }
  .news-list-grid { grid-template-columns:1fr; }
  .cta-section { padding:80px 24px; }
  #page-faq .page-header + div { padding-left:24px; padding-right:24px; }
  .faq-cat-btn { font-size:12px; padding:6px 14px; }
}
/* ─── IMAGE PLACEHOLDERS (Grayscale) ─── */
/* All image areas reset to flat grayscale */
.hero-image-wrapper,
.service-img,
.pickup-card-img,
.news-card-img,
.card-img,
.about-image,
.team-avatar,
.career-value-img,
.article-hero-img,
.prop-img,
.prop-detail-gallery,
.hub-img,
.lp-support-img {
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}
.lp-strength-icon,
.lp-problem-icon,
.lp-flow-icon,
.lp-quality-icon {
  background:#EBF7F9 !important;
}




/* ─── SALES PAGE TOKENS ─── */
#page-sales {
  --slate: #1B7A87;
  --warm-white: #F6F5F2;
  --n-white: #FFFFFF;
  --n-100: #ECEAE6;
  --n-200: #E0DED9;
  --n-300: #C6C4BF;
  --n-400: #9A9893;
  --n-500: #676560;
  --n-600: #424040;
  --text-primary: #252B35;
  --text-secondary: #676560;
  --text-tertiary: #9A9893;
  --bg-primary: #F6F5F2;
  --bg-secondary: #ECEAE6;
  --border-default: #E0DED9;
  --border-subtle: #C6C4BF;
  --cta-bg: #1B7A87;
  --font-en: 'Manrope', sans-serif;
  --font-jp: 'Noto Sans JP', sans-serif;
  --bw-hair: 0.5px;
  --bw-thin: 1px;
  --br: 0;
  --max: 1200px;
  --btn-h: 48px;
}

/* ================================================================
   UTILITIES
   ================================================================ */
#page-sales .label-en {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 9px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: var(--text-tertiary);
}
#page-sales .ph {
  background: var(--n-200);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-en);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 3px;
  color: var(--text-tertiary);
  text-transform: uppercase;
}
#page-sales .btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: var(--btn-h);
  padding: 0 32px;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  cursor: pointer; text-decoration: none;
  transition: opacity .2s;
  border-radius: var(--br);
  gap: 10px;
}
#page-sales .btn:hover { opacity: .7; }
#page-sales .btn-dark { background: var(--slate); color: var(--warm-white); border: var(--bw-thin) solid var(--slate); }
#page-sales .btn-light { background: var(--warm-white); color: var(--slate); border: var(--bw-thin) solid var(--warm-white); }
#page-sales .btn-ghost { background: transparent; color: var(--slate); border: var(--bw-thin) solid var(--border-default); }
#page-sales .btn-ghost-inv { background: transparent; color: var(--warm-white); border: var(--bw-thin) solid rgba(246,245,242,.25); }

#page-sales hr.hair { border: none; border-top: var(--bw-hair) solid var(--border-default); }
#page-sales hr.hair-inv { border: none; border-top: var(--bw-hair) solid rgba(246,245,242,.10); }

/* ================================================================
   01 — FV : OVERSIZED TYPE AS HERO
   ================================================================ */
#page-sales .fv {
  padding-top: 52px;
  background: var(--slate);
  min-height: 100svh;
  display: flex; flex-direction: column;
  position: relative;
  overflow: hidden;
}
/* Huge ghost text behind everything */
#page-sales .fv-ghost {
  position: absolute;
  bottom: -0.1em;
  left: -0.04em;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(160px, 22vw, 320px);
  line-height: 1;
  letter-spacing: -8px;
  color: rgba(246,245,242,.035);
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
}
#page-sales .fv-inner {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative; z-index: 2;
}
#page-sales .fv-left {
  padding: 80px 64px 80px 80px;
  display: flex; flex-direction: column; justify-content: center;
  border-right: var(--bw-hair) solid rgba(246,245,242,.10);
}
#page-sales .fv-eyebrow {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 48px;
}
#page-sales .fv-eyebrow-line { width: 40px; height: 0.5px; background: var(--n-600); }
#page-sales .fv-eyebrow-text {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: rgba(246,245,242,.55);
}
#page-sales .fv-h1 {
  font-family: var(--font-jp);
  font-weight: 900;
  font-size: clamp(36px, 5.5vw, 72px);
  line-height: 1.15;
  letter-spacing: -1px;
  color: var(--warm-white);
  margin-bottom: 40px;
}
/* Inline accent — thin stroke version */
#page-sales .fv-h1 .accent {
  -webkit-text-stroke: 1px rgba(246,245,242,.4);
  color: transparent;
}
#page-sales .fv-lead {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 14px;
  line-height: 2.2;
  color: rgba(246,245,242,.7);
  max-width: 360px;
  margin-bottom: 56px;
}
#page-sales .fv-actions { display: flex; flex-direction: column; gap: 8px; max-width: 260px; }
#page-sales .fv-right {
  position: relative;
}
#page-sales .fv-img {
  position: absolute; inset: 0;
  background: rgba(246,245,242,.04);
  border: none;
}
#page-sales .fv-img-label {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-en);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: rgba(250,250,250,.15);
}
/* Bottom strip */
#page-sales .fv-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: var(--bw-hair) solid rgba(246,245,242,.08);
  position: relative; z-index: 2;
}
#page-sales .fv-strip-cell {
  padding: 24px 32px;
  border-right: var(--bw-hair) solid rgba(246,245,242,.08);
  display: flex; flex-direction: column; gap: 4px;
}
#page-sales .fv-strip-cell:last-child { border-right: none; }
#page-sales .fv-strip-num {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 28px;
  letter-spacing: -1px;
  color: var(--warm-white);
  line-height: 1;
}
#page-sales .fv-strip-label {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 11px;
  color: rgba(246,245,242,.55);
  line-height: 1.5;
}

/* ================================================================
   02 — INTRO : TYPOGRAPHIC STATEMENT
   ================================================================ */
#page-sales .intro {
  padding: 140px 0;
  background: var(--bg-primary);
  overflow: hidden;
  position: relative;
}
/* Enormous "WHY" behind text */
#page-sales .intro-ghost {
  position: absolute;
  top: 50%; left: -0.05em;
  transform: translateY(-50%);
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(200px, 28vw, 400px);
  line-height: 1;
  letter-spacing: -12px;
  color: var(--n-200);
  user-select: none;
  pointer-events: none;
}
#page-sales .intro-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
  position: relative; z-index: 2;
}
#page-sales .intro-kicker {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 9px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-bottom: 48px;
  display: flex; align-items: center; gap: 16px;
}
#page-sales .intro-kicker::after { content: ''; flex: 0 0 48px; height: 0.5px; background: var(--n-300); }
/* Statement text — massive */
#page-sales .intro-statement {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(24px, 3.2vw, 44px);
  line-height: 1.75;
  letter-spacing: 1px;
  color: var(--text-primary);
  max-width: 800px;
  margin-bottom: 56px;
}
#page-sales .intro-statement u {
  text-decoration: none;
  border-bottom: 1px solid var(--slate);
  padding-bottom: 2px;
}
/* Sub body aligned right */
#page-sales .intro-sub-wrap {
  display: flex;
  justify-content: flex-end;
}
#page-sales .intro-sub {
  max-width: 480px;
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 13px;
  line-height: 2.2;
  color: var(--text-secondary);
}

/* ================================================================
   03 — SPLIT: BUY / SELL  (oversized running title)
   ================================================================ */
#page-sales .split-sec {
  background: var(--bg-primary);
  border-top: var(--bw-hair) solid var(--border-default);
  border-bottom: var(--bw-hair) solid var(--border-default);
  overflow: hidden;
}
/* Giant vertical label */
#page-sales .split-mega-label {
  position: absolute;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(100px, 14vw, 200px);
  line-height: 1;
  letter-spacing: -6px;
  user-select: none;
  pointer-events: none;
  z-index: 0;
}
#page-sales .split-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#page-sales .split-panel {
  padding: 100px 64px 100px 80px;
  position: relative;
  overflow: hidden;
  display: flex; flex-direction: column; gap: 40px;
  z-index: 1;
}
#page-sales .split-panel + .split-panel {
  border-left: var(--bw-hair) solid var(--border-default);
}
#page-sales .split-panel-dark { background: var(--slate); }

/* Giant panel number in corner */
#page-sales .panel-index {
  position: absolute;
  top: 40px; right: 48px;
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 120px;
  line-height: 1;
  letter-spacing: -6px;
  color: var(--n-200);
  user-select: none;
  z-index: 0;
}
#page-sales .panel-index-inv { color: rgba(246,245,242,.06); }

#page-sales .panel-body-wrap { position: relative; z-index: 1; }
#page-sales .panel-tag {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 9px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-bottom: 32px;
  display: block;
}
#page-sales .panel-tag-inv { color: rgba(246,245,242,.55); }

#page-sales .panel-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.25;
  letter-spacing: 1px;
  color: var(--text-primary);
  margin-bottom: 28px;
}
#page-sales .panel-h-inv { color: var(--warm-white); }

#page-sales .panel-body {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 13px;
  line-height: 2.2;
  color: var(--text-secondary);
  margin-bottom: 36px;
}
#page-sales .panel-body-inv { color: rgba(246,245,242,.7); }

/* Checklist */
#page-sales .checklist { display: flex; flex-direction: column; }
#page-sales .check-item {
  display: grid; grid-template-columns: 32px 1fr;
  padding: 14px 0;
  border-top: var(--bw-hair) solid var(--border-default);
  font-family: var(--font-jp);
  font-size: 13px;
  font-weight: 300;
  line-height: 1.8;
  color: var(--text-primary);
  align-items: start;
}
#page-sales .check-item-inv { border-top-color: rgba(246,245,242,.08); color: rgba(246,245,242,.6); }
#page-sales .check-item:last-child { border-bottom: var(--bw-hair) solid var(--border-default); }
#page-sales .check-item-inv:last-child { border-bottom-color: rgba(246,245,242,.08); }
#page-sales .check-mark {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 11px;
  letter-spacing: 1px;
  color: var(--text-tertiary);
  padding-top: 2px;
}
#page-sales .check-mark-inv { color: rgba(246,245,242,.5); }

/* Sub-option cards */
#page-sales .option-cards { display: flex; flex-direction: column; gap: 1px; }
#page-sales .option-card {
  padding: 20px 24px;
  background: rgba(246,245,242,.04);
  border: var(--bw-hair) solid rgba(246,245,242,.10);
}
#page-sales .option-card-title {
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: 13px;
  color: var(--warm-white);
  margin-bottom: 4px;
}
#page-sales .option-card-sub {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 12px;
  line-height: 1.9;
  color: rgba(246,245,242,.6);
}

/* ================================================================
   04 — COMPARISON : editorial table
   ================================================================ */
#page-sales .compare-sec {
  padding: 120px 0;
  background: var(--bg-secondary);
  overflow: hidden;
  position: relative;
}
#page-sales .compare-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
  position: relative; z-index: 1;
}
#page-sales .compare-header {
  display: flex; justify-content: space-between; align-items: flex-end;
  margin-bottom: 64px;
}
#page-sales .compare-heading {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  line-height: 1.2;
  letter-spacing: 1px;
}
#page-sales .compare-note {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 13px;
  line-height: 2;
  color: var(--text-secondary);
  max-width: 260px;
  text-align: right;
}
#page-sales table.compare {
  width: 100%;
  border-collapse: collapse;
}
#page-sales table.compare thead tr {
  border-bottom: var(--bw-thin) solid var(--border-default);
}
#page-sales table.compare th {
  padding: 0 32px 20px;
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 9px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--text-tertiary);
  text-align: center;
}
#page-sales table.compare th:first-child { text-align: left; padding-left: 0; }
#page-sales table.compare td {
  padding: 20px 32px;
  border-bottom: var(--bw-hair) solid var(--border-default);
  font-family: var(--font-jp);
  font-size: 13px;
  line-height: 1.7;
  text-align: center;
  color: var(--text-secondary);
  font-weight: 300;
}
#page-sales table.compare td:first-child {
  text-align: left; padding-left: 0;
  font-weight: 500;
  color: var(--text-primary);
  font-size: 12px;
  letter-spacing: 0.5px;
}
#page-sales table.compare tbody tr:last-child td { border-bottom: none; }
#page-sales .em { color: var(--text-primary); font-weight: 700; }
#page-sales .dim { color: var(--n-400); }

/* Column headers with big numbers */
#page-sales .col-th-inner {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding-bottom: 4px;
}
#page-sales .col-th-num {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 40px;
  letter-spacing: -2px;
  line-height: 1;
  color: var(--n-300);
}
#page-sales .col-th-label {
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: 13px;
  color: var(--text-primary);
  letter-spacing: 1px;
}

/* ================================================================
   05 — STAT : full-bleed dark type showcase
   ================================================================ */
#page-sales .stat-sec {
  background: var(--slate);
  padding: 0;
  overflow: hidden;
}
#page-sales .stat-kicker {
  padding: 48px 80px 40px;
  border-bottom: var(--bw-hair) solid rgba(246,245,242,.08);
  display: flex; align-items: center; gap: 16px;
}
#page-sales .stat-kicker-text {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: rgba(246,245,242,.5);
}
#page-sales .stat-kicker-line { flex: 1; height: 0.5px; background: rgba(246,245,242,.08); }
/* Grid of massive numbers */
#page-sales .stat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: var(--bw-hair) solid rgba(246,245,242,.06);
}
#page-sales .stat-cell {
  padding: 64px 48px;
  border-right: var(--bw-hair) solid rgba(246,245,242,.06);
  position: relative;
  overflow: hidden;
}
#page-sales .stat-cell:last-child { border-right: none; }
/* The number itself — massively oversized */
#page-sales .stat-n {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: clamp(64px, 8vw, 112px);
  line-height: 1;
  letter-spacing: -4px;
  color: var(--warm-white);
  display: flex; align-items: baseline; gap: 4px;
  margin-bottom: 16px;
}
#page-sales .stat-unit {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 16px;
  letter-spacing: 1px;
  color: rgba(246,245,242,.6);
}
#page-sales .stat-label {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 12px;
  line-height: 1.9;
  color: rgba(246,245,242,.55);
}
/* Decorative ghost index */
#page-sales .stat-ghost {
  position: absolute;
  bottom: -0.15em; right: -0.05em;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: 160px;
  line-height: 1;
  letter-spacing: -8px;
  color: rgba(246,245,242,.018);
  user-select: none;
  pointer-events: none;
}

/* ================================================================
   06 — STRENGTHS: typographic list with giant index
   ================================================================ */
#page-sales .strength-sec {
  padding: 120px 0;
  background: var(--bg-primary);
  overflow: hidden;
}
#page-sales .strength-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
}
#page-sales .strength-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  margin-bottom: 80px;
  align-items: end;
}
#page-sales .strength-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  line-height: 1.25;
  letter-spacing: 1px;
}
#page-sales .strength-lead {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 13px;
  line-height: 2.2;
  color: var(--text-secondary);
}
/* Item: huge index + content */
#page-sales .strength-item {
  display: grid;
  grid-template-columns: 160px 1fr;
  border-top: var(--bw-hair) solid var(--border-default);
  padding: 48px 0;
  gap: 48px;
  align-items: start;
}
#page-sales .strength-item:last-child { border-bottom: var(--bw-hair) solid var(--border-default); }
#page-sales .s-num {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 80px;
  line-height: 1;
  letter-spacing: -4px;
  color: var(--n-300);
  padding-top: 8px;
}
#page-sales .s-content {}
#page-sales .s-title {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 1px;
  line-height: 1.3;
  margin-bottom: 16px;
}
#page-sales .s-body {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 13px;
  line-height: 2.2;
  color: var(--text-secondary);
}

/* ================================================================
   07 — FLOW: typographic step (both buy+sell)
   ================================================================ */
#page-sales .flow-sec {
  background: var(--bg-secondary);
  padding: 120px 0;
  overflow: hidden;
}
#page-sales .flow-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
}
#page-sales .flow-header {
  display: flex; align-items: baseline; gap: 32px;
  margin-bottom: 72px;
}
#page-sales .flow-title-jp {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 44px);
  letter-spacing: 1px;
  line-height: 1;
}
#page-sales .flow-title-en {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: clamp(28px, 3.2vw, 44px);
  letter-spacing: -1px;
  line-height: 1;
  color: var(--n-300);
}
#page-sales .flow-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
}
#page-sales .flow-col-label {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 9px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-bottom: 32px;
  padding-bottom: 16px;
  border-bottom: var(--bw-hair) solid var(--border-default);
}
#page-sales .flow-step {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 0;
}
#page-sales .flow-left-col { display: flex; flex-direction: column; align-items: center; }
#page-sales .flow-step-num {
  width: 56px; height: 56px;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--text-tertiary);
  border: var(--bw-hair) solid var(--border-default);
  background: var(--n-white);
  flex-shrink: 0;
  position: relative; z-index: 1;
}
#page-sales .flow-step-num.done {
  background: var(--slate);
  color: var(--warm-white);
  border-color: var(--slate);
}
#page-sales .flow-step-line {
  flex: 1; width: 0.5px;
  background: var(--border-default);
  margin: 0 auto;
}
#page-sales .flow-step:last-child .flow-step-line { display: none; }
#page-sales .flow-content {
  padding: 4px 0 48px 24px;
}
#page-sales .flow-phase-en {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 9px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-bottom: 4px;
}
#page-sales .flow-step-title {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.5px;
  line-height: 1.3;
  margin-bottom: 8px;
}
#page-sales .flow-step-body {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 12px;
  line-height: 2;
  color: var(--text-secondary);
}
#page-sales .flow-note-pill {
  display: inline-flex;
  margin-top: 10px;
  padding: 3px 12px;
  border: var(--bw-hair) solid var(--border-subtle);
  background: var(--n-white);
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 10px;
  color: var(--text-tertiary);
  letter-spacing: 0.5px;
}

/* ================================================================
   08 — FAQ
   ================================================================ */
#page-sales .faq-sec {
  padding: 120px 0;
  background: var(--bg-primary);
}
#page-sales .faq-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
}
#page-sales .faq-heading-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  margin-bottom: 72px;
  align-items: end;
}
#page-sales .faq-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  letter-spacing: 1px;
  line-height: 1.2;
}
/* Big decorative "FAQ" */
#page-sales .faq-deco {
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(48px, 7vw, 100px);
  letter-spacing: -4px;
  line-height: 1;
  color: var(--n-200);
  text-align: right;
  user-select: none;
}
#page-sales .faq-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
#page-sales .faq-group-lbl {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: var(--bw-hair) solid var(--border-default);
  display: block;
}
#page-sales .faq-item { border-bottom: var(--bw-hair) solid var(--border-default); }
#page-sales .faq-q {
  padding: 20px 0;
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 12px;
  align-items: start;
}
#page-sales .faq-q-mark {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--text-tertiary);
  margin-top: 1px;
}
#page-sales .faq-q-text {
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: 13px;
  line-height: 1.7;
}
#page-sales .faq-a {
  padding: 0 0 20px 36px;
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 13px;
  line-height: 2.1;
  color: var(--text-secondary);
}

/* ================================================================
   09 — CTA : full-bleed typographic close
   ================================================================ */
#page-sales .cta-sec {
  background: var(--slate);
  padding: 0;
  overflow: hidden;
  position: relative;
}
/* Giant text behind everything */
#page-sales .cta-ghost {
  position: absolute;
  bottom: -0.05em; left: -0.03em;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(160px, 20vw, 280px);
  line-height: 1;
  letter-spacing: -8px;
  color: rgba(246,245,242,.025);
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
}
#page-sales .cta-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 100px 80px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 80px;
  align-items: center;
  position: relative; z-index: 1;
}
#page-sales .cta-eyebrow {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: rgba(246,245,242,.5);
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 36px;
}
#page-sales .cta-eyebrow::before { content: ''; width: 40px; height: 0.5px; background: rgba(250,250,250,.15); }
#page-sales .cta-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(36px, 5vw, 72px);
  line-height: 1.2;
  letter-spacing: 1px;
  color: var(--warm-white);
  margin-bottom: 28px;
}
#page-sales .cta-sub {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 14px;
  line-height: 2.2;
  color: rgba(246,245,242,.7);
  max-width: 400px;
}
#page-sales .cta-right-block { display: flex; flex-direction: column; gap: 12px; min-width: 280px; }
#page-sales .cta-tel {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 36px;
  letter-spacing: -1px;
  color: var(--warm-white);
  line-height: 1;
  margin-bottom: 4px;
}
#page-sales .cta-hours {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 11px;
  color: rgba(246,245,242,.5);
  margin-bottom: 20px;
  letter-spacing: 1px;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 960px) {
  .fv-inner, .split-layout, .compare-header,
  .strength-head, .flow-2col, .faq-heading-row, .faq-2col,
  #page-sales .cta-inner { grid-template-columns: 1fr; }
  #page-sales .fv-right { display: none; }
  #page-sales .fv-strip { grid-template-columns: repeat(2, 1fr); }
  #page-sales .fv-left { padding: 64px 32px; }
  .intro-inner, .compare-inner, .strength-inner,
  #page-sales .flow-inner, #page-sales .faq-inner, #page-sales .cta-inner { padding: 0 32px; }
  #page-sales .split-panel { padding: 64px 32px; }
  #page-sales .panel-index { display: none; }
  #page-sales .stat-grid { grid-template-columns: repeat(2, 1fr); }
  #page-sales .strength-item { grid-template-columns: 80px 1fr; gap: 24px; }
  #page-sales .s-num { font-size: 48px; }
  #page-sales .cta-inner { padding: 64px 32px; gap: 48px; }
  #page-sales footer { padding: 20px 32px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; padding: 40px; }
  .service-tabs-section { padding: 80px 40px; }
  .tabs-header { flex-wrap: wrap; }
  .tab-button { padding: 16px 20px; font-size: 14px; }
  .tab-content.active { grid-template-columns: 1fr; gap: 48px; }
  .commitment-section { padding: 80px 40px; }
  .commitment-inner { grid-template-columns: 1fr; gap: 48px; }
  .column-section { padding: 80px 40px; }
  .column-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .column-header { flex-direction: column; align-items: flex-start; gap: 24px; }
}

@media (max-width: 640px) {
  .stats-grid { grid-template-columns: 1fr; padding: 32px 20px; }
  .service-tabs-section { padding: 60px 20px; }
  .tabs-header { margin-bottom: 40px; }
  .tab-button { padding: 16px 12px; font-size: 13px; }
  .commitment-section { padding: 60px 20px; }
  .column-section { padding: 60px 20px; }
  /* モバイル：コラム1カラム */
  .column-grid { grid-template-columns: 1fr; }
  .column-list-filter { justify-content: center; }
  /* モバイル：チーム2カラム */
  .team-grid, .team-more.open { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .cta-lead { padding:32px 24px 28px; margin:40px 0; }
  .cta-lead-heading { font-size:18px; line-height:1.55; }
  .cta-lead-list li { font-size:13px; }
  .cta-lead-btn { height:52px; font-size:14px; }
  .cta-sticky-wrap { padding:0 12px 12px; }
  .cta-sticky { flex-direction:column; height:auto; }
  .cta-sticky-info { display:none; }
  .cta-sticky-tel, .cta-sticky-form {
    padding:14px 18px; justify-content:center;
    min-width:0; border-right:none;
  }
  .cta-sticky-tel { border-bottom:.5px solid var(--n100); }
  .cta-sticky-tel-num { font-size:19px; }
  .cta-sticky-tel-hrs { display:none; }
  .cta-sticky-form { font-size:13px; padding:16px 20px; }
}

/* ─── GRAY PLACEHOLDER MODE ─── */
/* 実画像が入った要素は除外 */
.service-img,
.pickup-card-img,
.news-card-img,
.news-card:first-child .news-card-img,
.about-image,
.team-avatar,
.prop-img,
.prop-detail-gallery,
.prop-carousel-item,
.career-value-img,
.lp-support-img,
.fv-right,
.article-hero-img {
  background: var(--n200) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.service-img::after,
.pickup-card-img::after,
.news-card-img::after,
.about-image::after,
.prop-img::after,
.prop-detail-gallery::after,
.career-value-img::after,
.lp-support-img::after,
.fv-right::after,
.article-hero-img::after {
  content: none;
  font-family: var(--ff-en);
  font-weight: 300;
  font-size: 11px;
  letter-spacing: 4px;
  color: var(--n400);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* team-avatar：実画像があるためプレーステキスト不要 */
.team-avatar::after { display:none; }
.prop-carousel-item::after {
  content: 'THUMB';
  font-family: var(--ff-en);
  font-weight: 300;
  font-size: 8px;
  letter-spacing: 2px;
  color: var(--n400);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.prop-carousel-item { position: relative; }


/* ─── STATS SECTION ─── */
.stats-section {
  background: var(--white);
  padding: 80px;
  border-top: 0.5px solid var(--n200);
  border-bottom: 0.5px solid var(--n200);
}
/* トップページ数字セクション（4カラム） */
.stats-grid:not(.stagger) {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}
@media (max-width: 960px) {
  .stats-grid:not(.stagger) { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
@media (max-width: 640px) {
  .stats-grid:not(.stagger) { grid-template-columns: 1fr; gap: 20px; }
}
.stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}
.stat-number {
  font-family: var(--ff-en);
  font-weight: 700;
  font-size: clamp(48px, 4vw, 72px);
  line-height: 1;
  letter-spacing: -1px;
  color: var(--accent);
  min-height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stat-label {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  color: var(--n500);
}

/* ─── SERVICE TABS SECTION ─── */
.service-tabs-section {
  padding: 160px 80px;
  max-width: 1440px;
  margin: 0 auto;
}
.tabs-header {
  display: flex;
  gap: 0;
  margin-bottom: 80px;
  border-bottom: 0.5px solid var(--n200);
}
.tab-button {
  font-family: var(--ff-jp);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 0.5px;
  padding: 24px 32px;
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--n500);
  border-bottom: 2px solid transparent;
  transition: all 0.3s;
  position: relative;
}
.tab-button:hover { color: var(--jet); }
.tab-button.active { color: var(--jet); border-bottom-color: var(--accent); }
.tab-content {
  display: none;
  opacity: 0;
  transition: opacity 0.3s;
}
.tab-content.active {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  opacity: 1;
  animation: fadeUp 0.6s forwards;
}
.tab-left {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.tab-tag {
  font-family: var(--ff-en);
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 5px;
  text-transform: uppercase;
  color: var(--n400);
}
.tab-title {
  font-weight: 700;
  font-size: clamp(24px, 2.5vw, 36px);
  line-height: 1.3;
  letter-spacing: 1px;
}
.tab-description {
  font-size: 15px;
  line-height: 1.8;
  color: var(--n500);
}
.tab-features {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tab-feature {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.tab-feature::before {
  content: '✓';
  font-weight: 700;
  color: var(--accent);
  flex-shrink: 0;
  font-size: 18px;
}
.tab-feature-text {
  font-size: 14px;
  line-height: 1.6;
  color: var(--n500);
}
.tab-link {
  font-family: var(--ff-en);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--jet);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: gap 0.3s;
  cursor: pointer;
  margin-top: 8px;
}
.tab-link:hover { gap: 14px; }
.tab-link::after { content: '→'; }
.tab-right {
  aspect-ratio: 4 / 3;
  background: var(--n200);
  border: 0.5px solid var(--n200);
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab-right img { width:100%; height:100%; object-fit:cover; display:block; }

/* ─── COMMITMENT SECTION ─── */
.commitment-section {
  padding: 160px 80px;
  max-width: 1440px;
  margin: 0 auto;
  background: var(--white);
}
.commitment-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  margin-top: 48px;
}
.commitment-left {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.commitment-paragraph {
  font-size: 16px;
  line-height: 1.9;
  color: var(--n500);
}
.commitment-paragraph strong {
  font-weight: 700;
  color: var(--jet);
}
.commitment-right {
  aspect-ratio: 4 / 3;
  background: var(--n200);
  border: 0.5px solid var(--n200);
  display: flex;
  align-items: center;
  justify-content: center;
}
.commitment-right img { width:100%; height:100%; object-fit:cover; display:block; }

/* ─── COLUMN SECTION ─── */
.column-section {
  padding: 120px 80px 80px;
  max-width: 1440px;
  margin: 0 auto;
}
.column-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 48px;
}
.column-header h2 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 1px;
  margin-top: 12px;
}
.column-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.column-card {
  border: 0.5px solid var(--n200);
  background: var(--white);
  overflow: hidden;
  transition: border-color 0.3s;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}
.column-card:hover { border-color: var(--accent); }
.column-card-img {
  aspect-ratio: 16 / 10;
  background: var(--n200);
}
.column-card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.column-card-tagrow {
  display: flex;
  gap: 10px;
  align-items: center;
}
.column-card-tag {
  font-family: var(--ff-en);
  font-weight: 500;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 3px 9px;
  background: var(--n100);
  color: var(--n600);
}
.column-card-date {
  font-family: var(--ff-en);
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 1.5px;
  color: var(--n400);
}
.column-card-title {
  font-weight: 700;
  font-size: 15px;
  line-height: 1.55;
  letter-spacing: 0.3px;
}
.column-card-excerpt {
  font-size: 12px;
  line-height: 1.7;
  color: var(--n500);
}

/* ─── COLUMN LIST PAGE ─── */
.column-list-filter {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}
.column-filter-btn {
  font-family: var(--ff-jp);
  font-weight: 500;
  font-size: 13px;
  padding: 8px 20px;
  border: 0.5px solid var(--n200);
  background: var(--white);
  cursor: pointer;
  transition: all 0.3s;
  color: var(--n500);
}
.column-filter-btn:hover { border-color: var(--jet); color: var(--jet); }
.column-filter-btn.active { background: var(--jet); color: var(--cloud-white); border-color: var(--jet); }
.column-list-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
/* コラム一覧レスポンシブ：タブレット2カラム、モバイル1カラム */
@media (max-width: 960px) {
  .column-list-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
@media (max-width: 640px) {
  .column-list-grid { grid-template-columns: 1fr; gap: 20px; }
}

/* ─── COLUMN DETAIL PAGE ─── */
.column-detail-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--n400);
  cursor: pointer;
  transition: color 0.2s;
  margin-bottom: 32px;
}
.column-detail-back:hover { color: var(--accent); }
.column-detail-back::before { content: '←'; font-family: var(--ff-en); }

/* ─── Lead Banner CTA ─── */
.cta-lead {
  width:100%; max-width:720px;
  background:var(--white);
  border:.5px solid var(--n200); border-left:3px solid var(--accent);
  position:relative;
  padding:48px 56px 40px;
  margin:48px 0;
}
.cta-lead::before {
  content:''; position:absolute;
  top:0; left:0; width:3px; height:100%;
  background:var(--accent);
}
.cta-lead-label {
  font-family:var(--ff-en); font-weight:500; font-size:10px;
  letter-spacing:3px; color:var(--accent);
  text-transform:uppercase;
}
.cta-lead-heading {
  font-weight:700; font-size:22px;
  letter-spacing:.5px; line-height:1.6;
  margin-top:14px; color:var(--jet);
}
.cta-lead-list {
  margin-top:28px; list-style:none;
  display:flex; flex-direction:column; gap:14px;
}
.cta-lead-list li {
  display:flex; align-items:flex-start; gap:14px;
  font-size:14px; color:var(--n600); line-height:1.7;
}
.cta-lead-list li .check {
  width:20px; height:20px;
  border:1.5px solid var(--accent);
  background:var(--accent-tint);
  border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  margin-top:2px;
}
.cta-lead-list li .check svg { width:10px; height:10px; }
.cta-lead-body {
  margin-top:28px; padding-top:24px;
  border-top:.5px solid var(--n100);
  font-size:13px; line-height:1.9; color:var(--n500);
}
.cta-lead-actions {
  margin-top:28px;
  display:flex; flex-direction:column; gap:14px;
}
.article-body .cta-lead-btn,
a.cta-lead-btn {
  display:flex; align-items:center; justify-content:center;
  gap:10px; height:56px;
  background:var(--accent);
  color:var(--white); font-weight:700; font-size:15px;
  letter-spacing:1px;
  border:none; cursor:pointer;
  text-decoration:none; transition:all .2s;
}
.article-body .cta-lead-btn:hover,
a.cta-lead-btn:hover {
  background:var(--accent-dark);
  border-color:var(--accent-dark) !important;
  color:var(--white) !important;
}
.cta-lead-btn-arrow {
  font-family:var(--ff-en); font-weight:300; font-size:18px; color:var(--white);
}
.article-body .cta-lead-sublink,
a.cta-lead-sublink {
  display:flex; align-items:center; justify-content:center;
  gap:8px; font-size:12px;
  color:var(--n500) !important;
  border:.5px solid var(--n200);
  height:44px; cursor:pointer;
  text-decoration:none !important;
  transition:all .2s; letter-spacing:.5px;
  background:var(--white);
}
.article-body .cta-lead-sublink:hover,
a.cta-lead-sublink:hover {
  border-color:var(--accent) !important;
  color:var(--accent) !important;
}

/* ─── Sticky Bottom CTA ─── */
.cta-sticky-wrap {
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:90;
  padding:0 24px 16px;
  transform:translateY(120%);
  transition:transform .4s cubic-bezier(.2,.9,.3,1);
  pointer-events:none;
}
.cta-sticky-wrap.is-visible { transform:translateY(0); pointer-events:auto; }
.cta-sticky-wrap.is-closed { display:none; }
.cta-sticky {
  background:var(--white);
  border-top:3px solid var(--accent);
  box-shadow:0 -8px 32px rgba(29,29,27,0.08);
  display:flex; align-items:stretch;
  max-width:1200px; margin:0 auto;
  position:relative; height:88px;
}
.cta-sticky-close {
  position:absolute; top:-28px; right:8px;
  width:28px; height:28px;
  background:var(--white); border:.5px solid var(--n200);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--n400);
  font-family:var(--ff-en); font-size:15px; font-weight:300;
  line-height:1; transition:all .2s;
}
.cta-sticky-close:hover { color:var(--jet); border-color:var(--jet); }
.cta-sticky-info {
  display:flex; align-items:center; gap:16px;
  padding:0 32px; flex:1;
  border-right:.5px solid var(--n100);
}
.cta-sticky-info-label {
  font-family:var(--ff-en); font-weight:500; font-size:9px;
  letter-spacing:3px; color:var(--accent); text-transform:uppercase;
}
.cta-sticky-info-title {
  font-weight:700; font-size:15px;
  letter-spacing:.5px; color:var(--jet);
  margin-top:2px; line-height:1.4;
}
.cta-sticky-info-sub {
  font-size:11px; color:var(--n500);
  margin-top:3px; line-height:1.4;
}
.cta-sticky-tel {
  display:flex; align-items:center; gap:14px;
  padding:0 28px; color:var(--jet);
  transition:background .2s;
  border-right:.5px solid var(--n100);
  text-decoration:none;
}
.cta-sticky-tel:hover { background:var(--accent-tint); }
.cta-sticky-tel-icon {
  width:36px; height:36px;
  border:1.5px solid var(--accent); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.cta-sticky-tel-icon svg { width:16px; height:16px; }
.cta-sticky-tel-txt { display:flex; flex-direction:column; line-height:1.2; }
.cta-sticky-tel-lbl { font-size:10px; color:var(--n400); letter-spacing:.5px; }
.cta-sticky-tel-num {
  font-family:var(--ff-en); font-weight:700;
  font-size:22px; letter-spacing:.5px;
  color:var(--jet); margin-top:2px;
}
.cta-sticky-tel-hrs { font-size:9px; color:var(--n400); margin-top:2px; }
.cta-sticky-form {
  display:flex; align-items:center; justify-content:center;
  gap:12px; padding:0 40px;
  background:var(--accent); color:var(--white);
  font-weight:700; font-size:15px; letter-spacing:1px;
  min-width:280px; transition:background .2s;
  cursor:pointer; text-decoration:none;
}
.cta-sticky-form:hover { background:var(--accent-dark); }
.cta-sticky-form-icon { width:18px; height:18px; }
.cta-sticky-form-arrow { font-family:var(--ff-en); font-weight:300; font-size:18px; margin-left:4px; }
/* モバイル：CTAバー縦積み */
@media (max-width:640px) {
  .cta-sticky-wrap { padding:0 12px 12px; }
  .cta-sticky { flex-direction:column; height:auto; }
  .cta-sticky-info { display:none; }
  .cta-sticky-tel, .cta-sticky-form {
    padding:14px 18px; justify-content:center;
    min-width:0; border-right:none;
  }
  .cta-sticky-tel { border-bottom:.5px solid var(--n100); }
  .cta-sticky-tel-num { font-size:19px; }
  .cta-sticky-tel-hrs { display:none; }
  .cta-sticky-form { font-size:13px; padding:16px 20px; }
}

/* ============================================================
   RESPONSIVE FIX（末尾配置・カスケード優先）
   1653-1695行目の @media ブロックは後続のベースルールに上書き
   されていたため、ここに再掲してカスケードで勝たせる。
   ============================================================ */
@media (max-width: 960px) {
  .service-tabs-section { padding: 80px 40px; }
  .tabs-header { flex-wrap: wrap; }
  .tab-button { padding: 16px 20px; font-size: 14px; }
  .tab-content.active { grid-template-columns: 1fr; gap: 48px; }
  .tab-right { aspect-ratio: 4/3; max-width: 560px; margin: 0 auto; width: 100%; }
  .commitment-section { padding: 80px 40px; }
  .commitment-inner { grid-template-columns: 1fr; gap: 48px; }
  .column-section { padding: 80px 40px; }
  .column-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .column-header { flex-direction: column; align-items: flex-start; gap: 24px; }
}

@media (max-width: 640px) {
  .service-tabs-section { padding: 60px 20px; }
  .tabs-header { margin-bottom: 40px; }
  .tab-button { padding: 16px 12px; font-size: 13px; flex: 1 0 50%; }
  .tab-content.active { gap: 32px; }
  .tab-left { gap: 24px; }
  .tab-title { font-size: 24px; }
  .commitment-section { padding: 60px 20px; }
  .column-section { padding: 60px 20px; }
  .column-grid { grid-template-columns: 1fr; }
  /* h2見出し下余白もモバイルで圧縮 */
  .section-heading { margin-bottom: 32px; }
}

/* ============================================================
   RESPONSIVE FIX #2（#page-sales専用・特異度対策）
   ベースCSSが #page-sales .xxx（0,1,1）なのに、前方@media側が
   .xxx 単体（0,1,0）だったため特異度バトルで負けて無効化されていた。
   ここに #page-sales 前置で再掲し、特異度を合わせてカスケードで勝たせる。
   ============================================================ */
@media (max-width: 960px) {
  /* 1カラム化：ヒーロー / BUY・SELL / 比較 / 強み / ステップ / FAQ */
  #page-sales .fv-inner,
  #page-sales .split-layout,
  #page-sales .compare-header,
  #page-sales .strength-head,
  #page-sales .flow-2col,
  #page-sales .faq-heading-row,
  #page-sales .faq-2col { grid-template-columns: 1fr; gap: 48px; }

  /* 内側パディング */
  #page-sales .intro-inner,
  #page-sales .compare-inner,
  #page-sales .strength-inner { padding: 0 32px; }

  /* ヒーロー：右画像は隠す */
  #page-sales .fv-right { display: none; }
  #page-sales .fv-left { padding: 64px 32px; }
  #page-sales .fv-strip { grid-template-columns: repeat(2, 1fr); }

  /* BUY/SELLパネル：縦積み時の境界線を下線に付け替え */
  #page-sales .split-panel { padding: 64px 32px; }
  #page-sales .split-panel + .split-panel { border-left: none; border-top: var(--bw-hair) solid var(--border-default); }
  #page-sales .panel-index { display: none; }
}

@media (max-width: 640px) {
  #page-sales .fv-left { padding: 48px 20px; }
  #page-sales .fv-strip { grid-template-columns: repeat(2, 1fr); }
  #page-sales .fv-strip-cell { padding: 16px 12px; }
  #page-sales .split-panel { padding: 48px 20px; }
  #page-sales .intro-inner,
  #page-sales .compare-inner,
  #page-sales .strength-inner,
  #page-sales .flow-inner,
  #page-sales .faq-inner { padding: 0 20px; }
  /* CTA セクションは上下余白を確保（セクションが詰まるのを防ぐ） */
  #page-sales .cta-inner { padding: 56px 20px; gap: 40px; }
  #page-sales .strength-item { grid-template-columns: 56px 1fr; gap: 16px; }
  #page-sales .s-num { font-size: 36px; }
  #page-sales .fv-h1 { font-size: clamp(32px, 8vw, 56px); }
  #page-sales .intro-statement { font-size: clamp(22px, 5vw, 32px); }
}


/* === 10課題修正パッチ (2026-05) === */
.cta-section { background: #2AA5B5 !important; }
.cta-inner { max-width: 820px; }
.status-page { min-height: 60vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 160px 80px 80px; max-width: 1440px; margin: 0 auto; }
.status-page h1 { font-weight: 700; font-size: clamp(48px, 6vw, 80px); letter-spacing: 2px; line-height: 1.1; margin-top: 16px; margin-bottom: 24px; }
.status-page p { font-size: 15px; line-height: 2; color: var(--n500); margin-bottom: 32px; }
#page-customer-harassment main { max-width: 1200px !important; }
/* IT serviceページ：パンくず後のCSS competition解除 */
#page-it-service { padding-top: 0; }
#page-customer-harassment { padding-top: 0; }

/* === CTA 可読性パッチ (2026-05) === */
.cta-section .cta-body,
.cta-section p,
.page-cta p {
  color: rgba(255, 255, 255, 0.95) !important;
}
.cta-section .section-label,
.cta-section .cta-label,
.page-cta .page-cta-label {
  color: rgba(255, 255, 255, 0.8) !important;
}
.cta-section .cta-heading,
.cta-section h2,
.page-cta h2 {
  color: #FFFFFF !important;
}
/* === END CTA 可読性パッチ === */


/* ============================================================
   CONTACT FORM PINPOINT FIX (cloud9_corporate inline からの差分のみ)
   ============================================================ */
.contact-tabs { display:flex; gap:0; flex-wrap:wrap; border-bottom:1px solid var(--n200); margin-bottom:32px; }
.contact-tab { padding:14px 18px; background:transparent; border:none; color:var(--n500); cursor:pointer; font-size:13px; font-weight:500; font-family:var(--ff-jp); letter-spacing:0.3px; border-bottom:2px solid transparent; margin-bottom:-1px; transition:color 0.2s, border-color 0.2s; -webkit-tap-highlight-color:transparent; }
.contact-tab:hover { color:var(--accent); }
.contact-tab.active { color:var(--accent); border-bottom-color:var(--accent); font-weight:600; }
.contact-form-panel { display:none; flex-direction:column; gap:24px; }
.contact-form-panel.active { display:flex; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.form-group { display:flex; flex-direction:column; gap:8px; }
.form-group label { font-size:13px; font-weight:500; }
.form-group input, .form-group textarea, .form-group select { border:1px solid var(--n200); padding:12px 16px; font-size:14px; font-family:var(--ff-jp); background:var(--white); outline:none; transition:border-color 0.2s; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { border-color:#2BA5B5; }
.form-group textarea { min-height:160px; resize:vertical; }
.form-intro { font-size:13px; color:var(--n500); line-height:1.8; padding:14px 16px; background:var(--n100); border-left:3px solid var(--accent); margin:0 0 8px; }
.form-required { color:#C05050; font-size:11px; font-weight:400; margin-left:4px; }
.form-privacy { display:flex; align-items:center; gap:8px; }
.form-privacy label { font-size:12px; color:var(--n500); }
.form-radio-group, .form-checkbox-group { display:flex; flex-wrap:wrap; gap:16px 24px; padding-top:4px; }
.form-radio, .form-checkbox { display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--jet); cursor:pointer; font-weight:400; }
.form-radio input, .form-checkbox input { width:auto; margin:0; padding:0; border:1px solid var(--n300); }
@media (max-width:768px) {
  .contact-tabs { overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; }
  .contact-tab { flex-shrink:0; font-size:12px; padding:12px 14px; }
  .form-row { grid-template-columns:1fr; gap:16px; }
  .form-radio-group, .form-checkbox-group { gap:10px 16px; }
}


/* ============================================================
   PINPOINT FIX #2 : garbage links (tenant page) & article author (column detail)
   ============================================================ */
.garbage-links { display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; max-width:900px; margin:40px auto 0; }
.garbage-link-card { display:flex; flex-direction:column; gap:6px; padding:28px 24px; border:0.5px solid var(--n200); background:#fff; text-decoration:none; color:inherit; transition:border-color 0.3s, box-shadow 0.3s, transform 0.3s; }
.garbage-link-card:hover { border-color:#2BA5B5; box-shadow:0 4px 16px rgba(43,165,181,0.08); transform:translateY(-2px); }
.garbage-link-card .gl-city { font-family:var(--ff-en); font-size:11px; font-weight:600; letter-spacing:3px; color:#2BA5B5; text-transform:uppercase; }
.garbage-link-card .gl-title { font-size:16px; font-weight:700; line-height:1.5; color:var(--jet); }
.garbage-link-card .gl-meta { font-size:11px; color:var(--n500); margin-top:8px; display:flex; justify-content:space-between; align-items:center; letter-spacing:0.5px; }
.garbage-link-card .gl-ext { color:#2BA5B5; font-size:13px; font-weight:700; }
@media (max-width:840px) { .garbage-links { grid-template-columns:1fr; } }

.article-author { display:flex; gap:16px; align-items:flex-start; margin-top:48px; padding:24px; background:var(--n100); border-left:3px solid var(--accent); }
.article-author-avatar { width:56px; height:56px; border-radius:50%; background:var(--n200); flex-shrink:0; overflow:hidden; }
.article-author-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.article-author-body { flex:1; }
.article-author-label { font-family:var(--ff-en); font-weight:500; font-size:10px; letter-spacing:3px; color:var(--accent); text-transform:uppercase; margin-bottom:4px; }
.article-author-name { font-size:14px; font-weight:700; margin-bottom:6px; }
.article-author-desc { font-size:12px; line-height:1.7; color:var(--n500); }


/* ============================================================
   SALES PAGE FULL OVERRIDE (cloud9_corporate static版 完全準拠)
   旧版の #page-sales を後勝ちで上書き
   ============================================================ */
/* ─── SALES PAGE TOKENS ─── */
#page-sales {
  --slate: #2AA5B5;
  --accent-brand: #2BA5B5;     /* 他ページ共通のブランドアクセント */
  --accent-bright: #3DC0D1;    /* 暗背景で際立つ明色アクセント */
  --accent-tint: #EBF7F9;
  --warm-white: #F6F5F2;
  --n-white: #FFFFFF;
  --n-100: #ECEAE6;
  --n-200: #E0DED9;
  --n-300: #C6C4BF;
  --n-400: #9A9893;
  --n-500: #676560;
  --n-600: #424040;
  --text-primary: #252B35;
  --text-secondary: #676560;
  --text-tertiary: #9A9893;
  --bg-primary: #F6F5F2;
  --bg-secondary: #ECEAE6;
  --border-default: #E0DED9;
  --border-subtle: #C6C4BF;
  --cta-bg: #2AA5B5;
  --font-en: 'Manrope', sans-serif;
  --font-jp: 'Noto Sans JP', sans-serif;
  --bw-hair: 0.5px;
  --bw-thin: 1px;
  --br: 0;
  --max: 1200px;
  --btn-h: 48px;
}

/* ================================================================
   UTILITIES
   ================================================================ */
#page-sales .label-en {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--accent-brand);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
/* セクション見出しラベルにもブランドアクセント線を付与（他ページとトンマナ統一） */
#page-sales .label-en::before {
  content: ''; width: 24px; height: 1px; background: var(--accent-brand); display: inline-block;
}
#page-sales .ph {
  background: var(--n-200);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-en);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 3px;
  color: var(--text-tertiary);
  text-transform: uppercase;
}
#page-sales .btn {
  display: inline-flex; align-items: center; justify-content: space-between;
  height: 56px;
  padding: 0 28px;
  font-family: var(--font-jp);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 1px;
  cursor: pointer; text-decoration: none;
  transition: transform .2s, background .2s, border-color .2s, color .2s;
  border-radius: var(--br);
  gap: 12px;
}
#page-sales .btn .btn-en {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  opacity: .6;
}
#page-sales .btn:hover { transform: translateX(4px); }
#page-sales .btn-dark { background: var(--slate); color: var(--warm-white); border: var(--bw-thin) solid var(--slate); }
#page-sales .btn-light { background: var(--warm-white); color: var(--slate); border: var(--bw-thin) solid var(--warm-white); }
#page-sales .btn-ghost { background: transparent; color: var(--slate); border: var(--bw-thin) solid var(--border-default); }
#page-sales .btn-ghost-inv { background: transparent; color: var(--warm-white); border: var(--bw-thin) solid rgba(246,245,242,.25); }
/* 訴求力強化CTA：ブランドアクセントの塗りボタン（Primary）と枠線ボタン（Secondary） */
#page-sales .btn-accent { background: var(--accent-bright); color: var(--slate); border: var(--bw-thin) solid var(--accent-bright); }
#page-sales .btn-accent:hover { background: #5ED4E0; border-color: #5ED4E0; }
#page-sales .btn-accent .btn-en { opacity: .5; color: var(--slate); }
#page-sales .btn-accent-ghost { background: transparent; color: var(--warm-white); border: var(--bw-thin) solid var(--accent-bright); }
#page-sales .btn-accent-ghost:hover { background: rgba(61,192,209,.12); }
#page-sales .btn-accent-ghost .btn-en { color: var(--accent-bright); opacity: .8; }

#page-sales hr.hair { border: none; border-top: var(--bw-hair) solid var(--border-default); }
#page-sales hr.hair-inv { border: none; border-top: var(--bw-hair) solid rgba(246,245,242,.10); }

/* ================================================================
   01 — FV : OVERSIZED TYPE AS HERO
   ================================================================ */
#page-sales .fv {
  padding-top: 52px;
  background: var(--slate);
  min-height: 100svh;
  display: flex; flex-direction: column;
  position: relative;
  overflow: hidden;
}
/* Huge ghost text behind everything */
#page-sales .fv-ghost {
  position: absolute;
  bottom: -0.1em;
  left: -0.04em;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(160px, 22vw, 320px);
  line-height: 1;
  letter-spacing: -8px;
  color: rgba(246,245,242,.035);
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
}
#page-sales .fv-inner {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative; z-index: 2;
}
#page-sales .fv-left {
  padding: 80px 64px 80px 80px;
  display: flex; flex-direction: column; justify-content: center;
  border-right: var(--bw-hair) solid rgba(246,245,242,.10);
}
#page-sales .fv-eyebrow {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 48px;
}
#page-sales .fv-eyebrow-line { width: 40px; height: 1px; background: var(--accent-bright); }
#page-sales .fv-eyebrow-text {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--accent-bright);
}
#page-sales .fv-h1 {
  font-family: var(--font-jp);
  font-weight: 900;
  font-size: clamp(36px, 5.5vw, 72px);
  line-height: 1.15;
  letter-spacing: -1px;
  color: var(--warm-white);
  margin-bottom: 40px;
}
/* Inline accent — ブランドアクセント色＋20%拡大＋下線で視線を集中 */
#page-sales .fv-h1 .accent {
  color: var(--accent-bright);
  -webkit-text-stroke: 0;
  font-size: 1.2em;
  line-height: 1;
  display: inline-block;
  position: relative;
  padding-bottom: 0.08em;
  background-image: linear-gradient(var(--accent-bright), var(--accent-bright));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 3px;
}
#page-sales .fv-lead {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.9;
  color: rgba(246,245,242,.92);
  max-width: 420px;
  margin-bottom: 56px;
}
#page-sales .fv-actions { display: flex; flex-direction: column; gap: 12px; max-width: 340px; }
#page-sales .fv-right {
  position: relative;
}
#page-sales .fv-img {
  position: absolute; inset: 0;
  background: rgba(246,245,242,.04);
  border: none;
}
#page-sales .fv-img-label {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-en);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: rgba(250,250,250,.15);
}
/* Bottom strip */
#page-sales .fv-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: var(--bw-hair) solid rgba(246,245,242,.08);
  position: relative; z-index: 2;
}
#page-sales .fv-strip-cell {
  padding: 24px 32px;
  border-right: var(--bw-hair) solid rgba(246,245,242,.08);
  display: flex; flex-direction: column; gap: 4px;
}
#page-sales .fv-strip-cell:last-child { border-right: none; }
#page-sales .fv-strip-num {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 28px;
  letter-spacing: -1px;
  color: var(--warm-white);
  line-height: 1;
}
#page-sales .fv-strip-label {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 12px;
  color: rgba(246,245,242,.82);
  line-height: 1.5;
}

/* ================================================================
   02 — INTRO : TYPOGRAPHIC STATEMENT
   ================================================================ */
#page-sales .intro {
  padding: 140px 0;
  background: var(--bg-primary);
  overflow: hidden;
  position: relative;
}
/* Enormous "WHY" behind text */
#page-sales .intro-ghost {
  position: absolute;
  top: 50%; left: -0.05em;
  transform: translateY(-50%);
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(200px, 28vw, 400px);
  line-height: 1;
  letter-spacing: -12px;
  color: var(--n-200);
  user-select: none;
  pointer-events: none;
}
#page-sales .intro-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
  position: relative; z-index: 2;
}
#page-sales .intro-kicker {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--accent-brand);
  margin-bottom: 48px;
  display: flex; align-items: center; gap: 16px;
}
#page-sales .intro-kicker::after { content: ''; flex: 0 0 48px; height: 1px; background: var(--accent-brand); }
/* Statement text — massive */
#page-sales .intro-statement {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(24px, 3.2vw, 44px);
  line-height: 1.75;
  letter-spacing: 1px;
  color: var(--text-primary);
  max-width: 800px;
  margin-bottom: 56px;
}
#page-sales .intro-statement u {
  text-decoration: none;
  border-bottom: 2px solid var(--accent-brand);
  padding-bottom: 2px;
  color: var(--accent-brand);
  font-weight: 700;
}
/* Sub body aligned right */
#page-sales .intro-sub-wrap {
  display: flex;
  justify-content: flex-end;
}
#page-sales .intro-sub {
  max-width: 520px;
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.95;
  color: var(--text-secondary);
}

/* ================================================================
   03 — SPLIT: BUY / SELL  (oversized running title)
   ================================================================ */
#page-sales .split-sec {
  background: var(--bg-primary);
  border-top: var(--bw-hair) solid var(--border-default);
  border-bottom: var(--bw-hair) solid var(--border-default);
  overflow: hidden;
}
/* Giant vertical label */
#page-sales .split-mega-label {
  position: absolute;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(100px, 14vw, 200px);
  line-height: 1;
  letter-spacing: -6px;
  user-select: none;
  pointer-events: none;
  z-index: 0;
}
#page-sales .split-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
#page-sales .split-panel {
  padding: 100px 64px 100px 80px;
  position: relative;
  overflow: hidden;
  display: flex; flex-direction: column; gap: 40px;
  z-index: 1;
}
#page-sales .split-panel + .split-panel {
  border-left: var(--bw-hair) solid var(--border-default);
}
#page-sales .split-panel-dark { background: var(--slate); }

/* Giant panel number in corner */
#page-sales .panel-index {
  position: absolute;
  top: 40px; right: 48px;
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 120px;
  line-height: 1;
  letter-spacing: -6px;
  color: var(--n-200);
  user-select: none;
  z-index: 0;
}
#page-sales .panel-index-inv { color: rgba(246,245,242,.06); }

#page-sales .panel-body-wrap { position: relative; z-index: 1; }
#page-sales .panel-tag {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--accent-brand);
  margin-bottom: 32px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
#page-sales .panel-tag::before {
  content: ''; width: 20px; height: 1px; background: currentColor; display: inline-block;
}
#page-sales .panel-tag-inv { color: var(--accent-bright); }

#page-sales .panel-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.3;
  letter-spacing: 1px;
  color: var(--text-primary);
  margin-bottom: 28px;
}
#page-sales .panel-h-inv { color: var(--warm-white); }

#page-sales .panel-body {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.95;
  color: var(--text-secondary);
  margin-bottom: 36px;
}
#page-sales .panel-body-inv { color: rgba(246,245,242,.88); }

/* Checklist */
#page-sales .checklist { display: flex; flex-direction: column; }
#page-sales .check-item {
  display: grid; grid-template-columns: 32px 1fr;
  padding: 16px 0;
  border-top: var(--bw-hair) solid var(--border-default);
  font-family: var(--font-jp);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.85;
  color: var(--text-primary);
  align-items: start;
}
#page-sales .check-item-inv { border-top-color: rgba(246,245,242,.12); color: rgba(246,245,242,.88); }
#page-sales .check-item:last-child { border-bottom: var(--bw-hair) solid var(--border-default); }
#page-sales .check-item-inv:last-child { border-bottom-color: rgba(246,245,242,.12); }
#page-sales .check-mark {
  font-family: var(--font-en);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--accent-brand);
  padding-top: 4px;
}
#page-sales .check-mark-inv { color: var(--accent-bright); }

/* Sub-option cards */
#page-sales .option-cards { display: flex; flex-direction: column; gap: 1px; }
#page-sales .option-card {
  padding: 20px 24px;
  background: rgba(246,245,242,.04);
  border: var(--bw-hair) solid rgba(246,245,242,.10);
}
#page-sales .option-card-title {
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: 13px;
  color: var(--warm-white);
  margin-bottom: 4px;
}
#page-sales .option-card-sub {
  font-family: var(--font-jp);
  font-weight: 300;
  font-size: 12px;
  line-height: 1.9;
  color: rgba(246,245,242,.6);
}

/* ================================================================
   04 — COMPARISON : editorial table
   ================================================================ */
#page-sales .compare-sec {
  padding: 120px 0;
  background: var(--bg-secondary);
  overflow: hidden;
  position: relative;
}
#page-sales .compare-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
  position: relative; z-index: 1;
}
#page-sales .compare-header {
  display: flex; justify-content: space-between; align-items: flex-end;
  margin-bottom: 64px;
}
#page-sales .compare-heading {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  line-height: 1.2;
  letter-spacing: 1px;
}
#page-sales .compare-note {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.9;
  color: var(--text-secondary);
  max-width: 280px;
  text-align: right;
}
#page-sales table.compare {
  width: 100%;
  border-collapse: collapse;
}
#page-sales table.compare thead tr {
  border-bottom: var(--bw-thin) solid var(--border-default);
}
#page-sales table.compare th {
  padding: 0 32px 20px;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--accent-brand);
  text-align: center;
}
#page-sales table.compare th:first-child { text-align: left; padding-left: 0; }
#page-sales table.compare td {
  padding: 22px 32px;
  border-bottom: var(--bw-hair) solid var(--border-default);
  font-family: var(--font-jp);
  font-size: 15px;
  line-height: 1.75;
  text-align: center;
  color: var(--text-secondary);
  font-weight: 400;
}
#page-sales table.compare td:first-child {
  text-align: left; padding-left: 0;
  font-weight: 600;
  color: var(--text-primary);
  font-size: 14px;
  letter-spacing: 0.5px;
}
#page-sales table.compare tbody tr:last-child td { border-bottom: none; }
#page-sales .em { color: var(--text-primary); font-weight: 700; }
#page-sales .dim { color: var(--n-400); }

/* Column headers with big numbers */
#page-sales .col-th-inner {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding-bottom: 4px;
}
#page-sales .col-th-num {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: 40px;
  letter-spacing: -2px;
  line-height: 1;
  color: var(--n-300);
}
#page-sales .col-th-label {
  font-family: var(--font-jp);
  font-weight: 600;
  font-size: 15px;
  color: var(--text-primary);
  letter-spacing: 1px;
}

/* ================================================================
   05 — STAT : full-bleed dark type showcase
   ================================================================ */
#page-sales .stat-sec {
  background: var(--slate);
  padding: 0;
  overflow: hidden;
}
#page-sales .stat-kicker {
  padding: 48px 80px 40px;
  border-bottom: var(--bw-hair) solid rgba(246,245,242,.08);
  display: flex; align-items: center; gap: 16px;
}
#page-sales .stat-kicker-text {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--accent-bright);
}
#page-sales .stat-kicker-line { flex: 1; height: 1px; background: rgba(61,192,209,.25); }
/* Grid of massive numbers */
#page-sales .stat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: var(--bw-hair) solid rgba(246,245,242,.06);
}
#page-sales .stat-cell {
  padding: 64px 48px;
  border-right: var(--bw-hair) solid rgba(246,245,242,.06);
  position: relative;
  overflow: hidden;
}
#page-sales .stat-cell:last-child { border-right: none; }
/* The number itself — massively oversized */
#page-sales .stat-n {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: clamp(64px, 8vw, 112px);
  line-height: 1;
  letter-spacing: -4px;
  color: var(--warm-white);
  display: flex; align-items: baseline; gap: 4px;
  margin-bottom: 16px;
}
#page-sales .stat-unit {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 1px;
  color: rgba(246,245,242,.82);
}
#page-sales .stat-label {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.85;
  color: rgba(246,245,242,.85);
}
/* Decorative ghost index */
#page-sales .stat-ghost {
  position: absolute;
  bottom: -0.15em; right: -0.05em;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: 160px;
  line-height: 1;
  letter-spacing: -8px;
  color: rgba(246,245,242,.018);
  user-select: none;
  pointer-events: none;
}

/* ================================================================
   06 — STRENGTHS: typographic list with giant index
   ================================================================ */
#page-sales .strength-sec {
  padding: 120px 0;
  background: var(--bg-primary);
  overflow: hidden;
}
#page-sales .strength-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
}
#page-sales .strength-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  margin-bottom: 80px;
  align-items: end;
}
#page-sales .strength-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  line-height: 1.25;
  letter-spacing: 1px;
}
#page-sales .strength-lead {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.95;
  color: var(--text-secondary);
}
/* Item: huge index + content */
#page-sales .strength-item {
  display: grid;
  grid-template-columns: 160px 1fr;
  border-top: var(--bw-hair) solid var(--border-default);
  padding: 48px 0;
  gap: 48px;
  align-items: start;
}
#page-sales .strength-item:last-child { border-bottom: var(--bw-hair) solid var(--border-default); }
#page-sales .s-num {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 80px;
  line-height: 1;
  letter-spacing: -4px;
  color: var(--accent-brand);
  padding-top: 8px;
  opacity: .85;
}
#page-sales .s-content {}
#page-sales .s-title {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: 1px;
  line-height: 1.35;
  margin-bottom: 16px;
  color: var(--text-primary);
}
#page-sales .s-body {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.95;
  color: var(--text-secondary);
}

/* ================================================================
   07 — FLOW: typographic step (both buy+sell)
   ================================================================ */
#page-sales .flow-sec {
  background: var(--bg-secondary);
  padding: 120px 0;
  overflow: hidden;
}
#page-sales .flow-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
}
#page-sales .flow-header {
  display: flex; align-items: baseline; gap: 32px;
  margin-bottom: 72px;
}
#page-sales .flow-title-jp {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 44px);
  letter-spacing: 1px;
  line-height: 1;
}
#page-sales .flow-title-en {
  font-family: var(--font-en);
  font-weight: 200;
  font-size: clamp(28px, 3.2vw, 44px);
  letter-spacing: -1px;
  line-height: 1;
  color: var(--n-300);
}
#page-sales .flow-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
}
#page-sales .flow-col-label {
  font-family: var(--font-en);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--accent-brand);
  margin-bottom: 32px;
  padding-bottom: 16px;
  border-bottom: var(--bw-thin) solid var(--accent-brand);
}
#page-sales .flow-step {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 0;
}
#page-sales .flow-left-col { display: flex; flex-direction: column; align-items: center; }
#page-sales .flow-step-num {
  width: 56px; height: 56px;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-en);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 2px;
  color: var(--accent-brand);
  border: var(--bw-thin) solid var(--accent-brand);
  background: var(--n-white);
  flex-shrink: 0;
  position: relative; z-index: 1;
}
#page-sales .flow-step-num.done {
  background: var(--accent-brand);
  color: var(--warm-white);
  border-color: var(--accent-brand);
}
#page-sales .flow-step-line {
  flex: 1; width: 0.5px;
  background: var(--border-default);
  margin: 0 auto;
}
#page-sales .flow-step:last-child .flow-step-line { display: none; }
#page-sales .flow-content {
  padding: 4px 0 48px 24px;
}
#page-sales .flow-phase-en {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--accent-brand);
  margin-bottom: 6px;
}
#page-sales .flow-step-title {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.5px;
  line-height: 1.35;
  margin-bottom: 10px;
  color: var(--text-primary);
}
#page-sales .flow-step-body {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.9;
  color: var(--text-secondary);
}
#page-sales .flow-note-pill {
  display: inline-flex;
  margin-top: 12px;
  padding: 4px 14px;
  border: var(--bw-hair) solid var(--accent-brand);
  background: var(--accent-tint);
  font-family: var(--font-jp);
  font-weight: 500;
  font-size: 11px;
  color: var(--accent-brand);
  letter-spacing: 0.5px;
  border-radius: 2px;
}

/* ================================================================
   08 — FAQ
   ================================================================ */
#page-sales .faq-sec {
  padding: 120px 0;
  background: var(--bg-primary);
}
#page-sales .faq-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 80px;
}
#page-sales .faq-heading-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  margin-bottom: 72px;
  align-items: end;
}
#page-sales .faq-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 48px);
  letter-spacing: 1px;
  line-height: 1.2;
}
/* Big decorative "FAQ" */
#page-sales .faq-deco {
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(48px, 7vw, 100px);
  letter-spacing: -4px;
  line-height: 1;
  color: var(--n-200);
  text-align: right;
  user-select: none;
}
#page-sales .faq-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
#page-sales .faq-group-lbl {
  font-family: var(--font-en);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--accent-brand);
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: var(--bw-thin) solid var(--accent-brand);
  display: block;
}
#page-sales .faq-item { border-bottom: var(--bw-hair) solid var(--border-default); }
#page-sales .faq-q {
  padding: 22px 0;
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 12px;
  align-items: start;
}
#page-sales .faq-q-mark {
  font-family: var(--font-en);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 1px;
  color: var(--accent-brand);
  margin-top: 1px;
}
#page-sales .faq-q-text {
  font-family: var(--font-jp);
  font-weight: 600;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-primary);
}
#page-sales .faq-a {
  padding: 0 0 22px 36px;
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.95;
  color: var(--text-secondary);
}

/* ================================================================
   09 — CTA : full-bleed typographic close
   ================================================================ */
#page-sales .cta-sec {
  background: var(--slate);
  padding: 0;
  overflow: hidden;
  position: relative;
}
/* Giant text behind everything */
#page-sales .cta-ghost {
  position: absolute;
  bottom: -0.05em; left: -0.03em;
  font-family: var(--font-en);
  font-weight: 800;
  font-size: clamp(160px, 20vw, 280px);
  line-height: 1;
  letter-spacing: -8px;
  color: rgba(246,245,242,.025);
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
}
#page-sales .cta-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 100px 80px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 80px;
  align-items: center;
  position: relative; z-index: 1;
}
#page-sales .cta-eyebrow {
  font-family: var(--font-en);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--accent-bright);
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 36px;
}
#page-sales .cta-eyebrow::before { content: ''; width: 40px; height: 1px; background: var(--accent-bright); }
#page-sales .cta-h {
  font-family: var(--font-jp);
  font-weight: 700;
  font-size: clamp(36px, 5vw, 72px);
  line-height: 1.25;
  letter-spacing: 1px;
  color: var(--warm-white);
  margin-bottom: 28px;
}
#page-sales .cta-sub {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.95;
  color: rgba(246,245,242,.88);
  max-width: 440px;
}
#page-sales .cta-right-block { display: flex; flex-direction: column; gap: 12px; min-width: 280px; }
#page-sales .cta-tel {
  font-family: var(--font-en);
  font-weight: 400;
  font-size: 38px;
  letter-spacing: -1px;
  color: var(--warm-white);
  line-height: 1;
  margin-bottom: 4px;
}
#page-sales .cta-hours {
  font-family: var(--font-jp);
  font-weight: 400;
  font-size: 12px;
  color: rgba(246,245,242,.75);
  margin-bottom: 20px;
  letter-spacing: 1px;
}
#page-sales .cta-tel:hover { opacity: .85; }
#page-sales .cta-sublink {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--font-jp);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1.5px;
  color: rgba(246,245,242,.72);
  text-decoration: none;
  text-underline-offset: 4px;
  border-bottom: 0.5px solid rgba(246,245,242,.35);
  padding-bottom: 2px;
  align-self: flex-start;
  cursor: pointer;
  transition: color .2s, border-color .2s;
}
#page-sales .cta-sublink:hover {
  color: var(--accent-bright);
  border-bottom-color: var(--accent-bright);
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 960px) {
  .fv-inner, .split-layout, .compare-header,
  .strength-head, .flow-2col, .faq-heading-row, .faq-2col,
  #page-sales .cta-inner { grid-template-columns: 1fr; }
  #page-sales .fv-right { display: none; }
  #page-sales .fv-strip { grid-template-columns: repeat(2, 1fr); }
  #page-sales .fv-left { padding: 64px 32px; }
  .intro-inner, .compare-inner, .strength-inner,
  #page-sales .flow-inner, #page-sales .faq-inner, #page-sales .cta-inner { padding: 0 32px; }
  #page-sales .split-panel { padding: 64px 32px; }
  #page-sales .panel-index { display: none; }
  #page-sales .stat-grid { grid-template-columns: repeat(2, 1fr); }
  #page-sales .strength-item { grid-template-columns: 80px 1fr; gap: 24px; }
  #page-sales .s-num { font-size: 48px; }
  #page-sales .cta-inner { padding: 64px 32px; gap: 48px; }
  #page-sales footer { padding: 20px 32px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; padding: 40px; }
  .service-tabs-section { padding: 80px 40px; }
  .tabs-header { flex-wrap: wrap; }
  .tab-button { padding: 16px 20px; font-size: 14px; }
  .tab-content.active { grid-template-columns: 1fr; gap: 48px; }
  .commitment-section { padding: 80px 40px; }
  .commitment-inner { grid-template-columns: 1fr; gap: 48px; }
  .column-section { padding: 80px 40px; }
  .column-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .column-header { flex-direction: column; align-items: flex-start; gap: 24px; }
}

@media (max-width: 640px) {
  .stats-grid { grid-template-columns: 1fr; padding: 32px 20px; }
  .service-tabs-section { padding: 60px 20px; }
  .tabs-header { margin-bottom: 40px; }
  .tab-button { padding: 16px 12px; font-size: 13px; }
  .commitment-section { padding: 60px 20px; }
  .column-section { padding: 60px 20px; }
  /* モバイル：コラム1カラム */
  .column-grid { grid-template-columns: 1fr; }
  .column-list-filter { justify-content: center; }
  /* モバイル：チーム2カラム */
  .team-grid, .team-more.open { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .cta-lead { padding:32px 24px 28px; margin:40px 0; }
  .cta-lead-heading { font-size:18px; line-height:1.55; }
  .cta-lead-list li { font-size:13px; }
  .cta-lead-btn { height:52px; font-size:14px; }
  .cta-sticky-wrap { padding:0 12px 12px; }
  .cta-sticky { flex-direction:column; height:auto; }
  .cta-sticky-info { display:none; }
  .cta-sticky-tel, .cta-sticky-form {
    padding:14px 18px; justify-content:center;
    min-width:0; border-right:none;
  }
  .cta-sticky-tel { border-bottom:.5px solid var(--n100); }
  .cta-sticky-tel-num { font-size:19px; }
  .cta-sticky-tel-hrs { display:none; }
  .cta-sticky-form { font-size:13px; padding:16px 20px; }
}



/* ============================================================
   RESPONSIVE FIX #2（#page-sales専用・特異度対策）
   ベースCSSが #page-sales .xxx（0,1,1）なのに、前方@media側が
   .xxx 単体（0,1,0）だったため特異度バトルで負けて無効化されていた。
   ここに #page-sales 前置で再掲し、特異度を合わせてカスケードで勝たせる。
   ============================================================ */
@media (max-width: 960px) {
  /* 1カラム化：ヒーロー / BUY・SELL / 比較 / 強み / ステップ / FAQ */
  #page-sales .fv-inner,
  #page-sales .split-layout,
  #page-sales .compare-header,
  #page-sales .strength-head,
  #page-sales .flow-2col,
  #page-sales .faq-heading-row,
  #page-sales .faq-2col { grid-template-columns: 1fr; gap: 48px; }

  /* 内側パディング */
  #page-sales .intro-inner,
  #page-sales .compare-inner,
  #page-sales .strength-inner { padding: 0 32px; }

  /* ヒーロー：右画像は隠す */
  #page-sales .fv-right { display: none; }
  #page-sales .fv-left { padding: 64px 32px; }
  #page-sales .fv-strip { grid-template-columns: repeat(2, 1fr); }

  /* BUY/SELLパネル：縦積み時の境界線を下線に付け替え */
  #page-sales .split-panel { padding: 64px 32px; }
  #page-sales .split-panel + .split-panel { border-left: none; border-top: var(--bw-hair) solid var(--border-default); }
  #page-sales .panel-index { display: none; }
}

@media (max-width: 640px) {
  #page-sales .fv-left { padding: 48px 20px; }
  #page-sales .fv-strip { grid-template-columns: repeat(2, 1fr); }
  #page-sales .fv-strip-cell { padding: 16px 12px; }
  #page-sales .split-panel { padding: 48px 20px; }
  #page-sales .intro-inner,
  #page-sales .compare-inner,
  #page-sales .strength-inner,
  #page-sales .flow-inner,
  #page-sales .faq-inner { padding: 0 20px; }
  /* CTA セクションは上下余白を確保（セクションが詰まるのを防ぐ） */
  #page-sales .cta-inner { padding: 56px 20px; gap: 40px; }
  #page-sales .strength-item { grid-template-columns: 56px 1fr; gap: 16px; }
  #page-sales .s-num { font-size: 36px; }
  #page-sales .fv-h1 { font-size: clamp(32px, 8vw, 56px); }
  #page-sales .intro-statement { font-size: clamp(22px, 5vw, 32px); }
  /* 比較表：モバイル時はパディング縮小で横溢れ防止 */
  #page-sales table.compare th,
  #page-sales table.compare td { padding-left: 12px; padding-right: 12px; font-size: 13px; }
  #page-sales table.compare td:first-child { font-size: 13px; }
  #page-sales .col-th-num { font-size: 28px; }
  #page-sales .col-th-label { font-size: 13px; }
  /* Flow ステップ：モバイルで横幅確保 */
  #page-sales .flow-step { grid-template-columns: 44px 1fr; }
  #page-sales .flow-step-num { width: 44px; height: 44px; font-size: 11px; }
  #page-sales .flow-content { padding: 2px 0 40px 16px; }
}


/* ============================================================
   2026-06-29 修正指示対応 1/4/5/6 — 末尾追記でカスケード優先（BENPROJECT）
   ============================================================ */
/* 5 売買FV: アクセント語「専門家」が透明文字＋薄縁で視認不可 → 実色化 */
#page-sales .fv-h1 .accent{ color: var(--warm-white); -webkit-text-stroke: 0; }
/* 5 売買FV: SELLゴーストバーの枠・ラベルがアクセント色で背景と同化 → 白で明確化 */
#page-sales .btn-accent-ghost{ border-color: var(--warm-white); }
#page-sales .btn-accent-ghost .btn-en{ color: var(--warm-white); opacity: .9; }
/* 5 売買: ゴーストボタン枠（無料査定等）の視認性向上 */
#page-sales .btn-ghost-inv{ border-color: rgba(246,245,242,.6); }
/* 6 売買FLOW: STEP番号間の縦ラインが背景と同化 → 配色変更・太さUP */
#page-sales .flow-step-line{ background: rgba(43,165,181,.55); width: 2px; }
@media (max-width:640px){
  /* 1 TOP OUR COMMITMENT 見出し: SPで3行 → 改行なし2行 */
  .commitment-section .section-heading{ font-size: 22px; line-height: 1.45; letter-spacing: .5px; }
  .commitment-section .section-heading br{ display: none; }
  /* 4 売買CTA「迷ったら、まず話しましょう。」: SPで3行 → 2行 */
  #page-sales .cta-h{ font-size: 28px; line-height: 1.35; letter-spacing: .5px; }
}

/* ============================================================
   2026-06-29 追加調整 A/B/C/F（BENPROJECT）
   ============================================================ */
.property-card .prop-img{ aspect-ratio:4/3; width:100%; height:auto; object-fit:cover; display:block; }
.footer-col:last-child{ border-bottom:0; }
@media (max-width:960px){
  #page-sales .compare-header{ flex-direction:column; align-items:flex-start; gap:24px; }
}
@media (max-width:960px){
  #page-sales .fv-right{ display:block !important; margin-top:28px; }
  #page-sales .fv-right img{ position:static !important; width:100% !important; height:auto !important; max-height:260px; object-fit:cover; border-radius:12px; display:block; }
}

/* I CTA「迷ったら…」3行折返し対策: 全幅でフォント縮小し2行に収める */
#page-sales .cta-h{ font-size:clamp(26px,3vw,44px); line-height:1.3; letter-spacing:.5px; }

/* N 最新ニュース: サムネ無し・タイトルのみの一覧 */
.news-list-grid{ display:block !important; margin-top:32px !important; }
.news-list-card{ display:block; padding:26px 28px; border-bottom:1px solid var(--n200); }
.news-list-card .card-img{ display:none !important; }
.news-list-card .card-content{ padding:0 !important; }
.news-list-card h3{ margin:6px 0 0 !important; }

/* フッターアコーディオン トグルをPCで非表示（>1200px） */
@media (min-width:1201px){
  .footer-col-toggle{ display:none !important; }
  .footer-col-title{ cursor:default; }
}

/* page-cta 背景欠落の白飛び対策（cta-sectionと同じティール背景） */
.page-cta{ background:#2AA5B5 !important; padding:96px 24px !important; text-align:center; }

/* page-cta ボタンをティール背景用に（標準CTAと統一） */
.page-cta .btn-primary{ background:#ffffff !important; color:#1B7A87 !important; border-color:#ffffff !important; }
.page-cta .btn-secondary{ background:transparent !important; color:#ffffff !important; border-color:rgba(255,255,255,.6) !important; }

/* ============================================================
   page-cta を標準CTA(.cta-section)と完全一致 ＋ フッター下部潰れ対策
   ============================================================ */
.page-cta{ background:#2AA5B5 !important; padding:120px 80px !important; text-align:center !important; }
.page-cta-label{ font-family:var(--ff-en); font-weight:500; font-size:12px; letter-spacing:4px; text-transform:uppercase; color:rgba(255,255,255,.8) !important; margin-bottom:16px; display:block; }
.page-cta h2{ font-size:clamp(32px,3.5vw,52px); font-weight:700; line-height:1.25; letter-spacing:2px; margin-bottom:24px; color:#fff !important; }
.page-cta p{ font-size:14px; line-height:1.8; color:rgba(255,255,255,.95) !important; margin-bottom:40px; }
.page-cta-actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.page-cta .btn-primary{ background:var(--cloud-white) !important; color:var(--jet) !important; padding:14px 36px; font-size:13px; font-weight:500; border:1px solid var(--cloud-white) !important; font-family:var(--ff-jp); letter-spacing:1px; display:inline-block; }
.page-cta .btn-primary:hover{ background:transparent !important; color:var(--cloud-white) !important; }
.page-cta .btn-secondary{ background:transparent !important; color:var(--cloud-white) !important; padding:14px 36px; font-size:13px; font-weight:500; border:1px solid var(--cloud-white) !important; font-family:var(--ff-jp); letter-spacing:1px; display:inline-block; }
.page-cta .btn-secondary:hover{ background:var(--cloud-white) !important; color:var(--jet) !important; }
@media (max-width:640px){ .page-cta{ padding:80px 24px !important; } }
.footer-bottom{ flex-wrap:wrap; gap:16px 24px; }
.footer-bottom-links{ flex-wrap:wrap; }
.footer-bottom-links a{ white-space:nowrap; }

/* 物件一覧カード: スマホはEC的な密度の2カラム */
@media (max-width:640px){
  .property-grid{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important; }
  .property-card .prop-body{ padding:10px 10px 12px !important; }
  .property-card .prop-meta{ font-size:9px !important; letter-spacing:1.5px !important; margin-bottom:4px !important; }
  .property-card .prop-title{ font-size:13px !important; margin-bottom:2px !important; line-height:1.4 !important; }
  .property-card .prop-sub{ font-size:10px !important; }
  .property-card .prop-price{ font-size:18px !important; margin-top:6px !important; letter-spacing:0 !important; }
  .property-card .prop-price span{ font-size:11px !important; }
}

/* ページネーション共通スタイル（アクセントカラー） */
.pagination{ margin-top:48px; }
.pagination .nav-links{ display:flex !important; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; height:auto !important; }
.pagination .page-numbers{ display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 14px; border:1px solid var(--n200); color:var(--jet); text-decoration:none; font-family:var(--ff-en); font-size:14px; transition:all .2s; }
.pagination a.page-numbers:hover{ border-color:var(--accent); color:var(--accent); }
.pagination .page-numbers.current{ background:var(--accent); border-color:var(--accent); color:#fff; }
.pagination .page-numbers.dots{ border:none; min-width:auto; }

/* 物件カード: ホバー時のみティールアクセント（最小限） */
.property-card{ transition:border-color .25s, transform .25s; }
.property-card:hover{ border-color:var(--accent) !important; }
.property-card:hover .prop-meta{ color:var(--accent); }
.property-card .prop-img{ transition:opacity .25s; }
.property-card:hover .prop-img{ opacity:.92; }

/* ============ 添削A-3対応: 統計カウンター単位表記（2026-07-02） ============ */
.stat-value{display:flex;align-items:baseline;justify-content:center;gap:3px;margin-bottom:8px;}
.stat-value .stat-number{margin-bottom:0;}
.stat-unit{font-family:var(--ff-jp);font-size:13px;font-weight:600;color:var(--accent);line-height:1;}
@media (max-width:768px){
  .stat-value{margin-bottom:4px;gap:2px;}
  .stat-unit{font-size:11px;}
}

/* ============ 添削対応: カード画像imgタグ方式へ統一（2026-07-02） ============ */
.pickup-card-img,.news-card-img,.article-hero-img{position:relative;overflow:hidden;}
.pickup-card-img img,
.news-card-img img,
.article-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}

/* ============ 注目の物件を賃貸一覧と同一カードに統一（2026-07-02） ============ */
.pickup-scroll .property-card{flex:0 0 320px;max-width:320px;scroll-snap-align:start;}
.pickup-scroll .property-card .prop-img{width:100%;display:block;}

/* 空き家ページ等：クリック不可のカードはポインター/浮き上がりを出さない (2026-07-13) */
.mgmt-hub-card:not([onclick]){ cursor:default; }
.mgmt-hub-card:not([onclick]):hover{ transform:none; border-color:var(--n200); box-shadow:none; }


/* =========================================================
   売買物件: 商談中バッジ / 利回りバッジ
   2026-07-14 追加（賃貸カードには出力されない）
   ========================================================= */

/* バッジ・利回りを行の右端へ寄せる */
.property-card .prop-meta{ display:flex; align-items:center; }
.property-card .prop-price{ display:flex; align-items:baseline; }

/* 数字と単位の間隔（1億8,800万円 を詰めて表示） */
.property-card .prop-price span{ margin-left:2px; }

/* 利回りバッジ */
.property-card .prop-price .prop-yield{
	display:inline-flex;
	align-items:center;
	gap:5px;
	margin-left:auto;
	font-family:var(--ff-en);
	font-weight:700;
	font-size:15px;
	letter-spacing:0;
	color:var(--jet);
	vertical-align:middle;
}
.property-card .prop-price .prop-yield i{
	font-family:var(--ff-jp);
	font-style:normal;
	font-weight:700;
	font-size:10px;
	letter-spacing:.5px;
	color:var(--accent-dark);
	background:var(--accent-tint);
	border-radius:3px;
	padding:3px 6px;
	margin-left:0;
}

/* 商談中バッジ */
.property-card .prop-meta .prop-badge-nego{
	display:inline-block;
	margin-left:auto;
	font-family:var(--ff-jp);
	font-size:10px;
	font-weight:700;
	letter-spacing:.5px;
	text-transform:none;
	color:#fff;
	background:var(--n600);
	border-radius:3px;
	padding:2px 7px;
	vertical-align:middle;
}

@media (max-width:600px){
	.property-card .prop-price .prop-yield{ margin-left:auto; font-size:13px; }
	.property-card .prop-price .prop-yield i{ font-size:9px; padding:2px 5px; }
}