
body, html {
  margin:0;
  padding:0;
  width:100%;
  height:100%;
}
img{
  max-width: 100%;
  max-height: 100%;
}


.abs { position:absolute
}
.rel  {
  position:relative
}
.fix {
  position:fixed;
}
.row {
  flex-direction:row;
  display:flex;
}
.col {
  display:flex;
  flex-direction:column;
}
.jcc { justify-content:center; }
.jcs { justify-content:flex-start; }
.jce { justify-content:flex-end; }
.jcsa { justify-content:space-around; }
.jcsb { justify-content:space-between; }
.shrink0 {
  flex-shrink : 0;
}
.grow0 {
  flex-grow : 0;
}
.basic0p {
  flex-basic : 0%;
}

.ais { align-items:flex-start; }
.aie { align-items:flex-end; }
.aic { align-items:center; }
.aistretch { align-items:stretch; }

.ass { align-self:flex-start; }
.ase { align-self:flex-end; }
.asc { align-self:center; }
.asstretch { align-self:stretch; }

.tal {text-align:left}
.tac {text-align:center}
.tar {text-align:right}

.flex1 {flex:1}
.flex2 {flex:2}
.flex3 {flex:3}
.flex4 {flex:4}
.flex5 {flex:5}
.flex6 {flex:6}
.flex7 {flex:7}
.flex8 {flex:8}

.flexwrap  {flex-wrap :wrap}

