@charset "utf-8";

@font-face {
    font-family: 'MiSans Latin Normal';
    src: url('../2024/products/fonts/MiSansLatin-Normal.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.WfPage #content{
    max-width: 100%;
}
.WfPage #newheader,#course,#customer{
    zoom: 2.4;
}
.WfPage .product-js,.WfPage .logo-box{
    zoom: 1;
}
/* frame */
.clear{
    clear: both;
}
a {
    transition: all 0.5s;
}

body {
    font-weight: 400;
    background: transparent;
    font-size: 20px;
}

.clear {
    clear: both;
}

#content {
    overflow: hidden;
    zoom: 1;
    padding: 0;
}

.row {
    width: 500px;
    margin: auto;
    position: relative;
}

.inner {
    /* max-width: 1200px; */
    /* margin: 0 auto; */
    /* min-width: 1200px; */
}

#header ,.WfPage .pageBanner{
    display: none;
}

#newheader {
    background: url(images/phonebanner.jpg) center top no-repeat;
    padding: 40px 0;
    background-size: cover;
    
}

#newheader .topbox {
    display: flex;
    padding: 0 2%;
}

#newheader .topbox .logo {
    background: url(/content/main/2019/images/logo.png) center no-repeat;
    background-size: 100%;
    width: 143px;
    height: 30px;
    text-indent: -999em;
}

#newheader .product_link,
#newheader .logo-dy {
    width: 90px;
    height: 24px;
    line-height: 24px;
    border: 1px solid rgba(238, 238, 238, 0.3);
    border-radius: 50px;
    color: #fff;
    text-align: center;
    font-size: 9px;
}

#newheader .product_link {
    margin: auto 0 auto auto;
}

#newheader .product_link:hover,
#newheader .logo-dy:hover {
    background: #0038e3;
}

#newheader .logo-dy {
    margin: auto 0 auto 10px;
}

#newheader .msg-box {
    display: block;
    text-align: center;
    margin-top: 66px;
}

#newheader .msg-box .p1 {
    height: 40px;
    margin: auto;
    font-size: 40px;
    color: #ffffff;
    font-weight: 900;
    line-height: 30px;
}

#newheader .msg-box .p2 {
    font-size: 24px;
    line-height: 1.8;
    color: #ffffff;
    text-align: center;
    font-weight: 900;
    font-family: '黑体';
    letter-spacing: 10px;
}

#newheader .msg-box .p3 {
    font-size: 10px;
    margin: 5px 0 30px;
    text-align: center;
    color: #fc0;
    letter-spacing: 3px;
}
.product-js {
    width: 470px;
    height: auto;
    z-index: 9;
    padding: 20px;
    background-color: rgba(90, 90, 90, 0.5);
    border-radius: 30px 0 30px 0;
    margin: auto;
}

.product-js .p1 {
    font-size: 20px;
    line-height: 28px;
    color: #ffffff;
    margin: 0;
    font-weight: 900;
}

.product-js .p2 {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.8;
    letter-spacing: 0px;
    color: #ffffff;
    margin-top: 8px;
    text-indent: 2em;
}
.modular_title,.rowTi h2{
    /* height: 36px; */
    line-height: 36px;
    font-size: 24px;
    color: #333;
    margin-bottom: 20px;
    text-align: center;
    font-weight: 700;
}
.rowTi p{
    font-size: 14px;
	text-indent:2em;
	margin:10px
}
.WfPage #modular{
    padding: 2%;
    margin: 0;
}
.WfPage #modular img{
    width: 100%;
}
#translate .tips2 {
    text-align: center;
    margin-top: 30px;
    color: #777;
    font-size: 14px;
}

#translate .tips2 a {
    text-decoration: underline
}

