.cn-net{position:relative;width:100%;padding:5.6rem 2.4rem 4rem}
.cn-stage{position:relative;width:100%}
.cn-stage svg{display:block;width:100%;height:auto;overflow:visible}
.cn-line{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1.6;stroke-dasharray:calc(var(--len,800) * 1px);stroke-dashoffset:calc(var(--len,800) * 1px);transition:stroke .5s ease,stroke-width .5s ease,stroke-dashoffset 1.4s cubic-bezier(.65,0,.35,1) .5s}
.cn-net.is-in .cn-line{stroke-dashoffset:0}
.cn-run{fill:none;stroke:rgba(255,255,255,.5);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:44 100000;opacity:0;animation:cn-run linear infinite;animation-delay:var(--delay,0s);transition:opacity .5s ease 1.6s}
.cn-net.is-in .cn-run{opacity:.55}
.cn-hot{fill:none;stroke:var(--hot,#fff);stroke-width:3;stroke-linejoin:round;stroke-linecap:round;opacity:0;stroke-dasharray:calc(var(--len,800) * 1px);stroke-dashoffset:calc(var(--len,800) * 1px);transition:opacity .35s ease}
.cn-hot.is-on{opacity:1;animation:cn-draw .7s cubic-bezier(.65,0,.35,1) forwards}
@keyframes cn-draw{to{stroke-dashoffset:0}}
@keyframes cn-run{from{stroke-dashoffset:44}to{stroke-dashoffset:calc(var(--len,600) * -1px)}}
.cn-net.is-paused .cn-run{animation-play-state:paused}

/* blocks and the disc rise into place, the same turn as the cards (0.9 s, cubic-bezier(.34,1.56,.64,1)) */
.cn-blk,.cn-label,.rg-out{opacity:0;transition:opacity .6s ease,transform .9s cubic-bezier(.34,1.56,.64,1)}
.cn-blk{transform:translateY(70px);transition-delay:calc(.25s + var(--i) * .07s)}
.cn-label{transition-delay:calc(.6s + var(--i) * .07s)}
.rg-out{transition-delay:.5s}
.cn-net.is-in .cn-blk{opacity:1;transform:none}
.cn-net.is-in .cn-label,.cn-net.is-in .rg-out{opacity:1}
.cn-net:not(.is-in) .cn-hot,.cn-net:not(.is-in) .cn-chip{opacity:0!important}
.cn-cap,.cn-toggle{transition:opacity .6s ease .9s}
.cn-net:not(.is-in) .cn-cap,.cn-net:not(.is-in) .cn-toggle{opacity:0;pointer-events:none}

.cn-icon{filter:brightness(.22)}
.rg-hub-mark{filter:brightness(0);opacity:.78}
.rg-seg{pointer-events:none;outline:none;transition:transform .9s cubic-bezier(.34,1.56,.64,1)}
.rg-seg.is-on{transform:translateY(-18px)}
.rg-seg .rg-top{transition:fill .5s ease}
.rg-seg .rg-mark{transition:filter .5s ease}
.rg-seg.is-on .rg-mark{filter:brightness(0);opacity:.72}
.rg-seg:focus-visible .rg-top{stroke:#fff;stroke-width:2}

.cn-label,.rg-out,.rg-hub-label,.cn-chip{position:absolute;white-space:nowrap;pointer-events:none;font-family:var(--font-family-base);line-height:1.3}
.cn-label{transform:translate(-50%,0);font-size:14px;color:var(--color-text-muted)}
.cn-label.is-hot{color:var(--color-text)}
.rg-out{transform:translate(-50%,-50%);font-size:13px;color:var(--color-text-muted);letter-spacing:.04em}
.rg-hub-label{transform:translate(-50%,-50%);font-family:var(--font-family-display);font-size:16px;font-weight:700;letter-spacing:.08em;color:#111}
.cn-chip{left:0;top:0;will-change:transform,opacity;transform:translate(-50%,-130%);padding:.35em .9em;border-radius:999px;font-size:12px;font-weight:700;color:#111;background:var(--hot,#fff);box-shadow:0 .4rem 1.6rem #0008;opacity:0}
.cn-chip.is-out{background:#fff}
.cn-cap{display:flex;gap:1.2rem;align-items:baseline;justify-content:center;margin:1.6rem 0 0;font-size:14px;line-height:1.7;color:var(--color-text-muted)}
.cn-cap b{font-family:var(--font-family-display);font-size:18px;color:var(--color-text)}
.cn-toggle{position:absolute;right:2.4rem;top:1.6rem;font:inherit;font-size:12px;color:var(--color-text-muted);background:none;border:0;border-bottom:1px solid currentColor;padding:4px 0;cursor:pointer}
.cn-toggle:focus-visible{outline:1px solid var(--color-text);outline-offset:5px}
@media(max-width:768px){
  .cn-net{padding:4.4rem .8rem 2.4rem}
  .cn-label{font-size:10px}
  .rg-out{font-size:9px}
  .rg-hub-label{font-size:11px}
  .cn-chip{font-size:10px}
  .cn-cap{flex-direction:column;align-items:center;gap:.2rem;font-size:12px;margin-top:3.2rem}
  .cn-cap b{font-size:16px}
  .cn-toggle{right:1.6rem;top:1.2rem}
}
@media(prefers-reduced-motion:reduce){
  .cn-hot.is-on{animation:none;stroke-dashoffset:0}
  .cn-run{display:none}
  .cn-line,.cn-blk,.cn-label,.rg-out,.rg-seg{transition:none}
  .cn-blk,.cn-label,.rg-out{opacity:1;transform:none}
  .cn-line{stroke-dashoffset:0}
}


.ibm-diagram{--color-text:#f5f5f7;--color-text-muted:#adaeb6;--font-family-base:Arial,"Noto Sans JP",sans-serif;--font-family-display:Arial,"Noto Sans JP",sans-serif;background:#0b0b0d;color:var(--color-text);padding:42px 32px 26px;overflow:hidden}
.ibm-diagram .cn-stage svg{min-height:0;height:auto}.ibm-diagram .rg-hub-mark{filter:none;opacity:1}.ibm-diagram .cn-label{font-size:13px}.ibm-diagram .rg-hub-label{font-size:12px}
.ibm-diagram .cn-cap{min-height:48px;margin:22px 0 0;flex-wrap:wrap;gap:6px 14px;text-align:center}.ibm-diagram .cn-cap b{font-size:18px}.ibm-diagram .cn-cap span{font-size:13px}
.ibm-diagram.km-hero{padding:48px 44px 28px}.ibm-diagram .km-service-intro,.ibm-diagram .km-hero-legend{display:none}.ibm-diagram.is-paused .cn-hot{animation-play-state:paused}
@media(max-width:991px){.ibm-diagram.km-hero{padding:28px 16px 20px}.ibm-diagram.km-service-mobile{padding:30px 18px 20px}.ibm-diagram .cn-label{font-size:10px}.ibm-diagram .cn-cap{flex-direction:column;align-items:center;gap:4px;margin-top:22px}.ibm-diagram .cn-cap b{font-size:16px}.ibm-diagram .cn-cap span{font-size:12px}.ibm-diagram .cn-chip{font-size:10px}.ibm-diagram .rg-hub-label{font-size:10px}}
@media(prefers-reduced-motion:reduce){.ibm-diagram .rg-seg{transform:none}.ibm-diagram .cn-chip{display:none}}
.ibm-diagram.is-compact .rg-hub-label{font-size:8px;letter-spacing:.02em}.ibm-diagram .cn-chip{color:#111}.ibm-diagram .cn-cap b,.ibm-diagram .cn-cap span{color:inherit}

.ibm-diagram .rg-mark{filter:brightness(0) invert(1);opacity:.9}.ibm-diagram .rg-seg.is-on .rg-mark{filter:brightness(0);opacity:.72}

/* Revision: transparent figures, light-page materials, real dimensional brand badges. */
.km-host.ibm-diagram,.km-host.km-hero{background:transparent!important}
.ibm-diagram{--color-text:#233a31;--color-text-muted:#52675c;color:#233a31;padding:28px 24px 20px;overflow:visible}
.ibm-diagram .cn-stage svg{overflow:visible}.ibm-diagram .cn-line{stroke:#9caea5;stroke-width:1.6}.ibm-diagram .cn-run{stroke:#617d6c}.ibm-diagram .cn-hot{stroke-width:4}
.ibm-diagram .cn-label{color:#42584d}.ibm-diagram .cn-label.is-hot{color:#182f23;font-weight:600}
.ibm-diagram .rg-mark,.ibm-diagram .rg-seg.is-on .rg-mark{filter:none;opacity:1}
.ibm-diagram .cn-chip{box-shadow:0 3px 9px #20382a21;color:#19372a}.ibm-diagram .cn-chip.is-out{background:#fff;border:1px solid #c7d8cf}
.ibm-diagram .cn-cap{color:#3d5648}.ibm-diagram .cn-cap b{color:#203e2b}
.ibm-tools-note{display:block;text-align:center;font-size:11px;line-height:1.5;color:#6b7c72;margin:8px 0 0}
/* 事業の見出しは MECHA 元の大きさのまま (2026-11-08 ユーザー指示で縮小指定を撤去) */
.section[data-business] .project-icon{display:none}
@media(max-width:991px){.ibm-diagram.km-service-mobile{padding:22px 14px 18px}}
.section[data-business] img.project-image{object-fit:contain!important;background:transparent}.section[data-business] .project-thumb{object-fit:contain;background:transparent}

.container.is-desktop>.km-service.ibm-diagram{width:100%;grid-column:1/-1;max-width:none;margin:24px 0 42px;padding:26px 40px 20px}.ibm-diagram .cn-label{font-size:12px}.ibm-diagram .cn-cap{margin-top:18px}.ibm-tools-note{margin-top:2px}@media(max-width:991px){.ibm-diagram .cn-label{font-size:9px}.ibm-diagram .cn-chip{font-size:9px}}

.ibm-service-copy{margin:0 0 28px;color:#2f4238}.ibm-service-copy h3{font:500 22px/1.5 Arial,"Noto Sans JP",sans-serif;margin:0 0 14px}.ibm-service-copy p{font:400 14px/1.9 Arial,"Noto Sans JP",sans-serif;margin:0}

.ibm-external-link{display:inline-block;margin-top:18px;color:#345e4a;font:500 13px/1.6 Arial,"Noto Sans JP",sans-serif;text-decoration:underline;text-underline-offset:4px}.ibm-external-link:focus-visible{outline:2px solid #345e4a;outline-offset:5px}