﻿@font-face{font-weight:normal;font-style:normal;}
* {margin:0;padding:0;}
html,body {background:#fff;font-size:14px; font-family: Arial;width:100%;color:#1f1f1f;text-align:left}
a {color:#1f1f1f;text-decoration:none}
ol,li,ul {list-style:none}
header{width:100%;height:123px}
img {border:none}
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
.mobile-home-btn {display:none}
.mobile-menu-btn {display:none}
.topnav {width:100%;height:35px;background:#1f1f1f;}
.topnav div{width:980px;height:35px;margin:0 auto;line-height:35px;font-family:Arial;font-size:12px;position:relative;}
.topnav a {height:20px;line-height:20px;margin-top:7px;display:block;color:#FFF;float:left; padding-right:20px;}
#sendmail {width:35px;margin-left:40px;padding-left:25px;background:url(../images/header_bg.png) 0 -28px no-repeat}
.topnav a:hover{color:#FFF;}

.clearfix { clear: both;}
.nav_all{ width:100%; height:88px;}
.nav_con { font-family: Helvetica; font-size:16px; text-transform: Capitalize;width: 100%; max-width: 980px; margin:0 auto;}
.nav_con ul { list-style-type: none; float:right; margin:0; padding:0;}
.nav_con ul li {display: inline-block;}
.nav_con ul li a { color:#000; font-weight: bold; text-decoration: none; display: inline-block; padding: 35px 18px 35px 18px; box-sizing: border-box;}
.nav_con ul li a:hover { color:#FFF;background-color:#00a0af;}
#menu_button_wrapper{ display: none;}
.hidden { display: none;}
.nav_con .logo{ float:left; margin-top:7px;}


main {width:100%;margin-top:0;}
article.home,main .widget {width:980px;margin: 30px auto; overflow:hidden;clear:both}
main article h2 {font-size:26px;line-height:34px; font-weight:normal;color:#00a0af;text-align: center; margin-top:10px; margin-bottom:10px;}
main article.home h2 a{ color:#00a0af; margin-bottom:20px;}
main article.home h2 a:hover{color:#00a0af; text-decoration:underline;}

article.product ul {overflow:hidden;}
article.product li {float:left;width:220px;margin-right: 24px;}
article.product li:last-child{margin-right: 0;}
article.product li:hover img{transform: scale(1.2, 1.2);transition-duration: 1s;}
article.product li a div{overflow: hidden;width: 99.2%; border:1px solid #ccc;}
article.product li a img {width:100%;display:block;transform: scale(1,1);-webkit-transition-duration: 1s;transition-duration: 1s;}
article.product .imglist li a p{display:block;width:100%;height:40px;line-height:40px;background:#00a0af;color:#fff;font-size:14px;font-family:Arial;text-align:center}
.sliderwin {width: 80%;position: relative;margin:0 auto;overflow: hidden;}
article.product a:hover {text-decoration:none;}
article.about {height:295px}
article.about img {float:left;margin-right:20px}
article.product .bref p,article.about p{font-size:14px;line-height:24px;}

article.home .news {width:305px;float:left}
article.home .news  date {color:#c9caca;font-size:14px;}
article.home .news .top {width:100%;margin-top: 20px;height: 100px;}
article.home .news .top img {width: 30%;float: left;padding-right: 2%;}
article.home .news ul li {margin-top: 8px;width:100%;padding:5px 0;border-top:1px solid #c9cacb;font-size:16px; line-height:24px;}
article.home .news ul li a { color:#1f1f1f;}
article.home .news .top p {line-height: 20px;color: #888;}
article.home .news .top h3 {font-weight: normal;font-size: 16px;padding-bottom: 10px;}
article.home .news .top h3 a{ color:#1f1f1f;}
article.home .news a:hover{ text-decoration:underline;}

article.home .faq {width: 305px; float:right;}
article.home .faq .top{ padding-bottom:10px; border-bottom:1px solid #c9cacb; margin-bottom:10px;}
article.home .faq .top a{ color:#1f1f1f; font-size:16px;}
article.home .faq .top p {line-height:22px; font-size:14px;color: #888888;}
article.home .faq a:hover {text-decoration:underline}
article.home .faq span {width:8px;height:8px;margin-right:8px;display:inline-block}
article.home .faq ul li{ padding-bottom:10px; font-size:16px;}
article.home .faq ul li a{ color:#1f1f1f;}
.widget {clear:both}
.widget .socialmedia a {width:32px;height:32px; display:block; float:left; margin-right:8px;}

/*在线客服Online*/
.Online_Bg {width:68px;position:fixed;right:10px; top:25%;z-index:10;}
.Online_Box {width:100%;}
.Online_li {width:68px;height:68px;margin-bottom:5px; border-radius:12px; /*background-color:#999;*/background: rgba(255, 255, 255, 0.85);/*#fff;*/ box-shadow: 2px 2px 4px 1px rgba(49, 48, 48, 0.4);}
.Online_li:hover{ background-color:#00a0af;}
.Online_li a{display:block;width:68px;padding-top:40px;line-height:25px;font-size:12px;text-align:center;/*color:#fff;*/color:#00a0af;cursor:pointer;text-decoration:none;}
.Online_Box .online a {background:url(../images/on-r-online.png) center 4px no-repeat;}
.Online_Box .email a{background:url(../images/on-r-email.png) center 4px no-repeat;}
.Online_Box .whatsapp a{background:url(../images/on-r-whatsapp.png) center 4px no-repeat;}
.Online_Box .top a {background:url(../images/on-r-top.png) center 4px no-repeat;}
.Online_Box .online a:hover{background:url(../images/on-online.png) center 4px no-repeat; color:#fff;}
.Online_Box .email a:hover{background:url(../images/on-email.png) center 4px no-repeat; color:#fff;}
.Online_Box .whatsapp a:hover{background:url(../images/on-whatsapp.png) center 4px no-repeat; color:#fff;}
.Online_Box .top a:hover{background:url(../images/on-top.png) center 4px no-repeat; color:#fff;}
/* 第一个 */
.Online_Bg .red {background-color:#00a0af; }
.Online_Bg .red a{background:url(../images/on-online.png) center 4px no-repeat; color:#fff;}


/*footer*/
footer {width:100%;padding-top:25px;background:#1f1f1f;color:#fff;margin-top:25px;line-height:20px; font-size:12px; font-family: Arial;}
footer a {color:#fff; font-family: Arial;}
footer a:hover {text-decoration:underline}
footer strong {font-weight:normal;font-size:16px;display:block;margin-bottom:10px}
footer .wrapper {width:980px;margin: 0 auto;padding-bottom:25px}
footer .cols1 {float:left;width:245px;height:172px;border-right:1px solid #555}
footer .cols1 a{margin-right:8px;}
footer .cols1 table {float:right;margin-top: 20px;text-align: left;margin-right: 50px;}
footer .cols2 {float:left;width:230px;height:172px;padding-left:15px;border-right:1px solid #555}
footer .cols2 span {display:block;width:190px;background:url(../images/bottom_ico.png) no-repeat;padding-left:20px;}
footer .cols2 span:before {content:":   "}
footer .cols2 span.tel{background-position:0 -190px;}
footer .cols2 span.email{background-position:0 -209px;}
footer .cols2 span.fax{background-position:0 -228px;}
footer .cols2 span.address{background-position:0 -247px;}
footer .cols3 {float:left;width:262px;height:172px;padding-left:15px;border-right:1px solid #555}
footer .cols3 ul li {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;list-style: none;}
.contactFixed{position:fixed;margin:0 auto;bottom:0;max-width:480px;width:100%;z-index:99;background-color:#716E6E;display:none}
.contactFixed a{float:left;width:25%;height:45px;line-height:70px;display:block;color:#fff;text-decoration:none;text-align:center}
.contactFixed a:first-child{background:url(../images/ico-contact.png) center -7px no-repeat}
.contactFixed a:nth-child(2){background:url(../images/ico-contact.png) center -51px no-repeat}
.contactFixed a:nth-last-child(2){background:url(../images/ico-contact.png) center -97px no-repeat}
.contactFixed a:last-child{background:url(../images/ico-contact.png) center -143px no-repeat}

.copyright {width:100%;height:40px;line-height:40px;clear:both;border-top:1px solid #555;}
.copyright .text {width:980px;margin:0 auto;}
.copyright .text {width:980px;margin:0 auto;}
.copyright .text span { float:left;}
.copyright .text img {float:left;margin: 7px 0;}
.chatjs{display:block;}

/*Products List*/
.content {width:980px;margin:0 auto}
.innerbanner {width:100%;height:250px;color:#fff}
.innerbanner h1 {width:980px;margin: 0 auto}
.innerbanner p {font-size:16px;width:100%;margin-left:20px;line-height: 24px;}

.sosoimg {width: 240px;}

/*首页banner*/
.index_show{position: relative;z-index: 2;width: 100%;background: #fff;padding:0;margin:0;}
.bxslider{height: 420px;overflow: hidden;width: 100%;}
.bxslider li{width: 100%;height: 420px;overflow: hidden;}
.bx-controls{display: none;}
#bx-pager{position: absolute;left: 80%;bottom: 4px;z-index:10;margin-left: -90px;padding-bottom: 6px;}
#bx-pager a{float: left;width: 15px;height: 15px;line-height: 15px; display:block; border-radius:50%; border:2px solid #fff; margin-left:6px; cursor:pointer;background: #fff;}
#bx-pager a:hover{text-decoration: none;}
#bx-pager .active{position: relative;background: #00a0af;color: #fff;}

.home_fenlei{ width:980px; height:auto; margin:40px auto 0 auto; overflow:hidden; clear:both;}
.home_fenlei_l{ width:50%; float:left; position:relative;}
.home_fenlei_r{ width:50%; float:left; position:relative;}
.home_fenlei_l a div{ float:left; border:2px solid #00a0af;}
.home_fenlei_r a div{ float:right; border:2px solid #00a0af;}
.home_fenlei_l a img{ width:470px; height:auto; display:block; }
.home_fenlei_r a img{ width:470px; height:auto; display:block; }
.home_fenlei a h3{ width:470px; height:40px; line-height:40px; font-size:20px; color: #fff; font-weight: 400; background: #00a0af; text-align: center; bottom: 0; position: absolute;}
.home_fenlei_r a h3{ background:#00a0af;}

@media(max-width:1024px){
.index_show{ display:none;}
}

@media(max-width:980px){
header {height:auto}
header .topnav {height:7px;background:#00a0af;overflow:hidden}
.topnav div{ display:none;}
main {width:100%;background:none;}
main .widget {display:none}
footer {clear:both;margin:0;padding:0}
footer * {padding:0;border:none}
footer .wrapper,footer .cols1{width:100%;height:auto;border:none;padding:0;margin-top:35px;}
footer .cols1{text-align: center;}
footer .cols2,footer .cols3{box-sizing: border-box;width: 50%;margin:30px 0; text-align:center;}
footer .wrapper .cols2 span { width:100%;display:block; text-align:center; padding-left:0px;}
footer .wrapper .cols2 span#address {width:52%}
footer .cols4{display: none;}
footer .copyright { display:none;}
footer .copyright .text span {display:none}
footer .copyright .text img {float:none}
footer .copyright .text {width:100%;text-align:center}
main .view {width:100%;}
main .intro {width:88%;height:auto;padding:25px 6%}
main .intro h1{margin-top:10px}
main .banner {width:100%;text-align:center;overflow:hidden}
main article.home {width:92%;margin:10px 4%;height:auto;float:left;}
main article.home h2 a{ color:#00a0af; margin-bottom:20px;}

article.product .imglist {margin-left:0; margin-top:35px;}
article.product .imglist ul {overflow:hidden;display:-webkit-flex;display: flex;flex-wrap: wrap;justify-content: space-between;}
article.product .imglist li {width:30%;margin:0 0 20px;}
article.product .imglist li a img {width:100%;display:block}

.sliderwin {width: 80%;position: relative;margin:0 auto;overflow: hidden;}
main article.about img {float:none; margin:0 auto;display:block;max-width:100%}

main article.home p {font-size:14px;margin-top:0;}
main article.nsf .news, main article.nsf .showroom,main article.nsf .faq{width:100%}
main article.home h2 {font-size:18px;text-align:center; line-height:24px;}

article.home .news .top {margin-top:0}
article.product {width: auto;}
article.product p {font-size:15px;}
article.about p{ padding:0;}

.home_fenlei{ width:98%;}
.home_fenlei_l{ width:48%; float:left; }
.home_fenlei_r{ width:48%; float:right; }
.home_fenlei_l a div{ height:202px; float:left;}
.home_fenlei_r a div{ height:202px; float:right; border:2px solid #666;}
.home_fenlei_l a img{ width:100%; }
.home_fenlei_r a img{ width:100%; overflow:hidden; }
.home_fenlei a h3{ width:99%; height:36px; line-height:36px; font-size:18px; background: #00a0af;}
.home_fenlei_r a h3{ background:#666;}

}
@media(max-width:768px){
article.product .imglist{margin:0;}
article.product .imglist ul{display: block;}
article.product .imglist li{float: left; width: 48%;}
article.product .imglist li:nth-child(2n+1){margin-right: 3%;}
article.product li a img {width:100%;display:block}

.bxslider .item1{ background:url(../images/banner01_1.jpg) 0 0 no-repeat;}
}

@media(min-width:580px){

}

@media(max-width:480px){
.menu nav a[rel="home"] img{width: 80%;margin-top:5px;}
footer .cols2{width: 100%;padding: 0;}
footer .cols2 strong{padding:0;text-align: center;}
footer .cols2 span{padding: 0;margin:0 auto;}
footer .cols3{display: none;}
.contactFixed{position:fixed;margin:0 auto;bottom:0;max-width:480px;width:100%;z-index:99;background-color:#716E6E;display:block;}
.gotop {display: none!important}
article.home .news  date {color:#c9caca;font-size:14px;float: right;display: none;}
article.home .news .top {float: left;padding-bottom: 20px;}
article.home .news .top img {width: 100%;float: left;padding-right: 2%;}
article.home .news ul li a {width: 85%;display: block;}
article.home .news .top p {line-height: 22px; width:100%;float: left;}
article.home .news .top h3 {padding:10px 0;display: block;width: 100%;float: left;}
article.home .news  date {color:#c9caca;font-size:14px;float: right;}

}
@media(max-width:435px){
p {font-size: 18px;}
.home_fenlei{ width:92%; height:auto; margin:0 auto;}
.home_fenlei_l{ width:100%; float:none; }
.home_fenlei_r{ width:100%; float:none; margin-top:30px;}
.home_fenlei_l a div{ height:auto; float:none;}
.home_fenlei_r a div{ height:auto; float:none; border:2px solid #666;}
.home_fenlei_l a img{ width:100%; }
.home_fenlei_r a img{ width:100%; }
}

@media(max-width:360px){

}
@media(max-width:320px){
main .intro h1{font-size: 28px;}
}


/* Responsive for smaller screens */
@media (max-width: 980px) {
.nav_all{ height:auto;}
.nav_con { height:90px;}
.nav_con .logo { width:auto;}  
.nav_con ul { width:auto; margin: 0 auto; padding: 0;}
}

@media (max-width: 760px) {
#menu_button_wrapper{display: block; padding: 1.5em 1em 0 1em; color: #9d9d9d; -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.1); box-shadow: 0 1px 0 rgba(255,255,255,.1);
}   
#menu_button { box-sizing: border-box; float: right; padding: .5em 1em; border: 1px solid #00a0af; border-radius: 5px; color:#FFF; background:#00a0af; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}   
#menu_button:hover {cursor: pointer; background-color:#1f1f1f;}   
#hamburger {float: right;padding-top: .15em;}   
#menu_button span{display: block; background-color: #fff; width: 1.2em; height: .15em; border-radius: 1px; margin-bottom: .2em;}
/*.nav_all{ width:100%; height:auto;}*/
.nav_con ul { width: 100%; margin: 0 auto; padding: 0; box-sizing: border-box; background:#00a0af; float:none;}
.nav_con ul li { display: block;}
.nav_con ul li a { width: 100%; color:#FFF; padding: 12px 0 12px 30px; border-bottom:1px solid #ccc;}
.nav_con ul li a:hover { color:#FFF;}
}
@media (max-width: 440px) {
/*.nav_all{ width:100%; height:auto;}*/
.nav_con { height:auto;}
}
