.about1 .video-box,

.about1 .video-box>video,

.about1 .video-box img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}









.about1 .btn-play {

    position: absolute;

    right: 4.688vw;

    bottom: 6.25vw;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}



.about2 {

    padding: 4.688vw 8.333vw 6.51vw 5.208vw;

}



.about2 .bar {

    padding: 0.625vw 1.302vw;

    font-size: 0.833vw;

    margin-left: 2.083vw;

    color: #000000;

    background: #F8F8F8;

    cursor: pointer;

    transition: all ease .3s;

}



.about2 .bar.on {

    background: #FFFFFF;

    color: #C11920;

    box-shadow: 0vw 0vw 20px rgba(0, 0, 0, 0.1);

}



.about2 .bar:hover {

    transform: scale(1.1);

    background: #FFFFFF;

    color: #C11920;

    box-shadow: 0vw 0vw 20px rgba(0, 0, 0, 0.1);

}



.about2 .bar i {

    margin-left: 0.625vw;

    font-size: 0.833vw;

}



.about2 .tab-content {

    padding-top: 3.125vw;

    position: relative;

    display: none;

}



.about2 .tab-content.on {

    display: flex;

}

.about2 .tab-content .pic {
    width: 58vw;
}

.about2 .tab-content .intr {

    padding: 2.604vw 2.396vw;

    background: #fff;

    position: absolute;

    right: 0;

    bottom: 0;

    width: 31.771vw;

    box-shadow: 0.521vw 0.521vw 1.042vw rgba(0, 0, 0, 0.07);

}



.about2 .tab-content .intr h2 {

    font-size: 1.458vw;

    color: #000000;

}



.about2 .tab-content .intr b {

    display: block;

    width: 1.719vw;

    height: 0.104vw;

    margin: 1.563vw 0 1.302vw;

    background: #C11920;

}



.about2 .tab-content li {

    font-size: 0.833vw;

    margin-bottom: 1.302vw;

    color: #3B3B3B;

    padding-left: 1.042vw;

    position: relative;

}



.about2 .tab-content li::before {

    content: '';

    display: inline-block;

    width: 0.417vw;

    height: 0.417vw;

    background: #C11920;

    border-radius: 50%;

    position: absolute;

    left: 0;

    top: 0.417vw;

}





.about3 {

    padding: 6.25vw 0 6.875vw;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;
    position: relative;

}



.about3 .C-title {

    margin-left: 5.208vw;

}

.about3 .control {
    width: 220px;
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translateX(-50%);
}


.about3 .imgbox {

    width: 4.271vw;

    height: 7.271vw;

    border-radius: 50%;

    margin: 4.167vw 0 4.688vw;

    position: relative;

}



.about3 .swiper-slide:nth-of-type(2n) {

    flex-direction: column-reverse;

}



.about3 .swiper-slide:nth-of-type(2n) .imgbox {

    margin: 4.688vw 4.167vw;

}



.about3 .imgbox .img-row {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background: #FFCBCD;

    border-radius: 50%;

    z-index: 5;

}



.about3 .imgbox>img {

    width: 18.229vw;

    position: absolute;

    bottom: 2.135vw;

    left: 1000vw;

    z-index: 1;

    opacity: 0;

    transition: opacity ease-out 0.4s;

}



.about3 .imgbox .img-row img {

    display: none;

    width: 30%;

    animation: zoom-in 1s alternate infinite;

}



@keyframes zoom-in {

    form {

        transform: scale(0.8);

    }



    to {

        transform: scale(1.2);

    }

}



.about3 .swiper-slide:nth-of-type(2n) .imgbox img {

    top: 2.135vw;

    bottom: auto;

}



/* .about3 .imgbox:hover img { */
.about3 .imgbox img {
    left: 50%;
    transform: translateX(-50%);
    opacity: 1;
}



.about3 .swiper-container {

    width: 100%;

    margin-top: 7.135vw;

    background-image: url('../image/Line.svg');

    background-size: 100vh auto;

    background-repeat: repeat-x;

    background-position: left;

    cursor: url("../image/Drag.png") 37 37, pointer !important;

    cursor: -webkit-image-set(url("../image/Drag.png") 1x, url("/img/Dragx2.png") 2x) 37 37, pointer !important
}



.about3 .swiper-slide .intr {

    padding-bottom: 4.688vw;

    width: 70%;

}



.about3 .swiper-slide:nth-of-type(2n) .intr {

    padding-top: 4.688vw;

    padding-bottom: 0;

}



