* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    border: none;

}

html {
    background-color: #efefef;
    color: #333;
    font-size: 50px;
}

body {
    font-family: "-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,PingFang SC,Hiragino Sans GB,STHeiti,Microsoft YaHei,Microsoft JhengHei,Source Han Sans SC,Noto Sans CJK SC,Source Han Sans CN,Noto Sans SC,Source Han Sans TC,Noto Sans CJK TC,SimSun,sans-serif";
    max-width: 750px;
    margin: 0 auto;
    position: relative;
    font-size: .28rem;
    background-color:#fafafa;
}

img {
    vertical-align: middle;
    width: 100%;
}
a{
    text-decoration:none;
    color:#000;
}
.header {
    position: fixed;
    top: 0;
    width: 7.5rem;
    z-index: 100;
    background: transparent;
    will-change: transform, opacity; /* 提示浏览器优化 */
    overflow: visible;

}
.plus_box {
    position: fixed;
    /* 半透明背景 */
    background: rgba(255, 255, 255, 0.55);
    /* 毛玻璃效果 */
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    /* 高光描边 */
    border: 1px solid rgba(255, 255, 255, 0.6);
    /* 投影让卡片浮起 */
    box-shadow: 0 10px 30px rgba(17, 17, 17, 0.08);
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 101;
    /*  display: none;*/
}

    .plus_box .close-btn {
        position: absolute;
        right: 0.2rem;
        top: 0.4rem;
    }
.close-btn:before {
    display: inline-block;
    content: '\e646';
    font-family: "iconfont" !important;
    font-weight: bold;
    font-size: 0.42rem;
    width: 0.8rem;
    height: 0.8rem;
    text-align: center;
    line-height: 0.8rem;
    background-color: rgba(255,255,255,0.9);
    transform: translateY(-0.05rem); /* -5px */
    box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.4); /* 8px 20px */
    border-radius: 0.4rem;
    font-style: normal;
}
        .plus_box .panel {
            background: none;
            margin-top:1.2rem;
        }
    /* 伪元素作为背景层，独立过渡 opacity（GPU 加速）*/
    .header::before {
        content: "";
        position: absolute;
        inset: 0; /* top:0; right:0; bottom:0; left:0; */
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        opacity: 0;
        transition: opacity 0.9s cubic-bezier(.2,.8,.2,1); /* 慢而顺的曲线 */
        pointer-events: none;
        z-index: 0;
    }

/* 保证内容在伪元素之上 */
.header-inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    padding: 0 0.2rem;
}

/* 滚动后让背景层淡入 + 可选阴影/模糊 */
.header.scrolled::before {
    opacity: 1;
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}
    .header a {
        color: #fff;
        font-size: 0.32rem;
    }

.header-logo img {
    height: 0.8rem;
    width: 2.133rem;
}

.header-nav {
    flex: 1;
    text-align: right;
}

.header-menu {
    width: 0.5rem;
    height: 0.5rem;
    margin-left: 0.2rem;
}

    .header-menu img {
        width: 100%;
        height: 100%;
    }

.header-banner {
    position: relative;
    /*    background: -webkit-gradient(linear, 78% 100%, 68% 0%, from(#645af9), to(#708aff));*/
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    width: 100%;
    overflow: hidden;
    padding-top: 1.2rem;
    padding-bottom: 0.8rem;
}
.cells{

}
  
    .cell {
        display: flex;
        margin: 0 0.2rem;
        padding:0.2rem 0;
        border-bottom: 1px solid #efefef;
       
    }
.cells .cell:first-child {
    padding-top: 0;
}
.cell-ft .time{
    color:#999;
    font-size:0.24rem;
}
.cell-hd {
    width: 2.2rem;
}
.cell-hd img{
    width:100%;
    border-radius:0.1rem;
}
    .cell-hd+.cell-bd{
        margin-left:0.2rem;
    }
    .cell-bd {
        flex: 1;
        position:relative;
    }
        .cell-bd .cell-bd_tit {
            color: #333;
            display: block;
            font-size:0.3rem;
            font-weight:bold;
        }
.cell-bd_time{
    color:#999;
    position:absolute;
    font-size:0.24rem;
    bottom:0;
    left:0;
}


h4{
    font-size:0.28rem;
}
.flex {
    display: flex;
}
.flex-item{
    flex:1;
}
.flex-center {
    display: flex;
    align-items:center;
}


