@import '@/styles/common.less';
@import '@/styles/variables.less';

.prejob-popup {
  &__content {
    padding: 40px 32px;
  }

  &__title {
    font-weight: 500;
    font-size: 32px;
    line-height: 48px;
    margin-bottom: 31px;
    text-align: center;
  }

  &__body {
  }

  &__item {
    .flex-row();
    margin-bottom: 40px;

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

    &-icon {
      width: 88px;
      height: 88px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;

      &.material {
        background: #feba00;
        > image {
          width: 40px;
          height: 46px;
        }
      }
      &.vip {
        background: #b094ff;
        > image {
          width: 48px;
          height: 42px;
        }
      }
      &.video {
        background: #34a853;
        > image {
          width: 46px;
          height: 44px;
        }
      }
    }
    &-main {
      padding: 0 24px;
      flex: 1;
      .title {
        font-weight: 500;
        font-size: 28px;
        line-height: 40px;
        margin-bottom: 8px;
      }
      .desc {
        font-size: 24px;
        line-height: 36px;
        color: @blColorG1;
      }
    }
    &-action {
      flex: 0 0 auto;
    }
  }

  &__btn {
    .button(@width: 136px, @height: 72px, @fontSize: 28px, @fontWeight: 400, @borderRadius: 43px, @highlight: 0);
    background: #f2f2f2;
  }
}