.main {
   padding-top: 24px;
}

.fenleiad {
  width: 194px;
  height: 48px;
  background: #ffffff;
  box-shadow: 0px 0px 4px 0px rgba(131, 178, 147, 0.5);
  border-radius: 100px 100px 100px 100px;
  border: 2px solid #fecd44;

  margin: 0px auto;
  font-family: Nunito, Nunito;
  font-weight: bold;
  font-size: 20px;
  color: #467e59;
  display: flex;
  line-height: 24px;
  justify-content: center;
  align-items: center;
      margin-bottom: 24px;
}

.min {
  width: 1000px;
  margin: 0 auto;
  gap: 24px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.min dl {
  display: flex;
  background: #83b293;
  box-shadow: 0px 2px 8px 0px rgba(106, 143, 119, 0.5),
    inset 0px -1px 4px 0px rgba(172, 163, 75, 0.35);
  border-radius: 0px 0px 0px 0px;
  flex-direction: row-reverse;
  padding: 24px;
  width: 48%;
  justify-content: space-between;
}
.min dl:nth-child(2) {
  background: #fff;
}
.min dl:nth-child(2) dd p {
  color: #333333;
}

.min dl:nth-child(3) {
  background: #fff;
}
.min dl:nth-child(3) dd p {
  color: #333333;
}
.min dl dt {
  width: 204px;
  height: 136px;
  background: #c4c4c4;
}
.min dl dt img {
  width: 100%;
  height: 100%;
}
.min dl dd {
  padding-right: 24px;
      width: 58%;
}

.min dl dd p {
  font-family: Nunito, Nunito;
  font-weight: bold;
  font-size: 20px;
  color: #ffffff;
  line-height: 28px;
  overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.min dl dd button {
  width: 169px;
  padding: 4px 0;
  margin-top: 40px;
  background: #ffffff;
  box-shadow: 0px 0px 4px 0px rgba(131, 178, 147, 0.5);
  border-radius: 200px 200px 200px 200px;
  border: 2px solid #fecd44;

}
.min dl dd button  a{
  display: flex;
  align-items: center;
  justify-content: center;
}
.min dl dd button span {
  font-family: Nunito, Nunito;
  font-weight: bold;
  font-size: 20px;
  color: #20ab8a;
  line-height: 28px;
}
.recommended {
    font-family: Nunito, Nunito;
    font-weight: bold;
    font-size: 20px;
    color: #333333;
    line-height: 24px;
    padding-bottom: 24px;
    max-width: 1000px;
    margin: 0px auto;
    margin-top: 48px;
}
.ccic {
  color: #fecd44;
  margin-right: 10px;
}
@media (max-width: 1050px) {
  .min {
    width: 95%;
  }
}

@media (max-width: 900px) {
  .min dl dd button {
    width: 109px;
  }

  .min dl dd button span {
    font-size: 16px;
    line-height: 20px;
  }
}

@media (max-width: 750px) {
  .main {
   padding-top: 0px;
}

  .min {
    gap: 12px;
}
  .fenleiad {
    width: 194px;
    height: 40px;
    background: none;
    box-shadow: none;
    border-radius: none;
    border: none;
    margin: 0px auto;
    font-family: Nunito, Nunito;
    font-weight: bold;
    font-size: 16px;
    color: #333333;
    line-height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-border-radius: none;
    -moz-border-radius: none;
    -ms-border-radius: none;
    -o-border-radius: none;
  }
    .recommended {
        font-size: 16px;
        line-height: 24px;
        margin: 24px auto;
        width: 95%;
        padding-bottom: 0px;
    }
  .min dl {
    width: 100%;
    padding: 12px;
  }

  .min dl dd p {
    font-size: 14px;
    line-height: 18px;
  }

  .min dl dt {
    width: 165px;
    height: 110px;
    background: #c4c4c4;
  }
  .min dl dd button {
    width: 150px;
  }
  .min dl dd button span {
    font-size: 14px;
    line-height: 18px;
  }
}