/* ==================== 导航悬浮效果（柔和版） ==================== */

/* 1. 扇形区域：鼠标移入时轻微变亮 + 手型光标 */
.NavBox li {
    transition: filter 0.3s ease;
}
.NavBox li:hover {
    filter: brightness(1.08);
    cursor: pointer;
}

/* 2. 图标：悬浮时轻微放大 */
.NavItem img {
    transition: transform 0.3s ease;
}
.NavBox li:hover .NavItem img {
    transform: scale(1.12);
}

/* 3. 文字：悬浮时轻微放大 */
.NavItem p {
    transition: transform 0.3s ease;
}
.NavBox li:hover .NavItem p {
    transform: scale(1.05);
}
    .SectionIndex {
        position: absolute;
        z-index: 9999;
        padding: 30px 100px;
        width: 100%;
        height: 100vh;
        transition: 0.25s;
        top: 0;
        opacity: 1;
        cursor: pointer;
    }

    .SectionIndex.on {
        opacity: 0;
        top: -100vh;
    }

    .Index {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;
    }

    .IndexLogo {
        position: absolute;
        z-index: 999;
        width: 25%;
        border-radius: 50%;
        border: 10px solid #52afe8;
    }

    .IndexNav {
        width: 40vw;
        height: 40vw;
        position: relative;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: center;
        background: url(/assets/images/image1.png);
        background-size: 100% 100%;
    }

    .NavBox {
        width: 80%;
        height: 80%;
        border-radius: 50%;
        overflow: hidden;
        position: relative;
    }

    .NavBox li {
        position: absolute;
        width: 50%;
        height: 50%;
        transform-origin: 100% 100%;
        left: 0;
        top: 0;
        background: linear-gradient(0deg, #8ac2ea00 0%, #2E95DB 100%);
    }

    .NavItem {
        position: absolute;
        right: calc(35% - 70px);
        bottom: calc(30% - 70px);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        grid-gap: 10px;
        width: 140px;
        height: 140px;
        /* border-radius: 50%;
        background: #ffffff80; */
    }

    .NavItem img {
        width: 65px;
        height: 65px;
        object-fit: contain;
    }

    .NavItem p {
        color: #FFF;
        text-align: center;
        font-size: 19.5px;
        font-weight: bold;
    }

    .IndexText {
        width: calc(100% - 45vw);
    }

    .IndexText img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    @media (max-width: 1600px) {
        .NavItem img {
            width: 45px;
            height: 45px;
        }

        .NavItem p {
            font-size: 20px;
        }
    }

    @media (max-width: 1440px) {
        .NavItem {
            right: calc(35% - 50px);
            bottom: calc(30% - 50px);
            width: 100px;
            height: 100px;
        }

        .NavItem p {
            font-size: 18px;
        }
    }

    @media (max-width: 1200px) {
        .SectionIndex {
            padding: 30px 3vw;
        }

        .IndexNav {
            width: 450px;
            height: 450px;
        }

        .IndexText {
            width: calc(100% - 500px);
        }
    }

    @media (max-width: 767px) {
        html,
        body {
            height: 100%;
            overflow: hidden;
            overscroll-behavior: none;
        }

        body {
            min-height: 100vh;
            min-height: 100dvh;
        }

        .SectionIndex {
            --index-nav-size: min(82vw, calc(100vh - 180px));
            --index-nav-size: min(82vw, calc(100dvh - 180px));
            --nav-item-size: calc(var(--index-nav-size) * 0.18);
            --nav-item-half-size: calc(var(--nav-item-size) * 0.5);
            --nav-icon-size: calc(var(--index-nav-size) * 0.07);
            padding: 16px 0;
            padding-top: max(16px, env(safe-area-inset-top));
            padding-bottom: max(16px, env(safe-area-inset-bottom));
            height: 100vh;
            height: 100dvh;
        }

        .SectionIndex.on {
            top: -100vh;
            top: -100dvh;
        }

        .Index {
            flex-direction: column-reverse;
            justify-content: center;
            grid-gap: 16px;
        }

        .IndexNav {
            width: var(--index-nav-size);
            height: var(--index-nav-size);
            flex-shrink: 0;
        }

        .IndexLogo {
            border-width: clamp(4px, calc(var(--index-nav-size) * 0.02), 10px);
        }

        .IndexText {
            width: 80%;
            max-width: 520px;
            max-height: calc(100vh - var(--index-nav-size) - 64px);
            max-height: calc(100dvh - var(--index-nav-size) - 64px);
            flex-shrink: 1;
        }

        .IndexText img {
            display: block;
            max-width: 100%;
            max-height: 100%;
            margin: 0 auto;
        }

        .NavItem {
            right: calc(35% - var(--nav-item-half-size));
            bottom: calc(30% - var(--nav-item-half-size));
            width: var(--nav-item-size);
            height: var(--nav-item-size);
            grid-gap: clamp(4px, calc(var(--index-nav-size) * 0.012), 10px);
        }

        .NavItem img {
            width: var(--nav-icon-size);
            height: var(--nav-icon-size);
        }

        .NavItem p {
           font-size: clamp(10px, calc(var(--index-nav-size) * 0.1), 10px);
        }

        section,
        .Swiper1 {
            height: 100vh;
            height: 100dvh;
        }
    }


    /* section */
    section {
        position: relative;
        width: 100%;
        height: 100vh;
        overflow: hidden;
    }

    /* Box1 */
    .Swiper1 {
        width: 100%;
        height: 100vh;
        position: relative;
        z-index: 2;
    }

    .Slide1 {
        width: 100%;
        height: auto;
    }

    .Slide1 .bj {
        width: 100%;
        height: 100%;
        position: relative;
        object-fit: cover;
        z-index: 1;
    }


    .Slide1 .text {
        position: absolute;
        z-index: 5;
        left: 0;
        top: 240px;
        width: 100%;
        display: flex;
        align-items: center;
        padding: 0 var(--container);
        color: #FFF;
        font-size: 40px;
        font-weight: 700;
    }



    /* 新闻 */
    .NewsBox {
        position: absolute;
        z-index: 3;
        left: 0;
        bottom: -300px;
        width: 100%;
        padding: 30px var(--container);
        background: linear-gradient(0deg, #0760b280 0%, #0760b280 100%);
        display: flex;
        justify-content: space-between;
        transition: 0.5s;
    }

    .NewsBox.on {
        bottom: 0;
    }

    .NewsLt {
        width: 520px;
    }

    .NewsLt a {
        display: flex;
        flex-direction: column;
        grid-gap: 15px;
    }

    .NewsLt a h1 {
        color: #FFF;
        text-align: justify;
        font-size: 14px;
        font-weight: 700;
    }

    .NewsLt a h2 {
        color: #FFF;
        font-size: 14px;
        line-height: 1.5;
    }

    .NewsRt {
        width: 700px;
        padding-right: 100px;
    }

    .NewsCategories {
        display: flex;
        grid-gap: 75px;
        padding-bottom: 15px;
        border-bottom: 1px solid #ffffff4d;
        margin-bottom: 10px;
    }

    .NewsCategories h1 {
        color: #FFF;
        font-size: 14px;
        opacity: 0.75;
        cursor: pointer;
    }

    .NewsCategories h1.on {
        opacity: 1;
    }

    .NewsItem {
        display: none;
        flex-direction: column;
        grid-gap: 5px;
    }

    .NewsItem.on {
        display: flex;
    }

    .NewsItem a {
        display: flex;
        grid-gap: 40px;
    }

    .NewsItem h1,
    .NewsItem h2 {
        color: #FFF;
        font-family: "Alibaba PuHuiTi 3.0";
        font-size: 14px;
    }

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

    .anNiu {
        position: absolute;
        z-index: 9;
        cursor: pointer;
        right: var(--container);
        bottom: 45px;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: 0.5s;
    }

    .anNiu.on {
        background: var(--color);
        transform: rotate(180deg);
    }

    .anNiu img {
        width: 18px;
    }

    /* 备案 */
    .Copyright {
        position: absolute;
        z-index: 9999;
        left: 0;
        bottom: -300px;
        padding: 20px var(--container);
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        grid-gap: 5px 45px;
        transition: 0.5s;
    }

    .Copyright.on {
        bottom: 0;
    }

    .SectionIndex:not(.on)~.section1 .Copyright {
        position: fixed;
        left: 0;
        bottom: -300px;
    }

    .SectionIndex:not(.on)~.section1 .Copyright.on {
        bottom: 0;
    }

    .Copyright a {
        color: #FFF;
        font-size: 14px;
        line-height: 1.5;
    }

    @media (max-width: 1440px) {
        .Slide1 .text {
            top: 180px;
        }

        .NewsLt {
            width: 45%;
        }

        .NewsRt {
            width: 45%;
        }
    }

    @media (max-width: 1200px) {
        .Slide1 .text {
            top: 120px;
            font-size: 38px;
        }
    }

    @media (max-width: 900px) {
        .Slide1 .text {
            top: 120px;
            font-size: 28px;
        }

        .NewsRt {
            padding-right: 75px;
        }

        .NewsItem a {
            display: flex;
            grid-gap: 15px;
        }
    }

    @media (max-width: 600px) {
        .Slide1 .text {
            font-size: 24px;
            top: auto;
            padding-top: 110px;
            padding-bottom: 270px;
            height: 100%;
            display: flex;
            align-items: center;
        }

        .NewsBox {
            flex-wrap: wrap;
            grid-gap: 15px;
        }

        .NewsLt {
            width: 100%;
        }

        .NewsLt a h1 {
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }

        .NewsRt {
            width: 100%;
        }
    }

    @media (max-width: 600px) {
        .Copyright {
            padding: 10px var(--container);
        }
    }