@charset "utf-8";
/* ==========================================================================
   D2「編集ミニマル」 taste-skill / minimalist-ui
   温かいオフホワイトの紙、明朝の大見出し、1px の細い罫、極端な余白。
   色は資源として節約する。差し色は「翡翠 #1B7A5A」1色だけ（2026-08-15 オーナー決定）。
   ⚠️ ボツにした深緑 #2C4A3B との違いは色相ではなく彩度（25% → 64%）。くすませない。
   ※ 明朝を使うのは、この方向が editorial 家族だから（造園らしさも同時に出る）
   ========================================================================== */
html[data-d="min"]{
  --ink:      #111111;
  --ink-2:    #2F3437;
  --paper:    #FFFFFF;
  --tint:     #F7F6F3;   /* 温かいボーン */
  --line:     #EAEAEA;
  --body:     #6E6D6A;   /* minimalist-ui の #787774 は白地で 4.48 と基準割れ。濃くして 5.17 */
  --y:        #1B7A5A;   /* 翡翠。ページ内で唯一の差し色。白文字とのコントラスト 5.28 */
  --y-l:      #63C9A4;   /* 濃色の上に置く明るい翡翠（小さい文字用） */
  --y-d:      #146046;   /* ホバー */
  --on-y:     #FFFFFF;
  --ink-rgb:  17,17,17;
  --line-dk:  #2E2E2C;
  --dim:      #ADABA6;
  --dim-2:    #C9C7C1;
  --th-bg:    #F7F6F3;
  --ftr-bg:   #111111;
  --ftr-line: #2E2E2C;
  --field-bg: #1A1A1A;
  --field-bd: #3A3A38;

  --f-min: "Hiragino Mincho ProN","ヒラギノ明朝 ProN","Yu Mincho","游明朝",serif;
  --sec: clamp(80px,11vw,168px);   /* 極端な余白 */
  --wrap: 1000px;                  /* 本文幅を絞る */
}

html[data-d="min"] body{ background:var(--tint); letter-spacing:.05em; }

/* 見出しはすべて明朝・字間を詰める */
html[data-d="min"] h1,
html[data-d="min"] h2,
html[data-d="min"] h3{ font-family:var(--f-min); font-weight:600; letter-spacing:.01em; line-height:1.42; }
html[data-d="min"] .hero h1{ font-size:clamp(30px,4.4vw,52px); line-height:1.34; }

