@media screen and (min-width: 1920px) {
    * {
        margin: 0;
        padding: 0
    }

    .pc {
        display: block
    }

    .mb {
        display: none !important
    }

    .safeplace {
        width: 1440px;
        margin: 0 auto;
        display: flex
    }

    .page {
        margin: 0;
        padding: 0;
        font-size: 0
    }

    .section-title {
        display: flex;
        flex-direction: column;
        align-items: center
    }

    .section-title .en {
        color: rgba(6, 24, 40, 0.08);
        font-size: 44px;
        font-weight: 400;
        line-height: 62px;
        text-transform: uppercase
    }

    .section-title .cn {
        margin-top: -36px;
        color: #061828;
        font-size: 32px;
        font-weight: bold;
        line-height: 50px
    }

    .header {
        width: 100%;
        height: 92px;
        padding: 0 240px;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        align-items: center;
        background: none;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 20;
        opacity: 0;
        transition: opacity 0.5s
    }

    .header:hover,
    .header.active {
        opacity: 1;
        transition: opacity 0.5s
    }

    .header .nav-list {
        margin-left: auto;
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .header .nav-list .nav-item {
        position: relative;
        cursor: pointer
    }

    .header .nav-list .nav-item span {
        color: #000000;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px
    }

    .header .nav-list .nav-item::after {
        content: '';
        width: 30px;
        height: 2px;
        background: #c7000b;
        display: none;
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translate(-50%, 8px)
    }

    .header .nav-list .nav-item.active::after {
        display: block
    }

    .header .nav-list .nav-item:hover::after {
        display: block
    }

    .header .nav-list .nav-item:not(:first-child) {
        margin-left: 60px
    }

    .banner {
        width: 100%;
        height: 710px;
        box-sizing: border-box;
        position: relative;
        overflow: hidden
    }

    .banner .banner-swiper-group {
        display: flex;
        flex-direction: row;
        align-items: center;
        position: absolute;
        left: 258px;
        bottom: 79px;
        z-index: 6
    }

    .banner .banner-swiper-group .banner-btn-prev,
    .banner .banner-swiper-group .banner-btn-next {
        width: 13px;
        height: 22px;
        object-fit: cover;
        cursor: pointer
    }

    .banner .banner-swiper-group .banner-btn-prev {
        margin-right: 29px
    }

    .banner .banner-swiper-group .banner-btn-next {
        margin-left: 29px
    }

    .banner .banner-swiper-group .banner-pagination {
        position: relative
    }

    .banner .banner-swiper-group .banner-pagination .swiper-pagination-bullet {
        width: 14px;
        height: 14px;
        margin: 0 10px;
        background: none;
        border: 1px solid #ffffff;
        border-radius: 50%
    }

    .banner .banner-swiper-group .banner-pagination .swiper-pagination-bullet-active {
        background: #ffffff
    }

    .banner .banner-item {
        width: 100%;
        height: 100%;
        position: relative
    }
    .banner .banner-item .banner-icon {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: calc((100% - 1440px)/2);
        width: 503px;
        height: 195px;
        background-image: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/banner-icon.png");
        background-size: 100% 100%;
      }
      .banner .banner-item .banner-text {
        color: #ffffff;
        font-size: 30px;
        position: absolute;
        top: calc(50% + 122px);
        transform: translateY(-50%);
        left: calc((100% - 1440px)/2);
        text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
      }
    .banner .banner-item .banner-img {
        width: 100%;
        height: auto;
        object-fit: cover
    }

    .banner .banner-item .mask {
        width: 100%;
        height: 50%;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), transparent);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 3
    }

    .banner .banner-item .banner-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 4;
        transform: translate(-50%,-50%)
    }

    .banner .banner-item .banner-content .banner-title {
        color: #ffffff;
        font-size: 52px;
        font-weight: bold;
        line-height: 73px;
        white-space: nowrap;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.18)
    }

    .banner .banner-item .banner-content .banner-introduct {
        width: 575px;
        margin-top: 13px;
        color: #ffffff;
        font-size: 20px;
        font-weight: 400;
        line-height: 30px;
        text-align: center;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2)
    }

    .banner .banner-item .banner-content .play-btn {
        width: 60px;
        height: 60px;
        margin-top: 40px;
        object-fit: cover;
        cursor: pointer
    }
    .banner .navigation-list {
        width: 334px;
    height: 279px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: calc((100% - 1440px)/2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    z-index: 5;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(10px);
    padding: 30px 10px;
    }

    .banner .navigation-list .navigation-item {
        width: 100%;
    height: 130px;
    display: flex;
    flex-direction: row;
    align-items: center;
    cursor: pointer;
    }
    .banner .navigation-list .navigation-item img{
        display: none;
      }
      .banner .navigation-list .navigation-item.active img{
        display: block;
        width: 24px;
        height: 24px;
        margin-left: .3125vw;
      }
    .banner .navigation-list .navigation-item .text {
        width: 100%;
        height: 100%;
        padding: 0 25px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        border-radius: 10px;
    }

    .banner .navigation-list .navigation-item .text span {
        color: #ffffff;
        font-size: 20px;
        font-weight: 400;
        line-height: 30px
    }

    .banner .navigation-list .navigation-item.active .text {
        background:rgba(255, 255, 255, 0.2);
    }

    /* .banner .navigation-list .navigation-item.active .text span { */
        /* font-size: 26px; */
        /* font-weight: 500; */
        /* letter-spacing: 2px */
    /* } */

    .banner .navigation-list .navigation-item.active .line {
        background-color: rgba(255, 255, 255, 0.3);
        background-image: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/banner-navigation-line-active.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .partner {
        width: 100%;
        height: 951px;
        padding: 60px 0;
        box-sizing: border-box;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/partner-back.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        overflow: hidden;
        position: relative
    }

    .partner .safeplace {
        flex-direction: column;
        align-items: center
    }

    .partner .safeplace .partner-intro {
        width: 1187px;
        height: 156px;
        object-fit: cover
    }

    .partner .safeplace .partner-list {
        width: 100%;
        margin-top: 60px;
        display: flex;
        flex-direction: column;
        align-items: center
    }

    .partner .safeplace .partner-list .partner-row {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 200px
    }

    .partner .safeplace .partner-list .partner-row:not(:first-child) {
        margin-top: -40px
    }

    .partner .safeplace .partner-list .partner-row .partner-item {
        width: 120px;
        height: 120px;
        background: rgba(255, 255, 255, 0.4);
        box-shadow: 5px 10px 30px 0 rgba(154, 160, 209, 0.3);
        border-radius: 20px;
        border: 1px solid #ffffff;
        backdrop-filter: blur(10px);
        transition: transform 0.5s
    }

    .partner .safeplace .partner-list .partner-row .partner-item img {
        width: 100%;
        height: 100%;
        object-fit: cover
    }

    .partner .safeplace .partner-list .partner-row .partner-item:hover {
        transform: scale(1.6);
        transition: transform 0.5s
    }
    .innovate {
        width: 100%;
        /* height: 716px; */
        padding: 60px 0;
        box-sizing: border-box;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/innovate-back.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }
    .innovate .safeplace {
        flex-direction: column;
        align-items: center;
        position: relative;
    }
    .innovate .safeplace .innovate-list {
        width: 100%;
        margin-top: 30px;
        position: relative
    }
    .innovate .safeplace .innovate-list .innovate-item{
        width: 467px;
        /* height: 18.437vw; */
        position: relative;
    }
    .innovate .safeplace .innovate-list .innovate-item .innovate-item-img {
        width: 100%;
        height: 262px;
        position: relative;
        border-radius: 10px;
    }
    .innovate-item-img::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.4); /* 黑色半透明背景 */
        border-radius: 10px;
    }
    .innovate .safeplace .innovate-list .innovate-item .innovate-info{
        position: relative;
        display: block;
        width: 407px;
        height: 147px;
        z-index: 99;
        background-color: #fff;
        margin: -55px auto 0;
        padding: 20px;
        cursor: pointer;
        border-radius: 10px;
        box-sizing: border-box;
    }
    .innovate .safeplace .innovate-list .innovate-item .innovate-info .title{
        font-size: 24px;
        line-height: 33px;
        font-weight: 500;
        color: #061828;
    }
    .innovate .safeplace .innovate-list .innovate-item .innovate-info .text{
        font-size: 16px;
        line-height: 24px;
        margin-top: 10px;
    }
    .innovate .safeplace .innovate-list .innovate-item .innovate-info .link{
        font-size: 16px;
        margin-top: 20px;
        line-height: 22px;
        color: #C7000B ;
        display: flex;
        align-items: center;
    }
    .innovate
    .safeplace
    .innovate-list
    .innovate-item
    .innovate-info
    .link
    .arrow {
    height: 5.5px;
    width: 11px;
    transform: rotate(-90deg);
    margin-left: 10px;
    background-image: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/down-arrow.png");
    background-size: 100% 100%;
  }
    .innovate .safeplace .innovate-list .innovate-item .mask {
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.3);
        position: absolute;
        top: 0;
        left: 0;
        opacity: 1;
        transition: opacity 0.3s
    }
    
    .innovate .safeplace .innovate-list .innovate-item .innovate-play-btn {
        width: 60px;
        height: 60px;
        object-fit: cover;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 4;
        cursor: pointer
    }
    
    .innovate .safeplace .innovate-list .innovate-item .innovate-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 10px;
    }
    
    .innovate .safeplace .innovate-btn-prev,
    .innovate .safeplace .innovate-btn-next {
        width: 44px;
        height: 44px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 5;
        cursor: pointer
    }
    
    .innovate .safeplace .innovate-btn-prev {
        left: -20px;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/guest-prev-btn.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }
    
    .innovate .safeplace .innovate-btn-next {
        right: -20px;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/guest-next-btn.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }
    .guest {
        width: 100%;
        height: 592px;
        padding: 60px 0;
        box-sizing: border-box;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/guest-back.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .guest .safeplace {
        flex-direction: column;
        align-items: center;
        position: relative
    }

    .guest .safeplace .guest-list {
        width: 100%;
        margin-top: 30px;
        position: relative
    }

    .guest .safeplace .guest-list .guest-item {
        width: 624px;
        height: 350px;
        position: relative;
        border-radius: 10px;
    }

    .guest .safeplace .guest-list .guest-item .mask {
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.3);
        position: absolute;
        top: 0;
        left: 0;
        opacity: 1;
        transition: opacity 0.3s;
        border-radius: 10px;
    }

    .guest .safeplace .guest-list .guest-item .guest-play-btn {
        width: 60px;
        height: 60px;
        object-fit: cover;
        display: none;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 4;
        cursor: pointer
    }

    .guest .safeplace .guest-list .guest-item .guest-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 10px;
    }

    .guest .safeplace .guest-list .guest-item.swiper-slide-active .guest-play-btn {
        display: block
    }

    .guest .safeplace .guest-list .guest-item.swiper-slide-active .mask {
        opacity: 0;
        transition: opacity 0.3s
    }

    .guest .safeplace .guest-btn-prev,
    .guest .safeplace .guest-btn-next {
        width: 44px;
        height: 44px;
        position: absolute;
        top: 270px;
        z-index: 5;
        cursor: pointer
    }

    .guest .safeplace .guest-btn-prev {
        left: -20px;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/guest-prev-btn.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .guest .safeplace .guest-btn-next {
        right: -20px;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/guest-next-btn.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .guest .safeplace .message-list {
        width: 100%;
        margin-top: 50px;
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .guest .safeplace .message-list .message-item {
        width: 100%;
        display: none;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

    .guest .safeplace .message-list .message-item.active {
        display: flex
    }

    .guest .safeplace .message-list .message-item .guest-name {
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .guest .safeplace .message-list .message-item .guest-name .line {
        width: 15px;
        height: 1px;
        background: #061828
    }

    .guest .safeplace .message-list .message-item .guest-name span {
        margin: 0 10px;
        color: #061828;
        font-size: 24px;
        font-weight: bold;
        line-height: 33px
    }

    .guest .safeplace .message-list .message-item .guest-job {
        margin-top: 10px;
        color: #061828;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px
    }

    .guest .safeplace .message-list .message-item .guest-word {
        margin-bottom: 30px;
        display: flex;
        flex-direction: row;
        align-items: flex-start
    }

    .guest .safeplace .message-list .message-item .guest-word img {
        width: 18px;
        height: 18px;
        object-fit: cover
    }

    .guest .safeplace .message-list .message-item .guest-word span {
        width: 820px;
        margin: 0 4px;
        display: inline-block;
        color: #42515d;
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        text-align: center
    }

    .case {
        width: 100%;
        padding: 60px 0;
        box-sizing: border-box;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/case-back.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .case .safeplace {
        flex-direction: column;
        align-items: center;
        position: relative
    }

    .case .safeplace .case-group-list {
        width: 100%;
        margin-top: 30px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 60px
    }

    .case .safeplace .case-group-list .case-group-item {
        width: 228px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        cursor: pointer
    }

    .case .safeplace .case-group-list .case-group-item.active::after {
        content: '';
        width: 48px;
        height: 3px;
        background: #c7000b;
        position: absolute;
        left: 50%;
        bottom: -6px;
        transform: translateX(-50%)
    }

    .case .safeplace .case-group-list .case-group-item.active span {
        color: #c7000b
    }

    .case .safeplace .case-group-list .case-group-item span {
        color: #40505f;
        font-size: 24px;
        font-weight: 400;
        line-height: 33px
    }

    .case .safeplace .type-list {
        width: 100%;
        margin-top: 35px;
        padding: 0;
        box-sizing: border-box;
        display: none;
        flex-direction: row;
        align-items: flex-start;
        justify-content: center
    }

    .case .safeplace .type-list.active {
        display: flex
    }

    .case .safeplace .type-list .type-item {
        width: 206px;
        height: 130px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        cursor: pointer
    }

    .case .safeplace .type-list .type-item img {
        width: 62px;
        height: 62px;
        object-fit: cover
    }

    .case .safeplace .type-list .type-item span {
        margin-top: 8px;
        color: #061828;
        font-size: 20px;
        font-weight: 400;
        line-height: 28px;
        white-space: nowrap
    }

    .case .safeplace .type-list .type-item.active span,
    .case .safeplace .type-list .type-item:hover span {
        color: #c7000b;
        font-weight: bold
    }

    .case .safeplace .case-group {
        width: 100%;
        margin-top: 40px;
        display: none;
        flex-direction: column;
        align-items: center
    }

    .case .safeplace .case-group.active {
        display: flex
    }

    .case .safeplace .case-group .case-list {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center
    }

    .case .safeplace .case-group .case-list .case-item {
        width: 195px;
        height: 640px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        border: 2px solid #fff;
        background: #f5f8fb;
        transition: width 0.5s;
        cursor: pointer;
        overflow: hidden;
        position: relative
    }

    .case .safeplace .case-group .case-list .case-item.active {
        width: 467px;
        transition: width 0.5s;
        border-bottom: 4px solid #c7000b
    }

    .case .safeplace .case-group .case-list .case-item.active .case-message .case-content {
        opacity: 1;
        transition: opacity 0.3s
    }

    .case .safeplace .case-group .case-list .case-item .box {
        height: 100%
    }

    .case .safeplace .case-group .case-list .case-item img {
        width: 100%;
        height: 440px;
        object-fit: cover
    }

    .case .safeplace .case-group .case-list .case-item .case-message {
        width: 100%;
        padding: 20px 25px;
        box-sizing: border-box;
        background: #f5f8fb
    }

    .case .safeplace .case-group .case-list .case-item .case-message .case-title {
        width: 100%;
        display: inline-block;
        color: #061828;
        font-size: 24px;
        font-weight: bold;
        line-height: 33px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .case .safeplace .case-group .case-list .case-item .case-message .case-content {
        margin-top: 8px;
        color: #42515d;
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        display: -webkit-box;
        /* -webkit-line-clamp: 2; */
        -webkit-box-orient: vertical;
        overflow: hidden;
        opacity: 0;
        transition: opacity 0.3s
    }

    .case .safeplace .case-group .more-btn {
        width: 140px;
        height: 50px;
        margin-top: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #c7000b;
        border-radius: 24px;
        cursor: pointer
    }

    .case .safeplace .case-group .more-btn span {
        color: #c7000b;
        font-size: 16px;
        font-weight: 400
    }

    .case .safeplace .case-group .more-btn .arrow {
        width: 13px;
        height: 8px;
        margin-left: 9px;
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/down-arrow.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        transition: transform 0.3s
    }

    .case .safeplace .case-group .more-btn.active .arrow {
        transform: rotate(180deg);
        transition: transform 0.3s
    }

    .case .safeplace .case-group .more-btn:hover {
        background: #c7000b
    }

    .case .safeplace .case-group .more-btn:hover span {
        color: #ffffff
    }

    .case .safeplace .case-group .more-btn:hover .arrow {
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/down-arrow-active.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .case .safeplace .case-group .group {
        width: 100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.5s
    }

    .case .safeplace .case-group .other-list {
        width: 100%;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px
    }
    .case .safeplace .case-group .other-list .yhgf{
        margin-left: 96px;
      }
    .case .safeplace .case-group .other-list .other-item {
        width: 345px;
        height: 121px;
        margin-top: 40px;
        padding: 20px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        background: #f5f8fb;
        transition: all 0.5s;
    }
    .case .safeplace .case-group .other-list .other-item:hover{
        height: 181px;
        transition: all 0.5s;
        background: #FFFFFF;
    }
    .case .safeplace .case-group .other-list .other-item .case-title {
        color: #42515d;
        font-size: 24px;
        font-weight: 500;
        line-height: 33px
    }
    .case .safeplace .case-group .other-list .other-item:hover .case-title{
        color: #C7000B;
      }
    .case .safeplace .case-group .other-list .other-item .case-content {
        margin-top: 8px;
        color: #42515d;
        font-size: 14px;
        font-weight: 400;
        line-height: 20px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden
    }
    .case .safeplace .case-group .other-list .other-item:hover .case-content {
        margin-top: 8px;
        color: #42515d;
        font-size: 14px;
        font-weight: 400;
        line-height: 20px;
        display: -webkit-box;
        -webkit-line-clamp: none;
        -webkit-box-orient: vertical;
        overflow: hidden;
      }
    .news {
        width: 100%;
        padding: 60px 0 130px;
        box-sizing: border-box
    }

    .news .safeplace {
        flex-direction: column;
        align-items: center
    }

    .news .safeplace .news-group-list {
        margin-top: 30px;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 140px
    }

    .news .safeplace .news-group-list .news-group-item {
        position: relative;
        cursor: pointer
    }

    .news .safeplace .news-group-list .news-group-item.active::after {
        content: '';
        width: 48px;
        height: 3px;
        background: #c7000b;
        position: absolute;
        left: 50%;
        bottom: -10px;
        transform: translateX(-50%)
    }

    .news .safeplace .news-group-list .news-group-item.active span {
        color: #c7000b;
        font-size: 24px;
        font-weight: 500;
        line-height: 33px
    }

    .news .safeplace .news-group-list .news-group-item span {
        color: #061828;
        font-size: 20px;
        font-weight: 400;
        line-height: 28px
    }

    .news .safeplace .news-swiper {
        width: 100%
    }

    .news .safeplace .row {
        width: 100%;
        margin-top: 46px;
        display: none;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row.active {
        display: flex
    }

    .news .safeplace .row .left {
        width: 710px;
        height: 550px;
        display: flex;
        flex-direction: column;
        align-items: center;
        background: rgba(0, 0, 0, 0.2)
    }

    .news .safeplace .row .left .news-img {
        width: 100%;
        height: 400px;
        object-fit: cover
    }

    .news .safeplace .row .left .news-message {
        width: 100%;
        padding: 30px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        background: rgba(255, 255, 255, 0.9)
    }

    .news .safeplace .row .left .news-message .title-row {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row .left .news-message .title-row .tag {
        padding: 4px 10px;
        box-sizing: border-box;
        border: 1px solid #42515d
    }

    .news .safeplace .row .left .news-message .title-row .tag span {
        color: #42515d;
        font-size: 14px;
        font-weight: 400;
        white-space: nowrap
    }

    .news .safeplace .row .left .news-message .title-row .news-title {
        width: 600px;
        margin-left: 8px;
        display: inline-block;
        color: #061828;
        font-size: 24px;
        font-weight: 500;
        line-height: 33px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .news .safeplace .row .left .news-message .link-row {
        width: 100%;
        margin-top: 30px;
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row .left .news-message .link-row .link {
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row .left .news-message .link-row .link:hover span {
        color: #c7000b
    }

    .news .safeplace .row .left .news-message .link-row .link:hover .arrow {
        
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .news .safeplace .row .left .news-message .link-row span {
        color: #061828;
        font-size: 20px;
        font-weight: 400;
        line-height: 28px
    }

    .news .safeplace .row .left .news-message .link-row .arrow {
        width: 13.35px;
        height: 12.5px;
        margin-left: 8px;
        
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .news .safeplace .row .left .news-message .link-row .date {
        margin-left: auto
    }

    .news .safeplace .row .left .news-message .link-row .local {
        margin-left: 20px
    }

    .news .safeplace .row .left .news-message .link-row .date,
    .news .safeplace .row .left .news-message .link-row .local {
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row .left .news-message .link-row .date img,
    .news .safeplace .row .left .news-message .link-row .local img {
        width: 18px;
        height: 18px;
        margin-right: 8px
    }

    .news .safeplace .row .left .news-message .link-row .date span,
    .news .safeplace .row .left .news-message .link-row .local span {
        color: #42515d;
        font-size: 14px;
        font-weight: 400;
        white-space: nowrap
    }

    .news .safeplace .row .left .news-message .link-row .share-btn {
        width: 24px;
        height: 24px;
        margin-left: auto;
        
        background-size: 100% 100%;
        background-repeat: no-repeat;
        cursor: pointer;
        position: absolute;
        top: 30px;
        right: 30px
    }

    .news .safeplace .row .left .news-message .link-row .share-btn:hover {
        background: url("https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cases/pioneers100-2025/images/share-btn-active.png");
        background-size: 100% 100%;
        background-repeat: no-repeat
    }

    .news .safeplace .row .right {
        width: 710px;
        margin-left: 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        background: rgba(0, 0, 0, 0.02)
    }

    .news .safeplace .row .right .news-group {
        width: 100%;
        height: 550px;
        display: flex;
        flex-direction: column;
        align-items: center;
        
        background-size: 100% 100%;
        background-repeat: no-repeat;
        position: relative
    }

    .news .safeplace .row .right .news-group:not(:first-child) {
        margin-top: 10px
    }

    .news .safeplace .row .right .news-group .group-title-row {
        width: 100%;
        padding: 15px 30px;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        align-items: center;
        position: sticky;
        top: 0
    }

    .news .safeplace .row .right .news-group .group-title-row .mark {
        width: 3px;
        height: 25px;
        background: #c7000b
    }

    .news .safeplace .row .right .news-group .group-title-row span {
        margin-left: 10px;
        color: #000000;
        font-size: 24px;
        font-weight: bold
    }

    .news .safeplace .row .right .news-group .title-list {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        overflow-y: auto
    }

    .news .safeplace .row .right .news-group .title-list::-webkit-scrollbar {
        width: 8px;
        background: none;
        border-radius: 4px
    }

    .news .safeplace .row .right .news-group .title-list::-webkit-scrollbar-track {
        background: none
    }

    .news .safeplace .row .right .news-group .title-list::-webkit-scrollbar-button {
        display: none
    }

    .news .safeplace .row .right .news-group .title-list::-webkit-scrollbar-thumb {
        width: 8px;
        background: #ffffff;
        border-radius: 4px
    }

    .news .safeplace .row .right .news-group .title-list .title-item {
        width: 100%;
        padding: 23px 30px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }

    .news .safeplace .row .right .news-group .title-list .title-item:not(:last-child) {
        border-bottom: 1px solid rgba(0, 0, 0, 0.05)
    }

    .news .safeplace .row .right .news-group .title-list .title-item .title {
        width: 570px;
        display: inline-block;
        color: #333333;
        font-size: 24px;
        font-weight: 400;
        line-height: 33px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .news .safeplace .row .right .news-group .title-list .title-item .from {
        width: 100%;
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row .right .news-group .title-list .title-item .from .date {
        width: 140px;
        min-width: 110px;
        margin-left: auto
    }

    .news .safeplace .row .right .news-group .title-list .title-item .from .local,
    .news .safeplace .row .right .news-group .title-list .title-item .from .date {
        display: flex;
        flex-direction: row;
        align-items: center
    }

    .news .safeplace .row .right .news-group .title-list .title-item .from .local img,
    .news .safeplace .row .right .news-group .title-list .title-item .from .date img {
        width: 18px;
        height: 18px
    }

    .news .safeplace .row .right .news-group .title-list .title-item .from .local span,
    .news .safeplace .row .right .news-group .title-list .title-item .from .date span {
        margin-left: 8px;
        color: #42515d;
        font-size: 14px;
        font-weight: 400;
        white-space: nowrap
    }

    .news .safeplace .row .right .news-group .title-list .title-item:hover {
        
        background-color: #e9eff3;
        background-size: 100% auto;
        background-repeat: no-repeat
    }

    .news .safeplace .row .right .news-group .title-list .title-item:hover .title {
        color: #061828;
        font-weight: 500
    }
}