.body {
    background: #000;
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}

.core1 {
    padding: 13.104vw 0 19.5vw;
}

.core1 .C-title h2 {
    font-size: 4.667vw;
}

.core1 .C-title p {
    max-width: 60.052vw;
    margin: 3.75vw auto 0;
    text-align: left;
    letter-spacing: 0.104vw;
}

.core2 {
    width: 68vw;
    margin: 0 auto 6.771vw;
    padding: 6.302vw 0 0;
    border-radius: 11.97917vw;
    background: rgba(255, 255, 255, 0.13);
    border: 0.26042vw solid rgba(230, 232, 255, 0.54);
}

.core2-A {
    width: 37.292vw;
    margin: 0 auto;
}

.core2-A .circular {
    position: relative;
    z-index: 2;
}

.core2-A .circular>.pic:nth-of-type(1) {
    width: 100%;
}

.core2-A .circular>.pic:nth-of-type(2) {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    animation: rotateCircular 10s linear infinite;
}

.core2-A .circular>.pic:nth-of-type(3) {
    width: 19.458vw;
    position: absolute;
    left: 65%;
    top: 72%;
    animation: ani-skew 3s ease infinite alternate;
}

@keyframes ani-skew {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(0.521vw, -0.521vw);
    }
}

.core2-A .circular .content-box {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.core2-A .circular .content-box .pic:nth-of-type(1) {
    width: 8.25vw;
    margin-top: -3.8vw;
    animation: scaleCircular linear 3s 0.4s alternate infinite;
}

.core2-A .circular .content-box .pic:nth-of-type(2) {
    width: 17.1vw;
    margin-top: -1.604vw;
    animation: scaleCircular linear 3s 0.8s alternate infinite;
}

.core2-A .circular .content-box .pic:nth-of-type(3) {
    width: 26.042vw;
    margin-top: -1.604vw;
    animation: scaleCircular linear 3s 1.2s alternate infinite;
}

@keyframes scaleCircular {
    0% {
        transform: scale3d(1,1,1);
    }

    100% {
        transform: scale3d(0.9,0.9,0.9);
    }
}

@keyframes rotateCircular {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.core2-A .disc {
    width: 37.292vw;
    margin: -11.542vw auto 0;
    position: relative;
    z-index: 1;
}

.core2-B {
    width: 35.729vw;
    margin: 3.854vw auto 0;
}

.core2-C {
    width: 36vw;
    margin: 18.646vw auto 20.625vw;
    position: relative;
}

.core2-C .center-pic {
    animation: rotateCircular 30s linear infinite;
}
.core2-C .center-pic-child{
    position:absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 38%;
}
.core2-C .core2-C-main {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    animation: rotateCircular 30s linear infinite;
}

.core2-C .ev {
    width: 12vw;
    position: absolute;
    animation: rotateCircular 30s reverse linear infinite;
}

.core2-C .ev .pic {
    width: 100%;
}

.core2-C .ev:nth-of-type(2n-1) .pic {
    animation: rotateCircular 10s linear  infinite;
}

.core2-C .ev:nth-of-type(2n) .pic {
    animation: rotateCircular 15s linear reverse infinite;
}

.core2-C .ev .intr {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    font-size: 1.1vw;
    color: #FFFFFF;
    letter-spacing: 0.052vw;
    text-align: center;
}

.core2-C .ev em {
    display: block;
    width: 6.198vw;
    margin: 0.156vw 0;
    border-bottom: 0.15625vw solid #FFFFFF;
}


.core3 {
    width: 68vw;
    margin: 0 auto 3.646vw;
    padding: 6.354vw 0 11.667vw;
    border-radius: 14.58333vw;
    background: rgba(255, 255, 255, 0.03);
    border: 0.26042vw solid rgba(230, 232, 255, 0.54);
}

.core3 .core3-main-pic {
    width: 24.979vw;
}

.core3 .core3-main-pic img {
    width: 100%;
}

.core3 .core3-main {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.core3 .core3-main .ev {
    width: 12.854vw;
    position: absolute;
}

.core3 .core3-main .ev .intr {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 17.708vw;
    text-align: center;
}

.core3 .core3-main .ev .intr::before {
    content: '';
    display: block;
    width: 1.146vw;
    height: 1.771vw;
    margin: 0 auto 0.521vw;
    background: url('../images/core3-3.png') no-repeat center/contain;
    animation: ani-down 1s linear infinite alternate;
}

.core3 .core3-main .ev .intr p {
    font-size: 0.85vw;
    font-weight: 400;
    color: #FFFFFF;
}

.core3 .core3-main .ev .pic {
    animation: ani-down 3s linear infinite alternate;
}

.core3 .core3-main .ev.left .pic {
    transform: rotateY(180deg);
    animation: ani-downB 3s linear infinite alternate;
}

@keyframes ani-down {
    0% {
        transform: translateY(-0.521vw);
    }

    100% {
        transform: translateY(0vw);
    }
}

@keyframes ani-downB {
    0% {
        transform: translateY(-0.521vw) rotateY(180deg);
    }

    100% {
        transform: translateY(0vw) rotateY(180deg);
    }
}

.core4 {
    width: 68vw;
    margin: 0 auto 3.646vw;
    padding: 5.625vw 0 0vw;
    border-radius: 11.97917vw;
    background: rgba(130, 140, 156, 0.22);
    border: 0.26042vw solid rgba(230, 232, 255, 0.54);
}

.core4 .title {
    width: 46.563vw;
    margin: 0 auto;
}

.core4 .title img {
    width: 100%;
}

.core4 .main {
    margin: 3.906vw 0 0;
}

.core4 .main .ev {
    margin-bottom: 3.188vw;
}

.core4 .main .ev .pic {
    width: 5.81vw;
    height: 5.01vw;
}

.core4 .main .ev .pic img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}

.core4 .main .ev .intr {
    width: 43.438vw;
    margin-left: 2.125vw;
}

.core4 .main .ev h2 {
    font-size: 1.367vw;
    margin-bottom: 0.521vw;
    color: #FFFFFF;
    letter-spacing: 0.156vw;
}

.core4 .main .ev p {
    font-size: 1.02vw;
    line-height: 2;
    color: #C6C6C6;
    letter-spacing: 0.052vw;
}

/* 
*======================================================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) {

    .core1 {
        padding: 97px 0 24px;
    }

    .core1 .C-title h2 {
        font-size: 80px;
    }

    .core1 .C-title p {
        max-width: 80%;
        margin: 36px auto 0;
        letter-spacing: 2px;
    }

    .core2 {
        width: 90%;
        margin: 0 auto 65px;
        padding: 61px 0 0;
        /* border-radius: 230px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core2-A {
        width: 550px;
    }

    .core2-A .circular>.pic:nth-of-type(3) {
        width: 350px;
        left: 50%;
        top: 72%;
    }

    @keyframes ani-skew {
        0% {
            transform: translate(0, 0);
        }

        100% {
            transform: translate(5px, -5px);
        }
    }

    .core2-A .circular .content-box .pic:nth-of-type(1) {
        width: 110px;
    }

    .core2-A .circular .content-box .pic:nth-of-type(2) {
        width: 228px;
        margin-top: -25px;
    }

    .core2-A .circular .content-box .pic:nth-of-type(3) {
        width: 346px;
        margin-top: -25px;
    }

    .core2-A .disc {
        width: 90%;
        margin: -130px auto 0;
    }

    .core2-B {
        width: 535px;
        margin: 37px auto 0;
    }

    .core2-C {
        width: 430px;
        margin: 179px auto 198px;
    }

    .core2-C .ev {
        width: 153px;
    }

    .core2-C .ev .intr {
        font-size: 14px;
        letter-spacing: 1px;
    }

    .core2-C .ev em {
        display: block;
        width: 60px;
        margin: 3px 0;
        border-bottom: 1px solid #FFFFFF;
    }


    .core3 {
        width: 90%;
        margin: 0 auto 35px;
        padding: 61px 0 112px;
        /* border-radius: 280px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core3 .core3-main-pic {
        width: 355px;
    }

    .core3 .core3-main .ev {
        width: 181px;
    }

    .core3 .core3-main .ev .intr {
        width: 170px;
    }

    .core3 .core3-main .ev .intr::before {
        width: 11px;
        height: 17px;
        margin: 0 auto 5px;
    }

    .core3 .core3-main .ev .intr p {
        font-size: 12px;
        display: -webkit-box;
        display: box;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    @keyframes ani-down {
        0% {
            transform: translateY(-5px);
        }

        100% {
            transform: translateY(0px);
        }
    }

    @keyframes ani-downB {
        0% {
            transform: translateY(-5px) rotateY(180deg);
        }

        100% {
            transform: translateY(0px) rotateY(180deg);
        }
    }

    .core4 {
        width: 90%;
        margin: 0 auto 35px;
        padding: 54px 0 0px;
        /* border-radius: 230px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core4 .title {
        width: 100%;
    }

    .core4 .title img {
        width: 100%;
    }

    .core4 .main {
        margin: 38px 0 0;
    }

    .core4 .main .ev {
        margin-bottom: 69px;
    }

    .core4 .main .ev .pic {
        width: 75px;
        height: 87px;
    }

    .core4 .main .ev .intr {
        width: 513px;
        margin-left: 30px;
    }

    .core4 .main .ev h2 {
        font-size: 16px;
        margin-bottom: 5px;
        letter-spacing: 2px;
    }

    .core4 .main .ev p {
        font-size: 12px;
    }
}

@media screen and (max-width:768px) {
    .core1 .C-title h2 {
        font-size: 60px;
    }

    .core2-A {
        width: 95%;
    }

    .core2-A .circular>.pic:nth-of-type(3) {
        width: 50%;
        left: 60%;
        top: 72%;
    }

    @keyframes ani-skew {
        0% {
            transform: translate(0, 0);
        }

        100% {
            transform: translate(5px, -5px);
        }
    }

    .core2-A .circular .content-box .pic:nth-of-type(1) {
        width: 20%;
    }

    .core2-A .circular .content-box .pic:nth-of-type(2) {
        width: 40%;
        margin-top: -17px;
    }

    .core2-A .circular .content-box .pic:nth-of-type(3) {
        width: 60%;
        margin-top: -17px;
    }

    .core2-A .disc {
        width: 90%;
        margin: -86px auto 0;
    }

    .core2-B {
        width: 353px;
        margin: 37px auto 0;
    }

    .core2-C {
        width: 284px;
        margin: 118px auto 131px;
    }

    .core2-C .ev {
        width: 101px;
    }

    .core2-C .ev .intr {
        font-size: 12px;
        letter-spacing: 1px;
    }

    .core2-C .ev em {
        display: block;
        width: 40px;
        margin: 3px 0;
        border-bottom: 1px solid #FFFFFF;
    }


    .core3 {
        width: 90%;
        margin: 0 auto 15px;
        padding: 26px 0 49px;
        /* border-radius: 280px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core3 .core3-main-pic {
        width: 234px;
    }

    .core3 .core3-main .ev {
        width: 119px;
    }

    .core3 .core3-main .ev .intr {
        width: 112px;
    }

    .core3 .core3-main .ev .intr::before {
        width: 7px;
        height: 11px;
        margin: 0 auto 5px;
    }

    .core3 .core3-main .ev .intr p {
        font-size: 12px;
        font-weight: normal;
    }

    @keyframes ani-down {
        0% {
            transform: translateY(-5px);
        }

        100% {
            transform: translateY(0px);
        }
    }

    @keyframes ani-downB {
        0% {
            transform: translateY(-5px) rotateY(180deg);
        }

        100% {
            transform: translateY(0px) rotateY(180deg);
        }
    }

    .core4 {
        width: 90%;
        margin: 0 auto 23px;
        padding: 36px 0 0px;
        /* border-radius: 230px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core4 .title {
        width: 100%;
    }

    .core4 .title img {
        width: 100%;
    }

    .core4 .main {
        margin: 25px 0 0;
    }

    .core4 .main .ev {
        margin-bottom: 46px;
    }

    .core4 .main .ev .pic {
        width: 50px;
        height: 57px;
    }

    .core4 .main .ev .intr {
        width: 339px;
        margin-left: 20px;
    }

    .core4 .main .ev h2 {
        font-size: 16px;
        margin-bottom: 5px;
        letter-spacing: 2px;
    }

    .core4 .main .ev p {
        font-size: 12px;
    }
}

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

    .core1 .C-title h2 {
        font-size: 40px;
    }

    .core2-A .circular .content-box .pic:nth-of-type(1) {
        width: 20%;
    }

    .core2-A .circular .content-box .pic:nth-of-type(2) {
        width: 40%;
        margin-top: -12px;
    }

    .core2-A .circular .content-box .pic:nth-of-type(3) {
        width: 60%;
        margin-top: -12px;
    }

    .core2-A .disc {
        width: 90%;
        margin: -86px auto 0;
    }

    .core2-B {
        width: 233px;
        margin: 24px auto 0;
    }

    .core2-C {
        width: 187px;
        margin: 78px auto 86px;
    }

    .core2-C .ev {
        width: 67px;
    }

    .core2-C .ev .intr {
        font-size: 12px;
        letter-spacing: 1px;
        transform: scale(0.7);
    }

    .core2-C .ev em {
        display: block;
        width: 26px;
        margin: 3px 0;
        border-bottom: 1px solid #FFFFFF;
    }


    .core3 {
        width: 90%;
        margin: 0 auto 10px;
        padding: 17px 0 32px;
        /* border-radius: 280px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core3 .core3-main-pic {
        width: 154px;
    }

    .core3 .core3-main .ev {
        width: 79px;
    }

    .core3 .core3-main .ev .intr {
        width: 74px;
        transform: translate(-50%, -50%) scale(0.7);
    }

    .core3 .core3-main .ev .intr::before {
        width: 5px;
        height: 7px;
        margin: 0 auto 3px;
    }

    .core3 .core3-main .ev .intr p {
        font-size: 12px;
        font-weight: normal;
    }

    @keyframes ani-down {
        0% {
            transform: translateY(-5px);
        }

        100% {
            transform: translateY(0px);
        }
    }

    @keyframes ani-downB {
        0% {
            transform: translateY(-5px) rotateY(180deg);
        }

        100% {
            transform: translateY(0px) rotateY(180deg);
        }
    }

    .core4 {
        width: 90%;
        margin: 0 auto 15px;
        padding: 24px 0 0px;
        /* border-radius: 230px; */
        border: 2px solid rgba(230, 232, 255, 0.54);
    }

    .core4 .title {
        width: 100%;
    }

    .core4 .title img {
        width: 100%;
    }

    .core4 .main {
        margin: 17px 0 0;
    }

    .core4 .main .ev {
        margin-bottom: 30px;
    }

    .core4 .main .ev .pic {
        width: 33px;
        height: 38px;
    }

    .core4 .main .ev .intr {
        width: 224px;
        margin-left: 13px;
    }

    .core4 .main .ev h2 {
        font-size: 14px;
        margin-bottom: 5px;
        letter-spacing: 2px;
    }

    .core4 .main .ev p {
        font-size: 12px;
    }
}