/* ========= 子页面专用样式 ========= */
            :root {
                --main-blur: 11px;
                --accent: rgba(175, 190, 255, .6);
                --accent-dark: rgb(25, 21, 97);
            }

            #cover {
                position: fixed;
                /* 固定定位，不随内容滚动，作为背景层 */
                top: 0;
                left: 0;
                width: 100%;
                height: 100vh;
                /* 初始全屏 */
                background: var(--bg-img)center/cover;
                display: flex;
                align-items: center;
                justify-content: center;
                overflow: hidden;
                z-index: 50;
                /* 确保全屏时覆盖内容，收缩时不遮挡（需配合内容区z-index） */
                transition: height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
                /* 平滑过渡动画 */
                margin: 0 !important;
                padding: 0 !important;
                box-sizing: border-box !important;
            }

            /* 收缩状态：高度为0（或你想要的隐藏高度，如50px） */
            #cover.shrinked {
                height: 0;
                /* 完全隐藏，或改为50px保留小部分 */
                z-index: 40;
                /* 收缩时在内容下方 */
            }

            /* 内容区样式（确保不被初始封面遮挡） */
            .content {
                min-height: 2000px;
                /* 给足够高度方便滚动测试 */
                margin-top: 100vh;
                /* 初始时在封面下方 */
                z-index: 30;
                position: relative;
            }

            #cover.pushed {
                height: 0;
                z-index: 40;
            }

            #bigTitle {
                /* 基础样式：居中、白色、粗体 */
                color: #f8f9fa;
                font-weight: 900;
                font-size: calc(8vw + 2rem);
                /* 响应式大小，大屏更大气 */
                letter-spacing: 0.1em;
                /* 字母间距拉开，更有力量感 */
                margin: 0;
                padding: 0 20px;
                text-align: center;
                text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
                /* 文字阴影增强立体感 */
            }

            /* 每个字母的初始状态 */
            #bigTitle span {
                display: inline-block;
                opacity: 0;
                /* 完全透明 */
                transform: translateY(50px) scale(0.8);
                /* 下移+缩小 */
                transition: all 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
                /* 缓动曲线，更有弹性 */
            }

            /* 封面全屏时：字母依次显示（通过JS添加active类） */
            #bigTitle span.active {
                opacity: 1;
                /* 完全显示 */
                transform: translateY(0) scale(1);
                /* 回到原位+恢复大小 */
            }

            /* 封面收缩时：字母反向消失 */
            #cover.pushed #bigTitle span {
                opacity: 0;
                transform: translateY(-30px) scale(0.6);
                /* 上移+缩小消失 */
            }

            /* 主框架：左侧粘 + 右侧流 */
            #sub-main {
                display: flex;
                width: 100%;
                height: auto;
            }

            /* 左侧导航 - sticky 跟随 */
            #sub-click {
                position: sticky;
                top: 0;
                /* 贴顶 */
                width: 29%;
                height: 100vh;
                /* 自身仍一屏高，可内部滚动 */
                padding: 40px 0;
                background: rgba(255, 255, 255, .1);
                overflow-y: auto;
                /* 左侧过长时自己出滚动条 */
            }

            #sub-drawer {
                margin: 0 auto;
                width: 80%;
                height: 100%;
                display: flex;
                flex-direction: column;
                justify-content: space-around;
                position: relative;
            }

            #sub-drawer::before {
                content: "";
                width: 8px;
                height: 90%;
                position: absolute;
                left: -20px;
                top: 5%;
                z-index: 120;
                background: linear-gradient(to bottom,
                        rgba(175, 190, 255, .3)0%,
                        rgba(175, 190, 255, .8)50%,
                        rgba(175, 190, 255, .3)100%);
            }

            .sub-box {
                width: 100%;
                position: relative;
                z-index: 100;
                transition: all .3s ease;
                border-radius: 8px;
                padding: 10px 0;
            }

            .sub-btn {
                width: 100%;
                font: 800 28px '';
                background: transparent;
                border: none;
                color: rgba(255, 255, 255, .6);
                cursor: pointer;
                text-align: left;
                padding: 15px 20px;
                border-radius: 8px;
                transition: all .3s ease;
            }

            .sub-box.active .sub-btn {
                background: var(--accent);
                color: var(--accent-dark);
                box-shadow: 0 5px 15px rgba(175, 190, 255, .3);
            }

            .sub-head {
                position: absolute;
                color: rgba(255, 255, 255, .3);
                font-size: 180px;
                font-weight: 700;
                left: -60px;
                top: 50%;
                transform: translateY(-50%);
                text-shadow: 2px -1px 8px rgba(175, 190, 255, .5);
                transition: all .3s ease;
                opacity: .5;
            }

            .sub-box.active .sub-head {
                color: white;
                opacity: 1;
                text-shadow: 2px -1px 15px rgba(175, 190, 255, .8);
            }

            .sub-tags {
                margin-left: 20px;
                margin-top: 10px;
                display: flex;
                gap: 15px;
                opacity: 0;
                transform: translateY(10px);
                transition: all .3s ease;
                pointer-events: none;
            }

            .sub-box.active .sub-tags {
                opacity: 1;
                transform: translateY(0);
                pointer-events: auto;
            }

            .sub-tag {
                font-size: 16px;
                color: rgba(255, 255, 255, .8);
                background: rgba(175, 190, 255, .3);
                padding: 5px 12px;
                border-radius: 15px;
                cursor: pointer;
                transition: all .2s ease;
            }

            .sub-tag:hover {
                background: rgba(175, 190, 255, .6);
                color: white;
            }

            /* 右侧内容 - 普通流，不再局部滚动 */
            #sub-slide {
                position: relative;
                width: 71%;
                height: auto;
                overflow-y: visible;
                background: linear-gradient(to right bottom,
                        rgba(255, 255, 255, .6),
                        rgba(255, 255, 255, .3),
                        rgba(255, 255, 255, .2));
            }

            /* 局部进度条已不需要，可隐藏 */
            #sub-bar-track {
                display: none;
            }

            #sub-cards {
                width: 80%;
                margin: 0 auto;
            }

            .sub-card {
                min-height: 100vh;
                padding: 10% 0;
                scroll-margin-top: 0;
            }

            .sub-small {
                font-size: 30px;
                font-weight: 600;
                padding-bottom: min(5%, 10px);
                color: var(--accent-dark);
            }

            .wodetu {
                display: block;
                /* 转为块级元素，单独占一行，位于图片下方 */
                font-size: 12px;
                /* 小字（可根据需求调整大小，如14px） */
                text-align: center;
                /* 文字自身水平居中 */
                margin-top: 6px;
                margin-bottom: 8px;
                /* 与图片保持一定间距，避免紧贴 */
                color: #666;
                /* 可选：文字颜色稍浅，更符合图例风格 */
            }

            .sub-title {
                font-size: 80px;
                font-weight: 700;
                padding-bottom: min(20%, 40px);
                color: var(--accent-dark);
            }

            .sub-txt {
                font-size: 24px;
                text-align: justify;
                font-weight: 400;
                color: black;
                line-height: 1.8;
                margin-bottom: 60px;
            }

            .sub-img {
           width: min(100%, 900px);
           margin: 16px auto;
           overflow: hidden;
           text-align: center;
           border-radius: 12px;
           box-shadow: 0 10px 30px rgba(0,0,0,.08);
}

