/* CSS Document */
/*common*/
.art-tlt{width:100%;height:104px;position:relative;}
.art-h1{padding-top:10px;font:normal 900 32px/40px yahei, sana-serif;color:#000;}
.art-en-h2{font:normal 600 12px/20px yahei, sana-serif;color:#ccc;height:18px;overflow:hidden;}
.art-tlt-inner{width:400px;height:78px;margin:0 calc(45% - 140px);position:absolute;top:18px;text-align:center;}
.art-tlt-inner:before{content:"";width:40px;height:18px;border-top: #e42627 solid 4px;border-left: #e42627 solid 4px;border-right: #e42627 solid 4px;top:-18px;left:175px;position: absolute;}
.art-tlt-inner:after{content:"";width:48px;height:2px;border-bottom: #e42627 solid 4px;bottom:-0px;left:175px;position: absolute;}
.pd80{padding:80px 0;}
/*about*/
.about {position:relative;width:100%;height:auto;overflow:hidden;}
.about>.container>.inner {width:1120px;margin:0 10px;padding:50px 0;}
.about .inner  .article{width:550px;height:auto;z-index:1;margin:0 20px;background:#fff;padding:15px 10px;float:right;}
.about .inner  .article{font:normal 300 13px/20px microsoft yahei,sans-serif;}
.about .ab-ing{float:left;width:510px;height:260px;overflow:Hidden;}
.about .ab-ing img{width:100%;height:auto;}
.about-logo{top:20px;position:absolute;width:420px;margin:0 calc(50% - 210px);height:65px;overflow:hidden;}
.about-logo img{float:left;width:55px;height:55px;margin-right:10px;}

.information{background:rgba(245,245,247,.9);padding:20px;margin:50px 0;} 
.information li a{color:#000;}
.information li a:hover{color:#cc0000}
.information li{width:calc(50% - 20px);float:left;margin:5px 10px;overflow:hieedn;}
.information li .info-img{width:200px;height:200px;float:left;overflow:hidden;}
.information li .text-con{width:calc(100% - 208px);float:left;overflow:hidden;margin:0 0 0 8px;}
.information li .info-img img{width:100%;height:100%;}
.information li .text-con .news-title{width:100%;font:600 15px/28px 'microsoft yahei', serif;overflow:hidden;height:28px}
.information li .text-con .date{width:100%;font:200 12px/20px 'microsoft yahei', serif;border-top:dotted 1px #ccc;}
.information li .text-con .introduce{height:57px;overflow:hidden;font:200 14px/19px 'microsoft yahei', serif;}
.information li .text-con .more{float:right;padding:0 5px 0 0;font:800 13px/20px 'microsoft yahei', serif;color:#e91e63;}
/* news-box */
.news-box{width:100%;height:auto;margin:10px auto 30px;padding:20px 0;}
/* news-box slide */
.htmleaf-container {width:360px;height:280px;float:left;margin:0 auto;text-align:center;overflow:hidden;}
 #slider {width:100%;height:240px;position:relative;overflow:hidden;}
@keyframes load {from {left:-100%;}
to {left:0;}
}
.slides {width:400%;height:100%;position:relative;-webkit-animation:slide 30s infinite;-moz-animation:slide 30s infinite;animation:slide 30s infinite;}
.slider {width:25%;height:100%;float:left;position:relative;z-index:1;overflow:hidden;}
.slide img {width:100%;height:100%;}
.slide img {width:100%;height:100%;}
.image {width:100%;height:100%;}
.image img {width:100%;height:100%;}
/* Legend */.legend {/*border:500px solid transparent;border-left:800px solid rgba(52,73,94,.7);*/border-bottom:0;position:absolute;bottom:0;}
/* Contents */.content {width:100%;height:100%;position:absolute;overflow:hidden;}
.content-txt {width:300px;height:100px;float:left;position:relative;top:90px;-webkit-animation:content-s 7.5s infinite;-moz-animation:content-s 7.5s infinite;animation:content-s 7.5s infinite;}
.content-txt h4 {font-family:Intro;font-size:24px;color:#fff;text-align:left;margin-left:15px;padding-bottom:10px;}
.content-txt h5 {font-family:Quicksand;font-weight:normal;font-size:14px;font-style:italic;color:#fff;text-align:left;margin-left:15px;}
/* Switch slide*/
.switch {width:120px;height:10px;position:absolute;bottom:30px;z-index:99;left:15px;}
.switch > ul {list-style:none;}
.switch > ul > li {width:10px;height:10px;border-radius:50%;background:#0090D6;float:left;margin-right:5px;cursor:pointer;}
.switch ul {overflow:hidden;}
.on {width:100%;height:100%;border-radius:50%;background:#f39c12;position:relative;-webkit-animation:on 30s infinite;-moz-animation:on 30s infinite;animation:on 30s infinite;}

/* Animation */@-webkit-keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@-moz-keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@-webkit-keyframes content-s {0% {left:-420px;}
10% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@-moz-keyframes content-s {0% {left:-420px;}
10% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@keyframes content-s {0% {left:-420px;}
10% {left:20px;}
15% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@-webkit-keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
@-moz-keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
@keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
/* banner*/
.banner{position:relative;width:100vw;max-width:100%;height:70vh;max-height:600px;overflow:hidden;}
.slideshow {position:absolute;width:100vw;max-width:100%;height:70vh;max-height:600px;overflow:hidden;}
.slideshow-image {position:absolute;width:100%;height:100%;background:no-repeat 50% 50%;background-size:cover;-webkit-animation-name:kenburns;animation-name:kenburns;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-duration:16s;animation-duration:16s;opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
.slideshow-image:nth-child(1) {-webkit-animation-name:kenburns-1;animation-name:kenburns-1;z-index:3;}
.slideshow-image:nth-child(2) {-webkit-animation-name:kenburns-2;animation-name:kenburns-2;z-index:2;}
.slideshow-image:nth-child(3) {-webkit-animation-name:kenburns-3;animation-name:kenburns-3;z-index:1;}
.slideshow-image:nth-child(4) {-webkit-animation-name:kenburns-4;animation-name:kenburns-4;z-index:0;}
.slideshow-image:nth-child(5) {-webkit-animation-name:kenburns-5;animation-name:kenburns-5;z-index:4;}
@-webkit-keyframes kenburns-1 {0% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
1.5625% {opacity:1;}
23.4375% {opacity:1;}
26.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
98.4375% {opacity:0;-webkit-transform:scale(1.21176);transform:scale(1.21176);}
100% {opacity:1;}
}
@keyframes kenburns-1 {0% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
1.5625% {opacity:1;}
23.4375% {opacity:1;}
26.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
98.4375% {opacity:0;-webkit-transform:scale(1.21176);transform:scale(1.21176);}
100% {opacity:1;}
}
@-webkit-keyframes kenburns-2 {23.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
26.5625% {opacity:1;}
48.4375% {opacity:1;}
51.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@keyframes kenburns-2 {23.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
26.5625% {opacity:1;}
48.4375% {opacity:1;}
51.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@-webkit-keyframes kenburns-3 {48.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
51.5625% {opacity:1;}
73.4375% {opacity:1;}
76.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@keyframes kenburns-3 {48.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
51.5625% {opacity:1;}
73.4375% {opacity:1;}
76.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@-webkit-keyframes kenburns-4 {73.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
76.5625% {opacity:1;}
98.4375% {opacity:1;}
100% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
}
@keyframes kenburns-4 {73.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
76.5625% {opacity:1;}
98.4375% {opacity:1;}
100% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
}
@keyframes kenburns-5 {0% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
1.5625% {opacity:1;}
23.4375% {opacity:1;}
26.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
98.4375% {opacity:0;-webkit-transform:scale(1.21176);transform:scale(1.21176);}
100% {opacity:1;}
}
.banner h1 {font-size:16px;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);z-index:99;text-align:center;font-family:Raleway,sans-serif;font-weight:300;text-transform:uppercase;background-color:rgba(255,255,255,0.75);box-shadow:0 1em 2em -1em rgba(0,0,0,0.5);padding:1em 2em;line-height:1.5;}
.banner h1 small {display:block;text-transform:lowercase;font-size:14px;}
.banner h1 small b{font-size:24px;}
.banner h1 small:first-child {border-bottom:1px solid rgba(0,0,0,0.25);padding-bottom:.5em;}
.banner h1 small:last-child {border-top:1px solid rgba(0,0,0,0.25);padding-top:.5em;}

/*news-box  title-box */
.txt-news-box{width:calc(100% - 375px);height:280px;float:right;overflow:hidden;padding:0px 15px 10px;}
.title {height:40px;line-height:40px;text-align:left;margin-bottom:20px;}
.title h2{width:100%;font-size:18px;font-weight:700;color:#333;line-height:40px;}
.title h2 span{float:right;font-size:14px;font-weight:300;}
.title h2 span a{text-decoration: none;color:#3f3b3a;}
.title h2 span a:after {content: ">>";padding-left:5px;font-size:14px;}
.txt-news-box li{width:calc(50% - 20px);float:left;line-height:36px;border-bottom:dotted 1px #f0f0f0;font:100 14px/36px 'microsoft yahei', serif;color:#3f3b3a;}
.txt-news-box ul {margin:9px 0;}
.txt-news-box ul li:nth-child(even){margin-left:40px;}
.txt-news-box ul li:nth-child(n+13){display:none;}
.txt-news-box li .news-title{width:auto;height:36px;overflow:hidden;float:left;}
.txt-news-box li span{float:right;}
.txt-news-box li a{color:#3f3b3a;text-decoration:none;float:left;}
.hot-products{background:rgba(245,245,247,.9);padding:20px;margin:50px 0;} 
.hot-products-list{margin:30px 40px 0px;}
.hot-products-list li{float:left;width:calc(25% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.hot-products-list li h3{text-align:center;line-height:32px;height:32px;font-size:16px;overflow:hidden;}
.hot-products-list li h3 a{color:#3f3b3a;}
.hot-products-list li img{width:100%;height:auto;}
@media only screen and (max-width:960px) {
.about>.container>.inner {width:100%;margin:0;padding:0;}
.about .inner  .article{width:calc(100% - 30px);height:auto;margin:0px;padding:15px;}
.about .ab-ing{width:100%;height:auto;margin:0px;padding:15px;}
.pd80{padding:20px 0;}
.art-tlt-inner{width:100%;height:78px;margin:0;}
.art-tlt-inner:before,.art-tlt-inner:after{left:calc(50% - 20px);}
.hot-products{margin:0px 0;} 
.hot-products-list li{width:calc(50% - 10px);height:auto;}
.txt-news-box li .news-title{width:150px;height:36px;overflow:hidden;float:left;}
.news-list{width:100%;float:none;}
.news-list li {margin:15px 10px;}
.information li{width:calc(100% - 20px);float:left;margin:5px 10px;overflow:hieedn;}
.information li .info-img{width:100%;height:auto;}
.information li .text-con{width:100%;height:auto;}
	}
@media only screen and (max-width:900px) {
.title-box,.txt-news-box,.top-notes{width: calc(100% - 30px);margin: 10px 15px;padding: 0px 0px 10px;}	
.htmleaf-container {width: calc(100% - 30px);height:400px;margin: 10px  15px;}
 #slider {width:720px;height:480px;margin: 10px  calc(50% - 360px);}	
.content-txt {top:210px;}
.switch {bottom:150px;} 
.txt-news-box li{width:100%;}
.txt-news-box ul li:nth-child(even){margin:0;}
.txt-news-box{height:auto;}
.txt-news-box li .news-title{width:auto;}
}	

@media only screen and (max-width:768px) {	
.banner .banner-text-box{float:none;padding:10px 10px 30px;width:100%;height:auto;}
.banner .banner-img-box{float:none;width:100%;height:500px;overflow:hidden;}
.banner {margin:20px 0 5px;}
.banner .banner-text-box .contact{margin:20px 0 0 0;float:Left;width:160px;padding:0 15px;}
.banner .banner-text-box .learn{margin:20px 0 0 0;padding-left:30px;}

#slider {width:600px;height:400px;margin: 10px  calc(50% - 300px);}	
.content-txt {top:220px;} 
.switch {bottom:70px;}
.content-txt {top:210px;}
.switch {bottom:70px;}

.type-title-box{margin:5px calc(25% - 45px);}
.type-h3::before {left:32%;}
.hot-products .h2tlt{margin:30px 20px 20px;}
.hot-products-list{margin:30px 0px 0px;}
 
.hot-products-list li:nth-child(1),.hot-products-list li{width:100%;height:auto;margin:0 0px 20px;}
.hot-products{padding:15px;}
.technology{margin:15px auto 2px;}
.Knowledge-img-box{width:80%;margin:20px 10%;max-height:180px;}
.education p{font:500 14px/18px "Poppins", Helvetica, Arial, sans-serif;margin:20px;}
.application ul li:nth-child(1),.application ul li:nth-child(2),.application ul li:nth-child(3),.application ul li:nth-child(4),.application ul li:nth-child(5){width:calc(100% - 30px);margin:10px 15px;}
.superior{margin:20px auto;}
.superior .title-con,.superior .art-con{width:100%;}
.superior h2{padding:0 10%;font:800 24px/36px "Times New Roman",'microsoft yahei', serif; }
.superior .art-con p{padding:10px 5%;}	
.superior-more {font:500 16px/20px "Poppins", Helvetica, Arial, sans-serif;padding:30px 0px 20px 20px;}
.img-con{width:100%;height:auto;margin:30px 0;float:Left;}
.img-con img{width:80%;height:auto;margin:0 10%;}
.notes{padding:20px 0;}
}
@media only screen and (max-width:640px) {	
.type-h3::before {display:none;}
.type-h3:after{width:100%;border-bottom:2px solid rgba(245,245,247,1);left:0%;}
#slider {width:360px;height:240px;margin: 10px  calc(50% - 180px);}	
.content-txt {top:90px;} 
.switch {bottom:30px;}
}
@media only screen and (max-width:359px) {.type-title-box{margin:5px 30px;width:calc(100% - 60px);}
.banner .banner-text-box .contact{margin:20px calc(50% - 80px) 0;}
.banner .banner-text-box .learn{margin:20px calc(50% - 80px) 0;padding-left:0px;text-algin:center;}
.application ul li .con a{font:400 24px/30px Times, "Times New Roman",'microsoft yahei', serif;}
.h2tlt{font:600 24px/32px "Times New Roman",'microsoft yahei', serif;}
}