//引入全局配置
@import "c/conf";
@import "c/mx";
@import "c/f";
@import "a/c";

.m-top_tabs {
  position: relative;
  display: flex;
  width: 750rpx;
  height: 80rpx;
  background: rgba(255, 255, 255, 1);

  .item {
    position: relative;
    flex-shrink: 0;
    line-height: 80rpx;
    padding: 0 40rpx;
    font-size: 34rpx;
    font-family: Source Han Serif SC;
    font-weight: 500;
    color: #999;
    transition: all $ad1 ease-in-out;

    &::after {
      content: "";
      position: absolute;
      display: block;
      left: 0;
      right: 0;
      bottom: 0;
      margin: 0 auto;
      width: 66rpx;
      height: 6rpx;
      background: #e2281b;
      border-radius: 3rpx;
      opacity: 0;
      transform: scale(0);
      transition: all $ad1 ease-in-out;
    }

    &.z-on {
      font-size: 32rpx;
      color: #333;
      font-weight: bold;

      &::after {
        opacity: 1;
        transform: scale(1);
      }
    }
  }

  .item-padding-3 {
    padding: 0 40rpx;
  }

  .item-padding-5 {
    padding: 0 20rpx;
  }
}

.tab-center {
  align-items: center; /**子view垂直居中*/
  vertical-align: center; /**垂直居中*/
  justify-content: center; /**内容居中*/
  flex-direction: row; /**子view排列方式row--水平 column--垂直*/
}