/* 要发版就删除 https://public-1259630247.cos.ap-shanghai.myqcloud.com */
.common_card_border {
    box-shadow: var(--about-shadow);
    border-radius: 8px;
}

#about {
    background-color: var(--gray2);
    --section0-header-imgUrl: url("https://public-1259630247.cos.ap-shanghai.myqcloud.com/website/www/images/about/s1_bg_1.webp");
    --section5-imgUrl: url("https://public-1259630247.cos.ap-shanghai.myqcloud.com/website/www/images/footer.webp");
    --section4-imgUrl: url("https://public-1259630247.cos.ap-shanghai.myqcloud.com/website/www/images/about/s4_bg_2.webp");
}

#section0 {
    position: relative;
}

#section0 .header {
    height: 40vh;
    background-image: linear-gradient(128deg, rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.38)), var(--section0-header-imgUrl);
    background-size: cover;
    background-position: 20% 28%;
}

#section0 .section0_con {
    width: 56.25%;
}

#section0 .section0_con .con_warp {
    background-color: #fff;
    padding: 2.375rem 1rem;
    margin-top: -4.125rem;
}

#section0 .section0_con .con_warp>div {
    padding: 0 2.6rem;
}

#section0 .section0_con .con_warp>div:not(:last-child) {
    border-right: 1px solid var(--gray1-opacity-50);
}

#section0 .section0_con .introduce {
    background-color: #fff;
}

#section0 .section0_con .introduce .left {
    padding: 2.3rem 1.125rem 2.3rem 1.93rem;
}

#section0 .section0_con .introduce .left .introduce_con {
    letter-spacing: 1.2px;
    line-height: 1.75rem;
}

#section1 .section1_con_warp {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    box-shadow: 4px 4px 30px 1px rgba(0, 0, 0, 0.05);
    border-radius: var(--radius-10);
    height: 22.18rem;
    cursor: pointer;
    flex-grow: 5;
    flex-shrink: 1;
    flex-basis: 0%;
    transition: flex 100ms ease-out 10ms;
}

#section1 .section1_con {
    display: flex;
    box-shadow: 4px 4px 30px 1px rgba(0, 0, 0, 0.05);
    border-radius: var(--radius-10);
    height: 22.18rem;
    height: 100%;
    background: rgb(12 5 0 / 70%);
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#section1 .section1_con .imgSty img {
    width: 1.75rem;
    height: 1.75rem;
    transition: width, height 300ms linear 20ms;
    transform-origin: center;
    margin-bottom: 1rem;
}

/* 悬浮效果 */
#section1 .section1_con_warp.active,
#section1 .section1_con_warp:hover {
    flex-grow: 8.4;
    box-shadow: 4px 4px 30px 1px rgba(0, 0, 0, 0.25);
}

#section1 .section1_con_warp.active .section1_con,
#section1 .section1_con_warp:hover .section1_con {
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.8125rem 2.1875rem;
    background: linear-gradient(180deg, var(--orange-opacity-50) 0%, var(--orange1-opacity-50) 100%);
}

#section1 .section1_con_warp.active .desc,
#section1 .section1_con_warp.active .btn,
#section1 .section1_con_warp:hover .desc,
#section1 .section1_con_warp:hover .btn {
    display: flex !important;
}

#section1 .section1_con_warp.active .imgSty,
#section1 .section1_con_warp:hover .imgSty {
    padding: 1.18rem;
    border-radius: 50%;
    background-color: #fff;
    transform: scale(0.88);
    transform-origin: left;
}

#section1 .section1_con_warp.active .imgSty img,
#section1 .section1_con_warp:hover .imgSty img {
    margin-bottom: 0;
}

#section1 .section1_con_warp.active .title,
#section1 .section1_con_warp:hover .title {
    font-size: 1.25rem !important;
}

#section1 .section1_con_warp.active .btn,
#section1 .section1_con_warp:hover .btn {
    border-radius: 1.25rem;
    padding: 0.5rem 1.25rem 0.5rem 2.06rem;
    background-color: #fff;
    color: var(--orange);
}

#section1 .section1_con_warp.active .imgSty img,
#section1 .section1_con_warp:hover .imgSty img {
    width: 2.5rem;
    height: 2.5rem;
    filter: drop-shadow(var(--orange) 2000px 0);
    transform: translateX(-2000px);
}

#section2 .topBard {
    height: 8.125rem;
    background: linear-gradient(89deg, #FFF5EF 0%, rgba(255, 236, 225, 0.38) 52%, rgba(255, 250, 248, 0.21) 100%);
    border-radius: var(--radius-8);
    padding: 1.5rem 2.9375rem 1.0625rem 0;
}

#section2 .topBard .title {
    display: -webkit-box;
}

#section2 .topBard .title::before {
    content: " ";
    display: block;
    width: 0.3125rem;
    height: 1.84rem;
    border-radius: var(--radius-8);
    background-color: var(--orange);
}

