@charset "utf-8";

/*-----------------------------------------------------------*/

/*copyright by 动力无限  www.btoe.cn*/

/*邮箱 btoe@btoe.cn*/

/*合作电话 400-0599-360*/

/*版权所有违者必究*/

/*-----------------------------------------------------------*/

/*Generated by wjdhcms 3.0 */

.dx {

  text-transform: uppercase;

}

.dh {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}

.clearboth::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

@keyframes huanying1 {

  0% {

    left: 0;

    opacity: 1;

  }

  100% {

    left: 15px;

    opacity: 0;

  }

}

@keyframes huanying2 {

  0% {

    opacity: 0;

    left: -10px;

  }

  100% {

    left: 0;

    opacity: 1;

  }

}

@keyframes jello {

  from,

  11.1%,

  to {

    -webkit-transform: none;

    -moz-transform: none;

    transform: none;

  }

  22.2% {

    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

    -moz-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg);

  }

  33.3% {

    -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    -moz-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg);

  }

  44.4% {

    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

    -moz-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg);

  }

  55.5% {

    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    -moz-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg);

  }

  66.6% {

    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    -moz-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg);

  }

  77.7% {

    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

    -moz-transform: skewX(0.390625deg) skewY(0.390625deg);

    transform: skewX(0.390625deg) skewY(0.390625deg);

  }

  88.8% {

    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    -moz-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

  }

}

body *:before,

body *:after {

  -webkit-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.fudongdiv {

  -webkit-transition: all 0.3s ease-out;

  transition: all 0.3s ease-out;

}

.sjcTop,

.sjcTop2,

.sjcBottom,

.sjcLeft,

.sjcRight,

.bg,

.leftWow,

.rightWow,

.bottomWow {

  -webkit-transition: all 0.8s ease-out;

  transition: all 0.8s ease-out;

}

@keyframes zyfd {

  0% {

    -webkit-transform: translateX(0);

    transform: translateX(0);

  }

  25% {

    -webkit-transform: translateX(5px);

    transform: translateX(5px);

  }

  50% {

    -webkit-transform: translateX(0);

    transform: translateX(0);

  }

  75% {

    -webkit-transform: translateX(-5px);

    transform: translateX(-5px);

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0);

  }

}

.banner {

  width: 100%;

  position: relative;

  z-index: 5;

}

