.smartRanch{
    text-align: center;
    font-size: 20px;
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
    margin-top: 20px;
}

.introduceList-top{
    display: flex;

}

.milkDay-circle img{
    text-align:center ;
    width: 60%;

}
.milkDay-circle {
    text-align:center ;
   
}
.milkDay-text{
    width: 100%;
    height: 220px;
    margin-top: 40px;
    font-size: 12px;
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
}

.introduceList-top-l{
    width: 34%;
}
.introduceList-top-m{
    width: 33%;
}
.introduceList-top-m img{
      margin-top:90px ;
      width:90%;
}
.introduceList-top-r{
    width: 33%;
    float: right;
    margin-top: 50px;
}
.example-circle img{
    width: 85% ;

   
}
.example-text{
    width: 85%;
    height: 250px;
    font-size: 12px;
    margin-top: 40px;
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
}
.digital{
    position:relative;
    display: flex;
}

.digital-circle {
    width: 33%;
    
}
.digital-circle .digital-img{
    margin-left: 45%;
    width: 60% ;
    margin-top: 50px;
}

.digital-text{
    float: right;
   
    width: 35%;
    margin-right: 8%;
    height: 210px;
    padding-top: 80px;
    margin-left: 33%;
    font-size: 12px;
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
}
.address{
    margin-top: 150px;position:relative
}
.address-circle{
   float: right;
   width: 56% ;
    /* marg
    in-right: 50px; */
}
.address-circle-line{
    width: 55%;position: absolute;top:-13%;left:23%;
}
.address-circle img{
    width:50%;
    margin-left: 50%;


}
.address-text{
    display: inline-block;
    width: 35%;
    height: 210px;
    font-size: 12px;
    margin-left: 40px;
    margin-top:20px;
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
}
.channel{
    margin-top: 150px;position:relative
}
.channel-circle{
    margin-left: 80px;
    display: inline-block;
    width: 35%;


}
.channel-circle_line{
    width: 50%;position: absolute;top:-60%;left:24%;
}
.channel-circle img{
    width: 65%;
    
}
.channel-text{
    float: right;

    margin-top: 60px;
    /* display: inline-block; */
    width:54%;
    font-size: 12px;
    /* margin-left: 10%; */
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
}
.match{
    margin: 220px 0px 500px 0;position:relative
}
.match-circle{
    width: 40%;
    float: right;
    /* display: inline-block; */
}
.match-text-line{
    width: 40%;position: absolute;top:-90%;left:24%;
}
.match-circle img{
    width: 80%;
    /* width: 230px;
    height: 230px;
    margin-right: 160px; */
    /* display: inline-block; */
}
.match-text{
    margin-top: 40px;
    display:inline-block ;
    width: 50%;
    font-size: 12px;
    
    font-family: PingFang SC-Thin, PingFang SC;
    font-weight: 100;
    color: #000000;
}


@media screen and (max-width:699px){
    .introduceList{
        margin: 150px aotu;
        padding: 0 10% 880px;
    }
    .smartRanch{
         font-size: 18px;
         padding: 0 10%;
    }
    .digital-circle-line{
        display: none;
    }
    .address-circle-line{
        display: none;
    }
    .channel-circle_line{
        display: none;
    }
    .match-text-line{
        display: none;
    }
    .wu {
        position: relative;
        top: -300px;
    }
    .introduceList-top {
       
       display: inline-block;
    }
    .introduceList-top-m {
     width: 0;
     display: none;
    }
    .introduceList-top-l {
        margin-top: 80px;
        width: 100%;
    }
    .milkDay-circle img {
        width: 40%;
    }
    .example-circle {
        text-align: center;
    }
    .example-circle img {
        width: 40%;
    }
    .introduceList-top-r {
        width: 100%;
    }
    .example-text{
        height: 200px;
        width: 100%;
    }
    .digital{
        display: block;
        margin-bottom: 100px;
    }
    .digital-circle {
        text-align: center;
        width: 100%;
    }
    .digital-circle .digital-img {
        margin: 0;
        width: 40%;
    
    }
    .digital-text {
        /* float: right; */
        width: 100%;
        height: 200px;
        padding-top: 0px;
        margin:40px 0 0;
       
    }
    .address{
        margin-top: 420px;
        height: 600px;
    }
    
    .address-text{
       width: 100%;
       height: 200px;
       margin: 0;
    }
    .address-circle{
        width: 100%;
        text-align: center;
    }
    .address-circle img{
       width: 40%;
       margin: 0;
       position: absolute;
       bottom: 630px;
       left: 30%;

    }
    .channel{
        margin-top: 120px;
        /* margin-bottom: 450px; */
        height: 600px;
    }
    .channel-circle {
        margin: 0px;
        display: inline-block;
        text-align: center;
        width: 100%;
    }
    .channel-circle img {
        width: 40%;
    }
    .channel-text{
        margin-top: 40px;
       
        height: 200px;
        width: 100%;
    }
    .match {
        height: 570px;
        margin: 0px 0px 200px 0;
        position: relative;
    }
    .match-text {
        margin-top: 40px;
        width: 100%;
       
    }
    .match-circle {
        width: 100%;
        text-align: center;
    }
    .match-circle img {
        width: 40%;
        position: absolute;
        bottom: 620px;
        left: 30%;
      
    }
}

@media screen and (min-width:700px) and (max-width:1070px) {
    .introduceList{
        margin: 150px 0;
        padding: 0 60px;
    }
    .digital-circle-line{
        /* display: none; */
        width: 80%;
        position: absolute;
        bottom: 120%;
        left: 24%;
    }
    .milkDay-text {
        width: 110%;
    }
    .digital-circle {
        width: 52%;
    }
    .digital-circle .digital-img {
        margin-left: 45%;
        width: 120%;
        margin-top: 0px;
    }
    .digital-text{
        width: 80%;
        margin-left: 34%;
        width: 112%;
        padding-top: 10px;
    }
    .address{
        margin-top: 100px;
    }
    .address-text{
        width: 50%;
        margin-top:0px;
    }
    .address-circle img {
        width: 55%;
        margin-left: 35%;
    }
    .address-circle{
        width: 42%
    }
    .channel {
        margin-top: 110px;
        position: relative;
    }
    .channel-text{
        width: 60%;
        margin-top: 30px;
    }
    .channel-circle {
        margin-left: 30px;
        display: inline-block;
        width: 34%;
    }
    .match {
        margin: 180px 0px 320px 0;
        position: relative;
    }
  } 

  @media screen and (min-width:1070px) and (max-width:1330px){
    .introduceList{
        margin: 150px 0;
        padding: 0 220px;
    }
    .digital-circle-line{
        /* display: none; */
        width:80%;
        position: absolute;
        bottom:108%;
        left:25%;
    }
    .channel{
        margin-top: 100px;
    }
   .address-text{
       width: 37%;
       margin-top: 0px;
    }
    .channel-circle_line{
        width: 48%;
        position: absolute;
        top: -65%;
        left: 25%;
    }
    .channel-text {
        width: 50%;
        margin-top: 25px;
    }
    .match {
        margin: 180px 0px 300px 0;
    }
    .match-text-line{
        width: 40%;
    position: absolute;
    top: 66%;
    left: 30%;
    }
  }
  /* >=1200px */
  @media screen and (min-width: 1330px) {
    .introduceList{
        margin: 150px 0;
        padding: 0 280px;
    }
    .digital-circle-line{
        width:73%;
        position: absolute;
        bottom:88%;
        left:29%;
    }
  }