.flex-wrap {
    display: flex;
    flex-wrap: wrap;
}
.text-align-center {
    text-align: center;
}
.text-align-right {
    text-align:right;
}
.font12 {
    font-size: 0.24rem;
}

.mt-01 {
    margin-top: 0.1rem;
}
.mt-02 {
    margin-top: 0.2rem;
}
.mt-03 {
    margin-top: 0.3rem;
}
.ml-01 {
    margin-left: 0.1rem;
}

.ml-02 {
    margin-left: 0.2rem;
}

.ml-03 {
    margin-left: 0.3rem;
}
.mr-01 {
    margin-right: 0.1rem;
}

.mr-02 {
    margin-right: 0.2rem;
}

.mr-03 {
    margin-right: 0.3rem;
}

.pt-01 {
    padding-top: 0.1rem;
}

.pt-02 {
    padding-top: 0.2rem;
}

.pt-03 {
    padding-top: 0.3rem;
}

.pl-01 {
    padding-left: 0.1rem;
}

.pl-02 {
    padding-left: 0.2rem;
}

.pl-03 {
    padding-left: 0.3rem;
}

.pr-01 {
    padding-right: 0.1rem;
}

.pr-02 {
    padding-right: 0.2rem;
}

.pr-03 {
    padding-right: 0.3rem;
}
.border-right{
    border-right:1px solid #efefef;
}
.bold {
    font-weight: bold;
}
.badge {
    font-size: 0.20rem;
    background-color: rgba(102, 126, 234, 0.8);
    color: #fff;
    border-radius: 0.16rem;
    display: inline-block;
    height: 0.36rem;
    line-height: 0.36rem;
    padding:0 0.1rem;
}
.header-banner .cnt {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 0.2rem;
}

/*      .header-banner .stars-box {
            font-size: .32rem;
        }*/
.stars {
    width: 2rem;
    display: inline-block;
    height: 0.4rem;
    background: url(/content/images/25/icon_star.png) repeat 0 0;
    background-size: .4rem auto;
    vertical-align: bottom;
    font-size: 0;
}

    .stars .star {
        background: url(/content/images/25/icon_star.png) repeat 0 0;
        margin: 0;
        background-position: 0 0.4rem;
        background-size: 0.4rem auto;
        display: inline-block;
        width: 0.4rem;
        height: 0.4rem;
    }

.nowaday {
    display: flex;
    color: #fff;
    padding: 0 0.2rem;
}

    .nowaday .imgbox {
        width: 2rem;
        text-align: center;
        margin-right: 0.2rem;
        position: relative;
    }

    .nowaday .image {
        width: 1.6rem;
    }

    .nowaday .imgbox:before {
        content: '';
        position: absolute;
        width: 1.2rem;
        height: .2rem;
        background: rgba(0, 0, 0, .2);
        border-radius: 50%;
        bottom: 0.9rem;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 0;
    }

    .nowaday .name {
        margin-top: 0.1rem;
    }

    .nowaday .daterange {
        margin-top: 0.1rem;
        font-size: 0.24rem;
    }

    .nowaday .ysbox {
        flex: 1;
    }

        .nowaday .ysbox .gd, .nowaday .ysbox .zq {
            flex: 1;
            text-align: center;
            padding: 0.1rem 0;
            margin-top: 0.2rem;
            background-color: rgba(255, 255, 255, 0.1);
            border-radius: 0.1rem;
            color:#fff;
        }

        .nowaday .ysbox .gd {
            margin-right: 0.1rem;
        }

        .nowaday .ysbox .zq {
            margin-left: 0.1rem;
        }

.btns {
    display: flex;
    flex-wrap: wrap;
}
    ul.btns{
        list-style-type:none;
    }
    .btns li {
        display: contents;
    }
    .btns.btns-5 a {
        width: 1.26rem;
        margin-left: 0.2rem;
        margin-bottom: 0.2rem;
    }
/* .btns.btns-5 a:nth-last-child(-n+5) {
            margin-bottom: 0rem;
        }*/
.btns-2 a {
    width: 3.45rem;
    margin-left: 0.2rem;
    margin-bottom: 0.2rem;
}

.btn {
    text-align: center;
    color: #000;
    background-color: #ffffff;
    border-radius: 0.1rem;
    height:0.68rem;
    line-height:0.68rem;
    box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1);
    overflow: hidden;
    padding:0 0.2rem;
}

