﻿/*通用部分 s*/
/*头部导航*/
.header{background:rgba(51, 51, 51, 0.3);height: 120px;position: fixed; z-index:10; width: 100%; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -webkit-animation:gupIn 1s 0.1s both; -moz-animation:gupIn 1s 0.1s both; animation:gupIn 1s 0.1s both;}
.header.mini{ box-shadow: 0 2px 6px rgba(0, 0, 0, .1);background:rgba(51, 51, 51, 0.9)}
.header.hide{ display: none }
.header.on{background:#fff;}
.header.fix{position:fixed;}
.header .wrapper{position:relative;height: 100%;display: flex;align-items: center;justify-content: space-between;}
.logo{    height: 100%;
    /*border-right: 1px solid rgba(255, 255, 255, .3);*/
    padding-right: 60px;
    display: flex;
    align-items: center;}
.logo img{width: 200px}
.logo em{display:none;}
.logo span{display:block;}
.loginreg{position: absolute; top: 45px; right: 0; line-height: 28px; color: #fff; padding: 0 15px; border-radius: 28px; font-size: 16px;
background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
border-radius: 20px;}
.loginreg a{color:#fff; padding:0 5px; display:inline-block;}
.nav{float:right; padding:0px 138px 0 0; line-height:28px; font-size:18px; position:relative;}
.nav .navico{display:none;}
.nav .navico em{display:none;}
.nav .navico span{display:block;}

.nav li{float:left; padding:0 10px;}
.nav li a{text-align:center; display:block; color:#fff; opacity:0.6;margin:0 15px;padding: 14px 0 10px;}
.nav li a:hover{opacity:1;}
.nav li.on a{border-bottom: 4px #fff solid;opacity:1;}

/* banner */
.banner{width:100%; overflow:hidden; position:relative;  background: url(../img/mall_ban.jpg) no-repeat center top; height: 900px; }
.banner .hd{position:absolute; left:0; bottom: 20px; z-index:1; width:100%; text-align:center;}
.banner .hd ul{ 
    display: flex;
    align-items: center;
    justify-content: center;
}

.ban-info{
    margin-top: 350px;
    margin-left: 80px;
}
.ban-info h3{
    font-size: 48px;
    color: #fff;
    font-weight: bold;
}
.ban-info h4{
     font-size: 36px;
    color: #fff;
    font-weight: bold;
    margin: 60px 0 50px;
    display: flex;
    align-items: center;
}
.ban-info h5{
     font-size: 24px;
      color: #fff;
}
.ban-info h6{
     font-size: 18px;
      color: #fff;
      margin-top: 20px;
      line-height: 1.5;
      width: 500px;
}
/*头部导航*/

/*底部*/
.footer{color:#9a9ca6; width: 100%; overflow: hidden; background: url(../img/footer_back.jpg) no-repeat center top; height: 500px; }
.footer-logo{margin: 110px 30px 30px;text-align: center}
.footer-logo img{width: 150px}
.footer .foot_menu{font-size: 14px; width: 50%; padding-bottom: 20px; display: flex; justify-content: space-between; margin: 40px auto 10px;} 
.footer .foot_menu a{color:#333333;display: inline-block;text-align: center}
.footer .foot_menu span{padding:0 30px;}
.footer .info{display: flex;justify-content: center;color:#333;}
.footer .foot_contact{width:40%; }
.footer .foot_contact h3{position: relative;color:#333;font-size: 18px;padding: 30px 0 20px}
.footer .foot_contact h3 .line{position: absolute;left:0;bottom:0;width: 100%;height: 1px;
background: linear-gradient(90deg, #999999 0%, rgba(255, 255, 255, 0) 100%);}
.footer .foot_contact .item{justify-content: center;margin: 20px 0; display: flex; font-size: 14px;;align-items: center;}
.footer .foot_contact .item img{ display:inline-block;width: 20px;margin-right: 10px}
.footer .foot_copright{margin-top: 5px; text-align: center; padding-top: 20px;}
.footer .foot_copright a{ color:#9a9ca6;}

.contact-icons{
    text-align: center;
    display: flex;
    align-items: center;
    width: 250px;
    margin: 30px auto 10px;
}
.contact-icons li{
    flex: 1;
    position: relative;
}
.contact-icons li .icon{
    width: 36px;
}
.contact-icons li .show-info {
    display: none;
    position: absolute;
    background: #fff;
    border-radius: 10px;
    bottom: 45px;
    padding: 5px 5px;
    text-align: center;
    z-index: 100;
    transform: translateX(-50%);
    left: 50%;
    min-width: 100px;

}
.contact-icons li:hover .show-info{
    display: block;
}
.barrow_box {
    position: relative;
    background: #fff;
    border: 1px solid #999;
}
.barrow_box:after, .barrow_box:before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.barrow_box:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #fff;
    border-width: 5px;
    margin-left: -5px;
}
.barrow_box:before {
    border-color: rgba(222, 106, 82, 0);
    border-top-color: #999;
    border-width: 6px;
    margin-left: -6px;
}
.contact-icons li .show-info img{
    width: 100px;
}


.fix_link{position:fixed; top:50%; right:36px; margin-top:-104px; display:none;z-index: 100}
.fix_link li{width:50px; height:50px; border-radius:40px; margin-top:12px; cursor:pointer; position:relative; background:rgba(153,153,153,0.3);background-size: 100%;background-origin: center;background-repeat: no-repeat;}
.fix_link li .fix_info{position:absolute; right:62px; width:116px; box-shadow: 0px 0px 8px 0px rgba(4,0,0,0.2); text-align:center; background:#fff; line-height:36px; display:none;}
.fix_link li .fix_info span{position:absolute; right:-12px; top:45%; background:url(../img/fix_jtico.png) no-repeat; width:12px; height:10px; margin-top:-2px; display:block;}
.fix_link li:hover .fix_info{display:block;}
.fix_link li.fix_tel .fix_info{top: 8px;}
.fix_link li .fix_info{top:-30px;}
.fix_link li .fix_info img{width: 96px;
    height: 96px;
    margin: 10px;}
.fix_link li.fix_tel{background-image:url(../img/f_01.png) }
.fix_link li.fix_qq{background-image:url(../img/f_03.png) }
.fix_link li.fix_wx{background-image:url(../img/f_02.png)}
.fix_link li.fix_qywx{background-image:url(../img/f_04.png)}
.fix_link li.fix_top{background-image:url(../img/f_05.png)}
.fix_link li.fix_tel:hover{background-image:url(../img/f_01_a.png) }
.fix_link li.fix_qq:hover{background-image:url(../img/f_03_a.png) }
.fix_link li.fix_qywx:hover{background-image:url(../img/f_04_a.png) }
.fix_link li.fix_wx:hover{background-image:url(../img/f_02_a.png)}
.fix_link li.fix_top:hover{background-image:url(../img/f_05_a.png)}

/*底部*/

/*通用部分 e*/

/*首页*/
.first-section{width: 100%; overflow: hidden; background: url(../img/mall_01.jpg) no-repeat center top; height: 720px; }
.title-section{
    margin-top:  200px;
}
.title-section h3{
    font-size: 30px;
    color: #333;
    font-weight: bold;
}
.title-section h4{
     font-size: 16px;
    color: #999;
    margin: 19px 0 30px;
}
.title-section p{
     font-size: 16px;
    color: #333;
    line-height: 2.5;
}
.title-section .btns{
    margin-top: 40px;
}
.title-section .btns a{
    display: inline-block;
    padding: 6px 25px;
    border-radius: 50px;
    color: #26DE79;
    font-size: 16px;
    border: 1px solid #26DE79;
    margin-right: 30px;
}
.title-section .btns a.free{
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    color: #fff;
}

/* 第二块 */
.second-section{width: 100%; overflow: hidden; background: url(../img/mall_02.jpg) no-repeat center top; height: 720px; }
.second-section .module{
    margin-top: 50px;
    position: relative;
}
.module .module-icon{
    background: url(../img/p_more.png) no-repeat center center;
    text-align: center;
    color: #fff;
    font-size: 18px;
    padding-left: 40px;
    width: 160px;
    height: 50px;
    background-size: 100%;
    line-height: 50px;
    box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    position: relative;
    z-index: 3;
    cursor:pointer
}
.module .module-icon:active{
    opacity: 0.9;
}
.module .module-box{
    display: none;
}
.module .module-items{
    position: absolute;
    background: #fff;
    width: 680px;
    box-shadow: 0px 10px 30px 0px rgb(0 0 0 / 20%);
    border-radius: 4px;
    top: 0px;
    z-index: 2;
    padding: 80px 30px 30px;
    display: flex;
    flex-wrap: wrap;
}
.module .module-items li{
    width: 20%;
    text-align: center;
    line-height: 50px;
    
}
.module .module-items li a{
    font-size: 18px;
    color: #333333;
}
.module .module-items li a:hover{
    color: #26DF78;
}
.module .module-items li.active a{
    color: #26DF78;
}
.module-info{
    margin-top: 80px;
    position: relative;
}

.module-swiper{
     height: 430px;
    width: 600px;
}

.module-swiper .swiper-container {
    /*height: 600px;*/
    width: 620px;
}
.module-swiper .swiper-slide {
    align-items: center;
    transition: 300ms;
    transform: scale(0.8);
}

.module-info .module-pic .pic-back{
    background: url(../img/module/module_back.png) no-repeat center;
    width: 200px;
    text-align: center;
    display: block;
    background-size: 200px;
    padding: 50px 0;
}
.module-swiper .swiper-slide img{
    width: 180px;
}
.module-swiper .swiper-slide-active, .module-swiper.swiper-slide-duplicate-active{
   transform: scale(1);
}
.change-btn{
    display: flex;
    justify-content: space-between;
    width: 300px;
    margin-top: 20px;
    margin-left: 160px;
}
.change-btn img{
    width: 40px;
    opacity: 0.6
}
.change-btn a:hover img{
    opacity: 1
}

.module-cnt{
    position: absolute;
    right: 230px;
    top: 260px;
    width: 230px;
    color: #fff;
}
.module-cnt h3{
    font-size: 24px;
    margin-bottom: 20px;
}
.module-cnt h4{
    font-size: 16px;
    line-height: 1.7;
}

.list-swiper{
    position: absolute;
    right: 0px;
    top: -20px;
    width: 220px;
    height: 300px;
}
.list-swiper .swiper-container {
      width: 220px;
      height: 300px;
}
.list-swiper img{
    width: 160px;
    height: 60px;
    margin-left: 60px;
}
/*.list-swiper .swiper-slide{
    width: 160px;
    height: 60px;
    margin-left: 60px;
}*/
.list-swiper .swiper-slide a{
      width: 160px;
      height: 60px;
      margin-left: 60px;
      background: #BEBEBE;
      color: #fff;
      line-height: 60px;
      display: block;
      text-align: center;
      opacity: 0.75;
      font-size: 18px;
      /*transition: 300ms;*/
    }
.list-swiper .swiper-slide.active a{
      background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
      color: #fff;
      /*transform: translateX(-40%);*/
      opacity: 1;
    }

    .list-swiper .swiper-slide:hover a{
        background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
      color: #fff;
      /*transform: translateX(-40%);*/
      opacity: 1;
    }
.list-swiper .slideUp img{
        border-bottom: 1px solid #eee;
}
.list-swiper .slideUp:hover{
    opacity: 0.8
}

.list-swiper .slideDown img{
        border-top: 1px solid #eee;
}
.list-swiper .slideDown:hover{
    opacity: 0.8
}

    /*首页第三块*/
.case{
    padding: 30px 0;
}
.case-navs{
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 40px;
}
.case-navs li{
    width:  10%;
    font-size: 16px;
    color: #333;
    line-height: 50px;
    margin-bottom: 20px;
}
.case-navs li.active a{
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(38, 223, 120, 0.2);
    color: #fff; 
}
.case-navs li:hover a{
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(38, 223, 120, 0.2);
    color: #fff
}
.case-navs li a{
    color: #333333;
    padding: 10px 20px;
    border-radius: 20px;
}
.cus-items-list{
    display: flex;
    flex-wrap: wrap;
    padding-top: 20px;
}
.cus-items-list li{
    /*float: left;*/
    width: 223px;
    /* height: 380px; */
    background: #FFFFFF;
    border: 1px solid #F4F4F7;
    border-radius: 5px;
    margin-right: 20px;
    padding: 40px 30px;
    text-align: center;
    margin-bottom: 20px;
    position: relative;
}
.cus-items-list li:nth-child(4n){
    margin-right: 0
}
.cus-items-list li .clogo{
    width: 120px;
    height: 120px
}
.cus-items-list li h2{
    color: #444E5B;
    margin: 30px 0;
    font-size: 18px;
}
.cus-items-list li p{
    height: 60px;
    color: #999;
    font-size: 14px;
    text-align: left;
    display: -webkit-box;    
    -webkit-box-orient: vertical;    
    -webkit-line-clamp: 3;    
    overflow: hidden;
}
.cus-items-list li:hover{
    box-shadow: 0px 0px 7px 0px rgb(0 0 0 / 10%);
}
.cus-items-list li:hover .hover-info{
    display: block;
}
.cus-items-list .hover-info{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    text-align: center;
    top: 0;
    left: 0;
    display: none;

}
.cus-items-list .hover-info .clogo{
    margin-top: 40px;
}
.cus-items-list .hover-info .btn{
    padding: 6px 5px;
    color: #fff;
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(38, 223, 120, 0.2);
    border-radius: 5px;
    /*border-radius: 5px;*/
    display: block;
    width: 30%;
    margin: 50px auto 0;
}

.cus-items-list .show-pic{
    background: #fff url(../img/module/module_back.png) no-repeat center;
    width: 105%;
    height: 100%;
    text-align: center;
    background-size: 180px;
    padding: 20px 0;
    position: absolute;
    top: -20px;
    left: -10px;
    display: none;
    z-index: 100;
}
/*.cus-items-list .show-pic:hover{
    transform: scale(1.5);
    transition: all 2s;
}*/
.cus-items-list .show-pic img{
    width: 158px;
    margin-top: 30px;
}
.more {
    width: 100px;
    text-align: center;
    padding: 8px;
    margin: 50px auto 20px;
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(38, 223, 120, 0.2);
    border-radius: 5px;
    color: #fff;
    font-size: 14px;
    display: block;
    border-radius: 5px;
}
.more:hover{
    color: #fff;
}
.section-title{
    margin: 30px 0 50px;
    text-align: center;
}
.section-title h2{
    font-size: 30px;
    color: #333;
    font-weight: bold;
}
.section-title h3{
    font-size: 16px;
    color: #999;
    margin-top: 20px;
}

/*联系我们*/
.contact-banner{width:100%; overflow:hidden; position:relative;  background: url(../img/contact_back.jpg) no-repeat center top; height: 900px; }
.contact-info{
    margin-top: 350px;
    margin-left: 80px;
}
.contact-info h3{
    font-size: 48px;
    color: #fff;
    font-weight: bold;
}
.contact-info h4{
    font-size: 20px;
    color: #fff;
    margin: 60px 0 40px;
    display: flex;
    align-items: center;
}
.contact-info h5{
    font-size: 24px;
    color: #fff;
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(51, 51, 51, 0.2);
    border-radius: 30px;
    width: 180px;
    height: 60px;
    line-height: 60px;
    text-align: center;
}

.about{
    margin: 50px 0;
}
.intro{
    display: flex;
    margin-bottom: 50px
}
.intro .intro-pic{
    position: relative;
}
.intro .intro-pic .pic{
    position: relative;
    z-index: 2;
    width: 556px;
    height: 300px
    
}
.intro .intro-info{
    /*margin: 0 50px*/
}
.intro .intro-info h3{
    font-size: 30px;
    color: #444E5B;
    position: relative;
    padding: 20px 0  15px;
    margin-bottom: 40px;
    font-weight: bold;
}

.intro .intro-info h3.right{
    text-align: right;
}

.intro .intro-info p{
    font-size: 14px;
    color: #666;
    line-height: 1.75
}
.intro .btns{
    margin-top: 40px;
    text-align: right;
}
.intro .btns a{
    display: inline-block;
    padding: 6px 25px;
    border-radius: 50px;
    color: #26DE79;
    font-size: 16px;
    border: 1px solid #26DE79;
    margin-right: 30px;
}
.intro .btns a.free{
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    color: #fff;
    border: 1px solid transparent;
    box-shadow: 0px 10px 40px 0px rgba(38, 223, 120, 0.3);
}


/*发展历程*/
.course{
    height: 830px;
    background: url(../img/contact_02.jpg) no-repeat center;
}
.course h3{
    font-size: 30px;
    color: #333;
    position: relative;
    padding: 50px 0 50px 120px;
    text-align: center;
}

.course-map{
    width: 808px;
    margin: 160px auto 0;
    position: relative;
}
.course-map .course-pic{
    width: 808px;
}
.course-map h4{
    font-size: 18px;
    color: #333
}
.course-map p{
    background: #fff;
    border-radius: 5px;
    padding: 5px 10px;
    color: #666;
    font-size: 12px;
    position: absolute;
    bottom: 30px ;
    left: 0;
    min-width: 200px;
    border: 1px solid #999;
    line-height: 2;
    min-height: 72px;
}
.course-map div{
    position: absolute;
}
.course-map .tag2016{
    left: 0;
    top: 215px;
}
.course-map .tag2016 p{
    top: 30px;
    bottom: auto
}
.course-map .tag2017{
    left: 160px;
    bottom: 215px;
}
.course-map .tag2018{
    left: 310px;
    top: 215px;
}
.course-map .tag2018 p{
    top: 30px;
    bottom: auto
}
.course-map .tag2019{
    left: 460px;
    bottom: 215px;
}
.course-map .tag2020{
    left: 610px;
    top: 215px;
}
.course-map .tag2020 p{
    top: 30px;
    bottom: auto
}
.course-map .tag2021{
    left: 760px;
    bottom: 215px;
}
.course-map .tag2021 p{
   display: flex;
    align-items: center;
    justify-content: center;
}


/*定制服务*/
.customized{width:100%; overflow:hidden; position:relative;  background: url(../img/scrm_ban.jpg) no-repeat center top; height: 900px; }
.customized-info{
    margin-top: 350px;
    margin-left: 80px;
}
.customized-info h3{
    font-size: 48px;
    color: #fff;
    font-weight: bold;
}
.customized-info h4{
    font-size: 20px;
    color: #fff;
    margin: 60px 0 40px;
    display: flex;
    align-items: center;
}
.customized-info h5{
    font-size: 24px;
    color: #fff;
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(51, 51, 51, 0.2);
    border-radius: 30px;
    width: 180px;
    height: 60px;
    line-height: 60px;
    text-align: center;
}

.c-one{
    display: flex;
    align-items: center;
    padding: 50px 0;

}
.c-one .left-pic{
    width: 437px;
}

.c-one .desc{
    margin-left: 130px;
}
.c-one .desc h3{
    color: #333;
    font-size: 30px;
    margin-top: 50px;
    margin-bottom: 40px;
    font-weight: bold;
}
.c-one .desc p{
    margin-bottom: 20px;
    color: #333;
    font-size: 18px;
}


.customized-two{width:100%; overflow:hidden; position:relative;  background: url(../img/c_p2_back.jpg) no-repeat center top; height: 749px; }
.c-two{
    margin-top: 130px;
}
.c-two h3{
    font-size: 30px;
    color: #333;
    text-align: right;
    margin: 30px 0 50px;
}
.c-two ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.c-two ul li{
    width: 330px;
    height: 110px;
    padding: 20px;
    display: flex;
    align-items: center;
    background: #FFFFFF;
    box-shadow: 0px 10px 16px 4px rgba(197, 197, 197, 0.2);
    border-radius: 10px;
    margin-bottom: 30px;
}
.c-two ul li:nth-child(1){margin-top: 120px;}
.c-two ul li:nth-child(2){margin-top: 60px;}
.c-two ul li:nth-child(5){margin-top: -60px;}
.c-two ul li:nth-child(6){margin-top: -120px;}
.c-two ul li .pic{
    width: 100px;
}
.c-two ul li .c-intro{
    margin-left: 30px;
}
.c-two ul li .c-intro h4{
    font-size: 20px;
    color: #333;
    margin-bottom: 15px;
}
.c-two ul li .c-intro p{
     font-size: 14px;
    color: #333;
    line-height: 1.75;
}

.c-two .btns{
    text-align: right;

}
.c-two .btns a{
    display: inline-block;
    padding: 6px 25px;
    border-radius: 50px;
    color: #26DE79;
    font-size: 16px;
    border: 1px solid #26DE79;
    margin-left: 30px;
}
.c-two .btns a.free{
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    color: #fff;
}


.customized-three{width:100%; overflow:hidden; position:relative;  background: url(../img/c_p3_back.jpg) no-repeat center top; height: 890px; }
.c-three{
    margin: 130px 0;
}
.c-three h3{
     color: #333;
    font-size: 30px;
    margin-bottom: 30px;
    text-align: center;
}
.c-three h4{
     color: #999;
    font-size: 16px;
    text-align: center;
}
.c-three ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 80px;
}
.c-three ul li{
    width: 370px;
    height: 170px;
    background: #FFFFFF;
    box-shadow: 0px 10px 20px 0px rgba(0, 9, 76, 0.1);
    border-radius: 60px 10px 10px 10px;
    display: flex;
    align-items: flex-start;
    margin-bottom: 30px;
    margin-left: 30px;
}

.c-three ul li .pic{
    width: 120px;
}
.c-three ul li .c-intro{
    margin-left: 30px;
    margin-right: 20px;
    margin-left: 30px;
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.c-three ul li .c-intro h5{
    color: #333;
    font-size: 22px;
    margin-bottom: 20px;
}
.c-three ul li .c-intro p{
    color: #333;
    font-size: 14px;
}

.customized-four{width:100%; overflow:hidden; position:relative;  background: url(../img/c_p4_back.jpg) no-repeat center top; height: 787px; }
.c-four{
    text-align: center;
    padding: 50px 0;
}
.c-four h3{
    color: #333;
    font-size: 30px;
    margin: 50px 0 30px;
}
.c-four h4{
    color: #999;
    font-size: 18px;
}

.pictureSlider{
    height: 400px;
    margin: 50px auto;
}
.poster-btn{
    width: 800px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 30px auto;
}
.poster-btn .poster-prev-btn img{
    width: 50px;
}
.poster-btn .poster-next-btn img{
     width: 50px;
}
.pictureSlider .poster-item{
    /*background: #fff;*/
    width: 650px;
    height: 400px;
    transition: all 0.5s;cursor: default;
    -moz-transition: all 0.5s;cursor: default;
    -webkit-transition: all 0.5s;cursor: default;
    -o-transition: all 0.5s;cursor: default;
}
.pictureSlider .poster-item{
    background: url(../img/photo/photo_back.png) no-repeat center;
  
}
.pictureSlider .poster-item .photo-box{
    width: 500px;
    height: 300px;
    overflow: hidden;
    margin: 40px auto;
}
.pictureSlider .poster-item .photo-box img{
    width: 100%;
}

.c-five{
    text-align: center;
    padding: 50px 0;
}
.c-five h3{
    color: #333;
    font-size: 30px;
    margin: 50px 0 30px;
}
.c-five h4{
    color: #999;
    font-size: 18px;
}
.c-five .pic{
    margin-top: 80px;
    width: 1077px;
}

/*客服系统*/
.service{width:100%; overflow:hidden; position:relative;  background: url(../img/service_ban.jpg) no-repeat center top; height: 900px; }
.service-info{
    margin-top: 350px;
    margin-left: 80px;
}
.service-info h3{
    font-size: 48px;
    color: #fff;
    font-weight: bold;
    margin: 80px 0 80px;
}
.service-info h4{
    font-size: 36px;
    color: #fff;
    display: flex;
    align-items: center;
}
.service-info h5{
    
    font-size: 24px;
    color: #fff;
}

.apply{width:100%; overflow:hidden; position:relative;  background: url(../img/service_p1_back.jpg) no-repeat center top; height: 833px; }
.service-title h3{
    font-size: 30px;
    color: #333;
    text-align: center;
    margin-top: 50px;
}
.service-title h4{
    font-size: 18px;
    color: #999;
    margin: 30px 0;
    text-align: center;
}
.apply .apply-input-section{
    margin: 100px 0 0 620px;
    background: #FFFFFF;
    box-shadow: 0px 10px 20px 0px rgba(96, 54, 203, 0.3);
    border-radius: 10px;
    padding: 30px;
    width: 500px;
}
.apply .apply-input-section h5{
    font-size: 24px;
    color: #333;
    margin-bottom: 30px;
    text-align: center;
}

.apply .apply-input-section .apply-input{
    height: 70px;
    background: #F1F2F6;
    border-radius: 4px;
    display: block;
    width: 100%;
    border: none;
    padding: 0 30px;
    margin-bottom: 20px;
    box-sizing: border-box;
}

.apply .apply-input-section .apply-submit{
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 0px 20px 0px rgba(38, 223, 120, 0.3);
    border-radius: 35px;
    color: #fff;
    font-size: 20px;
    display: block;
    line-height: 70px;
    text-align: center;
    margin-top: 40px;
}

input,textarea{  
    background:none;  
    outline:none; 
    border:none; 

}
input:focus,textarea:focus{   
    border:none;
}
textarea{resize:none}

.advantage{width:100%; overflow:hidden; position:relative;  background: url(../img/service_p2_back.jpg) no-repeat center top; height: 720px; }
.layout{
    display: flex;
    align-items: center;
    margin-top: 90px;
}
.advantage-msg{
    text-align: center;
    font-size: 14px;
    color: #fff;
    width: 360px;
    line-height: 3;
}
.advantage-msg .msg{
    width: 200px;
    margin: 0 auto;
}
.advantage-desc{
    display: flex;
    flex-wrap: wrap;
    width: 780px;
    margin-left: 80px;
    justify-content: space-between;
}
.advantage-desc li{
    width: 150px;
    height: 150px;
    background: #FFFFFF;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 20px;
}

.advantage-desc li:hover{
    box-shadow: 0px 0px 10px 0px rgba(96, 54, 203, 0.3);
}

.advantage-desc li.active{
    box-shadow: 0px 0px 10px 0px rgba(96, 54, 203, 0.3);
}

.advantage-desc li .pic{
    margin-top: 20px;
    width: 82px;
}
.advantage-desc li h5{
    margin-top: 15px;
    font-size: 14px;
    color: #333;
}
.advantage-desc li .desc{
    display: none;
}
.solve-list{
    margin: 80px auto 150px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 1000px;
}
.solve-list li{
    background:#FFFFFF url(../img/service_p3_01.png) no-repeat center top;
    width: 260px;
    text-align: center;
    padding: 50px 30px 0;
    box-shadow: 0px 10px 20px 0px rgba(0, 9, 76, 0.1);
    border-radius: 5px;
    box-sizing: border-box;
}

.solve-list li h5{
    font-size: 12px;
    color: #6036CB
}
.solve-list li h2{
    font-size: 30px;
    color: #333;
    margin: 20px 0 30px;
    font-weight: bold;
}
.solve-list li .point{
    width: 44px;
}
.solve-list li p{
    font-size: 14px;
    color: #999;
    line-height: 1.7;
    margin: 30px 0 30px;
    min-height: 90px;
}
.solve-list li .btn{
    width: 100px;
    height: 40px;
    display: block;
    background: linear-gradient(90deg, #0DC2F5 0%, #6036CB 100%);
    box-shadow: 0px 10px 20px 0px rgba(0, 9, 76, 0.1);
    border-radius: 20px;
    color: #fff;
    text-align: center;
    color: #fff;
    line-height: 40px;
    margin: 50px auto;
}


.industry-list{
    display: flex;
    flex-wrap: wrap;
    width: 1100px;
    justify-content: space-between;
    margin: 60px auto;

}
.industry-list li{
    width: 150px;
    height: 150px;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.industry-list li .pic{
    width: 100px;
    height: 100px;
}
.placeholder {
    width: 16.6666666%;
    height: 0px;
    order: 1 

}
.industry-list li:hover{
    box-shadow: 0px 0px 10px 0px rgba(96, 54, 203, 0.3);
}

/*scrm*/
.scrm{width:100%; overflow:hidden; position:relative;  background: url(../img/scrm_ban.jpg) no-repeat center top; height: 900px; }
.scrm-info{
    margin-top: 320px;
    margin-left: 80px;
}
.scrm-info h3{
    font-size: 48px;
    color: #fff;
    font-weight: bold;
    
}
.scrm-info h4{
    font-size: 36px;
    color: #fff;
    display: flex;
    align-items: center;
    margin: 60px 0 40px;
}
.scrm-info h5{
    font-size: 24px;
    color: #fff;
}

.scrm-info h6{
    margin: 60px 0 0;
    font-size: 24px;
    color: #fff;
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 16px 4px rgba(51, 51, 51, 0.2);
    border-radius: 30px;
    width: 200px;
    height: 60px;
    line-height: 60px;
    text-align: center;
}

.scrm-part-one ul{
    padding: 30px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.scrm-part-one ul li{
    padding: 50px 30px;
    text-align: center;
    width: 280px;
    height: 300px;
    background: #FFFFFF;
    border-radius: 5px;
    box-sizing: border-box;
}
.scrm-part-one ul li:hover{
    box-shadow: 0px 10px 20px 0px rgba(96, 54, 203, 0.3);
}
.scrm-part-one ul li .pic{
    width: 88px;
}
.scrm-part-one ul li h3{
 font-size: 20px;
    color: #333;
    margin: 30px 0;
}
.scrm-part-one ul li h4{
     font-size: 16px;
     color: #999;
     line-height: 1.76;
}
.scrm-part-title{
    font-size: 28px;
    text-align: center;
    margin: 40px 0 10px;
}
/*scrm介绍*/
.scrm-special{
    padding: 30px 0;
}
.exhibition{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 60px auto;
}
.text-data-wrap {
    width: 400px;
}

.text-data-wrap .text-data {
    width: 400px;
    height: 70px;
    padding: 0 20px;
    margin-bottom: 20px;
    position: relative;
    cursor: pointer;
}
.text-data-wrap .text-data-title {
    font-size: 18px;
    color: #3f4e66;
    padding: 14px 0 6px 0;
}
.text-data-desc{
    color: #333;
    font-size: 14px;
}
.text-data-wrap .icon-intro {
    width: 42px;
    height: 42px;
    margin: 12px 20px 0 auto;
    background-size: 100% 100%;
    display: inline-block;
    float: left;
}

.text-data-active {
    background: #ffffff;
    box-shadow: 0 2px 5px 0 rgba(68, 68, 68, .15);
    border-radius: 4px;
    overflow: hidden;
    color: #1f2329;
    background: url("../img/select_box.png") no-repeat left center;
}


.text-data-active .text-data-title{
    font-weight: 600;
}

.text-data-pic {
    width: 505px;
    height: 240px;
    position: relative;
    box-shadow: 0px 0px 20px 0px rgba(96, 54, 203, 0.3);
}

.text-data-pic .data-pic {
    display: none;
    width: 505px;
    height: 240px;
    position: absolute;
}

.text-data-pic img:hover{
    transform: scale(1.5);
    transition: all 2s;
}

.data-pic-active {
    display: block !important;
}

.text-data-wrap .icon-intro {
    width: 42px;
    height: 42px;
    margin: 12px 20px 0 auto;
    background-size: 100% 100%;
    display: inline-block;
    float: left;
}

.text-data-wrap .icon-intro-1 {
    background: url("../img/scrm/icon-intro-1.png");
}

.text-data-wrap .icon-intro-2 {
    background: url("../img/scrm/icon-intro-2.png");
}

.text-data-wrap .icon-intro-3 {
    background: url("../img/scrm/icon-intro-3.png");
}

.text-data-wrap .icon-intro-4 {
    background: url("../img/scrm/icon-intro-4.png");
}

.text-data-wrap .icon-intro-5 {
    background: url("../img/scrm/icon-intro-5.png");
}

.text-data-wrap .icon-intro-6 {
    background: url("../img/scrm/icon-intro-6.png");
}

.text-data-wrap .icon-intro-7 {
    background: url("../img/scrm/icon-intro-9.png");
}

.text-data-wrap .icon-intro-8 {
    background: url("../img/scrm/icon-intro-8.png");
}

.text-data-wrap .icon-intro-9 {
    background: url("../img/scrm/icon-intro-7.png");
}

.text-data-wrap .icon-intro-10 {
    background: url("../img/scrm/icon-intro-10.png");
}

.text-data-wrap .icon-intro-11 {
    background: url("../img/scrm/icon-intro-11.png");
}

.text-data-wrap .icon-intro-12 {
    background: url("../img/scrm/icon-intro-12.png");
}

.text-data-wrap .icon-intro-6 {
    background: url("../img/scrm/icon-intro-6.png");
}


.bottom-ban{width:100%; overflow:hidden; position:relative;  background: url(../img/bottom_ban.png) no-repeat center top; height: 268px; }
.bottom-ban .bottom-ban-btn{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 180px;
    height: 40px;
    background: linear-gradient(-90deg, #26DF78 0%, #18A88D 100%);
    box-shadow: 0px 10px 40px 0px rgba(38, 223, 120, 0.3);
    border-radius: 20px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    font-size: 16px;
}

/*联系二维码弹窗*/
.dialog-wrap {
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, .5);
    top: 0;
    display: none;
    z-index: 1000;
}

.dialog-wrap .contact-qr{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width:  400px;
    height: 696px;
    background: #fff;
    background: url(../img/contact_pop.jpg) no-repeat center top;
    background-size: 100%;
}
.dialog-wrap .contact-qr .clogo{
    width: 180px;
    margin: 20px 0 0 20px;
}
.dialog-wrap .contact-qr h3{
   padding: 20px 20px 20px 40px;
    color: #000000;
    font-size: 40px;
    margin-top: 130px;
}
.dialog-wrap .contact-qr h5{
font-size: 26px;
    color: #333;
    padding-left: 40px;
    margin-top: 10px;
}
.dialog-wrap .contact-qr .qr-pic{
    width: 200px;
    margin: 80px auto 30px;
}
.dialog-wrap .contact-qr .qr-pic img{
    width: 100%
}
.dialog-wrap .contact-qr .qr-pic h4{
    font-size: 18px;
    text-align: center;
    margin: 20px 0 0;
    color: #fff;

    
}

.dialog-wrap .contact-qr .close{
    position: absolute;
    right: 20px;
    top: 20px;
    width: 20px;
    z-index: 10000;
    cursor: pointer;
}