.topBanner {
  margin-top: 1px;
  color: white;
  padding: 1.5% 0 3%;
}

.topBanner .crumbs {
  font-size: 14px;
  color: white;
}

.topBanner .txtImg {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.topBanner .txtImg .txt {
  width: 57%;
  color: white;
  margin-top: 5%;
}

.topBanner .txtImg .txt h2 {
  font-size: 48px;
}

.topBanner .txtImg .txt span {
  font-size: 48px;
  margin: 2% 0 4%;
  display: inline-block;
}

.topBanner .txtImg .txt p {
  font-size: 18px;
}

.topBanner .txtImg .img {
  width: 43%;
}

@media (max-width: 1200px) {
  .topBanner .txtImg .txt h2, .topBanner .txtImg .txt span {
    font-size: 38px;
  }
  .topBanner .txtImg .txt p {
    font-size: 17px;
  }
}

@media (max-width: 992px) {
  .topBanner .txtImg .txt h2, .topBanner .txtImg .txt span {
    font-size: 30px;
  }
  .topBanner .txtImg .txt p {
    font-size: 16px;
  }
}

@media (max-width: 768px) {
  .topBanner {
    margin: 0;
  }
  .topBanner .txtImg {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .topBanner .txtImg .txt {
    width: 100%;
    text-align: center;
    margin-bottom: 5%;
  }
  .topBanner .txtImg .img {
    width: 55%;
    margin: 0 auto;
  }
}

@media (max-width: 480px) {
  .topBanner .crumbs {
    font-size: 12px;
  }
  .topBanner .txtImg .txt h2, .topBanner .txtImg .txt span {
    font-size: 20px;
  }
  .topBanner .txtImg .txt p {
    font-size: 13px;
  }
}

.productIntroduce {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.productIntroduce p {
  width: 62%;
  font-size: 18px;
  color: #222;
  line-height: 36px;
}

.productIntroduce img {
  width: 28%;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

@media (max-width: 992px) {
  .productIntroduce p {
    font-size: 16px;
    line-height: 30px;
  }
}

@media (max-width: 768px) {
  .productIntroduce {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .productIntroduce p {
    width: 100%;
  }
  .productIntroduce img {
    width: 80%;
    margin-top: 5%;
  }
}

@media (max-width: 480px) {
  .productIntroduce p {
    font-size: 13px;
    line-height: 26px;
    margin-top: 2%;
  }
}

.meritList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 3% 0 5%;
  flex-wrap:wrap;
}

.meritList li {
  width: 32%;
  background-size: cover;
  border-radius: 4px;
  transition: all .5s ease;
  -webkit-transition: all .5s ease;
  background-size: cover;
}

.meritList li p {
  line-height: 200px;
  width: 100%;
  text-align: center;
  font-size: 26px;
  color: white;
}

@media (max-width: 996px) {
  .meritList li p {
    line-height: 160px;
    font-size: 22px;
  }
}

@media (max-width: 768px) {
  .meritList li p {
    line-height: 128px;
    font-size: 19px;
  }
}

@media (max-width: 480px) {
  .meritList li p {
    line-height: 100px;
    font-size: 16px;
  }
}

.des li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 5%;
}

.des li img {
  width: 48%;
  border-radius: 4px;
}

.des li .txt {
  width: 56%;
  height: 330px;
  color: #333;
  background: #e9e9e9;
  border-radius: 4px;
  padding: 4%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.des li .txt h3 {
  font-size: 36px;
  font-weight: 600;
  margin-bottom: 5%;
}

.des li .txt p {
  font-size: 18px;
  line-height: 36px;
  height: 60%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

@media (max-width: 1200px) {
  .des li .txt {
    height: 297px;
    padding: 3%;
  }
  .des li .txt h3 {
    font-size: 29px;
  }
  .des li .txt p {
    font-size: 16px;
  }
}

@media (max-width: 996px) {
  .des li .txt {
    height: 220px;
  }
  .des li .txt h3 {
    font-size: 23px;
  }
  .des li .txt p {
    font-size: 15px;
    line-height: 26px;
  }
}

@media (max-width: 768px) {
  .des li {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .des li .txt {
    width: 100%;
  }
  .des li img {
    width: 100%;
  }
  .des li .txt p {
    height: 55%;
  }
}

@media (max-width: 480px) {
  .des li .txt h3 {
    font-size: 20px;
  }
  .des li .txt p {
    font-size: 14px;
    height: 53%;
  }
}

.downList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 3% 0 10%;
}

.downList li {
  width: 30%;
  height: 310px;
  border: 1px solid #b5b5b5;
  transition: all .5s ease;
  -webkit-transition: all .5s ease;
}

.downList li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 100%;
}

.downList li a img {
  width: 39%;
}

.downList li a p {
  margin-top: 10%;
  width: 158px;
  height: 43px;
  font-size: 18px;
  line-height: 43px;
  text-align: center;
  color: white;
  background: #952222;
  border-radius: 4px;
}

@media (max-width: 996px) {
  .downList li {
    height: 248px;
  }
  .downList li a p {
    width: 126px;
    height: 34px;
    line-height: 34px;
    font-size: 15px;
  }
}

@media (max-width: 768px) {
  .downList li {
    height: 198px;
  }
  .downList li a p {
    width: 101px;
    height: 27px;
    line-height: 27px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .downList li {
    width: 45%;
    height: 158px;
    margin-bottom: 5%;
  }
}

.downList li:hover {
  transform: translateY(-5px);
  -webkit-transform: translateY(-5px);
}

.meritList li:hover {
  transform: translateY(-5px);
  -webkit-transform: translateY(-5px);
}

.fooContact {
  height: 115px;
  line-height: 115px;
}

.fooContact .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.fooContact img {
  width: 48px;
}

.fooContact a {
  font-size: 22px;
  color: white;
  margin-left: 1%;
}

@media (max-width: 768px) {
  .fooContact a {
    font-size: 20px;
  }
}

@media (max-width: 480px) {
  .fooContact {
    height: 95px;
    line-height: 95px;
  }
  .fooContact a {
    font-size: 18px;
  }
}


.topBanner1 {
    width: 100%;
    height: 560px;
    position: relative;
}

@media (max-width: 1200px) {
    .topBanner1 {
        height: 450px;
    }
}

@media (max-width: 996px) {
    .topBanner1 {
        height: 385px;
    }
}

@media (max-width: 768px) {
    .topBanner1 {
        height: 308px;
    }
}

@media (max-width: 480px) {
    .topBanner1 {
        height: 265px;
    }
}