.index-banner {
  width: 100%;
  height: 540px;
}

.index-banner .swiper-container {
  width: 100%;
  height: 100%;
}

.swiper-banner-next,
.swiper-banner-prev {
  width: 40px;
  height: 40px;
}

.swiper-banner-next {
  background: url('../images/index/banner-next.png') center center no-repeat;
}

.swiper-banner-prev {
  background: url('../images/index/banner-prev.png') center center no-repeat;
}

.swiper-banner-next:hover,
.swiper-banner-prev:hover {
  background-color: #d8a451;
}

.index-banner .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.swiper-container-horizontal>.swiper-pagination-ban.swiper-pagination-bullets {
  bottom: 26px;
  text-align: left;
  padding-left: 20%;
}

.swiper-pagination-ban .swiper-pagination-bullet {
  opacity: 0.4;
  background: #fff;
}

.swiper-pagination-ban .swiper-pagination-bullet-active,
.swiper-pagination-case .swiper-pagination-bullet-active {
  opacity: 1;
  background: #fff;
}

.index-style {
  width: 100%;
}

.index-style:after {
  content: '';
  display: block;
  clear: both;
}

.index-h2 {
  width: 100%;
  text-align: center;
}

.index-con1 {
  max-width: 1240px;
  margin: 70px auto 0;
}

.index-tabs {
  width: 100%;
  float: left;
  text-align: center;
  margin: 20px 0 36px;
}

.index-tabs li {
  display: inline-block;
  margin: 0 50px;
  padding-bottom: 30px;
}

.index-tabs li a {
  color: #000;
  text-decoration: none;
}

.index-tabs li.active {
  background: url(../images/index/pro-tab-active.png) center bottom no-repeat;
}

.index-tabs li.active a {
  color: #d8a451;
  font-size: 14px;
}

.index-swiper {
  width: 100%;
  height: 280px;
}

.banner-01 {
  background: url(../images/index/index_banner01.jpg) 0 0 no-repeat !important;
  background-size: cover;
}

.banner-01-b {
  background: url(../images/index/index_banner01_b.jpg) 0 0 no-repeat !important;
  background-size: cover;
}

.banner-02 {
  background: url(../images/index/index_banner02.jpg) 0 0 no-repeat !important;
  background-size: cover;
}

.banner-03 {
  background: url(../images/index/index_banner03.jpg) 0 0 no-repeat !important;
  background-size: cover;
}

.tab-content {
  width: 100%;
  float: left;
  max-width: 1140px;
  margin-left: 50px;
  margin-top: 36px;
}

.swiper-pro-prev,
.swiper-pro-next {
  width: 40px;
  height: 40px;
  outline: none;
}

.swiper-pro-prev {
  background: url(../images/index/pro-prev.png) center center no-repeat;
  left: -50px !important;
}

.swiper-pro-prev:hover {
  background: url(../images/index/pro-prev-hover.png) center center no-repeat #d9a552;
}

.swiper-pro-next {
  background: url(../images/index/pro-next.png) center center no-repeat;
  right: -50px !important;
}

.swiper-pro-next:hover {
  background: url(../images/index/pro-next-hover.png) center center no-repeat #d9a552;
}

.tab-index1 .swiper-wrapper {
  /* width: 100%;
  max-width: 1140px;
  display: inline-block;
  overflow: hidden; */
}

.tab-index1 .swiper-slide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.tab-index1 .tab-pane {
  position: relative;
}

.index-swiper-2 .pro-slide {
  width: 33.33333%;
}

.pro-con-title {
  width: 100%;
  float: left;
  background: #F2EEE5;
  height: 80px;
  text-align: center;
  -webkit-transition: all ease 0.3s;
  transition: all ease 0.3s;
}

.pro-slide-con:hover .pro-con-title {
  background: #d8a451;
  height: 120px;
}

.pro-slide-con:hover .pro-con-title span {
  color: #fff;
}

.pro-con-img {
  width: 100%;
}