#modular .ts{
    font-size: 14px;
    margin: 0 0 20px; 
    text-align: center;
    color: red;
    display: none;
}
.WfPage #translate{
    margin: 10px 0;
    padding: 2%;
}
#translate .translate_ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px 10px;
}
#translate .translate_ul li{
    text-align: center;
}
.function_box{
    background: url(images/function_bg.jpg) top center no-repeat;
    padding: 30px 0;
    background-size: cover;
}
#function{
    padding: 2%;
}
.fun_list{
    display: grid;
    grid-template-areas: "l1 l1 l2 l3"
    "l4 l5 l6 l7";
    border-radius: 10px;
    overflow: hidden;
}
.fun_list .li1{
    grid-area: l1;
}
.fun_list .li2{
    grid-area: l2;
}
.fun_list .li3{
    grid-area: l3;
}
.fun_list .li4{
    grid-area: l4;
}
.fun_list .li5{
    grid-area: l5;
}
.fun_list .li6{
    grid-area: l6;
}
.fun_list .li7{
    grid-area: l7;
}

.fun_list li{
    background-color: #fff;
    text-align: center;
    cursor: pointer;
}
.fun_list li .num{
    font-size: 38px;
    color: #005DD8;
    font-weight: 700;
    margin: 0 0 0px;
    line-height: 40px;
}
.fun_list li .num span{
    font-size: 14px;
    color: #005DD8;
    font-weight: 700;
    line-height: 0;
    position: relative;
    top: -16px;

}
.fun_list li .tit{
    line-height: 32px;
    font-size: 14px;
    font-weight: 700;
}
.fun_list li div{
    padding: 10px 0;
}
.fun_list li.on{
    background: linear-gradient(to right bottom,#3AB2FE,#2668FF);
}
.fun_list .li1.on div{
    background: url(images/fun_icon.png) 0 0 no-repeat;
}
.fun_list .li2.on div{
    background: url(images/fun_icon1.png) 0 0 no-repeat;
}
.fun_list .li3.on div{
    background: url(images/fun_icon2.png) 0 0 no-repeat;
}
.fun_list .li4.on div{
    background: url(images/fun_icon3.png) 0 0 no-repeat;
}
.fun_list .li5.on div{
    background: url(images/fun_icon4.png) 0 0 no-repeat;
}
.fun_list .li6.on div{
    background: url(images/fun_icon5.png) 0 0 no-repeat;
}
.fun_list li.on .num,.fun_list li.on .num span,.fun_list li.on .tit{
    color: #fff;
}
.fun_message{
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.6);
}
.fun_message ul{
    display: none;
}
.fun_message ul.on{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px 10px;
}
.fun_message ul li{
    height: 36px;
    line-height: 36px;
    border-radius: 5px;
    background-color: #fff;
    font-size: 14px;
    text-align: center;
}
.fun_message ul li.small{
    font-size:11px;
}
.fun_message ul li a{
	display:block;
	background: url(/content/main/img/linkico.png) no-repeat 95%;
    padding: 0 3%;
    height: 100%;
	}
.fun_message ul li:hover{
    background-color: #005DD8;
    color: #fff;
}
.fun_message ul li a:hover{
	color:#ff0
}
.fun_message .extend.on{
    grid-template-columns: 1fr;
}
.fun_message .extend li{
    padding: 9px 10px;
    height: auto;
    text-align: left;
}
.fun_message .extend li h3{
    height: 20px;
    line-height: 20px;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 3px;
}
.fun_message .extend li p{
    font-size: 12px;
    line-height: 1;
}
.fun_message .extend li p em,.fun_message .extend li p span{
    float: left;
    line-height: 24px;
}
.fun_message .extend li p em{
    font-style: normal;
    margin: 0 10px;
}
#framework{
    padding: 30px 0 0;
}
.framework_box{
    background: url(images/solt_bg.png) center 50px no-repeat;
    height: 200px;
    position: relative;
    margin-bottom: 50px;
    background-size: 100%;
}
.framework_box li{
    width: auto;
    position: absolute;
    display: flex;
}
.framework_box li .left_box{
    width: 32px;
    float: left;
    position: relative;
    top: 1px;
}
.framework_box li .left_box i{
    display: block;
    width: 32px;
    height: 32px;
    background: url(images/round_icon.png) center no-repeat;
}
.framework_box li .left_box .line{
    width: 1px;
    background: url(images/line_bg.png) center no-repeat;
    position: absolute;
    left: 12px;
    top: 21px;
}
.framework_box .li1{
    left: 25px;
    top: 185px;
}
.framework_box .li2{
    top: 150px;
    left: 80px;
}