.btn-primary {
    background-color: #764ba2;
    color: #fff;
}
.btns.btns-4 .btn {
    width: 1.625rem;
    text-align: center;
    margin-left: 0.2rem;
    margin-bottom:0.2rem;
}
.btns.btns-4 .btn.btn-sm {
    font-size: 0.24rem;
 /*   padding: 0.05rem 0;*/
    background-color: rgba(255, 255, 255, 0.1);
    display: inline-block;
    color: #fff;
    height:0.5rem;
    line-height:0.5rem;
}

        .btns.btns-4 .btn.btn-sm.btn-active {
            background-color: #667eea;
        }
.btn {
    position: relative;
}

.btn-access:after {
    content: '\e6a3';
    font-family: "iconfont" !important;
}

.btn-primary.btn-link {
    color: rgba(102, 126, 234, 1);
    padding: 0;
    background: none;
    box-shadow: none;
}
.header-banner .detail {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 0.1rem;
    padding: 0.2rem;
    position: relative;
    margin: 0rem 0.2rem 0 0.2rem;
}
    .header-banner .detail p:first-of-type{
        margin-bottom:0.2rem;
        text-align:center;
    }

    .header-banner .detail p {
        margin-top: 0.1rem;
    }

    .header-banner  .ysld {
        width: 3rem;
        height: 3rem;
    }

.header-banner .xz-12 {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0.3rem;
}

    .header-banner .xz-12 a {
        width: 1.0166rem;
        display: inline-block;
        margin: 0 0 0.2rem 0.2rem;
        text-align: center;
    }

        .header-banner .xz-12 a .img-bg {
            background-color: rgba(255,255,255,0.2);
            padding: 0.1rem;
            border-radius: 0.508rem;
        }

.header-banner .xz-12-item .img-bg img {
    width: 100%;
}

.header-banner .xz-12 a .name {
    margin-top: 0.1rem;
    color: #fff;
}

.header-banner .detail table {
    border-collapse: collapse;
    position: relative;
    flex: 1;
    font-size: 0.24rem;
    margin-right: 0.1rem;
}

    .header-banner .detail table td {
        border: 1px solid rgba(255,255,255,0.1);
        padding: 0.1rem;
    }

   /*     .header-banner .detail table td:first-of-type {
            font-weight: bold;
        }*/
.header-banner .cloud {
    position: absolute;
    width: 7.5rem;
    height: 0.8rem;
    left: 0;
    bottom: 0;
    background: url(/Content/Images/25/cloud1.png) no-repeat;
    background-size: 100%;
}

.gj-10 {
    display: flex;
    flex-wrap: wrap;
}

    .gj-10 a {
        width: 1.14rem;
        margin: 0 0 0.2rem 0.3rem;
        display: inline-block;
        font-weight: bold;
        text-align: center;
        color: #333;
    }

    .gj-10 img {
        width: 100%;
        transform: scale(0.8);
        border-radius: 50%;
    }

.section-hd {
    font-size: 0.36rem;
    text-align: center;
    font-weight: bold;
    color: #333;
    position: relative;
    border-radius: 10px;
    height:1.2rem;
    line-height:1.2rem;
}


.footer {
    border-top: 1px solid #efefef;
    font-size: 0.24rem;
    text-align: center;
    color: #999;
    padding: 0.2rem;
}

    .footer a {
        color: #333;
    }

.bread-wrap {
    padding: 0 0.2rem;
    height: 0.5rem;
    line-height: 0.5rem;
    font-size:0.26rem;
    color:#999;
    background-color:#fafafa;
}
    .bread-wrap a {
        color: #999;
    }
    /*panel*/
    .panel{
        background-color:#fff;
    }
.panel +.panel{
    margin-top:0.2rem;
}
    .panel-hd {
        display: flex;
        align-items: center;
        padding: 0 0.2rem;
    }
.panel-des {
    margin: 0 0.2rem 0.2rem 0.2rem;
    margin-bottom: 0.2rem;
    color: #999;
    border-bottom: 1px solid #efefef;
    padding-bottom: 0.2rem;
    line-height: 1.8;
}
.panel-hd_tit {
    flex: 1;
    font-weight: bold;
    color: #333;
    font-size: 0.32rem;
    height: 0.6rem;
    line-height: 0.6rem;
}

.panel-hd_ft {
}

    .panel-hd_ft a {
        font-size: 0.24rem;
        position: relative;
        color: #999;
    }

    .panel-hd_ft.access a {
        /*padding-right: 0.2rem;*/
    }

        .panel-hd_ft.access a:after {
          
            content: '\e6a3';
            font-family: "iconfont" !important;
        }