.about3 .year {

    font-family: FZLanTingHeiS-R-GB;

    font-size: 3.542vw;

    color: #E5E5E5;

    font-weight: bold;

}




.about3 h2 {

    display: inline-block;

    font-size: 0.833vw;

    color: #000000;

    position: relative;

}



.about3 h2::before {

    content: '';

    display: inline-block;

    width: 0.313vw;

    height: 0.521vw;

    background: #C11920;

    position: absolute;

    left: -1.042vw;

    top: 0.313vw;

    transform: skew(-40deg);

}



.about3 p {

    font-size: 0.729vw;

    margin-top: 1em;

    color: #000000;

}



.about4 {

    padding: 7.292vw 5.208vw 4.688vw;

}



.about4 .bar {

    padding: 0.625vw 1.25vw;

    margin-left: 2.083vw;

    border-radius: 40px;

    background: #E9E7E7;

    font-size: 0.938vw;

    color: #3B3B3B;

    cursor: pointer;

}



.about4 .bar.on {

    color: #fff;

    background: #C11920;

}



.about4 .tab-content {

    display: none;

    padding-bottom: 5.208vw;

    position: relative;

}



.about4 .tab-content.on {

    display: block !important;

}



.about4 .tab-content .swiper-container {

    padding: 4.688vw 0 0;

}



.about4 .tab-content .swiper-slide {

    background: #F6F6F6;

    position: relative;

    transition: all ease .3s;

}



.about4 .tab-content .swiper-slide:hover {

    transform: translateY(-1.042vw);

    background: #fff;

    box-shadow: 0vw 0vw 20px rgba(0, 0, 0, 0.16);

}



.about4 .tab-content .pic {

    width: 100%;

    height: 22.083vw;

    padding: 0 2.083vw;

    display: flex;

    align-items: center;

    justify-content: center;

}



.about4 .tab-content .pic img {

    width: auto;

    max-width: 100%;

    max-height: 70%;

}



.about4 .tab-content .flag {

    position: absolute;

    right: 1.406vw;

    top: 0.729vw;

}



.about4 .tab-content .intr {

    padding: 0 1.563vw 1.823vw;

    position: relative;

}



.about4 .tab-content .swiper-slide .intr::after {

    content: '';

    display: block;

    width: 100%;



    opacity: 0;

    border-bottom: 5px solid #C11920;

    transition: all ease .3s;

    position: absolute;

    bottom: 0;

    left: 0;

}



.about4 .tab-content .swiper-slide:hover .intr::after {

    opacity: 1;

}



.about4 .tab-content .intr h3 {

    border-bottom: 1px solid #EBEBEB;

}



.about4 .tab-content .intr h3 i {

    font-size: 0.781vw;

    color: #A5A5A5;

    margin-bottom: 0.677vw;

    cursor: pointer;

}



.about4 .tab-content .intr h2 {

    font-size: 1.042vw;

    margin: 1.563vw 0 1.042vw;

    color: #000000;

    display: -webkit-box;

    display: box;

    overflow: hidden;

    text-overflow: ellipsis;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

}



.about4 .tab-content .intr p {

    font-size: 0.833vw;

    color: #666666;

    display: -webkit-box;

    display: box;

    overflow: hidden;

    text-overflow: ellipsis;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

}



.about4.swiper-red .control {

    position: absolute;

    left: 50%;

    transform: translateX(-50%);

    bottom: 0;

    display: flex;

    justify-content: space-between;

    align-items: center;

    width: 11.458vw;

}







.popup {

    position: fixed;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    background: #666666;

    z-index: 50;

    transition: all ease .8s;

    display: none;

}



.popup.open {

    display: flex;

}



.popup.transparent {

    background: rgba(0, 0, 0, 0.8);

}



.popup .close {

    position: absolute;

    right: 0;

    top: 0;

    width: 3.125vw;

    cursor: pointer;

    transition: all ease .6s;

}



.popup .close:hover {

    transform: scale(1.1);

}



.popup .close img {

    width: 100%;

}



.popup .pic {

    width: 45%;

    height: 80%;

}



.popup .pic img {

    width: auto;

    height: 100%;

    max-width: 100%;

    max-height: 100%;

}



.popup video {

    width: 100%;

    height: auto;

    max-width: 100%;

    max-height: 100%;

}



.about5 {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 6.927vw 0 11.25vw;

}



.about5 .main {

    width: 74.479vw;

    margin: 3.958vw auto 0;

    border-right: 1px solid #E4E4E4;

    border-bottom: 1px solid #E4E4E4;

}



