.hs-h10-grid {
  margin-top: 4.5313rem;
  height: 31.3542rem;
  background: url(../images/H10-bj.jpg) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.h10-1-wrap {
  text-align: center;
  margin-top: 0.1rem;
}

.h10-1-wrap > img {
  width: 56.04rem;
  /* height: 14.9rem; */
  height:auto;
}

.h10-name,
.h8-name,
.h9-name {
  font-family: PingFang SC;
  font-weight: 600;
  font-size: 2.19rem;
  color: #ffffff;
  margin-top: 2.45rem;
  text-align: center;
}

.h10-subtitle,
.h8-subtitle,
.h9-subtitle {
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 0.63rem;
  color: #ffffff;
  margin-top: 0.8854rem;
  text-align: center;
  letter-spacing: 0.2083rem;
}

.h10-morebtn {
  display: block;
  width: 5.68rem;
  height: 1.83rem;
  border-radius: 0.86rem;
  border: 0.1042rem solid #ffffff;
  margin: 0 auto;
  margin-top: 0.99rem;
  text-align: center;
  font-family: PingFang SC;
  font-weight: 600;
  font-size: 0.63rem;
  color: #edeef0;
  line-height: 1.83rem;
}

.hs-h8-h9-grid {
  margin-top: 1.3rem;
  height: 27.76rem;
}

.hs-h8-h9-wrap {
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-column-gap: 0.52rem;
  -moz-column-gap: 0.52rem;
  column-gap: 0.52rem;
}

.hs-h8-wrap {
  height: 27.76rem;
  width: 49.74rem;
  background: url(../images/H8-bj.jpg) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.hs-h9-wrap {
  height: 27.76rem;
  width: 49.74rem;
  background: url(../images/hsh9.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.h8-1-wrap{
  text-align: center;
  margin-top: 0.1rem;
}
.h9-1-wrap {
  text-align: center;
  margin-top: 3.23rem;
}

.h8-1-wrap > img {
  /* width: 42.81rem; */
  /* height: 11.77rem; */
  width:38.81rem;
  height:auto;
}

.h9-1-wrap > img {
  width: 38.65rem;
  height: 11.09rem;
}

.hs-h6-grid {
  height: 27.76rem;
  margin-top: 0.52rem;
  background: url(../images/hsh6.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.h6-1-wrap {
  text-align: center;
  margin-top: 2.66rem;
}

.h6-1-wrap > img {
  width: 51.15rem;
  height: 14.53rem;
}

.explore-hs-wrap {
  margin-top: 6.25rem;
}

.explore-title {
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 3.13rem;
  color: #2c2c2c;
  text-align: center;
}

.explore-subtitle {
  margin: 0 auto;
  margin-top: 2.08rem;
  font-family: PingFang SC;
  width: 60.22rem;
  font-weight: 400;
  font-size: 1.77rem;
  color: #828282;
  line-height: 2.6rem;
  text-align: center;
}

.explore-list {
  margin-top: 4.01rem;
  display: grid;
  display: -ms-grid;
  display: -moz-grid;
  grid-template-columns: repeat(2, 40.83rem);
  grid-template-rows: repeat(3, 25.05rem);
  -webkit-column-gap: 1.77rem;
  -moz-column-gap: 1.77rem;
  column-gap: 1.77rem;
  row-gap: 1.35rem;
  padding: 0 7.79rem;
}

.explore-list-i {
  /* width: 40.83rem;
  height: 25.05rem; */
  text-align: center;
}

.explore-list-i:nth-of-type(1) {
  background: url(../images/explore1.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.explore-list-i:nth-of-type(2) {
  background: url(../images/explore2.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.explore-list-i:nth-of-type(3) {
  background: url(../images/explore3.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.explore-list-i:nth-of-type(4) {
  background: url(../images/explore4.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.explore-list-i:nth-of-type(5) {
  background: url(../images/explore5.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.explore-list-i:nth-of-type(6) {
  background: url(../images/explore6.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.explore-list-i-t {
  margin-top: 16.25rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 1.88rem;
  color: #ffffff;
}

.explore-list-i-st {
  margin-top: 1.2rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 1.04rem;
  color: #ffffff;
}

.explore-more {
  display: block;
  margin-top: 1.46rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 0.78rem;
  color: #ffffff;
}

.explore-pz-wrap {
  margin: 0 auto;
  margin-top: 1.35rem;
  height: 25.05rem;
  width: 83.33rem;
  background: url(../images/pz.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
  text-align: center;
}

.explore-pz-title {
  margin-top: 19.79rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 1.88rem;
  color: #ffffff;
}

.explore-pz-more {
  display: block;
  margin-top: 0.83rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 0.78rem;
  color: #ffffff;
}

.know-hs-wrap {
  margin-top: 6.2rem;
  text-align: center;
}

.know-hs-title {
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 3.13rem;
  color: #2c2c2c;
}

.know-hs-subtitle {
  margin-top: 2.08rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 1.77rem;
  color: #828282;
}

.know-hs-list {
  margin-top: 4.01rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-column-gap: 1.82rem;
  -moz-column-gap: 1.82rem;
  column-gap: 1.82rem;
}

.know-hs-i {
  width: 40.78rem;
  height: 37.97rem;
  text-align: center;
}

.know-hs-i:nth-of-type(1) {
  background: url(../images/know1.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.know-hs-i:nth-of-type(2) {
  background: url(../images/know2.png) no-repeat;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
}

.know-hs-i-t {
  margin-top: 28.65rem;
  font-family: PingFang SC;
  font-weight: 600;
  font-size: 1.88rem;
  color: #ffffff;
}

.know-hs-i-st {
  margin-top: 1.2rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 1.04rem;
  color: #ffffff;
}

.know-more {
  display: block;
  margin-top: 1.41rem;
  font-family: PingFang SC;
  font-weight: 400;
  font-size: 0.78rem;
  color: #ffffff;
}

@media (max-width: 480px) {
  .container-grid .hs-h10-grid {
    margin-top: 0;
    height: 82rem;
    background: url(../images/H10-bj.jpg) no-repeat;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
  }

  .h10-1-wrap {
    /* margin-top: 17.33rem; */
  }

  .h10-1-wrap > img {
    width: 96.4rem;
    /* height: 25.6rem; */
  }

  .hs-h10-grid .h10-name,
  .hs-h8-wrap .h8-name,
  .hs-h9-wrap .h9-name,
  .hs-h6-grid .h10-name {
    margin-top: 9.87rem;
    font-size: 7.47rem;
  }

  .hs-h10-grid .h10-subtitle,
  .hs-h8-wrap .h8-subtitle,
  .hs-h9-wrap .h9-subtitle,
  .hs-h6-grid .h10-subtitle {
    margin-top: 2.93rem;
    font-size: 2.13rem;
  }

  .hs-h10-grid .h10-morebtn,
  .hs-h8-wrap .h10-morebtn,
  .hs-h9-wrap .h10-morebtn,
  .hs-h6-grid .h10-morebtn {
    margin-top: 3.6rem;
    width: 19.27rem;
    height: 6.25rem;
    line-height: 6.25rem;
    border-radius: 2.93rem;
    font-size: 2.13rem;
    border: 0.5rem solid #ffffff;
  }

  .container-grid .hs-h8-h9-grid {
    margin-top: 0;
    height: auto;
  }

  .hs-h8-h9-grid .hs-h8-h9-wrap {
    display: block;
  }

  .hs-h8-h9-wrap .hs-h8-wrap {
    height: 82rem;
    width: 100vw;
    background: url(../images/H8-bj.jpg) no-repeat;
    -o-background-size: cover;
    background-size: cover;
  }

  /* .hs-h8-wrap .h8-1-wrap, */
  .hs-h9-wrap .h9-1-wrap {
    margin-top: 17.33rem;
  }

  .h8-1-wrap .h8-1 {
    width: 97.07rem;
    /* height: 26.67rem; */
  	height:auto;
  }

  .hs-h8-h9-wrap .hs-h9-wrap {
    height: 92rem;
    width: 100vw;
    background: url(../images/mobile/h-3.png) no-repeat;
    -o-background-size: cover;
    background-size: cover;
  }

  .h9-1-wrap .h9-1 {
    width: 98.4rem;
    height: 28.13rem;
  }

  .container-grid .hs-h6-grid {
    margin-top: 0;
    height: 92.13rem;
    width: 100vw;
    background: url(../images/mobile/h-4.png) no-repeat;
    -o-background-size: cover;
    background-size: cover;
  }

  .h6-1-wrap .h6-1 {
    width: 97.87rem;
    height: 27.73rem;
  }

  .hs-h6-grid .h6-1-wrap {
    margin-top: 17.33rem;
  }

  .explore-hs-wrap {
    margin-top: 10.13rem;
  }

  .explore-title {
    font-size: 6.4rem;
    font-weight: 400;
  }

  .explore-subtitle {
    margin: 0 auto;
    margin-top: 4.27rem;
    font-size: 3.47rem;
    line-height: 6.4rem;
    width: 74.27rem;
  }

  .explore-list {
    margin-top: 10rem;
    padding: 0;
    grid-template-columns: 100%;
    -ms-grid-columns: 100%;
    grid-template-rows: repeat(6,64.13rem);
    -ms-grid-rows: repeat(6,64.13rem);
    row-gap: 0;
  }

  /* .explore-list-i {
    width: 100vw;
    height: 64.13rem;
  } */

  .explore-list-i-t {
    margin-top: 42.93rem;
    font-size: 4.8rem;
  }

  .explore-list-i-st {
    margin-top: 3.07rem;
    font-size: 2.67rem;
    letter-spacing: 0.2rem;
  }

  .explore-more {
    margin-top: 3.73rem;
    font-size: 2rem;
  }

  .explore-list-i:nth-of-type(n + 3) {
    margin-top: -1rem;
  }

  .explore-pz-wrap {
    margin-top: 0;
    width: 100vw;
    height: 64.13rem;
    background: url(../images/mobile/h-11.png) no-repeat;
    -o-background-size: cover;
    background-size: cover;
  }

  .explore-pz-title {
    margin-top: 50.67rem;
    font-size: 4.8rem;
  }

  .explore-pz-more {
    margin-top: 2.13rem;
    font-size: 2rem;
  }

  .know-hs-wrap {
    margin-top: 10.13rem;
  }

  .know-hs-title {
    font-size: 6.4rem;
  }

  .know-hs-subtitle {
    margin-top: 4.27rem;
    font-size: 3.47rem;
    color: #828282;
  }

  .know-hs-list {
    margin-top: 10.27rem;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0;
  }

  .know-hs-i {
    width: 100vw;
    height: 97.2rem;
  }

  .know-hs-i-t {
    margin-top: 73.33rem;
    font-size: 4.8rem;
  }

  .know-hs-i-st {
    margin-top: 3.07rem;
    font-size: 2.67rem;
  }

  .know-more {
    margin-top: 3.6rem;
    font-size: 1.99rem;
  }
}
