.product{width: 100%;background-color: #fff}
.product .sub-banner .container h4{color: #fff;}
.product .sub-banner .container p{color:#fff;}
.pro{width: 100%;text-align: center}
.pro img{width:auto;max-width: 100%}
.solution{width: 100%}
.solution .sub-banner .container h4{color: #fff;}
.solution .sub-banner .container p{color:#fff;}
/*模板样式*/
.left{text-align:left!important;}
.center{text-align: center!important;}
.right{text-align: right!important}
.block{display: block!important;width: 100% !important}
.bold{font-weight: bold!important;}
.wp-100{width: 100%!important;}
.wp-90{width: 90%!important;}
.wp-85{width: 85%!important;}
.wp-80{width: 80%!important;}
.wp-75{width: 75%!important;}
.wp-70{width: 70%!important;}
.wp-65{width: 65%!important;}
.wp-60{width: 60%!important;}
.wp-55{width: 55%!important;}
.wp-50{width: 50%!important;}
.wp-45{width: 45%!important;}
.wp-40{width: 40%!important;}
.wp-35{width: 35%!important;}
.wp-30{width: 30%!important;}
.wp-25{width: 25%!important;}
.wp-20{width: 20%!important;}
.wp-15{width: 15%!important;}
.wp-10{width: 10%!important;}
.ai-ce{align-items: center}
.ai-fs{align-items: flex-start}
.p-5{padding: 5px 0!important;}
.p-10{padding: 10px 0!important;}
.p-20{padding: 20px 0!important;}
.p-30{padding: 30px 0!important;}
.p-40{padding: 40px 0!important;}
.p-50{padding: 50px 0!important;}
.p-60{padding: 60px 0!important;}
.p-80{padding: 80px 0!important;}
.p-100{padding: 100px 0!important;}
.m-b-0{margin-bottom:0!important;}
.m-b-5{margin-bottom:5px!important;}
.m-b-10{margin-bottom: 10px!important;}
.m-b-20{margin-bottom: 20px!important;}
.m-b-30{margin-bottom: 30px!important;}
.m-b-40{margin-bottom: 40px!important;}
.m-b-50{margin-bottom: 50px!important;}
.m-b-60{margin-bottom: 60px!important;}
.m-b-70{margin-bottom: 70px!important;}
.m-b-80{margin-bottom: 80px!important;}
.m-b-90{margin-bottom: 90px!important;}
.m-b-100{margin-bottom: 100px!important;}
.m-t-0{margin-top:0!important;}
.m-t-5{margin-top:5px!important;}
.m-t-10{margin-top: 10px!important;}
.m-t-20{margin-top: 20px!important;}
.m-t-30{margin-top: 30px!important;}
.m-t-40{margin-top: 40px!important;}
.m-t-50{margin-top: 50px!important;}
.m-t-60{margin-top: 60px!important;}
.m-t-70{margin-top: 70px!important;}
.m-t-80{margin-top: 80px!important;}
.m-t-90{margin-top: 90px!important;}
.m-t-100{margin-top: 100px!important;}
.p-left{left: 0;right: unset;}
.p-right{left:unset;right: 0;}
.padding-left-50{padding-left: 50px!important;}
.padding-right-50{padding-right: 50px!important;}
.padding-left-100{padding-left: 100px!important;}
.padding-right-100{padding-right: 100px!important;}
.padding-top-10{padding-top: 10px!important;}
.padding-top-20{padding-top: 20px!important;}
.padding-top-30{padding-top: 30px!important;}
.padding-top-40{padding-top: 40px!important;}
.padding-top-50{padding-top: 50px!important;}
.padding-top-100{padding-top: 100px!important;}
.padding-0{padding: 0!important;}
.padding-10{padding: 10px!important;}
.padding-20{padding: 20px!important;}
.padding-30{padding: 30px!important;}
.padding-40{padding: 40px!important;}
.padding-50{padding: 50px!important;}

.ul-1{flex-wrap:wrap!important;}
.ul-1 li{width: 100%!important;align-items: center!important;}
.ul-2{flex-wrap: wrap!important;}
.ul-2 li{width: 49%!important;}
.ul-3{flex-wrap: wrap!important;}
.ul-3 li{width: 32%!important;}
.ul-4{flex-wrap:wrap!important;}
.ul-4 li{width: 23.5%!important;}
.ul-5{}
.ul-5 li{width: 18.4%!important;}
.n-border{}
.n-border li{border: none!important;}
@media screen and (max-width: 991px){
    .ul-4 li{width: 100%!important;}
    .ul-5 li{width: 49%!important;}
}
/*颜色模板*/
.blue{color: #1b69c9}
.orange{color:#ff8500}
.blue-bg{
    background-image:-webkit-linear-gradient(45deg, var(--color-1), var(--color-3));
    background-image:linear-gradient(45deg, var(--color-1), var(--color-3));
    color: #fff;
    border-radius: 12px;
}
.orange-bg{
    background-image:-webkit-linear-gradient(0deg, #ff8500, #fab005);
    background-image:linear-gradient(0deg, #ff8500, #fab005);
    color: #fff;
    border-radius: 12px;
}
.border{border:4px solid #fff;padding:8px;
    -webkit-box-shadow: 2px 5px 10px rgb(0 0 0 / 10%);
    box-shadow: 2px 5px 10px rgb(0 0 0 / 10%);
}
.border-blue{
    border: 1px solid #dcebfa!important;
    box-shadow:0 5px 10px -1px rgba(18,105,255, 0.15)!important;
    -webkit-box-shadow:0 5px 10px -1px rgba(18,105,255, 0.15)!important;
}
.white-hr{border-top: 1px solid rgba(255,255,2550,0.5);padding-top:10px;margin-top: 10px;}
.pro-item{width: 100%;}
.pro-item-bg{background-color: #f7fafd}
.pro-item-bg2{background-color: #3889ed}
.pro-item h4{font-size: 40px;font-weight: 550;color: #212529;margin-bottom:50px;width: 100%;display: block}
.pro-item h5{font-size: 35px;font-weight: 550;text-align: left;margin-bottom: 20px;}
.pro-item h4 span{font-size: 18px;line-height:28px;color: #495057;padding-top: 10px;display: block;font-weight:350}
@media screen and (max-width: 991px){
    .pro-item h4{font-size:2rem;margin-bottom:20px;}
    .pro-item h4 span{font-size: 1.5rem;line-height:2.2rem;font-weight: 400}
    .pro-item h5{font-size:2rem;margin-bottom:10px;}
    .border{border:2px solid #fff;padding:3px;}
    .blue-bg{border-radius: 6px;}
    .orange-bg{border-radius: 6px;}
}
.text-img{width: 100%;}
.text-img .text{}
.text-img .text p{font-size: 18px;line-height: 30px;font-weight: 350;color: #495057;text-align: left}
.text-img .text h4.white{color: #fff!important;}
.text-img .text h5{font-size: 35px;font-weight: 650;text-align: left;line-height: 45px;margin-bottom: 10px;}
.text-img .text h6{font-size: 25px;font-weight: 650;text-align: left;line-height: 35px;margin-bottom: 10px;}
.text-img .img{position: relative;}
.text-img .img img{width:auto;max-width: 100%}
.text-img .img p{font-size: 18px;line-height: 30px;font-weight: 350;color: #495057;}
@media screen and (max-width: 991px){
    .text-img{flex-wrap: wrap;}
    .text-img .text,.text-img .img{margin-bottom: 20px;}
    .text-img .text p{font-size: 1.4rem;line-height:2.2rem;text-align: justify;font-weight: 400;margin-bottom:20px!important;}
    .text-img .text p b{display: block;margin-bottom:2px;font-size: 1.4rem;}
    .text-img .text h5{font-size: 2rem;line-height:2rem;margin-bottom:5px;}
    .text-img .text h6{font-size: 1.6rem;line-height: 2.2rem;}
    .text-img .img p{font-size: 1.4rem;line-height: 2.2rem;}
    .text-img .img img{height:auto!important;}
}

.image-container {position: relative;width: 90%;top:-100px;left: -150px;}
.back-image, .front-image {
    position: absolute;
    width: 100%;
    height: auto;
    border: 10px solid #fff;
    -webkit-box-shadow: 0 5px 10px rgb(190 196 207 / 30%);
    box-shadow: 0 5px 10px rgb(190 196 207 / 30%);
    transition: all 0.3s ease;
}
.back-image {z-index: 1;transform: translate(-50px, -50px);}
.front-image {z-index: 2;transform: translate(50px, 50px); }

.title-img-ul{align-items: center;}
.title-img-ul h4{font-size:25px;}
.title-img-ul .img{}
.title-img-ul .img p{font-size: 18px;line-height: 30px;font-weight: 350;color: #495057;}
.title-img-ul .pro-text-ul{}
.title-img-ul .pro-text-ul li{}
.title-img-ul .pro-text-ul li h6 a{color: #fff}
@media screen and (max-width: 991px){
    .title-img-ul{flex-wrap: wrap;text-align: center}
    .title-img-ul h4{font-size:2.2rem;width: 100% !important;}
    .title-img-ul .img{width: 100%!important;margin-bottom:20px!important;}
    .title-img-ul .img img{width: 150px;}
    .title-img-ul .img p{font-size:1.4rem;line-height: 2.2rem;}
    .title-img-ul .pro-text-ul li{margin: 0 auto!important;}
}

.pro-text-ul{width: 100%;flex-wrap: wrap;}
.pro-text-ul li{width: 23.5%;margin-bottom: 2%;border-radius:12px;border: 1px solid #ddd;}
.pro-text-ul li h6{font-size:18px;font-weight: 500;line-height:25px;padding: 10px 20px;min-height: 80px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap}
.pro-text-ul li h6 span{font-size: 14px;line-height: 22px;color: #fff;font-weight: 350;min-height:80px}
.pro-text-ul li p{padding: 20px;font-size: 16px;line-height: 26px;font-weight: 350;color: #495057; }
.pro-text-ul.ul-1 li h6{min-height: 120px}
.pro-text-ul.ul-1 li h6.min-h{height:90px;min-height:90px;}
.pro-text-ul.ul-1 li h6.sm-h{height:65px;min-height:65px;}
.pro-text-ul.ul-4 li h6 span{min-height: 150px;}
.pro-text-ul.ul-5 li h6{padding: 10px 0!important;}
.no-radius{border-radius: 0!important;}
.sm-h{height:60px!important;min-height:60px!important;}
.hei-150{height: 150px;padding: 40px!important;}
.f-size-18{font-size: 18px;font-weight: 500}
.p-ico-c{font-size: 18px;padding: 0 0 0 20px!important;color: #fff!important;position: relative;font-weight: 500;line-height: 25px!important;margin:0 0 10px 0!important;}
.p-ico-c:after{content: '';width:8px;height: 8px;border-radius: 50%;background-color: #fff;position: absolute;left: 0;top:9px;}
.pro-text-ul li .border{
    border:4px solid #fff!important;padding:8px!important;background-color: #fff!important;
    -webkit-box-shadow: 2px 5px 10px rgb(0 0 0 / 10%)!important;
    box-shadow: 2px 5px 10px rgb(0 0 0 / 10%)!important;
}
@media screen and (max-width: 991px){
    .pro-text-ul li h6{font-size:1.4rem;line-height:2rem;padding:12px;min-height:auto;}
    .pro-text-ul li h6 span{font-size: 1.2rem;line-height: 1.8rem;min-height:auto}
    .pro-text-ul li p{padding: 10px;font-size: 1.2rem;line-height:1.8rem;font-weight:350}
    .pro-text-ul.ul-4 li h6 span{min-height: auto;}
    .pro-text-ul.ul-1 li h6{min-height:auto}
    .pro-text-ul.ul-1 li h6.min-h{height:auto;min-height:auto;}
    .pro-text-ul.ul-1 li h6.sm-h{height:auto;min-height:auto;}
    .pro-text-ul.ul-4 li h6 span{min-height: auto;}
    .pro-text-ul.ul-3{width: 100%;flex-wrap:wrap!important}
    .pro-text-ul.ul-3 li{width: 100%!important;}
    .hei-150{height:auto!important;padding:0 !important;}
    .f-size-18{font-size: 1.6rem;}
    .p-ico-c{font-size:1.4rem;font-weight:600;line-height:2rem;margin:0 0 5px 0!important;padding: 0 0 0 12px!important;}
    .p-ico-c:after{width:6px;height:6px;top:9px;}
}

.pro-text-list-ul{width: 100%;}
.pro-text-list-ul li{position: relative;padding-left:40px;margin-bottom: 2%}
.pro-text-list-ul li:after{content: '';width: 16px;height: 16px;border-radius: 50%;position: absolute;left: 0;top:7px;
    background-image:-webkit-linear-gradient(45deg, var(--color-1), var(--color-3));
    background-image:linear-gradient(45deg, var(--color-1), var(--color-3));
}
.pro-text-list-ul li h6{font-size: 20px;font-weight: 550;color:#495057;margin-bottom: 5px;text-align: left}
.pro-text-list-ul li b{font-size: 20px;font-weight: 550;color:#495057;margin-bottom: 5px;text-align: left;display: block}
.pro-text-list-ul li p{font-size: 14px!important;line-height: 22px!important;color:#495057;font-weight: 350; }
@media screen and (max-width: 991px){
    .pro-text-list-ul li{padding-left:15px;margin-bottom: 5%}
    .pro-text-list-ul li:after{width:8px;height: 8px;top:6px;}
    .pro-text-list-ul li h6{font-size:1.4rem;margin-bottom: 0!important;}
    .pro-text-list-ul li b{font-size: 1.4rem;}
    .pro-text-list-ul li p{font-size: 1.3rem!important;line-height:1.8rem!important;}
}

.icon-title-p-ul{width: 100%;}
.icon-title-p-ul li{padding: 20px 0;background-color: rgba(255,255,255,0.8);
    -webkit-box-shadow: 0 5px 10px rgb(190 196 207 / 30%);
    box-shadow: 0 5px 10px rgb(190 196 207 / 30%);
    width: 15.33%;text-align: center;
    border: 1px solid #fff;}
.icon-title-p-ul li img{width:80px;margin-bottom: 20px;border-radius: 50%;padding: 10px}
.icon-title-p-ul li h6{font-size: 20px;font-weight: 550;color:#495057;margin-bottom: 10px;}
.icon-title-p-ul li h6.blue{color: var(--color-3) !important;font-size: 30px;}
.icon-title-p-ul li p{font-size: 13px;line-height: 22px;font-weight: 350;color:#495057;font-family: "Microsoft YaHei", "Roboto", sans-serif }
.p-ico-c-b{text-align: left!important;font-size: 16px!important;padding: 0 0 0 20px!important;color:#495057!important;position: relative;font-weight: 500;line-height: 25px!important;margin:0 0 10px 0!important;}
.p-ico-c-b:after{content: '';width:8px;height: 8px;border-radius: 50%;background-color: var(--color-3);position: absolute;left: 0;top:9px;}
@media screen and (max-width: 991px){
    .icon-title-p-ul{flex-wrap: wrap}
    .icon-title-p-ul li{padding:10px 0 20px 0;width: 49%;margin-bottom: 2%}
    .icon-title-p-ul li img{width:80px;margin-bottom:10px;border-radius: 50%;padding:0}
    .icon-title-p-ul li h6{font-size:1.6rem;margin-bottom:0!important;}
    .icon-title-p-ul li p{font-size: 1.2rem;line-height:1.8rem;}
}

.text-num-ul{flex-wrap: wrap;}
.text-num-ul li{position: relative;margin-bottom:6%;text-align: left;}
.text-num-ul li i{font-size: 45px;color: #dceeff;font-style: normal;position:absolute;top: -30px;z-index: 1;left: 0;font-family: Arial, sans-serif;font-weight: bold}
.text-num-ul li b{position: relative;z-index: 2;font-size: 22px;font-weight: 500;color:#495057;margin-bottom: 2%;display: block}
.text-num-ul li p{font-size: 14px;line-height: 22px;color: #495057;font-family: "Microsoft YaHei", "Roboto", sans-serif;padding-right:20px;}
.text-num-ul li:nth-child(n+4){margin-bottom: 0}
@media screen and (max-width: 991px){
    .text-num-ul{padding: 30px 0;}
    .text-num-ul li{position: relative;margin-bottom:10%!important;text-align: left;background-color: #fff;padding:15px;border-radius: 6px;}
    .text-num-ul li i{font-size: 4rem;top: -30px;left:10px;}
    .text-num-ul li b{font-size: 1.8rem;font-weight: 550}
    .text-num-ul li p{font-size: 1.2rem;line-height: 1.8rem;padding-right:0!important;}
    .text-num-ul li:nth-child(n+5){margin-bottom: 0!important;}
}
.pro-text-title{
    position: relative;
    display: inline-block;
    padding: 10px;
    background-image: url("../images/pro-text-title.jpg");background-size:contain; background-repeat: no-repeat;background-position: center top;
    margin-bottom: 50px;height: 300px;
}
.pro-text-title h5{font-size: 50px;font-weight: 550;color:var(--color-2);position: relative;top:-30px;}
.pro-text-title p{font-size: 14px;line-height: 22px;color:#495057;}
@media screen and (max-width: 991px){
    .pro-text-title{margin-bottom:0;height:auto;background-image:none;}
    .pro-text-title h5{font-size:3rem;top:unset;text-align: center!important;width: 100%}
    .pro-text-title p{font-size: 1.4rem!important;line-height:2.2rem!important;font-weight:400!important;}
}
.process-ico-ul{width: 100%;padding: 50px 0;position: relative;}
.process-ico-ul:after{content: '';width: 100%;height: 1px;border-bottom: 1px dashed #1c6aca;position: absolute;left: 0;bottom: 0;z-index: 1;}
.process-ico-ul li{width:16.66%;text-align: center;position: relative;z-index: 2;}
.process-ico-ul li b{display: block;width: 50px;height: 50px;line-height:30px;color:#1c6aca;font-size:30px;letter-spacing: -2px;
    background-color:#e5e5e5;border-radius: 50%;position: absolute;left:50%;bottom: -70px;margin-left: -25px;
    border: 10px solid #f7fafd;}
.process-ico-ul li img{display: block;margin:10px auto;width:60px;}
.process-ico-ul li span{display: block;text-align: center;font-size: 18px;font-weight:400;color: #495057;}
@media screen and (max-width: 991px){
    .process-ico-ul{padding:20px 0;}
    .process-ico-ul:after{bottom:11px;z-index:1!important;}
    .process-ico-ul li{width:auto;height:140px;}
    .process-ico-ul li b{line-height:2.5rem;font-size:2.5rem;bottom:20px;border: 6px solid #f7fafd;width: 40px;height: 40px;}
    .process-ico-ul li img{margin:5px auto;width:50px;}
    .process-ico-ul li span{font-size:1.4rem}
    .process-ico-ul .slick-dots{position: absolute;width: 100%;left: 0;bottom:0;z-index: 2!important;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: center;
        justify-content: center;
    }
    .process-ico-ul .slick-dots li{margin:6px!important;border: none;border-radius: 50%;width:10px!important;height: 10px;padding: 0!important;background-color: rgba(0,0,0,0.2)}
    .process-ico-ul .slick-dots li{margin:6px!important;border: none;border-radius: 50%;width:10px!important;height: 10px;padding: 0!important;background-color: rgba(0,0,0,0.2)}
    .process-ico-ul .slick-dots li button{padding: 0;border: none;margin: 0;}
    .process-ico-ul .slick-dots li.slick-active{background-color:var(--color-3) }
    .process-ico-ul .slick-dots li button:before {font-size:0.8rem;color:#222;opacity: 0;left:50%;margin-left: -0.4rem;top:0;}
    .process-ico-ul .slick-dots li.slick-active button:before {opacity: 0;color: var(--color-3)}
}
.ul-img-ul{width: 100%;align-items: center;}
.ul-img-ul .txt-img-ul{width: 40%;}
.ul-img-ul .txt-img-ul li{width:100%;position: relative;text-align: left;height:100px;}
.ul-img-ul .txt-img-ul li:nth-child(2n){}
.ul-img-ul .txt-img-ul li img{width:50px;position: absolute;right: 0;top:50%;margin-top: -25px}
.ul-img-ul .txt-img-ul li h6{font-size: 20px;font-weight: 550;color:#495057;margin-bottom:5px;}
.ul-img-ul .txt-img-ul li p{font-size: 14px;line-height: 22px;color:#495057;font-weight: 350;}
.ul-img-ul .img{width: 10%;}
.ul-img-ul .img img{width: auto;max-width: 100%}
@media screen and (max-width: 991px){
    .m-ul-img-ul {flex-wrap:wrap }
    .m-ul-img-ul .txt-img-ul{width: 100% !important;}
    .m-ul-img-ul .txt-img-ul li{padding-left: 60px!important;padding-right: 0!important;padding-top: 0!important;margin-bottom:8%!important;height:auto!important;}
    .m-ul-img-ul .txt-img-ul li img{right: unset;left: 0;top:0;margin-top: 0!important;}
    .ul-img-ul .txt-img-ul li h6{font-size: 1.6rem;}
    .ul-img-ul .txt-img-ul li p{font-size: 1.4rem;line-height:2rem;}
    .m-ul-img-ul .img{display: none!important;}
}


.title-p-ul{width: 100%;}
.title-p-ul li{padding:40px 20px;}
.title-p-ul li h6{font-size: 25px;font-weight: 550;}
.title-p-ul li span{font-size: 18px;line-height: 30px;color:#495057;display: block; }
.title-p-ul li p{font-size: 18px;line-height: 30px;color:#495057}
.bg-ul li{background-color: #f7fafd;}
.title-p-ul.ul-3 li{width: 32%;}


.tj-ul{width: 100%;}
.tj-ul li{width: 100%;align-items: center;margin-bottom: 20px;}
.tj-ul li b{text-align: left;font-size: 32px;font-weight:700;color:#495057;width:110px;position: relative;top:15px}
.tj-ul li .tj-info{width:calc(100% - 110px)}
.tj-ul li .tj-info p{font-size: 18px;line-height:30px;font-weight: 350;color: #495057;margin-bottom: 10px;}
.tj-ul li .tj-info .xian{width: 100%;height: 8px;background-color: #939393;border-radius: 10px;position: relative}
.tj-ul li .tj-info .xian:after{content: '';width: auto;height: 16px;position: absolute;left: 0;top:50%;margin-top: -8px;z-index: 2;
    background-image:-webkit-linear-gradient(45deg, var(--color-1), var(--color-3));
    background-image:linear-gradient(45deg, var(--color-1), var(--color-3));
    border-radius: 20px;
    animation-fill-mode: forwards;animation-iteration-count: 1;
}
.tj-ul li .tj-info .xian.orange:after{
    background-image:-webkit-linear-gradient(0deg, #ff8500, #fab005);
    background-image:linear-gradient(0deg, #ff8500, #fab005);
}
@media screen and (max-width: 991px){
    .tj-ul li{margin-bottom:10px;}
    .tj-ul li b{font-size: 2.5rem;width:80px;top:15px}
    .tj-ul li .tj-info{width:calc(100% - 80px)}
    .tj-ul li .tj-info p{font-size: 1.4rem;line-height:2rem;font-weight:400;}
    .tj-ul li .tj-info .xian{height: 6px;}
    .tj-ul li .tj-info .xian:after{height: 12px;margin-top: -6px; }
}
.tj-ul li .tj-info .xian.w100:after{width: 100%;animation: width 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w99:after{width: 99%;animation: width-99 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w95:after{width: 95%;animation: width-95 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w90:after{width: 90%;animation: width-90 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w80:after{width: 80%;animation: width-80 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w70:after{width: 70%;animation: width-70 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w60:after{width: 60%;animation: width-60 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w50:after{width: 50%;animation: width-50 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w40:after{width: 40%;animation: width-40 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w30:after{width: 30%;animation: width-30 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w25:after{width: 25%;animation: width-25 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w20:after{width: 20%;animation: width-20 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}
.tj-ul li .tj-info .xian.w10:after{width: 10%;animation: width-10 3s linear infinite alternate;animation-fill-mode: forwards;animation-iteration-count: 1;}

.tj-Circle-ul{width: 100%;}
.tj-Circle-ul li{text-align: center;}
.tj-Circle-ul li .quan{position: relative;width: 150px;height: 150px;margin-bottom:30px;font-size: 32px;font-weight:450;color:#495057 ;border-radius: 50%;border: 9px solid #eee;display: flex;align-items: center;justify-content: center}
.tj-Circle-ul li .quan:after{content: '';width: 110%;height: 110%;
    background-clip: padding-box;
    padding: 8px;
    position: absolute;left: -5%;top:-5%;z-index: 2;border-radius: 50%;}
.tj-Circle-ul li canvas{width: 150px;height: 150px;margin-bottom:25px;}
.tj-Circle-ul li .quan.orange:after{border:9px solid #ff8500;}
.tj-Circle-ul li .quan.w1:after{width:8px!important;height:8px!important;border-radius:8px;background-color:#339af0;left:9px;top:9px;padding:5px 8px;transform: rotate(-40deg)}
.tj-Circle-ul li .quan span{}
.tj-Circle-ul li p{font-size: 18px;line-height:25px;font-weight: 350;color: #495057;margin-bottom: 10px;}
@media screen and (max-width: 991px){
    .tj-Circle-ul{flex-wrap: wrap}
    .tj-Circle-ul li .quan{width:100px;height:100px;font-size:2.2rem;border: 6px solid #eee;margin: 0 auto 10px auto}
    .tj-Circle-ul li .quan:after{content: '';width: 110%;height: 110%;
        background-clip: padding-box;
        padding: 8px;
        position: absolute;left: -5%;top:-5%;z-index: 2;border-radius: 50%;}
    .tj-Circle-ul li canvas{width:100px;height:100px;margin-bottom:10px;}
    .tj-Circle-ul li .quan.orange:after{border:6px solid #ff8500;}
    .tj-Circle-ul li .quan.w1:after{width:8px!important;height:6px!important;border-radius:6px;left:6px;top:6px;padding:3px 5px;}
    .tj-Circle-ul li p{font-size: 1.4rem;line-height:2rem;font-weight:400}
}

@keyframes width {
    0% {width: 0;}
    100% {width: 100%;}
}
@keyframes width-99 {
    0% {width: 0;}
    100% {width: 99%;}
}
@keyframes width-95 {
    0% {width: 0;}
    100% {width: 95%;}
}
@keyframes width-90 {
    0% {width: 0;}
    100% {width: 90%;}
}
@keyframes width-80 {
    0% {width: 0;}
    100% {width: 80%;}
}
@keyframes widt-70 {
    0% {width: 0;}
    100% {width: 70%;}
}
@keyframes width-60 {
    0% {width: 0;}
    100% {width: 60%;}
}
@keyframes width-50 {
    0% {width: 0;}
    100% {width: 50%;}
}
@keyframes width-40 {
    0% {width: 0;}
    100% {width: 40%;}
}
@keyframes width-30 {
    0% {width: 0;}
    100% {width: 30%;}
}
@keyframes width-20 {
    0% {width: 0;}
    100% {width: 20%;}
}
@keyframes width-10 {
    0% {width: 0;}
    100% {width: 10%;}
}


/*service-form*/
.service-form{padding:100px 0;width: 100%;}
.form{width:900px;margin: 0 auto}
.form h4{font-size: 30px;font-weight: 550;color: #495057}
.form h6{font-size: 20px;font-weight: 550;color: #495057}
.form ul{width: 100%;flex-wrap: wrap;}
.form ul li{width: 49%;margin-bottom:5%;text-align: left;font-size: 18px;line-height: 28px;font-weight:450;color: #495057 }
.form input[type="text"],.form input[type="email"],.form input[type="tel"]{width:100%;text-indent: 20px;margin-right: 3%;height: 50px;font-size: 16px;color:#868e96;border: 1px solid #aaa;background-color: transparent}
.form button{border: none;color: #fff;font-size: 18px;width:200px;height: 50px;border-radius: 30px;
    background-image:-webkit-linear-gradient(45deg, var(--color-1), var(--color-3));
    background-image:linear-gradient(45deg, var(--color-1), var(--color-3));
    box-shadow:0 16px 32px -5px rgba(36,72,246, 0.25);
    -webkit-box-shadow:0 16px 32px -5px rgba(36,72,246, 0.25);
    margin-right: 0;
}
.form .checkbox-list{width: 100%;}
.form .checkbox-list label{display: flex;align-items: center;justify-content: center;margin-right:25px;font-size: 18px;font-weight: 400}
.form .checkbox-list label input[type="checkbox"]{width: 22px;height: 22px;font-size:18px;margin-right:10px;display: inline-block;position: relative;top:-2px;}
.form .checkbox-ul {width: 100%;}
.form .checkbox-ul li{position: relative;height:65px;}
.form .checkbox-ul li input[type="checkbox"] {opacity: 0;}
.form .checkbox-ul li input[type="checkbox"] + label {position: absolute;top: 0;left: 0;width: 100%;height: 100%;text-align: center;line-height:65px;
    -webkit-box-shadow: 0 5px 10px rgb(190 196 207 / 30%);
    box-shadow: 0 5px 10px rgb(190 196 207 / 30%);
    border: 1px solid #aaa;font-size: 20px;font-weight: 550;color: #495057;cursor: pointer;
}
.form .checkbox-ul li input[type="checkbox"]:checked + label {background-color: #00c853;
    background-image:-webkit-linear-gradient(45deg, var(--color-1), var(--color-3));
    background-image:linear-gradient(45deg, var(--color-1), var(--color-3));
    box-shadow:0 5px 10px -2px rgba(36,72,246, 0.25);
    -webkit-box-shadow:0 5px 10px -2px rgba(36,72,246, 0.25);
    color: #fff;border: none;
}
.form .img{width: 100%}
.form .img img{width: auto;max-width: 100%;margin-bottom: 10px;}
.form .img p{font-size: 18px;line-height: 28px;font-weight:400;color: #495057}
.sq{background-color: #fff}
@media (max-width: 1440px) {
    .service-form{padding:80px 0;}
}
@media (max-width: 992px) {
    .service-form{padding:30px 0;}
    .form{width: 100%}
    .form h4{font-size:2rem;line-height: 2.5rem}
    .form h6{font-size: 1.8rem;margin-bottom: 10px!important;}
    .form ul li{font-size: 1.4rem;line-height: 2.2rem;font-weight: 350!important;}
    .form input[type="text"],.form input[type="email"],.form input[type="tel"]{text-indent:10px;margin-right:2%;height:40px;font-size:1.4rem;}
    .form button{font-size: 1.4rem;width:50%;height:40px;}
    .form .checkbox-list{flex-wrap: wrap}
    .form .checkbox-list label{margin-right:0;font-size: 1.4rem;width: 100%;text-align: left!important;display:inline-block}
    .form .checkbox-list label input[type="checkbox"]{font-size:1.4rem;top:5px!important;}
    .form .checkbox-ul {flex-wrap: wrap}
    .form .checkbox-ul li{height:45px;width: 100%!important;margin-bottom:10px;}
    .form .checkbox-ul li input[type="checkbox"] + label {line-height:45px;font-size: 1.5rem;}
    .form .img{width: 100%;text-align: center}
    .form .img img{width: 50%}
    .form .img p{font-size:1.4rem;line-height:2.2rem;}
}
@media screen and (max-width: 991px){
    .wp-100{width: 100%!important;}
    .wp-90{width: auto!important;}
    .wp-85{width: auto!important;}
    .wp-80{width: auto!important;}
    .wp-75{width: auto!important;}
    .wp-70{width: auto!important;}
    .wp-65{width: auto!important;}
    .wp-60{width: auto!important;}
    .wp-55{width: auto!important;}
    .wp-50{width: auto!important;}
    .wp-45{width: auto!important;}
    .wp-40{width: auto!important;}
    .wp-35{width: auto!important;}
    .wp-30{width: auto!important;}
    .wp-25{width: auto!important;}
    .wp-20{width: auto!important;}
    .wp-15{width: auto!important;}
    .wp-10{width: auto!important;}
    .ul-3 li.m-wp-100,.ul-4 li.m-wp-100,.ul-5 li.m-wp-100{width:100%!important;}

    .p-40{padding: 20px 0!important;}
    .p-50{padding: 25px 0!important;}
    .p-60{padding: 25px 0!important;}
    .p-80{padding: 25px 0!important;}
    .p-100{padding: 25px 0!important;}
    .m-b-30{margin-bottom: 15px!important;}
    .m-b-40{margin-bottom: 20px!important;}
    .m-b-50{margin-bottom: 25px!important;}
    .m-b-60{margin-bottom: 25px!important;}
    .m-b-70{margin-bottom: 25px!important;}
    .m-b-80{margin-bottom: 25px!important;}
    .m-b-90{margin-bottom: 25px!important;}
    .m-b-100{margin-bottom: 25px!important;}
    .padding-left-50{padding-left: 25px!important;}
    .padding-right-50{padding-right: 25px!important;}
    .padding-left-100{padding-left: 25px!important;}
    .padding-right-100{padding-right: 25px!important;}
    .padding-top-10{padding-top: 5px!important;}
    .padding-top-20{padding-top: 10px!important;}
    .padding-top-30{padding-top: 15px!important;}
    .padding-top-40{padding-top: 20px!important;}
    .padding-top-50{padding-top: 25px!important;}
    .padding-top-100{padding-top: 25px!important;}
    .padding-10{padding: 5px!important;}
    .padding-20{padding: 10px!important;}
    .padding-30{padding: 15px!important;}
    .padding-40{padding: 20px!important;}
    .padding-50{padding: 25px!important;}

    .m-wp-30{width:30%!important;}
    .m-wp-32{width:32%!important;}
    .m-wp-40{width:40%!important;}
    .m-wp-49{width:49%!important;}
    .m-wp-50{width:50%!important;}
    .m-wp-60{width:60%!important;}
    .m-wp-70{width:70%!important;}
    .m-wp-100{width:100%!important;}
    .m-auto{margin-right: auto!important;margin-left: auto!important;}
    .m-m-b-20{margin-bottom: 20px;}
    .flex-sb{flex-wrap: wrap!important;}
    .m-p-30{padding: 20px 0!important;}
    .m-p-30 h4{margin: 0!important;}
    .m-p-20 img{background-color: #fff;padding:10px 0!important;}

}
.case{margin-top: 100px;width: 100%}
.case-banner{width: 100%;height: 500px;align-items: center;overflow: hidden;margin-bottom:80px;}
.case-banner .case-banner-left{width: 50%;height: 100%}
.case-banner .case-banner-right{width: 50%}
.case-banner .case-banner-right img{width: 100%;}
.case-banner .case-logo{width: 35%;height:100%;position: relative;background-color: #3c8ef2;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.case-banner .case-logo h4{width: 100%;font-size:25px;font-weight: 500;color: #fff;text-align: center;position: absolute;bottom: 30px;}
.case-banner .case-logo p{width: 100%;font-size: 16px;font-weight:400;color: #fff;position: absolute;top: 30px;left: 30px}
.case-banner .case-logo img{width: auto;max-width: 100%;position: absolute;height: 50px;top:50%;margin-top: -25px}
.case-banner .case-title{width: 65%;height:100%;padding:50px;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.case-banner .case-title p b{width: 100%;font-size: 30px;font-weight: 550;color:#222;line-height: 35px;margin-bottom:20px;display: block}
.case-banner .case-title p{width: 100%;height: 100px;font-size: 15px;line-height: 25px;color: #333;}
.case-text{width: 100%}
.case-text h5{font-size:25px;font-weight: 550;color: #222;margin-bottom: 50px;}
.case-text h6{font-size:35px;font-weight: 550;color: #222;margin-bottom: 30px;}
.case-text p{font-size: 16px;line-height: 32px;color: #333;font-weight: 300}
.case-text hr{border-bottom: 1px solid #333;margin: 50px 0;}
.case-ul{width: 100%;flex-wrap: wrap;padding:80px 0;}
.case-ul li{width: 32%;margin-bottom:3%;margin-right:2%}
.case-ul li:nth-child(3n){margin-right: 0;}
.case-ul li a{display: block;}
.case-ul li a .img{min-height: 250px;background-size: cover}
.case-ul li a .info{padding: 20px;}
.case-ul li a .info h6{font-size: 18px;line-height: 28px;font-weight: 400;color: #495057}
@media screen and (max-width: 991px){
    .case{margin-top:60px;}
    .case-banner{height:auto;margin-bottom:20px;flex-wrap: wrap}
    .case-banner .case-banner-left{width:100%;height:auto}
    .case-banner .case-banner-right{width:100%}
    .case-banner .case-banner-right img{width: 100%;}
    .case-banner .case-logo{width:100%;height:180px;}
    .case-banner .case-logo h4{font-size:2rem;bottom:20px;}
    .case-banner .case-logo p{width: 100%;font-size: 1.8rem;left: 20px;top:20px;}
    .case-banner .case-logo img{height: 50px;top:50%;margin-top: -25px}
    .case-banner .case-title{width:100%;height:auto;padding:25px 20px;}
    .case-banner .case-title p b{font-size:2rem;line-height: 3rem;margin-bottom:5px;}
    .case-banner .case-title p{height: auto;font-size:1.4rem;line-height:2.2rem;}
    .case-text{width: 100%}
    .case-text h5{font-size:1.6rem;margin-bottom:20px;}
    .case-text h6{font-size:2rem;margin-bottom:10px;}
    .case-text p{font-size: 1.4rem;line-height:2.2rem;}
    .case-text hr{margin:15px 0;}


    .case-ul{padding:20px 0 0 0;}
    .case-ul li{width: 48%;margin-bottom:2%;margin-right: 4%}
    .case-ul li:nth-child(2n){margin-right: 0;}
    .case-ul li:nth-child(3){margin-right: 4%}
    .case-ul li a{display: block;}
    .case-ul li a .img{min-height: 100px;}
    .case-ul li a .info{padding:10px 0;}
    .case-ul li a .info h6{font-size:1.4rem;line-height:2rem;}
}