/* RE-INNOVATIONS 全ページ共通の上書き（2026-09-14 クライアント指示 / 静的サイト v48 相当）
   各ページCSSの後に読み込まれ、:root トークン・本文・数字書体・ヘッダー電話・スマホ電話バーを統一する。 */

/* ═══ 1. カラートークン ═══ */
:root{
  --gold:#41708f;          /* アクセント色 #4a7a9b → #41708f */
  --text-sub:#3f525e;      /* 本文の文字色 #5a6e7a → #3f525e */
  --text-mute:#5e6f79;     /* 補助テキスト色 #96a8b2 → #5e6f79 */
  --warn:#b85735;          /* 警告色 #c96a4a → #b85735 */
  --num:'Shippori Mincho','Noto Serif JP',serif; /* 数字の書体（見出しと同一の明朝） */
}

/* ═══ 2. 本文のウェイト 300 → 400 ═══ */
body{font-weight:400}

/* ═══ 3. 数字の書体：Cormorant Garamond → Shippori Mincho（等幅数字） ═══ */
.sol-num,.dot-num,.mlpe-card-num,.mlpe-icon-num,.merit-tab-num,.merit-panel-num,
.flow-num,.flow-num-wrap,.case-num,.case-num-unit,.cs-case-num,.cs-stat-num,.ch-num,
.list-count,.indust-point-num,.strength-point-num,.proposal-num,.range-item-num,
.repower-pillar-num,.show-num,.vnode-num,.pm-stat-val,.pm-stat-unit,.sim-chart-bar-val,
.total-val,.total-val .big,.total-val .u,.why-num,.ph-price-value,
.news-date,.article-date,
.ch-tel,.date,.ft-contact,.ft-contact a,.ph-stat .n,.ph-stat .u,
.nonfit-meta-tag,.pickup-date,.sim-chart-diff,.sim-table tbody td:last-child,
.hc-num,.cta-tel a,.mobile-tel .mt-num{
  font-family:var(--num) !important;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  font-style:normal}
/* 明朝は同サイズだと細く見えるため、大きい数字は 500、小さい数字は 600 */
.sol-num,.mlpe-card-num,.flow-num,.case-num,.case-num-unit,.cs-case-num,.cs-stat-num,
.indust-point-num,.range-item-num,.repower-pillar-num,.show-num,.vnode-num,
.pm-stat-val,.pm-stat-unit,.total-val,.total-val .big,.total-val .u,.why-num,
.ph-price-value,.hc-num,.cta-tel a,.ph-stat .n,.ch-tel,.mobile-tel .mt-num{
  font-weight:500;letter-spacing:.02em}
.dot-num,.ch-num,.list-count,.strength-point-num,.proposal-num,.merit-tab-num,
.merit-panel-num,.mlpe-icon-num,.news-date,.article-date,.sim-chart-bar-val,
.date,.pickup-date,.nonfit-meta-tag,.sim-chart-diff,.sim-table tbody td:last-child,
.ft-contact,.ft-contact a{
  font-weight:600;letter-spacing:.03em}

