//弹性布局相关样式

.flex {
	&-row {
		/* #ifndef APP-NVUE */
		display: flex;
		box-sizing: border-box;
		/* #endif */
		flex-direction: row!important;
	}
	&-col {
		/* #ifndef APP-NVUE */
		display: flex;
		box-sizing: border-box;
		/* #endif */
		flex-direction: column!important;
	}
	&-column {
		/* #ifndef APP-NVUE */
		display: flex;
		box-sizing: border-box;
		/* #endif */
		flex-direction: column!important;
	}
	&-one {
		flex: 1;
	}
	&-two {
		flex: 3;
	}
	&-three {
		flex: 3;
	}
	&-four {
		flex: 4;
	}
	&-five {
		flex: 5;
	}
	&-six {
		flex: 6;
	}
	&-center {
		justify-content: center;
		align-items: center;
	}
  &-grow-0 {
    flex-grow: 0 !important;
  }
  &-grow-1 {
    flex-grow: 1 !important;
  }
  &-shrink-0 {
    flex-shrink: 0 !important;
  }
  &-shrink-1 {
    flex-shrink: 1 !important;
  }
  &-wrap {
    flex-wrap: wrap !important;

    &-reverse {
      flex-wrap: wrap-reverse !important;
    }
  }
  &-nowrap {
    flex-wrap: nowrap !important;
  }
}
.justify {
	&-start {
		justify-content: flex-start;
	}
	&-center {
		justify-content: center;
	}
	&-end {
		justify-content: flex-end;
	}
	&-between {
		justify-content: space-between;
	}
	&-around {
		justify-content: space-around;
	}
	&-stretch {
		justify-content: stretch;
	}
}
.align {
	&-start {
		align-items: flex-start;
	}
	&-center {
		align-items: center;
	}
	&-end {
		align-items: flex-end;
	}
  &-baseline {
    align-items: baseline;
  }
  &-stretch {
    align-items: stretch;
  }
}
.full {
	&-width {
		width: 100%;
	}
	&-height {
		flex: 1;
		height: 100%;
	}
	&-page-width {
		width: 100vw;
	}
	&-page-height {
		flex: 1;
		height: 100vh;
	}
	&-abs {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
}
.gap-0 {
  &-row-0 {
    row-gap: 0;
  }
  &-column-0 {
    column-gap: 0;
  }
  &-0 {
    gap: 0;
  }
}