.about5 .main li {

    width: calc(100% / 3);

    height: 18.229vw;

    padding: 3.438vw 4.896vw;

    border-left: 1px solid #E4E4E4;

    border-top: 1px solid #E4E4E4;

    background: rgba(0, 0, 0, 0.2);

    -webkit-backdrop-filter: blur(0.521vw);

    backdrop-filter: blur(0.521vw);

    transition: all ease .6s;

}



.about5 .main li:hover {

    background: rgba(255, 255, 255, 0.2);

}



.about5 .main li .pic {

    width: 4.375vw;

}



.about5 .main li h2 {

    font-size: 1.25vw;

    color: #FFFFFF;

    margin: 2.604vw 0 1.667vw;

}



.about5 .main li p {

    font-size: 0.833vw;

    color: #FFFFFF;

}





.about6 {

    padding: 5.885vw 0 7.292vw;

}



.about6 .main {

    margin: 0 auto;

    width: 78.646vw;

    position: relative;

}



.about6 .main .ev .pic {

    position: relative;

}



.about6 .main .swiper-container {

    padding: 4.271vw 0 0;

}



.about6 .main .ev .pic::after {

    content: '';

    display: block;

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    z-index: -1;

    background: #C11920;

    transition: all ease .3s;

    transform-origin: left bottom;

}



.about6 .main .ev:hover .pic::after {

    transform: rotate(-3deg) translateX(1.042vw);

}



.about6 .main .ev p {

    font-size: 0.938vw;

    margin-top: 1.042vw;

    font-weight: bold;

    color: #000000;

    display: -webkit-box;

    display: box;

    overflow: hidden;

    text-overflow: ellipsis;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

}



.about6 .main .ev p::before {

    content: '';

    display: inline-block;

    width: 0.521vw;

    height: 0.521vw;

    margin-right: 0.469vw;

    background: #C11920;

    border-radius: 50%;

}



.about6.swiper-red .control .prev {

    position: absolute;

    right: calc(100% + 1.563vw);

    top: 50%;

}



.about6.swiper-red .control .next {

    position: absolute;

    left: calc(100% + 1.563vw);

    top: 50%;

}



/*

*======================================================media===============================================================

*/

@media screen and (max-width:1919px) {}



@media screen and (max-width:1519px) {}



@media screen and (max-width:1366px) {}



@media screen and (max-width:1250px) {}



