/* ===== 基础排版 (无改动) ===== */
.news-wrapper {
    max-width: 1200px;
    margin: 0 auto;
}

.news-card {
    padding: 8px 45px;
    overflow: hidden;
}

.news-row {
    position: relative;
    overflow: hidden;
    margin: 14px 0;
    height: 30px;
}

.news-row.row-0 {
    height: 42px;
}

.news-row.row-0 li a {
    font-size: 23px;
    font-weight: 600;
}

.news-row ul {
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    list-style: none;
    margin: 0;
    padding: 0;
}

.news-row li {
    margin-right: 40px;
    font-size: 18px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
}

.news-dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #0091ff;
    margin-right: 6px;
    display: inline-block;
}

.news-row a {
    color: #000;
    text-decoration: none;
}

.news-row a:hover {
    text-decoration: underline;
}

/* ============== 动画核心 ============== */
.news-marquee {
    display: inline-flex;
}

.news-row:hover .news-marquee {
    animation-play-state: paused;
}

/*
【动画优化 - 柔和版】
这个版本在循环开始时增加了淡入效果，并提供了平滑的淡出，
解决了切换闪烁的问题，同时保持了较短的等待时间。
*/
@keyframes news-slideFade {

    /* 阶段1: 淡入 (0% -> 5%)
动画开始时，元素从透明变为不透明，实现柔和的出现效果。
*/
    0% {
        transform: translateX(0);
        opacity: 0;
    }

    5% {
        transform: translateX(0);
        opacity: 1;
    }

    /* 阶段2: 暂停阅读 (5% -> 15%)
元素完全可见后，停留一段时间供用户阅读。
*/
    15% {
        transform: translateX(0);
        opacity: 1;
    }

    /* 阶段3: 滚动 (15% -> 85%)
主要滚动过程。
*/
    90% {
        transform: translateX(var(--news-move));
        opacity: 1;
    }

    /* 阶段4: 淡出 (90% -> 95%)
滚动到末尾后，平滑地从不透明变为透明。
*/
    95% {
        transform: translateX(var(--news-move));
        opacity: 0;
    }

    /* 阶段5: 隐藏重置 (95% -> 100%)
在用户看不见的状态下，重置位置，准备下一次循环。
这个空白期只有5%，比最初的15%短得多。
*/
    100% {
        transform: translateX(0);
        opacity: 0;
    }
}

@keyframes news-slide {
    0% {
        transform: translateX(0);
    }
    15% {
        transform: translateX(0);
    }
    90% {
        transform: translateX(var(--news-move));
    }
    100% {
        transform: translateX(0);
    }
}

@keyframes news-travel {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(var(--news-move));
    }
}

/* 内容不过长时 → 居中 (无改动) */
.news-row.news-center ul {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-left: 10px;
}



/*轮播*/
.slideshow {
    margin: 0;
    padding: 0;
}

.slideshow li {
    list-style: none;
    width: 630px;
    height: 280px;
    overflow: hidden;
    position: relative;
}

.slideshow li .lb_title {
    position: absolute;
    background: rgba(0, 0, 0, .6);
    top: 0;
    color: #FFFFFF;
    display: block;
    text-align: center;
    left: 50%;
    top: 220px;
    transform: translateX(-50%);
    max-width: 80%;
    min-width: 50%;
    padding: 5px 10px;
    border: rgba(255, 255, 255, .2) solid 1px;
}

.lunbo .slideshow li .lb_title h2 {
    display: block;
    margin: 0px;
    line-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    text-shadow: 1px 1px 1px #000000;
}

.slideshow li .lb_title h2 {
    font-size: 22px;
}

.slideshow li .lb_title h3 {
    font-size: 18px;
}



.container .container:nth-of-type(2) {
    background-color: white;
}

body {
    margin: 0px;
    padding: 0px;
    background: url('../static/skin.png') center top / 100% no-repeat;
}

.pi_cx div img {
    width: 145px;
    height: 200px;
}

.pi_cx {
    display: inline;
    position: relative;
    float: left;
    width: 155px;
    height: 200px;
    overflow: hidden;
    margin-left: 5px;
}

.slideshow {
    clear: both;
}

#szb2 .slidebar {
    width: 250px;
    line-height: 20px;
}

.bi_ws {
    float: left;
    overflow: hidden;
    margin: -10px 0px 30px 0px;
}

.tab-title {
    background: #fff;
}

.frame-tab .tb {
    height: 32px;
    border-bottom: #eee solid 1px;
    padding: 0px 5px;
}

.frame-tab .tb .a {
    color: #444;
    font-weight: normal;
    background: #f6f6f6;
}

.frame-tab .tb .a a {
    font-size: 14px;
    font-weight: normal;
    color: #444;
}

.frame-tab .tb .a a:hover {
    color: #f6f6f6;
}

.frame-tab .tb li {
    width: 110px;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    line-height: 31px;
    border: #eee solid 1px;
    margin-right: 5px;
    background: #f6f6f6;
    height: 31px;
}

#tabA7aNKs_title {
    border-bottom: #eee solid 1px;
    line-height: 31px;
}

#tabA7aNKs_title ul {
    padding-left: 5px;
}

.frame-tab .tb li.a {
    font-style: normal;
    border-bottom: #fff solid 1px;
    border-top: #eee solid 1px;
    border-left: #eee solid 1px;
    border-right: #eee solid 1px;
    color: #444;
    padding: 0px;
    text-align: center;
}

.frame-tab .tb {
    padding: 0px 5px;
}

#szb2 .slidebar {
    width: 330px;
}

#szb2 {
    margin: 20px 0px 0px 0px;
}

#szb2 a {
    margin-left: 10px;
}

.slidebar div {
    line-height: 30px;
    font-size: 14px;
    margin-left: 40px;
    display: inline-block;
}
