@import './iconfont/iconfont.css';

#scaleBox {
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}

.scrollbar::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
    height: 1px;
}
.scrollbar::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/
    border-radius: 10px;
    background: #BBCAD3;
}
.scrollbar::-webkit-scrollbar-track {
    /*滚动条里面轨道*/
    border-radius: 10px;
    background: #ededed;
}

.minw{
    min-width: 1220px;
}
.package{
    width: 1160px;
    padding-left: 30px;
    padding-right: 30px;
    margin-left: auto;
    margin-right: auto;
}
.header{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 68px;
    z-index: 99;
    background-color: #ffffff;
    border-bottom: 5px solid #14CEE2;
}
.header-left{
    margin-left: 62px;
}
.header-left .logo{
    width: 30px;
    height: 30px;
    margin-right: 19px;
}
.header-left .m_logo{
    display: none;
}
.header-right {
    margin-right: 92px;
}
.header-right .nav{
    margin-left: 40px;
}
.header-right .nav.active{
    color: #14CEE2;
}
.header-right a.nav:hover{
    text-decoration: underline;
}
.header-right .download{
    margin-right: 40px;
}
.header-right .language{
    display: none;
}
.header-right .language .sj{
    width: 0;
    height: 0;
    margin-left: 4px;
    border: 5px solid #ffffff;
    border-top-color: #000000;
    border-bottom: none;
}
.header .header-menu{
    display: none;
}

.pageMain{
    box-sizing: border-box;
    min-height: 100vh;
    padding-top: 73px;
    padding-bottom: 368px;
}

.footer{
    height: 440px;
    background-color: #F7FAFF;
    border-top: 5px solid #14CEE2;
    margin-top: -374px;
}
.footer-left{
    width: 440px;
    margin-left: 135px;
    margin-top: 72px;
    line-height: 1;
}
.footer-left .nav:hover{
    text-decoration: underline;
}
.footer-left .line{
    width: 1px;
    height: 14px;
    background: #909399;
    margin: 0 20px;
}
.footer-left .name{
    margin-top: 44px;
    margin-bottom: 16px;
    font-weight: 500;
}
.footer-left .address {
    margin-bottom: 15px;
}
.footer-left .link {
    margin-bottom: 46px;

}
.footer-left .href .linebox{
    margin-top: 10px;
}
.footer-left .href .line{
    margin: 0 10px;
}

.footer-right{
    width: 444px;
    margin-right: 42px;
    margin-top: 100px;
}
.footer-right .media{
    margin-bottom: 82px;
}
.footer-right .media .item{
    width: 30px;
    height: 30px;
    margin: 0 36px;
    background: #E4EEFF;
    border-radius: 50%;
}
.footer-right .media .item .iconfont{
    color: #000;
    font-size: 24px;
}
.footer-right .media .media-code{
    display: none;
    position: absolute;
    bottom: 100%;
    padding: 4px;
    transform: translate(0,-8px);
    background-color: #ffffff;
    border-radius: 4px;
    filter: drop-shadow(0px 0px 4px rgba(0,0,0,0.1));
}
.footer-right .media .media-code::after{
    content: '';
    position: absolute;
    left: 50%;
    bottom: -12px;
    transform: translate(-50%,0);
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-top-color: #ffffff;
}
.footer-right .media .media-code .code{
    margin: 0;
}
.footer-right .media .item .media-code .code{
    width: 200px;
    height: 200px;
}
.footer-right .media .item:hover .media-code{
    display: block;
}
.footer-right .code{
    display: block;
    width: 80px;
    height: 80px;
    margin-bottom: 10px;
}


