.ecotope-introduce{
  margin: 0 auto;
  width: 1200px;
  margin-top: 80px;
}

.yyjz{
  margin: 0 auto;
  margin-top: 204px;
}


.yyjz-item{
  text-align: center;
}

.hj-top1{
  margin: 0 auto;
  width: 1200px;
  display: flex;
  margin-top: 40px;
}

.hj-top1-left{
  width: 600px;
  aspect-ratio: 300/234;
  margin-right: 24px;
}

.hj-top1-left>img{
  width: 100%;
  height: 100%;
}

.hj-top1-right{
  flex: 1;
}

.hj-main-heading{
  align-self: stretch;
 color: #1d2129;
 font-family: "OPPOSans";
 font-size: 24px;
 font-style: normal;
 font-weight: 500;
 line-height: 32px;
}

.hj-sub-heading{
  align-self: stretch;
  color: #1d2129;
  font-family: "OPPOSans";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.top1-ym{
  margin-top: 80px;
}

.top1-mx{
  margin-top: 43px;
}

.top1-sj{
  margin-top: 43px;
}

.hj-top2{
  margin: 0 auto;
  width: 1200px;
  height: 640px;
  background-image: url(../images/hj-top2.png);
  background-size: 560px 560px;
  background-repeat: no-repeat;
  background-position: 50%;
  position: relative;
  margin-top: 72px;
}

.hj-top2-item{
  width: 408px;
  padding: 16px;
}

.hj-top2-item>.hj-main-heading{
  position: relative;
  margin-bottom: 10px;
}

.hj-top2-item>.hj-main-heading::before{
  content: ' ';
  width: 32px;
  height: 24px;
  background-image: url(../images/hj-top2-title.png);
  background-size: 32px 24px;
  background-repeat: no-repeat;
  position: absolute;
  left: -40px;
  top: 5px;
}

.hj-top2-sjct,.hj-top2-gxhbg,.hj-top2-yxfx,.hj-top2-zcjd{
  position: absolute;
}

.hj-top2-sjct{
  top: 204px;
}
.ecotope{
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}


.hj-top2-gxhbg{
    top: 180px;
    right: -32px;
}

.hj-top2-yxfx{
  top: 449px;
}

.hj-top2-zcjd{
  right: -32px;
  top: 470px;
}

.gnmk{
  margin-top: 160px;
}

.hj-shape-img{
  width: 500px;
  aspect-ratio: 125/75;
}


 /* 768以下 */
 @media (max-width: 768px) {
  .ecotope-introduce{
    width: calc(100% - 24px);
  }

  .hj-top1 {
    width: calc(100% - 24px);
      flex-direction: column;
  }

  .hj-top1-left {
    width: 100%;
      aspect-ratio: 300 / 234;
      margin-right: 0px;
  }

  .hj-top1-left>img {
      width: 100%;
      height: 100%;
  }
  .hj-top2 {
      width: calc(100% - 24px);
      background-size: 100%;
      height: min-content;
      background-position: initial;
      overflow: hidden;
  }

  .hj-top2-item {
      position: initial;
      width: calc(100% - 72px);
      padding: 0;
      margin: 0 auto;
  }



  .hj-main-heading{
    color: #1d2129;
    font-family: "OPPOSans";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }

  .hj-sub-heading{
    color: #1d2129;
    font-family: "OPPOSans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
  }

  .hj-top2-item{
    margin-top: 36px;
  }

  .hj-top2-sjct{
    margin-top: 100vw;
  }

  .yyjz {
      margin-top: 80px;
  }

  .gnmk {
    margin-top: 60px;
}

.hj-shape-img {
  width: 100%;
  aspect-ratio: 125 / 75;
}
 }