@charset "UTF-8";
/* ============================================================
   Magconn Theme — base stylesheet
   ブランドカラー定義（Magconn_ブランドカラー定義.pdf）準拠
   ============================================================ */

:root{
  --mgc-royal:#2563EB;      /* CTA・リンク・主要導線 */
  --mgc-french:#1E3A8A;     /* 見出し・濃色背景・フッター */
  --mgc-amber:#FBBF24;      /* 実績・ラベル・カード枠 */
  --mgc-orange:#FB923C;     /* CTA補助・矢印・ホバー */
  --mgc-black:#1F2937;      /* ロゴ・本文 */
  --mgc-red:#E60012;        /* 必須・注意（元デザイン実測） */
  --mgc-muted:#BEBFC5;      /* プレースホルダ文字（元デザイン実測） */

  --mgc-ink:#1F2937;
  --mgc-ink-soft:#1F2937;   /* 元デザインに #4B5563 は無く、本文は全て #1F2937 */
  --mgc-line:#D7DEEA;
  --mgc-bg:#FFFFFF;
  --mgc-bg-soft:#EDF2FB;    /* ページヘッダー帯・淡背景（元デザイン実測） */
  --mgc-bg-grey:#F5F6F8;

  /* 元デザイン注記「通常セクションは320〜1600pt」＝1280pt → 1280×0.865＝1107px */
  --mgc-wrap:1107px;
  /* 左右余白：狭い画面は40px固定、広い画面は画面幅の8%（見本の余白感に近づける） */
  --mgc-gutter:max(40px,8vw);
  --mgc-radius:10px;
  --mgc-radius-lg:16px;

  /* カード地色（デザイン実測） */
  --mgc-card-amber:#FFF2B2;       /* 業界カード 奇数 */
  --mgc-card-amber-soft:#FFFAE5;  /* 業界カード 偶数 */
  --mgc-card-blue:#EDF2FB;        /* ブルー系カード 奇数 */
  --mgc-card-grey:#F4F4F6;        /* ブルー系カード 偶数 */

  --mgc-shadow:0 2px 10px rgba(31,41,55,.06);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  font-weight:500;
  font-size:17px;
  line-height:1.75; /* 元デザイン 20pt/行送り35pt */
  color:var(--mgc-ink);
  background:var(--mgc-bg);
  font-feature-settings:"palt";
  /* 日本語の禁則処理：長音符「ー」や小書きかな「ョ」等が行頭に来る不自然な改行を防ぐ */
  line-break:strict;
  word-break:normal;
  overflow-wrap:break-word;
}
img{max-width:100%;height:auto;vertical-align:middle}
a{color:var(--mgc-royal);text-decoration:none;transition:color .2s,opacity .2s}
a:hover{color:var(--mgc-orange)}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;line-height:1.5;font-weight:700}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}

.mgc-wrap{width:min(100% - var(--mgc-gutter),var(--mgc-wrap));margin-inline:auto}
.mgc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- ヘッダー ---------- */
/* 白はロゴ行だけに乗せる。ピルの行を透過させることで、
   元デザインどおり FV画像がピルの左右まで回り込む。 */
