@media only screen and (min-width: 768px) {
  .solution-list {
    --gap: 0.15rem;
    --item-margin-bottom: 0.4rem;
  }

  .page-solution .headline {
    --headline-margin-bottom: 0.64rem;
    --headline-padding-bottom: 0.28rem;
  }
}

.solution-list {
}

.solution-list-item {
  position: relative;
}

.solution-list-item .meta {
  box-sizing: border-box;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  border-bottom: 0.08rem solid var(--main-color);
  padding: 0.24rem;
}

.solution-list-item .meta::after {
  content: "";
  position: absolute;
  right: 0.24rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.25rem;
  height: 0.25rem;
  background-image: url("../images/icons/arrow-right-down.svg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: auto 100%;
}

.solution-list-item .title {
  color: rgba(255, 255, 255, 1);
  font-size: var(--font24);
  font-weight: 700;
}

.solution-list-item:hover .upimg {
  transform: scale(1.1);
}

@media screen and (max-width: 767px) {
  .solution-list-item .meta::after {
    width: 20px;
    height: 20px;
  }
}

@media only screen and (min-width: 768px) {
  .solution-channel-list {
    --gap: 0.24rem;
    --item-margin-bottom: 0.48rem;
  }
}

.solution-channel-list-item .meta {
  box-sizing: border-box;
  padding: 0.28rem 0.2rem;
  border-width: 0 1px 1px;
  border-style: solid;
  border-color: rgba(217, 217, 217, 1);
}

.solution-channel-list-item .title {
  color: rgba(0, 0, 0, 1);
  font-size: var(--font36);
  font-weight: 700;
  margin-bottom: 0.04rem;
}

.solution-channel-list-item .desc {
  color: rgba(51, 51, 51, 1);
  font-size: var(--font16);
  line-height: 1.8;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  word-break: break-word;
  overflow: hidden;
  margin-bottom: 0.32rem;
  min-height: 0.864rem;
}

.solution-channel-list-item .more {
  color: var(--main-color);
  font-size: var(--font16);
}

@media screen and (max-width: 767px) {
  .solution-channel-list-item .meta {
    padding: 16px;
  }

  .solution-channel-list-item .title {
    margin-bottom: 8px;
  }

  .solution-channel-list-item .desc {
    min-height: auto;
    margin-bottom: 8px;
  }
}
