:root {
  --primary-color: #3963d1;
  /*--primary-color: #22518e;*/

  /* 辅助色 - 环保绿 */
  --accent-color: #28C76F;
  --accent-hover: #20a059; /* 鼠标悬停时的深绿 */

  /* 背景色 */
  --bg-color: #F9FAFB;
  --card-bg: #FFFFFF; /* 卡片背景用纯白，制造层次感 */

  /* 文字色 */
  --text-main: #333333;
  --text-secondary: #666666; /* 次要说明文字 */
}

*{margin:0; padding:0; font-family:Arial, Helvetica, 微软雅黑, sans-serif; }
a{ color:#333; text-decoration:none;}
ul, ol{list-style-type:none;}
img{border:0; max-width:100%;  vertical-align: middle;}
.container{width:1300px; margin:0 auto; height:100%;}
.clear{clear:both;}
body{ overflow-x:hidden; position:relative; }
h1, h2, h3, h4, h5, h6,b{ font-weight:normal;}
input, textarea,select, button{outline:medium; blr:expression(this.onFocus=this.blur());}
p{ text-align:justify;}
.fl{ float:left;}
.fr{ float:right;}

.header{ height:130px;}
.header .logo{ line-height:130px; float:left;}
.header .phone{ background:url(../images/home/phone.png) no-repeat center left;width: 70px;height: 70px; float:right; padding:1px 0 1px 82px; margin:30px 0;}
.header .phone p{ font-size:28px; color:#333; line-height:34px;}

.navigation{ background:var(--primary-color); height:72px; position:relative; z-index:1;border-radius: 10px;}
.navigation li{ line-height:72px; float:left; padding:0 20px; position:relative;}
.navigation li a{ font-size:18px; color:#fff; display:inline-block;}
.navigation li:first-child{ background:url(../images/home/home.png) no-repeat 0 20px; padding:0 12px 0 42px; margin-left:10px;}
.navigation li::before{ content:"|"; font-size:16px; color:#fff; position: absolute; right: -4px;}
.navigation li:last-child::before{ display:none;}
.navigation li i{ position:absolute; display:inline-block; width:0; height:3px; background:#fff; transition: all 0.3s ease-out; left:0; bottom:0;}
.navigation li:hover i{ width:100%;}

.culture{ width:333px; margin: 36px 0 0 10px; float:left; display:inline-block;line-height:32px;font-size:18px;color:var(--primary-color);text-align:center; font-weight:bold; }
.culture span{ display:block; font-size:20px; }

.search{ width:350px; height:72px; display:inline-block; margin:44px 0 0 50px }
.search .search-box input[type="text"]{ width:250px; height:50px; border:1px solid #a7a7a7; padding:0 20px; float:left; font-size:14px; color:#333; }
.search .search-box input[type="submit"]{ width:56px; height:52px; border:1px solid #a7a7a7; background:url(../images/home/search.png) no-repeat center #fff;float:left; cursor:pointer; margin-left:-2px }

.banner{position:relative;height:600px;z-index:0;border-top: 3px solid var(--primary-color);top: -10px;}
.banner .home-banner-swiper{ height: 600px;width: 100%;}
.banner .bd li{ height:600px;}
.banner .bd li a{ display:inline-block; width:100%; height:100%;}
.banner .hd ul{ position:absolute; bottom:20px; left:50%; transform:translateX(-50%);}
.banner .hd ul li{display: inline-block; width: 12px;height: 12px;margin: 0 10px; border-radius:10px; overflow: hidden; cursor: pointer; line-height:70px; text-align:center; font-size:20px; color:#979797; font-weight:bold; background:#fff; text-indent:-99999px;}
.banner .hd ul li.on{background:var(--primary-color); color:#fff;}

.index-title{ text-align:center;}
.index-title .title{ font-size:36px; font-weight:bold; color:#323232;}
.index-title .title span{ color:var(--primary-color);}
.index-title .title i{ position:relative; display: inline-block; width: 20px;    height: 20px;}
.index-title .title i::before{ content:""; display:inline-block; position:absolute; width:8px; height:8px; background:#333; border-radius:10px; left: 50%; top: 50%; margin-top: -4px; margin-left: -4px;}
.index-title .text{ font-size:20px; color:var(--primary-color); background:url(../images/home/index-title-bg.png) no-repeat center; margin-top:20px;}
.index-title .text2{ font-size:20px; color:var(--primary-color); background:url(../images/home/index-title-bg2.png) no-repeat center; margin-top:20px;}
.index-title .text span{ color:#727373;}


.index-product{ padding:70px 0 65px;}
.home-pro{ margin-top:50px; overflow: hidden;  height: 632px;}
.home-pro .hd{ width:230px; border:1px solid var(--primary-color); border-radius:10px; overflow:hidden; float:left;}
.home-pro .hd .top{ text-align:center; color:#fff; background:var(--primary-color); height:124px;}
.home-pro .hd .top .cn{ font-size:36px; padding-top:26px;}
.home-pro .hd .top .en{ font-size:12px; text-transform: uppercase; margin-top:10px;}
.home-pro .hd ul{ padding:5px 33px 5px 17px;}
.home-pro .hd li{ border-bottom:1px solid #ccc; transition: all 0.3s ease-out;}
.home-pro .hd li:last-child{ border-bottom:none;}
.home-pro .hd li a{ font-size:18px; color:#333; display:inline-block; padding-left:35px; background:url(../images/index-pro-icon1.png) no-repeat center left; line-height:70px;}
.home-pro .hd li:hover, .home-pro .hd li.on{ padding-left:15px;}
.home-pro .hd li:hover a, .home-pro .hd li.on a{ background:url(../images/home/index-jt.png) no-repeat center left; color:var(--primary-color);}

.home-pro .bd{ width:1010px; float:right;}
.home-pro .bd li{ float:left; margin-right: 40px; margin-top:10px; margin-bottom: 20px; transition: all 0.3s ease-out;}
.home-pro .bd li .img{ width:308px; height:248px; border:1px solid #d2d2d2;}
.home-pro .bd li .title{ width:310px; height:45px; line-height:45px; text-align:center; font-size:14px; color:#333; background:#eee;overflow: hidden; text-overflow: ellipsis;}
.home-pro .bd li:nth-child(3n){ margin-right:0;}
.home-pro .bd li:nth-child(3n-2){ clear:left;}
.home-pro .bd li:nth-child(n+4){ margin-bottom:0;}
.home-pro .bd li:hover{ margin-top:0; margin-bottom:30px;     box-shadow: 0 3px 8px rgba(0,0,0,.35);}
.home-pro .bd li:hover .img{ border:1px solid #3963d1;}
.home-pro .bd li:hover .title{ background:var(--primary-color); color:#fff;}

.home-news {background: url(../images/news_bg.png) no-repeat center; height:550px;;background-size: cover;margin-top: 80px;overflow: hidden;padding:35px 0 80px;}
.home-news .home-news-container {display: flex;margin-top: 20px;}

.home-news .home-news-container .news-banner {width: 50%;margin-top: 20px;}
.home-news .home-news-container .news-banner .news-banner-swiper .swiper-slide {height: 330px !important;}
.home-news .home-news-container .news-banner .news-banner-swiper .swiper-slide img {object-fit: cover;width: 100%;height: 100%;}
.home-news .home-news-container .news-banner .news-banner-thumb {margin-top: 10px;display: flex;}
.home-news .home-news-container .news-banner .news-banner-thumb .thumb {height: 75px;margin-left: 5px;flex: 1;margin-right: 5px;cursor: pointer;box-sizing: border-box;border: 1px solid transparent;}
.home-news .home-news-container .news-banner .news-banner-thumb .thumb.active {border-color: var(--primary-color);}
.home-news .home-news-container .news-banner .news-banner-thumb .thumb:last-child {margin-left: 5px;margin-right: 0;}
.home-news .home-news-container .news-banner .news-banner-thumb .thumb:first-child {margin-left: 0;margin-right: 5px;}
.home-news .home-news-container .news-banner .news-banner-thumb .thumb img {width: 100%;height: 100%;overflow-clip-margin: content-box;overflow: clip;object-fit: cover;}
.home-news .home-news-container .news-list {width: 50%;margin-top: 20px;margin-left: 20px;flex: 1;}
.home-news .home-news-container .news-list .news-item {background: #FFFFFF;word-wrap: break-word;padding: 20px;transition: all 0.3s;margin-bottom: 20px;}
.home-news .home-news-container .news-list .news-item.active {background: var(--primary-color);}
.home-news .home-news-container .news-list .news-item.active a {color: #fff;}
.home-news .home-news-container .news-list .news-item.active a .news-dt {border-color: #fff;}
.home-news .home-news-container .news-list .news-item a {display: block;height: 100%;color: #333;}
.home-news .home-news-container .news-list .news-item .news-info {display: flex;position: relative;justify-content: space-between;align-items: center;}
.home-news .home-news-container .news-list .news-item .news-info .news-dt {padding-right: 20px !important;flex-shrink: 0;text-align: center;border-right: 1px solid #dedede;}
.home-news .home-news-container .news-list .news-item .news-info .news-dt .yyyy {font-size: 18px;}
.home-news .home-news-container .news-list .news-item .news-info .news-content {flex-grow: 1;width: 0;padding-left: 20px !important;}
.home-news .home-news-container .news-list .news-item .news-info .news-content .news-title {font-size: 18px;}

.more {display: flex;justify-content: center;align-items: center;margin-top: 35px;}
.more a {color: var(--primary-color);border: 1px solid #3963d1;display: inline-block;padding: 11px 16px;border-radius: 4px;font-size: 16px;transition: all 0.2s;}
.more a:hover {background: var(--primary-color);color: #fff;}

.question{ margin-top:25px; width:410px; float:right;}
.question .top{ line-height:30px; background:url(../images/home/question.png) no-repeat center left; font-size:18px; color:#333; border-bottom:1px solid #c8c8c8; padding:10px 0 10px 55px;}
.question .top a{ float:right; font-size:14px;}
.question .top a:hover{ color:var(--primary-color); text-decoration:underline;}
.question .list{ padding-top:16px;}
.question .list li{ padding:0 12px; border:1px solid #c8c8c8; margin-bottom: 12px;}
.question .list li a{ display:inline-block;}
.question .list li .title{ line-height:24px; background:url(../images/home/question-mark.png) no-repeat center left; font-size:14px; color:#333; padding:6px 0 6px 36px; text-overflow: ellipsis;  display: block; overflow: hidden; height:24px;}
.question .list li .text{ line-height:24px; background:url(../images/home/answer.png) no-repeat center left; font-size:14px; color:#737373; padding:6px 0 6px 36px; text-overflow: ellipsis;  display: block;  overflow: hidden; height:24px;}
.question .list li:last-child{ margin-bottom:0;}
.question .list li:hover{ background:#d4d4d4;}
.question .list li:hover .title{ color:var(--primary-color);}

.home-about-us{ padding:70px 0 75px;}
.home-about-us .box{ margin-top:50px; overflow:hidden;}
.home-about-us .box .img{ height:550px; overflow:hidden; float:right;}
.home-about-us .box .text{ width:650px; height:550px; float:left; position:relative;}
.home-about-us .box .text .title{ font-size:18px; color:#333; font-weight:bold; position:relative; padding-bottom:15px;}
.home-about-us .box .text .title i{ position:absolute; width:233px; height:2px; background:var(--primary-color); left:0; bottom:0;}
.home-about-us .box .text .p{ color:#737373; font-size:14px; line-height:30px; text-indent:2em; margin:15px 0 10px;}
.home-about-us .box .text .btn a{ font-size:16px; color:#333;}
.home-about-us .box .text .btn a:hover{ color:var(--primary-color);}

.home-about-us-other{ height:90px; position:absolute; left:0; bottom:0;}
.home-about-us-other span{ line-height: 90px; height:90px; font-style: italic; display: inline-block; padding: 0 42px; font-size: 45px; color:white; font-weight: bold;  }
.home-about-us-other span:nth-child(3) { margin-right:20px }
.home-about-us-other span:nth-child(4),
.home-about-us-other span:nth-child(5),
.home-about-us-other span:nth-child(6) { color: var(--primary-color); }
.home-about-us-other-list{ width:1300px; text-align: center; margin:0 auto; background: rgba(200,200,200,.5);    overflow: hidden;}
.animate-box{float:left;    width: 262px; text-align:center; padding: 6px 0;}
.fh5co-counter{ font-size:52px; color:var(--primary-color);font-family:"Arial Black"; font-weight:bold; line-height:54px;display: inline-block; font-style:italic;}
.animate-box i{ color:#737373; font-size:24px;font-family:"Arial Black"; font-style:normal; margin-left:5px;}
.animate-box p{color: #737373;font-size: 16px; line-height: 24px;text-align: left;}
.home-about-us-other-list .one span, .home-about-us-other-list .one i, .home-about-us-other-list .one p{ color:#fff;}
.home-about-us-other-list .one p{ text-indent: 86px;}
.home-about-us-other-list .two p{ text-indent: 28px;}
.home-about-us-other-list .three p{ text-indent: 60px;}
.home-about-us-other-list .four p{ text-indent: 60px;}

.iys{ background:#eee; padding:25px 0 55px; overflow:hidden;}
.iys .top{ font-size:36px; color:var(--primary-color); background:url(../images/index-title-bg3.png) no-repeat center; font-weight:bold; text-align:center;}
.iys .box{ margin-top:40px;}
.iys .box li{
  float: left;
  width: 240px;
  height: 450px;
  border-radius: 0 50px 0 0;
  background: #fff;
  margin-right: 20px;}
.iys .box li:hover{ background:var(--primary-color);}
.iys .box li:last-child{ margin-right:0;}
.iys .box li .icon{ height:100px; width:100%; margin-top:35px;}
.iys .box li .icon1{ background:url(../images/icon1.png) no-repeat center;}
.iys .box li .icon2{ background:url(../images/icon2.png) no-repeat center;}
.iys .box li .icon3{ background:url(../images/icon3.png) no-repeat center;}
.iys .box li .icon4{ background:url(../images/icon4.png) no-repeat center;}
.iys .box li .icon5{ background:url(../images/icon5.png) no-repeat center;}
.iys .box li:hover .icon1{ background:url(../images/icon1-1.png) no-repeat center;}
.iys .box li:hover .icon2{ background:url(../images/icon2-1.png) no-repeat center;}
.iys .box li:hover .icon3{ background:url(../images/icon3-1.png) no-repeat center;}
.iys .box li:hover .icon4{ background:url(../images/icon4-1.png) no-repeat center;}
.iys .box li:hover .icon5{ background:url(../images/icon5-1.png) no-repeat center;}
.iys .box li .title{ font-size:18px; color:#333; text-align:center; font-weight:bold; margin-top:30px;}
.iys .box li .text{ font-size:14px; color:#333; line-height:24px; padding:0 25px; margin-top:25px; text-align:justify;}
.iys .box li:hover .title, .iys .box li:hover .text{ color:#fff;}

.footer{ background:#333; padding-top:50px; overflow:hidden;}
.foot-nav{ float:left; overflow:hidden; width:430px;}
.foot-nav li{ width:130px; float:left; margin-left: 12px; margin-bottom: 18px;}
.foot-nav li a{ font-size:16px; color:#fff;}
.foot-nav li:hover a{ color:var(--primary-color);}
.foot-contact{ float:left; width:400px; margin-left:80px;}
.foot-contact li p{ font-size:14px; color:#fff; line-height:24px;}
.foot-contact li.tel{ background:url(../images/home/foot-phone.png) no-repeat center left; padding-left:60px; margin-bottom:40px;}
.foot-contact li.dz{ background:url(../images/home/foot-address.png) no-repeat center left; padding-left:60px;}
.foot-wx{ float:right;}
.foot-wx .title{ text-align:center; font-size:14px; color:#fff; margin-top:10px;}
.foot-copy{ border-top:1px solid #c8c8c8; line-height:60px; text-align:center; margin-top:35px;}
.foot-copy a, .foot-copy span{ display:inline-block; color:#fff; font-size:14px;}
.foot-copy span{ margin:0 20px;}

.pager-banner{ height:350px; margin-top:-10px; position:relative; z-index:0;  border-top: 3px solid var(--primary-color);border-bottom: 3px solid var(--primary-color); }
.pager-banner .container{ display: table; }
.pager-banner-text{ display: table-cell; vertical-align: middle; padding-left:60px;}
.pager-banner-text .title{ font-size:36px; color:var(--primary-color); font-weight:bold; position:relative; padding-bottom:12px;}
.pager-banner-text .text{ color:#5a5a5a; font-size:20px; line-height:26px;}

.ty-left{ width:230px; margin-top:-15px; margin-bottom:30px; position:relative; z-index:1; float:left;}
.ty-left .ty-nav{ width:230px; border:1px solid var(--primary-color); border-radius:10px; overflow:hidden; float:left;}
.ty-left .ty-nav .top{ text-align:center; color:#fff; background:var(--primary-color); height:124px;}
.ty-left .ty-nav .top .cn{ font-size:36px; padding-top:26px;}
.ty-left .ty-nav .top .en{ font-size:12px; text-transform: uppercase; margin-top:10px;}
.ty-left .ty-nav ul{ padding:5px 33px 5px 17px;}
.ty-left .ty-nav li{ border-bottom:1px solid #ccc; transition: all 0.3s ease-out;}
.ty-left .ty-nav li:last-child{ border-bottom:none;}
.ty-left .ty-nav li a{ font-size:18px; color:#333; display:inline-block; padding-left:35px; background:url(../images/home/index-jt-black.png) no-repeat center left; line-height:70px;}
.ty-left .ty-nav li:hover, .ty-left .ty-nav li.on{ padding-left:15px;}
.ty-left .ty-nav li:hover a, .ty-left .ty-nav li.on a{ background:url(../images/home/index-jt.png) no-repeat center left; color:var(--primary-color);}

.ty-left .ty-contact{ width:230px; border:1px solid var(--primary-color); border-radius:10px; overflow:hidden; float:left; margin-top:46px;}
.ty-left .ty-contact .top{ text-align:center; color:#fff; background:var(--primary-color); height:80px;}
.ty-left .ty-contact .top .cn{ font-size:24px; padding-top:14px;}
.ty-left .ty-contact .top .en{ font-size:12px; text-transform: uppercase; margin-top:5px;}
.ty-left .ty-contact .text{}
.ty-left .ty-contact .text dl{ padding:20px 24px 15px;}
.ty-left .ty-contact .text dt{ font-size:14px; color:var(--primary-color); font-weight:bold; margin-bottom:8px;}
.ty-left .ty-contact .text dd{ font-size:14px; color:#333; line-height:24px; overflow:hidden;}
.ty-left .ty-contact .text dd span{ display:inline-block; width:42px; float:left;}
.ty-left .ty-contact .text dd p{ display:inline-block; width:136px; float:right;}

.ty-right{ float:right; width:1020px; margin-top:30px;}
.ty-right .ty-top{ height:50px; line-height:50px; background:#eee;}
.ty-right .ty-top .title{ float:left; width:150px; height:50px; background:var(--primary-color); color:#fff; font-weight:bold; text-align:center; font-size:18px;}
.ty-right .ty-top .mbx{ float:right; font-size:14px; color:#333; margin-right:20px;}
.ty-right .ty-top .mbx span{ display:inline-block; background:url(../images/home/home-icon.png) no-repeat center left; padding-left:28px;}
.ty-right .ty-top .mbx a{ display:inline-block; margin:0 5px;}
.ty-right .ty-top .mbx a:hover{ color:var(--primary-color); text-decoration:underline;}

.ty-right .ty-page{ padding:20px 0 40px;}

.main-container {
  padding-bottom: 60px;
}
.main-container .slide {
  width: 300px;
  float: left;
}
.main-container .content-right {
  margin-left: 340px;
}
.main-container.mini .slide {
  width: 240px;
}
.main-container.mini .content-right {
  margin-left: 280px;
}
.main-container .sidemenu a {
  color: #333;
}
.main-container .sidemenu a:hover {
  color: #175ba5;
}
.main-container .sidemenu h3 {
  font-size: 20px;
  padding-left: 15px;
  margin-bottom: 10px;
  position: relative;
}
.main-container .sidemenu h3:before {
  position: absolute;
  left: 0;
  content: "";
  width: 5px;
  height: 20px;
  top: 50%;
  margin-top: -10px;
  background: #175ba5;
  border-radius: 5px;
}
.main-container .sidemenu ul, .main-container .sidemenu li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.main-container .sidemenu li {
  margin-top: 5px;
}
.main-container .sidemenu h5 {
  line-height: 22px;
  display: block;
  font-size: 18px;
  color: #333;
  border: 1px solid #E3E3E3;
  cursor: pointer;
  position: relative;
}
.main-container .sidemenu h5 a {
  display: block;
  padding: 10px 40px 10px 15px;
}
.main-container .sidemenu h5 span {
  position: absolute;
  right: 0;
  display: flex;
  content: "+";
  top: 0;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 40px;
  height: 40px;
  color: #999;
}
.main-container .sidemenu dl {
  border: 1px solid #E3E3E3;
  border-top: none;
  transition: all 0.2s;
  display: none;
}
.main-container .sidemenu dd {
  border-bottom: 1px dashed #DCDCDC;
  line-height: 22px;
}
.main-container .sidemenu dd.active a {
  color: var(--primary-color);
  font-weight: bold;
}
.main-container .sidemenu dd a {
  font-size: 16px;
  display: block;
  color: #666;
  padding: 10px 20px 10px 25px;
  text-transform: capitalize;
}
.main-container .sidemenu dd:last-child {
  border-bottom-color: transparent;
}
.main-container .product-list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 30px;
  justify-content: flex-start;
}
.main-container .product-list .product-item {
  width: calc(33.3333333333% - 20px);
  cursor: pointer;
}
.main-container .product-list .product-item a {
  color: #333;
}
.main-container .product-list .product-item a:hover {
  color: var(--primary-color);
}
.main-container .product-list .product-item a:hover .product-img {
  border-color: var(--primary-color);
}
.main-container .product-list .product-item a:hover img {
  transform: scale(1.08);
}
.main-container .product-list .product-item .product-img {
  border: 2px solid #eee;
  overflow: hidden;
  padding: 10px;
}
.main-container .product-list .product-item .product-img img {
  width: 100%;
  transition: all 0.3s;
  height: 100%;
  object-fit: contain;
}
.main-container .product-list .product-item .product-info {
  margin-top: 10px;
  font-size: 18px;
  text-align: center;
}

.product-wrapper{
  margin-top: 30px;
}

.product-wrapper .product-head {
  display: flex;
}
.product-wrapper .product-head .view {
  border: 1px solid #ddd;
}
.product-wrapper .product-head .product-banner {
  width: 500px;
  --swiper-navigation-size: 24px;
  --swiper-theme-color: var(--primary-color);
}
.product-wrapper .product-head .product-banner .big-swiper .swiper-slide {
  width: 500px;
  height: 330px;
  padding: 10px;
}
.product-wrapper .product-head .product-banner .big-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-wrapper .product-head .product-banner .thumb-swiper .swiper-slide {
  width: 12.5% !important;
  height: 100%;
  opacity: 0.4;
  position: relative;
  padding: 10px 0;
  cursor: pointer;
}
.product-wrapper .product-head .product-banner .thumb-swiper .swiper-slide img {
  border: 1px solid #ddd;
  width: 100%;
  height: 100%;
  object-fit: cover;
  padding: 2px;
}
.product-wrapper .product-head .product-banner .thumb-swiper .swiper-slide-thumb-active {
  opacity: 1;
}
.product-wrapper .product-head .product-banner .thumb-swiper .swiper-slide-thumb-active img {
  border-color: var(--primary-color);
}
.product-wrapper .product-head .product-banner .thumb-swiper .swiper-slide-thumb-active:after {
  content: "";
  width: 0;
  height: 0;
  line-height: 0;
  border-width: 5px;
  border-style: dashed;
  border-color: transparent;
  vertical-align: middle;
  border-bottom-style: solid;
  border-bottom-color: var(--primary-color);
  position: absolute;
  top: 0;
  left: 50%;
  margin: 0 0 0 -5px;
}
.product-wrapper .product-head .product-info {
  flex: 1;
  margin-left: 50px;
}
.product-wrapper .product-head .product-info .product-name {
  font-size: 28px;
  font-weight: bold;
}
.product-wrapper .product-head .product-info .product-param {
  margin: 20px 0 0 0;
}
.product-wrapper .product-head .product-info .product-btns {
  margin-top: 20px;
}
.product-wrapper .product-head .product-info .product-btns a {
  display: inline-block;
  width: 130px;
  height: 40px;
  color: #fff;
  text-align: center;
  font-size: 18px;
  line-height: 40px;
  background: var(--primary-color);
}
.product-wrapper .product-head .product-info .product-btns a:first-child {
  margin-right: 10px;
}
.product-wrapper .product-head .product-info .product-btns a:hover {
  background: var(--primary-color);
}
.product-wrapper .product-html {
  margin: 30px 0 0 0;
  position: relative;
  padding-top: 20px;
  border-top: 4px solid #eee;
}
.article-next {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  padding-bottom: 18px;
  border-bottom: 1px #ddd dashed;
}
.article-wrapper .article-next a {
  font-size: 16px;
  display: block;
  color: #333;
  letter-spacing: 0.4px;
}
.article-wrapper .article-next a:hover {
  color: var(--primary-color);
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.about .text{ font-size:14px; color:#333; line-height:24px;}
.about .text p+p{ margin-top:22px;}
.about .img{ margin-top:20px;}

.about-box1{ margin-top:20px; overflow:hidden;}
.about-box1 .img{ width:500px; float:left; margin-top:0;}
.about-box1 .text{ width:490px; float:right; font-size:14px; color:#333; line-height:26px;}
.about-box1 .text p{ text-indent:2em; margin-top:0 !important;}
.about-box2{ margin:45px 0;}
.about-box3{ overflow:hidden;}
.about-box3 .box3-title{ color:#1250a7; text-align:center;}
.about-box3 .box3-title .en{ font-size:20px; text-transform: uppercase;}
.about-box3 .box3-title .cn{ font-size:24px; margin-top:6px;}
.about-box3 .list{ overflow:hidden; margin-top:20px; position:relative;}
.about-box3 .list ul{ position:relative; z-index:1;}
.about-box3 .list li{ float:left; width:85px;  text-align:center; margin: 0 42px;}
.about-box3 .list li .img{ width:100%; height:68px; line-height:68px;}
.about-box3 .list li .title{ color:#646464; font-size:16px; margin:10px 0 15px;}
.about-box3 .list li .icon{ width:100%; height:15px; background:url(../images/about-icon.png) no-repeat center; position:relative;}
.about-box3 .list li .icon i{ position:absolute; display:inline-block; width:7px; height:7px; background:#1250a7; top:50%; left:50%; margin-top:-3.5px; margin-left:-3.5px ; border-radius:7px; display:none;}
.about-box3 .list li:hover .icon i{ display:block;}
.about-box3 .list li .num{ font-size:30px; color:#1250a7; margin-top:18px;}
.about-box3 .list .line{ width:100%; height:1px; background:#b5b5b5; position:absolute; z-index:0; left:0; top: 67%;}

@media (max-width: 767px){
  .about-box1{ overflow:hidden;}
  .about-box1 .img{ width:100%; margin-top:0;}
  .about-box1 .text{ width:100%; float:right; font-size:1.4em; color:#333; line-height:26px; margin-top:20px;}
  .about-box1 .text p{ margin-top:0 !important;}
  .about-box2{ margin:20px 0;}
  .about-box3{ overflow:hidden; margin-top:10px;}
  .about-box3 .box3-title{ color:#1250a7; text-align:center;}
  .about-box3 .box3-title .en{ font-size:1.6em; text-transform: uppercase;}
  .about-box3 .box3-title .cn{ font-size:1.8em; margin-top:4px;}
  .about-box3 .list{ overflow:hidden; margin-top:20px; position:relative;}
  .about-box3 .list ul{ position:relative; z-index:1;}
  .about-box3 .list li{ float:left; width:33.3333%;  text-align:center; padding: 0 5.6%; margin:0;}
  .about-box3 .list li .img{ width:100%; height:68px; line-height:68px;}
  .about-box3 .list li .title{ color:#646464; font-size:1.4em; margin:10px 0;}
  .about-box3 .list li .icon{ width:100%; height:15px; background:url(../images/about-icon.png) no-repeat center; position:relative;}
  .about-box3 .list li .icon i{ position:absolute; display:inline-block; width:7px; height:7px; background:#1250a7; top:50%; left:50%; margin-top:-3.5px; margin-left:-3.5px ; border-radius:7px; display:none;}
  .about-box3 .list li:hover .icon i{ display:block;}
  .about-box3 .list li .num{ font-size:2em; color:#1250a7; margin-top:18px;}
  .about-box3 .list .line{ width:100%; height:1px; background:#b5b5b5; position:absolute; z-index:0; left:0; top: 34%;}
  .about-box3 .list .line2{ width:100%; height:1px; background:#b5b5b5; position:absolute; z-index:0; left:0; top: 84%;}
}



.product-list{ overflow:hidden;}
.product-list li{ float:left; margin-right: 45px; margin-top:10px; margin-bottom: 30px; transition: all 0.3s ease-out;}
.product-list li .img{ width:308px; height:248px; border:1px solid #d2d2d2;}
.product-list li .title{ width:310px; height:45px; line-height:45px; text-align:center; font-size:14px; color:#333; background:#eee;overflow: hidden}
.product-list li:nth-child(3n){ margin-right:0;}
.product-list li:nth-child(3n-2){ clear:left;}
.product-list li:hover{ margin-top:0px; margin-bottom:40px;     box-shadow: 0px 3px 8px rgba(0,0,0,.35);}
.product-list li:hover .img{ border:1px solid var(--primary-color);}
.product-list li:hover .title{ background:var(--primary-color); color:#fff;}

.product-con{}
.product-con .img{  width: 500px; height:400px; border:1px solid #e5e5e5; margin: 0 auto; overflow:hidden; position: relative;}
.product-con .img .bd{ border:1px solid #dcdcdc; width:498px; height:398px;}
.product-con .img .hd a{ display:inline-block; width:25px; height:48px; position:absolute;     top:50%; transform:translateY(-50%);}
.product-con .img .hd a.prev{ background:url(../images/product-con-prev.png) no-repeat center; left:10px;}
.product-con .img .hd a.next{ background:url(../images/product-con-next.png) no-repeat center; right:10px;}
.product-con .img .hd .pageState{ position: absolute; bottom: 10px;    right: 10px;    letter-spacing: 3px;    font-size: 14px;}
.product-con .text{ float:left; width:350px; margin-left:40px;}
.product-con .text .title{ font-size:24px; color:#c70000; font-weight:bold; margin-top:40px; padding-bottom:20px;}
.product-con .text .fl, .product-con .text .yy, .product-con .text .jj{ font-size:14px; color:#333; padding:15px 0; border-top:1px solid #e5e5e5; width: 100%; overflow: hidden; line-height:24px;}
.product-con .text .btn{ margin-top:10px;}
.product-con .text .btn a{ display:inline-block; width:140px; height:40px; text-align:center; line-height:40px; background:#c70000; color:#fff;}
.product-con .text .btn a:hover{ background:var(--primary-color);}

.product-xq{ margin-top: 35px;}
.product-xq .top{ background:url(../images/proudct-con-title.png) no-repeat center; height:42px;}
.product-xq .top span{ width:150px; height:40px; line-height:40px; text-indent:20px; font-size:18px; color:#fff;  display:inline-block; font-weight:bold;}
.product-xq .xq-text{ font-size:16px; color:#333; line-height:26px; padding:20px 0; position:relative; }
.product-xq:nth-child(1) .xq-text{ min-height:250px;}
.product-xq .xq-text span{ font-weight:bold; color:var(--primary-color);}
.product-xq + .product-xq{ margin-top:15px;}
.product-xq p+p{ margin-top:10px;}

.product-xg{ margin-top:35px; overflow:hidden;}
.product-xg .top{ border-bottom:2px solid #d2d2d2;}
.product-xg .top span{ width:150px; height:40px; line-height:40px; text-align:center; font-size:16px; color:#333; background:#d2d2d2; display:inline-block; font-weight:bold;}
.product-xg .xg-box{ padding-top:36px;}
.product-xg .xg-box li{ float:left; margin-right: 26px; margin-bottom: 30px; transition: all 0.3s ease-out; width:235px;}
.product-xg .xg-box li .imgs{ width:233px;  border:1px solid #d2d2d2;}
.product-xg .xg-box li .title{ width:235px; height:45px; line-height:45px; text-align:center; font-size:14px; color:#333; background:#eee;}
.product-xg .xg-box li:nth-child(4n){ margin-right:0;}
.product-xg .xg-box li:hover{  box-shadow: 0px 3px 8px rgba(0,0,0,.35);}
.product-xg .xg-box li:hover .imgs{ border:1px solid var(--primary-color);}
.product-xg .xg-box li:hover .title{ background:var(--primary-color); color:#fff;}

.pager-list{ padding-top:20px; padding-bottom:20px; text-align:center;}
.pager-list ul{ list-style-type:none; margin:0; padding:0; display:inline-block;}
.pager-list li{ float:left; padding:0 6px;}
.pager-list li>*{ display:inline-block; font-size:14px; color:#333; height:30px; line-height:30px; padding:0 12px; border:1px solid #bfbfbf;  background:#fff; }
.pager-list li a:hover{ background:var(--primary-color); color:#fff; border:1px solid var(--primary-color);}
.pager-list li.active>*{ color:#fff; background:var(--primary-color); border:1px solid var(--primary-color);}
.pager-list li.disabled>*{ cursor:auto; background:#fff; color:#ccc;}

.news-list{ padding-bottom:20px;}
.news-list li{ overflow:hidden; padding-bottom:30px; border-bottom:1px solid #d2d2d2;}
.news-list li+li{ padding-top:30px;}
.news-list li .img{ width:320px; height:200px; float:left; overflow: hidden;}
.news-list li .img img{ transition: all 0.3s ease-out;}
.news-list li:hover .img img{  transform: scale(1.1,1.1);}
.news-list li .text{ float:right; width:670px; height:200px;}
.news-list li .text .title{ font-size:18px; color:#333; font-weight:bold; margin-bottom:16px; margin-top:6px;}
.news-list li:hover .text .title{ color:var(--primary-color) ;}
.news-list li .text .title i{ display:inline-block; width:0px; height:3px; border-radius:3px; background:var(--primary-color); margin-right:15px; float: left; margin-top: 0px;  transition: all 0.3s ease-out;}
.news-list li .text .title i{width:80px; margin-top: 12px;}
.news-list li .text .date{ font-size:14px; color:#717171; margin-bottom:16px;}
.news-list li .text .p{ font-size:14px; line-height:24px; color:#333; text-overflow: ellipsis;  display: -webkit-inline-box;    -webkit-line-clamp: 3;    -webkit-box-orient: vertical;    overflow: hidden; height:72px;}
.news-list li .text .more{ color:var(--primary-color); font-size:14px; margin-top:18px;}
.news-list li .text .more:hover{ text-decoration:underline;}

.qa-list{}
.qa-list .title{ width:100%; height:50px; line-height:50px; background:#eee; font-size:14px; color:#333; margin-bottom:24px;}
.qa-list .title span{ display:inline-block; width:50px; height:50px; text-align:center; border-radius:4px; font-size:24px; color:#fff; font-weight:bold; background:var(--primary-color); margin-right:18px;}
.qa-list .title i{ font-style:normal; font-size: 48px; display:inline-block; float:right; width:50px; height:50px; text-align:center; margin-right:10px; transition: all 0.3s ease-out; cursor:pointer;}
.qa-list .text{ padding-bottom:24px; overflow:hidden;}
.qa-list .text span{ display:inline-block; width:50px; height:50px; text-align:center; border-radius:4px; font-size:24px; color:#fff; font-weight:bold; background:#333; line-height:50px; float:left;}
.qa-list .text p{ width:956px; float:right; font-size:14px; color:#333; line-height:24px; text-overflow: ellipsis;  display: -webkit-inline-box;    -webkit-line-clamp: 2;    -webkit-box-orient: vertical;    overflow: hidden; height:48px; margin-top:15px;}
.qa-list .text p:hover{ color:var(--primary-color);}
.qa-list .title.on{ background:var(--primary-color); color:#fff;}
.qa-list .title.on i{ transform:rotate(45deg); -ms-transform:rotate(45deg); 	/* IE 9 */ -moz-transform:rotate(45deg); 	/* Firefox */ -webkit-transform:rotate(45deg); /* Safari 和 Chrome */ -o-transform:rotate(45deg); }

.news-con{ padding:20px 0;}
.news-con .title{ font-size:18px; color:var(--primary-color); font-weight:bold; text-align:center;}
.news-con .bq{ text-align:center; border-bottom:1px solid #d2d2d2; padding:10px 0;}
.news-con .bq span{ font-size:14px; color:#717171; margin:0 5px;}
.news-con .text{ padding:20px 0; font-size:14px; color:#333; line-height:24px;}
.news-con .text p+p{ margin-top:22px;}

.pager{ background:#eee; padding:4px 26px;}
.pager div{ line-height:40px; font-size:14px; color:#333;}
.pager .prev{ border-bottom:1px dashed #bfbfbf;}
.pager div a:hover{ color:var(--primary-color); text-decoration:underline;}

.contact{ overflow:hidden;}
.contact dt{ font-size:18px; color:var(--primary-color); font-weight:bold; margin-bottom:10px;}
.contact dd{ font-size:14px; color:#333; line-height:30px;}

.map{ margin:20px 0 40px; height:400px;}

.message{ padding:20px 0;}
.message li{ margin-bottom:20px; display:block; overflow:hidden;}
.message li span{ display:inline-block; font-size:14px; color:#333; width:110px; text-align:right; line-height:40px; font-weight:bold; float:left; margin-right:20px;}
.message li input[type="text"]{ height:38px; width:368px; border-radius:4px; border:1px solid #d2d2d2; padding:0 20px; float:left;}
.message li textarea{ float:left; padding:10px 20px; width:368px; height:120px; border-radius:4px; border:1px solid #d2d2d2;}
.message li.yzm input[type="text"]{ width:178px;}
.message li.yzm img{ margin-left:10px;}
.message li.yzm a{ font-size:14px; color:#333; display:inline-block; margin-left:10px;}
.message li.yzm a:hover{ color:var(--primary-color); text-decoration:underline;}
.message li input[type="submit"]{ width:150px; height:40px; border:none; color:#fff; font-size:16px; background:var(--primary-color); margin-left:130px; border-radius:4px; cursor:pointer;}
.message li input[type="submit"]:hover{ background:#00a2ea;}
.message li input[type="reset"]{ width:150px; height:40px; border:none; color:#fff; font-size:16px; background:#bfbfbf; margin-left:30px; border-radius:4px; cursor:pointer;}
.message li input[type="reset"]:hover{ background:#00a2ea;}