/* =========================================================
   site.css ― 共通リフレッシュレイヤー（2026-10）
   全ページ共通：ヘッダー／SP固定CTA／フッター／可読性
   各ページのインラインCSSの「後」に読み込む前提
   ========================================================= */
:root{
  --sp-navy:#1B3A5C; --sp-navy-dark:#0D2238; --sp-navy-mid:#254E7A;
  --sp-gold:#C49A30; --sp-gold-dark:#A87E22; --sp-line:#06C755;
  --sp-text:#1a1a1a; --sp-text-mid:#4a5563; --sp-beige:#ece7dc; --sp-off:#f7f5f0;
  --sp-cta-h:64px;
}

/* ---------- ヘッダー ---------- */
header#header{ height:76px !important; padding:0 clamp(16px,3vw,40px) !important; gap:20px; }
header#header .logo-img{ height:34px; width:auto; }
header#header nav{ display:flex; align-items:center; gap:18px; margin-left:auto; }
header#header .nav-links{ display:flex !important; align-items:center; gap:clamp(14px,1.6vw,26px) !important; }
header#header .nav-links a{ color:rgba(255,255,255,.88) !important; font-size:.86rem !important; letter-spacing:.06em !important; text-decoration:none; white-space:nowrap; position:relative; padding:6px 0; }
header#header .nav-links a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--sp-gold); transform:scaleX(0); transition:transform .25s; }
header#header .nav-links a:hover{ color:#fff !important; }
header#header .nav-links a:hover::after{ transform:scaleX(1); }
header#header .btn-nav, header#header .btn-nav-line{ display:inline-flex !important; align-items:center; justify-content:center; height:40px; padding:0 18px !important; font-size:.84rem !important; font-weight:600; letter-spacing:.06em; border-radius:3px; text-decoration:none; white-space:nowrap; }
header#header .btn-nav{ background:var(--sp-gold) !important; color:#fff !important; border:none !important; }
header#header .btn-nav:hover{ background:var(--sp-gold-dark) !important; }
header#header .btn-nav-line{ background:var(--sp-line) !important; color:#fff !important; border:none !important; }
header#header .hamburger{ display:none !important; width:44px; height:44px; align-items:center; justify-content:center; }

/* 1180px未満：ナビはハンバーガーへ、CTAは残す */
@media (max-width:1179px){
  header#header .nav-links{ display:none !important; }
  header#header .hamburger{ display:flex !important; }
  header#header nav{ gap:10px; }
}
/* 640px以下：ヘッダーCTAは下部固定バーに移す */
@media (max-width:640px){
  header#header{ height:64px !important; }
  header#header .logo-img{ height:28px; }
  header#header .btn-nav, header#header .btn-nav-line{ display:none !important; }
  .mobile-menu{ top:64px !important; }
}
@media (min-width:641px) and (max-width:1179px){ .mobile-menu{ top:76px !important; } }
@media (min-width:641px){ .mobile-menu{ top:76px !important; } }

