@charset "utf-8";
@import 'base.css';
@import 'bootstrap.css';
@import 'animate.min.css';
@import 'keyframe.css';
@import 'waterfall.css';
@import 'font_1383114_xia06nkbwno.css';

.d1 {
  margin: 2em 10%;
}

.d2 {
  display: flex;
  justify-content: space-between;
}

.d2 img {
  width: 32% !important;
}

.box {
  margin: 0 auto;
  width: 100%;
}

.i1 {
  width: 100%;
}

.t1 {
  line-height: 37px !important;
}

* {
  margin: 0;
  padding: 0
}

html,
body {
  width: 100%;
  overflow-x: hidden;
  font-family: 'Microsoft YaHei';
  font-size: 12px;
  color: #333;
}

ul,
ol,
li {
  list-style: none;
}

ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
p,
dl,
dt,
dd {
  margin: 0;
  font-weight: normal;
  font-family: 'Microsoft YaHei';
}

/**{color: rgba(0,0,0,.8);}*/
.fenye2{
  width: 100% ;
  justify-content: center;
}
.wb_5 {
  width: 5%;
}

.wb_10 {
  width: 10%;
}

.wb_15 {
  width: 15%;
}

.wb_20 {
  width: 20%;
}

.wb_25 {
  width: 25%;
}

.wb_30 {
  width: 30%;
}

.wb_33 {
  width: 33.3%;
}

.wb_35 {
  width: 35%;
}

.wb_40 {
  width: 40%;
}

.wb_45 {
  width: 45%;
}

.wb_50 {
  width: 50%;
}

.wb_55 {
  width: 55%;
}

.wb_60 {
  width: 60%;
}

.wb_65 {
  width: 65%;
}

.wb_70 {
  width: 70%;
}

.wb_75 {
  width: 75%;
}

.wb_80 {
  width: 80%;
}

.wb_85 {
  width: 85%;
}

.wb_90 {
  width: 90%;
}

.wb_95 {
  width: 95%;
}

.wb_100 {
  width: 100%;
}

.wpx_1000 {
  width: 1000px;
  margin: 0px auto;
}

.wpx_1200 {
  width: 1200px;
  margin: 0px auto;
}

.wpx_1380 {
  width: 1380px;
  margin: 0px auto;
}

.fs_6 {
  font-size: 6px;
}

.fs_9 {
  font-size: 9px;
}

.fs_10 {
  font-size: 10px !important;
}

.fs_11 {
  font-size: 11px;
}

.fs_13 {
  font-size: 13px;
}

.fs_15 {
  font-size: 15px;
}

.fs_16 {
  font-size: 16px;
}

.fs_18 {
  font-size: 18px !important;
}

.fs_20 {
  font-size: 20px !important;
  height: 40px;
}

.fs_21 {
  font-size: 21px;
}

.fs_22 {
  font-size: 22px;
}

.fs_23 {
  font-size: 23px;
}

.fs_24 {
  font-size: 24px !important;
}

.fs_25 {
  font-size: 25px;
}

.fs_26 {
  font-size: 26px;
}

.fs_28 {
  font-size: 28px;
  height: 28px;
}

.fs_30 {
  font-size: 30px;
  height: 30px;
}

.fs_32 {
  font-size: 32px;
  height: 32px;
}

.fs_34 {
  font-size: 34px;
}

.fs_36 {
  font-size: 36px;
}

.fs_38 {
  font-size: 38px;
}

.fs_44 {
  font-size: 44px;
}

.fs_79 {
  font-size: 79px;
}

.mg_bh30 {
  margin-bottom: 30px;
}

.mg_bh100 {
  margin-bottom: 100px;
}

.mg_th20 {
  margin-top: 20px !important;
}

.mg_th30 {
  margin-top: 30px;
}

.mg_th100 {
  margin-top: 100px;
}

.mg_th50 {
  margin-top: 50px;
}

.text_upp {
  text-transform: uppercase
}

.letter_s1 {
  letter-spacing: 1px;
}

.letter_s8 {
  letter-spacing: 8px;
}

.line_h36 {
  line-height: 36px;
}

.line_h60 {
  line-height: 60px !important;
}

.dis_b {
  display: block;
}

.dis_in-b {
  display: inline-block !important;
}

.dis_no {
  display: none;
}

.ma_c {
  margin: 0 auto;
}

.t-a_l {
  text-align: left;
}

.t-a_c {
  text-align: center;
}

.t-a_r {
  text-align: right;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.color_t {
  color: transparent;
}

.color_b {
  color: black;
}

.color_w {
  color: white;
}

.fit_c {
  object-fit: cover;
}

.text_over_2 {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.text_over_3 {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.text_over_4 {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.text_over_5 {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
}

.text_over_6 {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}


.bgsh {
  background: #efefef;
}

.a {
  color: #595757 !important;
  text-decoration: none !important;
}



.big img {
  object-fit: cover;
  transition: transform 0.8s;
  width: 100%
}

.big img:hover {
  transform: scale(1.01);
}

.big p {
  overflow: hidden;
}

.hd {
  object-fit: cover;
  transition: transform 0.8s;
}

.hd:hover {
  transform: scale(1.01);
}

.nhd:hover {
  transform: scale(1) !important;
}

.black {
  color: #000 !important;
}

.black_bg {
  background-color: #000 !important;
}

.ovhid {
  overflow: hidden;
}

.f22 {
  font-size: 22px;
}




/*导航栏*/

.set_10_button {}

.list li:first-of-type .icon {

  padding-left: 6px;
  margin-top: -2px;
  width: 32px;
  float: left;
  /* background-color: #ffd311; */
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;
  -ms-transition: all .3s ease;
  font-size: 25px;
  line-height: 31px;
}

.set_10_button .icon,
.nav-div .icon {

  left: -60px;
  top: 0;
  width: 32px;
  float: left;
  /* background-color: #ffd311; */
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;
  -ms-transition: all .3s ease;
  font-size: 35px;
  line-height: 25px;
}

.set_10_button span {

  display: inline-block;
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;
  -ms-transition: all .3s ease;
}

.nav-div span {

  display: inline-block;
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;
  -ms-transition: all .3s ease;
  width: 90px;
}

.nav-table .nav-item .list .nav-title {
  display: none;
  z-index: 999;
  font-size: 22px;
}

.nav-table .nav-item .list li:hover .nav-title {
  display: block;
}

.nav-table .nav-item .list .nav-title div {
  font-size: 19px;
  margin-right: -100px;

}

.nav-table .nav-item .list .nav-title div span {
  font-size: 19px !important;

}

div.navigation .nav-table0 {
  position: absolute;
  width: 50%;
  bottom: 7em;
  left: 25em;
}

div.navigation ul.list0 {
  display: inline-block;
  width: 100%;
}

div.navigation ul.list0 li {
  display: inline-block;
  font-size: 15px;
  padding: 0 2em 0 0;
}

div.navigation ul.list0 li a:hover {
  text-decoration: revert;
  color: rgba(209, 165, 116, 1);
}

.navigation .nav-contact .right-logo {
  text-align: center;
  margin-top: 6em;
}

.navigation .nav-contact .right_icon .nav_title {
  color: #fff;
  text-align: center;
  margin-bottom: 1em;
}

.navigation .nav-contact .right_icon {
  position: absolute;
  bottom: 0;
  width: 100%;
}

.navigation .nav-contact .right_icon .nav_icon {
  position: relative;
  display: inline-block;
  left: 50%;
  transform: translateX(-50%);
}

.navigation .nav-contact .right_icon li {
  padding: 0px 0 1em;
  display: -webkit-box;
  /* float: left; */
  margin: 0 auto;
}




.right_icon ul li:before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  opacity: 0;
  -webkit-transition: .5s cubic-bezier(.3, 0, 0, 1.3);
  -moz-transition: .5s cubic-bezier(.3, 0, 0, 1.3);
  -ms-transition: .5s cubic-bezier(.3, 0, 0, 1.3);
  -o-transition: .5s cubic-bezier(.3, 0, 0, 1.3);
  transition: .5s cubic-bezier(.3, 0, 0, 1.3);
  -webkit-transform: scale(0, 0);
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -o-transform: scale(0, 0);
  transform: scale(0, 0);
}

.right_icon .app-qrcode {
  opacity: 1 !important;
  display: none;
  position: absolute;
  width: 110px;
  height: 110px;
  margin-top: -70px;
  box-shadow: 0 0 8px rgba(14, 22, 30, .3);
  margin-left: -120px;
  background: #fff;
}

.right_icon .app-qrcode img {
  max-width: 100%;
  max-height: 100%;
  padding: 5px;
}

.bull-em {
  font-style: normal;
  margin-left: 15px;
}

.right_icon .app-qrcode:before {
  content: '';
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-left: 10px solid rgba(0, 0, 0, .3);
  bottom: 11px;
  right: -19px;
}

.right_icon .app-qrcode:after {
  content: '';
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-left: 10px solid #fff;
  bottom: 11px;
  right: -17px;
}

.right_icon ul li:hover:before {
  opacity: 1;
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
}




@media (max-width: 768px) {
  body {
    padding-left: 0;
  }

  .wpx_1200 {
    width: 96%;
    margin: 0 2%;
  }
}

.bd_weixin_popup {
  height: 300px !important;
}

.mouse-animte {
  position: absolute;
  left: 50%;
  margin-left: -10px;
  bottom: 100px;
  width: 20px;
  height: 31px;
  background: url(../images/sb1.png) no-repeat center center;
  z-index: 3;
}

.mouse-animte a {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}

.mouse-animte a img {
  position: absolute;
  left: 50%;
  margin-left: -3px;
  top: 6px;
  opacity: 1;
  animation: aimte 1s cubic-bezier(0.45, 0.45, 0.45, 0.45) 0s infinite alternate;
  -webkit-animation: aimte 1s cubic-bezier(0.45, 0.45, 0.45, 0.45) 0s infinite alternate;
}

@keyframes aimte {

  from,
  20%,
  40%,
  60%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.325, 0.225, 0.335, 1.000);
  }

  20% {
    opacity: 0.5;
    top: 8px;
  }

  40% {
    opacity: 0.8;
    top: 10px;
  }

  60% {
    opacity: 1;
    top: 12px;
  }

  80% {
    opacity: 0.8;
    top: 14px;
  }

  to {
    opacity: 0.5;
    top: 16px;
  }
}

@-webkit-keyframes aimte {

  from,
  20%,
  40%,
  60%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.325, 0.225, 0.335, 1.000);
  }

  20% {
    opacity: 0.5;
    top: 8px;
  }

  40% {
    opacity: 1;
    top: 10px;
  }

  60% {
    opacity: 0.5;
    top: 12px;
  }

  80% {
    opacity: 1;
    top: 14px;
  }

  to {
    opacity: 0.5;
    top: 16px;
  }
}

/*loading-wrap*/
div.loading-wrap {
  width: 100%;
  height: 100%;
  background-color: rgba(245, 245, 245, 1);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9998;
  display: none
}

div.loading-wrap .loader {
  width: 180px;
  height: 160px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  margin-top: -80px;
  margin-left: -90px;
  overflow: hidden;
}

div.loading-wrap .loader:before {
  display: block;
  width: 100%;
  padding-top: 85px;
  text-align: center;
  content: '';
  /*background: 
url("../images/logo.svg") no-repeat left top / 100%;*/
}

div.loading-wrap .loader-inner {
  display: inline-block;
  width: 40px;
  height: 40px;
}


