.topicVisual{padding:70px 0;background:#07131f;color:#fff;border-bottom:1px solid #173444}.topicVisualHead{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end;margin-bottom:28px}.topicVisualHead span,.topicDiagram>strong{color:#77d5c9;font:800 9px monospace;letter-spacing:.13em}.topicVisualHead h2{font-size:clamp(32px,4vw,54px);line-height:.98;letter-spacing:-.045em;margin:10px 0 0}.topicVisualHead p{color:#a8b7be;font-size:15px}.topicVisualGrid{display:grid;grid-template-columns:1.1fr .9fr;gap:15px}.topicImage{margin:0;border:1px solid rgba(255,255,255,.13);border-radius:12px;overflow:hidden;background:#0b1b28;min-height:330px}.topicImage img{display:block;width:100%;height:100%;min-height:330px;object-fit:cover}.topicDiagram{padding:25px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(255,255,255,.035)}.topicDiagram ol,.topicDiagram ul{list-style:none;padding:0;margin:18px 0 28px}.topicDiagram ol{display:grid;grid-template-columns:1fr 1fr;gap:9px}.topicDiagram ol li{position:relative;min-height:80px;padding:15px;border:1px solid rgba(255,255,255,.11);border-radius:8px;background:#0c2230}.topicDiagram ol li:after{content:'→';position:absolute;right:-9px;top:28px;color:#77d5c9;z-index:2}.topicDiagram ol li:nth-child(2n):after,.topicDiagram ol li:last-child:after{display:none}.topicDiagram ol span{display:block;color:#77d5c9;font:800 8px monospace}.topicDiagram ol b{display:block;margin-top:13px;font-size:13px}.topicDiagram ul li{margin-top:13px}.topicDiagram ul b{display:block;font-size:11px;margin-bottom:6px}.topicDiagram ul i{display:block;height:7px;border-radius:10px;background:linear-gradient(90deg,#57cbbd var(--level),#294553 var(--level))}.topicVisual.noImage .topicVisualGrid{grid-template-columns:1fr}.js .topicVisual{animation:topicEnter .55s ease both}@keyframes topicEnter{from{opacity:0;transform:translateY(14px)}}@media(max-width:850px){.topicVisualHead,.topicVisualGrid{grid-template-columns:1fr}.topicVisual{padding:55px 0}.topicImage,.topicImage img{min-height:240px}.topicDiagram ol{grid-template-columns:1fr}.topicDiagram ol li:after{content:'↓';right:16px;top:auto;bottom:-13px}.topicDiagram ol li:nth-child(2n):after{display:block}.topicDiagram ol li:last-child:after{display:none}}@media(max-width:520px){.topicVisual{padding:45px 0}.topicImage,.topicImage img{min-height:190px}.topicVisualHead h2{font-size:34px}}@media(prefers-reduced-motion:reduce){.js .topicVisual{animation:none}}