.weiyou-comment {
  padding: 0 0 var(--component-gap);
  overflow: hidden;
  background: #fff;
}

.wc-panel {
  padding: var(--gap-50) var(--gap-30) var(--gap-60);
  border-radius: 30px;
  background: #1579BA;
}

.wc-title {
  margin: 0 0 34px;
  color: #fff;
  font-family: var(--font-family);
  font-size: var(--font-30);
  font-weight: 500;
  line-height: 1.6;
}

.wc-list {
  display: grid;
  grid-template-columns: repeat(24, minmax(0, 1fr));
  gap: var(--gap-20);
  align-items: start;
}

.wc-item {
  overflow: hidden;
  border-radius: 10px;
  background: #fff;
  height: 100%;
}

.wc-item a {
  display: block;
  height: 100%;
  cursor: zoom-in;
}

.wc-item:nth-child(1) {
  grid-column: span 9;
}

.wc-item:nth-child(2) {
  grid-column: span 15;
}

.wc-item:nth-child(3) {
  grid-column: span 14;
}

.wc-item:nth-child(4) {
  grid-column: span 10;
}

.wc-item:nth-child(5) {
  grid-column: span 11;
}

.wc-item:nth-child(6) {
  grid-column: span 13;
}

.wc-item:nth-child(7) {
  grid-column: span 15;
}

.wc-item:nth-child(8) {
  grid-column: span 9;
}

.wc-item img {
  display: block;
  width: 100% !important;
  height: auto !important;
  border-radius: 10px;
}

@media screen and (max-width: 992px) {
  .wc-list {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .wc-list::-webkit-scrollbar {
    display: none;
  }

  .wc-item {
    flex: 0 0 100%;
    scroll-snap-align: start;
  }
}