.panel-hd {
    display: flex;
    height: 1.2rem;
    line-height: 1.2rem;
}
    .panel-hd h3, .panel-hd h2, .panel-hd_tit_c {
        text-align: center;
        font-size: 0.36rem;
        flex: 1;
        font-weight:bold;
    }

.panel-hd + .panel-bd .panel-bd-box {
    padding-top: 0;
}
.panel-bd_cnt {
    padding: 0 0.2rem 0.2rem 0.2rem;
}
    .panel-bd_cnt img {
        width: 3.5rem;
        margin-left: 0.3rem;
        float: right;
        border-radius: 0.1rem;
    }
    .panel-bd_cnt h3 {
        font-weight: bold;
        position: relative;
        font-size:0.32rem;
        margin-bottom:0.1rem;
    }
    .panel-bd_cnt p {
        line-height: 1.8;
        margin-bottom: 0.1rem;
    }
/*card*/
.panel-bd-box {
    padding: 0.2rem;
}

.cards {
    display: flex;
}

.cards-3 .card {
    margin-left: 0.2rem;
    width: 2.233rem;
}

.cards-4 .card {
    margin-left: 0.2rem;
    width: 1.625rem;
}

.cards-2 .card {
    width: 3.45rem;
    margin-left: 0.2rem;
}

.cards + .cards {
    margin-top: 0.2rem;
}