.pro-con-title h2 {
  color: #333;
  line-height: 80px;
  font-size: 18px;
}

.pro-slide-con:hover .pro-con-title h2 {
  color: #fff;
}

.pro-link-icon {
  width: 24px;
  height: 24px;
  display: none;
  margin-top: 3px;
  background: url('../images/index/goin.png') 0 0 no-repeat;
}

.pro-slide-con:hover .pro-link-icon {
  display: inline-block;
}

.pro-con-title span {
  width: 100%;
  display: inline-block;
  color: #999;
  font-size: 12px;
  line-height: 20px;
}

.index-introduce {
  width: 100%;
  float: left;
}

.introduce-box {
  width: 100%;
  float: left;
}

.introduce-con {
  max-width: 1140px;
  margin: 0 auto;
  text-align: center;
}

.con-h2 {
  width: 100%;
  margin-top: 70px;
  float: left;
  font-size: 28px;
  color: #333;
  text-align: center;
}

.con-h2-zh {
  width: 100%;
  float: left;
  font-size: 28px;
  line-height: 32px;
  color: #333;
}

.con-h2-en {
  width: 100%;
  float: left;
  font-size: 14px;
  min-height: 24px;
  line-height: 24px;
  color: #999;
}

.introduce-desc {
  width: 100%;
  float: left;
  margin: 40px 0 30px;
  line-height: 24px;
}

.introduce-data {
  width: 100%;
  float: left;
  text-align: center;
  position: relative;
  z-index: 2;
}

.introduce-data li {
  width: 33.33333%;
  height: 160px;
  float: left;
  background: #fce6e9;
  vertical-align: middle;
  position: relative;
}

@font-face {
  font-family: 'DIN_Bold';
  src: url('../font/DIN_Bold.ttf') format('truetype');
}

.introduce-counter {
  font-family: 'DIN_Bold';
  width: 100%;
  text-align: center;
  vertical-align: middle;
  display: inline-block;
  font-size: 70px;
  color: #d8a451;
}

.introduce-span {
  width: 100%;
  display: inline-block;
  color: #999;
}

.introduce-line {
  width: 1px;
  position: absolute;
  right: 0px;
  top: 50px;
  height: 60px;
  background: #ccc;
}

.introduce-bg {
  width: 100%;
  position: relative;
  margin-top: -80px;
  float: left;
  z-index: 1;
  overflow: hidden;
}

.introduce-bg-pic {
  height: 500px;
  background: url('../images/index/introduce-bg.jpg') 0 0 no-repeat;
  background-size: cover;
  -webkit-transition: all ease 0.3s;
  transition: all ease 0.3s;
}

.introduce-bg:hover .introduce-bg-pic {
  transform: scale(1.04);
  -webkit-transform: scale(1.04);
}

.introduce-bg:after {
  content: '';
  display: block;
  clear: both;
}

.introduce-bg-txt {
  width: 100%;
  text-align: center;
  font-size: 24px;
  color: #fff;
  height: 40px;
  line-height: 40px;
  margin-bottom: 28px;
  position: absolute;
  top: 50%;
  margin-top: -20px;
}

.icon-in {
  width: 41px;
  height: 41px;
  background: url(../images/index/icon-in.png) 0 0 no-repeat;
  display: inline-block;
  margin-top: 28px;
}

.icon-in:hover {
  background: url(../images/index/icon-in-hover.png) 0 0 no-repeat;
}

.index-case {
  width: 100%;
  float: left;
  background: #f2f2f2;
}

.case-box {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
}

.case-con {
  width: 100%;
  margin-top: 68px;
  float: left;
  margin-bottom: 100px;
}

.case-con .swiper-container {
  width: 100%;
  height: 100%;
}

.slide-case {
  display: flex;
  display: -webkit-flex;
  display: -o-flex;
  display: -moz-flex;
  display: -ms-flex;
  align-items: stretch;
}

.case-con-l {
  width: 70%;
  float: left;
}

