/**modal****/
.modal-group{
 
}
.modal-mask{
	background-color: #333;
	opacity: 0.2;
	position: fixed;
	left: 0;
	right: 0;
	top:0;
	bottom: 0;
	z-index: 998;
}
.modal{
	position: fixed;
	left:12rpx;
	right: 12rpx;
	top: 50%;
	margin-top: -456rpx;
	background-color: #fff;
	border-style: solid;
	border-width: 1px;
	border-color: #ddd;
	border-radius: 48rpx;
	z-index: 999;
}
.modal-header{
	border-style: solid;
	border-color: #ddd;
	border-bottom-width: 1px;
	padding: 0rpx 0rpx 0rpx 36rpx;
	margin-bottom: 24rpx;
	font-weight: bold;
	flex-direction: row;
	line-height: 120rpx;
}
.modal-title{
	flex: 1;
	font-size: 38.4rpx;
}
.modal-close{
	font-family: iconfont;
	width: 120rpx;
	height:120rpx;
	line-height: 120rpx;
	color: #646464;
	text-align: center;
}
.modal-body{
	padding: 0rpx 36rpx  48rpx 36rpx;
	height: 768rpx;
}
 
.flex {
	flex-direction: row !important;
}

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

.flex-1 {
	flex: 1;
}

.flex-wrap {
	flex-wrap: wrap;
}

/***定义了 flex 容器中 flex 成员项在纵轴方向上如何排列以处理空白部分***/
.flex-ai-stretch {
	align-items: stretch;
}

.flex-ai-start {
	align-items: flex-start;
}

.flex-ai-end {
	align-items: flex-end;
}

.flex-ai-center {
	align-items: center;
}

/***定义了 flex 容器中 flex 成员项在主轴方向上如何排列以处理空白部分***/
.flex-jc-start {
	justify-content: flex-start;
}

.flex-jc-end {
	justify-content: flex-end;
}

.flex-jc-center {
	justify-content: center;
}

.flex-jc-bettwen {
	justify-content: space-between;
}

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

.text-right {
	text-align: right !important;
}

.text-center {
	text-align: center !important;
}

.text-left {
	text-align: left !important;
}

/****定位*****/
.pos-fixed {
	position: fixed !important;
}

.pos-abs {
	position: absolute !important;
}

.pos-relative {
	position: relative !important;
}

/**高度宽度**/

.wh-30 {
	width: 72rpx;
	height: 72rpx;
}

.wh-40 {
	width: 96rpx;
	height: 96rpx;
}

.wh-60 {
	width: 144rpx !important;
	height: 144rpx !important;
}

.wh-100 {
	width: 240rpx;
	height: 240rpx;
}

.wh-150 {
	width: 360rpx;
	height: 360rpx;
}

.wh-200 {
	width: 480rpx;
	height: 480rpx;
}

.wmax {
	width: 100%;
	 
}

.w50 {
	width: 120rpx !important;
}

.w60 {
	width: 144rpx !important;
}

.w100 {
	width: 240rpx !important;
}

.w150 {
	width: 360rpx !important;
}

.h30 {
	height: 72rpx !important;
}

.h60 {
	height: 144rpx !important;
}

.h100 {
	height: 240rpx !important;
}

.h160 {
	height: 384rpx !important;
}

.h200 {
	height: 480rpx !important;
}

/***fontsize**/
.f36 {
	font-size: 86.4rpx !important;
}

.f28 {
	font-size: 67.2rpx !important;
}

.f22 {
	font-size: 52.8rpx !important;
}

.f20 {
	font-size: 48rpx !important;
}

.f18 {
	font-size: 43.2rpx !important;
}

.f16 {
	font-size: 38.4rpx !important;
}

.f14 {
	font-size: 33.6rpx !important;
}

.f12 {
	font-size: 28.8rpx !important;
}

.f10 {
	transform: scale(0.5);
	transform-origin: left top;
	font-size: 48rpx !important;
	margin-right: -50%;
	margin-bottom: -24rpx !important;
}

.f8 {
	transform: scale(0.5);
	transform-origin: left top;
	font-size: 38.4rpx !important;
	margin-right: -50%;
	margin-bottom: -19.2rpx !important;
}

.fw-600 {
	font-weight: 600;
}

/***col1 2 3 内容字体差异 主标题 副标题 描述****/
.cl1 {
	color: #323232 !important;
}

.cl2 {
	color: #646464 !important;
}

.cl3 {
	color: #969696 !important;
}

.cl-f30 {
	color: #f30 !important;
}

.cl-red {
	color: #c12725 !important;
}

.cl-primary {
	color: #007bff !important;
}

.cl-secondary {
	color: #6c757d !important;
}

.cl-success {
	color: #28a745 !important;
}

.cl-danger {
	color: #dc3545 !important
}

.cl-warning {
	color: #ffc107 !important
}

.cl-info {
	color: #17a2b8 !important;
}

.cl-light {
	color: #f8f9fa !important;
}

.cl-dark {
	color: #343a40 !important;
}

.cl-muted {
	color: #6c757d !important;
}

