.flex,
[class*=" flex-"],
[class^="flex-"] {
    display: flex;
}

.flex-center {
    justify-content: center;
    align-items: center;
}

.flex-col {
    flex-direction: column;
}

.flex-aic {
    justify-content: flex-start;
    align-items: center;
}

.flex-tops {
    justify-content: flex-start;
    align-items: end;
}

.flex-wrap {
    flex-wrap: wrap;
}
.flex-end {
    justify-content: flex-end !important;
    align-items: center;
}

.flex-between {
    justify-content: space-between;
    align-items: center;
}

.flex-around {
    justify-content: space-around;
    align-items: center;
}

.flex-ctr-end {
    justify-content: center;
    align-items: flex-end;
}

.txt-over,
[class*="--txt-over"] {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
}

[class*="--txt-over-"],
.txt-over-2,
.txt-over-3 {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    max-width: 100%;
    white-space: normal;
}

[class*="--txt-over-2"],
.txt-over-2 {
    -webkit-line-clamp: 2 !important;
}

.txt-over-3 {
    -webkit-line-clamp: 3;
}

.fw600{
	font-weight: 600;
}
.fw500{
	font-weight: 500;
}
.fw400{
	font-weight: 400;
}
.grayFont999{
	color: #999999;
}
.grayFont666{
	color: #666666;
}
.grayFont333{
	color: #333333;
}
@for $i from 12 through 100
{
    .fz#{$i}
    {
		font-size:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .mt#{$i}
    {
		margin-top:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .ml#{$i}
    {
		margin-left:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .mr#{$i}
    {
		margin-right:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .mb#{$i}
    {
		margin-bottom:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .pt#{$i}
    {
		padding-top:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .pl#{$i}
    {
		padding-left:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .pr#{$i}
    {
		padding-right:(1rpx * $i);
    }
}
@for $i from 5 through 160
{
    .pb#{$i}
    {
		padding-bottom:(1rpx * $i);
    }
}

.flex{
	display: flex;
}
.sb{
	justify-content: space-between;
}
.itemcenter{
	align-items: center;
}
.sa{
	justify-content: space-around;
}
.sc{
	justify-content: center;
}