.framework_box .li3{
    left: 140px;
    top: 116px;
}
.framework_box .li4{
    left: 194px;
    top: 80px;
}
.framework_box .li5{
    left: 248px;
    top: 45px;
}
.framework_box .li6{
    left: 302px;
    top: 9px;
}
.framework_box li .right_box{
    float: right;
    display: flex;
}
.framework_box li .right_box .date{
    height: 30px;
    line-height: 30px;
    width: 94px;
    overflow: hidden;
    border-radius: 30px;
    background: linear-gradient(to right,#3AB2FE,#005DD8);
    display: flex;
}
.framework_box li .right_box .date p{
    height: 28px;
    line-height: 28px;
    width: 92px;
    background-color: #fff;
    text-align: center;
    margin: auto;
    border-radius: 30px;
    font-size: 14px;
    color: #005DD8;
    font-weight: 700;
}
.framework_box li .right_box .tit{
    margin-top: 8px;
    font-size: 14px;
    color: #005DD8;
    margin: auto 0 auto 10px;
}
.framework_p{
    line-height:1.8;
    text-indent: 2em;
    font-size: 16px;
	margin-bottom: 12px;
}
#advantage{
    padding: 30px 0;
}
.advantage_box .hd ul,.sparkle_box .hd ul{
    display: grid;
    grid-template-columns:  1fr 1fr;
    grid-gap: 10px 10px;
    margin-bottom: 20px;
}
.advantage_box .hd ul li{
    height: 55px;
    border: 1px solid #BBCEE5;
    border-radius: 10px;
    background: linear-gradient(to right,#F9FCFF,#EFF5FF);
}
.advantage_box .hd ul li p{
    height: 55px;
    line-height: 55px;
    padding-left: 115px;
    color: #005DD8;
    font-size: 20px;
    font-weight: 700;   
}
.advantage_box .hd ul li.on{
    background: linear-gradient(to right,#3AB2FE,#2668FF);
}
.advantage_box .hd ul li.on p{
    color: #fff;
}
.advantage_box .hd ul .li1 p{
    background: url(images/advantage1_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li2 p{
    background: url(images/advantage2_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li3 p{
    background: url(images/advantage3_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li4 p{
    background: url(images/advantage4_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li5 p{
    background: url(images/advantage5_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li6 p{
    background: url(images/advantage6_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li7 p{
    background: url(images/advantage7_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li8 p{
    background: url(images/advantage8_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li9 p{
    background: url(images/advantage9_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li10 p{
    background: url(images/advantage10_off.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li1.on p{
    background: url(images/advantage1_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li2.on p{
    background: url(images/advantage2_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li3.on p{
    background: url(images/advantage3_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li4.on p{
    background: url(images/advantage4_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li5.on p{
    background: url(images/advantage5_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li6.on p{
    background: url(images/advantage6_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li7.on p{
    background: url(images/advantage7_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li8.on p{
    background: url(images/advantage8_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li9.on p{
    background: url(images/advantage9_on.png) 50px 50% no-repeat;
}
.advantage_box .hd ul .li10.on p{
    background: url(images/advantage10_on.png) 50px 50% no-repeat;
}
.advantage_box .bd li p,.sparkle_box .bd li p{
    font-size: 16px;
    text-indent: 2em;
	margin-bottom: 12px;
}
.advantage_box .bd li .pic{
    text-align: center;
    margin-top: 20px;
}
.advantage_box .bd li .pic img{
    width: auto;
}
.sparkle{
    padding: 30px 0;
}
.sparkle_box .hd ul li{
    padding: 10px;
    border-radius: 10px;
    background: linear-gradient(to bottom, #EAF4FF, #fff);
    border: 1px solid #BBCEE5;
    display: flex;
}
.sparkle_box .hd ul li p{
    margin: auto;
}
.sparkle_box .hd ul li.on{
    background: linear-gradient(to bottom, #3AB2FE, #2668FF);
    color: #fff;
}
.sparkle_box .pic{
    margin-bottom: 20px;
    text-align: center;
}
.sparkle_box .pic img{
    width: auto;
}
#apply{
    padding: 30px 0;
    background: url(images/syqdhy_bg.png) 30px 30px no-repeat;
    background-size: 45%;
}
.apply_title{height: 40px;line-height: 40px;font-size: 20px;color: #333;font-weight: 700;margin-bottom: 15px;}
#apply .swiper-container{margin-top: 45px;}
#apply .swiper-container .pic{overflow: hidden;/*height: 109px;*/}
#apply .swiper-container .pic img{width: 100%;height: auto;}
#apply .swiper-slide{border-radius: 10px;overflow: hidden;}
.apply_p{line-height: 1.8;   font-size: 16px;color: #999;text-indent: 2em;}
.apply_link{text-align:center;margin:10px 0 30px;}
.apply_link a{font-size:16px;color: #005DD8;border: #d4d4d4 solid 1px;display: inline-block;/* background: #f0f0f0; */padding: 10px 30px;border-radius: 30px;transition: 0.5s;}
.apply_link a:hover{background:#0E49A8; color:#fff; font-weight:bold;}

.apply_con{padding: 20px 20px 45px;background-color: #F6F6FB;position: relative;}
.apply_con h3{line-height: 30px;font-size: 24px;font-weight: 700;margin-bottom: 20px;}
.apply_con p{line-height: 1.8;   font-size: 16px;color: #666666;   text-indent: 2em;}
.apply_con img{position: absolute;bottom: 15px;left: 20px;}
.apply_con .img_on{display: none;}
.apply_con ul li,.apply_con ul li a{font-size:14px;line-height:28px;text-align: center;margin-bottom: 5px;}
.apply_con ul li{border: #fcc solid 1px;}

#apply .marck_box{transition: all 0.5s;position: absolute;left: 0;right: 0;top: 0;height: 0px;background-color: #E7A525;overflow: hidden;}
#apply .marck_box .con_box{padding: 20px;}
#apply .marck_box .con_box h3{line-height: 30px;font-size: 20px;font-weight: 700;margin-bottom: 20px;color: #fff;}
#apply .marck_box .con_box p{line-height: 26px;font-size: 16px;color: #fff;text-align: justify;}
#apply .marck_box .con_box a{display: flex;width: 145px;height: 32px;border: 1px solid #fff;border-radius: 50px;position: absolute;bottom: 65px;}
#apply .marck_box .con_box a span{font-size: 12px;color: #fff;margin: auto 5px auto auto;}
#apply .marck_box .con_box a img{width: 20px;margin: auto auto auto 5px;}
#apply .swiper-slide:hover .marck_box{height: 369px;}


#course .text-box p{font-size: 16px;margin-bottom: 20px;text-indent: 2em;}
.course_box{background: url(images/historybg_s.jpg) center top no-repeat #fff;}
.course_ul{width: 1px;height: auto;padding: 30px 0;margin: auto;position: relative;/* background-color: #C4C4C4; */}
.course_ul li{position: relative;width: 11.7rem;margin-top: 0.7rem;}
.course_ul li .icon{position: absolute;height: 9px;width: 30px;}
.course_ul li .icon i{position: absolute;display: block;width: 9px;height: 9px;background-color: #517BB6;border-radius: 50%;display: none;}
.course_ul li .icon em{position: absolute;display: block;width: 12px;height: 1px;border-bottom: #517BB6 1px dashed;}
.course_ul li .msg-box .time{font-weight: 700;font-size: 1rem;line-height: 23px;color: #fff;/* margin-bottom: 10px; */font-family:"MiSans Latin Normal";}
.course_ul li .msg-box .text{font-weight: 400;font-size: 0.78rem;line-height: 1.8;color: #fff;text-align: justify;word-break: break-all;opacity: .8;}
.course_ul li .msg-box .text_right{text-align: right;}
.course_ul li .msg-box .text_left{text-align: justify;}
.course_ul .course_left .icon{right: 2px;top: 7px;}
.course_ul .course_left .icon i{right: 0;}
.course_ul .course_left .icon em{top: 4px;left: -2px;}
.course_ul .course_left .msg-box{text-align: right;padding-right: 2.4rem;}
.course_ul .course_left{left: -10.86rem;width: 11.7rem;}
.course_ul .course_right .icon{left: 2px;top: 7px;}
.course_ul .course_right .icon i{left: 0;}
.course_ul .course_right .icon em{top: 4px;left: 18px;}
.course_ul .course_right .msg-box{text-align: left;padding-left: 2.4375rem;margin-top: -2.4375rem;}
.course_ul .course_right{left: -10px;}
.course_ul .course_left .msg-box .text { text-align:right}

.course_ul.future {height: 58px;padding: 146px 0;}
.course_ul.future .course_right .icon {top:6px;}
.course_ul.future li .msg-box .text { font-size:16px; font-weight:bold; color:#546785;}
.course_ul.future li .msg-box .time{ display:none; }
.course_ul.future li .icon em{border-bottom: #c3c3c3 1px dashed;opacity: 1;}
.course_ul.life {padding: 30px 0 60px;}

.course_ul.prelife {padding: 50px 0 50px;height: 1180px;}
.course_ul.prelife li {margin-top: 0.3em;}
.course_ul.prelife li .msg-box .text { color:#546785;}
.course_ul.prelife li .msg-box .time{ color:#0E49A8;}
.course_ul.prelife li .icon em{border-bottom: #c3c3c3 1px dashed;opacity: 1;}

#customer{padding: 30px 0;background: url(images/dq_bg.png) center top no-repeat;background-color: #F8FAFF;}
#customer .p1{font-size: 15px;color: #005DD8;font-weight: 700;text-align: center;margin-bottom: 15px;}
#customer .p2{font-size: 12px;text-align: center;margin-bottom: 40px;}

.customer_ul{overflow: hidden;width: 100%;}
.customer_ul .swiper-wrapper{display: flex;width: 100%;}
.customer_ul li{border-radius: 10px;margin: auto 0;}
.customer_ul li img{width: auto;border-radius: 10px;display: block;margin: auto;}
.customer_ul li p{font-size: 14px;color: #666;line-height:1.8;margin-bottom: 30px;}
.customer_ul li h3{margin: 30px 0;text-align: center;font-size: 16px;font-weight: 700;}
.customer_ul li span{display: block;width: 50%;height: 32px;line-height: 32px;background-color: #2C5DDF;color: #fff;font-size: 10px;font-weight: 700;text-align: center;border-radius: 10px;display: block;margin: auto;}



.lxss{padding: 50px 0;display: flex;}
.lxss a{width: 200px;height: 60px;border-radius: 30px;text-align: center;line-height: 60px;font-size: 18px;color: #fff;font-weight: 700;background: url(images/lx-icon.png) 36px 50% no-repeat #22468C;text-indent: 50px;display: block;margin: auto 10px auto auto;}
.lxss .sq{background: url(images/tymk-icon.png) 25px 50% no-repeat #22468C;background-size: 14%;text-indent: 40px;margin: auto auto auto 10px;}

.sild_left{overflow: hidden;max-width: 1920px;margin:  20px auto 0px;}
.sild_right{overflow: hidden;max-width: 1920px;margin: auto;}
.sild_left li,.sild_right li{width: 180px;height: 70px;margin-right: 20px;display:flex;background-color: #FFFFFF;border-radius: 10px;box-shadow: 0px 5px 10px #eaefff;}
.sild_left li img,.sild_right li img{margin: auto;width: auto;}
.sild_left .bd ul,.sild_right .bd ul{height: 80px;}
.morecase{height: 50px;line-height: 50px;text-align: center;clear: both;text-align: center;display: block;margin-top: 75px;}
.morecase a{font-size: 16px;color: #2C5DDF;}

@media only screen and (min-width: 800px){
    #apply .swiper-button-prev{width: 17px;height: 11px;background: url(images/prev_icon_off.png);top: 38px;right: 55px;left: auto;background-size: 100%;}
    #apply .swiper-button-next{width: 17px;height: 11px;background: url(images/next_icon_off.png);top: 38px;right: 0;left: auto;background-size: 100%;}
    #apply .swiper-button-prev:hover{background: url(images/prev_icon_on.png);background-size: 100%;}
    #apply .swiper-button-next:hover{background: url(images/next_icon_on.png);background-size: 100%;}
}
@media only screen and (max-width: 600px){
	#apply .swiper-container{width: 72%;}
    #apply .swiper-button-next,#apply .swiper-button-prev{top: 71%;}
    .WfPage #newheader{
        zoom: 1;
        padding: 38px 2% 20px;
    }
    #course,#customer{
        zoom: 1;
    }
    #newheader .msg-box{
        margin: 0;
        padding-top: 40px;
    }
    .row{
        width: 100%;
    }
    .product-js{
        width: 90%;
        padding: 5%;
    }
    #translate .translate_ul{
        grid-template-columns: 49% 49%;
        grid-gap: 2% 2%;
        padding-bottom: 120px;
    }
    #translate .translate_ul li img{
        width: 100%;
    }
    #translate .translate_ul li p{
        font-size: 14px;
    }
    #framework,#advantage,#sparkle,#apply,#customer{
        padding: 20px 2%;
    }
    #course .text-box{padding: 0 2%;}
    .advantage_box .hd ul li p{
        background-size: 24px!important;
        background-position-x: 25px!important;
        font-size: 18px;
        padding-left: 68px;
    }
    .advantage_box .bd li .pic img {
        width: 55%;
    }
    .sparkle_box .hd ul li p{font-size: 16px;}
    .apply_con{/*padding: 10px 10px 40px;*/}
    .apply_con img{/*left: 10px;bottom: 15px;*/}
    .customer_ul{overflow: hidden;}
    .customer_ul .swiper-wrapper{
        width: 100%;
        margin: auto;
    }
    .customer_ul li{
        width: 100%;
        padding: 0;
        background-color: #fff;
    }
    .customer_ul li a{
        display: block;
        width: 100%;
    }
    .customer_ul li span{width: 100%;}
    .customer_ul .li2{margin: 0;}
    .morecase{margin-top: 45px;}
    .lxss a{
        width: 155px;
        height: 48px;
        line-height: 48px;
        font-size: 14px;
        background-size: 24px!important;
    }
    .framework_box .li1{
        left: 49px;
        top: 195px;
    }
    .framework_box .li2{
        top: 155px;
        left: 71px;
    }
    
    .framework_box .li3{
        left: 92px;
        top: 119px;
    }
    .framework_box .li4{
        left: 117px;
        top: 80px;
    }
    .framework_box .li5{
        left: 139px;
        top: 45px;
    }
    .framework_box .li6{
        left: 161px;
        top: 9px;
    }
    #modular .ts,#header{display: block;}
    #apply .swiper-slide:hover .marck_box{height: 340px;}
    #newheader .topbox{display: none;}
    #apply .marck_box .con_box a{bottom: 40px}

}