.cl-white {
	color: #fff !important;
}

.cl-money {
	color: #FF6600 !important;
}

.cl-num {
	color: #f70 !important;
}

/***background-color***/
.bg-ef {
	background-color: #efefef !important;
}

.bg-fff {
	background-color: #fff !important;
}

.bg-f30 {
	background-color: #f30 !important;
}

.bg-primary {
	background-color: #007bff !important;
}

.bg-secondary {
	background-color: #6c757d !important;
}

.bg-success {
	background-color: #28a745 !important;
}

.bg-danger {
	background-color: #dc3545 !important;
}

.bg-warning {
	background-color: #ffc107 !important;
}

.bg-info {
	background-color: #17a2b8 !important;
}

.bg-light {
	background-color: #f8f9fa !important;
}

.bg-dark {
	background-color: #343a40 !important;
}

.bg-white {
	background-color: #fff !important;
}

.bg-transparent {
	background-color: transparent !important;
}

.bg-royal {
	background-color: #8a6de9 !important;
}

.bg-disabled {
	background-color: #FBFBFB !important;
}

/****固定颜色****/

/***padding****/
.pd-5 {
	padding: 12rpx !important;
}

.pdl-5 {
	padding-left: 12rpx !important;
}

.pdr-5 {
	padding-right: 12rpx !important;
}

.pdt-5 {
	padding-top: 12rpx !important;
}

.pdb-5 {
	padding-bottom: 12rpx !important;
}

.pd-10 {
	padding: 24rpx !important;
}

.pdl-10 {
	padding-left: 24rpx !important;
}

.pdr-10 {
	padding-right: 24rpx !important;
}

.pdt-10 {
	padding-top: 24rpx !important;
}

.pdb-10 {
	padding-bottom: 24rpx !important;
}

.pdb-30 {
	padding-bottom: 72rpx !important;
}

.pdt-0 {
	padding-top: 0rpx !important;
}

/***margin****/
.mg-5 {
	margin: 12rpx !important;
}

.mgb-5 {
	margin-bottom: 12rpx !important;
}

.mgt-5 {
	margin-top: 12rpx !important;
}

.mgl-5 {
	margin-left: 12rpx !important;
}

.mgr-5 {
	margin-right: 12rpx !important;
}

.mg-10 {
	margin: 24rpx !important;
}

.mgb-10 {
	margin-bottom: 24rpx !important;
}

.mgt-10 {
	margin-top: 24rpx !important;
}

.mgl-10 {
	margin-left: 24rpx !important;
}

.mgr-10 {
	margin-right: 24rpx !important;
}

.mgr-20 {
	margin-right: 48rpx !important;
}

.mgb-20 {
	margin-bottom: 48rpx !important;
}

.mgl-20 {
	margin-left: 48rpx !important;
}

.mgt-20 {
	margin-top: 48rpx !important;
}

.mgb-0 {
	margin-bottom: 0rpx !important;
}

/***border***/
.bd-mp-5 {
	border-color: #dee2e6;
	border-style: solid;
	border-width: 1px;
	padding-bottom: 12rpx !important;
	margin-bottom: 12rpx !important;
}

.bd-mp-10 {
	border-bottom-color: #dee2e6;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	padding-bottom: 24rpx !important;
	margin-bottom: 24rpx !important;
}

.bd-mp-0 {
	border-width: 0px;
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

.bd {
	border-color: #dee2e6;
	border-style: solid;
	border-width: 1px;
}

.bdt {
	border-top-color: #dee2e6;
	border-top-style: solid;
	border-top-width: 1px;
}

.bdr {
	border-right-color: #dee2e6;
	border-right-style: solid;
	border-right-width: 1px;
}

.bdb {
	border-bottom-color: #dee2e6;
	border-bottom-style: solid;
	border-bottom-width: 1px;
}

.bdl {
	border-left-color: #dee2e6;
	border-left-style: solid;
	border-left-width: 1px;
}

.bd-0 {
	border-width: 0 !important;
}

.bdt-0 {
	border-top-width: 0 !important;
}

.bdr-0 {
	border-right-width: 0 !important;
}

.bdb-0 {
	border-bottom-width: 0 !important;
}

.bdl-0 {
	border-left-width: 0 !important;
}

/***border-color**/
.bd-primary {
	border-color: #007bff !important;
}

.bd-secondary {
	border-color: #6c757d !important;
}

.bd-success {
	border-color: #28a745 !important;
}

.bd-info {
	border-color: #17a2b8 !important;
}

.bd-warning {
	border-color: #ffc107 !important;
}

.bd-danger {
	border-color: #dc3545 !important;
}

.bd-light {
	border-color: #f8f9fa !important;
}

.bd-dark {
	border-color: #343a40 !important;
}

.bd-white {
	border-color: #fff !important;
}

/****border-radius***/
.bd-radius-5 {
	border-radius: 12rpx;
}

.bd-radius-10 {
	border-radius: 24rpx;
}

.bd-radius-20 {
	border-radius: 48rpx;
}

.bd-radius-50 {
	border-radius: 50%;
}