/*背颢色*/
.bg0{/*白色*/
  background-color:white;
}
.bg1{/*灰色*/
  background-color:#f1f1f1;
}
.bg2{/*黄色*/
  background-color:#FFF2C8;
}
.bg3{/*红色*/
  background-color:white;
}
.bg_root{
  background-color: #f0f2f5;
}
/*按钮色*/
.bg4 { background-color: red; }
.bgblack{ background-color:black; }
.bgwhite{ background-color:white; }
.bgred{ background-color:red; }
.bgbaby  { background-color:#fdf7fa; }
.bgoverlay  { background-color :rgba(0, 0, 0, 0.3); }
.bgbtnlight  { background-color:#efefef; }
.bglogo  { background-color:rgba(255,255,255,1); }
/*正文色*/
.c_2 {/* 更浅色  placeholder*/
  color: #b3b3b3
}
.c_1 {/* 浅色 描述*/
  color: #A3A3A3
}
.c0 {/*普通色  正文*/
  color: #343434
}
.c1 {/*副标题*/
  color: #222
}
.c2 {/*标题*/
  color: #4a4a4a
}
/*高亮色*/
.chl1 {
  color: #FB4370;
}
.chl2  {
  color:orange;
}
.chl3  {
  color:red;
}
/*链接色*/
.clink  {
  color:#00BFFF;
}
/*时间色*/
.ctime  {
  color:#00BFFF;
}
/*状态色*/
.csucc  {
  color : green;
}
.cwarn  {
  color: #cd3200
}
.cdan  {
  color:red;
}
.cfail  {
  color: #CBCBCB
}
.cidle  {
  color: #53BEAC
}
.cdisable  {/*无效*/
  color:#a1a1a1;
}
.cgold {
  color: #f5ca3a;
}
/*常用色*/
.cred {
  color: #DE4035
}
.cwhite {
  color: white
}
.cblack  {
  color:black;
}
/*
//类型分色
//高亮色;
//正文色，
//时间色
//连接色
//状态色，succ， fail;， idle; disabled
*/

.fs_3{/*小描述*/
  font-size: 10px
}
.fs_2{/*小描述*/
  font-size: 12px
}
.fs_1{/*小描述*/
  font-size: 13px
}
html, body {
	font-size:14px;
}
.fs0 {/*普通正文大小*/
  font-size: 14px
}
.fs1 {/*副标题*/
  font-size: 17px
}
.fs2 {/* 标题*/
  font-size: 18px
}
.fs3 {/* 大标题*/
  font-size: 28px
}

.bold {
  font-weight: bold
}


.m0  { margin: 0px  !important}
.m1  { margin: 5px }
.m2  { margin:10px }
.m3  { margin:15px }
.m4  { margin:20px }
.m5  { margin:25px }
.m6  { margin:30px }

.mv0  { margin-bottom: 0px !important; margin-top: 0px  !important}
.mv1  { margin-bottom: 5px; margin-top: 5px }
.mv2  { margin-bottom:10px; margin-top:10px }
.mv3  { margin-bottom:15px; margin-top:15px }
.mv4  { margin-bottom:20px; margin-top:20px }
.mv5  { margin-bottom:25px; margin-top:25px }
.mv6  { margin-bottom:30px; margin-top:30px }

.mh0  { margin-left: 0px !important; margin-right: 0px  !important}
.mh1  { margin-left: 5px; margin-right: 5px }
.mh2  { margin-left:10px; margin-right:10px }
.mh3  { margin-left:15px; margin-right:15px }
.mh4  { margin-left:20px; margin-right:20px }
.mh5  { margin-left:25px; margin-right:25px }
.mh6  { margin-left:30px; margin-right:30px }

.mt0  { margin-top: 0px !important}
.mt1  { margin-top: 5px }
.mt2  { margin-top:10px }
.mt3  { margin-top:15px }
.mt4  { margin-top:20px }
.mt5  { margin-top:25px }
.mt6  { margin-top:30px }
.mt7  { margin-top:35px }
.mt8  { margin-top:40px }
.mt9  { margin-top:45px }
.mt10 { margin-top:50px }
.mr0  { margin-right: 0px !important}
.mr1  { margin-right: 5px }
.mr2  { margin-right:10px }
.mr3  { margin-right:15px }
.mr4  { margin-right:20px }
.mr5  { margin-right:25px }
.mr6  { margin-right:30px }
.mb0  { margin-bottom: 0px !important}
.mb1  { margin-bottom: 5px }
.mb2  { margin-bottom:10px }
.mb3  { margin-bottom:15px }
.mb4  { margin-bottom:20px }
.mb5  { margin-bottom:25px }
.mb6  { margin-bottom:30px }
.mb7  { margin-bottom:35px }
.ml0  { margin-left: 0px !important}
.ml1  { margin-left: 5px }
.ml2  { margin-left:10px }
.ml3  { margin-left:15px }
.ml4  { margin-left:20px }
.ml5  { margin-left:25px }
.ml6  { margin-left:30px }

.p0  { padding: 0px !important;}
.p1  { padding: 5px }
.p2  { padding:10px }
.p3  { padding:15px }
.p4  { padding:20px }
.p5  { padding:25px }
.p6  { padding:30px }
.pv0  { padding-bottom: 0px !important; padding-top: 0px !important}
.pv1  { padding-bottom: 5px; padding-top: 5px }
.pv2  { padding-bottom:10px; padding-top:10px }
.pv3  { padding-bottom:15px; padding-top:15px }
.pv4  { padding-bottom:20px; padding-top:20px }
.pv5  { padding-bottom:25px; padding-top:25px }
.pv6  { padding-bottom:30px; padding-top:30px }

.ph0  { padding-left: 0px !important; padding-right: 0px !important}
.ph1  { padding-left: 5px; padding-right: 5px }
.ph2  { padding-left:10px; padding-right:10px }
.ph3  { padding-left:15px; padding-right:15px }
.ph4  { padding-left:20px; padding-right:20px }
.ph5  { padding-left:25px; padding-right:25px }
.ph6  { padding-left:30px; padding-right:30px }

.pt0  { padding-top: 0px !important}
.pt1  { padding-top: 5px }
.pt2  { padding-top:10px }
.pt3  { padding-top:15px }
.pt4  { padding-top:20px }
.pt5  { padding-top:25px }
.pt6  { padding-top:30px }
.pr0  { padding-right: 0px !important}
.pr1  { padding-right: 5px }
.pr2  { padding-right:10px }
.pr3  { padding-right:15px }
.pr4  { padding-right:20px }
.pr5  { padding-right:25px }
.pr6  { padding-right:30px }
.pb0  { padding-bottom: 0px !important}
.pb1  { padding-bottom: 5px }
.pb2  { padding-bottom:10px }
.pb3  { padding-bottom:15px }
.pb4  { padding-bottom:20px }
.pb5  { padding-bottom:25px }
.pb6  { padding-bottom:30px }
.pl0  { padding-left: 0px !important}
.pl1  { padding-left: 5px }
.pl2  { padding-left:10px }
.pl3  { padding-left:15px }
.pl4  { padding-left:20px }
.pl5  { padding-left:25px }
.pl6  { padding-left:30px }

.hline {
  height: 1px;
  background-color: #ECECEC
}
.hline2 {
  height: 2px;
  background-color: #B7B7B7
}
.hline3 {
  height: 1px;
  background-color: #a0a0a0
}
.vline  {
  width:1px;
  background-color: #ededed
}


.size5 {
  width: 5px;
  height:5px
}
.size10 {
  width: 10px;
  height: 10px
}
.size15 {
  width: 15px;
  height: 15px
}
.size18  {
  width: 18px;
  height: 18px
}
.size20  {
  width: 20px;
  height: 20px
}
.size30  {
  width: 30px;
  height: 30px
}
.size35  {
  width: 35px;
  height: 35px
}
.size40  {
  width: 40px;
  height: 40px
}
.size50  {
  width: 50px;
  height: 50px
}
.size60  {
  width: 60px;
  height: 60px
}
.size70  {
  width: 70px;
  height: 70px
}
.size80  {
  width: 80px;
  height: 80px
}
.size120{
  width: 120px;
  height: 120px
}

.minw100p  {min-width:100%}
.minh100p  {min-height:100%}
.maxw100p  {max-width:100%}
.maxh100p  {max-height:100%}
.borderbox  {box-sizing:border-box}

.hide  {
  display: none
}
.show {
  display: flex
}
.flex  {
  display: flex
}
.block  { display:block; }
.inline_block  { display:inline-block; }

.radius1 {
  border-radius: 5px
}
.radius2 {
  border-radius: 10px
}
.radius5 {
  border-radius: 5px
}
.radius10 {
  border-radius: 10px
}
.radius15 {
  border-radius: 15px;
}
.radius20 {
  border-radius: 20px
}
.radius30 { border-radius: 30px }
.radius40 { border-radius: 40px }
.radius50 { border-radius: 50px }
.radius80  {
  border-radius: 80px
}
.hideover {
  overflow:hidden;
}
.ellipsis {text-overflow:ellipsis}
.wsnowrap  {white-space:nowrap}

.ofyauto  {
  overflow-y:auto;
}


.mw100  { max-width:100%; }
.mh100  { max-height:100%; }
.w12_5p  {width:12.5%}
.h12_5p  {height:12.5%}
.w25p  {width:25%}
.h25p  {height:25%}
.w33p  {width:33.333333%}
.h33p  {height:33.333333%}
.w50p  {width:50%}
.h50p  {height:50%}
.w60p  { width:60%; }
.h60p  { height:60%; }
.w70p  { width:70%; }
.h70p  { height:70%; }
.w80p  { width:80%; }
.h80p  { height:80%; }
.w90p  { width:90%; }
.h90p  { height:90%; }
.w100p  { width:100%; }
.h100p  { height:100%; }

.deco_no  {
  text-decoration:none;
}
.shadow1{
  box-shadow: 0px 0px 5px rgba(144,144,144, 0.4);
}
.btn_primary {
  border-radius: 0.3rem;
  background: rgba(53,130,220,1);
  color: white;
  text-align: center;
  padding: 0.7rem;
}
.btn_disable{
  border-radius: 0.3rem;
  background: rgba(144,144,144,1);
  color: white;
  text-align: center;
  padding: 0.7rem;
}
.usr_logo{
  width: 4rem;
  height: 4rem;
  border-radius: 4rem;
}
.logo_mini{
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 1.5rem;
}

.left0  {left:0px}
.right0  {right:0px}
.top0  {top:0px}
.bottom0  {bottom:0px}

.zdialog  {zIndex:900}
.ztopest  {zIndex:10000}
.bordernone{ border:none; }

.anchor50p  {
  transform:translate(-50%,-50%);
}
.pointer {cursor: pointer;}

.border0{
	border:1px solid #e8e8e8;
}

table th, table td{
    white-space:nowrap;
}
.ant-table-body {
    overflow:auto;
}
.table1 {
	overflow:hidden;
}
.table1 tr:nth-child(odd){
	background:rgba(65, 222, 255, 0.05);
}
.table1 th{
	border:1px solid #e9e9e9;
	padding:3px 10px;
}
.table1 td{
	border:1px solid #e9e9e9;
	padding:3px 10px;
}

.square::before{content: "";padding-top: 100%;display: block;}

.break_all {
  word-break: break-all;
}