.mgc-header{background:transparent;position:relative;z-index:50}
.mgc-header__top{background:#fff}
.mgc-header__top{display:flex;align-items:center;gap:28px;padding:14px 0}
.mgc-searchbar{background:#fff}
.mgc-logo{display:inline-flex;align-items:center;flex:0 0 auto}
.mgc-logo img{width:190px;min-width:120px;height:auto;display:block}
.mgc-gnav{margin-left:auto}
.mgc-gnav ul{display:flex;gap:34px;align-items:center}
.mgc-gnav a{color:var(--mgc-ink);font-size:14px;font-weight:500}
.mgc-gnav a:hover{color:var(--mgc-royal)}
/* 元デザイン：⌀64pt の #E5E7EB の丸に #1E3A8A・線幅2pt の虫めがね */
.mgc-search-btn{
  flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;
  background:#E5E7EB;display:grid;place-items:center;color:var(--mgc-french);
}
.mgc-search-btn:hover{background:#D8DCE2}

.mgc-pillnav{padding:0 0 18px}
.mgc-pillnav ul{
  display:flex;justify-content:space-between;gap:8px;
  background:var(--mgc-amber);border-radius:999px;padding:14px 42px;
}
.mgc-pillnav a{color:var(--mgc-ink);font-weight:700;font-size:16px}
.mgc-pillnav a:hover{color:#fff}

.mgc-searchbar{display:none;padding:0 0 18px}
.mgc-searchbar.is-open{display:block}
.mgc-searchbar form{display:flex;gap:8px}
.mgc-searchbar input[type=search]{
  flex:1;padding:12px 16px;border:1px solid var(--mgc-line);border-radius:var(--mgc-radius);font-size:15px;
}
.mgc-searchbar button{
  padding:12px 24px;border:0;border-radius:var(--mgc-radius);
  background:var(--mgc-royal);color:#fff;font-weight:700;cursor:pointer;
}

.mgc-burger{display:none}

/* ---------- ページヘッダー帯 ---------- */
/* 元デザイン（3.製品一覧 ほか）：薄青の帯は y88〜308（高さ220pt）。
   黄色ピルが帯の上端に60pt かぶる。
   タイトル52pt #1E3A8A・左端124.2pt・ベースライン264.4
   リード24pt Medium・左端401.9pt・ベースライン235.6（行送り36pt） */
.mgc-pagehead{background:var(--mgc-bg-soft);padding:100px 0 22.8px}
.mgc-pagehead__inner{
  display:flex;align-items:center;gap:51.9px;flex-wrap:wrap;
  max-width:none;width:100%;padding:0 6.4688%;
}
.mgc-pagehead h1{color:var(--mgc-french);font-size:clamp(28px,3.4vw,45px);letter-spacing:.04em;line-height:1.5;text-wrap:pretty}
.mgc-pagehead__lead{font-size:20.76px;font-weight:500;color:var(--mgc-ink);line-height:1.5}
.mgc-pagehead--slim{padding:79.8px 0 8.4px}
@media (min-width:821px){
  body:has(.mgc-pagehead:not(.mgc-pagehead--plain)) .mgc-pillnav{
    position:relative;z-index:30;padding-bottom:0;margin-bottom:-52px;
  }
}
@media (max-width:820px){
  .mgc-pagehead{padding:30px 0 26px}
  .mgc-pagehead__inner{padding:0 20px;gap:16px}
  .mgc-pagehead__lead{font-size:15px}
}

/* ---------- 見出し ---------- */
/* 元デザイン：セクション見出し40pt #1E3A8A → 34.6px */
.mgc-h2{color:var(--mgc-french);font-size:clamp(23px,2.9vw,34.6px);margin-bottom:18px;letter-spacing:.02em;line-height:1.45}
/* 元デザイン：小見出し26pt #1E3A8A → 22.5px */
.mgc-h3{color:var(--mgc-french);font-size:clamp(18px,1.885vw,22.5px);margin-bottom:10px;line-height:1.5}
/* 元デザイン 26pt/行送り35pt */
.mgc-lead{color:var(--mgc-ink);font-weight:500;margin-bottom:30px;font-size:clamp(16px,1.9vw,21.1px);line-height:1.346}
.mgc-section{padding:52px 0}
.mgc-section--soft{background:var(--mgc-bg-soft)}

/* ---------- ボタン ---------- */
.mgc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 32px;border-radius:999px;font-weight:700;font-size:17px;
  border:2px solid transparent;cursor:pointer;text-align:center;line-height:1.4;
}
.mgc-btn--primary{background:var(--mgc-french);color:#fff}
.mgc-btn--primary:hover{background:var(--mgc-royal);color:#fff}
.mgc-btn--royal{background:var(--mgc-royal);color:#fff}
.mgc-btn--royal:hover{background:var(--mgc-french);color:#fff}
.mgc-btn--orange{background:var(--mgc-orange);color:#fff}
.mgc-btn--orange:hover{background:#F97316;color:#fff}
.mgc-btn--outline{background:#fff;color:var(--mgc-royal);border-color:var(--mgc-royal)}
.mgc-btn--outline:hover{background:var(--mgc-royal);color:#fff}
.mgc-btn--sm{padding:7px 22px;font-size:14px;border-radius:999px}
.mgc-btn--lg{padding:15px 40px;font-size:21px;border-radius:999px}
.mgc-btn--block{display:flex;width:100%}
.mgc-btn{max-width:100%}
.mgc-btn--disabled{background:#E5E7EB;color:#9CA3AF;cursor:default;pointer-events:none;border-color:transparent}

/* ---------- 商品詳細 ---------- */
/* 元デザイン：本文1040pt＋サイドバー280pt（余白40pt）。サイドバーは製品一覧導線の下端まで伸びる */
.mgc-pd{display:grid;grid-template-columns:minmax(0,1fr) 242.2px;gap:34.6px;padding:44px 0}
.mgc-pd__main{min-width:0}
.mgc-detail{display:grid;grid-template-columns:minmax(0,1fr) 242.2px;gap:34.6px;padding:44px 0}
/* 元デザイン：ギャラリー460pt／本文559pt／余白21pt */
.mgc-detail__main{display:grid;grid-template-columns:397.9px minmax(0,1fr);gap:18.2px}

/* 枠は正方形に固定し、画像は position:absolute で枠いっぱいに収める。
   height:100% を auto 高さの親に対して指定すると、ブラウザによって
   高さが解決されず画像が切れたり枠が伸びたりするため、
   absolute 配置で確定サイズの包含ブロックを作っている。 */
.mgc-gallery__stage{
  position:relative;
  border:.87px solid #6B7280;border-radius:0;overflow:hidden;background:#fff;
  aspect-ratio:1/1;
}
.mgc-gallery__stage img{
  position:absolute;inset:0;display:block;
  width:100%;height:100%;object-fit:contain;object-position:center;
}
.mgc-gallery__thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:17.3px;margin-top:17.3px}
.mgc-gallery__thumb{
  position:relative;
  border:.89px solid #6B7280;border-radius:0;overflow:hidden;background:#fff;
  aspect-ratio:1/1;padding:0;cursor:pointer;
}
.mgc-gallery__thumb img{
  position:absolute;inset:0;display:block;
  width:100%;height:100%;object-fit:contain;object-position:center;
}
.mgc-gallery__thumb.is-active{border-color:var(--mgc-royal);border-width:2px}

.mgc-badge{
  display:inline-block;background:var(--mgc-amber);color:#000;
  font-size:17.3px;font-weight:700;padding:2px 16px;border-radius:4px;margin-bottom:14px;
}
.mgc-model{font-size:22.5px;font-weight:700;color:#000;margin-bottom:4px}
.mgc-title{font-size:32.9px;color:#000;margin-bottom:18px;line-height:1.4}
.mgc-catch{font-size:20.8px;font-weight:700;color:#000;margin-bottom:12px}
.mgc-desc{font-size:15.6px;font-weight:500;color:#000;line-height:1.55;margin-bottom:22px;white-space:pre-line}

.mgc-spec{margin-bottom:22px}
.mgc-spec li{
  position:relative;padding-left:18px;font-size:14.7px;line-height:1.883;
}
.mgc-spec__label{font-weight:700}
.mgc-spec .mgc-spec__val{font-weight:500}
.mgc-spec li::before{
  content:"";position:absolute;left:0;top:.68em;width:10.5px;height:10.5px;background:var(--mgc-amber);
}
.mgc-spec dt{display:inline;font-weight:500}
.mgc-spec .mgc-spec__val{white-space:pre-line}

/* 元デザイン：資料ボタンは 200×36pt のカプセル・白16pt太字 */
.mgc-doclinks{display:flex;flex-direction:column;align-items:flex-end;gap:9.2px}
.mgc-doclinks .mgc-btn{
  min-width:173px;min-height:31.1px;padding:0 18px;font-size:13.8px;
  border-radius:999px;line-height:1.2;
}
/* バッテリー関連の注意ボタンは2行になるため高さを許容する */
.mgc-doclinks .mgc-btn--orange{min-height:64.9px;border-radius:15.8px;line-height:1.35}

.mgc-aside{background:#F4F4F6;border-radius:var(--mgc-radius);padding:22px 20.8px;align-self:stretch}
.mgc-aside__block+.mgc-aside__block{margin-top:26px;padding-top:22px;border-top:1px solid var(--mgc-line)}
.mgc-aside h2{font-size:17.3px;color:var(--mgc-french);margin-bottom:8px;text-align:center}
.mgc-aside p{font-size:14.7px;font-weight:500;color:var(--mgc-ink);line-height:1.176;margin-bottom:14px;text-align:center}
/* 元デザイン：相談フォームへ 232×64pt・白22pt */
.mgc-aside .mgc-btn{width:100%;min-height:55.4px;font-size:19px;border-radius:10.4px;padding:8px 12px}
/* 元デザイン：資料DLボタンは白地・枠 #1E3A8A 2pt・文字18pt・232×64pt */
.mgc-aside .mgc-btn--outline,.mgc-aside .mgc-btn--outline.mgc-btn--sm{
  background:#fff;border-color:var(--mgc-french);color:var(--mgc-french);border-width:1.73px;
  font-size:15.6px;height:auto;min-height:55.4px;min-width:0;padding:8px 12px;line-height:1.4;
}
.mgc-aside .mgc-btn--outline:hover{background:var(--mgc-french);color:#fff}
.mgc-aside .mgc-btn--disabled{height:auto;min-height:55.4px;font-size:15.6px}
.mgc-aside .mgc-btn+.mgc-btn{margin-top:10px}

/* 3つの理由 */
/* 元デザイン p4：パネル1040×290pt・#EDF2FB。アイコン帯は上端+25.1pt〜146.4pt */
.mgc-reasons{background:var(--mgc-card-blue);border-radius:17.3px;padding:21.7px 0 24.4px}
.mgc-reasons__title{color:var(--mgc-french);font-size:clamp(23px,2.9vw,34.6px);text-align:left;margin-bottom:18px;letter-spacing:.02em;line-height:1.45}
.mgc-reasons__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.mgc-reason{text-align:center}
/* 元デザイン：アイコンは3点とも寸法が異なり、上下中央で揃う（枠 94.6pt） */
/* 見本実測（pt→px×0.865）：磁石 98.7×121.4 / シールド 84.6×99.7 / 電池 49.6×101.1。3つとも中央揃え */
.mgc-reason__icon{display:grid;place-items:center;width:100%;height:105px;margin:0 auto 20px;color:var(--mgc-french)}
.mgc-reason__icon .mgc-i{width:105px;height:105px}
.mgc-reason__icon .mgc-vi{width:auto;max-width:100%;margin:0}
.mgc-reason:nth-child(1) .mgc-reason__icon .mgc-vi{height:105px}
.mgc-reason:nth-child(2) .mgc-reason__icon .mgc-vi{height:86.2px}
.mgc-reason:nth-child(3) .mgc-reason__icon .mgc-vi{height:87.5px}

.mgc-reason h3{font-size:20.8px;color:var(--mgc-orange);margin-bottom:7.5px;line-height:1.4}
.mgc-reason p{font-size:14.7px;font-weight:500;color:var(--mgc-ink);line-height:1.4706}

/* ---------- 製品カード ---------- */
.mgc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.mgc-card{
  border:2.6px solid var(--mgc-french);border-radius:17.3px;background:#fff;
  padding:18px;display:flex;flex-direction:column;
}
/* サムネイルは元画像の縦横比がまちまちなので、4:3の枠に収めて高さを揃える。 */
.mgc-card__thumb{position:relative;aspect-ratio:4/3;margin-bottom:14px;overflow:hidden}
.mgc-card__thumb a{display:block;width:100%;height:100%}
.mgc-card__thumb img{display:block;width:100%;height:100%;object-fit:contain}
/* 元デザイン（関連カード）：キャッチ20pt Bold #1F2937 */
.mgc-card__catch{font-size:17.3px;font-weight:700;color:var(--mgc-ink);margin-bottom:10px;min-height:1.5em;line-height:1.5}
.mgc-card__name{font-size:20.8px;font-weight:700;color:var(--mgc-ink);margin-bottom:4px;line-height:1.5}
.mgc-card__name a{color:inherit}
.mgc-card__name a:hover{color:var(--mgc-royal)}
.mgc-card__model{font-size:17.3px;font-weight:700;color:var(--mgc-ink);margin-bottom:10px}
.mgc-card__model::before{content:"○ "}
/* 元デザイン 17pt/行送り24pt */
.mgc-card__desc{font-size:14.7px;color:var(--mgc-ink);line-height:1.412;margin-bottom:16px;flex:1}
/* 元デザイン 200×36pt・#FB923C・白16pt・カプセル・カード中央 */
.mgc-card .mgc-btn{
  margin-top:auto;align-self:center;min-width:173px;min-height:31.1px;
  padding:0 20px;font-size:13.8px;border-radius:999px;line-height:1.2;
}
/* バッジはサムネイルに重ねる（フローに入れると製品名の位置が段でずれるため） */
.mgc-card__status{
  position:absolute;left:0;top:0;z-index:2;
  display:inline-block;font-size:11.5px;font-weight:700;padding:2px 10px;border-radius:3px;
  background:#E5E7EB;color:#4B5563;
}
.mgc-card__status--limited{background:#FEF3C7;color:#92400E}
/* 元デザイン（商品詳細の関連製品・製品一覧導線）：製品名20pt Bold／型番16pt Medium */
.mgc-card--related .mgc-card__name{font-size:17.3px}
.mgc-card--related .mgc-card__model{font-size:13.8px;font-weight:500}

/* ---------- カテゴリタブ ---------- */
.mgc-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;margin-bottom:26px}
.mgc-tab{
  min-height:43.25px;padding:8px 6px;border:1.73px solid var(--mgc-french);border-radius:8.65px;
  background:var(--mgc-bg-soft);
  color:var(--mgc-french);font-weight:700;font-size:17.3px;cursor:pointer;line-height:1.35;
}
.mgc-tab.is-active,.mgc-tab:hover{background:var(--mgc-french);color:#fff;border-color:var(--mgc-french)}
.mgc-tabpanel[hidden]{display:none}
/* 商品詳細のカテゴリ切替は 208×72pt・枠3pt・角丸16pt・22pt（製品一覧より大きい） */
.mgc-tabs--lg .mgc-tab{min-height:62.3px;border-width:2.6px;border-radius:13.8px;font-size:19px}

.mgc-devlabel{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;margin:40px 0 16px}
.mgc-devlabel__icon{width:42px;height:56px;color:var(--mgc-royal)}
.mgc-devlabel h3{
  font-size:22.5px;color:var(--mgc-ink);position:relative;padding-left:26px;
}
.mgc-devlabel h3::before{
  content:"";position:absolute;left:0;top:.34em;width:15px;height:15px;border-radius:50%;
  background:var(--mgc-amber);
}
.mgc-devlabel span{font-size:19px;color:var(--mgc-ink);font-weight:400}

/* ---------- 基本構成 ---------- */
.mgc-compose{display:flex;align-items:stretch;gap:14px;flex-wrap:wrap}
.mgc-compose__item{
  flex:1 1 260px;border:4.3px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  padding:20px;text-align:center;background:#fff;
}
.mgc-compose__img{
  display:block;width:100%;max-width:210px;height:auto;margin:0 auto;mix-blend-mode:multiply;
}
.mgc-compose__item h3{color:var(--mgc-french);font-size:24.2px;margin-top:10px}
.mgc-compose__item p{font-size:15.6px;color:var(--mgc-ink);margin-top:6px}
.mgc-compose__plus{display:grid;place-items:center;font-size:34px;color:#9CA3AF;flex:0 0 30px}

/* ---------- 下部CTA ---------- */
.mgc-cta{padding:52px 0}
.mgc-cta__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:22px}
.mgc-cta__card{
  border:2px solid var(--mgc-royal);border-radius:var(--mgc-radius);
  padding:26px 20px;text-align:center;background:#fff;
}
/* アイコンの線色は見出しと同じ #1E3A8A（元デザイン 2pt） */
.mgc-cta__card svg,.mgc-cta__card .mgc-i{width:88px;height:88px;color:var(--mgc-french);margin-bottom:18px}

/* 下部CTAカード（2.Magconnとは / 3.製品一覧 / 4.導入事例 いずれも同寸法）
   カード420×255.6pt・枠4pt #2563EB・間隔50pt
   アイコン中心 80.0 ／ 見出し26pt baseline169.2 ／ ボタン高36pt top192.5 */
.mgc-cta__grid{gap:43.25px}
.mgc-cta__card{border-width:3.46px;padding:0 12px 19.9px;min-height:221.1px}
.mgc-cta__icon{display:grid;place-items:center;width:100%;height:121.4px;padding-top:10px}
.mgc-cta__icon .mgc-vi{width:auto;height:auto;max-width:100%;margin:0}
.mgc-cta__icon svg,.mgc-cta__icon .mgc-i{margin-bottom:0}
.mgc-cta__card h3{
  font-size:22.5px;color:var(--mgc-french);line-height:1.0769;min-height:24.3px;margin:0 0 17.4px;
  display:flex;align-items:center;justify-content:center;
}
.mgc-cta__card .mgc-btn{min-width:173px;min-height:31.14px;padding:0 16px;font-size:13.84px}
/* 2.Magconnとは はボタン幅200pt固定 */
.mgc-cta--steps .mgc-cta__card .mgc-btn{width:173px;padding:0 12px}

.mgc-industry{display:flex;flex-wrap:wrap;gap:17.3px}
.mgc-industry a{
  display:flex;align-items:center;justify-content:center;text-align:center;
  min-width:211.9px;min-height:79.6px;
  border:1.73px solid var(--mgc-orange);background:#FFF2B2;border-radius:13.8px;
  padding:8px 18px;color:var(--mgc-french);font-weight:700;font-size:19px;line-height:1.4;
}
.mgc-industry a:hover{background:var(--mgc-amber);color:var(--mgc-french)}

/* ---------- フッター ---------- */
/* 元デザイン（1920pt基準）
     背景 #1E3A8A ／ ロゴ x281.58 w219.46 h40.03・上端は背景から33.97
     3カラムは x320 / 750 / 1170、右端1600（＝内側に40ptずつ寄せる）
     見出し 20pt（社名のみBold、《…》はMedium）・ベースラインは背景から134.78
     本文 16pt Regular・行送り30pt
     コピーライト Helvetica Neue Bold 16pt・右端1600・最終行と同じ高さ */
.mgc-footer{background:var(--mgc-french);color:#fff;padding:29.4px 0 76px;margin-top:60px}
.mgc-footer a{color:#fff}
.mgc-footer a:hover{color:var(--mgc-amber)}
.mgc-footer__logo img{width:189.8px;height:auto;display:block;margin-bottom:34.1px}
.mgc-footer__cols{
  position:relative;display:grid;grid-template-columns:430fr 420fr 430fr;gap:0;padding:0 34.6px;
}
.mgc-footer h2{font-size:17.3px;font-weight:500;line-height:1.3;margin:0}
.mgc-footer h2.mgc-footer__corp{font-weight:700}
.mgc-footer li,.mgc-footer p{font-size:13.84px;font-weight:400;line-height:1.875}
.mgc-footer li::before{content:"・"}
.mgc-footer__addr li::before{content:none}
.mgc-footer__copy{
  position:absolute;right:34.6px;bottom:0;margin:0;text-align:right;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:700;
}

/* ---------- お知らせ等 ---------- */
.mgc-entry{padding:44px 0}
.mgc-entry__body h2{font-size:24px;color:var(--mgc-french);margin:1.6em 0 .6em}
.mgc-entry__body h3{font-size:19px;margin:1.4em 0 .5em}
.mgc-entry__body img{border-radius:6px}
.mgc-newslist li{border-bottom:1px solid var(--mgc-line)}
.mgc-newslist a{display:flex;gap:20px;padding:16px 4px;color:var(--mgc-ink);flex-wrap:wrap}
.mgc-newslist a:hover{color:var(--mgc-royal)}
.mgc-newslist time{color:var(--mgc-ink-soft);font-size:14px;flex:0 0 100px}

.mgc-pager{display:flex;gap:8px;justify-content:center;margin-top:34px;flex-wrap:wrap}
.mgc-pager .page-numbers{
  padding:8px 14px;border:1px solid var(--mgc-line);border-radius:6px;color:var(--mgc-royal);
}
.mgc-pager .current{background:var(--mgc-french);color:#fff;border-color:var(--mgc-french)}

.mgc-notice{
  background:var(--mgc-bg-soft);border-radius:var(--mgc-radius);padding:22px;font-size:14px;
}

/* ---------- レスポンシブ ---------- */
@media (max-width:1024px){
  .mgc-detail,.mgc-pd{grid-template-columns:1fr}
  .mgc-detail__main{grid-template-columns:280px minmax(0,1fr)}
  .mgc-cards{grid-template-columns:repeat(2,1fr)}
  /* スマホでは商品画像が大きくなりすぎるため、基本構成の見え方に合わせて高さを抑える */
  .mgc-card__thumb{aspect-ratio:auto;height:clamp(140px,34vw,220px)}
  .mgc-compose__img{max-width:180px}
  .mgc-pillnav ul{padding:12px 20px}
  .mgc-pillnav a{font-size:14px}
}
@media (max-width:820px){
  .mgc-gnav{
    display:none;position:absolute;top:100%;left:0;right:0;background:#fff;
    box-shadow:var(--mgc-shadow);padding:10px 20px 18px;
  }
  .mgc-gnav.is-open{display:block}
  .mgc-gnav ul{flex-direction:column;gap:0;align-items:stretch}
  .mgc-gnav li{border-bottom:1px solid var(--mgc-line);width:100%}
  .mgc-gnav a{display:block;padding:14px 4px;font-size:15px;text-align:left}
  .mgc-gnav li:last-child{border-bottom:0}
  .mgc-search-btn{margin-left:auto}
  .mgc-header__top{gap:12px}
  .mgc-logo img{width:140px}
  .mgc-detail__main{grid-template-columns:1fr}
  .mgc-doclinks{align-items:stretch}
  .mgc-reasons__grid{grid-template-columns:1fr;gap:22px}
  .mgc-cta__grid{grid-template-columns:1fr}
  .mgc-footer__cols{grid-template-columns:1fr;gap:26px;padding:0}
  .mgc-footer__copy{position:static;margin-top:26px}
  .mgc-pagehead h1{font-size:29px}
  .mgc-pagehead__inner{gap:14px}
}
@media (max-width:600px){
  .mgc-cards{grid-template-columns:1fr}
  .mgc-title{font-size:24px}
  .mgc-h2{font-size:22px}
  .mgc-section{padding:38px 0}
}

/* ============================================================
   トップページ
   ============================================================ */

/* ---- ファーストビュー ---- */
/* 元デザイン：アートボード1920pt。
   ヘッダー0〜76pt、黄色ピルナビ76〜148pt、画像バンド88〜860pt。
   テーマではヘッダーを別要素で出すため、FVの枠は「y=76〜860」＝1920×784pt。
   1pt = 100/1920 vw = 0.0520833vw。 */
.mgc-hero{
  position:relative;overflow:hidden;background:#fff;
  /* 横スワイプ／マウスドラッグでスライドを送る（縦スクロールはそのまま） */
  touch-action:pan-y;cursor:grab;
  -webkit-user-select:none;user-select:none;
}
.mgc-hero.is-dragging{cursor:grabbing}
.mgc-hero:focus{outline:none}
.mgc-hero:focus-visible{outline:3px solid var(--mgc-royal);outline-offset:-3px}
.mgc-hero img{-webkit-user-drag:none;user-select:none}
.mgc-hero__slides{position:relative}
.mgc-hero__slide{
  position:absolute;inset:0;
  aspect-ratio:1920 / 784;
  opacity:0;visibility:hidden;transition:opacity .8s ease;overflow:hidden;
}
.mgc-hero__slide.is-active{opacity:1;visibility:visible;position:relative}

/* 画像バンド：枠内 y=12〜784pt（＝デザインの88〜860pt） */
.mgc-hero__band{
  position:absolute;left:0;right:0;top:1.5306%;height:98.4694%;
  overflow:hidden;z-index:0;
}
.mgc-hero__col{position:absolute;top:0;bottom:0;overflow:hidden;display:block}
.mgc-hero__img{position:absolute;height:auto;max-width:none;pointer-events:none}

.mgc-hero__inner{position:absolute;inset:0;z-index:2;pointer-events:none}
.mgc-hero__eyebrow,
.mgc-hero__title,
.mgc-hero__lead{position:absolute;left:var(--tx);right:var(--tx);margin:0}
.mgc-hero__eyebrow{
  /* --ty-* は1行目ベースライン。行ボックス上端まで戻す（1.16/2+0.3465） */
  top:calc(var(--ty-e) - .9265em);
  color:var(--mgc-royal);font-weight:700;
  font-size:clamp(15px,1.4583vw,28px);line-height:1.16;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:.02em;
}
/* 元デザイン 47pt Bold #1E3A8A・行送り55pt */
.mgc-hero__title{
  top:calc(var(--ty-t) - 1.005em); /* 1.17/2 + 0.42 */
  color:var(--mgc-french);font-weight:700;
  font-size:clamp(24px,2.4479vw,47px);line-height:1.17;letter-spacing:.01em;
  font-feature-settings:"palt" 1;
}
/* 元デザイン 23pt #1F2937・行送り36pt */
.mgc-hero__lead{
  top:calc(var(--ty-l) - 1.2025em); /* 1.565/2 + 0.42 */
  color:var(--mgc-ink);font-size:clamp(13px,1.1979vw,23px);line-height:1.565;
}

.mgc-hero__dots{
  position:absolute;left:0;right:0;bottom:18px;display:flex;justify-content:center;gap:10px;z-index:3;
}
.mgc-hero__dot{
  width:10px;height:10px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:rgba(30,58,138,.28);
}
.mgc-hero__dot.is-active{background:var(--mgc-french)}

/* ============================================================
   ヘッダー：元デザイン（フェーズ3_FV関連/1.トップページ_FV.ai）の実測値
   アートボード1920pt。横方向は「％」で置く（スクロールバー幅の影響を受けないため）。

     ロゴ         x 44.72  y 23.99  w 207.63  h 40.03
     ヘッダー高    76
     グローバルナビ 16pt Medium  左端 320 / 右端 1595.94
     検索ボタン    ⌀64  x 1680  y 19.15
     黄色ピル      x 280  w 1360  y 76  h 72  内側余白 40  22pt Bold
     画像バンド    y 88〜860（＝ピルが画像に 60pt かぶる）
   ============================================================ */
@media (min-width:821px){
  .mgc-header > .mgc-wrap{max-width:none;width:100%;padding:0}

  .mgc-header__top{
    position:relative;display:block;padding:0;gap:0;
    width:100%;aspect-ratio:1920 / 76;
  }
  .mgc-logo{
    position:absolute;left:2.3292%;top:57.9%;transform:translateY(-50%);
    width:10.8141%;
  }
  .mgc-logo img{width:100%;min-width:0}

  .mgc-gnav{
    position:absolute;left:16.6667%;right:16.8781%;
    top:50%;transform:translateY(-50%);margin:0;
  }
  .mgc-gnav ul{display:flex;justify-content:space-between;gap:0;align-items:center}
  .mgc-gnav a{font-size:max(.8333vw,12px);white-space:nowrap;line-height:1.2}

  .mgc-search-btn{
    position:absolute;left:87.5%;top:25.2%;
    width:3.3333%;height:auto;aspect-ratio:1;min-width:0;min-height:0;
  }
  .mgc-search-btn svg{width:46%;height:46%}

  .mgc-pillnav{padding:0 0 18px}
  /* 元デザイン：ピルナビ 280〜1640pt＝コンテンツ列とまったく同じ幅。
     ラップと同じ計算式にして、どのブラウザ幅でも本文と左右が揃うようにする。
     高さは 72pt＝62.3px、左右の内側余白は 28.3pt＝24.5px。 */
  .mgc-pillnav ul{
    box-sizing:border-box;
    width:min(100% - var(--mgc-gutter),var(--mgc-wrap));margin-inline:auto;height:62.3px;
    padding:0 24.5px;border-radius:999px;align-items:center;gap:0;
  }
  .mgc-pillnav a{font-size:19px;white-space:nowrap;line-height:1.2}  /* 元デザイン 22pt */

  /* FVのあるページはピルを画像に重ねる（重ね量＝ピルの高さ）。 */
  body:has(.mgc-hero) .mgc-pillnav,
  body:has(.mgc-fv) .mgc-pillnav{
    position:relative;z-index:30;padding-bottom:0;margin-bottom:-62.3px;
  }
}
/* 狭いデスクトップではピルの高さを抑える（重ね量も同じ値に合わせる） */
@media (min-width:821px) and (max-width:1099px){
  .mgc-pillnav ul{height:46px}
  .mgc-pillnav a{font-size:max(1.45vw,14px)}
  body:has(.mgc-hero) .mgc-pillnav,
  body:has(.mgc-fv) .mgc-pillnav{margin-bottom:-46px}
}

/* ---- 見出し行（右にボタン） ---- */
.mgc-headrow{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.mgc-headrow .mgc-lead{margin-bottom:0}
/* 元デザイン：白抜きの小ボタンは 200×36pt・枠1pt */
.mgc-btn--outline.mgc-btn--sm{
  border-width:.87px;min-width:173px;min-height:31.1px;padding:0 16px;font-size:13.8px;line-height:1.2;
}
/* 商品詳細：地 #EDF2FB・枠／文字 #1E3A8A */
.mgc-btn--soft{background:var(--mgc-bg-soft);border-color:var(--mgc-french);color:var(--mgc-french)}
.mgc-btn--soft:hover{background:var(--mgc-french);color:#fff}
/* 元デザイン：この商品について相談する 470×72pt・#FB923C・白24pt */
.mgc-btn--wide{min-width:min(406.6px,100%);min-height:62.3px;font-size:20.8px;padding:10px 32px}

/* ---- 支給AIから抽出したベクターアイコン（インラインSVG） ---- */
/* 色・線幅は元データのまま。寸法もSVGの属性値（元デザイン実寸×0.865）を尊重する。 */
.mgc-vi{display:inline-block;vertical-align:middle;flex:0 0 auto;max-width:100%;height:auto}

/* 既存レイアウトは `.mgc-i` と `svg` に固定サイズを当てているが、
   ベクターは元デザインの実寸（SVG属性値）を優先させる。
   セレクタ詳細度を .a .b（0,2,0）にして .a svg（0,1,1）に勝たせている。 */
.mgc-cta__card .mgc-vi,
.mgc-indcard__icon .mgc-vi,
.mgc-devcard__icon .mgc-vi,
.mgc-casecard__ph .mgc-vi,
.mgc-strength__icon .mgc-vi,
.mgc-supcard__icon .mgc-vi,
.mgc-noticebox__icon .mgc-vi,
.mgc-feat__icon .mgc-vi,
.mgc-purpose__icon .mgc-vi,
.mgc-reason__icon .mgc-vi,
.mgc-info__icon .mgc-vi,
.mgc-guide__icon .mgc-vi,
.mgc-setlabel__icon .mgc-vi,
.mgc-stepnote__icon .mgc-vi,
.mgc-hintbox__icon .mgc-vi{width:auto;height:auto;max-width:100%}

@media (max-width:820px){
  .mgc-vi{max-width:78px}
  .mgc-devcard__icon .mgc-vi{max-width:none}
}

/* ---- デザイン抽出アイコン（CSSマスク） ---- */
.mgc-i{
  display:inline-block;vertical-align:middle;
  background-color:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
  width:48px;height:48px;flex:0 0 auto;
}

/* ---- 業界別ナビ ---- */
.mgc-indgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.mgc-indcard{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;
  background:var(--mgc-card-amber);border:3.46px solid var(--mgc-amber);border-radius:var(--mgc-radius-lg);
  padding:0 3px 36px;color:var(--mgc-ink);min-height:242px;
}
/* アイコンは高さ固定の枠に中央寄せ。これでカードごとに絵の大きさが違っても
   タイトルの高さが5枚とも揃う（元デザインどおり）。 */
.mgc-indcard__icon{display:grid;place-items:center;width:100%;height:128px}
.mgc-indcard:nth-child(even){background:var(--mgc-card-amber-soft)}
.mgc-indcard:hover{background:#FFEDA0;color:var(--mgc-ink)}
.mgc-indcard:nth-child(even):hover{background:#FFF4CF}
.mgc-indcard__icon svg,.mgc-indcard__icon .mgc-i{width:80px;height:80px;color:var(--mgc-french);margin-bottom:0}
/* 元デザイン 21pt #1E3A8A Bold */
.mgc-indcard__name{font-weight:700;color:var(--mgc-french);font-size:18.2px;line-height:1.4;margin-bottom:14.6px}
/* 元デザイン 14pt Bold #1F2937・行送り22pt */
/* 版面1107px化に伴い、見本の改行位置が収まるよう微調整（見本14pt→比例縮小） */
.mgc-indcard__desc{font-size:11.4px;font-weight:700;line-height:1.571;color:var(--mgc-ink)}

/* ---- 製品カテゴリナビ ---- */
/* 元デザイン：カード420×380pt、カード間 50pt（1360pt に3枚）。 */
.mgc-devgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:43.25px}
.mgc-devcard{
  background:var(--mgc-card-blue);border:3.46px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  padding:0 20px 20px;text-align:center;min-height:328.7px;
  display:flex;flex-direction:column;
}
.mgc-devcard__icon svg,.mgc-devcard__icon .mgc-i{width:78px;height:78px;color:var(--mgc-royal);margin-bottom:0}
.mgc-devcard__icon .mgc-i--illust{width:158px;height:158px;color:var(--mgc-ink);margin-bottom:0}
/* 元デザイン 26pt #1E3A8A・ベースラインはカード上端から238.87pt */
.mgc-devcard h3{color:var(--mgc-french);font-size:22.5px;margin:4.44px 0 7.3px;line-height:1.4}

/* 製品イラストは支給AIから抜いたベクター（白塗り＋#1F2937 1.5pt線）。
   枠はカード全幅×「カード上端0〜200.56pt」。位置・大きさはカードごとの実測値。
     タブレット   左 78.69 幅 262.62 上 22.63
     スマホ       左121.04 幅 177.75 上 49.71
     製品組み合わせ 左 48.35 幅 335.49 上 24.87
   ※枠の上端は枠線3.46px（＝4pt）の内側から始まるため、top%は 4pt 差し引いた値。 */
.mgc-devcard__icon{
  position:relative;display:block;width:auto;height:auto;
  margin:0 -23.46px;aspect-ratio:420 / 200.56;  /* padding 20px ＋ 枠 3.46px を打ち消しカード外形420ptに合わせる */
}
.mgc-devcard__icon svg{position:absolute;height:auto;max-width:none}
.mgc-devcard--tablet .mgc-devcard__icon svg{left:18.736%;width:62.529%;top:9.289%}
.mgc-devcard--phone  .mgc-devcard__icon svg{left:28.819%;width:42.321%;top:22.792%}
.mgc-devcard--combo  .mgc-devcard__icon svg{left:11.512%;width:79.879%;top:10.406%}
/* 元デザイン 200×36pt・16pt */
.mgc-devcard .mgc-btn{
  width:173px;min-height:31.1px;padding:0 12px;font-size:13.8px;align-self:center;
}
/* 元デザイン 17pt #1F2937・行送り25pt */
.mgc-devcard p{font-size:14.7px;color:var(--mgc-ink);line-height:1.47;margin-bottom:10.6px;flex:1 1 auto}

/* ---- 導入事例ピックアップ ---- */
.mgc-casegrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:26px}
.mgc-casecard{
  display:block;border:2px solid var(--mgc-amber);border-radius:var(--mgc-radius);
  overflow:hidden;background:#fff;color:var(--mgc-ink);
}
.mgc-casecard:hover{color:var(--mgc-ink);box-shadow:var(--mgc-shadow)}
.mgc-casecard__thumb{aspect-ratio:1/1;background:#FDF6E3;display:grid;place-items:center;overflow:hidden}
.mgc-casecard__thumb img{width:100%;height:100%;object-fit:cover}
.mgc-casecard__ph svg,.mgc-casecard__ph .mgc-i{width:92px;height:92px;color:var(--mgc-amber)}
.mgc-casecard__label{
  display:block;text-align:center;font-weight:700;color:var(--mgc-french);
  padding:12px 8px;font-size:15px;border-top:2px solid var(--mgc-amber);
}

/* ---- 選ばれる理由 ---- */
.mgc-strengths{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.mgc-strength{
  background:var(--mgc-card-blue);border:3.46px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  padding:0 12px 22px;text-align:center;min-height:259.5px;
}
.mgc-strength:nth-child(even){background:var(--mgc-card-grey)}
.mgc-strength__icon{display:grid;place-items:center;width:100%;height:120px}
.mgc-strength__icon svg,.mgc-strength__icon .mgc-i{width:90px;height:90px;color:var(--mgc-royal);margin-bottom:0}
/* 元デザイン 26pt #1E3A8A */
.mgc-strength h3{color:var(--mgc-french);font-size:22.5px;margin-bottom:13.2px;line-height:1.4}
/* 元デザイン 16pt #1F2937・行送り24pt */
/* 元デザイン 17pt Bold #1F2937 */
.mgc-strength p{font-size:12.9px;font-weight:700;line-height:1.47;color:var(--mgc-ink)}

/* ---- トップのお知らせ ---- */
.mgc-topnews{border-top:1px solid var(--mgc-line);margin-top:22px}
.mgc-topnews li{border-bottom:1px solid var(--mgc-line)}
.mgc-topnews a{display:flex;align-items:center;gap:18px;padding:14px 6px;color:var(--mgc-ink);flex-wrap:wrap}
.mgc-topnews a:hover{color:var(--mgc-royal)}
.mgc-topnews time{color:var(--mgc-royal);font-weight:700;font-size:14px;flex:0 0 92px}
.mgc-topnews__title{font-size:15px;flex:1 1 auto;min-width:0}
.mgc-cat{
  flex:0 0 auto;min-width:104px;text-align:center;border-radius:999px;
  font-size:11.5px;font-weight:700;padding:4px 12px;color:#fff;background:var(--mgc-royal);
}
.mgc-cat--topics,.mgc-cat--uncategorized{background:var(--mgc-orange)}
.mgc-cat--pressrelease,.mgc-cat--product{background:var(--mgc-french)}
.mgc-cat--event{background:var(--mgc-amber);color:var(--mgc-ink)}
.mgc-cat--important{background:#DC2626}

/* ---- 資料・サポート導線 ---- */
.mgc-supgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.mgc-supcard{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;
  border:3.46px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  padding:0 12px 23px;text-align:center;color:var(--mgc-ink);min-height:216.3px;background:#fff;
}
.mgc-supcard:hover{background:#EFF4FE;color:var(--mgc-french)}
/* 元デザイン：アイコン枠145pt・線 #1E3A8A 2pt */
.mgc-supcard__icon{display:grid;place-items:center;width:100%;height:125px;color:var(--mgc-french)}
.mgc-supcard__icon svg,.mgc-supcard__icon .mgc-i{width:100px;height:100px;color:var(--mgc-french);margin-bottom:0}
.mgc-supcard__icon .mgc-vi{width:auto;height:auto;max-width:100%;max-height:100%;margin:0}
/* 元デザイン 21pt #1E3A8A・行送り25pt */
.mgc-supcard__name{font-weight:700;font-size:20.5px;color:var(--mgc-french);line-height:1.19}

@media (max-width:1024px){
  .mgc-indgrid,.mgc-strengths,.mgc-supgrid{grid-template-columns:repeat(3,1fr)}
  .mgc-casegrid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .mgc-devgrid{grid-template-columns:1fr}
  .mgc-headrow{align-items:flex-start}
}
@media (max-width:600px){
  .mgc-topnews time{flex-basis:100%}
  .mgc-topnews a{gap:8px 14px}
}

/* ============================================================
   下層ページ共通パーツ
   ============================================================ */

.mgc-pagehead--center{text-align:center;padding:56px 0 44px}
/* 元デザイン：タイトル48pt・サブ32pt #FB923C・リード26pt Medium（行送り42pt） */
.mgc-pagehead--center h1{font-size:clamp(26px,3.14vw,41.5px);margin-bottom:14px}
.mgc-pagehead--center .mgc-pagehead__lead{
  margin:0 auto;max-width:52em;font-size:clamp(15px,1.9vw,22.5px);font-weight:500;line-height:1.6154;
}
.mgc-pagehead--plain{background:#fff}
.mgc-pagehead__sub{
  color:var(--mgc-orange);font-weight:700;font-size:clamp(19px,2.34vw,27.7px);
  margin-bottom:12px;line-height:1.6;
}

.mgc-h2--bar{position:relative;padding-left:16px}
.mgc-h2--bar::before{
  content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:5px;
  background:var(--mgc-orange);border-radius:3px;
}

/* 下層ヒーロー */
.mgc-subhero{background:var(--mgc-bg-soft);padding:64px 0}

/* 写真を敷いたFV（Magconnとは・会社概要） */
.mgc-subhero--photo{
  position:relative;background-color:#E9EDF4;
  background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:0;overflow:hidden;
}
.mgc-subhero--photo::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.28) 34%,rgba(255,255,255,0) 62%);
}
.mgc-subhero--photo > .mgc-wrap{position:relative;padding-top:96px;padding-bottom:96px;min-height:min(34vw,420px)}
.mgc-subhero--photo .mgc-subhero__eyebrow,
.mgc-subhero--photo .mgc-subhero__title,
.mgc-subhero--photo .mgc-subhero__lead{
  text-shadow:0 1px 0 rgba(255,255,255,.9),0 0 14px rgba(255,255,255,.85);
}
.mgc-subhero__eyebrow{color:var(--mgc-royal);font-weight:700;font-size:16px;margin-bottom:10px}
.mgc-subhero__title{color:var(--mgc-french);font-size:clamp(23px,2.6vw,34px);line-height:1.45;margin-bottom:16px}
.mgc-subhero__lead{font-size:15px;line-height:1.95}

/* 注意書きボックス */
.mgc-noticebox{
  display:flex;gap:20px;align-items:center;
  background:var(--mgc-bg-soft);border-radius:var(--mgc-radius);padding:22px 26px;margin-top:34px;
}
.mgc-noticebox__icon svg,.mgc-noticebox__icon .mgc-i{width:68px;height:68px;color:var(--mgc-royal);flex:0 0 auto}
.mgc-noticebox li{position:relative;padding-left:20px;font-size:14px;line-height:1.875}
.mgc-noticebox li::before{
  content:"";position:absolute;left:2px;top:.7em;width:8px;height:8px;border-radius:50%;background:var(--mgc-amber);
}

/* 資料DLテーブル */
/* 元デザイン：見出し行56pt #EDF2FB、データ行72pt、罫線2pt #E5E7EB、
   製品名・型番は20pt Bold、DLボタンは220×44pt の白地＋青枠 */
.mgc-doctable__head{margin:30px 0 10px;font-size:27.7px}
.mgc-doctable__wrap{overflow-x:auto}
.mgc-doctable{width:100%;table-layout:fixed;border-collapse:collapse;background:#fff;font-size:17.3px}
.mgc-doctable th,.mgc-doctable td{padding:13px 16px;border:1.7px solid #E5E7EB;text-align:left}
.mgc-doctable thead th{background:var(--mgc-bg-soft);color:var(--mgc-french);font-size:17.3px;height:48.4px}
.mgc-doctable tbody td{font-weight:700;color:var(--mgc-ink);height:62.3px}
/* テーブルごとに列幅が変わらないよう固定 */
.mgc-doctable thead th:nth-child(2),.mgc-doctable td:nth-child(2){width:210px}
.mgc-doctable thead th:nth-child(3),.mgc-doctable thead th:nth-child(4),
.mgc-doctable td:nth-child(3),.mgc-doctable td:nth-child(4){text-align:center;width:230px}
.mgc-doctable td:first-child{word-break:break-word}
.mgc-doctable td a{color:var(--mgc-ink)}
.mgc-doctable td a:hover{color:var(--mgc-royal)}
.mgc-doctable__extra{display:block;margin-top:6px}
/* PDFダウンロードボタン
   見本実測：220×44pt・角丸10pt・白地・枠1.5pt #2563EB・文字20pt Bold #2563EB
   （.mgc-btn--sm と .mgc-doctable td a に負けないよう詳細度を上げている） */
.mgc-btn--outline.mgc-btn--doc,
.mgc-doctable td a.mgc-btn--doc{
  min-width:190px;min-height:38px;padding:5px 14px;
  font-size:17.3px;font-weight:700;line-height:1.2;
  border-radius:8.7px;border-width:1.5px;border-style:solid;
  border-color:var(--mgc-royal);background:#fff;color:var(--mgc-royal);
  gap:8px;
}
.mgc-btn--outline.mgc-btn--doc:hover,
.mgc-doctable td a.mgc-btn--doc:hover{background:var(--mgc-royal);color:#fff}
.mgc-btn--doc .mgc-vi{width:15.4px;height:20.5px;flex:0 0 auto}
.mgc-doctable .mgc-btn--disabled,
.mgc-doctable .mgc-btn--sm.mgc-btn--disabled{
  min-width:190px;min-height:38px;padding:5px 14px;font-size:17.3px;
  border-radius:8.7px;
  background:#F4F4F6;color:#6B7280;border:1.5px solid var(--mgc-muted);
}

/* 特徴グリッド */
.mgc-featgrid{display:grid;gap:22px}
.mgc-featgrid--4{grid-template-columns:repeat(4,1fr)}
.mgc-featgrid--5{grid-template-columns:repeat(5,1fr)}
.mgc-feat{
  background:#fff;border:2px solid var(--mgc-amber);border-radius:var(--mgc-radius-lg);
  padding:20px 9px 28px;text-align:center;min-height:224px;
}
.mgc-featgrid--4 .mgc-feat{padding:24px 12px 26px;min-height:277px}
.mgc-featgrid--3 .mgc-feat{padding:24px 14px 26px}
.mgc-feat__icon svg,.mgc-feat__icon .mgc-i{width:80px;height:80px;color:var(--mgc-french);margin-bottom:21px}
.mgc-featgrid--4 .mgc-feat__icon svg,.mgc-featgrid--4 .mgc-feat__icon .mgc-i{width:108px;height:108px;margin-bottom:31px}
.mgc-featgrid--3 .mgc-feat__icon svg,.mgc-featgrid--3 .mgc-feat__icon .mgc-i{width:100px;height:100px;margin-bottom:26px}
.mgc-feat h3{color:var(--mgc-french);font-size:22px;margin-bottom:15px;line-height:1.35}
/* 元デザイン 17pt/行送り25pt */
.mgc-feat p{font-size:14.7px;line-height:1.471;color:var(--mgc-ink-soft)}
.mgc-feat--proof{background:var(--mgc-card-blue);border-color:var(--mgc-royal)}
.mgc-feat--proof:nth-child(even){background:var(--mgc-card-grey)}
.mgc-feat--proof .mgc-feat__icon svg,.mgc-feat--proof .mgc-feat__icon .mgc-i{color:var(--mgc-royal)}
.mgc-feat--amber{background:#fff;border-color:var(--mgc-amber)}
.mgc-feat--amber .mgc-feat__icon svg,.mgc-feat--amber .mgc-feat__icon .mgc-i{color:var(--mgc-orange)}

/* ------------------------------------------------------------
   Magconnとは：カードの実測値（2.Magconnとは.pdf）
     強み     310×330pt・枠4pt #FBBF24・白
              アイコン上端59.3 ／ 見出し26pt baseline228.0（行送り28）
              本文16pt Bold #1F2937・行送り24・baseline270.4
     実績     248×270pt・枠4pt #2563EB・#EDF2FB / #F4F4F6 交互
              アイコン上端30.6 ／ 見出し baseline168.7 ／ 本文 baseline202.4
     現場     248×270pt・枠4pt #FBBF24・白／アイコンは #FB923C
              アイコン上端40.6 ／ 見出し baseline189.4 ／ 本文 baseline223.1
   ------------------------------------------------------------ */
.mgc-featgrid--4 .mgc-feat,
.mgc-featgrid--5 .mgc-feat{border-width:3.46px}
.mgc-featgrid--4 .mgc-feat__icon,
.mgc-featgrid--5 .mgc-feat__icon{display:grid;place-items:center;width:100%}
.mgc-featgrid--4 .mgc-feat__icon .mgc-vi,
.mgc-featgrid--5 .mgc-feat__icon .mgc-vi{width:auto;height:auto;max-width:100%;margin:0}
.mgc-featgrid--4 .mgc-feat h3,
.mgc-featgrid--5 .mgc-feat h3{
  font-size:22.5px;line-height:1.0769;color:var(--mgc-french);
  display:flex;align-items:center;justify-content:center;
}
/* 元デザイン 16pt Bold #1F2937・行送り24pt */
.mgc-featgrid--4 .mgc-feat p,
.mgc-featgrid--5 .mgc-feat p{
  font-size:13.84px;font-weight:700;line-height:1.5;color:var(--mgc-ink);
}

/* 4つの強み */
/* カード間 40pt。1180pxの中で 310pt×4 になる */
.mgc-featgrid--4{gap:34.6px}
.mgc-featgrid--4 .mgc-feat{padding:0 6px 22.86px;min-height:285.5px}
.mgc-featgrid--4 .mgc-feat__icon{height:160.9px;padding-top:3.4px}  /* アイコンの中心をカード上端から99.0pt に */
.mgc-featgrid--4 .mgc-feat h3{min-height:48.5px;margin:0 0 4.8px}

/* 数字と実績 */
/* カード間 30pt。1180pxの中で 248pt×5 になる */
.mgc-featgrid--5{gap:25.95px}
.mgc-featgrid--5 .mgc-feat--proof{padding:0 4px 29.83px;min-height:233.6px}
.mgc-featgrid--5 .mgc-feat--proof .mgc-feat__icon{height:120.8px}
.mgc-featgrid--5 .mgc-feat--proof h3{min-height:24.3px;margin:0 0 10.3px}
.mgc-feat--proof .mgc-feat__icon svg,.mgc-feat--proof .mgc-feat__icon .mgc-i{color:var(--mgc-french)}

/* さまざまな現場 */
.mgc-featgrid--5 .mgc-feat--amber{padding:0 4px 11.93px;min-height:233.6px}
.mgc-featgrid--5 .mgc-feat--amber .mgc-feat__icon{height:138.7px;padding-top:9.4px}
.mgc-featgrid--5 .mgc-feat--amber h3{min-height:24.3px;margin:0 0 10.3px}

/* 会社概要の強み：薄いブルーのパネルで囲む */
.mgc-featpanel{
  background:var(--mgc-card-blue);border-radius:var(--mgc-radius-lg);padding:26px;
}

/* 図版・プレースホルダ */
.mgc-figure{margin:0;text-align:center}
.mgc-figure img{border-radius:var(--mgc-radius)}
.mgc-placeholder{
  border:2px dashed var(--mgc-line);border-radius:var(--mgc-radius);
  padding:56px 20px;text-align:center;color:#9CA3AF;font-size:13.5px;background:#FAFBFD;
}

/* サポートカードに説明文を足す */
.mgc-supcard__desc{font-size:14.7px;line-height:1.47;color:var(--mgc-ink);font-weight:700;margin-top:14px}
.mgc-supcard:has(.mgc-supcard__desc){min-height:300px;justify-content:flex-start;padding:34px 12px 26px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__icon{height:150px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-i{width:86px;height:86px;margin-bottom:0}
/* 元デザイン 26pt #1E3A8A（2行の改行位置はデータ側で指定） */
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__name{
  font-size:20.6px;line-height:1.4;font-feature-settings:"palt" 1;letter-spacing:-.012em;
}
.mgc-supcard:has(.mgc-supcard__desc){padding-left:4px;padding-right:4px}

/* サポート案内 */
.mgc-guidegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:start}

@media (max-width:1024px){
  .mgc-featgrid--4,.mgc-featgrid--5{grid-template-columns:repeat(3,1fr)}
  .mgc-guidegrid{grid-template-columns:1fr}
}
@media (max-width:820px){
  .mgc-noticebox{flex-direction:column;align-items:flex-start;gap:12px}
  .mgc-subhero{padding:44px 0}

  /* テーブルをカード表示に */
  .mgc-doctable thead{display:none}
  .mgc-doctable,.mgc-doctable tbody,.mgc-doctable tr,.mgc-doctable td{display:block;width:100%}
  .mgc-doctable tr{
    border:1px solid var(--mgc-line);border-radius:var(--mgc-radius);margin-bottom:14px;padding:6px 0;
  }
  .mgc-doctable td{border:0;display:flex;gap:12px;align-items:center;padding:8px 16px}
  .mgc-doctable td::before{
    content:attr(data-label);flex:0 0 92px;font-size:12px;font-weight:700;color:var(--mgc-french);
  }
  .mgc-doctable thead th:nth-child(3),.mgc-doctable td:nth-child(3),
  .mgc-doctable td:nth-child(4){text-align:left;width:auto}
}
@media (max-width:600px){
  .mgc-featgrid--4,.mgc-featgrid--5{grid-template-columns:repeat(2,1fr)}
}

/* ============================================================
   お問い合わせ・フォーム
   ============================================================ */

.mgc-purposegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
/* 元デザイン 420×400pt・枠4pt #2563EB */
.mgc-purpose{
  border:3.5px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  padding:0 20px 28px;min-height:346px;text-align:center;background:#fff;
  display:flex;flex-direction:column;
}
/* 元デザイン：アイコンはカード上端からの絶対位置で配置（線 #1E3A8A 2pt）
   見積 top6.4pt/h187.2pt・OEM top45.9pt/h145.9pt・その他 top69.8pt/h98.3pt
   見出しベースライン 238.9pt → アイコン帯 166.6px＋余白15.2px */
.mgc-purpose__icon{position:relative;width:100%;height:166.6px;margin-bottom:15.2px;color:var(--mgc-french);flex:0 0 auto}
.mgc-purpose__icon .mgc-vi{position:absolute;left:50%;transform:translateX(-50%);width:auto;height:auto;max-width:100%;margin:0}
.mgc-purpose__icon .mgc-vi--ct-estimate{top:4.7px;height:161.9px}
.mgc-purpose__icon .mgc-vi--ct-oem{top:38.8px;height:126.2px}
.mgc-purpose__icon .mgc-vi--ct-other{top:59.5px;height:85.1px}
.mgc-purpose__icon svg,.mgc-purpose__icon .mgc-i{color:var(--mgc-french);margin-bottom:0}
.mgc-purpose h3{color:var(--mgc-french);font-size:22.5px;margin-bottom:14px;line-height:1.45}
/* 元デザイン 17pt/行送り25pt */
.mgc-purpose p{font-size:13.2px;font-weight:700;line-height:1.471;color:var(--mgc-ink);margin-bottom:16px;flex:1 1 auto}
/* 元デザイン 200×36pt・#FB923C・白16pt太字 */
.mgc-purpose .mgc-btn{border-radius:999px;align-self:center;min-width:173px;min-height:31.1px;padding:5px 18px;font-size:13.8px}

/* フォームパネル */
.mgc-formpanel{
  background:var(--mgc-bg-grey);border-radius:var(--mgc-radius-lg);
  padding:34px 38px 38px;margin-bottom:34px;scroll-margin-top:20px;
}
.mgc-formpanel__title{color:var(--mgc-french);font-size:25.95px;margin-bottom:8px}
.mgc-formpanel__lead{font-size:19px;font-weight:500;color:var(--mgc-ink);margin-bottom:26px;line-height:1.6}

.mgc-formnotice{
  background:#FFF8E6;border:1px solid var(--mgc-amber);border-radius:var(--mgc-radius);
  padding:18px 20px;font-size:14px;line-height:1.9;
}
.mgc-formnotice span{font-size:12px;color:var(--mgc-ink-soft)}

/* CF7 のフィールド（フォーム側で mgc-field クラスを付与） */
.mgc-formrow{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.mgc-field{margin-bottom:18px}
.mgc-field--full{grid-column:1 / -1}
.mgc-field label{display:block;font-size:15.6px;font-weight:700;margin-bottom:6px;color:var(--mgc-ink)}
.mgc-req{
  display:inline-block;background:var(--mgc-orange);color:#fff;font-size:11.2px;font-weight:700;
  padding:1px 9px;border-radius:3px;margin-left:8px;vertical-align:2px;
}
.mgc-any{
  display:inline-block;background:#9CA3AF;color:#fff;font-size:10.5px;font-weight:700;
  padding:1px 9px;border-radius:3px;margin-left:8px;vertical-align:2px;
}
.mgc-field input[type=text],
.mgc-field input[type=email],
.mgc-field input[type=tel],
.mgc-field input[type=url],
.mgc-field input[type=number],
.mgc-field input[type=date],
.mgc-field select,
.mgc-field textarea{
  width:100%;padding:12px 14px;border:1px solid var(--mgc-line);border-radius:6px;
  font-size:15.6px;font-weight:500;font-family:inherit;background:#fff;color:var(--mgc-ink);
}
.mgc-field textarea{min-height:130px;resize:vertical}
/* 元デザイン：プレースホルダは 18pt Bold #BEBFC5 */
.mgc-field input::placeholder,.mgc-field textarea::placeholder{color:var(--mgc-muted);font-weight:700}
.mgc-field input:focus,.mgc-field select:focus,.mgc-field textarea:focus{
  outline:2px solid var(--mgc-royal);outline-offset:1px;border-color:var(--mgc-royal);
}
.mgc-field input[type=file]{font-size:13px}
.mgc-field .mgc-hint{font-size:11.5px;color:var(--mgc-ink-soft);margin-top:4px;display:block}

.mgc-submit{text-align:center;margin-top:26px}
.mgc-submit input[type=submit],
.mgc-submit button{
  background:var(--mgc-royal);color:#fff;border:0;border-radius:999px;
  padding:14px 62px;font-size:19px;font-weight:700;cursor:pointer;font-family:inherit;
}
.mgc-submit input[type=submit]:hover,.mgc-submit button:hover{background:var(--mgc-french)}
.mgc-submit .wpcf7-spinner{display:block;margin:10px auto 0}

.wpcf7-not-valid-tip{color:#DC2626;font-size:12px;margin-top:4px}
.wpcf7 form .wpcf7-response-output{
  margin:22px 0 0;border-radius:var(--mgc-radius);padding:14px 18px;font-size:14px;border-width:2px;
}

/* 補足ノート */
.mgc-formnote{margin-top:26px}
.mgc-formnote h3{
  color:var(--mgc-french);font-size:19px;margin-bottom:10px;position:relative;padding-left:24px;
}
.mgc-formnote h3::before{
  content:"";position:absolute;left:0;top:.42em;width:13px;height:13px;border-radius:50%;background:var(--mgc-orange);
}
.mgc-formnote li{
  position:relative;padding-left:22px;font-size:15.6px;font-weight:700;line-height:1.663;color:var(--mgc-ink);
}
.mgc-formnote li::before{
  content:"";position:absolute;left:2px;top:.62em;width:10px;height:10px;border-radius:50%;
  border:1.3px solid var(--mgc-ink);
}

/* 補足情報（薄いブルーのパネルに4項目） */
/* 元デザイン：#EDF2FB・角丸24pt */
.mgc-infopanel{
  background:var(--mgc-card-blue);border-radius:20.8px;padding:34px 28px 32px;
}
.mgc-infogrid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.mgc-info{text-align:center}
/* 元デザイン：アイコン枠120pt・線 #1E3A8A 2pt／見出し26pt #2563EB／本文17pt Medium */
.mgc-info__icon{display:grid;place-items:center;width:100%;height:118px;color:var(--mgc-french);margin-bottom:12px}
.mgc-info__icon .mgc-i{width:92px;height:92px}
.mgc-info__icon .mgc-vi{width:auto;height:auto;max-width:100%;max-height:100%;margin:0}
.mgc-info h3{color:var(--mgc-royal);font-size:22.5px;margin-bottom:14px;line-height:1.4}
.mgc-info p{font-size:14.7px;font-weight:500;line-height:1.47;color:var(--mgc-ink);margin-bottom:16px}
.mgc-info .mgc-btn{border-radius:999px}

/* STEPフロー */
.mgc-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:step}
.mgc-step{
  background:#fff;border:2px solid var(--mgc-royal);border-radius:var(--mgc-radius);
  padding:20px 16px;position:relative;
}
.mgc-step__num{
  display:inline-block;color:var(--mgc-french);font-size:21.6px;font-weight:700;line-height:1;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;margin-bottom:8px;
}
.mgc-step__who{
  display:inline-block;margin-left:6px;font-size:11.5px;font-weight:700;color:var(--mgc-orange);
}
.mgc-step h3{color:var(--mgc-ink);font-size:13.8px;font-weight:700;line-height:1.55;margin:6px 0 8px}
.mgc-step p{font-size:13.8px;line-height:1.75;color:var(--mgc-ink)}

/* 住所ブロック */
.mgc-address{background:var(--mgc-bg-soft);border-radius:var(--mgc-radius);padding:24px 26px}
.mgc-address__name{font-weight:700;color:var(--mgc-french);font-size:16px;margin-bottom:8px}
.mgc-address p{font-size:14px;line-height:1.9}
.mgc-strongnote{color:#B45309;font-size:13px;line-height:1.9}
.mgc-noticebox--plain{background:#fff;border:1px solid var(--mgc-line)}

@media (max-width:1024px){
  .mgc-steps{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:820px){
  .mgc-purposegrid{grid-template-columns:1fr}
  .mgc-formrow{grid-template-columns:1fr}
  .mgc-formpanel{padding:26px 20px 30px}
  .mgc-infogrid{grid-template-columns:1fr}
  .mgc-steps{grid-template-columns:1fr}
}

/* ============================================================
   会社概要
   ============================================================ */

.mgc-featgrid--3{grid-template-columns:repeat(3,1fr)}

/* 元デザイン：656×450pt・枠5pt #2563EB・見出し30pt・本文17pt太字・ボタンは白地に青枠 */
.mgc-bizgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.mgc-biz{
  background:#fff;border:4.3px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  padding:26px 24px 28px;text-align:center;display:flex;flex-direction:column;
}
.mgc-biz__fig{display:grid;place-items:center;min-height:244px;margin-bottom:10px}
.mgc-biz__fig img{max-width:80%;max-height:244px;width:auto;height:auto;display:block}
/* 元デザイン 30pt Bold #1E3A8A */
.mgc-biz h3{color:var(--mgc-french);font-size:25.95px;margin-bottom:12px;line-height:1.4;text-align:center}
/* 元デザイン 17pt/行送り25pt */
.mgc-biz p{font-size:14.7px;font-weight:700;line-height:1.471;color:var(--mgc-ink);margin-bottom:18px;text-align:center;flex:1 1 auto}
.mgc-biz .mgc-btn{align-self:center;min-width:173px;min-height:31.1px;padding:5px 18px;font-size:13.8px;border-width:.87px}

/* 元デザイン：項目名セル260×82pt #F4F4F6、値セル #FFF、罫線1.93pt #E5E7EB、文字20pt */
.mgc-profile{width:100%;border-collapse:collapse;font-size:17.3px;background:#fff}
/* 元デザイン 20pt/行送り25pt */
.mgc-profile th,.mgc-profile td{
  border:1.7px solid #E5E7EB;padding:18px 26px;text-align:left;vertical-align:top;
  font-size:17.3px;line-height:1.25;font-weight:400;
}
.mgc-profile th{
  background:#F4F4F6;color:var(--mgc-french);width:225px;font-weight:700;white-space:nowrap;
}
.mgc-clients{
  display:grid;grid-template-columns:repeat(3,1fr);gap:2px 18px;font-size:13px;line-height:1.8;
}
.mgc-clients li::before{content:"・"}
.mgc-clients__note{font-size:12px;color:var(--mgc-ink-soft);margin-top:10px}

.mgc-accessgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.mgc-access{background:#fff;border:2px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);padding:24px}
.mgc-access h3{
  color:var(--mgc-french);font-size:18px;margin-bottom:8px;position:relative;padding-left:16px;
}
.mgc-access h3::before{
  content:"";position:absolute;left:0;top:.28em;bottom:.28em;width:5px;background:var(--mgc-amber);border-radius:3px;
}
.mgc-access p{font-size:14px;line-height:1.9;margin-bottom:14px}
.mgc-access__map{border-radius:8px;overflow:hidden;line-height:0}
.mgc-access__map iframe{width:100%;height:300px;display:block}

@media (max-width:1024px){
  .mgc-featgrid--3{grid-template-columns:repeat(3,1fr)}
  .mgc-clients{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .mgc-featgrid--3,.mgc-bizgrid,.mgc-accessgrid{grid-template-columns:1fr}
  .mgc-clients{grid-template-columns:1fr}
  .mgc-profile th,.mgc-profile td{display:block;width:auto}
  .mgc-profile th{border-bottom:0}
  .mgc-access__map iframe{height:240px}
}

/* ============================================================
   確認画面（プラグイン不要の自作実装）
   ============================================================ */

.mgc-form--hidden{display:none}

.mgc-confirm{
  background:#fff;border:2px solid var(--mgc-royal);border-radius:var(--mgc-radius);
  padding:30px 32px;outline:none;
}
.mgc-confirm__title{color:var(--mgc-french);font-size:21px;margin-bottom:8px}
.mgc-confirm__lead{font-size:13.5px;color:var(--mgc-ink-soft);margin-bottom:22px;line-height:1.9}

.mgc-confirm__list{
  display:grid;grid-template-columns:220px minmax(0,1fr);margin:0;
  border-top:1px solid var(--mgc-line);
}
.mgc-confirm__list dt,.mgc-confirm__list dd{
  margin:0;padding:13px 16px;border-bottom:1px solid var(--mgc-line);font-size:14px;line-height:1.8;
}
.mgc-confirm__list dt{background:var(--mgc-bg-soft);color:var(--mgc-french);font-weight:700}
.mgc-confirm__list dd{white-space:pre-line;word-break:break-word}
.mgc-confirm__list dd.is-empty{color:#9CA3AF}

.mgc-confirm__actions{display:flex;gap:14px;justify-content:center;margin-top:28px;flex-wrap:wrap}
.mgc-confirm__actions .mgc-btn{min-width:190px;border-radius:999px;padding:14px 32px}
.mgc-confirm__actions .mgc-btn:disabled{opacity:.6;cursor:default}

/* 送信完了パネル（フォームを隠したままだと結果が見えないため） */
.mgc-thanks{
  background:#fff;border:2px solid var(--mgc-royal);border-radius:var(--mgc-radius);
  padding:38px 32px;text-align:center;outline:none;
}
.mgc-thanks__mark{
  display:flex;align-items:center;justify-content:center;
  width:58px;height:58px;margin:0 auto 16px;border-radius:50%;
  background:var(--mgc-royal);color:#fff;font-size:28px;font-weight:700;line-height:1;
}
.mgc-thanks__title{color:var(--mgc-french);font-size:22px;margin-bottom:12px}
.mgc-thanks__lead{font-size:14px;color:var(--mgc-ink-soft);line-height:2;margin:0}
.mgc-thanks__actions{margin-top:26px}
.mgc-thanks__actions .mgc-btn{min-width:220px;border-radius:999px;padding:14px 32px}

/* 入力エラー */
.mgc-field.is-error input,
.mgc-field.is-error select,
.mgc-field.is-error textarea{border-color:#DC2626;background:#FEF2F2}
.mgc-fielderr{display:block;color:#DC2626;font-size:12px;margin-top:4px;font-weight:700}
.mgc-formerr{
  background:#FEF2F2;border:2px solid #DC2626;color:#B91C1C;border-radius:var(--mgc-radius);
  padding:14px 18px;font-size:14px;font-weight:700;margin-bottom:22px;
}

@media (max-width:820px){
  .mgc-confirm{padding:22px 18px}
  .mgc-confirm__list{grid-template-columns:1fr}
  .mgc-confirm__list dt{border-bottom:0;padding-bottom:4px}
  .mgc-confirm__list dd{padding-top:4px}
  .mgc-confirm__actions .mgc-btn{width:100%;min-width:0}
  .mgc-thanks{padding:28px 18px}
  .mgc-thanks__actions .mgc-btn{width:100%;min-width:0}
}

/* ============================================================
   導入事例
   ============================================================ */

/* ---- 導入事例トップのFV ---- */
.mgc-casehero{
  position:relative;background-size:cover;background-position:center;background-color:#E9EDF4;
  display:flex;align-items:center;min-height:min(38vw,440px);overflow:hidden;
}
.mgc-casehero::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(255,255,255,.66) 0%,rgba(255,255,255,.44) 38%,rgba(255,255,255,.08) 64%,rgba(255,255,255,0) 80%);
}
.mgc-casehero__inner{position:relative;padding:62px 0}
.mgc-casehero__title{
  color:var(--mgc-french);font-size:clamp(23px,2.9vw,38px);line-height:1.45;margin-bottom:16px;
}
.mgc-casehero__lead{font-size:clamp(13px,1.1vw,15.5px);line-height:1.95;color:var(--mgc-ink)}
.mgc-casehero__title,.mgc-casehero__lead{
  text-shadow:0 1px 0 rgba(255,255,255,.9),0 0 14px rgba(255,255,255,.85);
}

/* ---- 業界カードの現在地 ---- */
.mgc-indcard.is-current{background:#FFE9A8;box-shadow:inset 0 0 0 2px var(--mgc-orange)}

/* ---- 事例カード（横長） ---- */
.mgc-caselist{display:grid;gap:26px;margin-top:26px}
.mgc-case{
  display:grid;grid-template-columns:minmax(0,45%) minmax(0,55%);gap:0;
  border:2px solid var(--mgc-royal);border-radius:var(--mgc-radius-lg);
  overflow:hidden;background:#fff;min-height:455px;
}
.mgc-case__media{
  position:relative;display:block;background:#EFF4FE;min-height:230px;
}
.mgc-case__media img{width:100%;height:100%;object-fit:cover;display:block}
.mgc-case__noimg{
  position:absolute;inset:0;display:grid;place-items:center;color:var(--mgc-royal);
}
.mgc-case__noimg .mgc-i{width:74px;height:74px}
.mgc-case__badge{
  position:absolute;left:14px;bottom:14px;z-index:2;
  background:var(--mgc-royal);color:#fff;font-weight:700;font-size:13.5px;
  padding:7px 26px;border-radius:999px;
}
.mgc-case__body{padding:30px 32px}
.mgc-case__title{font-size:clamp(18px,1.8vw,24px);line-height:1.5;color:var(--mgc-french);margin-bottom:18px}
.mgc-case__title a{color:inherit}
.mgc-case__title a:hover{color:var(--mgc-royal)}

.mgc-case__meta{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin-bottom:16px;align-items:center}
.mgc-case__meta dt{
  background:#E5E7EB;color:var(--mgc-french);font-weight:700;font-size:13.5px;
  padding:7px 18px;border-radius:6px;text-align:center;white-space:nowrap;
}
.mgc-case__meta dd{font-size:15.5px;color:var(--mgc-ink)}

.mgc-case__story{margin-bottom:12px}
.mgc-case__story:last-child{margin-bottom:0}
.mgc-case__story h2,.mgc-case__story h3,.mgc-case__story h4{
  font-size:15.5px;color:var(--mgc-ink);margin-bottom:6px;position:relative;padding-left:20px;
}
.mgc-case__story h2::before,.mgc-case__story h3::before,.mgc-case__story h4::before{
  content:"";position:absolute;left:0;top:.44em;width:10px;height:10px;border-radius:50%;
  background:var(--mgc-amber);
}
.mgc-case__story p{font-size:14px;line-height:1.85;color:var(--mgc-ink)}

.mgc-empty{
  margin-top:24px;padding:34px 20px;text-align:center;color:var(--mgc-ink-soft);
  background:var(--mgc-bg-grey);border-radius:var(--mgc-radius);font-size:14px;
}

/* ---- 導入企業ロゴ ---- */
.mgc-clientlogos{
  display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:24px;
}
.mgc-clientlogos li{
  background:#fff;border:1px solid var(--mgc-line);border-radius:8px;
  display:grid;place-items:center;padding:14px;min-height:88px;
}
.mgc-clientlogos img{max-width:100%;max-height:56px;object-fit:contain}
.mgc-logoph{
  margin-top:24px;min-height:465px;display:grid;place-items:center;
  background:var(--mgc-bg-grey);border-radius:var(--mgc-radius-lg);color:var(--mgc-ink-soft);font-size:14px;
}

/* ---- 事例詳細 ---- */
.mgc-casedetail{display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);gap:32px;align-items:start}
.mgc-casedetail__media{
  position:relative;border-radius:var(--mgc-radius-lg);overflow:hidden;background:#EFF4FE;min-height:260px;
}
.mgc-casedetail__media img{width:100%;height:auto;display:block}
.mgc-casedetail__badge{
  display:inline-block;background:var(--mgc-royal);color:#fff;font-weight:700;font-size:13px;
  padding:5px 22px;border-radius:999px;margin-bottom:12px;
}

/* ---- 活用のヒント ---- */
.mgc-hints{position:relative;margin-top:26px}
.mgc-hints__track{
  display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2*22px)/3);gap:22px;
  overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding-bottom:6px;scrollbar-width:thin;
}
.mgc-hint{
  scroll-snap-align:start;display:flex;flex-direction:column;color:var(--mgc-ink);text-align:center;
}
.mgc-hint:hover{color:var(--mgc-ink)}
.mgc-hint:hover .mgc-hint__thumb{box-shadow:var(--mgc-shadow);transform:translateY(-2px)}
.mgc-hint__thumb{
  display:block;border-radius:var(--mgc-radius-lg);overflow:hidden;background:#FDF6E3;
  aspect-ratio:21/20;transition:transform .2s ease,box-shadow .2s ease;
}
.mgc-hint__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.mgc-hint__title{
  display:block;margin:14px 0 8px;font-weight:700;color:var(--mgc-orange);font-size:16px;line-height:1.5;
}
.mgc-hint__desc{display:block;font-size:12.5px;line-height:1.85;color:var(--mgc-ink-soft)}

.mgc-hints__nav{
  position:absolute;top:34%;transform:translateY(-50%);z-index:3;
  width:40px;height:40px;border-radius:50%;border:1px solid var(--mgc-line);
  background:rgba(255,255,255,.94);color:var(--mgc-french);
  font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;
  box-shadow:var(--mgc-shadow);
}
.mgc-hints__nav:hover{background:#fff;color:var(--mgc-royal)}
.mgc-hints__nav[disabled]{opacity:0;pointer-events:none}
.mgc-hints__nav--prev{left:-14px}
.mgc-hints__nav--next{right:-14px}

@media (max-width:1024px){
  .mgc-clientlogos{grid-template-columns:repeat(3,1fr)}
  .mgc-hints__track{grid-auto-columns:calc((100% - 22px)/2)}
}
@media (max-width:820px){
  .mgc-case{grid-template-columns:1fr;min-height:0}
  .mgc-case__media{min-height:210px;aspect-ratio:4/3}
  .mgc-case__body{padding:20px 18px}
  .mgc-casedetail{grid-template-columns:1fr;gap:22px}
  .mgc-casehero__inner{padding:40px 0 46px}
  .mgc-casehero::before{
    background:linear-gradient(180deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.66) 60%,rgba(255,255,255,.5) 100%);
  }
  .mgc-hints__nav{display:none}
}
@media (max-width:600px){
  .mgc-clientlogos{grid-template-columns:repeat(2,1fr)}
  .mgc-hints__track{grid-auto-columns:86%}
  .mgc-case__meta{grid-template-columns:1fr;gap:4px}
  .mgc-case__meta dt{justify-self:start}
}

/* ---- パンくず ---- */
.mgc-crumbs{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  font-size:12.5px;color:var(--mgc-ink-soft);margin-bottom:10px;
}
/* 元デザインにはパンくずが無いため非表示（構造は残す） */
.mgc-crumbs{display:none}
.mgc-crumbs a{color:var(--mgc-royal)}
.mgc-crumbs span{color:var(--mgc-line)}

/* ============================================================
   お知らせ（投稿）
   ============================================================ */

/* ---- 一覧 ---- */
.mgc-catnav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.mgc-catnav__item{
  border:1px solid var(--mgc-line);border-radius:999px;padding:6px 18px;
  font-size:13px;color:var(--mgc-ink-soft);background:#fff;
}
.mgc-catnav__item:hover{border-color:var(--mgc-royal);color:var(--mgc-royal)}
.mgc-catnav__item.is-current{background:var(--mgc-royal);border-color:var(--mgc-royal);color:#fff}

.mgc-newslist{border-top:1px solid var(--mgc-line)}
.mgc-newslist a{align-items:center;gap:18px;flex-wrap:nowrap}
.mgc-newslist time{color:var(--mgc-royal);font-weight:700;font-size:17.3px;flex:0 0 116px}
.mgc-newslist__title{font-size:20.8px;font-weight:500;flex:1 1 auto;min-width:0;line-height:1.5;line-break:strict;text-wrap:pretty}

.mgc-pager{display:flex;justify-content:center;gap:8px;margin-top:32px}
.mgc-pager .page-numbers{
  min-width:38px;height:38px;display:grid;place-items:center;padding:0 10px;
  border:1px solid var(--mgc-line);border-radius:6px;font-size:14px;color:var(--mgc-ink);
}
.mgc-pager .page-numbers:hover{border-color:var(--mgc-royal);color:var(--mgc-royal)}
.mgc-pager .page-numbers.current{background:var(--mgc-royal);border-color:var(--mgc-royal);color:#fff}

/* ---- 詳細 ---- */
.mgc-entry__meta{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.mgc-entry__meta time{color:var(--mgc-royal);font-weight:700;font-size:14px}
.mgc-entry__meta .mgc-cat{color:#fff}
.mgc-entry__meta .mgc-cat--event{color:var(--mgc-ink)}
.mgc-entry__eyecatch{margin-bottom:26px}
.mgc-entry__eyecatch img{width:100%;height:auto;border-radius:var(--mgc-radius)}

.mgc-entry__body{font-size:15px;line-height:2}
.mgc-entry__body p{margin-bottom:1.5em}
.mgc-entry__body p:last-child{margin-bottom:0}
.mgc-entry__body ul,.mgc-entry__body ol{margin:0 0 1.5em 1.4em}
.mgc-entry__body ul li{list-style:disc;margin-bottom:.4em}
.mgc-entry__body ol li{list-style:decimal;margin-bottom:.4em}
.mgc-entry__body a{color:var(--mgc-royal);text-decoration:underline;word-break:break-all}
.mgc-entry__body strong{font-weight:700;color:var(--mgc-french)}

/* 展示会情報などの表 */
.mgc-entry__body table{
  width:100%;border-collapse:collapse;margin:0 0 1.6em;font-size:14.5px;
  border:1px solid var(--mgc-line);
}
.mgc-entry__body th,.mgc-entry__body td{
  border:1px solid var(--mgc-line);padding:12px 16px;text-align:left;line-height:1.8;vertical-align:top;
}
.mgc-entry__body th{
  background:var(--mgc-bg-soft);color:var(--mgc-french);font-weight:700;
  white-space:nowrap;width:150px;
}
.mgc-entry__body figure.wp-block-table{margin:0 0 1.6em}
.mgc-entry__body figure.wp-block-table table{margin-bottom:0}

.mgc-entrynav{
  display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:44px;padding-top:26px;border-top:1px solid var(--mgc-line);
}
.mgc-entrynav a{color:var(--mgc-royal);font-size:14px}
.mgc-entrynav__prev,.mgc-entrynav__next{flex:1 1 0;min-width:0}
.mgc-entrynav__next{text-align:right}

@media (max-width:600px){
  .mgc-newslist a{flex-wrap:wrap;gap:8px 14px}
  .mgc-newslist time{flex-basis:100%}
  .mgc-entry__body th{width:auto;white-space:normal}
  .mgc-entry__body th,.mgc-entry__body td{display:block;width:100%;border-bottom:0}
  .mgc-entry__body tr:last-child td{border-bottom:1px solid var(--mgc-line)}
}

@media (max-width:820px){
  .mgc-subhero--photo > .mgc-wrap{padding-top:52px;padding-bottom:56px;min-height:auto}
  .mgc-subhero--photo::before{
    background:linear-gradient(180deg,rgba(255,255,255,.84) 0%,rgba(255,255,255,.62) 60%,rgba(255,255,255,.46) 100%);
  }
}

/* ---- カードの最低高さはワイド表示のときだけ（デザイン実測値） ---- */
@media (max-width:1024px){
  .mgc-indcard,.mgc-strength,.mgc-supcard,.mgc-devcard{min-height:0}
  .mgc-supcard:has(.mgc-supcard__desc){min-height:0}
  .mgc-indcard__icon svg,.mgc-indcard__icon .mgc-i{width:66px;height:66px;margin-bottom:16px}
  .mgc-strength__icon svg,.mgc-strength__icon .mgc-i{width:74px;height:74px;margin-bottom:18px}
  .mgc-supcard__icon svg,.mgc-supcard__icon .mgc-i{width:80px;height:80px;margin-bottom:16px}
  .mgc-feat__icon svg,.mgc-feat__icon .mgc-i{width:72px;height:72px}
  .mgc-purpose__icon{height:auto;display:grid;place-items:center;margin-bottom:14px}
  .mgc-purpose__icon .mgc-vi{position:static;transform:none;height:auto;max-height:110px}
  .mgc-purpose__icon svg,.mgc-purpose__icon .mgc-i{width:auto;height:auto;max-height:110px}
  .mgc-cta__card svg,.mgc-cta__card .mgc-i{width:72px;height:72px}
  .mgc-reason__icon{width:100%;height:88px}
  .mgc-reason__icon .mgc-i{width:88px;height:88px}
  .mgc-reason__icon .mgc-vi{max-height:88px}
}
@media (max-width:600px){
  /* 説明文の改行はデザイン幅前提なので、狭い画面では自然折り返しに戻す */
  .mgc-indcard__desc br,.mgc-strength p br,.mgc-devcard p br,
  .mgc-feat p br,.mgc-supcard__desc br{display:none}
  .mgc-indcard__icon svg,.mgc-indcard__icon .mgc-i{width:56px;height:56px;margin-bottom:12px}
  .mgc-strength__icon svg,.mgc-strength__icon .mgc-i{width:62px;height:62px;margin-bottom:14px}
  .mgc-supcard__icon svg,.mgc-supcard__icon .mgc-i{width:64px;height:64px;margin-bottom:12px}
  .mgc-strength h3,.mgc-reason h3,.mgc-purpose h3{font-size:18px}
  .mgc-indcard__name,.mgc-supcard__name{font-size:15.5px}
}

/* ============================================================
   Magconnとは
   ============================================================ */

/* ---- 導入文：中央揃え＋◎のウォーターマーク ---- */
.mgc-intro{
  position:relative;overflow:hidden;
  padding:76px 0;min-height:400px;display:grid;align-items:center;
}
.mgc-intro::before{
  content:"";position:absolute;left:50%;top:50%;
  width:310px;height:310px;transform:translate(-50%,-50%);
  background:url(../img/magconn-mark.png) no-repeat center/contain;
  opacity:.09;pointer-events:none;
}
.mgc-intro > .mgc-wrap{position:relative}
.mgc-h2--intro{
  color:var(--mgc-royal);text-align:center;
  font-size:clamp(22px,3.1vw,38px);line-height:1.5;margin-bottom:22px;
}
.mgc-lead--center{text-align:center;margin-left:auto;margin-right:auto}

/* ---- 仕組みの動画・図解 ---- */
.mgc-diagram{
  margin:0;background:var(--mgc-card-grey);border-radius:var(--mgc-radius-lg);
  overflow:hidden;
}
.mgc-diagram__video{
  display:block;width:100%;height:auto;aspect-ratio:16/9;background:var(--mgc-card-grey);
}
.mgc-diagramph{
  display:grid;place-items:center;text-align:center;
  background:var(--mgc-card-grey);border-radius:var(--mgc-radius-lg);
  min-height:518px;padding:40px 20px;color:#B91C1C;font-size:15px;line-height:1.9;
}
.mgc-figure{margin:0}
.mgc-figure img{width:100%;height:auto;border-radius:var(--mgc-radius-lg);display:block}

@media (max-width:820px){
  .mgc-diagramph{min-height:260px;font-size:13.5px}
  .mgc-intro::before{width:200px;height:200px}
}

/* ============================================================
   運用シーン別・推奨セット比較
   ============================================================ */
.mgc-setlabel{display:flex;align-items:center;gap:22px;margin:38px 0 18px}
.mgc-setlabel__icon{display:inline-flex;color:var(--mgc-french)}
.mgc-setlabel__icon svg,.mgc-setlabel__icon .mgc-i{width:69.2px;height:101.1px}
/* 元デザイン 40pt #FB923C */
.mgc-setlabel h3{font-size:34.6px;color:var(--mgc-orange);letter-spacing:.02em}

.mgc-setgrid{display:grid;gap:34.6px}
.mgc-setgrid--4{grid-template-columns:repeat(4,1fr)}
.mgc-setgrid--2{grid-template-columns:repeat(4,1fr)}

.mgc-set{display:flex;flex-direction:column}
/* 元デザイン 310×50pt・#2563EB・白24pt */
.mgc-set__head{
  background:var(--mgc-royal);color:#fff;font-weight:700;font-size:20.8px;
  height:43.25px;display:flex;align-items:center;
  padding:0 17px;border-radius:8.7px;margin-bottom:19.2px;
}
/* 元デザイン 白地・枠3pt #BEBFC5 */
.mgc-set__body{
  flex:1 1 auto;background:#fff;
  border:2.6px solid var(--mgc-muted);border-radius:var(--mgc-radius-lg);
  padding:19px 16px 22px;
}
/* 元デザイン 270×40pt・#FFF2B2・枠1pt #FBBF24・20pt */
.mgc-set__tag{
  display:flex;align-items:center;justify-content:center;height:34.6px;
  background:#FFF2B2;border:.87px solid var(--mgc-amber);border-radius:6px;
  font-size:17.3px;font-weight:500;color:var(--mgc-ink);padding:0 10px;text-align:center;margin-bottom:13.6px;
}
.mgc-set__subtitle{
  font-size:17.3px;font-weight:700;color:var(--mgc-ink);position:relative;padding-left:20px;margin-bottom:2.2px;
}
.mgc-set__subtitle::before{
  content:"";position:absolute;left:0;top:.36em;width:11px;height:11px;border-radius:50%;
  background:var(--mgc-amber);
}
/* 元デザイン 20pt Bold・行送り25pt */
.mgc-set__compose{font-size:17.3px;font-weight:700;color:var(--mgc-ink);line-height:1.25;min-height:2.5em;margin-bottom:55.8px}
.mgc-set__catch{
  color:var(--mgc-orange);font-weight:700;font-size:17.3px;line-height:1.5;margin:0 -20px 13.1px 0;min-height:1.5em;
}
/* 元デザイン：製品イラストは #1F2937・線幅1pt のベクター */
.mgc-set__img{
  display:grid;place-items:start center;width:100%;margin:0 auto 31.6px;
  color:#1F2937;
}
.mgc-set__img .mgc-vi{width:auto;height:auto;max-width:100%;margin:0}
.mgc-setgrid--4 .mgc-set__img{height:128.3px}
.mgc-setgrid--2 .mgc-set__img{height:138.0px;margin-bottom:14px}
/* スマホ用2枚組はデザイン上、構成1行・イラスト位置が上寄り */
.mgc-setgrid--2 .mgc-set__compose{min-height:1.25em;margin-bottom:27.2px}
.mgc-setgrid--2 .mgc-set__text{min-height:43.2px}
.mgc-set__label{
  font-size:13.8px;color:var(--mgc-royal);position:relative;padding-left:16px;margin:4.3px 0 0;font-weight:700;
  line-height:1.5625;
}
.mgc-set__label::before{
  content:"";position:absolute;left:0;top:.3em;width:10px;height:10px;border-radius:50%;
  border:1.5px solid var(--mgc-royal);
}
/* 元デザイン 16pt Medium・行送り25pt */
.mgc-set__text{font-size:13.8px;font-weight:500;line-height:1.5625;color:var(--mgc-ink);margin:0}
.mgc-set__points{font-size:13.8px;font-weight:500;line-height:1.5625;color:var(--mgc-ink);margin:0;padding:0;list-style:none}

.mgc-setcta{
  grid-column:3 / -1;display:flex;flex-direction:column;justify-content:center;gap:26px;padding-left:14px;
}
.mgc-setcta .mgc-btn{border-radius:999px;padding:15px 40px;font-size:21px;min-width:min(407px,100%)}

@media (max-width:1024px){
  .mgc-setgrid--4,.mgc-setgrid--2{grid-template-columns:repeat(2,1fr)}
  .mgc-setcta{grid-column:1 / -1;flex-direction:row;padding-left:0}
  .mgc-setlabel__icon svg,.mgc-setlabel__icon .mgc-i{width:44px;height:44px}
  .mgc-tabs{grid-auto-flow:row;grid-template-columns:repeat(3,1fr)}
}
@media (max-width:600px){
  .mgc-setgrid--4,.mgc-setgrid--2{grid-template-columns:1fr}
  .mgc-setcta{flex-direction:column}
  .mgc-set__compose,.mgc-set__catch{min-height:0}
  .mgc-tabs{grid-template-columns:repeat(2,1fr)}
}

/* ---- 商品詳細：関連製品カード ---- */
/* 元デザイン：キャッチ20pt Bold #1F2937 */
.mgc-card--related .mgc-card__catch{
  font-size:17.3px;color:var(--mgc-ink);font-weight:700;margin-bottom:12px;min-height:1.5em;line-height:1.5;
}
.mgc-center{text-align:center;margin-top:26px}

/* ---- カードスライダー（関連製品・製品一覧導線） ---- */
.mgc-slider{position:relative;margin-top:26px}
.mgc-slider .mgc-cards{
  /* grid-template-columns を打ち消さないと、先頭3枚だけが明示トラック（1fr）に入り、
     4枚目以降の暗黙トラックと幅が揃わなくなる。 */
  display:grid;grid-template-columns:none;
  grid-auto-flow:column;grid-auto-columns:calc((100% - 2*22px)/3);gap:22px;
  overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding-bottom:6px;scrollbar-width:thin;
}
.mgc-slider .mgc-card{scroll-snap-align:start;min-width:0}
.mgc-slider__nav{
  position:absolute;top:42%;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;border-radius:50%;border:0;
  background:var(--mgc-amber);color:#fff;
  font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;
  box-shadow:var(--mgc-shadow);
}
.mgc-slider__nav:hover{background:var(--mgc-orange)}
.mgc-slider__nav[disabled]{opacity:0;pointer-events:none}
.mgc-slider__nav--prev{left:-16px}
.mgc-slider__nav--next{right:-16px}

@media (max-width:1024px){
  .mgc-slider .mgc-cards{grid-auto-columns:calc((100% - 22px)/2)}
}
@media (max-width:600px){
  .mgc-slider .mgc-cards{grid-auto-columns:86%}
  .mgc-slider__nav{display:none}
}

/* ---- ボタン内の矢印（元デザインのベクター 5×10pt・線幅2pt） ---- */
.mgc-btn__arrow{margin-left:4px;font-size:1.15em;line-height:1}
.mgc-chev{flex:0 0 auto;display:inline-block;vertical-align:middle}
.mgc-btn .mgc-chev{margin-left:6px}
.mgc-slider__nav .mgc-chev{width:9px;height:15.6px}

@media (max-width:1024px){
  .mgc-infogrid{grid-template-columns:repeat(2,1fr);gap:24px}
}
@media (max-width:600px){
  .mgc-infogrid{grid-template-columns:1fr}
  .mgc-infopanel{padding:26px 18px}
  .mgc-info__icon .mgc-i{width:72px;height:72px}
  .mgc-info h3{font-size:18px}
}

/* ============================================================
   アフターサポート
   ============================================================ */

/* ---- 目的別メニューの丸ボタン ---- */
.mgc-supcard{position:relative}
.mgc-supcard__go{
  /* 円と矢印は支給ベクター（arrow-circle.svg）そのもの。CSSで描き足さない。 */
  display:grid;place-items:center;margin-top:auto;padding-top:16px;line-height:0;
}
.mgc-supcard__go .mgc-vi{width:36.3px;height:36.3px;transition:opacity .2s}
.mgc-supcard:hover .mgc-supcard__go .mgc-vi{opacity:.75}

/* ---- よく見られている質問 ---- */
/* 元デザイン：#FFFAE5・角丸24pt */
.mgc-faqpanel{background:#FFFAE5;border-radius:20.8px;padding:34px 32px 32px}
.mgc-faqpanel .mgc-btn{border-radius:999px}
.mgc-faqlist{display:grid;gap:14px;margin-top:8px}
.mgc-faq{
  background:#fff;border:1px solid var(--mgc-orange);border-radius:8px;overflow:hidden;
}
.mgc-faq__q{
  display:flex;align-items:center;gap:18px;min-height:50px;padding:10px 20px;cursor:pointer;list-style:none;
  font-size:19px;font-weight:500;color:var(--mgc-ink);
}
.mgc-faq__q::-webkit-details-marker{display:none}
/* 元デザイン Q. は HelveticaNeue-Bold 32pt #1E3A8A */
.mgc-faq__mark{
  color:var(--mgc-french);font-weight:700;font-size:27.7px;flex:0 0 auto;line-height:1;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
.mgc-faq__text{flex:1 1 auto;line-height:1.6}
.mgc-faq__arrow{color:var(--mgc-french);font-size:14px;flex:0 0 auto;transition:transform .2s ease}
.mgc-faq[open] .mgc-faq__arrow{transform:rotate(180deg)}
.mgc-faq__a{
  padding:0 20px 18px 62px;font-size:15.6px;font-weight:500;line-height:1.9;color:var(--mgc-ink);
}

/* ---- サポートのご案内 ---- */
/* 元デザイン：#EDF2FB・角丸24pt */
.mgc-guidepanel{background:var(--mgc-card-blue);border-radius:20.8px;padding:34px 28px 30px}
.mgc-guide{text-align:center}
/* 元デザイン：アイコン枠160pt・線 #1E3A8A 2pt */
.mgc-guide__icon{display:grid;place-items:center;width:100%;height:165px;color:var(--mgc-french);margin-bottom:10px}
.mgc-guide__icon .mgc-i{width:96px;height:96px}
.mgc-guide__icon .mgc-vi{width:auto;height:auto;max-width:100%;max-height:100%;margin:0}
.mgc-guide h3{color:var(--mgc-french);font-size:22.5px;margin-bottom:14px;line-height:1.4}
.mgc-guide p{font-size:13.8px;font-weight:700;line-height:1.5;color:var(--mgc-ink);margin-bottom:18px}
.mgc-guide .mgc-btn{border-radius:999px}

@media (max-width:820px){
  .mgc-faqpanel,.mgc-guidepanel{padding:24px 18px}
  .mgc-guide__icon .mgc-i{width:74px;height:74px}
  .mgc-guide h3{font-size:18px}
  .mgc-faq__a{padding-left:16px}
}

/* ---- 会社概要テーブルのパネル ---- */
.mgc-profilepanel{
  background:var(--mgc-card-blue);border-radius:var(--mgc-radius-lg);padding:34px 32px 32px;
}
.mgc-profilepanel .mgc-h2{margin-bottom:22px}
@media (max-width:820px){
  .mgc-profilepanel{padding:24px 16px}
}

/* ============================================================
   規約・保証などのドキュメントページ
   ============================================================ */
/* 元デザイン 18pt Medium・見出し38pt。セクションは #F4F4F6・角丸24pt のパネル */
.mgc-doc{font-size:15.6px;line-height:1.95}
.mgc-docsec{background:#F4F4F6;border-radius:20.8px;padding:27px 34.6px 30px;margin-bottom:26px}
.mgc-docsec > .mgc-h2{margin-top:0}
.mgc-docsec > :last-child{margin-bottom:0}
.mgc-doc .mgc-h2{font-size:clamp(22px,2.75vw,32.9px)}
.mgc-doc > p{margin-bottom:1.4em}
.mgc-doc .mgc-h2{margin-top:2em}
.mgc-doc .mgc-h2:first-of-type{margin-top:0}
.mgc-doc .mgc-h3{margin-top:1.6em;margin-bottom:.6em}
.mgc-doclist{margin:0 0 1.6em;padding:0}
.mgc-doclist li{
  position:relative;padding-left:22px;margin-bottom:.5em;line-height:1.95;
}
.mgc-doclist li::before{
  content:"";position:absolute;left:2px;top:.72em;width:9px;height:9px;border-radius:50%;
  border:2px solid var(--mgc-royal);
}
.mgc-docnote{margin:0 0 1.8em;padding:0;font-size:13.5px;color:var(--mgc-ink-soft)}
.mgc-docnote li{padding-left:1.4em;position:relative;line-height:1.9}
.mgc-docnote li::before{content:"※";position:absolute;left:0}

.mgc-warranty{width:100%;border-collapse:collapse;font-size:15px;background:#fff}
.mgc-warranty caption{
  caption-side:top;text-align:left;font-size:14px;color:var(--mgc-ink-soft);padding-bottom:10px;
}
.mgc-warranty th,.mgc-warranty td{
  border:1px solid var(--mgc-line);padding:16px 20px;text-align:left;vertical-align:middle;line-height:1.8;
}
.mgc-warranty thead th{background:var(--mgc-card-blue);color:var(--mgc-french);font-weight:700}
.mgc-warranty__term{
  white-space:nowrap;width:180px;text-align:center;font-weight:700;
  color:var(--mgc-french);font-size:20px;background:var(--mgc-card-grey);
}

.mgc-crumbs--center{justify-content:center}

@media (max-width:600px){
  .mgc-doc{font-size:14px}
  .mgc-warranty th,.mgc-warranty td{padding:12px 14px}
  .mgc-warranty__term{width:auto;font-size:17px}
}

/* ---- FAQページ ---- */
/* 元デザイン：吹き出しアイコン＋アンバーの帯（1245×70pt）に 38pt Bold #1E3A8A */
.mgc-faqgroup{display:flex;align-items:center;gap:3px;margin:52px 0 26px}
.mgc-faqgroup:first-of-type{margin-top:0}
.mgc-faqgroup__icon{flex:0 0 auto;display:grid;place-items:center;color:var(--mgc-french)}
.mgc-faqgroup__icon .mgc-vi{width:auto;height:84px;margin:0}
.mgc-faqgroup__bar{
  flex:1 1 auto;min-width:0;display:flex;align-items:center;
  background:var(--mgc-amber);border-radius:999px;min-height:60.6px;padding:6px 32px;
  color:var(--mgc-french);font-size:clamp(20px,2.8vw,32.9px);line-height:1.3;letter-spacing:.02em;
}
/* FAQページのアコーディオンは ＋／－ 表記（デザイン準拠） */
.mgc-faq__toggle{
  flex:0 0 auto;width:32px;height:32px;position:relative;color:var(--mgc-royal);
}
.mgc-faq__toggle::before,.mgc-faq__toggle::after{
  content:"";position:absolute;left:50%;top:50%;background:currentColor;
  transform:translate(-50%,-50%);
}
.mgc-faq__toggle::before{width:28px;height:4px}
.mgc-faq__toggle::after{width:4px;height:28px;transition:transform .2s ease}
.mgc-faq[open] .mgc-faq__toggle::after{transform:translate(-50%,-50%) scaleY(0)}

/* ---- FAQページのアコーディオン（元デザイン faq.pdf） ---- */
.mgc-faqlist--page{gap:43px}
.mgc-faqlist--page .mgc-faq{border:1.73px solid var(--mgc-muted);border-radius:6px}
.mgc-faqlist--page .mgc-faq__q{
  gap:6px;min-height:60.6px;padding:8px 24px;background:#F4F4F6;font-size:21.6px;font-weight:700;
}
.mgc-faqlist--page .mgc-faq__mark{color:inherit;font-size:inherit;font-family:inherit;line-height:1.6}
.mgc-faqlist--page .mgc-faq__a{
  padding:16px 24px 18px;background:#fff;border-top:1.73px solid var(--mgc-muted);
  font-size:21.6px;font-weight:700;line-height:1.6;
}

/* ============================================================
   不具合時の確認手順（/support/trouble/）
   確認用PDF 6.アフターサポート_不具合確認手順.pdf ／ 6.確認手順2〜7.pdf
   実測：カード 431px→269px ／ 本体 1289px→803px ／ サイド 541px→337px
   ============================================================ */

.mgc-section--trouble{padding:46px 0 60px}

/* ---- 構成選択カード ---- */
.mgc-stepgrid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:70px 32px;margin:34px 0 56px;align-items:stretch;
}
.mgc-stepcard{
  position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;
  background:#fff;border:3px solid var(--mgc-amber);border-radius:18px;
  padding:44px 16px 22px;
}
.mgc-stepcard__no{
  position:absolute;top:-31px;left:50%;transform:translateX(-50%);
  width:62px;height:62px;border-radius:50%;display:grid;place-items:center;
  background:var(--mgc-french);color:#fff;font-weight:700;font-size:47.6px;line-height:1;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
.mgc-stepcard__title{
  color:var(--mgc-french);font-size:19px;font-weight:700;line-height:1.45;
  margin-bottom:14px;letter-spacing:.01em;font-feature-settings:"palt" 1;
}
.mgc-stepcard__thumb{
  display:grid;place-items:center;width:100%;min-height:150px;margin-bottom:14px;flex:1 1 auto;
}
.mgc-stepcard__thumb img{max-width:100%;max-height:150px;width:auto;height:auto;display:block}
.mgc-stepcard__desc{
  font-size:13.8px;font-weight:700;line-height:1.5;color:var(--mgc-ink);margin-bottom:16px;
}
.mgc-stepcard .mgc-btn{border-radius:999px;margin-top:auto;min-width:150px}

/* 元デザイン：310×487pt・#FFFAE5・枠4pt #FBBF24・見出し23pt #FB923C・本文16pt */
.mgc-stepnote{
  background:#FFFAE5;border:3.5px solid var(--mgc-amber);border-radius:18px;
  padding:26px 20px;text-align:center;align-self:stretch;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
}
.mgc-stepnote__icon{display:block;margin-bottom:16px;color:var(--mgc-french)}
.mgc-stepnote h3{color:var(--mgc-orange);font-size:19.9px;margin-bottom:10px}
/* 元デザイン 16pt/行送り24pt */
.mgc-stepnote p{font-size:13.8px;line-height:1.5;color:var(--mgc-ink)}

/* ---- 確認表レイアウト ---- */
.mgc-troublelayout{
  display:grid;grid-template-columns:minmax(0,1fr) 337px;gap:36px;align-items:start;
  scroll-margin-top:24px;
}

.mgc-tsheet{
  background:#fff;border:1px solid #E4E6EB;border-radius:20px;padding:34px 30px 30px;
}
.mgc-tsheet__title{
  color:var(--mgc-french);font-size:clamp(20px,2.2vw,27px);font-weight:700;
  line-height:1.4;margin-bottom:22px;font-feature-settings:"palt" 1;
}
.mgc-tsheet__head{display:flex;gap:24px;align-items:flex-start;justify-content:space-between}
.mgc-tsheet__meta{flex:1 1 auto;min-width:0}
.mgc-tmeta{display:flex;gap:18px;align-items:flex-start;margin-bottom:14px}
.mgc-tbadge{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  min-width:104px;padding:7px 14px;border-radius:6px;color:#fff;font-weight:700;font-size:15.6px;
}
.mgc-tbadge--navy{background:var(--mgc-french)}
.mgc-tbadge--orange{background:#F2994A}
.mgc-tlist{margin:0;padding:0;list-style:none}
.mgc-tlist li{
  position:relative;padding-left:1.15em;font-size:17.3px;font-weight:500;line-height:1.5;color:var(--mgc-ink);
}
.mgc-tlist li::before{content:"◯";position:absolute;left:0;top:0;font-size:.85em;color:var(--mgc-ink)}
.mgc-tsymptom{font-size:17.3px;font-weight:500;line-height:1.5;color:var(--mgc-ink);padding-top:2px}

.mgc-tfig{flex:0 0 auto;text-align:center;margin:0}
.mgc-tfig img{width:150px;height:auto;display:block}
.mgc-tfig figcaption{font-size:13px;color:var(--mgc-ink);margin-top:6px}

.mgc-tnote{
  display:flex;gap:20px;align-items:center;justify-content:space-between;
  background:#FFFAE5;border:1px solid var(--mgc-amber);border-radius:10px;
  padding:18px 22px;margin:18px 0 24px;
}
.mgc-tnote h3{color:var(--mgc-orange);font-size:15px;margin-bottom:6px}
.mgc-tnote .mgc-tlist li{font-size:14px;line-height:1.75}
.mgc-tnote__fig{flex:0 0 auto;width:242px;height:auto}

/* ---- 確認項目・判定 ---- */
.mgc-tchecks{border:1px solid #DCE3EF;border-radius:4px;overflow:hidden}
.mgc-tchecks--result{margin-top:14px}
.mgc-tcheck{display:grid;grid-template-columns:38% minmax(0,1fr);border-top:1px solid #DCE3EF}
.mgc-tcheck:first-child{border-top:0}
.mgc-tcheck__q{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center;
  background:var(--mgc-card-blue);padding:20px 18px;
}
/* 元デザイン：質問文16pt Bold #1F2937 */
.mgc-tcheck__q p{font-size:13.8px;font-weight:700;line-height:1.5;color:var(--mgc-ink)}
/* 元デザイン：質問番号は HelveticaNeue 25pt #1E3A8A（丸囲みなし） */
.mgc-tnum{
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;
  border:1.5px solid var(--mgc-french);color:var(--mgc-french);font-weight:700;font-size:21.6px;background:#fff;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1;
}
.mgc-tcheck__a{
  background:#fff;padding:20px 18px;display:flex;flex-direction:column;justify-content:center;gap:12px;
}
.mgc-tbranch{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:10px;align-items:center}
/* 元デザイン：はい・いいえ 18pt／→ 24pt／遷移先 16〜23pt Bold */
.mgc-tchip{
  display:inline-flex;align-items:center;justify-content:center;min-width:74px;
  padding:5px 12px;border-radius:5px;color:#fff;font-weight:500;font-size:15.6px;
}
.mgc-tchip--yes{background:var(--mgc-royal)}
.mgc-tchip--no{background:#F2994A}
.mgc-tarrow{color:var(--mgc-royal);font-weight:700;font-size:20.8px;line-height:1}
.mgc-tgoto{font-size:13.8px;font-weight:700;color:var(--mgc-ink);line-height:1.6}
/* 元デザイン：丸囲み数字23pt・「へ」16pt。数字だけを大きくして視認性を上げる */
.mgc-tgoto__no{font-size:19.9px;font-weight:700;line-height:1;letter-spacing:0;vertical-align:-.06em}
.mgc-tgoto--text{font-size:14.7px}

.mgc-tcheck__a--result{align-items:flex-start;gap:10px}
.mgc-tcheck__a--result p{font-size:13.8px;font-weight:700;line-height:1.5;color:var(--mgc-ink)}

.mgc-tmorewrap{text-align:center;margin:16px 0 4px}

.mgc-tresulthead{display:flex;align-items:center;gap:16px;margin:30px 0 0;font-size:14.5px;color:var(--mgc-ink)}

.mgc-tfoot{
  background:#F6F7F9;border:1px solid var(--mgc-royal);border-radius:10px;
  padding:22px 24px;margin-top:26px;text-align:center;
}
.mgc-tfoot h3{color:var(--mgc-french);font-size:16px;margin-bottom:10px}
.mgc-tfoot p{font-size:13.1px;line-height:1.85;color:var(--mgc-ink);margin-bottom:14px}

/* ---- サイドナビ ---- */
.mgc-troubleside{
  position:sticky;top:20px;background:#fff;border:1px solid #E4E6EB;border-radius:20px;padding:26px 22px;
}
.mgc-troubleside__title{color:var(--mgc-french);font-size:15.6px;margin-bottom:16px}
.mgc-troublenav{margin:0 0 20px;padding:0;list-style:none;display:grid;gap:10px}
.mgc-troublenav button{
  width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;
  padding:12px 14px;border:1.5px solid var(--mgc-royal);border-radius:10px;background:#fff;
  font-size:14px;line-height:1.45;color:var(--mgc-royal);font-weight:700;text-align:left;
  cursor:pointer;font-family:inherit;
}
.mgc-troublenav button:hover{background:var(--mgc-card-blue)}
.mgc-troublenav button.is-current{background:var(--mgc-card-blue)}
.mgc-troublenav__no{
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  border:1.5px solid var(--mgc-royal);color:var(--mgc-royal);font-weight:700;font-size:13px;background:#fff;
}
/* 元デザイン：見出し20pt #1E3A8A・アイコン（吹き出し＋？）付き */
.mgc-hintbox{
  background:#FFFAE5;border-radius:12px;padding:18px 20px;margin-bottom:0;text-align:center;
}
.mgc-hintbox__icon{display:block;margin-bottom:10px;color:var(--mgc-french)}
.mgc-hintbox h3{color:var(--mgc-french);font-size:17.3px;margin-bottom:8px}
/* 元デザイン 16pt/行送り30pt */
.mgc-hintbox p{font-size:13.8px;line-height:1.875;color:var(--mgc-ink);text-align:left}

@media (max-width:1100px){
  .mgc-troublelayout{grid-template-columns:1fr}
  .mgc-troubleside{position:static}
  .mgc-troublenav{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1024px){
  .mgc-stepgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:768px){
  .mgc-tsheet{padding:24px 18px}
  .mgc-tcheck{grid-template-columns:1fr}
  .mgc-tsheet__head{flex-direction:column}
  .mgc-tnote{flex-direction:column;align-items:flex-start}
  .mgc-tnote__fig{width:200px}
  .mgc-tmeta{flex-direction:column;gap:8px}
}
@media (max-width:600px){
  .mgc-stepgrid{grid-template-columns:1fr;gap:60px 20px}
  .mgc-troublenav{grid-template-columns:1fr}
}

/* ============================================================
   活用のヒント（/case/hints/）
   確認用PDF 4.導入事例_活用のヒント.pdf 実測値
   デザイン内容幅 1364px → wrap 1180px（K=0.865）
   カード 890×834(100dpi) → 554×519px／段間 68.5px
   ============================================================ */

.mgc-section--hints{padding:44px 0 56px}

.mgc-hintsec{margin-bottom:70px}
.mgc-hintsec:last-child{margin-bottom:0}

/* 業界バー：アイコンは帯の外・左側に置く（デザイン準拠） */
.mgc-hintbar{
  display:grid;grid-template-columns:98px minmax(0,1fr);
  align-items:center;gap:30px;margin-bottom:44px;
}
.mgc-hintbar__icon{
  display:grid;place-items:center;width:98px;height:98px;
  color:var(--mgc-royal);
}
.mgc-hintbar__icon .mgc-i{width:88px;height:88px}
.mgc-hintbar__name{
  display:flex;align-items:center;min-height:51px;
  background:var(--mgc-royal);color:#fff;border-radius:26px;
  padding:0 30px;font-weight:700;font-size:26px;letter-spacing:.04em;line-height:1.4;
  font-feature-settings:"palt" 1;
}

.mgc-hintsec__grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:42px 68px;align-items:start;
}

.mgc-scene{text-align:center}
.mgc-scene__thumb{
  display:block;overflow:hidden;border-radius:16px;
  border:1px solid #BEBFC5;background:#fff;
}
.mgc-scene__thumb img{display:block;width:100%;height:auto;aspect-ratio:890 / 834;object-fit:cover}
.mgc-scene__title{
  color:var(--mgc-orange);font-weight:700;font-size:24px;line-height:1.45;
  letter-spacing:0;margin:22px 0 0;font-feature-settings:"palt" 1;
}
.mgc-scene__desc{
  color:var(--mgc-ink);font-size:14.6px;line-height:1.83;margin:13px 0 0;
  font-feature-settings:"palt" 1;
}

.mgc-hintsec__more{margin-top:34px;text-align:center}
/* セクションの大きさに合わせて拡大（他セクションとのバランス） */
.mgc-hintsec__more .mgc-btn{
  min-width:min(346px,100%);min-height:51.9px;font-size:17.3px;padding:8px 28px;border-width:1.73px;
}

@media (max-width:900px){
  .mgc-hintbar{grid-template-columns:64px minmax(0,1fr);gap:16px;margin-bottom:28px}
  .mgc-hintbar__icon{width:64px;height:64px}
  .mgc-hintbar__icon .mgc-i{width:56px;height:56px}
  .mgc-hintbar__name{font-size:18px;padding:0 22px;min-height:44px}
  .mgc-hintsec__grid{gap:32px}
  .mgc-scene__title{font-size:21px;margin-top:20px}
  .mgc-scene__desc{font-size:14.5px}
  .mgc-hintsec{margin-bottom:48px}
}
@media (max-width:640px){
  .mgc-hintsec__grid{grid-template-columns:1fr}
}

/* ============================================================
   製品組み合わせ（/product/combination/）
   確認用PDF 3.製品一覧_製品組み合わせ.pdf 実測値
   表幅 1889px → 1180px（K=0.865）／見出し列 139px
   タブレット8列 129.5px ／ スマホ6列 172.5px
   ============================================================ */

.mgc-pagehead__row{display:flex;align-items:baseline;gap:32px;flex-wrap:wrap}
.mgc-pagehead__row .mgc-pagehead__lead{margin:0}

.mgc-combihead{
  display:grid;grid-template-columns:auto auto minmax(0,1fr);
  align-items:center;gap:0 26px;margin-bottom:22px;
}
.mgc-combihead--gap{margin-top:62px}
.mgc-combihead__icon{display:grid;place-items:center;width:70px;color:var(--mgc-french)}
.mgc-combihead__icon .mgc-vi{width:auto;height:auto;max-width:100%;margin:0}
.mgc-combihead__icon .mgc-i--device-tablet{width:70px;height:101px}
.mgc-combihead__icon .mgc-i--device-phone{width:51px;height:97px}
.mgc-combihead__title{
  color:var(--mgc-orange);font-weight:700;font-size:clamp(24px,3vw,34.6px);
  letter-spacing:.01em;line-height:1.3;font-feature-settings:"palt" 1;
}
/* 元デザイン 20pt Bold・リンク部のみ #2563EB */
.mgc-combihead__note{font-size:17.3px;font-weight:700;color:var(--mgc-ink);line-height:1.5}
.mgc-combihead__note a{color:var(--mgc-royal);font-weight:700;text-decoration:none}
.mgc-combihead__note a:hover{text-decoration:underline}

.mgc-combiscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mgc-combi{
  width:100%;min-width:1000px;border-collapse:collapse;
  table-layout:fixed;background:#fff;
}
.mgc-combi td,.mgc-combi th{border:1.73px solid #E5E7EB;vertical-align:middle}
.mgc-combi th[scope=row]{
  background:var(--mgc-french);color:#fff;
  font-weight:700;font-size:15.6px;line-height:1.5;text-align:center;padding:8px 4px;
}
/* 元デザイン行高：ジャケット/充電方法 85pt・設置スタンド200pt・TYPE帯50pt・組み合わせ内容400pt */
.mgc-combi__th--tall{height:auto}
.mgc-combi--tablet .mgc-combi__r1 td,.mgc-combi--tablet .mgc-combi__r1 th{height:73.5px;padding-top:0;padding-bottom:0}
.mgc-combi--tablet tr:nth-child(3) td{height:173px}
.mgc-combi--tablet .mgc-combi__setrow td,.mgc-combi--tablet .mgc-combi__setrow th{height:346px}
.mgc-combi--phone .mgc-combi__conrow td{height:30.3px}
.mgc-combi--phone tr:nth-child(2) td{height:129.8px}
.mgc-combi--phone tr:nth-child(3) td{height:129.8px}
.mgc-combi--phone .mgc-combi__setrow td,.mgc-combi--phone .mgc-combi__setrow th{height:320px}
.mgc-combi td{padding:8px 6px;text-align:center}

.mgc-combicell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.mgc-combicell--split{
  display:grid;grid-template-columns:minmax(0,1fr);align-items:center;
  min-height:57.5px;padding-left:6px;
}
.mgc-combicell--split > .mgc-combipill{grid-area:1 / 1;justify-self:start}
.mgc-combicell--split > .mgc-combiimg{grid-area:1 / 1;justify-self:center}
.mgc-combicell--offset > .mgc-combiimg{justify-self:end;margin-right:17%}
/* 元デザイン 14pt Medium・行送り15pt */
.mgc-combicell__label{font-size:12.1px;font-weight:500;line-height:1.0714;color:var(--mgc-ink)}

.mgc-combipill{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  border-radius:999px;color:#fff;font-weight:700;font-size:12.1px;min-height:31.1px;
  padding:0 20px;letter-spacing:.02em;white-space:nowrap;
}
.mgc-combipill--royal{background:var(--mgc-royal);min-width:181.6px}
/* 元デザインは #FB923C */
.mgc-combipill--amber{background:var(--mgc-orange);min-width:181.6px}

.mgc-combiimg{display:block;max-width:100%;height:auto;margin:0 auto}

.mgc-combi__typerow td{
  background:var(--mgc-royal);color:#fff;font-weight:700;font-size:12.1px;
  height:43.25px;padding:6px 4px;border-color:#fff;
}
.mgc-combi__conrow td{
  background:var(--mgc-bg-soft);font-size:12.1px;font-weight:700;height:30.3px;
}
.mgc-combi__setrow th[scope=row]{background:var(--mgc-bg-soft);color:var(--mgc-french)}
.mgc-combi__setrow td{padding:16px 6px;vertical-align:top}

.mgc-combicta{margin-top:46px}

@media (max-width:900px){
  .mgc-combihead{grid-template-columns:auto minmax(0,1fr);gap:0 16px}
  .mgc-combihead__note{grid-column:1 / -1;margin-top:8px}
  .mgc-combihead__icon{width:46px}
  .mgc-combihead__icon .mgc-i--device-tablet{width:46px;height:66px}
  .mgc-combihead__icon .mgc-i--device-phone{width:34px;height:65px}
  .mgc-combihead--gap{margin-top:44px}
}

/* ============================================================
   規約・方針ページ（利用規約／プライバシー／情報セキュリティ／反社）
   確認用PDF 8.*.pdf 実測値
   ============================================================ */

.mgc-pagehead--legal{position:relative;overflow:hidden;padding:76px 0 84px}
.mgc-pagehead--legal > .mgc-wrap{position:relative;z-index:1}
/* 英字サブコピー：元デザイン 24pt HelveticaNeue-Bold #2563EB → 20.8px */
.mgc-pagehead__eve{
  color:var(--mgc-royal);font-weight:700;font-size:20.8px;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  letter-spacing:.02em;margin-bottom:6px;line-height:1.3;
}
/* 日本語タイトル：元デザイン 45pt Bold #1E3A8A → 38.9px */
.mgc-pagehead--legal h1{font-size:clamp(26px,3.3vw,38.9px);line-height:1.35;color:var(--mgc-french)}
.mgc-pagehead__mark{
  position:absolute;right:6%;top:50%;transform:translateY(-50%);
  width:241px;height:241px;border-radius:50%;
  background:url(../img/magconn-mark.png) no-repeat center/contain;
  opacity:.5;pointer-events:none;filter:brightness(0) invert(1);
}

/* 元デザインはページ地が白、本文ブロックが #F4F4F6。実装で反転していたのを戻す。 */
.mgc-section--legal{background:#fff;padding:56px 0 72px}
.mgc-doccard{
  background:var(--mgc-card-grey);border:0;border-radius:16px;
  padding:52px 34px;color:var(--mgc-ink);
}
.mgc-doccard > *:first-child{margin-top:0}
/* 元デザイン 20pt/行送り35pt */
.mgc-doccard p{font-size:17.3px;line-height:1.75;margin:0 0 22px}
/* 「第1条」など：元デザイン 30pt Bold #1E3A8A → 25.9px */
.mgc-doccard h2{
  color:var(--mgc-french);font-weight:700;font-size:clamp(20px,2.2vw,25.9px);
  line-height:1.5;margin:38px 0 12px;letter-spacing:.02em;
}
.mgc-doccard h3{color:var(--mgc-french);font-size:18px;margin:26px 0 10px}
.mgc-doccard ul{margin:0 0 22px;padding-left:1.2em;list-style:none}
.mgc-doccard ul li{
  position:relative;font-size:17.3px;line-height:1.75;padding-left:1.1em;
}
.mgc-doccard ul li::before{
  content:"◯";position:absolute;left:0;top:0;color:var(--mgc-royal);font-size:.85em;
}
.mgc-doccard ol{margin:0 0 22px;padding-left:1.6em}
.mgc-doccard ol li{font-size:17.3px;line-height:1.75}
.mgc-doccard a{color:var(--mgc-royal);text-decoration:underline}
.mgc-doccard__sign{text-align:right;margin-top:40px;line-height:1.9;font-size:15px}

@media (max-width:768px){
  .mgc-pagehead--legal{padding:44px 0 48px}
  .mgc-pagehead__mark{width:150px;right:-30px;opacity:.35}
  .mgc-pagehead__eve{font-size:16px}
  .mgc-doccard{padding:30px 20px;border-radius:12px}
  .mgc-doccard p,.mgc-doccard ul li,.mgc-doccard ol li{font-size:16px;line-height:1.8}
}

/* ============================================================
   フェーズ3 FV（ファーストビュー）
   デザイン: フェーズ3_FV関連/1.トップページ_FV.pdf ほか
   ============================================================ */

/* ---- トップページ：スライド2（青帯）／スライド4（中央） ---- */
/* スライド2：全幅の青帯（デザイン y=1766.8〜1826.8pt、白37pt）。 */
.mgc-hero__slide--band .mgc-hero__eyebrow,
.mgc-hero__slide--band .mgc-hero__lead,
.mgc-hero__slide--center .mgc-hero__title,
.mgc-hero__slide--center .mgc-hero__lead{text-align:center}
.mgc-hero__slide--band .mgc-hero__lead{color:#fff}
.mgc-hero__slide--band .mgc-hero__eyebrow{
  text-shadow:0 0 14px rgba(255,255,255,.9),0 0 26px rgba(255,255,255,.7);
}
/* 青帯は矩形そのもの（帯上端からベースラインまで42.19pt＝1.1403em）。
   行ボックス上端までの1.02em を引いた分を padding で送る。 */
.mgc-hero__slide--band .mgc-hero__title{
  left:0;right:0;top:var(--ty-b);height:var(--bh);box-sizing:border-box;
  display:flex;align-items:flex-start;justify-content:center;padding-top:.1203em;
  color:#fff;background:var(--mgc-french);
  font-size:clamp(15px,1.9271vw,37px);line-height:1.2;text-shadow:none;
}
.mgc-hero__slide--center .mgc-hero__title{left:0;right:0}

/* ---- 下層ページ共通FV（2.Magconnとは / 4.導入事例 / 7.会社概要） ---- */
.mgc-fv{
  position:relative;overflow:hidden;background:#fff;
  aspect-ratio:1920 / 784;
}
.mgc-fv__band{
  position:absolute;left:0;right:0;top:1.5306%;height:98.4694%;
  overflow:hidden;z-index:0;
}
.mgc-fv__img{position:absolute;height:auto;max-width:none;pointer-events:none}
/* 4.導入事例のクリーム色のかぶせ（#FFFAE5／デザイン y=489〜789pt・幅1638pt） */
.mgc-fv__wash{
  position:absolute;left:0;top:0;bottom:0;width:85.3125%;
  background:linear-gradient(90deg,rgba(255,250,229,.72) 0%,rgba(255,250,229,.5) 38%,rgba(255,250,229,.12) 78%,rgba(255,250,229,0) 100%);
}
.mgc-fv__inner{position:absolute;inset:0;z-index:2;pointer-events:none}
.mgc-fv__title,
.mgc-fv__eyebrow,
.mgc-fv__lead{position:absolute;left:var(--tx);right:var(--tx);margin:0}
/* 元デザイン 52pt Bold #1E3A8A・行送り64pt */
.mgc-fv__title{
  top:calc(var(--ty-t) - 1.0355em); /* 1.231/2 + 0.42 */
  color:var(--mgc-french);font-weight:700;
  font-size:clamp(20px,2.7083vw,52px);line-height:1.231;letter-spacing:.01em;
  font-feature-settings:"palt" 1;
}
/* 元デザイン 34pt Bold #2563EB */
.mgc-fv__eyebrow{
  top:calc(var(--ty-e) - .9265em); /* 1.16/2 + 0.3465 */
  color:var(--mgc-royal);font-weight:700;
  font-size:clamp(14px,1.7708vw,34px);line-height:1.16;letter-spacing:.02em;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
/* 元デザイン 24pt #1F2937 */
.mgc-fv__lead{
  top:calc(var(--ty-l) - 1.17em); /* 1.5/2 + 0.42 */
  color:var(--mgc-ink);font-size:clamp(12px,1.25vw,24px);line-height:1.5;
}
/* 画像を枠いっぱいに敷く（アスペクトが合わない支給画像用） */
/* 支給画像を右寄せ・高さいっぱいに置く場合（現在は未使用） */
.mgc-fv__img--cover{width:auto;max-width:none;height:100%}
/* 2.Magconnとは（フェーズ3_FV関連）：タイトルは白・47pt、英字は34pt */
.mgc-fv--magconn .mgc-fv__title{
  color:#fff;font-size:clamp(19px,2.4479vw,47px);line-height:1.17;
  top:calc(var(--ty-t) - 1.005em);
}
/* 4.導入事例：リード行送り45pt */
.mgc-fv--case .mgc-fv__lead{line-height:1.875;top:calc(var(--ty-l) - 1.3575em)}

/* ---- 保証期間ガントチャート（6.アフターサポート_保証について.pdf 実測） ----
   枠 x379.7/589.7/1559.7・縦線 y1499.8〜1848.4／ラベル箱 480×70pt・バー 高さ50pt
   クリーム箱 200×270pt・角丸10pt／横軸 y1545.9（左オレンジ・右 #1F2937） */
.mgc-wgantt{margin:30px 0 34px}
.mgc-wgantt__top{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:0 0 6px}
/* 元デザイン 140×70pt・#2563EB・白20pt */
.mgc-wgantt__pill{
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  min-width:121.1px;min-height:60.6px;background:var(--mgc-royal);color:#fff;border-radius:999px;
  padding:6px 16px;font-weight:700;font-size:17.3px;line-height:1.35;
}
.mgc-wgantt__day{
  font-weight:700;font-size:17.3px;color:var(--mgc-ink);position:relative;padding-bottom:20px;
}
.mgc-wgantt__day::after{
  content:"";position:absolute;left:-8.65px;bottom:0;width:17.3px;height:17.3px;
  border-radius:50%;background:var(--mgc-ink);
}
.mgc-wgantt__grid{
  position:relative;display:grid;grid-template-columns:181.6px minmax(0,1fr);align-items:stretch;
  border-left:1.73px dashed var(--mgc-french);border-right:1.73px dashed var(--mgc-french);
  padding:58.7px 0 9.3px;
}
/* 中央の縦線 */
.mgc-wgantt__grid::before{
  content:"";position:absolute;left:181.6px;top:0;bottom:0;border-left:1.73px dashed var(--mgc-french);
}
/* 右端の● */
.mgc-wgantt__grid::after{
  content:"";position:absolute;right:-8.6px;top:-8.6px;width:17.3px;height:17.3px;
  border-radius:50%;background:var(--mgc-ink);
}
.mgc-wgantt__initial{position:relative;display:flex}
.mgc-wgantt__initialbox{
  flex:1 1 auto;margin:0 4.3px;background:#FFFAE5;border-radius:8.7px;
  display:flex;flex-direction:column;justify-content:center;gap:26px;text-align:center;padding:10px 6px;
}
.mgc-wgantt__within{color:var(--mgc-orange);font-weight:700;font-size:17.3px;line-height:1.45;margin:0}
.mgc-wgantt__replace{color:var(--mgc-ink);font-weight:700;font-size:17.3px;line-height:1.45;margin:0}
/* 横軸（左：オレンジ／右：#1F2937・両端矢印） */
.mgc-wgantt__axis{
  position:absolute;left:0;right:10px;top:-18.8px;height:0;
  border-top:1.73px solid var(--mgc-ink);
}
.mgc-wgantt__axis::before,.mgc-wgantt__axis::after{
  content:"";position:absolute;top:-4.7px;width:0;height:0;border:5.2px solid transparent;
}
.mgc-wgantt__axis::before{left:-1px;border-right-color:var(--mgc-ink);border-left:0}
.mgc-wgantt__axis::after{right:-1px;border-left-color:var(--mgc-ink);border-right:0}
.mgc-wgantt__axis--orange{left:0;right:6px;border-top-color:var(--mgc-orange)}
.mgc-wgantt__axis--orange::before{display:none}
.mgc-wgantt__axis--orange::after{
  top:-7.5px;border-width:7.5px;border-left-color:var(--mgc-orange);border-right:0;
}
.mgc-wgantt__track{position:relative;padding-left:8.6px}
.mgc-wgantt__caption{
  position:absolute;left:8.6px;right:0;top:-56px;text-align:center;
  font-weight:700;font-size:19px;color:var(--mgc-ink);margin:0;line-height:1.4;
}
.mgc-wgantt__caption span{font-weight:700;font-size:13px}
.mgc-wgantt__row{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:0;align-items:center;margin-bottom:26px;
}
.mgc-wgantt__row:last-child{margin-bottom:0}
/* 元デザイン 480×70pt・角丸10pt・枠2pt */
.mgc-wgantt__label{
  display:flex;align-items:center;min-height:60.6px;padding:8px 18px;
  border-radius:8.7px 0 0 8.7px;font-size:13.8px;font-weight:700;line-height:1.5;color:var(--mgc-ink);
}
.mgc-wgantt__label--amber{background:#FFFAE5;border:1.73px solid var(--mgc-orange);border-right:0}
.mgc-wgantt__label--royal{background:#EDF2FB;border:1.73px solid var(--mgc-royal);border-right:0}
.mgc-wgantt__barwrap{display:flex;align-items:center;min-width:0;min-height:60.6px}
/* 元デザイン バー 高さ50pt・白20pt・右寄せ */
.mgc-wgantt__bar{
  display:flex;align-items:center;justify-content:flex-end;min-height:43.25px;
  padding:0 14px;color:#fff;font-weight:700;font-size:17.3px;border-radius:0 8.7px 8.7px 0;
}
.mgc-wgantt__bar--amber{background:var(--mgc-orange)}
.mgc-wgantt__bar--royal{background:var(--mgc-royal)}

@media (max-width:768px){
  .mgc-wgantt__grid{grid-template-columns:1fr;padding-top:74px}
  .mgc-wgantt__grid::before{display:none}
  .mgc-wgantt__initial{margin-bottom:20px}
  .mgc-wgantt__initialbox{flex-direction:row;justify-content:center;gap:20px;padding:14px 10px}
  .mgc-wgantt__axis--orange{display:none}
  .mgc-wgantt__track{padding-left:0}
  .mgc-wgantt__caption{top:-70px;left:0}
  .mgc-wgantt__row{grid-template-columns:1fr}
  .mgc-wgantt__label{border-radius:8.7px 8.7px 0 0;border-right:1.73px solid}
  .mgc-wgantt__label--amber{border-right-color:var(--mgc-orange);border-bottom:0}
  .mgc-wgantt__label--royal{border-right-color:var(--mgc-royal);border-bottom:0}
  .mgc-wgantt__bar{border-radius:0 0 8.7px 8.7px;min-height:40px;justify-content:center}
}

/* ============================================================
   不具合ご連絡フォーム（/support/trouble-form/）
   デザイン: 確認用PDF/6.アフターサポート_不具合フォーム.pdf
   ============================================================ */

.mgc-pagehead--form{padding:54px 0 46px}
.mgc-pagehead--form h1{margin-bottom:22px}
.mgc-pagehead--form .mgc-pagehead__lead{
  margin:0 auto 20px;max-width:64em;font-size:clamp(13.5px,1.2vw,17px);line-height:1.8;
}
.mgc-pagehead__alert{
  color:var(--mgc-orange);font-weight:700;font-size:clamp(13.5px,1.2vw,17px);line-height:1.8;
}
.mgc-section--form{padding:10px 0 64px}

/* ---- STEP フロー ---- */
.mgc-flow{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0 34px;margin:30px 0 46px;padding:0;list-style:none;
}
.mgc-flow__item{
  position:relative;background:#fff;border:2.87px solid var(--mgc-royal);border-radius:13.8px;
  padding:19px 12px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;
}
.mgc-flow__item--orange{border-color:var(--mgc-orange)}
.mgc-flow__item:not(:last-child)::after{
  content:"";position:absolute;top:50%;right:-25px;transform:translateY(-50%);
  width:0;height:0;border-style:solid;border-width:11px 0 11px 15px;
  border-color:transparent transparent transparent var(--mgc-amber);
}
.mgc-flow__num{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:103.8px;min-height:32.9px;
  background:var(--mgc-royal);color:#fff;border-radius:999px;
  padding:2px 18px;font-weight:700;font-size:17.3px;letter-spacing:.04em;
}
.mgc-flow__item--orange .mgc-flow__num{background:var(--mgc-orange)}
/* 元デザイン 20pt Bold（お客様＝#FB923C／弊社＝#1E3A8A） */
.mgc-flow__who{font-weight:700;font-size:17.3px;color:var(--mgc-french);margin-top:8px}
.mgc-flow__item--orange .mgc-flow__who{color:var(--mgc-orange)}
/* 元デザイン：アイコン枠108pt・線 #1E3A8A 2pt・寸法は1枚ずつ異なる */
.mgc-flow__icon{display:grid;place-items:center;height:107px;margin:8px 0 10px;color:var(--mgc-french)}
.mgc-flow__icon img{width:auto;height:74px;display:block}
.mgc-flow__icon .mgc-vi{width:auto;height:auto;max-width:100%;max-height:100%;margin:0}
.mgc-flow__name{
  color:var(--mgc-royal);font-weight:700;font-size:17.3px;line-height:1.45;margin-bottom:8px;
  font-feature-settings:"palt" 1;
}
.mgc-flow__item--orange .mgc-flow__name{color:var(--mgc-orange)}
/* 元デザイン 17pt Medium・行送り28pt */
.mgc-flow__desc{font-size:14.7px;font-weight:500;line-height:1.646;color:var(--mgc-ink)}

/* ---- ご注意事項ボックス（フォームパネル内） ---- */
.mgc-cautionbox{
  background:#fff;border:2px solid var(--mgc-royal);border-radius:12px;
  padding:22px 26px 24px;margin:34px 0 0;
}
.mgc-cautionbox h3{
  display:flex;align-items:center;gap:10px;
  color:var(--mgc-orange);font-size:19px;margin-bottom:14px;
}
.mgc-cautionbox__mark{
  display:grid;place-items:center;width:26px;height:26px;border-radius:50%;
  background:var(--mgc-orange);color:#fff;font-size:16px;font-weight:700;line-height:1;
}
.mgc-cautionbox ul{margin:0;padding:0;list-style:none}
.mgc-cautionbox li{
  position:relative;padding-left:1.2em;font-size:13.5px;line-height:1.8;
  color:var(--mgc-ink);margin-bottom:8px;
}
.mgc-cautionbox li:last-child{margin-bottom:0}
.mgc-cautionbox li::before{content:"◯";position:absolute;left:0;top:0;font-size:1em;line-height:1.8}

/* ---- 不具合品送付先 ---- */
.mgc-sendbox{
  position:relative;background:#fff;border:1.73px solid var(--mgc-french);border-radius:20.8px;
  padding:31.9px 50.2px 34.6px;margin-top:34px;text-align:left;
}
.mgc-sendbox__title{
  position:static;transform:none;flex:0 0 auto;margin:0 0 0 6.7px;
  display:inline-flex;align-items:center;justify-content:center;
  min-width:224.9px;min-height:51.9px;
  background:var(--mgc-french);color:#fff;border-radius:999px;
  padding:6px 20px;font-weight:700;font-size:22.5px;white-space:nowrap;
}
/* 元デザイン：ラベルは左・住所はその右／注記はボックス内 */
.mgc-sendbox__row{display:flex;align-items:center;gap:34.8px;flex-wrap:wrap}
.mgc-sendbox__body{min-width:0}
.mgc-sendbox__name{font-weight:700;font-size:17.3px;line-height:1.5;color:var(--mgc-ink);margin:0}
.mgc-sendbox__addr{font-weight:700;font-size:17.3px;line-height:1.5;color:var(--mgc-ink);margin:0}
.mgc-sendbox__note{color:var(--mgc-orange);font-weight:700;font-size:15.7px;line-height:1.5;margin:26px 0 0}

/* ---- フォーム部品をデザインに合わせて調整 ---- */
.mgc-formpanel{padding:38px 44px 42px}
.mgc-formpanel__title{font-size:26px;margin-bottom:10px}
.mgc-formpanel__lead{color:var(--mgc-ink);font-size:14.5px;margin-bottom:28px}
.mgc-formrow{gap:0 34px}
.mgc-field{margin-bottom:22px}
.mgc-field label{font-size:14px;margin-bottom:8px}
.mgc-req,.mgc-any{border-radius:5px;padding:2px 10px;font-size:11px}
.mgc-field input[type=text],
.mgc-field input[type=email],
.mgc-field input[type=tel],
.mgc-field input[type=url],
.mgc-field input[type=number],
.mgc-field input[type=date],
.mgc-field select,
.mgc-field textarea{
  border-radius:10px;border-color:#D9DCE3;padding:14px 16px;font-size:15px;
}
.mgc-field textarea{min-height:112px;height:112px}
.mgc-field--tall textarea{min-height:112px;height:112px}

/* ファイル選択ボタン */
.mgc-field--file .mgc-filerow{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.mgc-field input[type=file]{
  font-size:14px;color:transparent;width:auto;
}
.mgc-field input[type=file]::file-selector-button{
  background:#fff;border:1px solid #D9DCE3;border-radius:10px;
  color:var(--mgc-royal);font-weight:700;font-size:15px;font-family:inherit;
  padding:14px 30px 14px 44px;margin-right:14px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5'/%3E%3Cpath d='m6 11 6-6 6 6'/%3E%3Cpath d='M4 21h16'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:18px center;background-size:17px 17px;
}
.mgc-field input[type=file]::file-selector-button:hover{border-color:var(--mgc-royal)}
.mgc-field--file .mgc-hint{
  font-size:14.5px;font-weight:700;color:var(--mgc-ink);margin-top:0;display:inline-block;
}
.mgc-submit{margin-top:34px}
.mgc-submit input[type=submit]{padding:16px 76px;font-size:17px}

@media (max-width:1024px){
  .mgc-flow{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 26px}
  .mgc-flow__item:not(:last-child)::after{display:none}
}
@media (max-width:768px){
  .mgc-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mgc-formpanel{padding:26px 20px 30px}
  .mgc-cautionbox{padding:18px 18px 20px}
  .mgc-sendbox{padding:24px 18px 26px;margin-top:34px}
  .mgc-sendbox__title{font-size:17px;min-width:0;min-height:44px;margin-left:0}
  .mgc-sendbox__row{gap:14px}
  .mgc-sendbox__name,.mgc-sendbox__addr,.mgc-sendbox__note{font-size:14.5px}
  .mgc-pagehead--form .mgc-pagehead__lead br{display:none}
}
@media (max-width:520px){
  .mgc-flow{grid-template-columns:1fr}
}

/* 本文中のテキストリンク（他ページへの誘導） */
.mgc-inlink{
  color:var(--mgc-royal);text-decoration:underline;text-underline-offset:.18em;
  text-decoration-thickness:1px;font-weight:700;
}
.mgc-inlink:hover{color:var(--mgc-orange)}

/* ---- FVのスマホ表示：画像を上、文字を下に積む ----
   ここはFV関連のどの指定よりも後ろに置くこと（同じ詳細度で上書きするため）。 */
@media (max-width:820px){
  .mgc-hero__slide,
  .mgc-fv{aspect-ratio:auto;display:block}
  .mgc-hero__slide{position:absolute;inset:0}
  .mgc-hero__slide.is-active{position:relative;inset:auto}

  /* 高さを vw で確定させる（% 高さを解決させるため aspect-ratio は使わない）。 */
  .mgc-hero__band,
  .mgc-fv__band{position:relative;top:0;left:0;right:0;height:75vw}
  .mgc-hero__col{left:0 !important;width:100% !important}
  .mgc-hero__col:not(:first-child){display:none}
  .mgc-hero__img,
  .mgc-fv__img{
    position:absolute;left:0 !important;top:0 !important;
    width:100% !important;height:100% !important;
    object-fit:cover;object-position:center;
  }
  .mgc-fv__wash{display:none}

  .mgc-hero__inner,
  .mgc-fv__inner{position:relative;inset:auto;padding:24px 20px 30px}
  .mgc-hero__eyebrow,.mgc-hero__title,.mgc-hero__lead,
  .mgc-fv__eyebrow,.mgc-fv__title,.mgc-fv__lead{
    position:relative;left:auto;right:auto;top:auto;text-align:left;
  }
  .mgc-hero__eyebrow,.mgc-fv__eyebrow{margin-bottom:8px}
  .mgc-hero__title,.mgc-fv__title{margin-bottom:12px;line-height:1.45}
  .mgc-hero__lead,.mgc-fv__lead{line-height:1.85}

  /* --ty-* を使う詳細度の高いルールをすべて解除しておく */
  .mgc-hero__slide--band .mgc-hero__title,
  .mgc-hero__slide--center .mgc-hero__title,
  .mgc-fv--magconn .mgc-fv__title,
  .mgc-fv--case .mgc-fv__lead{top:auto}
  .mgc-hero__slide--band .mgc-hero__title{
    height:auto;display:block;padding:12px 16px;text-align:center;
    margin-left:-20px;margin-right:-20px;
  }
  .mgc-hero__slide--band .mgc-hero__eyebrow{text-shadow:none;text-align:center}
  .mgc-hero__slide--band .mgc-hero__lead{color:var(--mgc-ink);text-align:center}
  .mgc-hero__slide--center .mgc-hero__title,
  .mgc-hero__slide--center .mgc-hero__lead{text-align:center}
  .mgc-fv--magconn .mgc-fv__title{color:var(--mgc-french);line-height:1.45}

  .mgc-hero__dots{position:relative;left:auto;right:auto;bottom:auto;padding:0 0 18px}
}


/* ============================================================
   モバイル調整（2026-08-28）
   ・黄色ピルナビ：幅に応じて 1行 / 3+2 / 2+2+1 に整える
   ・5枚並びのカード（業界・選ばれる理由・サポート導線）は2列にし、
     余った1枚は中央に置く
   ============================================================ */

/* ------------------------------------------------------------
   スマホ：固定ボトムナビ（〜820px）
   ・上段はロゴ＋検索＋メニュー（丸ボタン）
   ・黄色いピルナビは非表示
   ・画面下に5つの固定ナビ（お問い合わせを強調）
   ・メニューは下から出るシート
   ------------------------------------------------------------ */
.mgc-bottomnav{display:none}

@media (max-width:820px){
  .mgc-pillnav{display:none}

  .mgc-header__top .mgc-burger{
    flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;
    background:var(--mgc-bg-soft);display:grid;place-items:center;color:var(--mgc-french);
  }
  .mgc-header__top .mgc-burger:hover{background:#DCE4F5}
  .mgc-header__top .mgc-burger[aria-expanded="true"]{background:var(--mgc-french);color:#fff}
  .mgc-search-btn{margin-left:auto}

  /* 固定ナビの分だけ下に余白 */
  body{padding-bottom:calc(66px + env(safe-area-inset-bottom, 0px))}

  .mgc-bottomnav{
    display:grid;grid-template-columns:repeat(5,1fr);gap:4px;
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--mgc-amber);
    box-shadow:0 -2px 16px rgba(15,23,42,.14);
    padding:6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
  }
  .mgc-bottomnav__item{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    min-width:0;padding:7px 2px;border:0;border-radius:10px;background:none;cursor:pointer;
    color:var(--mgc-ink);text-decoration:none;font-family:inherit;
    font-size:10px;font-weight:700;line-height:1.2;letter-spacing:.01em;
    transition:background .2s,color .2s;
  }
  .mgc-bottomnav__item svg{width:22px;height:22px;flex:0 0 auto}
  .mgc-bottomnav__item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .mgc-bottomnav__item:hover{background:rgba(255,255,255,.45);color:var(--mgc-ink)}
  .mgc-bottomnav__item.is-current{background:rgba(255,255,255,.62);color:var(--mgc-french)}
  .mgc-bottomnav__menu[aria-expanded="true"]{background:rgba(255,255,255,.62);color:var(--mgc-french)}

  /* メニューは下から出るシート */
  .mgc-gnav{
    position:fixed;top:auto;left:0;right:0;
    bottom:calc(66px + env(safe-area-inset-bottom, 0px));
    max-height:60vh;overflow-y:auto;z-index:59;
    background:#fff;border-radius:16px 16px 0 0;
    box-shadow:0 -12px 32px rgba(15,23,42,.18);
    padding:10px 20px 16px;
  }
}
@media (max-width:400px){
  .mgc-bottomnav__item{font-size:9.5px;gap:3px}
  .mgc-bottomnav__item svg{width:21px;height:21px}
}

/* 5枚並びのカードは2列（横3列は文字が詰まって読みにくいため） */
@media (max-width:820px){
  .mgc-indgrid,.mgc-strengths,.mgc-supgrid{grid-template-columns:repeat(2,1fr);gap:16px}
  /* 5枚のうち余る1枚は中央に */
  .mgc-indgrid > :last-child:nth-child(odd),
  .mgc-strengths > :last-child:nth-child(odd),
  .mgc-supgrid > :last-child:nth-child(odd){
    grid-column:1 / -1;width:calc(50% - 8px);margin-inline:auto;
  }
  .mgc-indcard,.mgc-supcard,.mgc-strength{min-height:0}
  .mgc-indcard{padding:0 10px 20px}
  .mgc-supcard,.mgc-strength{padding:0 12px 20px}
  .mgc-indcard__icon,.mgc-supcard__icon,.mgc-strength__icon,
  .mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__icon{height:clamp(96px,26vw,140px)}
  .mgc-indcard__icon .mgc-vi,.mgc-supcard__icon .mgc-vi,.mgc-strength__icon .mgc-vi{
    max-width:clamp(70px,20vw,104px);
  }
  /* タイトルは1行に収まる大きさへ。1行/2行が混ざっても高さを揃える */
  .mgc-indcard__name,.mgc-supcard__name{
    font-size:clamp(14px,4vw,18.2px);margin-bottom:10px;min-height:2.4em;
    display:flex;align-items:center;justify-content:center;
  }
  .mgc-strength h3{font-size:clamp(15px,4.4vw,22.5px)}
  .mgc-indcard__desc{font-size:clamp(11.5px,3.2vw,13px)}
  .mgc-indcard__desc br,.mgc-strength p br,.mgc-devcard p br,.mgc-supcard__desc br{display:none}
}

/* ============================================================
   製品カタログダウンロード（2026-09-09 追加ページ）
   デザイン: 6.アフターサポート__製品カタログダウンロード.pdf
   実測（pt×0.865）：カード枠 432×305pt・枠2pt #BEBFC5・列間32pt・行間55pt
   　　　　　　　　　名称24pt Medium・行送り32pt・枠下からの余白32pt
   ============================================================ */

.mgc-catalog{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:48px 26px;
}
.mgc-catalog__link{display:block;color:var(--mgc-ink);text-decoration:none}
.mgc-catalog__thumb{
  display:grid;place-items:center;aspect-ratio:432/305;
  border:1.73px solid var(--mgc-muted);background:#fff;overflow:hidden;
}
.mgc-catalog__thumb img{width:100%;height:100%;object-fit:contain}
.mgc-catalog__thumbicon{display:grid;place-items:center;color:var(--mgc-muted)}
.mgc-catalog__thumbicon .mgc-vi,
.mgc-catalog__thumbicon svg{width:auto;height:56px}
.mgc-catalog__name{
  display:block;margin-top:24px;font-size:20.8px;font-weight:500;line-height:1.33;
  color:var(--mgc-ink);
}
.mgc-catalog__meta{display:block;font-size:20.8px;font-weight:500;line-height:1.33;color:var(--mgc-ink)}
.mgc-catalog__pending{
  margin-left:8px;font-size:14px;font-weight:700;color:var(--mgc-muted);
  border:1px solid var(--mgc-muted);border-radius:999px;padding:1px 10px;vertical-align:.12em;
}
a.mgc-catalog__link:hover .mgc-catalog__thumb{border-color:var(--mgc-royal)}
a.mgc-catalog__link:hover .mgc-catalog__name{color:var(--mgc-royal)}
.mgc-catalog__link.is-pending{cursor:default}
.mgc-catalog__link.is-pending .mgc-catalog__thumb{background:#F8F9FB}
.mgc-catalog__link.is-pending .mgc-catalog__name{color:#6B7280}

@media (max-width:820px){
  .mgc-catalog{grid-template-columns:repeat(2,1fr);gap:36px 20px}
  .mgc-catalog__name,.mgc-catalog__meta{font-size:16px}
}
@media (max-width:520px){
  .mgc-catalog{grid-template-columns:1fr}
}

/* ------------------------------------------------------------
   「必要な◯◯が見つからない場合」ボックス（共通）
   実測：1360×180pt・地 #EDF2FB・角丸24pt
   　　　？アイコン 103×86pt（左から22pt）／見出し38pt Bold #1E3A8A（左から145pt）
   　　　本文24pt Medium・行送り34pt／封筒 76×53pt／ボタン 220×44pt #FB923C・20pt Bold
   ------------------------------------------------------------ */

.mgc-helpbox{
  display:flex;align-items:center;gap:28px;
  background:var(--mgc-bg-soft);border-radius:20.8px;
  min-height:155.7px;padding:22px 32px 22px 20px;
}
.mgc-helpbox__icon{flex:0 0 auto;display:grid;place-items:center;width:88.7px;color:var(--mgc-french)}
.mgc-helpbox__icon .mgc-vi{width:auto;height:74.5px;max-width:100%}
.mgc-helpbox__body{flex:1 1 auto;min-width:0}
.mgc-helpbox__title{
  color:var(--mgc-french);font-size:clamp(21px,2.7vw,32.9px);font-weight:700;
  line-height:1.35;margin:0 0 6px;
}
.mgc-helpbox__lead{font-size:clamp(14px,1.75vw,20.8px);font-weight:500;line-height:1.42;margin:0;color:var(--mgc-ink)}
.mgc-helpbox__action{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.mgc-helpbox__mail{display:grid;place-items:center;color:var(--mgc-french)}
.mgc-helpbox__mail .mgc-vi{width:auto;height:45.8px}
.mgc-btn--help{min-width:190.3px;min-height:38.1px;padding:5px 16px;font-size:17.3px;font-weight:700;border-radius:8px}

@media (max-width:820px){
  .mgc-helpbox{flex-wrap:wrap;gap:16px;padding:20px}
  .mgc-helpbox__icon{width:60px}
  .mgc-helpbox__icon .mgc-vi{height:52px}
  .mgc-helpbox__body{flex:1 1 200px}
  .mgc-helpbox__action{flex:1 1 100%;flex-direction:row;justify-content:center}
  .mgc-helpbox__mail .mgc-vi{height:32px}
}

/* ページヘッダー（中央寄せ・白地）
   元デザインではタイトル周辺に背景色はなく、黄色いナビ帯との間に余白がある。 */
.mgc-pagehead--center.mgc-pagehead--plain{padding:84px 0 44px}
@media (max-width:820px){
  .mgc-pagehead--center.mgc-pagehead--plain{padding:40px 0 26px}
}

/* ---------- 下部CTA（4カード版・2026-09-09 支給デザイン） ----------
   実測：カード325×260pt・枠3.4pt #2563EB・間隔20pt
   　　　見出し22pt Bold #1E3A8A（baseline カード上端+171.4pt）
   　　　ボタン229×36pt #FB923C・文字16pt（top カード上端+194.7pt） */
.mgc-cta__grid--4{grid-template-columns:repeat(4,1fr);gap:17.3px}
.mgc-cta__grid--4 .mgc-cta__card{border-width:2.94px;min-height:224.9px;padding:0 10px 25.3px}
.mgc-cta__grid--4 .mgc-cta__icon{height:111.8px;padding-top:24px}
.mgc-cta__grid--4 .mgc-cta__card h3{
  font-size:clamp(15px,1.72vw,19px);min-height:20.5px;margin:0 0 14.8px;line-height:1.08;
}
.mgc-cta__grid--4 .mgc-cta__card .mgc-btn{
  min-width:0;width:100%;max-width:198.2px;min-height:31.1px;padding:0 10px;font-size:13.84px;
}
@media (max-width:900px){
  .mgc-cta__grid--4{grid-template-columns:repeat(2,1fr);gap:20px}
}
@media (max-width:560px){
  .mgc-cta__grid--4{grid-template-columns:1fr}
}

/* ============================================================
   2026-09-09 支給「Magconnプレビューサイト 追加確認事項」対応
   ============================================================ */

/* ---- 活用のヒント：業種アイコン（#36-40）----
   元デザインは #1E3A8A・線2pt。SVG側の実寸と線幅も実測値に合わせて統一した。 */
.mgc-hintbar{grid-template-columns:116px minmax(0,1fr)}
.mgc-hintbar__icon{width:116px;height:100px;color:var(--mgc-french)}
.mgc-hintbar__icon .mgc-vi{width:auto;height:auto;max-width:100%}
@media (max-width:820px){
  .mgc-hintbar{grid-template-columns:72px minmax(0,1fr)}
  .mgc-hintbar__icon{width:72px;height:64px}
}

/* ---- 不具合ご連絡フォーム：不具合品送付先（#70-72）----
   元デザインどおり、見出し・住所・電話番号・注意書きをセンター揃えに戻す。 */
.mgc-sendbox__row{justify-content:center;text-align:center}
.mgc-sendbox__body{text-align:center}
.mgc-sendbox__note{text-align:center}

/* ---- 取扱説明書・仕様書DL：上部の案内枠（#76-79）----
   元デザイン実測：1360×180pt・地 #EDF2FB・角丸24pt
   アイコン 76.3×96.3pt #1E3A8A 2pt（左端から86.4pt）
   本文 26pt #1F2937・行送り46pt、● は #FBBF24 26pt（本文の32pt左） */
.mgc-noticebox--doc{
  min-height:155.7px;border-radius:20.8px;padding:22px 32px 22px 60px;gap:44px;margin-top:38px;
}
.mgc-noticebox--doc .mgc-noticebox__icon{flex:0 0 auto;display:grid;place-items:center;color:var(--mgc-french)}
.mgc-noticebox--doc .mgc-noticebox__icon .mgc-vi{width:auto;height:83.3px;max-width:none}
.mgc-noticebox--doc ul{margin:0;padding:0;list-style:none}
.mgc-noticebox--doc li{
  padding-left:27.7px;font-size:clamp(15px,1.9vw,22.5px);font-weight:500;line-height:1.769;color:var(--mgc-ink);
}
.mgc-noticebox--doc li::before{
  width:11.3px;height:11.3px;left:0;top:.68em;background:var(--mgc-amber);
}
@media (max-width:820px){
  .mgc-noticebox--doc{padding:20px;gap:16px;min-height:0}
  .mgc-noticebox--doc .mgc-noticebox__icon .mgc-vi{height:52px}
}

/* ---- 不具合時の確認手順：右サイドナビ（#59-63）----
   元デザイン実測（6.確認手順2）：見出し28pt #1E3A8A
   項目ボックス350×48pt・枠1pt #1E3A8A・番号丸25pt・文字18pt、いずれも #1E3A8A
   選択中のみ地 #EDF2FB。項目ピッチ78pt（＝間隔30pt） */
.mgc-troubleside__title{font-size:24.2px;margin-bottom:22px}
.mgc-troublenav{gap:26px}
.mgc-troublenav button{
  border-color:var(--mgc-french);color:var(--mgc-french);
  font-size:15.6px;min-height:41.5px;padding:8px 12px;
}
.mgc-troublenav button:hover,
.mgc-troublenav button.is-current{background:var(--mgc-bg-soft)}
.mgc-troublenav__no{
  width:21.6px;height:21.6px;font-size:12.5px;
  border-color:var(--mgc-french);color:var(--mgc-french);
}

/* ---- アフターサポート：目的別メニューのカード（#46-48）----
   元デザイン実測：カード248×395pt・枠4pt #2563EB・間隔30pt
   アイコン帯は上端+14.6pt〜143.9pt、見出しベースライン+204.5pt、丸矢印 下端から20.8pt */
.mgc-supcard:has(.mgc-supcard__desc){min-height:341.7px;padding:12.6px 4px 18px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__icon{height:111.6px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__icon .mgc-vi{width:auto;height:auto;max-width:100%;max-height:100%}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-i{width:80px;height:80px;margin-bottom:0}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__desc{margin-top:10px;font-size:13.8px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__go{padding-top:10px}

/* ---- お問い合わせ「お問い合わせいただく前に」のアイコン（#42-44）----
   元デザインでは4点とも下端が揃っている（中央揃えではない）。
   実測：アイコン帯 5226.5〜5360.5pt＝134pt、各高さ 112.7 / 93.4 / 123.4 / 123.4pt */
.mgc-info__icon{height:115.9px;place-items:end center}
.mgc-info:nth-child(1) .mgc-info__icon .mgc-vi{height:97.5px;width:auto;max-height:none}
.mgc-info:nth-child(2) .mgc-info__icon .mgc-vi{height:80.8px;width:auto;max-height:none}
.mgc-info:nth-child(3) .mgc-info__icon .mgc-vi{height:106.7px;width:auto;max-height:none}
.mgc-info:nth-child(4) .mgc-info__icon .mgc-vi{height:106.7px;width:auto;max-height:none}

/* ---- 保証について：保証期間の図解（#54-58）----
   元デザイン：製品名ボックス480×70pt・角丸10pt・枠2pt。
   期間バー（50pt）は名前ボックスの「後ろ」から伸びており、両方とも四隅が角丸。
   ボックスを前面に重ねることで、境目に元デザインどおりの丸みが出る。 */
.mgc-wgantt__label{border-radius:8.7px;position:relative;z-index:1}
.mgc-wgantt__label--amber{border:1.73px solid var(--mgc-orange)}
.mgc-wgantt__label--royal{border:1.73px solid var(--mgc-royal)}
.mgc-wgantt__barwrap{position:relative;z-index:0;margin-left:-12px}
.mgc-wgantt__bar{border-radius:8.7px;padding-left:26px}
@media (max-width:820px){
  .mgc-wgantt__label{border-radius:8.7px}
  .mgc-wgantt__barwrap{margin-left:0;margin-top:-10px}
}

/* ---- 会社概要：私たちの強み（#95-100）----
   元デザイン：パネル1360×390pt #EDF2FB、カード400×320pt・枠3pt #FBBF24・間隔40pt
   アイコン帯 上端+31.3pt〜+158.8pt（下揃え）／見出し26pt baseline+212.2pt／本文17pt 行送り25pt */
.mgc-featpanel{padding:30.3px 34.6px}
.mgc-featgrid--3{gap:34.6px}
.mgc-featgrid--3 .mgc-feat{min-height:276.8px;padding:0 14px 20px;border-width:2.6px}
.mgc-featgrid--3 .mgc-feat__icon{display:grid;place-items:end center;width:100%;height:137.4px}
.mgc-featgrid--3 .mgc-feat__icon .mgc-vi{width:auto;height:auto;max-width:100%;max-height:110.6px;margin:0}
.mgc-featgrid--3 .mgc-feat h3{font-size:22.5px;line-height:1.25;margin:14px 0 8px}
.mgc-featgrid--3 .mgc-feat p{font-size:14.7px;font-weight:500;line-height:1.47}

/* ---- 会社概要：事業内容（#101-105）----
   元デザイン：カード656×450pt・枠5pt #2563EB・間隔48pt */
.mgc-bizgrid{gap:41.5px}
.mgc-biz{min-height:389.3px;padding:0 24px 24px}
.mgc-biz__fig{min-height:243.8px;margin-bottom:0}
.mgc-biz__fig img{max-height:243.8px}
.mgc-biz h3{margin-bottom:10px}
.mgc-biz p{font-weight:500;line-height:1.47;margin-bottom:16px}
@media (max-width:820px){
  .mgc-biz{min-height:0}
  .mgc-biz p br{display:none}
}

/* ---- 不具合ご連絡フォーム：STEPカード（#64-69）----
   元デザイン：カード240×360pt・間隔40pt（1360pt幅の中）。
   本サイトの版面は1107pxのためカードは約194pxになる。説明文の改行位置を
   元デザインどおりに保つため、文字サイズと左右の余白を版面比で詰めている。 */
.mgc-flow__item{min-height:290px;padding:19px 6px 18px}
.mgc-flow__who{margin-top:6px}
.mgc-flow__icon{height:96px;margin:6px 0 8px}
.mgc-flow__name{margin-bottom:6px}
.mgc-flow__desc{font-size:13.2px;line-height:1.646;font-feature-settings:"palt" 1}
@media (max-width:1100px){
  .mgc-flow__item{min-height:0}
  .mgc-flow__desc{font-size:14.7px}
}

/* ---- Magconnとは FV（#18-20）----
   写真の上でリード文が読みにくいため文字色を白に。
   英字（The Professional Charging Standard）にはトップFV2枚目と同じ白いぼかしを敷く。 */
.mgc-fv--magconn .mgc-fv__lead{color:#fff}
.mgc-fv--magconn .mgc-fv__eyebrow{
  text-shadow:0 0 14px rgba(255,255,255,.9),0 0 26px rgba(255,255,255,.7);
}

/* ---- 縦横比の追い込み（2026-09-09）----
   本サイトの版面は1107pxで元デザイン（1176px相当）より約6%狭いため、
   同じ文字サイズのままだとカードが縦に伸びる。アイコン帯と下余白を詰めて
   元デザインの縦横比に近づける。 */

/* STEPカード：段落の既定マージンを消して実測どおりの間隔にする */
.mgc-flow__num{margin-bottom:0}
.mgc-flow__who{margin:10.3px 0 0}
.mgc-flow__icon{height:96px;margin:0 0 20px}
.mgc-flow__name{margin:0 0 6px}

/* アフターサポート 目的別メニュー */
.mgc-supcard:has(.mgc-supcard__desc){min-height:325px;padding-bottom:14px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__icon{height:100px}

/* 会社概要 事業内容 */
.mgc-biz{min-height:366px;padding-bottom:18px}
.mgc-biz__fig{min-height:200px}
.mgc-biz__fig img{max-height:200px}
.mgc-biz p{margin-bottom:12px}
@media (max-width:820px){
  .mgc-biz{min-height:0}
  .mgc-featgrid--5 .mgc-feat--proof,.mgc-featgrid--5 .mgc-feat--amber,
  .mgc-featgrid--3 .mgc-feat,.mgc-supcard:has(.mgc-supcard__desc){min-height:0}
}

/* STEPカードの最終調整：カード幅194pxに対して元デザインの縦横比（240:360）に合わせる */
.mgc-flow__item{min-height:0;padding:17.8px 6px 15px}
.mgc-flow__num{min-width:96px;min-height:30.7px;font-size:16px;padding:2px 14px}
.mgc-flow__who{font-size:16px;margin:8px 0 0}
.mgc-flow__icon{height:88px;margin:0 0 16px}
.mgc-flow__name{font-size:16.2px;margin:0 0 5px}
@media (max-width:1100px){
  .mgc-flow__item{padding:19px 12px 18px}
  .mgc-flow__num{font-size:17.3px}
  .mgc-flow__who,.mgc-flow__name{font-size:17.3px}
  .mgc-flow__icon{height:107px}
}

/* ============================================================
   カード類：元デザインの実寸をそのまま置く（2026-09-09 全面改修 v2.33.0）
   ------------------------------------------------------------
   【方針】倍率をひとつに固定する。
     版面 = 元デザインの本文コンテナ 1360pt = 1176px
     倍率 K = 1176 / 1360 = 0.864706
     以降、**すべての寸法は「元デザインのpt値 × K」** で置く。
     カード幅・カード高・カード間隔・枠線・文字サイズ・行送り・アイコン寸法まで
     例外なく同じ倍率なので、画面上の見え方は元デザインと相似になる。

   【これまでの誤り】
     版面だけ 1107px（＝1280pt想定）で組み、文字とアイコンは 1360pt基準の
     ×0.865 で置いていた。倍率が2種類混在していたため、カードだけが約6%小さく、
     その中身が相対的に大きく見えていた。1か所直すと別の場所がずれる原因。

   【数値の出どころ】
     支給PDF（1920pt アートボード）を PyMuPDF で機械抽出したもの。
     カード矩形・枠線幅・文字サイズ・ベースライン・アイコンのバウンディングボックスを
     全パスの和集合で実測している。手で決めた値はない。
     アイコンの top はカード外形上端からの距離から枠線幅を引いた値（＝内容ボックス基準）。
   ============================================================ */

/* 版面。元デザイン 1360pt をそのまま px 化したもの */
:root{--mgc-wrap:1176px}

/* ---- 共通：アイコンは帯の中に絶対配置し、元デザインの位置と大きさで置く ---- */
.mgc-indcard__icon,.mgc-strength__icon,.mgc-supcard__icon,.mgc-feat__icon{
  position:relative;display:block;width:100%;place-items:initial;
}
.mgc-indcard__icon .mgc-vi,.mgc-indcard__icon .mgc-i,
.mgc-strength__icon .mgc-vi,.mgc-strength__icon .mgc-i,
.mgc-supcard__icon .mgc-vi,.mgc-supcard__icon .mgc-i,
.mgc-feat__icon .mgc-vi,.mgc-feat__icon .mgc-i{
  position:absolute;left:50%;transform:translateX(-50%);margin:0;max-width:none;max-height:none;
}
/* ベクターは高さ指定・幅は自動（SVGの縦横比を保つ）。PNGマスクは中身が無いので幅も指定する */
.mgc-indcard__icon .mgc-vi,.mgc-strength__icon .mgc-vi,
.mgc-supcard__icon .mgc-vi,.mgc-feat__icon .mgc-vi{width:auto}

/* ============ トップ「業界・利用シーンから探す」 ============
   元デザイン：カード 248×280pt・枠4pt・間隔30pt／見出し21pt・本文14pt 行送り22pt */
.mgc-indgrid{gap:25.94px}
.mgc-indcard{padding:0;min-height:242.12px;border-width:3.46px}
.mgc-indcard__icon{height:118.64px}
.mgc-indcard__name{font-size:18.16px;line-height:1.4;margin:21.46px 0 9.22px;padding:0 10px}
.mgc-indcard__desc{font-size:12.11px;line-height:19.02px;padding:0 8px}
.mgc-indcard:nth-child(1) .mgc-indcard__icon .mgc-vi{top:37.27px;height:81.37px}
.mgc-indcard:nth-child(2) .mgc-indcard__icon .mgc-vi{top:38.91px;height:66.67px}
.mgc-indcard:nth-child(3) .mgc-indcard__icon .mgc-vi{top:31.99px;height:76.53px}
.mgc-indcard:nth-child(4) .mgc-indcard__icon .mgc-vi{top:36.75px;height:70.73px}
.mgc-indcard:nth-child(5) .mgc-indcard__icon .mgc-vi{top:34.93px;height:71.94px}
.mgc-indcard:nth-child(1) .mgc-indcard__icon .mgc-i{top:37.27px;width:75.14px;height:81.37px}
.mgc-indcard:nth-child(2) .mgc-indcard__icon .mgc-i{top:38.91px;width:96.67px;height:66.67px}
.mgc-indcard:nth-child(3) .mgc-indcard__icon .mgc-i{top:31.99px;width:84.31px;height:76.53px}
.mgc-indcard:nth-child(4) .mgc-indcard__icon .mgc-i{top:36.75px;width:77.05px;height:70.73px}
.mgc-indcard:nth-child(5) .mgc-indcard__icon .mgc-i{top:34.93px;width:89.41px;height:71.94px}

/* ============ トップ「Magconnが選ばれる理由」 ============
   元デザイン：カード 248×300pt・枠4pt・間隔30pt／見出し26pt・本文16pt 行送り24pt */
.mgc-strengths{gap:25.94px}
.mgc-strength{padding:0;min-height:259.41px;border-width:3.46px}
.mgc-strength__icon{height:124.51px}
.mgc-strength h3{font-size:22.48px;line-height:1.4;margin:10.92px 0 6.23px;padding:0 12px}
.mgc-strength p{font-size:13.84px;line-height:20.75px;padding:0 10px}
.mgc-strength:nth-child(1) .mgc-strength__icon .mgc-vi{top:19.97px;height:93.39px}
.mgc-strength:nth-child(2) .mgc-strength__icon .mgc-vi{top:19.37px;height:94.69px}
.mgc-strength:nth-child(3) .mgc-strength__icon .mgc-vi{top:19.97px;height:104.54px}
.mgc-strength:nth-child(4) .mgc-strength__icon .mgc-vi{top:15.48px;height:102.04px}
.mgc-strength:nth-child(5) .mgc-strength__icon .mgc-vi{top:16.86px;height:99.61px}
.mgc-strength:nth-child(1) .mgc-strength__icon .mgc-i{top:19.97px;width:79.29px;height:93.39px}
.mgc-strength:nth-child(2) .mgc-strength__icon .mgc-i{top:19.37px;width:46.43px;height:94.69px}
.mgc-strength:nth-child(3) .mgc-strength__icon .mgc-i{top:19.97px;width:102.04px;height:104.54px}
.mgc-strength:nth-child(4) .mgc-strength__icon .mgc-i{top:15.48px;width:82.49px;height:102.04px}
.mgc-strength:nth-child(5) .mgc-strength__icon .mgc-i{top:16.86px;width:102.38px;height:99.61px}

/* ============ トップ「資料ダウンロード・サポート」 ============
   元デザイン：カード 248×250pt・枠4pt・間隔30pt／見出し21pt（2行） */
.mgc-supgrid{gap:25.94px}
.mgc-supcard:not(:has(.mgc-supcard__desc)){padding:0;min-height:216.18px;border-width:3.46px}
.mgc-supcard:not(:has(.mgc-supcard__desc)) .mgc-supcard__icon{height:127.37px}
.mgc-supcard:not(:has(.mgc-supcard__desc)) .mgc-supcard__name{
  font-size:18.16px;line-height:1.4;margin-top:17.4px;padding:0 8px;
}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(1) .mgc-supcard__icon .mgc-vi{top:26.37px;height:99.87px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(2) .mgc-supcard__icon .mgc-vi{top:29.14px;height:89.32px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(3) .mgc-supcard__icon .mgc-vi{top:25.25px;height:102.12px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(4) .mgc-supcard__icon .mgc-vi{top:4.84px;height:118.64px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(5) .mgc-supcard__icon .mgc-vi{top:42.11px;height:68.57px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(1) .mgc-supcard__icon .mgc-i{top:26.37px;width:79.21px;height:99.87px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(2) .mgc-supcard__icon .mgc-i{top:29.14px;width:106.45px;height:89.32px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(3) .mgc-supcard__icon .mgc-i{top:25.25px;width:80.24px;height:102.12px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(4) .mgc-supcard__icon .mgc-i{top:4.84px;width:119.93px;height:118.64px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(5) .mgc-supcard__icon .mgc-i{top:42.11px;width:98.58px;height:68.57px}

/* ============ アフターサポート「目的別メニュー」 ============
   元デザイン：カード 248×395pt・枠4pt・間隔30pt／見出し26pt（2行）・本文16pt 行送り24pt */
.mgc-supcard:has(.mgc-supcard__desc){padding:0;min-height:341.56px;border-width:3.46px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__icon{height:122.01px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__name{
  font-size:22.48px;line-height:1.4;margin:27.08px 0 4.34px;padding:0 8px;
}
.mgc-supcard__desc{font-size:13.84px;line-height:20.75px;margin-top:0;padding:0 8px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(1) .mgc-supcard__icon .mgc-vi{top:31.56px;height:82.23px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(2) .mgc-supcard__icon .mgc-vi{top:27.93px;height:94.08px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(3) .mgc-supcard__icon .mgc-vi{top:28.88px;height:92.61px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(4) .mgc-supcard__icon .mgc-vi{top:9.16px;height:109.21px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(5) .mgc-supcard__icon .mgc-vi{top:28.97px;height:92px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(1) .mgc-supcard__icon .mgc-i{top:31.56px;width:98.06px;height:82.23px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(2) .mgc-supcard__icon .mgc-i{top:27.93px;width:73.85px;height:94.08px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(3) .mgc-supcard__icon .mgc-i{top:28.88px;width:87.94px;height:92.61px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(4) .mgc-supcard__icon .mgc-i{top:9.16px;width:110.42px;height:109.21px}
.mgc-supcard:has(.mgc-supcard__desc):nth-child(5) .mgc-supcard__icon .mgc-i{top:28.97px;width:72.89px;height:92px}

/* ============ Magconnとは「数字と実績」「さまざまな現場」 ============
   元デザイン：カード 248×270pt・枠4pt・間隔30pt／見出し26pt・本文16pt 行送り24pt */
.mgc-featgrid--5{gap:25.94px}
.mgc-featgrid--5 .mgc-feat{padding:0;min-height:233.47px;border-width:3.46px}
.mgc-featgrid--5 .mgc-feat h3{font-size:22.48px;line-height:1.4;padding:0 6px}
.mgc-featgrid--5 .mgc-feat p{font-size:13.84px;line-height:20.75px;padding:0 4px}
/* 数字と実績 */
.mgc-featgrid--5 .mgc-feat--proof .mgc-feat__icon{height:102.81px}
.mgc-featgrid--5 .mgc-feat--proof h3{margin:15.33px 0 6.32px;min-height:0}
.mgc-feat--proof:nth-child(1) .mgc-feat__icon .mgc-vi{top:23px;height:73.24px}
.mgc-feat--proof:nth-child(2) .mgc-feat__icon .mgc-vi{top:24.21px;height:70.82px}
.mgc-feat--proof:nth-child(3) .mgc-feat__icon .mgc-vi{top:24.64px;height:69.78px}
.mgc-feat--proof:nth-child(4) .mgc-feat__icon .mgc-vi{top:24.56px;height:70.13px}
.mgc-feat--proof:nth-child(5) .mgc-feat__icon .mgc-vi{top:24.64px;height:78.17px}
.mgc-feat--proof:nth-child(1) .mgc-feat__icon .mgc-i{top:23px;width:55.77px;height:73.24px}
.mgc-feat--proof:nth-child(2) .mgc-feat__icon .mgc-i{top:24.21px;width:34.67px;height:70.82px}
.mgc-feat--proof:nth-child(3) .mgc-feat__icon .mgc-i{top:24.64px;width:59.32px;height:69.78px}
.mgc-feat--proof:nth-child(4) .mgc-feat__icon .mgc-i{top:24.56px;width:67.01px;height:70.13px}
.mgc-feat--proof:nth-child(5) .mgc-feat__icon .mgc-i{top:24.64px;width:76.35px;height:78.17px}
/* さまざまな現場 */
.mgc-featgrid--5 .mgc-feat--amber .mgc-feat__icon{height:120.11px}
.mgc-featgrid--5 .mgc-feat--amber h3{margin:15.93px 0 6.32px;min-height:0}
.mgc-feat--amber:nth-child(1) .mgc-feat__icon .mgc-vi{top:31.65px;height:84.65px}
.mgc-feat--amber:nth-child(2) .mgc-feat__icon .mgc-vi{top:39.43px;height:69.35px}
.mgc-feat--amber:nth-child(3) .mgc-feat__icon .mgc-vi{top:31.73px;height:79.64px}
.mgc-feat--amber:nth-child(4) .mgc-feat__icon .mgc-vi{top:34.76px;height:73.59px}
.mgc-feat--amber:nth-child(5) .mgc-feat__icon .mgc-vi{top:27.93px;height:92.18px}
.mgc-feat--amber:nth-child(1) .mgc-feat__icon .mgc-i{top:31.65px;width:78.17px;height:84.65px}
.mgc-feat--amber:nth-child(2) .mgc-feat__icon .mgc-i{top:39.43px;width:100.57px;height:69.35px}
.mgc-feat--amber:nth-child(3) .mgc-feat__icon .mgc-i{top:31.73px;width:87.77px;height:79.64px}
.mgc-feat--amber:nth-child(4) .mgc-feat__icon .mgc-i{top:34.76px;width:80.16px;height:73.59px}
.mgc-feat--amber:nth-child(5) .mgc-feat__icon .mgc-i{top:27.93px;width:95.03px;height:92.18px}

/* ============ 会社概要「私たちの強み」 ============
   元デザイン：カード 400×320pt・枠3pt・間隔40pt・外枠 320→1600pt（＝1280pt）
   見出し26pt・本文17pt 行送り25pt */
.mgc-featpanel{padding:26px 34.59px}
.mgc-featgrid--3{gap:34.59px}
.mgc-featgrid--3 .mgc-feat{padding:0;min-height:276.71px;border-width:2.59px}
.mgc-featgrid--3 .mgc-feat__icon{height:135.08px}
.mgc-featgrid--3 .mgc-feat h3{font-size:22.48px;line-height:1.4;margin:21.54px 0 7.02px;padding:0 14px}
.mgc-featgrid--3 .mgc-feat p{font-size:14.7px;line-height:21.62px;padding:0 12px}
.mgc-featgrid--3 .mgc-feat:nth-child(1) .mgc-feat__icon .mgc-vi{top:25.51px;height:108.52px}
.mgc-featgrid--3 .mgc-feat:nth-child(2) .mgc-feat__icon .mgc-vi{top:25.69px;height:108.69px}
.mgc-featgrid--3 .mgc-feat:nth-child(3) .mgc-feat__icon .mgc-vi{top:24.48px;height:110.6px}
.mgc-featgrid--3 .mgc-feat:nth-child(1) .mgc-feat__icon .mgc-i{top:25.51px;width:82.58px;height:108.52px}
.mgc-featgrid--3 .mgc-feat:nth-child(2) .mgc-feat__icon .mgc-i{top:25.69px;width:123.91px;height:108.69px}
.mgc-featgrid--3 .mgc-feat:nth-child(3) .mgc-feat__icon .mgc-i{top:24.48px;width:113.97px;height:110.6px}

@media (max-width:1024px){
  .mgc-indcard,.mgc-strength,.mgc-supcard,.mgc-featgrid--5 .mgc-feat,.mgc-featgrid--3 .mgc-feat{min-height:0}
  .mgc-featpanel{padding:22px}
}

/* ============================================================
   グリッド類：元デザインの列幅・カード間隔をそのまま置く（v2.33.0）
   ------------------------------------------------------------
   すべて「元デザインのpt値 × K（=0.864706）」。
   列幅×列数 ＋ 間隔×(列数-1) が版面1176pxにぴたりと収まることを確認済み。
   ============================================================ */

/* トップ「現場の課題を、Magconnがピタッと解決」導入事例4枚 … 310×360pt gap40pt */
.mgc-casegrid{gap:34.59px}
.mgc-casecard{min-height:311.29px}

/* 製品一覧「製品ラインナップ」3列 … 420×520pt gap50pt */
.mgc-cards{gap:43.24px}

/* 製品一覧「Magconn製品の基本構成」3列 … 380×390pt gap110pt */
.mgc-compose{gap:95.12px}

/* 導入事例「活用のヒント」横スライダー 3列 … 420×400pt gap50pt */
.mgc-hints__track{grid-auto-columns:calc((100% - 2*43.24px)/3);gap:43.24px}

/* 活用のヒント（個別ページ）2列 … 640×600pt gap80pt */
.mgc-hintsec__grid{gap:69.18px}

/* お問い合わせ「お問い合わせ内容をお選びください」3列 … 420×400pt gap50pt */
.mgc-purposegrid{gap:43.24px}

/* フォーム … 枠1184pt（版面1360ptの中で左右88ptずつ内側）、2列572pt gap40pt */
.mgc-formpanel{padding-left:76.09px;padding-right:76.09px}
.mgc-formrow{gap:0 34.59px}

/* 不具合ご連絡フォーム「対応までの流れ」STEP 5枚 … 240×360pt gap40pt */
.mgc-steps{gap:34.59px}

/* 会社概要「事業内容」2列 … 656×450pt gap48pt */
.mgc-bizgrid{gap:41.51px}
.mgc-biz{min-height:389.12px}

@media (max-width:1024px){
  .mgc-compose{gap:22px}
  .mgc-hintsec__grid{gap:28px}
  .mgc-formpanel{padding-left:24px;padding-right:24px}
  .mgc-casecard,.mgc-biz{min-height:0}
}

/* ---- 追補（v2.33.1）：残りのズレを設計値に合わせる ---- */

/* トップ「現場の課題を、Magconnがピタッと解決」導入事例カード
   元デザイン：カード310×360pt・枠4pt／画像 上11pt〜299pt（高さ288pt）／ラベル26pt ベースライン340.7pt */
.mgc-casecard{border-width:3.46px;padding:6.05px 0 6.03px;min-height:311.29px}
.mgc-casecard__thumb{aspect-ratio:auto;height:249.03px;margin:0 2.6px}
.mgc-casecard__label{
  border-top:0;padding:0 8px;margin-top:11.79px;font-size:22.48px;line-height:1.4;
}

/* 製品一覧「Magconn製品の基本構成」3列 … 380×390pt・間隔110pt（間に「＋」が入る） */
.mgc-compose{gap:0;justify-content:space-between;align-items:stretch}
.mgc-compose__item{flex:0 0 328.59px;min-height:337.24px}
.mgc-compose__plus{flex:0 0 auto}

/* 不具合ご連絡フォーム「対応までの流れ」STEP 5枚 … 240×360pt・間隔40pt */
.mgc-flow{gap:0 34.59px}
.mgc-flow__item{min-height:311.29px}

@media (max-width:1024px){
  .mgc-compose{gap:22px;justify-content:center}
  .mgc-compose__item{flex:1 1 260px;min-height:0}
  .mgc-casecard{min-height:0}
  .mgc-casecard__thumb{aspect-ratio:1/1;height:auto}
  .mgc-flow__item{min-height:0}
}

/* 製品一覧「Magconn製品の基本構成」カード内部
   元デザイン：カード380×390pt・枠5pt／画像 上37.6pt 229.9×235.8pt／見出し28pt ベースライン319.4pt／本文18pt ベースライン354.9pt */
.mgc-compose__item{border-width:4.32px;padding:28.19px 0 19.49px}
.mgc-compose__img{width:198.83px;height:203.86px;max-width:none;object-fit:contain}
.mgc-compose__item h3{font-size:24.21px;line-height:1.4;margin-top:13.68px}
.mgc-compose__item p{font-size:15.56px;line-height:1.6;margin-top:4.59px}
@media (max-width:1024px){
  .mgc-compose__item{padding:20px}
  .mgc-compose__img{width:100%;max-width:180px;height:auto}
}

/* ============================================================
   縦の余白（v2.34.0）：セクションの縦リズムを元デザインに合わせる
   ------------------------------------------------------------
   支給PDF10ページ・30箇所の実測から算出。すべて「元デザインpt × K」。

   ・見出し 40pt → 34.59px（既存で一致）
   ・リード 26pt → 22.48px／行送り 35pt（比率1.346）… 従来 21.1px で6%小さかった
   ・見出しベースライン → リード1行目ベースライン = 54.7pt（10ページで一定）
   ・リード最終行ベースライン → 次のコンテンツ上端 ≒ 34.6pt
   ・前セクションのコンテンツ下端 → 次の見出しベースライン = 中央値 99.4pt（86.0px）
     従来は 142.2px で、設計の約1.65倍のアキになっていた
   ============================================================ */

/* リード文：設計26pt。従来21.1pxで小さく、行間も詰まっていた（可読性の低下） */
.mgc-lead{font-size:clamp(16px,1.9vw,22.48px);line-height:1.346;margin-bottom:23.3px}

/* 見出し→リード：ベースライン間 54.7pt = 47.30px になる値 */
.mgc-h2{margin-bottom:11.7px}

/* 見出し＋リードの右にボタンを置く行。下のアキが0になっていたのを設計値へ */
.mgc-headrow{margin-bottom:23.3px}
.mgc-headrow .mgc-lead{margin-bottom:0}

/* セクション間：コンテンツ下端→次の見出しベースラインが 86.0px になる値 */
.mgc-section{padding:23.9px 0}

@media (max-width:1024px){
  .mgc-section{padding:26px 0}
  .mgc-lead{margin-bottom:20px}
  .mgc-headrow{margin-bottom:20px}
}

/* ============================================================
   文字サイズの取りこぼし修正（v2.34.0）
   ------------------------------------------------------------
   支給PDFの実測に対して小さすぎた箇所。いずれも可読性に直結する。
   ============================================================ */

/* Magconnとは 導入部の見出し … 元デザイン48pt */
.mgc-h2--intro{font-size:clamp(22px,3.1vw,41.51px)}

/* お問い合わせ／不具合フォーム 各フォームの説明文 … 元デザイン22pt（従来14.5px） */
.mgc-formpanel__lead{font-size:19.02px;line-height:1.6}

/* 不具合ご連絡フォーム ページ上部の説明文 … 元デザイン26pt・行送り42pt（従来17px） */
.mgc-pagehead--form .mgc-pagehead__lead,
.mgc-pagehead__alert{font-size:clamp(14px,1.5vw,22.48px);line-height:1.615}

/* ページ上部リードの行送り … 元デザイン 26pt / 行送り42pt */
.mgc-pagehead__lead{line-height:1.615}

/* トップFVリード … 元デザイン24pt（1920pt幅で24px になる係数へ） */
.mgc-hero__lead{font-size:clamp(13px,1.25vw,24px)}

/* 会社概要 会社情報テーブル
   元デザイン：行の高さ82pt・項目名セル260pt・値セル988pt・文字20pt・行送り25pt
   郵便番号と住所は1行（デザインどおり）。行の高さを揃える。 */
.mgc-profile{max-width:1079.2px;margin-inline:auto}
.mgc-profile th,.mgc-profile td{height:70.9px;padding:12px 26px;vertical-align:middle}
.mgc-profile th{width:224.8px}

@media (max-width:1024px){
  .mgc-profile{max-width:none}
  .mgc-profile th,.mgc-profile td{height:auto;padding:12px 16px}
}

/* ページ上部（タイトル・サブタイトル・リード）のベースライン間隔
   元デザイン：タイトル48pt →（56.4pt）→ サブ32pt →（56.1pt）→ リード26pt
               サブ無しの場合は タイトル →（55.6pt）→ リード */
.mgc-pagehead h1{margin-bottom:6px}
.mgc-pagehead:has(.mgc-pagehead__sub) h1{margin-bottom:0.8px}
.mgc-pagehead__sub{margin-bottom:10.2px}
.mgc-pagehead--center h1{margin-bottom:6px}
.mgc-pagehead--center:has(.mgc-pagehead__sub) h1{margin-bottom:0.8px}
/* 活用のヒント／製品一覧（タイトル52pt・リード24pt）… 元デザイン 52.7pt */
.mgc-pagehead:not(:has(.mgc-pagehead__sub)) .mgc-pagehead__lead{margin-top:4.3px}
.mgc-pagehead__row .mgc-pagehead__lead{margin-top:0}

/* ============================================================
   トップページのアイコン（v2.36.0）
   ------------------------------------------------------------
   1.トップページ.pdf から10個すべてをベクターのまま抽出（assets/icons/top-*.svg）。
   色 #1E3A8A・線幅 1.5pt は元データのまま。SVGの高さを「元デザインの高さ×K」で置くと
   線幅は自動的に 1.5pt×K = 1.30px になり、10個すべてで揃う。
   ※ 従来は別ページのSVGとPNGを流用しており、色（#2563EB）と線幅（1.84px/1.27px）が
     元デザインと違っていた。
   SVGの viewBox はインク外形＋線幅/2＋1pt の余白。top はその余白込みで算出。
   ============================================================ */
.mgc-strength__icon .mgc-vi[class*="mgc-vi--top-"],
.mgc-supcard__icon .mgc-vi[class*="mgc-vi--top-"]{
  position:absolute;left:50%;transform:translateX(-50%);width:auto;margin:0;max-width:none;max-height:none;
}
/* 選ばれる理由：インク上端(pt) 2713.30／2712.57／2713.29／2708.14／2709.72、カード上端 2686.2・枠4pt */
.mgc-strength:nth-child(1) .mgc-strength__icon .mgc-vi{top:18.46px;height:96.39px}
.mgc-strength:nth-child(2) .mgc-strength__icon .mgc-vi{top:17.83px;height:97.75px}
.mgc-strength:nth-child(3) .mgc-strength__icon .mgc-vi{top:18.45px;height:107.61px}
.mgc-strength:nth-child(4) .mgc-strength__icon .mgc-vi{top:14.00px;height:105.09px}
.mgc-strength:nth-child(5) .mgc-strength__icon .mgc-vi{top:15.37px;height:102.67px}
/* 資料ダウンロード・サポート：インク上端(pt) 3703.89／3707.13／3702.56／3679.05／3722.09、カード上端 3669.4・枠4pt */
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(1) .mgc-supcard__icon .mgc-vi{top:24.85px;height:102.93px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(2) .mgc-supcard__icon .mgc-vi{top:27.65px;height:92.35px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(3) .mgc-supcard__icon .mgc-vi{top:23.70px;height:105.19px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(4) .mgc-supcard__icon .mgc-vi{top:3.37px;height:121.63px}
.mgc-supcard:not(:has(.mgc-supcard__desc)):nth-child(5) .mgc-supcard__icon .mgc-vi{top:40.59px;height:71.60px}

/* ============================================================
   お問い合わせ「お問い合わせいただく前に」（v2.37.0）
   8.お問い合わせ.pdf から4個をベクターのまま抽出（assets/icons/ct-*.svg・線幅2pt #1E3A8A）。
   元デザインは4個とも**アイコンの中心が y=5300.8pt で一致**（＝センター揃え）。
   パネル上端 5224.9pt → 中心まで 75.9pt（65.6px）、見出しベースライン 179.4pt（155.1px）、
   本文1行目ベースライン 214.7pt（185.6px・17pt／行送り25pt）。
   SVGの viewBox はインクの実寸＋2pt（線幅/2＋余白）。
   ============================================================ */
.mgc-infopanel{padding-top:18.06px}
.mgc-info__icon{height:95.08px;place-items:center;margin-bottom:0}
.mgc-info__icon .mgc-vi{position:static;transform:none;width:auto;max-width:none;max-height:none;margin:0}
.mgc-info:nth-child(1) .mgc-info__icon .mgc-vi{height:95.08px}
.mgc-info:nth-child(2) .mgc-info__icon .mgc-vi{height:90.32px}
.mgc-info:nth-child(3) .mgc-info__icon .mgc-vi{height:86.62px}
.mgc-info:nth-child(4) .mgc-info__icon .mgc-vi{height:86.62px}
.mgc-info h3{font-size:22.48px;line-height:1.4;margin:17.68px 0 6.9px}
.mgc-info p{font-size:14.7px;line-height:21.62px}
@media (max-width:1024px){
  .mgc-infopanel{padding-top:26px}
}

/* ============================================================
   アフターサポート「目的別メニュー」カード内部（v2.37.2）
   元デザイン（カード248×395pt）：見出し1行目ベースライン 204.5pt（176.8px）、
   見出しは2行分の高さを固定（1行の「保証について」も同じ位置）、
   本文1行目ベースライン 272.3pt（235.5px・見出しの行数に関係なく固定）、
   矢印○ 上端334.2pt（289.0px）・径40pt（34.6px）・中心。改行位置は元デザインどおり。
   ============================================================ */
.mgc-supcard:has(.mgc-supcard__desc){position:relative;padding-bottom:0}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__name{min-height:62.94px;display:block}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__go{
  position:absolute;left:50%;top:289.0px;transform:translateX(-50%);padding:0;margin:0;line-height:0;
}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__go .mgc-vi{width:34.6px;height:34.6px}
@media (max-width:1024px){
  .mgc-supcard:has(.mgc-supcard__desc){padding-bottom:60px}
  .mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__name{min-height:0}
  .mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__go{top:auto;bottom:16px}
}
/* 実測補正：本文ベースライン 245.0→235.5、矢印 top はパディングボックス基準なので枠線分を引く */
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__name{margin-bottom:-5.16px}
.mgc-supcard:has(.mgc-supcard__desc) .mgc-supcard__go{top:285.54px}

/* ============================================================
   保証について「製品ごとの保証期間」バーの継ぎ目（v2.37.4）
   元デザイン：製品名ボックス（480×70pt・四隅角丸10pt・枠1.5pt）の右端 x=1075.3pt から
   期間バー（高さ50pt・四隅角丸10pt）がぴたりと始まる。バーはボックスの後ろに潜らず、
   ボックスの右角丸とバーの左角丸の両方が継ぎ目に見える。
   ※ 従来はバーをボックスの下に12px潜らせていたため、継ぎ目が直線に見えていた。
   ============================================================ */
.mgc-wgantt__barwrap{margin-left:0;z-index:0}
.mgc-wgantt__bar{border-radius:8.65px;padding-left:14px;min-height:43.25px}
.mgc-wgantt__label{border-radius:8.65px}

/* ============================================================
   不具合ご連絡フォーム「不具合品送付先」（v2.37.5）
   元デザイン（6.アフターサポート_不具合フォーム.pdf 実測）：
   枠 1360×277.2pt・線2pt #1E3A8A／見出しピル 260×60pt・枠上端から20.8pt・中央／
   宛名・住所・TEL 20pt 行送り30pt・中央揃え（ベースライン 120.4／150.4／180.4pt）／
   注意書き 20pt オレンジ・中央揃え（ベースライン 222.0／252.0pt）
   ※ 従来は「ピルが左・住所が右」の横並びにしていた。デザインは全て縦積みの中央揃え。
   ============================================================ */
.mgc-sendbox{padding:16.3px 40px 13.6px;text-align:center;min-height:239.7px}
.mgc-sendbox__row{flex-direction:column;align-items:center;justify-content:flex-start;gap:14.65px;text-align:center}
.mgc-sendbox__title{margin:0;min-width:224.8px;min-height:51.9px;font-size:22.48px}
.mgc-sendbox__body{text-align:center}
.mgc-sendbox__name,.mgc-sendbox__addr{font-size:17.29px;line-height:1.5}
.mgc-sendbox__note{font-size:17.29px;line-height:1.5;margin:10.1px 0 0;text-align:center}
@media (max-width:1024px){
  .mgc-sendbox{padding:24px 18px 26px;min-height:0}
  .mgc-sendbox__note{font-size:14.5px}
}

/* ============================================================
   「必要な資料が見つからない場合」ボックス（v2.38.0・取説・仕様書DL.pdf 実測で組み直し）
   枠 1360×180pt #EDF2FB 角丸24pt／左「？」アイコン 102.6×86.1pt（左22.4・上39.3pt）／
   見出し38pt #1E3A8A x=144.8pt ベースライン81.2pt／本文24pt #1F2937 1行 ベースライン124.5pt／
   封筒 76×52.9pt（上30.2pt・中心x 1180.8pt）／ボタン 220×44pt #FB923C 角丸10pt
   （上98.8pt・中心x 1180.8pt・文字20pt 白）
   ============================================================ */
.mgc-helpbox{
  position:relative;display:block;height:155.65px;padding:0;border-radius:20.76px;background:#EDF2FB;
}
.mgc-helpbox__icon{position:absolute;left:19.4px;top:34.0px;width:auto;display:block}
.mgc-helpbox__icon .mgc-vi{height:74.5px;width:auto;max-width:none}
.mgc-helpbox__body{position:absolute;left:125.2px;top:0;right:300px}
.mgc-helpbox__title{
  font-size:32.86px;line-height:1.3;color:var(--mgc-french);font-weight:700;letter-spacing:0;
  margin:0;position:absolute;left:0;top:37.9px;white-space:nowrap;
}
.mgc-helpbox__lead{
  font-size:20.75px;line-height:1.5;font-weight:500;color:var(--mgc-ink);
  margin:0;position:absolute;left:0;top:87.1px;white-space:nowrap;
}
.mgc-helpbox__action{position:absolute;left:1021.0px;top:0;transform:translateX(-50%);display:block;width:190.2px}
.mgc-helpbox__mail{position:absolute;left:50%;top:26.1px;transform:translateX(-50%);display:block;line-height:0}
.mgc-helpbox__mail .mgc-vi{height:45.7px;width:auto;max-width:none}
.mgc-btn--help{
  position:absolute;left:0;top:85.4px;width:190.2px;min-width:0;height:38.0px;min-height:0;padding:0;
  display:flex;align-items:center;justify-content:center;
  font-size:17.29px;font-weight:700;border-radius:8.65px;background:#FB923C;color:#fff;
}
@media (max-width:1024px){
  .mgc-helpbox{height:auto;padding:20px;display:flex;flex-wrap:wrap;gap:16px;align-items:center}
  .mgc-helpbox__icon,.mgc-helpbox__body,.mgc-helpbox__title,.mgc-helpbox__lead,.mgc-helpbox__action,.mgc-helpbox__mail,.mgc-btn--help{position:static;transform:none;white-space:normal}
  .mgc-helpbox__icon .mgc-vi{height:52px}
  .mgc-helpbox__body{flex:1 1 200px}
  .mgc-helpbox__title{font-size:22px;margin-bottom:6px}
  .mgc-helpbox__lead{font-size:15px}
  .mgc-helpbox__action{flex:1 1 100%;display:flex;justify-content:center;gap:14px;width:auto}
  .mgc-helpbox__mail .mgc-vi{height:32px}
}
/* 実測補正（SVGの viewBox 余白1.75pt分と、ベースラインの微差） */
.mgc-helpbox__icon{top:32.5px}
.mgc-helpbox__icon .mgc-vi{height:77.9px}
.mgc-helpbox__title{top:36.4px}
.mgc-helpbox__lead{top:84.3px}
.mgc-helpbox__mail{top:24.6px}
.mgc-helpbox__mail .mgc-vi{height:49.17px}

/* ============================================================
   会社概要「私たちの強み」アイコン（v2.39.0）
   7.会社概要.pdf から3個をベクターのまま抽出（assets/icons/co-*.svg・線幅2pt #1E3A8A）。
   従来は別ページのSVG（特許・OEM）とPNGマスク（BtoB）の混在で、線幅と大きさが揃わなかった。
   カード 400×320pt・枠3pt #FBBF24／アイコン インク上端 32.5／32.7／31.3pt・高さ 125.5／125.7／127.9pt
   ============================================================ */
.mgc-featgrid--3 .mgc-feat__icon .mgc-vi[class*="mgc-vi--co-"]{
  position:absolute;left:50%;transform:translateX(-50%);width:auto;margin:0;max-width:none;max-height:none;
}
.mgc-featgrid--3 .mgc-feat:nth-child(1) .mgc-feat__icon .mgc-vi{top:24.0px;height:111.94px}
.mgc-featgrid--3 .mgc-feat:nth-child(2) .mgc-feat__icon .mgc-vi{top:24.2px;height:112.14px}
.mgc-featgrid--3 .mgc-feat:nth-child(3) .mgc-feat__icon .mgc-vi{top:22.9px;height:114.05px}

/* ============================================================
   トップ「業界・利用シーンから探す」／Magconnとは「さまざまな現場」アイコン（v2.39.0）
   各ページのデザインPDFから直接抽出（top-ind-*.svg 線幅1.5pt #1E3A8A／about-field-*.svg 線幅2pt #FB923C）。
   従来の ind-*.svg 流用では線幅が 1.45px／1.51px（OEMのみ1.70px）とばらついていた。
   ============================================================ */
.mgc-indcard__icon .mgc-vi[class*="mgc-vi--top-ind-"],
.mgc-feat__icon .mgc-vi[class*="mgc-vi--about-field-"]{
  position:absolute;left:50%;transform:translateX(-50%);width:auto;margin:0;max-width:none;max-height:none;
}
.mgc-indcard:nth-child(1) .mgc-indcard__icon .mgc-vi--top-ind-food{top:35.75px;height:84.40px}
.mgc-indcard:nth-child(2) .mgc-indcard__icon .mgc-vi--top-ind-hotel{top:37.42px;height:69.71px}
.mgc-indcard:nth-child(3) .mgc-indcard__icon .mgc-vi--top-ind-medical{top:30.45px;height:79.55px}
.mgc-indcard:nth-child(4) .mgc-indcard__icon .mgc-vi--top-ind-retail{top:35.25px;height:73.74px}
.mgc-indcard:nth-child(5) .mgc-indcard__icon .mgc-vi--top-ind-office{top:33.40px;height:74.97px}
/* 導入事例「業界別ソリューションから探す」（カード248×244.5pt・枠4pt）case-ind-*.svg */
.mgc-indcard__icon .mgc-vi[class*="mgc-vi--case-ind-"]{position:absolute;left:50%;transform:translateX(-50%);width:auto;margin:0;max-width:none;max-height:none}
.mgc-indgrid .mgc-indcard .mgc-indcard__icon .mgc-vi--case-ind-food{top:20.40px;height:84.40px}
.mgc-indgrid .mgc-indcard .mgc-indcard__icon .mgc-vi--case-ind-hotel{top:22.08px;height:69.71px}
.mgc-indgrid .mgc-indcard .mgc-indcard__icon .mgc-vi--case-ind-medical{top:15.11px;height:79.55px}
.mgc-indgrid .mgc-indcard .mgc-indcard__icon .mgc-vi--case-ind-retail{top:19.90px;height:73.74px}
.mgc-indgrid .mgc-indcard .mgc-indcard__icon .mgc-vi--case-ind-office{top:18.06px;height:74.97px}
.mgc-feat--amber:nth-child(1) .mgc-feat__icon .mgc-vi{top:30.14px;height:88.14px}
.mgc-feat--amber:nth-child(2) .mgc-feat__icon .mgc-vi{top:37.94px;height:72.85px}
.mgc-feat--amber:nth-child(3) .mgc-feat__icon .mgc-vi{top:30.24px;height:83.08px}
.mgc-feat--amber:nth-child(4) .mgc-feat__icon .mgc-vi{top:33.23px;height:77.05px}
.mgc-feat--amber:nth-child(5) .mgc-feat__icon .mgc-vi{top:26.39px;height:95.62px}

/* ---- v2.40 FAQ 回答内の長いURLが折り返せるように（2026-09-11 iPad以外のジャケット回答差し替え） ---- */
.mgc-faq__a{overflow-wrap:anywhere}

/* ---- v2.41 ヘッダー検索アイコン：支給デザインのベクターに差し替え（2026-09-11） ----
   1.トップページ.pdf：丸 ⌀64pt（x1680〜1744・y19.2〜83.2）／虫めがねの描画範囲 45.34pt（線幅込み）で丸の中心に配置
   → アイコンは丸の 70.8%（=45.34/64）。線幅2pt は丸の直径に対する比で自動的に保たれる */
.mgc-search-btn{padding:0}
.mgc-search-btn .mgc-vi--hdr-search{width:70.8%;height:auto;aspect-ratio:45.336/45.389;max-width:none}