
@charset 'UTF-8';
@font-face{
    font-family: 'Alibaba PuHuiTi';
    src: url('./fonts/AlibabaPuHuiTi-3-55-Regular.ttf');
}
*{
    margin: 0;
    padding: 0;
}
a{
    text-decoration: none;
    color: #fff;
}
html,body{
    width: 100%;
    height: 100%
}
html{overflow-x: hidden; overflow-y:auto;}
.headerIframe{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    background-color: rgba(255, 255, 255, 0);
}
.banner{
    width: 100%;
    height: 9rem;
}
.swiper-container,.swiper-wrapper,.swiper-slide{
    width: 100%;
    height: 100%;
}
.imgSlide2{
    background:  no-repeat center center;
    position: relative;
    transition: 2s;
}
.imgSlide2:hover{
    /* transform: scale(1.01); */
}
.imgSlide2{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
}
.serviceBox{
    width: 100%;
    height: 1.8rem;
    background: url('../img/index/形状\ 3\ 拷贝\ 7@2x.png') center center;
    background-size: 100% 100%;
    margin: 2.1rem 0 2.33rem ;
    position: relative;
}
.serviceBoxCircularParent{
    width: 1.6rem;
    height: 1.4rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    position: absolute;
}
.serviceBoxCircular{
    width: .8rem;
    height: .8rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color:#0C2B8C;
    opacity: 1;
    position: relative;
}
.serviceBoxCircularBox{
    position: absolute;
    top: -0.1rem;
    left: .3rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #2A8AFC;
    animation:  widthAnimation 2s infinite linear ;
}
@keyframes widthAnimation {
    0% {
        opacity: 1;
    }
    12.5%{
        opacity: 0.75;
    }
    25% {
        opacity: 0.5;
    }
    37.5%{
        opacity: 0.25;
    }
    50% {
        opacity: 0;
    }
    62.5%{
        opacity: 0.25;
    }
    75% {
        opacity: 0.5;
    }
    87.5%{
        opacity: 0.75;
    }
    100% {
        opacity: 1;
    }
}
.serviceBoxCircularImg{
    position: absolute;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index: 2;
}
.serviceBoxCircularText{
    font-size: .18rem;
    font-family: 'Alibaba PuHuiTi';
    font-weight: 400;
    color: #333333;
    line-height: .3rem;
    text-align: center;
    opacity: 1;
}
.titleDiv{
    margin: .8rem auto 2.1rem;
    font-size: .36rem;
    /* font-family: "PingFang SC"; */
    font-weight: 100;
    color: #333333;
    line-height: .6rem;
    text-align: center;
}
.chooseBox{
    width: 11.63rem;
    height: 1.18rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
}
.chooseBoxSquare{
    width: 2.71rem;
    height: 1.18rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #F6F6F6;
}
.chooseBoxSquareImg{
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-left: .5rem;
}
.chooseBoxSquareText{
    font-size: .18rem;
    font-family: "Alibaba PuHuiTi";
    font-weight: bold;
    color: #333333;
    line-height: .28rem;
    margin-right: .45rem;
}
.threeRegulation{
    width: 6rem;
    height: 3.4rem;
    margin: 1.6rem auto 0;
    background-image: url('../img/index/三方监管.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.contentParent{
    width: 100%;
    height: 2.28rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.contentChild{
    width: 4.62rem;
    height: .68rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.line{
    width: 1.25rem;
    height: .02rem;
    background-color: #2A1481;
}
.slash{
    width: .73rem;
    height: .01rem;
    background-color: #2A1481;
    transform: rotate(110deg);
    position: absolute;
}
.leftSlash{
    left: .89rem;
}
.rightSlash{
    left: 3rem;
}
.titleBox{
    width: 2.12rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    text-align: center;
}
.enBox{
    font-size: .28rem;
    font-family: "Alibaba PuHuiTi";
    font-weight: 400;
    color: #000000;
}
.engBox{
    font-size: .14rem;
    font-family: "Arial";
    font-weight: 400;
    color: #666666;
}
.freeParent{
    width: 100%;
    height: 11.07rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.leftFree{
    width: 25%;
    height: 4rem;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}
.leftFreeHead{
    font-size: .32rem;
    font-family: "Alibaba PuHuiTi";
    font-weight: 400;
    color: #111111;
    line-height: .48rem;
}
.leftFreeBody{
    font-size: .16rem;
    font-family:Alibaba PuHuiTi;
    font-weight: 400;
    color: #666666;
    line-height: .4rem;
}
.list{
    width: 100%;
    height: .38rem;
}
.list ul{
    list-style-type: none;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.list li{
    margin-left: .16rem;
    margin-top: .1rem;
}
.list li:first-child{
    margin-left: 0;
}
.btn{
    display: block;
    width: 1.3rem;
    height: .38rem;
    line-height: .38rem;
    text-align: center;
    border: .01rem solid #2A1481;
    border-radius: .08rem;
    cursor: pointer;
}
.btn,.btn:hover{
    color: #2A1481;
    text-decoration: none;   
}
.rightFree{
    width: 5.4rem;
    height: 10.2rem;
    /* display: flex;
    flex-direction: column;
    flex-wrap: wrap-reverse;
    justify-content: center;
    align-items: baseline; */
}
.platformParent{
    width: 2.6rem;
    height: 2.69rem;
    background: #FFFFFF;
    box-shadow: 0px .02rem .7rem 0px rgba(0, 0, 0, 0.07);
    border-radius: .04rem;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    font-family: "Alibaba PuHuiTi";
    color: #666666;
    line-height: .24rem;
    cursor: pointer;
    transition: all 1s;
}
.platformParent div{
    transition: all 1s;
}
.platformParent:hover{
    transform: rotateY(180deg);
}
.platformParent:hover div{
    transform: rotateY(-180deg);
}
.platImg{
    width: .5rem;
    height: .45rem;
    margin-top: .31rem;
}
.platText{
    font-size: .18rem;
    font-weight: bold;
}
.platBox{
    width: 2.03rem;
    height: .87rem;
    font-size: .14rem;
    font-weight: 400;
    margin-bottom: .37rem;
}
.bottomContent{
    width: 100%;
    height: 4rem;
    background: url("../img/products/首页1.png") no-repeat  bottom center;
    background-size: 100% 100%;
    display: flex;
    justify-content: space-around;
}
.bottomBox{
    width: 5.15rem;
    height: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}
.imgBox{
    width: .8rem;height: .8rem;text-align: center;line-height: .8rem;
    font-size: .6rem;
    color: #fff;
    font-weight: bold;
}
.numberBox{
    font-size: .6rem;
    font-family: "Alibaba PuHuiTi";
    font-weight: bold;
    color: #FFFFFF;
    line-height: .6rem;
}
.textBox{
    font-size: .28rem;
    /* font-family: "PingFang SC"; */
    font-weight: 300;
    color: #FFFFFF;
    line-height: .6rem;
}
.platActive{
    color: #fff;
    background-color: #2A1481;
}
.platImgActive{
    background-color: #fff;
}
.iframeActive{
    background-color: rgba(255, 255, 255, 1);
}
.btnActive,.btnActive:hover{
    background-color: #2A1481;
    color: #fff !important;
}
.footerIframe{
    width: 100%;
    height: 1.36rem;
}
/* 
2024 05 15
*/
.imgSlide2{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}
.banner4Title{
    width: 100%;
    text-align: center;color: #333;letter-spacing: .08rem;box-sizing: border-box;
    margin-top: .47rem;
    font-family: Alibaba PuHuiTi;
    font-weight: 400;
    font-size: .4rem;
    color: #2C2B2B;
    line-height: 1;
}
.banner4Box{
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.banner4Left{
    /* width: 1.7rem;
    margin-left: 1.38rem; */
    width: 3.08rem;
    padding-left: 1.38rem;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    position: relative;
}
.banner4Right{
    /* width: 1.7rem;
    margin-right: 1.38rem;*/
    width: 3.08rem; 
    padding-right: 1.38rem;
    height: 100%; 
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    position: relative;
}
.listDiamond{
    width: 1.7rem;
    height: .45rem;
    background-image: url('../img/index/4/diamond.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .18rem;
    letter-spacing: .05rem;
    text-align: center;
    color: #3174F5;
    box-sizing: border-box;
}
.uploadArrowImg{
    height: .6rem;
    width: .3rem;
    animation: upwardLight 2s linear infinite;
}

@keyframes upwardLight {
    0% {
        transform: translateY(.7rem);
        opacity: 0;
    }
    50% {
        transform: translateY(.3rem);
        opacity: 0.5;
    }
    100% {
        transform: translateY(0rem);
        opacity: 1;
    }
}
.uploadArrowImg2{
    height: 1.2rem;
    width: .3rem;
    animation: upwardLight 2s linear infinite;
}

@keyframes upwardLight {
    0% {
        transform: translateY(1.4rem);
        opacity: 0;
    }
    50% {
        transform: translateY(.6rem);
        opacity: 0.5;
    }
    100% {
        transform: translateY(0rem);
        opacity: 1;
    }
}
.banner4Center{
    width: calc(100% - 7.36rem);
    height: 100%;
    position: relative;
}
.ellipse1Box{
    width: 11.01rem;
    height: 1.61rem;
    position: absolute;
    top: 2.36rem;
    left: calc(50% - 5.505rem);
    background-image: url('../img/index/4/ellipse1.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    z-index: 10;
}
.ellipse2Box{
    width: 100%;
    height: 1.53rem;
    position: absolute;
    top: 3.74rem;
    left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 9;
}
.ellipse2Line{
    width: 1.21rem;
    border-top: .01rem dashed #0046DC;
}
.ellipse2Container{
    width: 9.19rem;
    height: 1.85rem;
    background-image: url('../img/index/4/ellipse2.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
}
.ellipse3Blox{
    width: 100%;
    height: 1.28rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: absolute;
    top: 5.15rem;
    left: 0;
    z-index: 8;
}
.ellipse3Line{
    margin-top: .53rem;
    width: 1.85rem;
    border-top: .01rem dashed #0046DC;
}
.ellipse3Container{
    width: 6.78rem;
    height: 1.55rem;
    background-image: url('../img/index/4/ellipse3.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
}
.ellipse4Blox{
    width: 100%;
    height: 1.53rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: absolute;
    top: 5.91rem;
    left: 0;
    z-index: 6;
}
.ellipse4Line{
    margin-top: .81rem;
    width: 1.85rem;
    border-top: .01rem dashed #0046DC;
}
.ellipse4Container{
    width: 7.88rem;
    height: 1.53rem;
    background-image: url('../img/index/4/ellipse4.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.ellipse5Blox{
    width: 100%;
    height: 1.24rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: absolute;
    top: 7.08rem;
    left: 0;
    z-index: 5;
}
.ellipse5Line{
    margin-top: .53rem;
    width: 1.85rem;
    border-top: .01rem dashed #0046DC;
}
.ellipse5Container{
    width: 7.03rem;
    height: 1.24rem;
    background-image: url('../img/index/4/ellipse5.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
}
.ellipse1LeftArrow{
    width: .85rem;
    height: .93rem;
    background-image: url('../img/index/4/ellipseLeftArrow.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: calc(50% - 5.695rem);
    top: 2.04rem;
    z-index: 30;
}
.ellipse1RightArrow{
    width: 1.26rem;
    height: 1.15rem;
    background-image: url('../img/index/4/ellipseRightArrow.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: calc(50% + 4.565rem);
    top: 2.105rem;
    z-index: 30;
}
.ellipseCylinder1,.ellipseCylinder2,.ellipseCylinder3,.ellipseCylinder4,.ellipseCylinder5,.ellipseCylinder6{
    width: 1.56rem;
    height: 1.87rem;
    background-image: url('../img/index/4/ellipse1Cylinder.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}
.ellipseCylinder1{
    top: 1.45rem;
    left: calc(50% - 5.165rem );
    z-index: 23;
}
.ellipseCylinder2{
    top: 1.69rem;
    left: calc(50% - 3.765rem);
    z-index: 24;
}
.ellipseCylinder3{
    top: 1.81rem;
    left: calc(50% - 2.355rem);
    z-index: 25;
}
.ellipseCylinder4{
    top: 1.81rem;
    left: calc(50% + .8rem);
    z-index: 25;
}
.ellipseCylinder5{
    top: 1.69rem;
    left: calc(50% + 2.205rem);
    z-index: 24;
}
.ellipseCylinder6{
    top: 1.45rem;
    left: calc(50% + 3.605rem);
    z-index: 23;
}
.earthBox{
    width: 2.71rem;
    height: 1.87rem;
    position: absolute;
    top: 1.71rem;
    left: calc(50% - 1.355rem);
    z-index: 30;
    background-image: url('../img/index/4/ellipse1Centercircle.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .27rem;
    color: #314AE6;
    text-align: center;
    line-height: 1.87rem;
}
.earthLeft{
    width: .65rem;
    height: .44rem;
    background-image: url('../img/index/4/ellipseCenterArrowLeft.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: .43rem;
    left: .45rem;
}
.earthRight{
    width: .66rem;
    height: .43rem;
    background-image: url('../img/index/4/ellipseCenterArrowRight.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: 1.58rem;
    top: .88rem;
}
.ellipseCylinderImg{
    height: .6rem;
    width: auto;
    margin-top: -0.5rem;
    animation: moveUpAndDown 2s infinite cubic-bezier(0.25, 0.1, 0.25, 1);
}
@keyframes moveUpAndDown {
    0% { transform: translateY(0); }
    50% { transform: translateY(-0.05rem); }
    100% { transform: translateY(0); }
}

.ellipseCylinderTextTitle{
    width: 100%;
    text-align: center;
    font-family: Alibaba PuHuiTi;
    font-weight: bolder;
    font-size: .18rem;
    color: #314AE6;
    margin-top: .5rem;
    box-sizing: border-box;
    padding-right: 0.05rem;
}
.ellipseCylinderText{
    width: 100%;
    text-align: center;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .14rem;
    color: #314AE6;
    margin-top: .05rem;
    box-sizing: border-box;
    padding-right: 0.1rem;
}
.ellipse2LeftAndRight{
    width: 1.15rem;
    height: .33rem;
    background-image: url('../img/index/4/ellipse2LeftAndRight.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-family: Alibaba PuHuiTi;
    font-weight: 400;
    font-size: .16rem;
    color: #314AE6;
    position: absolute;
    text-align: center;
    line-height: .33rem;
}
.ellipse2Center{
    width: 1.2rem;
    height: .42rem;
    background-image: url('../img/index/4/ellipse2Center.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .2rem;
    color: #314AE6;
    position: absolute;
    text-align: center;
    line-height: 0rem;
}
.ellipse2ContainerLine{
    border-top: .01rem solid #314AE6;
    position: absolute;
}
.ellipse3GlareFilterBox{
    width: 1.04rem;
    height: 1.24rem;
    position: absolute;
    top: -0.4rem;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .21rem;
    color: #314AE6;
    text-align: center;
    padding-top: .85rem;
    box-sizing: border-box;
    background-image: url('../img/index/4/ellipse3GlareFilter.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    /* text-stroke: .003rem #FFFFFF; */
    /* -webkit-text-stroke: .003rem #FFFFFF; */
    text-shadow: 0 0 .005rem #FFFFFF;
}
.ellipse5LeftAndRight{
    width: 1.43rem;
    height: .43rem;
    background-image: url('../img/index/4/ellipse5Interior.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .16rem;
    color: #fff;
    position: absolute;
    text-align: center;
    line-height: .33rem;
}
.ellipse3GlareLine{
    width: 1.3rem;
    border-top: .01rem solid #314AE6;
    position: absolute;
    top: .68rem;
}
.ellipse3Glaredark{
    width: 1.39rem;
    height: .38rem;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .16rem;
    color: #fff;
    position: absolute;
    text-align: center;
    line-height: .38rem;
    background-color: #1a62e7;
    border-radius: 50%;
}
.ellipse3GlaredarkLine{
    border-top: .01rem solid #fff;
    position: absolute;
}
.ellipse4GlareFilterBox{
    width: 1.54rem;
    height: .84rem;
    position: absolute;
    font-family: Alibaba PuHuiTi;
    font-weight: bold;
    font-size: .24rem;
    color: #314AE6;
    text-align: center;
    padding-top: .45rem;
    box-sizing: border-box;
    background-image: url('../img/index/4/ellipse4GlareFilter.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    /* text-stroke: .005rem #FFFFFF; */
    /* -webkit-text-stroke: .005rem #FFFFFF; */
    text-shadow: 0 0 .005rem #FFFFFF;
}
.ellipse4Bg{
    width: 8.34rem;
    height: 1.94rem;
    position: absolute;
    top: 4.52rem;
    left: calc(50% - 4.17rem);
    background-image: url('../img/index/4/yaobu.png');
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
/* --- */