/* ===== 会社概要ページ固有 ===== */

.sec-intro{font-size:14px; line-height:2.1; color:#333; margin-bottom:26px}

/* ---- 拠点一覧 ---- */
.baselist{list-style:none; border-top:1px solid var(--rule)}
.baselist li{display:grid; grid-template-columns:200px 1fr; gap:0 clamp(20px,3vw,44px); padding:24px 0; border-bottom:1px solid var(--rule)}
.b-name{display:flex; align-items:baseline; gap:12px}
.b-name h3{font-size:16.5px; letter-spacing:.04em}
.b-area{font-family:var(--en); font-size:11px; letter-spacing:.16em; color:var(--gray)}
.b-addr{font-size:13.5px; line-height:1.95}
.b-tel{font-size:12.5px; color:var(--gray); line-height:1.9; margin-top:3px}
.b-map{display:inline-flex; align-items:center; gap:9px; font-size:12px; letter-spacing:.06em; margin-top:10px; color:var(--gray)}
.b-map i{width:22px; height:1px; background:currentColor; transition:width .34s}
.b-map:hover{color:var(--ink)}
.b-map:hover i{width:34px}

/* ---- グループ企業 ---- */
.grouplist{list-style:none; display:grid; gap:clamp(14px,2vw,20px)}
/* カード全体を押せるようにする。ホバーで枠線が濃くなる＝押せる合図を全面で出しているのに、
   実際の当たり判定が下部のテキストだけ、という不一致を解消する。
   トップの系譜図（.ln-card）は同じ内容が全面リンクになっており、そちらに揃える形。 */
.grouplist li{border:1px solid var(--rule); padding:clamp(24px,3vw,34px) clamp(22px,2.6vw,32px); transition:border-color .34s; position:relative}
.grouplist .go::after{content:""; position:absolute; inset:0}
.grouplist li:hover{border-color:var(--ink)}
.g-role{font-family:var(--en); font-size:11px; letter-spacing:.2em; color:var(--gray)}
.grouplist h3{font-size:clamp(17px,2vw,21px); margin-top:9px; letter-spacing:.04em}
.g-txt{font-size:13.5px; line-height:2.0; color:#333; margin-top:12px}
.grouplist .go{margin-top:18px}
/* 自社だけが黄色 */
.grouplist li.is-self{background:var(--lux); border-color:var(--lux)}
.grouplist li.is-self:hover{border-color:var(--ink)}
.grouplist li.is-self .g-role{color:#5C5320}
.grouplist li.is-self .g-txt{color:#2A2712}

/* ---- 地図 ----
   座標だけの埋め込みなので事業者名は表示されない。
   社名は .map-card として当サイト側で重ねる。 */
/* width を明示しないと、min-height から aspect-ratio で幅が逆算され、
   狭い画面で親より広くなって横スクロールが出る */
.mapbox{position:relative; overflow:hidden; aspect-ratio:16/7; min-height:260px; width:100%; max-width:100%;
  background:var(--wash); border:1px solid var(--rule)}
.mapbox iframe{position:absolute; inset:0; width:100%; height:100%; border:0; display:block}
.map-card{
  position:absolute; left:clamp(12px,2vw,20px); top:clamp(12px,2vw,20px);
  display:flex; align-items:center; gap:12px;
  background:var(--paper); border:1px solid var(--rule);
  padding:12px 18px 13px 14px; max-width:calc(100% - 40px);
}
.map-card img{flex:none}
.mc-name{font-family:var(--sans); font-weight:700; font-size:13.5px; letter-spacing:.03em; line-height:1.5}
.mc-addr{font-size:11.5px; color:var(--gray); line-height:1.6; margin-top:2px}
.map-foot{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-top:22px}

@media (max-width:900px){
  .baselist li{grid-template-columns:1fr; gap:8px}
  /* aspect-ratio を残すと min-height から幅が逆算され、その幅がグリッド列の
     最小幅として効いてしまう。高さを直接指定して比率をやめる */
  .mapbox{aspect-ratio:auto; height:clamp(220px,58vw,300px); min-height:0}
}