.listContainer {
  --listContainerHeight: 83vh;
  margin: 0;
  // max-height: calc(80vh - var(--modal-lesson-search-height) - 50px - 30Px);

  .listSection {
    // min-height: calc(80vh - var(--modal-lesson-search-height) - 50px - 30Px);
  }

  .emptySection {
    display: flex;
    align-items: center;
  }

  .list {
    // margin-top: 10px;
    padding: 10px 40px 0;
    // margin-bottom: 12px;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    gap: 22px 0;
    margin-left: -12px;
    margin-right: -12px;


    .itemWrap {
      width: calc(100% / 4);
      padding-bottom: calc(100% / 4 * 0.73333);
      position: relative;

      .itemWrapBox {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        padding: 0 10px;
      }
    }

    :global {
      .card-section-container {
        width: 100%;
        height: 100%;
      }
    }
  }

  .list {
    // padding: 10px 0;
    // text-align: center;

    &>div {
      // margin-bottom: 20px;

      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}
