@import "mixins/utils";
@import "common/var";
.aos-main-title {
  width: 100%;
  min-height: 50px;
  line-height: 50px;
  box-sizing: border-box;
  background: #fff;
  position: relative;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  &__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  &__header--flex-start {
    justify-content: flex-start;
    align-items: flex-start;
  }
  &__left-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .aos-main-title-left {
    display: flex;
    .aos-main-title-name {
      font-weight: 500;
      font-size: 16px;
    }
    .aos-main-title-subName {
      margin-left: 8px;
      font-size: 12px;
    }
  }
  &__title-name-border {
    display: inline-block;
    height: 16px;
    border-left: 2px solid $--color-primary;
    margin-right: 8px;
  }
  .aos-main-title-right {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  &__body {
    padding-top: 8px;
    line-height: 1;
    border-top: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  &__body-header {
    display: flex;
    justify-content: space-between;
    width: 100%;
    &-container {
      flex: 1;
    }
    &-right {
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }
  }
  .margin16 {
    margin-left: 16px;
  }
  .margin8 {
    margin-left: 8px;
  }
}

.clearfix {
  @include utils-clearfix;
}