.course-roadmap{margin:28px 0 18px}.course-roadmap ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:0;list-style:none}.step-starter{--step:#a74f75;--tint:#fff1f6}.step-basic{--step:#267888;--tint:#edf8fa}.step-advance{--step:#94661b;--tint:#fff7e6}.step-pro{--step:#397554;--tint:#eef7ed}.step-next{--step:#745a91;--tint:#f5f0fa}.course-roadmap li{position:relative;min-width:0}.course-roadmap li:not(:last-child):after{content:'›';position:absolute;right:-11px;top:45%;color:#667b75;font-size:22px;z-index:1}.course-roadmap a{display:flex;flex-direction:column;gap:8px;height:100%;box-sizing:border-box;padding:16px 12px;border:1px solid #dce6e3;border-top:5px solid var(--step);border-radius:12px;background:var(--tint);text-decoration:none;color:#293e38}.course-roadmap a:hover{border-color:var(--step)}.course-roadmap a:focus-visible{outline:3px solid var(--step);outline-offset:4px}.step-number{font-size:11px;font-weight:bold;letter-spacing:.12em;color:var(--step)}.step-name{font-size:15px;font-weight:bold;line-height:1.5}.step-en{font-size:11px;color:var(--step);line-height:1.4}.course-roadmap strong{font-size:16px;line-height:1.6;margin-top:8px}.step-desc{font-size:13px;line-height:1.8}.step-more{font-size:12px;margin-top:auto;padding-top:12px;text-decoration:underline;text-underline-offset:4px}.roadmap-note{font-size:13px;color:#52665e}.roadmap-note a{text-decoration:underline}.course-stages article[id]{border-left-color:var(--step);background:var(--tint);scroll-margin-top:24px}.course-stages article[id] h3{color:var(--step)}
@media(min-width:1050px){.course-roadmap{width:min(1100px,88vw);position:relative;left:50%;transform:translateX(-50%)}.course-roadmap a{padding:20px 16px}.step-name{font-size:17px}}
@media(max-width:700px){.course-roadmap ol{grid-template-columns:1fr;gap:22px}.course-roadmap a{display:grid;grid-template-columns:1fr;gap:4px;padding:16px 20px;border-top:1px solid #dce6e3;border-left:5px solid var(--step)}.course-roadmap li:not(:last-child):after{content:'↓';top:auto;bottom:-24px;left:24px;right:auto;font-size:19px}.step-name{font-size:19px}.step-en{font-size:12px}.course-roadmap strong{margin-top:6px}.step-more{padding-top:8px}}