@media screen and (max-width:991px) {

    .about1 .btn-play {

        right: 90px;

        bottom: 120px;

    }



    .about2 {

        padding: 60px 5% 75px 5%;

    }



    .about2 .tab-bar {

        margin-top: 30px;

    }



    .about2 .bar {

        padding: 10px 20px;

        font-size: 14px;

        margin: 0 30px 10px 0;

    }



    .about2 .bar.on {

        box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);

    }



    .about2 .bar:hover {

        box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);

    }



    .about2 .bar i {

        margin-left: 12px;

        font-size: 16px;

    }



    .about2 .tab-content {

        padding-top: 40px;

    }



    .about2 .tab-content .pic {

        width: 100%;

    }



    .about2 .tab-content .intr {

        position: static;

        padding: 50px 46px;

        width: 100%;

        box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.07);

    }



    .about2 .tab-content .intr h2 {

        font-size: 26px;

    }



    .about2 .tab-content .intr b {

        width: 33px;

        height: 2px;

        margin: 10px 0 25px;

    }



    .about2 .tab-content li {

        font-size: 14px;

        margin-bottom: 25px;

        padding-left: 20px;

    }



    .about2 .tab-content li::before {

        width: 8px;

        height: 8px;

        top: 8px;

    }





    .about3 {

        padding: 60px 0 112px;

    }



    .about3 .C-title {

        margin-left: 5%;

    }



    .about3 .imgbox {

        width: 62px;

        height: 62px;

        margin: 140px 0 60px;

    }



    .about3 .swiper-slide:nth-of-type(2n) .imgbox {

        margin: 90px 140px;

    }



    .about3 .imgbox>img {

        width: 350px;

        bottom: 41px;

    }



    .about3 .imgbox .img-row img {

        width: 30%;

    }



    .about3 .swiper-slide:nth-of-type(2n) .imgbox img {

        top: 41px;

    }


    .about3 .swiper-container {

        margin-top: 87px;

    }



    .about3 .swiper-slide .intr {

        padding-bottom: 60px;

        width: 70%;

    }



    .about3 .swiper-slide:nth-of-type(2n) .intr {

        padding-top: 60px;

    }



    .about3 .year {

        font-size: 46px;

    }



    .about3 h2 {

        font-size: 16px;

    }



    .about3 h2::before {

        width: 6px;

        height: 10px;

        left: -20px;

        top: 6px;

        transform: skew(-40deg);

    }



    .about3 p {

        font-size: 14px;

    }



    .about4 {

        padding: 90px 5% 40px;

    }



    .about4 .bar {

        padding: 8px 20px;

        margin-left: 40px;

        border-radius: 40px;

        font-size: 14px;

    }



    .about4 .tab-content {

        padding-bottom: 80px;

    }



    .about4 .tab-content .swiper-container {

        padding: 60px 0 0;

    }



    .about4 .tab-content .swiper-slide:hover {

        transform: translateY(-20px);

        box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.16);

    }



    .about4 .tab-content .pic {

        height: 324px;

        padding: 0 40px;

    }



    .about4 .tab-content .flag {

        right: 27px;

        top: 14px;

    }



    .about4 .tab-content .intr {

        padding: 0 30px 35px;

    }



    .about4 .tab-content .swiper-slide .intr::after {

        border-bottom: 5px solid #C11920;

    }



    .about4 .tab-content .intr h3 i {

        font-size: 15px;

        margin-bottom: 13px;

    }



    .about4 .tab-content .intr h2 {

        font-size: 20px;

        margin: 30px 0 20px;

    }



    .about4 .tab-content .intr p {

        font-size: 16px;

    }



    .about4.swiper-red .control {

        width: 220px;

    }



    .popup .close {

        width: 60px;

    }



    .about5 {

        padding: 83px 5% 96px;

    }



    .about5 .main {

        width: 100%;

        margin: 76px auto 0;

    }



    .about5 .main li {

        width: calc(100% / 3);

        height: auto;

        padding: 36px 44px;

        -webkit-backdrop-filter: blur(10px);

        backdrop-filter: blur(10px);

    }



    .about5 .main li .pic {

        width: 50px;

    }



    .about5 .main li h2 {

        font-size: 18px;

        margin: 20px 0;

    }



    .about5 .main li p {

        font-size: 14px;

    }





    .about6 {

        padding: 83px 10% 90px;

    }



    .about6 .main {

        width: 100%;

    }



    .about6 .main .swiper-container {

        padding: 82px 0 0;

    }



    .about6 .main .ev:hover .pic::after {

        transform: rotate(-3deg) translateX(20px);

    }



    .about6 .main .ev p {

        font-size: 18px;

        margin-top: 20px;

    }



    .about6 .main .ev p::before {

        width: 10px;

        height: 10px;

        margin-right: 9px;

    }



    .about6.swiper-red .control .prev {

        right: calc(100% + 30px);

        top: 50%;

    }



    .about6.swiper-red .control .next {

        left: calc(100% + 30px);

    }

}



@media screen and (max-width:768px) {


    .popup .pic {

        width: 95%;

        height: 80%;

    }
    .popup .pic img {

        width: 100%;

        height: auto;

        max-width: 100%;

        max-height: 100%;

    }

    .about2 .tab-bar {
        justify-content: space-between;
    }

    .about2 .bar {
        text-align: center;
        font-size: 12px;

    }



    .about2 .tab-content .intr h2 {

        font-size: 20px;

    }



    .about2 .tab-content .intr {

        padding: 40px 36px;

    }



    .about2 .tab-content li {

        font-size: 13px;

        margin-bottom: 14px;

        padding-left: 20px;

    }



    .about4 .bar {

        margin-left: 21px;

        font-size: 12px;

    }



    .about5 .main {

        margin: 46px auto 0;

    }



    .about5 .main li {

        width: calc(100% / 2);

        padding: 36px 44px;

    }



    .about6 {

        padding: 83px 16% 40px;

    }



    .about6 .main .swiper-container {

        padding: 62px 0 0;

    }



    .about6.swiper-red .control .prev {

        right: calc(100% + 10px);

    }



    .about6.swiper-red .control .next {

        left: calc(100% + 10px);

    }



    .about6 .main .ev p {

        font-size: 15px;

        margin-top: 10px;

    }



    .about1 .btn-play {

        right: 40px;

        bottom: 40px;

    }



    .btn-play i {

        font-size: 30px;

    }



    .btn-play i::after {

        width: 60px;

        height: 60px;

    }

    .about2 .bar {
        width: 48%;
        padding: 10px 0;
        font-size: 14px;
        margin: 0 0 10px 0;
    }

}



@media screen and (max-width:480px) {




    .about5 .main li {

        padding: 36px 24px;

    }



    .about4 .bar {

        margin-left: 5px;

    }



    .about4.swiper-red .control {

        width: 140px;

    }

}