.news-container {
            display: flex;
            flex-wrap: wrap;
                      
            align-items: flex-start; /* Aligns items to the top */
            align-content: flex-start; /* For multiple lines */
            max-width: 1200px;
            margin: auto;
            padding: 20px;
            background: #fff;
        }

        .main {
            flex: 1 1 70%;
            padding-right: 20px;
        }

        .sidebar {
            flex: 1 1 28%;
            align-self: flex-start; /* 强制从顶部开始排列 */
        }

        .detail-title-header {
            font-size: 28px;
            font-weight: normal;
            margin-bottom: 10px;
        }

        .detail-meta {
            color: #999;
            font-size: 12px;
            margin-bottom: 20px;
            padding-bottom: 30px;
            padding-top: 20px;
            border-bottom: 1px solid #eee;
        }

        .detail-content {
            padding-bottom: 30px;
            border-bottom: 1px solid #eee;
        }

        .content p {
            margin-bottom: 16px;
            text-align: justify;
        }

        .content img {
            max-width: 100%;
            margin: 20px 0;
        }

        .related h3 {
            font-size: 16px;
            margin-bottom: 10px;
        }

        .related-item {
            display: flex;
            margin-bottom: 10px;
        }

        .related-item img {
            width: 80px;
            height: 60px;
            object-fit: cover;
            margin-right: 10px;
        }

        .related-item div {
            font-size: 14px;
        }

        .detail-pager {
            margin-top: 30px;
            font-size: 14px;
            padding-bottom: 30px;
            border-bottom: 1px solid #eee;
        }


        .pager-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 30px;
            padding: 10px 0;
            font-size: 14px;
            flex-wrap: wrap;
            /* 允许在小屏幕上换行 */
        }

        .pager-links a {
            color: #003e7e;
            text-decoration: none;
        }

        .pager-links .page-desc {
            color: #aaa;
            padding-right: 10px;
        }

        .pager-links .pager-link {
            line-height: 1.5;
            padding-bottom: 8px;

        }

        .btn-back {
            background-color: #007bff;
            /* 蓝色背景 */
            color: white;
            /* 白色文字 */
            padding: 8px 16px;
            border-radius: 4px;
            text-decoration: none;
            font-weight: bold;
        }

        .btn-back:hover {
            background-color: #0056b3;
            /* 悬停变深蓝 */
        }

        .fade-in {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.8s ease, transform 0.8s ease;
        }

        .fade-in.show {
            opacity: 1;
            transform: translateY(0);
        }

        .detail-card-container {
            display: flex;
            flex-direction: column;
            justify-content: flex-start; /* 子元素顶部对齐 */
            align-items: flex-start; /* 子元素左侧对齐 */
            vertical-align: top; /* 子元素垂直居中 */
            gap: 20px;
            /* 卡片之间的垂直间距 */
            /* padding: 20px; */
            max-width: 400px;
        
        }

        .detail-card {

            border-radius: 8px;
            overflow: hidden;


            display: flex;
            flex-direction: column;
            padding: 16px;
        }

        .detail-image {
            width: 100%;
            height: auto;
            margin-bottom: 12px;
        }

        .detail-image img {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 4px;
        }

        .detail-date {
            font-size: 12px;
            color: #888;
            margin-bottom: 8px;
        }

        .related h3 {
            padding-left: 16px;
            font-weight: normal;
            font-size: 20px;
        }

        .detail-title {
            font-size: 16px;
            color: #333;
            display: -webkit-box;
            /* 必须和下面两行一起使用 */
            -webkit-box-orient: vertical;
            /* 内容垂直排列 */
            -webkit-line-clamp: 2;
            /* 最多显示 2 行 */
            overflow: hidden;
            /* 隐藏超出内容 */
            text-overflow: ellipsis;
            /* 可选：添加省略号 */
            line-height: 1.4;
            /* 行高（可选） */
            max-height: calc(1.4em * 2);
            /* 最大高度为 2 行文字高度（可选） */
        }

        @media screen and (max-width: 768px) {
            .container {
                flex-direction: column;
            }

            .main,
            .sidebar {
                flex: 1 1 100%;
                padding-right: 0;
            }

            
        }

        @media screen and (max-width: 600px) {
            .pager-container {
                flex-direction: column;
                align-items: flex-start;
            }

            .btn-back {
                align-self: flex-end;
                margin-top: 10px;
            }
        }
           .detail-content section
        {
           padding-left: 0px;
           padding-right: 0px;
           padding-bottom: 0px;
           padding-top: 0px;
           text-align: left;
        }