/*navigation*/
div.navigation {
  display: none;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background: #fff no-repeat center center / cover;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

div.navigation .nav-markwater {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

div.navigation .nav-markwater .inner {
  width: 100%;
  height: 100%;
  background: no-repeat center;
  background-size: cover;
  transition: All 0.5s ease-in-out;
  -webkit-transition: All 0.5s ease-in-out;
  -moz-transition: All 0.5s ease-in-out;
  -o-transition: All 0.5s ease-in-out;
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
}

div.navigation .nav-markwater .inner.hover {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
}

div.navigation .container {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 10;
  background: url("../images/header_bg.jpg") no-repeat center center;
}

div.navigation .nav-header {
  width: 100px;
  height: 100%;
  /* border-right: 1px solid #323334; */
  /* background-color: #fff; */
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
}

div.navigation .nav-contact {
  width: 145px;
  height: 100%;
  border-right: 1px solid #323334;
  background-color: #000;
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 10;
}

div.navigation a.logo {
  display: block;
  border-bottom: 1px solid #323334;
}

div.navigation a.logo img {
  width: 100%;
}

div.navigation a.smile {
  display: block;
  width: 45px;
  height: 45px;
  background: url("../images/smile3.png") no-repeat center center;
  position:
    absolute;
  left: 50%;
  margin-left: -22.5px;
  bottom: 30px;
  cursor: default;
}

div.navigation a.close {
  display: block;
  width: 18px;
  height: 18px;
  background: url("../images/close.png") no-repeat center center;
  position: absolute;
  left: 50%;
  margin-left: -9px;
  top: 50%;
  margin-top: -9px;
  z-index: 1;
}


div.navigation .nav-table {
  width: 100%;
  height: 100%;
  padding: 0 50px;
  display: table;
}

div.navigation .nav-table .nav-item {
  display: table-cell;
  width: 38%;
  vertical-align: middle;
}

div.navigation ul.list {
  /* display: inline-block; */
  width: 500px;
  overflow: hidden;
  height: 345px;
}

div.navigation ul.list li {
  position: relative;
  padding: 16px 0;
  font-size: 19px;
}

div.navigation ul.list li:nth-child(3) .right-info {
  top: -60px;
}

div.navigation ul.list li:nth-child(4) .right-info {
  top: -125px;
}

div.navigation ul.list li:nth-child(5) .right-info {
  top: -195px;
}

div.navigation ul.list li span.num {
  display: inline-block;
  font-size: 14px;
  line-height: 14px;
  color: #008d43;
  border: 1px solid #008d43;
  padding: 5px 8px;
  position: absolute;
  top: 0;
  left: 100%;
  z-index: 1;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  font-weight: normal;
}

div.navigation ul.list li a {
  display: inline-block;
  position: relative;
}

div.navigation ul.list li,
div.navigation ul.list li a:focus {
  text-decoration: none;
}

div.navigation ul.list li {
  text-decoration: none;
  color: rgba(209, 165, 116, 1);
  margin-left: -28px;
}

div.navigation ul.list li,
div.navigation ul.list li a:hover {
  text-decoration: none;
  color: rgba(209, 165, 116, 1);
}

div.navigation ul.list li.gray a {
  color: #999;
}

/*div.navigation ul.list li text{display: none;}*/
div.navigation ul.list li:hover text {
  display: inline-block;
}

div.navigation ul.list .classification {
  width: 16%;
  display: none;
  position: absolute;
  padding-left: 5em;
  z-index: 3;
}

div.navigation ul.list li.list_li:hover .classification {
  display: inline-block;
}

.list .list_li:hover .classification {
  display: inline-block;
}

div.navigation .right-info {
  position: absolute;
  top: 12px;
  right: 0;
  height: 260px;
  padding-left: 160px;
}

div.navigation .right-info dl {
  width: 50%;
  padding-right: 50px;
  padding-bottom: 15px;
  float: left;
}

div.navigation .right-info dl dt {
  font-size: 20px;
  color: #FFF;
  font-weight: bold;
}

div.navigation .right-info dl dd {
  font-size: 14px;
  color: #aaa;
  padding: 10px 0;
  line-height: 24px;
}

div.navigation .right-info dl dd span.tit {
  white-space: nowrap;
}

div.navigation .right-info dl.wd100 {
  width: 100%;
}

@media (min-width: 1200px) {
  div.navigation .nav-table .nav-item:first-child {
    padding-left: 19em;
  }
}

@media (max-width: 768px) {
  div.navigation {
    padding-left: 0;
    padding-top: 44px;
  }

  div.navigation .nav-header {
    width: 100%;
    height: 50px;
    border-right: 0;
    border-bottom: none;
  }

  div.navigation a.logo {
    display: inline-block;
    width: auto;
    height: 100%;
    border-bottom: 0;
  }

  div.navigation a.logo img {
    width: auto;
  }

  div.navigation a.logo span:first-child img {
    height: 100%;
  }

  div.navigation a.smile {
    display: none;
    left: auto;
    right: 15px;
    bottom: 50%;
    margin-bottom: -22.5px;
  }

  div.navigation a.close {
    left: auto;
    right: 30px;
  }

  div.navigation a.close.menuClose {
    left: auto;
    right: 30px;
  }


  div.navigation .nav-contact {
    display: block;
    width: 100%;
    height: 10%;
    border-right: 1px solid #323334;
    background-color: #000;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 11;
  }

  div.navigation a.logo {
    display: block;
    border-bottom: 1px solid #323334;
  }

  div.navigation a.logo img {
    width: 100%;
  }

  div.navigation a.smile {
    display: block;
    width: 45px;
    height: 45px;
    background: url("../images/smile3.png") no-repeat center center;
    position:
      absolute;
    left: 50%;
    margin-left: -22.5px;
    bottom: 30px;
    cursor: default;
  }

  div.navigation a.close {
    display: block;
    width: 18px;
    height: 18px;
    background: url("../images/close.png") no-repeat center center;
    position: absolute;
    left: 50%;
    margin-left: -9px;
    top: 50%;
    margin-top: -9px;
    z-index: 1;
  }


  div.navigation .nav-table0 {
    position: absolute;
    width: 90%;
    bottom: 23%;
    left: 2em;
  }

  div.navigation ul.list {
    display: inline-block;
    width: 96%;
    overflow: hidden;
    height: 100%;
  }

  div.navigation ul.list0 {
    display: inline-block;
    width: 100%;
  }

  div.navigation ul.list0 li {
    display: inline-block;
    font-size: 10px;
    padding: 0 11px 0 0;
  }

  div.navigation ul.list0 li a:hover {
    text-decoration: revert;
    color: rgba(209, 165, 116, 1);
  }

  .navigation .nav-contact .right-logo {
    position: relative;
    text-align: inherit;
    margin-top: 0;
    display: block;
    line-height: 66px;
    left: 6%;
  }

  .navigation .nav-contact .right-logo img {
    width: 50px
  }

  .navigation .nav-contact .right_icon .nav_title {
    color: #fff;
    text-align: center;
    margin-bottom: 1em;
    float: left;
    transform: scale(0.6);
  }

  .navigation .nav-contact .right_icon {
    position: absolute;
    height: 38px;
    bottom: auto;
    width: auto;
    top: 50%;
    transform: translateY(-50%);
    right: 6%;
  }

  .navigation .nav-contact .right_icon .nav_icon {
    position: relative;
    display: inline-block;
    left: auto;
    transform: translateX(0);
    line-height: 33px;
  }

  .navigation .nav-contact .right_icon li {
    padding: 0px 0 1em;
    display: inline-block;
    /* float: left; */
    margin: 0 auto;
  }

  .navigation .nav-contact .right_icon li img {
    width: 28px
  }

  .right_icon .app-qrcode {
    opacity: 1 !important;
    display: none;
    position: absolute;
    width: 70px;
    height: 70px;
    margin-top: -80px;
    box-shadow: 0 0 6px #fff;
    background: #fff;
    margin-left: -21px;
  }

  .right_icon .app-qrcode img {
    width: 100% !important;
  }

  .right_icon .app-qrcode:before {
    content: '';
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: 8px solid transparent;
    border-top: 10px solid #fff;
    top: 70px;
    left: 26px;
  }

  .right_icon .app-qrcode:after {
    content: '';
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: 8px solid transparent;
    border-top: 10px solid #fff;
    top: 70px;
    left: 26px;
  }

  div.navigation .nav-table {
    display: block;
    padding: 0;
  }

  div.navigation .nav-table .right-info {}

  div.navigation .nav-table .nav-item {
    position: relative;
    display: block;
    width: 100%;
    padding: 10px 0;
    height: 90%;
  }

  div.navigation ul.list {
    display: block;
    text-align: left;
    margin-top: 6%;
  }

  div.navigation ul.list li:first-of-type {
    font-size: 11px;
    margin-left: -32px;
  }

  .list li:first-of-type .icon {
    margin-top: -8px;
    padding-left: 0 !important;
    font-size: 18px;
  }

  div.navigation ul.list li {
    padding: 18px 0;
    font-size: 13px;
    font-weight: 400;
    margin-left: -18px
  }

  div.navigation ul.list li span.num {
    font-size: 12px;
    padding: 3px 6px;
  }

  .nav-div span {
    color: #999
  }

  div.navigation .right-info dl {
    width: 100%;
    padding: 15px 20px;
    float: none;
  }

  div.navigation .right-info dl:last-child {
    display: none;
  }

  div.navigation ul.list li:first-of-type a {
    font-size: 11px !important
  }

  .set_10_button .icon,
  .nav-div .icon {
    width: 18px;
    font-size: 20px;
    line-height: 16px;
    margin-right: 9px;
    text-align: right;
  }

  .nav-table .nav-item .list .nav-title div {
    font-size: 13px
  }

  .nav-table .nav-item .list .nav-title div span {
    font-size: 13px !important
  }

  .nav-table .nav-item .list li:hover .nav-title {
    top: 11px
  }

  div.navigation a.close.menuClose {
    width: 15px
  }
}


/*touch-service*/
div.touch-service {
  display: none;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  padding-left: 80px;
  color: #FFF;
  background-color: #008d43;
  position:
    fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

div.touch-service .container {
  width: 100%;
  height: 100%;
  padding: 80px;
}

div.touch-service .nav-header {
  width: 80px;
  height: 100%;
  border-right: 1px solid #323334;
  background-color: #008d43;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}

div.touch-service a.logo {
  display: block;
  border-bottom: 1px solid #323334;
}

div.touch-service a.logo img {
  width: 100%;
}

/*div.touch-service a.close{ display: block; width: 18px; height: 18px; opacity: .8; background: url("../images/close.png") no-repeat center center 
!important; position: absolute; left: 50%; margin-left: -9px; top: 50%; margin-top: -9px; z-index: 1; }*/
connell1 {
  width: 65% !important;
  float: left !important;
  margin: 0 10px !important;
  height: 503px !important;
}

connell2 {
  margin: 0 0 10px !important;
  float: left !important;
  height: 20rem !important;
  width: 20% !important;
}

div.touch-service .container {}

div.touch-service .container h3 {
  font-size: 32px;
  padding-bottom: 12px;
}

div.touch-service .container p {
  font-size: 14px;
}

div.touch-service .msg-table {
  padding: 35px 0;
}

div.touch-service .msg-table a.item {
  display: flex;
  background-color: #007f3c;
  color: #FFF;
  margin-right: 15px;
  margin-bottom: 15px;
  justify-content: center;
  align-items:
    center;
  flex-direction: column;
  width: 310px;
  height: 310px;
  float: left;
}

div.touch-service .msg-table a.item:first-child {
  margin-left: 0;
}

div.touch-service .msg-table a.item:hover,
div.touch-service .msg-table a.item:focus {
  text-decoration: none;
  color: #FFF;
}

div.touch-service .msg-table img {
  max-width: 100%;
}

div.touch-service .msg-table img.none {
  max-width: 100%;
}

div.touch-service .msg-table img.hover {
  display: none;
  max-width: 100%;
}

div.touch-service .msg-table h2 {
  font-size: 16px;
  padding-bottom: 8px;
}

div.touch-service .msg-table p {
  font-size: 14px;
  color: #a3c5b0;
}

div.touch-service .msg-table:after {
  display: block;
  content: '';
  clear: both;
}

div.touch-service .msg-table a.item:hover {
  background-color: #FFF;
}

div.touch-service .msg-table a.item:hover img.none {
  display: none;
}

div.touch-service .msg-table a.item:hover img.hover {
  display: inline;
}

div.touch-service .msg-table a.item:hover h2 {
  color: #008d43;
}

@media (max-width: 1600px) {
  div.touch-service .msg-table a.item {
    width: 210px;
    height: 210px;
  }
}

@media (max-width: 1200px) {
  div.touch-service .msg-table a.item {
    width: 160px;
    height: 160px;
  }

  div.touch-service .msg-table img {
    display: inline-block;
    width: 45%;
  }
}

@media (max-width: 980px) {
  div.touch-service .container {
    padding: 36px;
  }

  div.touch-service .nav-header {
    background-color: #008d43;
  }

}

@media (max-width: 768px) {
  div.touch-service .container {
    height: auto;
    padding: 30px 20px;
  }

  div.touch-service {
    padding-left: 0;
    padding-top: 80px;
  }

  div.touch-service .nav-header {
    width: 100%;
    height: 80px;
    border-right: 0;
    border-bottom: 1px solid #323334;
  }

  div.touch-service a.logo {
    display: inline-block;
    width: auto;
    height: 100%;
    border-bottom: 0;
  }

  div.touch-service a.logo img {
    width: auto;
  }

  div.touch-service a.logo span:first-child img {
    height: 100%;
  }

  div.touch-service a.close {
    left: inherit;
    right: 30px;
  }

}

@media (max-width: 420px) {
  div.touch-service .msg-table a.item {
    width: 48%;
    height: auto;
    margin: 2% 0 2% 4%;
    display: block;
    text-align: center;
    padding: 35px 15px 45px;
  }

  div.touch-service .msg-table a.item:nth-child(2n+1) {
    margin-left: 0;
  }
}

@media (max-width: 375px) {
  div.touch-service .nav-header {
    height: 60px;
  }
}

@media (max-width: 320px) {

  div.touch-service .msg-table a.item {
    width: 100%;
    margin: 3% 0;
  }

  div.touch-service .container {
    padding: 25px 15px;
  }
}

/*message-service*/
div.message-service {
  width: 100%;
  color: #FFF;
  height: 100%;
  background-color: #008d43;
  position: relative;
}

div.message-service .container {
  width: 100%;
  height: 100%;
  padding: 80px;
}

div.nav-header {
  width: 100px;
  height: 100%;
  /* border-right: 1px solid #00773d; */
  /* background-color: #008d43; */
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

div.touch-service div.nav-header a.logo {
  background: #038842
}

div.nav-header a.logo {
  display: block;
  width: 22%;
  margin: 6em auto;
}

div.nav-header a.logo img {
  width: 100%;
}

div.nav-header a.close {
  display: block;
  width: 10px;
  height: 18px;
  opacity: .8;
  background: url("../images/back.png") no-repeat center center;
  background-size: 100%;
  position: absolute;
  left: 50%;
  margin-left: -5px;
  top: 9%;
  margin-top: -9px;
  z-index: 1;
}

div.nav-header a.close.right {
  background-image: url("../images/back2.png");
}

div.navigation a.close.menuClose {
  width: 18px;
  margin-left: -9px;
  background-image: url("../images/chloe.png") !important;
}



/*message-service*/
div.message-service .container h3 {
  font-size: 32px;
  padding-bottom: 12px;
}

div.message-service .container p {
  font-size: 14px;
}

div.message-service form.update {
  width: 1285px;
  padding: 35px 0;
}

div.message-service form.update .ipt-input {
  width: 100%;
  background-color: #007f3c;
  color: #FFF;
  margin: 10px 0 10px 20px;
  float: left;
}

div.message-service form.update .ipt-input input,
div.message-service form.update .ipt-input textarea {
  width: 100%;
  background-color: transparent;
  border: 0;
  outline: none;
  resize: none;
  padding: 18px;
  font-size: 14px;
  line-height: 24px;
}

div.message-service form.update .ipt-input input::-webkit-input-placeholder,
div.message-service form.update .ipt-input textarea::-webkit-input-placeholder {
  color: #589d73;
}

div.message-service form.update .ipt-input input::-moz-placeholder,
div.message-service form.update .ipt-input textarea::-moz-placeholder {
  color: #589d73;
}

div.message-service form.update .ipt-input input:-ms-input-placeholder,
div.message-service form.update .ipt-input textarea:-ms-input-placeholder {
  color: #589d73;
}

div.message-service form.update .ipt-input textarea {
  min-height: 200px;
}

div.message-service form.update .ipt-input.wd {
  width: 415px;
}

div.message-service form.update .ipt-input.ml0 {
  margin-left: 0;
}

div.message-service form.update:after {
  display: block;
  content: '';
  clear: both;
}

div.message-service form.update .btn-submit button {
  font-size: 16px;
  border: 1px solid #FFF;
  background: transparent url("../images/right.png") no-repeat right 15px center;
  color: #FFF;
  padding: 8px 30px 8px 15px;
  outline: none;
  margin-top: 20px;
  float: right;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
}

div.message-service div.error {
  display: block;
  height: 24px;
  line-height: 24px;
  font-size: 16px;
  overflow: hidden;
}

div.message-service div.error label {
  font-weight: normal;
  color: #F00;
  text-shadow: 0 0 5px rgba(0, 0, 0, .3);
}

div.message-service div.error p {
  text-align: left;
}

div.message-service .message-box {
  padding: 80px;
  position: relative;
  z-index: 1;
}

div.message-service .message-box .text-info {
  color: #FFF;
}

div.message-service .message-box .text-info b {
  font-size: 32px;
  line-height: 42px;
  padding-bottom: 12px;
  font-weight: normal
}

div.message-service .message-box .text-info p {
  font-size: 14px;
  line-height: 24px;
  padding: 5px 0;
}

@media (max-width: 1500px) {
  div.message-service form.update {
    width: 100%;
  }

  div.message-service form.update .ipt-input.wd {
    width: 32.6%;
    margin-left: 1%;
  }

  div.message-service form.update .ipt-input.ml0 {
    margin-left: 0;
  }
}

@media (max-width: 980px) {
  div.message-service form.update .ipt-input.wd {
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 768px) {
  div.message-service .message-box {
    padding: 30px 20px;
  }

  div.message-service .message-box .text-info b {
    font-size: 24px;
    line-height: 32px;
  }

  div.message-service {
    padding-left: 0;
    padding-top: 20px;
    height: auto;
    overflow: hidden;
  }

  div.nav-header {
    width: 100%;
    height: 80px;
    border-right: 0;
    border-bottom: 1px solid #323334;
  }

  div.nav-header a.logo {
    display: inline-block;
    width: auto;
    height: 100%;
    border-bottom: 0;
  }

  div.nav-header a.logo img {
    width: auto;
  }

  div.nav-header a.logo span:first-child img {
    height: 100%;
  }

  div.nav-header a.close {
    left: auto !important;
    height: 50px;
    right: 30px;
    background-image: url("../images/right.png");
  }

  div.message-service form.update button.btn-submit {
    width: 80%;
    margin: 15px auto;
    padding: 8px 30px;
    background: transparent;
    display: block;
    float: none;
  }

  div.message-service div.error {
    margin: 15px 0 30px;
    text-align: center;
  }
}



/*touch-pay*/
div.message-service.touch-pay {
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  background: url("../images/touch_pay_bg.png") no-repeat center / cover;
}

div.message-service.touch-pay:before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background: url("../images/touch_pay_info.png") no-repeat left top;
  position: absolute;
  top: 0;
  left: 80px;
  z-index: 1;
}

div.message-service.touch-pay a.close {
  background-image: url("../images/close.png");
}

div.pay-dialog {
  width: 420px;
  position: absolute;
  top: 50%;
  margin-top: -120px;
  left: 50%;
  margin-left: -210px;
  background-color: #FFF;
  z-index: 99;
  overflow: hidden;
  ;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
}

div.pay-dialog p {
  font-size: 12px;
  color: #999;
}

div.pay-dialog button.btn-submit {
  width: 100%;
  background-color: #008d43;
  color: #FFF;
  font-size: 18px;
  border: 0;
  outline: none;
  padding: 15px 0;
}

div.pay-dialog .content {
  padding: 30px 20px 20px;
}

div.pay-dialog .content .ipt-tta {
  width: 100%;
  border: 1px solid #CCC;
  margin-top: 10px;
}

div.pay-dialog .content .ipt-tta input {
  width: 100%;
  border: 0;
  color: #333;
  background-color: transparent;
  outline: none;
  resize: none;
  padding: 0 10px;
  height: 60px;
  line-height: 60PX;
}

div.pay-dialog div.error {
  display: none;
  width: 100%;
  margin: 10px 0;
  line-height: 24px;
  font-size: 14px;
  height: 24px;
  overflow: hidden;
}

div.pay-dialog div.error label {
  font-weight: normal;
  color: #F00;
}

div.pay-dialog a.getPwd {
  color: #666;
  display: inline-block;
  padding-left: 3px;
}

div.pay-dialog a.getPwd span.qq {
  display: inline-block;
  vertical-align: middle;
  padding-left: 28px;
  margin-left: 3px;
  background:
    url("../images/qqon.gif") no-repeat left center;
  background-size: auto 100%;
}

div.pay-dialog a.getPwd:hover,
div.pay-dialog a.getPwd:focus {
  text-decoration: none;
  color: #008d43;
}

@media (max-width: 768px) {
  div.message-service.touch-pay:before {
    left: 0;
  }
}

@media (max-width: 420px) {
  div.pay-dialog {
    width: 80%;
    margin-left: -40%;
  }
}

/*touch-pay-info*/
div.message-service.touch-pay-info {}

div.message-service.touch-pay-info .bank-list {
  padding: 35px 0;
}

div.message-service.touch-pay-info .bank-list dl {
  width: 465px;
  height: 180px;
  background-color: #007f3c;
  margin: 12px 0 12px 15px;
  padding: 15px;
  display: table;
  float: left;
}

div.message-service.touch-pay-info .bank-list dl dt,
div.message-service.touch-pay-info .bank-list dl dd {
  display: table-cell;
  vertical-align: middle;
}

div.message-service.touch-pay-info .bank-list dl dt {
  width: 50px;
  padding: 0 10px;
}

div.message-service.touch-pay-info .bank-list dl dd {
  line-height: 21px;
  padding-left: 15px;
}

div.message-service.touch-pay-info .bank-list dl dd h3 {
  font-weight: bold;
  padding-bottom: 8px;
  font-size: 16px;
  color: #FFF;
}

div.message-service.touch-pay-info .bank-list dl dd p {
  font-size: 14px;
  color: #CCC;
}

div.message-service.touch-pay-info .bank-list:after {
  display: block;
  content: '';
  clear: both;
}

div.message-service.touch-pay-info .bank-list dl:first-child {
  margin-left: 0;
}

div.message-service.touch-pay-info .bank-list dl:nth-child(4),
div.message-service.touch-pay-info .bank-list dl:nth-child(6) {
  margin-left: 0;
  clear:
    both;
}

@media (max-width: 1680px) {
  div.message-service.touch-pay-info .bank-list dl {
    width: 32.33%;
    margin: 1% 0 1% 1%;
  }
}

@media (max-width: 1400px) {
  div.message-service.touch-pay-info .bank-list dl {
    width: 49%;
  }

  div.message-service.touch-pay-info .bank-list dl:nth-child(4),
  div.message-service.touch-pay-info .bank-list dl:nth-child(6) {
    margin-left: 1%;
    clear: none;
  }

  div.message-service.touch-pay-info .bank-list dl:nth-child(2n+1) {
    margin-left: 0;
    clear: both;
  }
}

@media (max-width: 980px) {
  div.message-service.touch-pay-info .bank-list dl {
    width: 100%;
    margin: 15px 0 !important;
  }
}

div.touch-service a.close {
  display: block;
  width: 18px;
  height: 18px;
  opacity: .8;
  background: url("../images/close.png") no-repeat center center / 100% !important;
  position: absolute;
  left: 50%;
  margin-left: -9px;
  top: 50%;
  margin-top: -9px;
  z-index: 1;
}

.position {
  padding: 48px 10% 22px;
  font-size: 14px;
}

/*brand*/
.brand {
  width: 100%;
  position: relative;
}

.brand .Brand_Banner {
  width: 1200px;
  height: 680px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.brand .Brand_Banner img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.brand .Brand_Con {
  height: 200px;
  background: #fff;
  width: 45%;
  left: 50%;
  transform: translateX(-50%);
  bottom: -9em;
  z-index: 3;
  position: absolute;
  padding: 4em 4em 4em 5em;
  line-height: 1.6;
  transition: box-shadow 1.1s;
}

.brand .Brand_Con:hover {
  box-shadow: 0 6px 16px 1px #888888
}

.brand .Brand_Con .Brand_liae {
  width: 4%;
  height: 2px;
  background: #333333;
  margin-bottom: 1em;
}

.brand .Brand_Con .Brand_Title {
  font-size: 22px;
  height: 29px;
  letter-spacing: 2px;
}

.brand .Brand_Con .Brand_enTitle {
  font-size: 12px;
}

.brand .Brand_Con .Brand_Intro {
  margin: 6px 0;
  font-size: 14px;
  letter-spacing: 2px;
}

.brand .Brand_Con .Brand_More {
  position: absolute;
  height: 23px;
  line-height: 22px;
  right: 5em;
  bottom: 3em;
  border: 1px solid #333;
  padding: 0px 20px;
  padding: 0px 15px;
  padding: 0px 16px;
  font-size: 9px;
  width: 70px;
}

/*progoods*/
.progoods {
  width: 100%;
  position: relative;
  margin-top: 16em;
}

.progoods .Pro_Banner {
  width: 1200px;
  height: 680px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.progoods .Pro_Banner img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.progoods .Pro_Con {
  position: absolute;
  width: 18%;
  height: 290px;
  background: #fff;
  z-index: 3;
  right: 8%;
  top: 50%;
  transform: translateY(-50%);
  padding: 5em 4em 4em;
  line-height: 1.6;
  transition: box-shadow 1.1s;
}

.progoods .Pro_Con:hover {
  box-shadow: 0 6px 16px 1px #888888
}

.progoods .Pro_Con .Pro_liae {
  width: 13%;
  height: 2px;
  background: #333333;
  margin-bottom: 1em;
}

.progoods .Pro_Con .Pro_Title {
  font-size: 22px;
  height: 29px;
  letter-spacing: 2px;
}

.progoods .Pro_Con .Pro_enTitle {
  font-size: 11px;
  -webkit-transform: scale(0.9);
  margin-left: -12px;
}

.progoods .Pro_Con .Pro_Intro {
  margin: 6px 0;
  font-size: 14px;
  letter-spacing: 2px;
}

.progoods .Pro_Con .Pro_More {
  display: inline-block;
  border: 1px solid #333333;
  padding: 0px 16px;
  position: absolute;
  bottom: 5.5em;
  font-size: 9px;
  height: 23px;
  line-height: 21px;
  width: 70px;
}



/*product category*/
.hpro_category {
  position: relative;
  top: 9em;
  width: 1200px;
  margin: 0 auto;
}

.hpro_category .Pro_Category {
  min-height: 550px;

}

.hpro_category .Pro_Category .Category {
  overflow: hidden;
}

.hpro_category .Pro_Category .Category:first-of-type {
  position: absolute;
  width: 70%;
  display: inline-block;
  margin-bottom: 2%;
  top: 0;
}

.hpro_category .Pro_Category .Category:nth-child(2) {
  position: absolute;
  /* float: left; */
  width: 34%;
  /* display: inline-block; */
  /* height: auto; */
  top: 303px;
}

.hpro_category .Pro_Category .Category:nth-child(3) {
  position: absolute;
  width: 34%;
  top: 303px;
  left: 36%;
}

.hpro_category .Pro_Category .Category:last-of-type {
  position: relative;
  width: 28%;
  display: inline-block;
  top: 0;
  position: absolute;
  right: 0;
  height: 94%
}

.hpro_category .Pro_Category .Category img {
  height: 100%;
  max-height: 100%;
  object-fit: cover;
}

.hpro_category .Pro_Category .Category:hover img {
  transform: scale(1.05);
}

.hpro_category .Pro_Category .Category .Category_Title {
  display: inline-block;
  position: absolute;
  bottom: 2em;
  left: 3em;
  color: #fff;
}

.hpro_category .Pro_Category .Category:first-of-type .Category_Title {
  color: #fff;
}

.hpro_category .Pro_Category .Category .Category_Title .Category_znTitle {
  font-size: 16px;
  height: 20px;
  letter-spacing: 1px;
}

.hpro_category .Pro_Category .Category .Category_Title .Category_enTitle {
  font-size: 12px;
  margin-top: -2px;
  -webkit-transform-origin-x: 0;
  -webkit-transform: scale(0.7);
}

.pro_category {
  position: relative;
  top: 9em;
  width: 1200px;
  margin: 0 auto;
}

.pro_category .Pro_Category {}

.pro_category .Pro_Category .Category {
  overflow: hidden;
}

.pro_category .Pro_Category .Category:first-of-type {
  position: relative;
  width: 70%;
  display: inline-block;
  height: 300px;
  margin-bottom: 2%;
}

.pro_category .Pro_Category .Category:nth-child(2) {
  position: relative;
  float: left;
  width: 34%;
  height: 250px;
  display: inline-block;
}

.pro_category .Pro_Category .Category:nth-child(3) {
  position: relative;
  width: 34%;
  display: inline-block;
  height: 250px;
  margin-left: 2%;
}

.pro_category .Pro_Category .Category:last-of-type {
  position: relative;
  width: 28%;
  display: inline-block;
  top: 0;
  position: absolute;
  right: 0;
}

.pro_category .Pro_Category .Category img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.pro_category .Pro_Category .Category:hover img {
  transform: scale(1.05);
}

.pro_category .Pro_Category .Category .Category_Title {
  display: inline-block;
  position: absolute;
  bottom: 2em;
  left: 3em;
  color: #fff;
}

.pro_category .Pro_Category .Category:first-of-type .Category_Title {
  color: #000;
}

.pro_category .Pro_Category .Category .Category_Title .Category_znTitle {
  font-size: 18px;
  height: 20px;
  letter-spacing: 3px;
}

.pro_category .Pro_Category .Category .Category_Title .Category_enTitle {
  font-size: 12px;
  margin-top: 0;
  -webkit-transform-origin-x: 0;
  -webkit-transform: scale(0.7);
}

/*lists_product category*/
.lpro_category {
  position: relative;
  top: 5em;
  width: 1400px;
  margin: 0 auto;
}

.lpro_category .Pro_Category {
  min-height: 550px;

}

.lpro_category .Pro_Category .Category {
  overflow: hidden;
}

.lpro_category .Pro_Category .Category:first-of-type {
  position: absolute;
  width: 70%;
  display: inline-block;
  margin-bottom: 2%;
  top: 0;
}

.lpro_category .Pro_Category .Category:nth-child(2) {
  position: absolute;
  /* float: left; */
  width: 34%;
  /* display: inline-block; */
  /* height: auto; */
  top: 345px;
}

.lpro_category .Pro_Category .Category:nth-child(3) {
  position: absolute;
  width: 34%;
  top: 345px;
  left: 36%;
}

.lpro_category .Pro_Category .Category:last-of-type {
  position: relative;
  width: 28%;
  display: inline-block;
  top: 0;
  position: absolute;
  right: 0;
  height: 596px;
}

.lpro_category .Pro_Category .Category img {
  width: 100%;
  min-height: 100%;
  object-fit: cover;
}

.lpro_category .Pro_Category .Category:hover img {
  transform: scale(1.05);
}

.lpro_category .Pro_Category .Category .Category_Title {
  display: inline-block;
  position: absolute;
  bottom: 2em;
  left: 3em;
  color: #fff;
}

.lpro_category .Pro_Category .Category:first-of-type .Category_Title {
  color: #fff;
}

.lpro_category .Pro_Category .Category .Category_Title .Category_znTitle {
  font-size: 16px;
  height: 20px;
  letter-spacing: 1px;
}

.lpro_category .Pro_Category .Category .Category_Title .Category_enTitle {
  font-size: 12px;
  margin-top: -2px;
  -webkit-transform-origin-x: 0;
  -webkit-transform: scale(0.7);
}



/*show*/
.show {
  width: 100%;
  position: relative;
  margin-top: 16em;
}

.show .Show_Banner {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.show .Show_Banner img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.show .Show_Con {
  position: absolute;
  width: 18%;
  height: 290px;
  background: #fff;
  z-index: 3;
  left: 15em;
  top: 50%;
  transform: translateY(-50%);
  padding: 5em 4em 4em;
  line-height: 1.6;
  transition: box-shadow 1.1s;
}

.show .Show_Con:hover {
  box-shadow: 0 6px 16px 1px #888888
}

.show .Show_Con .Show_liae {
  width: 13%;
  height: 2px;
  background: #333333;
  margin-bottom: 1em;
}

.show .Show_Con .Show_Title {
  font-size: 22px;
  height: 29px;
  letter-spacing: 2px;
}

.show .Show_Con .Show_enTitle {
  font-size: 12px;
  tra-webkit-transform: scale(0.9);
}

.show .Show_Con .Show_Intro {
  margin: 6px 0;
  font-size: 14px;
  letter-spacing: 2px;
}

.show .Show_Con .Show_More {
  display: inline-block;
  border: 1px solid #333333;
  padding: 0px 16px;
  position: absolute;
  bottom: 5.5em;
  font-size: 9px;
  height: 23px;
  line-height: 21px;
  width: 70px;
}




/*about*/
.about {
  width: 100%;
  position: relative;
  margin-top: 3em;
}

.about .Brand_Banner {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.about .Brand_Banner img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.about .Brand_Con {
  height: 169px;
  background: #fff;
  width: 58%;
  left: 50%;
  transform: translateX(-50%);
  bottom: -9em;
  z-index: 3;
  position: absolute;
  padding: 38px;
  line-height: 1.6;
  transition: box-shadow 1.1s;
}

.about .Brand_Con:hover {
  box-shadow: 0 6px 16px 1px #888888;
}

.about .Brand_Con {
  height: 200px;
  background: #fff;
  width: 42%;
  left: 50%;
  transform: translateX(-50%);
  bottom: -9em;
  z-index: 3;
  position: absolute;
  padding: 4em 5em 2em 9em;
  line-height: 1.6;
  transition: box-shadow 1.1s;
}

.about .Brand_Con:hover {
  box-shadow: 0 6px 16px 1px #888888
}

.about .Brand_Con .Brand_liae {
  width: 5%;
  height: 2px;
  background: #333333;
  margin-bottom: 0.3em;
}

.about .Brand_Con .Brand_Title {
  font-size: 22px;
  height: 29px;
  letter-spacing: 2px;
}

.about .Brand_Con .Brand_enTitle {
  font-size: 12px;
}

.about .Brand_Con .Brand_Intro {
  margin: 6px 0;
  font-size: 14px;
  letter-spacing: 2px;
}

.about .Brand_Con .Brand_More {
  position: absolute;
  height: 23px;
  line-height: 23px;
  right: 5em;
  bottom: 3em;
  border: 1px solid #333333;
  display: inline-block;
  padding: 0px 16px;
  font-size: 9px;
  width: 70px;
}

/*join*/
.join {
  position: relative;
  margin-top: 16em;
}

.join .Join {
  position: relative;
  height: 680px;
}

.join .Join img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.join .Join_Title {
  position: absolute;
  left: 5em;
  bottom: 6em;
  /*background: rgba(0,0,0,.6);*/
  width: 190px;
  height: 18%;
  padding: 1.5%;
}

.join .Join_Title .Join_znTitle {
  font-size: 24px;
  color: #fff;
}

.join .Join_Title .Join_enTitle {
  font-size: 14px;
  color: #fff;
}

.joins {
  position: relative;
  margin-bottom: 8em;
}

.joins .Join {
  position: relative;
  height: 650px;
}


/*process*/
.process {
  position: relative;
  margin-top: 9em;
}

.process .Process {
  width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.process .Process .Process_liae {
  width: 27px;
  height: 2px;
  background: #595757;
  margin: 0 auto;
  margin-bottom: 1em;
}

.wline {
  border-top: 1px solid #cccc;
  width: 100%;
  height: 110px;
}

.process .Process .Process_Title {
  margin-bottom: 4em;
}

.process .Process .Process_Title .Process_znTitle {
  font-size: 22px;
}

.process .Process .Process_Title .Process_enTitle {
  font-size: 11px;
}

.process .Process img {
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

/*application*/
.application {
  position: relative;
  margin-top: 9em;
}

.application .Application {
  width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.application .Application .Application_liae {
  width: 2.3%;
  height: 2px;
  background: #666;
  margin: 0 auto;
  margin-bottom: 1em;
}

.application .Application .Application_Title {
  margin-bottom: 3em;
}

.application .Application .Application_Title .Application_znTitle {
  font-size: 22px;
}

.application .Application .Application_Title .Application_enTitle {
  font-size: 11px;
}

.application .Application .Application_form {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  align-items: center;
  width: 100%;
  -ms-flex-align: center;
}

.application .Application .Application_form .Application_form_input {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-bottom: 20px;
  width: 100%;
  text-align: center;
  -ms-flex-pack: center;
  -ms-flex-align: center;
}

.application .Application .Application_form .Application_form_input .form-input {
  margin: 0 0 30px;
  max-width: 610px;
  padding: 0 30px;
  width: 101%;
  height: 70px;
  border-color: #ffffff;
  letter-spacing: 1px;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.6;
  transition: background .3s ease, color .3s ease, border .3s ease;
  will-change: background, color, border;
  padding: 2.5rem 2.75rem;
  font-size: 1.3rem;
  color: #a9a9a9;
  background-color: #fff;
  background-image: none;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid rgba(154, 154, 154, 0.15);
  border-radius: 0;
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
}

.application .Application .Application_form .Application_form_input .form_btn {
  position: relative;
  top: 0;
  right: auto;
  bottom: auto;
  left: 0;
  z-index: auto;
  display: -ms-inline-flexbox;
  display: inline-flex;
  visibility: inherit;
  justify-content: center;
  box-sizing: border-box;
  margin: 0;
  width: 190px;
  height: 52px;
  line-height: 52px;
  border-radius: 0;
  border: 1px solid #ccc;
  background-color: #666;
  color: #fff;
  letter-spacing: 2px;
  font-size: 16px;
  cursor: pointer;
  -ms-flex-align: center;
  -ms-flex-pack: center;
}

.application .Application .Application_form .Application_formTitle {
  font-size: 12px;
  color: #999999;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #c9caca;
  font-size: 18px;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #c9caca;
  font-size: 18px;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #c9caca;
  font-size: 18px;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #c9caca;
  font-size: 18px;
}

/*recruitment*/
.recruitment {
  position: relative;
  margin-top: 16em;
}

.recruitment .Recruitment {
  position: relative;
  height: 680px;
}

.recruitment .Recruitment img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.recruitment .Rec_Title {
  position: absolute;
  left: 5em;
  bottom: 6em;
  width: 20%;
  height: 16%;
  padding: 1.5%;
}

.recruitment .Rec_Title .Rec_znTitle {
  font-size: 24px;
  color: #fff;
}

.recruitment .Rec_Title .Rec_enTitle {
  font-size: 14px;
  color: #fff;
}

.recruitment .position {
  padding: 0px !important;
  position: relative;
  width: 1200px;
  height: 220px;
  margin: 6em auto;
}

.recruitment .position .Position {
  margin: 0 3em;
}

.recruitment .position .Position .Position_Class {
  width: 31%;
  height: 125px;
  margin: 11px 9px;
  position: relative;
  float: left;
  overflow: hidden;
  text-decoration: none;
  display: inline-block;
}

.recruitment .position .Position .Position_Class:first-of-type {
  background: rgb(181, 181, 181)
}

.recruitment .position .Position .Position_Class:nth-child(2) {
  background: rgb(229, 229, 229)
}

.recruitment .position .Position .Position_Class:last-of-type {
  background: rgb(67, 67, 67)
}

.recruitment .position .Position .Position_Class:first-of-type .Position_Title {
  color: #fff
}

.recruitment .position .Position .Position_Class:nth-child(2) .Position_Title {
  color: #5a5a5a
}

.recruitment .position .Position .Position_Class:last-of-type .Position_Title {
  color: #fff
}

.recruitment .position .Position .Position_Class .Position_Title {
  position: absolute;
  bottom: 1em;
  right: 3em;
  text-align: right;
}

.recruitment .position .Position .Position_Class .Position_Title .Position_znTitle {
  font-size: 18px;
  letter-spacing: 2px;
}

.recruitment .position .Position .Position_Class .Position_Title .Position_enTitle {
  font-size: 12px;
}

.Recruitment {
  margin: 0 auto;
}

.Recruitment .Recr_Title {
  display: inline-block;
}

.Recruitment .Recr_Title p {
  font-size: 22px;
}

.Recruitment .Recr_Title .Recr_Title_Pre {
  margin-top: 10px;
}

.Recruitment .Recr_Title .Recr_Title_Pre p {
  display: inline-flex;
  margin-right: 29px;
  font-size: 12px;
}

.Recruitment .Recr_Title .Recr_Title_Pre .p {
  font-size: 16px;
}

.Recruitment .Recr_Title .Recr_Title_Pre p img {
  align-self: center;
  margin-right: 4px;
}

.Recruitment .Application {
  float: right;
  padding: 12px 40px;
  border: 1px solid #000;
  text-align: center;
  line-height: 1;
  cursor: pointer;
}

.Recruitment .Application p {
  font-size: 13px;
}

.Recruitment .Application p:first-of-type {
  font-size: 22px;
}

.Recruitment .Recr_Position {
  margin-top: 29px;
  line-height: 2;
  font-size: 14px;
}

.Recruitment .Recr_Position .Recr_Position_Title {
  font-size: 14px;
  line-height: 38px;
}

.Recruitment .Recr_Hold {
  margin-top: 29px;
  line-height: 2;
  font-size: 14px;
}

.Recruitment .Recr_Hold .Recr_Hold_Title {}

.Recruitment .Recr_xian {
  padding: 50px 0;
}

.Recruitment .Recr_xian img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

/*contact*/
.contact {
  position: relative;
}

.contact .Contact {
  position: relative;
  height: 680px;
}

.contact .Contact img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.contact .Con_Title {
  position: absolute;
  left: 5em;
  bottom: 6em;
  width: 20%;
  height: 16%;
  padding: 1.5%;
}

.contact .Con_Title .Con_znTitle {
  font-size: 24px;
  color: #fff;
}

.contact .Con_Title .Con_enTitle {
  font-size: 14px;
  color: #fff;
}

.contact .flex-item {
  width: 100%;
  display: block;
  margin: 6em auto;
  text-align: center;
  color: #595757;
  padding: 3em 0 0;
}

.contact .flex-item p {
  font-size: 13px;
  color: #333;
  margin: 1em;
}

/*content_brand*/
.brand_content {
  position: relative;
}

.brand_content .Con_img {
  position: relative;
  padding: 0 10%;
  height: 727px;
  margin-bottom: 11em;
}

.brand_content .Con_img img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.brand_content .Con_title {
  position: relative;
  display: flex;
  margin: 0 10%;
  margin-bottom: 11em;
}

.brand_content .Title {
  display: inline-block;
  text-align: left;
  padding-left: 25%;
}

.brand_content .Content_Title {
  width: 50%;
  display: inline-block;
  /*margin: 0 auto;*/
  text-align: left;
  font-size: 32px;
  color: #595757;
  line-height: 1.3;
}

.brand_content .Content_Title .Content_znTitle {
  font-size: 22px;
  letter-spacing: 2px;
}

.brand_content .Content_Title .Content_enTitle {
  font-size: 13px;
}

.brand_content .Content_line {
  width: 1200px;
  height: 2px;
  background: #999;
  margin: 3em auto;
}

.brand_content .Con_Title {
  width: 50%;
  display: inline-block;
  color: rgba(0, 0, 0, .8);
  /*margin: 0 auto;margin-right: 18em;*/
  text-align: left;
  line-height: 1.6
}

.brand_content .Con_Title .Con_znTitle {
  font-size: 13px;
  line-height: 2;
  margin-bottom: 2em;
  color: #595757;
  padding-right: 25%;
}

.brand_content .Con_Title .Con_enTitle {
  font-size: 12px;
  line-height: 2;
  color: #595757;
  padding-right: 25%;
}

.brand_content .Brand_Content {
  margin-top: 11em;
}

.brand_content .Brand_Content .Con_img .Content_Title {
  position: absolute;
  width: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 2px solid #fff;
  padding: .6em 2em;
}

.brand_content .Brand_Content .Con_img .Content_Title .Content_znTitle {
  font-size: 28px;
  color: #fff;
}

.brand_content .Brand_Content .Con_img .Content_Title .Content_enTitle {
  font-size: 18px;
  color: #fff;
}

/*content_newproduct*/
.newpor_content {}

.newpor_content .newpor_title {
  text-align: center;
  margin-bottom: 5em;
}

.newpor_content .newpor_title .newpor_title-line {
  width: 27px;
  height: 2px;
  background: #595757;
  margin: 0 auto;
  margin-bottom: 1em;
}

.newpor_content .newpor_title .newpor_zntitle {
  font-size: 22px;
  font-weight: 500;
}

.newpor_content .newpor_title .newpor_entitle {
  font-size: 13px;
  color: #666;
}

.newpor_content .newPor_Con {
  position: relative;
  /* padding: 0 5%; */
  height: auto;
  margin: 0% 10% 8% 10%;
  overflow: hidden;
}

.newpor_content .newPor_Con:last-child {
  margin: 0% 10% 8% 10%;
}

.newpor_content .newPor_Con img {
  width: 100%;
  height: auto;
  max-width: 100%;
  ;
  object-fit: cover;
}

.newpor_content .newPor_Con .newPor_Title {
  position: absolute;
  bottom: 3em;
  left: 3em;
  color: #fff;
}

.newpor_content .newPor_Con .newPor_Title .newPor_znTitle {
  font-size: 14px;
  line-height: 24px;
  border-bottom: 1px solid #fff;
}

/*.newpor_content .newPor_Con:nth-child(5) .newPor_Title .newPor_znTitle{color: #595757;border-bottom: 1px solid #595757;}*/
/*.newpor_content .newPor_Con:nth-child(5) .newPor_Title .newPor_enTitle{color: #595757;}*/
.newpor_content .newPor_Con:nth-child(5) .MORE {
  border: 1px solid #595757;
  color: #595757;
}

.newpor_content .newPor_Con .newPor_Title .newPor_enTitle {
  font-size: 12px;
  line-height: 20px;
}

/*content_product*/
.newPor_Con .MORE {
  position: absolute;
  top: 2em;
  right: 2em;
  color: #fff;
  padding: .2em 1.3em;
  border: 1px solid #fff;
}

.por_Con .MORE {
  position: absolute;
  top: 2em;
  right: 2em;
  color: #fff;
  padding: .2em 1.3em;
  border: 1px solid #fff;
}

.por_content {}

.por_content .por_Con {
  margin: 0 0 9%;
}

.por_content .por_title {
  text-align: center;
  margin-bottom: 5em;
}

.por_content .por_title .por_title-line {
  width: 27px;
  height: 2px;
  background: #595757;
  margin: 0 auto;
  margin-bottom: 1em;
}

.por_content .por_title a {
  color: #595757;
  text-decoration: none;
}

.por_content .por_title .por_zntitle {
  font-size: 22px;
  font-weight: 500;
}

.por_content .por_title .por_entitle {
  font-size: 11px;
  color: #666;
}

.por_content .Por_Content {
  position: relative;
  margin: 0 10%;
}

.por_content .Por_Content .Por_Con:first-of-type {
  position: relative;
  width: 67.3%;
  display: inline-block;
  overflow: hidden;
}

.por_content .Por_Content .Por_Con:nth-child(2) {
  position: relative;
  width: 31%;
  float: right;
  display: inline-block;
  overflow: hidden;
}

.por_content .Por_Content .Por_Con:last-of-type {
  position: absolute;
  width: 31%;
  right: 0;
  bottom: 5px;
  overflow: hidden;
  height: 48%
}

.por_content .Por_Content .Por_Con img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.por_content .Por_Content .Por_Con .Por_Title {
  position: absolute;
  left: 2em;
  bottom: 1.6em;
  color: #fff;
}

.por_content .Por_Content .Por_Con .Por_Title .Por_znTitle {
  font-size: 14px;
  line-height: 16px;
}

.por_content .Por_Content .Por_Con .Por_Title .Por_enTitle {
  font-size: 12px;
  line-height: 12px;
  letter-spacing: 0.5px;
  margin-left: -6px;
}

.por_content .Por_Content .Por_Con .Por_Title .Por_line {
  width: 5vw;
  height: 1px;
  background: #fff;
  margin: .3em 0;
}

.por_content #ruiou {
  height: 480px;
  margin: 2% 5%;
}

.por_content #ruiou .swiper-slide .Por_Con {
  overflow: hidden;
}

.por_content #ruiou .swiper-slide .Por_Con img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
  transition:0.5s
}

.por_content #ruiou .swiper-slide .Por_Con .Por_Title {
  position: absolute;
  left: 2em;
  bottom: 1.6em;
  color: #fff;
}

.por_content #ruiou .swiper-slide .Por_Con .Por_Title .Por_znTitle {
  font-size: 16px;
}

.por_content #ruiou .swiper-slide .Por_Con .Por_Title .Por_enTitle {
  font-size: 12px;
}

.por_content #ruiou .swiper-slide .Por_Con .Por_Title .Por_line {
  width: 5vw;
  height: 1px;
  background: #fff;
  margin: .3em 0;
}

.por_content .Por_Content2 {
  position: relative;
  margin: 0 10%;
}

.por_content .Por_Content2 .Por_Con {
  position: relative;
  display: inline-block;
  width: 49%;
  height: 485px;
  overflow: hidden;
  margin-bottom: 3em;
}

.por_content .Por_Content2 .Por_Con:first-of-type {
  margin-right: 2%;
}

.por_content .Por_Content2 .Por_Con:nth-child(even) {
  float: right;
}

.por_content .Por_Content2 .Por_Con img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.por_content .Por_Content2 .Por_Con .Por_Title {
  position: absolute;
  left: 2em;
  bottom: 1.6em;
  color: #fff;
}

.por_content .Por_Content2 .Por_Con .Por_Title .Por_znTitle {
  font-size: 14px;
}

.por_content .Por_Content2 .Por_Con .Por_Title .Por_enTitle {
  font-size: 12px;
  line-height: 12px;
  -webkit-transform: scale(0.9);
  letter-spacing: 0.5px;
  margin-left: -6px;
}

.por_content .Por_Content2 .Por_Con .Por_Title .Por_line {
  width: 5vw;
  height: 1px;
  background: #fff;
  margin: .3em 0;
}

.por_content .Por_Content0 {
  position: relative;
  margin: 0 10%;
  margin-bottom: 3em
}

.por_content .Por_Content0 .Por_Con {
  overflow: hidden;
}

.por_content .Por_Content0 .Por_Con img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.por_content .Por_Content0 .Por_Con .Por_Title {
  position: absolute;
  left: 2em;
  bottom: 1.6em;
  color: #fff;
}

.por_content .Por_Content0 .Por_Con .Por_Title .Por_znTitle {
  font-size: 14px;
}

.por_content .Por_Content0 .Por_Con .Por_Title .Por_enTitle {
  font-size: 12px;
  line-height: 12px;
  -webkit-transform: scale(0.9);
  letter-spacing: 0.5px;
  margin-left: -8px;
}

.por_content .Por_Content0 .Por_Con .Por_Title .Por_line {
  width: 5vw;
  height: 1px;
  background: #fff;
  margin: .3em 0;
}

.por_content .Por_Content2 .Por_Con:first-child .Por_Title {}

.por_content .Por_Content2 .Por_Con:first-child .Por_Title .Por_line {
  background: #fff;
}

.por_content .Por_Content1 {
  position: relative;
  margin: 0 10%;
}

.por_content .Por_Content1 .Por_Con:first-of-type {
  position: relative;
  width: 30%;
  float: left;
  display: inline-block;
  overflow: hidden;
}

.por_content .Por_Content1 .Por_Con:nth-child(2) {
  position: absolute;
  width: 30%;
  left: 0;
  bottom: 0;
  overflow: hidden;
}

.por_content .Por_Content1 .Por_Con:last-of-type {
  position: relative;
  width: 68%;
  margin-left: 2%;
  display: inline-flex;
  overflow: hidden;
}

.por_content .Por_Content1 .Por_Con img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.por_content .Por_Content1 .Por_Con .Por_Title {
  position: absolute;
  left: 2em;
  bottom: 1.6em;
  color: #fff;
}

.por_content .Por_Content1 .Por_Con .Por_Title .Por_znTitle {
  font-size: 14px;
}

.por_content .Por_Content1 .Por_Con .Por_Title .Por_enTitle {
  font-size: 12px;
  line-height: 12px;
  -webkit-transform: scale(0.9);
  letter-spacing: 0.5px;
  margin-left: -6px;
}

.por_content .Por_Content1 .Por_Con .Por_Title .Por_line {
  width: 5vw;
  height: 1px;
  background: #fff;
  margin: .3em 0;
}

/*content_procon*/
.procon_banner {
  margin: 0 5%;
  position: relative;
  overflow: hidden;
}

.procon_banner img {
  width: 100%;
  max-width: 100%;
  object-fit: cover;
}

.procon_banner .procon_title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  background: rgba(0, 0, 0, .3);
  padding: 3em 6em;
  text-align: center;
}

.procon_banner .procon_title .procon_zntitle {
  font-size: 23px;
}

.procon_banner .procon_title .procon_entitle {
  font-size: 18px;
}

.procon_con {
  text-align: center;
  /* width: 1200px; */
  margin: 110px 10%;
  line-height: 1.6;
}

.procon_con p {
  font-size: 13px;
  line-height: 36px;
}

.procon_con .b {
  font-size: 18px;
}

.procon_con .p {
  font-size: 13px;
  font-weight: bold;
}

.procon_con .t {
  font-size: 13px
}

.procon_con .a {
  font-size: 16px;
  font-weight: unset;
  color: #fff !important;
  background: rgb(89, 87, 88);
  display: inline-block;
  padding: 8px 40px;
  margin-bottom: 1em;
}

.procon_con .ac {
  padding: 8px 38px;
}

.procon_contitle ul li {
  width: 49%;
  height: 380px;
  display: inline-block;
}

.procon_contitle3 ul li {
  width: 47.95%
}

.procon_contitle ul li:last-child {
  float: right;
}

.procon_conF {
  margin: 5em 10% 3em;
}

.procon_conf {
  margin: 0em 10% 2%;
  height: auto;
  display: flow-root;
}

/*margin-top: 15em;*/
.procon_conf .t {
  font-size: 13px;
}

.procon_conF .item {
  height: auto;
  overflow: hidden;
  position: relative;
}

.procon_conf .item {
  height: auto;
  overflow: hidden;
  position: relative;
}

.item .p {
  position: absolute;
  bottom: 11px;
  right: 11px;
  z-index: 9999;
  color: #fff;
  font-size: 13px;
}

.m_bt3 {
  margin-bottom: 3em;
}


.procon_conF li:nth-last-child(1) {
  margin-bottom: 0;
}

.procon_conf li:nth-last-child(2) {
  margin-bottom: 0;
}

.procon_conf .itemb {
  background: #d6d6d6;
  width: 33%;
  height: 480px;
  /* margin-top: 50%; */
  /* vertical-align: middle; */
  /* display: table-cell; */
  /* vertical-align: middle; */
  /* position: relative; */
  /* display: inline-block; */
  display: flex;
  justify-content: center;
  align-items: Center;
  margin-top: 22%;
  transform: translateY(-50%);
  float: left;
  text-align: center;
  line-height: 32px;
}

.procon_conf .itemcon {
  vertical-align: middle;

}

.procon_conf .item2 {
  height: auto;
  overflow: hidden;
  margin-bottom: 0em;
  width: 67%;
  /* margin-top: 15em; */
}

.procon_conf .item img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.procon_contitle {
  margin: 2.4em 10%;
  height: 380px;
}

.procon_contitle .item {
  height: 380px;
  overflow: hidden;
}

.procon_contitle .item img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.procon_contitle .title {
  top: 50%;
  transform: translateY(-50%);
  position: relative;
  font-size: 16px;
  width: 40%;
  color: #666;
  line-height: 2;
}

.procon_contitle .title .p {
  font-size: 18px;
  font-weight: bolder;
  color: #595757;
}

.procon_video {
  margin: 0 5%;
}

.procon_video video {
  width: 100%;
}

.procon_Title {
  margin: 9em auto;
  width: 1200px;
  text-align: center;
  font-size: 16px;
  color: #666;
  line-height: 1.6;
}

.describe {
  position: relative;
  width: 1200px;
  margin: 0 auto;
}


/*content_contact*/
.contact_content {
  position: relative;
}

.contact_content .Con_img {
  position: relative;
  margin-bottom: 11em;
}

.contact_content .Con_img img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.contact_content .Contact_Title {
  position: absolute;
  width: auto;
  top: 123%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 1em 4em;
  text-align: center;
  background: #666;
}

.contact_content .Contact_Title .Contact_znTitle {
  font-size: 22px;
  color: #fff;
}

.contact_content .Contact_Title .Contact_enTitle {
  font-size: 13px;
  color: #fff;
}

.contact_mape {
  width: 1200px;
  margin: 22em auto 4em;
}

.contact_mape .flex-item {
  width: 100%;
  display: block;
  margin: 6em auto;
  text-align: center;
  color: #9a9c9e;
  padding: 3em 0 0;
}

.contact_mape .flex-item p {
  font-size: 13px;
  color: #333;
  margin: 1em;
}

/*content_join*/
.join_content {
  position: relative;
}

.join_content .Con_img {
  position: relative;
  margin-bottom: 8em;
}

.join_content .Con_img img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.join_content .Join_Title {
  width: 200px;
  /* top: 120%; */
  /* left: 50%; */
  /* transform: translate(-50%, -50%); */
  border: 2px solid #595757;
  padding: 1em 3em;
  text-align: center;
  margin: auto auto;
  margin-bottom: 8em;
  background: #595757;
}

.join_content .Join_Title .Join_znTitle {
  font-size: 22px;
  color: #fff;
}

.join_content .Join_Title .Join_enTitle {
  font-size: 13px;
  color: #fff;
}

.Join_Content {
  margin: 3em 5%;
  height: 630px;
}

.Join_Content .img_left {
  width: 30%;
  /* height: 100%; */
  float: left;
}

.Join_Content .img_left img {
  width: auto;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.Join_Content .img_right {
  width: 30%;
  /* height: 100%; */
  float: right;
}

.Join_Content .img_right img {
  width: auto;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.Join_Content .title_left {
  width: 68%;
  height: 100%;
  float: left;
  display: flex;
  padding: 0px 8em;
  background: #ddd;
}

.Join_Content .title_left .Join_Title {
  align-self: center;
  width: 84%;
  margin: 0 auto;
}

.Join_Content .title_left .Join_Title p {
  font-size: 13px;
  line-height: 25px;
}

.Join_Content .title_left .Join_Title .Join_znTitle {
  font-size: 22px;
  letter-spacing: 1px;
}

.Join_Content .title_left .Join_Title .Join_enTitle {
  font-size: 26px;
}

.Join_Content .title_left .Join_Title .Join_line {
  width: 100%;
  height: 1px;
  background: #666;
  margin-top: 1em;
  margin-bottom: 2em;
}

.Join_Content .title_left .Join_Title .Join_zncenTitle {
  font-size: 14px;
  line-height: 2.0;
  margin-bottom: 2em;
}

.Join_Content .title_left .Join_Title .Join_zncenTitle {
  font-size: 14px;
  line-height: 2.0;
}

.Join_Content .title_right {
  width: 68%;
  height: 100%;
  float: left;
  display: flex;
  padding: 0px 8em;
  background: #ddd;
  margin-left: 2%;
}

.Join_Content .title_right .Join_Title {
  align-self: center;
  width: 84%;
  margin: 0 auto;
}

.Join_Content .title_right .Join_Title p {
  font-size: 13px;
  line-height: 25px;
}

.Join_Content .title_right .Join_Title .Join_znTitle {
  font-size: 22px;
  letter-spacing: 1px;
}

.Join_Content .title_right .Join_Title .Join_enTitle {
  font-size: 26px;
}

.Join_Content .title_right .Join_Title .Join_line {
  width: 100%;
  height: 1px;
  background: #666;
  margin-top: 1em;
  margin-bottom: 2em;
}

.Join_Content .title_right .Join_Title .Join_zncenTitle {
  font-size: 14px;
  line-height: 2.0;
  margin-bottom: 2em;
}

.Join_Content .title_right .Join_Title .Join_zncenTitle {
  font-size: 14px;
  line-height: 2.0;
}

.Join_Mape {
  width: 1200px;
  margin: 0 auto;
  text-align: center;
  padding: 9em 0;
  border-bottom: 1px solid #666;
}

.Join_Mape .znMape {
  font-size: 18px;
  color: #595757;
}

.Join_Mape .enMape {
  font-size: 12px;
  color: #595757;
}

.Join_Mape .Mape {
  font-size: 12px;
  color: #595757;
  margin-top: 2em;
}

/*box-who*/
div.box-who {
  margin: 5% 10% 10% 10%;
  position: relative;
  z-index: 1;
}

.box-who .scroll {
  top: 0px;
  right: -30px;
  width: 30px;
  position: absolute;
  text-align: center;
  transform: translate3d(0, 0, 0);
  /* z-index: 8; */
  background: #888888;
  height: 140px;
  /* border-radius: 5px; */
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  padding-top: 26px;
}

.box-who .swiper-slide img {
  width: 100%;
  /*height:780px; */
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.box-who .swiper-slide .MORE {
  /* position: absolute; */
  /* top: 4em; */
  /* right: 4em; */
  color: #696968 !important;
  padding: 2px 15px;
  border: 1px solid #fff;
  width: 75px;
  font-size: 13px;
  display: inline-block;
  margin-top: 28px;
  border-radius: 5px;
  background: #eeeded;
}

.box-who .swiper-slide .MORE a {
  color: #696968 !important;
}

.box-who .swiper-slide .Banner_Title {
  position: absolute;
  color: #fff;
  font-size: 20px;
  top: 32%;
  left: 50%;
  width: 480px;
  height: 240px;
  text-align: center;
  background: #00000073;
  transform: translateY(-50%);
  transform: translateX(-50%);
}

.box-who .swiper-slide .Banner_Title a {
  color: #fff !important;
}

.box-who .swiper-slide .Banner_Title .title {
  font-size: 22px;
  margin-top: 1.1em;
  line-height: 32px;
  /* border-bottom: 1px solid #fff; */
  letter-spacing: 1px;
}

.box-who .swiper-slide .Banner_Title .etitle {
  font-size: 15px;
  margin-top: 54px;
  letter-spacing: 1px;
}

.box-who .swiper-slide .Banner_Title .etitle span span {
  display: none
}

/*div.box-who.first{  padding-bottom:100px; } */
/*div.box-who.first #Banner{height: 900px;}*/
div.box-who .info {
  width: 90%;
  text-shadow: 3px 3px 3px rgba(245, 245, 245, .3);
  position: relative;
  z-index: 10;
}

div.box-who .video-box {
  width: 620px;
  height: 612px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  background: url("../images/img_01.png")
}

div.box-who .video-box video {
  width: 100%;
  vertical-align: top;
}

div.box-who .video-box .wavy {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

div.box-who:after {
  display: block;
  content: '';
  clear: both;
}

div.box-who .info p.we {
  font-size: 26px;
  color: #008d43;
  line-height: 26px;
  padding-bottom: 12px;
}

div.box-who .info b {
  text-transform: uppercase;
  color: #595757;
  font-size: 80px;
  line-height: .82;
  display: block;
}

div.box-who .info h5 {
  font-size: 56px;
  line-height: 60px;
  color: #595757;
  text-transform: uppercase;
}

div.box-who .info span.value {
  font-size: 24px;
  color: #282828;
  font-weight: normal;
  margin-top: 20px;
}

div.box-who .info p.value {
  font-size: 18px;
}

div.box-who .info p i {
  font-weight: 300;
  font-size: 24px;
  line-height: 1.5;
  word-break: keep-all;
  word-wrap: break-word;
  display: block;
}

.news_index {
  background: #ececec;
  width: 100%;
  padding: 0 60px 0 80px;
  position: relative;
  z-index: 1;
}

@media (min-width: 1400px) {
  div.box-who .info p.we {
    font-size: 30px;
    line-height: 30px;
  }

  div.box-who .info b {
    font-size: 80px;
  }

}

@media (max-width: 1200px) {
  div.box-who {
    padding-left: 0px;
  }

  div.box-who .info b {
    font-size: 80px;
  }

  div.box-who .info p i {
    font-size: 18px;
  }

  div.box-who .info h5 {
    font-size: 36px;
    line-height: 50px;
  }

  .news_index {
    padding: 0 36px;
  }
}

@media (max-width: 860px) {
  div.box-who.first {
    height: auto;
    margin: 0;
    padding: 0 0 35px;
  }

  div.box-who {
    min-height: inherit;
  }

  div.box-who .video-box {
    display: none;
  }
}

/*手机首页*/
@media (max-width: 768px) {
  div.box-who {
    padding: 0px 5px;
    word-break: break-all;
  }

  div.box-who .video-box .wavy {
    display: none;
  }

  div.box-who .info p.we {
    font-size: 20px;
  }

  div.box-who .info b {
    font-size: 60px;
  }

  div.box-who .info h5 {
    font-size: 32px;
    line-height: 40px;
  }

  .news_index {
    padding: 0 15px;
  }

  /*box-who*/
  div.box-who {
    margin: 1% 5% 0;
    position: relative;
    z-index: 1;
  }

  .box-who .swiper-slide img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .box-who .swiper-slide .MORE {
    /* position: absolute; */
    /* top: 4em; */
    /* right: 4em; */
    color: #696968 !important;
    padding: 2px 11px;
    border: 1px solid #fff;
    width: 60px;
    font-size: 11px;
    transform: scale(.8);
    display: inline-block;
    margin-top: 6px;
    border-radius: 5px;
    background: #eeeded;
  }

  .box-who .swiper-slide .MORE a {
    color: #696968 !important;
  }

  .box-who .swiper-slide .Banner_Title {
    position: absolute;
    color: #fff;
    font-size: 20px;
    top: 50%;
    left: 50%;
    width: 63%;
    height: 111px;
    text-align: center;
    background: #00000073;
    transform: translate(-50%, -50%);
  }

  .box-who .swiper-slide .Banner_Title .title {
    font-size: 16px;
    margin-top: .3em;
    line-height: 32px;
    /* border-bottom: 1px solid #fff; */
    letter-spacing: 1px;
  }

  .box-who .swiper-slide .Banner_Title .etitle {
    font-size: 12px;
    margin-top: 11px;
    letter-spacing: 1px;
  }

  .box-who .swiper-slide .Banner_Title .etitle span {
    display: inline-block;
    width: 88px
  }

  .box-who .swiper-slide .Banner_Title .etitle span span {
    display: block;
    font-size: 12px;
  }

  .box-who .swiper-slide .Banner_Title .etitle span img {
    display: none;
  }

  /*div.box-who.first{ height: 980px; }*/
  /*div.box-who.first #Banner{height: 900px;}*/
  div.box-who .info {
    width: 90%;
    text-shadow: 3px 3px 3px rgba(245, 245, 245, .3);
    position: relative;
    z-index: 10;
  }

  div.box-who .video-box {
    width: 620px;
    height: 612px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    background: url("../images/img_01.png")
  }

  div.box-who .video-box video {
    width: 100%;
    vertical-align: top;
  }

  div.box-who .video-box .wavy {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }

  div.box-who:after {
    display: block;
    content: '';
    clear: both;
  }

  div.box-who .info p.we {
    font-size: 26px;
    color: #008d43;
    line-height: 26px;
    padding-bottom: 12px;
  }

  div.box-who .info b {
    text-transform: uppercase;
    color: #595757;
    font-size: 80px;
    line-height: .82;
    display: block;
  }

  div.box-who .info h5 {
    font-size: 56px;
    line-height: 60px;
    color: #595757;
    text-transform: uppercase;
  }

  div.box-who .info span.value {
    font-size: 24px;
    color: #282828;
    font-weight: normal;
    margin-top: 20px;
  }

  div.box-who .info p.value {
    font-size: 18px;
  }

  div.box-who .info p i {
    font-weight: 300;
    font-size: 24px;
    line-height: 1.5;
    word-break: keep-all;
    word-wrap: break-word;
    display: block;
  }

  /*brand*/
  .brand {
    position: relative;
    width: 96%;
    margin: 0 2%;
  }

  .brand .Brand_Banner {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }

  .brand .Brand_Banner img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .brand .Brand_Con {
    height: 111px;
    background: #fff;
    width: 79%;
    left: 50%;
    bottom: -8em;
    z-index: 3;
    position: absolute;
    padding: 2em 2em 2em 2em;
    line-height: 1.1;
  }

  .brand .Brand_Con:hover {
    box-shadow: 0 6px 16px 1px #888888
  }

  .brand .Brand_Con .Brand_liae {
    width: 6%;
    height: 1px;
    background: #333333;
    margin-bottom: 0.5em;
  }

  .brand .Brand_Con .Brand_Title {
    font-size: 15px;
    height: 18px;
    letter-spacing: 1px;
    font-weight: 300;
  }

  .brand .Brand_Con .Brand_enTitle {
    font-size: 12px;
    -webkit-transform: scale(0.8);
    margin-left: -11%;
  }

  .brand .Brand_Con .Brand_Intro {
    margin: 9px 0;
    font-size: 11px;
    letter-spacing: 2px;
  }

  .brand .Brand_Con .Brand_More {
    position: absolute;
    line-height: 22px;
    right: 2em;
    bottom: 2em;
    border: 1px solid #333333;
    display: inline-block;
    padding: 0px 16px;
    font-size: 9px;
    width: auto;
    -webkit-transform: scale(0.8);
  }


  /*progoods*/
  .progoods {
    position: relative;
    width: 96%;
    margin: 13em 2% 0;
  }

  .progoods .Pro_Banner {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }

  .progoods .Pro_Banner img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .progoods .Pro_Con {
    height: 111px;
    background: #fff;
    width: 79%;
    top: auto;
    left: 50%;
    transform: translateX(-50%);
    bottom: -7em;
    z-index: 3;
    position: absolute;
    padding: 2em 2em 2em 2em;
    line-height: 1.1;
    transition: box-shadow 1.1s;
  }

  .progoods .Pro_Con:hover {
    box-shadow: 0 6px 16px 1px #888888
  }

  .progoods .Pro_Con .Pro_liae {
    width: 4%;
    height: 2px;
    background: #333333;
    margin-bottom: 0.5em;
  }

  .progoods .Pro_Con .Pro_Title {
    font-size: 15px;
    height: 18px;
    letter-spacing: 1px;
    font-weight: 300;
  }

  .progoods .Pro_Con .Pro_enTitle {
    font-size: 12px;
    -webkit-transform: scale(0.8);
    margin-left: -11px;
  }

  .progoods .Pro_Con .Pro_Intro {
    margin: 9px 0;
    font-size: 11px;
    letter-spacing: 2px;
  }

  .progoods .Pro_Con .Pro_More {
    position: absolute;
    line-height: 22px;
    right: 2em;
    bottom: 2em;
    border: 1px solid #333333;
    display: inline-block;
    padding: 0px 16px;
    font-size: 9px;
    -webkit-transform: scale(0.8);
    width: auto;
  }


  /*product category*/
  .hpro_category {
    position: relative;
    top: 13em;
    width: 96%;
    margin: 0 auto;
  }

  .hpro_category .Pro_Category {
    min-height: 360px;

  }

  .hpro_category .Pro_Category .Category {
    overflow: hidden;
  }

  .hpro_category .Pro_Category .Category:first-of-type {
    position: absolute;
    width: 100%;
    display: inline-block;
    margin-bottom: 2%;
    top: 0;
  }

  .hpro_category .Pro_Category .Category:first-of-type img {
    width: 100%;
    height: 130px;
    object-fit: cover;
  }

  .hpro_category .Pro_Category .Category:nth-child(2) {
    osition: absolute;
    /* float: left; */
    width: 50%;
    /* display: inline-block; */
    /* height: auto; */
    top: 148px;
  }

  .hpro_category .Pro_Category .Category:nth-child(2) img {
    width: 100%;
    height: 85px;
    object-fit: cover;
  }

  .hpro_category .Pro_Category .Category:nth-child(3) {
    position: relative;

    width: 50%;
    display: inline-block;
    top: 250px;
    position: absolute;
    left: 0px;
  }

  .hpro_category .Pro_Category .Category:nth-child(3) img {
    width: 100%;
    height: 85px;
    object-fit: cover;
  }

  .hpro_category .Pro_Category .Category:last-of-type {
    position: relative;
    width: 46%;
    display: inline-block;
    top: 148px;
    position: absolute;
    right: 0;
  }

  .hpro_category .Pro_Category .Category:last-of-type img {
    width: 100%;
    height: 188px;
    object-fit: cover;
  }

  .hpro_category .Pro_Category .Category img {
    width: 100%;
    height: 130px;
    object-fit: cover;
  }

  .hpro_category .Pro_Category .Category:hover img {
    transform: scale(1.05);
  }

  .hpro_category .Pro_Category .Category .Category_Title {
    display: inline-block;
    position: absolute;
    bottom: .5em;
    left: 1em;
    color: #fff;
  }

  .hpro_category .Pro_Category .Category:first-of-type .Category_Title {
    color: #fff;
  }

  .hpro_category .Pro_Category .Category .Category_Title .Category_znTitle {
    font-size: 11px;
    height: 18px;
    letter-spacing: 1px;
    font-weight: 300;
  }

  .hpro_category .Pro_Category .Category .Category_Title .Category_enTitle {
    font-size: 12px;
    margin-top: -6px;
    -webkit-transform-origin-x: 0;
    -webkit-transform: scale(0.6);
  }

  .pro {
    top: 3em;
  }

  .procon_conF {
    margin: 5em 3% 2%;
  }


  /*show*/
  .show {
    width: 96%;
    position: relative;
    margin: 16em 2% 0;
  }

  .show .Show_Banner {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }

  .show .Show_Banner img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .show .Show_Con {
    height: 123px;
    background: #fff;
    width: 50%;
    left: -1px;
    bottom: -9em;
    z-index: 3;
    position: absolute;
    padding: 18px 0 0 16px;
    line-height: 1.1;
  }

  .show .Show_Con:hover {
    box-shadow: 0 6px 16px 1px #888888
  }

  .show .Show_Con .Show_liae {
    width: 11%;
    height: 1px;
    background: #333333;
    margin-bottom: 0.5em;
  }

  .show .Show_Con .Show_Title {
    font-size: 15px;
    height: 18px;
    letter-spacing: 1px;
    font-weight: 300;
  }

  .show .Show_Con .Show_enTitle {
    font-size: 11px;
    -webkit-transform: scale(0.8);
    margin-left: -11%;
  }

  .show .Show_Con .Show_Intro {
    margin: 9px 0;
    font-size: 11px;
    letter-spacing: 2px;
  }

  .show .Show_Con .Show_More {
    position: absolute;
    line-height: 22px;
    left: 9px;
    bottom: 1.3em;
    border: 1px solid #333333;
    display: inline-block;
    padding: 0px 16px;
    font-size: 9px;
    width: auto;
    -webkit-transform: scale(0.8);
  }

  .progoods .Pro_Con .Pro_liae {
    width: 6%;
    height: 1px;
    background: #333333;
    margin-bottom: 0.5em;
  }

  .progoods .Pro_Con .Pro_Title {
    font-size: 15px;
    height: 18px;
    letter-spacing: 1px;
  }

  .progoods .Pro_Con .Pro_enTitle {
    font-size: 11px;
    -webkit-transform: scale(0.8);
    margin-left: -11%;
  }


  /*our-work*/
  .our-work {
    width: 100% !important;
    margin: 1em auto;
    padding-left: 0;
    position: relative;
    z-index: 2;
  }

  .zp-slide {
    overflow: hidden;
    position: relative;
  }

  .zp-slide>ul {
    list-style: none;
    padding: 0;
    margin: 0 2% !important;
    width: 96%;
    transition: all 0.3s;
    transform: translate3d(0px, 0px, 0px);
  }

  .zp-slide>ul>li {
    float: left;
  }

  .zp-slide .item {
    display: block;
    width: 33.3% !important;
    margin: 0 0 1em !important;
  }

  .zp-slide .item:first-of-type {
    display: block;

    margin: 0;

  }

  .zp-slide .item:last-of-type {
    display: block;

    margin-right: auto;

  }

  /*about*/
  .about {
    width: 96%;
    position: relative;
    margin: 6em 2% 0;
  }

  .about .Brand_Banner {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
  }

  .about .Brand_Banner img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .about .Brand_Con {
    height: 111px;
    background: #fff;
    width: 79%;
    left: 50%;
    bottom: -8em;
    z-index: 3;
    position: absolute;
    padding: 2em 2em 2em 2em;
    line-height: 1.6;
  }

  .about .Brand_Con:hover {
    box-shadow: 0 6px 16px 1px #888888
  }

  .about .Brand_Con .Brand_liae {
    width: 6%;
    height: 1px;
    background: #333333;
    margin-bottom: 0.5em;
  }

  .about .Brand_Con .Brand_Title {
    font-size: 15px;
    height: 18px;
    letter-spacing: 1px;
    font-weight: 300;
  }

  .about .Brand_Con .Brand_enTitle {
    font-size: 11px;
    -webkit-transform: scale(0.8);
    margin-left: -11%;
  }

  .about .Brand_Con .Brand_Intro {
    margin: 9px 0;
    font-size: 12px;
  }

  .about .Brand_Con .Brand_More {
    position: absolute;
    line-height: 22px;
    right: 2em;
    bottom: 2em;
    border: 1px solid #333333;
    display: inline-block;
    padding: 0px 16px;
    font-size: 9px;
    -webkit-transform: scale(0.8);
    width: auto;
  }



  /*join*/
  .join {
    position: relative;
    margin-top:13em;
    height: 205px;
  }

  .join .Join {
    position: relative;
    height: 203PX;
    background-attachment: inherit !important;
  }

  .join .Join img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .join .Join_Title {
    position: absolute;
    left: 1em;
    bottom: 1em;
    /* background: rgba(0,0,0,.6); */
    width: 10%;
    /* height: 18%; */
    padding: 1.5%;
    WIDTH: auto;
  }

  .join .Join_Title .Join_znTitle {
    font-size: 12px;
    color: #fff;
    font-weight: 300;
  }

  .join .Join_Title .Join_enTitle {
    font-size: 12px;
    color: #fff;
    transform: scale(.7);
    -webkit-transform: scale(.7);
    margin: -4px 0 0 -17%;
  }

  .contact-address-item .bt {
    font-size: 13px !important;
    font-weight: 300 !important;
    color: #595757
  }

  .contact-address-item span {
    font-size: 11px !important;
    color: #595757 !important;
    font-weight: 300 !important;
    font-family: inherit !important
  }

  /*process*/
  .process {
    position: relative;
    margin-top: -2em;
  }

  .process .Process {
    width: 98%;
    height: 168px;
    margin: 0 auto;
    text-align: center;
  }

  .process .Process .Process_liae {
    width: 5%;
    height: 1px;
    background: #333;
    margin: 0 auto;
    margin-bottom: 1em;
  }

  .wline {
    border-top: 1px solid #ccc;
    width: 96%;
    height: 75px;
    margin: 0 2%
  }

  .process .Process .Process_Title {
    margin-bottom: 3em;
  }

  .process .Process .Process_Title .Process_znTitle {
    font-size: 13px;
    font-weight: 300;
  }

  .process .Process .Process_Title .Process_enTitle {
    font-size: 12px;
    transform: scale(.7);
    -webkit-transform: scale(.7);
  }

  .process .Process img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  /*application*/
  .application {
    position: relative;
    margin-top: 11em;
  }

  .application .Application {
    width: 98%;
    margin: 0 auto;
    text-align: center;
  }

  .application .Application .Application_liae {
    width: 5%;
    height: 1px;
    background: #333;
    margin: 0 auto;
    margin-bottom: 1em;
  }

  .application .Application .Application_Title {
    margin-bottom: 3em;
  }

  .application .Application .Application_Title .Application_znTitle {
    font-size: 13px;
    font-weight: 300;
  }

  .application .Application .Application_Title .Application_enTitle {
    font-size: 12px;
    transform: scale(.7);
    -webkit-transform: scale(.7);
  }

  .application .Application .Application_form {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    align-items: center;
    width: 100%;
    -ms-flex-align: center;
  }

  .application .Application .Application_form .Application_form_input {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom: 9px;
    width: 69%;
    text-align: center;
    -ms-flex-pack: center;
    -ms-flex-align: center;
  }

  .application .Application .Application_form .Application_form_input .form-input {
    margin: 0 0 16px;
    max-width: 610px;
    padding: 0 30px;
    width: 100%;
    height: 38px;
    border-color: #ffffff;
    letter-spacing: 1px;
    font-weight: 400;
    font-size: 15px;
    line-height: 38px;
    transition: background .3s ease, color .3s ease, border .3s ease;
    will-change: background, color, border;
    padding: .5rem 2.75rem .5rem 1rem;
    color: #a9a9a9;
    background-color: #fff;
    background-image: none;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid rgba(154, 154, 154, 0.15);
    border-radius: 0;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
  }

  .application .Application .Application_form .Application_form_input .form-input::-webkit-input-placeholder {
    font-size: 11px;
  }

  .application .Application .Application_form .Application_form_input .form_btn {
    position: relative;
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
    z-index: auto;
    display: -ms-inline-flexbox;
    display: inline-flex;
    visibility: inherit;
    justify-content: center;
    box-sizing: border-box;
    margin: 0;
    width: 125px;
    height: 35px;
    line-height: 35px;
    border-radius: 0;
    border: 1px solid #ccc;
    background-color: #666;
    color: #fff;
    letter-spacing: 2px;
    font-size: 13px;
    cursor: pointer;
    -ms-flex-align: center;
    -ms-flex-pack: center;
  }

  .application .Application .Application_form .Application_formTitle {
    font-size: 11px;
    font-weight: 300;
    color: #999999;
    transform: scale(.8);
  }

  input::-webkit-input-placeholder,
  textarea::-webkit-input-placeholder {
    color: #c9caca;
    font-size: 18px;
  }

  input:-moz-placeholder,
  textarea:-moz-placeholder {
    color: #c9caca;
    font-size: 18px;
  }

  input::-moz-placeholder,
  textarea::-moz-placeholder {
    color: #c9caca;
    font-size: 18px;
  }

  input:-ms-input-placeholder,
  textarea:-ms-input-placeholder {
    color: #c9caca;
    font-size: 18px;
  }

  /*recruitment*/
  .recruitment {
    position: relative;
    margin-top: 6em;
  }

  .recruitment .Recruitment {
    position: relative;
    height: 203px;
    background-attachment: inherit !important;
  }

  .recruitment .Recruitment img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .recruitment .Rec_Title {
    position: absolute;
    left: 1em;
    width: 30%;
    height: 16%;
    padding: 1.5%;
    top: 10em
  }

  .recruitment .Rec_Title .Rec_znTitle {
    font-size: 12px;
    color: #fff;
    font-weight: 300;
  }

  .recruitment .Rec_Title .Rec_enTitle {
    font-size: 12px;
    color: #fff;
    transform: scale(.7);
    -webkit-transform: scale(.7);
    margin: -4px 0 0 -17%;
  }

  .recruitment .position {
    position: relative;
    width: 96%;
    height: 99px;
    margin: 4em 2% 0;
  }

  .recruitment .position .Position {
    margin: 0;
  }

  .recruitment .position .Position .Position_Class {
    width: 32%;
    height: 63px;
    margin: 0;
    position: relative;
    float: left;
    overflow: hidden;
    text-decoration: none;
    display: inline-block;
  }

  .recruitment .position .Position .Position_Class:first-of-type {
    background: rgb(181, 181, 181)
  }

  .recruitment .position .Position .Position_Class:nth-child(2) {
    background: rgb(229, 229, 229);
    margin: 0 2%;
  }

  .recruitment .position .Position .Position_Class:last-of-type {
    background: rgb(67, 67, 67)
  }

  .recruitment .position .Position .Position_Class:first-of-type .Position_Title {
    color: #fff
  }

  .recruitment .position .Position .Position_Class:nth-child(2) .Position_Title {
    color: #5a5a5a
  }

  .recruitment .position .Position .Position_Class:last-of-type .Position_Title {
    color: #fff
  }

  .recruitment .position .Position .Position_Class .Position_Title {
    position: absolute;
    width: 100%;
    bottom: .3em;
    right: .5em;
    text-align: right;
  }

  .recruitment .position .Position .Position_Class .Position_Title .Position_znTitle {
    font-size: 11px;
    letter-spacing: 2px;
    position: relative;
    top: .4rem
  }

  .recruitment .position .Position .Position_Class .Position_Title .Position_enTitle {
    font-size: 11px;
    -webkit-transform: scale(0.5);
    width: 131%;
  }

  /*contact*/
  .contact {
    position: relative;
    margin-top: 0em;
  }

  .contact .Contact {
    position: relative;
    height: 203px;
    background-attachment: inherit !important;
  }

  .contact .Contact img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-HEIGHT: 100%;
    object-fit: cover;
  }

  .contact .Con_Title {
    position: absolute;
    left: 1em;
    width: 30%;
    height: 16%;
    padding: 1.5%;
    top: 10em
  }

  .contact .Con_Title .Con_znTitle {
    font-size: 12px;
    color: #fff;
    font-weight: 300;
  }

  .contact .Con_Title .Con_enTitle {
    font-size: 12px;
    color: #fff;
    transform: scale(.7);
    -webkit-transform: scale(.7);
    margin: -4px 0 0 -17%;
  }

  .contact .flex-item {
    width: 100%;
    display: block;
    margin: 1em auto;
    text-align: center;
    color: #9a9c9e;
    padding: 3em 0 0;
  }

  .contact .flex-item p {
    font-size: 11px;
    color: #333;
    margin: 1em;
    transform: scale(.7)
  }

  /*content_brand*/
  .position {
    padding: 0 2% 21px;
    font-size: 11px
  }

  .brand_content {
    position: relative;
  }

  .brand_content .Con_img {
    position: relative;
    padding: 0;
    height: 211px;
    margin-bottom: 3em;
    background-attachment: inherit !important;
  }

  .brand_content .Con_img img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .brand_content .Con_title {
    position: relative;
    display: flex;
    margin: 0 2%;
  }

  .brand_content .Title {
    position: absolute;
    display: inline-block;
    text-align: left;
    padding-left: 0;
    top: 3%;
    left: 9%
  }

  .brand_content .Content_Title {
    position: relative;
    width: 30%;
    display: inline-block;
    margin: 0 auto;
    text-align: center;
    font-size: 32px;
    color: rgb(88, 86, 87);
    line-height: 1.3;
  }

  .brand_content .Content_Title .Content_znTitle {
    font-size: 12px;
    letter-spacing: 1px;
  }

  .brand_content .Content_Title .Content_enTitle {
    font-size: 11px;
    transform: scale(.6);
    width: 150%;
    margin-top: -3%;
    margin-left: -30%;
  }

  .brand_content .Content_line {
    width: 1200px;
    height: 2px;
    background: #999;
    margin: 3em auto;
  }

  .brand_content .Con_Title {
    width: 68%;
    display: inline-block;
    color: rgba(0, 0, 0, .8);
    margin: 0 auto;
    margin-right: 4%;
    text-align: left;
    line-height: 1.6
  }

  .brand_content .Con_Title .Con_znTitle {
    font-size: 11px;
    line-height: 2;
    margin-bottom: 0;
    color: rgb(88, 86, 87);
    padding-right: 0;
    transform: scale(.7);
    width: 139%;
    left: -19%;
    top: -5%;
    position: relative;
  }

  .brand_content .Con_Title .Con_enTitle {
    font-size: 10px;
    line-height: 1.8;
    color: rgb(88, 86, 87);
    padding-right: 0;
    transform: scale(.7);
    width: 139%;
    left: -19%;
    position: relative;
    top: -9%;
  }

  .brand_content .Brand_Content {
    margin-top: 1rem;
  }

  .brand_content .Brand_Content .Con_img .Conent_Title {
    position: absolute;
    width: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 2px solid #fff;
    padding: .6em 2em;
  }

  .brand_content .Brand_Content .Con_img .Content_Title .Content_znTitle {
    font-size: 28px;
    color: #fff;
  }

  .brand_content .Brand_Content .Con_img .Content_Title .Content_enTitle {
    font-size: 18px;
    color: #fff;
  }

  /*content_newproduct*/
  .newpor_content .newpor_title {
    text-align: center;
    margin-bottom: 3em;
  }

  .newpor_content .newpor_title .newpor_title-line {
    width: 4%;
    height: 1px;
    background: #595757;
    margin: 0 auto;
    margin-bottom: 1em;
  }

  .newpor_content .newpor_title .newpor_zntitle {
    font-size: 15px;
    font-weight: 400;
  }

  .newpor_content .newpor_title .newpor_entitle {
    font-size: 11px;
    color: #666;
    -webkit-transform: scale(0.8);
  }

  .newpor_content .newPor_Con {
    position: relative;
    /* padding: 0 5%; */
    height: auto;
    margin: 6% 2%;
    overflow: hidden;
    width: 96%;
  }

  .newpor_content .newPor_Con:last-child {
    width: 96%;
    margin: 6% 2%;
  }

  .newpor_content .newPor_Con img {
    width: 100%;
    height: auto;
    max-width: 100%;
    ;
    object-fit: cover;
  }

  .newpor_content .newPor_Con .newPor_Title {
    position: absolute;
    bottom: 0;
    left: .6em;
    color: #fff;
  }

  .newpor_content .newPor_Con .newPor_Title .newPor_znTitle {
    font-size: 10px;
    border: none;
    line-height: 6px
  }

  /*.newpor_content .newPor_Con:nth-child(4) .newPor_Title .newPor_znTitle::before{content:'';position:absolute;width:82%;height:1px;background:#fff;top:48%;}*/
  .newpor_content .newPor_Con .newPor_Title .newPor_enTitle {
    position: relative;
    font-size: 11px;
    transform: scale(.6);
    margin-left: -23%;
    padding-top: 0
  }

  .newpor_content .newPor_Con .newPor_Title .newPor_enTitle::before {
    content: '';
    position: absolute;
    width: 82%;
    height: 1px;
    background: #fff;
    top: 0;
  }

  .newpor_content .newPor_Con:nth-child(4) .newPor_Title .newPor_enTitle::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    background: #fff;
    top: 0;
  }

  /*.newpor_content .newPor_Con:nth-child(4) .newPor_Title .newPor_enTitle::before{content:none}*/

  .join_content .Join_Title {
    position: relative;
    display: inline-block;
    width: auto;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 2px 18px;
    margin-bottom: 0;
    line-height: 35px
  }

  .join_content .Join_Title .Join_znTitle {
    font-size: 15px !important;
    border: none
  }

  .join_content .Join_Title .Join_enTitle {
    font-size: 11px;
    display: none
  }

}

@media (max-width: 375px) {

  .position {
    padding: 23px 2% 21px
  }

  div.box-who.first {
    margin: 0;
    padding: 0 0 35px;
  }

  div.box-who .info p.we {
    font-size: 16px;
  }

  div.box-who .info b {
    font-size: 38px;
  }

  div.box-who .info p.value {
    font-size: 16px;
  }

  div.box-who .info span.value {
    font-size: 20px;
  }

  div.box-who .info p i {
    font-size: 16px;
  }

  .news_index {
    padding: 0px;
  }
}

@media (max-width: 320px) {
  div.box-who .info b {
    font-size: 32px;
  }

  div.box-who .info span.value {
    font-size: 18px;
  }
}

/*our-work*/
div.our-work {
  width: 1200px;
  margin: 9em auto;
  padding-left: 0;
  position: relative;
  z-index: 2;
}

div.our-work .tits {
  position: absolute;
  top: -80px;
  font-size: 28px;
  line-height: 80px;
  text-transform: uppercase;
}

div.our-work .inner {
  width: 100%;
  overflow: hidden;
}

div.our-work .item {
  display: block;
}

div.our-work .item:after {
  display: block;
  content: '';
  clear: both;
}

div.our-work .item a.link {
  display: block;
}

div.our-work .item dl {
  width: 33.33%;
  overflow: hidden;
  position: relative;
  float: left;
}

div.our-work .item dl dt {
  width: 100%;
  font-weight: normal;
  overflow: hidden;
  position: relative;
}

div.our-work .item dl dt img {
  width: 100%;
}

div.our-work .item dl dt span.thumb {
  position: relative;
  z-index: 1;
}

div.our-work .item dl dt span.thumb-logo {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, .3);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  /* transition: all 0.5s linear 0s;
    -moz-transition: all 0.5s linear 0s;
    -webkit-transition: all 0.5s linear 0s;
    -o-transition: all 0.5s linear 0s;*/
  transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  -webkit-transition: all 0.3s linear 0s;
  -o-transition: all 0.3s linear 0s;
}

div.our-work .item dl dt span.thumb-logo img {
  width: auto;
  max-width: 80%;
}

div.our-work .item dl dt span.tag {
  display: inline-block;
  font-size: 14px;
  line-height: 14px;
  padding: 10px 15px;
  color: #FFF;
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 10;
  border: 1px solid #FFF;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

div.our-work .item dl dt span.tag:hover {
  background-color: rgba(0, 0, 0, .2);
}

div.our-work .item a:hover dl span.thumb-logo {
  /*top: -100%; left: -100%;*/
  -webkit-transform: scale3d(0, 0, 0);
  -moz-transform: scale3d(0, 0, 0);
  -o-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
}

div.our-work .item dl dd {
  width: 100%;
  color: #FFF;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  z-index: 12;
  opacity: 1;
  transition: opacity 1s;
  -webkit-transition: opacity 1s;
  /* Safari */
  transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  /* Firefox 4 */
  -webkit-transition: all 0.3s linear 0s;
  /* Safari 和 Chrome */
  -o-transition: all 0.3s linear 0s;
  /* Opera */
}

/*div.our-work .item dl:hover dd{ left:100%; }*/
div.our-work .item dl dd span.tit {
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px;
  color: #FFF;
}

div.our-work .item dl dd span.tit:hover,
div.our-work .item dl dd span.tit:focus {
  color: #FFF;
  text-decoration: none;
}

div.our-work .item dl dd h2 {
  font-size: 16px;
  line-height: 20px;
  padding: 12px 0 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*div.our-work .item dl dd h2:after{ display: block; width: 70px; height: 2px; background-color: #999; content: ''; margin-top: 15px; }*/
div.our-work .item dl dd p {
  font-size: 12px;
  line-height: 18px;
  color: #fff;
}

div.our-work .item:after {
  display: block;
  content: '';
  clear: both;
}

div.our-work .btns {
  width: 40px;
  height: 40px;
  background: #FFF no-repeat center center;
  box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  position: absolute;
  top: -20px;
  right: 20px;
  z-index: 99;
  cursor: pointer;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

div.our-work .btns.btn-left {
  right: 70px;
  background-image: url("../images/btn_left.png");
}

div.our-work .btns.btn-right {
  background-image: url("../images/btn_right.png");
}

div.our-work.sm-our-work {
  display: none;
}

@media (max-width: 1200px) {
  div.our-work {
    padding-left: 36px;
  }
}

@media (min-width: 641px) and (max-width: 1200px) {
  div.our-work .item a.link:last-child {
    display: none;
  }

  div.our-work .item dl {
    width: 50%;
  }

  div.our-work .item dl dt span.tag {
    font-size: 12px;
    line-height: 12px;
  }

  div.our-work .item dl dd h2 {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  div.our-work {
    padding-left: 0;
  }

  div.our-work .tits {
    padding-left: 15px;
  }

  div.our-work .item dl dd {
    left: 0;
  }

  div.our-work .item dl dt span.tag {
    display: none;
  }

  div.our-work .item dl dd h2 {
    font-size: 11px;
  }

  div.our-work .item dl dd h2::after {
    display: none;
  }

  div.our-work .item dl dd p {
    font-size: 11px;
    transform: scale(.6);
    margin-top: -4%;
  }

  .side {
    display: none !important;
  }
}

@media (max-width: 640px) {
  div.our-work {
    display: none;
  }

  div.our-work.sm-our-work {
    display: block;
  }

  div.our-work .item a.link:last-child {
    display: block;
  }

  div.our-work .item dl {
    width: 100%;
  }
}

div.index-empty {
  width: 100%;
  height: 90px;
}





/*------------首页修正-------*/
.zp-slide {
  overflow: hidden;
  position: relative;
}

.zp-slide>ul {
  list-style: none;
  padding: 0;
  margin: 0;
  /* width: 1600%; */
  transition: all 0.3s;
  transform: translate3d(0px, 0px, 0px);
}

.zp-slide>ul>li {
  float: left;
}

[class^=zp-slide-] {
  display: block;
  position: absolute;
  width: 30px;
  height: 30px;
  top: 50%;
  margin-top: -15px;
  left: 30px;
  opacity: 0.5;
}

[class^=zp-slide-]:hover {
  opacity: 1;
}

.zp-slide-right {
  left: auto;
  right: 30px;
}

.zp-slide .item:first-of-type {
  display: block;

  margin-left: 0;

}

.zp-slide .item:last-of-type {
  display: block;

  margin-right: 0;

}

.zp-slide .item {
  display: block;
  width: 31.333333%;
  margin: 1.5%;
}

.zp-slide .item a {
  display: block;
  width: 100%;
}

div.our-work .item dl,
.zp-slide .item dt,
.zp-slide .item dd {
  width: 100%;
}

.zp-slide .item dd {
  padding-left: 20px;
  padding-right: 20px;
}

.zp-slide ul:after {
  display: block;
  content: '';
  clear: both;
}

div.our-work .inner {
  overflow: visible;
}

@media (max-width: 768px) {
  div.our-work {
    position: static;
    margin: 3em 0;
  }

  div.our-work .tits {
    position: static;
  }

  div.our-work .inner {
    position: relative;
  }

  .zp-slide .item dd {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 640px) {
  div.our-work {
    display: block;
  }
}


/*---------//end--首页修正-------*/


/*we-node*/
div.box-who.we-node {
  padding-bottom: 0;
  padding-right: 80px;
}

div.box-who.we-node .info {
  width: 1000px;
}

div.box-who.we-node .left,
div.box-who.we-node .right {
  width: 50%;
  position: relative;
  z-index: 10;
}

div.box-who.we-node .left {
  float: left;
}

div.box-who.we-node .right {
  float: right;
}

div.box-who.we-node div.thumb {
  width: 100%;
  overflow: hidden;
  display: block;
}

div.box-who.we-node div.thumb img {
  width: 100%;
}

div.box-who.we-node .text {
  width: 60%;
  height: 420px;
  color: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

div.box-who.we-node .text strong {
  font-size: 72px;
  padding: 0 15px;
  line-height: 72px;
  font-weight: normal
}

div.box-who.we-node .text strong em {
  font-style: normal
}

div.box-who.we-node .text strong span {
  font-size: 30px;
  margin-left: 6px;
}

div.box-who.we-node .text p {
  font-size: 18px;
  padding: 0 15px;
}

div.box-who.we-node .left .text {
  background-color: #333;
  float: right;
}

div.box-who.we-node .right .text {
  background-color: #008d43;
}

div.box-who.we-node .text.sm-hover {
  display: none;
}

div.box-who.we-node .list {
  padding: 150px 0 0;
  position: relative;
  z-index: 1;
}

div.box-who.we-node .list:before {
  display: block;
  content: 'CULTURE';
  font-size: 270px;
  line-height: 270px;
  color: #ededed;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 1;
}

div.box-who.we-node .list:after,
div.box-who.we-node .left:after,
div.box-who.we-node .right:after {
  display: block;
  content: '';
  clear: both;
}

@media (max-width: 1400px) {
  div.box-who.we-node .list:before {
    font-size: 210px;
    line-height: 210px;
  }
}

@media (max-width: 1200px) {
  div.index-empty {
    display: none;
  }

  div.box-who.we-node {
    padding-top: 50px;
    padding-right: 36px;
  }

  div.box-who.we-node .info {
    width: 100%;
    padding-right: 30px;
  }

  div.box-who.we-node .list {
    padding: 90px 0 0;
  }

  div.box-who.we-node .list:before {
    font-size: 160px;
    line-height: 160px;
  }

  div.box-who.we-node .text {
    height: 300px;
  }

  div.box-who.we-node .text strong {
    font-size: 42px;
  }

  div.box-who.we-node .text p {
    font-size: 14px;
  }
}

@media (max-width: 980px) {
  div.box-who.we-node .left {
    padding-bottom: 50%;
  }

  div.box-who.we-node .right {
    padding-top: 50%;
  }

  div.box-who.we-node .text {
    width: 100%;
    height: 50%;
    position: absolute;
  }

  div.box-who.we-node .left .text {
    left: 0;
    bottom: 0;
  }

  div.box-who.we-node .right .text {
    top: 0;
    right: 0;
  }
}

@media (max-width: 860px) {
  div.box-who.we-node {
    padding-bottom: 0;
  }
}

@media (max-width: 768px) {
  div.box-who.we-node {
    padding: 0;
  }

  div.box-who.we-node .info {
    padding: 45px 15px 35px;
  }

  div.box-who.we-node .list {
    padding-top: 35px;
  }

  div.box-who.we-node .list:before {
    display: none;
  }
}

@media (max-width: 560px) {
  div.box-who.we-node .list {
    padding-left: 15px;
  }

  div.box-who.we-node {
    padding: 15px 15px 15px 0;
  }

  div.box-who.we-node .left,
  div.box-who.we-node .right {
    width: 100%;
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);
  }

  div.box-who.we-node div.thumb {
    width: 100%;
  }

  div.box-who.we-node .left {
    padding-bottom: 0;
  }

  div.box-who.we-node .right {
    padding-top: 0;
    margin-top: 30px;
  }

  div.box-who.we-node .right .text,
  div.box-who.we-node .left .text {
    display: none;
  }

  div.box-who.we-node .text.sm-hover {
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position:
      static;
  }

  div.box-who.we-node .left .text.sm-hover {
    background-color: #008d43;
  }

  div.box-who.we-node .right .text.sm-hover {
    background-color: #333;
  }
}

@media (max-width: 420px) {
  div.box-who.we-node .text strong {
    font-size: 30px;
    padding: 0px;
    overflow: hidden;
    line-height: 30px;
  }

  div.box-who.we-node .text strong span {
    font-size: 16px;
  }

  /*div.box-who.we-node .text p{ font-size: 12px; }*/
}

div.index-more {
  font-size: 18px;
  text-align: center;
  color: #333;
  padding: 50px 0;
}

div.index-more a {
  color: #333;
}

div.index-more a span {
  display: inline-block;
  vertical-align: middle;
}

div.index-more a:after {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  content: '';
  background:
    url("../images/btn_right.png") no-repeat center center;
  vertical-align: middle;
  border: 1px solid #333;
  margin-left: 15px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
}

div.index-more a:hover,
div.introduction a:focus {
  text-decoration: none;
  color: #666;
}

div.index-more a:hover:after {
  transform: rotate(360deg) scale(1.2);
  -webkit-transform: rotate(360deg) scale(1.2);
  -moz-transform: rotate(360deg) scale(1.2);
  -o-transform: rotate(360deg) scale(1.2);
  -ms-transform: rotate(360deg) scale(1.2);
}

div.index-more.we-node {
  padding: 40px 0;
}

@media (max-width: 768px) {
  div.index-more.we-node {
    visibility: hidden !important;
    padding: 0px;
  }
}


/*customer-list*/
div.customer-list {
  width: 100%;
  overflow: hidden;
  background-color: #1c1e1f;
}

div.customer-list .title {
  width: 800px;
  margin: 0 auto;
  padding: 120px 20px 60px 20px;
  text-align: center;
}

div.customer-list .title h5 {
  font-size: 24px;
  color: #008d43;
}

div.customer-list .title h2 {
  font-size: 56px;
  line-height: 80px;
  color: #FFF;
  text-transform: uppercase
}

div.customer-list .title p {
  font-size: 16px;
  padding: 15px 0;
  line-height: 24px;
  color: #FFF;
}

div.customer-list div.index-more {
  padding: 40px 0 90px 0;
}

div.customer-list div.index-more a {
  color: #FFF;
}

div.customer-list div.index-more a:after {
  border-color: #FFF;
  background-image: url("../images/right.png");
}

div.customer-list ul.link-list {
  width: 100%;
  background: no-repeat center center / cover;
}

div.customer-list ul.link-list li {
  width: 25%;
  text-align: center;
  padding: 45px 15px;
  float: left;
}

/*div.customer-list ul.link-list li img{ max-width: 100%; }*/

div.customer-list ul.link-list:after {
  display: block;
  content: '';
  clear: both;
}


.icon-box-text .icon {
  margin: 0 0 5px;
  display: inline-block;
  line-height: 70px;
  vertical-align: middle;
  font-size: 50px;
  text-align: inherit;
  white-space: nowrap;
}

.icon-box-text .icon .st0 {
  fill: #008d43;
}

.icon-txt-center h3 {
  font-size: 16px;
  margin: 0;
  color: #fff;
  clear: both;
  font-weight: 700;
  text-align: inherit;
  line-height: 1.2;
  position: relative;
}

.icon-txt-center p {
  display: block;
  margin-top: 10px;
  color: #999
}

@media (max-width: 1200px) {
  div.customer-list .title {
    padding: 100px 20px 60px;
  }

  div.customer-list .title h5 {
    font-size: 21px;
  }

  div.customer-list .title h2 {
    font-size: 36px;
    line-height: 60px;
  }


}

@media (max-width: 768px) {
  div.customer-list .title {
    width: 100%;
    padding: 60px 15px;
  }

  div.customer-list .title h5 {
    font-size: 18px;
  }

  div.customer-list .title h2 {
    font-size: 32px;
    line-height: 50px;
  }

  div.customer-list .title p {
    font-size: 14px;
    padding: 8px 0;
  }

  div.customer-list ul.link-list li {
    width: 50%;
    padding: 15px;
  }

  div.customer-list div.index-more {
    visibility: hidden !important;
    padding: 15px 0;
  }
}

@media (max-width: 320px) {
  div.customer-list ul.link-list li {
    width: 100%;
    padding: 15px;
  }
}

/*index-bottom*/
div.index-bottom {
  width: 100%;
  padding: 100px 80px 70px;
  background-color: #f5f5f5;
  position: relative;
  z-index: 10;
}

div.index-bottom .item {
  width: 50%;
  text-align: center;
  background-color: #008d43;
  color: #FFF;
  position: relative;
  float: left;
}

div.index-bottom .inner {
  width: 100%;
  padding: 100px 0;
  overflow: hidden;
}

div.index-bottom .item:first-child {
  background-color: #FFF;
  color: #000;
}

div.index-bottom .item:before {
  display: block;
  content: '';
  width: 230px;
  height: 120px;
  background: url("../images/wavy2.png") no-repeat;
  position:
    absolute;
  top: -60px;
  left: 50%;
  margin-left: -115px;
  z-index: 10;
}

div.index-bottom .item:first-child:before {
  background-image: url("../images/wavy.png");
}

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

div.index-bottom .item p {
  font-size: 14px;
  color: #CCC;
}

div.index-bottom .item span {
  font-size: 36px;
  color: #FFF;
  padding: 12px 0;
  display: block;
}

div.index-bottom .item a.more {
  display: inline-block;
  width: 40px;
  height: 40px;
  border: 1px solid #FFF;
  margin-top: 12px;
  background:
    url("../images/right.png") no-repeat center center;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
  overflow: hidden;
  text-indent: -99999px;
  font-size: 0px;
}

div.index-bottom .item a.more:hover {
  transform: rotate(360deg) scale(1.2);
  -webkit-transform: rotate(360deg) scale(1.2);
  -moz-transform: rotate(360deg) scale(1.2);
  -o-transform: rotate(360deg) scale(1.2);
  -ms-transform: rotate(360deg) scale(1.2);
}

div.index-bottom .item:first-child p {
  color: #CCC;
}

div.index-bottom .item:first-child span {
  color: #000;
}

div.index-bottom .item:first-child a.more {
  border-color: #000000;
  background-image: url("../images/btn_right.png");
}

div.index-bottom .item:hover {
  background-color: #333;
}

div.index-bottom .item:hover:before {
  background-image: url("../images/wavy.png");
}

div.index-bottom .item:first-child:hover span {
  color: #FFF;
}

div.index-bottom .item:first-child:hover a.more {
  border-color: #FFF;
  background-image: url("../images/right.png");
}

@media(max-width:1440px) {
  div.index-bottom .inner {
    padding: 70px 0;
  }
}

@media (max-width: 1200px) {
  div.index-bottom {
    padding: 80px 36px 50px;
  }

  div.index-bottom .item:before {
    width: 180px;
    height: 100px;
    top: -50px;
    margin-left: -90px;
  }

}

@media (max-width: 1024px) {
  div.index-bottom .inner {
    padding: 50px 0;
  }
}

@media (max-width: 768px) {
  div.index-bottom {
    padding: 60px 15px;
  }

  div.index-bottom .item {
    box-shadow: 0 0 6px rgba(0, 0, 0, .2);
    margin-bottom: 0;
  }

  div.index-bottom .inner {
    padding: 40px 0;
  }

  div.index-bottom .item:before {
    display: none;
  }

  div.index-bottom .item span {
    font-size: 26px;
  }

  div.index-bottom .item p {
    display: none;
  }

  div.index-bottom .item a.more {
    width: 30px;
    height: 30px;
  }
}

@media (max-width: 420px) {
  div.index-bottom {
    padding: 30px 15px 30px 15px;
  }

  div.index-bottom .item {
    width: 100%;
    float: none;
    box-shadow: 0 0 6px rgba(0, 0, 0, .2);
    margin-bottom: 0;
  }

  div.index-bottom .item:before {
    display: none;
  }

  div.index-bottom .item span {
    font-size: 26px;
  }

  div.index-bottom .item p {
    display: none;
  }

  div.index-bottom .item a.more {
    width: 30px;
    height: 30px;
  }
}

@media (max-width: 375px) {
  div.index-bottom .inner {
    padding: 30px 0;
  }
}


/*touch_idea*/
div.touch_idea {
  width: 100%;
}

div.touch_idea .section {
  width: 100%;
  height: 100%;
  padding: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: no-repeat center center / cover;
}

div.touch_idea .section .icon {
  display: inline-block;
  margin: 15px 0;
}

div.touch_idea .section .icon img {
  max-width: 100%;
}

div.touch_idea .section h1 {
  display: black;
  font-size: 32px;
  line-height: 32px;
  padding: 10px 0;
  color: #FFF;
  font-weight: bold
}

div.touch_idea .section h3 {
  display: black;
  font-size: 18px;
  line-height: 18px;
  padding: 10px 0 20px;
  color: #ccc;
}

div.touch_idea .section p {
  display: black;
  font-size: 14px;
  line-height: 32px;
  color: #FFF;
  text-align: center;
}

div.touch_idea .section.touch_bg_01 {
  background-image: url("../images/banner_01.jpg");
}

div.touch_idea .section.touch_bg_02 {
  background-image: url("../images/banner_02.jpg");
}

div.touch_idea .section.touch_bg_03 {
  background-image: url("../images/banner_03.jpg");
}

div.touch_idea .section.touch_bg_04 {
  background-image: url("../images/banner_04.jpg");
}

div.touch_idea .section.touch_bg_05 {
  background-image: url("../images/banner_05.jpg");
}

div.touch_idea .section.touch_bg_06 {
  background-image: url("../images/banner_06.jpg");
}

div.touch_idea .section.touch_bg_07 {
  background-image: url("../images/banner_07.jpg");
}

ul.touch-nav {
  padding: 20px 30px 35px;
  background-color: #FFF;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
}

ul.touch-nav li {
  font-size: 14px;
  padding: 0 18px;
  float: left;
  position: relative;
}

ul.touch-nav li a {
  display: inline-block;
  color: #333;
  cursor: pointer;
}

ul.touch-nav li a:hover,
ul.touch-nav li a:focus {
  text-decoration: none;
  color: #333;
}

ul.touch-nav li a:after {
  display: block;
  content: '';
  width: 8px;
  height: 8px;
  background-color: #e6e6e6;
  position: absolute;
  left: 50%;
  margin-left:
    -4px;
  bottom: -13.5px;
  z-index: 2;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

ul.touch-nav li:before,
ul.touch-nav li:after {
  display: block;
  content: '';
  width: 50%;
  border-bottom: 1px solid #CCC;
  position: absolute;
  left: 0;
  bottom: -10px;
  z-index: 1;
}

ul.touch-nav li:after {
  left: 50%;
}

ul.touch-nav li:first-child:before {
  display: none;
}

ul.touch-nav li:last-child:after {
  display: none;
}

ul.touch-nav:after {
  display: block;
  content: '';
  clear: both;
}

ul.touch-nav li.active a:after {
  width: 10px;
  height: 10px;
  margin-left: -5px;
  background-color: #309646;
}

ul.touch-nav li.act a:after {
  background-color: #309646;
}

ul.touch-nav li.active:before {
  border-color: #309646;
}

ul.touch-nav li.act:before,
ul.touch-nav li.act:after {
  border-color: #309646;
}

ul.touch-nav li.act.active:after {
  border-color: #CCC;
}

@media (max-width: 768px) {
  div.touch_idea .section h1 {
    font-size: 21px;
    line-height: 21px;
    padding: 6px 0;
  }

  div.touch_idea .section h3 {
    font-size: 16px;
    line-height: 16px;
    padding: 6px 0 10px;
  }

  div.touch_idea .section p {
    font-size: 12px;
    line-height: 24px;
  }

  ul.touch-nav {
    top: 50%;
    margin-top: -25%;
    padding: 0 20px;
    background-color: transparent;
  }

  ul.touch-nav li {
    padding: 6px 0;
    float: none;
  }

  ul.touch-nav li:before,
  ul.touch-nav li:after {
    width: 0;
    height: 50%;
    border-bottom: 0;
    border-right: 1px solid #CCC;
    left: auto;
    bottom: auto;
    top: 0;
    right: 0;
  }

  ul.touch-nav li:after {
    top: 50%;
  }

  ul.touch-nav li a:hover,
  ul.touch-nav li a:focus {
    color: #FFF;
  }

  ul.touch-nav li a {
    color: #FFF;
    text-shadow: 0 0 3px rgba(0, 0, 0, .3);
    white-space: nowrap;
    padding: 0 12px;
  }

  ul.touch-nav li a span {
    display: none;
  }

  ul.touch-nav li a:after {
    left: auto;
    bottom: auto;
    top: 50%;
    margin-top: -4px;
    right: -3px;
  }

  ul.touch-nav li.active a:after {
    margin-left: 0;
    margin-top: -5px;
    right: -4px;
  }

  /*ul.touch-nav li.active a{ color: #F00; }*/
  ul.touch-nav li.active a span {
    display: inline;
  }
}

/*2019-7-21*/
.IndexService {
  background: #1c1e1f;
  width: 100%;
  padding: 0 80px;
  position: relative;
  z-index: 1;
  overflow: hidden
}

.IndexService_content {
  margin: 0 auto;
  padding: 85px 0 0 0;
  overflow: hidden;
}

.IndexService .IndexService_content .IndexService_content_title {
  text-align: center;
  padding-bottom: 55px;
}

.IndexService .IndexService_content .IndexService_content_title dd {
  color: #fff;
  text-transform: uppercase;
  font-size: 56px;
}

.IndexService .IndexService_content .IndexService_content_title dt {
  font-size: 16px;
  color: #999;
  margin-top: 10px;
  line-height: 28px;
}

.IndexService_content_body {
  display: block;
  width: 100%;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list {
  width: 25%;
  padding: 20px 30px;
  float: left;
  overflow: hidden;
  text-decoration: none;
  display: inline-block;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list:hover {
  background: #161819
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_title {
  font-size: 20px;
  color: #fff;
  text-align: center;
  margin-bottom: 15px;
  color: #008d43;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_content {
  font-size: 13px;
  color: #999;
  text-align: center;
  line-height: 26px;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification {
  padding-top: 30px;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list {
  display: inline-block;
  width: 50%;
  text-align: center;
  border-bottom: 1px solid #333;
  border-right: 1px solid #333;
  padding: 20px 0px;
  float: left;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list:nth-child(1) {
  padding-top: 10px;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list:nth-child(2) {
  padding-top: 10px;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list:nth-child(2n) {
  border-right: 0px;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list dd {
  color: #bfbfbf;
  font-size: 28px;
  transition: all 0.5s ease;
  -webkit-transform: all 0.5s ease;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list dd img {
  height: 32px;
}

.IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification .list_classification_list dt {
  color: #666;
  font-size: 14px;
  margin-top: 10px;
  transition: all 0.5s ease;
  -webkit-transform: all 0.5s ease;
}

.IndexService div.index-more {
  padding-top: 30px;
}


@media screen and (max-width:1366px) {
  .IndexService {
    padding: 0 36px;
  }

  .IndexService .IndexService_content .IndexService_content_body .content_body_list {
    padding: 10px 20px;
  }

}

@media screen and (max-width:1200px) {
  .IndexService_content {
    padding: 70px 0px 0px 0;
  }

  .IndexService .IndexService_content .IndexService_content_body .content_body_list {
    width: 50%;
    margin-bottom: 50px;
  }

  .IndexService .IndexService_content .IndexService_content_body .content_body_list .body_list_classification {
    padding-top: 20px;
  }

  .IndexService .IndexService_content .IndexService_content_title dt {
    font-size: 14px;
  }

  .IndexService div.index-more {
    padding-top: 0px;
  }
}

@media screen and (max-width:768px) {
  .IndexService {
    padding: 0 15px;
  }

  .IndexService .IndexService_content .IndexService_content_title dt {
    font-size: 12px;
  }

  .IndexService .IndexService_content .IndexService_content_body .content_body_list:before {
    content: "";
    display: block;
    width: 60px;
    height: 60px;
    margin: 10px auto;
  }

  .IndexService .IndexService_content .IndexService_content_body .ico-sv-01:before {
    background: url("../images/ico-sv-01.png")no-repeat center center;
    background-size: cover
  }

  .IndexService .IndexService_content .IndexService_content_body .ico-sv-02:before {
    background: url("../images/ico-sv-02.png")no-repeat center center;
    background-size: cover
  }

  .IndexService .IndexService_content .IndexService_content_body .ico-sv-03:before {
    background: url("../images/ico-sv-03.png")no-repeat center center;
    background-size: cover
  }

  .IndexService .IndexService_content .IndexService_content_body .ico-sv-04:before {
    background: url("../images/ico-sv-04.png")no-repeat center center;
    background-size: cover
  }
}

@media screen and (max-width:560px) {
  .IndexService {
    padding: 0 15px;
  }

  .IndexService .index-more {
    display: none
  }

  .IndexService .IndexService_content .IndexService_content_title {
    padding-bottom: 35px;
  }

  .IndexService .IndexService_content .IndexService_content_title dd {
    font-size: 32px;
  }

  .IndexService_content {
    width: 100%;
    padding: 60px 0px 30px 0;
  }

  .IndexService .IndexService_content .IndexService_content_body .content_body_list {
    width: 100%;
    padding: 20px 10px;
    float: none;
    margin: 10px 0 20px 0;
    border: 1px solid #333436
  }

  .body_list_classification .list_classification_list:nth-child(5),
  .body_list_classification .list_classification_list:nth-child(6) {
    border-bottom: none !important
  }
}

/*service-wrapper*/
div.service-wrapper {
  width: 100%;
}

div.service-wrapper .section {
  width: 100%;
}

div.service-wrapper .container {
  width: 100%;
  padding: 0 80px;
}

div.service-wrapper .section.clr-white {
  background-color: #FFF;
  box-shadow: rgba(255, 255, 255, .2);
}

div.service-wrapper .ser-title {
  width: 100%;
  padding: 120px 0 60px 0;
  position: relative;
  overflow: hidden
}

div.service-wrapper .ser-title:before {
  display: block;
  font-size: 270px;
  line-height: 270px;
  padding-left: 150px;
  position: absolute;
  left: 0;
  top:
    80px;
  z-index: 1;
  filter: alpha(opacity=5);
  -moz-opacity: 0.05;
  -khtml-opacity: 0.05;
  opacity: 0.05;
  white-space: nowrap;

}

div.service-wrapper .ser-title.service:before {
  content: 'SERVICE';
}

div.service-wrapper .ser-title.website:before {
  content: 'WEBSITE';
}

div.service-wrapper .ser-title.app:before {
  content: 'APP DEVELOPMENT';
}

div.service-wrapper .ser-title.wechat:before {
  content: 'WECHAT DEVELOPMENT';
}

div.service-wrapper .ser-title.graphic:before {
  content: 'GRAPHIC DESIGN';
}

div.service-wrapper .ser-title.webShops:before {
  content: 'WEBSHOPS';
}

div.service-wrapper .ser-title.seo:before {
  content: 'SEO';
}

div.service-wrapper .ser-title.ui:before {
  content: 'UI DESIGN';
}

div.service-wrapper .ser-title.inter:before {
  content: 'INTERNET WORK';
}

div.service-wrapper .ser-title.jobs:before {
  content: 'JOBS';
}

div.service-wrapper .ser-title.error:before {
  content: '404';
}

div.service-wrapper .ser-title.about:before {
  content: 'PROFILE';
}

div.service-wrapper .ser-title.contact:before {
  content: 'CONTACT';
}

div.service-wrapper .ser-title.case:before {
  content: 'CASES';
}

div.service-wrapper .ser-title.news:before {
  content: 'NEWS';
}

div.service-wrapper .ser-title .content {
  position: relative;
  z-index: 10;
}

div.service-wrapper .ser-title b {
  font-size: 120px;
  color: #333;
  word-break: break-all;
  font-weight: normal
}

div.service-wrapper .ser-title h4 {
  font-size: 30px;
  color: #008d43;
}

div.service-wrapper .ser-title p {
  font-size: 20px;
  color: #333;
}

div.service-wrapper .ser-title p a {
  color: #008d43;
}

div.service-wrapper .ser-title.inter h1 {
  font-size: 100px;
}

div.service-wrapper .service-list {
  width: 100%;
}

div.service-wrapper .service-list a.flex-item {
  width: 800px;
  height: 450px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 30px;
  background: #FFF no-repeat center /cover;
  box-shadow: 0 0 15px rgba(0, 0, 0, .2);
  float: left;
  margin: 20px 0 20px 40px;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
}

div.service-wrapper .service-list a.flex-item:hover,
div.service-wrapper .service-list a.flex-item:focus {
  text-decoration: none;
}

div.service-wrapper .service-list a.flex-item:nth-child(2n+1) {
  margin-left: 0;
}

div.service-wrapper .service-list a.flex-item:hover {
  transform: scale(1.02);
  -webkit-transform: scale(1.02);
  -moz-transform: scale(1.02);
  -o-transform: scale(1.02);
  -ms-transform: scale(1.02);
}

div.service-wrapper .service-list a.flex-item img {
  max-width: 60%;
  margin-bottom: 15px;
}

div.service-wrapper .service-list a.flex-item h2 {
  font-size: 26px;
  font-weight: bold;
  color: #333;
  padding: 12px 0;
  text-align: center
}

div.service-wrapper .service-list a.flex-item h2 span {
  display: none;
}

div.service-wrapper .service-list a.flex-item h2 span.en {
  display: block;
}

div.service-wrapper .service-list a.flex-item h4 {
  color: #008d43;
  font-size: 20px;
}

div.service-wrapper .service-list a.flex-item p {
  font-size: 14px;
  color: #999;
  line-height: 28px;
}

div.service-wrapper .service-list a.flex-item p.no {
  width: 100%;
  text-align: center;
  padding: 20px;
  position: absolute;
  left: 0;
  bottom: 0;
}

div.service-wrapper .service-list a.flex-item img.normal {
  display: inline;
}

div.service-wrapper .service-list a.flex-item img.hover {
  display: none;
}

div.service-wrapper .service-list a.flex-item:hover img.normal {
  display: none;
}

div.service-wrapper .service-list a.flex-item:hover img.hover {
  display: inline;
}

div.service-wrapper .service-list a.flex-item:hover h2 {
  color: #FFF;
}

div.service-wrapper .service-list a.flex-item:hover h2 span.en {
  display: none;
}

div.service-wrapper .service-list a.flex-item:hover h2 span.cn {
  display: block;
}

div.service-wrapper .service-list a.flex-item:hover p {
  color: #FFF;
}

div.service-wrapper .service-list a.flex-item:hover h4 {
  color: #FFF;
}

div.service-wrapper .service-list a.flex-item:hover:nth-child(1) {
  background-image: url("../images/s_bg_01.jpg");
}

div.service-wrapper .service-list a.flex-item:hover:nth-child(2) {
  background-image: url("../images/s_bg_02.jpg");
}

/*2019新增*/
div.service-wrapper .service-list a.flex-item:hover:nth-child(3) {
  background-image: url("../images/s_bg_07.jpg");
}

div.service-wrapper .service-list a.flex-item:hover:nth-child(4) {
  background-image: url("../images/s_bg_08.jpg");
}

/*end 2019新增*/
div.service-wrapper .service-list a.flex-item:hover:nth-child(5) {
  background-image: url("../images/s_bg_03.jpg");
}

div.service-wrapper .service-list a.flex-item:hover:nth-child(6) {
  background-image: url("../images/s_bg_04.jpg");
}

div.service-wrapper .service-list a.flex-item:hover:nth-child(7) {
  background-image: url("../images/s_bg_05.jpg");
}

div.service-wrapper .service-list a.flex-item:hover:nth-child(8) {
  background-image: url("../images/s_bg_06.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(1) {
  background-image: url("../images/job_bg_01.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(2) {
  background-image: url("../images/job_bg_02.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(3) {
  background-image: url("../images/job_bg_03.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(4) {
  background-image: url("../images/job_bg_04.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(5) {
  background-image: url("../images/job_bg_05.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(6) {
  background-image: url("../images/job_bg_06.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(7) {
  background-image: url("../images/job_bg_07.jpg");
}

div.service-wrapper.job-wrap .service-list a.flex-item:hover:nth-child(8) {
  background-image: url("../images/job_bg_08.jpg");
}

div.service-wrapper .ser-big-banner {
  width: 100%;
  padding: 80px 0;
}

div.service-wrapper .ser-big-banner img {
  width: 100%;
}

@media (max-width: 1880px) {
  div.service-wrapper .service-list a.flex-item {
    width: 48%;
    height: 420px;
    margin: 2% 0 2% 4%;
  }
}

@media (max-width: 1200px) {
  div.service-wrapper .container {
    padding: 0 36px;
  }

  div.service-wrapper .ser-title {
    padding: 60px 0 30px;
  }

  div.service-wrapper .ser-title:before {
    font-size: 160px;
    line-height: 160px;
    top: 45px;
  }

  div.service-wrapper .ser-title b {
    font-size: 80px;
  }

  div.service-wrapper .ser-title h4 {
    font-size: 18px;
  }

  div.service-wrapper .ser-title p {
    font-size: 14px;
  }

  div.service-wrapper .ser-title.inter h1 {
    font-size: 60px;
  }

  div.service-wrapper .service-list a.flex-item h2 span.en {
    font-size: 18px;
  }

  div.service-wrapper .service-list a.flex-item img {
    max-width: 50%;
  }
}

/*@media (max-width: 890px) {
    div.service-wrapper .service-list a.flex-item{ width: 100%; height: auto; margin: 3% 0; padding: 60px 15px; }
    div.service-wrapper .service-list a.flex-item p.no{  position: relative; left: 0; bottom: 0; }
}*/
@media (max-width: 768px) {

  .por_content .por_Con {
    margin: 0 0 16%;
  }

  .por_content .por_title {
    text-align: center;
    margin-bottom: 3em;
  }

  .por_content .por_title .por_title-line {
    width: 4%;
    height: 1px;
    background: #595757;
    margin: 0 auto;
    margin-bottom: 1em;
  }

  .por_content .por_title a {
    color: #595757;
    text-decoration: none;
  }

  .por_content .por_title .por_zntitle {
    font-size: 15px;
    font-weight: 400;
  }

  .por_content .por_title .por_entitle {
    font-size: 11px;
    color: #666;
    -webkit-transform: scale(0.8);
  }

  .por_content .Por_Content {
    position: relative;
    margin: 0 2%;
  }

  .por_content .Por_Content .Por_Con:first-of-type {
    position: relative;
    width: 68%;
    display: inline-block;
    overflow: hidden;
  }

  .por_content .Por_Content .Por_Con:nth-child(2) {
    position: relative;
    width: 31%;
    float: right;
    display: inline-block;
    overflow: hidden;
  }

  .por_content .Por_Content .Por_Con:last-of-type {
    position: absolute;
    width: 31%;
    right: 0;
    bottom: 0;
    overflow: hidden;
  }

  .por_content .Por_Content .Por_Con img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .por_Con .MORE {
    display: none;
  }

  .por_content .Por_Content .Por_Con .Por_Title {
    position: absolute;
    left: .6em;
    bottom: .6em;
    color: #fff;
  }

  .por_content .Por_Content .Por_Con .Por_Title .Por_znTitle {
    font-size: 10px;
  }

  .por_content .Por_Content .Por_Con .Por_Title .Por_enTitle {
    position: relative;
    width: 115%;
    font-size: 12px;
    -webkit-transform: scale(0.6);
    margin-left: -22%;
    padding-top: 1px;
  }

  .por_content .Por_Content .Por_Con .Por_Title .Por_enTitle::before {
    content: '';
    width: 86%;
    height: 1px;
    background: #fff;
    position: absolute;
    top: -3px;
  }

  .por_content .Por_Content .Por_Con .Por_Title .Por_line {
    width: 5em;
    height: 1px;
    background: #fff;
    margin: .3em 0;
    display: none
  }

  .por_content #ruiou {
    height: 480px;
    margin: 2% 5%;
  }

  .por_content #ruiou .swiper-slide .Por_Con {
    overflow: hidden;
  }

  .por_content #ruiou .swiper-slide .Por_Con img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .por_content #ruiou .swiper-slide .Por_Con .Por_Title {
    position: absolute;
    left: 2em;
    bottom: 1.6em;
    color: #fff;
  }

  .por_content #ruiou .swiper-slide .Por_Con .Por_Title .Por_znTitle {
    font-size: 16px;
  }

  .por_content #ruiou .swiper-slide .Por_Con .Por_Title .Por_enTitle {
    font-size: 12px;
  }

  .por_content #ruiou .swiper-slide .Por_Con .Por_Title .Por_line {
    width: 5vw;
    height: 1px;
    background: #fff;
    margin: .3em 0;
  }

  .por_content .Por_Content2 {
    position: relative;
    margin: 0 2%;
  }

  .por_content .Por_Content2 .Por_Con {
    position: relative;
    float: left;
    display: inline-block;
    width: 49.5% !important;
    height: 108px;
    overflow: hidden;
    margin-bottom: 1%;
  }

  .por_content .Por_Content2 .Por_Con:first-of-type {
    margin-right: 0;
  }

  .por_content .Por_Content2 .Por_Con:nth-child(even) {
    float: inherit;
    margin-left: 1%
  }

  .por_content .Por_Content2 .Por_Con img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .procon_con p {
    font-size: 11px
  }

  .procon_conf .item {
    margin-bottom: 0;
  }

  .por_content .Por_Content2 .Por_Con .Por_Title {
    position: absolute;
    left: .6em;
    bottom: .6em;
    color: #fff;
  }

  .por_content .Por_Content2 .Por_Con .Por_Title .Por_znTitle {
    font-size: 10px;
  }

  .por_content .Por_Content2 .Por_Con .Por_Title .Por_enTitle {
    position: relative;
    font-size: 12px;
    -webkit-transform: scale(0.6);
    margin-left: -24%;
    padding-top: 1px;
  }

  .por_content .Por_Content2 .Por_Con .Por_Title .Por_enTitle::before {
    content: '';
    position: absolute;
    width: 80%;
    height: 1px;
    top: -3px;
    background: #fff;
  }

  .por_content .Por_Content2 .Por_Con .Por_Title .Por_line {
    width: 5em;
    height: 1px;
    background: #fff;
    margin: .3em 0;
    display: none
  }

  .por_content .Por_Content0 {
    position: relative;
    margin: 0 2%;
    margin-top: 1% !important
  }

  .por_content .Por_Content0 .Por_Con {
    overflow: hidden;
  }

  .por_content .Por_Content0 .Por_Con img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .por_content .Por_Content0 .Por_Con .pc_b {
    display: none
  }

  .por_content .Por_Content0 .Por_Con .Por_Title {
    position: absolute;
    left: .6em;
    bottom: .6em;
  }

  .por_content .Por_Content0 .Por_Con .Por_Title .Por_znTitle {
    font-size: 10px;
  }

  .por_content .Por_Content0 .Por_Con .Por_Title .Por_enTitle {
    font-size: 12px;
    -webkit-transform: scale(0.6);
    margin-left: -25%;
    position: relative;
    padding-top: 1px;
  }

  .por_content .Por_Content0 .Por_Con .Por_Title .Por_enTitle::before {
    position: absolute;
    content: '';
    width: 79%;
    height: 1px;
    top: -3px;
    background: #fff;
  }

  .por_content .Por_Content0 .Por_Con .Por_Title .Por_line {
    width: 8em;
    height: 1px;
    background: #fff;
    margin: .3em 0;
    display: none
  }

  .por_content .Por_Content2 .Por_Con:first-child .Por_Title {}

  .por_content .Por_Content2 .Por_Con:first-child .Por_Title .Por_line {
    display: none;
  }

  .por_content .Por_Content1 {
    position: relative;
    margin: 0 2%;
  }

  .por_content .Por_Content1 .Por_Con:first-of-type {
    position: relative;
    width: 31%;
    float: left;
    display: inline-block;
    overflow: hidden;
  }

  .por_content .Por_Content1 .Por_Con:nth-child(2) {
    position: absolute;
    width: 31%;
    left: 0;
    bottom: 0;
    overflow: hidden;
  }

  .por_content .Por_Content1 .Por_Con:last-of-type {
    position: relative;
    width: 68%;
    margin-left: 1%;
    display: inline-flex;
    overflow: hidden;
  }

  .por_content .Por_Content1 .Por_Con img {
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
  }

  .por_content .Por_Content1 .Por_Con .Por_Title {
    left: .6em;
    bottom: 0.6em;
  }

  .por_content .Por_Content1 .Por_Con .Por_Title .Por_znTitle {
    font-size: 10px;
  }

  .por_content .Por_Content1 .Por_Con .Por_Title .Por_enTitle {
    position: relative;
    font-size: 11px;
    -webkit-transform: scale(0.6);
    margin-left: -25%;
    padding-top: 1px;
  }

  .por_content .Por_Content1 .Por_Con .Por_Title .Por_line {
    display: none
  }

  .por_content .Por_Content1 .Por_Con .Por_Title .Por_enTitle::before {
    content: '';
    position: absolute;
    width: 80%;
    height: 1px;
    background: #fff;
    top: 0;
  }

  .item .p {
    bottom: 5px;
    right: 6px;
    font-size: 10px
  }

  div.footer a.btm-logo {
    margin-left: 3px;
  }


  div.footer .flex-item.tl {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 4rem;
    transform: scale(.6)
  }

  div.footer .flex-item.tr {
    display: block;
    width: 100%;
    text-align: center;
    position: absolute;
    top: 0;
  }

  div.footer .flex-item .nav_title {
    display: none;
  }

  .contact_mape {
    width: 100%;
    margin: 6em auto 0;
  }

  .contact_mape .ueditor_baidumap {
    width: 100%;
    height: 50vh;
  }



  .por_content {
    height: auto !important;
  }

  .lpro_category {
    width: 100%;
    margin: 0 6px;
  }

  .lpro_category .Pro_Category {
    min-height: 169px;
  }

  .lpro_category .Pro_Category .Category:first-of-type {
    width: 61%;
  }

  .lpro_category .Pro_Category .Category:nth-child(2),
  .lpro_category .Pro_Category .Category:nth-child(3) {
    width: 30%;
    top: 79px;
  }

  .lpro_category .Pro_Category .Category:nth-child(3) {
    left: 31%;
  }

  .lpro_category .Pro_Category .Category:last-of-type {
    width: 35%;
    height: 138px;
    right: 12px;
  }

  .lpro_category .Pro_Category .Category .Category_Title {
    bottom: 0;
    left: .6rem;
  }

  .lpro_category .Pro_Category .Category .Category_Title .Category_znTitle {
    font-size: 11px;
  }

  .lpro_category .Pro_Category .Category .Category_Title .Category_enTitle {
    width: 138px;
    margin-top: -9px;
    transform: scale(.5);
  }
}

@media (max-width: 375px) {
  body {
    padding-top: 45px;
  }

  div.header {
    height: 45px;
  }

  div.header a.logo {
    height: 45px;
  }

  div.header a.logo span {
    width: 45px;
  }

  div.header a.logo span:last-child {
    line-height: 45px;
  }
}

@media (max-width: 768px) {
  div.service-wrapper .container {
    padding: 0 15px;
  }

  div.service-wrapper .ser-title {
    padding: 45px 0 25px 0;
  }

  div.service-wrapper .ser-title:before {
    font-size: 110px;
    line-height: 110px;
    top: 35px;
  }

  div.service-wrapper .ser-title b {
    font-size: 50px;
    padding: 5px 0;
  }

  div.service-wrapper .ser-title h4 {
    font-size: 16px;
  }

  div.service-wrapper .ser-title p {
    font-size: 12px;
  }

  div.service-wrapper .ser-title.inter h1 {
    font-size: 40px;
  }

  div.service-wrapper .ser-big-banner {
    padding: 45px 0;
  }

  div.service-wrapper .service-list a.flex-item img {
    max-width: 30%;
  }

  div.service-wrapper .service-list a.flex-item {
    height: 320px;
  }

  div.service-wrapper .service-list a.flex-item p {
    font-size: 12px;
  }

  div.service-wrapper .service-list a.flex-item h2 {
    font-size: 20px;
  }

  div.service-wrapper .service-list a.flex-item h4 {
    font-size: 16px;
  }


  .joins {
    margin-bottom: 6em;
  }

  .join_content {
    margin-bottom: -9px
  }

  .joins .Join {
    height: 222px;
    background-attachment: inherit !important
  }

  .Join_Content {
    margin: 2em 2%;
    height: 925px;
  }

  .Join_Content .img_left img {
    width: 100%;
    height: auto;
  }

  .Join_Content .img_left {
    width: 30%;
  }

  .Join_Content .title_right {
    width: 68%;
    height: auto;
    display: block;
    padding: 5% 2% 1em;
    margin-left: 0;
    margin: 0 0 2% 2%;
  }

  .Join_Content .title_right .Join_Title {
    position: relative;
  }

  .Join_Content .title_right .Join_Title .Join_znTitle {
    font-size: 11px;
    line-height: 1.6
  }

  .Join_Content .title_right .Join_Title .ms_z {
    font-size: 11px;
    transform: scale(.5);
    width: 200%;
    left: -50%;
    position: relative;
    margin-top: -11px;
  }

  .Join_Content .title_right .Join_Title .ms_y {
    font-size: 11px !important;
    transform: scale(.3);
    position: relative;
    left: -117%;
    width: 335%;
    margin-top: -67px;
    top: 2rem
  }

  .Join_Content .title_right .Join_Title .Join_line {
    margin-top: 0.3rem;
    margin-bottom: 0rem;
    background: #999
  }

  .Join_Content .title_left {
    width: 68%;
    height: auto;
    display: block;
    padding: 5% 2% 1em;
  }

  .Join_Content .title_left .Join_Title {
    position: relative;
  }

  .Join_Content .title_left .Join_Title .Join_znTitle {
    font-size: 13px
  }

  .Join_Content .title_left .Join_Title .ms_z {
    font-size: 11px;
    transform: scale(.5);
    width: 200%;
    left: -50%;
    position: relative;
    margin-top: -20px;
  }

  .Join_Content .title_left .Join_Title .ms_y {
    font-size: 11px !important;
    transform: scale(.3);
    position: relative;
    left: -117%;
    width: 335%;
    margin-top: -84px;
  }

  .Join_Content .title_left .Join_Title .Join_line {
    margin-top: 0.3rem;
    margin-bottom: 0rem;
    background: #999
  }

  .Join_Content .img_right {
    width: 30%;
    margin: 0 0 2% 2%;
  }

  .Join_Content .img_right img {
    width: 100%;
    height: auto;
  }


  #willesPlay {
    width: 94%;
    margin: 5em 3%
  }

  .procon_conf {
    position: relative;
    margin-top: 2%;
    margin: 58px 3% 0
  }

  .pc_pt {
    margin: 2% 3% 0
  }

  .pc_bp {
    margin-top: 52px
  }

  .pro_400 {
    height: 45em;
    margin: 0 3% 0;
  }

  .procon_conf .itemb {
    width: 100%;
    background: transparent;
    height: 150px;
    margin-top: 105%;
    display: block
  }

  .procon_conf .item2 {
    position: absolute;
    width: 100%;
    margin-top: 2%
  }

  .procon_contitle {
    height: 83px;
    margin: 2% 3%;
  }

  .procon_contitle .item {
    position: relative;
    height: 83px
  }

  .big .p_t {
    position: relative;
    height: 83px;
  }

  .big .p_t img {
    position: absolute;
    bottom: 0
  }

  .contact_content .Contact_Title {
    top: 140%;
    padding: 1em 2em;
  }

  .contact_content .Contact_Title .Contact_znTitle {
    font-size: 18px;
  }

  .contact_content .Contact_Title .Contact_enTitle {
    font-size: 11px
  }
}

@media (min-width: 400px) {
  .Join_Content .title_left .Join_Title .ms_z {
    margin-top: -6px;
  }

  .Join_Content .title_left .Join_Title .ms_y {
    margin-top: -75px;
  }
}

@media (max-width: 560px) {
  div.service-wrapper .service-list a.flex-item {
    padding: 20px 5px;
  }

  div.service-wrapper .service-list a.flex-item p.no {
    position: relative;
    left: 0;
    bottom: 0;
  }

  div.service-wrapper .ser-title:before {
    display: none;
  }

  div.service-wrapper .ser-title b {
    font-size: 36px;
  }

  .type-status {
    display: none
  }

  #newsList .padding {
    padding: 0px
  }

  div.service-wrapper .service-list a.flex-item h2 span.en {
    font-size: 16px;
  }

  div.service-wrapper .service-list a.flex-item:hover h2 span.cn {
    font-size: 16px;
  }
}

@media (max-width: 375px) {
  div.service-wrapper .ser-title.inter h1 {
    font-size: 28px;
  }

  div.service-wrapper .ser-title b {
    font-size: 30px;
  }
}

.construction {}

.construction .plugin-web {
  color: #FFF;
  text-align: center;
  background: #ccc url("../images/banner.png") no-repeat center center;
  background-size: cover;
  padding: 180px 80px;
  margin: 80px 0;
  overflow: hidden;
}

.construction .plugin-web h3 {
  font-size: 32px;
  margin: 0 0 10px;
}

.construction .plugin-web p {
  font: inherit;
  font-size: 16px;
}

.construction .plugin-web a {
  display: inline-block;
  padding: 12px 50px;
  border-radius: 25px;
  border: 1px solid #ccc;
  background-color: #fff;
  opacity: 0.8;
  margin: 0 10px;
  margin-top: 30px;
  font-size: 18px;
  text-decoration: none;
}

.construction .plugin-web a:hover {
  color: #008d43;
}

@media (max-width: 1200px) {
  .construction .plugin-web {
    padding: 120px 36px;
  }

  .construction .plugin-web h3 {
    font-size: 24px;
  }

  .construction .plugin-web p {
    font-size: 12px;
  }

  .construction .plugin-web a {
    font-size: 14px;
  }
}

@media (max-width: 768px) {
  .construction .plugin-web {
    padding: 80px 15px;
    margin: 40px 0 0 0
  }

  .newPor_Con .MORE {
    display: none
  }
}

/*our-approach*/
div.our-approach {
  width: 100%;
  padding: 60px 0;
  overflow: hidden;
  /*background: url("../images/bg_01.png") no-repeat right bottom;*/
}

div.our-approach .title {
  position: relative;
  z-index: 10;
}

div.our-approach .title b {
  font-size: 56px;
  color: #333;
  line-height: 56px;
  padding: 8px 0 12px;
  font-weight: normal
}

div.our-approach .title h4 {
  font-size: 24px;
  color: #008d43;
}

div.our-approach .title p {
  font-size: 16px;
  color: #666;
  line-height: 30px;
}

div.our-approach .list-wrap {
  width: 100%;
  position: relative;
}

div.our-approach .list-wrap .rightBg {
  width: 745px;
  height: 630px;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
}

div.our-approach .list-wrap .rightBg span {
  display: block;
  width: 100%;
  height: 100%;
  background: transparent no-repeat center center;
  background-size:
    100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

div.our-approach .list-wrap .rightBg span:nth-child(1) {
  background-image: url("../images/li_01.png");
  z-index: 3;
}

div.our-approach .list-wrap .rightBg span:nth-child(2) {
  background-image: url("../images/li_02.png");
  z-index: 2;
}

div.our-approach .list-wrap .rightBg span:nth-child(3) {
  background-image: url("../images/li_03.png");
  z-index: 1;
}

div.our-approach ul.list {
  width: 750px;
  margin-top: 120px;
  position: relative;
  z-index: 10;
}

div.our-approach ul.list li {
  padding: 24px 0;
  font-size: 18px;
  border-bottom: 1px solid #CCC;
}

div.our-approach ul.list li span,
div.our-approach ul.list li:before {
  display: inline-block;
  vertical-align: middle;
}

div.our-approach ul.list li:before {
  color: #008d43;
  padding-right: 15px;
}

div.our-approach ul.list li:nth-child(1):before {
  content: '01/';
}

div.our-approach ul.list li:nth-child(2):before {
  content: '02/';
}

div.our-approach ul.list li:nth-child(3):before {
  content: '03/';
}

div.our-approach ul.list li:nth-child(4):before {
  content: '04/';
}

div.our-approach ul.list li:nth-child(5):before {
  content: '05/';
}

div.our-approach ul.list li:nth-child(6):before {
  content: '06/';
}

div.our-approach ul.list li:nth-child(7):before {
  content: '07/';
}

div.our-approach ul.list li:nth-child(8):before {
  content: '08/';
}

div.our-approach ul.list li:nth-child(9):before {
  content: '09/';
}

div.our-approach ul.list ol {
  display: none;
  padding-left: 50px;
}

div.our-approach ul.list ol li {
  padding: 15px 0 5px;
  font-size: 14px;
  line-height: 24px;
  border-bottom: 0;
  color: #666;
}

div.our-approach ul.list ol li:before {
  display: none;
}




@media (max-width: 1600px) {
  div.our-approach {
    background-size: 450px;
  }

  div.our-approach ul.list {
    width: 450px;
  }

  div.our-approach .list-wrap .rightBg {
    width: 600px;
    height: 500px;
  }
}

@media (max-width: 1200px) {
  div.our-approach .list-wrap .rightBg {
    width: 420px;
    height: 360px;
  }
}

@media (max-width: 890px) {
  div.our-approach {
    background-image: none;
  }

  div.our-approach ul.list {
    width: 100%;
  }

  div.our-approach .list-wrap .rightBg {
    display: none;
  }
}

@media (max-width: 768px) {
  div.our-approach {
    padding: 35px 15px;
  }

  div.our-approach ul.list {
    margin-top: 30px;
  }

  div.our-approach .title b {
    font-size: 32px;
    padding: 5px 0 8px;
  }

  div.our-approach .title h4 {
    font-size: 18px;
  }

  div.our-approach .title p {
    font-size: 12px;
  }

  div.our-approach ul.list li {
    font-size: 14px;
  }

  div.our-approach ul.list ol {
    padding-left: 42px;
  }
}

div.view-points {
  padding: 60px 0;
}

div.view-points .title b {
  font-size: 56px;
  color: #333;
  line-height: 56px;
  padding: 8px 0 12px;
  font-weight: normal
}

div.view-points .title h4 {
  font-size: 24px;
  color: #008d43;
}

div.view-points .title p {
  font-size: 16px;
  color: #666;
  line-height: 30px;
}

div.view-points ul.list {
  width: 100%;
  padding: 30px 0;
}

div.view-points ul.list li {
  width: 33.33%;
  padding: 15px 20px;
  background: url("../images/point.png") no-repeat left center;
  float: left;
  overflow: hidden;
}

div.view-points ul.list li a {
  font-size: 16px;
  color: #333;
  float: left;
  width: 75%;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

div.view-points ul.list li span {
  float: right;
  width: 20%;
  display: inline-block;
  text-align: right
}

div.view-points ul.list li a:hover,
div.view-points ul.list li a:focus {
  text-decoration: none;
}

div.view-points ul.list li a:hover {
  color: #008d43;
}

div.view-points ul.list:after {
  display: block;
  content: '';
  clear: both;
}

@media (max-width: 1200px) {
  div.view-points ul.list li {
    width: 50%;
  }
}

@media (max-width: 768px) {
  div.view-points {
    padding: 36px 15px;
  }

  div.view-points .title b {
    font-size: 32px;
    padding: 5px 0 8px;
  }

  div.view-points .title h4 {
    font-size: 18px;
  }

  div.view-points .title p {
    font-size: 12px;
  }

  div.view-points ul.list {
    padding: 15px 0 0 0
  }
}

@media (max-width: 860px) {

  div.view-points ul.list li a {
    font-size: 12px;
    width: 100%;
  }

  div.view-points ul.list li span {
    display: none
  }
}


@media (max-width: 560px) {
  div.view-points ul.list li {
    width: 100%;
    float: none;
    padding: 15px 0 15px 20px;
  }

  div.view-points ul.list li a {
    font-size: 12px;
    width: 75%;
  }

  div.view-points ul.list li span {
    display: block;
    width: 20%;
  }
}

@media (max-width: 400px) {
  div.view-points ul.list li a {
    width: 100%;
  }

  div.view-points ul.list li span {
    display: none;
  }
}

/*website*/
div.service-wrapper .ser-title.website {
  padding-bottom: 0;
}

div.website {
  padding: 60px 0;
}

div.website .item {
  padding: 110px 0;
}

div.website .item:after {
  display: block;
  content: '';
  clear: both;
}

div.website .item .txt,
div.website .item .thumb {
  width: 770px;
}

div.website .item .thumb {
  /*box-shadow: 0 0 15px rgba(0, 0, 0, .2);*/
}

div.website .item .thumb img {
  max-width: 100%;
}

div.website .item .txt h2 {
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 15px;
}

div.website .item .txt p {
  font-size: 16px;
  color: #666;
  line-height: 24px;
  margin-bottom: 15px;
}

div.website .item img.photo {
  margin-top: 30px;
  max-width: 100%;
}

div.website .item h4 {
  font-size: 16px;
  font-weight: bold;
  color: #666;
  padding-bottom: 12px;
}

div.website .item ul.list {
  width: 100%;
}

div.website .item ul.list li {
  font-size: 16px;
  line-height: 30px;
}

div.website .item ul.list li a {
  color: #666;
}


div.website .link-box {
  width: 100%;
  padding: 15px 0 0;
}

div.website .link-box span {
  padding: 5px;
  display: inline-block;
}

@media (max-width: 1880px) {
  div.website .item {
    padding: 5% 0;
  }

  div.website .item .txt,
  div.website .item .thumb {
    width: 47%;
  }
}

@media (max-width: 1200px) {
  div.website .link-box {
    display: table;
  }

  div.website .link-box span {
    display: table-cell;
    text-align: center;
  }
}

@media (max-width: 768px) {
  div.website {
    padding: 0;
  }

  div.website .item {
    padding: 30px 0;
  }

  div.website .item .txt,
  div.website .item .thumb {
    width: 100%;
  }

  div.website .item .txt.fl,
  div.website .item .txt.fr,
  div.website .item .thumb.fl,
  div.website .item .thumb.fr {
    float: none;
  }

  div.website .item .txt {
    padding-top: 20px;
  }

  div.website .item .txt h2 {
    font-size: 16px;
  }

  div.website .item .txt p {
    font-size: 12px;
  }

  div.website .item h4 {
    font-size: 12px;
  }

  div.website .item ul.list li {
    font-size: 12px;
    line-height: 24px;
  }

  div.website .link-box span {
    text-align: center;
  }
}


div.website-bottom {
  width: 100%;
  background-color: #FFF;
  padding: 75px 0;
}

div.website-bottom .title {
  padding-bottom: 55px;
  text-align: center
}

div.website-bottom .title h2 {
  font-size: 30px;
  color: #333333;
  text-transform: uppercase;
}

div.website-bottom .title p {
  font-size: 16px;
  color: #999999;
  margin-top: 12px;
  line-height: 28px;
}

div.website-bottom ul.list {
  width: 100%;
  padding: 15px 0;
}

div.website-bottom ul.list li {
  width: 32.63%;
  margin-left: 1%;
  float: left;
}

div.website-bottom ul.list li img {
  width: 100%;
}

div.website-bottom ul.list li:first-child {
  margin-left: 0;
}

div.website-bottom ul.list:after {
  display: block;
  content: '';
  clear: both;
}


div.website-bottom .lists {
  width: 100%;
  padding: 0 0 15px 0;
}

div.website-bottom .lists a {
  margin-left: 1%;
  width: 32.63%;
  float: left;
  overflow: hidden;
  display: block;
}

div.website-bottom .lists dl {
  position: relative;
  width: 100%;
}

div.website-bottom .lists a:first-child {
  margin-left: 0;
}

div.website-bottom .lists dl dt {
  width: 100%;
}

div.website-bottom .lists dl dt span {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  position: relative;
  z-index: 1;
}

div.website-bottom .lists dl dt span img {
  max-width: 100%;
}

div.website-bottom .lists dl dt span.thumb img {
  width: 100%;
}

div.website-bottom .lists dl dt span.thumb-logo {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, .3);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  /* transition: all 0.5s linear 0s;
     -moz-transition: all 0.5s linear 0s;
     -webkit-transition: all 0.5s linear 0s;
     -o-transition: all 0.5s linear 0s;*/
  transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  -webkit-transition: all 0.3s linear 0s;
  -o-transition: all 0.3s linear 0s;
  -webkit-transform: scale3d(0, 0, 0);
  -moz-transform: scale3d(0, 0, 0);
  -o-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
}

div.website-bottom .lists a:hover dl dt span.thumb-logo {
  -webkit-transform: none;
  -moz-transform: none;
  -o-transform: none;
  transform: none;
}

div.website-bottom .lists dl dd {
  width: 100%;
  background-color: rgba(0, 0, 0, .6);
  color: #FFF;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 12;
  transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  /* Firefox 4 */
  -webkit-transition: all 0.3s linear 0s;
  /* Safari 和 Chrome */
  -o-transition: all 0.3s linear 0s;
  /* Opera */
}

div.website-bottom .lists a:hover dl dd {
  left: 100%;
}

div.website-bottom .lists dl dd span {
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px;
  color: #FFF;
}

div.website-bottom .lists dl dd span:hover,
div.our-work .item dl dd a:focus {
  color: #FFF;
  text-decoration: none;
}

div.website-bottom .lists dl dd h2 {
  font-size: 18px;
  line-height: 24px;
  padding: 12px 0 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

div.website-bottom .lists dl dd h2:after {
  display: block;
  width: 70px;
  height: 2px;
  background-color: #999;
  content: '';
  margin-top: 15px;
}

div.website-bottom .lists dl dd p {
  font-size: 14px;
  line-height: 14px;
  padding: 15px 0;
  color: #999;
}

div.website-bottom .lists:after {
  display: block;
  content: '';
  clear: both;
}



@media (max-width: 1400px) {
  div.service-wrapper .ser-title.graphic h1 {
    font-size: 90px;
  }
}

@media (min-width: 769px) and (max-width: 1200px) {
  div.website-bottom .lists a {
    width: 49.5%;
  }

  div.website-bottom .lists a:last-child {
    display: none;
  }
}

@media (max-width: 980px) {
  div.service-wrapper .ser-title.graphic h1 {
    font-size: 60px;
  }
}

@media (max-width: 1024px) {
  div.website-bottom {
    padding: 30px 0;
  }

  div.website-bottom .title {
    padding-bottom: 25px;
  }

  div.website-bottom .title h2 {
    font-size: 18px;
    padding-bottom: 0;
  }

  div.website-bottom .title p {
    font-size: 14px;
    margin-top: 8px;
    line-height: 22px
  }
}

@media (max-width: 768px) {
  div.service-wrapper .ser-title.graphic h1 {
    font-size: 42px;
  }

  div.website-bottom .lists dl dd {
    left: 0;
  }

  div.website-bottom .lists dl dd h2 {
    font-size: 18px;
    padding: 15px;
  }

  div.website-bottom .lists dl dd p,
  div.website-bottom .lists dl dd h2:after {
    display: none;
  }

  div.website-bottom ul.list {
    padding-top: 0;
  }

  div.website-bottom ul.list li {
    width: 100%;
    margin: 30px 0 30px 0;
    float: none;
  }

  div.website-bottom .lists a {
    width: 49.5%;
  }

  div.website-bottom .lists a:last-child {
    display: none;
  }
}

@media (max-width: 420px) {
  div.website-bottom .lists a {
    width: 100%;
    margin: 2% 0;
  }

  div.service-wrapper .ser-title.graphic h1 {
    font-size: 32px;
  }

  div.website-bottom .lists a:last-child {
    display: block;
  }
}


/*job-view-info*/
div.job-view-info {
  width: 100%;
  padding: 50px;
  margin-top: 60px;
  margin-bottom: 20px;
  background-color: #FFF;
  box-shadow: 0 0 15px rgba(0, 0, 0, .2);
}

div.job-view-info .title {
  padding-bottom: 15px;
}

div.job-view-info .title h1 {
  font-size: 30px;
}

div.job-view-info .content {}

div.job-view-info .content h4 {
  font-size: 18px;
  line-height: 30px;
  padding-bottom: 8px;
}

div.job-view-info .content p {
  font-size: 14px;
  line-height: 28px;
  color: #666;
}

div.job-view-info a.btn-job {
  display: inline-block;
  background-color: #008d43;
  font-size: 18px;
  color: #FFF;
  padding: 12px 30px;
  margin-top: 50px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

div.job-view-info a.btn-job:hover,
div.job-view-info a.btn-job:focus {
  text-decoration: none;
}


div.service-wrapper.jobs-view {
  width: 100%;
  overflow: hidden;
  position: relative;
}

div.service-wrapper.jobs-view .job-banner {
  position: relative;
  z-index: 1;
}

div.service-wrapper.jobs-view .inner {}

div.service-wrapper.jobs-view .inner:after {
  display: block;
  content: '';
  clear: both;
}

div.service-wrapper.jobs-view .item {}

div.service-wrapper.jobs-view .item img {
  width: 100%;
}

div.service-wrapper.jobs-view .section-01 {
  background-color: #f5f5f5;
}

div.service-wrapper.jobs-view .btns {
  display: block;
  width: 80px;
  height: 80px;
  border: 1px solid #CCC;
  border-left: 0;
  background: #FFF no-repeat center center;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 11;
}

div.service-wrapper.jobs-view .btns.btn-left {
  border-left: 1px solid #CCC;
  background-image: url("../images/btn_right.png");
}

div.service-wrapper.jobs-view .btns.btn-right {
  right: 80px;
  background-image: url("../images/btn_left.png");
}


div.jobs-banner-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
}

.job_body {
  width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  background: url("../images/view_banner.png") no-repeat center top;
  background-attachment: fixed;
  background-size: cover;
}

div.sm-job-banner {
  width: 100%;
}

div.sm-job-banner img {
  width: 100%;
}

@media (max-width: 768px) {
  div.job-view-info {
    padding: 30px;
  }

  div.service-wrapper.jobs-view .btns {
    width: 32px;
    height: 100%;
    background: rgba(0, 0, 0, .05) no-repeat center center;
    border: 0;
  }

  div.service-wrapper.jobs-view .btns.btn-left {
    border: 0;
    right: 0;
  }

  div.service-wrapper.jobs-view .btns.btn-right {
    right: auto;
    left: 0;
  }

  .job_body {
    background: none;
  }

  div.jobs-banner-wrapper {
    background: url("../images/view_banner.png") no-repeat center center;
    background-size: cover;
  }
}

@media (max-width: 640px) {
  div.job-view-info {
    padding: 30px 20px;
  }

  div.job-view-info .title h1 {
    font-size: 24px;
  }

  div.job-view-info .content h4 {
    font-size: 16px;
  }

  div.jobs-banner-wrapper {
    display: none;
    background-size: 700px 100%;
    height: 300px !important;
  }
}


/*error404*/
div.error404 {}

div.service-wrapper.error404 .ser-big-banner {
  padding: 0;
}

/*about*/
div.about-wrapper {}

div.about-wrapper .aInfo {
  padding: 120px 0 60 0;
}

div.about-wrapper .aInfo:after {
  display: block;
  content: '';
  clear: both;
}

div.about-wrapper .aInfo .text {
  width: 730px;
  float: left;
}

div.about-wrapper .aInfo .text dl {
  width: 100%;
  padding-bottom: 30px;
}

div.about-wrapper .aInfo .text dt {
  font-size: 30px;
  font-weight: bold;
}

div.about-wrapper .aInfo .text dd {
  font-size: 18px;
  line-height: 32px;
  padding: 15px 0;
}

div.about-wrapper .aInfo .text dd p {
  text-indent: 18px;
}

div.about-wrapper .aInfo .text dd p b {
  color: #008d43;
}

div.about-wrapper .aInfo .thumb {
  width: 720px;
  text-align: center;
  float: right;
  position: relative;
}

div.about-wrapper .aInfo .thumb video {
  max-width: 100%;
}

div.about-wrapper .aInfo .thumb img {
  display: none
}

div.about-wrapper .aInfo .thumb:before,
div.about-wrapper .aInfo .thumb:after {
  display: block;
  content: '';
  position: absolute;
}

div.about-wrapper .aInfo .thumb:before {
  width: 320px;
  height: 180px;
  background: url("../images/about_04.png") no-repeat top left / 100%;
  top:
    -120px;
  left: 50%;
  margin-left: -160px;
  z-index: 1;
}

div.about-wrapper .aInfo .thumb:after {
  width: 300px;
  height: 120px;
  background-color: rgba(0, 141, 67, .5);
  left: -5%;
  bottom: -60px;
  z-index: 1;
}


@media (max-width: 1800px) {
  div.about-wrapper .aInfo .text {
    width: 45%;
  }

  div.about-wrapper .aInfo .thumb {
    width: 50%;
  }

  div.about-wrapper .aInfo .thumb:before {
    width: 30%;
    height: 30%;
    top: -15%;
    margin-left: -15%;
  }

}

@media (max-width: 1600px) {
  div.about-wrapper .aInfo {
    padding: 80px 0;
  }
}

@media (max-width: 1200px) {
  div.about-wrapper .aInfo {
    padding: 36px 0 0 0;
  }

  div.about-wrapper .aInfo .text {
    width: 100%;
    float: none;
  }

  div.about-wrapper .aInfo .thumb {
    margin: 0 auto 15%;
    float: none;
    width: 80%;
  }
}

@media (max-width: 768px) {
  div.about-wrapper .aInfo {
    padding: 0;
  }

  div.about-wrapper .aInfo .thumb {
    width: 100%;
    margin: 0;
    padding: 0 0 30px;
  }

  div.about-wrapper .aInfo .thumb:before,
  div.about-wrapper .aInfo .thumb:after {
    display: none;
  }

  div.about-wrapper .aInfo .text dt {
    font-size: 20px;
  }

  div.about-wrapper .aInfo .thumb video {
    display: none
  }

  div.about-wrapper .aInfo .thumb img {
    max-width: 100%;
    display: block
  }
}

div.about-wrapper .culture {
  padding: 60px 0;
}

div.about-wrapper .culture b {
  font-size: 56px;
  padding: 12px 0;
  font-weight: normal
}

div.about-wrapper .culture h2 {
  font-size: 24px;
  font-weight: bold;
  color: #666;
  padding-top: 30px;
}

div.about-wrapper .culture h2 span {
  color: #008d43;
}

div.about-wrapper .culture h4 {
  font-size: 24px;
  color: #008d43;
}

div.about-wrapper .culture p {
  font-size: 18px;
  color: #666;
  line-height: 32px;
}

@media (max-width: 1400px) {
  div.about-wrapper .culture {
    padding: 30px 0;
  }
}

@media (max-width: 768px) {
  div.about-wrapper .culture b {
    font-size: 36px;
  }

  div.about-wrapper .culture h2 {
    font-size: 18px;
  }

  div.about-wrapper .culture h4 {
    font-size: 18px;
  }

  div.about-wrapper .culture p {
    font-size: 14px;
    line-height: 24px;
  }

  div.about-wrapper .aInfo .text dd p {
    font-size: 14px;
  }
}

@media (max-width: 560px) {
  div.about-wrapper .culture b {
    font-size: 30px;
  }

  div.about-wrapper .culture h2 {
    font-size: 16px;
  }

  div.about-wrapper .culture h4 {
    font-size: 16px;
  }

  div.about-wrapper .culture p {
    line-height: 20px;
  }
}

@media (max-width: 414px) {
  div.about-wrapper .aInfo .text dd p {
    font-size: 14px;
  }

  div.about-wrapper .culture h2 {
    font-size: 14px;
  }
}

div.about-wrapper .btm-thumb {
  width: 100%;
  margin: 40px 0;
  position: relative;
}

div.about-wrapper .btm-thumb span.item {
  display: block;
  width: 50%;
  float: left;
  position: relative;
  z-index: 1;
}

div.about-wrapper .btm-thumb span.item img {
  width: 100%;
}

div.about-wrapper .btm-thumb:before,
div.about-wrapper .btm-thumb:after {
  display: block;
  content: '';
}

div.about-wrapper .btm-thumb:before {
  width: 36%;
  height: 30%;
  background-color: rgba(0, 141, 67, .5);
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -6.5%;
  margin-left: -18%;
  z-index: 10;
}

div.about-wrapper .btm-thumb:after {
  clear: both;
}

@media (max-width: 768px) {
  div.about-wrapper .btm-thumb {
    margin: 20px 0;
  }
}


/*contact-wrapper*/
div.contact-wrapper {}

div.contact-wrapper .section.banner {
  width: 100%;
  position: relative;
  margin-bottom: 120px;
}

div.contact-wrapper .section.banner img.bg {
  width: 100%;
}

div.contact-wrapper .infos {
  width: 912px;
  padding: 45px;
  background-color: #FFF;
  box-shadow: 0 0 12px rgba(0, 0, 0, .2);
  position: absolute;
  right:
    70px;
  bottom: -70px;
  z-index: 1;
}

div.contact-wrapper .infos .tit {}

div.contact-wrapper .infos .tit h2 {
  font-size: 36px;
}

div.contact-wrapper .infos .list {
  padding: 15px 0;
}

div.contact-wrapper .infos .list:after {
  display: block;
  content: '';
  clear: both;
}

div.contact-wrapper .infos dl {
  width: 250px;
  margin-left: 30px;
  float: left;
}

div.contact-wrapper .infos dl dt {
  padding: 16px 0;
  font-size: 20px;
  color: #666;
  font-weight: bold;
}

div.contact-wrapper .infos dl dd {
  height: 70px;
  font-size: 16px;
  color: #83868a;
  line-height: 24px;
}

div.contact-wrapper .infos dl dd a.icon {
  display: block;
  color: #83868a;
}

div.contact-wrapper .infos dl dd a.icon:before,
div.contact-wrapper .infos dl dd a.icon span {
  display: inline-block;
  vertical-align: middle;
}

div.contact-wrapper .infos dl dd a.icon:before {
  background: no-repeat left center;
  height: 100%;
  margin-right: 5px;
  padding-left: 21px;
  content: ':';
}

div.contact-wrapper .infos dl dd a.icon.email:before {
  background-image: url("../images/email.png");
}

div.contact-wrapper .infos dl dd a.icon.qq:before {
  background-image: url("../images/qq.png");
}

div.contact-wrapper .infos dl dd h3 {
  font-size: 24px;
  color: #008d43;
  margin-top: 5px;
}

div.contact-wrapper .infos dl dd h3 a {
  color: #008d43;
}

div.contact-wrapper .our-links {}

div.contact-wrapper .our-links:after {
  display: block;
  content: '';
  clear: both;
}

div.contact-wrapper .our-links a {
  display: block;
  margin-left: 8px;
  width: 32px;
  height: 32px;
  background: no-repeat center center;
  float: left;
  position: relative;
}

div.contact-wrapper .our-links a:hover,
div.contact-wrapper .our-links a:focus {
  text-decoration: none;
}

div.contact-wrapper .our-links a:hover {
  /*opacity: .8;*/
}

div.contact-wrapper .our-links a:first-child {
  margin-left: 0;
}

div.contact-wrapper .our-links a.wx {
  background-image: url("../images/share_01.png");
}

div.contact-wrapper .our-links a.sina {
  background-image: url("../images/share_02.png");
}

div.contact-wrapper .our-links a.design {
  background-image: url("../images/share_03.png");
}

div.contact-wrapper .our-links a.zcool {
  background-image: url("../images/share_04.png");
}

div.contact-wrapper .our-links a.wx span {
  display: none;
  width: 110px;
  height: 110px;
  border: 1px solid #DDD;
  padding: 5px;
  background-color: #FFF;
  position: absolute;
  right: -35px;
  top: -120px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

div.contact-wrapper .our-links a.wx span img {
  width: 100%;
}

div.contact-wrapper .our-links a.wx span:before {
  display: block;
  content: '';
  position: absolute;
  left: 50%;
  margin-left: -4px;
  bottom: -8px;
  z-index:
    10;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 9px solid #FFF;
}

div.contact-wrapper .our-links a.wx span:after {
  display: block;
  content: '';
  position: absolute;
  left: 50%;
  margin-left: -5px;
  bottom: -9px;
  z-index:
    1;
  width: 0;
  height: 0;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-top: 10px solid #DDD;
}

div.contact-wrapper .our-links a.wx:hover span {
  opacity: 1;
  display: block;
}

@media (min-width: 981px) {
  div.contact-wrapper .infos dl:nth-child(3n+1) {
    margin-left: 0;
  }
}

@media (max-width: 1600px) {
  div.contact-wrapper .infos {
    bottom: -120px;
  }
}

@media (max-width: 1200px) {
  div.contact-wrapper .infos {
    width: 100%;
    position: static;
  }

  div.contact-wrapper .section.banner {
    margin-bottom: 0;
  }

  div.contact-wrapper .infos dl {
    width: 31%;
    margin-left: 2.7%;
  }
}

@media (max-width: 980px) {
  div.contact-wrapper .infos dl {
    width: 48%;
    margin-left: 4%;
  }

  div.contact-wrapper .infos dl.share {
    display: none;
  }

  div.contact-wrapper .infos dl:nth-child(1),
  div.contact-wrapper .infos dl:nth-child(4) {
    margin-left: 0;
  }
}

@media (max-width: 768px) {
  div.contact-wrapper .infos {
    padding: 45px 20px 20px;
  }

  div.contact-wrapper .infos .tit h2 {
    font-size: 22px;
  }

  div.contact-wrapper .infos dl.share {
    display: none;
  }

  div.contact-wrapper .our-links a.wx span {
    margin-right: -40px;
  }

  div.contact-wrapper .our-links a.wx span:before {
    bottom: -9px;
    left: 0;
    margin-left: 10px;
  }

  div.contact-wrapper .our-links a.wx span:after {
    bottom: -10px;
    left: 0;
    margin-left: 9px;
  }

  div.contact-wrapper .infos dl {
    width: 100%;
    margin-left: 0;
    margin-bottom: 20px;
  }

  div.contact-wrapper .infos dl.tech dt {
    display: none;
  }

  div.contact-wrapper .infos dl dt {
    font-size: 18px;
  }

  div.contact-wrapper .infos dl dd {
    height: auto;
  }

  div.contact-wrapper .infos dl dd h3 {
    font-size: 20px;
  }
}


/*case-wrapper*/
div.case-wrapper .case-list {
  padding-bottom: 50px;
}

div.case-wrapper .case-list:after {
  display: block;
  content: '';
  clear: both;
}

div.case-wrapper .case-list a.link {
  display: block;
  width: 33.33%;
  padding: 15px;
  float: left;
}

div.case-wrapper .case-list dl {
  width: 100%;
  overflow: hidden;
  position: relative;
}

div.case-wrapper .case-list dl dt {
  width: 100%;
  font-weight: normal;
  overflow: hidden;
  position: relative;
}

div.case-wrapper .case-list dl dt img {
  width: 100%;
}

div.case-wrapper .case-list dl dt span.thumb {
  position: relative;
  z-index: 1;
}

div.case-wrapper .case-list dl dt span.thumb-logo {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, .3);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  /* transition: all 0.5s linear 0s;
     -moz-transition: all 0.5s linear 0s;
     -webkit-transition: all 0.5s linear 0s;
     -o-transition: all 0.5s linear 0s;*/
  transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  -webkit-transition: all 0.3s linear 0s;
  -o-transition: all 0.3s linear 0s;
}

div.case-wrapper .case-list dl dt span.thumb-logo img {
  width: auto;
  max-width: 80%;
}

div.case-wrapper .case-list dl dt span.tag {
  display: inline-block;
  font-size: 14px;
  line-height: 14px;
  padding: 10px 15px;
  color: #FFF;
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 10;
  border: 1px solid #FFF;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

div.case-wrapper .case-list dl dt span.tag:hover {
  background-color: rgba(0, 0, 0, .2);
}

div.case-wrapper .case-list dl:hover span.thumb-logo {
  /*top: -100%; left: -100%;*/
  -webkit-transform: scale3d(0, 0, 0);
  -moz-transform: scale3d(0, 0, 0);
  -o-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
}

div.case-wrapper .case-list dl dd {
  width: 100%;
  background-color: rgba(0, 0, 0, .6);
  color: #FFF;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 12;
  transition: all 0.3s linear 0s;
  -moz-transition: all 0.3s linear 0s;
  /* Firefox 4 */
  -webkit-transition: all 0.3s linear 0s;
  /* Safari 和 Chrome */
  -o-transition: all 0.3s linear 0s;
  /* Opera */
}

div.case-wrapper .case-list dl:hover dd {
  left: 100%;
}

div.case-wrapper .case-list dl dd span.tit {
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px;
  color: #FFF;
}

div.case-wrapper .case-list dl dd span.tit:hover,
div.case-wrapper .case-list dl dd span.tit:focus {
  color: #FFF;
  text-decoration: none;
}

div.case-wrapper .case-list dl dd h2 {
  font-size: 18px;
  line-height: 24px;
  padding: 12px 0 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

div.case-wrapper .case-list dl dd h2:after {
  display: block;
  width: 70px;
  height: 2px;
  background-color: #999;
  content: '';
  margin-top: 15px;
}

div.case-wrapper .case-list dl dd p {
  font-size: 14px;
  line-height: 18px;
  padding: 15px 0;
  color: #999;
}

div.service-wrapper ul.all-catalog {
  width: 100%;
  padding-bottom: 30px;
  display: none;
}

div.service-wrapper ul.all-catalog li {
  display: inline-block;
  padding: 5px;
}

div.service-wrapper ul.all-catalog li a {
  display: inline-block;
  background-color: #FFF;
  color: #333;
  padding: 10px 12px;
  font-size: 14px;
  line-height: 14px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

div.service-wrapper ul.all-catalog li a:hover,
div.service-wrapper ul.all-catalog li a:focus {
  text-decoration: none;
}

div.service-wrapper ul.all-catalog li a:hover,
div.service-wrapper ul.all-catalog li.active a {
  color: #FFF;
  background-color: #008d43;
}


@media (max-width: 1500px) {
  div.case-wrapper .case-list a.link {
    width: 50%;
  }
}

@media (max-width: 768px) {
  div.case-wrapper .case-list dl dt span.tag {
    display: none;
  }

  div.case-wrapper .case-list dl dd {
    left: 0;
  }

  div.case-wrapper .case-list dl dd span.tit h2 {
    font-size: 18px;
    padding-bottom: 12px;
  }

  div.case-wrapper .case-list dl dd span.tit h2:after {
    display: none;
  }

  div.case-wrapper .case-list dl dd span.tit p {
    display: none;
  }
}

@media (max-width: 640px) {
  div.case-wrapper .case-list a.link {
    width: 100%;
    padding: 20px 0;
  }
}

/*paging*/
div.paging {
  width: 100%;
  text-align: center;
  padding: 30px 0;
}

div.paging a {
  display: inline-block;
  vertical-align: middle;
  width: 70px;
  height: 70px;
  margin: 0 5px;
  box-shadow: 0 0 12px rgba(0, 0, 0, .1);
  background: #FFF no-repeat center center;
  background-size: 100%;
}

div.paging a.btn-left {
  background-image: url("../images/btn_left.png");
}

div.paging a.btn-menu {
  background-image: url("../images/btn_menu.png");
}

div.paging a.btn-right {
  background-image: url("../images/btn_right.png");
}


.page-box {
  overflow: hidden;
  position: relative;
  margin: 20px auto 50px auto;
  text-align: center
}

.pagebj {
  padding: 7px 25px;
  background: #fff;
  display: inline-block;
  border-radius: 30px;
}

.pagebj li {
  display: inline-block
}

.pagebj li a {
  color: #666;
  display: inline-block;
  *display: inline;
  height: 40px;
  width: 40px;
  line-height: 40px;
  font-size: 16px;
  margin: 0 5px;
  border-radius: 50%;
  text-decoration: none;
}

.pagebj li.active a,
.pagebj li a:hover {
  background: #666;
  color: #ffffff;
}

@media screen and (max-width: 768px) {
  .page-box .page {
    display: none
  }
}

/*case_view_paging*/
div.case_view_paging {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
}

div.case_view_paging:after {
  display: block;
  content: '';
  clear: both;
}

div.case_view_paging a {
  display: block;
  vertical-align: middle;
  width: 70px;
  height: 70px;
  margin: 0;
  border: 1px solid #DDD;
  background: #FFF no-repeat center center;
  background-size: 100%;
  float: left;
  overflow: hidden;
  font-size: 0px;
  text-indent: -99999px
}

div.case_view_paging a.go_back {
  background-image: url("../images/btn_back.png");
  border-right: 0;
}

div.case_view_paging a.go_zt {
  background-image: url("../images/btn_zt.png");
  border-right: 0;
}

div.case_view_paging a.btn-left {
  background-image: url("../images/btn_left.png");
}

div.case_view_paging a.btn-left-no {
  background-image: url("../images/btn_left_no.png");
}

div.case_view_paging a.btn-menu {
  background-image: url("../images/btn_menu.png");
  border-left: 0;
  border-right: 0;
}

div.case_view_paging a.btn-right {
  background-image: url("../images/btn_right.png");
}

div.case_view_paging a.btn-right-no {
  background-image: url("../images/btn_right_no.png");
}

@media (max-width: 768px) {
  div.paging a {
    width: 50px;
    height: 50px;
  }

  div.case_view_paging {
    left: 50%;
    margin-left: -105px;
    top: auto;
    bottom: 30px;
  }

  div.case_view_paging a {
    background-color: rgba(255, 255, 255, .9);
  }

  div.case_view_paging a.go_back {
    display: none
  }

  div.case_view_paging a.go_zt {
    display: none
  }
}


div.case-filter {
  width: 100%;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
}

div.case-filter:after {
  display: block;
  content: '';
  clear: both;
}

div.case-filter .item {
  float: right;
}

div.case-filter .item:after {
  display: block;
  content: '';
  clear: both;
}

div.case-filter .item a {
  display: block;
  width: 80px;
  height: 80px;
  float: left;
}

div.case-filter .item a.text {
  width: auto;
  padding-right: 12px;
  font-size: 16px;
  line-height: 80px;
  color: #333;
}

div.case-filter .item a.text span {
  color: #999;
}

div.case-filter .item a.text:hover,
div.case-filter .item a.text:focus {
  text-decoration: none;
}

div.case-filter .item a.filter,
div.case-filter .item a.search {
  background: #FFF no-repeat center center;
  border: 1px solid #e3e3e3;
}

div.case-filter .item a.filter {
  border-right: 0;
  background-image: url("../images/filter.png");
}

div.case-filter .item a.search {
  background-image: url("../images/search2.png");
}

div.case-filter .search-wrap {
  display: none;
  width: 100%;
  height: 80px;
  padding: 0 80px;
  background-color: #FFF;
  border-bottom: 1px solid #e3e3e3;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
}

div.case-filter .search-wrap a.btn-close {
  width: 80px;
  height: 80px;
  background: #008d43 url("../images/close.png") no-repeat center center;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}

div.case-filter .search-wrap form.search-box {
  width: 100%;
  height: 100%;
}

div.case-filter .search-wrap form.search-box {}

div.case-filter .search-wrap form.search-box input[type=text] {
  width: 100%;
  height: 100%;
  border: 0;
  background: no-repeat;
  outline: none;
  padding: 0 20px;
  font-size: 16px;
}

div.case-filter .search-wrap form.search-box input.search {
  width: 80px;
  height: 80px;
  background: url("../images/search2.png") no-repeat center center;
  display: block;
  position: absolute;
  top: 0;
  right: 80px;
  z-index: 1;
  border: none
}

div.filter-nav {
  display: none;
  height: 100%;
  background-color: #FFF;
  border-left: 1px solid #e8e8e8;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9991;
}

div.filter-nav a.btn-close {
  width: 80px;
  height: 80px;
  background: #008d43 url("../images/close.png") no-repeat center center;
  position: absolute;
  top: 0;
  left: -80px;
}

div.filter-nav ul.list {
  width: 100%;
  height: 100%;
  padding: 30px 0;
  position: relative;
}

div.filter-nav ul.list div.tit {
  padding: 0 96px 0 16px;
  font-size: 20px;
  line-height: 80px;
  color: #222;
}

div.filter-nav ul.list div.tit span {
  display: inline-block;
  width: 80px;
}

div.filter-nav ul.list li {
  position: relative;
  z-index: 10;
}

div.filter-nav ul.list li:hover {
  background: #f3f3f3
}

div.filter-nav ul.list li:hover span {
  background: #eaeaea
}

div.filter-nav ul.list li span,
div.filter-nav ul.list li a {
  display: inline-block;
  vertical-align: middle;
  padding: 12px 15px;
  color: #999;
  overflow: hidden;
  margin: 0;

}

div.filter-nav ul.list li span {
  width: 80px;
  text-align: right;
}

div.filter-nav ul.list li a {
  min-width: 178px;
  font-size: 16px;
  line-height: 16px;
}

div.filter-nav ul.list li.active span,
div.filter-nav ul.list li.active a {
  color: #333;
}

div.filter-nav ul.list li.active {
  background: #ededed
}

div.filter-nav ul.list li.active span {
  background: #e1e1e1
}

div.filter-nav ul.list li a:hover,
div.filter-nav ul.list li a:focus {
  text-decoration: none;
}

div.filter-nav ul.list:before {
  display: block;
  content: '';
  background-color: #f5f5f5;
  width: 80px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}


@media (max-width: 768px) {
  div.case-filter {
    top: 80px;
    display: none;
  }

  div.case-filter .search-wrap {
    padding-left: 0;
  }

  div.case-filter .search-wrap a.btn-close {
    width: 73px;
  }

  div.case-filter .item {
    width: 60px;
  }

  div.case-filter .item a {
    width: 60px;
    height: 60px;
  }

  div.case-filter .item a.text,
  div.case-filter .item a.search {
    display: none;
  }

  div.filter-nav {
    padding-top: 60px;
  }

  div.filter-nav a.btn-close {
    top: 80px;
  }
}

@media (max-width: 375px) {
  div.case-filter {
    top: 60px;
  }

  div.filter-nav {
    padding-top: 50px;
  }

  div.filter-nav a.btn-close {
    top: 60px;
  }

  div.filter-nav ul.list:before,
  div.filter-nav ul.list li span {
    width: 60px;
  }

  div.filter-nav ul.list li a {
    min-width: inherit;
  }
}

/*case-view-banner*/
div.case-view-banner {
  width: 100%;
  height: 100%;
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
}

.case_body {
  width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

div.sm-top-banner {
  display: none;
  width: 100%;
}

div.sm-top-banner img {
  width: 100%;
}

@media (max-width:1024px) {
  .case_body {
    background: none;
  }

  div.case-view-banner {
    display: none;
  }

  div.sm-top-banner {
    display: block;
  }
}

/*case-view-wrapper*/
div.case-view-wrapper {
  position: relative;
  z-index: 99;
}


div.case-view-info {
  width: 100%;
  background: #FFF;
  padding: 80px 0;
}

div.case-view-info:after {
  display: block;
  content: '';
  clear: both;
}

div.case-view-info .left,
div.case-view-info .right {
  width: 50%;
}

div.case-view-info .left {
  float: left;
}

div.case-view-info .left h1 {
  font-size: 36px;
  padding: 15px 0;
}

div.case-view-info .left p {
  font-size: 14px;
  color: #666;
  line-height: 24px;
}

div.case-view-info .left p.icon:before {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 6px;
  content: '';
  vertical-align: middle;
  background: no-repeat left center;
}

div.case-view-info .left p.icon.clock:before {
  background-image: url("../images/clock.png");
}

div.case-view-info .left p.icon.service:before {
  background-image: url("../images/star.png");
}

div.case-view-info .left p.icon.menu:before {
  background-image: url("../images/menu.png");
}

div.case-view-info .left p.icon.link:before {
  background-image: url("../images/link.png");
}

div.case-view-info .bdsharebuttonbox {
  padding-top: 20px;
}

div.case-view-info .bdsharebuttonbox a {
  display: inline-block;
  width: 38px;
  height: 38px;
  background: no-repeat center center;
  margin: 0 5px;
}

div.case-view-info .bdsharebuttonbox a.bds_tsina {
  background-image: url("../images/icon_wb.png");
}

div.case-view-info .bdsharebuttonbox a.bds_qzone {
  background-image: url("../images/icon_qzone.png");
}

div.case-view-info .bdsharebuttonbox a.bds_huaban {
  background-image: url("../images/icon_huaban.png");
}

div.case-view-info .bdsharebuttonbox a.bds_weixin {
  background-image: url("../images/icon_wx.png");
}


div.case-view-info .right {
  font-size: 16px;
  color: #999;
  line-height: 28px;
  float: right;
}

div.case-view-info .right p {
  text-indent: 2em;
}

@media (max-width: 1200px) {

  div.case-view-info .left,
  div.case-view-info .right {
    width: 100%;
    float: none;
  }

  div.case-view-info .right {
    padding-top: 30px;
  }
}

@media (max-width: 768px) {
  div.case-view-info {
    padding: 36px 0 50px;
  }

  div.case-view-info .left h1 {
    font-size: 28px;
  }

  div.case-view-info .right {
    display: none;
  }
}

@media (max-width: 420px) {
  div.case-view-info .left h1 {
    font-size: 20px;
  }
}

div.case-view-content {
  width: 100%;
  overflow: hidden;
  background: #333;
  padding: 50px 0;
}

div.case-view-content img {
  max-width: 100%;
}

@media (max-width: 768px) {
  div.case-view-content {
    padding: 0;
    background: #f1f1f1
  }
}


div.case-view-bottom {
  width: 100%;
  background-color: #f5f5f5;
  padding: 35px 0;
}

div.case-view-bottom dl.tags {
  width: 100%;
  display: table;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

div.case-view-bottom dl.tags dt,
div.case-view-bottom dl.tags dd {
  display: table-cell;
  font-size: 16px;
  color: #666;
  padding: 12px 0;
}

div.case-view-bottom dl.tags dt {
  width: 20px;
  padding-left: 30px;
  white-space: nowrap;
  background: url("../images/tag.png") no-repeat left center;
}

div.case-view-bottom dl.tags dd a {
  color: #666;
}

div.case-view-bottom .btm-link {
  padding: 15px 0;
  font-size: 16px;
  color: #666;
  border-top: 1px dashed #CCC;
  border-bottom: 1px dashed #CCC;
  margin:
    15px 0;
}

div.case-view-bottom .btm-link p {
  padding: 3px 0;
}

div.case-view-bottom .btm-link a[href] {
  color: #336699;
}

div.case-view-bottom .btm-link a {
  color: #666;
}

@media (max-width: 768px) {
  div.case-view-bottom {
    padding: 15px 0;
  }

  div.case-view-bottom dl.tags {
    display: none
  }

  /*div.case-view-bottom dl.tags dt, div.case-view-bottom dl.tags dd{ font-size: 14px; }*/
  div.case-view-bottom .btm-link {
    font-size: 14px;
  }
}

/*news-wrapper*/
div.news-wrapper {}

div.news-wrapper .news-list {
  padding-bottom: 50px;
  position: relative;
}

div.news-wrapper .news-list:after {
  display: block;
  content: '';
  clear: both;
}

div.news-wrapper .news-list a.box {
  display: block;
  width: 100%;
  overflow: hidden;
  background: #FFF;
  margin: 10px 0;
  float: left;
}

div.news-wrapper .news-list a.box:hover,
div.news-wrapper .news-list a.box:focus {
  text-decoration: none;
  color: #333;
}

div.news-wrapper .news-list .box span.thumb {
  width: 100%;
  display: block;
  overflow: hidden;
}

div.news-wrapper .news-list .box span.thumb img {
  width: 100%;
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
}

div.news-wrapper .news-list .box span.thumb:hover img {
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
}

div.news-wrapper .news-list .box .info {
  padding: 20px 30px;
}

div.news-wrapper .news-list .box .info h2 {
  font-size: 20px;
  margin-bottom: 8px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

div.news-wrapper .news-list .box .info h2 {
  color: #666;
}

div.news-wrapper .news-list .box .info h2:hover {
  color: #333;
}

div.news-wrapper .news-list .box .info p {
  font-size: 14px;
  color: #666;
}

div.news-wrapper .news-list .box .btm {
  font-size: 14px;
  color: #666;
  border-top: 1px solid #DDD;
  padding: 20px 30px;
}

div.news-wrapper .news-list .box .btm span.more {
  display: block;
  width: 24px;
  height: 8px;
  margin-top: 5px;
  background: url("../images/ico_08.png") no-repeat left top;
  float: right;
}


/*news-detail*/
div.news-detail {
  padding: 135px 0 20px;
}

div.news-detail .inner {
  background-color: #FFF;
  padding: 50px;
  box-shadow: 0 0 12px rgba(0, 0, 0, .2)
}

div.news-detail .title {
  border-bottom: 1px solid #CCC;
  padding-bottom: 20px;
}

div.news-detail .title h1 {
  font-size: 30px;
  padding-bottom: 15px;
}

div.news-detail .title .left {
  float: left;
}

div.news-detail .title .left span {
  display: inline-block;
  padding-left: 20px;
  margin-left: 25px;
  font-size: 12px;
  color: #999;
  line-height: 16px;
  background: no-repeat left center;
}

div.news-detail .title .left span:first-child {
  margin-left: 0;
}

div.news-detail .title .left span.clock {
  background-image: url("../images/clock.png");
}

div.news-detail .title .left span.count {
  background-image: url("../images/count.png");
}

div.news-detail .title .left span.font {
  background-image: url("../images/font.png");
  cursor: pointer;
}

div.news-detail .title .left span.print {
  background-image: url("../images/print.png");
  cursor: pointer;
}

div.news-detail .title .bdsharebuttonbox {
  float: right;
}

div.news-detail .title .bdsharebuttonbox a {
  display: inline-block;
  width: 38px;
  height: 38px;
  background: no-repeat center center;
}

div.news-detail .title .bdsharebuttonbox a.bds_qzone {
  background-image: url("../images/icon_qzone.png");
}

div.news-detail .title .bdsharebuttonbox a.bds_tsina {
  background-image: url("../images/icon_sina.png");
}

div.news-detail .title .bdsharebuttonbox a.bds_huaban {
  background-image: url("../images/icon_huaban.png");
}

div.news-detail .title .bdsharebuttonbox a.bds_weixin {
  background-image: url("../images/icon_wx.png");
}

div.news-detail .title:after {
  display: block;
  content: '';
  clear: both;
}

div.news-detail .content {
  padding: 20px 0;
  font-size: 14px;
  line-height: 28px;
}

div.news-detail .content p {
  margin: 10px 0 20px 0;
  text-indent: 1em;
}

div.news-detail .content img {
  max-width: 100% !important;
  height: auto !important
}

div.news-detail .content a {
  color: #008d43;
  font-weight: bold;
  text-decoration: none
}

@media (max-width: 1200px) {
  div.news-detail .title h1 {
    font-size: 24px;
  }

  div.news-detail .inner {
    padding: 30px;
  }
}

@media (max-width: 768px) {
  div.news-wrapper .news-list {
    padding-bottom: 0px;
  }

  div.news-detail {
    padding-top: 35px;
  }

  div.news-detail .inner {
    padding: 30px 20px;
  }

  div.news-detail .title .left {
    width: 100%;
    text-align: center;
  }

  div.news-detail .title .left span {
    margin-left: 15px;
  }

  div.news-detail .title .bdsharebuttonbox,
  div.news-detail .title .left span.print,
  div.news-detail .title .left span.font {
    display: none;
  }
}

@media (max-width: 640px) {
  div.news-detail .content p {
    text-indent: inherit;
  }
}

@media (max-width: 375px) {
  div.news-detail .title h1 {
    font-size: 18px;
  }

  div.news-detail .content {
    font-size: 12px;
    line-height: 24px;
  }
}

.not-allowed {
  cursor: not-allowed;
}

.no-result {
  background: url(../images/no-result.png) no-repeat top center;
  width: 100%;
  height: 300px;
  text-align: center;
  padding-top: 220px;
  font-size: 14px;
}

div.case-view-banner:before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background: -ms-linear-gradient(top, transparent, rgba(0, 0, 0, .8));
  /* IE 10 */
  background: -moz-linear-gradient(top, transparent, rgba(0, 0, 0, .8));
  /*火狐*/
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(rgba(0, 0, 0, .8)));
  /*谷歌*/
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(rgba(0, 0, 0, .8)));
  /* Safari 4-5, Chrome 1-9*/
  background: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, .8));
  /*Safari5.1 Chrome 10+*/
  background: -o-linear-gradient(top, transparent, rgba(0, 0, 0, .8));
  /*Opera 11.10+*/
}

div.touch-upDown {
  padding: 0 60px 80px 180px;
  position: absolute;
  right: 30px;
  bottom: 0;
  width: 100%;
  z-index: 10;
}

div.touch-upDown .info {
  width: 50%;
  color: #FFF;
}

div.touch-upDown .info h2 {
  font-size: 48px;
  font-weight: bold;
  position: relative;
}

div.touch-upDown .info h2:after {
  display: block;
  content: '';
  border-bottom: 2px solid #FFF;
  width: 90px;
  margin: 15px 0;
}

div.touch-upDown .info p {
  font-size: 12px;
  padding-top: 15px;
  color: #999
}

div.touch-upDown a.btn-down {
  display: block;
  background: url("../images/download.svg") no-repeat left top;
  background-size: 100%;
  width: 52px;
  height: 64px;
  position: absolute;
  bottom: 90px;
  right: 36px;
  z-index: 1;
  transition: All 0.4s ease-in-out;
  -webkit-transition: All 0.4s ease-in-out;
  -moz-transition: All 0.4s ease-in-out;
  -o-transition: All 0.4s ease-in-out;
}

div.touch-upDown a.btn-down.active {
  bottom: 120px;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
}

@media (max-width: 1200px) {
  div.touch-upDown {
    padding: 0 36px 60px 146px;
  }

  div.touch-upDown .info {
    width: 70%;
  }

  div.touch-upDown .info h2 {
    font-size: 42px;
  }

}

@media (max-width: 768px) {
  div.touch-upDown {
    display: none;
  }
}

#link_index {
  padding: 20px 80px;
  background: #eee;
  margin-bottom: 30px;
  display: block;
  overflow: hidden;
}

#link_index span {
  overflow: hidden;
  display: block;
  color: #aaa;
  font-size: 16px;
  margin-bottom: 0.5em;
  font-weight: bold;
  background: url("../images/links_ico.png") no-repeat center left;
  padding-left: 25px;
}

#link_index span em {
  font-size: 12px;
  font-style: normal;
  color: #ccc;
  font-weight: normal
}

#link_index ul {
  display: block;
  overflow: hidden;
  line-height: 1.2;
}

#link_index ul li {
  float: left;
  font-size: 12px;
  margin-right: 15px;
  margin-top: 10px;
}

#link_index ul li a {
  color: #aaa;
}

@media (max-width: 1200px) {
  #link_index {
    display: none
  }
}

/*back2Top*/

/* side */
.side {
  position: fixed;
  width: 44px;
  /*height:275px;*/
  right: 0;
  top: 70%;
  z-index: 100;
}

.side ul li {
  width: 44px;
  height: 44px;
  float: left;
  position: relative;
}

.side ul li .sidebox {
  position: absolute;
  width: 44px;
  height: 44px;
  top: 0;
  right: 0;
  transition: all 0.3s;
  filter: Alpha(opacity=80);
  color: #5d5d5d;
  overflow: hidden;
  line-height: 44px;
}

.side ul li .sidetop {
  width: 44px;
  height: 44px;
  line-height: 44px;
  display: inline-block;
  background: #fff;
  opacity: 0.8;
  filter: Alpha(opacity=80);
  transition: all 0.3s;
}

.side ul li .sidetop:hover {
  background: #737373;
  opacity: 1;
  filter: Alpha(opacity=100);
}

.side ul li img {
  float: left;
  max-width: 100%;
  max-height: 100%;
}


/*返回顶部*/
a.back2top {
  display: block;
  width: 30px;
  height: 30px;
  background: url("../images/back-top2.png") no-repeat 0 0;
  position: fixed;
  right: 30px;
  bottom:
    80px;
  z-index: 99999;
}

a.back2top:hover {
  background-position: -30px 0;
}


div.back2Top {
  display: none;
  width: 50px;
  position: fixed;
  right: 0;
  bottom: 180px;
  z-index: 9997;
}

div.back2Top a {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  background: no-repeat center center;
  font-size: 0px;
  overflow: hidden;
  text-indent: -9999px;
  border-bottom: 1px solid #ddd;
  background: #fff;
}

div.back2Top a img {
  position: absolute;
  width: 50px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/*div.back2Top a.service-qq{ background:url('../images/lx.jpg') no-repeat; background-size: 100%;}*/
/*div.back2Top a.service-qq:after {*/
/*    content: '';*/
/*    width: 12px;*/
/*    height: 12px;*/
/*    border-radius: 50%;*/
/*    background-image: linear-gradient(to bottom, #f10000, #f10000);*/
/*    position: absolute;*/
/*    right: 1px;*/
/*    top: 1px;*/
/*	z-index: 50;}*/
/*div.back2Top a.service-message{ background:url('../images/wz1.jpg') no-repeat; background-size: 100%;}*/
/*div.back2Top a.service-ewm{ background:url('../images/wz2.jpg') no-repeat; background-size: 100%;}*/
/*div.back2Top a.btn-up{ background:url('../images/fh.jpg') no-repeat; background-size: 100%;}*/
/*div.back2Top a.btn-up:hover{ margin-top: 10px; background:url('../images/fh.jpg') no-repeat; background-size: 100%;}*/
div.back2Top.showTop {
  display: block;
}

@media (max-width: 768px) {
  div.back2Top.showTop {
    display: none;
  }

  .Recruitment .Recr_Title p {
    font-size: 12px;
  }

  .Recruitment .Application {
    padding: 1px 0;
    border: 1px solid #ccc
  }

  .Recruitment .Application p:first-of-type {
    font-size: 12px;
  }

  .Recruitment .Application p {
    font-size: 11px;
    transform: scale(.7)
  }

  .Recruitment .Recr_Position .Recr_Position_Title {
    font-size: 11px;
    line-height: 32px;
  }

  .procon_con {
    margin: 58px 2% 32px;
  }

  .procon_con .a {
    font-size: 15px;
    padding: 3px 21px;
  }

  .procon_con .fs_18 {
    font-size: 13px !important
  }

  .procon_con:last-child .fs_18 {
    font-size: 18px !important
  }

  .procon_con .fs_18 span {
    width: 1px;
    height: 1px;
  }

  .procon_con .t {
    font-size: 11px
  }

  .procon_con .t span {
    width: 2px !important;
    height: 2px !important
  }

  .procon_conf .t {
    font-size: 11px
  }

  .procon_con .ac {
    padding: 3px 23px;
  }

  .fs_18 {
    font-size: 13px
  }
}

div.footer .flex-item a {
  color: #9a9c9e
}

@media (max-width: 1024px) {
  div.footer .flex-item span.webmap {
    display: none
  }
}


.sitemap {
  width: 100%;
  padding-left: 80px;
  padding-right: 80px;
  overflow: hidden;
  padding-bottom: 50px;
}

@media (max-width: 1200px) {
  .sitemap {
    padding-left: 36px;
    padding-right: 36px;
  }
}

@media (max-width: 768px) {
  .sitemap {
    padding-left: 15px;
    padding-right: 15px;
  }
}

.sitemap h1 {
  font-size: 30px;
  color: #333;
  padding: 80px 0 30px;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 36px;
}

.sitemap dl {
  width: 100%;
  height: auto;
  float: left;
  overflow: hidden;
  padding-bottom: 60px;
}

.sitemap dl dt {
  font-size: 20px;
  color: #333;
  line-height: 28px;
  padding-bottom: 13px;
}

.sitemap dl dt a {
  color: #000
}

.sitemap dd {
  display: inline-block;
  font-size: 14px;
  float: left;
  margin-right: 15px;
}

.sitemap dd a {
  color: #999
}

#sale_info {
  background: #fff;
  width: 100%;
  padding: 20px 80px;
}

#sale_info .live_chat {
  width: 530px;
  overflow: hidden;
  margin: 10px auto 30px;
}

#sale_info .live_chat .live_img {
  float: left;
  width: 128px;
  border: 1px solid #f1f1f1;
  margin-right: 10px;
}

#sale_info .live_chat .live_img img {
  width: 100%;
  display: block;
}

#sale_info .live_chat .live_txt {
  float: right;
  width: 380px;
}

#sale_info .live_chat .live_txt h3 {
  height: 36px;
  line-height: 36px;
  font-weight: normal;
  font-size: 16px;
  margin: 0 0 5px 0;
}

#sale_info .live_chat .live_txt p {
  line-height: 24px;
  overflow: hidden;
  font-size: 14px;
  color: #999;
}

#sale_info p.about_info {
  font-size: 14px;
  margin-bottom: 10px;
  color: #666;
  border-top: 1px solid #dcdcdc;
  padding-top: 30px;
}

#sale_info p.about_info a {
  color: #666
}

@media (max-width: 1200px) {
  #sale_info {
    padding: 20px 36px;
  }
}

@media (max-width: 768px) {
  #sale_info {
    padding: 20px 15px;
  }

  #sale_info .live_chat {
    width: 100%;
    text-align: center
  }

  #sale_info .live_chat .live_img {
    float: none;
    width: 160px;
    margin: 0 auto 10px auto;
  }

  #sale_info .live_chat .live_txt {
    float: none;
    width: 100%;
  }
}

.padnone {
  padding-left: 0px !important;
  padding-right: 0px !important;
  border-top: 1px solid #dcdcdc;
  margin-top: 10px;
}


/*map*/
.contact-map {
  position: relative;
  margin-bottom: 60px;
  padding-bottom: 60px;
  text-align: center;
  /*border-bottom: 1px solid #999;*/
  background: #efefef;
}

.contact-map-img {
  position: relative;
  display: inline-block;
  margin: 200px 0 80px;
  width: 780px;
}

.contact-map-img img {
  width: 100%;
  height: auto;

}

.contact-map-img .map-point {
  position: absolute;
  width: 7px;
  height: 7px;
  background-color: #707070;
  border-radius: 50%;

  cursor: pointer;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  -moz-transition: all .3s;
  transition: all .3s;
  z-index: 88
}

.contact-map-img .map-select {
  display: none;
}

.contact-map-img .map-point p {
  display: none;
}

.contact-map-img .map-point::before {
  position: absolute;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  content: '';
  left: 0px;
  border: 1px solid #707070;
  top: -2px;
  left: -2px;
}

.contact-map-img .map-point.on::before {
  position: absolute;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  content: '';
  left: 0px;
  border: 1px solid black;
  top: -2px;
  left: -2px;
}

.contact-map-img .map-point.on::after {
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  content: '';
  left: 0px;
}

.contact-map-img .map-point.on::before {
  animation: scale 2s infinite;
}

.contact-map-img .map-point.on::after {
  animation: scale2 2s infinite;
}

@keyframes scale {
  0% {
    transform: scale(1);
    opacity: .9
  }

  100% {
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes scale2 {
  0% {
    transform: scale(1);
    opacity: .9;
  }

  100% {
    transform: scale(3);
    opacity: 0;
  }
}


.contact-map-img .map-point::before {
  /* 设置颜色 */
  /* background-color: rgba(255,255, 255, .9);*/

}

.contact-map-img .map-point.on::after {
  /* 设置颜色 */
  background-color: rgba(0, 0, 0, .9);
}



.contact-map-img .map-point[data-point="1"] {
  right: 28.4%;
  bottom: 16.9%;
}

.contact-map-img .map-point[data-point="2"] {
  right: 53.6%;
  bottom: 17.6%;
}

.contact-map-img .map-point[data-point="3"] {
  right: 11.4%;
  bottom: 80.29%;
}

.contact-map-img .map-point[data-point="4"] {
  right: 17.4%;
  bottom: 32.5%;
}

.contact-map-img .map-point[data-point="5"] {
  right: 37.4%;
  bottom: 15.5%;
}

.contact-map-img .map-point[data-point="6"] {
  right: 32.4%;
  bottom: 26.5%;
}

.contact-map-img .map-point[data-point="7"] {
  right: 32.4%;
  bottom: 35.5%;
}

.contact-map-img .map-point[data-point="8"] {
  right: 19%;
  bottom: 42%;
}

.contact-map-img .map-point[data-point="9"] {
  right: 23%;
  bottom: 50%;
}

.contact-map-img .map-point[data-point="10"] {
  right: 34%;
  bottom: 50%;
}

.contact-map-img .map-point[data-point="11"] {
  right: 44%;
  bottom: 55%;
}

@media screen and (max-width: 1200px) {
  .contact-map-img {
    margin: 30px 0 60px;
    width: 80%
  }
}

@media screen and (max-width: 1024px) {
  .contact-map {
    padding-bottom: 40px;
    margin-bottom: 45px
  }

  .contact-map-img {
    display: block;
    margin: 20px 0 40px;
    width: 100%
  }

  .contact-map-img img {
    width: auto;
    max-width: 100%
  }

  .contact-map-img map {
    display: none
  }
}

@media screen and (max-width: 750px) {
  .contact-map {
    padding-bottom: auto;
    margin-bottom: auto
  }

  .contact-map-img {
    margin-bottom: 30px;
    margin: 20px 3% 40px;
    width: 94%;
  }

  .contact-map-img .map-point {
    background-color: rgb(255, 255, 255)
  }

  .contact-map-img .map-point.on {
    background-color: rgb(200, 200, 200)
  }

  .contact-map-img img {
    margin-bottom: 3em;
  }

  .contact-map-img .map-point {
    position: initial;
    border-radius: 3px;
    padding: 6px 0;
    display: none;
  }

  .contact-map-img .map-point p {
    display: inline-block;
    width: 49%;
    color: #000;
  }

  .contact-map-img .map-point.on::before,
  .contact-map-img .map-point::before {
    content: none !important;
  }

  .contact-map-img .map-point.on::after,
  .contact-map-img .map-point::after {
    content: none !important;
  }


}

.connent {
  margin-bottom: 20px !important;
}

.contact-address {
  position: relative;
  color: #333;

}

.contact-address .title {
  margin-bottom: 5px;
  color: #666
    /*808080*/
}

.contact-address p {
  color: #666
    /*808080*/
}

.contact-address-item {
  display: none
}

.contact-address-item .bt {
  font-size: 14px;
  font-weight: bolder;
}

.contact-address-item[data-point='1'] {
  position: absolute;
  bottom: 60px;
  right: -15%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: left;
  display: block
}

.contact-address-item[data-point='2'] {
  position: absolute;
  bottom: 63px;
  right: 57%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: right;
  z-index: 99;
}

.contact-address-item[data-point='3'] {
  position: absolute;
  bottom: 480px;
  right: -28%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: left;
}

.contact-address-item[data-point='4'] {
  position: absolute;
  bottom: 160px;
  right: -26%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: left;
}

.contact-address-item[data-point='5'] {
  position: absolute;
  right: 40%;
  bottom: 50px;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: right;
}

.contact-address-item[data-point='6'] {
  position: absolute;
  bottom: 120px;
  right: 35%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: right;
}

.contact-address-item[data-point='7'] {
  position: absolute;
  bottom: 180px;
  right: 35%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: right;
}

.contact-address-item[data-point='8'] {
  position: absolute;
  bottom: 220px;
  right: -35%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: left;
}

.contact-address-item[data-point='9'] {
  position: absolute;
  bottom: 280px;
  right: -10%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: left;
}

.contact-address-item[data-point='10'] {
  position: absolute;
  bottom: 280px;
  right: 37%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: right;
}

.contact-address-item[data-point='11'] {
  position: absolute;
  bottom: 310px;
  right: 47%;
  background: rgb(245, 245, 245);
  border: 1px solid #999;
  padding: 11px;
  text-align: right;
}

@media screen and (max-width: 750px) {
  .contact-map-img .map-select {
    display: initial;
    width: 99%;
    height: 38px;
    padding: 10px 13px;
    border: 1px #ccc solid;
    border-radius: 5px;
    color: #666;
    background: url("../images/select.png") no-repeat scroll right center white;
    background-position: 96%;
  }

  .contact-map-img .map-select {
    /*Chrome同Firefox与IE里面的右侧三角显示的样式不同*/
    /*将默认的select选择框样式清除*/
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
  }

  .contact-address-item[data-point='1'],
  .contact-address-item[data-point='2'],
  .contact-address-item[data-point='3'],
  .contact-address-item[data-point='4'] {
    position: relative;
    right: 0;
    bottom: 0;
    margin-top: 21px !important;
    text-align: center;
    background: transparent;
    border: none;
  }

  .contact-address-item[data-point='2'],
  .contact-address-item[data-point='3'],
  .contact-address-item[data-point='4'] {
    display: none;

  }
}

@media screen and (max-width: 1440px) {
  .contact-address {
    font-size: 18px;
    line-height: 44px
  }

  .contact-address .title {
    margin-bottom: 16px;
    font-size: 28px
  }
}

@media screen and (max-width: 1024px) {
  .contact-address {
    font-size: 16px;
    line-height: 40px
  }

  .contact-address .title {
    margin-bottom: 12px;
    font-size: 24px
  }
}

@media screen and (max-width: 750px) {
  .contact-address {
    font-size: 14px;
    line-height: 32px;
    display: none;
  }

  .contact-address .title {
    margin-bottom: 6px;
    font-size: 20px
  }

  .contact-address-item {
    display: block
  }

  .contact-address-item+.contact-address-item {
    margin-top: 25px
  }
}

.product-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;

}

.product-list li {

  width: 50%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

/*.product-list li:nth-child(n+3) {*/
/*	margin-top: 60px*/
/*}*/

.product-list li .a-box {
  display: block;
  text-align: center;
  cursor: pointer;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
  -moz-transition: all .4s;
  transition: all .4s
}

.product-list li .a-box:hover .img {
  -webkit-transform: translateY(-.02rem);
  -moz-transform: translateY(-.02rem);
  -ms-transform: translateY(-.02rem);
  transform: translateY(-.02rem);
  -webkit-box-shadow: 0 .05rem .15rem -.05rem rgba(0, 0, 0, 0.3);
  box-shadow: 0 .05rem .15rem -.05rem rgba(0, 0, 0, 0.3)
}

.product-list li .a-box:hover dd {
  opacity: 0;
}

.product-list li .a-box:hover .img:before {
  opacity: 0;
  visibility: visible
}

.product-list li .a-box:hover .img:after {
  -webkit-transform: translate(-50%, -50%) rotate(0) scale(1);
  -moz-transform: translate(-50%, -50%) rotate(0) scale(1);
  -ms-transform: translate(-50%, -50%) rotate(0) scale(1);
  transform: translate(-50%, -50%) rotate(0) scale(1)
}

.product-list li .img {
  position: relative;
  height: 0;
  padding-bottom: 60.35088%;
  overflow: hidden;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
  -moz-transition: all .4s;
  transition: all .4s
}

.product-list li .img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

.product-list li .img:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 2;
  opacity: 1;
  visibility: visible;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
  -moz-transition: all .4s;
  transition: all .4s
}

.product-list li .img:after {
  /*content: '\e735';*/
  content: '';
  background: url('../images/qw.png') no-repeat center;
  position: absolute;
  width: 20px;
  height: 20px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(360deg) scale(0);
  -moz-transform: translate(-50%, -50%) rotate(360deg) scale(0);
  -ms-transform: translate(-50%, -50%) rotate(360deg) scale(0);
  transform: translate(-50%, -50%) rotate(360deg) scale(0);
  font-size: 30px;
  color: #fff;
  z-index: 4;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
  -moz-transition: all .4s;
  transition: all .4s
}

.product-list li h3 {
  margin-top: 25px;
  line-height: 1.2;
  font-size: 20px;
  color: #000;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden
}

@media screen and (max-width: 1440px) {

  .product-list li h3 {
    font-size: 20px
  }
}

@media screen and (max-width: 1200px) {
  .product-list {
    margin: 0 -20px
  }

  .product-list li {
    padding: 0 20px
  }

  .product-list li:nth-child(n+3) {
    margin-top: 40px
  }

  .product-list li h3 {
    margin-top: 20px
  }
}

@media screen and (max-width: 1024px) {
  .product-list {
    margin: 0 -.075rem
  }

  .product-list li {
    padding: 0 .075rem
  }

  .product-list li:nth-child(n+3) {
    margin-top: .175rem
  }


  .product-list li h3 {
    margin-top: 15px;
    font-size: 18px
  }
}

@media screen and (max-width: 750px) {
  .product-list li .img:after {
    width: 11px;
    height: 11px;
    background-size: 100% 100%;
  }

  .product-list li h3 {
    margin-top: 8px;
    font-size: 15px
  }
}

@media (max-width: 758px) {
  #process {
    margin-top: 6em;
  }

  #application {
    margin-top: 4em
  }

  .application .Application .Application_form .Application_form_input .form_btn {
    border: none
  }

  .newpor_content .newPor_Con:nth-child(5) .newPor_Title .newPor_znTitle {
    border-bottom: none;
  }

  .newpor_content .NewPor_Con .newPor_Title .newPor_enTitle::before {
    width: 69px;
  }

  .newpor_content .NewPor_Con:nth-child(4) .newPor_Title .newPor_enTitle::before {
    width: 68px;
  }

  .newpor_content .NewPor_Con:nth-child(5) .newPor_Title .newPor_enTitle::before {
    background: #000 !important;
  }

  .Recruitment {
    width: 86% !important;
    margin: 9% 7% 0
  }

  #recruitment .Recruitment {
    width: 100% !important;
    margin: 0
  }

  .Recruitment .Recr_Position {
    font-size: 11px
  }

  .Recruitment .Recr_xian {
    display: none
  }

  .footer-icon-list .app-qrcode {
    width: 70px !important;
    height: 70px !important;
    margin-top: -79px !important;
    margin-left: -22px !important;
  }

  .footer-icon-list .app-qrcode:before {
    top: 70px !important;
    left: 28px !important;
  }

  .footer-icon-list .app-qrcode:after {
    top: 70px !important;
    left: 28px !important;
  }

  .playVideo_pc {
    display: none
  }

  .playVideo_mb {
    display: block !important
  }
}

.playVideo_mb {
  display: none
}

.Banner_Title_a {
  width: 100%;
  height:100%
}

.Por_Con a,
.newPor_Con a,
.Category a {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}