.course-content {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 40px auto 0 auto;

  .course-header {
    margin: 0 auto;
    width: 1100px;
    .course-header-title {
      margin-bottom: 10px;
      font-size: 20px;
    }
  }

  .course-content-container {
    overflow: hidden;
    margin: 0 auto;
    height: 100%;
    width: 1100px;
    background-color: #ffffff;
    border: solid 1px #d0d0d0;
    border-radius: 7px;

    .course-content-title {
      margin: 10px 100px 10px 0;
    }

    .course-items-container {
      display: flex;
      justify-content: center;
      gap: 10px;
      //background-color: red;
      margin: 20px 0;
      //height: 100%;
      //width: 1100px;

    }

    .el-card__body {
      padding: 0;
    }

    .course-item {
      flex: 1;
      max-width: 200px;
      box-sizing: border-box;
      //padding: 10px;
      height: 270px;
      line-height: 30px;
      //margin-bottom: 10px;

      .course-item-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

      .course-item-content {
        font-size: 14px;
        padding: 0 10px;
      }

      &.active {
        cursor: pointer;
      }
    }

    .course-item-hidden {
      flex: 1;
      max-width: 200px;
      height: 270px;
      box-sizing: border-box;
      line-height: 30px;
      opacity: 0;
    }
  }
}
