@charset "utf-8";

* {	margin: 0;	padding: 0;}

body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,img {	border: medium none;	margin: 0;	padding: 0; font-weight:500;}
th,td{
    margin: 0;	padding: 0; font-weight:500;
}

body,button,input,select,textarea {	 font-family:"微软雅黑","宋体",tahoma,Srial,helvetica,sans-serif;	outline: none;}

body{ overflow-x:hidden;}

h1,h2,h3,h4,h5,h6 {	font-size: 100%;}

ul,ol,li {	list-style: none; }

a {	text-decoration: none;	color: #373737;    vertical-align: top;}

a:hover {	color: #002a6d;}

img {	border: 0px;}

em{ font-style:normal;}

table {	border-collapse: collapse;	border-spacing: 0;}

html,body {	color: #373737;	background: #fff;	margin: 0 auto;font-size: 14px !important;}

::selection { color: #fff; background-color: #002a6d;}    

::-moz-selection { color: #fff; background-color: #002a6d;} 

.hide {	display: none;}

.clear {clear: both;}

.center{ text-align:center;}

.pic100 img{width:100%;}

.justify_fix{display:inline-block;*display: inline; *zoom:1; width:100%; height:0; overflow:hidden;}

.f-turn{-webkit-transition: all .3s ease-in;
    
    -moz-transition: all .3s ease-in;
    
    -ms-transition: all .3s ease-in;
    
    -o-transition: all .3s ease-in;
    
    transition: all .3s ease-in;}
    
.fl{float:left;}

.fr{float:right;}

.overflow{ overflow:hidden;}

.white,.white a{ color:#fff;}

.rela{ position:relative;}

.pad0{ padding:0 !important;}

.pad60{ padding:60px 0;}

.pad90{ padding:90px 0;}

.top30{ margin-top:30px;}

.dhdh1{ float:left; width:350px; }

.dhdh{animation:mymove 3s infinite;-webkit-animation:mymove 3s infinite;-o-animation:mymove 5s infinite;-moz-animation:mymove 3s infinite;animation-direction:alternate;}

.dhdh img{ width:auto}

@keyframes mymove

{

from {left:0px;}

to {left:270px;}

}

@-moz-keyframes mymove /* Firefox */

{

from {left:0px;}

to {left:270px;}

}

@-webkit-keyframes mymove /* Safari and Chrome */

{

from {left:0px;}

to {left:270px;}

}

@-o-keyframes mymove /* Opera */

{

from {left:0px;}

to {left:270px;}

}



@font-face {
    
    font-family: 'sharp_sans_no2_thinregular';
    
    src: url('../fonts/sharp_sans_no2_thin-webfont.woff2') format('woff2'),
    
         url('../fonts/sharp_sans_no2_thin-webfont.woff') format('woff');
         
    font-weight: normal;
    
    font-style: normal;
    
    

}

@font-face {
    
    font-family: 'flip_flop_royalregular';
    
    src: url('../fonts/flip_flop_royal-webfont.woff2') format('woff2'),
    
         url('../fonts/flip_flop_royal-webfont.woff') format('woff');
         
    font-weight: normal;
    
    font-style: normal;
    
    

}

@font-face {
    
    font-family: 'castletregular';
    
    src: url('../fonts/castlen-webfont.woff2') format('woff2'),
    
         url('../fonts/castlen-webfont.woff') format('woff');
         
    font-weight: normal;
    
    font-style: normal;
    
    

}

.yjbd{
    
width: 100%;

    height: 40px;
    
    line-height: 40px;
    
    background: #930503;
    
    text-align: center;
    
    font-size: 16px;
    
    color: #fff;
    
    z-index: 300;
    
    position: fixed;
    
    bottom: 0;
    
}

.yjbd a{ color:#FFF}

header{padding:27px 6%;}

#head{ padding:40px 4%; position:fixed;top:0; z-index:2; width:100%;}

.banner{ position:relative;height:100%;overflow: hidden;}

.banner li a{ display:block;}

.banner li a img{height:100% !important;}

#head{z-index: 9;-webkit-transition: all .6s;
    
    -moz-transition: all .6s;
    
    -ms-transition: all .6s;
    
    -o-transition: all .6s;
    
    transition: all .6s;}
    
nav{width:64%;text-align:center;float:right; font-size:16px; position:relative; z-index:2;}

nav ul{ margin-bottom:0;}

nav li{float:left;width:12.5%;position:relative;}

nav li a{ display:block;position:relative;line-height:40px; padding-bottom:10px;}

nav li a i{width:0; position:absolute;bottom: 0px;left:10%;height:3px; display:inline-block; background-color:#fff;-webkit-transition: all .3s ease-in;
    
    -moz-transition: all .3s ease-in;
    
    -ms-transition: all .3s ease-in;
    
    -o-transition: all .3s ease-in;
    
    transition: all .3s ease-in;}
    
nav li a:hover i,nav li a.cur i{width:80%;}

nav li div{ display:none; position:absolute;left:0;top:100%;width: 100%;}

nav li div a{ background-color:rgba(0,0,0,.7);color:#fff;margin-bottom:3px;padding-bottom: 0;}

nav li div a:hover{background-color:rgba(1,68,138,.7);color:#fff;}

.language a{ width:40px;height:40px; background-color:#002a6d; color:#fff; border-radius:100%; display:inline-block; line-height:40px; text-align:center; position:relative; overflow:hidden;}

.language a i{width:40px;height:40px;  border-radius:100%;position:absolute;left:0px; top:0px; background-color:#1e90e5;webkit-transform: scale(0);
    
    -ms-transform: scale(0);
    
    transform: scale(0);-webkit-transition: all .3s ease-in;
    
    -moz-transition: all .3s ease-in;
    
    -ms-transition: all .3s ease-in;
    
    -o-transition: all .3s ease-in;
    
    transition: all .3s ease-in;}
    
.language a:hover i{webkit-transform: scale(1);
    
    -ms-transform: scale(1);
    
    transform: scale(1);}
    
.language a span,.h_aboutL{ position:relative; z-index:2;}

.h_about{position: relative;z-index: 2;}

.h_aboutR{ width:calc(100% - 758px); height:430px;}

.h_aboutRtime{ position:absolute;bottom:0;right:0;  padding-left: 100px;}

.h_aboutRC{ position:absolute;width:calc(100% + 50px); background-size:auto 100%;background:url(../images/h_aboutbg.png) no-repeat left top; background-size:cover;right:0; top:0; }

.h_aboutRC a{ display:block;padding:60px 60px 60px 100px;}

.h_aboutRC h5{ font-size:30px; font-weight:bold; position:relative; z-index:2;}

.h_aboutRC p{ color:#8691ac; margin-top:10px; position:relative; z-index:2;}

.h_aboutRC article{ font-size:16px; margin-top:68px;line-height:30px;height:118px; overflow:hidden; position:relative; z-index:2;}

.h_aboutRC .morebtn{ margin-top:30px;position:relative; z-index:2;}

.morebtn p{width:47px;height:27px;display:inline-block; background-color:#fff; border-radius:15px; padding:1px; position:relative;}

.morebtn p span{width:25px;height:25px; display:inline-block; border-radius:100%; background-color:#002a6d;-webkit-transition: all .3s ease-in;
    
    -moz-transition: all .3s ease-in;
    
    -ms-transition: all .3s ease-in;
    
    -o-transition: all .3s ease-in;
    
    transition: all .3s ease-in;}
    
.h_aboutRC a:hover .morebtn p span,.h_newC dl a:hover .morebtn p span{ margin-left:20px;}

.h_aboutRC font{ position:absolute;width:0;height:100%;background: url(../images/h_aboutbg2.png) no-repeat left top;background-size:cover;left:0; top:0; display:block;}

.h_aboutRC a:hover font{ width:100%;}

.h_aboutRC a:hover p{ color:#fff;}

.h_C{ margin-top:45px;}

.h_productC dl,.h_caseC dl{ margin-bottom:0;}

.h_productC dl a{ display:block;padding:40px 25px;}

.h_productC dl a dd h5{ font-size:18px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; *white-space:nowrap; position:relative; z-index:2; color:#002a6d;}

.h_productC dl a dd p{ font-size:12px;color:#797979;line-height:22px;height:44px; overflow:hidden; margin:23px 0 25px;position:relative; z-index:2;}

.h_productC dl a dt{position:relative; z-index:2;}

.h_productC dl font{ background-color:#a2a1a7; position:absolute;width:100%;height:0;top:0; display:block;left: 0;}

.h_productC dl a:hover font{height:100%;}

.h_productC dl a:hover h5,.h_productC dl a:hover p{ color:#fff;}

.h_productC dl:nth-child(1),.h_productC dl:nth-child(2),.h_productC dl:nth-child(3),.h_productC dl:nth-child(4){ border-bottom:10px solid #f7f7f7;}

.h_num{ background:url(../images/bg1.jpg) fixed no-repeat center top; border-top:100px solid #f7f7f7;border-bottom:25px solid #f7f7f7; position:relative; z-index:2;background-size: cover;}

.h_num .adtitle{ font-size:48px; font-weight:bold;}

.h_num h1{ font-size:20px;font-family: 'sharp_sans_no2_thinregular';margin-top: 10px;}

.h_num dl{ width:25%;float:left;}

.h_num dl dt{ font-size:16px; font-weight:100;}

.h_num dl dt b{ font-size:54px; display:inline-block; margin:0 3px 0 0;font-family: 'flip_flop_royalregular';font-weight: 100;}

.h_num dl dd{ font-size:16px; font-weight:100;}

.h_newC dl dt{ font-size:20px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; *white-space:nowrap;  font-weight:100;}

.h_newC dl dd time,.newmain time{ display:block; margin:25px 0 20px; color:#9b9b9b;}

.h_newC dl dd time b,.promain time span b,.newmain time span b{ font-weight:100;}

.h_newC dl dd time i{ width:0; display:inline-block;height:12px; background:url(../images/line1.jpg) no-repeat center left;}

.h_newC dl dd article{ line-height:22px;height:66px; overflow:hidden; color:#9b9b9b;font-size:12px;}

.h_newC dl a:hover dd time i{width:35px;}

.h_newC dl a:hover dd time b,.promain time span b,.newmain time span b{ color:#002a6d;}

.h_newC dl .morebtn{ margin-top:45px;position:relative;}

.h_newC dl .morebtn p{background-color: #a2a1a7;}

.h_newC dl .morebtn p span{background-color: #fff;}

.h_newC dl a:hover .morebtn p {background-color: #002a6d;}

.h_newC dl a:hover dt{ margin-left:20px;}

.show1{transition-delay: 0.2s;animation-delay: 0.2s;-webkit-animation-delay: 0.2s;}

.show2{transition-delay: 0.4s;animation-delay: 0.4s;-webkit-animation-delay: 0.4s;}

.show3{transition-delay: 0.6s;animation-delay: 0.6s;-webkit-animation-delay: 0.6s;}

.show4{transition-delay: 0.8s;animation-delay: 0.8s;-webkit-animation-delay: 0.8s;}

.show5{transition-delay: 1s;animation-delay: 1s;-webkit-animation-delay: 1s;}

.show6{transition-delay: 1.2s;animation-delay: 1.2s;-webkit-animation-delay: 1.2s;}

.show7{transition-delay: 1.4s;animation-delay: 1.4s;-webkit-animation-delay: 1.4s;}

.h_case{ background:url(../images/bg2.jpg) no-repeat fixed center top;}

.h_caseC dl dd{ padding:24px 15px; font-size:18px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; *white-space:nowrap; background-color:#fff;}

.h_caseC dl dt{ overflow:hidden;}

.h_caseC dl dt img{webkit-transition: all .3s ease-in;
    
    -moz-transition: all .3s ease-in;
    
    -ms-transition: all .3s ease-in;
    
    -o-transition: all .3s ease-in;
    
    transition: all .3s ease-in;}
    
.h_caseC dl a:hover dt img{-webkit-transform: scale3d(1.2,1.2,1);
    
    -ms-transform: scale3d(1.2,1.2,1);
    
    -o-transform: scale3d(1.2,1.2,1);
    
    -moz-transform: scale3d(1.2,1.2,1);
    
    transform: scale3d(1.2,1.2,1);}
    
.h_enteyC dl dt{ float:left;width:100px;}

.h_enteyC dl dt div{ position:absolute;width:100px;height:0;left:-100px;top:0px; overflow:hidden;}

.h_enteyC dl dt div img{width:100px;height:100px;}

.h_enteyC dl dd{ width:calc(100% - 125px);float:right;}

.h_enteyC dl dd h5{ font-size:18px; margin:22px 0 5px 0;}

.h_enteyC dl dd p{ color:#bebebe; text-transform:uppercase;}

.h_enteyC dl a:hover dt div{ height:100px;}

.link{ background:url(../images/linkbg.jpg) no-repeat left; padding:20px 15px; background-size:110% 100%; position:relative; z-index:2;}

.link li{ display:inline-block; margin:0 12px;}

.link li a{ display:block;}

footer{ background-color:#242424; position:relative; z-index:2;}

.footL dl{float:left; margin-right:6.6%;}

.footL dl dt{font-size:18px; font-weight:100; margin-bottom:30px;}

.footL dl dd a{ display:block; color:#9b9a9a; margin:8px 0;}

.footC dl dt{ margin:25px auto 16px;}

.footC dl dt img{ width:129px;}

.footR{ color:#9b9a9a;line-height:25px;}
.col-lg-3.footR{padding-right: 0px;}
.footR b{color:#fff; display:block;font-size:16px; font-weight:100; margin:8px 0;}
.footR b:first-child span{font-size:28px;font-weight: 700;}

.foottel{ color:#fff; font-size:18px; margin:25px 0;font-family: 'flip_flop_royalregular';}

.bq{ background-color:#242424; padding:35px 15px; border-top:1px solid #3e3e3e;}

.large-header{position:fixed;width: 100%; top:0;left:0;}

.scrtop nav,.menu{ display:none;}

.menu{float: right;margin-right: 25px;}

.menu img{ width:45px; margin-top:5px;}

.scrtop .menu{ display:block;}



.header-left{width: 25%;position: fixed;left:-25%;top: 0;height: 100%;z-index: 18;opacity: 0;transition: all 0.5s;-webkit-transition: all 0.5s;overflow: hidden;}

.header-left.on{opacity: 1;left:0%}

.header-left img{display: block;transform:scale(1.1);-webkit-transform:scale(1.1);transition: all 2s;-webkit-transition: all 2s;transition-delay:0.5s;}

.header-left.on img{transform:scale(1);-webkit-transform:scale(1);}

.header{width:0%;height: 100%;position: fixed;right: 0;top: 0;background-color: #fff;z-index: 10;opacity: 0;transition: all 0.5s;-webkit-transition: all 0.5s;box-shadow: -1px 0 10px 0 rgba(0,0,0,0.2)}

.header.on{opacity: 1;width: 75%;}

.header .navv{position: absolute;right: 5%;top: 3%;z-index: 5;}

.navv{ width:40px;height:38px;margin:0 auto 0;cursor: pointer;position: relative;}

.navv p{
    
        width:40px;
        
        height: 2px;
        
        background-color: #333;
        
        position: absolute;
        
        left: 0;
        
        -webkit-transition: all 0.8s;
        
                transition: all 0.8s;
                
         -webkit-border-radius : 20%;
         
            -moz-border-radius : 20%;
            
                 border-radius : 20%;
                 
    }
    
    .navv p:nth-child(1){
        
        top: 2px;
        
            -webkit-transform-origin: left top;
            
                -ms-transform-origin: left top;
                
                    transform-origin: left top;
                    
            -webkit-transform: rotateZ(0deg);
            
                -ms-transform: rotateZ(0deg);
                
                    transform: rotateZ(0deg);
                    
                -webkit-transition: all 0.5s;
                
                    -ms-transition: all 0.5s;
                    
                        transition: all 0.5s;
                        
    }
    
    

    .navv p:nth-child(1){
        
         -webkit-transform: rotateZ(45deg);
         
                 transform: rotateZ(45deg);
                 
    }
    
    .float-box .navv p:nth-child(1){
        
         -webkit-transform: rotateZ(0deg);
         
                 transform: rotateZ(0deg);
                 
    }
    
    .navv p:nth-child(2){
        
        top: 16px;
        
        width: 54px;
        
        left: -7px;
        
        -webkit-transition: all 0.5s;
        
                transition: all 0.5s;
                
    }
    
    .navv p:nth-child(2){
        
        opacity: 0;
        
    }
    
    .float-box .navv p:nth-child(2){
        
        opacity: 1;
        
    }
    
    .navv p:nth-child(3){
        
        top: 30px;
        
            -webkit-transform-origin: left bottom;
            
                -ms-transform-origin: left bottom;
                
                    transform-origin: left bottom;
                    
            -webkit-transform: rotateZ(0deg);
            
                -ms-transform: rotateZ(0deg);
                
                    transform: rotateZ(0deg);
                    
                -webkit-transition: all 0.5s;
                
                    -ms-transition: all 0.5s;
                    
                        transition: all 0.5s;
                        
    }
    
    .navv p:nth-child(3){
        
        -webkit-transform: rotateZ(-45deg);
        
                transform: rotateZ(-45deg);
                
    }
    
    .float-box .navv p:nth-child(3){
        
       -webkit-transform: rotateZ(0deg);
       
                transform: rotateZ(0deg);
                
    }
    
    .header .nav1{width: auto;margin:12% 0 10% 12%;opacity: 0;transition: all 0.5s;-webkit-transition: all 0.5s;}
    
    .header .nav1.on{margin:10% 0 10% 12%;opacity: 1}
    
    .header .nav1 a{display: inline-block;margin-right:44px;padding-left: 67px;line-height: 22px;font-size:14px;color: #282828;position: relative;transition: all 0.3s;-webkit-transition: all 0.3s;}
    
    .header .nav1 a:before{display: block;width: 52px;height: 1px;content: '';display: block;position: absolute;left: 0;top: 48%;background-color: #282828;transition: all 0.3s;-webkit-transition: all 0.3s;}
    
    .header .nav1 a:hover{padding-left: 60px;margin-right:51px;}
    
    .header .nav1 a:hover:before{width:45px;}
    
    .header .nav2{width: auto;padding-left: 12%;position: relative;margin:0% 0 10% 0;opacity: 0;transition: all 0.5s;-webkit-transition: all 0.5s;position: relative;top:2%}
    
    .header .nav2.on{opacity: 1;top: 0}
    
    .header .nav2 i{display: block;width:0;height: 1px;background-color: #282828;position: absolute;left: 0;top: 50px;}
    
    .header .nav2 li{width:auto;float: left;margin-right:3%;}
    
    .header .nav2 li .h2{display: block;font-size: 24px;line-height: 25px;color: #282828;margin-bottom: 40px;padding-left: 0}
    
    .header .nav2 li .h2 span{font-size: 18px;font-family:'Century Gothic'}
    
    .header .nav2 li a{display: block;font-size: 14px;line-height: 29px;color: #666666;padding-left: 28px;}
    
    .header .nav2 li a em{display: inline-block;width:0px;height: 1px;background-color:#666666;margin-right: 3px;transition: all 0.3s;-webkit-transition: all 0.3s;}
    
    .header .nav2 li a:hover em{width: 12px;}
    
    .header .langu{height: 30px;margin-left:2%;opacity: 0;transition: all 0.5s;-webkit-transition: all 0.5s;}
    
    .header .langu.on{margin-left: 5%;opacity: 1}
    
    .header .langu a{color: #9ca3a5;font-size: 18px;margin-right: 25px;transition: all 0.3s;-webkit-transition: all 0.3s;}
    
    .header .langu a.on,.header .langu a:hover{color: #333;}
    
.otherbanner1{ padding:127px 15px;}

.other1{ background:url(../images/other1.jpg) no-repeat center center; background-size:cover;}	

.otherbanner1 h4{ font-size:60px; text-transform:uppercase;font-family: 'castletregular';}

.otherbanner1 h2{ font-size:36px;}

.otherbanner1 p{ margin-top:35px;}

.othernav{ background-color:#a2a1a7}

.othernav a{ display:block; float:left;padding:28px 5px;min-width:166px; text-align:center; color:#fff; border-left:1px solid #fff; font-size:16px;}

.othernav a:last-child{ border-right:1px solid #fff;}

.othernav a:hover{ background-color:#002a6d;}

.pagelist{ margin-top:50px; text-align:center;font-size:15px;}

.pagelist li{ display:inline-block !important;margin:0 3px;}

.pagelist li a{ display:block;height:50px;line-height:50px;padding: 0 20px; border:1px solid #dcdcdc;}

.pagelist li a:hover,.pagelist li a.cur,.othernav a:hover,.othernav a.cur{ background-color:#002a6d; color:#fff;}

.prenext{ margin-top:90px; background-color:#a2a1a7; padding:20px 15px;}

.prenext p:last-child{ text-align:right;}

.promainL{ border:1px solid #dcdcdc; margin-right:20px;}

.promain h5{ font-size:36px;}

.promain time{ display:block;margin:16px 0 40px;}

.promain time span,.newmain time span{ display:inline-block;margin-right:10px; color:#9b9b9b;}

.promain article,.about,.newmain article{ color:#747476;line-height:30px;}

.promain article img,.about img,.newmain article img{ max-width:100%;}

.tj{ margin-bottom:90px;}

.tj .h_productC dl:nth-child(1), .tj .h_productC dl:nth-child(2), .tj .h_productC dl:nth-child(3), .tj .h_productC dl:nth-child(4) { border-bottom: 0;}

.case dl dd{ font-size:18px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; *white-space:nowrap; padding:24px 15px;}

.case dl a:hover dt img{transform: scale(1.05);-webkit-transform: scale(1.05);}

.message{ font-size:16px; line-height:30px;}

.message .info{ font-size:16px; color:#999898;}

.messageC dl{ padding:0 8px !important;}

.messageC dl div{ display:flex; border:1px solid #dcdcdc; flex-direction:row; padding:15px;}

.messageC dl dt{ width:70px; font-weight:100;}

.messageC dl dd{ flex:1;}

.messageC dl dd input,.messageC dl.mess dt,.messageC dl.mess dd{ width:100%;}

.messageC dl span{ color:#f00;}

.messageC dl dt div { display: block;}

.messageC dl.mess dd textarea{ resize:inherit; width:100%;height:90px; }

.messageC dl.mess span{ position:absolute;right:25px; top:15px;}

.mess div {display: block !important;}

.submit{ padding:0 8px;}

.submit input{ background-color:#002a6d;color:#fff; width:100%;line-height:54px;}

.hr dl a{ display:block;padding:20px; border:1px solid #dcdcdc;}

.hr dl dt{ font-size:20px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; *white-space:nowrap; border-bottom:1px solid #dcdcdc; padding-bottom:15px; font-weight:100;}

.hr dl dd{ height:180px;line-height:30px; margin:20px 0; overflow:hidden;}

.hr dl span{width:130px;height:40px; text-align:center; border:1px solid #dcdcdc;line-height:40px; display:block;}

.hr dl div.div1{ width:0;height:2px; position:absolute;left:0;top:0; background-color:#2391e7}

.hr dl div.div2{ width:2px;height:0; position:absolute;left:0;top:0; background-color:#2391e7}

.hr dl div.div3{ width:0;height:2px; position:absolute;right:0;bottom:0; background-color:#002a6d}

.hr dl div.div4{ width:2px;height:0; position:absolute;right:0;bottom:0; background-color:#002a6d}

.hr dl a:hover span{ background-color:#002a6d;color:#fff;}

.hr dl a:hover div.div1,.hr dl a:hover div.div3{width:100%;}

.hr dl a:hover div.div2,.hr dl a:hover div.div4{height:100%;}

.about h4{ font-size:36px;color:#002a6d; margin-bottom:10px;}

.about h5{ font-size:24px; margin:20px 0 47px;color:#2f2f2f;}

.develop .line{ position:absolute;width:1px;height:100%;left:0;top:0; background-color:#a2a1a7;}

.develop dl{ margin-bottom:50px;}

.develop dl a{ display:block; padding-left:45px; background:url(../images/icon-9.png) no-repeat top 10px left;}

.develop dl a:hover{  background:url(../images/icon-10.png) no-repeat top 10px left;}

.develop dl dt{ font-size:30px; font-weight:100; margin-bottom:25px;}

.develop dl dd div{ width:420px;float:left;}

.develop dl dd p{ width:calc(100% - 460px);float:right;line-height:30px;max-height:270px; overflow:hidden;}

.develop dl a:hover dt{ color:#005bac;}

.contactR h5{ font-size:30px; color:#002a6d;}

.contactR article{ line-height:30px; margin:20px 0;}

.contactR dl{width:160px; display:inline-block; margin-right:10px;}

.contactR dl dd{line-height: 20px;}

.map{ height:435px; border:1px solid #dcdcdc;}

.new .newlist:first-child dl{width:50%;float:left; margin-bottom:0; padding:53px 35px !important; background-color:#f7f7f7;} 

.new .newlist:first-child {width:100% !important;}

.new .newlist{ margin-bottom:50px;}

.newlistpic{ display:none;} 

.new .newlist:first-child .newlistpic{ display:block;} 

.new .newlist:first-child dl article{ font-size:14px;line-height: 25px;height: 125px;}

.new .newlist:first-child dl dt{ font-size:30px;}

.newlistpic{width:50%;float:left;}

.newlistpic a{ width:100%; display:block;height:414px;}

.newmain h1{ text-align:center; font-size:30px;}
.newmain h2{ color: #ffffff;font-size: 28px;}

.newmain time{text-align:center; display:block;}

.newmain .info{ background-color:#f7f7f7;padding:20px;line-height:30px; margin-bottom:20px;}

.download li{ margin-bottom:20px;}

.download li a{ display:block; border:1px solid #dcdcdc; padding:20px; overflow:hidden;}

.download li p{line-height:28px; font-size:18px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; *white-space:nowrap;width:80%;float:left;}

.download li i{ width:24px;height:28px; display:inline-block; background:url(../images/icon-11.png) no-repeat;float:right;}

.download li a:hover i{ background:url(../images/icon-12.png) no-repeat;}

.download li a:hover{ border-color:#002a6d;}



.teltel {display:none;position: fixed;right: 20px;bottom: 10%; z-index:5 }

.teltel img {width: 40px;}



.mobilenav { margin: 10% 10% 10% 12%;height: 80%;overflow-y: scroll; display:none;}

.mobilenav li>a{ display:block;padding:10px 0; font-size:16px;}

.mobilenav li div{ background-color:#e9f4ff;padding: 10px;}
.mobilenav li div a{ display:inline-block;margin:5px 8px;}

.banners{ display:none; width: 100%; overflow: hidden;}











.iphone {position: relative;}

.iphone__item {width:100%;height:100%;position: absolute;bottom: -2em;color: #158f76;text-align: center;}

.iphone__power-btn {width: 2.188em;height: .188em;background: #e0e0e0;position: absolute;right: 2.5em;top: -0.188em;}

.iphone__left-btn {width: .188em;height: 1.250em;top: 3.250em;left: -0.188em;position: absolute;background: #e0e0e0;}

.iphone__left-btn:before {content: '';width: .188em;height: .875em;position: absolute;top: 3em;background: #e0e0e0;}

.iphone__left-btn:after {content: '';width: .188em;height: .875em;position: absolute;top: 5.5em;background: #e0e0e0;}

.iphone__details {width: .438em;height: .438em;border-radius: 100%;position: relative;top: 1.313em;left: 8em;background: #7c7c7c;}

.iphone__details:before {content: '';width: 2.5em;height: .25em;border-radius: .25em;position: absolute;top: 1em;left: -1em;background: #7c7c7c;}

.iphone__home-btn {width: 2.25em;height: 2.25em;border-radius: 100%;position: absolute;bottom: 1em;right: 6.75em;background: #f7f7f7;}

.iphone__home-btn:before {content: '';width: .813em;height: .813em;border: .15em solid #a8a8a8;border-radius: .2em;position: absolute;top: .6em;left: .57em;}

.iphone__screen {width: 100%;height: 100%;position: absolute;top: 0;left: 0;}

.iphone__content {position: relative;background-color: #fff;width: 100%;height: 100%;}

.nav {position:fixed;z-index: 100;opacity: 0;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: 300ms;
    
          transition-duration: 300ms;}
          
.nav--active .nav {opacity: 1;background-color: #333; position:fixed;}

.nav__list {margin: 0;font-size: 16px;padding: 50px 30px 15px 30px;}

.nav__list li{ margin:10px 0;}

.nav__list li div{padding:10px 15px; font-size:14px; display:none;}

.nav__list li div p{ padding:8px 0;}

.nav__item {list-style-type: none;text-align: left;margin: 10px 0;}

.nav__link {font-size: 1.3em;text-transform: uppercase;text-decoration: none;color: #FFFFFF;opacity: 1;
    
  -webkit-transition: opacity 300ms ease-in-out;
  
  transition: opacity 300ms ease-in-out;}
  
.nav li a{ color:#fff; display:block;}

nav li a.cur{color:#002a6d; font-weight:bold;}

nav li a.cur i{background-color: #002a6d;}

.nav__trigger {display: none;position: absolute;width: 30px;height: 25px;right: 10px;top: 35px;z-index: 200;}

.nav--active .nav__trigger {    z-index: 9999;opacity: 0.5;}

.nav__icon { display: inline-block;position: relative;width: 30px;height: 3px;background-color: #b89454;
    
  -webkit-transition-property: background-color, -webkit-transform;
  
  transition-property: background-color, -webkit-transform;
  
  transition-property: background-color, transform;
  
  transition-property: background-color, transform, -webkit-transform;
  
  -webkit-transition-duration: 300ms;
  
          transition-duration: 300ms;}
          
.nav__icon:before,

.nav__icon:after {content: '';display: block;width: 30px;height: 3px;position: absolute;background: #b89454;
    
  -webkit-transition-property: margin, -webkit-transform;
  
  transition-property: margin, -webkit-transform;
  
  transition-property: margin, transform;
  
  transition-property: margin, transform, -webkit-transform;
  
  -webkit-transition-duration: 300ms;
  
          transition-duration: 300ms;
          
}

.nav__icon:before {margin-top: -10px;}

.nav__icon:after {margin-top: 10px;}

.style-1 .nav {    z-index: 999;  overflow-y: scroll;width: 100%;height: 100%;
    
-webkit-transform: translateX(-100%);

          transform: translateX(-100%);}
          
.style-1 .nav__link {opacity: 0;
    
  -webkit-transition-delay: 500ms;
  
          transition-delay: 500ms;}
          
.style-1 .nav--active .nav__link {opacity: 1;}

.style-1 .nav--active .nav {
    
  -webkit-transition: all 300ms ease-in-out;
  
  transition: all 300ms ease-in-out;
  
  -webkit-transform: translateX(0);
  
          transform: translateX(0);}
          
.style-1 .nav--active .nav__icon {background: rgba(0, 0, 0, 0);}

.style-1 .nav--active .nav__icon:before {margin-top: 0;
    
  -webkit-transform: rotate(45deg);
  
          transform: rotate(45deg);}
          
.style-1 .nav--active .nav__icon:after {margin-top: 0;
    
  -webkit-transform: rotate(-45deg);
  
          transform: rotate(-45deg);}
          
.nav--active .nav__icon:before,.nav--active .nav__icon:after{background: #fff;}





@media(max-width:1400px){
    
    .h_aboutL{ width:600px;}
    
    .h_aboutR{width: calc(100% - 600px);height: 340px;}
    
    .link .container{height: 18px; overflow: hidden;}
    
    .footL dl{margin-right: 9%;}
    
    .h_aboutRC article{margin-top: 38px;}
    
    .h_aboutRC .morebtn { margin-top: 33px;}
    
    .header .nav2 li{margin-right: 4%;}	
    
}

@media(max-width:1199px){
    
    .logo img{height: 30px;}
    
    nav {width: 67%;}	
    
    .h_aboutL{ width:450px;}
    
    .h_aboutR{width: calc(100% - 450px);height: 255px;}
    
    .h_aboutRC a{padding: 30px 30px 30px 70px;}
    
    .h_aboutRC article,.h_aboutRC .morebtn{margin-top: 30px;}
    
    .footL dl{margin-right: 6%;}
    
    nav{font-size: 14px;}
    
    .header .nav2 li{margin-right: 2%;}
    
    .header .nav2 li .h2{font-size: 20px;}
    
    .case dl dd{font-size: 16px;}
    
    .promain h5{font-size: 24px;}
    
}



@media(max-width:991px){
    
	nav,footer,.link,.othernav,.tj,.nav1,.nav2{ display:none !important;}
.h_productC dl:nth-child(7),.h_productC dl:nth-child(8),.h_caseC dl:nth-child(5),.h_caseC dl:nth-child(6),.h_caseC dl:nth-child(7),.h_caseC dl:nth-child(8),.h_aboutRC article,.language{ display:none;}

    /* .h_productC dl:nth-child(3), .h_productC dl:nth-child(4){border-bottom:0;} */
    
    .h_num{border-top: 50px solid #f7f7f7;}
    
    .h_num .adtitle { font-size: 33px;}
    
    .h_num dl dd { font-size: 13px;}
    
    .h_num dl dt b { font-size: 44px;}
    
    .bq{padding: 15px;}
    
    .h_aboutL{ width:50%;}
    
    .h_aboutR{height: auto;width:50%;}
    
    .h_aboutRC{position: inherit;right: 50px;}
    
    .h_aboutRC h5,.new .newlist:first-child dl dt{font-size: 20px;}
    
    .h_aboutRtime {position: inherit; margin-top: 20px; text-align:right;}
    
    .h_aboutRtime img{ width:70%;}
    
    .menu{ display:block;}
    
    .header .nav1.on {margin: 10% 0 10% 7%;}
    
    .header .nav2{padding-left: 7%;}
    
    .header .nav2 li .h2,.about h5{font-size: 18px;}
    
    .padpic{ width:100%;padding:0 !important; float:none !important; margin:10px 0;}
    
    .about h4 {font-size: 26px;}
    
    .otherbanner1 { padding: 87px 15px;}
    
    .otherbanner1 h4 {  font-size: 40px;}
    
    .otherbanner1 h2 { font-size: 26px;}
    
    .map{height:350px;}
    
    .contactR h5,.newmain h1{ font-size: 22px;}
    
    .contactR { margin-top:20px;}
    
    .develop dl dt { font-size: 20px;}
    
    .develop .line{left: 15px;}
    
    .develop dl dd div { width: 320px;}
    
    .develop dl dd p { width: calc(100% - 360px);max-height: 210px;}
    
    .download li p{font-size: 15px;}
    
    .prenext p:last-child {text-align:left; margin-top:15px;}
    
    .productC dl:nth-child(3),.productC dl:nth-child(4),.productC dl:nth-child(5), .productC dl:nth-child(6), .productC dl:nth-child(7), .productC dl:nth-child(8){ display: block;border-bottom: 10px solid #f7f7f7;}
    
    .promainL { margin-bottom:20px;}
    
    .mobilenav { display:block;}
    
    

}



@media(max-width:767px){
    
    .pad315{ padding:30px 15px !important;}
    
    .tit img{ width:80%;}
    
    .h_caseC,.h_enteyC{ padding:0 15px !important;}
    
    .pad90 { padding: 35px 0;}
    
    .h_num dl {width: 45%; float: none;display: inline-block; vertical-align: top;}
    
    .h_productC dl:nth-child(3)，.h_productC dl:nth-child(4){border-bottom: 10px solid #f7f7f7;}
    
    .otherbanner1 { padding: 60px 15px;}
    
    .map{height:250px;}
    
    .develop dl dd div {width: 200px;}
    
    .develop dl dd p { width: calc(100% - 220px);max-height: 120px;}
    
    .new .newlist:first-child .newlistpic{ display:none;}
    
    .new .newlist:first-child dl{ width:100%;padding: 0 !important; background-color: #fff;}
    
    .new .newlist:first-child dl article {font-size: 12px;line-height: 22px;height: 66px;}
    
    .h_productC dl{ margin-bottom:20px;}
    
    .h_productC dl a { padding: 0;}
    
    .h_productC dl a dd p{max-height: 44px;height: auto;}
    
    .banners,.teltel{ display:block;}
    
    .bannerb{ display:none;}
    
    .header-left{ width:0;}
    
    .header.on{width: 100%;}
    
    
    
}



@media(max-width:640px){

	.bq{ margin-bottom:30px}

	

	.dhdh{ display:none}

	.h_entey{ display:none}

	.h_aboutRC{ margin-top:0px}

	

    .h_aboutRC .morebtn{ display:none}
    
    .h_enteyC dl dt{width: 50px;}
    
    .h_enteyC dl dd { width: calc(100% - 65px);}
    
    .h_enteyC dl dd h5 { font-size: 16px;margin: 0 0 5px 0;}
    
    .h_enteyC dl dd p{font-size: 12px;}
    
    .h_aboutL { width: 40%;}
    
    .h_aboutR{width: 60%;}
    
    .h_aboutRtime img { width: 50%;}
    
    .h_aboutRC h5 { font-size: 16px;}
    
    .h_aboutRC p{font-size: 12px;}
    
    .h_aboutRC .morebtn{margin-top:10px;}
    
    .h_aboutRC a { padding: 20px 15px 20px 60px;}
    
    .pagelist li a{height: 35px;line-height:35px;padding: 0 12px;}
    
    header { padding: 15px 6%;}
    .h_productC dl a dd h5{
        text-align: center;
    }
}

    





@media(max-width:500px){
    
    .develop dl dt {font-size: 17px;}
    
    .develop dl dd div {width: 140px;}
    
    .develop dl dd p { width: calc(100% - 150px);max-height: 90px;}
    
    
    
}





@media (max-width:450px){
    
	.otherbanner1 h4 { font-size: 30px;}
	.otherbanner1 h2,.promain h5{font-size: 22px;}
	.contactR dl {width: 46%;margin: 0 1%;}

}











@media (max-width:430px){
    
    

}



@media (max-width:380px){
    
    .develop dl dt {font-size: 16px;}
    
    .develop dl dd div {width: 110px;}
    
    .develop dl dd p { width: calc(100% - 120px);line-height: 25px;max-height: 75px;}
    
    
    
}



@media (max-width:360px){
    
    
    
    
    
}





@media (max-width:340px){
    
    
    
}

.friend-title{
    cursor: pointer;
}

.text-buju .buju-item{
    text-align: left;
  }
@media screen and (max-width: 1920px) and (min-width: 1200px) {
  .text-buju{
    color: rgb(61, 121, 209); font-family: 微软雅黑; font-size: 16px;
  }
  .text-buju .buju-item.col-lg-1{
    width: 10%;
    padding: 0 2px;
  }
}
@media screen and (max-width: 768px){
  .text-buju .buju-item.col-xs-3{
    padding-right: 0px;
  }
}
.ad-tel{
      position: fixed;
      top: 50%;
      left: 100%;
      width: 100%;
      height: 60px;
      line-height: 60px;
      text-align: center;
      background-color: rgba(6,85,250,.8);
  }
  .ad-tel .close-tel{
      position: absolute;
      top: 50%;
      margin-top: -10px;
      right: 10px;
      width: 20px;
      height: 20px;
      background: url(../images/fork.png) center center no-repeat;
      cursor: pointer;
  }
  .ad-tel a{
      position: relative;
      font-size: 30px;
      color: #ffffff;
  }
  .ad-tel a::before{
      content: "";
      position: absolute;
      left: -75px;
      top: 50%;
      margin-top: -30px;
      width: 73px;
      height: 60px;
      background: url(../images/tel.png) center center no-repeat;
  }
  .diytable tr td{border:1px solid #000;color:#000;};
  
  
  

/* 右侧栏 */
  .kefu *{-webkit-transition: ease all .3s;-moz-transition: ease all .3s;-ms-transition: ease all .3s;-o-transition: ease all .3s;transition: ease all .3s}
  .kefu{position:fixed; right:0; top:50%; margin-top:-283px; z-index:100;background: rgba(208,235,252,0.8); border-bottom-left-radius: 10px; border-top-left-radius: 10px;}
  .kefu ul{margin: 0px;}
  .kefu ul li{ position:relative; width:90px; height:90px; line-height:80px; margin-bottom:1px; padding: 10px;}
  .kefu ul li#scroll{cursor:pointer;}
  .kefu ul li a{ display: block; border-bottom: 1px solid #fff;}
  .kefu ul li:nth-child(1){ border-top-left-radius:10px;}
  .kefu ul li p{ text-align:center; text-align:center; color:#003670; padding-top:30px; font-size:13px; text-align:center; line-height: 50px;}
  .kefu ul li .kefu1{ position: absolute; right:20px; top:10px; z-index:11; width: 40px; height: 40px;}
  .kefu ul li .kefu1,.kefu ul li .kefu2{padding-right:10px; padding-top:12.5px;}
  .kefu ul li .kefu2{position: absolute; right:-200px; top:10px; z-index:10; width: 40px; height: 40px;}
  .kefu ul li .kefu3{position: absolute; right:90px; top:0; z-index:10; background:rgba(0,80,165,0.6); padding:10px;
      -webkit-transform: scale3d(0,0,0);
      -ms-transform: scale3d(0,0,0);
      -o-transform: scale3d(0,0,0);
      -moz-transform: scale3d(0,0,0);
      transform: scale3d(0,0,0);
  }
  .kefu ul li .kefu2.kefu5{padding-right: 0;width: 90px;font-size: 12px;top: 0px;}
  .kefu ul li:hover .kefu2.kefu5{right: 0;}
  body div.jiathis_style{ left:auto !important; right:80px !important;}
  .kefu ul li.kefu4 a{ width:100% !important; line-height:80px !important; height:80px !important; background:none !important; padding:0 !important;}
  .kefu ul li .kefu3 p{ line-height:20px; padding-top:10px; padding-bottom:10px; color: #fff;}
  .kefu ul li:hover{ background: rgba(0,80,165,0.4);}
  .kefu ul li:hover .kefu1{ right:40px; opacity: 0;}
  .kefu ul li:hover .kefu2{ right:20px;}
  .kefu ul li:hover .kefu3{
      -webkit-transform: scale3d(1,1,1);
      -ms-transform: scale3d(11,1,1);
      -o-transform: scale3d(1,1,1);
      -moz-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
  .kefu ul li:hover p{ color: #fff;}

  #btm{
    display: none;
  }
    @media (max-width: 768px){
        #btm {
            display: block;
        }
    }
    #btm{
        position: fixed;
        left: 0px;
        right: 0px;
        bottom: 0px;
        z-index: 10000;
        height: 50px;
    }
    #btm>div {
        width: 50%;
        height: 50px;
        line-height: 50px;
        text-align: center;
    }
  
    #btm>div.left {
        float: left;
        color: #fff;
        background: #d80d1c;
    }
  
    #btm>div.right {
        float: left;
        color: #fff;
        background: #7edb2a;
    }
  
    #btm img {
      position: relative;
      /* top: 11px; */
        width: 28px;
        height: 28px;
    }
  
    #btm a {
        color: #fff;
        display: block;
        height: 100%;
    }
  
    #btm .left a {
        -webkit-animation: telephone 2s 2s ease infinite both;
        -moz-animation: telephone 2s 2s ease infinite both;
    }
  
    #btm .talkonline{
        -webkit-animation: talkmove 4s 0s ease infinite both;
        -moz-animation: talkmove 4s 0s ease infinite both;
        
    }
    @-webkit-keyframes talkmove{
  0%{-webkit-transform:scale(1)}
  25%{-webkit-transform:scale(0.9)}
  50%{-webkit-transform:scale(1.2)}
  75%{-webkit-transform:scale(0.9)}
  100%{-webkit-transform:scale(1)}
  }
  @-moz-keyframes talkmove{
  0%{-webkit-transform:scale(1)}
  25%{-webkit-transform:scale(0.9)}
  50%{-webkit-transform:scale(1.2)}
  75%{-webkit-transform:scale(0.9)}
  100%{-webkit-transform:scale(1)}
  }
  @-webkit-keyframes telephone{
      0%{-webkit-transform:scale(1)}
      5%,10%{-webkit-transform:scale(0.9) rotate(-3deg)}
      15%,25%,35%,45%{-webkit-transform:scale(1.1) rotate(3deg)}
      20%,30%,40%{-webkit-transform:scale(1.1) rotate(-3deg)}
      50%{-webkit-transform:scale(1) rotate(0)}
      100%{-webkit-transform:scale(1) rotate(0)}
  }
  @-moz-keyframes telephone{
      0%{-webkit-transform:scale(1)}
      5%,10%{-webkit-transform:scale(0.9) rotate(-3deg)}
      15%,25%,35%,45%{-webkit-transform:scale(1.1) rotate(3deg)}
      20%,30%,40%{-webkit-transform:scale(1.1) rotate(-3deg)}
      50%{-webkit-transform:scale(1) rotate(0)}
      100%{-webkit-transform:scale(1) rotate(0)}
  }

/* 微信 */
.wx_wrapper{
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 20;
    margin: 0 auto;
    padding: 15px;
    align-items: center;
    display: none;
}
.wx_wrapper .wx_zhezhao{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.4);
}
.wx_wrapper .wx_content{
    position: relative;
    z-index: 2;
    text-align: center;
    background: #fff;
    border-radius: .8125rem;
    padding: 15px 0;
}
.wx_wrapper .wx_content .wx_success{
    width: 2.75rem;
    height: 2.75rem;
}
.wx_wrapper .wx_content .wx_tip{
    color: #333;
    font-size: 18px;
    font-weight: 700;
    margin: .4375rem 0 .625rem;
}
.wx_wrapper .wx_content .wx_text{
    color: #333;
    font-size: 15px;
}
.wx_wrapper .wx_content .wx_open{
    display: block;
    color: #fff;
    text-decoration: initial;
    background-color: #1aad19;
    border-radius: .25rem;
    width: 9rem;
    height: 2.75rem;
    line-height: 2.75rem;
    margin: .9375rem auto 0;

}
.wx_wrapper .wx_content .wx_img{
    max-width: 100%;
    margin-top: 17px;
}
.wx_wrapper .wx_close{
    position: absolute;
    right: 5px;
    top: 5px;
}

/* 手机footer有闪动 */
@-webkit-keyframes talkmove {
    0% {
        -webkit-transform: scale(1)
    }

    25% {
        -webkit-transform: scale(0.9)
    }

    50% {
        -webkit-transform: scale(1.2)
    }

    75% {
        -webkit-transform: scale(0.9)
    }

    100% {
        -webkit-transform: scale(1)
    }
}

@-moz-keyframes talkmove {
    0% {
        -webkit-transform: scale(1)
    }

    25% {
        -webkit-transform: scale(0.9)
    }

    50% {
        -webkit-transform: scale(1.2)
    }

    75% {
        -webkit-transform: scale(0.9)
    }

    100% {
        -webkit-transform: scale(1)
    }
}

@keyframes talkmove {
    0% {
        -webkit-transform: scale(1)
    }

    25% {
        -webkit-transform: scale(0.9)
    }

    50% {
        -webkit-transform: scale(1.2)
    }

    75% {
        -webkit-transform: scale(0.9)
    }

    100% {
        -webkit-transform: scale(1)
    }
}

@-webkit-keyframes telephone {
    0% {
        -webkit-transform: scale(1)
    }

    5%,
    10% {
        -webkit-transform: scale(0.9) rotate(-3deg)
    }

    15%,
    25%,
    35%,
    45% {
        -webkit-transform: scale(1.1) rotate(3deg)
    }

    20%,
    30%,
    40% {
        -webkit-transform: scale(1.1) rotate(-3deg)
    }

    50% {
        -webkit-transform: scale(1) rotate(0)
    }

    100% {
        -webkit-transform: scale(1) rotate(0)
    }
}

@-moz-keyframes telephone {
    0% {
        -webkit-transform: scale(1)
    }

    5%,
    10% {
        -webkit-transform: scale(0.9) rotate(-3deg)
    }

    15%,
    25%,
    35%,
    45% {
        -webkit-transform: scale(1.1) rotate(3deg)
    }

    20%,
    30%,
    40% {
        -webkit-transform: scale(1.1) rotate(-3deg)
    }

    50% {
        -webkit-transform: scale(1) rotate(0)
    }

    100% {
        -webkit-transform: scale(1) rotate(0)
    }
}

@keyframes telephone {
    0% {
        -webkit-transform: scale(1)
    }

    5%,
    10% {
        -webkit-transform: scale(0.9) rotate(-3deg)
    }

    15%,
    25%,
    35%,
    45% {
        -webkit-transform: scale(1.1) rotate(3deg)
    }

    20%,
    30%,
    40% {
        -webkit-transform: scale(1.1) rotate(-3deg)
    }

    50% {
        -webkit-transform: scale(1) rotate(0)
    }

    100% {
        -webkit-transform: scale(1) rotate(0)
    }
}

@-webkit-keyframes shiny-btn1 {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }

    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }

    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}

@-moz-keyframes shiny-btn1 {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }

    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }

    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}

@keyframes shiny-btn1 {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }

    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }

    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}

.footer-btn-wrapper {
    display: none;
}

.footer-btn-wrapper a {
    text-decoration: none;
}

@media (max-width: 768px) {
    .footer-btn-wrapper {
        display: flex;
    }
}

.footer-btn-wrapper {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 100;
    bottom: 0;
    height: 60px;
    padding-top: 5px;
    background-color: #fff;
    justify-content: space-evenly;
    overflow: hidden;
}

.footer-btn-wrapper .button {
    position: relative;
    border-radius: 15px;
    width: 46%;
    height: 50px;
    line-height: 50px;
    color: #fff;
    font-size: 14px;
}

.footer-btn-wrapper .button-phone {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-btn-wrapper .button-click .img-box,
.footer-btn-wrapper .button-weixin .img-box {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-btn-wrapper .button img {
    width: 26px;
    height: 26px;
}

.footer-btn-wrapper .button-phone img {
    -webkit-animation: telephone 2s 2s ease infinite both;
    -moz-animation: telephone 2s 2s ease infinite both;
    animation: telephone 2s 2s ease infinite both;
}

.footer-btn-wrapper .button-click .img-box,
.footer-btn-wrapper .button-weixin .img-box {
    -webkit-animation: telephone 4s 0s ease infinite both;
    -moz-animation: telephone 4s 0s ease infinite both;
    animation: telephone 4s 0s ease infinite both;
}

.footer-btn-wrapper .button-phone {
    border-color: #d80d1c;
    background: -webkit-gradient(linear, left top, left bottom, from(#fb6047), to(#d80d1c));
    background: linear-gradient(#fb6047, #d80d1c);
}

.footer-btn-wrapper .button-phone:hover,
.footer-btn-wrapper .button-phone:focus {
    background: -webkit-gradient(linear, left top, left bottom, from(#fb6047), to(#d80d1c));
    background: linear-gradient(top, #fb6047, #d80d1c);
}

.footer-btn-wrapper .button-phone:active {
    border-color: #d80d1c;
    background: #d80d1c;
}


.footer-btn-wrapper .button-click {
    border-color: #1e3ee9;
    background: -webkit-gradient(linear, left top, left bottom, from(#8091f1), to(#1e3ee9));
    background: linear-gradient(#8091f1, #1e3ee9);
}

.footer-btn-wrapper .button-click:hover,
.footer-btn-wrapper .button-click:focus {
    color: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#8091f1), to(#1e3ee9));
    background: linear-gradient(top, #8091f1, #1e3ee9);
}

.footer-btn-wrapper .button-click:active {
    border-color: #1e3ee9;
    background: #1e3ee9;
}

.footer-btn-wrapper .button-weixin {
    border-color: #06790d;
    background: -webkit-gradient(linear, left top, left bottom, from(#04dd52), to(#06790d));
    background: linear-gradient(#04dd52, #06790d);
}

.footer-btn-wrapper .button-weixin:hover,
.footer-btn-wrapper .button-weixin:focus {
    color: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#04dd52), to(#06790d));
    background: linear-gradient(top, #04dd52, #06790d);
}

.footer-btn-wrapper .button-weixin:active {
    border-color: #06790d;
    background: #06790d;
}

.footer-btn-wrapper:before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    z-index: 101;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shiny-btn1 5s ease-in-out infinite;
}

/* 微信 */
.wx_wrapper {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 20;
    margin: 0 auto;
    padding: 15px;
    align-items: center;
    display: none;
}

.wx_wrapper .wx_zhezhao {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .4);
}

.wx_wrapper .wx_content {
    position: relative;
    z-index: 2;
    width: 90%;
    text-align: center;
    background: #fff;
    border-radius: .8125rem;
    padding: 15px 5px;
    margin: auto;
}

.wx_wrapper .wx_content .wx_success {
    width: 2.75rem;
    height: 2.75rem;
}

.wx_wrapper .wx_content .wx_tip {
    color: #333;
    font-size: 18px;
    font-weight: 700;
    margin: .4375rem 0 .625rem;
}

.wx_wrapper .wx_content .wx_text {
    color: #333;
    font-size: 15px;
}

.wx_wrapper .wx_content .wx_open {
    display: block;
    color: #fff;
    text-decoration: initial;
    background-color: #1aad19;
    border-radius: .25rem;
    width: 9rem;
    height: 2.75rem;
    line-height: 2.75rem;
    margin: .9375rem auto 0;

}

.wx_wrapper .wx_content .wx_img {
    max-width: 100%;
    margin-top: 17px;
}

.wx_wrapper .wx_close {
    position: absolute;
    right: 5px;
    top: 5px;
}