@font-face{font-family:yiyingbao;font-display:swap;src:url("https://img.bjyyb.net/ttf/iconfont.ttf?v=1.5") format("truetype");}
.abcda9-component, .abcda9-component * {box-sizing:border-box}
.abcda9-component {color:#103754;font-family:Arial,sans-serif}
.abcda9-component .timeline-inner {width:100%;padding:40px 0 28px}
.abcda9-component .title-inner {width:100%;box-sizing:border-box}
.abcda9-component .timeline-content-inner {width:100%;padding:0 clamp(12px,2.8vw,56px)}
.abcda9-component .component-title {display:block;margin:0 0 24px}
.abcda9-component .timeline-shell {--card-width:160px;--item-step:96px;--edge-space:104px;--axis-y:300px;--card-height:200px;--stem-length:63px;position:relative;padding:0 38px}
.abcda9-component .timeline-viewport {overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;outline-offset:4px}
.abcda9-component .timeline-viewport::-webkit-scrollbar {display:none}
.abcda9-component .carousel-stop {position:absolute;top:0;height:1px;pointer-events:none;scroll-snap-align:start;scroll-snap-stop:always}
.abcda9-component .item-manager {position:relative;isolation:isolate;min-width:100%;width:var(--timeline-width, max(100%, calc(2 * var(--edge-space) + (var(--timeline-count) - 1) * var(--item-step))))}
.abcda9-component .scene {position:relative;display:block;width:100%;height:600px;margin:0;padding:0;border:0}
.abcda9-component .mountain {display:none}
.abcda9-component .axis {position:absolute;z-index:1;left:var(--edge-space);right:var(--edge-space);top:calc(var(--axis-y) - 1px);height:2px;pointer-events:auto}
.abcda9-component .event {position:absolute;z-index:2;top:0;left:var(--x, calc(var(--edge-space) + var(--event-position) * var(--item-step)));width:0;height:100%;opacity:1;visibility:visible;pointer-events:none;transition:opacity .22s ease,visibility 0s}
.abcda9-component .event[inert] {opacity:0;visibility:hidden;transition:opacity .22s ease,visibility 0s .22s}
.abcda9-component .point {position:absolute;z-index:2;left:-7px;top:calc(var(--axis-y) - 7px);width:14px;height:14px;border-width:3px;border-style:solid;border-radius:50%;background:#fff;pointer-events:auto}
.abcda9-component .stem {position:absolute;left:-.5px;top:calc(var(--axis-y) - 7px - var(--stem-length));width:1px;height:var(--stem-length);pointer-events:auto}
.abcda9-component .stem::after {content:"";position:absolute;inset:0 -5px}
.abcda9-component .event:nth-of-type(even) .stem {top:calc(var(--axis-y) + 7px)}
.abcda9-component .year {position:absolute;top:calc(var(--axis-y) + 18px);left:-28px;width:56px;margin:0;padding:3px 0;border:0;background:none;cursor:pointer;pointer-events:auto;font-weight:500;cursor:pointer}
.abcda9-component .event:nth-of-type(even) .year {top:calc(var(--axis-y) - 43px)}
.abcda9-component .card {position:absolute;left:calc(var(--card-width) / -2);top:calc(var(--axis-y) - 7px - var(--stem-length) - var(--card-height));display:flex;flex-direction:column;justify-content:flex-start;gap:10px;width:var(--card-width);height:var(--card-height);padding:18px 14px;margin:0;border-width:1px;border-style:solid;border-radius:8px;background:#fff;color:inherit;font-family:inherit;text-align:left;cursor:pointer;pointer-events:auto;transition:border-color .2s,box-shadow .2s}
.abcda9-component .event:nth-of-type(even) .card {top:calc(var(--axis-y) + 7px + var(--stem-length))}
.abcda9-component .card h2 {display:-webkit-box;margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow-wrap:break-word;word-break:normal}
.abcda9-component .card p {display:-webkit-box;margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:4}
.abcda9-component .event.active {z-index:3}
.abcda9-component .event.active .card {box-shadow:0 8px 24px color-mix(in srgb,var(--card-hover-border-color) 12.55%,transparent)}
.abcda9-component .event.active .point {border-color:#fff;box-shadow:0 0 0 2px var(--point-hover-color),0 0 0 6px color-mix(in srgb,var(--point-hover-color) 10%,transparent)}
.abcda9-component .event.active .year {font-weight:700}
.abcda9-component .card:focus-visible,
.abcda9-component .year:focus-visible,
.abcda9-component .timeline-nav:focus-visible,
.abcda9-component .close:focus-visible {outline:2px solid #0083c8;outline-offset:3px}
.abcda9-component .timeline-nav {position:absolute;z-index:4;top:calc(var(--axis-y) - 16px);display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #a9d7e9;border-radius:50%;font:28px/1 Arial,sans-serif;cursor:pointer}
.abcda9-component .timeline-nav-icon {display:block;line-height:1}
.abcda9-component .timeline-nav-icon--font.yiyingbaoicon {font-family:"yiyingbao";font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.abcda9-component .timeline-nav-icon--image {width:1em;height:1em;object-fit:contain}
.abcda9-component .previous {left:0}
.abcda9-component .next {right:0}
.abcda9-component .timeline-nav:disabled {opacity:.3;cursor:default}
.abcda9-component .timeline-nav[hidden],
.abcda9-component .detail[hidden],
.abcda9-component .detail-backdrop[hidden] {display:none}
.abcda9-component .detail-backdrop {position:fixed;z-index:19;inset:0;background:#10375466}
.abcda9-component .detail {position:fixed;z-index:20;left:50%;top:50%;transform:translate(-50%,-50%);width:min(640px,calc(100vw - 32px));max-height:80vh;overflow:auto;padding:28px;border:1px solid #b1e4f5;border-radius:14px;background:#fff;box-shadow:0 12px 60px #17344b30}
.abcda9-component .detail.is-preview {top:auto;bottom:20px;transform:translateX(-50%);max-height:36vh}
.abcda9-component .detail .detail-title {display:block;margin:0 40px 18px 0}
.abcda9-component .detail .detail-content {display:block;margin:0;white-space:pre-line}
.abcda9-component .close {position:absolute;top:16px;right:16px;width:28px;height:28px;padding:0;border:0;border-radius:50%;color:#103754;font-size:18px;cursor:pointer}
@media(max-width:760px) {
.abcda9-component .timeline-inner {padding:24px 0}
.abcda9-component .timeline-content-inner {padding:0 12px}
.abcda9-component .timeline-shell {--card-width:152px;--item-step:92px;--edge-space:96px;--axis-y:280px;--card-height:190px;--stem-length:53px;padding:0 30px}
.abcda9-component .scene {height:560px}
.abcda9-component .card {padding:16px 12px}
.abcda9-component .timeline-nav {width:28px;height:28px;top:calc(var(--axis-y) - 14px)}
.abcda9-component .detail {padding:24px 20px}
}
@media(prefers-reduced-motion:reduce) {
.abcda9-component .card,
.abcda9-component .event,
.abcda9-component .event[inert] {transition:none}
}