.banner * {

  -webkit-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.banner .bannerSwiper {

  overflow: hidden;

}

.banner .bannerSwiper img {

  display: block;

  width: 100%;

  object-fit: cover;

}

.banner .banner-pagination {

  font-size: 0;

  position: absolute;

  width: auto;

  right: 50%;

  margin-right: -150px;

  bottom: 50px;

  z-index: 3;

  width: 300px;

  text-align: center;

}

.banner .banner-pagination span {

  display: inline-block;

  border: 1px #ffce21 solid;

  opacity: 1;

  padding: 2px;

  border-radius: 100%;

  background: #fff;

  width: auto;

  height: auto;

  margin: 0 10px !important;

  cursor: pointer;

  outline: none;

}

.banner .banner-pagination span:before {

  content: "";

  display: block;

  border-radius: 100%;

  background: #ffce21;

  width: 8px;

  height: 8px;

  opacity: 0;

  filter: alpha(opacity=0);

}

.banner .banner-pagination span.swiper-pagination-bullet-active:before {

  opacity: 1;

  filter: alpha(opacity=100);

}

.banner .banner-prev {

  position: absolute;

  z-index: 30;

  top: 50%;

  left: -45px;

  width: 40px;

  height: 58px;

  margin-top: -29px;

  text-indent: -9999px;

  background: url(../images/bl.png) 50% 50% no-repeat;

  transition: all 0.5s linear;

  cursor: pointer;

  outline: none;

}

.banner:hover .banner-prev {

  left: 3%;

}

.banner .banner-next {

  position: absolute;

  z-index: 30;

  top: 50%;

  right: -45px;

  width: 40px;

  height: 58px;

  margin-top: -29px;

  text-indent: -9999px;

  background: url(../images/br.png) 50% 50% no-repeat;

  transition: all 0.5s linear;

  cursor: pointer;

  outline: none;

}

.banner:hover .banner-next {

  right: 3%;

}

.banner .tel {

  position: absolute;

  right: 0;

  bottom: 0;

  z-index: 3;

  width: 363px;

  height: 152px;

  background-color: #111111;

  color: #ffce21;

  font-size: 30px;

  font-family: Arial;

  font-weight: bold;

  line-height: 42px;

  padding-left: 128px;

  padding-top: 28px;

  display: none;

}

.banner .tel:before {

  content: "";

  display: block;

  position: absolute;

  left: 54px;

  top: 31px;

  width: 48px;

  height: 48px;

  vertical-align: top;

  margin-right: 10px;

  -webkit-animation: msClock2 1.5s linear infinite;

  animation: msClock2 1.5s linear infinite;

  background: url(../images/tel.png) center center no-repeat;

}

.title {

  line-height: 1;

  text-align: center;

}

.title a {

  display: inline-block;

  vertical-align: top;

}

.title i {

  display: block;

  font-size: 46px;

  line-height: 36px;

  font-family: "Arial black";

}

.title i img {

  display: inline-block;

  vertical-align: top;

}

.title span {

  display: block;

  margin-top: 10px;

  font-size: 30px;

  font-weight: bold;

}

.titBox::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.titBox .title {

  float: left;

}

.titBox .more {

  float: right;

  margin-top: 18px;

  display: block;

  line-height: 38px;

  height: 40px;

  font-size: 40px;

  letter-spacing: 4px;

  font-size: 16px;

  position: relative;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.titBox .more:before {

  content: "";

  display: block;

  position: absolute;

  right: -310px;

  bottom: 0;

  width: 578px;

  height: 1px;

  background-color: #dddddd;

}

.titBox .more:after {

  content: "";

  display: inline-block;

  vertical-align: middle;

  position: relative;

  top: -1px;

  width: 10px;

  height: 10px;

  border: solid 2px #fff;

  box-shadow: 0 0 0 1px #ffce21;

  margin-left: 16px;

  border-radius: 100%;

  background: #ffce21;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.titBox .more:hover {

  color: #ffce21;

  -webkit-transform: translateX(4px);

  transform: translateX(4px);

}

.titBox .more:hover:after {

  animation: zyfd 1.5s linear infinite;

}

.product {

  padding-top: 88px;

  padding-bottom: 36px;

}

.product .proBox {

  position: relative;

  z-index: 1;

  margin-top: 42px;

}

.product .proNav {

  height: 88px;

  background-color: #eee;

  border-radius: 6px 6px 0px 0px;

}

.product .proNav::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.product .proNav ul {

  display: flex;

  justify-content: space-between;

}

.product .proNav ul li {

  float: left;

  flex: 1;

}

.product .proNav ul li a {

  display: block;

  height: 88px;

  line-height: 88px;

  font-size: 16px;

  font-weight: bold;

  text-align: center;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

  background-repeat: no-repeat;

  background-image: -webkit-linear-gradient(left, #ffce21, #ffce21);

  background-image: linear-gradient(to right, #ffce21, #ffce21);

  -webkit-transition: all 0.5s;

  transition: all 0.5s;

  background-size: 0% 100%;

  background-position: center center;

  color: #444444;

}

.product .proNav ul li:hover a,

.product .proNav ul li.on a {

  background-size: 100% 100%;

  color: #222222;

}

.product .hotTabs {

  height: 566px;

  background-color: #f9f9f9;

  position: relative;

  padding: 34px 45px 0 65px;

}

.product .hotTabs .tit {

  height: 68px;

  line-height: 45px;

  font-weight: bold;

  font-size: 27px;

  border-bottom: 2px solid #d5d5d5;

}

.product .hotTabs .tit:before {

  content: "";

  display: inline-block;

  margin-right: 18px;

  vertical-align: top;

  width: 34px;

  height: 45px;

  background: url(../images/tjico.png) 0 center no-repeat;

}

.product .hotTabs .bd {

  margin-top: 28px;

  margin-right: 70px;

}

.product .hotTabs .bd ul li {

  height: 396px;

}

.product .hotTabs .bd ul li::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.product .hotTabs .bd ul li .pic {

  float: left;

  display: block;

  width: 574px;

  height: 396px;

  background-color: #ffffff;

  border: solid 2px #ffffff;

  position: relative;

  overflow: hidden;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .hotTabs .bd ul li .pic i {

  display: block;

  width: 100%;

  height: 100%;

  position: relative;

  overflow: hidden;

}

.product .hotTabs .bd ul li .pic img {

  display: block;

  position: absolute;

  width: 100%;

  height: 100%;

  object-fit: contain;

  left: 0;

  right: 0;

  top: 0;

  bottom: 0;

  margin: auto;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .hotTabs .bd ul li .cont {

  float: right;

  position: relative;

  width: 470px;

  padding-top: 32px;

}

.product .hotTabs .bd ul li .cont .bt {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 24px;

  height: 44px;

  line-height: 44px;

  font-weight: bold;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .hotTabs .bd ul li .cont .bt:hover {

  -webkit-transform: translateX(5px);

  transform: translateX(5px);

}

.product .hotTabs .bd ul li .cont p {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 4;

  overflow: hidden;

  line-height: 46px;

  height: 184px;

  font-size: 18px;

  color: #666666;

  margin-top: 12px;

}

.product .hotTabs .bd ul li .cont .inBtn {

  margin-top: 30px;

  font-size: 0;

}

.product .hotTabs .bd ul li .cont .inBtn .zxLink {

  display: inline-block;

  vertical-align: top;

  width: 180px;

  height: 60px;

  background-color: #ffce21;

  text-align: center;

  line-height: 60px;

  font-size: 18px;

  color: #222222;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.product .hotTabs .bd ul li .cont .inBtn .zxLink:before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border: 2px solid #ffce21;

  z-index: -1;

  opacity: 0;

  -webkit-transform: scale3d(0.6, 0.6, 1);

  transform: scale3d(0.6, 0.6, 1);

  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;

  transition: transform 0.3s, opacity 0.3s;

  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);

  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);

  box-sizing: border-box;

}

.product .hotTabs .bd ul li .cont .inBtn .zxLink:hover {

  background: none;

  box-shadow: 0 10px 10px -5px rgba(255, 206, 33, 0.5);

}

.product .hotTabs .bd ul li .cont .inBtn .zxLink:hover:before {

  -webkit-transform: scale3d(1, 1, 1);

  transform: scale3d(1, 1, 1);

  opacity: 1;

}

.product .hotTabs .bd ul li .cont .inBtn .more {

  display: inline-block;

  vertical-align: top;

  margin-left: 78px;

  width: 180px;

  height: 60px;

  background-color: #ffffff;

  text-align: center;

  line-height: 60px;

  font-size: 18px;

  color: #222222;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.product .hotTabs .bd ul li .cont .inBtn .more:before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border: 2px solid #ffce21;

  z-index: -1;

  opacity: 0;

  -webkit-transform: scale3d(0.6, 0.6, 1);

  transform: scale3d(0.6, 0.6, 1);

  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;

  transition: transform 0.3s, opacity 0.3s;

  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);

  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);

  box-sizing: border-box;

}

.product .hotTabs .bd ul li .cont .inBtn .more:hover {

  background: none;

  box-shadow: 0 10px 10px -5px rgba(255, 206, 33, 0.5);

}

.product .hotTabs .bd ul li .cont .inBtn .more:hover:before {

  -webkit-transform: scale3d(1, 1, 1);

  transform: scale3d(1, 1, 1);

  opacity: 1;

}

.product .hotTabs .bd ul li:hover .pic {

  border-color: #ffce21;

}

.product .hotTabs .bd ul li:hover .pic img {

  -webkit-transform: scale(1.1) rotate(0);

  -moz-transform: scale(1.1) rotate(0);

  -o-transform: scale(1.1) rotate(0);

  transform: scale(1.1) rotate(0);

}

.product .hotTabs .page {

  position: absolute;

  height: 25px;

  top: 40px;

  right: 50px;

  z-index: 2;

}

.product .hotTabs .page:before {

  content: "";

  display: block;

  position: absolute;

  left: 50%;

  top: 50%;

  margin-top: -12px;

  width: 1px;

  height: 24px;

  background-color: #d2d2d2;

}

.product .hotTabs .page .prev {

  float: left;

  width: 15px;

  height: 25px;

  cursor: pointer;

  background: url(../images/tjl.png) center center no-repeat;

  -webkit-transition: all 0.4s ease-out;

  transition: all 0.4s ease-out;

  filter: grayscale(100) brightness(0.5);

}

.product .hotTabs .page .prev:hover {

  filter: grayscale(0) brightness(1);

}

.product .hotTabs .page .next {

  margin-left: 72px;

  float: left;

  width: 15px;

  height: 25px;

  cursor: pointer;

  background: url(../images/tjr.png) center center no-repeat;

  -webkit-transition: all 0.4s ease-out;

  transition: all 0.4s ease-out;

  filter: grayscale(100) brightness(0.5);

}

.product .hotTabs .page .next:hover {

  filter: grayscale(0) brightness(1);

}

.product .proList ul {

  margin-right: -50px;

}

.product .proList ul::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.product .proList ul li {

  float: left;

  margin-top: 42px;

  margin-right: 50px;

  position: relative;

  width: 400px;

  top: 0;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .pic {

  display: block;

  width: 100%;

  height: 300px;

  border-radius: 6px 10px 10px 10px;

  position: relative;

  overflow: hidden;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .pic img {

  display: block;

  position: absolute;

  width: 100%;

  height: 100%;

  object-fit: contain;

  margin: auto;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .tt {

  position: relative;

  margin-right: 80px;

  height: 56px;

}

.product .proList ul li .tt:before {

  content: "";

  display: block;

  position: absolute;

  right: -20px;

  bottom: -5px;

  width: 10px;

  height: 10px;

  border: solid 1px #e5e5e5;

  border-radius: 100%;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .tt:after {

  content: "";

  display: block;

  position: absolute;

  right: -8px;

  bottom: -5px;

  width: 10px;

  height: 10px;

  border: solid 1px #e5e5e5;

  border-radius: 100%;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .tt .bt {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 15px;

  height: 56px;

  line-height: 56px;

  text-align: center;

  padding-left: 0;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .tt .bt:before {

  content: "";

  display: block;

  position: absolute;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 1px;

  background-color: #e5e5e5;

  background-repeat: no-repeat;

  background-image: -webkit-linear-gradient(left, #ffce21, #ffce21);

  background-image: linear-gradient(to right, #ffce21, #ffce21);

  -webkit-transition: all 0.5s;

  transition: all 0.5s;

  background-size: 0% 100%;

  background-position: left center;

}

.product .proList ul li .tt .bt:hover {

  padding-left: 5px;

}

.product .proList ul li .tt .more {

  display: block;

  position: absolute;

  right: -80px;

  top: 18px;

  width: 41px;

  height: 41px;

  background-color: #f9f9f9;

  border-radius: 100%;

  text-align: center;

  line-height: 40px;

  color: #999999;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.product .proList ul li .tt .more:before {

  content: ">";

  font-family: simsun;

  font-size: 22px;

}

.product .proList ul li:hover {

  top: -10px;

}

.product .proList ul li:hover .pic img {

  -webkit-transform: scale(1.08) rotate(0);

  -moz-transform: scale(1.08) rotate(0);

  -o-transform: scale(1.08) rotate(0);

  transform: scale(1.08) rotate(0);

}

.product .proList ul li:hover .tt:before {

  border-color: #ffce21;

}

.product .proList ul li:hover .tt:after {

  border-color: #ffce21;

}

.product .proList ul li:hover .tt .bt:before {

  background-size: 100% 100%;

}

.product .proList ul li:hover .tt .more {

  background-color: #ffce21;

  color: #222222;

  font-weight: bold;

}

.cooperation {

  padding: 46px 0 55px;

  background-repeat: no-repeat;

  background-image: -webkit-linear-gradient(top, #fff, #f7f7f7);

  background-image: linear-gradient(to bottom, #fff, #f7f7f7);

  background-position: center center;

  background-size: 100% 100%;

}

.cooperation * {

  -webkit-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.cooperation .title span {

  margin-top: 26px;

}

.cooperation .title span:before {

  content: "";

  display: inline-block;

  vertical-align: middle;

  width: 102px;

  height: 2px;

  background-color: #ffce21;

  margin-right: 28px;

}

.cooperation .title span:after {

  content: "";

  display: inline-block;

  vertical-align: middle;

  width: 102px;

  height: 2px;

  background-color: #ffce21;

  margin-left: 28px;

}

.cooperation .hzSwiper {

  margin: auto;

  margin-top: 52px;

  min-width: 1300px;

  position: relative;

  width: 86%;

}

.cooperation .hzSwiper ul li {

  padding: 20px 13px;

  width: 16.66%;

}

.cooperation .hzSwiper ul li a {

  display: block;

  background-color: #ffffff;

  padding: 10px;

  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.02);

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.cooperation .hzSwiper ul li a i {

  display: block;

  position: relative;

  width: 100%;

  padding-top: 48%;

  overflow: hidden;

}

.cooperation .hzSwiper ul li a i img {

  display: block;

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  margin: auto;

  max-width: 100%;

  max-height: 100%;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.cooperation .hzSwiper ul li a:hover {

  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08);

}

.cooperation .hzSwiper ul li a:hover i img {

  -webkit-transform: scale(1.1) rotate(0);

  -moz-transform: scale(1.1) rotate(0);

  -o-transform: scale(1.1) rotate(0);

  transform: scale(1.1) rotate(0);

}

.cooperation .hzSwiper .page .hz-prev {

  position: absolute;

  left: -44px;

  top: 50%;

  margin-top: -13px;

  width: 15px;

  height: 25px;

  cursor: pointer;

  background: url(../images/tjl.png) center center no-repeat;

  outline: none;

  -webkit-transition: all 0.4s ease-out;

  transition: all 0.4s ease-out;

  filter: grayscale(100) brightness(0.5);

}

.cooperation .hzSwiper .page .hz-prev:hover,

.cooperation .hzSwiper .page .hz-prev.on {

  filter: grayscale(0) brightness(1);

}

.cooperation .hzSwiper .page .hz-next {

  position: absolute;

  right: -44px;

  top: 50%;

  margin-top: -13px;

  width: 15px;

  height: 25px;

  cursor: pointer;

  background: url(../images/tjr.png) center center no-repeat;

  outline: none;

  -webkit-transition: all 0.4s ease-out;

  transition: all 0.4s ease-out;

  filter: grayscale(100) brightness(0.5);

}

.cooperation .hzSwiper .page .hz-next:hover,

.cooperation .hzSwiper .page .hz-next.on {

  filter: grayscale(0) brightness(1);

}

.youshi {

  background: url(../images/ysbg.jpg) center bottom no-repeat;

  padding-top: 56px;

}

.youshi .ysTit {

  text-align: center;

  line-height: 1;

}

.youshi .ysTit h3 {

  font-weight: bold;

  line-height: 1;

  font-size: 40px;

}

.youshi .ysTit h3 i {

  display: inline-block;

  vertical-align: bottom;

  width: 70px;

  height: 70px;

  line-height: 70px;

  background: url(../images/ystit4.png) center center no-repeat;

  background-color: #ffce21;

  border-radius: 100%;

  color: transparent;

}

.youshi .ysTit h3 span {

  display: inline-block;

  vertical-align: bottom;

  position: relative;

  top: -10px;

}

.youshi .ysTit h4 {

  font-size: 18px;

  letter-spacing: 4px;

  color: #444444;

  margin-top: 10px;

}

.youshi .ysTit h5 {

  margin-top: 14px;

  color: transparent;

}

.youshi .ysTit h5 img {

  display: inline-block;

  vertical-align: top;

  max-height: 9px;

}

.youshi .ysBox {

  margin-top: 40px;

}

.youshi .ysItem {

  margin-top: 39px;

}

.youshi .ysItem::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.youshi .ysItem:first-child {

  margin-top: 0;

}

.youshi .ysItem .pic {

  float: left;

  width: 695px;

  height: 380px;

  overflow: hidden;

}

.youshi .ysItem .pic img {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysItem .pic:hover img {

  -webkit-transform: scale(1.08) rotate(0);

  -moz-transform: scale(1.08) rotate(0);

  -o-transform: scale(1.08) rotate(0);

  transform: scale(1.08) rotate(0);

}

.youshi .ysItem .cont {

  float: right;

  width: 450px;

  margin-right: 50px;

  padding-top: 40px;

}

.youshi .ysItem .cont * {

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysItem .cont .num {

  font-family: "Times New Roman", Times, Baskerville, Georgia, serif;

  font-weight: bold;

  font-size: 72px;

  line-height: 50px;

  letter-spacing: 3px;

  color: #ffd029;

}

.youshi .ysItem .cont h4 {

  font-weight: bold;

  line-height: 1;

  margin-top: 20px;

  font-size: 24px;

}

.youshi .ysItem .cont .text {

  margin-top: 28px;

  line-height: 40px;

  font-size: 18px;

  color: #444444;

}

.youshi .ysItem .cont .text p {

  padding-left: 36px;

  background: url(../images/ystxtli.png) 0 10px no-repeat;

}

.youshi .ysItem .cont:hover .num {

  -webkit-transform: translateY(-10px);

  transform: translateY(-10px);

}

.youshi .ysItem .cont:hover h4 {

  -webkit-transform: translateY(-8px);

  transform: translateY(-8px);

}

.youshi .ysItem .cont:hover .text {

  -webkit-transform: translateY(-6px);

  transform: translateY(-6px);

}

.youshi .ysItem.ysItem1 .cont {

  padding-top: 70px;

}

.youshi .ysItem.ysItem2 .cont,

.youshi .ysItem.ysItem4 .cont {

  float: left;

  margin-left: 95px;

}

.youshi .ysItem.ysItem2 .pic,

.youshi .ysItem.ysItem4 .pic {

  float: right;

  height: 320px;

}

.youshi .ysPic {

  float: left;

  width: 696px;

  height: 380px;

  position: relative;

}

.youshi .ysPic .bd {

  overflow: hidden;

  width: 696px;

  height: 380px;

}

.youshi .ysPic .bd ul li {

  width: 696px;

  height: 380px;

  position: relative;

}

.youshi .ysPic .bd ul li img {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysPic .bd ul li:hover img {

  -webkit-transform: scale(1.08) rotate(0);

  -moz-transform: scale(1.08) rotate(0);

  -o-transform: scale(1.08) rotate(0);

  transform: scale(1.08) rotate(0);

}

.youshi .ysPic .hd {

  position: absolute;

  left: 0;

  bottom: 0;

  z-index: 2;

  width: 200px;

  height: 38px;

  background-color: rgba(0, 0, 0, 0.6);

  text-align: center;

  padding-top: 17px;

}

.youshi .ysPic .hd ul {

  font-size: 0;

}

.youshi .ysPic .hd ul li {

  display: inline-block;

  vertical-align: top;

  width: 7px;

  height: 7px;

  border: solid 1px #e5e5e5;

  border-radius: 100%;

  margin-right: 13px;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysPic .hd ul li:hover,

.youshi .ysPic .hd ul li.on {

  background-color: #ffce21;

  border-color: #ffce21;

}

.youshi .ysCont {

  position: absolute;

  right: 160px;

  top: 162px;

  width: 792px;

  height: 480px;

  background-color: #f1f1f1;

  padding: 72px 0 0 85px;

}

.youshi .ysCont .line {

  width: 6px;

  height: 28px;

  background-color: #c6a062;

  margin-top: 40px;

  margin-left: 4px;

}

.youshi .ysCont .bd {

  overflow: hidden;

  height: 290px;

  margin-top: 30px;

  width: 520px;

}

.youshi .ysCont .bd ul li .item {

  padding-top: 10px;

  position: relative;

}

.youshi .ysCont .bd ul li .item * {

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysCont .bd ul li .item .tit {

  font-size: 18px;

  font-weight: bold;

  line-height: 1;

}

.youshi .ysCont .bd ul li .item .text {

  margin-top: 14px;

  font-size: 14px;

  line-height: 25px;

  color: #666666;

}

.youshi .ysCont .bd ul li .item:hover .tit {

  -webkit-transform: translateY(-8px);

  transform: translateY(-8px);

  color: #ffce21;

}

.youshi .ysCont .bd ul li .item:hover .text {

  -webkit-transform: translateY(-5px);

  transform: translateY(-5px);

}

.youshi .ysCont .hd {

  width: 26px;

  line-height: 26px;

  position: absolute;

  top: 72px;

  right: 84px;

}

.youshi .ysCont .hd .next {

  color: #aaaaaa;

  font-size: 14px;

  text-transform: uppercase;

  writing-mode: vertical-rl;

  -webkit-writing-mode: vertical-rl;

  -ms-writing-mode: vertical-rl;

  writing-mode: tb-rl;

  margin-bottom: 25px;

  position: relative;

  cursor: pointer;

  -webkit-transition: all 0.35s ease-out;

  transition: all 0.35s ease-out;

}

.youshi .ysCont .hd .next:before {

  content: "";

  display: inline-block;

  width: 16px;

  height: 16px;

  border: solid 1px #aaaaaa;

  border-radius: 100%;

  margin-bottom: 100px;

  -webkit-transition: all 0.35s ease-out;

  transition: all 0.35s ease-out;

}

.youshi .ysCont .hd .next:after {

  content: "";

  display: block;

  position: absolute;

  top: 16px;

  left: 50%;

  margin-left: -0.5px;

  width: 1px;

  height: 89px;

  background-color: #aaaaaa;

  -webkit-transition: all 0.35s ease-out;

  transition: all 0.35s ease-out;

}

.youshi .ysCont .hd .next:hover {

  color: #ffce21;

}

.youshi .ysCont .hd .next:hover:before {

  border-color: #ffce21;

}

.youshi .ysCont .hd .next:hover:after {

  background-color: #ffce21;

}

.youshi .ysCont .hd ul li {

  width: 26px;

  height: 26px;

  border: solid 1px transparent;

  border-radius: 100%;

  position: relative;

  cursor: pointer;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysCont .hd ul li:before {

  content: "";

  display: block;

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  margin: auto;

  width: 4px;

  height: 4px;

  background-color: #c6a062;

  border-radius: 100%;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysCont .hd ul li.on {

  border-color: #ffce21;

}

.youshi .ysCont .hd ul li.on:before {

  background-color: #ffce21;

  opacity: 1;

}

.youshi .ysHd {

  float: right;

  width: 160px;

}

.youshi .ysHd ul li {

  width: 160px;

  height: 160px;

  background-color: #d3b06c;

  color: #ffffff;

  padding-top: 32px;

  background-repeat: no-repeat;

  background-image: -webkit-linear-gradient(left, #333333, #333333);

  background-image: linear-gradient(to right, #333333, #333333);

  -webkit-transition: all 0.5s;

  transition: all 0.5s;

  background-size: 100% 0%;

  background-position: left 0;

  text-align: center;

  margin-top: 1px;

  cursor: pointer;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysHd ul li:first-child {

  margin-top: 0;

}

.youshi .ysHd ul li:nth-child(2n) {

  background-color: #c6a062;

}

.youshi .ysHd ul li i {

  display: block;

  width: 56px;

  height: 56px;

  overflow: hidden;

  margin: auto;

}

.youshi .ysHd ul li i:before,

.youshi .ysHd ul li i:after {

  content: "";

  display: block;

  width: 100%;

  height: 100%;

  position: relative;

  top: 0;

  -webkit-transition: all 0.4s ease-out;

  transition: all 0.4s ease-out;

}

.youshi .ysHd ul li i.ico1:before {

  background: url(../images/ysico1.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico1:after {

  background: url(../images/ysico1h.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico2:before {

  background: url(../images/ysico2.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico2:after {

  background: url(../images/ysico2h.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico3:before {

  background: url(../images/ysico3.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico3:after {

  background: url(../images/ysico3h.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico4:before {

  background: url(../images/ysico4.png) center center no-repeat;

}

.youshi .ysHd ul li i.ico4:after {

  background: url(../images/ysico4h.png) center center no-repeat;

}

.youshi .ysHd ul li h4 {

  font-size: 18px;

  margin-top: 10px;

  line-height: 1;

}

.youshi .ysHd ul li h5 {

  font-size: 14px;

  line-height: 1;

  margin-top: 10px;

  color: #e1caa1;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.youshi .ysHd ul li:hover,

.youshi .ysHd ul li.on {

  background-size: 100% 100%;

  color: #ffce21;

}

.youshi .ysHd ul li:hover i,

.youshi .ysHd ul li.on i {

  border-color: #ffce21;

}

.youshi .ysHd ul li:hover i:before,

.youshi .ysHd ul li.on i:before,

.youshi .ysHd ul li:hover i:after,

.youshi .ysHd ul li.on i:after {

  top: -100%;

}

.youshi .ysHd ul li:hover h5,

.youshi .ysHd ul li.on h5 {

  color: #5e523f;

}

.youshi .ysTel {

  font-size: 16px;

  letter-spacing: 6px;

  line-height: 32px;

  position: absolute;

  right: 0;

  bottom: 32px;

}

.youshi .ysTel:before {

  content: "";

  display: inline-block;

  width: 32px;

  height: 32px;

  vertical-align: top;

  margin-right: 10px;

  -webkit-animation: msClock2 1.5s linear infinite;

  animation: msClock2 1.5s linear infinite;

  background: url(../images/ystel.png) center center no-repeat;

}

.youshi .ysTel i {

  font-weight: bold;

  font-size: 24px;

  display: inline-block;

  vertical-align: top;

  letter-spacing: 0px;

}

.youshi .ysEn {

  position: absolute;

  right: -248px;

  top: 0;

  font-family: "Times New Roman", Times, Baskerville, Georgia, serif;

  font-size: 112px;

  writing-mode: vertical-rl;

  -webkit-writing-mode: vertical-rl;

  -ms-writing-mode: vertical-rl;

  writing-mode: tb-rl;

  text-transform: uppercase;

  line-height: 80px;

  letter-spacing: 20px;

  color: #333333;

  opacity: 0.05;

}

.case {

  padding: 70px 0;

  position: relative;

  z-index: 1;

}

.case .caseBox {

  margin-top: 22px;

  margin-top: 40px;

}

.case .caseBox .hd {

  float: left;

  width: 500px;

  height: 486px;

  background-color: #ffffff;

  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);

}

.case .caseBox .hd ul {

  margin: 0 -1px;

}

.case .caseBox .hd ul::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.case .caseBox .hd ul li {

  border: 1px solid #fff;

  width: 250px;

  height: 122px;

  float: left; background:#f9f9f9;

}

.case .caseBox .hd ul li a {

  display: block;

  margin: -1px;

  position: relative;

  z-index: 2;

  width: 250px;

  height: 122px;

  padding: 26px 10px 0 110px;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .hd ul li a i {

  display: block;

  width: 60px;

  height: 60px;

  background-color: #ffffff;

  border: solid 1px #eeeeee;

  border-radius: 100%;

  position: absolute;

  top: 30px;

  left: 30px;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .hd ul li a i img {

  display: block;

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  margin: auto;

  max-height: 36px;

  max-width: 36px;

  -webkit-transition: all 0.3s ease-out;

  transition: all 0.3s ease-out;

}

.case .caseBox .hd ul li a span {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 18px;

  height: 38px;

  line-height: 38px;

  color: #444444;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .hd ul li a em {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 15px;

  color: #999999;

  line-height: 26px;

  margin-top: 0;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .hd ul li:hover a,

.case .caseBox .hd ul li.on a {

  background-color: #ffce21;

}

.case .caseBox .hd ul li:hover a i,

.case .caseBox .hd ul li.on a i {

  background-color: #222222;

  border-color: #222222;

}

.case .caseBox .hd ul li:hover a i img,

.case .caseBox .hd ul li.on a i img {

  filter: grayscale(100) brightness(4);

}

.case .caseBox .hd ul li:hover a span,

.case .caseBox .hd ul li.on a span {

  color: #222222;

}

.case .caseBox .hd ul li:hover a em,

.case .caseBox .hd ul li.on a em {

  margin-top: 6px;

  color: #444444;

}

.case .caseBox .bd {

  float: right;

  width: 800px;

  height: 486px;

  background-color: #f5f5f5;

  overflow: hidden;

}

.case .caseBox .bd ul li {

  height: 486px;

  position: relative;

}

.case .caseBox .bd ul li .pic {

  display: block;

  width: 100%;

  height: 100%;

  position: relative;

  overflow: hidden;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .bd ul li .pic img {

  display: block;

  position: absolute;

  width: 100%;

  height: 100%;

  object-fit: cover;

  left: 0;

  right: 0;

  top: 0;

  /* top: -249px; */

  bottom: 0;

  margin: auto;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .bd ul li .cont {

  position: absolute;

  width: 100%;

  height: 126px;

  left: 0;

  bottom: 0;

  background-color: rgba(255, 255, 255, 0.95);

  padding: 24px 50px 0;

  display: none;

}

.case .caseBox .bd ul li .cont .bt {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 18px;

  height: 38px;

  line-height: 38px;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.case .caseBox .bd ul li .cont .bt:hover {

  -webkit-transform: translateX(5px);

  transform: translateX(5px);

}

.case .caseBox .bd ul li .cont p {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  color: #666666;

  font-size: 14px;

  line-height: 24px;

  margin-top: 4px;

}

.case .caseBox .bd ul li:hover .pic img {

  -webkit-transform: scale(1.06) rotate(0);

  -moz-transform: scale(1.06) rotate(0);

  -o-transform: scale(1.06) rotate(0);

  transform: scale(1.06) rotate(0);

}

.case .caseBox .bd ul li:hover .cont .bt {

  color: #000;

}

.about .aboutBox {

  height: 650px;

}

.about .aboutPic {

  width: 960px;

  height: 650px;

  margin-left: -310px;

}

.about .aboutPic .pic {

  width: 960px;

  height: 650px;

  overflow: hidden;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.about .aboutPic .pic img {

  display: block;

  width: 960px;

  height: 650px;

  object-fit: cover;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.about .aboutPic .pic iframe {

  width: 100% !important;

  height: 100% !important;

}

.about .aboutPic .pic:hover {

  box-shadow: 0 10px 15px -5px rgba(255, 206, 33, 0.5);

}

.about .aboutPic .pic:hover img {

  -webkit-transform: scale(1.06) rotate(0);

  -moz-transform: scale(1.06) rotate(0);

  -o-transform: scale(1.06) rotate(0);

  transform: scale(1.06) rotate(0);

}

.about .title {

  position: absolute;

  right: 0;

  top: 0;

  text-align: right;

}

.about .title span {

  margin-top: 18px;

  position: relative;

}

.about .title span:after {

  content: "";

  display: block;

  position: absolute;

  top: 50%;

  left: 100%;

  margin-left: 30px;

  width: 280px;

  height: 2px;

  background-color: #ffce21;

}

.about .aboutText {

  width: 745px;

  height: 500px;

  background-color: #ffce21;

  position: absolute;

  z-index: 2;

  top: 116px;

  right: 0;

  text-align: right;

  padding: 68px 72px 0 60px;

}

.about .aboutText .tit {

  position: relative;

  z-index: 3;

}

.about .aboutText .tit span {

  display: block;

  font-weight: bold;

  font-size: 30px;

  line-height: 1;

}

.about .aboutText .tit i {

  display: block;

  font-family: Arial;

  font-size: 14px;

  margin-top: 20px;

  line-height: 12px;

  letter-spacing: 3px;

  color: #333333;

  margin-right: -3px;

}

.about .aboutText .tit em {

  display: block;

  margin-top: 25px;

  font-size: 0;

}

.about .aboutText .tit em:before {

  content: "";

  display: inline-block;

  vertical-align: top;

  width: 355px;

  height: 2px;

  background-color: #ffffff;

  opacity: 0.3;

}

.about .aboutText .text {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 4;

  overflow: hidden;

  line-height: 36px;

  height: 144px;

  margin-top: 40px;

  font-size: 18px;

  color: #333333;

  position: relative;

  z-index: 3;

}

.about .aboutText .more {

  margin-top: 46px;

  display: block;

  float: right;

  width: 80px;

  height: 30px;

  background-color: #ffffff;

  position: relative;

  line-height: 30px;

  font-family: Arial;

  font-size: 18px;

  color: #333333;

  text-align: center;

  text-transform: uppercase;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

  overflow: hidden;

  z-index: 3;

}

.about .aboutText .more:before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border: 2px solid #222;

  z-index: -1;

  opacity: 0;

  -webkit-transform: scale3d(0.6, 0.6, 1);

  transform: scale3d(0.6, 0.6, 1);

  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;

  transition: transform 0.3s, opacity 0.3s;

  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);

  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);

  box-sizing: border-box;

}

.about .aboutText .more:hover {

  background: none;

  box-shadow: 0 10px 10px -5px rgba(34, 34, 34, 0.5);

}

.about .aboutText .more:hover:before {

  -webkit-transform: scale3d(1, 1, 1);

  transform: scale3d(1, 1, 1);

  opacity: 1;

}

.about .aboutText .aboutimg {

  display: block;

  width: 453px;

  height: 319px;

  position: absolute;

  bottom: -35px;

  right: -271px;

  background: url(../images/aboutimg.png) 0 center no-repeat;

}

.about .aLink a {

  width: 198px;

  height: 198px;

  background-color: #333333;

  display: block;

  text-align: center;

  padding-top: 56px;

  position: absolute;

  color: #fff;

  background-repeat: no-repeat;

  background-image: -webkit-linear-gradient(0deg, #cf9d64 0%, #e5ca84 100%);

  background-image: linear-gradient(0deg, #cf9d64 0%, #e5ca84 100%);

  -webkit-transition: all 0.5s;

  transition: all 0.5s;

  background-size: 100% 0%;

  background-position: left 0;

}

.about .aLink a i {

  display: block;

  width: 50px;

  height: 50px;

  margin: auto;

}

.about .aLink a i.ico1 {

  background: url(../images/alinkico1.png) center center no-repeat;

}

.about .aLink a i.ico2 {

  background: url(../images/alinkico2.png) center center no-repeat;

}

.about .aLink a span {

  display: block;

  font-size: 18px;

  margin-top: 15px;

  line-height: 1;

}

.about .aLink a:hover {

  background-size: 100% 100%;

  box-shadow: 0 10px 10px -5px rgba(255, 206, 33, 0.5);

}

.about .aLink a:hover i {

  -webkit-animation: hvr-icon-wobble-vertical 1s;

  -moz-animation: hvr-icon-wobble-vertical 1s;

  animation: hvr-icon-wobble-vertical 1s;

}

.about .aLink a.a1 {

  left: 646px;

  top: 569px;

}

.about .aLink a.a2 {

  left: 844px;

  top: 371px;

  background-color: #c6a062;

}

.about .tel {

  font-size: 16px;

  letter-spacing: 6px;

  line-height: 32px;

  position: absolute;

  z-index: 2;

  left: 92px;

  bottom: 54px;

}

.about .tel:before {

  content: "";

  display: inline-block;

  width: 32px;

  height: 32px;

  vertical-align: top;

  margin-right: 10px;

  -webkit-animation: msClock2 1.5s linear infinite;

  animation: msClock2 1.5s linear infinite;

  background: url(../images/ystel.png) center center no-repeat;

}

.about .tel i {

  font-weight: bold;

  font-size: 24px;

  display: inline-block;

  vertical-align: top;

  letter-spacing: 0px;

}

.news {

  padding: 38px 0 74px;

}

.news .newsTab {

  margin-top: 45px;

}

.news .newsTab ul {

  text-align: center;

  font-size: 0;

}

.news .newsTab ul li {

  display: inline-block;

  vertical-align: top;

  margin: 0 26px;

}

.news .newsTab ul li:first-child {

  margin-left: 0;

}

.news .newsTab ul li a {

  display: block;

  width: 150px;

  height: 50px;

  background-color: #ffffff;

  border: solid 1px #dddddd;

  line-height: 48px;

  position: relative;

  text-align: center;

  font-size: 16px;

  color: #333333;

  overflow: hidden;

  border-left: 2px solid #ffce21;

  background-repeat: no-repeat;

  background-image: -webkit-linear-gradient(left, #ffce21, #ffce21);

  background-image: linear-gradient(to right, #ffce21, #ffce21);

  -webkit-transition: all 0.5s;

  transition: all 0.5s;

  background-size: 0% 100%;

  background-position: left center;

}

.news .newsTab ul li a i {

  display: inline-block;

  vertical-align: top;

  width: 24px;

  height: 48px;

  overflow: hidden;

  margin-right: 9px;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsTab ul li a i.ico1 {

  background: url(../images/newsico1.png) center center no-repeat;

}

.news .newsTab ul li a i.ico2 {

  background: url(../images/newsico2.png) center center no-repeat;

}

.news .newsTab ul li a i.ico3 {

  background: url(../images/newsico3.png) center center no-repeat;

}

.news .newsTab ul li:hover a,

.news .newsTab ul li.on a {

  border-color: #ffce21;

  background-color: #ffce21;

  background-size: 100% 100%;

  font-weight: bold;

}

.news .newsTabs {

  margin-top: 40px;

}

.news .newsTabs .bd {

  overflow: hidden;

}

.news .newsList {

  overflow: hidden;

}

.news .newsList .one {

  float: left;

  width: 650px;

}

.news .newsList .one .pic {

  display: block;

  width: 100%;

  height: 430px;

  position: relative;

  overflow: hidden;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out; border:2px solid #eee;

}

.news .newsList .one .pic img {

  display: block;

  position: absolute;

  width: 100%;

  height: 100%;

  object-fit: cover;

  left: 0;

  right: 0;

  top: 0;

  bottom: 0;

  margin: auto;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .one .cont {

  padding-top: 20px;

  position: relative;

  height: 120px;

}

.news .newsList .one .cont .bt {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  height: 38px;

  line-height: 38px;

  font-size: 18px;

  color: #444444;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .one .cont .bt:hover {

  -webkit-transform: translateX(5px);

  transform: translateX(5px);

}

.news .newsList .one .cont p {

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 2;

  overflow: hidden;

  line-height: 30px;

  height: 60px;

  color: #777777;

}

.news .newsList .one:hover .pic img {

  -webkit-transform: scale(1.1) rotate(0);

  -moz-transform: scale(1.1) rotate(0);

  -o-transform: scale(1.1) rotate(0);

  transform: scale(1.1) rotate(0);

}

.news .newsList .one:hover .cont .bt {

  font-weight: bold;

  color: #222;

}

.news .newsList .list {

  float: right;

  width: 580px;

}

.news .newsList .list ul::after {

  content: "";

  display: block;

  clear: both;

  font-size: 0;

  line-height: 0;

}

.news .newsList .list ul li {

  margin-top: 22px;

  height: 60px;

  padding-left: 92px;

}

.news .newsList .list ul li:first-child {

  margin-top: 0;

}

.news .newsList .list ul li .date {

  width: 70px;

  height: 60px;

  background-color: #f6f6f6;

  position: absolute;

  left: 0;

  top: 0;

  text-align: center;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .list ul li .date i {

  display: block;

  font-size: 20px;

  line-height: 32px;

  font-weight: bold;

  color: #aaaaaa;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .list ul li .date em {

  display: block;

  width: 50px;

  height: 1px;

  background-color: #dddddd;

  margin: auto;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .list ul li .date span {

  display: block;

  font-size: 14px;

  line-height: 28px;

  color: #999999;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .list ul li .bt {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 16px;

  height: 32px;

  line-height: 32px;

  color: #444444;

  -webkit-transition: all 0.5s ease-out;

  transition: all 0.5s ease-out;

}

.news .newsList .list ul li .bt:hover {

  -webkit-transform: translateX(5px);

  transform: translateX(5px);

}

.news .newsList .list ul li p {

  display: block;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 13px;

  color: #777777;

  line-height: 24px;

  margin-top: 2px;

}

.news .newsList .list ul li:hover .date {

  background-color: #ffce21;

}

.news .newsList .list ul li:hover .date i {

  color: #333;

}

.news .newsList .list ul li:hover .date em {

  background-color: #777;

}

.news .newsList .list ul li:hover .date span {

  color: #333;

}

.news .newsList .list ul li:hover .bt {

  color: #000;

}

.links {

  padding-bottom: 60px;

}

.links .linksBox {

  display: flex;

  z-index: 1;

}

.links .linksBox .tit {

  width: 87px;

  height: 23px;

  background: url(../images/linkstit.png) 0 0 no-repeat;

  float: left;

}

.links .linksBox .list {

  flex: 1;

  float: right;

  overflow: hidden;

  line-height: 34px;

  font-size: 0;

  margin-right: -40px;

}

.links .linksBox .list a {

  display: inline-block;

  vertical-align: top;

  position: relative;

  color: #666666;

  margin-left: 40px;

  font-size: 14px;

  margin-top: -2px;

  margin-bottom: -10px;

}

.links .linksBox .list a:hover {

  color: #000;

  -webkit-transform: translateX(5px);

  transform: translateX(5px);

}