.flex {
    display: flex;
}

.flex-jcsb {
    display: flex;
    justify-content: space-between;
}

.flex-between-center {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.flex-aic {
    display: flex;
    align-items: center;
}

.flex-jcc {
    display: flex;
    justify-content: center;
}

.flex-dir-col {
    display: flex;
    flex-direction: column;
}

.img-lay {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block;
}

.img-lay-contain {
    object-fit: contain;
    width: 100%;
    height: 100%;
    display: block;
}

.icon-lay {
    --w: calc(50 * var(--fpx-67));
    --ratio: 2;
    --bg-color: #F6F6F6;
    width: var(--w);
    height: var(--w);
    border-radius: 50%;
    background-color: var(--bg-color);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    transition: 0.3s;
}

.icon-lay img {
    width: calc(var(--w) / var(--ratio));
}

.bg-lay {
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.filter {
    position: relative;
    cursor: pointer;
    user-select: none;
}

.filter-curr {
    /* width: max(120px, 160 * var(--rpx-50)); */
    height: max(40px, 60 * var(--rpx-50));
    border-radius: 300px;
    overflow: hidden;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .1);
}

.filter .btn {
    height: 100%;
    color: #2C2C2C;
    font-size: calc(14 * var(--fpx-67));
    line-height: 1;
    background-color: #fff;
    transition: .3s;
    gap: 10px;
}

.filter-choose {
    border-radius: 10px;
    width: 100%;
    position: absolute;
    top: 100%;
    right: 0;
    transform: translateY(10px);
    z-index: 999;
    /* background-color: var(--theme-green); */
    transition: .3s;
    overflow: hidden;
    box-shadow: 0px 0px 10px 0px rgba(71, 52, 26, 0.1);
    opacity: 0;
    visibility: hidden;
}

.filter-choose .btn {
    display: block;
    padding: 15px;
    border-radius: 0;
    text-align: center;
    border: 0;
}

.filter-choose .btn+.btn {
    border-top: 1px solid #E5E5E5;
}

.filter-choose .btn:hover {
    background-color: var(--theme-green);
    color: #fff;
}

.filter.active .filter-choose {
    opacity: 1;
    transform: translateY(5px);
    visibility: visible;
}

.filter-curr .btn {
    padding-left: calc(30 * var(--rpx-67));
    padding-right: 15px;
}

.filter-curr .btn .icon {
    --w: 30px;
}

.filter-curr .btn .icon img {
    filter: url(#dark-overlay);
}

.card-wrap {
    display: flex;
    /* justify-content: space-between; */
    flex-wrap: wrap;
    --col: 3;
    --gap: calc(30 * var(--rpx-50));
    gap: var(--gap);
}

.card-wrap>.item {
    /* min-width: calc((100% - (var(--col) - 1) * var(--gap)) / var(--col)); */
    /* flex: 1; */
    width: calc((100% - (var(--col) - 1) * var(--gap)) / var(--col));
}

.poa-full {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.level-roof {
    position: relative;
    z-index: 10;
}

.news-top-cont {
    transition: .3s;
}

.news-top .pic {
    width: 50%;
    aspect-ratio: 8 / 5;
    overflow: hidden;
    border-radius: calc(30 * var(--rpx-50));
}

.news-top .txt {
    width: 50%;
    padding: calc(40 * var(--rpx-50));
    padding-right: max(20px, 6%);
    border-radius: calc(30 * var(--rpx-50));
    box-shadow: var(--box-shadow);
}

.news-top .txt .title {
    font-size: max(22px, 36 * var(--fpx-50));
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-weight: bold;
    line-height: 1.2;
    margin-top: calc(30 * var(--rpx-50));
}

.news-top .txt .intro {
    font-size: max(14px, 18 * var(--fpx-50));
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: #666666;
    text-align: justify;
    margin-top: calc(20 * var(--rpx-50));
}

.news-wrap .card-wrap {
    --gap: calc(60 * var(--rpx-50));
}

.news-wrap .item {
    box-shadow: var(--box-shadow);
    overflow: hidden;
    cursor: pointer;
    border-radius: calc(30 * var(--rpx-50));
}

.news-wrap .item:hover .learn-more,
.news-top:hover .learn-more {
    color: var(--theme-green);
}

.news-wrap .item:hover .learn-more .icon,
.news-top:hover .learn-more .icon {
    border-color: var(--theme-green);
}

.news-wrap .item:hover .learn-more .icon img,
.news-top:hover .learn-more .icon img {
    filter: url(#green-overlay);
}

.news-wrap .item:hover .pic img,
.news-top:hover .pic img {
    transform: scale(1.1);
}

.news-wrap .item:hover .txt .title,
.news-wrap .item:hover .txt .intro,
.news-top:hover .txt .title,
.news-top:hover .txt .intro {
    color: var(--theme-green);
}

.news-wrap .wfEditorMode {
    margin-top: 0 !important;
}

.news-wrap .pic {
    overflow: hidden;
    aspect-ratio: 506 / 315;
    background-color: var(--theme-green);
    border-radius: calc(30 * var(--rpx-50));
    position: relative;
}

.news-wrap .pic img,
.news-wrap .item .txt .title,
.news-wrap .item .txt .intro,
.news-top .pic img,
.news-top .txt .title,
.news-top .txt .intro {
    transition: .3s;
}

.news-wrap .txt {
    padding: calc(30 * var(--rpx-50));
    min-height: 200px;
    position: relative;
    transition: .3s;
    gap: calc(10 * var(--rpx-50));
}

.news-wrap .txt .title {
    font-size: max(16px, 24 * var(--fpx-50));
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    word-break: break-word;
    margin-top: calc(15 * var(--rpx-50));
    line-height: 1.3;
    font-weight: bold;
}

.news-wrap .txt .intro {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    word-break: break-word;
    color: #3B3B3B;
    margin-top: 10px;
    font-weight: 300;
    font-size: max(12px, 16 * var(--fpx-50));
}

.news-wrap .txt .learn-more {
    margin-top: calc(30 * var(--rpx-50));
}

.news-wrap .txt .icon {
    --w: 40px;
}

.news-sec1 .sec-top {
    margin: calc(20 * var(--rpx-50)) 0 calc(50 * var(--rpx-50));
    gap: 20px;
}

.news-sec1 .sec-top .sec-title {
    line-height: 1;
}

.label-wrap {
    gap: 6px;
}

.label-lay {
    min-width: 110px;
    padding: calc(10 * var(--rpx-50)) calc(20 * var(--rpx-50));
    background-color: #F6F6F6;
    color: #00A142;
    font-size: 14px;
    border-radius: 300px;
    text-align: center;
}

.learn-more {
    gap: 10px;
    font-size: max(12px, 16 * var(--fpx-50));
}

.learn-more .icon {
    border: 1px solid rgba(0, 0, 0, .2);
    --bg-color: #fff;
    --ratio: 4;
}

.learn-more .icon img {
    filter: url(#black-overlay);
}

.yiiPager {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: calc(40 * var(--rpx-50));
}

.yiiPager li.first,
.yiiPager li.last {
    display: none;
}

.yiiPager li {
    width: clamp(30px, 50 * var(--rpx-50), 50px);
    height: clamp(30px, 50 * var(--rpx-50), 50px);
    border-radius: 50%;
    margin: 0 5px;
    border: 1px solid #E8E8E8;
    flex-shrink: 0;
}

.yiiPager li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: #000;
}

.yiiPager li.selected {
    background-image: var(--theme-gradient-green);
}

.yiiPager li.previous,
.yiiPager li.next {
    width: auto;
    height: auto;
    aspect-ratio: unset;
    padding: calc(10 * var(--rpx-50)) calc(20 * var(--rpx-50));
    border-radius: 300px;
    background-color: #F6F6F6;
    border: unset;
}

.yiiPager li.selected a {
    color: #fff;
}

.yiiPager li:hover {
    box-shadow: var(--box-shadow);
}

.sec-wrap-thin {
    padding: calc(150 * var(--rpx-50)) 0;
}

.sec-wrap-min {
    padding: calc(70 * var(--rpx-50)) 0;
}

.sec-wrap-floor {
    padding-top: 0;
}

.sec-wrap-roof {
    padding-bottom: 0;
}

.news-detail-sec1 {
    padding: 40px 0;
    margin-top: var(--header-height);
    background-color: #F9FDFB;
}


.news-detail-sec1 .info-wrap {
    padding: 0 10%;
}

.news-detail-sec1 .info-wrap .label-lay {
    background-image: var(--theme-gradient-green);
    color: #fff;
}

.news-detail-sec1 .info-wrap .title {
    font-size: calc(64 * var(--fpx-50));
    margin-top: calc(30 * var(--rpx-50));
    line-height: 1.2;
}

.news-detail-sec1 .info-wrap .time {
    gap: 10px;
    color: #252525;
    margin-top: calc(50 * var(--rpx-50));
}

.news-detail-sec1 .handle-wrap {
    border-top: 1px solid rgba(0, 0, 0, .15);
    font-size: var(--font-18);

}

.news-detail-sec1 .handle-wrap .item {
    width: 50%;
    gap: 10px;
    line-height: 2;
    padding: calc(40 * var(--rpx-50)) 0;
}

.news-detail-sec1 .handle-wrap .item:first-child {
    padding-right: calc(80 * var(--rpx-50));
}

.news-detail-sec1 .handle-wrap .item:last-child {
    flex-direction: row-reverse;
    text-align: right;
    border-left: 1px solid rgba(0, 0, 0, .15);
    padding-left: calc(80 * var(--rpx-50));
}

.news-detail-sec1 .handle-wrap .item:hover .intro {
    color: var(--theme-green);
}

.news-detail-sec1 .handle-wrap .item .intro p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    word-break: break-word;
}

.news-detail-sec1 .article-content {
    margin-top: calc(40 * var(--rpx-50));
    padding-top: calc(80 * var(--rpx-50));
    border-top: 1px solid rgba(0, 0, 0, .15);
}

.news-detail-sec1 .article-content .article-wrap {
    padding: 0 10%;
    font-size: max(14px, 18 * var(--fpx-50));
    font-weight: 300;
}

.news-detail-sec1 .article-content .article {
    font-size: max(15px, 20 * var(--fpx-50));
    padding-bottom: calc(120 * var(--rpx-50));
}

.news-detail-sec1 .article-content .article *+* {
    margin: calc(40 * var(--rpx-50)) auto 0;
}

.news-detail-sec1 .article-content .article img {
    display: block;
    border-radius: calc(30 * var(--rpx-50));
    max-width: 100%;
}

.news-detail-sec1 .article-content .view-more {
    gap: 15px;
}

.news-detail-sec1 .article-content .view-more .icon {
    background-image: var(--theme-gradient-green);
    --w: 35px;
    --ratio: 3;
}

.page-label-wrap {
    margin-top: calc(30 * var(--rpx-50));
}

.page-label-wrap .label-lay.active,
.page-label-wrap .label-lay:hover {
    background-image: var(--theme-gradient-green);
    color: #fff;
    cursor: pointer;
    border: 1px solid transparent;
}

.page-label-wrap .label-lay:not(.active, :hover) {
    background-color: unset;
    border: 1px solid rgba(0, 0, 0, .1);
    color: #333333;
}

.video-sec1 .item .txt {
    min-height: 85px;
}

.video-sec1 .item .txt .title {
    margin-top: 0;
    transition: .3s;
}

.video-sec1 .item .pic {
    position: relative;
}

.video-sec1 .item .pic .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    --w: calc(60 * var(--rpx-75));
    --bg-color: rgba(0, 0, 0, .6);
    transition: .3s;
}

.video-sec1 .item:hover .title {
    color: var(--theme-green);
}

.video-sec1 .item:hover .icon {
    transform: translate(-50%, -50%) scale(1.1);
    --bg-color: var(--theme-green);
}

.read-more {
    width: max-content;
    border-radius: 300px;
    padding: 12px 35px;
    background-image: var(--theme-gradient-green);
    gap: 10px;
    font-size: max(12px, 16 * var(--fpx-50));
    color: #fff;
    cursor: pointer;
    transition: .3s;
    position: relative;
    font-weight: normal;
}

.read-more.lay1>* {
    position: relative;
    z-index: 1;
    color: var(--theme-green);
}

.read-more.lay1 img {
    filter: url(#green-overlay);
}

.read-more.lay1:hover>* {
    color: #fff;
}

.read-more.lay1:hover img {
    filter: url(#white-overlay);
}

.read-more.lay1::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    border-radius: 300px;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    transition: .3s;
}

.read-more.lay1:hover::after {
    transform: translate(-50%, -50%) scale(0);
}

.read-more:hover,
.read-more:focus {
    filter: brightness(1.05);
    transform: scale(1.05);
}

.margin-t-60 {
    margin-top: calc(60 * var(--rpx-50));
}

.margin-t-40 {
    margin-top: calc(40 * var(--rpx-50));
}

.margin-t-20 {
    margin-top: calc(20 * var(--rpx-50));
}

.join-us-banner {
    background-position: top right;
    height: calc(100vh - var(--header-height));
}

.join-us-banner .wrapper {
    height: 100%;
}

.join-us-banner .title {
    font-size: calc(72 * var(--fpx-50));
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
}

.join-us-banner .video {}

.talent-sec1 .sec-area,
.page-top-wrap {
    width: 100%;
    gap: calc(50 * var(--rpx-50));
}

.talent-sec1 .line {
    height: calc(200 * var(--rpx-50));
    width: 1px;
}

.talent-sec1 .line-cont {
    background-color: var(--theme-green);
    height: 100%;
}

.bg-color-gray {
    background-color: #F6F6F6;
}

/* .talent-sec2 .item {
    border-radius: calc(30 * var(--rpx-50));
    background-color: #fff;
    padding: calc(30 * var(--rpx-50));
}

.talent-sec2 .item .icon {
    --w: 65px;
    background-image: var(--theme-gradient-green);
}

.talent-sec2 .item .title {
    font-size: calc(24 * var(--fpx-67));
    font-weight: bold;
    margin-top: calc(20 * var(--rpx-50));
}

.talent-sec2 .item .intro {
    font-size: max(14px, 18 * var(--fpx-50));
    margin-top: 5px;
} */

.talent-sec3 .swiper-slide {
    height: auto;
    border-radius: calc(30 * var(--rpx-50));
    position: relative;
    aspect-ratio: 105 / 59;
    width: calc((100% - 60 * var(--rpx-50)) / 2);
    justify-content: flex-end;
    padding: calc(40 * var(--rpx-50));
    color: #fff;
    overflow: hidden;
    margin-right: calc(60 * var(--rpx-50));
}

.talent-sec3 .swiper-slide::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30%;
    background-image: linear-gradient(to top, #000, transparent);
    opacity: .8;
}

.talent-sec3 .swiper-slide .info {
    position: relative;
    z-index: 1;
}

.talent-sec3 .swiper-slide .title {
    font-size: max(18px, 28 * var(--fpx-50));
    font-weight: bold;
}

.talent-sec3 .swiper-slide .intro {
    font-size: max(14px, 18 * var(--fpx-50));
}

.talent-sec3 .swiper-slide .logo {
    position: absolute;
    top: calc(30 * var(--rpx-50));
    left: calc(30 * var(--rpx-50));
    z-index: 1;
}

.talent-sec3 .swiper-slide .logo img {
    width: calc(150 * var(--rpx-67));
}

.swiper-pagination-progressbar {
    width: calc(320 * var(--rpx-50)) !important;
    background-color: #CCC;
    position: initial;
    top: unset;
    left: unset;
    height: 2px !important;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background-color: var(--theme-green);
}

.swiper-handle {
    gap: 20px;
}

.swiper-handle .icon {
    --bg-color: transparent;
    border: 1px solid #ccc;
    --ratio: 3;
    cursor: pointer;
    user-select: none;
}

.swiper-handle .icon:hover {
    --bg-color: var(--theme-green);
    border-color: var(--theme-green);
    color: #fff;
}

.swiper-handle .icon img {
    filter: url(#black-overlay);
}

.swiper-handle .icon:hover img {
    filter: unset;
}

.wrapper-left {
    --w: calc((100% - var(--wrapper-width)) / 2 + var(--wrapper-width));
    width: var(--w);
    margin-left: calc(100% - var(--w));
}

.filter-cont {
    gap: 10px;
}

.inp-cont {
    border-radius: 300px;
    background-color: #fff;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .1);
    position: relative;
    width: calc(350 * var(--rpx-50));
    overflow: hidden;
}

.inp-cont input {
    width: 100%;
    height: 100%;
    outline: unset;
    border: unset;
    padding-left: 20px;
    font-size: calc(14 * var(--fpx-67));
}

.inp-cont .search-btn {
    width: 50px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}

.social-sec1 .item {
    background-color: #fff;
    border-radius: calc(30 * var(--rpx-50));
    cursor: pointer;
    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .1);
}

.social-sec1 .item+.item {
    margin-top: calc(30 * var(--rpx-50));
}

.social-sec1 .item-top {
    border-radius: calc(30 * var(--rpx-50));
    padding: calc(36 * var(--rpx-50)) calc(60 * var(--rpx-50));
    position: relative;
    gap: max(10px, 10%);
}

.social-sec1 .item-top .title {
    font-size: calc(24 * var(--fpx-50));
    font-weight: bold;
    width: 40%;
}

.social-sec1 .item-top .info {
    font-size: max(12px, 16 * var(--fpx-50));
    width: 60%;
}

.social-sec1 .item-top .info .part {
    width: 50%;
}

.social-sec1 .item-top .icon {
    position: absolute;
    top: 50%;
    right: calc(60 * var(--rpx-50));
    transform: translateY(-50%);
    --bg-color: transparent;
    transition: .3s;
    background-image: var(--theme-gradient-green);
}

.social-sec1 .item-top .icon::after,
.social-sec1 .item-top .icon::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    transition: .3s;
}

.social-sec1 .item-top .icon::after {
    width: 1px;
    height: 12px;
}

.social-sec1 .item-top .icon::before {
    width: 12px;
    height: 1px;
}

.social-sec1 .item-expand {
    padding: calc(40 * var(--rpx-50)) max(20px, 60 * var(--rpx-50)) calc(20 * var(--rpx-50));
    display: none;
}

.social-sec1 .item.active .item-top {
    background-image: linear-gradient(to right, var(--theme-green), #7BBE42);
    color: #fff;
}

.social-sec1 .item.active .item-top .icon {
    --bg-color: rgba(255, 255, 255, .1);
    background-image: unset;
    transform: translateY(-50%) rotate(180deg);
}

.social-sec1 .item.active .item-top .icon::after {
    opacity: 0;
}

.social-sec1 .item.active .item-top .icon::before {
    background-color: #fff;
}

.social-sec1 .job-intro {
    padding-bottom: calc(40 * var(--rpx-50));
    margin-bottom: calc(20 * var(--rpx-50));
    font-size: max(14px, 18 * var(--fpx-50));
    color: #666;
    font-weight: 300;
}

.social-sec1 .job-cont+.job-cont {
    margin-top: calc(40 * var(--rpx-50));
}

.social-sec1 .job-intro .title {
    color: #000;
    font-weight: bold;
    position: relative;
    padding-left: 7px;
    line-height: 1;
    margin-bottom: 10px;
}

.social-sec1 .job-intro .title::after {
    content: '';
    width: 3px;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background-image: linear-gradient(to bottom, #04B140, #6AC24A);
    border-radius: calc(30 * var(--rpx-50));
}

.social-sec1 .job-intro li {
    position: relative;
    padding-left: 23px;
}

.social-sec1 .job-intro li::after {
    content: '';
    position: absolute;
    top: .8em;
    left: 0;
    width: 13px;
    height: 1px;
    background-color: var(--theme-green);
    transform: translateY(-50%);
}

.social-sec1 .learn-cont {
    border-top: 1px solid rgba(0, 0, 0, .1);
}

.social-sec1 .learn-more {
    margin-left: auto;
    margin-right: auto;
    width: max-content;
    padding-top: calc(20 * var(--rpx-50));
}

.social-sec1 .learn-more .icon {
    background-image: var(--theme-gradient-green);
    border: unset;
    --w: 40px;
}

.social-sec1 .learn-more .icon img {
    filter: url(#white-overlay);
}

.social-sec1 .item-expand .job-cont a {
    color: var(--theme-green);
    text-decoration: underline;
}

.social-sec1 .sec-area>.learn-more img {
    margin-left: 0;
}

.campus-sec1 .card-wrap {
    --col: 2;
    --gap: calc(120 * var(--rpx-50));
}

.campus-sec1 .pic {
    aspect-ratio: 770 / 418;
}

.campus-sec1 .txt {
    min-height: 215px;
}

.campus-sec1 .txt .read-more {
    margin-top: calc(30 * var(--rpx-50));
    border: 1px solid transparent;
}

.campus-sec1 .item:not(:hover) .txt .read-more {
    color: var(--theme-green);
    border-color: var(--theme-green);
    background-image: unset;
}

.campus-sec1 .item:not(:hover) .txt .read-more img {
    filter: url(#green-overlay);
}

.campus-sec1 .item:hover {
    background-color: #F6F6F6;
}

.campus-sec1 .item:hover .title {
    color: var(--theme-green);
}

.campus-sec2 .video-cont {
    width: 80%;
    margin: 0 auto;
    border-radius: calc(30 * var(--rpx-50));
    overflow: hidden;
    position: relative;
    aspect-ratio: 16 / 9;
}

.campus-sec2 .video-cont .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    --w: calc(80 * var(--rpx-50));
    --bg-color: rgba(0, 0, 0, .6);
    cursor: pointer;
    transition: .3s;
    transform-origin: center;
}

.campus-sec2 .video-cont:hover .icon {
    --bg-color: var(--theme-green);
    transform: translate(-50%, -50%) scale(1.1);
}

.campus-sec3 .sec-area {
    width: 80%;
    margin: 0 auto;
    border-radius: calc(30 * var(--rpx-50));
    padding: calc(80 * var(--rpx-50));
    position: relative;
}

.campus-sec3 .qr {
    text-align: center;
}

.campus-sec3 .qr span {
    margin-top: calc(20 * var(--rpx-50));
    font-weight: 300;
    font-size: calc(24 * var(--fpx-67));
}

.campus-sec3 .logo {
    opacity: .06;
    position: absolute;
    bottom: calc(80 * var(--rpx-50));
    right: calc(80 * var(--rpx-50));
}

.ser-sec1 .txt {
    padding: calc(40 * var(--rpx-50));
    border-radius: calc(30 * var(--rpx-50));
    height: 100%;
}

.ser-sec1 .txt .title {
    font-size: calc(24 * var(--fpx-67));
    font-weight: bold;
    line-height: 1.25;
}

.ser-sec1 .txt .time {
    font-weight: 300;
    font-size: max(14px, 18 * var(--fpx-50));
    color: #666;
    gap: 10px;
    margin-top: calc(50 * var(--rpx-50));
}

.page-nav .page-cont {
    gap: calc(40 * var(--rpx-50));
    height: calc(70 * var(--rpx-67));
}

.page-nav a {
    font-size: max(14px, 18 * var(--fpx-50));
    height: 100%;
    color: #333;
    border-bottom: 2px solid transparent;
}

.page-nav a:hover,
.page-nav a.active {
    color: var(--theme-green);
    border-color: var(--theme-green);
    font-weight: bold;
}

.breadcrumb {
    justify-content: flex-end;
    gap: 5px;
    font-size: max(12px, 14 * var(--fpx-50));
    color: #111;
    margin-top: calc(30 * var(--rpx-50));
    padding-right: calc((100% - var(--wrapper-width)) / 2);
}

.breadcrumb .current {
    color: var(--theme-green);
}

.f-sec-wrap {
    padding-top: calc(20 * var(--rpx-50));
}

.btn-video-play {
    display: none;
    width: 90px;
    height: 90px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .5);
    z-index: 290;
}

.btn-video-play::after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 4px;
    bottom: 0;
    right: 0;
    margin: auto;
    border-left: 22px solid white;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
}

.video-layer {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, .75);
    top: 0;
    left: 0;
    cursor: pointer;
    z-index: 900;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
    transition: .5s;
    opacity: 0;
}

.video-layer.active {
    visibility: visible;
    opacity: 1;
}

.btn-close {
    position: absolute;
    left: calc(50vw + 410px);
    top: calc(50vh - 240px);
    border-radius: 50%;
    width: 32px;
    line-height: 32px;
    height: 32px;
    font-size: 20px;
    color: white;
    background-color: #fff;
    cursor: pointer;
    text-align: center;
    transition: .3s;
}

.btn-close img {
    filter: url(#black-overlay)
}

@media(max-width: 960px) {
    .btn-close {
        position: absolute;
        left: auto;
        right: 20px;
        top: calc(50vh - 240px - 42px);
    }
}

.btn-close:hover {
    transform: scale(1.1);
}


.video-js .vjs-big-play-button {
    bottom: 0;
    right: 0;
    margin: auto;
}

.video-layer .btn-close::before,
.video-layer .btn-close::after {
    display: none;
}

.video-js .vjs-big-play-button:focus,
.video-js:hover .vjs-big-play-button {
    border-color: #cba36e;
    color: #cba36e;
}

.video-js .vjs-play-progress:before {
    top: -.502em;
}

.video-js .progress_active .vjs-play-progress:before {
    top: -.333333333333333em;
}

.vjs-modal-dialog-content {
    display: none;
}

body:not(.wfEditorMode) object {
    display: none;
}

.campus-sec1 .news-wrap {
    padding: 0 10%;
}

.campus-sec1 .news-wrap .item {
    overflow: initial;
}

.campus-sec1 .item-cont {
    transition: .3s;
    overflow: hidden;
    box-shadow: var(--box-shadow);
    border-radius: calc(30 * var(--rpx-50));
    background-color: #F6F6F6;
}

.campus-sec1 .item-cont:hover {
    transform: scale(1.05);
}

.text-center {
    text-align: center;
}

.page-sec-top {
    width: 85%;
    margin: 0 auto;
}

.jinko-request-form,
.jinko-lead-form {
    width: 100%;
    max-width: unset;
    border: 0;
    box-shadow: unset;
    border-radius: unset;
    font-family: inherit;
    padding: 0;
    --jinko-crw-label-color: #333;
    --jinko-crw-border-color: #C7C6C6;
    --jinko-crw-text-color: #666;
}

.jinko-request-form h2,
.jinko-request-form p,
.jinko-lead-form h2,
.jinko-lead-form p {
    display: none;
}

.jinko-request-field input:focus,
.jinko-request-field select:focus,
.jinko-request-field textarea:focus,
.jinko-lead-form input:focus,
.jinko-lead-form select:focus,
.jinko-lead-form textarea:focus {
    box-shadow: unset;
}

.jinko-request-submit,
.jinko-lead-submit {
    width: max-content;
    border-radius: 300px;
    padding: 12px 35px;
    background-image: var(--theme-gradient-green);
    gap: 10px;
    font-size: calc(16 * var(--fpx-87));
    color: #fff;
    cursor: pointer;
    transition: .3s;
}

.tabel-wrap table {
    width: 100%;
    border-radius: calc(20 * var(--rpx-50));
    overflow: hidden;
    box-shadow: var(--box-shadow);
}

.tabel-wrap thead {
    background-image: linear-gradient(to right, var(--theme-green), #7BBE42);
    color: #fff;
}

.tabel-wrap td {
    padding: 15px 20px;
}

.tabel-wrap tbody tr:nth-child(even) {
    background-color: #fff;
}

.tabel-wrap tbody tr td:first-child {
    color: #000;
    font-weight: bold;
}

.support-sec3 .item-top .title {
    gap: 15px;
}

.support-sec3 .item .letter {
    --bg-color: var(--theme-green);
    color: #fff;
}

.support-sec3 .item.active .item-top .letter {
    color: var(--theme-green);
    --bg-color: #fff;
}

.support-sec3 .item-expand-cont {
    gap: 15px;
}

.solution-sec1 .item+.item {
    margin-top: calc(80 * var(--rpx-50));
}

.solution-sec1 .title {
    font-size: max(22px, 36 * var(--fpx-50));
    font-weight: bold;
    gap: 10px;
}

.solution-sec1 .txt-cont {
    box-shadow: var(--box-shadow);
    border-radius: calc(30 * var(--rpx-50));
    margin-top: calc(30 * var(--rpx-50));
    overflow: hidden;
}

.solution-sec1 .txt-cont>* {
    width: 50%;
}

.solution-sec1 .txt-cont .txt {
    padding: calc(80 * var(--rpx-50));
    gap: calc(40 * var(--rpx-50));
    font-size: max(16px, 24 * var(--fpx-50));
    font-weight: bold;
    text-align: center;
}

.solution-sec1 .txt-cont .txt a:hover {
    color: var(--theme-green);
}

.solution-sec1 .item:nth-child(even) .title {
    justify-content: flex-end;
}

.solution-sec1 .item:nth-child(even) .txt-cont {
    flex-direction: row-reverse;
}

.news-wrap .item .pic .time {
    position: absolute;
    top: calc(30 * var(--rpx-50));
    left: calc(30 * var(--rpx-50));
    padding: 5px 10px;
    min-width: 80px;
}

.solution-sec2 .item .pic .time {
    background-image: var(--theme-gradient-green);
    color: #fff;
}

.news-wrap .item .pic .expand-intro {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to bottom, rgba(17, 166, 58, .8), rgba(123, 190, 66, .8));
    color: #fff;
    padding: calc(30 * var(--rpx-50));
    transform: translateY(20%);
    opacity: 0;
    transition: .3s;
}

.news-wrap .item:hover .pic .time {
    display: none;
}

.news-wrap .item:hover .pic .expand-intro {
    transform: translateY(0);
    opacity: 1;
}

.solution-sec2 .item .txt .intro span {
    margin-left: 5px;
}

.solution-sec3 .item {
    box-shadow: unset;
}

.solution-sec3 .item .pic {
    background-image: linear-gradient(to bottom, #FCFCFC, #F1F1F1);
    padding: calc(40 * var(--rpx-50));
    background-color: unset;
}

.solution-sec3 .item .pic .time {
    background-color: rgba(0, 0, 0, .2);
    color: #fff;
}

.solution-sec2 .item .txt .title,
.solution-sec3 .item .txt .title {
    margin-top: 0;
}

.solution-sec3 .item:hover .pic {
    background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, .6));
}

.solution-sec3 .item .txt {
    min-height: unset;
    padding-bottom: 0;
}

.page-tab {
    gap: calc(50 * var(--rpx-50));
    font-size: calc(24 * var(--fpx-50));
    color: #999;
}

.page-tab .tab {
    padding-bottom: calc(10 * var(--rpx-50));
}

.page-tab .tab.active,
.page-tab .tab:hover {
    color: #333;
    border-bottom: 3px solid var(--theme-green);
}

.energy-sec2 .txt {
    margin-top: calc(-60 * var(--rpx-50));
}

.energy-sec2 .item {
    width: calc(500 * var(--rpx-50));
    background-color: #fff;
    border-radius: calc(30 * var(--rpx-50));
    padding: calc(40 * var(--rpx-50));
    padding-bottom: calc(60 * var(--rpx-50));
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
}

.energy-sec2 .item .status {
    width: 28px;
    height: 28px;
    background-color: #F2F2F2;
    border-radius: 50%;
    position: absolute;
    bottom: calc(20 * var(--rpx-50));
    right: calc(20 * var(--rpx-50));
    transition: .3s;
}

.energy-sec2 .item .status::after,
.energy-sec2 .item .status::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #333;
    transition: .3s;
}

.energy-sec2 .item .status::after {
    width: 2px;
    height: 14px;
}

.energy-sec2 .item .status::before {
    height: 2px;
    width: 14px;
}

.energy-sec2 .item.active .status {
    transform: rotate(90deg);
}

.energy-sec2 .item.active .status::before {
    opacity: 0;
}

.energy-sec2 .item .title {
    font-size: max(16px, 24 * var(--fpx-50));
    font-weight: bold;
    gap: 15px;
}

.energy-sec2 .item .icon {
    background-image: var(--theme-gradient-green);
}

.energy-sec2 .item .intro {
    font-size: max(14px, 18 * var(--fpx-50));
    color: #666;
    margin-top: calc(20 * var(--rpx-50));
}

.energy-sec2 .item .intro p {
    text-align: center;
}

.energy-sec2 .item:not(.active) .intro {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.por {
    position: relative;
}

section img {
    max-width: 100%;
}

section a {
    display: block;
}

.energy-sec2 .sec-area .txt {
    flex-shrink: 0;
}

.energy-sec3 .item {
    background-color: #F6F6F6;
    border-radius: calc(30 * var(--rpx-50));
    padding: calc(40 * var(--rpx-50));
    padding-bottom: calc(80 * var(--rpx-50));
    overflow: hidden;
}

.energy-sec3 .item .title {
    font-size: max(18px, 28 * var(--fpx-50));
    font-weight: bold;
    gap: 15px;
}

.energy-sec3 .item .icon {
    --w: calc(60 * var(--rpx-50));
    --bg-color: #fff;
}

.energy-sec3 .item .intro {
    color: #666;
    font-size: max(15px, 20 * var(--fpx-50));
}

.energy-sec4 .item {
    font-size: max(20px, 32 * var(--fpx-50));
    text-align: center;
    color: #666;
    gap: calc(40 * var(--rpx-50));
}

.energy-sec4 .item .icon {
    --w: calc(145 * var(--rpx-50));
    --bg-color: transparent;
    border: 1px solid var(--theme-green);
}

.energy-sec4 .sec-area {
    gap: calc(200 * var(--rpx-50));
}

.product-sec1 .card-wrap {
    --col: 2;
}

.product-sec1 .card-wrap .pic {
    aspect-ratio: 775 /585;
}

.product-sec1 .news-wrap .item .pic .time {
    background-image: var(--theme-gradient-green);
    color: #fff;
}

.product-sec1 .news-wrap .item:hover .pic .time {
    display: block;
}

.product-sec1 .item .bg {
    opacity: .6;
    background-image: linear-gradient(to bottom, transparent 50%, #000);
    transition: .3s;
}

.product-sec1 .item:hover .bg {
    background-image: linear-gradient(to bottom, transparent 0%, #000);
}

.product-sec1 .item:hover .info {
    transform: translate(-50%, -100%);
}

.product-sec1 .item .info {
    position: absolute;
    bottom: calc(50 * var(--rpx-50));
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    color: #fff;
    transition: .3s;
}

.product-sec1 .item .info .title {
    font-size: max(28px, 40 * var(--fpx-50));
    font-weight: bold;
}

.product-sec1 .item .info .link {
    font-size: max(15px, 20 * var(--fpx-50));
    gap: 5px;
}

.product-detail-banner {
    padding-top: calc(80 * var(--rpx-50));
    height: auto;
}

.product-detail-banner .page-cont {
    gap: 15%;
}

.product-detail-banner .name {
    font-size: calc(68 * var(--fpx-50));
    color: var(--theme-green);
    font-weight: bold;
    line-height: 1.2;
}

.product-detail-banner .title {
    color: #000;
    margin-top: calc(40 * var(--rpx-50));
    font-size: calc(48 * var(--fpx-50));
}

.product-detail-banner .intro {
    font-size: max(14px, 18 * var(--fpx-50));
}

.product-detail-banner .txt {
    width: 40%;
    flex-shrink: 0;
}

.product-detail-banner .pic {
    margin-top: 2%;
    padding-right: 10%;
    flex: 1;
}

.product-detail-banner .pic img {
    width: 100%;
}

.product-detail-sec1 .card-wrap {
    --col: 4;
}

.product-detail-sec1 .item .icon {
    background-image: var(--theme-gradient-green);
}

.product-detail-sec1 .item {
    padding-bottom: calc(40 * var(--rpx-50));
}

.product-detail-sec1 .para-cont {
    gap: 12px;
    padding-top: calc(30 * var(--rpx-50));
    border-top: 2px solid #E6E6E6;
    margin-top: calc(10 * var(--rpx-50));
}

.product-detail-sec1 .para {
    border-radius: calc(17 * var(--rpx-50));
    background-color: #fff;
    padding: calc(10 * var(--rpx-50)) calc(20 * var(--rpx-50));
    flex: 1;
}

.product-detail-sec1 .para-value {
    font-size: max(20px, 30 * var(--fpx-50));
    font-weight: bold;
    color: var(--theme-green);
    line-height: 1.2;
}

.product-detail-sec1 .para-name {
    font-size: max(14px, 18 * var(--fpx-50));
    color: #666;
}

.product-detail-sec2 .sec-area {
    gap: calc(40 * var(--rpx-50));
}

.product-detail-sec2 .item {
    width: calc((100% - calc(40 * var(--rpx-50)) * 2) / 4);
    height: calc(659 * var(--rpx-50));
    border-radius: calc(30 * var(--rpx-50));
    gap: calc(30 * var(--rpx-50));
    color: #fff;
    padding: calc(100 * var(--rpx-50));
    transition: .3s;
}

.product-detail-sec2 .item .icon {
    --w: 90px;
}

.product-detail-sec2 .item .title {
    font-size: max(16px, 24 * var(--fpx-50));
    font-weight: bold;
}

.product-detail-sec2 .item .intro {
    font-size: max(14px, 20 * var(--rpx-50));
    text-align: center;
    opacity: 0;
    transform: translateY(20px);
    transition: .3s;
}

.product-detail-sec2 .item.active {
    width: calc((100% - calc(40 * var(--rpx-50)) * 2) / 2);
}

.product-detail-sec2 .item.active .icon {
    background-image: var(--theme-gradient-green);
}

.product-detail-sec2 .item .icon img {
    width: auto;
}

.product-detail-sec2 .item.active .icon img {
    filter: url(#white-overlay);
}

.product-detail-sec2 .item.active .intro {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .3s;
}

.values-sec1 .pic {
    width: 100%;
    overflow: hidden;
}

.values-sec2 .item .pic {
    background-image: unset;
    background-color: #fff;
}

.contact-us-sec1 .sec-area {
    gap: calc(100 * var(--rpx-50));
}

.contact-us-sec1 .department {
    width: calc(480 * var(--rpx-50));
}

.contact-us-sec1 .item {
    background-color: #F6F6F6;
    box-shadow: unset;
    overflow: hidden;
}

.contact-us-sec1 .item.active {
    background-image: var(--theme-gradient-green);
}

.contact-us-sec1 .item-top {
    padding: calc(20 * var(--rpx-50)) calc(30 * var(--rpx-50));
    height: auto;
}

.contact-us-sec1 .item.active .item-top {
    border-radius: unset;
    background-image: unset;
}

.contact-us-sec1 .item-top .title {
    font-size: max(14px, 18 * var(--fpx-50));
    font-weight: 300;
}

.contact-us-sec1 .item-top .icon::after,
.contact-us-sec1 .item-top .icon::before {
    content: unset;
}

.contact-us-sec1 .item-top .icon {
    background-image: unset;
    --bg-color: #fff;
    right: 10px;
    --w: max(28px, 40 * var(--fpx-50));
}

.contact-us-sec1 .item.active .item-top .icon {
    transform: translateY(-50%) rotate(90deg);
}

.contact-us-sec1 .item-top .icon img {
    transform: rotate(-90deg);
}

.contact-us-sec1 .item.active .icon {
    --bg-color: rgba(255, 255, 255, .2);
}

.contact-us-sec1 .item.active .icon img {
    filter: url(#white-overlay);
}

.contact-us-sec1 .item.active .title {
    font-size: max(16px, 24 * var(--fpx-50));
    font-weight: normal;
}

.contact-us-sec1 .item-expand {
    padding: calc(30 * var(--rpx-50));
    padding-top: 0;
    color: #fff;
    font-weight: 300;
}

.contact-us-sec1 .item-expand .name {
    font-size: max(15px, 20 * var(--fpx-50));
}

.contact-us-sec1 .item-expand .info-cont {
    font-size: max(14px, 18 * var(--fpx-50));
    gap: 5px;
    align-items: flex-start;
    margin-top: 7px;
}

.contact-us-sec1 .item-expand .info-cont img {
    margin-top: .4em;
}

.contact-us-sec1 .item+.item {
    margin-top: 10px;
}

.contact-us-sec1 .point-cont,
.contact-us-sec1 .department-cont {
    display: none;
}

.contact-us-sec1 .point-cont.active,
.contact-us-sec1 .department-cont.active {
    display: block;
}

.contact-us-sec1 .point {
    position: absolute;
    width: calc(15 * var(--rpx-75));
    height: calc(15 * var(--rpx-75));
    border-radius: 50%;
    background-color: var(--theme-green);
}

.contact-us-sec1 .point.active i {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: var(--theme-green);
    /* 初始状态：缩小到中心且不可见 */
    opacity: 0;
    transform: scale(1);
    /* 动画执行总时间 3 秒，无限循环，ease-out 让它扩散时有一种渐缓的自然感 */
    animation: ripple 3s ease-out infinite;
}

/* 2. 给三个 i 元素分别设置不同的延迟时间，让它们依次扩散 */
.contact-us-sec1 .point i:nth-child(1) {
    animation-delay: 0s;
    /* 第一个立刻开始 */
}

.contact-us-sec1 .point i:nth-child(2) {
    animation-delay: 1s;
    /* 第二个延迟 1 秒开始 */
}

.contact-us-sec1 .point i:nth-child(3) {
    animation-delay: 2s;
    /* 第三个延迟 2 秒开始 */
}

/* 3. 定义扩散动画的关键帧 */
@keyframes ripple {
    0% {
        transform: scale(1);
        /* 从原点大小开始 */
        opacity: 0.6;
        /* 初始透明度稍微可见 */
    }

    100% {
        transform: scale(4);
        /* 扩散到原来的 4 倍大小 (根据你的视觉需求调整数值) */
        opacity: 0;
        /* 扩散到最大时完全透明 */
    }
}

.contact-us-sec1 .point::after {
    content: '';
    width: 35%;
    height: 35%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    border-radius: 50%;
}

.contact-us-sec1 .point-cont:nth-child(1) .point.JP {
    top: 35%;
    left: 42%;
}

.contact-us-sec1 .point-cont:nth-child(1) .point.IT {
    top: 22%;
    left: 12%;
}

.contact-us-sec1 .point-cont:nth-child(1) .point.CL {
    top: 78%;
    left: 87%;
}

.contact-us-sec1 .point-cont:nth-child(1) .point.NG {
    top: 50%;
    left: 5%;
}

.contact-us-sec1 .point-cont:nth-child(1) .point.AU {
    top: 76%;
    left: 48%;
}

.contact-us-sec1 .point-cont:nth-child(2) .point.IN {
    top: 40%;
    left: 24%;
}

.contact-us-sec1 .point-cont:nth-child(2) .point.SK {
    top: 20%;
    left: 15%;
}

.contact-us-sec1 .point-cont:nth-child(2) .point.AE {
    top: 38%;
    left: 20%;
}

.contact-us-sec1 .point-cont:nth-child(2) .point.DE {
    top: 17%;
    left: 14%;
}

.contact-us-sec1 .point-cont:nth-child(2) .point.US {
    top: 27%;
    left: 80%;
}

.product-catalog-sec1 .txt-cont>* {
    width: 50%;
}

.product-catalog-sec1 .item {
    box-shadow: var(--box-shadow);
    border-radius: calc(30 * var(--rpx-50));
}

.product-catalog-sec1 .item .pic {
    padding: calc(120 * var(--rpx-50));
    border-radius: calc(30 * var(--rpx-50));
}

.product-catalog-sec1 .txt-cont .txt {
    padding: calc(80 * var(--rpx-50));
}

.product-catalog-sec1 .txt-cont .txt .title {
    font-size: calc(42 * var(--fpx-50));
    font-weight: bold;
}

.product-catalog-sec1 .txt-cont .txt .intro {
    font-size: max(15px, 20 * var(--fpx-50));
}

.product-catalog-sec1 .txt-cont .txt .info {
    font-size: max(14px, 18 * var(--fpx-50));
    font-weight: 300;
    margin-top: calc(30 * var(--rpx-50));
    color: #666;
}

.product-catalog-sec1 .txt-cont .pic {
    border-radius: calc(30 * var(--rpx-50));
    background-image: linear-gradient(to bottom, #E0E0E0, #fff);
    position: relative;
    overflow: hidden;
}

.product-catalog-sec1 .txt-cont .pic img {
    position: relative;
    z-index: 1;
}

.product-catalog-sec1 .txt-cont .pic::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image:
        linear-gradient(162deg, transparent 60%, rgba(196, 196, 196, .3) 60%, rgba(196, 196, 196, 0));
    filter: blur(3px);
}

.product-catalog-sec1 .sec-area .item+.item {
    margin-top: calc(60 * var(--rpx-50));
}

.product-catalog-sec1 .item:nth-child(even) .txt-cont {
    flex-direction: row-reverse;
}

.product-catalog-sec1 .item:nth-child(even) .txt-cont .pic::after {
    background-image:
        linear-gradient(198deg, transparent 60%, rgba(196, 196, 196, .3) 60%, rgba(196, 196, 196, 0));
}

.product-catalog-sec1 .item li {
    list-style-type: disc;
    list-style-position: inside;
}

.management-sec1 .txt .title {
    font-size: max(22px, 36 * var(--fpx-50));
    font-weight: bold;
    color: var(--theme-green);
}

.management-sec1 .pic {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.management-sec1 .pic .bg {
    background-image: linear-gradient(to top, #000, transparent);
    opacity: .4;
}

.management-sec1 .pic-info {
    position: absolute;
    bottom: calc(50 * var(--rpx-50));
    left: calc(50 * var(--rpx-50));
    color: #fff;
    z-index: 1;
}

.management-sec1 .pic-title {
    font-size: max(22px, 36 * var(--fpx-50));
    font-weight: bold;
}

.management-sec1 .pic-intro {
    width: 36em;
    font-size: max(16px, 24 * var(--fpx-50));
    margin-top: calc(20 * var(--rpx-50));
}

.management-sec2 .sec-area img {
    width: 45%;
}

.type-tab-wrap {
    overflow-x: auto;
}

.type-tab {
    padding: calc(15 * var(--rpx-50));
    background-color: #F6F6F6;
    border-radius: 300px;
    width: max-content;
    margin: 0 auto;
    cursor: pointer;
    position: relative;
    transition: color 0.3s ease;
}

.type-tab .tab {
    gap: calc(10 * var(--rpx-67));
    color: #666;
    padding: calc(15 * var(--rpx-50)) calc(40 * var(--rpx-50));
    position: relative;
    z-index: 1;
}

.type-tab .tab.active {
    background-color: rgba(0, 161, 66, .2);
    border-radius: 300px;
}

.type-tab .tab:hover,
.type-tab .tab.active {
    color: #fff;
}

.type-tab .tab:hover img,
.type-tab .tab.active img {
    filter: url(#white-overlay);
}

.gliding-block {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    height: calc(100% - calc(15 * var(--rpx-50)) * 2);
    background-image: var(--theme-gradient-green);
    border-radius: 300px;
    z-index: 1;
    /* 在 tab 内容下方 */
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    /* 平滑的移动动画 */
    opacity: 0;
    /* 初始隐藏，JS计算后显示 */
    pointer-events: none;
    /* 让鼠标事件穿透滑块，直接作用于 tab */
}

.management-sec3 .swiper-handle {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
}

.management-sec3 .sec-area {
    padding: 0 calc(100 * var(--rpx-50));
}

.management-sec3 .swiper-slide {
    gap: calc(50 * var(--rpx-50));
    height: auto;
}

.management-sec3 .swiper-slide .txt {
    width: 50%;
}

.management-sec3 .swiper-slide .txt .title {
    font-size: max(20px, 32 * var(--fpx-50));
    font-weight: bold;
}

.management-sec3 .swiper-slide .txt .intro {
    font-size: max(14px, 18 * var(--fpx-50));
    margin-top: calc(30 * var(--rpx-50));
}

.management-sec3 .swiper-slide .pic {
    width: 35%;
}

.management-sec4 {
    margin-bottom: calc(100 * var(--rpx-50));
}

.management-sec4 .item .txt {
    text-align: left;
    gap: 0;
    background-color: #F6F6F6;
}

.management-sec4 .item .title {
    font-size: max(20px, 32 * var(--fpx-50));
}

.management-sec4 .item .sec-intro {
    font-weight: normal;
}

.management-sec4 .item .txt-cont-expand .expand-img {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 30%);
}

.management-sec4 .item:nth-child(even) .txt-cont-expand {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
}

.charity-sec1 .card-wrap {
    --col: 4;
    --gap: calc(30 * var(--rpx-50));
    align-items: start;
}

.charity-sec1 .news-wrap .txt .intro {
    display: block;
}

.charity-sec1 .item:nth-child(even) {
    margin-top: calc((100% - (var(--col) - 1) * var(--gap)) / var(--col) * 315 / 506);
}

.charity-sec1 .item .title {
    margin-top: 0;
}

.charity-sec2 .sec-intro {
    width: 33em;
}

.charity-sec2 {
    background-image: linear-gradient(to bottom, rgba(196, 196, 196, .6), transparent);
}

/* 外层 Swiper 容器 */
.charity-sec2 .outer-swiper {
    width: 100%;
    height: calc(685 * var(--rpx-50));
}

/* 让 slide 居中，非 active 缩小 */
.charity-sec2 .outer-swiper .swiper-slide {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    transform: scaleY(0.8);
    transform-origin: bottom;
    /* 默认缩小 */
    opacity: 0.5;
    position: relative;
    border-radius: calc(30 * var(--rpx-50));
    overflow: hidden;
}

.charity-sec2 .outer-swiper .swiper-slide-active {
    transform: scaleY(1);
    /* active 状态还原 */
    opacity: 1;
    z-index: 10;
}

/* 卡片容器：包裹文字和内层Swiper */
.charity-sec2 .card-container {
    width: 100%;
    height: 100%;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.charity-sec2 .outer-swiper .swiper-slide:not(.swiper-slide-active) .card-container {
    transform: scaleY(1.25);
    transform-origin: top;
}

/* 文字层：作为兄弟元素固定在上方 */
.charity-sec2 .text-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    padding: calc(50 * var(--rpx-50));
    z-index: 2;
    /* 重要：虽然不用 absolute，但确保它在文档流中独立于 inner-swiper 的切换动画 */
    color: #fff;
}

.charity-sec2 .text-wrapper .title {
    font-size: max(20px, 30 * var(--fpx-50));
    font-weight: bold;
}

.charity-sec2 .text-wrapper .desc {
    font-size: max(12px, 16 * var(--fpx-50));
    margin-top: calc(20 * var(--rpx-50));
    opacity: 0;
}

.charity-sec2 .outer-swiper .swiper-slide-active .desc {
    opacity: 1;
}

/* 内层 Swiper */
.charity-sec2 .inner-swiper {
    width: 100%;
    flex: 1;
    /* 撑满剩余空间 */
    position: relative;
    /* 给分页器做定位 */
}

.charity-sec2 .inner-slide {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 24px;
}

/* 内层分页器样式调整 */
.charity-sec2 .inner-pagination {
    position: absolute;
    bottom: 15px;
    left: 0;
    width: 100%;
    text-align: center;
}

.charity-sec2 .inner-pagination .swiper-pagination-bullet-active {
    background: #fff;
}

.purchase-sec1 .sec-area {
    gap: calc(40 * var(--rpx-50));
    align-items: flex-start;
}

.purchase-sec1 .map img {
    display: block;
}

.purchase-sec1 .location-wrap {
    height: 65vh;
    overflow-y: auto;
    overflow-x: hidden;
    padding-left: calc(10 * var(--rpx-50));
    padding-right: calc(33 * var(--rpx-50));
    flex-shrink: 0;
}

.purchase-sec1 .location-wrap .item {
    box-shadow: var(--box-shadow);
    width: calc(500 * var(--rpx-50));
    padding: calc(30 * var(--rpx-50));
    border-radius: calc(30 * var(--rpx-50));
    margin-top: calc(20 * var(--rpx-50));
    cursor: pointer;
    transition: .3s;
}

.purchase-sec1 .location-wrap .item:hover {
    transform: translateX(calc(15 * var(--rpx-50)));
}

.purchase-sec1 .location-wrap .item .title {
    font-size: max(16px, 24 * var(--fpx-50));
    font-weight: bold;
}

.purchase-sec1 .location-wrap .item .label {
    font-size: max(14px, 18 * var(--fpx-50));
    color: var(--theme-green);
}

.purchase-sec1 .location-wrap .item .info-cont .info {
    font-size: max(12px, 16 * var(--fpx-50));
    font-weight: 300;
    gap: 10px;
    align-items: flex-start;
}

.purchase-sec1 .location-wrap .item .info-cont .info+.info {
    margin-top: 5px;
}

.purchase-sec1 .location-wrap .item .info-cont .info img {
    margin-top: .2em;
}

.purchase-sec1 .location-wrap .item .info-cont .info img.link {
    margin-top: .3em;
}

.purchase-sec1 .location-wrap .item .info-cont .info img.email {
    margin-top: .45em;
}

:not(html, body, .el-scrollbar__wrap)::-webkit-scrollbar-button {
    display: none;
}

:not(html, body, .el-scrollbar__wrap)::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, .05);
}

:not(html, body, .el-scrollbar__wrap) .vertical-scrollbar::-webkit-scrollbar {
    height: 4px;
}

:not(html, body, .el-scrollbar__wrap)::-webkit-scrollbar-thumb {
    background-color: var(--theme-green);
    border-radius: 5px;
}

.purchase-sec1 .point {
    position: absolute;
    width: calc(30 * var(--rpx-50));
    height: calc(37.5 * var(--rpx-50));
}

.purchase-sec1 .point::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/news/icon_location_1426.svg) no-repeat center/contain;
    transition: .3s;
}

.purchase-sec1 .point.active {
    z-index: 1;
}

.purchase-sec1 .point.active::after {
    transform: scale(1.3);
    animation: bounce 0.5s ease-in-out 1;
}

@keyframes bounce {
    0% {
        transform: scale(1.3);
        /* 起始状态（或直接写 0% 原样） */
    }

    50% {
        transform: scale(1.3) translateY(-10px);
        /* 放大同时向上跳 */
    }

    100% {
        transform: scale(1.3) translateY(0);
        /* 落回原位 */
    }
}

.purchase-sec1 .point.active .ripple {
    position: absolute;
    width: calc(20 * var(--rpx-50));
    height: calc(20 * var(--rpx-50));
    top: 50%;
    left: 50%;
    transform: translate(-50%, 14%);
}

.purchase-sec1 .point.active i {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: var(--theme-green);
    /* 初始状态：缩小到中心且不可见 */
    opacity: 0;
    transform: scale(1);
    /* 动画执行总时间 3 秒，无限循环，ease-out 让它扩散时有一种渐缓的自然感 */
    animation: ripple1 3s ease-out infinite;
}

/* 2. 给三个 i 元素分别设置不同的延迟时间，让它们依次扩散 */
.purchase-sec1 .point i:nth-child(1) {
    animation-delay: 0s;
    /* 第一个立刻开始 */
}

.purchase-sec1 .point i:nth-child(2) {
    animation-delay: 1s;
    /* 第二个延迟 1 秒开始 */
}

.purchase-sec1 .point i:nth-child(3) {
    animation-delay: 2s;
    /* 第三个延迟 2 秒开始 */
}

/* 3. 定义扩散动画的关键帧 */
@keyframes ripple1 {
    0% {
        transform: scale(1) rotateX(45deg);
        /* 从原点大小开始 */
        opacity: 0.6;
        /* 初始透明度稍微可见 */
    }

    100% {
        transform: scale(3) rotateX(45deg);
        opacity: 0;
        /* 扩散到最大时完全透明 */
    }
}

.purchase-sec1 .point.MX-1 {
    top: 37%;
    left: 78%;
}

.purchase-sec1 .point.MX-2 {
    top: 39%;
    left: 79%;
}

.purchase-sec1 .point.MX-3 {
    top: 38%;
    left: 82.5%;
}

.purchase-sec1 .point.BE {
    top: 14%;
    left: 11.5%;
}

.purchase-sec1 .point.IE,
.purchase-sec1 .point.GB-1 {
    top: 11%;
    left: 9.5%;
}

.purchase-sec1 .point.NL {
    top: 13%;
    left: 12.5%;
}

.purchase-sec1 .point.GB-2 {
    top: 10%;
    left: 10.5%;
}

.purchase-sec1 .point.HU {
    top: 18%;
    left: 14%;
}

.purchase-sec1 .point.BR-1 {
    top: 68%;
    left: 96%;
}

.purchase-sec1 .point.BR-2 {
    top: 62%;
    left: 97.5%;
}

.purchase-sec1 .point.BR-3 {
    top: 64%;
    left: 94%;
}

.purchase-sec1 .point.BR-4 {
    top: 71%;
    left: 95%;
}

.purchase-sec1 .point.BR-5 {
    top: 67%;
    left: 94%;
}

.purchase-sec1 .point.CL-1 {
    top: 78%;
    left: 85.4%;
}

.purchase-sec1 .point.CL-2 {
    top: 75%;
    left: 86.4%;
}

.purchase-sec1 .point.LB {
    top: 27.5%;
    left: 15.5%;
}

.purchase-sec1 .point.JO {
    top: 28%;
    left: 16%;
}

.purchase-sec1 .point.NG {
    top: 35%;
    left: 19.5%;
}

.talent-sec2 .items {
    flex-wrap: wrap;
    gap: calc(20 * var(--rpx-50));
}

.talent-sec2 .pic {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

.talent-sec2 .item-cont {
    background: url(../images/news/img1750.svg) no-repeat center / contain;
    width: 160px;
    height: 200px;
    overflow: hidden;
}

.talent-sec2 .item-cont.active,
.talent-sec2 .item-cont:hover {
    background-image: url(../images/news/img1750_full.svg);
}

.talent-sec2 .item .title {
    font-size: max(15px, 22 * var(--fpx-50));
    font-weight: bold;
}

.talent-sec2 .item .intro {
    font-size: max(10px, 14 * var(--rpx-50));
    margin-top: 5px;
    transition-delay: .3s;
}

.talent-sec2 .item-expand .title,
.talent-sec2 .item-expand .intro {
    opacity: 0;
    transform: translateY(-50%);
    transition: .3s;
}

.talent-sec2 .item-expand {
    color: #fff;
    padding: calc(10 * var(--rpx-50));
    padding-right: calc(20 * var(--rpx-50));
    line-height: 1.4;
}

.talent-sec2 .item-cont:hover>.title,
.talent-sec2 .item-cont.active>.title {
    display: none;
}

.talent-sec2 .item-cont.active .item-expand .title,
.talent-sec2 .item-cont.active .item-expand .intro,
.talent-sec2 .item-cont:hover .item-expand .title,
.talent-sec2 .item-cont:hover .item-expand .intro {
    opacity: 1;
    transform: unset;
}

.talent-sec2 .item+.item::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    background-color: #66AE4B;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.map {
    flex: 1;
}

.tabel-wrap {
    overflow-x: auto;
}

.tabel-wrap tr td:first-child {
    white-space: nowrap;
}