@charset "utf-8";



html {
    scrollbar-width: thin;
    scrollbar-color: #c6d6e4 #eaf3fa;
}

html::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

html::-webkit-scrollbar-track {
    background: #eaf3fa;
}

html::-webkit-scrollbar-thumb {
    background: #c6d6e4;
    border-radius: 4px;
}

html::-webkit-scrollbar-thumb:hover {
    background: #a9bfd2;
}


/* ============================================================
 * Banner 大图轮播
 * ============================================================ */
.banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #dcebf7;
}

.banner .swiper-wrapper {
    height: 100%;
}

.banner .swiper-slide {
    overflow: hidden;
}

.banner .pic {
    display: block;
    width: 100%;
    padding-top: 50%;
    overflow: hidden;
    position: relative;
}

.banner .pic::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 2.13rem;
    opacity: 0.5;
    background: linear-gradient(0deg, #000000e6 -11%, #00000000 96%);
    left: 0;
    bottom: 0;
}

.banner .pic img, .banner .pic video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    -webkit-transform: scale(1);
    transform: scale(1);
    will-change: transform;
    position: absolute;
    top: 0;
    left: 0;
}

/* Ken Burns 由远到近 / 由近到远，仅当前 slide 播放 */
@-webkit-keyframes kbIn {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    to {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
}

@keyframes kbIn {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    to {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
}

@-webkit-keyframes kbOut {
    from {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes kbOut {
    from {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

/* Ken Burns：当前 slide 自动播放，奇数张由远到近、偶数张由近到远，无需额外类名 */
.banner .swiper-slide-active:nth-child(odd) .pic img {
    -webkit-animation: kbIn 5s ease-out both;
    animation: kbIn 5s ease-out both;
}

.banner .swiper-slide-active:nth-child(even) .pic img {
    -webkit-animation: kbOut 5s ease-out both;
    animation: kbOut 5s ease-out both;
}

/* 分页器（Swiper 标准分页，白色小盾牌） */
.banner .swiPagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: .38rem;
    z-index: 5;
    text-align: center;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner .swiPagination .swiper-pagination-bullet {
    width: .15rem;
    height: .17rem;
    margin: 0 .17rem;
    background: url(../images/dot.png) no-repeat;
    opacity: 1;
    border-radius: 0;
    background-size: 0.15rem;
}

.banner .swiPagination .swiper-pagination-bullet-active {
    background: url(../images/dot_on.png) no-repeat;
    width: 0.31rem;
    height: 0.38rem;
    background-size: 0.31rem;
}

@media (min-width: 1025px) {
    .banner .swiPagination .swiper-pagination-bullet:hover {
        opacity: 1;
    }
}

@media (max-width: 1025px) {
    .banner {}

    .banner .swiPagination {
        bottom: 0.2rem;
    }
}

/* 尊重减弱动效偏好设置 */
@media (prefers-reduced-motion: reduce) {

    .swiper-slide-active .kb-in img,
    .swiper-slide-active .kb-out img {
        -webkit-animation: none;
        animation: none;
        -webkit-transform: scale(1.08);
        transform: scale(1.08);
    }
}



.home1 {
    width: 100%;
    padding: 0.9rem 0 0.72rem;
    background: url(../images/bg1.png) no-repeat right 0.6rem top;
    /* background-size:auto 100%; */
}



.title {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}


.title h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.4rem;
    font-family: 'SourceHanSerifCNbold';
    color: #333333
}

.title h2 span {
    font-family: yuweij;
    font-size: 0.64rem;
    color: #007CC3;
}

.title .more {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.18rem;
    font-family: 'PingFang SC', 'SourceHanSansCN', sans-serif;
    color: #333333;
    border-radius: 1rem;
    border: 0.01rem solid #007CC3;
    padding: 0.1rem 0.63rem 0.09rem 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url(../images/more.png) no-repeat right 0.21rem center;
    transition: all 0.5s;
    background-size: 0.15rem;
}

.title .more::after {
    content: "";
    position: absolute;
    right: 0.48rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0.01rem;
    height: 0.17rem;
    background: #007CC3;
}

.title .more:hover {
    color: #007CC3;
    margin-right: 0.05rem;
}


@media (max-width: 1024px) {
    .title h2 {
        font-size: 0.3rem;
    }

    .title h2 span {
        font-size: 0.5rem;
    }
}

@media (max-width: 520px) {
    .title h2 {
        font-size: 0.2rem;
    }

    .title h2 span {
        font-size: 0.4rem;
    }
}


.serve {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: .5rem;
    position: relative;
}

/* 左侧大图卡 */
.serve-photo {
    position: relative;
    display: block;
    width: 66.9%;
    overflow: hidden;
    border-radius: 0 .5rem 0 0;
}

.serve-photo>img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 1s;
    transition: all 1s;
}

/* 图片悬停放大 */
.serve-photo:hover>img,
.serve-photo>img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

.serve-photo::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    pointer-events: none;
    background: rgba(0, 0, 0, 0.2);
}

.serve-photo__txt {
    position: absolute;
    left: 1.69rem;
    bottom: .72rem;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
}

.serve-photo__txt img {
    width: 1.06rem;
    height: 1.06rem;
    -o-object-fit: contain;
    object-fit: contain;
    padding: 0.23rem;
    margin-right: .16rem;
    border: 1px dashed rgba(255, 255, 255, 0.8);
    border-radius: 50%;
}

.serve-photo__txt b {
    display: block;
    font-size: .3rem;
    font-weight: 700;
    line-height: 0.36rem;
}

.serve-photo__txt span {
    display: block;
    margin-top: .04rem;
    font-size: .18rem;
    line-height: 0.3rem;
}

/* 右侧磁贴 */
.serve-right {
    width: 10rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    right: 0;
    bottom: 0;
}

.serve-row {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/* 第一行：整体右对齐，左侧空出一个卡片宽；专家介绍占 2 卡、门诊安排占 1 卡 */
.serve-row:first-child {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.serve-row:first-child .serve-card:first-child {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
}

.serve-row:first-child .serve-card:last-child {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
}

.serve-row .serve-card {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 2.5rem;
}

.serve-card {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    -webkit-transition: -webkit-filter .3s;
    transition: filter .3s;
}

.serve-card:hover {
    -webkit-filter: brightness(1.08);
    filter: brightness(1.08);
}

/* 磁贴配色 */
.serve-card.is-dark {
    background: #176fb4 url(../images/hzbg1.png) no-repeat;
}

.serve-card.is-teal {
    background: #00B8C8 url(../images/hz_bg2.png) no-repeat;
}

.serve-card.is-blue {
    background: #518CD6;
}

.serve-card.is-cyan {
    background: #008DC4;
}

.serve-card.is-light {
    background: #CEEBFA;
    color: #333333;
}

.serve-card.is-pale {
    background: #D4E5FF url(../images/hzbg3.png) no-repeat;
    color: #333333;
}


.serve-card.is-light::before,
.serve-card.is-pale::before {
    background-image:
        radial-gradient(circle at 50% 100%, transparent .15rem, rgba(0, 124, 195, .10) .155rem, transparent .175rem),
        radial-gradient(circle at 50% 0, transparent .15rem, rgba(0, 124, 195, .06) .155rem, transparent .175rem);
}

/* 虚线圆图标 + 悬停翻转 */
.serve-ic {
    position: relative;
    z-index: 1;
    width: 1.12rem;
    height: 1.12rem;
    border: 1px dashed rgba(255, 255, 255, .6);
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-perspective: 1rem;
    perspective: 1rem;
}

.serve-ic img {
    display: block;
    -o-object-fit: contain;
    object-fit: contain;
    -webkit-transition: -webkit-transform .6s ease;
    transition: transform .6s ease;
}

/* 悬停按钮：图片 Y 轴翻转动效 */
.serve-card:hover .serve-ic img,
.serve-card .serve-ic:hover img,
.serve-card .serve-ic img:hover {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
}

.serve-card.is-light .serve-ic,
.serve-card.is-pale .serve-ic {
    border-color: rgba(0, 103, 172, 0.6);
}

/* 圆外两个点缀小点 */
.serve-ic::before,
.serve-ic::after {
    content: "";
    position: absolute;
    width: 0.05rem;
    height: 0.05rem;
    border-radius: 50%;
    border: 0.01rem solid #fff;
}

.serve-ic::before {
    left: -.04rem;
    top: .14rem;
}

.serve-ic::after {
    content: "+";
    right: .06rem;
    bottom: 0.2rem;
    border: none;
}

.serve-card.is-light .serve-ic::before,
.serve-card.is-pale .serve-ic::before {
    border-color: rgba(0, 103, 172, 0.6);
}

.serve-card.is-light .serve-ic::after,
.serve-card.is-pale .serve-ic::after {
    color: #0067AC;
}

.serve-txt {
    position: relative;
    z-index: 1;
    margin-top: .14rem;
    text-align: center;
}

.serve-txt b {
    display: block;
    font-size: 0.2rem;
    line-height: 0.3rem;
    font-weight: normal;
    font-family: 'SourceHanSansCN';
}

.serve-txt span {
    display: block;
    margin-top: .09rem;
    font-size: .16rem;
    font-weight: 400;
    line-height: 0.3rem;
}

.serve-card:hover .serve-txt b {
    font-weight: 700;
}

/* 专家介绍：图标与文字横向排列 */
.serve-card--lg {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.serve-card--lg .serve-ic {
    width: 1.12rem;
    height: 1.12rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.serve-card--lg .serve-ic img {
    width: .5rem;
    height: .5rem;
}

.serve-card--lg .serve-txt {
    margin: 0 0 0 .69rem;
    text-align: left;
}

.serve-card--lg .serve-txt b {
    font-size: .26rem;
}

/* 移动端：上图下磁贴 */
@media (max-width: 1024px) {
    .title {
        justify-content: start !important;
    }

    .serve {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto;
        margin-top: .3rem;
    }

    .serve-photo__txt {
        left: 0.5rem;
        bottom: 0.6rem;
    }

    .serve-photo {
        width: 100%;
        aspect-ratio: 16 / 9.5;
        border-radius: .16rem .16rem 0 0;
    }

    .serve-right {
        width: 100%;
        position: relative;
        right: auto;
        bottom: auto;
        margin-top: 0.2rem;
    }

    /* 平板：第一行两卡均分、顶格排列，不再右对齐留空 */
    .serve-row:first-child {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .serve-row:first-child .serve-card:first-child,
    .serve-row:first-child .serve-card:last-child {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }
}

/* 手机：磁贴改为两列均分网格，图标文字整体收小 */
@media (max-width: 768px) {
    .serve-photo {
        aspect-ratio: 16 / 10;
        border-radius: .12rem .12rem 0 0;
    }

    .serve-photo__txt {
        left: .3rem;
        bottom: .3rem;
    }

    .serve-photo__txt img {
        width: .62rem;
        height: .62rem;
        padding: .13rem;
        margin-right: .12rem;
    }

    .serve-photo__txt b {
        font-size: .26rem;
        line-height: .32rem;
    }

    .serve-photo__txt span {
        font-size: .14rem;
        line-height: .22rem;
    }

    .serve-right {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    /* 两行容器穿透为网格项，6 卡按两列依次排列 */
    .serve-row {
        display: contents;
    }

    .serve-row .serve-card {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        height: auto;
        padding: 17.96% 0;
    }




    .serve-txt b {
        font-size: .2rem;
        line-height: .28rem;
    }

    .serve-txt span {
        margin-top: .02rem;
        font-size: .12rem;
        line-height: .2rem;
    }



    .serve-card--lg .serve-txt {
        margin: 0.14rem 0 0 0;
    }

    .serve-card--lg .serve-txt b {
        font-size: .22rem;
    }
}


@media (max-width: 520px) {
    .serve-right {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 360px) {
    .serve-right {
        display: grid;
        grid-template-columns: 1fr;
    }
}

.home2 {
    width: 100%;
    padding: 0.6rem 0 1.1rem;
    background: linear-gradient(180deg, #ebf5fa 0%, #ffffff 100%);
    position: relative;
}

.home2 .g-container:first-child {
    position: relative;
}

.home2 .g-container:first-child::after {
    width: 100vw;
    position: absolute;
    content: "";
    background: url(../images/bg2.png) no-repeat bottom;
    left: 50%;
    min-height: 5.79rem;
    top: 29%;
    background-size: 100% 100%;
    z-index: -1;
    transform: translateX(-50%);
}

.ksfc {
    width: 100%;
    margin: 0.72rem 0 1.1rem;
    /* 不再用 min-height 锁高：整块高度改由「图片固定宽 × 固定比例」自己撑出来。
     * 图片宽度不参与展开/收起的动画，高度自始至终是同一个值，所以不会抖动 */
}

.ksfc .ksfc-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    /* 作为 cqw 的参照容器：下面图片用 60cqw 取「整行宽度」，
     * 跟设计稿里 9.6rem 的展开宽度等价，但能跟着任意屏宽等比缩放 */
    container-type: inline-size;
    gap: 2.5%;
    width: 100%;
}

.ksfc-item {
    position: relative;
    /* 用 flex 让超宽的图片在卡片里居中露出：
     * 收起时看到的是图片中间部分，而不是被裁掉一侧 */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex: 0 0 2.8rem;
    flex: 0 0 17.5%;
    width: 17.5%;
    overflow: hidden;
    -webkit-transition: flex-basis .5s ease, width .5s ease;
    transition: flex-basis .5s ease, width .5s ease;
}
.ksfc-item::before{
    width:100%;
    position:absolute;
    content:"";
    height:100%;
    background: rgba(0, 0, 0, 0.3);    
}
.ksfc-item.is-active::before{
    opacity:0;
}
.ksfc-item img {
    display: block;
    width: 9.6rem;
    width: 60cqw;
    max-width: none;
    aspect-ratio: 9.6 / 6;
    height: auto;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    -o-object-fit: cover;
    object-fit: cover;
    transition: all 0.5s;
}

.ksfc-item:hover img {
    transform: scale(1.05);
}

/* 默认展开项 */
.ksfc-item.is-active {
    -ms-flex: 0 0 9.6rem;
    flex: 0 0 60%;
    width: 60%;
}

/* 展开由 JS 锁定 .is-active 驱动（不用纯 CSS :hover——
 * 布局变化会让光标下的元素改变，形成展开<->收起的反馈环导致狂闪） */

.home3 {
    width: 100%;
    padding: 0.9rem 0 1.47rem;
    background: url(../images/bg3.png) no-repeat bottom center;
    background-size: 100%;
    position: relative;
    z-index: 1;
}



.home4 {
    width: 100%;
    padding: 0.9rem 0;
    background: url(../images/bg4.png) no-repeat top center;
    background-size: 100% 100%;
    margin-top: -0.8rem;
    position: relative;
    z-index: 0;
}

.home4 .title {
    margin-bottom: 0.9rem;

}

.home4 .title .more{
    
background: url(../images/bfjs_btn.png) no-repeat right 0.21rem center;
    
background-size: 0.2rem;
}

/* ============================================================
 * 科室·介绍
 * ============================================================ */
.ks {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: .33rem;
}

/* 左侧重点专科入口 */
.ks-side {
    width: 1.34rem;
    margin-left: .5rem;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: linear-gradient(180deg, rgb(152 201 230 / 20%) 0%, rgb(255 255 255 / 20%) 100%);
    padding: 0 0.23rem;
    border-radius: 1rem;
    height: 6rem;
    position: relative;
    /* 删掉原来 border / border-image */
}

/* 渐变边框层 */
.ks-side::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    /* 边框宽度，对应原来border:1px */
    background: linear-gradient(180deg, #077fc400 0%, rgb(7 127 196 / 20%) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}


.ks-side a {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ks-side a+a {
    border-top: 1px dashed #bcd8ee;
}

.ks-side img {
    max-width: 0.4rem;
    max-height: 0.4rem;
    -o-object-fit: contain;
    object-fit: contain;
    -webkit-transition: -webkit-transform .6s ease;
    transition: transform .6s ease;
}

.ks-side a:hover img,
.ks-side img:hover {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}

.ks-side span {
    margin-top: .1rem;
    font-size: 0.2rem;
    line-height: 0.3rem;
    color: #333;
    text-align: center;
    font-family: 'SourceHanSansCN';
    transition: color .3s;
}

/* 左侧 tab 激活态 */


.ks-side a.on span {
    color: #0a7fc4;
}



/* 左侧入口独立内容面板 */
.ks-side-panels {
    margin-bottom: 0; /* 与 .ks_list 同级，不额外加间距 */
}

.ks-side-panel {
    display: none;
    width: 96%; /* 与 .ks_list 宽度一致 */
}

.ks-side-panel.on {
    display: block;
    animation: fadeIn .3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(.06rem); }
    to { opacity: 1; transform: translateY(0); }
}

/* 左侧科室轮播分页点 */
.side-pagination {
    text-align: center;
    margin-top: 0.18rem;
}

.side-pagination .swiper-pagination-bullet {
    width: 0.1rem;
    height: 0.1rem;
    background: #c5dcee;
    opacity: 1;
}

.side-pagination .swiper-pagination-bullet-active {
    width: 0.26rem;
    border-radius: 0.05rem;
    background: #0a7fc4;
}

/* 中间主体 */
.ks-main {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    padding-left: .7rem;
    padding-right: 37%;
    position: relative;
}

.ks-tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.ks-tabs a {
    display: flex;
    align-items: center;
    padding: 0;
    margin-right: 0.38rem;
    border-radius: 1rem;
    box-sizing: border-box;
    /* 背景底色 */
    background: linear-gradient(90deg, rgb(7 127 196 / 20%) 0%, #077fc400 100%);
    /* 渐变边框 */
    position: relative;
}

.ks-tabs a::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 0.01rem;
    /* 边框宽度 */
    background: linear-gradient(270deg, rgb(7 127 196 / 20%) 0%, #077fc400 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.ks-tabs a .ico {
    width: .62rem;
    height: .62rem;
    background: #077FC4;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ks-tabs a img {
    filter: brightness(0) invert(1);
}

.ks-tabs a.on .ico {
    background: #fff;
    border-radius: 50%;
}

.ks-tabs a.on .ico img {
    filter: none;
}


.ks-tabs a span {
    margin-left: .08rem;
    font-size: .2rem;
    color: #333;
    white-space: nowrap;
    line-height: 0.32rem;
    font-family: 'SourceHanSansCN';
    padding: 0.15rem 0.46rem 0.15rem 0.17rem;
}

.ks-tabs a.on {
    background: #c6a86b;
}

.ks-tabs a.on::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 0.01rem;
    /* 边框宽度 */
    background: linear-gradient(270deg, #c6a86b 0%, #077fc400 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.ks-tabs a.on span {
    color: #fff;
}

/* 科室简介 */
.ks-info {
    margin-top: .32rem;
}

.ks-info h3 {
    display: inline-block;
    padding-bottom: .1rem;
    border-bottom: 2px solid #1a83c8;
    font-size: .24rem;
    font-weight: 700;
    color: #333333;
    line-height: .36rem;
    font-family: 'SourceHanSansCN';
}

.ks-info p {
    padding-top: .2rem;
    max-width: 7.2rem;
    font-size: .16rem;
    line-height: 0.28rem;
    color: #666666;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    border-top: 0.01rem solid #CBD2D6;
    padding-bottom: 0.15rem;
}

/* 科室格子轮播 */
.ks_list {
    display: none;
    width: 96%;
}

.ks_list .ks-info {
    margin-bottom: .32rem;
}

/* 左侧面板文案区与科室分类保持一致高度，避免切换跳动 */
.ks-side-panel .ks-info {
    margin-top: .32rem; /* 与 .ks_list .ks-info 一致 */
    margin-bottom: .32rem;
}

.ks-side-panel .ks-info p {
    max-width: 100%;
    padding-bottom: 0;
}

.ks_list .ks-info h3 {
    display: inline-block;
    padding-bottom: .1rem;
    border-bottom: 2px solid #1a83c8;
    font-size: .24rem;
    font-weight: 700;
    color: #333;
    line-height: .36rem;
    font-family: 'SourceHanSansCN';
}

.ks_list .ks-info p {
    padding-top: .2rem;
    max-width: 100%;
    font-size: .16rem;
    line-height: .28rem;
    color: #666;
    border-top: 0.01rem solid #CBD2D6;
    padding-bottom: 0;
}

.ks-swiper {
    width: 100%;
    margin: 0;
    /* overflow: hidden; */
    max-width: 100%;
    height: auto;
    min-height: 2.4rem; /* 固定 3 行高度，避免切换时版面上下跳动 */
}

.ks-swiper .swiper-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.ks-swiper .swiper-slide {
    height: auto;
    min-height: 2.4rem; /* 每页最小 3 行高度 */
}

.ks-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .265rem .235rem;
}

.ks-list a {
    height: .6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: url(../images/ks.png) no-repeat;
    font-size: 0.2rem;
    color: #333333;
    text-align: center;
    font-family: 'SourceHanSansCN';
    background-size: 100% 100%;
}

.ks-list a:hover {
    background: url(../images/ksxzbg.png) no-repeat;
    color: #fff;
    background-size: 100% 100%;
}

/* 分页 */
.ks-page {
    margin-top: .41rem;
    margin-left: 1.07rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.ks-page img {
    width: 0.46rem;
    height: 0.46rem;
}

.ks-cur {
    font-size: 0.2rem;
    font-weight: 700;
    color: #007CC3;
    font-family: 'SourceHanSerifCNbold';
    padding-left: 0.16rem;
}

.ks-total {
    font-size: 0.2rem;
    font-weight: 700;
    color: #007CC3;
    font-family: 'SourceHanSerifCNbold';
    padding-right: 0.16rem;
}

.ks-bar {
    width: 2.8rem;
    height: 2px;
    margin: 0 .18rem;
    background: #d7e7f5;
    position: relative;
}

.ks-bar b {
    position: absolute;
    left: 0;
    top: 0;
    width: 20%;
    height: 2px;
    background: #1a83c8;
    -webkit-transition: width .3s;
    transition: width .3s;
}

/* 右侧人体圆环 */
.ks-ring {
    position: absolute;
    right: 0;
    top: 19%;
    width: 5.8rem;
    height: 5.5rem;
    z-index: 4;
}

.ks-ring a,
.ks-ring .ks-pop {}

.ks-ring__yh {
    position: absolute;
    left: 50%;
    top: .1rem;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.ks-ring__body {
    position: absolute;
    left: 50%;
    top: .65rem;
    height: 3.75rem;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

/* 人体穴位红点 */
.ks-dot {
    position: absolute;
    width: 0.05rem;
    height: 0.05rem;
    background: #e63946;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 2;
    cursor: pointer;
    box-shadow: 0 0 0.08rem rgba(230, 57, 70, 0.8);
}

.ks-dot::before,
.ks-dot::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: rgba(230, 57, 70, 0.5);
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation: ksDotPulse 1.8s ease-out infinite;
    animation: ksDotPulse 1.8s ease-out infinite;
}

.ks-dot::after {
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

@-webkit-keyframes ksDotPulse {
    0% {
        width: 100%;
        height: 100%;
        opacity: 0.6;
    }
    100% {
        width: 400%;
        height: 400%;
        opacity: 0;
    }
}

@keyframes ksDotPulse {
    0% {
        width: 100%;
        height: 100%;
        opacity: 0.6;
    }
    100% {
        width: 400%;
        height: 400%;
        opacity: 0;
    }
}

.ks-dot:hover {
    background: #ff4d5e;
    box-shadow: 0 0 0.12rem rgba(230, 57, 70, 1);
}

/* 红点激活：显示 kszx.png 靶心图标 */
.ks-dot.is-active {
    width: 0.5rem;
    height: 0.5rem;
    background: url(../images/kszx.png) no-repeat center;
    background-size: contain;
    box-shadow: none;
    z-index: 6;
}

.ks-dot.is-active::before,
.ks-dot.is-active::after {
    display: none;
}

/* 红点到科室索引的连线 */
.ks-connector {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 40;
    overflow: visible;
}

.ks-ring .ri {
    position: absolute;
    z-index: 3;
    width: 0.77rem;
    height: 0.77rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url(../images/ks_xxyh.png) no-repeat;
    background-size: 100%;
}

.ks-ring .ri:hover, .ks-ring .ri.active {
    background: url(../images/ks_xxyh_on.png) no-repeat;
    background-size: 100%;
}

.ks-ring .ri img {
    width: auto;
    height: auto;
    object-fit: contain;
    max-height: 0.36rem;
}


.ks-ring .ri:hover img, .ks-ring .ri.active img{
    filter: brightness(0) invert(1);
}

.ks-ring .ri--t {
    top: -0.2rem;
    left: 50%;
    margin-left: -.34rem;
}

.ks-ring .ri--r {
    right: .52rem;
    top: 0.85rem;
}

.ks-ring .ri--b {
    top: 4.55rem;
    left: 50%;
    margin-left: -.34rem;
}

.ks-ring .ri--l1 {
    left: .55rem;
    top: .85rem;
}

.ks-ring .ri--l2 {
    left: .35rem;
    top: 3.1rem;
}

.ks-more {
    position: absolute;
    right: .7rem;
    bottom: 1.15rem;
    z-index: 3;
    display: flex;
    align-items: center;
    font-size: .15rem;
    color: #1a83c8;
}

.ks-more img {
    width: .18rem;
    height: .18rem;
    margin-right: .06rem;
}

/* 科室索引弹层 */
.ks-pop {
    position: absolute;
    right: 3.2rem;
    top: 1.8rem;
    z-index: 5;
    width: 7.18rem;
    height: 2.6rem;
    opacity: 0;
    visibility: hidden;
    transform: translateX(.2rem);
    transition: opacity .3s, transform .3s;
}

.ks-pop__cat {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
}

.ks-pop__cat.active {
    display: block;
}

.ks-pop::after {
    display: none;
}

.ks-ring.on .ks-pop {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.ks-pop__bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ks-pop__box {
    position: relative;
    z-index: 1;
    padding: .32rem .4rem;
    color: #fff;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

.ks-pop__box h3 {
    font-size: .32rem;
    line-height: .36rem;
    font-weight: 700;
    position: relative;
    flex-shrink: 0;
}

.ks-pop__box h3::before {
    position: absolute;
    content: "";
    background: url(../images/ks_dot.png) no-repeat;
    width: 0.2rem;
    height: 0.2rem;
    padding-left: 0.2rem;
    top: 50%;
    transform: translateY(-50%);
    left: calc(4em + 0.12rem);
    background-size: 0.2rem;
}

.ks-pop__box h3::after {
    display: none;
}

.ks-pop__box ul {
    margin-top: .1rem;
    grid-template-columns: repeat(3,1fr);
    display: grid;
    height: 1.1rem;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.ks-pop__box ul::-webkit-scrollbar {
    display: none;
}
.ks-pop__box li {
    display: inline-flex;
    align-items: center;
    margin-top: .1rem;
    margin-right: .25rem;
    gap: 0.1rem;
}

.ks-pop__box li a {
    font-size: .15rem;
    color: #fff;
}

.ks-pop__box li img {
    width: .14rem;
    height: .04rem;
}

.ks-pop__go {
    margin-top: .1rem;
    bottom: 0.26rem;
    position: absolute;
    right: 0.26rem;
}

.ks-pop__go img {
    width: .4rem;
    height: .4rem;
}

/* ≤1024：纵向重排 */
@media (max-width: 1024px) {
    .home2 {
        background: linear-gradient(180deg, #ebf5fa 0%, #ffffff 100%);
        padding-bottom: 0;
    }

    .ks {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .ks-side {
        width: 100%;
        margin-left: 0;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        height: auto;
        padding: 0.1rem;
    }

    .ks-side a+a {
        border-top: 0;
        border-left: 1px dashed #bcd8ee;
    }

    .ks-side a {
        padding: .2rem .1rem;
    }

    .ks-main {
        padding-left: 0;
        padding-right: 0;
        margin-top: .25rem;
    }

    .ks-tabs {
        display: grid;
        gap: 0.2rem;
        grid-template-columns: repeat(4,1fr);
    }

    .ks-tabs a {
        width: 100%;
        margin: 0;
    }

    .ks-swiper {
        height: auto;
        max-width: 100%;
    }

    .ks-list {
        grid-template-columns: repeat(4, 1fr);
        gap: 0.2rem .14rem;
    }

    .ks-list a {
        height: .72rem;
        font-size: .2rem;
    }

    .ks-bar {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        width: auto;
    }

    .ks_list .ks-info p {
        max-width: 100%;
    }

    .ks-page {
        margin-left: 0;
    }

    .ks-ring {
        position: relative;
        top: 0;
        width: 100%;
        height: 4rem;
        margin-top: .2rem;
        display: none;
    }

    .ks-ring .ri--l {
        left: .2rem;
        top: 1rem;
    }

    .ks-ring .ri--r {
        right: .2rem;
        top: 1rem;
    }

    .ks-ring .ri--b {
        top: auto;
        bottom: .15rem;
    }

    .ks-more {
        right: .2rem;
        bottom: .1rem;
    }

    .ks-pop {
        left: 50%;
        right: auto;
        top: 1.2rem;
        width: 4.6rem;
        max-width: 92%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    .ks-ring.on .ks-pop {
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
}

@media (max-width: 768px) {
    .ks-list {
        grid-template-columns: repeat(3, 1fr);
        gap: .14rem;
    }
     .ks-tabs {
        display: grid;
        grid-template-columns: repeat(3,1fr);
    }
}
@media (max-width: 560px) {
     .ks-tabs {
        display: grid;
        gap: 0.2rem;
        grid-template-columns: repeat(2,1fr);
    }
}
@media (max-width: 480px) {
    .ks-list {
        grid-template-columns: repeat(2, 1fr);
        gap: .14rem;
    }
    
}

@media (max-width: 400px) {
     .ks-tabs {
        display: grid;
        gap: 0.2rem;
        grid-template-columns: repeat(1,1fr);
    }
}

/* 科室·风采：≤1024px 由 JS 切成 swiper 轮播，卡片宽度交给 swiper 自己算，
 * 所以把桌面那套「图片锁宽」撤掉，改回跟随卡片，避免 slide 里出现超宽图 */
@media (max-width: 1024px) {
    .ksfc {
        /* 手机上这块上下留白原本按桌面给（.72/.1.1rem），显得空，收一点 */
        margin: .4rem 0 .5rem;
    }

    .ksfc .ksfc-wrapper {
        container-type: normal;
        /* 间距交给 swiper 的 spaceBetween，桌面那条 2.5% 的 gap 要和它叠加会错位 */
        gap: 0;
    }

    /* 卡片宽度按「每屏张数」自己算：本版 Swiper 不会给 slide 写内联宽度，
     * 数字型 slidesPerView 只管位移距离，宽度对不上就会一张张错着滑。
     * --ksfc-n / --ksfc-gap 由 JS 在切换档位时写进来 */
    .ksfc-item,
    .ksfc-item.is-active {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: calc((100% - (var(--ksfc-n, 3) - 1) * var(--ksfc-gap, 14px)) / var(--ksfc-n, 3));
        /* 桌面那套 flex-basis 17.5% / 60% 在手机上会让图片被压成小窄条（高度只剩 80px），
         * 这里改由固定比例定高，横幅裁切后画面不扁 */
        height: auto;
        aspect-ratio: 1.6 / 1;
    }

    .ksfc-item img {
        width: 100%;
        height: 100%;
        aspect-ratio: auto;
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
}

/* 科室·风采：手机端竖向堆叠 */
@media (max-width: 560px) {
    .ksfc {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto;
        gap: .24rem;
        margin-top: .4rem;
    }

    .ksfc-item,
    .ksfc-item.is-active {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        /* 宽度不要再写 100%：560px 这一档是一屏 2 张，写死 100% 会盖掉上面的 calc，
         * 结果每张占满整屏、一屏只能看到一张 */
    }

    .ksfc-item.is-active {
        height: 3.6rem;
    }
}

/* ============================================================
 * 综合·新闻 / 媒体·聚焦
 * ============================================================ */
.home3 .title h2 {
    color: #fff;
    cursor: pointer;
}

.home3 .title h2+h2 {
    margin-left: .18rem;
}

.home3 .title h2 span {
    color: #fff;
    font-family: 'SourceHanSerifCNbold';
    font-size: 0.4rem;

}

.home3 .title h2+h2 span {
    margin-left: 0.18rem;
}

.home3 .title h2.active span {
    color: #c6a86b;
    font-family: 'yuweij';
    font-size: 0.64rem;
}

.home3 .title h2.active {
    color: #fff;
}

.home3 .title .more {
    display: none;
    color: #fff;
    border-color: rgba(255, 255, 255, .7);
    background: url(../images/more2.png) no-repeat right 0.21rem center;
}

.home3 .title .more.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.home3 .title .more::after {
    background: #fff;
}

.nw {
    margin-top: .35rem;
}

.nw-box {
    display: none;
}

.nw-box.on {
    display: block;
}

.nw-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/* 左侧大图新闻 */
.nw-left {
    width: 44.75%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.nw-swiper {
    width: 100%;
    height: auto;
}

.nw-card {
    display: block;
}

.nw-card__img {
    position: relative;
    padding-bottom: 56%;
    border-radius: .1rem;
    overflow: hidden;
    width: 100%;

}

.nw-card__img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    transition: all 0.5s;
}

.nw-card__img:hover img {
    transform: scale(1.05);
}

.nw-card__date {
    position: absolute;
    top: .18rem;
    left: .18rem;
    padding: .05rem .16rem;
    background: url(../images/zhsjbg.png) no-repeat;
    font-size: .14rem;
    color: #fff;
    font-style: normal;
    font-family: 'SourceHanSansCN';
}

.nw-card__t {
    margin-top: .2rem;
    font-size: .2rem;
    line-height: .3rem;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.nw-card__d {
    margin-top: .1rem;
    font-size: .16rem;
    line-height: .26rem;
    color: rgba(255, 255, 255, .8);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.nw-right::before {
    position: absolute;
    content: "";
    width: 0.01rem;
    height: 100%;
    opacity: 0.2;
    background: #FFFFFF;
    left: 0.58rem;
}

/* 右侧新闻列表 */
.nw-right {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    padding-left: 1.16rem;
    position: relative;
}

.nw-top {
    display: flex;
    padding-bottom: .185rem;
    align-items: center;
}

.nw-top .nw-top__img {
    width: 3.18rem;
}

.nw-top .nw-top__img .pic {
    width: 100%;
    position: relative;
    padding-top: 64.78%;
    border-radius: 0.12rem;
}

.nw-top .nw-top__img .pic img {
    transition: all 0.5s;
}

.nw-top:hover img {
    transform: scale(1.05);
}

.nw-top:hover .nw-top__t {
    font-weight: 700;
}

.nw-top__txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    padding-left: .28rem;
}

.nw-top__t {
    font-size: .2rem;
    line-height: .32rem;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.nw-top__d {
    margin-top: .07rem;
    font-size: .16rem;
    line-height: .26rem;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.nw-top__time {
    margin-top: .22rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: .14rem;
    color: #fff;
    line-height: 0.26rem;
    background: url(../images/sj.png) no-repeat left center;
    padding-left: 0.32rem;
    background-size: 0.23rem;
}

.nw-clock {
    position: relative;
    width: .18rem;
    height: .18rem;
    margin-right: .08rem;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 50%;
}

.nw-clock::before,
.nw-clock::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1px;
    background: rgba(255, 255, 255, .72);
    -webkit-transform-origin: top;
    transform-origin: top;
}

.nw-clock::before {
    height: .05rem;
    margin-left: -.5px;
}

.nw-clock::after {
    height: .07rem;
    margin-left: -.5px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

/* 盾牌日期小新闻 */
.nw-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .135rem 0;
}

.nw-date {
    position: relative;
    width: 0.78rem;
    height: 0.96rem;
    margin-right: .32rem;
    background: url(../images/zh_sjbg.png) no-repeat center;
    background-size: auto 100%;
    text-align: center;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.nw-date b {
    display: block;
    font-size: .3rem;
    line-height: .26rem;
    font-weight: 700;
}

.nw-date span {
    font-size: .14rem;
    line-height: 0.26rem;
}

.nw-item__t {
    font-size: .2rem;
    line-height: .32rem;
    color: #fff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.nw-item:hover .nw-date {
    background: url(../images/zh_sjxzbg.png) no-repeat center;
    background-size: auto 100%;
}

.nw-item:hover .nw-item__t {
    font-weight: 700;
}

/* 分页 + 箭头 */
.nw-page {
    margin-top: .3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.nw-line {
    width: .43rem;
    height: 0.06rem;
    background: url(../images/chg_02_png_bg.png) no-repeat;
    background-size: auto 0.06rem;
}

.nw-dot {
    width: .09rem;
    height: .09rem;
    margin: 0 .12rem;
    border-radius: 50%;
    background: #c6a86b;
}

.nw-pager {
    display: flex;
    align-items: center;
}

.nw-pager span {
    margin: 0 .09rem;
    font-size: .16rem;
    color: rgba(255, 255, 255, .5);
    cursor: pointer;
}

.nw-pager span.on {
    font-size: .36rem;
    color: #fff;
}

.nw-line--r {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0 .2rem;
    position: relative;
    background: none;
}

.nw-line--r::before {
    position: absolute;
    content: "";
    width: 0.07rem;
    height: 0.07rem;
    border: 0.01rem solid #FFFFFF;
    top: 50%;
    opacity: 0.3;
    left: 0;
    transform: translateY(-50%);
    border-radius: 50%
}

.nw-line--r::after {
    position: absolute;
    content: "";
    width: calc(100% - 0.1rem);
    height: 0.01rem;
    background: #FFFFFF;
    top: 50%;
    opacity: 0.3;
    right: 0;
    transform: translateY(-50%);
}

.nw-arr {
    position: relative;
    width: 0.44rem;
    height: 0.44rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nw-arr+.nw-arr {
    margin-left: .14rem;
    margin-right: 0.3rem;
}

.nw-arr+.nw-arr::after {
    content: "";
    position: absolute;
    background: url(../images/chg_04_png_bg.png) no-repeat;
    background-size: auto 0.07rem;
    width: 0.58rem;
    height: 0.07rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
    right: -0.3rem;
}

.nw-arr::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0.22rem;
    height: 0.22rem;
    background: url(../images/zh_prev.png) no-repeat center;
    transform: translate(-50%, -50%);
    background-size: 0.22rem;
}

.nw-next::before {
    background: url(../images/zh_next.png) no-repeat center;
    background-size: 0.22rem;
}

.nw-arr {
    background: #fff;
}

.nw-arr:hover {
    background: #c6a86b;
}

.nw-prev:hover::before {
    background: url(../images/zh_prev2.png) no-repeat center;
    background-size: 0.22rem;
}

.nw-next:hover::before {
    background: url(../images/zh_next2.png) no-repeat center;
    background-size: 0.22rem;
}

/* ≤1024 纵向重排 */
@media (max-width: 1024px) {
    .home3 {
        background: #0584c9;
        border-top: 0.07rem solid #D6BA87;
        padding: 0.5rem 0;
    }

    .home3 .title {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .home3 .title h2 {
        display: block;
        font-size: .3rem;
        line-height: .5rem;
        white-space: nowrap;
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }

    .home3 .title h2 span {
        font-size: .42rem;
    }

    .home3 .title h2+h2 {
        margin-left: .12rem;
    }

    .home3 .title .more.active {
        display: none;
    }

    .nw-row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .nw-left {
        width: 100%;
    }

    .nw-right::before {
        display: none;
    }

    .nw-card__img {}

    .nw-card__img img {
        height: auto;
    }

    .nw-right {
        padding-left: 0;
        margin-top: .3rem;
    }

}

@media (max-width: 640px) {
    .nw-item {
        padding: 0.1rem 0;
    }

    .nw-date {
        width: 1.1rem;
        height: 0.9rem;
        padding: 0.1rem;
    }
}

@media (max-width: 460px) {
    .nw-top {
        flex-direction: column;
        gap: 0.15rem;
    }

    .nw-top .nw-top__img {
        width: 100%;
    }

    .nw-top__txt {
        padding: 0;
    }


}

/* ============================================================
 * 中山·简史（时间轴：波浪固定全宽，内容层 Swiper 自由轮播）
 * 节点类 --al 锚点横向位置、--dy 波浪带上的纵向比例
 * ============================================================ */
.hist {
    --wave-top: 2.2rem;
    --wave-h: 2rem;
    position: relative;
    height: 6rem;
    padding-top: .8rem;
    /* 手动拖动：抓手光标；纵向留给页面滚动，横向交给脚本 */
    cursor: grab;
    touch-action: pan-y;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 3;
}

.hist.is-dragging {
    cursor: grabbing;
}

/* 中山简史 左右切换箭头 */
.hist-prev,
.hist-next {
    position: absolute;
    bottom: 0;
    width: 0.44rem;
    height: 0.44rem;
    border-radius: 50%;
    background: #0a7fc4;
    border: none;
    outline: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: background .2s;
    transform: translateY(-50%);
    -webkit-tap-highlight-color: transparent;
    box-shadow: 0 0 0.07rem #ddd;
}

.hist-prev {
    left: calc(50% - 0.64rem);
}

.hist-next {
    right: calc(50% - 0.64rem);
}

.hist-prev i,
.hist-next i {
    width: 0.14rem;
    height: 0.14rem;
    border-top: 0.02rem solid #ffffff;
    border-right: 0.02rem solid #ffffff;
    transition: border-color .2s;
}

.hist-prev i {
    transform: rotate(-135deg);
    margin-left: 0.04rem;
}

.hist-next i {
    transform: rotate(45deg);
    margin-right: 0.04rem;
}

.hist-prev:hover,
.hist-next:hover {
    background: #c6a86b;
}

.hist-prev:hover i,
.hist-next:hover i {
    border-color: #fff;
}

/* 固定波浪背景：相对 .hist 定位、全宽出血，不随轮播滚动 */

.home4::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    width: 100vw;
    height: 3.75rem;
    background: url(../images/zsjs.png) no-repeat center;
    background-size: 100% 100%;
    z-index: -1;
    transform: translate(-50%, -50%);
}

.home4::after {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    width: 4.17rem;
    height: 6.92rem;
    background: url(../images/zsjs_img.png) no-repeat center;
    background-size: 4.17rem;
    z-index: -1;
}

.hist-slots,
.hist-cards {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/* ---------- 固定点位层：点位 + 连线固定在波浪上，轮播时纹丝不动 ---------- */
.hist-slots {
    z-index: 1;
    pointer-events: none;
}

.hist-slot {
    position: absolute;
    top: 0;
    height: 100%;
    display: block;
}

.hist-slot.is-off {
    display: none;
}


.hs1 {
    left: 0;
    width: 12.56%;
    --al: 3.4%;
    --dy: .21;
    --cg: 0.855rem;
}

.hs2 {
    left: 12.56%;
    width: 11.31%;
    --al: 2.4%;
    --dy: .87;
    --ct: .825rem;
}

.hs3 {
    left: 23.87%;
    width: 18.06%;
    --al: 2.7%;
    --dy: .955;
    --cg: 1.09rem;
}

.hs4 {
    left: 41.93%;
    width: 10.88%;
    --al: 3.9%;
    --dy: .52;
    --ct: .325rem;
}

.hs5 {
    left: 52.81%;
    width: 12.88%;
    --al: 2.8%;
    --dy: .155;
    --cg: 1.33rem;
}

.hs6 {
    left: 65.69%;
    width: 9.13%;
    --al: 4.3%;
    --dy: .52;
    --ct: .325rem;
}

.hs7 {
    left: 74.82%;
    width: 22.7%;
    --al: 1.8%;
    --dy: .31;
    --cg: 1.4rem;
}

/* 竖线 */
.hist-slot .hist-line {
    position: absolute;
    left: var(--al);
    width: 1px;
    margin-left: -.5px;
    z-index: 1;
    background: linear-gradient(0deg, #026eac66 0%, #026eac00 100%);
}

.hist-slot:nth-child(odd) .hist-line {
    bottom: calc(100% - var(--wave-top) - var(--dy) * var(--wave-h) + 0.7rem);
    height: calc(var(--cg) + 1.5rem);
}

.hist-slot:nth-child(even) .hist-line {
    top: calc(var(--wave-top) + var(--dy) * var(--wave-h) - .6rem);
    height: calc(var(--ct) + 1.85rem);
    background: linear-gradient(180deg, #026eac66 0%, #026eac00 100%);
}

/* 蓝点：固定点位，不随内容移动 */
.hist-slot .hist-dot {
    position: absolute;
    left: var(--al);
    top: calc(var(--wave-top) + var(--dy) * var(--wave-h) - .8rem);
    width: .26rem;
    height: .26rem;
    margin-left: -.13rem;
    background: url(../images/zs_dot.png) no-repeat center;
    background-size: 100% 100%;
    z-index: 3;
}

/* ---------- 内容层：卡片绝对定位，轮播时整体移到上一个点位 ---------- */
.hist-cards {
    z-index: 2;
    /* 上下各留 .6rem 缓冲：只裁掉左右滑出/待入的内容，卡片随波浪起伏时不被切顶切底 */
    top: -.6rem;
    height: calc(100% + 1.2rem);
    /* overflow: hidden; */
}

.hist-card {
    position: absolute;
    left: 0;
    top: 0;
    width: 2.8rem;
    box-sizing: border-box;
    padding-left: .32rem;
    z-index: 2;
    /* --tx 由脚本写入（该内容对应的点位横向坐标）
     * --drag 拖动时的实时跟手偏移，从 .hist 继承，松手归零 */
    -webkit-transform: translate3d(calc(var(--tx, 0px) + var(--drag, 0px)), 0, 0);
    transform: translate3d(calc(var(--tx, 0px) + var(--drag, 0px)), 0, 0);
}

/* 拖动过程中关掉过渡，保证内容完全跟手 */
.hist.is-dragging .hist-card,
.hist.is-dragging .hist-card__in {
    -webkit-transition: none !important;
    transition: none !important;
}

/* 内层只负责竖向位置：外层管左右平移、内层管上下落位，两层可以各用一条缓动曲线 */
.hist-card__in {
    display: block;
}

/* 首次定位完成后才开启过渡，避免初始从 (0,0) 飞入 */
.hist.is-ready .hist-card {
    -webkit-transition: -webkit-transform .62s cubic-bezier(.36, 0, .24, 1), opacity .5s linear;
    transition: transform .62s cubic-bezier(.36, 0, .24, 1), opacity .5s linear;
    will-change: transform;
}

/* 竖向：延迟 + ease-in，几乎全部位移集中在横滑的末段完成，
 * 观感就是内容整体沿水平方向平移到上一个点位，而不是斜着飞过去 */
.hist.is-ready .hist-card__in {
    -webkit-transition: -webkit-transform .52s cubic-bezier(.72, 0, .84, .4) .12s;
    transition: transform .52s cubic-bezier(.72, 0, .84, .4) .12s;
    will-change: transform;
}

/* 已滑出可见区（点位左侧）或尚未进入（最右待入位）的内容 */
.hist-card.is-out {
    opacity: 0;
}

.hist-card b {
    display: block;
    margin-bottom: .1rem;
    font-size: .36rem;
    line-height: .44rem;
    font-weight: 700;
    font-stretch: condensed;
    color: #0a7fc4;
    white-space: nowrap;
    font-family: Bebas;
}

.hist-card b i {
    font-style: normal;
    margin-left: .04rem;
    letter-spacing: 0;
    font-size: 0.2rem;
}

.hist-card p {
    font-size: .16rem;
    line-height: .24rem;
    color: #666666;
    text-align: justify;
    transition: color .3s;
}

/* hover：说明文字变蓝 */
.hist-card:hover .hist-card__in p {
    color: #0a7fc4;
}


.hist-dot {
    position: absolute;
    left: var(--al);
    top: calc(var(--wave-top) + var(--dy) * var(--wave-h) - .13rem);
    width: .26rem;
    height: .26rem;
    margin-left: -.13rem;
    background: url(../images/zs_dot.png) no-repeat center;
    background-size: 100% 100%;
    z-index: 3;
}

/* 孙中山铜像（设计稿原始尺寸 417×692，顶部与 .hist 齐平） */
.hist-statue {
    position: absolute;
    left: 13.8rem;
    top: 0;
    width: 4.17rem;
    z-index: 5;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
}

/* ---------- ≤1024：沿用 PC 的「一上一下」交错形式，只按屏宽改变一屏点位个数 ----------
 * 320-560 一屏 3 个点位（上 2 下 1）、560-768 一屏 4 个（上 2 下 2）、768-1024 一屏 5 个（上 3 下 2）
 * 点位个数由 JS（.hist-slot.is-off）与槽宽变量 --sw 配合控制 */
@media (max-width: 1024px) {
    .home4 {
        margin-top: 0;
    }

    .hist {
        /* 点位带 = 波浪图片盒子：两者完全重合，脚本写进来的 --dy 就是「图片里的曲线高度」，
         * 圆点因此必然落在线上（--wave-top/--wave-h 同时决定 .hist::before 的图片位置） */
        --wave-top: 1.7rem;
        --wave-h: 1.8rem;
        --sw: 20%;
        /* 纵向空间按实测卡片高度分配：点位轴上方要装下最高的上卡（+间距），下方装下最高的下卡 */
        height: 5.6rem;
    }

    /* 移动端把波浪从 .home4 挂到 .hist 上：可以精确控制它相对点位带的纵向位置，
     * 同时把纵向拉伸收窄（原来是 3.75rem 高，被拉得过陡） */
    .home4::before {
        display: none;
    }

    .hist::before {
        content: "";
        position: absolute;
        left: 50%;
        top: var(--wave-top);
        width: 100vw;
        height: var(--wave-h);
        margin-left: -50vw;
        background: url(../images/zsjs.png) no-repeat center;
        background-size: 100% 100%;
        z-index: 0;
        pointer-events: none;
    }

    .hist-wave {
        top: .9rem;
        height: 3.6rem;
    }

    /* 内容层上下留缓冲：卡片纵向超出模块时不被裁 */
    .hist-cards {
        top: -1.2rem;
        height: calc(100% + 2.4rem);
    }

    /* 点位列：等宽均分铺满容器；圆点不再是同一条水平线，
     * 而是按波浪曲线取值（--dy 由脚本按每个点位的横向位置写入，见 placeDotsOnWave）
     * 卡片仍按 PC 规则上下交错，竖线长度由 --cg（上）/ --ct（下）决定 */
    .hist-slot {
        width: var(--sw);
        --al: .2rem;
        --cg: 0.34rem;
        --ct: 0.34rem;
    }

    .hist-slot:nth-child(odd) .hist-line {
        bottom: calc(100% - var(--wave-top) - var(--dy) * var(--wave-h) + 0.1rem);
        height: calc(var(--cg) + 1.5rem);
    }

    .hist-slot:nth-child(even) .hist-line {
        top: calc(var(--wave-top) + var(--dy) * var(--wave-h) - .15rem);
        height: calc(var(--ct) + 1.85rem);
        background: linear-gradient(180deg, #026eac66 0%, #026eac00 100%);
    }

    .hs1 {
        left: 0;
    }

    .hs2 {
        left: var(--sw);
    }

    .hs3 {
        left: calc(var(--sw) * 2);
    }

    .hs4 {
        left: calc(var(--sw) * 3);
    }

    .hs5 {
        left: calc(var(--sw) * 4);
    }

    .hs6 {
        left: calc(var(--sw) * 5);
    }

    .hs7 {
        left: calc(var(--sw) * 6);
    }

    /* 圆点落在波浪线上（--dy 由脚本写入），不再需要一条水平主轴把点串起来 */
    .hist-slot .hist-dot {
        top: calc(var(--wave-top) + var(--dy) * var(--wave-h) - .15rem);
        width: .3rem;
        height: .3rem;
        margin-left: -.15rem;
    }

    /* 卡片宽度跟随槽位；文字从竖线右侧起（沿用 PC 的 padding-left） */
    .hist-card {
        width: calc(var(--sw) - .2rem);
    }

    .hist-statue {
        display: none;
    }

    .home4::after {
        display: none;
    }
}

/* ---------- 560-768：一屏 4 个点位（上 2 下 2） ---------- */
@media (max-width: 768px) {
    .hist {
        --sw: 25%;
    }
}

/* ---------- 320-560：一屏 3 个点位（上 2 下 1） ---------- */
@media (max-width: 560px) {
    .hist {
        --sw: 33.3333%;
        /* 3 列时单卡最窄、文案最高（实测 320px 下上卡可达 239px），上方空间相应加大 */
        height: 6.2rem;
        /* 点位带纵向中点保持在 3.4rem：波峰上的上卡才不会顶到标题 */
        --wave-top: 2.5rem;
    }

    /* 注意：--al 必须写在 .hist-slot 自身上，写在 .hist 上会被 .hist-slot 的同名声明盖掉 */
    .hist-slot {
        --al: .1rem;
    }

    /* 卡片尽量占满槽位：缩小竖线与文字的间距，换取更多文字宽度、更少的行数 */
    .hist-card {
        width: calc(var(--sw) - .16rem);
        padding-left: .12rem;
    }
}

/* 381-480：槽位变宽、卡片变矮，模块高度收回一点 */
@media (min-width: 381px) and (max-width: 560px) {
    .hist {
        height: 5.5rem;
        --wave-top: 2.05rem;
    }
}

/* 481-560：卡片进一步变矮，再收一档，避免大片留白 */
@media (min-width: 481px) and (max-width: 560px) {
    .hist {
        height: 5rem;
        --wave-top: 1.8rem;
    }
}

/* ---------- ≤420：一屏 2 个点位（上 1 下 1），槽宽必须同步放到 50% ----------
 * 脚本在 ≤420 时只显示 2 个点位，若槽宽还停在 3 列的 33.33%，
 * 两个点位只占左边 2/3，右侧会空出一整列、卡片挤在左侧 */
@media (max-width: 420px) {
    .hist {
        --sw: 50%;
        /* 两列时单卡变宽、行数变少，纵向空间相应收一点 */
        height: 4.8rem;
        --wave-top: 1.7rem;
    }

    /* 卡片占满半个槽位，给正文留足宽度 */
    .hist-card {
        width: calc(var(--sw) - .1rem);
        padding-left: .2rem;
    }
      .hist-slot .hist-dot {
        top: calc(var(--wave-top) + var(--dy) * var(--wave-h) + .05rem);
        width: .3rem;
        height: .3rem;
        margin-left: -.15rem;
    }
      .hist-slot:nth-child(odd) .hist-line {
        bottom: calc(100% - var(--wave-top) - var(--dy) * var(--wave-h) - 0.05rem);
        height: calc(var(--cg) + 1.5rem);
    }

    .hist-slot:nth-child(even) .hist-line {
        top: calc(var(--wave-top) + var(--dy) * var(--wave-h) + .35rem);
        height: calc(var(--ct) + 1.85rem);
        background: linear-gradient(180deg, #026eac66 0%, #026eac00 100%);
    }

}


/* ============================================================
 * 中山·简史 底部四宫格入口（第2块为鼠标悬停选中态示意）
 * 纯 CSS：默认仅标题；悬停蓝膜 + 内虚线框 + 白色圆形箭头
 * ============================================================ */
.s4_b {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.s4-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50%;
    height: 1.9rem;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    text-decoration: none;
}

.s4-item.i1 {
    background-image: url(../images/kj1.png);
}

.s4-item.i2 {
    background-image: url(../images/kj2.png);
}

.s4-item.i3 {
    background-image: url(../images/kj3.png);
}

.s4-item.i4 {
    background-image: url(../images/kj4.png);
}

/* 底色压暗，保证白字可读；悬停统一变蓝 */
.s4-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(15, 20, 30, .18);
    -webkit-transition: background-color .35s;
    transition: background-color .35s;
}

.i1::before {
    background: rgba(0, 0, 0, 0.4);
}

.i2::before {
    background: rgba(0, 0, 0, 0.4);
}

.i3::before {
    background: rgba(0, 0, 0, 0.4);
}

.i4::before {
    background: rgba(0, 0, 0, 0.4);
}

.s4-item:hover::before {
    background-color: rgba(5, 132, 201, .78);
}

/* 悬停内虚线框 */
.s4-item::after {
    content: '';
    position: absolute;
    left: .12rem;
    top: .12rem;
    right: .12rem;
    bottom: .12rem;
    border: 1px dashed rgba(255, 255, 255, .85);
    opacity: 0;
    -webkit-transition: opacity .35s;
    transition: opacity .35s;
}

.s4-item:hover::after {
    opacity: 1;
}

.s4-item b {
    position: relative;
    z-index: 2;
    font-size: .42rem;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 .02rem .1rem rgba(0, 0, 0, .35);
    white-space: nowrap;
    font-family: 'SourceHanSansCN';
}

.s4-arr {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 0.6rem;
    height: 0.6rem;
    margin-left: 0;
    border-radius: 50%;
    background: #fff;
    color: #0a7fc4;
    opacity: 0;
    overflow: hidden;
    transition: all 0.5s;
}

.s4-arr img {
    width: 0.3rem;
    height: 0.3rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.s4-item:hover .s4-arr {
    width: .56rem;
    margin-left: .22rem;
    opacity: 1;
}

@media (max-width: 1024px) {
    .s4_b {
        margin-top: .5rem;
    }

    .s4-item {
        height: 1.5rem;
    }

    .s4-item::after {
        left: .08rem;
        top: .08rem;
        right: .08rem;
        bottom: .08rem;
    }

    .s4-item b {
        font-size: .34rem;
        letter-spacing: .02rem;
    }

    .s4-arr {
        height: .5rem;
    }

    .s4-arr svg {
        width: .24rem;
        height: .24rem;
    }

    .s4-item:hover .s4-arr {
        width: .5rem;
        margin-left: .16rem;
    }

    /* 窄卡片裁切时保留左侧大脑图形 */
    .i3 {
        background-position: 20% center;
    }
}

@media (max-width: 640px) {


    .s4-item b {
        font-size: .26rem;
        letter-spacing: 0;
    }

    /* 超窄屏箭头改为右侧悬浮，不挤占标题 */
    .s4-arr {
        position: absolute;
        right: .12rem;
        top: 50%;
        width: .36rem;
        height: .36rem;
        -webkit-transform: translateY(-50%) scale(.6);
        transform: translateY(-50%) scale(.6);
    }

    .s4-arr svg {
        width: .2rem;
        height: .2rem;
    }

    .s4-item:hover .s4-arr {
        width: .36rem;
        margin-left: 0;
        opacity: 1;
        -webkit-transform: translateY(-50%) scale(1);
        transform: translateY(-50%) scale(1);
    }
}

@media (max-width: 480px) {
    .s4-item {
        height: 1.6rem;
        width: 100%;
    }
}


.home5 {
    padding: 1.13rem 0 .85rem;
    background: linear-gradient(180deg, #eaf5fc 0%, #eaf5fc00 100%);
}

.home5 .g-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    padding: 0;
}

/* ---------- 面板 ---------- */
.home5 .box {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 0 0 2.02rem;
    width: 2.02rem;
    overflow: hidden;
    margin-left: -0.25rem;
    border-radius: .25rem 0 0 .25rem;
    transition: all 0.5s;
}

/* 第一块（人才招聘）默认展开，与第二块之间留缺口 */
.home5 .box:nth-child(1).on {
    z-index: 2;
    margin-left: 0;
}

.home5 .box:nth-child(2) {
    z-index: 3;
}

.home5 .box:nth-child(3) {
    z-index: 4;
}

.home5 .box:nth-child(4) {
    z-index: 5;
}

.home5 .box.on {
    flex: 1 1 0%;
    width: auto;
    z-index: 9;
    margin: 0 0.61rem 0 0.36rem;
    box-shadow: 0px 0.04rem 0.1rem 0px rgba(0, 0, 0, 0.1);
}

.home5 .box:last-child.on {
    margin-left: 0.36rem;
    margin-right: 0;
}

/* 容器处于悬停时，原来的默认项收起；当前悬停的面板展开 */
.home5:has(.box:hover) .box.on:not(:hover) {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.4rem;
    flex: 0 0 1.4rem;
    width: 1.4rem;
}

.home5 .box:hover {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    width: auto;
    z-index: 10;
    -webkit-box-shadow: 0 .06rem .24rem rgba(8, 50, 90, .22);
    box-shadow: 0 .06rem .24rem rgba(8, 50, 90, .22);
}

/* ---------- 竖排栏目标题条 ---------- */
.home5 .title {
    position: relative;
    flex: 0 0 2.02rem;
    width: 2.02rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: url(../images/rczp.png) no-repeat;
}

.home5 .box:nth-child(2) .title {
    background: url(../images/yxky.png) no-repeat;
}

.home5 .box:nth-child(3) .title {
    background: url(../images/yxjy.png) no-repeat;
}

.home5 .box:nth-child(4) .title {
    background: url(../images/yxzh.png) no-repeat;
}

.home5 .title h2 {
    display: block;
    font-size: .4rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.1rem;
    line-height: 0.8;
    text-shadow: 0 .02rem .06rem rgba(0, 40, 80, .25);
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}

.home5 .title h2 span {
    font-size: .64rem;
    color: #fff;
    letter-spacing: 0;
    padding-bottom: 0.1rem;
    font-weight: normal;
}

.home5 .title h2 em {

    font-size: 0.4rem;

    font-style: normal;

    padding-top: 0.1rem;
}


/* ---------- 列表区 ---------- */
.home5 .list {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0;
    flex: 1 1 0;
    min-width: 0;
    padding: .16rem .35rem 0;
    background: #fff url(../images/zpbg.png) no-repeat right center;
    overflow: hidden;
}

.home5 .list::after {
    content: '';
    position: absolute;
    right: -.2rem;
    bottom: -.15rem;
    width: 4.6rem;
    height: 2.6rem;
    background: url(../images/h5_wm.jpg) no-repeat right bottom;
    background-size: contain;
    opacity: .55;
    pointer-events: none;
}

.home5 .list ul {
    position: relative;
    z-index: 1;
}

.home5 .list li {
    border-bottom: 0.01rem dashed #D8D8D8;
}

.home5 .list li:last-child {
    border-bottom: 0;
}

.home5 .list a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: .79rem;
    text-decoration: none;
}

.home5 .list h3 {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    padding-left: .22rem;
    font-size: 0.18rem;
    font-weight: 400;
    color: #333333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 蓝色小三角 */
.home5 .list h3::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    background: url(../images/sjx.png) no-repeat left center;
    width: 0.07rem;
    height: 0.14rem;
    transform: translateY(-50%);
}

.home5 .list a:hover h3 {
    color: #0a7fc4;
    font-weight:700;
}
.home5 .list a:hover span {
    color: #0a7fc4;
}
.home5 .list a>span {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: .22rem;
    font-size: .16rem;
    color: #666666;
    line-height: 0.2rem;
}

/* 日期前金色日历图标（复用本地 time.png，不改 HTML） */
.home5 .list a>span::before {
    content: '';
    width: .18rem;
    height: .18rem;
    margin-right: .08rem;
    background: url(../images/time.png) center / contain no-repeat;
}

/* ---------- ≤1024：改为上下竖排手风琴 ---------- */
@media (max-width: 1024px) {
    .home5 {
        padding: .3rem 0 .5rem;
    }

    .home5 .g-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto;
        padding: 0 0.2rem !important;
    }

    .home5 .box,
    .home5 .box:nth-child(1),
    .home5 .box:nth-child(2),
    .home5 .box:nth-child(3),
    .home5 .box:nth-child(4) {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 100%;
        margin: 0 0 .16rem;
        border-radius: .1rem;
        max-height: .94rem;
        z-index: auto;
        -webkit-transition: max-height .35s ease, -webkit-box-shadow .3s;
        transition: max-height .35s ease, box-shadow .3s;
    }

    .home5 .box.on {
        max-height: 5.4rem;
        margin: 0 0 0.2rem;
    }

    /* 悬停其他面板时，原来展开的面板收起 */
    .home5:has(.box:hover) .box.on:not(:hover) {
        max-height: .94rem;
    }

    .home5 .box:hover {
        z-index: 2;
    }

    /* 标题条转横向 */
    .home5 .s5_t .title {
        flex: 0 0 .94rem;
        width: 100%;
        background: #007CC3;
        justify-content: center !important;
        display: flex;
        align-items: center;
    }

    .home5 .box:nth-child(2) .title {
        background: #0052A4;
    }

    .home5 .box:nth-child(3) .title {
        background: #C4A972;
    }

    .home5 .box:nth-child(4) .title {
        background: #19B1BF;
    }

    .home5 .title h2 {
        font-size: .3rem;
        letter-spacing: .06rem;
        -webkit-writing-mode: horizontal-tb;
        -ms-writing-mode: lr-tb;
        writing-mode: horizontal-tb;
        white-space: nowrap;
        display: flex;
        align-items: center;
    }

    .home5 .title h2 span {
        font-size: 0.56rem;
        padding: 0;
    }


    .home5 .list {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        padding: .08rem .24rem 0;
    }

    .home5 .list a {
        height: .58rem;
    }

    .home5 .list h3 {
        font-size: .24rem;
    }

    .home5 .list a>span {
        margin-left: .14rem;
        font-size: .22rem;
    }

    .home5 .list a>span::before {
        width: .24rem;
        height: .24rem;
        margin-right: .06rem;
    }

    .home5 .list h3::before {
        margin-top: -.07rem;
        border-top-width: .07rem;
        border-bottom-width: .07rem;
        border-left-width: .11rem;
    }

    .home5 .list::after {
        width: 4.2rem;
        height: 2.4rem;
        opacity: .4;
    }
}

@media (max-width: 640px) {

    .home5 .box,
    .home5 .box:nth-child(1),
    .home5 .box:nth-child(2),
    .home5 .box:nth-child(3),
    .home5 .box:nth-child(4) {
        max-height: .84rem;
    }

    .home5 .box.on,
    .home5 .box:hover {
        max-height: 5.1rem;
    }

    .home5:has(.box:hover) .box.on:not(:hover) {
        max-height: .84rem;
    }

    .home5 .title {
        -ms-flex-preferred-size: .84rem;
        flex-basis: .84rem;
    }

    .home5 .title h2,
    .home5 .title h2 span {
        font-size: 0.46rem;
    }

    .home5 .title h2 em {
        font-size: 0.34rem;
    }

    .home5 .title::after {
        width: .48rem;
        height: .48rem;
        margin: -.24rem 0 0;
    }

    .home5 .list {
        padding: .06rem .16rem 0;
    }

    .home5 .list a {
        height: .56rem;
    }

    .home5 .list h3 {
        font-size: .22rem;
    }

    .home5 .list a>span {
        margin-left: .1rem;
        font-size: .2rem;
    }

    .home5 .list::after {
        display: none;
    }
}

/* ============================================================
 * 叙事·医学·护理 / 党建·群团（home6）
 * ============================================================ */
.home6 {
    padding: .75rem 0 1.2rem;
    display: block;
}

/* 顶部 tab 标题 + 查看更多 */
.s6-head {
    position: relative;
    max-width: 16rem;
    margin: 0 auto .5rem;
    box-sizing: border-box;
}

.s6-tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.s6-tabs li h2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: 'SourceHanSerifCNbold';
    font-size: 0.36rem;
    color: #666666;
    cursor: pointer;
    white-space: nowrap;
    -webkit-transition: color .3s;
    transition: color .3s;
}

.s6-tabs li h2 span {
    margin-right: .08rem;
    font-size: 0.36rem;
    line-height: 1;
    color: #666666;
    -webkit-transition: color .3s;
    transition: color .3s;
}

.s6-tabs li.on h2 {
    color: #333333;
}

.s6-tabs li.on h2 span {
    color: #007CC3;
    font-family: 'yuweij';
    font-size: .64rem;
}

.s6-tabs li:last-child.on h2, .s6-tabs li:last-child.on h2 span {
    color: #ca0000;
    font-family: 'yuweij';
    font-size: .64rem;
}


.s6-tabs .s6-split {
    margin: 0 .18rem;
    font-size: .36rem;
    font-weight: normal;
    color: #666666;
    font-family: 'SourceHanSansCN';
}

.s6-more {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: .1rem .63rem .09rem .25rem;
    font-size: .18rem;
    color: #333333;
    border: .01rem solid #007CC3;
    border-radius: 1rem;
    background: url(../images/more.png) no-repeat right .21rem center;
    -webkit-transition: all .5s;
    transition: all .5s;
    display: none;
    background-size: 0.15rem;
}

.s6-more.on {
    display: block;
}

.s6-more::after {
    content: "";
    position: absolute;
    right: .48rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: .01rem;
    height: .17rem;
    background: #007CC3;
}

.s6-more:hover {
    color: #007CC3;
    margin-right: .05rem;
}

/* 两个 tab 面板 */
.s6-panel {
    display: none;
}

.s6-panel.on {
    display: block;
}

/* 中间大、两侧小的三卡轮播（纯类名控制，不使用 coverflow） */
.s6-swiper {
    overflow: hidden;
    padding: .15rem 0 .7rem;
}

.s6-swiper .swiper-slide {
    width: 5.12rem;
    transition: all .5s;
    transform: translateY(0.4rem);
}

.s6-swiper .swiper-slide-active {
    transform: translateY(0rem);
    z-index: 3;
}

.s6-card {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 0.2rem;
    background: #dce6ee;
}

.s6-card .pic {
    position: relative;
    width: 100%;
    padding-top: 70.3125%;
    border-radius: 0.2rem;
    overflow: hidden;
}

.s6-card img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.s6-card p {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 .32rem .3rem;
    font-size: .2rem;
    line-height: 0.34rem;
    color: #ffffff;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    z-index: 1;
}

.s6-card::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 30%;
    bottom: 0;
    left: 0;
    background: linear-gradient(0deg, #000000cc 0%, #00000000 100%);
    z-index: 0;
    border-radius: 0 0 0.2rem 0.2rem;
}

.s6-swiper .swiper-slide-active .s6-card {}

/* 自定义控件：箭头 + 序号 + 进度线 */
.s6-ctrl {
    margin-top: -0.3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    z-index: 3;
}

.s6-ctrl a {
    position: relative;
    width: .46rem;
    height: .46rem;

}



.s6-prev {
    margin-right: .22rem;
    background: url(../images/ks_prev.png) no-repeat center;
    background-size: 100%;
}

.s6-next {
    margin-left: .22rem;
    background: url(../images/ke_next.png) no-repeat center;
    background-size: 100%;
}


.s6-cur,
.s6-total {
    font-weight: 700;
    font-family: 'SourceHanSerifCNbold';
    font-size: .2rem;
}

.s6-cur {
    color: #007CC3;
}

.s6-total {
    color: #007CC3;
}

.s6-line {
    position: relative;
    width: 2.4rem;
    height: .02rem;
    margin: 0 .18rem;
    background: #d3e6f4;
    border-radius: .02rem;
}

.s6-line em {
    position: absolute;
    left: 0;
    top: 0;
    width: 20%;
    height: 100%;
    background: #007CC3;
    border-radius: .02rem;
    -webkit-transition: width .5s;
    transition: width .5s;
}

/* ---------- 平板适配 ---------- */
@media (max-width: 1024px) {

    .home6{
        padding-top:0;
    }
    .s6-head {
        max-width: 100%;
        padding: 0;
    }

    .s6-tabs {
        justify-content: start;
    }

    .s6-tabs li h2 {
        font-size: .34rem;
    }

    .s6-tabs li.on h2 span {
        font-size: .52rem;
    }

    .s6-tabs .s6-split {
        margin: 0 .22rem;
        font-size: .3rem;
    }

    .s6-swiper .swiper-slide {
        width: 70%;
        -webkit-transform: scale(.85) translateY(.2rem);
        transform: scale(.85) translateY(.2rem);
    }

    .s6-swiper .swiper-slide-active {
        -webkit-transform: scale(1.08) translateY(0);
        transform: scale(1.08) translateY(0);
    }

    .s6-card p {
        font-size: .2rem;
        padding: .42rem .2rem .14rem;
    }

    .s6-ctrl {
        margin-top: .25rem;
    }
}

/* ---------- 手机适配 ---------- */
@media (max-width: 640px) {


    .s6-tabs li h2,
    .s6-tabs li h2 span {
        font-size: .26rem;
    }

    .s6-tabs li.on h2 span {
        margin-right: .05rem;
        font-size: .46rem !important;
    }

    .s6-tabs .s6-split {
        margin: 0 .12rem;
        font-size: .24rem;
    }

    .s6-more {
        padding: .08rem .4rem .07rem .2rem;
        font-size: .16rem;
        background: url(../images/more.png) no-repeat right .1rem center;
    }

    .s6-more::after {
        right: .38rem;
        height: .14rem;
    }

    .s6-card p {
        font-size: .18rem;
        padding: .36rem .14rem .1rem;
    }

    .s6-ctrl {
        margin-top: .2rem;
    }

    .s6-ctrl a {
        width: .36rem;
        height: .36rem;
    }

    .s6-prev {
        margin-right: .14rem;
    }

    .s6-next {
        margin-left: .14rem;
    }

    .s6-cur,
    .s6-total {
        font-size: .22rem;
    }

    .s6-line {
        width: 1.2rem;
        margin: 0 .12rem;
    }
}




/* ---------- 手机端（≤768）：卡片平齐，不使用居中放大 ---------- */
@media (max-width: 1024px) {
    .s6-swiper {
        padding: .1rem 0;
    }

    /* 宽度交给 Swiper（481~768 两张、≤480 一张），取消错位与缩放 */
    .s6-swiper .swiper-slide,
    .s6-swiper .swiper-slide-active {
        width: auto;
        margin-top: 0;
        -webkit-transform: none;
        transform: none;
    }

    .s6-card {
        border-radius: .12rem;
    }
}

/* ---------- 手机适配 ---------- */
@media (max-width: 480px) {
    .s6-tabs li h2,
    .s6-tabs li h2 span {
        font-size: .2rem;
    }

    .s6-tabs li.on h2 span {
        font-size: .36rem !important;
    }
    .s6-more{
        background:none;
        padding: 0.05rem 0.2rem;
    }
    .s6-more::after{
        display:none;
    }
}
/* ============================================================
 * 通知·公告 / 招标·信息（home7）
 * ============================================================ */
.home7 {
    padding: .75rem 0 .9rem;
    background: #eef6fc url(../images/bg5.png) center top / cover no-repeat;
    overflow: hidden;
}

/* 顶部 tab 标题 + 查看更多（与 home6 同风格） */
.s7-head {
    position: relative;
    margin-bottom: .55rem;
}

.s7-tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.s7-tabs li h2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: 'SourceHanSerifCNbold';
    font-size: .36rem;
    color: #666666;
    cursor: pointer;
    white-space: nowrap;
    -webkit-transition: color .3s;
    transition: color .3s;
}

.s7-tabs li h2 span {
    margin-right: .08rem;
    font-size: .36rem;
    line-height: 1;
    color: #666666;
    -webkit-transition: color .3s;
    transition: color .3s;
}

.s7-tabs li.on h2 {
    color: #333333;
}

.s7-tabs li.on h2 span {
    color: #007CC3;
    font-family: 'yuweij';
    font-size: .64rem;
}

.s7-tabs .s7-split {
    margin: 0 .18rem;
    font-size: .36rem;
    color: #666666;
    font-family: 'SourceHanSansCN';
}

.s7-more {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: .1rem .63rem .09rem .25rem;
    font-size: .18rem;
    color: #333333;
    border: .01rem solid #007CC3;
    border-radius: 1rem;
    background: url(../images/more.png) no-repeat right .21rem center;
    display: none;
    -webkit-transition: all .5s;
    transition: all .5s;
}

.s7-more.on {
    display: block;
}

.s7-more::after {
    content: "";
    position: absolute;
    right: .48rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: .01rem;
    height: .17rem;
    background: #007CC3;
}

.s7-more:hover {
    color: #007CC3;
    margin-right: .05rem;
}

/* 两个 tab 面板 */
.s7-panel {
    display: none;
}

.s7-panel.on {
    display: block;
}

/* 顶部留白给探出的日期牌 */
.s7-swiper {
    overflow: hidden;
    padding: .22rem 0 .2rem;
}

.s7-swiper .swiper-slide {
    height: auto;
}

.s7-swiper .swiper-slide-active {
    margin-bottom: 0.7rem;
}

.s7-swiper .swiper-slide-active+.swiper-slide {
    margin-top: 0.7rem;
}

.s7-swiper .swiper-slide-active+.swiper-slide+.swiper-slide {
    margin-bottom: 0.7rem;
}

.s7-swiper .swiper-slide-active+.swiper-slide+.swiper-slide+.swiper-slide {
    margin-top: 0.7rem;
}

/* 公告卡片 */
.s7-card {
    position: relative;
    display: block;
    height: 100%;
    min-height: 3.3rem;
    padding: .92rem .3rem .3rem;
    background: rgba(255, 255, 255, 0.6);
    box-shadow: 0px 0.04rem 0.1rem 0px rgba(0, 0, 0, 0.1);
    transition: all .4s;
}

.s7-card h3 {
    font-size: .18rem;
    line-height: 0.28rem;
    font-weight: 700;
    color: #333333;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.s7-card p {
    margin-top: .26rem;
    font-size: .16rem;
    line-height: 0.3rem;
    color: #9aa3ad;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 左上角日期牌（蓝底白字 + 金色折边） */

.s7-date {
    position: absolute;
    left: .3rem;
    top: -.2rem;
    width: .82rem;
    padding: .08rem 0;
    text-align: center;
    -webkit-transition: all .4s;
    transition: all .4s;
    z-index: 1;
}

.s7-date::before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: -1;
    background: #007CC3;
    height: 100%;
}

.s7-date::after {
    content: "";
    position: absolute;
    left: .06rem;
    top: .06rem;
    width: 100%;
    z-index: -2;
    background: #c8a24e;
    height: 100%;
}

.s7-date b {
    display: block;
    font-size: .38rem;
    line-height: 1.1;
    font-weight: 700;
    color: #ffffff;
    font-family: Arial, sans-serif;
}

.s7-date span {
    display: block;
    margin-top: .02rem;
    font-size: .14rem;
    color: #ffffff;
}



/* 激活卡：蓝底反白 + 院标水印 */
.s7-swiper .swiper-slide:hover .s7-card {
    background: #0d83c8 url(../images/tz_xzbg.png) right center no-repeat;
    box-shadow: 0 .04rem .1rem rgba(13, 110, 170, .35);
    background-size: 100%;
}

.s7-swiper .swiper-slide:hover .s7-card h3 {
    color: #ffffff;
}

.s7-swiper .swiper-slide:hover .s7-card p {
    color: rgba(255, 255, 255, .85);
}

.s7-swiper .swiper-slide:hover .s7-date {
    background: #ffffff;
}

.s7-swiper .swiper-slide:hover .s7-date b,
.s7-swiper .swiper-slide:hover .s7-date span {
    color: #007CC3;
}

.s7-swiper .swiper-slide:hover .s7-date::before {
    background: #fff;
}

/* ---------- 平板适配（769~1024 一屏 3 张） ---------- */
@media (max-width: 1024px) {
    .home7 {
        padding: .5rem 0 .6rem;
    }

    .s7-head {
        margin-bottom: .35rem;
    }

    .s7-card {
        min-height: 3.6rem;
    }

    .s7-swiper .swiper-slide {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}

/* ---------- 手机适配（≤768） ---------- */
@media (max-width: 768px) {
    .s7-tabs {
        justify-content: start;
    }

    .s7-tabs li h2,
    .s7-tabs li h2 span {
        font-size: .28rem;
    }

    .s7-tabs li.on h2 span {
        font-size: .46rem;
    }

    .s7-tabs .s7-split {
        margin: 0 .14rem;
        font-size: .28rem;
    }


    .s7-more.on {
        display: block;
    }

    .s7-more::after {
        right: .38rem;
        height: .14rem;
    }

    .s7-swiper {
        padding: .22rem 0 .05rem;
    }

    .s7-card {
        min-height: 3.4rem;
        padding: .85rem .24rem .26rem;
    }

    .s7-card h3 {
        font-size: .2rem;
    }

    .s7-card p {
        font-size: .15rem;
        line-height: 1.65;
    }
}

/* ---------- 小屏手机（≤480 一屏 1 张） ---------- */
@media (max-width: 480px) {
    .s7-card {
        min-height: 0;
    }
     .s7-tabs li h2,
    .s7-tabs li h2 span {
        font-size: .2rem;
    }

    .s7-tabs li.on h2 span {
        font-size: .36rem;
    }
    .s7-more{
        background:none;
        padding: 0.05rem 0.2rem;
    }
    .s7-more::after{
        display:none;
    }
}

/* ============================= home8 专题专栏（hover 展开手风琴） ============================= */
.home8 {
    padding: .5rem 0 .75rem;
    background: linear-gradient(180deg, #e8f2f9 0%, #eaf5fc00 100%);
}

.home8 .h8-hd {
    margin-bottom: .32rem;
    text-align: center;
}

.home8 .h8-hd h2 {
    display: inline-block;
    font-size: .42rem;
    font-weight: bold;
    color: #1a3a5c;
    line-height: 1;
}

.home8 .h8-hd h2 span {
    margin-left: .06rem;
    font-size: .3rem;
    font-weight: normal;
    color: #5a7a9a;
}

/* 手机端轮播需要的 wrapper：桌面用 display:contents 让它“不存在”，
 * 四张卡仍直接参与 .h8-list 的 flex 手风琴布局 */
.home8 .h8-wrapper {
    display: contents;
}

/* 手机端轮播分页，桌面隐藏 */
.home8 .h8-pagination {
    display: none;
}

.home8 .h8-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    /* 设计稿：整组 15rem 居中（容器 16rem 内左右各缩 .5rem），
     * 大图 9.6rem + 3 条 1.44rem + 3 个 .36rem 间距 = 15rem */
    width: 100%;
    margin: 0.5rem auto 0;
    gap: .36rem;
    /* 不设高度：只把本行登记为「容器查询容器」，
     * 子元素就能用 cqw（= 本行宽度的 1%）把图片宽度锁成展开后的最终宽度，
     * 让行高由「图片固定宽 + 自身比例」自然得出，且全程恒定（见 .h8-item__media） */
    container-type: inline-size;
}

/* 单卡：默认收起为竖条，hover / is-active 时展开
 * 注意：收起态的斜切造型做在 .h8-item__title 的 clip-path 上（见下），
 * 卡片本身默认不带投影，避免矩形投影框住斜切条穿帮 */
.home8 .h8-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.44rem;
    flex: 0 0 1.44rem;
    min-width: 0;
    overflow: hidden;
    border-radius: .12rem;
    text-decoration: none;
    -webkit-transition: flex .4s ease, box-shadow .3s;
    transition: flex .4s ease, box-shadow .3s;
}

/* 展开/收起只认 .is-active 这一个开关（由 JS 带 80ms 防抖切换）。
 * 不再用 :hover / :has() 直接驱动：卡片宽度变化时光标会反复进出相邻卡，
 * 纯 CSS hover 会在两张卡之间来回抖动，改由单一状态源后运动才稳定 */
.home8 .h8-item.is-active {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    -webkit-box-shadow: 0 .06rem .26rem rgba(8, 50, 90, .22);
    box-shadow: 0 .06rem .26rem rgba(8, 50, 90, .22);
}


.home8 .h8-item.is-active .h8-item__title {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    width: 0;
    opacity: 0;
}

/* 竖排标题条：始终显示在卡片左侧 */
.home8 .h8-item__title {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.44rem;
    flex: 0 0 1.44rem;
    width: 1.44rem;
    min-width: 0;
    overflow: hidden;

    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: -webkit-max-content;
    grid-auto-columns: max-content;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-column-gap: .14rem;
    column-gap: .14rem;
    padding: 0;
    color: #fff;
    background: linear-gradient(180deg, #d4453a 0%, #b2322e 100%);

    -webkit-clip-path: polygon(0.00% 7.17%, 0.24% 6.50%, 0.93% 5.86%, 2.05% 5.30%, 3.53% 4.85%, 5.28% 4.53%, 7.20% 4.35%, 90.53% 0.44%, 92.89% 0.45%, 95.16% 0.68%, 97.14% 1.12%, 98.69% 1.73%, 99.66% 2.46%, 100.00% 3.26%, 100.00% 96.74%, 99.66% 97.54%, 98.69% 98.27%, 97.14% 98.88%, 95.16% 99.32%, 92.89% 99.55%, 90.53% 99.56%, 7.20% 95.65%, 5.28% 95.47%, 3.53% 95.15%, 2.05% 94.70%, 0.93% 94.14%, 0.24% 93.50%, 0.00% 92.83%);
    clip-path: polygon(0.00% 7.17%, 0.24% 6.50%, 0.93% 5.86%, 2.05% 5.30%, 3.53% 4.85%, 5.28% 4.53%, 7.20% 4.35%, 90.53% 0.44%, 92.89% 0.45%, 95.16% 0.68%, 97.14% 1.12%, 98.69% 1.73%, 99.66% 2.46%, 100.00% 3.26%, 100.00% 96.74%, 99.66% 97.54%, 98.69% 98.27%, 97.14% 98.88%, 95.16% 99.32%, 92.89% 99.55%, 90.53% 99.56%, 7.20% 95.65%, 5.28% 95.47%, 3.53% 95.15%, 2.05% 94.70%, 0.93% 94.14%, 0.24% 93.50%, 0.00% 92.83%);
    -webkit-transition: -ms-flex-preferred-size .4s ease, flex-basis .4s ease, width .4s ease, padding .4s ease, opacity .3s ease;
    transition: flex-basis .4s ease, width .4s ease, padding .4s ease, opacity .3s ease;
    font-family: 'SourceHanSerifCNbold';
    border-radius: 0.12rem;
}

/* 偶数条（金、蓝）：斜切方向相反，左高右低 */
.home8 .h8-item:nth-child(even) .h8-item__title {
    -webkit-clip-path: polygon(0.00% 3.26%, 0.34% 2.46%, 1.31% 1.73%, 2.86% 1.12%, 4.84% 0.68%, 7.11% 0.45%, 9.47% 0.44%, 92.80% 4.35%, 94.72% 4.53%, 96.47% 4.85%, 97.95% 5.30%, 99.07% 5.86%, 99.76% 6.50%, 100.00% 7.17%, 100.00% 92.83%, 99.76% 93.50%, 99.07% 94.14%, 97.95% 94.70%, 96.47% 95.15%, 94.72% 95.47%, 92.80% 95.65%, 9.47% 99.56%, 7.11% 99.55%, 4.84% 99.32%, 2.86% 98.88%, 1.31% 98.27%, 0.34% 97.54%, 0.00% 96.74%);
    clip-path: polygon(0.00% 3.26%, 0.34% 2.46%, 1.31% 1.73%, 2.86% 1.12%, 4.84% 0.68%, 7.11% 0.45%, 9.47% 0.44%, 92.80% 4.35%, 94.72% 4.53%, 96.47% 4.85%, 97.95% 5.30%, 99.07% 5.86%, 99.76% 6.50%, 100.00% 7.17%, 100.00% 92.83%, 99.76% 93.50%, 99.07% 94.14%, 97.95% 94.70%, 96.47% 95.15%, 94.72% 95.47%, 92.80% 95.65%, 9.47% 99.56%, 7.11% 99.55%, 4.84% 99.32%, 2.86% 98.88%, 1.31% 98.27%, 0.34% 97.54%, 0.00% 96.74%);
}

.home8 .h8-item:nth-child(2) .h8-item__title {
    background: linear-gradient(180deg, #eac06b 0%, #d5a546 100%);
}

.home8 .h8-item:nth-child(3) .h8-item__title {
    background: linear-gradient(180deg, #52cce1 0%, #2aa3b8 100%);
}

.home8 .h8-item:nth-child(4) .h8-item__title {
    background: linear-gradient(180deg, #007cc3 0%, #00659e 100%);
}

.home8 .h8-item:first-child .h8-item__title em {
    /*max-height: none;*/
}

.home8 .h8-item__title em {
    display: block;
    font-style: normal;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-lr;
    letter-spacing: -.05rem;
    line-height: .38rem;
    max-height: 3rem;
    max-height: 3.6rem;
}


.home8 .h8-item:nth-child(1) .h8-item__title em {
    letter-spacing: -.05rem;
}

.home8 .h8-item__title em {
    font-size: .24rem;
    font-weight: normal;
}

.home8 .h8-item__title i {
    font-size: .24rem;
    opacity: .95;
}


.home8 .h8-item__media {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 9.6rem;
    flex: 0 0 9.6rem;
    width: 9.6rem;
    -ms-flex-preferred-size: calc(100cqw - 5.4rem);
    flex-basis: calc(100cqw - 5.4rem);
    width: calc(100cqw - 5.4rem);
    min-width: 0;
    height: 100%;
    overflow: hidden;
    padding-bottom: 44.4%;
    opacity: 0;
}
.home8 .is-active .h8-item__media{
    opacity: 1;
}
.home8 .h8-item__media img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: all 0.5s;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}


.home8 .h8-item__media img:hover {
    transform: translate(-50%, -50%) scale(1.05);
}

/* ---------- ≤1024：改为图片轮播（一屏 1 / 2 / 3 张由 JS 的 breakpoints 控制） ---------- */
@media (max-width: 1024px) {
    .home8 .h8-list {
        display: block;
        height: auto;
        width: auto;
        /* 手机端改轮播，卡片宽度由 swiper 计算，不再需要 cqw 参照 */
        container-type: normal;
    }

    .home8 .h8-wrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    /* 每张卡就是一张纯图轮播卡片，不显示文字标题 */
    .home8 .h8-item,
    .home8 .h8-item.is-active {
        position: relative;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 100%;
        height: auto;
        /* 用 aspect-ratio 而不是固定 rem：宽度由 swiper 按每屏张数算出，
         * 高度跟着等比走，1/2/3 张时比例一致 */
        aspect-ratio: 2.2 / 1;
        border-radius: .12rem;
        overflow: hidden;
    }

    .home8 .h8-item__title {
        display: none;
    }

    /* 图铺满整卡 */
    .home8 .h8-item__media {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        opacity: 1;
        padding-bottom: 44%;
    }

    .home8 .h8-item__media::after {
        display: none;
    }

    /* 轮播分页点 */
    .home8 .h8-pagination {
        display: block;
        text-align: center;
        margin-top: .18rem;
        line-height: 0;
    }

    .home8 .h8-pagination .swiper-pagination-bullet {
        width: .14rem;
        height: .14rem;
        margin: 0 .07rem;
        background: #9fb3c4;
        opacity: .5;
        -webkit-transition: width .3s ease, opacity .3s ease, background .3s ease;
        transition: width .3s ease, opacity .3s ease, background .3s ease;
    }

    .home8 .h8-pagination .swiper-pagination-bullet-active {
        width: .34rem;
        border-radius: .07rem;
        background: #0077bc;
        opacity: 1;
    }
}

/* 每屏张数越多，卡片越“方”一点，避免三张并排时被压成细条 */
@media (min-width: 560px) and (max-width: 767px) {
    .home8 .h8-list .h8-item {
        aspect-ratio: 1.8 / 1;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .home8 .h8-list .h8-item {
        aspect-ratio: 1.5 / 1;
    }
}

/* ============================= home9 科普·矩阵 ============================= */
.home9 {
    padding: 2.7rem 0 1.9rem;
    background: url(../images/bg6.png) no-repeat bottom;
    background-size: 100% 100%;
}

.home9 .title {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
}

.home9 .h9-hd {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: .32rem;
    width: 100%;
    height: 0.95rem;
}


.home9 .h9-icons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.2rem;
    position: absolute;
    right: 0;
}

.home9 .h9-icons a {
    position: relative;
    display: flex;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    overflow: visible;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s;
    background: #fff;
    align-items: center;
    justify-content: center;
}

.home9 .h9-icons a:hover {
    -webkit-transform: translateY(-.04rem);
    transform: translateY(-.04rem);
}

.home9 .h9-icons img {
    display: block;
    width: auto;
    max-height: 0.28rem;

}

/* 二维码浮层：默认隐藏，hover 图标时在下方弹出 */
.home9 .h9-qr {
    position: absolute;
    top: 124%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 1.1rem;
    padding: 0.1rem;
    background: #fff;
    border-radius: .08rem;
    -webkit-box-shadow: 0 .06rem .24rem rgba(10, 50, 90, .2);
    box-shadow: 0 .06rem .24rem rgba(10, 50, 90, .2);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity .25s, -webkit-transform .25s;
    transition: opacity .25s, transform .25s;
    z-index: 10;
}

.home9 .h9-qr::before {
    content: '';
    position: absolute;
    top: -0.07rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-width: 0 .08rem .08rem;
    border-style: solid;
    border-color: transparent transparent #fff;
}

.home9 .h9-qr img {
    display: block;
    width: 100%;
    height: auto;
    max-height: none;
}

.home9 .h9-qr em {
    display: block;
    margin-top: .06rem;
    font-size: .13rem;
    font-style: normal;
    color: #1a3a5c;
    text-align: center;
    line-height: 1.2;
}

.home9 .h9-icons a:hover .h9-qr {
    opacity: 1;
    visibility: visible;
}

/* 4 列布局：第 1、4、5 张卡片竖向占两行（大图），第 2、3 张在第 2 列上下排列 */
.home9 .h9-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr 1fr;
    gap: 0.28rem 0.27rem;
    padding-bottom: 0.1rem;
}

.home9 .h9-card:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1 / 3;
}

.home9 .h9-card:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
}

.home9 .h9-card:nth-of-type(3) {
    grid-column: 2;
    grid-row: 2;
}

.home9 .h9-card:nth-of-type(4) {
    grid-column: 3;
    grid-row: 1 / 3;
}

.home9 .h9-card:nth-of-type(5) {
    grid-column: 4;
    grid-row: 1 / 3;
}

/* 大图卡片（第 1、4、5 张）使用竖向比例 */
.home9 .h9-card:nth-of-type(1) .pic,
.home9 .h9-card:nth-of-type(4) .pic,
.home9 .h9-card:nth-of-type(5) .pic {
    padding-top: 159.5% !important;
}

.home9 .h9-card {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
}

.home9 .h9-main {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 100%;
}

.home9 .h9-card .pic {
    position: relative;
    width: 100%;
    padding-top: 76.12%;
    overflow: hidden;
    border-radius: 0.16rem;
}

.home9 .h9-main .pic {
    padding-top: 159.5%;
}

.home9 .h9-card .pic::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 1.3rem;
    background: linear-gradient(0deg, #000000e6 0%, #00000000 100%);
    bottom: 0;
    left: 0;
    border-radius: 0 0 0.16rem 0.16rem;
}

.home9 .h9-card img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: -webkit-transform .5s ease;
    transition: transform .5s ease;
    position: absolute;
    top: 0;
    left: 0;
}

.home9 .h9-card:hover img {
    transform: scale(1.06);
}

/* 中央播放按钮 */
.home9 .h9-play {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: .66rem;
    height: .66rem;
    border-radius: 50%;
    background: rgba(0, 0, 0, .45);
    -webkit-transition: background .3s;
    transition: background .3s;
}

.home9 .h9-play::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 52%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-style: solid;
    border-width: .12rem 0 .12rem .18rem;
    border-color: transparent transparent transparent #fff;
}

.home9 .h9-card:hover .h9-play {
    background: rgba(166, 36, 52, .8);
}

/* 底部标题渐变层 */
.home9 .h9-title {
    position: absolute;
    right: 0;
    bottom: 0.26rem;
    left: 0;
    margin: 0;
    padding: 0 .2rem 0 0.26rem;
    font-size: .18rem;
    line-height: 0.24rem;
    color: #fff;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.home9 .h9-title.dy{background: url(../images/icon_dy.png) no-repeat left 0.24rem center;padding-left: 0.5rem;background-size: contain;}
.home9 .h9-title.xhs{background: url(../images/icon_xhs.png) no-repeat left 0.24rem center;padding-left: 0.5rem;background-size: contain;}
.home9 .h9-title.ks{background: url(../images/icon_ks.png) no-repeat left 0.24rem center;padding-left: 0.5rem;background-size: contain;}
.home9 .h9-title.wx {
    background: url(../images/wx2.png) no-repeat left 0.24rem center;
    background-size: 0.3rem;
    padding-left: 0.6rem;
}

.home9 .h9-title.sph {
    background: url(../images/sph2.png) no-repeat left 0.24rem center;
    padding-left: 0.65rem;
    background-size: 0.31rem;
}

/* ---------- 平板 ---------- */
@media (max-width: 1024px) {
    .home9 {
        background: linear-gradient(180deg, #e6f2f9 0%, #e6f2f900 100%), url(../images/bg6.png) no-repeat bottom;
        padding: 0.5rem 0 1.35rem;
        min-height: auto;
    }

    .home9 .h9-title {
    }

    .home9 .h9-main .h9-title {
        font-size: .18rem;
    }
}

/* ---------- 手机：单列竖排 ---------- */
@media (max-width: 768px) {
    .home9 .h9-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto;
        gap: .12rem;
    }

    .home9 .h9-card {
        width: 100%;
        grid-column: auto !important;
        grid-row: auto !important;
    }

    .home9 .h9-card:nth-child(1) .pic,
    .home9 .h9-card:nth-child(4) .pic,
    .home9 .h9-card:nth-child(5) .pic {
        /* padding-top: 57.143%; */
    }

    .home9 .h9-icons a>img {
        max-height: 0.25rem;
    }

    .home9 .h9-icons a {
        width: 0.46rem;
        height: 0.46rem;
    }
}

@media (max-width: 380px) {
    .home9 .h9-hd {
        height: auto;
    }

    .home9 .title {
        position: relative;
        left: 0;
        transform: translateX(0px);
    }

    .home9 .h9-icons {
        position: relative;
    }

}

/* ============================================================
 * 右侧悬浮快捷栏 aside（综合新闻/科室介绍/医学科研/护理天地/中山简史/媒体聚焦 + 返回顶部）
 * ============================================================ */
.aside {
    position: fixed;
    right: .2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 88;
    width: 0.96rem;
    background: #007CC3;
    border-radius: .15rem;
    -webkit-box-shadow: 0 .06rem .2rem rgba(0, 74, 124, .28);
    box-shadow: 0 .06rem .2rem rgba(0, 74, 124, .28);
    overflow: hidden;
}

.aside ul li {
    position: relative;
}

/* 入口之间的半透明白色分隔线（返回顶部按钮上方不显示） */
.aside ul li+li::before {
    content: "";
    position: absolute;
    left: .1rem;
    right: .1rem;
    top: 0;
    height: 1px;
    background: rgba(255, 255, 255, .2);
}

.aside ul li.aside-top::before {
    display: none;
}

.aside ul li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: .18rem .1rem .16rem;
    -webkit-transition: background .25s;
    -o-transition: background .25s;
    transition: background .25s;
}


.aside .aside_img {
    width: auto;
    max-height: .36rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.aside .aside_img img {
    max-width: 100%;
    max-height: 100%;
}

.aside ul li h2 {
    margin-top: .08rem;
    font-size: .16rem;
    line-height: 0.2rem;
    font-weight: 400;
    color: #ffffff;
    white-space: nowrap;
}

/* 金色花形 返回顶部按钮 */
.aside .aside-top a {
    padding: .16rem .1rem .22rem;
}

.aside .aside-top .aside_img {
    width: .48rem;
    height: .48rem;
    -webkit-transition: -webkit-transform .25s;
    transition: -webkit-transform .25s;
    -o-transition: transform .25s;
    transition: transform .25s;
    transition: transform .25s, -webkit-transform .25s;
}

.aside a .aside_img img {
    /* 加过渡，控制动画时长和缓动 */
    transition: transform 0.6s ease;
}

.aside a:hover .aside_img img {
    transform: rotate(360deg);
}


@media (max-width: 1024px) {
    .aside {
        display: none;
    }


}






/* è§?é￠‘??1?a— */

.vwrap {
  display: none;
  z-index: 1040000;
  width: 100%;
  position: fixed;
}

.vwrap .videobtg {
  z-index: 900;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: #000;
  opacity: 0.8;
  filter: alpha(opacity=80);
  overflow: hidden;
}

.vwrap .videobox {
  z-index: 1200;
  width: 1200px;
  position: fixed;
  left: 50%;
  top: 50%;
  object-fit: cover;
  transform: translate(-50%, -50%);
  max-width: 90%;
  max-height: 65vh;
}

.vwrap .videobox #videobox {
  width: 100%;
  display: inline-block;

}

.vwrap .videobox #videobox .img_hezi {
  padding-bottom: 60% !important;
}

.vwrap .videobox #videobox video {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#videobox_wrapper {
  height: 100% !important;
}

.vwrap .close {
  z-index: 999;
  width: 31px;
  height: 31px;
  cursor: pointer;
  position: absolute;
  top: 0px;
  right: -42px;
  text-align: center;
}

.vwrap .close i {
  display: block;
  width: 31px;
  height: 31px;
  -webkit-transition: 400ms;
  transition: 400ms;
}

.vwrap .close i svg {
  transition: .6s
}

.vwrap .close:hover i svg {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}