/* 这次把你漏掉的大括号补上；并限制最大高度，保持比例 */
.sub-img img {
  width: auto;          /* 关键：不要强制 100% */
  max-width: 100%;      /* 容器窄时缩小 */
  max-height: 480px;    /* 需要可改 360/400/520 */
  height: auto;
  margin: 0 auto;
  object-fit: contain;  /* 在限制高度时保持比例 */
}


            /* 表格基础样式 */
            .fg-table {
                width: 100%;
                max-width: 100%;
                table-layout: fixed;
                border-collapse: collapse;
                margin: 24px auto;
                box-sizing: border-box;
                border: 2px solid rgb(25, 21, 97);
            }

            /* 单元格样式 */
            .fg-table td {
                border: 1px solid #666;
                padding: 12px;
                text-align: center;
                transition: background-color 0.3s ease;
                /* 平滑过渡效果 */
            }

            .fg-table th,
            .fg-table td {
                word-wrap: break-word;
                /* 长单词或URL换行 */
                word-break: break-all;
                /* 强制在边界处换行 */
                vertical-align: top;
                /* 内容顶部对齐，避免换行后错位 */
            }

            /* 悬停高亮效果 */
            .fg-table td:hover {
                background-color: rgba(125, 125, 125, 0.2);
                box-shadow: 0 0 8px rgba(175, 190, 255, .6);
                /* 发光效果 */
            }


            .img-container {
                overflow-x: auto;
                /* 开启水平滚动 */
                white-space: nowrap;
                /* 防止子元素换行 */
                display: flex;
                gap: 10px;
                width: 100%;
                max-width: 800px;
                margin: 0 auto;
                /* 可选：隐藏滚动条但保留滚动功能（兼容各浏览器） */
                scrollbar-width: none;
                /* Firefox */
                -ms-overflow-style: none;
                /* IE 和 Edge */
            }


            .img-container::-webkit-scrollbar {
                display: none;
            }

            .img-container img {
                width: 100%;
                height: auto;
                object-fit: cover;
                border-radius: 4px;
            }

            pdf-container {
                width: 100%;
                justify-content: center;
                display: flex;
                background-color: rgba(125,125,125,0.1);
                /* 背景色可选 */
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }

            /* PDF 容器样式 */
            .pdf-content {
                width: 100%;
                background-color: azure;
                /* 宽度占视口80% */
                height: 80vh;
                /* 高度占视口80% */
                border: 1px solid #ddd;
                /* 边框可选 */
                box-shadow: 0 2px 10px rgba(125,125,125, 0.3);
                object-fit: contain;
                /* 阴影效果可选 */
            }