.card-link {
    color: #fff;
    background: linear-gradient(135deg, #a5b4fc, #c4b5fd);
    height: 0.8rem;
    line-height: 0.8rem;
    text-align: center;
    font-size: 0.26rem;
    font-weight: bold;
}

.card-link-pink {
    background: linear-gradient(135deg, #f8a5c2, #e295b8);
}

.card-link-yellow {
    background: linear-gradient(135deg, #fcd34d, #fbbf24);
}

.card {
    background-color: #ffffff;
    border-radius: 0.12rem; /* 12px */
    /*box-shadow: 0 0.04rem 0.12rem rgba(0, 0, 0, 0.1);*/ /* 4px 12px */
    /*transition: transform 0.2s, box-shadow 0.2s;*/
    transform: translateY(-0.05rem); /* -5px */
    box-shadow: 0 0.08rem 0.2rem rgba(0, 0, 0, 0.15); /* 8px 20px */
}

.card-hd {
    display: flex;
    align-items: center;
    padding: 0.2rem 0.2rem 0 0.2rem;
}

.card-hd_tit {
    flex: 1;
}

    .card-hd_tit .stars {
        vertical-align: sub;
    }

.card-hd_ft {
    text-align: right;
    color: #999;
}

.card-bd {
    display:block;
    padding: 0.2rem; /* 20px */
    color: #333;
    line-height: 1.8;
}

.card-bd_tit {
    text-align: center;
    color: #666;
    height: 0.8rem;
    line-height: 0.8rem;
}

.card-ft {
}

    .card-ft a {
        color: #fff;
        background-color: rgba(102, 126, 234, 0.8);
        display: block;
        text-align: center;
        border-bottom-left-radius: 0.1rem;
        border-bottom-right-radius: 0.1rem;
        height: 0.6rem;
        line-height: 0.6rem;
    }

.line-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.line-ellipsis-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.line-ellipsis-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

/*xingzuo/index*/

.xzimgbox {
    padding: 0.2rem;
    overflow: hidden;
    position: relative;
    width: 2rem;
    margin: 0 auto;
    background-color: rgba(255,255,255,0.2);
    border-radius: 50%;
    flex: 1;
}

    .xzimgbox img {
        display: block;
        max-width: 100%;
        transform: rotateY(0deg) translateZ(0px);
        animation: float 3s ease-in-out infinite;
    }

@keyframes float {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-3px);
    }
    /* 上浮 10px */
    100% {
        transform: translateY(0);
    }
    /* 回到原位 */
}

.ring a {
    position: absolute;
}

    /* 图片样式 */
    .ring a img {
        width: 0.8rem;
        height: 0.8rem;
        animation: float 3s ease-in-out infinite;
    }
    /* 手动指定每个 item 位置，避开中间 2rem 宽度区域 */

    .ring a:nth-child(1) {
        top: 0.2rem;
        left: 0.2rem;
    }

    .ring a:nth-child(2) {
        top: 0.2rem;
        left: 2.0rem;
    }

    .ring a:nth-child(3) {
        top: 0.2rem;
        left: 5rem;
    }

    .ring a:nth-child(4) {
        top: 0.3rem;
        left: 6.5rem;
    }

    .ring a:nth-child(5) {
        top: 1rem;
        left: 1.0rem;
    }

    .ring a:nth-child(6) {
        top: 1.2rem;
        left: 4.8rem;
    }

    .ring a:nth-child(7) {
        top: 1rem;
        left: 5.8rem;
    }

    .ring a:nth-child(8) {
        top: 2.2rem;
        left: 0.4rem;
    }

    .ring a:nth-child(9) {
        top: 2rem;
        left: 1.8rem;
    }

    .ring a:nth-child(10) {
        top: 2.3rem;
        left: 5.3rem;
    }

    .ring a:nth-child(11) {
        top: 2.1rem;
        left: 6.4rem;
    }

    .ring a:nth-child(12) {
        top: 2.6rem;
        left: 1.2rem;
    }

.xingzuo-grid {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 0.1rem;
    margin: 0.3rem 0.2rem 0 0.2rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 三列 */
    text-align: center;
    border-collapse: collapse;
}

    .xingzuo-grid > div {
        padding: 0.2rem 0.1rem;
        border-left: 1px solid rgba(255,255,255,0.1);
        border-top: 1px solid rgba(255,255,255,0.1);
        font-size: 0.24rem;
    }

        .xingzuo-grid > div span {
            font-size: 0.3rem;
            font-weight: bold;
            margin-top: 0.1rem;
            display: block;
        }
        /* 去掉外框，只保留内部线 */
        .xingzuo-grid > div:nth-child(-n+3) {
            border-top: none; /* 第一行去掉上边框 */
        }

        .xingzuo-grid > div:nth-child(3n+1) {
            border-left: none; /* 第一列去掉左边框 */
        }
/* 两列 */
.xingzuo-grid-2 {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 0.1rem;
    margin: 0.3rem 0.2rem 0 0.2rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    text-align: center;
    border-collapse: collapse;
}

    .xingzuo-grid-2 > div {
        padding: 0.2rem 0.1rem;
        border-left: 1px solid rgba(255,255,255,0.1);
        border-top: 1px solid rgba(255,255,255,0.1);
        font-size: 0.24rem;
    }

        .xingzuo-grid-2 > div span {
            font-size: 0.3rem;
            font-weight: bold;
            margin-top: 0.1rem;
            display: block;
        }

        /* 去掉外框，只保留内部线 */
        .xingzuo-grid-2 > div:nth-child(-n+2) {
            border-top: none; /* 第一行去掉上边框 */
        }

        .xingzuo-grid-2 > div:nth-child(2n+1) {
            border-left: none; /* 第一列去掉左边框 */
        }
.header-banner .ring {
    position: absolute;
    top: 0.9rem;
    left: 0;
    width: 7.5rem;
    height: 7.5rem;
    opacity: 0.2;
}


.xzname {
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: 0.32rem;
    margin-top: 0.1rem;
}
  .xzname i{
            margin-right:0.1rem;
        }
.xzdate {
    color: #fff;
    font-weight: bold;
    text-align: center;
    margin-top: 0.1rem;
}

/*今日运势*/
.tabs-ys {
    position: absolute;
    bottom: 0;
    width: 100%;
    display: flex;
    color: #fff;
    background-color: rgba(255,255,255,0.1);
    height: 0.6rem;
    line-height: 0.6rem;
}

    .tabs-ys a {
        flex: 1;
        padding: 0 0.2rem;
        text-align: center;
        position: relative;
        color: #fff;
    }

        .tabs-ys a.active {
            background-color: #667eea;
        }

.yszsbox {
    display: flex;
    align-items: flex-end;
}

.yszs {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.yszs-name {
    font-size: 0.24rem;
    color: #999;
    margin-top: 0.1rem;
}

.yszs-num {
    font-size: 0.24rem;
    color: #999;
}

.yszs-bg {
    position: relative;
    height: 1.6rem;
    width: 0.3rem;
    background-color: #efefef;
    border-radius: 0.15rem;
}

.yszs-zs {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-radius: 0.15rem;
}

.yszs.zh .yszs-bg {
    height: 2rem;
}

.yszs.zh .yszs-name {
    font-weight: bold;
    color: #333;
    font-size: 0.28rem;
}

.yszs.zh .yszs-num {
    font-size: 0.28rem;
    font-weight: bold;
}
/* 综合指数 */
.yszs.zh .yszs-zs {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

/* 爱情指数 */
.yszs.aq .yszs-zs {
    background: linear-gradient(135deg, #ff758c 0%, #ff7eb3 100%);
}

/* 事业指数 */
.yszs.sy .yszs-zs {
    background: linear-gradient(135deg, #43cea2 0%, #185a9d 100%);
}

/* 财富指数 */
.yszs.cf .yszs-zs {
    background: linear-gradient(135deg, #f6d365 0%, #fda085 100%);
}

/* 健康指数 */
.yszs.jk .yszs-zs {
    background: linear-gradient(135deg, #96e6a1 0%, #d4fc79 100%);
}

/*pagination*/
.pagination{
    list-style-type:none;
    margin:0.2rem;
    display:flex;
    justify-content:space-between;
}
    .pagination li {
        display: contents;
    }
        .pagination li.disabled {
            text-align: center;
            color: #000;
            background-color: #efefef;
            border-radius: 0.1rem;
            padding: 0.15rem;
            box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1);
            overflow: hidden;
            display: block;
            font-size: 0.24rem;
        }
        .pagination li a {
            text-align: center;
            color: #000;
            background-color: #ffffff;
            border-radius: 0.1rem;
            padding: 0.15rem;
            box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1);
            overflow: hidden;
            display: block;
            font-size: 0.24rem;
        }
        .pagination li.active {
            text-align: center;
            color: #fff;
            background-color: #667eea;
            border-radius: 0.1rem;
            padding: 0.15rem;
            box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1);
            overflow: hidden;
            display: block;
            font-size: 0.24rem;
        }

/*article*/
.article-detail {
    overflow: hidden;
    background-color: #fff;
    margin: 0 0.2rem;
    padding-top:0.2rem;
}

    .article-detail a {
        color: #667eea;
    }

.article-detail-title {
    font-size: 0.36rem;
    font-weight: 700;
    text-align: center;
}

.article-detail-source {
    color: #999;
    font-size: 0.24rem;
    margin: 0.2rem 0;
    text-align: center;
}

.article-detail-content {
    border-top: 1px solid #f1f1f1;
    padding-top: 0.2rem;
    overflow: hidden;
    position: relative;
}

    .article-detail-content p {
        line-height: 1.8;
        margin-bottom: 0.1rem;
    }
.fold-footer {
    position: absolute;
    left: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(239, 239, 239, 1));
    height: 60%;
    width: 100%;
    bottom: 0;
    display: flex;
    align-items: end;
    padding-bottom: 0.3rem;
    justify-content: center;
}

    .fold-footer a {
        text-decoration: underline;
        display: block;
        text-align: center;
        flex: 1;
        font-weight: bold;
    }

        .fold-footer a span {
            font-size: 0.24rem;
        }

.content-fold {
    max-height: 100vh;
    overflow: hidden;
    transition: max-height 0.3s ease;
    position: relative;
}

    .content-fold.expanded {
        max-height: none;
        padding-bottom: 1rem;
    }

.fold-footer button {
    padding: 0.2rem 0.4rem;
    cursor: pointer;
    background: none;
    color: #667eea;
    font-size: 0.32rem;
    font-weight: bold;
}

.content-fold.expanded .fold-footer {
    background: none;
    height: initial;
}

.article-detail h4 {
    position: relative;
    font-weight: bold;
    font-size: 0.32rem;
    color: #333;
    margin: 0.1rem 0;
}


.article-pre-next {
    border-bottom: 1px solid #efefef;
    padding-bottom: 0.2rem;
}

    .article-pre-next ul {
        list-style: none;
    }

        .article-pre-next ul li {
            color: #666;
            display: block;
            display: -webkit-box;
            margin-top: 0.2rem;
        }

            .article-pre-next ul li a {
                color: #666;
            }

.article-pro-wrap {
    background-color: #f3f3f3;
    padding: 0.2rem;
    border-radius: 0.1rem;
    margin-top: 0.2rem;
}

.article-12sx {
    display: flex;
    flex-wrap: wrap;
}

    .article-12sx a {
        width: 1.01rem;
        margin-left: 0.2rem;
        margin-bottom: 0.2rem;
        color: #333;
    }

        .article-12sx a img {
            width: 100%;
            margin-bottom: 0.1rem;
        }