@charset "utf-8";
/* CSS Document */

/*首页*/
.head_box{ padding:12px 0;}
.logo{ display:block;}
.search_text{ width:340px; height:36px; border:1px solid #00a0ff; box-sizing:border-box; border-radius:18px; padding-left:20px; font-size:14px; color:#999; line-height:36px;}
.search{ display:block; right:20px; top:6px;}
.nav{ margin-top:40px;}
.nav li{ float:left; margin-left:40px; position:relative;}
.nav>li>a{ font-size:16px; color:#333; padding:6px 20px;}
.nav>li:first-child{ margin-left:0;}
.nav .current{ background-color:#00a0ff; color:#fff;}
.nav>li>a:hover{ background-color:#00a0ff; color:#fff;}
.sub_nav{ left:0; top:29px; z-index:1; width:220px; height:32px; display:none;}
.sub_nav dd{ background-color:#00a0ff; border-top:1px solid #fff;}
.sub_nav a{ font-size:14px; color:#fff; padding-left:20px; line-height:32px;}
.sub_nav a:hover{ color:#000;}
.nav li:hover .sub_nav{ display:block;}

.banner_box{ height:550px; overflow:hidden; width: 100%;}
.block{ bottom:30px; left:50%; margin-left: -70px;}
.block dd{ width:16px; height:16px; border-radius:50%; background-color:#fff; cursor: pointer; float:left; margin-left:6px;}
.block>dd:first-child{ margin-left:0;}
.block .now{ background-color:#ccc;}

.pro_title h1{ font-size:30px; color:#333; text-align:center; line-height:96px;}
.pro_title .deco{ display:block; margin:0 auto; margin-top:10px; margin-bottom:20px;}
.arrow_left{display:block; left:-5%; top:120px; width: 100px; cursor: pointer;}
.arrow_right{display:block; right:-5%; top:120px; width: 100px; cursor: pointer;}
.pro_show{ width:1034px; padding: 30px; margin:0 auto; overflow:hidden;}
.pro_move{ width:2000px;}
.pro_border{ width:250px; height:300px; border:1px solid #eee; box-sizing:border-box; float:left; margin-left:16px;}
.pro_move>.pro_border:first-child{ margin-left:0;}
.pro_bg{ width:230px; height:240px; margin:0 auto; margin-top:10px; background-color: white; padding-top:15px; padding-bottom:25px;}
.pro_bg img{ display:block; margin:0 auto; width:200px; height:130px;}
.pro_bg h2{ font-size:16px; color:#333; line-height:40px; text-align:center}
.pro_bg h3{ font-size:14px; color:#666; line-height:24px; padding:0 12px; text-align:center;}
.sell_btn{ width:60px; height:28px; background-color:#00a0ff; border:none; border-radius:15px; margin:0 auto; font-size:14px; color:#fff; line-height:28px; margin-top:10px; text-align:center;}
.sell_btn:hover{ cursor:pointer;}

.tech_col{ width:300px; float:left; height:240px;}
.tech_col img{ display:block; margin:0 auto; margin-top:24px;}
.tech_col h2{font-size:16px; color:#333; line-height:40px; text-align:center;}
.tech_col h3{ font-size:14px; color:#666; line-height:24px; padding:0 20px; text-align:center;}

.case_ml{ height:auto; overflow:hidden;margin-left: 60px;}
.case_bg{ background-color:#f2f2f2; padding:10px 0; padding-bottom:40px; background: white;}
.arrow_1{display:block; margin-right:10px; margin-top:155px;}
.arrow_2{display:block; margin-left:10px; margin-top:155px;}
.case_show{ width:1080px; height:auto; overflow:hidden;}
/* .case_move{ width:3240px;} */
.case_info{ width:320px; float:left; margin: 0 20px 20px; position: relative;}
.case_info img{ width:300px; height:170px; display:block; margin:0 auto;}
.case_content {
    display: none; color: white; position: absolute; top: 0; left: 10px; right: 10px; bottom: 40px; background: rgba(0,0,0,0.7);
}
.case_content span {
    text-indent:24px;display: inline-block; line-height: 20px; color: white; margin: 30px 20px 0;font-size: 12px; opacity: 0.9;
}
.case_info h2{ font-size:14px; color:#333; line-height:40px; text-align:center; width:260px; margin:0 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.case_col{ margin:0 auto; float:left;}

.about_info{ width:600px;}
.about_font{ font-size:14px; color:#666; line-height:26px; text-indent:24px;}
.more_btn{ width:120px; height:36px; margin:0 auto; background: white; border-radius: 6px; border: 1px solid #4db0e3; font-size:14px; color:#4db0e3; line-height:32px; text-align:center;}
.more_btn:hover{ cursor:pointer;}
.about_right{ width:560px;}
.about_01{ display:block; width:560px; height:240px; margin-bottom:10px;}
.about_img img{ display:block; width:180px; height:120px; float:left; margin-left:10px;}
.about_img>img:first-child{ margin-left:0;}

.bottom_bg{ background-color:#f2f2f2; padding-top:5px; margin-top:10px;}
.bottom_logo{ width:180px;}
.logo_1{ display:block; margin:0 auto;}
.bottom_logo h1{ font-size:14px; color:#666; line-height:24px; padding-left:50px; margin-top:20px;}
.link_box{ width:200px; margin-left:70px;}
.link_box li{ font-size:14px; color:#000; line-height:26px;}
.link_box a{ font-size:14px; color:#666; line-height:26px;}
.company_box{ width:240px; margin-left:70px;}
.company_info h2{ font-size:14px; color:#000; line-height:26px;}
.company_info h3{ font-size:14px; color:#666; line-height:26px;}
.erweima_box{ width:100px;}
.erweima_box img{ display:block; margin:0 auto;}
.erweima_box h4{ font-size:14px; color:#333; line-height:24px; text-align:center;}
.bottom_box h6{ font-size:14px; color:#666; text-align:center; line-height:30px; margin-top:16px;}
.bottom_box h6 a{ font-size:14px; color:#666; text-align:center; line-height:30px; margin-top:16px;}

.about_content p{ font-size:14px; color:#666; line-height:28px;}
.about_img_col img{ display:block; width:285px; height:171px; float:left; margin-left:20px;}
.about_img_col>img:first-child{ margin-left:0;}

.case_mulu{ width:285px; float:left; margin-right:20px;}
.case_mulu:nth-child(4n){ margin-right:0;}
.case_mulu img{ display:block; width:285px; height:170px; margin:0 auto;}
.case_mulu h2{ font-size:14px; color:#333; line-height:40px; text-align:center; width:275px; margin:0 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.case_mulu h2:hover{ color:#00a0ff;}

.news_col{ width:600px; float:left; margin-bottom:20px; margin-top:20px;}
.news_title{ width:80px; height:80px; background-color:#00a0ff;}
.news_title h2{ font-size:16px; color:#fff; font-weight:bold; line-height:48px; text-align:center; border-bottom:1px solid #fff;}
.news_title h3{ font-size:20px; color:#fff; line-height:32px; text-align:center;}
.news_info{ width:480px; margin-left:20px;}
.news_info h4{ font-size:18px; color:#000; line-height:24px; margin-bottom:10px; width:480px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news_font{ font-size:14px; color:#666; line-height:24px;}
.news_font p{ font-size:14px; color:#666; line-height:24px;}
.news_info h4:hover{ color:#00a0ff;}


.page{ width:410px; margin:0 auto; margin-top:40px; margin-bottom:40px;}
.page li{width:60px; height:30px; border:1px solid #00a0ff; box-sizing:border-box; float:left; margin-left:10px; font-size:14px; color:#00a0ff; text-align:center; line-height:30px;}
.page>li:first-child{ margin-left:0;}
.page .currently{ background-color:#00a0ff; color:#fff;}
.page li a{display:block;font-size:14px;color:#00a0ff;width:100%;height:100%;}
.page li:hover{background-color:#00a0ff;}
.page li a:hover{ color:#fff;}

.job_box{ margin-top:30px;}
.job_col{ float:left; width:580px; height:200px; margin-right:40px; margin-bottom:40px; /*background:url(../images/job_bg.png) no-repeat center;*/}
.job_col:nth-child(2n){ margin-right:0;}
.job_col h2{ float:left; font-size:28px; color:#fff; line-height:40px; margin-top:60px; width:150px; text-align:center; margin-left:20px;}
.job_info{ width:400px; margin-left:10px; padding:14px 0;}
.job_info h3{ font-size:20px; color:#000; line-height:36px;}
.job_info h4{ font-size:12px; color:#666; line-height:22px;}
.job_info p{ font-size:12px; color:#666; line-height:22px;overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical; padding-right:10px;}
.job_btn{ width:80px; height:32px; margin:0 auto; margin-top:10px; border-radius:4px;  background-color:#00a0ff; border:none; font-size:14px; color:#fff; line-height:32px; text-align:center;}
.job_btn:hover{ cursor:pointer;}


.form_box{ width:580px; margin-top:30px;}
.name_text{ width:570px; height:50px; margin-bottom:20px; background-color:#f2f2f2; border:none; font-size:14px; color:#999; line-height:50px; padding-left:10px;}
.submit{ width:580px; height:40px; background-color:#00a0ff; border:none; font-size:14px; color:#fff; line-height:40px; text-align:center;}
.contact_info{ width:580px; margin-top:30px;}
.contact_info h2{ font-size:16px; color:#333; line-height:50px; text-align:left; padding-left:32px;}

.pro_nav{ width:240px; cursor: pointer;}
.pro_nav dd{ width:240px; height:40px; border:1px solid #00a0ff; border-top:none; box-sizing:border-box; font-size:14px; color:#00a0ff;; line-height:40px; text-align:center;}
.pro_nav dt{ width:240px; height:40px; background-color:#00a0ff; font-size:18px; color:#fff;; line-height:40px; text-align:center;}

.pro_xq{ width:900px;}
.pro_xq h1{ width:880px; height:40px; background-color:#00a0ff; font-size:14px; color:#fff; line-height:40px; padding-left:20px;}
.pro_nr h2{ font-size:20px; color:#000; line-height:50px; text-align:center;}
.pro_nr p{ font-size:14px; color:#666; line-height:30px; text-indent:24px;}
.pro_nr img{ display:block; margin:0 auto; margin-top:10px; margin-bottom:10px;}
.pro_nav .yangshi{ color:#000;}


.news_xq h1{ font-family:"黑体"; font-size:24px; color:#000; text-align:center; line-height:50px;}
.news_data{ width:800px; margin:0 auto;}
.news_data h2{ font-size:14px; color:#999; line-height:40px;}
.news_data h3{ font-size:14px; color:#666; line-height:20px; float:right;}
.news_xq p{ font-size:14px; color:#666; line-height:30px; margin-top:15px; text-indent:24px;}
.news_xq img{ display:block; margin:0 auto; margin-top:10px; margin-bottom:10px;}
.news_xq p p span span {
    font-size: 14px;
    color: #666;
}
.news_xq p span {
    font-size: 14px;
    color: #666;
}

.search_result{ width:800px; margin:0 auto; margin-top:20px;}
.search_result span{ font-size:17px; color:#00a0ff; line-height:40px;}
.result_col h1{ font-size:14px; color:999; line-height:32px; float:left; text-decoration:underline;}
.result_col h2{ font-size:14px; color:999; line-height:32px; float:right;}

/*点击购买*/
.shadow_box{ z-index:100; position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.4);}
.shadow_box form{ width:280px; height:260px; padding:20px; margin:0 auto; margin-top:200px; background-color:#fff;}
.sell_info h1{ font-size:16px; color:#666; line-height:45px; margin-top:20px;}
.xm_text{ width:270px; height:36px; background-color:#e6e6e6; border:none; font-size:14px; color:#666; line-height:40px; margin-bottom:20px; padding-left:10px;}
.submit_btn{ width:80px; height:36px; background-color:#00a0ff; border:none; border-radius:18px; font-size:14px; color:#fff; line-height:36px; text-align:center;}
.btn_box .gray{ background-color:#e6e6e6;}
body {
    width: 100%;
}


.banner-div {
    height: 500px; 
    position: relative; 
    float: left;
    width: 100%;
}
.banner-div img {
    height: 800px; 
    margin-top: -100px;
    width: 100%;
}
.banner-div span {
    color: white;
    position: absolute; 
    top: 50%; 
    left: 0;
    display: inline-block;
    width: 100%;
    height: 60px;
    margin-top: -30px;
    font-size: 30px;
    text-align: center;
    opacity: 0.9;
}
.pro_border:hover {
    transform: scale(1.1);  
    animation-duration:2s;
    -webkit-animation-duration:2s; /* Safari 和 Chrome */
    border: 2px solid #7483ec;
    -webkit-box-shadow: 0 0 5px rgba(149,160,241,1);
    box-shadow: 0 0 5px rgba(149,160,241,1);
}

/* 技术支持动画 */
.event-list{
    font-family: "寰蒋闆呴粦";
    padding: 80px 0;
    }
    .event-list a:hover{text-decoration: none;}
    .col1{width: 25%; height: 263px;text-align: center; float: left;}
    .col1 h5{font-size: 16px; color: #666;font-weight: 700;}
    .col1 p{font-size: 14px; color: #999; margin-bottom: 0;}
    .event-wrp{
        width: 110px;
        height: 80px;
        margin: 0 auto;
        position: relative;
    }
    .col2 .event-wrp{width: 80px;}
    .col3 .event-wrp{width: 75px;}
    .col4 .event-wrp{width: 95px;}
    .col5 .event-wrp{width: 62px;}
    .col6 .event-wrp{width: 73px;}
    .col7 .event-wrp{width: 76px;}
    .col8 .event-wrp{width: 86px;}
    .col9 .event-wrp{width: 71px;}
    .col10 .event-wrp{width: 89px;}
    .event-wrp #event-1-main {
        position:absolute;
        top:0;
        left:0;
    }   
    .event-wrp  img,.event-wrp  img {
        -webkit-transform:scale(.8);
        -moz-transform:scale(.8);
        -ms-transform:scale(.8);
        -o-transform:scale(.8);
        transform:scale(.8)
    }
    .event-wrp .event-dot1 img,.event-wrp .event-dot2 img {
        -webkit-transform:scale(.8);
        -moz-transform:scale(.8);
        -ms-transform:scale(.8);
        -o-transform:scale(.8);
        transform:scale(.8)
    }

    #event-1-wrp .event-dot1 {
        position: absolute;
        top:5px;
        left:10px;
    
    }
    .col2 #event-1-wrp .event-dot1 {
        position: absolute;
        top:10px;
        left:5px;
    
    }
    .col4 #event-1-wrp .event-dot1 {
        position: absolute;
        top:-6px;
        left:5px;
    
    }
    .col5 #event-1-wrp .event-dot1 {
        position: absolute;
        top:-6px;
        left:-5px;
    
    }
    .col6 #event-1-wrp .event-dot1 {
        position: absolute;
        top:36px;
        left:2px;
        -webkit-transform:rotate(135deg);
        -moz-transform:rotate(135deg);
        -ms-transform:rotate(135deg);
        -o-transform:rotate(135deg);
        transform:rotate(135deg)
    
    }
    .col7 #event-1-wrp .event-dot1 {
        position: absolute;
        top:29px;
        left:21px;
        -webkit-transform:rotate(180deg);
        -moz-transform:rotate(180deg);
        -ms-transform:rotate(180deg);
        -o-transform:rotate(180deg);
        transform:rotate(180deg)
    
    }
    .col8 #event-1-wrp .event-dot1 {
        position: absolute;
        top:0;
        left:10px;
    }
    .col9 #event-1-wrp .event-dot1 {
        position: absolute;
        top:14px;
        left:0;
        -webkit-transform:rotate(180deg);
        -moz-transform:rotate(180deg);
        -ms-transform:rotate(180deg);
        -o-transform:rotate(180deg);
        transform:rotate(180deg)
    }

    .col1 #event-1-wrp .event-dot2 {
        position: absolute;
        top:0;
        left:58px;
    
    }
    .col2 #event-1-wrp .event-dot2 {
        position: absolute;
        top:9px;
        left: 60px;
    
    }
    .col4 #event-1-wrp .event-dot2 {
        position: absolute;
        top:-8px;
        left: 74px;
    
    }
    .col6  #event-1-wrp .event-dot2 {
        position: absolute;
        top:-1px;
        right:16px;
        -webkit-transform:rotate(-45deg);
        -moz-transform:rotate(-45deg);
        -ms-transform:rotate(-45deg);
        -o-transform:rotate(-45deg);
        transform:rotate(-45deg)
    
    } 
    .col5  #event-1-wrp .event-dot2 {
        position: absolute;
        top:-8px;
        left:58;
        -webkit-transform:rotate(180deg);
        -moz-transform:rotate(180deg);
        -ms-transform:rotate(180deg);
        -o-transform:rotate(180deg);
        transform:rotate(180deg)
    
    }
    .col7  #event-1-wrp .event-dot2 {
        position: absolute;
        top:-9px;
        left: 41px;
    
    }
    .col8 #event-1-wrp .event-dot2 {
        position: absolute;
        top:5px;
        left:50px;
    }
    .col9 #event-1-wrp .event-dot2 {
        position: absolute;
        top:14px;
        left:63px;
        
    }
    #event-1-wrp .line1{ position: absolute;
        top:3px;
        left:6px;
        -webkit-transform:rotate(135deg);
        -moz-transform:rotate(135deg);
        -ms-transform:rotate(135deg);
        -o-transform:rotate(135deg);
        transform:rotate(135deg);
    }
    #event-1-wrp .line2{ position: absolute;
        top:42px;
        left:4px;
        -webkit-transform:rotate(45deg);
        -moz-transform:rotate(45deg);
        -ms-transform:rotate(45deg);
        -o-transform:rotate(45deg);
        transform:rotate(45deg);
    }
    #event-1-wrp .line3{ position: absolute;
        top:6px;
        left:45px;
        -webkit-transform:rotate(-135deg);
        -moz-transform:rotate(-135deg);
        -ms-transform:rotate(-135deg);
        -o-transform:rotate(-135deg);
        transform:rotate(-135deg)}
    #event-1-wrp .line4{ position: absolute;
        top:43px;
        left:42px;
        -webkit-transform:rotate(-45deg);
        -moz-transform:rotate(-45deg);
        -ms-transform:rotate(-45deg);
        -o-transform:rotate(-45deg);
        transform:rotate(-45deg);
    }
    .col10 #event-1-wrp .event-dot2 {
        position: absolute;
        top:-16px;
        left:36px;
    }
    .col10 #event-1-wrp .event-dot1 {
        position: absolute;
        top:11px;
        left:4px;
    }

    .event-in #dot1 {
        animation:dot1 1.8s cubic-bezier(.455, .03, .515, .955) infinite;
        -webkit-animation-delay:0s;
        
    }
    .event-in #dot2 {
        animation:dot2 1.8s cubic-bezier(.455, .03, .515, .955) infinite;
    }
    .event-in #event-1-wrp #dot1 {
        animation-delay:.15s;
        -webkit-animation-delay:.15s infinite;
    }
    @keyframes dot1 {
        0% {
        transform:translate(0, 0) scale(.8);
        opacity:1;
    }
    20% {
        transform:translate(0, -40px) scale(.8);
        opacity:0;
    }
    40% {
        transform:translate(0, 20px) scale(.8);
        opacity:0;
    }
    70% {
        transform:translate(0, 0) scale(.8);
        opacity:1;
    }
    100% {
        transform:translate(0, 0) scale(.8);
        opacity:1;
    }
    }
    @keyframes dot2 {
        0% {
        transform:translate(0, 0) scale(.8);
        opacity:1;
    }
    20% {
        transform:translate(0, -40px) scale(.8);
        opacity:0;
    }
    40% {
        transform:translate(0, 20px) scale(.8);
        opacity:0;
    }
    70% {
        transform:translate(0, 0) scale(.8);
        opacity:1;
    }
    100% {
        transform:translate(0, 0) scale(.8);
        opacity:1;
    }
}
.event-link{cursor: default;}

.about_us {
    height: auto;
    overflow: hidden;
    clear: both;
    width: 70%;
    padding: 0 15%;
}
.map-box {
    width: 58%; 
    height: 350px; 
    overflow: hidden;
    float: left;
}
.map {
    width: 100%;
    height: 400px;
}
.map-right {
    float: left;
    margin-left: 4%;
    width: 38%;
}
/* 底部 */
.bottom-box {
    background: #6e6e6e; 
    font-size: 14px; 
    margin: 0 auto; 
    text-align: center; 
    background-size: 100%; 
    width: 100%; 
    height: 180px; 
    position: relative;
    overflow: hidden;
}
.bottom-top1 {
    margin-left: 30px;
}
.bottom-top1, .bottom-top2 {
    float: left;
    width: 24%;
    height: 200px;
    text-align: left;
}
.bottom-top1 p, .bottom-top2 p {
    font-size: 20px;
    color: white;
    text-align: left;
    margin-top: 20px;
}
.bottom-top1 span, .bottom-top2 span {
    display: inline-block;
    font-size: 14px;
    color: white;
    margin-right: 15px;
    margin-top: 20px;
}
.bottom-h {
    position: absolute; 
    color: #fff; 
    left: 0; bottom: 20px; 
    font-size: 12px; 
    padding-top: 20px; 
    border-top: 1px solid white; 
    width: 50%; 
    text-align: left; 
    margin-left: 30px;
}
.bottom-top3 {
    width: 20%;
    height: 100%;
    float: right;
    text-align: center;
}
.bottom-top3 img {
    width: 100px;
    height: 100px;
    margin-top: 30px;
    margin-bottom: 10px;
}
.bottom-top3 div {
    font-size: 14px;
    color: white;
}
.bottom-top4 {
    width: 10%;
    height: 100%;
    float: right;
    text-align: left;
    margin-right: 20px;
    margin-top: 10px;
}
.bottom-top4 span {
    color: white;
    font-size: 14px;
    margin-top: 10px;
    display: inline-block;
}
.bottom-top4 img {
    width: 50px;
    float: left;
}

