/* ===== FPGA/基板受託開発（受託開発下層）fsi-embedded.css / mbd.css の拡張 ===== */
/* 開発領域ダイアグラム */
.dom-fig{min-width:1040px}
.dstack{grid-column:1;grid-row:2/4;align-self:start;margin-top:calc(-14px * var(--sp-k));width:168px;display:grid;gap:calc(5px * var(--sp-k))}
.dstack .ly{font-family:"Roboto Condensed",sans-serif;font-size:var(--fs-label);font-weight:700;color:#fff;text-align:center;padding:calc(7px * var(--sp-k)) calc(4px * var(--sp-k));border-radius:6px}
.dstack .hwring{border:2px solid var(--accent);border-radius:9px;padding:calc(4px * var(--sp-k));display:grid;gap:calc(4px * var(--sp-k));margin-top:2px}
.dflow{position:relative;display:grid;grid-template-columns:168px 30px 1fr 22px 1fr 22px 1fr 22px 1.55fr 22px 1fr 22px 1fr 22px .9fr;grid-template-rows:auto auto auto;row-gap:calc(7px * var(--sp-k));align-items:center}
.dsep{grid-column:2;grid-row:2/4;justify-self:center;align-self:stretch;position:relative;left:-3px;width:1px;background:#d3dae5;margin:calc(-14px * var(--sp-k)) 0 0}
/* 層スタックを持たない5工程フロー用の列組み（DMS/EMS）。列だけの差し替えで .dbox/.dar/.dband/.cap の契約はそのまま */
.dflow.nostack{grid-template-columns:1fr 24px 1fr 24px 1.5fr 24px 1.5fr 24px 1fr}
.dzone{grid-column:3/16;grid-row:3;align-self:start;margin:0 calc(-6px * var(--sp-k))}
.dband{grid-row:2;background:#edf0f4;border-radius:8px;margin:calc(-14px * var(--sp-k)) calc(-6px * var(--sp-k));align-self:stretch}
.dflow .cap{grid-row:1;font-size:var(--fs-label);font-weight:700;color:var(--ink-mute);letter-spacing:.01em;text-align:center;line-height:1.35;align-self:end}
.dflow .dbox{grid-row:2;min-height:46px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fff;border:1.5px solid var(--ink);border-radius:7px;padding:calc(8px * var(--sp-k)) calc(5px * var(--sp-k));font-size:var(--fs-label);font-weight:700;text-align:center;line-height:1.45;position:relative}
.dsplit{grid-row:2;display:grid;gap:calc(6px * var(--sp-k));position:relative}
.dsplit .dbox{grid-row:auto;min-height:40px;padding:calc(6px * var(--sp-k)) calc(5px * var(--sp-k))}
.dsplit .dbox small{display:block;font-size:var(--fs-label);font-weight:500;color:var(--ink-soft);line-height:1.4}
.dflow .dbox.hw{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-soft)}
.dflow .dbox.qty{border-color:var(--navy);color:var(--navy)}
.dar{grid-row:2;color:#b6c1d2;font-weight:900;display:flex;justify-content:center;position:relative}
.dar svg{width:14px;height:14px;stroke:currentColor;stroke-width:2.4;fill:none;display:block}
.dfunnel{display:block;width:100%;height:30px;margin-top:calc(10px * var(--sp-k));overflow:visible}
.dfunnel path{stroke:color-mix(in oklab,var(--accent) 70%,#fff);stroke-width:1;stroke-dasharray:3 3;fill:none;vector-effect:non-scaling-stroke}
.dom-zoom{position:relative;border:2px solid var(--accent);border-radius:var(--rd-md);background:var(--bg-soft);padding:calc(16px * var(--sp-k)) calc(22px * var(--sp-k)) calc(18px * var(--sp-k))}
.dom-zoom .zcap{font-size:var(--fs-label);font-weight:700;color:var(--accent-ink);margin-bottom:calc(12px * var(--sp-k))}
.zwrap{display:flex;gap:calc(10px * var(--sp-k));align-items:stretch}
.zwrap .zrows{flex:1;min-width:0}
.zmerge{display:flex;align-items:center;flex:none;gap:calc(8px * var(--sp-k))}
.zmerge .zbrk{position:relative;flex:none;width:16px;align-self:stretch;margin:calc(9px * var(--sp-k)) 0;border:1.5px solid #b6c1d2;border-left:0;border-radius:0 6px 6px 0}
.zmerge .zbrk::after{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);border-left:6px solid #b6c1d2;border-top:4px solid transparent;border-bottom:4px solid transparent}
.zmerge .zbox{flex:none;width:96px;background:#fff;border:1.5px solid var(--ink);color:var(--ink);border-radius:6px;padding:calc(14px * var(--sp-k)) calc(4px * var(--sp-k));font-size:var(--fs-label);font-weight:700;text-align:center}
.zrows{display:grid;gap:calc(10px * var(--sp-k))}
.zrow{display:flex;align-items:center;gap:calc(6px * var(--sp-k))}
.zrow .zlab{flex:none;width:96px;font-size:var(--fs-label);font-weight:900;color:var(--ink)}
.zrow .zbox{flex:1;min-width:0;background:#fff;border:1.5px solid var(--prod);color:var(--prod);border-radius:6px;padding:calc(7px * var(--sp-k)) calc(4px * var(--sp-k));font-size:var(--fs-label);font-weight:700;text-align:center;white-space:nowrap}
.zrow.brd .zbox{border-color:var(--sol);color:var(--sol)}
.zrow .zar{flex:none;color:#b6c1d2}
.zrow .zar svg{width:12px;height:12px;stroke:currentColor;stroke-width:2.6;fill:none;display:block}

/* 選ばれる4つの理由（.reason は共通。ここは本文の折返しだけ） */
#reasons .reason p{text-wrap:pretty}

/* 提案力マトリクス */
.prop-sub{text-align:center;font-size:calc(24px * var(--fs-k));font-weight:900;color:var(--sol);margin:calc(-18px * var(--sp-k)) 0 calc(20px * var(--sp-k));letter-spacing:-0.01em;line-height:1.7}
.mx{border:1px solid var(--line);background:#fff;border-radius:var(--rd-lg);padding:calc(30px * var(--sp-k)) calc(34px * var(--sp-k)) calc(34px * var(--sp-k));box-shadow:var(--sh-1);overflow-x:auto}
.mx-in{--mxh:72px;--mxr:38px;--mxd:calc(var(--mxr)*6/5);display:flex;align-items:flex-start;gap:0;min-width:980px}
.mx-y{flex:none;writing-mode:vertical-rl;font-size:var(--fs-body);font-weight:900;color:var(--sol);display:flex;align-items:flex-start;justify-content:center;letter-spacing:.1em;padding:var(--mxh) 12px 0 0}
.mx-labels{flex:none;display:grid;grid-template-columns:auto 30px auto;grid-template-rows:var(--mxh) repeat(6,var(--mxr));align-items:center}
.mx-labels .mh{grid-row:1;align-self:end;font-size:var(--fs-sub);font-weight:900;line-height:1.4;text-align:center;color:var(--ink);background:var(--bg-soft);border:1px solid var(--line);border-radius:6px;padding:calc(6px * var(--sp-k)) calc(12px * var(--sp-k));margin-bottom:calc(7px * var(--sp-k))}
.mx-labels .a{grid-column:1}
.mx-labels .b{grid-column:3}
.mcol{grid-row:2/8;align-self:stretch;display:grid;grid-template-rows:repeat(5,1fr);align-items:center}
.mx-labels .mi{font-size:var(--fs-sub);font-weight:600;color:var(--ink-soft);text-align:center;white-space:nowrap;padding:0 calc(10px * var(--sp-k))}
.mx-x{grid-column:2;grid-row:2/8;align-self:center;justify-self:center;font-size:calc(22px * var(--fs-k));font-weight:900;color:var(--ink-mute)}
.mx-yax{flex:none;width:2px;height:calc(var(--mxr)*6);background:var(--ink-mute);margin:var(--mxh) 20px 0 10px;position:relative}
.mx-yax::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border-top:8px solid var(--ink-mute);border-left:5px solid transparent;border-right:5px solid transparent}
.mx-plot{flex:1;min-width:0}
.mx-plot .ph-cap{height:22px;text-align:left;padding-left:2px;font-size:var(--fs-sub);font-weight:900;color:var(--sol);letter-spacing:.1em;margin-bottom:calc(8px * var(--sp-k))}
.mx-cols{display:grid;grid-template-columns:repeat(7,1fr);height:18px;padding-bottom:calc(8px * var(--sp-k));margin-right:calc(30px * var(--sp-k));box-sizing:content-box}
.mx-cols span{font-size:var(--fs-sub);font-weight:700;text-align:center;color:var(--ink);white-space:nowrap}
.mx-xax{height:2px;background:var(--ink-mute);position:relative;margin:0 calc(14px * var(--sp-k)) calc(14px * var(--sp-k)) 0}
.mx-xax::after{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);border-left:8px solid var(--ink-mute);border-top:5px solid transparent;border-bottom:5px solid transparent}
.mx-field{position:relative;height:calc(var(--mxr)*6);margin-right:calc(30px * var(--sp-k))}
.mx-area{position:absolute;inset:0;border:2px dashed color-mix(in oklab,var(--accent) 62%,#fff);background:color-mix(in oklab,var(--accent-soft) 62%,#fff);border-radius:6px;display:flex;flex-direction:column;justify-content:flex-end;padding:0 calc(26px * var(--sp-k)) calc(22px * var(--sp-k))}
.mx-area .t{font-size:var(--fs-body);font-weight:900;color:var(--accent-ink)}
.mx-area .s{font-size:var(--fs-sub);color:var(--accent-ink);font-weight:600;margin-top:calc(6px * var(--sp-k));line-height:1.7;max-width:82%;opacity:.88}
.mx-line{position:absolute;top:calc(var(--mxd)*1.5);transform:translateY(-50%);left:16px;right:16px;background:color-mix(in oklab,var(--prod) 15%,#fff);border:1px solid color-mix(in oklab,var(--prod) 38%,#fff);border-radius:5px;padding:calc(8px * var(--sp-k)) calc(16px * var(--sp-k));display:flex;align-items:baseline;justify-content:center;gap:calc(12px * var(--sp-k))}
.mx-line b{font-size:var(--fs-body);font-weight:900;color:var(--prod)}
.mx-line small{font-size:var(--fs-sub);font-weight:600;color:var(--prod)}
.mx-dot{position:absolute;top:calc(var(--mxd)*.5);transform:translateY(-50%);left:21.37%;margin-left:calc(-6.5px * var(--sp-k));display:flex;align-items:center;gap:calc(9px * var(--sp-k));white-space:nowrap}
.mx-dot i{width:13px;height:13px;border-radius:50%;background:var(--ink);flex:none}
.mx-dot b{font-size:var(--fs-body);font-weight:900;color:var(--ink)}
.mx-dot small{font-size:var(--fs-sub);font-weight:600;color:var(--ink-mute)}
/* 記事（FPGAとは）は共通CSS の .article をそのまま利用（アクセントは theme-sol 側で吸収） */
/* パートナー認定 */

.ptn{border:1px solid var(--line);background:#fff;border-radius:var(--rd-md);box-shadow:var(--sh-1);padding:calc(26px * var(--sp-k)) calc(28px * var(--sp-k));text-align:center}
.ptn .ph{aspect-ratio:16/6}
.ptn .badge{display:block;width:auto;height:132px;max-width:100%;margin:0 auto;object-fit:contain}
.ptn :is(h3,h4,h5,h6){font-family:"Roboto Condensed",sans-serif;font-size:var(--fs-cardsub);font-weight:700;margin-top:calc(16px * var(--sp-k));letter-spacing:.01em}
.ptn p{font-size:var(--fs-sub);color:var(--ink-mute);font-weight:500;margin-top:calc(3px * var(--sp-k))}
.ptn-note{max-width:920px;margin:calc(26px * var(--sp-k)) auto 0;text-align:center;font-size:var(--fs-sub);color:var(--ink-soft);line-height:2;font-weight:500;word-break:auto-phrase}

/* 対応実績列見出し（MBD委託形態 .fcard .hd の着色バンド型） */
.cap-grid{display:grid;grid-template-columns:1fr 1fr;gap:calc(26px * var(--sp-k));align-items:start}
.cap-col>h3{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(12px * var(--sp-k));text-align:center;font-size:calc(22px * var(--fs-k));font-weight:900;margin:calc(31px * var(--sp-k)) 0 calc(18px * var(--sp-k));background:#cde9da;border-radius:var(--rd-md);padding:calc(20px * var(--sp-k)) calc(10px * var(--sp-k)) calc(18px * var(--sp-k))}
.cap-col>h3 .chi{flex:none;margin-top:calc(-51px * var(--sp-k));width:62px;height:62px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);display:inline-flex;align-items:center;justify-content:center}
.cap-col>h3 .chi svg{width:29px;height:29px;stroke:var(--sol);stroke-width:1.55;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cap-col.brd>h3 .chi svg{stroke:var(--prod)}
.cap-col.brd>h3{background:color-mix(in oklab,var(--prod) 16%,#fff)}
.cap-steps{display:grid;gap:0}
.capcard{border:1px solid var(--hair);position:relative;background:#fff;border-radius:var(--rd-md);box-shadow:var(--sh-1);padding:calc(16px * var(--sp-k)) calc(22px * var(--sp-k)) calc(15px * var(--sp-k))}
.capcard h4{font-size:var(--fs-cardsub);font-weight:900;text-align:center}
.capcard p{font-size:var(--fs-body);color:var(--ink-soft);line-height:1.8;margin-top:calc(7px * var(--sp-k));font-weight:500}
.capcard p small{display:block;color:var(--ink-mute);font-size:var(--fs-label);margin-top:calc(5px * var(--sp-k))}
.capcard+.capcard{margin-top:calc(22px * var(--sp-k))}
.capcard+.capcard::before{content:"";position:absolute;left:50%;top:-22px;width:2px;height:22px;background:color-mix(in oklab,var(--sol) 35%,#fff)}
.cap-col.brd .capcard+.capcard::before{background:color-mix(in oklab,var(--prod) 35%,#fff)}

/* デバイス別対応実績 */
.dev-table{border:1px solid var(--line);background:#fff;border-radius:var(--rd-lg);box-shadow:var(--sh-1);padding:calc(14px * var(--sp-k)) calc(38px * var(--sp-k));max-width:980px;margin:0 auto}
.dev-table table{width:100%;border-collapse:collapse}
.dev-table th{font-family:"Roboto Condensed",sans-serif;font-size:var(--fs-body);font-weight:700;text-align:left;padding:calc(17px * var(--sp-k)) calc(18px * var(--sp-k)) calc(17px * var(--sp-k)) 0;white-space:nowrap;width:220px;vertical-align:top}
.dev-table td{font-size:var(--fs-body);font-weight:600;color:var(--ink);padding:calc(17px * var(--sp-k)) 0;line-height:1.9}
.dev-table tr+tr th,.dev-table tr+tr td{border-top:1px solid var(--hair)}

/* 機能別対応実績（アコーディオン） */
/* 機能別対応実績（FUNCTIONS）: アコーディオンの箱・見出し・開閉は FAQ と同じ .faq/.qa を使う（同ページに別スタイルが 2 つあったため統合。2026-09-16 ユーザー指示）。ここは .fnq 固有の件数ピルとチップだけ */
.fnq summary h3{font:inherit}
.fnq summary .n{font-family:"Roboto Condensed",sans-serif;font-size:var(--fs-label);font-weight:700;color:var(--sol);background:var(--sol-soft);border-radius:var(--shape-pill);padding:calc(3px * var(--sp-k)) calc(11px * var(--sp-k));line-height:1.5;align-self:center}
.fnq .chips{display:flex;flex-wrap:wrap;gap:calc(8px * var(--sp-k));padding:2px calc(26px * var(--sp-k)) calc(24px * var(--sp-k))}
.fnq .chips span{font-family:"Roboto Condensed",sans-serif;font-size:var(--fs-sub);font-weight:600;color:var(--ink-soft);background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--shape-pill);padding:calc(6px * var(--sp-k)) calc(14px * var(--sp-k))}
.fn-note{margin:calc(28px * var(--sp-k)) auto 0;font-size:var(--fs-sub);color:var(--ink-soft);line-height:2;font-weight:500}
.use-sub{margin-top:calc(60px * var(--sp-k));border-top:1px solid var(--line);padding-top:calc(46px * var(--sp-k))}
.use-sub h3{font-size:calc(24px * var(--fs-k));font-weight:900;display:flex;align-items:center;gap:calc(11px * var(--sp-k))}
.use-sub h3::before{content:"";width:5px;height:22px;background:var(--sol);border-radius:2px}
.use-sub .lead{font-size:var(--fs-body);color:var(--ink-soft);margin-top:calc(10px * var(--sp-k));font-weight:500}

/* FAQ（sol配色） */
details.qa{border:1px solid var(--line);background:#fff;border-radius:var(--rd-md);box-shadow:var(--sh-1)}@media(max-width:900px){.cap-grid{grid-template-columns:1fr}.dev-table{padding:calc(6px * var(--sp-k)) calc(22px * var(--sp-k))}.dev-table th{width:130px;font-size:var(--fs-sub)}}