/* ═══ 4. ヘッダー：余白 左80px / 右40px ＋ 右上に電話番号・受付時間 ═══ */
@media(min-width:769px){
  .header-inner{padding:0 40px 0 80px;gap:26px}
}
.header-inner>.logo{margin-right:auto}
.hcontact{display:flex;align-items:center;flex:none}
.hc-l{display:flex;flex-direction:column;justify-content:center;text-align:right;text-decoration:none;line-height:1.3}
.hc-num{font-size:21px;color:var(--navy);white-space:nowrap;transition:color .5s}
.hc-hrs{font-family:var(--jpn);font-size:9px;letter-spacing:.02em;color:var(--text-mute);white-space:nowrap;transition:color .5s}
@media(max-width:1240px){.hc-hrs{display:none}.hc-num{font-size:19px}}
@media(max-width:1080px){.hcontact{display:none}}
/* トップのみ：ヒーロー上（透明ヘッダー）では白文字 */
body.home header:not(.scrolled):not(.on-light) .hc-num{color:#fff}
body.home header:not(.scrolled):not(.on-light) .hc-hrs{color:rgba(255,255,255,.66)}

/* ═══ 5. スマホ：画面下部の電話番号 固定バー ═══ */
.mobile-tel{display:none}
@media(max-width:1080px){
  .mobile-tel{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1200;
    align-items:center;justify-content:center;gap:12px;
    height:60px;padding:0 20px;text-decoration:none;
    background:var(--navy);color:#fff;
    box-shadow:0 -2px 18px rgba(8,24,38,.22)}
  .mobile-tel svg{width:19px;height:19px;stroke:var(--blue-light);fill:none;stroke-width:1.7;
    stroke-linecap:round;stroke-linejoin:round;flex:none}
  .mobile-tel .mt-num{font-size:21px;line-height:1.1;color:#fff}
  .mobile-tel .mt-sub{font-family:var(--jpn);font-size:10px;color:rgba(255,255,255,.62);letter-spacing:.04em;line-height:1.2}
  .mobile-tel .mt-txt{display:flex;flex-direction:column;gap:2px}
  body{padding-bottom:60px}
}

/* 専用アイコン（v2.0.0・inc/icons.php）：線の基本。枠・色・大きさは motion.css の「専用アイコン」 */
:is(.mlpe-icon,.mlpe-icon-wrap,.repower-pillar-icon,.ch-icon,.issue-icon,.issues-conclusion-icon,.strength-point-icon,.mobile-tel) .rei-ic{
  display:block;fill:none;stroke:currentColor;stroke-width:var(--ic-sw,1.4);stroke-linecap:square;stroke-linejoin:miter;overflow:visible}
.rei-ic .a{stroke:var(--ic-a,#2d6189)}
.rei-ic .f{fill:var(--ic-a,#2d6189);stroke:none}
.rei-ic .w{fill:var(--ic-bg,#fff)}
.rei-ic .s{stroke-opacity:.5}
.rei-ic .d{stroke-dasharray:2 1.6}

/* ═══ 取り扱いブランド（共通：製品・商材コンサル）v2.3.0 作り直し／v2.4.0 で共通化 ═══
   1社ずつ「ロゴの台」と「肩書・説明」「公式サイトへ」の3段に
   ・ロゴの台：淡い面にパネルの格子（54px）。左上に取り扱い製品の種類。ロゴは同じ高さの台に収め、肩書の高さをそろえる
   ・肩書：紺の細い枠の札（2026-08-28 クライアント指示の紺を継承）。説明は左寄せ
   ・カーソルを乗せると、台の格子が少し濃くなり、下の線が伸び、矢印の枠が紺に（動かさない）
   ・PCは2列×2段、980px以下は1列 */
.brands-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:48px;background:var(--border);border:1px solid var(--border)}
.brand-card{position:relative;display:flex;flex-direction:column;min-width:0;background:#fff;color:var(--text-main);text-decoration:none;transition:background-color .4s var(--ease)}
.brand-stage{position:relative;display:flex;align-items:center;justify-content:center;height:200px;padding:36px 40px 28px;overflow:hidden;
  background:linear-gradient(180deg,#f6fafc,#edf4f8);border-bottom:1px solid var(--border)}
.brand-stage::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.7;transition:opacity .5s ease;
  background:linear-gradient(rgba(74,122,155,.09) 1px,transparent 1px) 50% 100%/54px 54px,linear-gradient(90deg,rgba(74,122,155,.09) 1px,transparent 1px) 50% 0/54px 54px;
  -webkit-mask:radial-gradient(70% 90% at 50% 100%,#000,transparent 80%);mask:radial-gradient(70% 90% at 50% 100%,#000,transparent 80%)}
.brand-cat{position:absolute;left:24px;top:22px;font-family:var(--eng);font-size:11px;font-weight:500;letter-spacing:.2em;line-height:1;text-transform:uppercase;color:var(--text-mute)}
.brand-logo{position:relative;display:block;width:var(--w,240px);max-width:100%;height:auto}   /* ロゴごとに見た目の大きさをそろえた幅（--w）。画像の余白の違いを吸収 */
.brand-body{display:flex;flex-direction:column;align-items:flex-start;gap:18px;flex:1;padding:32px 40px 34px}
.brand-role{display:inline-block;padding:7px 14px 7px 16px;border:1px solid rgba(19,45,64,.35);font-family:var(--mincho);font-size:14.5px;font-weight:500;letter-spacing:.12em;line-height:1.5;color:var(--navy);background:#fff}
.brand-desc{display:block;font-size:13.5px;line-height:2;color:var(--text-sub)}
.brand-link{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px 18px 40px;border-top:1px solid var(--border);
  font-size:13px;letter-spacing:.12em;color:var(--blue-main)}
.brand-link::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--blue-main);transform:scaleX(0);transform-origin:left center;transition:transform .6s var(--ease)}
.brand-arr{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(45,97,137,.35);font-family:var(--eng);font-style:normal;font-size:15px;line-height:1;color:var(--blue-main);
  transition:background-color .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease)}
@media (hover:hover){
  a.brand-card:hover{background:#fbfdfe}
  a.brand-card:hover .brand-stage::before{opacity:1}
  a.brand-card:hover .brand-link::after{transform:scaleX(1)}
  a.brand-card:hover .brand-arr{background:var(--navy);border-color:var(--navy);color:#fff}
}
a.brand-card:focus-visible{outline:2px solid var(--blue-main);outline-offset:-2px}
@media(max-width:980px){
  .brands-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:600px){
  .brand-stage{height:150px;padding:30px 24px 20px}
  .brand-logo{width:calc(var(--w,240px) * .78)}
  .brand-cat{left:18px;top:17px;font-size:10px;letter-spacing:.16em}
  .brand-body{padding:24px 22px 26px;gap:14px}
  .brand-role{font-size:13.5px;padding:6px 12px 6px 14px}
  .brand-desc{font-size:13px;line-height:1.95}
  .brand-desc br{display:none}
  .brand-link{padding:14px 18px 14px 22px}
}