/* CSS Document */
/* news-box */
.news-box{width:100%;height:auto;margin:10px auto 10px;padding:10px 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 h3 {font-family:Intro;font-size:18px;color:#fff;text-align:left;margin-left:15px;padding-bottom:10px;}
.content-txt p {font-family:Quicksand;font-weight:normal;height:72px;overflow:hidden;font-size:14px;font-style:italic;color:#fff;text-align:left;margin-left:15px;}
/* Switch */.switch {width:120px;height:10px;position:absolute;bottom:10px;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;}
}
/*about  title-box */
.about-img{width:calc(38.2% - 5px);height:auto;float:left;margin:0 10px 0 0;padding:5px;}
.about-img img{width:100%;height:auto;}
.about-inner{width:calc(61.8% - 5px);height:auto;float:left;padding:10px 5px 5px 5px;font:300 16px/24px "Times New Roman",'microsoft yahei', serif;}

/*news-box  title-box */

.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;}

.certification-list{margin:30px 40px 0px;}
.certification-list li{float:left;width:calc(16.6% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.certification-list li h3{text-align:center;line-height:32px;height:32px;font-size:10px;overflow:hidden;}
.certification-list li h3 a{color:#3f3b3a;}
.certification-list li img{width:100%;height:auto;}

 
.list{margin:30px 40px 0px;}


.hot-products,.honor,.check{background:rgba(245,245,247,.9);padding:20px;margin:50px 0;}
.certification,.workroom{background:#fff;padding:20px;margin:50px 0;}
 
.honor-list li{float:left;width:calc(25% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.check-list li,.workroom-list li{float:left;width:calc(20% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.hot-products-list li{float:left;width:calc(33.333% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.list li h3{text-align:center;line-height:32px;height:32px;font-size:16px;overflow:hidden;}
.list li h3 a{color:#3f3b3a;}
.list li img{width:100%;height:auto;}



.announcement li{width:calc(50% - 20px);float:left;line-height:36px;border-bottom:dotted 1px #f0f0f0;font:100 14px/36px 'microsoft yahei', serif;color:#3f3b3a;}
.announcement ul {margin:9px 0;}
.announcement ul li:nth-child(even){margin-left:40px;}
.announcement ul li:nth-child(n+13){display:none;}
.announcement li .news-title{width:auto;height:36px;overflow:hidden;float:left;}
.announcement li span{float:right;}
.announcement li a{color:#3f3b3a;text-decoration:none;float:left;}
@media only screen and (max-width:960px) {
.hot-products-list li{width:calc(50% - 10px);height:auto;}
.txt-news-box li .news-title{width:150px;height:36px;overflow:hidden;float:left;}
.announce li .news-title{width:150px;height:36px;overflow:hidden;float:left;}
.news-list{width:100%;float:none;}
.news-list li {margin:15px 10px;}
	}
@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,.announce 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;}
.announcement {    margin: 10px 15px;}
.announcement  ul li:nth-child(even){margin:0;}
.announce {height:auto;}
.announce  li .news-title{width:auto;}
}	

@media only screen and (max-width:768px) {	
.htmleaf-container {height:auto;}
.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;}
.about{padding: 15px;}
.about-img,.about-inner{width:100%; margin: 0 0px 20px;}
.about-inner{font:300 14px/20px "Times New Roman",'microsoft yahei', serif;}


#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,.certification-list li,.check-list li,.workroom-list li,.honor 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;}
.txt-news-box li .news-title,.announce li .news-title{width:200px;height:36px;overflow:hidden;float:left;}
}
@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;}
}

.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;}
.title h2{width:100%; color:#0090D6;font:300 18px/20px "Times New Roman",'microsoft yahei', serif;border-left:solid 4px #0090D6;padding:0 0 0 10px;margin:10px 0;}
.title h2 span{float:right;font-size:14px;font-weight:300;padding-right:20px}
.title h2 span a{text-decoration: none;color:#333;}
.title h2 span a:after {content: ">>";padding-left:5px;font-size:14px;}

.txt-news-box-one{width:30%;float:left;height:auto;overflow:hidden;margin:5px 0;}
.txt-news-box-two{width:40%;float:left;height:auto;overflow:hidden;margin:5px 1%;}
.txt-news-box-three{width:28%;float:left;height:auto;overflow:hidden;margin:5px 0;}
.txt-news-list li{width:96%;height:27px;line-height:27px;float:left;margin:0 2%;border-bottom: 1px solid #f0f0f0;}
.txt-news-list li .news-title{width:auto;height:27px;overflow:hidden;float:left;}
.txt-news-box-one .txt-news-list li .news-title,.txt-news-box-three .txt-news-list li .news-title{width:180px;overflow:Hidden;}
.txt-news-list li span{float:right;}
.txt-news-list li a{color:#3f3b3a;text-decoration:none;float:left;}
.txt-news-list li .listname{width:80px;float:left;}
.txt-news-list li .listname a{color:#0090D6;font-weight:200;}
.txt-news-list li  a:hover {color:#0090D6;text-decoration:underline;}
@media only screen and (max-width:768px) {
.txt-news-box-one,.txt-news-box-two,.txt-news-box-three{width:96%;margin:10px 1%;}
.txt-news-box-two .txt-news-list li .news-title{width:180px;overflow:Hidden;}
}