#section2 .topBard .desc {
    padding-left: 0.8125rem;
}

#section3 .topHav {
    margin-bottom: 3rem;
}

#section3 .content3 {
    top: 3.9375rem;
}

#section3 .content3 .lineYear {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

#section3 .content3 .lineYear .lineYearItem::after {
    content: " ";
    display: block;
    width: 1.22rem;
    height: 1.22rem;
    z-index: 1;
    border-radius: 50%;
    background-color: #fff;
}

#section3 .content3 .line {
    height: 3px;
    width: 100%;
    background-color: #FFFFFF;
    bottom: 0.45rem;
}

#section3 .content3 .line .circle {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    z-index: 2;
    background-color: var(--orange);
    background: radial-gradient(circle, var(--orange) 37%, var(--orange-opacity-50) 37%);
    position: absolute;
    left: 0;
    top: calc(2.4rem / -2);
    transition: all 300ms linear;
}

#section3 .content3 .bottomCard {
    box-shadow: 0px 10px 30px 1px rgba(0, 0, 0, 0.08);
    border-radius: var(--radius-8);
    padding: 2.125rem 1.25rem;
    height: 22.78rem;
}

#section3 .content3 .bottomCard .bottomCardCon {
    padding: 0 1.9375rem;
}

#section3 .content3 .bottomCard .bottomCardCon .flag {
    width: 1.4375rem;
    height: 0.3125rem;
    background: var(--orange);
    border-radius: var(--radius-4);
    margin: 1.3rem 0;
}

#section3 .content3 .bottomCard .bottomCardCon .desc {
    text-overflow: ellipsis;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: inherit;
    min-height: 4.2rem;
}

#section3 .content3 .bottomCard .button-swiper.swiper-button-disabled .icon {
    opacity: 0.3;
}

#section3 .content3 .swiper-button-lock {
    visibility: hidden;
    display: block;
}

#section4 {
    background-image: var(--section4-imgUrl), linear-gradient(128deg, rgba(247, 247, 247, 1), rgba(247, 247, 247, 1));
    background-size: 100% 100%;
    padding-bottom: 4rem;
    padding-top: 15rem;
}

#section4 .content4 .itemSty {
    transition: all 500ms linear;
    cursor: pointer;
    border-radius: 0.375rem;
    overflow: hidden;
}

#section4 .content4 .itemSty:hover {
    box-shadow: 5px 9px 7px 1px rgba(0, 0, 0, 0.09);
}

#section5 {
    height: 16rem;
    width: 100%;
    background-image: linear-gradient(128deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), var(--section5-imgUrl);
    background-size: 100% 100%;
}

#section5 .top {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

#section5 .top .qrcode {
    width: 7rem;
    height: 7rem;
    background-color: #fff;
    border-radius: 0.375rem;
    padding: 1rem;
}


/* 移动端样式--------------------移动端样式--------移动端样式--------- */
.mobile-view #section0 .section0_con.w-56,
.mobile-view #section1>div.w-56,
.mobile-view #section2>div.w-56,
.mobile-view #section3 .content3 div.w-56,
.mobile-view #section4>div.w-56,
.mobile-view #section5 div.w-56 {
    width: 92%;
}

.mobile-view #section0 .header>div {
    font-size: 2rem !important;
}

.mobile-view #section0 .section0_con .con_warp {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    margin-top: -8rem;
    gap: 1rem 0;
}

.mobile-view #section0 .section0_con .con_warp>div {
    padding: 0;
}

.mobile-view #section0 .section0_con .con_warp>div:nth-child(2) {
    border-right: none;
}

.mobile-view #section0 .section0_con .introduce {
    flex-direction: column;
}

.mobile-view #section0 .section0_con .introduce .left {
    padding: 2rem;
}

.mobile-view #section0 .section0_con .introduce img {
    border-radius: 1rem;
    margin: 0 2rem 2rem;
    width: calc(100% - 4rem) !important;
}

.mobile-view #section1>div>div:nth-child(3) {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
}

.mobile-view #section2>div>div:nth-child(3) {
    grid-template-columns: repeat(1, 1fr);
}

.mobile-view #section3 .topHav img {
    height: 32vh;
    object-fit: cover;
}

.mobile-view #section3 .content3 .bottomCard {
    padding-left:1rem;
    padding-right:1rem;
    height: 19.78rem;
    margin-top: 2.375rem !important;
}
.mobile-view #section3 .content3 .bottomCard .flag{
    margin: 0.5rem 0;
}

.mobile-view #section3 .content3 .bottomCard .bottomCardCon {
    padding: 0 0 0 1.35rem;
}

.mobile-view #section4 .content4 .itemSty img {
    scale: 1.4;
}

.mobile-view #section5 .top>div>img,
.mobile-view #section5 .top .jt_qrcode {
    display: none;
}

.mobile-view #section5 .top .qrcodeWarp {
    gap: 0;
}