/* 面はすべて白 ＋ 1px の罫。影はほぼ使わない */
html[data-d="min"] .btn{ border-radius:5px; border:0; padding:14px 28px; font-weight:600; letter-spacing:.08em; }
html[data-d="min"] .btn--y{ background:var(--y); color:#fff; }
html[data-d="min"] .btn--y:hover{ background:var(--y-d); }
html[data-d="min"] .btn--line{ border:1px solid rgba(255,255,255,.5); }
html[data-d="min"] .btn:active{ transform:scale(.98); }

html[data-d="min"] .notice{ background:#FFFFFF; color:var(--body); border-bottom:1px solid var(--line); }
html[data-d="min"] .hdr{ background:rgba(247,246,243,.9); border-bottom:1px solid var(--line); }
html[data-d="min"] .nav a:hover{ border-bottom-color:var(--y); }
html[data-d="min"] .hdr__cta{ padding:10px 18px; }

/* ヒーロー：写真を全面に敷かず、紙の上に置く */
html[data-d="min"] .hero{ min-height:0; display:block; background:var(--tint); padding:clamp(48px,7vw,96px) 0 0; }
html[data-d="min"] .hero__ph{ position:relative; inset:auto; max-width:1240px; margin:0 auto;
  padding-inline:var(--pad); }
html[data-d="min"] .hero__ph img{ aspect-ratio:21/9; border-radius:10px; }
html[data-d="min"] .hero::after{ display:none; }
html[data-d="min"] .hero__body{ position:relative; color:var(--ink); max-width:1000px;
  padding:clamp(30px,4vw,52px) var(--pad) clamp(60px,8vw,104px); }
html[data-d="min"] .hero__eyebrow{ color:var(--body); font-weight:600; font-size:11px; letter-spacing:.2em; }
html[data-d="min"] .hero h1{ text-shadow:none; }
html[data-d="min"] .hero__lead{ color:var(--ink-2); }

/* 困りごと：黒帯をやめ、紙の上の罫だけで区切る */
html[data-d="min"] .trouble{ background:var(--paper); color:var(--ink); border-block:1px solid var(--line); }
html[data-d="min"] .trouble__list{ border-top:1px solid var(--line); }
html[data-d="min"] .trouble__list li,
html[data-d="min"] .trouble__list li:nth-child(odd){ border-bottom:1px solid var(--line); border-right:0; }
html[data-d="min"] .trouble__list li:nth-child(odd){ border-right:1px solid var(--line); }
html[data-d="min"] .trouble__list b{ font-family:var(--f-min); font-weight:600; }
html[data-d="min"] .trouble__list b::before{ background:var(--y); }
html[data-d="min"] .trouble__list span,
html[data-d="min"] .trouble__note{ color:var(--body); }

/* できること：写真を角丸に、罫で囲まない */
html[data-d="min"] .svc{ background:var(--tint); }
html[data-d="min"] .svc__ph img{ border-radius:10px; }
html[data-d="min"] .svc__tx h3::after{ background:var(--y); height:2px; width:40px; }
html[data-d="min"] .svc__tags{ color:var(--body); font-size:13px; letter-spacing:.08em; }

/* 機械：白いカードを紙の上に */
html[data-d="min"] .kikai{ background:var(--tint); gap:clamp(20px,3vw,44px);
  max-width:1240px; margin-inline:auto; padding-inline:var(--pad); align-items:center; }
html[data-d="min"] .kikai__ph img{ border-radius:10px; max-height:640px; }
html[data-d="min"] .kikai__card{ background:var(--paper); border:1px solid var(--line); border-radius:12px;
  padding:clamp(28px,3.4vw,44px); }

/* 規模の帯：白抜き文字をやめ、写真の下に静かに置く */
html[data-d="min"] .scale{ background:var(--tint); max-width:1240px; margin-inline:auto; padding-inline:var(--pad); }
html[data-d="min"] .scale__ph img{ border-radius:10px; height:clamp(200px,26vw,320px); }
html[data-d="min"] .scale__tx{ position:static; background:none; padding:18px 0 0; }
html[data-d="min"] .scale__tx p{ color:var(--body); font-size:14.5px; }

/* 施工事例：ベントーだが、面ではなく罫で作る */
html[data-d="min"] .works{ background:var(--paper); border-block:1px solid var(--line); }
html[data-d="min"] .works__grid{ gap:20px; }
html[data-d="min"] .works__it{ border:1px solid var(--line); border-radius:12px; overflow:hidden;
  transition:box-shadow .2s; }
html[data-d="min"] .works__it:hover{ box-shadow:0 2px 8px rgba(0,0,0,.04); }
html[data-d="min"] .works__it b{ font-family:var(--f-min); font-weight:600; font-size:16px; }
html[data-d="min"] .works__it figcaption{ padding:18px 20px 22px; }

html[data-d="min"] .team{ background:var(--tint); }
html[data-d="min"] .team__ph{ max-width:1240px; margin-inline:auto; padding-inline:var(--pad); }
html[data-d="min"] .team__ph img{ border-radius:10px; }

html[data-d="min"] .cmp{ background:var(--paper); border-top:1px solid var(--line); }
html[data-d="min"] .cmp table{ border:1px solid var(--line); }
html[data-d="min"] .cmp th{ background:var(--tint); font-weight:600; }
html[data-d="min"] .cmp__map iframe{ border-radius:10px; }

/* お問い合わせ：黒の面で締める（ページ内で唯一の濃色） */
html[data-d="min"] .con{ background:var(--ink); }
html[data-d="min"] .con h2{ font-family:var(--f-min); }
html[data-d="min"] .con__tel small{ color:var(--y-l); }
html[data-d="min"] .con__f input,
html[data-d="min"] .con__f textarea{ border-radius:5px; }
html[data-d="min"] .con__f .btn{ background:var(--y); color:#fff; }
html[data-d="min"] .con__f .btn:hover{ background:var(--y-d); }

html[data-d="min"] .modal__bx{ border-radius:12px; }

/* ==========================================================================
   ヘッダーとヒーロー（2026-08-15 オーナーの構成案に合わせて作り直し）
   ロゴマークは入れない。デザインはオーナーの領分（CLAUDE.md）なので、
   ここでは社名の文字組みだけで作る
   ========================================================================== */
html[data-d="min"] .hdr{ background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); }
html[data-d="min"] .hdr__in{ height:84px; gap:clamp(12px,2vw,30px); }
html[data-d="min"] .brand{ margin-right:0; line-height:1.15; }
html[data-d="min"] .brand__c{ display:block; font-size:11.5px; letter-spacing:.14em; color:var(--body); }
html[data-d="min"] .brand__n{ display:block; font-family:var(--f-min); font-size:clamp(20px,2.1vw,26px);
  font-weight:600; letter-spacing:.06em; color:#111; }
html[data-d="min"] .brand__tag{ font-size:12px; letter-spacing:.16em; color:var(--body);
  margin-right:auto; padding-left:6px; white-space:nowrap; }
html[data-d="min"] .nav{ gap:clamp(14px,1.9vw,28px); }
html[data-d="min"] .nav a{ font-size:13.5px; letter-spacing:.08em; }
html[data-d="min"] .hdr__cta{ padding:13px 24px; font-size:13px; border-radius:2px; }

/* ヒーロー：写真を全面に敷き、白文字を左に置く */
html[data-d="min"] .hero{ position:relative; display:block; padding:0;
  background:var(--tint); margin-bottom:clamp(0px,7vw,86px); }
html[data-d="min"] .hero__ph{ position:relative; inset:auto; max-width:none; padding:0; }
html[data-d="min"] .hero__ph img{ width:100%; height:clamp(460px,64vw,720px);
  object-fit:cover; object-position:52% 50%; border-radius:0; }
html[data-d="min"] .hero::after{ content:""; display:block; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(20,30,22,.62) 0%, rgba(20,30,22,.42) 34%,
             rgba(20,30,22,.10) 62%, rgba(20,30,22,0) 82%); }
html[data-d="min"] .hero__body{ position:absolute; inset:0; z-index:1; color:#fff;
  max-width:var(--wrap); margin-inline:auto; padding:0 var(--pad);
  display:flex; flex-direction:column; justify-content:center; }
html[data-d="min"] .hero h1{ font-family:var(--f-min); color:#fff; font-weight:600;
  font-size:clamp(29px,4.6vw,58px); line-height:1.4; letter-spacing:.04em;
  margin:0 0 22px; text-shadow:0 2px 24px rgba(10,20,12,.42); }
html[data-d="min"] .hero__lead{ color:#EDF0EC; font-size:clamp(14.5px,1.4vw,17px);
  line-height:2.05; margin:0 0 34px; text-shadow:0 1px 14px rgba(10,20,12,.45); }
html[data-d="min"] .hero .btn--line{ border:1px solid rgba(255,255,255,.75); color:#fff;
  border-radius:2px; padding:15px 30px; }
html[data-d="min"] .hero .btn--line:hover{ background:#fff; color:#111; }

/* ヒーロー下の4枚のカード（写真に重ねる） */
html[data-d="min"] .hcards{ position:relative; z-index:2; list-style:none; margin:0 auto;
  padding:0 var(--pad); max-width:var(--wrap); display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(10px,1.2vw,18px); margin-top:clamp(-120px,-9vw,-70px); }
html[data-d="min"] .hcards li{ background:rgba(255,255,255,.94); backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.9); border-radius:10px; padding:22px 18px 20px;
  text-align:center; box-shadow:0 10px 30px -18px rgba(17,17,17,.35); }
html[data-d="min"] .hcards b{ display:block; font-family:var(--f-min); font-weight:600;
  font-size:15.5px; letter-spacing:.06em; color:#111; margin-bottom:7px; }
html[data-d="min"] .hcards span{ display:block; font-size:12px; line-height:1.75; color:var(--body); }

@media (max-width:900px){
  html[data-d="min"] .brand__tag{ display:none; }
}
@media (max-width:768px){
  html[data-d="min"] .hdr__in{ height:70px; }
  html[data-d="min"] .hero__ph img{ content:url("images/hero-sp.webp?v=5"); height:clamp(420px,112vw,560px); }
  html[data-d="min"] .hero::after{ background:linear-gradient(180deg, rgba(20,30,22,.30) 0%,
    rgba(20,30,22,.50) 55%, rgba(20,30,22,.66) 100%); }
  html[data-d="min"] .hero__body{ justify-content:flex-end; padding-bottom:36px; }
  html[data-d="min"] .hcards{ grid-template-columns:repeat(2,1fr); margin-top:18px; }
  html[data-d="min"] .hero{ margin-bottom:clamp(28px,8vw,56px); }
}

/* ヘッダーだけ本文幅（1000px）より広く取る。折り返しを禁止する */
html[data-d="min"] .hdr__in{ max-width:1280px; gap:clamp(10px,1.6vw,26px); }
html[data-d="min"] .brand__n,
html[data-d="min"] .brand__c,
html[data-d="min"] .brand__tag,
html[data-d="min"] .nav a,
html[data-d="min"] .hdr__cta{ white-space:nowrap; }
html[data-d="min"] .brand__tag{ font-size:11.5px; letter-spacing:.12em; }
@media (max-width:1180px){ html[data-d="min"] .brand__tag{ display:none; } }

/* スマホ：文字と幕を「写真の高さ」に合わせる（カードの領域まで広がらないように） */
@media (max-width:768px){
  html[data-d="min"]{ --hero-h-sp:clamp(460px,120vw,600px); }
  html[data-d="min"] .hero__ph img{ height:var(--hero-h-sp); }
  html[data-d="min"] .hero::after{ bottom:auto; height:var(--hero-h-sp); }
  html[data-d="min"] .hero__body{ bottom:auto; height:var(--hero-h-sp); }
  html[data-d="min"] .hero h1{ font-size:clamp(25px,7.2vw,32px); line-height:1.45; margin-bottom:16px; }
  html[data-d="min"] .hero__lead{ font-size:14px; line-height:1.95; margin-bottom:24px; }
  html[data-d="min"] .hero .btn--line{ padding:13px 24px; font-size:13.5px; }
}

/* ヒーロー見出しを一段小さく（2026-08-15 オーナー指示）
   1440px時 58px → 50px。式で持つので他の幅も比率で追随する */
html[data-d="min"] .hero h1{ font-size:clamp(27px,3.9vw,50px); }

/* ==========================================================================
   本編（2026-08-15 オーナー確定テキストに合わせて全セクションを組み直し）
   セクションの英字ラベルは「MESSAGE」等のみ。番号（01｜）は付けていない
   ========================================================================== */
html[data-d="min"] .lbl{ font-size:11px; letter-spacing:.24em; font-weight:600;
  color:var(--y); margin:0 0 18px; }
html[data-d="min"] .sec__h{ font-family:var(--f-min); font-weight:600; color:#111;
  font-size:clamp(23px,2.7vw,34px); line-height:1.5; letter-spacing:.03em; margin:0 0 20px; }
html[data-d="min"] .sec__lead{ font-size:15px; line-height:2.05; color:var(--body);
  max-width:52em; margin:0 0 clamp(30px,4vw,52px); }

/* ---- MESSAGE ---- */
html[data-d="min"] .msg{ padding-block:clamp(60px,8vw,120px); background:var(--tint); }
html[data-d="min"] .msg__in{ display:grid; grid-template-columns:1fr .84fr;
  gap:clamp(28px,5vw,70px); align-items:center; }
html[data-d="min"] .msg__tx h2{ font-family:var(--f-min); font-weight:600; color:#111;
  font-size:clamp(24px,3vw,38px); line-height:1.5; letter-spacing:.04em; margin:0 0 26px; }
html[data-d="min"] .msg__tx p{ font-size:15px; line-height:2.15; color:#2F3437; margin:0 0 20px; }
html[data-d="min"] .msg__tx p:last-child{ margin-bottom:0; }
html[data-d="min"] .msg__ph img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:10px; }

/* ---- STRENGTHS ---- */
html[data-d="min"] .str{ padding-block:clamp(60px,8vw,120px); background:var(--paper);
  border-block:1px solid var(--line); }
html[data-d="min"] .str__list b{ display:block; font-family:var(--f-min); font-weight:600;
  font-size:17px; line-height:1.6; letter-spacing:.03em; color:#111; margin-bottom:12px; }
html[data-d="min"] .str__list p{ margin:0; font-size:14px; line-height:2; color:var(--body); }

/* ---- SERVICE（6枚） ---- */
html[data-d="min"] .svc{ padding-block:clamp(60px,8vw,120px); background:var(--tint); }
html[data-d="min"] .svc__grid{ list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.8vw,24px); }
html[data-d="min"] .svc__grid li{ background:var(--paper); border:1px solid var(--line);
  border-radius:10px; padding:clamp(22px,2.4vw,30px); }
html[data-d="min"] .svc__grid b{ display:block; font-family:var(--f-min); font-weight:600;
  font-size:17px; letter-spacing:.04em; color:#111; margin-bottom:14px; }
html[data-d="min"] .svc__grid b::after{ content:""; display:block; width:34px; height:2px;
  background:var(--y); margin-top:14px; }
html[data-d="min"] .svc__grid p{ margin:0 0 16px; font-size:14px; line-height:2; color:var(--body); }
html[data-d="min"] .svc__tag{ display:block; font-size:12px; letter-spacing:.06em; color:#111; }

/* ---- WORKS ---- */
html[data-d="min"] .works{ padding-block:clamp(60px,8vw,120px); background:var(--paper);
  border-block:1px solid var(--line); }
html[data-d="min"] .works__grid{ display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,26px); }
html[data-d="min"] .works__it{ margin:0; border:1px solid var(--line); border-radius:10px;
  overflow:hidden; background:var(--paper); }
html[data-d="min"] .works__it img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
html[data-d="min"] .works__it figcaption{ padding:20px 22px 24px; }
html[data-d="min"] .works__it b{ display:block; font-family:var(--f-min); font-weight:600;
  font-size:16.5px; letter-spacing:.04em; color:#111; margin-bottom:9px; }
html[data-d="min"] .works__it span{ display:block; font-size:13.5px; line-height:1.95; color:var(--body); }
html[data-d="min"] .works__more{ margin-top:clamp(28px,3.4vw,44px); text-align:center; }
html[data-d="min"] .btn--ghost{ border:1px solid var(--line); color:#111; background:transparent;
  border-radius:2px; padding:15px 40px; }
html[data-d="min"] .btn--ghost:hover{ border-color:var(--y); color:var(--y); }

/* ---- SUPPORT ---- */
html[data-d="min"] .sup{ padding-block:clamp(60px,8vw,120px); background:var(--tint); }
html[data-d="min"] .sup__list{ list-style:none; margin:clamp(24px,3vw,40px) 0 clamp(26px,3.4vw,44px);
  padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:0;
  border-top:1px solid var(--line); }
html[data-d="min"] .sup__list li{ border-bottom:1px solid var(--line); padding:17px 0 17px 30px;
  font-size:15px; position:relative; }
html[data-d="min"] .sup__list li:nth-child(odd){ padding-right:28px; }
html[data-d="min"] .sup__list li:nth-child(even){ padding-left:58px; }
html[data-d="min"] .sup__list li::before{ content:""; position:absolute; left:0; top:26px;
  width:14px; height:2px; background:var(--y); }
html[data-d="min"] .sup__list li:nth-child(even)::before{ left:28px; }
html[data-d="min"] .sup__note{ font-size:14.5px; line-height:2.05; color:var(--body); max-width:56em; margin:0; }

/* ---- CONTACT（写真の上に濃い幕） ---- */
html[data-d="min"] .con{ position:relative; padding-block:clamp(64px,8.5vw,124px);
  background:var(--ink); color:#fff; overflow:hidden; }
html[data-d="min"] .con__bg{ position:absolute; inset:0; }
html[data-d="min"] .con__bg img{ width:100%; height:100%; object-fit:cover; }
html[data-d="min"] .con::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(16,26,18,.90) 0%, rgba(16,26,18,.80) 46%, rgba(16,26,18,.62) 100%); }
html[data-d="min"] .con__in{ position:relative; z-index:1; }
html[data-d="min"] .con .lbl{ color:var(--y-l); }
html[data-d="min"] .con h2{ font-family:var(--f-min); font-weight:600; color:#fff;
  font-size:clamp(24px,3vw,38px); line-height:1.5; letter-spacing:.04em; margin:0 0 20px; }
html[data-d="min"] .con__lead{ font-size:15px; line-height:2.1; color:#DDE3DC;
  max-width:50em; margin:0 0 clamp(28px,3.4vw,42px); }
html[data-d="min"] .con__acts{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
html[data-d="min"] .con__acts .btn--y{ border-radius:2px; padding:16px 34px; }
html[data-d="min"] .con__acts .btn--line{ border:1px solid rgba(255,255,255,.7); color:#fff;
  border-radius:2px; padding:16px 30px; }
html[data-d="min"] .con__acts .btn--line:hover{ background:#fff; color:#111; }
html[data-d="min"] .con__tel{ font-family:var(--f-min); font-size:clamp(26px,2.8vw,34px);
  font-weight:600; letter-spacing:.03em; color:#fff; text-decoration:none; margin-left:8px; }

/* ---- 会社概要 ---- */
html[data-d="min"] .cmp{ padding-block:clamp(60px,8vw,120px); background:var(--paper);
  border-top:1px solid var(--line); }

@media (max-width:900px){
  html[data-d="min"] .msg__in{ grid-template-columns:1fr; }
  html[data-d="min"] .msg__ph{ order:-1; }
  html[data-d="min"] .str__list,
  html[data-d="min"] .svc__grid,
  html[data-d="min"] .works__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  html[data-d="min"] .str__list,
  html[data-d="min"] .svc__grid,
  html[data-d="min"] .works__grid{ grid-template-columns:1fr; }
  html[data-d="min"] .sup__list{ grid-template-columns:1fr; }
  html[data-d="min"] .sup__list li,
  html[data-d="min"] .sup__list li:nth-child(odd),
  html[data-d="min"] .sup__list li:nth-child(even){ padding:15px 0 15px 30px; }
  html[data-d="min"] .sup__list li::before,
  html[data-d="min"] .sup__list li:nth-child(even)::before{ left:0; top:24px; }
  html[data-d="min"] .con__acts{ flex-direction:column; align-items:stretch; }
  html[data-d="min"] .con__acts .btn{ justify-content:center; }
  html[data-d="min"] .con__tel{ margin-left:0; text-align:center; padding-top:6px; }
}

/* ---- アイコン ---- */
html[data-d="min"] .ico{ width:56px; height:56px; display:block; margin:0 0 16px; }
html[data-d="min"] .ico--s{ width:48px; height:48px; margin-bottom:14px; }

/* ---- お問い合わせフォーム（その場で重ねて開く） ---- */
.fm{ position:fixed; inset:0; z-index:120; background:rgba(17,17,17,.55);
  display:flex; align-items:flex-start; justify-content:center; padding:clamp(16px,5vh,64px) 16px;
  overflow-y:auto; }
.fm[hidden]{ display:none !important; }
.fm__bx{ position:relative; background:#fff; width:100%; max-width:620px; border-radius:12px;
  padding:clamp(28px,4vw,48px) clamp(22px,3.4vw,44px) clamp(30px,4vw,44px);
  box-shadow:0 30px 80px -30px rgba(17,17,17,.5); }
.fm__x{ position:absolute; top:12px; right:14px; width:40px; height:40px; border:0;
  background:none; font-size:26px; line-height:1; color:#6E6D6A; cursor:pointer; border-radius:6px; }
.fm__x:hover{ background:#F2F1EE; color:#111; }
.fm__bx h2{ font-family:var(--f-min); font-weight:600; font-size:26px; letter-spacing:.04em;
  color:#111; margin:0 0 14px; }
.fm__lead{ font-size:14px; line-height:2; color:#6E6D6A; margin:0 0 26px; }
.fm__f{ display:grid; gap:18px; }
.fm__f label{ display:grid; gap:8px; font-size:13.5px; font-weight:600; letter-spacing:.06em; color:#111; }
.fm__f input,.fm__f textarea{ font:inherit; font-size:15px; font-weight:400; letter-spacing:.03em;
  padding:13px 14px; border:1px solid #DCDBD6; border-radius:6px; background:#FBFBFA; color:#111; }
.fm__f textarea{ resize:vertical; }
.fm__f input::placeholder,.fm__f textarea::placeholder{ color:#9B9A95; }
.fm__f input:focus,.fm__f textarea:focus{ outline:2px solid var(--y); outline-offset:1px; border-color:var(--y); }
.fm__f .btn{ justify-self:start; margin-top:6px; border-radius:2px; padding:15px 34px; }
.fm__note{ font-size:13px; color:#6E6D6A; margin:2px 0 0; }
.fm__note a{ color:var(--y); font-weight:600; }
@media (max-width:640px){
  .fm{ padding:0; }
  .fm__bx{ border-radius:0; min-height:100dvh; }
  .fm__f .btn{ justify-self:stretch; justify-content:center; }
}

/* ヒーロー下のカードにもアイコン（構成案どおり） */
html[data-d="min"] .hcards .ico{ width:40px; height:40px; margin:0 auto 10px; }

/* ヒーローのボタンを削除したので、本文下の余白を詰める（2026-08-15） */
html[data-d="min"] .hero__lead{ margin-bottom:0; }

/* 強みはアイコンをやめて写真にする（2026-08-15 オーナー判断） */

/* --------------------------------------------------------------------------
   強み：写真を画面の端まで抜いて、左右交互に置く（2026-08-15 オーナー指示）
   「できること」で使っていた組み方に合わせる。番号は写真に重ねず文字側に置く
   -------------------------------------------------------------------------- */
html[data-d="min"] .str__list{ list-style:none; margin:clamp(30px,4vw,56px) 0 0; padding:0; }
html[data-d="min"] .str__row{ display:grid; grid-template-columns:1.12fr .88fr;
  align-items:center; gap:clamp(24px,4vw,64px); margin-bottom:clamp(30px,4.4vw,64px); }
html[data-d="min"] .str__row:last-child{ margin-bottom:0; }
html[data-d="min"] .str__row--flip{ grid-template-columns:.88fr 1.12fr; }
html[data-d="min"] .str__row--flip .str__ph{ order:2; }
html[data-d="min"] .str__ph{ margin:0; }
html[data-d="min"] .str__ph img{ width:100%; aspect-ratio:4/3; object-fit:cover;
  display:block; border-radius:0 10px 10px 0; }
html[data-d="min"] .str__row--flip .str__ph img{ border-radius:10px 0 0 10px; }
html[data-d="min"] .str__tx{ padding-inline:var(--pad); max-width:600px; }
html[data-d="min"] .str__row--flip .str__tx{ margin-left:auto; }
html[data-d="min"] .str__no{ display:block; position:static; background:none; padding:0;
  font:600 12px/1 ui-monospace,monospace; letter-spacing:.16em; color:var(--y); margin:0 0 14px; }
html[data-d="min"] .str__tx b{ display:block; font-family:var(--f-min); font-weight:600;
  font-size:clamp(19px,2vw,24px); line-height:1.55; letter-spacing:.03em; color:#111; margin:0 0 16px; }
html[data-d="min"] .str__tx b::after{ content:""; display:block; width:40px; height:2px;
  background:var(--y); margin-top:16px; }
html[data-d="min"] .str__tx p{ margin:0; font-size:15px; line-height:2.1; color:var(--body); }

@media (max-width:768px){
  html[data-d="min"] .str__row,
  html[data-d="min"] .str__row--flip{ grid-template-columns:1fr; gap:20px; }
  html[data-d="min"] .str__row--flip .str__ph{ order:0; }
  html[data-d="min"] .str__ph img,
  html[data-d="min"] .str__row--flip .str__ph img{ border-radius:0; }
  html[data-d="min"] .str__tx{ margin-left:0; }
}

/* 2行目（写真が右）が右端に届いていなかったので、行の幅を画面いっぱいに固定する */
html[data-d="min"] .str__list{ width:100%; overflow-x:clip; }
html[data-d="min"] .str__row{ width:100%; }

/* --------------------------------------------------------------------------
   アイコンは「高さ」で大きさを揃える（2026-08-15 オーナー指摘）
   幅を基準にしていたため、横長のもの（門・灯籠）が小さく見えていた。
   横幅は絵ごとに変わるが、目で見た大きさが揃う
   -------------------------------------------------------------------------- */
html[data-d="min"] .ico{ height:56px; width:auto; display:block; margin:0 auto 16px; }
html[data-d="min"] .hcards .ico{ height:40px; width:auto; margin:0 auto 10px; }

/* サービスのカードは、アイコン・小見出し・線を中央揃えにする */
html[data-d="min"] .svc__grid li{ text-align:center; }
html[data-d="min"] .svc__grid b::after{ margin:14px auto 0; }
html[data-d="min"] .svc__grid p{ text-align:left; }
html[data-d="min"] .svc__tag{ text-align:center; }

/* ==========================================================================
   見出しの中央揃え（2026-08-15 オーナー指示）
   対象＝STRENGTHS 以降。MESSAGE は左のまま。
   会社概要は「左に表・右に地図」の2カラムなので、見出しだけ中央にすると
   表とずれる。ここでは対象外にしている
   ========================================================================== */
html[data-d="min"] .str .lbl,
html[data-d="min"] .str .sec__h,
html[data-d="min"] .svc .lbl,
html[data-d="min"] .svc .sec__h,
html[data-d="min"] .svc .sec__lead,
html[data-d="min"] .works .lbl,
html[data-d="min"] .works .sec__h,
html[data-d="min"] .sup .lbl,
html[data-d="min"] .sup .sec__h,
html[data-d="min"] .con .lbl,
html[data-d="min"] .con h2,
html[data-d="min"] .con__lead{ text-align:center; }

/* 幅の上限があるものは、中央に置き直す */
html[data-d="min"] .svc .sec__lead,
html[data-d="min"] .con__lead{ margin-inline:auto; }

/* CONTACT は見出しだけ中央にすると下のボタンとずれるので、まとめて中央 */
html[data-d="min"] .con__acts{ justify-content:center; }
html[data-d="min"] .con__tel{ margin-left:0; }

/* CONTACT は元々「左に文章・右にフォーム」の2カラムだった。フォームを
   重ねて開く方式に変えた時点で右列が空になり、文章が左半分に押し込まれて
   いたので、1カラムに戻して中央に置く */
html[data-d="min"] .con__in{ display:block; max-width:880px; margin-inline:auto; }

/* ---- 会社概要：見出しを中央に出して、表と地図の高さを揃える
   （2026-08-15 オーナー指示）
   見出しは左カラムの中にあったので、2カラムの外へ出した（HTML .cmp__hd）
   地図が短かったのは align-items:start のせい。stretch にすると表と同じ高さになる */
html[data-d="min"] .cmp__hd{ text-align:center; }
html[data-d="min"] .cmp__hd .sec__h{ margin-bottom:clamp(30px,4vw,52px); }
html[data-d="min"] .cmp__in{ align-items:stretch; }

/* ---- 会社概要とお悩み（SUPPORT）の順番を入れ替えたので、背景の交互を組み直す
   （2026-08-15 オーナー指示）
   入れ替えたままだと 施工事例（白）→ 会社概要（白）が並んで境目が消える */
html[data-d="min"] .cmp{ background:var(--tint); border-top:0; }
html[data-d="min"] .sup{ background:var(--paper); border-top:1px solid var(--line); }

/* ---- スマホのヒーロー見出しを一段小さく（2026-08-15 オーナー指示）
   27px 固定だと「心地よい暮らしをつくる。」12文字が画面幅にわずかに収まらず、
   「る。」だけが3行目に落ちていた。画面幅に比例させて必ず2行に収める */
@media (max-width:430px){
  html[data-d="min"] .hero h1{ font-size:clamp(20px,6.8vw,29px); }
}

/* ---- ヒーロー：見出しとリード文の間隔を広げ、字間を少し開ける
   （2026-08-15 オーナー指示）
   字間を広げるとスマホで見出しが3行に落ちるので、下のスマホ用も同時に細くしている */
html[data-d="min"] .hero h1{ letter-spacing:.06em; margin-bottom:clamp(26px,2.9vw,42px); }
html[data-d="min"] .hero__lead{ letter-spacing:.07em; }
@media (max-width:430px){
  html[data-d="min"] .hero h1{ font-size:clamp(19px,6.5vw,28px); }
}

/* ---- ヒーローの文字を少し下げる（2026-08-15 オーナー指示）
   上下中央ぞろえのままなので、上に余白を足すと下がる（下がる量は余白の半分） */
@media (min-width:769px){
  html[data-d="min"] .hero__body{ padding-top:clamp(50px,7vw,92px); }
}

/* ---- MESSAGE：写真を大きく（2026-08-15 オーナー指示）
   本文幅1000pxの外に広げ、写真側の取り分を増やす。写真 383px → 約590px */
/* 写真は 561px（1つ前の大きさ）に戻し、本文は 383px のまま。
   そのぶん全体の幅が縮むので、左右の余白が広がって中央に寄る */
html[data-d="min"] .msg__in{ max-width:1104px; grid-template-columns:.683fr 1fr; }

/* ---- MESSAGE：見出しを他のセクションと同じ形にそろえる（2026-08-15 オーナー指示）
   見出しを2カラムの外へ出し、中央ぞろえ・.sec__h（色とサイズは STRENGTHS 以降と共通）
   本文は写真と横並びのまま */
html[data-d="min"] .msg__hd{ max-width:1180px; text-align:center; }
html[data-d="min"] .msg__hd .sec__h{ margin-bottom:clamp(30px,4vw,52px); }

/* ---- 説明文を消したセクションの、見出しと中身の間隔をそろえる（2026-08-15）
   説明文が抜けた分だけ SERVICE と WORKS が詰まっていた。全セクション約52pxに統一
   （SUPPORT は下のリスト側にも余白があるので、その分を引いている） */
html[data-d="min"] .svc .sec__h,
html[data-d="min"] .works .sec__h{ margin-bottom:clamp(30px,4vw,52px); }
html[data-d="min"] .sup__list{ margin-top:clamp(30px,4vw,52px); }  /* 余白は相殺されるので、リスト側で決める */

/* ---- STRENGTHS：文章を写真側に寄せる（2026-08-15 オーナー指示）
   写真と文字のあいだが99pxあった（列の間隔51px＋文字ブロックの内側余白48px）。
   写真側の内側余白をなくし、間隔だけで決める。画面の外側の余白は48pxのまま */
html[data-d="min"] .str__row{ gap:clamp(28px,4.4vw,56px); }
html[data-d="min"] .str__tx{ padding-inline:0 var(--pad); }
html[data-d="min"] .str__row--flip .str__tx{ padding-inline:var(--pad) 0; }
@media (max-width:768px){
  /* 縦積みになったら左右とも余白を戻す */
  html[data-d="min"] .str__tx,
  html[data-d="min"] .str__row--flip .str__tx{ padding-inline:var(--pad); }
}

/* ---- 施工事例：右から左へ流れる帯（2026-08-15 オーナー指示）
   同じ12枚を2組並べ、1組ぶん（-50%）動かして先頭に戻すので、継ぎ目が出ない
   カード幅は 304px → 380px に拡大 */
html[data-d="min"] .mq{ overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%); }
html[data-d="min"] .mq__track{ display:flex; width:max-content; animation:mqslide 60s linear infinite; }
html[data-d="min"] .mq:hover .mq__track,
html[data-d="min"] .mq:focus-within .mq__track{ animation-play-state:paused; }
html[data-d="min"] .mq__set{ display:flex; gap:20px; margin:0; padding:0 20px 0 0; list-style:none; }
html[data-d="min"] .mq__set li{ flex:0 0 clamp(258px,72vw,380px);
  border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--paper); }
html[data-d="min"] .mq__set figure{ margin:0; }
html[data-d="min"] .mq__set img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
html[data-d="min"] .mq__set figcaption{ padding:20px 22px 24px; }
html[data-d="min"] .mq__set b{ display:block; font-family:var(--f-min); font-weight:600;
  font-size:16.5px; letter-spacing:.04em; color:#111; margin-bottom:10px; }
html[data-d="min"] .mq__set span{ display:block; font-size:13.5px; line-height:1.95; color:var(--body); }
@keyframes mqslide{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* 動きを減らす設定の人には流さず、指で送れるようにする */
@media (prefers-reduced-motion:reduce){
  html[data-d="min"] .mq{ overflow-x:auto; }
  html[data-d="min"] .mq__track{ animation:none; }
}

/* ==========================================================================
   2026-08-15 オーナー指示（構成案の画像に合わせる）
   ========================================================================== */

/* ---- 施工事例の帯：カーソルを乗せても止めない */
html[data-d="min"] .mq:hover .mq__track,
html[data-d="min"] .mq:focus-within .mq__track{ animation-play-state:running; }

/* ---- 「施工事例をもっと見る」をボタンらしく（翡翠に塗って矢印をつける）---- */
html[data-d="min"] .btn--arw{ display:inline-flex; align-items:center; gap:12px; }
html[data-d="min"] .btn__arw{ font-size:15px; line-height:1; opacity:.85; transition:transform .18s ease; }
html[data-d="min"] .btn--arw:hover .btn__arw{ transform:translateX(4px); }
html[data-d="min"] .works__more .btn{ background:var(--y); color:#fff; border:0;
  border-radius:6px; padding:17px 34px; font-size:14.5px; }
html[data-d="min"] .works__more .btn:hover{ background:var(--y-d); }

/* ---- SUPPORT：6つのカード＋チェックのアイコン ---- */
html[data-d="min"] .sup__list{ display:grid; grid-template-columns:repeat(3,1fr);
  gap:16px; margin:clamp(30px,4vw,52px) 0 clamp(26px,3.4vw,44px); padding:0; list-style:none; }
html[data-d="min"] .sup__list li{ display:flex; align-items:center; gap:14px;
  background:var(--tint); border:1px solid var(--line); border-radius:10px;
  padding:20px 20px; margin:0; text-align:left; }
/* 旧レイアウトの罫線と丸印を打ち消す */
html[data-d="min"] .sup__list li::before{ content:none; }
html[data-d="min"] .sup__ico{ flex:0 0 auto; width:30px; height:30px; display:block; }
html[data-d="min"] .sup__list li span{ font-size:14.5px; line-height:1.75; color:#111; }
html[data-d="min"] .sup__note{ text-align:center; margin-inline:auto; }

/* ---- CONTACT：写真を全幅に敷かず、角丸の箱に収めて縦を詰める ---- */
html[data-d="min"] .con{ padding-block:clamp(44px,5.4vw,78px); background:var(--paper);
  border-top:1px solid var(--line); overflow:visible; }
html[data-d="min"] .con::after{ content:none; }          /* 全幅の幕はやめる */
html[data-d="min"] .con__box{ position:relative; border-radius:14px; overflow:hidden;
  padding:clamp(34px,4.6vw,60px) clamp(22px,3.4vw,52px); isolation:isolate; }
html[data-d="min"] .con__box::after{ content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(100deg, rgba(16,26,18,.88) 0%, rgba(16,26,18,.74) 48%, rgba(16,26,18,.58) 100%); }
html[data-d="min"] .con__bg{ position:absolute; inset:0; z-index:-1; }
html[data-d="min"] .con__in{ position:relative; z-index:1; max-width:none; margin:0; text-align:center; }
html[data-d="min"] .con h2{ font-size:clamp(23px,2.7vw,34px); margin:0 0 14px; }
html[data-d="min"] .con__lead{ font-size:14.5px; line-height:1.9; margin:0 0 clamp(22px,2.6vw,32px); }
html[data-d="min"] .con__acts{ gap:12px 16px; }
html[data-d="min"] .con__acts .btn{ border-radius:6px; padding:15px 26px; font-size:14px; }
html[data-d="min"] .btn--wht{ background:#fff; color:#111; border:0; }
html[data-d="min"] .btn--wht:hover{ background:#EDEEEB; }
html[data-d="min"] .btn__ico{ width:20px; height:auto; display:block; }
html[data-d="min"] .btn--wht .btn__ico,
html[data-d="min"] .con__acts .btn--y .btn__ico{ filter:brightness(0) invert(1); }
html[data-d="min"] .btn--wht .btn__ico{ filter:none; }
html[data-d="min"] .con__tel{ display:inline-flex; align-items:center; gap:10px;
  font-size:clamp(23px,2.5vw,31px); margin-left:6px; }
html[data-d="min"] .con__tel-ico{ width:24px; height:auto; filter:brightness(0) invert(1); }

@media (max-width:900px){
  html[data-d="min"] .sup__list{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  html[data-d="min"] .sup__list{ grid-template-columns:1fr; }
  html[data-d="min"] .sup__list li,
  html[data-d="min"] .sup__list li:nth-child(odd),
  html[data-d="min"] .sup__list li:nth-child(even){ padding:16px 18px; }
}

/* ==========================================================================
   2026-08-15 追加指示：お悩みとお問い合わせを「ひと続き」に見せる
   ========================================================================== */

/* ---- 境目の線をなくし、2つの節を近づける ---- */
html[data-d="min"] .sup{ padding-bottom:clamp(26px,3vw,44px); }
html[data-d="min"] .con{ border-top:0; padding-top:0; }

/* ---- お悩みカード：4枚・中身の寄せ方を左でそろえる ---- */
html[data-d="min"] .sup__list{ grid-template-columns:repeat(4,1fr); }
html[data-d="min"] .sup__list li{ justify-content:flex-start; text-align:left; }
html[data-d="min"] .sup__list li span{ text-align:left; }
html[data-d="min"] .sup__note{ text-align:left; margin-inline:0; }

/* ---- お問い合わせ：構成案どおり左寄せ ---- */
html[data-d="min"] .con__in{ text-align:left; }
html[data-d="min"] .con h2,
html[data-d="min"] .con__lead{ text-align:left; }
html[data-d="min"] .con__lead{ max-width:44em; margin-inline:0; }
html[data-d="min"] .con__acts{ justify-content:flex-start; align-items:center; }
html[data-d="min"] .con__telbox{ margin-left:6px; }
html[data-d="min"] .con__tel{ margin-left:0; }
html[data-d="min"] .con__hours{ margin:4px 0 0 34px; font-size:12.5px; letter-spacing:.03em;
  line-height:1.6; color:#DEE5DC; }  /* 4.14→基準割れだったので明るくした */

@media (max-width:900px){
  html[data-d="min"] .sup__list{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  html[data-d="min"] .sup__list{ grid-template-columns:1fr; }
  html[data-d="min"] .con__telbox{ margin-left:0; }
  html[data-d="min"] .con__hours{ margin-left:34px; }
}

/* 旧レイアウト（左右2列の罫線リスト）の指定が残っていて、偶数番目のカードだけ
   左に58pxずれていた。カード表示ではすべて同じ余白にそろえる */
html[data-d="min"] .sup__list li,
html[data-d="min"] .sup__list li:nth-child(odd),
html[data-d="min"] .sup__list li:nth-child(even){ padding:20px; border-bottom:0; }

/* 4枚並びだとカード幅が214pxになり「今の暮らしに合わせたい」が折り返していた。
   余白とアイコンを詰めて、4枚とも2行で収まるようにする */
html[data-d="min"] .sup__list{ gap:14px; }
html[data-d="min"] .sup__list li,
html[data-d="min"] .sup__list li:nth-child(odd),
html[data-d="min"] .sup__list li:nth-child(even){ padding:18px 16px; gap:10px; }
html[data-d="min"] .sup__ico{ width:24px; height:24px; }
html[data-d="min"] .sup__list li span{ font-size:13.5px; line-height:1.8; }

/* まだ9px足りずに折り返していた。字間を詰めて余白をもう一段削り、4枚とも2行に収める */
html[data-d="min"] .sup__list li,
html[data-d="min"] .sup__list li:nth-child(odd),
html[data-d="min"] .sup__list li:nth-child(even){ padding:18px 14px; }
html[data-d="min"] .sup__ico{ width:22px; height:22px; }
html[data-d="min"] .sup__list li span{ letter-spacing:normal; }

/* カードの上に出ていた横一本の線を消す（旧・罫線リストの名残） */
html[data-d="min"] .sup__list{ border-top:0; }

/* ボタン2つの高さが違っていた。原因は2つ
   ①アイコンを「幅」で揃えたので、縦長の電話アイコンだけ背が高かった（→高さで揃える）
   ②<button> は line-height:normal、<a> は継承値と、行の高さが食い違っていた（→明示する） */
html[data-d="min"] .btn__ico{ height:18px; width:auto; }
html[data-d="min"] .con__acts .btn{ line-height:1.25; }

/* ヒーローの下の余白86pxは、写真に重ねていた4枚のカードのための場所だった。
   カードを外したので不要。消すとメッセージの上が他の節と同じ102pxになる */
html[data-d="min"] .hero{ margin-bottom:0; }

/* ヘッダーのお問い合わせ：施工事例のボタンと同じ角丸に（2026-08-15 オーナー指示）
   リンク先はお悩み〜お問い合わせのひと続きの節（#support） */
html[data-d="min"] .hdr__cta{ border-radius:6px; }

/* ---- 見出しの英字：縦の細線＋明朝（2026-08-15 オーナー指示・案L3）
   比較用ページ＝ _labels.html（納品前に消す）
   角ゴシックのままだと見出しの一部に見えなかったので、下の見出しと同じ明朝にそろえ、
   縦線で視線を日本語の見出しへ落とす */
html[data-d="min"] .lbl{ font-family:var(--f-min); font-size:13.5px; font-weight:600;
  letter-spacing:.34em; text-indent:.34em; color:var(--y); margin:0 0 18px; }
html[data-d="min"] .lbl::before{ content:""; display:block; width:1px; height:26px;
  background:var(--y); opacity:.55; margin:0 auto 16px; }
/* MESSAGE だけは左寄せの節がないので、中央ぞろえのままで問題なし */

/* フォームの中の CONTACT だけは左寄せなので、縦線も左端に合わせる
   （中央のままだと線だけ離れて浮いて見えた） */
html[data-d="min"] .fm .lbl::before{ margin-left:0; height:20px; margin-bottom:12px; }

/* ---- 小見出しの線を、節見出し（L3）と同じ細い縦線にそろえる（2026-08-15 オーナー指示）
   これまで：見出しの「下」に 太さ2px の横棒
   これから：見出しの「上」に 太さ1px・不透明度55% の縦線（節の英字と同じ形） */

/* STRENGTHS：縦線 → 01 → 見出し（節見出しの「縦線 → 英字 → 見出し」と同じ並び）*/
html[data-d="min"] .str__tx b::after{ content:none; }
html[data-d="min"] .str__no{ position:relative; margin-bottom:16px; }
html[data-d="min"] .str__no::before{ content:""; display:block; width:1px; height:24px;
  background:var(--y); opacity:.55; margin:0 0 14px; }

/* SERVICE：アイコン → 縦線 → 見出し（カードは中央ぞろえなので線も中央）*/
html[data-d="min"] .svc__grid b::after{ content:none; }
html[data-d="min"] .svc__grid b::before{ content:""; display:block; width:1px; height:22px;
  background:var(--y); opacity:.55; margin:0 auto 14px; }
html[data-d="min"] .svc__grid b{ margin-bottom:14px; }

/* STRENGTHS の番号：縦線の「上下」ではなく「左右」に並べ、数字を線の高さに合わせる
   （2026-08-15 オーナー指示） */
html[data-d="min"] .str__no{ display:flex; align-items:center; gap:12px;
  font:600 24px/1 ui-monospace,monospace; letter-spacing:.1em; color:var(--y);
  margin:0 0 18px; }
html[data-d="min"] .str__no::before{ flex:0 0 auto; width:1px; height:24px; margin:0; }

/* SERVICE のカードは元に戻す（2026-08-15 オーナー指示：縦棒は不要）
   縦線をやめ、見出し下の横線を復活させる。触るのは STRENGTHS だけ */
html[data-d="min"] .svc__grid b::before{ content:none; }
html[data-d="min"] .svc__grid b::after{ content:""; display:block; width:34px; height:2px;
  background:var(--y); margin:14px auto 0; }

/* SERVICE の見出し下の横線も消す（2026-08-15 オーナー指示）
   線が持っていた高さのぶん、見出しと本文の間隔を足しておく */
html[data-d="min"] .svc__grid b::after{ content:none; }
html[data-d="min"] .svc__grid b{ margin-bottom:20px; }

/* 番号が主張しすぎたので、細い明朝に（2026-08-15 オーナー指示）
   等幅ゴシックの太字600 → 明朝の標準400。縦線も少し短く・薄くして添え物にする */
html[data-d="min"] .str__no{ font:400 27px/1 var(--f-min); letter-spacing:.12em; }
html[data-d="min"] .str__no::before{ height:22px; opacity:.45; }

/* 縦線をやめ、数字だけにする（2026-08-15 オーナー指示）*/
html[data-d="min"] .str__no::before{ content:none; }
html[data-d="min"] .str__no{ font-size:22px; margin-bottom:14px; }

/* 番号を斜体に（2026-08-15 オーナー指示）
   ⚠️ 明朝には本物の斜体が無く、ブラウザが機械的に傾けるだけで字が崩れる。
   本物の斜体を持つ欧文セリフ（Georgia）に変える */
html[data-d="min"] .str__no{ font:italic 400 24px/1 Georgia,"Times New Roman",serif;
  letter-spacing:.08em; }

/* もう少し細く（2026-08-15 オーナー指示）
   Georgia は斜体でも線が太め。線の細い順に並べて、あるものを使わせる
   Didot（Mac）→ Baskerville（Mac）→ Times New Roman（Win）→ Georgia */
html[data-d="min"] .str__no{
  font-family:Didot,"Bodoni 72",Baskerville,"Times New Roman",Georgia,serif;
  font-size:26px; }

/* ==========================================================================
   本文を16pxに（2026-08-15 オーナー指示）
   ずっと13.5〜15pxで、自分たちの「本文16px以上」の基準を割っていた。
   文字を大きくすると1行が短くなるので、STRENGTHS 以外の節は左右の余白を削って
   本文幅 1000px → 1180px に広げ、行の長さを保つ
   ========================================================================== */

/* --- 幅を広げる（STRENGTHS の見出しだけ 1000px のまま）--- */
html[data-d="min"] .svc > .wrap,
html[data-d="min"] .works > .wrap,
html[data-d="min"] .sup > .wrap,
html[data-d="min"] .con > .wrap,
html[data-d="min"] .cmp__in{ max-width:1180px; }

/* --- 16pxにするもの --- */
html[data-d="min"] .msg__tx p{ font-size:16px; line-height:2.05; }   /* MESSAGE本文 */
html[data-d="min"] .str__tx p{ font-size:16px; line-height:2.05; }   /* 強みの本文 */
html[data-d="min"] .cmp th,
html[data-d="min"] .cmp td{ font-size:16px; }                        /* 会社概要の表 */
html[data-d="min"] .svc__grid p{ font-size:16px; line-height:1.95; } /* サービスカードの本文 */
html[data-d="min"] .mq__set span{ font-size:16px; line-height:1.85; }/* 施工事例カードの説明 */
html[data-d="min"] .works__more .btn,
html[data-d="min"] .con__acts .btn,
html[data-d="min"] .fm__f .btn{ font-size:16px; }                    /* ボタン */

/* ==========================================================================
   文字サイズの整理（2026-08-15 オーナー指示）
   ヘッダーのナビとボタン＝16px／それ以外の小さい文字は全部14pxにそろえる
   （これまで 11.5・12・12.5・13・13.5・14.5・15px が混在していた）
   ========================================================================== */
html[data-d="min"] .nav a{ font-size:16px; }
html[data-d="min"] .hdr__cta{ font-size:16px; }

html[data-d="min"] .brand__c,
html[data-d="min"] .brand__tag,
html[data-d="min"] .notice,
html[data-d="min"] .lbl,
html[data-d="min"] .svc__tag,
html[data-d="min"] .sup__list li span,
html[data-d="min"] .sup__note,
html[data-d="min"] .con__lead,
html[data-d="min"] .con__hours,
html[data-d="min"] .btn__arw,
html[data-d="min"] .ftr__n,
html[data-d="min"] .ftr__a,
html[data-d="min"] .ftr__c{ font-size:14px; }

/* カードの見出しを17pxでそろえる（2026-08-15 オーナー指示）
   施工事例だけ16.5pxで、サービス（17px）と半端に食い違っていた */
html[data-d="min"] .mq__set b,
html[data-d="min"] .svc__grid b{ font-size:17px; }

/* 「グリーンライフアドバイザー」を、社名の文字の下の線（ベースライン）にそろえる
   （2026-08-15 オーナー指示。それまでは社名のかたまりの上下中央にいて11px浮いていた）*/
/* flex-end だと「行の下端」（＝ボタンの高さ）にそろってしまい14px行き過ぎた。
   中央ぞろえのまま、実測した差の11pxだけ下げる */
html[data-d="min"] .brand__tag{ position:relative; top:11px; }

/* 帯の左右の白いぼかしを外す（2026-08-15 オーナー指示）
   端をなじませるために mask-image を掛けていたが、不要 */
html[data-d="min"] .mq{ -webkit-mask-image:none; mask-image:none; }

/* お悩みカード：文字を16pxに、右の余白を広げる（2026-08-15 オーナー指示）
   左は「余白14＋アイコン22＋間隔10＝46px」あるのに右は14pxしかなく、
   文字が右端に寄って見えていた */
html[data-d="min"] .sup__list li span{ font-size:16px; line-height:1.7; }
html[data-d="min"] .sup__list li,
html[data-d="min"] .sup__list li:nth-child(odd),
html[data-d="min"] .sup__list li:nth-child(even){ padding:18px 22px 18px 14px; }

/* チェックのアイコンを大きく（2026-08-15 オーナー指示）*/
html[data-d="min"] .sup__ico{ width:30px; height:30px; }

/* お悩みの下の注記：幅を 56em で止めていたせいで「構いませ／ん。」と割れていた。
   節の幅いっぱいまで使わせる（2026-08-15 オーナー指示）*/
html[data-d="min"] .sup__note{ max-width:none; }

/* 上の断り書きは常に左寄せ（2026-08-15 オーナー指示）
   左端はヘッダーの社名と同じ位置にそろえる */
/* 背景は画面の端から端まで。文字だけヘッダーの社名と同じ位置から始める
   （max-width を掛けると背景まで途中で切れて、両脇に色の違う帯が出る）*/
html[data-d="min"] .notice{ text-align:left; max-width:none; margin-inline:0;
  padding-inline:max(var(--pad), calc((100% - 1280px) / 2 + var(--pad))); }

/* 施工事例カードの説明文だけ14pxに戻す（2026-08-15 オーナー指示。見出しは17pxのまま）*/
html[data-d="min"] .mq__set span{ font-size:14px; line-height:1.9; }

/* 断り書きの背景をベージュに（2026-08-15 オーナー指示）
   白のままだとヘッダーと地続きに見えて、見本である断りが目に入らなかった */
/* サイト内で使っている生成り（--tint #F7F6F3）にそろえる。独自の色は作らない */
html[data-d="min"] .notice{ background:var(--tint); color:var(--body); }

/* スマホ：ハンバーガーを常に左端に置く（2026-08-15 オーナー指示）
   これまでは社名のすぐ右に置いていたので、社名の長さで位置が動いていた */
@media (max-width:768px){
  html[data-d="min"] .burger{ order:-1; margin-right:6px; }
}

/* スマホ：開いたメニューを「文字幅」にして、左（ハンバーガーの真下）に出す
   （2026-08-15 オーナー指示。これまでは画面いっぱいの帯だった）*/
@media (max-width:768px){
  html[data-d="min"] .nav{ left:var(--pad); right:auto; width:max-content;
    top:calc(var(--hdr-h) + 6px); align-items:flex-start;
    padding:6px 20px 8px; border:1px solid var(--line); border-radius:10px;
    box-shadow:0 12px 30px -18px rgba(17,17,17,.4); }
  html[data-d="min"] .nav a{ padding:12px 0; }
  html[data-d="min"] .nav a:last-child{ border-bottom:0; }
}

/* MESSAGE：縦並び（見出し → 写真 → 本文）は【スマホだけ】。PCは横並びのまま
   （2026-08-15 オーナー訂正：PC版は元に戻す）*/
@media (max-width:900px){
  html[data-d="min"] .msg__in{ display:flex; flex-direction:column; }
  html[data-d="min"] .msg__ph{ order:-1; margin:0 0 clamp(24px,4vw,36px); }
  html[data-d="min"] .msg__ph img{ aspect-ratio:16/9; }
}

/* 訂正：ハンバーガーは右端（2026-08-15 オーナー訂正）
   開くメニューも右端（ボタンの真下）に。文字幅に合わせるのと、
   中の文字が左ぞろえなのはそのまま */
@media (max-width:768px){
  html[data-d="min"] .burger{ order:0; margin-left:auto; margin-right:0; }
  html[data-d="min"] .nav{ left:auto; right:var(--pad); }
}

/* スマホのメニューにだけ「お悩み」「お問い合わせ」を足す（2026-08-15 オーナー指示）
   PCのヘッダーは6本並ぶと窮屈なので出さない */
html[data-d="min"] .nav__sp{ display:none; }
@media (max-width:768px){
  html[data-d="min"] .nav__sp{ display:block; }
}

/* ==========================================================================
   見出しが iPhone で太字にならない件（2026-08-15 オーナー指摘）
   原因：iOS のヒラギノ明朝は細い方（W3）しか持っておらず、font-weight:600 だと
   「太い字が無い」→ ブラウザも合成しない（合成が効くのは700から）。
   結果、iPhone だけ見出しが本文と同じ太さで並び、のっぺり見えていた。
   対策：見出しの太さを 600 → 700 にする。
   ⚠️ Mac は 600 も 700 も同じ W6 を選ぶので、PC版の見え方は変わらない
   ========================================================================== */
html[data-d="min"] .hero h1,
html[data-d="min"] .sec__h,
html[data-d="min"] .con h2,
html[data-d="min"] .str__tx b,
html[data-d="min"] .svc__grid b,
html[data-d="min"] .mq__set b,
html[data-d="min"] .brand__n,
html[data-d="min"] .con__tel,
html[data-d="min"] .lbl,
html[data-d="min"] .cmp th,
html[data-d="min"] .ftr__n{ font-weight:700; }

/* スマホ：サービスカードの小見出しを一段大きく（2026-08-15 オーナー指示）
   17px だと本文16pxとの差が1pxしかなく、見出しに見えなかった。
   強みの小見出し（19px）と同じ高さにそろえる。※PC版は17pxのまま */
@media (max-width:768px){
  html[data-d="min"] .svc__grid b{ font-size:19px; }
}

/* 会社概要の表：項目名の列がセクションの地色と同じ #F7F6F3 で、
   背景に溶けて「表に穴が空いている」ように見えていた（2026-08-15 オーナー指摘）。
   翡翠をごく薄く混ぜた色にして、白い値の列とも地色とも見分けがつくようにする */
html[data-d="min"] .cmp th{ background:#E7EFEB; }

/* スマホ：指で押す場所を44px以上にする（BEFORE-BUILD D-4）
   会社概要の電話・メールのリンクが高さ16pxしかなく、押しにくかった */
@media (max-width:768px){
  html[data-d="min"] .cmp td a{ display:inline-block; padding-block:14px; }
  html[data-d="min"] .con__tel{ padding-block:8px; }
}

/* ==========================================================================
   スマホだけの調整（2026-08-16 オーナー指示）。PC版には影響させない
   ========================================================================== */

/* 1. スマホでだけ効く改行。PCでは無いものとして扱う */
html[data-d="min"] .br-sp{ display:none; }

@media (max-width:768px){
  html[data-d="min"] .br-sp{ display:inline; }

  /* 2. 強みの3行を「左・右・左」に。スマホで横並びにすると写真も文字も
     狭くなりすぎるので、縦積みのまま【写真がどちらの端に接するか】を
     交互に変えてリズムを出す */
  html[data-d="min"] .str__row .str__ph{ margin-right:44px; margin-left:0; }
  html[data-d="min"] .str__row--flip .str__ph{ margin-right:0; margin-left:44px; }
  html[data-d="min"] .str__ph img{ border-radius:0 10px 10px 0; }
  html[data-d="min"] .str__row--flip .str__ph img{ border-radius:10px 0 0 10px; }
  /* 文字も写真と同じ側に寄せて、左右の振れをそろえる */
  html[data-d="min"] .str__row--flip .str__tx{ padding-inline:44px var(--pad); }
}

/* 01・03（写真が左端）の文字の右端を、写真の右端（画面幅−44px）にそろえる
   （2026-08-16 オーナー指示）*/
@media (max-width:768px){
  html[data-d="min"] .str__row .str__tx{ padding-inline:var(--pad) 44px; }
  html[data-d="min"] .str__row--flip .str__tx{ padding-inline:44px var(--pad); }
}

/* スマホ：強みの各行のあいだを広げる（2026-08-16 オーナー指示）
   30px しかなく、01の本文と02の写真がくっついて見えていた */
@media (max-width:768px){
  html[data-d="min"] .str__row{ margin-bottom:60px; }
  html[data-d="min"] .str__row:last-child{ margin-bottom:0; }
}

/* スマホ：お悩みカードの右側が大きく余っていた（2026-08-16 オーナー指摘）
   原因は PC 用に入れた強制改行。1行目が7文字で終わり、右半分が空いていた。
   スマホでは改行を無効にして、カード幅いっぱいまで文字を流す */
@media (max-width:768px){
  html[data-d="min"] .sup__list li span br{ display:none; }
}

/* 中央ぞろえは書き出し位置がカードごとにずれて不揃いに見えたのでやめ、
   左ぞろえに戻す（2026-08-16 オーナー指示）。
   右の余りは残るが、書き出しがそろっていることを優先する */
@media (max-width:768px){
  html[data-d="min"] .sup__list li{ justify-content:flex-start; }
}

/* スマホ：お問い合わせの2つのボタンをそろえる（2026-08-16 オーナー指示）
   これまでは文字の長さぶんの幅で中央ぞろえだったので、
   幅も・書き出しも・矢印の位置も2つでバラバラだった */
@media (max-width:768px){
  html[data-d="min"] .con__acts{ align-items:stretch; }
  html[data-d="min"] .con__acts .btn{ width:100%; justify-content:flex-start; }
  html[data-d="min"] .con__acts .btn .btn__arw{ margin-left:auto; }  /* 矢印は右端に固定 */
}

/* アイコンの絵の幅が違う（メール24px・電話17px）ぶん、文字の書き出しがずれていた。
   高さは18pxのまま、24pxの枠に収めて中央に置く（object-fit:contain）ことで、
   絵の大きさは変えずに文字の開始位置だけそろえる */
@media (max-width:768px){
  html[data-d="min"] .con__acts .btn__ico{ width:24px; height:18px; object-fit:contain; }
}

/* スマホ：ボタンを幅いっぱいにせず、左右に同じだけ余白を残す（2026-08-16 オーナー指示）*/
@media (max-width:768px){
  html[data-d="min"] .con__acts .btn{ max-width:250px; margin-inline:auto; }
}

/* スマホ：電話番号と受付時間の左端を、ボタンの左端にそろえる（2026-08-16 オーナー指示）
   ボタンを内側に寄せたぶん、下の電話まわりだけ外側に取り残されていた */
@media (max-width:768px){
  html[data-d="min"] .con__telbox{ max-width:250px; margin-inline:auto; }
  html[data-d="min"] .con__hours{ margin-left:0; }
}

/* フッター：コピーライトの上の区切り線を消す（2026-08-16 オーナー指示・PC/スマホ共通）*/
html[data-d="min"] .ftr__c{ border-top:0; padding-top:0; margin-top:18px; }

/* ---- 会社概要（2026-08-16 オーナー指示・PC/スマホ共通）---- */
/* 1. 項目名の列を白に。翡翠を薄く敷いたら「くすんだ色」が急に入って
   全体のバランスが崩れた。白にして、列の区別は罫線と太字だけで付ける */
html[data-d="min"] .cmp th{ background:var(--paper); }

/* 2. 地図の中の色と地色が同化していたので、細い黒の枠で囲う */
html[data-d="min"] .cmp__map iframe{ border:1px solid var(--ink); }

/* ---- 会社概要のやり直し（2026-08-16 オーナー指示・PC/スマホ共通）
   翡翠の薄色＝浮く／全部白＝構造が消えて見づらい。
   そこで【色に頼らず罫線で読ませる】方向に変える：
   ・項目名の列は色みのほぼ無い薄いグレー（彩度3%）
   ・項目名と値のあいだに縦の罫線を入れる
   ・罫線を一段濃くして、表そのものの輪郭を出す
   ・地図の枠も表と同じ色・同じ角（角丸なし）にそろえる ---- */
html[data-d="min"] .cmp table{ border:1px solid #DCD9D2; }
html[data-d="min"] .cmp th{ background:#F4F3F0; border-right:1px solid #DCD9D2; }
html[data-d="min"] .cmp tr + tr th,
html[data-d="min"] .cmp tr + tr td{ border-top:1px solid #DCD9D2; }
html[data-d="min"] .cmp__map iframe{ border:1px solid #DCD9D2; border-radius:0; }

/* ==========================================================================
   ロゴマーク（2026-08-16 採用：3案のうち02／円に「名和」の家紋型）
   元画像は _source-images/logo/logo-02-original.png（1254px・透過済み）
   余白をトリムして高さ240pxで書き出したものを、表示サイズの3倍として使う
   ========================================================================== */
html[data-d="min"] .brand{ display:flex; align-items:center; gap:12px; }
html[data-d="min"] .brand__logo{ height:42px; width:auto; display:block; flex:0 0 auto; }
html[data-d="min"] .brand__tx{ display:block; }

html[data-d="min"] .ftr__logo{ height:52px; width:auto; display:block; margin:0 0 14px; }

@media (max-width:768px){
  html[data-d="min"] .brand{ gap:10px; }
  html[data-d="min"] .brand__logo{ height:38px; }
  html[data-d="min"] .ftr__logo{ height:46px; }
}

/* ロゴまわりの調整（2026-08-16 オーナー指示）
   ヘッダー：マークと社名が離れて見えたので間隔を詰める
   フッター：マークを小さくして社名の左へ（上下ではなく横並び） */
html[data-d="min"] .brand{ gap:7px; }
html[data-d="min"] .ftr__brand{ display:flex; align-items:center; gap:9px; margin:0 0 12px; }
html[data-d="min"] .ftr__logo{ height:30px; width:auto; margin:0; flex:0 0 auto; }
html[data-d="min"] .ftr__n{ margin:0; }
@media (max-width:768px){
  html[data-d="min"] .brand{ gap:6px; }
  html[data-d="min"] .ftr__logo{ height:28px; }
}

/* ヘッダー：マークの高さを社名の2行ぶんとぴったり合わせる（2026-08-16 オーナー指摘）
   これまでは42pxで、文字のかたまり（46px）より4px低く、上下が2pxずつずれていた */
html[data-d="min"] .brand{ align-items:center; }
html[data-d="min"] .brand__logo{ height:46px; }
@media (max-width:768px){
  html[data-d="min"] .brand__logo{ height:42px; }
}

/* ヘッダー：マークの「見た目の下端」を社名の下端にそろえる（2026-08-16 オーナー指摘）
   箱の高さを合わせただけでは、文字の箱に含まれる余白のぶんマークが上に浮いて見えた。
   下ぞろえにして、丸い形が線の上に乗って見えるよう1px下に出す（円のオーバーシュート） */
html[data-d="min"] .brand{ align-items:flex-end; }
html[data-d="min"] .brand__logo{ height:44px; position:relative; top:1px; }
@media (max-width:768px){
  html[data-d="min"] .brand__logo{ height:40px; }
}