/* エッジAI ページ固有CSS（rf-＝役割分担図。SVG廃止→HTML化 2026-08-16／矢印の縦位置を行ロックするフラットグリッド化 2026-08-17 */
.relfig{display:grid;grid-template-columns:minmax(0,204px) minmax(72px,1fr) minmax(0,300px) 140px minmax(0,236px);gap:calc(28px * var(--sp-k)) 0;align-items:center;padding:calc(52px * var(--sp-k)) 0 calc(24px * var(--sp-k)) calc(26px * var(--sp-k));position:relative;margin-top:calc(45px * var(--sp-k))}
.rf-framebg{grid-area:1/1/4/4;align-self:stretch;margin:calc(-52px * var(--sp-k)) calc(-26px * var(--sp-k)) calc(-24px * var(--sp-k)) calc(-26px * var(--sp-k));background:color-mix(in oklab,var(--sol) 6%,#fff);border:1px solid color-mix(in oklab,var(--sol) 24%,#fff);border-radius:var(--rd-md)}
.rf-band{position:absolute;top:0;transform:translateY(-50%);left:22px;right:22px;display:flex;align-items:center;gap:calc(16px * var(--sp-k))}
.rf-band b{background:color-mix(in oklab,var(--sol) 24%,#fff);color:var(--ink);font-size:var(--fs-body);font-weight:900;padding:calc(9px * var(--sp-k)) calc(20px * var(--sp-k));border-radius:var(--shape-pill)}
.rf-band span{font-size:var(--fs-sub);font-weight:500;color:#516176}
.rf-box{border-radius:var(--rd-md);color:#fff;text-align:center;padding:calc(22px * var(--sp-k)) calc(18px * var(--sp-k))}
.rf-ic{display:flex;justify-content:center;margin-bottom:calc(10px * var(--sp-k))}
.rf-ic svg{width:26px;height:26px;stroke:#fff;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.95}
.rf-box>b{display:block;font-size:var(--fs-body);font-weight:900}
.rf-box .s{display:block;font-size:var(--fs-sub);font-weight:500;color:rgba(255,255,255,.85);margin-top:calc(6px * var(--sp-k));line-height:1.7}
.rf-sensor{background:#00915B;grid-area:1/1;align-self:start}
.rf-robot{background:#00A86B;grid-area:2/1;align-self:end}
.rf-edge{background:#007D4C;grid-area:1/3/3/4;align-self:stretch;padding:calc(30px * var(--sp-k)) calc(22px * var(--sp-k))}
.rf-edge>b{font-size:calc(20px * var(--fs-k))}
.rf-chips{display:flex;justify-content:center;gap:calc(10px * var(--sp-k));margin-top:calc(16px * var(--sp-k));flex-wrap:wrap}
.rf-chips span{background:rgba(255,255,255,.18);border-radius:var(--shape-pill);padding:calc(4px * var(--sp-k)) calc(11px * var(--sp-k));font-size:var(--fs-sub);font-weight:600;white-space:nowrap}
.rf-edge .base{display:block;margin-top:calc(18px * var(--sp-k));font-size:var(--fs-sub);font-weight:500;color:rgba(255,255,255,.75);line-height:1.7}
.rf-cloud{background:#00C9B3;border-radius:var(--rd-md);color:#fff;padding:calc(26px * var(--sp-k)) calc(20px * var(--sp-k));text-align:center;grid-area:1/5/4/6;align-self:start}
.rf-cloud>b{display:block;font-size:calc(18px * var(--fs-k));font-weight:900}
.rf-cloud .s{display:block;font-size:var(--fs-sub);font-weight:500;color:rgba(255,255,255,.9);margin-top:calc(6px * var(--sp-k));line-height:1.7}
.rf-cloud ul{list-style:none;margin:calc(18px * var(--sp-k)) auto 0;text-align:left;display:grid;gap:calc(8px * var(--sp-k));font-size:var(--fs-sub);font-weight:500;width:fit-content}
.rf-cloud li{display:flex;gap:calc(8px * var(--sp-k));line-height:1.6}
.rf-cloud li::before{content:"";width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.9);flex:none;margin-top:calc(8px * var(--sp-k))}
.rf-cloud .ap{display:block;margin-top:calc(16px * var(--sp-k));padding-top:calc(14px * var(--sp-k));border-top:1px solid rgba(255,255,255,.3);font-size:var(--fs-sub);font-weight:500;color:rgba(255,255,255,.85);line-height:1.7}
.rf-arr{display:grid;justify-items:center;gap:calc(4px * var(--sp-k));font-size:var(--fs-sub);font-weight:600;color:#516176;text-align:center;line-height:1.5;width:100%}
.rf-arr .la{display:block;width:100%;height:auto;stroke:var(--sol);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.rf-arr .fig-arrow{display:none}
.rf-a1{grid-area:1/2}
.rf-a2{grid-area:2/2}
.rf-a3{grid-area:1/4}
.rf-a4{grid-area:2/4}
.rf-note{grid-area:3/1/4/4;margin:0;font-size:var(--fs-sub);font-weight:500;color:#516176}
/* 目的から選ぶ：scard 内のタグ行と本文（行間は .cards の gap 18 相続に統一。本文の重ねマージンを外す） */
.scard .tags{display:flex;flex-wrap:wrap;gap:calc(7px * var(--sp-k))}
.scard>p{margin-top:0}
.indp>.tags{display:flex;flex-wrap:wrap;gap:calc(7px * var(--sp-k));margin-top:calc(14px * var(--sp-k))}
@media(max-width:1150px){
.relfig{grid-template-columns:1fr;padding:calc(52px * var(--sp-k)) 0 0;gap:calc(18px * var(--sp-k));align-items:stretch}
.rf-framebg{grid-area:1/1/7/2;margin:calc(-52px * var(--sp-k)) 0 0}
.rf-sensor{grid-area:1/1;margin:0 calc(18px * var(--sp-k))}
.rf-a1{grid-area:2/1}
.rf-edge{grid-area:3/1;align-self:auto;margin:0 calc(18px * var(--sp-k))}
.rf-a2{grid-area:4/1}
.rf-robot{grid-area:5/1;margin:0 calc(18px * var(--sp-k))}
.rf-note{grid-area:6/1;margin:0 calc(18px * var(--sp-k)) calc(20px * var(--sp-k))}
.rf-a3{grid-area:7/1;justify-self:center;position:relative;left:-52px}
.rf-a4{grid-area:7/1;justify-self:center;position:relative;left:52px}
.rf-cloud{grid-area:8/1;margin:0}
.rf-arr .la{display:none}
.rf-arr .fig-arrow{display:flex}
.rf-a1 .fig-arrow svg,.rf-a2 .fig-arrow svg,.rf-a3 .fig-arrow svg{transform:none}
.rf-a4 .fig-arrow svg{transform:rotate(180deg)}
}