@charset "utf-8";
/* 全局CSS定义 */
html{ margin: 0; padding: 0;}
body { font-family: "微软雅黑"; background: #fff; font-size:16px; color:#333; margin: 0; padding: 0;}
div,form,img,ul,ol,li,dl,dt,dd {margin: 0; padding: 0; border: 0; list-style: none none;}
h1,h2,h3,h4,h5,h6 { margin:0; padding:0; font-size:16px; font-weight: normal;}
table,td,tr,th{font-size:16px;}
@font-face { font-family: 'iconfont'; src: url("img/iconfont.ttf"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'icomoon'; src: url("img/icomoon.ttf"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'icomoon2'; src: url("img/icomoon_2.ttf"); font-weight: normal; font-style: normal; }

/* 链接颜色 */
a:link {color: #333; text-decoration:none;}
a:visited {color: #333;text-decoration:none;}
a:hover { color: #FF0039; text-decoration: none;}
a:active { color: #333;}

/* 字体属性 */
.fB {font-weight: bold;}
.clr{ clear: both; height: 0; line-height: 0; font-size: 0;}
.c06c,.c06c:link,.c06c:visited{ color: #0062AF;}
.c06c:hover{ color: #f30;}
.clr_10{ clear: both; height: 10px; line-height: 0; font-size: 0;}
.clr_25{ clear: both; height: 28px; line-height: 0; font-size: 0;}

.pages{ height: 28px; line-height: 28px; clear:both; padding: 25px 0 80px; text-align:center;}
.pages a,.pages a:visited,.pages strong{ margin: 0 5px; padding: 10px 18px; text-align:center; border: 1px solid #00AEEF; background: #fff; font-size: 18px;}
.pages a:hover,.pages strong{ border: 1px solid #00AEEF; color: #fff; background: #00AEEF; font-weight:normal;}



.Header{ background: #111; padding: 25px 40px;}
.Header .logo{ float:left;}
.Header .nav{ float:right; margin-top: 25px;}
.Header .nav li{ float: right; font-size: 18px; padding-right: 30px;}
.Header .nav li a,.Header .nav li a:visited{ color: #fff;}
.Header .nav li a:hover{ color: #FF0039;}
.Header .nav .mobile{  width: 19px; height: 25px; padding: 0; margin-left: 30px;}
.Header .nav .mobile a{ display:block; height: 25px;background:url(img/ico_mobile.png) no-repeat 0 0;}
.Header .nav .mobile a:hover{}


/*banner*/
.c-banner{width: 100%;position: relative;}
.c-banner img{width: 100%;}
.c-banner .banner ul{list-style: none;padding-left: 0px;margin-bottom: 0px;}
.c-banner .banner ul li{position: absolutedisplay: none;opacity: 0;}
.c-banner .banner ul li:nth-child(1){opacity: 1;display: block;}
.c-banner .banner ul li img{width: 100%;position: absolute;top: 0px;}
.c-banner .banner ul li:first-child img{position: relative;}
.c-banner .jumpBtn{width: 100%;position: absolute;bottom: 20px;text-align: center;}
.c-banner .jumpBtn ul{margin-bottom: 0px;padding: 0px;}
.c-banner .jumpBtn ul li{width: 17px;height: 17px;border-radius: 50%;display: inline-block;background-color: #fff;opacity: 0.9;margin-left: 10px;}
.c-banner .jumpBtn ul li:first-child{margin-left: 0px; }
@media screen and (max-width:768px){.c-banner{width: 100%;height: 345px;overflow: hidden;}.c-banner .banner ul li img{width: 768px;height: 345px;position: absolute;left: 50%;margin-left: -384px;}}



.Home{}

.Home h2{  padding: 40px 15px; font-size: 42px;}
.Home h2 a{ float:right; background:url(img/ico_1.png) no-repeat right center; padding-right: 30px; font-size: 18px; color: #999; margin-top: 20px; font-weight: normal;}

.Home .Products{ padding: 0 25px 25px;}
.Home .Products ul{}
.Home .Products ul li{ float:left; width: 25%; padding-bottom: 40px;}
.Home .Products ul li img{ display:block; width: 100%;}
.Home .Products ul li a{ margin: 0 15px; display:block; position:relative;}
.Home .Products ul li span{ position:absolute; z-index: 2; background: rgba(0,0,0,0.6); bottom: 0; height: 48px; line-height: 48px; width: 100%; text-align:center; color: #fff;}


.Home .Caselist{ background: #E9E9E9; padding: 0 25px 25px;}

.Home .Caselist li{float:left; width: 25%; padding-bottom: 40px;}
.Home .Caselist li img{ display:block; width: 100%;}
.Home .Caselist li a{ margin: 0 15px; display:block; position:relative;}
.Home .Caselist li span{ position:absolute; z-index: 2; background: rgba(0,0,0,0.6) url(img/ico_2.png) no-repeat 15px 15px; background-size: 30px; bottom: 0; height: 45px; line-height: 45px; width: 100%;text-indent: 55px;  color: #fff;}

.Home .about{ background:url(img/bg_1.jpg) no-repeat center 0; height: 520px;filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";-moz-background-size:100% 100%;   background-size:100% 100%;}
.Home .about img{ display: block; margin: 0 auto 10px;}
.Home .about p{ margin: 0 ; padding: 125px 0 0; text-align:center; color: #fff; font-size: 20px; line-height: 200%;}
.Home .about p a{ display:block; width: 160px; height: 56px; color: #fff; background: #00AEEF; text-align:center; line-height: 56px; margin:35px auto 0;}
.Home .about p a:hover{ background: #FF0039;}


.Content{}

.Content .menu{ margin: 0 auto; height: 60px; width: 162px; padding-top: 100px;}
.Content .menu li{ float:left; width: 140px; height: 50px; color: #fff; font-size: 18px; margin: 0 10px; border: 1px solid #00AEEF; text-align:center; line-height: 50px;}
.Content .menu li a,.Content .menu li a:visited{ display:block;}
.Content .menu .tag a,.Content .menu li a:hover{color: #fff; background: #00AEEF; }

.Content .menuw2{ width: 324px;}
.Content .menuw3{ width: 486px;}


.Content .about{ clear:both; padding: 50px 40px;}
.Content .about p{ line-height: 250%;}

.Content .Products{ padding: 65px 25px 0;}
.Content .Products ul{}
.Content .Products ul li{ float:left; width: 25%; padding-bottom: 40px;}
.Content .Products ul li img{ display:block; width: 100%;}
.Content .Products ul li a{ margin: 0 15px; display:block; position:relative;}
.Content .Products ul li span{ position:absolute; z-index: 2; background: rgba(0,0,0,0.6); bottom: 0; height: 48px; line-height: 48px; width: 100%; text-align:center; color: #fff;}

.Content .links{ padding: 40px;}

.Content .ProductsView{ padding: 40px;}
.Content .ProductsView h1{ font-size: 42px; font-weight:bold; text-align:center; padding-bottom: 60px;}
.Content .ProductsView .top{ background: #E9E9E9;}
.Content .ProductsView .pic{ float:left; width: 640px;}
.Content .ProductsView .pic a{display:block; position:relative;}
.Content .ProductsView .pic img{ width: 100%; display:block;}
.Content .ProductsView .pic span{position:absolute; z-index: 2; background: rgba(0,0,0,0.6) url(img/ico_2.png) no-repeat 15px 17px; background-size: 30px; bottom: 0; height: 50px; line-height: 50px; width: 100%; text-indent: 55px;  color: #fff;}



.Content .ProductsView .miaoshu{ float:left; line-height: 220%; padding: 35px 0 25px 45px;}
.Content .ProductsView .miaoshu p{ margin: 0; padding: 0;}
.Content .ProductsView .miaoshu .add{ height: 50px; padding-top: 50px;}
.Content .ProductsView .miaoshu .add a{ width: 140px; height: 50px; float:left; color: #fff;background: #00AEEF;  display:block; margin-right: 30px;text-align:center; line-height: 50px;}
.Content .ProductsView .miaoshu .add a:hover{background: #FF0039; color: #fff;}



.Content .ProductsView .title{ border-bottom: 1px solid #ddd; height: 55px; padding-top: 50px; clear:both;}
.Content .ProductsView .title span{ border-bottom: 4px solid #000;font-size: 32px; padding-bottom: 10px; display:block; float:left;}
.Content .ProductsView .text{ line-height: 200%; font-size: 18px; padding: 20px 0 50px;}
.Content .ProductsView img{ display:block;}
.Content .ProductsView .next{ border-top: 1px solid #ddd; padding-top: 25px; line-height: 280%;}
.Content .ProductsView .next a{ }

.Content .ProductsVideo{ padding: 65px 25px 0;}
.Content .ProductsVideo li{float:left; width: 25%; padding-bottom: 40px;}
.Content .ProductsVideo li img{ display:block; width: 100%;}
.Content .ProductsVideo li a{ margin: 0 15px; display:block; position:relative;}
.Content .ProductsVideo li span{ position:absolute; z-index: 2; background: rgba(0,0,0,0.6) url(img/ico_2.png) no-repeat 15px 15px; background-size: 30px; bottom: 0; height: 45px; line-height: 45px; width: 100%; text-indent: 55px;  color: #fff;}


.Content .newslist{ padding: 60px 40px 0;}
.Content .newslist li{ height: 55px; line-height: 55px;  padding: 0 20px 0 20px; text-align:right; color: #999;}
.Content .newslist .bg{  background: #EFEFEF ; background-size:13px;}
.Content .newslist li a{ float:left;}

.Content .newslist ul{ padding-bottom: 35px;}

.Content .newsview{ padding: 40px 40px 30px;}
.Content .newsview h1{ font-size: 36px; font-weight:bold;}
.Content .newsview .time{ padding: 15px 0;}
.Content .newsview .text{ line-height: 250%; padding: 15px 0;}
.Content .newsview .text p{ margin: 0; padding: 15px 0;}
.Content .newsview .next{ border-top: 1px solid #ddd; padding-top: 25px; line-height: 280%;}
.Content .newsview .next a{ }







.Foot{ background: #000; padding: 40px;}
.Footbg{color: #999;}
.Footbg ul{ float:left; width: 25%;}
.Footbg ul .t{ font-size: 18px; color: #fff;}
.Footbg ul li{ line-height: 250%;}
.Footbg ul li a,.Footbg ul li a:visited{ color: #999;}
.Footbg ul li a:hover{ color: #FF0039;}
.Footbg .add{ clear:both; border-top: 1px solid #222; margin-top: 60px; text-align:center; font-size: 13px; padding-top: 20px; line-height: 250%; }
.Footbg .add a{color: #999;}

.reveal-modal-bg{position:fixed;height:100%;width:100%;background:#000;background:rgba(0,0,0,.7);z-index:100;display:none;top:0;left:0}
.reveal-modal{visibility:hidden;width:330px;margin:0 auto;top:150px;margin:0 auto;left:50%;margin-left:-150px;position:absolute;z-index:101;padding:30px 40px 34px;text-align:center;color:#fff;font-weight:700}
.reveal-modal .close-reveal-modal{font-size:38px;line-height:.5;position:absolute;top:8px;right:11px;color:#aaa;text-shadow:0 -1px 1px rbga(0,0,0,.6);font-weight:700;cursor:pointer}
.reveal-modal img{ width: 330px;}




.izl-rmenu{position:fixed; right:10px;  bottom:10px; padding-bottom:73px; background:url(img/r_b.png) 0px bottom no-repeat; z-index:999; }
.izl-rmenu .btn{width:80px; height:50px; cursor:pointer; position:relative; border-bottom: 1px solid #E9E9E9;}

.izl-rmenu .btn-qq{ background: #fff url(img/ico_k2.png) center 20px no-repeat;  background-size: 25px; display:block;width:80px;height:30px; text-align:center; font-size: 14px; padding-top: 50px;}
.izl-rmenu .btn-qq:hover{background-color:#eee;}
.izl-rmenu a.btn-qq,.izl-rmenu a.btn-qq:visited{ background: #fff url(img/ico_k3.png) center 20px no-repeat;  background-size: 25px; text-decoration:none; display:block;}


.izl-rmenu .btn-wx{ background: #fff url(img/ico_k1.png) center 20px no-repeat; background-size: 20px; display:block;width:80px;height:30px; text-align:center; font-size: 14px; padding-top: 50px; border-bottom: 1px solid #E9E9E9;}
.izl-rmenu .btn-wx:hover{background-color:#eee;}
.izl-rmenu .btn-wx .pic{position:absolute; left:-112px; top:0px; display:none;}


.izl-rmenu .btn-phone{ background: #fff url(img/ico_k2.png) center 20px no-repeat; background-size: 25px;display:block;width:80px;height:30px; text-align:center; font-size: 14px; padding-top: 50px;}
.izl-rmenu .btn-phone:hover{background-color:#eee;}

.izl-rmenu .btn-phone .phone{ background: #eee; position:absolute; width:160px; left:-160px; top:0px; height: 81px; line-height: 26px; font-size:18px; text-align:center; display:none;}
.izl-rmenu .btn-phone a{ color: #fff; font-weight:bold;}
.izl-rmenu .btn-top{ background: #fff url(img/ico_k4.png) center 20px no-repeat; display:none; background-size: 25px; }
.izl-rmenu .btn-top:hover{background-color:#eee;}



.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(232, 98, 86, 0.8) url(img/ico_20.png) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* 如果用户继续向下滚动,这个按钮的透明度会变得更低 */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: #e86256;
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 60px;
    width: 60px;
    right: 30px;
    bottom: 30px;
  }
}