.banner-box{height:auto;width:100%;position:relative;overflow:hidden;min-width:1200px;}
.banner-zw{ width:1200px; position:absolute; left:50%; margin-left:-600px; top:0; height:2px;}
.swiper-pagination-bullet{ background:#fff; width:24px; height:6px; border-radius:0; opacity:0.6;}
.dz-index-bullet-active{ background:#ff0000; width:24px; height:6px; border-radius:0; opacity:0.9;}
.why-ul{ width: 110%; height: auto; overflow: hidden;}
.why-ul li{ width: 215px; height: 275px; background: #fff; float: left;cursor: pointer;overflow: hidden; border-radius:8px;margin: 10px 32px 10px 0px;-moz-box-shadow:2px 2px 5px #EBEBEB; -webkit-box-shadow:2px 2px 5px #EBEBEB; box-shadow:2px 2px 5px #EBEBEB;}
.why-icon{ width: 88px; height: 88px; background: #00a1ad; border-radius: 50%; overflow: hidden; margin: 30px auto; border: 1px solid #00a1ad; box-sizing: border-box;}
.why-icon img{ display: block; margin: 17px auto; height: 50px;}
.why-txt{ width: 90%; margin: 0 auto; color: #666666; font-size: 13px; text-align: center; line-height:2; }
.why-ul li:hover{ background-image: linear-gradient(to bottom, #1fa2b0, #21b7b6) !important; color: #fff !important;}
.why-ul li:hover .why-txt{color: #fff !important;}
.why-ul li:hover .why-icon{background:none !important; border: 1px solid #fff !important; box-sizing: border-box;}


.whyus-view{ width: 1200px; margin: 0 auto;}
.video_view{ width:432px; height: 378px;  background: url(../images/pc-icon.png); float: left; overflow: hidden;}
.video-warp{ width: 403px; height: 243px;margin-top: 18px; margin-left: 14px;}

.procenter-box{ width: 100%; min-width: 120px; height: 1096px; overflow: hidden; background: url(../images/procenter-bg.jpg) no-repeat center center;}
.procenter-main{ width: 1200px; height: auto; overflow: hidden; margin: 0 auto;}
.product-ctag{ width: 100%; display: flex; align-items: center; justify-content: center; margin-top: 50px; overflow: hidden;}
.product-ctag a{ width: 220px; height: 30px; line-height: 30px; display: block; text-align: center; border: 1px solid #fff; color: #fff; margin: 0px 22px; font-size: 13px;}
.product-ctag a.hover,.product-ctag a:hover{ background: #20bbaf; border: 1px solid #20bbaf;}
.prolist{ width: 110%; height: auto; overflow: hidden; margin-top: 40px;}
.prolist a{ width: 280px; height: 348px; margin-right: 25px; float: left; background: #fff; margin-top: 25px;}
.proimg{ width: 100%; height: 240px; overflow: hidden;}
.pro-txt{ width: 100%; border-top: 1px solid #f1f1f1; height: 108px; overflow: hidden; padding: 10px 10px; box-sizing: border-box;}
.pro-txt .pro-name{ width: 100%; height: 30px; line-height: 30px; overflow: hidden; color:#333; font-size: 18px;white-space: nowrap;text-overflow: ellipsis;}
.pro-txt .pro-intro{width: 100%; height: 44px; line-height: 22px; overflow: hidden;text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;font-size: 14px; color:#666666; margin-top: 5px;}
.prolist a:hover .pro-txt{ background: #1ebeae;}
.prolist a:hover .pro-txt .pro-name,.prolist a:hover .pro-txt .pro-intro{ color: #fff !important;}

.aboutimg{ width: 652px; height: 526px; float: left; overflow: hidden;}
.aboutintro{ width: 628px; height: 471px; background: url(../images//abus-bg.jpg) no-repeat center center; background-size: 100% 100%; float: left; margin-top: 28px; overflow: hidden; padding: 25px 20px 0px 30px; box-sizing: border-box;}
.about-name{ width: 80%; height: 45px; color: #333; font-size: 18px;text-transform: uppercase; line-height: 40px; border-bottom: 1px solid #ededed; padding-bottom: 5px;}
.about-intro{ width: 100%; height: auto; overflow: hidden; font-size:16px; color: #666666; line-height: 1.7; margin-top: 15px;}
.more-about{ font-size: 16px; color: #fff; background-color: #179aa1; height: 36px; width: 150px; display: block; text-align: center; border-radius: 36px; overflow: hidden; line-height: 36px; margin-top: 20px;}
.more-about:hover{ background: #0c6a6f;}

.display-item{ width: 280px; height: 240px; float: left; margin-right: 20px; margin-bottom: 20px;}
.display-item .pic{ width: 280px; height: 200px; overflow: hidden;}
.display-item .title{ width: 280px; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 16px;  background: #179aa1;}

.news_item{ width: 285px; float: left; overflow: hidden; height: 422px; background: #f5f5f5; margin-right: 20px;}
.news_item:hover{ background: #179aa1;}
.news_title{ width: 100%; height: 30px; line-height: 30px; color: #333; font-size: 18px; font-family: Arial; padding:0px 10px; box-sizing: border-box; overflow: hidden; margin: 10px auto 10px auto;word-break:break-all;white-space: nowrap;text-overflow: ellipsis;}
.news_intro{ width: 100%; height: auto; overflow: hidden; line-height: 20px; height: 60px; color: #666666; font-family: Arial; font-size: 16px; padding: 0px 10px; box-sizing: border-box;text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical; }
.news_detail{ font-size: 14px; color: #999; padding: 0px 10px; box-sizing: border-box; margin-top: 10px;}
.news_item:hover .news_title,.news_item:hover .news_intro,.news_item:hover .news_detail{ color: #fff;}
