@charset "utf-8";

#focus-202609-01 { --focus-menu-height: 44px; --focus-reading-top: calc(var(--focus-menu-height) + 16px); }
#focus-202609-01 .album-menu { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 8px; background: #fffcee; }
#focus-202609-01 .album-menu-brand { display: flex; align-items: center; flex: 0 0 134px; min-width: 0; min-height: 44px; visibility: hidden; pointer-events: none; }
#focus-202609-01 .album-menu-brand img { display: block; width: 100%; max-width: 134px; height: auto; }
#focus-202609-01 .album-menu.is-stuck .album-menu-brand { visibility: visible; pointer-events: auto; }
#focus-202609-01 .album-menu-links { display: flex; justify-content: flex-start; flex-wrap: nowrap; flex: 1 1 0; min-width: 0; height: 44px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-padding-inline: 4px; overscroll-behavior-x: contain; list-style: none; margin: 0; padding: 0 4px; }
#focus-202609-01 .album-menu-links::-webkit-scrollbar { display: none; }
#focus-202609-01 .album-menu-links li { position: relative; flex: 0 0 auto; }
/* 空間充足時靠右；溢出時 auto margin 歸零，第一項仍在可捲動範圍內。 */
#focus-202609-01 .album-menu-links li:first-child { margin-left: auto; }
#focus-202609-01 .album-menu-links li + li::before { content: ''; position: absolute; left: 0; top: 50%; height: 32px; width: 1px; background: #939393; transform: translateY(-50%); }
#focus-202609-01 .album-menu-links a { display: flex; align-items: center; min-height: 44px; padding: 6px 12px; color: #444; font-size: 18px; font-weight: 700; line-height: 1.5; white-space: nowrap; }
#focus-202609-01 .album-menu-links a:hover { color: #444; text-decoration: underline; }
#focus-202609-01 .album-menu a:focus-visible { outline: 3px solid #794500; outline-offset: -3px; }
#focus-202609-01 #list_2,
#focus-202609-01 #list_3,
#focus-202609-01 #list_5,
#focus-202609-01 #list_7 { scroll-margin-top: var(--focus-reading-top); }

#focus-202609-01 #head { background-color: #fff; }
#focus-202609-01 #head .bg { background: url('../../../img_V2/focus/202609_01/head_bg1.jpg') center / cover no-repeat; }
#focus-202609-01 #head .t1 { font-size: 71px; line-height: 95px; color: #ee155a; }
#focus-202609-01 #head .t3 { padding: 16px; background: rgba(255,255,255,.58); border-radius: 27px; }
#focus-202609-01 #list_2 { background-color: #fff0d9; }
#focus-202609-01 #list_5 { background: url('../../../img_V2/focus/202609_01/bg_5.jpg') center / cover no-repeat; padding-bottom: 3rem; }
#focus-202609-01 .dis_t1 { color: #ff6100; }

/* 未啟用 JavaScript 時保留一般文件流，五組圖表均可閱讀。 */
#focus-202609-01 #block4_2 { --focus-stage-height: calc(100svh - var(--focus-menu-height)); overflow-anchor: none; }
#focus-202609-01 .block4_2_wrap { padding: 16px 0; }
#focus-202609-01 .block4_2_timeline { display: grid; grid-template-columns: 128px minmax(0,1fr); gap: 24px; align-items: start; }
#focus-202609-01 .timeline-left { position: sticky; top: var(--focus-reading-top); --year-size: clamp(72px,7.2vw,118px); }
#focus-202609-01 .timeline-years { position: relative; display: flex; flex-direction: column; align-items: center; gap: clamp(8px,2.4vh,24px); }
#focus-202609-01 .timeline-line { position: absolute; width: 2px; left: 50%; top: calc(var(--year-size)/2); bottom: calc(var(--year-size)/2); background: rgba(0,0,0,.4); }
#focus-202609-01 .timeline-year { width: var(--year-size); height: var(--year-size); flex: 0 0 auto; padding: 0; border: 0; border-radius: 50%; background: #191815; color: #fff; font-size: 20px; font-weight: 700; line-height: 1.2; cursor: pointer; transform: scale(.84); transition: background-color .25s, transform .25s; }
#focus-202609-01 .timeline-year.is-active { background: #f7941d; transform: scale(1); }
#focus-202609-01 .timeline-right { min-width: 0; }
#focus-202609-01 .timeline-page { margin: 0 0 72px; scroll-margin-top: var(--focus-reading-top); }
#focus-202609-01 .timeline-page h2 { margin-bottom: 12px; }
#focus-202609-01 .timeline-page p { margin-bottom: 16px; }
#focus-202609-01 .timeline-page img { display: block; }
#focus-202609-01 .finding-chart { position: relative; }
/* 無 JavaScript 時只呈現一張完整原圖；分圖框不影響敘述的文件流。 */
#focus-202609-01 .chart-part-second { display: none; }
#focus-202609-01 .timeline-actions { display: none; }