.case-con-r {
  width: 48%;
  height: 400px;
  float: right;
  box-sizing: border-box;
  padding-left: 50px;
  position: relative;
}

.case-con-line {
  width: 72px;
  height: 4px;
  background: #000;
  position: absolute;
  z-index: 12;
  left: 0;
  top: 68px;
  margin-left: -85px;
}

.swiper-container-horizontal>.swiper-pagination-case.swiper-pagination-bullets {
  left: 30px;
  bottom: 26px;
}

.swiper-container-horizontal>.swiper-pagination-case.swiper-pagination {
  text-align: left;
}

.case-h3 {
  width: 100%;
  float: left;
  position: relative;
}

.case-h3-zh {
  width: 100%;
  float: left;
  font-size: 18px;
  color: #333;
  margin: 58px 0 8px;
}

.case-h3-en {
  width: 100%;
  float: left;
  font-size: 14px;
  color: #999;
}

.case-p {
  width: 90%;
  float: left;
  margin-top: 36px;
  font-size: 12px;
  line-height: 24px;
  color: #666;
}

.case-more {
  width: 140px;
  height: 40px;
  display: inline-block;
  background: #d8a451;
  text-align: center;
  line-height: 40px;
  color: #fff;
  position: absolute;
  left: 50px;
  bottom: 0;
}

.case-con-b {
  width: 100%;
}

a.case-more {
  text-decoration: none;
}

a.case-more:hover {
  color: #fff;
  background: #d79e43;
}

.index-news {
  width: 100%;
  float: left;
  margin-bottom: 70px;
}

.news-box {
  max-width: 1140px;
  margin: 0 auto;
}

.news-con {
  width: 100%;
  float: left;
}

.news-tab-content {
  width: 100%;
  height: 588px;
  background: url(../images/index/news-bg.png) right bottom no-repeat;
  background-size: contain;
}

.news-tabs {
  width: 100%;
  float: left;
  margin-top: 50px;
  position: relative;
}

.news-tabs-ul {
  width: 440px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.news-tabs-ul li {
  width: 100%;
  height: 80px;
  background: #000;
  position: relative;
}

.news-tabs-ul li a {
  width: 100%;
  height: 100%;
  display: inline-block;
  text-decoration: none !important;
}

.news-tabs-ul li.active {
  background: #d8a451;
  width: 110%;
}

.news-link {
  width: 18px;
  height: 18px;
  padding: 10px;
  display: none;
  background: url('../images/index/pro-next-hover.png') center center no-repeat;
}

.news-tabs-ul li.active .news-link {
  display: inline-block;
  position: absolute;
  right: 30px;
  top: 26px;
}

.news-datetime {
  margin-top: 100px;
  float: left;
  margin-left: -50px;
}

.news-date {
  width: 100%;
  display: inline-block;
  font-size: 24px;
  color: #333;
}

.news-year {
  width: 100%;
  display: inline-block;
  font-size: 12px;
  color: #ccc;
}

.news-li-datatime {
  width: 102px;
  padding-left: 28px;
  margin-top: 16px;
  float: left;
  height: 40px;
  border-right: 1px solid #999;
}

.news-li-date {
  width: 100%;
  float: left;
  font-size: 16px;
  line-height: 24px;
  color: #fff;
}

.news-li-year {
  width: 100%;
  float: left;
  font-size: 12px;
  line-height: 22px;
  color: #999;
}

.mews-title {
  width: 258px;
  margin-left: 35px;
  margin-top: 8px;
  float: left;
}

.news-title-main {
  width: 100%;
  float: left;
  display: inline-block;
  height: 32px;
  line-height: 32px;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  color: #fff;
}

.news-title-desc {
  width: 100%;
  float: left;
  display: inline-block;
  height: 24px;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
  font-style: normal;
  color: #999;
}

.news-tabs-ul li.active .mews-title-main {
  color: #fff;
  opacity: 0.2;
}

.news-tabs-ul li.active .news-title-desc,
.news-tabs-ul li.active .news-li-year {
  color: #fff;
  opacity: 0.6;
}