/* モバイルメニュー */
.mobile-menu{ max-height:calc(100vh - 64px); overflow-y:auto; -webkit-overflow-scrolling:touch; padding:8px 20px 24px !important; }
.mobile-menu a{ font-size:.98rem !important; padding:15px 4px !important; min-height:52px; display:flex !important; align-items:center; justify-content:space-between; }
.mobile-menu a:not(.btn-nav-mobile)::after{ content:"›"; color:rgba(255,255,255,.35); font-size:1.2rem; }
.mobile-menu .mm-group{ font-size:.7rem; letter-spacing:.2em; color:var(--sp-gold); padding:18px 4px 4px; font-family:'Playfair Display',serif; font-style:italic; }
.mobile-menu .mm-ctas{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px; }
.mobile-menu .mm-ctas a{ justify-content:center !important; border:none !important; border-radius:3px; color:#fff !important; font-weight:600; font-size:.92rem !important; }
.mobile-menu .mm-ctas a::after{ content:none !important; }
.mobile-menu .mm-ctas .mm-cta-gold{ background:var(--sp-gold); grid-column:1 / -1; }
.mobile-menu .mm-ctas .mm-cta-line{ background:var(--sp-line); }
.mobile-menu .mm-ctas .mm-cta-tel{ background:rgba(255,255,255,.12); }

/* ---------- SP固定CTAバー ---------- */
.sp-cta-bar{ display:none; }
@media (max-width:640px){
  .sp-cta-bar{ display:grid; grid-template-columns:1fr 1fr 1.25fr; position:fixed; left:0; right:0; bottom:0; z-index:90; height:calc(var(--sp-cta-h) + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); background:#fff; box-shadow:0 -4px 18px rgba(13,34,56,.14); transition:transform .3s ease; }
  .sp-cta-bar.is-hidden{ transform:translateY(110%); }
  .sp-cta-bar a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; text-decoration:none; font-size:.74rem; font-weight:700; letter-spacing:.04em; color:var(--sp-navy-dark); }
  .sp-cta-bar a svg{ width:20px; height:20px; }
  .sp-cta-bar .cta-tel{ border-right:1px solid var(--sp-beige); }
  .sp-cta-bar .cta-line{ background:var(--sp-line); color:#fff; }
  .sp-cta-bar .cta-form{ background:var(--sp-gold); color:#fff; font-size:.8rem; }
  body{ padding-bottom:calc(var(--sp-cta-h) + env(safe-area-inset-bottom)); }
}

/* ---------- フッター ---------- */
footer.site-footer{ background:var(--sp-navy-dark) !important; color:rgba(255,255,255,.72) !important; padding:64px clamp(18px,4vw,48px) 28px !important; text-align:left !important; font-size:.86rem !important; }
.site-footer .ft-inner{ max-width:1120px; margin:0 auto; display:grid; grid-template-columns:1.25fr 2fr; gap:48px; }
.site-footer .ft-logo{ height:34px; width:auto; margin-bottom:18px; display:block; }
.site-footer .ft-company dl{ display:grid; grid-template-columns:auto 1fr; gap:6px 14px; margin:0; font-size:.82rem; line-height:1.7; }
.site-footer .ft-company dt{ color:rgba(255,255,255,.45); white-space:nowrap; }
.site-footer .ft-company dd{ margin:0; color:rgba(255,255,255,.85); }
.site-footer .ft-company a{ color:#fff; text-decoration:none; }
.site-footer .ft-nav{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.site-footer .ft-nav h4{ font-family:'Playfair Display',serif; font-style:italic; font-weight:400; color:var(--sp-gold); font-size:.82rem; letter-spacing:.16em; margin:0 0 12px; }
.site-footer .ft-nav ul{ list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.site-footer .ft-nav a{ color:rgba(255,255,255,.82); text-decoration:none; font-size:.86rem; display:inline-block; padding:5px 0; }
.site-footer .ft-nav a:hover{ color:var(--sp-gold); }
.site-footer .ft-bottom{ max-width:1120px; margin:44px auto 0; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:.75rem; color:rgba(255,255,255,.45); }
@media (max-width:860px){
  .site-footer .ft-inner{ grid-template-columns:1fr; gap:36px; }
}
@media (max-width:640px){
  footer.site-footer{ padding:48px 20px 24px !important; }
  .site-footer .ft-nav{ grid-template-columns:1fr 1fr; gap:22px 16px; }
  .site-footer .ft-nav a{ font-size:.88rem; padding:7px 0; }
  .site-footer .ft-bottom{ flex-direction:column; }
}

/* ---------- 可読性（全ページ共通の底上げ） ---------- */
body{ -webkit-text-size-adjust:100%; text-rendering:optimizeLegibility; }
img{ max-width:100%; height:auto; }
.section-desc{ font-size:clamp(.92rem,1.1vw,1rem) !important; line-height:2 !important; color:var(--sp-text-mid); }
@media (max-width:640px){
  .section-desc{ text-align:center !important; font-size:.92rem !important; }
  .section-desc br{ display:none; }
  .hero-sub{ font-size:.92rem !important; }
  .sc-list li{ font-size:.92rem !important; line-height:1.8; }
  .sc-tagline{ font-size:.98rem !important; }
  .president-message p{ font-size:.95rem !important; line-height:2.05 !important; }
  .president-message p br{ display:none; }
  .review-text{ font-size:.93rem !important; line-height:1.95 !important; }
  .faq-text{ font-size:.95rem !important; }
  .btn-primary, .btn-outline{ width:100% !important; max-width:320px; padding:15px 0 !important; font-size:.92rem !important; }
}
/* 会社概要テーブル：SPは縦積み */
@media (max-width:640px){
  .company-table, .company-table tbody, .company-table tr, .company-table th, .company-table td{ display:block; width:100% !important; }
  .company-table tr{ padding:14px 0; border-bottom:1px solid var(--sp-beige); }
  .company-table th{ font-size:.78rem !important; color:var(--sp-text-mid); padding:0 0 4px !important; border:none !important; }
  .company-table td{ font-size:.95rem !important; padding:0 !important; border:none !important; }
}

/* =========================================================
   トップページ（index.html）
   ========================================================= */
#home{ height:auto !important; min-height:min(88vh,820px) !important; padding:120px 20px 96px !important; }
.hero-title{ font-size:clamp(1.9rem,4.2vw,3.2rem) !important; line-height:1.45 !important; }
.hero-sub-pc{ font-size:1rem !important; line-height:2.1 !important; max-width:720px; margin-left:auto; margin-right:auto; }
.hero-btns{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.btn-primary, .btn-outline{ min-width:230px; padding:16px 28px !important; font-size:.95rem !important; text-align:center; }
.hero-trust{ list-style:none; margin:44px auto 0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:10px 28px; color:rgba(255,255,255,.78); font-size:.82rem; letter-spacing:.06em; opacity:0; animation:fadeUp .9s ease 1.1s forwards; }
.hero-trust li{ display:flex; align-items:center; gap:8px; }
.hero-trust li::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--sp-gold); flex-shrink:0; }
@media (max-width:640px){
  #home{ min-height:calc(100svh - 64px) !important; padding:96px 20px 64px !important; }
  .hero-title{ font-size:1.85rem !important; }
  .hero-btns{ flex-direction:column; align-items:center; }
  .hero-trust{ flex-direction:column; align-items:flex-start; width:fit-content; margin-top:32px; gap:8px; font-size:.8rem; }
  .scroll-indicator{ display:none !important; }
}

/* サービスカードの明示リンク */
.sc-more{ display:inline-flex; align-items:center; gap:8px; margin-top:20px; color:var(--sp-gold-dark); font-weight:700; font-size:.88rem; letter-spacing:.06em; text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:3px; }
.sc-more::after{ content:"→"; transition:transform .2s; }
.service-card:hover .sc-more::after{ transform:translateX(4px); }

/* セクション共通 */
.hm-section{ padding:96px 24px; background:#fff; }
.hm-section.hm-off{ background:var(--sp-off); }
.hm-section .section-header{ margin-bottom:48px; }
.hm-more{ text-align:center; margin-top:44px; }
.hm-more-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:260px; padding:15px 32px; background:var(--sp-navy); color:#fff; text-decoration:none; font-size:.92rem; font-weight:600; letter-spacing:.06em; border-radius:999px; transition:background .2s; }
.hm-more-btn::after{ content:"›"; font-size:1.2rem; line-height:1; }
.hm-more-btn:hover{ background:var(--sp-navy-dark); }
@media (max-width:640px){
  .hm-section{ padding:64px 18px !important; }
  .hm-section .section-header{ margin-bottom:32px; }
  .hm-more-btn{ width:100%; max-width:340px; }
}

/* 成約実績 */
.hm-res-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.hm-res{ background:#fff; border-radius:6px; overflow:hidden; box-shadow:0 1px 0 var(--sp-beige); }
.hm-res-img{ position:relative; aspect-ratio:4/3; background:linear-gradient(135deg,var(--sp-navy-dark),var(--sp-navy)); }
.hm-res-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.hm-res-badge{ position:absolute; top:10px; left:10px; background:rgba(13,34,56,.86); color:#fff; font-size:.68rem; font-weight:700; letter-spacing:.14em; padding:3px 10px; border-radius:2px; }
.hm-res-body{ padding:14px 16px 16px; }
.hm-res-name{ margin:0; font-family:'Noto Serif JP',serif; font-size:.95rem; color:var(--sp-navy-dark); line-height:1.5; }
.hm-res-floor{ margin:4px 0 0; font-size:.8rem; color:var(--sp-text-mid); }
@media (max-width:900px){ .hm-res-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .hm-res-grid{ grid-template-columns:repeat(2,1fr); gap:12px; } .hm-res-body{ padding:10px 12px 12px; } .hm-res-name{ font-size:.86rem; } .hm-res-floor{ font-size:.74rem; } }

/* お客様の声 */
.hm-voice-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.hm-voice{ background:var(--sp-off); border-radius:6px; padding:28px 26px; display:flex; flex-direction:column; }
.hm-voice .review-type{ align-self:flex-start; }
.hm-voice-title{ font-family:'Noto Serif JP',serif; font-size:1.02rem; font-weight:600; color:var(--sp-navy-dark); line-height:1.6; margin:14px 0 10px; }
.hm-voice-text{ font-size:.92rem; line-height:1.95; color:var(--sp-text); margin:0 0 16px; flex:1; }
.hm-voice-name{ margin:0; font-size:.8rem; color:var(--sp-text-mid); text-align:right; }
@media (max-width:900px){ .hm-voice-grid{ grid-template-columns:1fr; max-width:640px; margin:0 auto; gap:16px; } }
@media (max-width:640px){ .hm-voice{ padding:22px 20px; } }

/* コラム */
.hm-col-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.hm-col{ display:flex; flex-direction:column; background:#fff; border-radius:6px; overflow:hidden; text-decoration:none; color:inherit; transition:transform .2s, box-shadow .2s; }
.hm-col:hover{ transform:translateY(-4px); box-shadow:0 10px 26px rgba(13,34,56,.1); }
.hm-col-img{ aspect-ratio:16/9; background:var(--sp-navy); overflow:hidden; }
.hm-col-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.hm-col-body{ padding:18px 20px 20px; display:flex; flex-direction:column; gap:8px; flex:1; }
.hm-col-tag{ align-self:flex-start; font-size:.7rem; letter-spacing:.1em; color:var(--sp-navy); background:#E8EFF6; padding:3px 10px; border-radius:2px; }
.hm-col-title{ font-size:.98rem; font-weight:600; line-height:1.65; color:var(--sp-navy-dark); margin:0; flex:1; }
.hm-col-date{ font-size:.78rem; color:var(--sp-text-mid); font-family:'Playfair Display',serif; }
@media (max-width:900px){ .hm-col-grid{ grid-template-columns:1fr; max-width:640px; margin:0 auto; gap:14px; } }
@media (max-width:640px){
  /* 画像を切らずに全体を見せるため、スマホでも画像を上・本文を下に置く */
  .hm-col{ flex-direction:column; }
  .hm-col-img{ width:100%; aspect-ratio:16/9; }
  .hm-col-body{ padding:14px 16px 16px; gap:6px; }
  .hm-col-title{ font-size:.88rem; line-height:1.55; }
}

/* 代表挨拶：PCは写真と本文を横並び */
@media (min-width:900px){
  .president-layout{ display:grid !important; grid-template-columns:340px 1fr; grid-template-rows:auto 1fr; column-gap:56px; align-items:start; max-width:1000px; margin:0 auto; }
  .president-photo-top{ grid-row:1 / span 2; margin:0 !important; }
  .president-photo{ max-width:100% !important; }
  .president-name-block{ text-align:left !important; }
  .president-message p{ font-size:.98rem !important; line-height:2.1 !important; }
}
.scroll-indicator{ display:none !important; }
.sp-cta-bar a{ margin:0 !important; height:var(--sp-cta-h); border-radius:0 !important; }
.mobile-menu{ background:#0D2238 !important; }
@media (min-width:769px){ .contact-info-row{ flex-wrap:nowrap !important; justify-content:center; gap:12px !important; } .contact-info-row .contact-info-item{ white-space:nowrap; flex:0 0 auto; padding:12px 20px !important; letter-spacing:.04em !important; } }

/* コラム・成約実績など一覧ページ（SPA／静的ページ共通） */
.col-hero-inner{ padding-left:20px; padding-right:20px; }
@media (max-width:768px){
  .col-card{ padding:0 !important; }
  .col-card-body{ padding:16px 18px 18px !important; }
  .col-card-thumb{ aspect-ratio:16/9; }
  .col-card-title{ font-size:.95rem; line-height:1.6; }
}

/* コラム本文中のリンク（自動内部リンク含む） */
article.column p a, article.column li a{ color:var(--navy,#1a3d6e); text-decoration:underline; text-decoration-color:rgba(196,154,48,.7); text-decoration-thickness:1px; text-underline-offset:3px; }
article.column p a:hover, article.column li a:hover{ text-decoration-color:currentColor; }
/* 目次のリンクは折り返す（nav a の nowrap がスマホではみ出す原因）・下線なし */
article.column .col-toc a, .col-toc a{ white-space:normal; text-decoration:none; }

/* ===== 2026-10 PC・タブレット・スマホ表示の最適化 ===== */
/* タブレット（641〜900px）：1列で間延びしていたブロックを2〜3列に */
@media (min-width:641px) and (max-width:900px){
  .service-grid{ grid-template-columns:1fr 1fr !important; gap:20px !important; }
  .hm-col-grid{ grid-template-columns:repeat(3,1fr); max-width:none; gap:16px; }
  .hm-col-body{ padding:14px 14px 16px; }
  .hm-col-title{ font-size:.86rem; line-height:1.6; }
  .hm-voice-grid{ max-width:720px; }
}
@media (min-width:641px) and (max-width:767px){
  .hm-col-grid{ grid-template-columns:repeat(2,1fr); }
}
/* タッチ端末：指で押しやすい大きさに */
@media (hover:none), (max-width:900px){
  .rv-more summary{ min-height:44px; }
  .sc-more{ min-height:44px; }
  .column-back{ min-height:44px; }
  .prop-map-link{ display:inline-flex; align-items:center; min-height:40px; }
  .review-card:hover, .hm-col:hover{ transform:none; }
}
/* スマホ：12px未満の文字をなくす */
@media (max-width:640px){
  .col-card-date, .hm-col-date{ font-size:.78rem; }
  .prop-tsubo{ font-size:.78rem; }
  .prop-photo-count{ font-size:.75rem; }
  .r-card-label{ font-size:.78rem; }
  .sp-cta-bar a{ font-size:.8rem; }
  .hm-res-floor{ font-size:.78rem; }
}

/* 一覧の「もっと見る」 */
.pg-hide{ display:none !important; }
.pg-more{ display:block; margin:32px auto 0; min-width:260px; min-height:48px; padding:12px 32px; background:#fff; color:var(--sp-navy-dark,#0D2238); border:1.5px solid var(--sp-navy-dark,#0D2238); border-radius:999px; font-family:inherit; font-size:.9rem; font-weight:700; letter-spacing:.06em; cursor:pointer; transition:background .2s,color .2s; }
.pg-more:hover{ background:var(--sp-navy-dark,#0D2238); color:#fff; }
.pg-more[hidden]{ display:none; }
@media (max-width:640px){ .pg-more{ width:100%; } }

/* 横はみ出し防止を clip に（hidden だと sticky が効かないため）。未対応ブラウザは従来どおり hidden */
@supports (overflow: clip){
  html, body{ overflow-x: clip !important; }
}
/* スマホ・タブレット：絞り込みタブを画面上部に固定 */
@media (max-width:900px){
  .voice-tabs, .col-tabs{ position:sticky; top:64px; z-index:30; background:#fff; padding-top:10px !important; padding-bottom:10px !important; margin-left:-24px !important; margin-right:-24px !important; padding-left:24px !important; padding-right:24px !important; box-shadow:0 8px 12px -12px rgba(0,0,0,.35); }
}
@media (min-width:641px) and (max-width:900px){ .voice-tabs, .col-tabs{ top:76px; } }
/* ヒーローの信頼ポイント（4項目）：PCは1行、タブレットは2×2 */
@media (min-width:1024px){ .hero-trust{ flex-wrap:nowrap; gap:10px 22px; white-space:nowrap; } }
@media (min-width:641px) and (max-width:1023px){ .hero-trust{ display:grid; grid-template-columns:auto auto; justify-content:center; gap:10px 28px; } }
