/*
* @Author: jason
* @Date:   2016-06-18 16:06:34
* @Last Modified by:   jason
* @Last Modified time: 2016-06-22 18:38:27
*/
@charset "utf-8";

/* mod-slide */
.mod-slide,
.mod-slide .bd,
.mod-slide .bd li,
.mod-slide .bd li a {
  width: 100%;
  height: 400px;
  overflow: hidden;
}
.mod-slide {
  position: relative;
  z-index: 1;
}
.mod-slide .w {
  position: relative;
  z-index: 2;
}
.mod-slide .prev,
.mod-slide .next {
  position: absolute;
  top: 175px;
  z-index: 3;
  width: 50px;
  height: 50px;
  background: url(../Images/icon_slide.png) no-repeat;
  -webkit-border-radius: 50px;
          border-radius: 50px;
}
.mod-slide .prev {
  left: -50px;
  background-position: left top;
}
.mod-slide .next {
  right: -50px;
  background-position: right bottom;
}
.mod-slide .prev:hover,
.mod-slide .next:hover {
  background-color: #7f7f7f;
  background-color: rgba(0,0,0,.5);
}
.mod-slide .prev:hover { background-position: right top; }
.mod-slide .next:hover { background-position: left bottom; }
.mod-slide .hd {
  position: absolute;
  bottom: 30px;
  left: 0;
  z-index: 3;
  width: 100%;
  height: 14px;
  text-align: center;
}
.mod-slide .hd span {
  display: inline-block;
  width: 14px;
  height: 14px;
  overflow: hidden;
  margin: 0 3px;
  cursor: pointer;
  background: #fff;
  -webkit-border-radius: 100%;
          border-radius: 100%;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.mod-slide .hd span.on { background: #009bef; }
.mod-slide .bd {
  position: absolute;
  top: 0;
  left: 0;
}
.mod-slide .bd li {
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
}
.mod-slide .bd li a {
  display: block;
  height: 100%;
}

/* mod-fixnav */
.mod-fixnav {
  width: 100%;
  height: 40px;
  overflow: hidden;
  background: #009bef;
}
.mod-fixnav li {
  float: left;
  width: 235px;
  height: 40px;
  font-size: 14px;
  line-height: 40px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  border-right: 1px solid #009bef;
  background: #0081d4;
}
.mod-fixnav li.last {
  width: 236px;
  border: none;
}

/* mod-main */
.mod-main01 { padding: 30px 0; }
.mod-main01 .hd {
  padding-bottom: 28px;
  text-align: center;
}
.mod-main01 .hd h3,
.mod-main02 .hd h3 {
  font-size: 36px;
  line-height: 56px;
}
.mod-main01 .hd p,
.mod-main02 .hd p { font-size: 14px; }
.mod-main01 .bd,
.mod-main02 .bd { overflow: hidden; }
.mod-main01 .bd .inner,
.mod-main02 .bd .inner { width: 1200px; }

.mod-main02 .hd{
  position: relative;
  height: 200px;
  overflow: hidden;
  padding-top: 70px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center;
}
.mod-main02 .hd h3,
.mod-main02 .hd p { color: #fff; }
.mod-main02 .hd .tab {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px;
  text-align: center;
}
.mod-main02 .hd span {
  height: 40px;
  padding: 0 30px;
  margin-left: 1px;
  font-size: 14px;
  line-height: 40px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  background: #009bef;
}
.mod-main02 .hd span.on {
  color: #005bac;
  background: #fff;
}
.mod-main02 .bd {
  overflow: hidden;
  padding-top: 40px;
  padding-bottom: 30px;
}

/* mod-bg */
.mod-bg { background: #f8f8f8; }

/* mod-product */
.mod-product .wrap {
  height: 610px;
  overflow: hidden;
}
.mod-product .icons {
  height: 35px;
  overflow: hidden;
  padding-top: 10px;
  padding-bottom: 20px;
  text-align: center;
}
.mod-product .icons a {
  display: inline-block;
  width: 33px;
  height: 33px;
  margin: 0 3px;
  vertical-align: middle;
  border: 1px solid #bdbdbd;
  background: url(../Images/icon_product_slide.png) no-repeat;
  border-radius: 33px;
}
.mod-product .icons a:hover { border-color: #609ed6; }
.mod-product .icons a.next { background-position: right bottom; }
.mod-product .icons a.prev:hover { background-position: right top; }
.mod-product .icons a.next:hover { background-position: left bottom; }
.mod-product .icons span {
  display: inline-block;
  width: 11px;
  height: 11px;
  overflow: hidden;
  margin: 0 3px;
  vertical-align: middle;
  cursor: pointer;
  border-radius: 11px;
  background: #d3d3d3;
}
.mod-product .icons span.on { background: #609ed6; }

/* mod-news */
.mod-news .hd { background-image: url(../Images/bg_news_hd.jpg); }

/* mod-case */
.mod-case .hd { background-image: url(../Images/bg_case_hd.jpg); }

/* mod-service */
.mod-service .hd { background-image: url(../Images/bg_service_hd.jpg); }

/* product-list */
.product-list li,
.product-list li .box,
.product-list li img,
.product-list li .hover {
  width: 380px;
  height: 285px;
}
.product-list li {
  float: left;
  padding-right: 20px;
  padding-bottom: 20px;
}
.product-list li .box {
  position: relative;
  overflow: hidden;
}
.product-list li img,
.product-list li .title,
.product-list li .hover {
  position: absolute;
  left: 0;
}
.product-list li img {
  top: 0;
  z-index: 1;
}
.product-list li .title {
  top: 235px;
  z-index: 2;
  width: 100%;
  height: 50px;
  overflow: hidden;
  font-size: 14px;
  line-height: 50px;
  background: url(../Images/bg_product.png) no-repeat;
  filter: alpha(opacity=100);
  opacity: 1;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.product-list li .title a { color: #fff; }
.product-list li .title p {
  padding-left: 10px;
  padding-right: 35px;
}
.product-list li .hover {
  top: 100%;
  z-index: 2;
  font-size: 14px;
  color: #fff;
  background: url(../Images/bg_product_hover.png) no-repeat;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.product-list li .hover .padding { padding: 60px 50px 50px; }
.product-list li .hover h4 {
  height: 30px;
  overflow: hidden;
  font-size: 18px;
  line-height: 30px;
  text-align: center;
}
.product-list li .hover h4 a { color: #fff; }
.product-list li .hover h4 a:hover { color:#fffc00; }
.product-list li .hover p {
  height: 72px;
  overflow: hidden;
  margin-top: 8px;
  line-height: 24px;
}
.product-list li .hover .detail {
  display: block;
  width: 88px;
  height: 28px;
  margin: 30px auto;
  line-height: 28px;
  color: #fff;
  text-align: center;
  border: 1px solid #eee;
}
.product-list li .hover .detail:hover {
  color: #333;
  border-color: #fffc00;
  background: #fffc00;
}
.product-list li:hover .title {
  top: -50px;
  filter: alpha(opacity=0);
  opacity: 0;
}
.product-list li:hover .hover { top: 0; }

/* solutions-list */
.solutions-list { text-align: center; }
.solutions-list .item {
  display: inline-block;
  width: 280px;
  height: 190px;
  overflow: hidden;
  margin-right: 20px;
  margin-bottom: 20px;
  cursor: pointer;
}
.solutions-list .item .image {
  display: block;
  height: 160px;
  overflow: hidden;
  background: #009bef;
}
.solutions-list .item .image td {
  width: 280px;
  height: 160px;
  text-align: center;
  vertical-align: middle;
}
.solutions-list .item .image img {
  max-width: 100%;
  max-height: 100%;
}
.solutions-list .item .title {
  display: block;
  height: 1em;
  overflow: hidden;
  margin-top: 15px;
  font-size: 14px;
  line-height: 1;
}
.solutions-list .item:hover .image { background: #1fb9ef; }

/* news-list */
.news-list li {
  float: left;
  width: 372px;
  padding-right: 28px;
  padding-bottom: 15px;
}
.news-list li .date {
  float: left;
  width: 46px;
  height: 46px;
  overflow: hidden;
  padding: 2px;
  font-family: Arial;
  color: #666;
  text-align: center;
  background: url(../Images/bg_news.png) no-repeat;
}
.news-list li .date strong {
  display: block;
  margin-top: 5px;
  font-size: 24px;
}
.news-list li .date span {
  display: block;
  height: 15px;
  line-height: 15px;
}
.news-list li dl { margin-left: 60px; }
.news-list li dt {
  height: 23px;
  overflow: hidden;
  margin-bottom: 5px;
  font-size: 14px;
}
.news-list li dd {
  height: 60px;
  overflow: hidden;
  line-height: 20px;
}
.news-list li dd,
.news-list li dd a { color: #666; }
.news-list li dd a:hover { color: #609ed6; }

/* case-list */
.case-list li {
  float: left;
  width: 220px;
  padding-right: 20px;
  padding-bottom: 30px;
}
.case-list li a img {
  width: 218px;
  height: 88px;
  border: 1px solid #e5e5e5;
}
.case-list li a p {
  height: 1em;
  overflow: hidden;
  margin-top: 15px;
  font-size: 14px;
  line-height: 1;
  text-align: center;
}
.case-list li a:hover img { border-color: #009bef; }