// 公用css
@import './colors.scss';
@import './mixin/index.scss';

body, html {
	font-family: Roboto,Helvetica Neue,Helvetica,Tahoma,Arial,PingFang SC,Microsoft YaHei;
}

i {
	font-size: 14px;
}
a {
	color: $blue;
}
a:hover {
	color: $blue-hover;
}

.block-center {
	margin: 0 auto;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.text-left {
	text-align: left;
}
.container {
	position: relative;
	max-width: 1200px;
	margin: 30px auto;
	padding: 20px;
}
.p2 {
	padding: 2px !important;
}
.p5 {
	padding: 5px !important;
}
.p10 {
	padding: 10px !important;
}
.p20 {
	padding: 20px !important;
}
.pt0 {
	padding-top: 0px !important;
}
.pt5 {
	padding-top: 5px !important;
}
.pt7 {
	padding-top: 7px !important;
}
.pt10 {
	padding-top: 10px !important;
}
.pt20 {
	padding-top: 20px !important;
}
.pt30 {
	padding-top: 30px !important;
}
.pt100 {
	padding-top: 100px !important;
}
.pt200 {
	padding-top: 200px !important;
}
.pb0 {
	padding-bottom: 0px !important;
}
.pb5 {
	padding-bottom: 5px !important;
}
.pb10 {
	padding-bottom: 10px !important;
}
.pb15 {
	padding-bottom: 15px !important;
}
.pb20 {
	padding-bottom: 20px !important;
}
.pb30 {
	padding-bottom: 30px !important;
}
.pb25 {
	padding-bottom: 25px !important;
}
.pb22 {
	padding-bottom: 22px !important;
}
.pb40 {
	padding-bottom: 40px !important;
}
.pb50 {
	padding-bottom: 50px !important;
}
.pl5 {
	padding-left: 5px !important;
}
.pl10 {
	padding-left: 10px !important;
}
.pl15 {
	padding-left: 15px !important;
}
.pl17 {
	padding-left: 17px !important;
}
.pl20 {
	padding-left: 20px !important;
}
.pl25 {
	padding-left: 25px !important;
}
.pl30 {
	padding-left: 30px !important;
}
.p40 {
	padding-left: 40px !important;
}
.pr4 {
	padding-right: 4px !important;
}
.pr5 {
	padding-right: 5px !important;
}
.pr7 {
	padding-right: 7px !important;
}
.pr8 {
	padding-right: 8px !important;
}
.pr10 {
	padding-right: 10px !important;
}
.pr15 {
	padding-right: 15px !important;
}
.pr20 {
	padding-right: 20px !important;
}
.pr30 {
	padding-right: 30px !important;
}
.m20 {
	margin: 20px auto;
}
.ml0 {
	margin-left: 0px !important;
}
.ml3 {
	margin-left: 3px !important;
}
.ml8 {
	margin-left: 8px !important;
}
.ml15 {
	margin-left: 15px !important;
}
.ml16 {
	margin-left: 16px !important;
}
.ml22 {
	margin-left: 22px !important;
}
.ml30 {
	margin-left: 30px !important;
}
.ml80 {
	margin-left: 80px !important;
}
.ml100 {
	margin-left: 100px !important;
}
.ml120 {
	margin-left: 120px;
}
.ml200 {
	margin-left: 200px;
}
.mt0 {
	margin-top: 0px !important;
}
.mt3 {
	margin-top: 3px !important;
}
.mt5 {
	margin-top: 5px !important;
}
.mt10 {
	margin-top: 10px !important;
}
.mt15 {
	margin-top: 15px !important;
}
.mt20 {
	margin-top: 20px !important;
}
.mt25 {
	margin-top: 25px !important;
}
.mt30 {
	margin-top: 30px !important;
}
.mt35 {
	margin-top: 35px !important;
}
.mt40 {
	margin-top: 40px !important;
}
.mt50 {
	margin-top: 50px !important;
}
.mt60 {
	margin-top: 60px !important;
}
.mt65 {
	margin-top: 65px !important;
}
.mt100 {
	margin-top: 100px !important;
}
.ml5 {
	margin-left: 5px !important;
}
.ml10 {
	margin-left: 10px !important;
}
.ml20 {
	margin-left: 20px !important;
}
.ml25 {
	margin-left: 25px !important;
}
.mb0 {
	margin-bottom: 0px !important;
}
.mb3 {
	margin-bottom: 3px !important;
}
.mb5 {
	margin-bottom: 5px !important;
}
.mb8 {
	margin-bottom: 8px;
}
.mb10 {
	margin-bottom: 10px !important;
}
.mb12 {
	margin-bottom: 12px !important;
}
.mb15 {
	margin-bottom: 15px !important;
}
.mb17 {
	margin-bottom: 17px !important;
}
.mb20 {
	margin-bottom: 20px !important;
}
.mb21 {
	margin-bottom: 21px !important;
}
.mb25 {
	margin-bottom: 25px !important;
}
.mb30 {
	margin-bottom: 30px !important;
}
.mb33 {
	margin-bottom: 33px !important;
}
.mb40 {
	margin-bottom: 40px !important;
}
.mb45 {
	margin-bottom: 45px !important;
}
.mb60 {
	margin-bottom: 60px !important;
}
.mrAuto {
	margin-right: auto !important;
}
.mlAuto {
	margin-left: auto !important;
}
.mr2 {
	margin-right: 2px !important;
}
.mr5 {
	margin-right: 5px !important;
}
.mr8 {
	margin-right: 8px !important;
}
.mr9 {
	margin-right: 9px !important;
}
.mr10 {
	margin-right: 10px !important;
}
.mr14 {
	margin-right: 14px !important;
}
.mr15 {
	margin-right: 15px !important;
}
.mr16 {
	margin-right: 16px !important;
}
.mr18 {
	margin-right: 18px !important;
}
.mr20 {
	margin-right: 20px !important;
}
.mr40 {
	margin-right: 40px !important;
}
.mb20 {
	margin-bottom: 20px !important;
}
.width20 {
	width: 20% !important;
}
.width30 {
	width: 30% !important;
}
.width40 {
	width: 40% !important;
}
.width50 {
	width: 50% !important;
}
.width60 {
	width: 60% !important;
}
.width70 {
	width: 70% !important;
}
.width80 {
	width: 80% !important;
}
.width100 {
	width: 100% !important;
}
.width-auto {
	width: auto !important;
}
.w64 {
	width: 64px !important;
}
.w76 {
	width: 76px !important;
}
.w80 {
	width: 80px !important;
}
.w85 {
	width: 85px !important;
}
.w90 {
	width: 90px !important;
}
.w100 {
	width: 100px !important;
}
.w110 {
	width: 110px !important;
}
.w112 {
	width: 112px !important;
}
.w120 {
	width: 120px !important;
}
.w125 {
	width: 125px !important;
}
.w130 {
	width: 130px !important;
}
.w140 {
	width: 140px !important;
}
.w150 {
	width: 150px !important;
}
.w160 {
	width: 160px !important;
}
.w170 {
	width: 170px !important;
}
.w174 {
	width: 174px !important;
}
.w200 {
	width: 200px !important;
}
.w220 {
	width: 220px !important;
}
.w240 {
	width: 240px !important;
}
.w250 {
	width: 250px !important;
}
.w280 {
	width: 280px !important;
}
.w290 {
	width: 290px !important;
}
.w300 {
	width: 300px !important;
}
.w350 {
	width: 350px !important;
}
.w380 {
	width: 380px !important;
}
.w400 {
	width: 400px !important;
}
.w440 {
	width: 440px !important;
}
.w450 {
	width: 450px !important;
}
.w500 {
	width: 500px !important;
}

.fl {
	float: left;
}
.fr {
	float: right;
}
.clearfix:after {
	display: block;
	clear: both;
	content: '';
	visibility: hidden;
	height: 0;
}
.clearfix {
	zoom: 1;
}

.cursor {
	cursor: pointer;
}
.cursor-nodrop {
	cursor: no-drop;
}
.black {
	color: black;
}
.bg-color {
	background-color: $gray-background;
}
// 文字浅色
.gray01 {
	color: $gray01;
}
// 文字普通色
.gray02 {
	color: $gray02;
}
.gray03 {
	color: $gray03;
}
.gray-lighter {
	color: $gray-placeholder;
}

.fz10 {
	font-size: 10px;
}
.fz11 {
	font-size: 11px;
}
.fz12 {
	font-size: 12px;
}
.fz13 {
	font-size: 13px;
}
.fz14 {
	font-size: 14px;
}
.fz16 {
	font-size: 16px;
}
.fz18 {
	font-size: 18px;
}
.fz20 {
	font-size: 20px;
}
.fz22 {
	font-size: 22px;
}
.fz24 {
	font-size: 24px;
}
.fz26 {
	font-size: 26px;
}
.fz28 {
	font-size: 28px;
}
.fz30 {
	font-size: 30px;
}
.fz32 {
	font-size: 32px;
}
.fz40 {
	font-size: 40px;
}
.line-height2 {
	line-height: 2;
}
.line-height1_5 {
	line-height: 1.5;
}
.line-height1 {
	line-height: 1;
}
.line-h20 {
  line-height: 20px;
}
.line-h33 {
  line-height: 33px;
}
.ellipsis-150 {
	@include ellipsis(150%);
}
.ellipsis-100 {
	@include ellipsis(100%);
}
.ellipsis-50 {
	@include ellipsis(50%);
}
.ellipsis-80 {
	@include ellipsis(80%);
}
.ellipsis-90 {
	@include ellipsis(90%);
}
.ellipsis {
	// max-height: 20px;
	// line-height: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.ellipsis-l2 {
	// max-height: 40px;
	line-height: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.ellipsis-l3 {
	max-height: 60px;
	line-height: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.border-radius2 {
	border: 1px solid #dcdfe6;
	border-radius: 2px;
}

.borderRadius2 {
	border-radius: 2px;
}

.border1 {
	border: 1px solid #dcdfe6;
}
.border2 {
	border: 1px solid #e4e7ed;
}
.border3 {
	border: 1px solid #ebeef5;
}
.border4 {
	border: 1px solid #f2f6fc;
}

.blue {
	color: $blue;
}
.success-color {
	color: $green-success;
}
.warning-color {
	color: $yellow-warning;
}
.danger-color {
	color: $red-error;
}

.overflow-hidden {
	overflow: hidden;
}

.inline-block {
	display: inline-block;
}

.block {
	display: block;
}
.inline {
	display: inline;
}
.hide {
	display: none;
}
.hidden {
  height:1px;
  overflow:hidden;
  width:1px;
}
.vertical-middle {
	vertical-align: middle;
}
.vertical-top {
	vertical-align: top;
}
.vertical-bottom {
	vertical-align: bottom;
}
.vertical-baseline {
	vertical-align: baseline;
}

.cursor-pointer {
	cursor: pointer;
}

.bold {
	font-weight: bold;
}
.fw500 {
	font-weight: 500;
}
.fw400 {
	font-weight: 400;
}
.fw300 {
	font-weight: 300;
}
.flex {
	display: flex;
}

.shrink {
	flex-shrink: 0
}

.border-radius__default {
	border-radius: 4px;
}
.divider {
	height: 1px;
	background: #e4e7ed;
	width: 100%;
	margin: 30px 0;
}
.opacity0 {
	opacity: 0;
}
// 虚线的block
.dash-block {
	display: block;
	border-style: dashed;
}
.ts2 {
	transition: all 0.2s;
}
/*隐藏滚轮*/
// ::-webkit-scrollbar {
//   display: none;
// }

// .required-hide label.el-form-item__label::before {
//   display: none;
// }


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

.word-break {
	word-break: break-all;
}
.lose-floor-width {
	width: calc(100% - 120px);
}