.sticky {
  position: sticky;
  top: 0;
  z-index: 100;
}
.bgImg{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  object-fit: cover;
  height: 55px;
  filter: blur(10px);
}
.videoDetail {
  .pic {
    position: relative;
    z-index: 10;
    height: calc(100vw / 1.76);
  }
  .content {
    position: relative;
    padding: 0 16px 100px 16px;
    margin-top: -16px;
    z-index: 10;
    .wrap {
      border-radius: 10px;
      overflow: hidden;
      background-color: #fff;
    }
    :global {
      .van-tab--active {
        background-color: #fff;
        transition: background 0.3s;
      }
    }
  }
  .wrapItem {
    padding: 12px;
  }
}

.detailInfo {
  & > h2 {
    font-size: 18px;
    font-weight: 500;
    color: #333;
    margin-bottom: 10px;
  }
  .tags {
    margin: 0 -4px;
    margin-bottom: 10px;
  }
  .tag {
    display: inline-block;
    color: var(--van-primary-color);
    font-size: 12px;
    padding: 2px 8px;
    margin: 0 4px;
    background-color: #bcfdf1;
    border-radius: 20px;
  }
  .col {
    display: flex;
    align-items: center;
    color: var(--van-primary-color);
    & > span {
      margin-left: 10px;
    }
  }
  .des {
    font-size: 12px;
    font-weight: 400;
    color: #656565;
    line-height: 20px;
    white-space: pre-wrap;
  }
  .teacher {
    display: flex;
    align-items: center;
    .teacherContent {
      margin: 0 18px;
      .name {
        font-size: 16px;
        font-weight: bold;
        color: #000;
        margin-bottom: 10px;
      }
      .num {
        font-size: 12px;
        color: #999;
      }
      .num > span:last-child {
        font-size: 14px;
        color: #ff8b00;
        font-weight: 500;
        margin-left: 5px;
      }
    }
    :global {
      .van-button {
        margin-left: auto;
        height: 30px;
        font-size: 14px;
        padding: 3px 8px;
        background-color: #ff6969;
        border-color: #ff6969;
      }
    }
  }
}

.classWrap {
  padding: 12px;
  :global{
    .van-divider:last-child{
        display: none;
    }
  }
  .classItem {
    display: flex;
    align-items: center;
  }
  .img {
    width: 131px;
    height: 74px;
    margin-right: 12px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
  }
  .classContent{
    width: calc(100% - 131px - 12px);
  }
  .classTitle {
    font-size: 16px;
    color: #000;
    font-weight: bold;
    margin-bottom: 9px;
  }
  .classDes {
    font-size: 12px;
    color: #656565;
    line-height: 20px;
  }
}