.page-title{
    height: 130px;
    padding: 0 64px 0 56px;
    font-size: 60px;
    line-height: 1;
}
.page-title .dot1{
    left: 0;
    top: 0;
    width: 96px;
    height: 96px;
    background: #14CEE2;
    border-radius: 50%;
    opacity: 0.18;
}
.page-title .dot2{
    right: 25px;
    top: 78px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #14CEE2;
}
.page-title .line{
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(63deg, rgba(20,206,226,0) 0%, #14CEE2 53%, rgba(20,206,226,0) 100%);
    border-radius: 3px;
}


.bannerbox {
    height: 578px;
    background: no-repeat center/cover;
    overflow: hidden;
    color: #ffffff;
    line-height: 1;
}

.aboutbox{
    padding: 105px 0 204px;
    background-color: #ffffff;
}
.aboutbox-left{
    width: 744px;
    padding-top: 80px;
}
.aboutbox-left .info{
    font-size: 22px;
    line-height: 46px;
    padding-bottom: 40px;
}
.aboutbox-left .button{
    width: 145px;
    height: 46px;
    margin-top: 20px;
    background: #14CEE2;
    border-radius: 23px;
    color: #ffffff;
    font-size: 22px;
}
.aboutbox-left .button:hover{
    background: #44ecff;
}
.aboutbox-left .m_button{
    display: none;
}
.aboutbox-right {
    width: 280px;
    height: 571px;
    margin-top: 76px;
    background: url('../../img/index/phone.png') no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
}
.aboutbox-right .maskbox{
    user-select: none;
    width: 100%;
    height: 100%;
    mask-image: url('../../img/index/phone_mask.png');
    -webkit-mask-image: url('../../img/index/phone_mask.png');
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
    overflow: hidden;
}
.aboutbox-right .maskbox .swiper{
    width: 253px;
    height: 546px;
    margin-left: 14px;
    margin-top: 12px;
}

.swiper .swiper-pagination-bullet{
    width: 8px;
    height: 8px;
    margin: 0 7px;
    background-color: rgba(0,0,0,0.52);
}
.swiper .swiper-pagination-bullet-active{
    background: #31D1E3;
}


.servicebox {
    padding: 120px 0 231px;
    background: no-repeat center bottom;
    background-image: url('../../img/service/bg.png'),linear-gradient(180deg, rgba(222,237,255,0.99) 0%, rgba(240,245,255,0) 60%);
}

.servicebox-title {
    font-size: 60px;
    margin-bottom: 80px;
    color: #091E4C;
}

.servicebox-info {
    font-size: 22px;
    line-height: 46px;
}
.servicebox-list{
    padding-top: 80px;
}
.servicebox-list .list{
    width: 370px;
    color: #ffffff;
}
.servicebox-list .list .content{
    overflow: hidden;
    height: 532px;
    background: linear-gradient(180deg, #4E6AFE 0%, #173F8F 100%), linear-gradient(180deg, #4E6AFE 0%, #2F47C2 100%);
    /* background: linear-gradient(180deg, #4487F7 0%, #4E6AFE 100%); */
    box-shadow: 0px 2px 16px 0px rgba(21,64,117,0.16);
    border-radius: 30px;
}
.servicebox-list .list .content .mpic{
    display: none;
}
.servicebox-list .list .content .pic{
    width: 370px;
    height: 281px;
}
.servicebox-list .list .content .titbox{
    margin: 40px 0 44px;
}
.servicebox-list .list .content .titbox .title{
    font-size: 40px;
    line-height: 1;
    padding: 0 25px 7px 25px;
}
.servicebox-list .list .content .titbox .line{
    height: 21px;
    background: #377CFF;
    border-radius: 11px;
    z-index: 0;
}
.servicebox-list .list .content .info{
    font-size: 28px;
    line-height: 1;
}
.servicebox-list .list .content .info .mobile{
    display: none;
}
.servicebox-list .list .maskbox{
    display: none;
    background: #173f8ff5;
    color: #ffffff;
    font-size: 22px;
    border-radius: 30px;
}
.servicebox-list .list .maskbox .top .p{
    line-height: 1;
    margin-top: 28px;
}
.servicebox-list .list .maskbox .line{
    width: 324px;
    height: 3px;
    background: #377CFF;
    margin: 64px 0 47px;
}
.servicebox-list .list .maskbox .bottom{
    line-height: 40px;
}
.servicebox-list .list:hover .maskbox{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}


.jobbox {
    padding: 133px 0 166px;
    background-color: #ffffff;
}
.jobbox-title {
    margin-bottom: 110px;
}
.jobbox-list .list {
    overflow: hidden;
    width: 208px;
    height: 273px;
    border-radius: 15px;
    margin-bottom: 50px;
}
.jobbox-list .pic {
    display: block;
    width: 208px;
    height: 273px;
}
.jobbox-list .txt {
    font-size: 22px;
    line-height: 38px;
    bottom: 20px;
}

.flowsheetbox {
    padding: 130px 0;
    background: #F0F5FF url(../../img/flowsheet_bg.png) no-repeat center;
}
.flowsheetbox .package{
    width: 1180px;
    padding: 0 10px;
}
.flowsheetbox-title {
    font-size: 60px;
    line-height: 1;
    margin-bottom: 138px;
}
.flowsheetbox-list .list {
    width: 224px;
    padding-top: 42px;
}
.flowsheetbox-list .list .num {
    font-size: 59px;
    color: #C8D4FD;
    line-height: 59px;
}
.flowsheetbox-list .list .box {
    width: 224px;
    height: 224px;
    background: linear-gradient(270deg, rgba(206, 217, 255, 0) 0%, #C6D0F8 100%);
    border-radius: 31px;
}
.flowsheetbox-list .list .title {
    width: 224px;
    height: 59px;
    background: linear-gradient(180deg, #4487F7 0%, #4E6AFE 100%);
    box-shadow: 0px 2px 13px 0px rgba(21, 64, 117, 0.16), inset 2px 2px 0px 0px rgba(255, 255, 255, 0.29);
    border-radius: 30px;
    font-size: 23px;
    line-height: 25px;
    color: #FFFFFF;
}
.flowsheetbox-list .list .content {
    padding: 23px 0 0 25px;
    font-size: 15px;
    line-height: 39px;
}
.flowsheetbox-line {
    margin: 63px 96px 48px;
    height: 51px;
}
.flowsheetbox-line .line {
    height: 5px;
    margin: 0 10px;
    background: #E0E7FF;
    border-radius: 4px;
}
.flowsheetbox-line .icon {
    width: 51px;
    height: 51px;
}
.flowsheetbox-linenum{
    display: none;
}


.dynamicbox {
    padding: 138px 0 274px;
    background: linear-gradient(180deg, rgba(222,237,255,0.99) 0%, #F0F5FF 100%);;
}

.dynamicbox-title {
    font-size: 60px;
    line-height: 1;
    margin-bottom: 88px;
}

.dynamicbox-box {
    background: #FFFFFF;
    border-radius: 11px;
}
.dynamicbox .dynamicbox-more{
    display: none;
}
.dynamicbox-list {
    padding: 0 35px;
}

.dynamicbox-list .list {
    padding: 35px 0;
    border-bottom: 1px solid #EEEEEE;
    cursor: pointer;
}

.dynamicbox-list .cover {
    width: 200px;
    height: 138px;
    margin-left: 30px;
    border-radius: 8px;
    background: rgba(0, 0, 0, .3) no-repeat center/cover;
}
.dynamicbox-list .m_cover{
    display: none;
    background: rgba(0, 0, 0, .3) no-repeat center/cover;
}

.dynamicbox-list .title {
    /* font-size: 32px; */
    font-size: 26px;
    line-height: 36px;
    margin-bottom: 20px;
    font-weight: 600;
}

.dynamicbox-list .info {
    font-size: 22px;
    line-height: 40px;
    margin-bottom: 20px;
    color: #666666;
}

.dynamicbox-list .iconfont {
    font-size: 22px;
    line-height: 1;
    color: #666666;
}

.dynamicbox-list .time {
    font-size: 22px;
    line-height: 1;
    margin-left: 10px;
    color: #666666;
}
.dynamicbox-more{
    display: none;
}

@media (min-width: 601px) {
    .headerMenu{
        display: none;
    }
}
@media (max-width: 600px) {
    .minw{
        min-width: 100vw;
    }
    .package{
        width: 100vw;
        padding: 0;
    }
    .header{
        height: 13.0667vw;
        border-bottom: none;
        background: #EFF6FF;
    }
    .header .header-left{
        margin-left: 6.9333vw;
    }
    .header .header-left .logo{
        display: none;
    }
    .header-left .m_logo{
        display: block;
        width: 10.6667vw;
        height: 5.0667vw;
    }
    .header .header-left .slogn{
        display: none;
    }
    .header .header-right{
        display: none;
    }
    .header .header-menu{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .header-menu{
        position: relative;
        width: 9.6vw;
        height: 9.6vw;
        margin-right: 6.6667vw;
    }
    .header-menu .line,
    .header-menu:after, 
    .header-menu:before{
        width: 5.33333vw;
        height: 2px;
        background-color: #091E4C;
        
        -webkit-transition: top .3s,-webkit-transform .3s;
        transition: top .3s,-webkit-transform .3s;
        -o-transition: transform .3s,top .3s;
        transition: transform .3s,top .3s;
        transition: transform .3s,top .3s,-webkit-transform .3s;
    }
    .header-menu:after, 
    .header-menu:before{
        content: "";
        position: absolute;
        left: 2.13333vw;
    }
    .header-menu:before{
        top: 6.4vw;
    }
    .header-menu:after {
        top: 2.9333vw;
    }

    .header .header-menu .menu{
        font-size: 4.8vw;
        line-height: 1;
        font-weight: bold;
    }
    
    .headerMenu{
        /* display: block; */
        position: fixed;
        left: -9999px;
        top: -9999px;
        width: 100%;
        height: 100%;
        z-index: 99;
        background-color: rgba(255, 255, 255, 0);
        transition: backgroundColor .5s;
    }
    .headerMenu .top{
        height: 13.0667vw;
        padding: 0 0 3.7333vw 6.9333vw;
        background: #EFF6FF;
    }
    .headerMenu .logo{
        width: 10.6667vw;
        height: 5.0667vw;
    }
    .headerMenu .close{
        font-size: 4.8vw;
        line-height: 1;
        font-weight: bold;
    }
    .headerMenu .listbox{
        padding-top: 3.4667vw;
    }
    .headerMenu .listbox .nav{
        display: block;
        font-size: 4.8vw;
        padding-left: 6.9333vw;
        margin-bottom: 10.1333vw;
        font-weight: 600;
        
        transition: all .5s;
        opacity: 0;
        transform: translate(-20%,0);
    }
    .headerMenu .listbox .nav:nth-child(1){
        transition-delay: .1s;
    }
    .headerMenu .listbox .nav:nth-child(2){
        transition-delay: .2s;
    }
    .headerMenu .listbox .nav:nth-child(3){
        transition-delay: .3s;
    }
    .headerMenu .listbox .nav:nth-child(4){
        transition-delay: .4s;
    }
    .headerMenu .listbox .nav:nth-child(5){
        transition-delay: .5s;
    }
    .headerMenu .listbox .nav:nth-child(6){
        transition-delay: .6s;
    }
    .headerMenu .listbox .nav.active{
        color: #06b9cd;
    }
    .headerMenu .listbox .iconfont{
        margin-right: 3.2vw;
        font-size: 5.3333vw;
    }

    .pageMenuShow .header .header-menu{
        opacity: 0;
    }
    .pageMenuShow .headerMenu{
        left: 0;
        top: 0;
        background-color: rgba(255, 255, 255, 1);
    }
    .pageMenuShow .headerMenu .top{
        background: linear-gradient(180deg, #DEEDFF 0%, rgba(224,239,255,0) 100%);
    }

    .pageMenuShow .header-menu .line{
        -webkit-transform: scaleX(0);
                transform: scaleX(0);
    }
    .pageMenuShow .header-menu:before{
        top: 4.66667vw;
        -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
    }
    .pageMenuShow .header-menu:after {
        top: 4.66667vw;
        -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
    }
    .pageMenuShow .headerMenu .listbox .nav{
        opacity: 1;
        transform: translate(0,0);
    }

    .pageMain{
        padding-top: 13.0667vw;
    }

    .footer{
        height: auto;
    }
    .footer .package{
        display: block;
        padding: 9.3333vw 6.6667vw 16vw;
        box-sizing: border-box;
    }
    .footer-left{
        width: 100%;
        margin: 0;
        font-size: 3.7333vw;
        line-height: 1;
    }
    .footer-left .name{
        padding-bottom: 2.9333vw;
        border-bottom: 1px solid #DEE8F8;
        margin-top: 11.2vw;
        margin-bottom: 2.9333vw;
        font-size: 3.7333vw;
        font-weight: bold;
    }
    .footer-left .address{
        font-size: 3.2vw;
        margin-bottom: 2.9333vw;
    }
    .footer-left .link{
        font-size: 3.2vw;
        margin-top: 3.2vw;
        margin-bottom: 0;
    }
    .footer-left .href{
        margin-left: 0;
        margin-top: 5.3333vw;
        font-size: 3.2vw;
    }
    .footer-right{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;

        width: 100%;
        margin-right: 0;
        margin-top: 11.2vw;
        font-size: 2.6667vw;
    }
    .footer-right .code{
        width: 15.4667vw;
        height: 15.4667vw;
        margin-bottom: 1.3333vw;
    }
    .footer-right .media{
        margin-top: 13.6vw;
        margin-bottom: 0;
    }
    .footer-right .media .item{
        width: 8vw;
        height: 8vw;
        margin: 0 4.8vw;
    }
    .footer-right .media .item .media-code .code{
        width: 32vw;
        height: 32vw;
    }
    .footer-right .media .item .iconfont{
        font-size: 4.8vw;
    }
    .footer-right .media .media-code{
        filter: none;
        
        box-shadow: 0px .5333vw 1.0667vw 0px rgba(0,0,0,0.15);
    }
    .footer-right .media .item:hover .media-code{
        display: none;
    }
    .footer-right .media .item.active .media-code{
        display: block;
    }

    .page-title{
        height: 12.5333vw;
        padding: 0 4vw 0 4vw;
        font-size: 8vw;
    }
    .page-title .dot1{
        width: 9.2vw;
        height: 9.2vw;
    }
    .page-title .dot2{
        right: 1.3333vw;
        top: 7.4667vw;
        width: 1.8667vw;
        height: 1.8667vw;
    }
    .page-title .line{
        height: .5333vw;
        border-radius: .5333vw;
    }

    
    .bannerbox{
        height: 45.6vw;
    }

    .aboutbox{
        padding: 16vw 0 15.4667vw;
        background:#fdfdfe url(../../img/about/m_bg.png) no-repeat bottom/100% auto;
    }
    .aboutbox-title{
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .aboutbox .aboutbox-con{
        display: block;
    }
    .aboutbox-left{
        width: auto;
        background-color: #ffffff;
        border-radius: 1.6vw;
        padding: 4.2667vw 2.1333vw 0;
        margin: 10.6667vw 4vw 8vw;
        box-shadow: 0px .5333vw 2.1333vw 0px rgba(17,35,90,0.1);
    }
    .aboutbox-left .infobox{
        height: 50.4vw;
        padding: 0 3.7333vw;
        overflow: hidden;
        overflow-y: scroll;
    }
    .aboutbox-left.active .infobox{
        height: auto;
    }
    .aboutbox-left .info{
        font-size: 3.7333vw;
        line-height: 8vw;
        padding-bottom: 4vw;
    }
    .aboutbox-left .button{
        display: none;
    }
    .aboutbox-left.active .m_button{
        transform: rotate(180deg);
    }
    .aboutbox-left .m_button{
        display: block;
        width: 100%;
        height: 10.4vw;
        transition: all .3s;
    }
    .aboutbox-left .m_button .iconfont{
        width: 4.2667vw;
        height: 4.2667vw;
        background: #20242502;
        font-size: 3.4667vw;
        color: #31D1E3;
    }
    .aboutbox-right{
        margin: 0 auto;
        width: 40vw;
        height: 81.6vw;
    }
    .aboutbox-right .maskbox .swiper{
        width: 36.1333vw;
        height: 78vw;
        margin-left: 2.1333vw;
        margin-top: 1.8667vw;
    }

    .servicebox{
        padding: 16vw 0 14.9333vw;
        background:#ffffff url(../../img/service/m_bg.png) no-repeat bottom/100% auto;
    }
    .servicebox-title{
        font-size: 8vw;
        margin-bottom: 10.6667vw;
    }
    .servicebox-info{
        padding: 0 7.4667vw;
        font-size: 3.7333vw;
        line-height: 8vw;
    }
    .servicebox .servicebox-list{
        /* display: none; */
        display: block;
        padding: 1.3333vw 6vw 0;
    }
    .servicebox .servicebox-list .list{
        width: 100%;
        margin-top: 6.6667vw;
        opacity: 0;
        transform: translate(-10%, 0);
        transition-duration: .3s;
        transition-timing-function: linear;
        transition-delay: .1s;
    }
    .servicebox .servicebox-list .list.scrollShow{
        opacity: 1;
        transform: translate(0, 0);
        transition-property: all;
    }
    .servicebox-list .list .content{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;

        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        
        height: 31.2vw;
        border-radius: 3.2vw;
    }
    .servicebox-list .list:nth-child(1) .content,
    .servicebox-list .list:nth-child(3) .content{
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }
    .servicebox-list .list .content .conbox{
        padding-left: 5.3333vw;
    }
    .servicebox-list .list:nth-child(2) .content .conbox{
        padding-left: 0;
        padding-right: 5.3333vw;
    }
    .servicebox-list .list .content .pic{
        display: none;
    }
    .servicebox-list .list .content .mpic{
        display: block;
        width: 34.9333vw;
        height: 31.2vw;
    }
    .servicebox-list .list .content .titbox{
        margin: 5.3333vw 0;

        -webkit-box-pack: left;
        -ms-flex-pack: left;
        justify-content: left;
    }
    .servicebox-list .list:nth-child(2)  .content .titbox{
        -webkit-box-pack: right;
        -ms-flex-pack: right;
        justify-content: right;
    }
    .servicebox-list .list .content .titbox .title{
        font-size: 5.3333vw;
        padding: 0 3.2vw 1.0667vw 3.2vw;
    }
    .servicebox-list .list .content .titbox .line{
        height: 2.8vw;
        border-radius: 1.4667vw;
    }
    
    .servicebox-list .list .content .info{
        font-size: 4.2667vw;

        -webkit-box-pack: left;
        -ms-flex-pack: left;
        justify-content: left;
    }
    .servicebox-list .list .content .info .pc{
        display: none;
    }
    .servicebox-list .list .content .info .mobile{
        display: block;
        margin-bottom: 2.1333vw;
    }
    .servicebox-list .list .maskbox{
        display: none;
        position: initial;
        width: auto;
        height: auto;
        padding: 5.0667vw;
        border-radius: 3.2vw;
        font-size: 3.7333vw;
    }
    .servicebox-list .list:hover .maskbox{
        display: none;
    }
    .servicebox-list .list.active .maskbox{
        display: block;
    }
    .servicebox-list .list .maskbox .top .p{
        margin-bottom: 4vw;
        margin-top: 0;
    }
    .servicebox-list .list .maskbox .line{
        width: 100%;
        height: .2667vw;
        border-radius: 1px;
        margin:0 0 2.6667vw;
    }
    .servicebox-list .list .maskbox .bottom{
        display: block;
        line-height: 6.4vw;
    }
    .servicebox-list .list .maskbox .bottom>div{
        display: inline;
    }

    .jobbox{
        padding: 16vw 0 12vw;
    }
    .jobbox-title{
        margin-bottom: 10.6667vw;
    }
    .jobbox-title .page-title{
        font-size: 6vw;
    }
    .jobbox-listbox{
        width: 100vw;
        box-sizing: border-box;
        /* padding: 0 4vw; */
        overflow: hidden;
        overflow-x: scroll;
    }
    .jobbox-list {
        width: 137.6vw;
        padding: 0 4vw;
    }
    .jobbox-list .list{
        width: 25.6vw;
        height: 33.6vw;
        margin-bottom: 5.3333vw;
        border-radius: 1.6vw;
    }
    .jobbox-list .pic{
        width: 25.6vw;
        height: 33.6vw;
    }
    .jobbox-list .txt{
        font-size: 3.2vw;
        line-height: 3.7333vw;
        bottom: 3.2vw;
    }

    .flowsheetbox{
        padding: 16vw 0 16.5333vw;
    }
    .flowsheetbox .package{
        width: 100vw;
        padding: 0;
    }
    .flowsheetbox-title{
        font-size: 8vw;
        margin-bottom: 10.6667vw;
    }
    .flowsheetbox-con{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0 12vw;
    }
    .flowsheetbox .flowsheetbox-list{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;

        height: 61.3333vw;
        width: 29.3333vw;
    }
    .flowsheetbox-list .list{
        position: initial;
        width: 29.3333vw;
        padding: 0;
    }
    .flowsheetbox-list .list .num{
        display: none;
    }
    .flowsheetbox-list .list .box{
        position: initial;
        width: 29.3333vw;
        height: 8vw;
        background: none;
    }
    .flowsheetbox-list .list .title{
        position: relative;
        width: 29.3333vw;
        height: 8vw;
        box-shadow: 0px .2667vw 2.1333vw 0px rgba(21,64,117,0.16), inset .2667vw .2667vw 0px 0px rgba(255,255,255,0.29);
        border-radius: 3.8667vw;
        font-size: 3.2vw;
        z-index: 3;
    }
    .flowsheetbox-list .list .content{
        display: none;
        position: absolute;
        top: 3.4667vw;
        left: -1.8667vw;
        width: 31.7333vw;
        border-radius: 3.2vw;
        border: 1px solid #4B72FC;
        background-color: #ffffff;
        padding: 6.4vw 1.0667vw 2.9333vw;
        font-size: 3.2vw;
        line-height: 5.3333vw;
    }
    .flowsheetbox-list .list .content p{
        display: inline;
    }
    .flowsheetbox-list .list:hover .box{
        position: relative;
        z-index: 9;
    }
    .flowsheetbox-list .list:hover .content{
        display: none;
    }
    .flowsheetbox-list .list.active{
        position: relative;
        z-index: 9;
    }
    .flowsheetbox-list .list.active .content{
        display: block;
    }
    .flowsheetbox .flowsheetbox-line{
        display: none;
    }
    .flowsheetbox-linenum{
        display: block;
        padding-top: 1.3333vw;
    }
    .flowsheetbox-linenum .num{
        font-size: 5.3333vw;
        color: #C8D4FD;
        line-height: 1;
        font-weight: 600;
        text-shadow: 0px .2667vw 2.1333vw rgba(21,64,117,0.16), .2667vw .2667vw 0px rgba(255,255,255,0.29);
        background: linear-gradient(180deg, #4487F7 0%, #4E6AFE 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .flowsheetbox-linenum .line{
        width: 2px;
        height: 6.1333vw;
        background: linear-gradient(180deg, #4487F7 0%, #4E6AFE 100%);
        box-shadow: 0px .2667vw 2.1333vw 0px rgba(21,64,117,0.16), inset .2667vw .2667vw 0px 0px rgba(255,255,255,0.29);
        border-radius: 2.6667vw;
        opacity: 0.33;
        margin: 1vw 0;
    }


    .dynamicbox{
        padding: 16vw 0;
    }
    .dynamicbox-title{
        font-size: 8vw;
        margin-bottom: 8vw;
    }
    .dynamicbox-box{
        width: 94.6667vw;
        border-radius: 2.9333vw;
        margin: 0 auto;
    }
    .dynamicbox-list{
        padding: 0 4vw;
    }
    .dynamicbox-list .list{
        padding: 4vw 0;
        border-bottom-width: 1px;
    }
    .dynamicbox-list .list .cont{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .dynamicbox-list .cover{
        display: none;
    }
    .dynamicbox-list .m_cover{
        display: block;
        width: 29.8667vw;
        height: 20.5333vw;
        margin-left: 5.3333vw;
        border-radius: 2.1333vw;
    }
    .dynamicbox-list .title{
        font-size: 4.2667vw;
        line-height: 4.8vw;
        margin-bottom: 2.6667vw;
    }
    .dynamicbox-list .info{
        font-size: 3.2vw;
        line-height: 5.6vw;
        margin-bottom: 1.8667vw;
    }
    .dynamicbox-list .iconfont{
        font-size: 3.2vw;
        line-height: 1;
    }
    .dynamicbox-list .time{
        font-size: 3.2vw;
        margin-left: 1.6vw;
    }
    .dynamicbox .dynamicbox-more{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: 8vw;
        font-size: 3.2vw;
        line-height: 1;
        color: #151932;
    }
    .dynamicbox .dynamicbox-more .iconfont{
        font-size: 3.2vw;
        color: #14CEE2;
        margin-left: 1.6vw;
    }
}