/* 小屏幕设备（如手机） */
  @media (max-width: 600px) {

    /* 增大字体以提高可读性 */
    html {
      font-size: 125%;
      /* 16px * 1.25 = 20px，使用百分比可以更直观地调整大小 */
    }


    /* 内容 */
    .all {
      width: 100%;
      margin-bottom: 49.9968px;
    }

    .recomm {
      display: flex;
      flex-direction: column;
      background-color: #fff;
      margin-top: 20.0064px;
      border-radius: var(--radius-5);
    }

    .r-title {
      padding: 0.4rem 1rem;
      font-size: 16px;
    }

    .r-list {
      /* padding: 18.0096px 0; */
      display: flex;
      flex-wrap: wrap;
      color: #343a40;
    }

    .list-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      width: calc((100% - 10.0032px) / 5);
      padding: 24.9984px 0;
      /* background-color: pink; */
      border: 0.9984px solid #f4f5f8;
    }

    .list-item:hover {
      box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15);
    }

    .item-img {
      width: 2rem;
      height: 2rem;
      margin-bottom: 10.0032px;
    }

    .item-name {
      font-size: 14px;
    }

    .small-list {
      display: flex;
      flex-wrap: wrap;
      margin-left: 0.5rem;
    }

    .small-item {
      display: flex;
      align-items: center;
      justify-content: center;
      width: calc(100% / 5);
      padding: 0.5rem;
      text-wrap: nowrap;
      flex-direction: column;
    }

    .si-img {
      width: 1.5rem;
      /* height: 1.5rem; */
      margin-right: 0.2rem;
    }

    .si-img img {
      object-fit: contain;
    }

    .si-name {
      font-size: 14px;
      color: #495057;
    }
  }