#book-mark {
  margin-top: 9.6rem;

  .content__wrapper {
    display: flex;
    flex-direction: column;
    gap: 4rem;

    .content__empty {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: var(--spacing-md);
      padding-block: 7.2rem;

      img {
        width: 12rem;
      }

      .content__empty-text {
        color: var(--color-gray-300);
        font-size: var(--font-body-large-size);
        font-weight: var(--font-body-large-weight);
        line-height: var(--font-body-large-line-height);
        letter-spacing: var(--font-body-large-letter-spacing);
      }
    }
    .content__empty.hidden {
      display: none;
    }
  }

  @media (max-width: 640px) {
    .content__wrapper {
      .category {
        .category__list {
          grid-template-columns: 1fr;
        }
      }
    }
  }

  @media (min-width: 640px) and (max-width: 1024px) {
    .content__wrapper {
      .category {
        .category__list {
          grid-template-columns: repeat(2, 1fr);
        }
      }
    }
  }

  @media (min-width: 1024px) and (max-width: 1280px) {
    .content__wrapper {
      .category {
        .category__list {
          grid-template-columns: repeat(3, 1fr);

          .content__skeleton-item:last-child,
          .content__item:last-child {
            display: none;
          }
        }
      }
    }
  }

  @media (min-width: 1280px) {
    .content__wrapper {
      .category {
        .category__list {
          grid-template-columns: repeat(4, 1fr);
        }
      }
    }
  }
}