/* 僅固定左側導覽；右側五組永遠留在文件流，沒有固定高度或裁切敘述。 */
#focus-202609-01 .is-enhanced .timeline-left { --year-size: min(118px,7.2vw,calc((var(--focus-stage-height) - 140px)/5)); }
#focus-202609-01 .is-enhanced .chart-part-first { height: var(--chart-first-height); overflow: hidden; }
#focus-202609-01 .is-enhanced .chart-part-second { display: block; position: relative; height: var(--chart-second-height); margin-top: var(--chart-gap,24px); overflow: hidden; opacity: var(--chart-opacity,1); }
#focus-202609-01 .is-enhanced .chart-second { position: absolute; top: 0; left: 0; transform: translateY(var(--chart-cut-offset)); pointer-events: none; }
#focus-202609-01 .is-enhanced .timeline-page.is-navigating .text-center,
#focus-202609-01 .is-enhanced .timeline-page.is-navigating .chart-first,
#focus-202609-01 .is-enhanced .timeline-page.is-navigating > .row > .col-12 > img { animation: focus-finding-in .18s ease-out both; }
#focus-202609-01 .is-enhanced .timeline-actions { display: flex; justify-content: center; align-items: center; position: fixed; bottom: calc(var(--focus-bottom-inset,0px) + 4px); left: var(--focus-nav-center,50%); width: 44px; height: 44px; margin-left: -22px; pointer-events: none; z-index: 1; }
/* 圓圈縮小為 36px，保留 44px 點擊範圍，將底部空間還給圖表。 */
#focus-202609-01 .timeline-skip { position: relative; display: inline-flex; justify-content: center; align-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; color: #666; background: #fff0d9; cursor: pointer; animation: focus-skip-in .2s ease-out; pointer-events: auto; }
#focus-202609-01 .timeline-skip::before { content: ''; position: absolute; inset: 4px; border: 1.5px solid currentColor; border-radius: 50%; pointer-events: none; }
#focus-202609-01 .timeline-skip[hidden] { display: none; }
#focus-202609-01 .timeline-skip:hover { color: #313131; }
#focus-202609-01 .timeline-skip:hover::before { background: rgba(255,255,255,.35); }
#focus-202609-01 .timeline-skip svg { position: relative; width: 20px; height: 20px; }
@keyframes focus-skip-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes focus-finding-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
@media (max-width: 991px) {
    #focus-202609-01 .block4_2_timeline { grid-template-columns: 60px minmax(0,1fr); gap: 12px; }
    #focus-202609-01 .timeline-left,
    #focus-202609-01 .is-enhanced .timeline-left { --year-size: min(56px,calc((var(--focus-stage-height) - 100px)/5)); }
    #focus-202609-01 .timeline-year { font-size: 15px; }
    #focus-202609-01 .timeline-page { font-size: 16px; line-height: 1.7; }
    #focus-202609-01 .timeline-page h2 { font-size: 24px; }
    #focus-202609-01 .timeline-page h5 { font-size: 18px; }
}
@media (max-width: 767px) {
    #focus-202609-01 .album-menu-brand { flex-basis: 96px; }
    #focus-202609-01 .album-menu-links a { padding-left: 8px; padding-right: 8px; font-size: 16px; }
    #focus-202609-01 #head .bg { display: none; }
    #focus-202609-01 #head .t1 { font-size: 35px; line-height: 1.2; }
    #focus-202609-01 #head .t2 { font-size: 23px; }
    #focus-202609-01 #head .t3 { padding: 0; }
    #focus-202609-01 .head_title br { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    #focus-202609-01 .timeline-skip { animation: none; }
    #focus-202609-01 .timeline-year { transition: none; }
    #focus-202609-01 .is-enhanced .timeline-page.is-navigating .text-center,
    #focus-202609-01 .is-enhanced .timeline-page.is-navigating .chart-first,
    #focus-202609-01 .is-enhanced .timeline-page.is-navigating > .row > .col-12 > img { animation: none; }
}
#list_3 { background-color: #ffe0b4; }
#list_7 { background-color: #ffe0b4; }
.dis-swiper, .qa-swiper, .speak-swiper { padding-bottom: 35px; }