/**加载蒙层**/
.loading{width: 100%; height: 100%; position: fixed; top:0; left: 0; background: rgba(0,0,0,0.3); z-index: 10000;box-sizing: border-box; display: flex; flex: 0 1 auto; flex-direction: column; flex-grow: 1; flex-shrink: 0; align-items: center; justify-content: center;}

/*******颜色*******/
.red    {color:red      }
.blue   {color:blue     }
.green  {color:green    }
.yellow {color:yellow   }
.orange {color:orange   }
.black  {color:black    }
.white  {color:white    }

/**间距信息*/
.pd0{ padding :0px !important;   }
.pd1{ padding :1px !important;   }
.pd2{ padding :2px !important;   }
.pd3{ padding :3px !important;   }
.pd4{ padding :4px !important;   }
.pd5{ padding :5px !important;   }
.pd6{ padding :6px !important;   }
.pd7{ padding :7px !important;   }
.pd8{ padding :8px !important;   }
.pd9{ padding :9px !important;   }
.pd10{padding :10px !important;  }
.pd15{padding :15px !important;  }
.pd20{padding :20px !important;  }
.pd25{padding :25px !important;  }
.pd30{padding :30px !important;  }
.pd50{padding :50px !important;  }

.pd1-t{ padding-top :1px !important;   }
.pd2-t{ padding-top :2px !important;   }
.pd3-t{ padding-top :3px !important;   }
.pd4-t{ padding-top :4px !important;   }
.pd5-t{ padding-top :5px !important;   }
.pd6-t{ padding-top :6px !important;   }
.pd7-t{ padding-top :7px !important;   }
.pd8-t{ padding-top :8px !important;   }
.pd9-t{ padding-top :9px !important;   }
.pd10-t{padding-top :10px !important;  }
.pd15-t{padding-top :15px !important;  }
.pd20-t{padding-top :20px !important;  }
.pd25-t{padding-top :25px !important;  }
.pd30-t{padding-top :30px !important;  }
.pd50-t{padding-top :50px !important;  }

.pd1-l{ padding-left :1px !important;   }
.pd2-l{ padding-left :2px !important;   }
.pd3-l{ padding-left :3px !important;   }
.pd4-l{ padding-left :4px !important;   }
.pd5-l{ padding-left :5px !important;   }
.pd6-l{ padding-left :6px !important;   }
.pd7-l{ padding-left :7px !important;   }
.pd8-l{ padding-left :8px !important;   }
.pd9-l{ padding-left :9px !important;   }
.pd10-l{padding-left :10px !important;  }
.pd15-l{padding-left :15px !important;  }
.pd20-l{padding-left :20px !important;  }
.pd25-l{padding-left :25px !important;  }
.pd30-l{padding-left :30px !important;  }
.pd50-l{padding-left :50px !important;  }

.pd1-r{ padding-right :1px !important;   }
.pd2-r{ padding-right :2px !important;   }
.pd3-r{ padding-right :3px !important;   }
.pd4-r{ padding-right :4px !important;   }
.pd5-r{ padding-right :5px !important;   }
.pd6-r{ padding-right :6px !important;   }
.pd7-r{ padding-right :7px !important;   }
.pd8-r{ padding-right :8px !important;   }
.pd9-r{ padding-right :9px !important;   }
.pd10-r{padding-right :10px !important;  }
.pd15-r{padding-right :15px !important;  }
.pd20-r{padding-right :20px !important;  }
.pd25-r{padding-right :25px !important;  }
.pd30-r{padding-right :30px !important;  }
.pd50-r{padding-right :50px !important;  }

.pd1-b{ padding-bottom :1px !important;   }
.pd2-b{ padding-bottom :2px !important;   }
.pd3-b{ padding-bottom :3px !important;   }
.pd4-b{ padding-bottom :4px !important;   }
.pd5-b{ padding-bottom :5px !important;   }
.pd6-b{ padding-bottom :6px !important;   }
.pd7-b{ padding-bottom :7px !important;   }
.pd8-b{ padding-bottom :8px !important;   }
.pd9-b{ padding-bottom :9px !important;   }
.pd10-b{padding-bottom :10px !important;  }
.pd15-b{padding-bottom :15px !important;  }
.pd20-b{padding-bottom :20px !important;  }
.pd25-b{padding-bottom :25px !important;  }
.pd30-b{padding-bottom :30px !important;  }
.pd50-b{padding-bottom :50px !important;  }

/**间距信息*/
.mg1{ margin :1px !important;   }
.mg2{ margin :2px !important;   }
.mg3{ margin :3px !important;   }
.mg4{ margin :4px !important;   }
.mg5{ margin :5px !important;   }
.mg6{ margin :6px !important;   }
.mg7{ margin :7px !important;   }
.mg8{ margin :8px !important;   }
.mg9{ margin :9px !important;   }
.mg10{margin :10px !important;  }
.mg15{margin :15px !important;  }
.mg20{margin :20px !important;  }
.mg25{margin :25px !important;  }
.mg30{margin :30px !important;  }

.mg1-t{ margin-top :1px !important;   }
.mg2-t{ margin-top:2px !important;   }
.mg3-t{ margin-top:3px !important;   }
.mg4-t{ margin-top:4px !important;   }
.mg5-t{ margin-top:5px !important;   }
.mg6-t{ margin-top:6px !important;   }
.mg7-t{ margin-top:7px !important;   }
.mg8-t{ margin-top:8px !important;   }
.mg9-t{ margin-top:9px !important;   }
.mg10-t{margin-top:10px !important;  }
.mg15-t{margin-top:15px !important;  }
.mg20-t{margin-top:20px !important;  }
.mg25-t{margin-top:25px !important;  }
.mg30-t{margin-top:30px !important;  }

.mg1-b{ margin-bottom :1px !important;   }
.mg2-b{ margin-bottom :2px !important;   }
.mg3-b{ margin-bottom :3px !important;   }
.mg4-b{ margin-bottom :4px !important;   }
.mg5-b{ margin-bottom :5px !important;   }
.mg6-b{ margin-bottom :6px !important;   }
.mg7-b{ margin-bottom :7px !important;   }
.mg8-b{ margin-bottom :8px !important;   }
.mg9-b{ margin-bottom :9px !important;   }
.mg10-b{margin-bottom :10px !important;  }
.mg15-b{margin-bottom :15px !important;  }
.mg20-b{margin-bottom :20px !important;  }
.mg25-b{margin-bottom :25px !important;  }
.mg30-b{margin-bottom :30px !important;  }

.mg1-l{ margin-left :1px !important;   }
.mg2-l{ margin-left:2px !important;    }
.mg3-l{ margin-left:3px !important;    }
.mg4-l{ margin-left :4px !important;   }
.mg5-l{ margin-left :5px !important;   }
.mg6-l{ margin-left :6px !important;   }
.mg7-l{ margin-left :7px !important;   }
.mg8-l{ margin-left :8px !important;   }
.mg9-l{ margin-left :9px !important;   }
.mg10-l{margin-left :10px !important;  }
.mg15-l{margin-left :15px !important;  }
.mg20-l{margin-left :20px !important;  }
.mg25-l{margin-left :25px !important;  }
.mg30-l{margin-left :30px !important;  }

.mg1-r{ margin-right :1px !important;   }
.mg2-r{ margin-right :2px !important;   }
.mg3-r{ margin-right :3px !important;   }
.mg4-r{ margin-right :4px !important;   }
.mg5-r{ margin-right :5px !important;   }
.mg6-r{ margin-right :6px !important;   }
.mg7-r{ margin-right :7px !important;   }
.mg8-r{ margin-right :8px !important;   }
.mg9-r{ margin-right :9px !important;   }
.mg10-r{margin-right :10px !important;  }
.mg15-r{margin-right :15px !important;  }
.mg20-r{margin-right :20px !important;  }
.mg25-r{margin-right :25px !important;  }
.mg30-r{margin-right :30px !important;  }

.bdl-1{border-left: 1px solid #eaeaea}
.bdr-1{border-right: 1px solid #eaeaea}
.bdt-1{border-top: 1px solid #eaeaea}
.bdb-1{border-bottom: 1px solid #eaeaea}
/********/
.t-left{text-align:left}
.t-center{text-align:center}
.t-right{text-align:right}
/*字体颜色*/
.f-red      {   color: #fa5151 !important;  }
.f-green    {   color: #07c160 !important;  }
.f-blue     {   color: #4874b5 !important;  }/**#10aeff**/
.f-black    {   color: #333 !important;     }
.f-white    {   color: #FFF !important;     }
.f-purple   {   color: #FF33CC !important;  }
.f-gray     {   color: gray !important;  }
.f-yellow   {   color: #FFFF66 !important;  }
.f-orange   {   color: #FF6600 !important;  }
/*背景颜色*/
.bg-green   {   background-color:#07c160 !important;   }
.bg-red     {   background-color:#fa5151 !important;   }
.bg-orange  {   background-color:#F37B1D !important;   }
.bg-white   {   background-color:#FFFFFF !important;   }
.bg-blue    {   background-color: #10aeff !important;  }
.bg-gray    {   background-color:rgb(242, 242, 242) !important }
.bg-lightgreen   {   background-color:lightgreen !important;   }
.bg-lightblue   {   background-color:lightblue !important;   }
.bg-lightyellow   {   background-color:lightyellow !important;   }


/**块级背景色**/
.blk-green   {   background-color:#ceffd5 !important;   }
.blk-orange  {   background-color:#ffeec3 !important;   }
.blk-purple  {   background-color:#fccaff !important;   }
.blk-blue    {   background-color:#d1f3ff !important;   }

/*字体11-55号*/
.f5     {   font-size: 5px !important; line-height: 5px; }
.f6     {   font-size: 6px !important; line-height: 6px; }
.f7     {   font-size: 7px !important; line-height: 7px; }
.f8     {   font-size: 8px !important; line-height: 8px; }
.f9     {   font-size: 9px !important; line-height: 9px; }
.f10    {   font-size: 10px !important; line-height: 10px; }
.f11    {   font-size: 11px !important; line-height: 11px; }
.f12    {   font-size: 12px !important; line-height: 12px; }
.f13    {   font-size: 13px !important; line-height: 13px; }
.f14    {   font-size: 14px !important; line-height: 14px; }
.f15    {   font-size: 15px !important; line-height: 15px; }
.f16    {   font-size: 16px !important; line-height: 16px; }
.f17    {   font-size: 17px !important; line-height: 17px; }
.f18    {   font-size: 18px !important; line-height: 18px; }
.f19    {   font-size: 19px !important; line-height: 19px; }
.f20    {   font-size: 20px !important; line-height: 20px; }
.f21    {   font-size: 21px !important; line-height: 21px; }
.f22    {   font-size: 22px !important; line-height: 22px; }
.f23    {   font-size: 23px !important; line-height: 23px; }
.f24    {   font-size: 24px !important; line-height: 24px; }
.f25    {   font-size: 25px !important; line-height: 25px; }
.f26    {   font-size: 26px !important; line-height: 26px; }
.f27    {   font-size: 27px !important; line-height: 27px; }
.f28    {   font-size: 28px !important; line-height: 28px; }
.f29    {   font-size: 29px !important; line-height: 29px; }
.f30    {   font-size: 30px !important; line-height: 30px; }
.f31    {   font-size: 31px !important; line-height: 31px; }
.f32    {   font-size: 32px !important; line-height: 32px; }
.f35    {   font-size: 35px !important; line-height: 35px; }
.f40    {   font-size: 40px !important; line-height: 40px; }
.f45    {   font-size: 45px !important; line-height: 45px; }
.f50    {   font-size: 50px !important; line-height: 50px; }
.f55    {   font-size: 55px !important; line-height: 55px; }
/**圆角**/
.bd-r1  {   border-radius :1px !important }
.bd-r2  {   border-radius :2px !important }
.bd-r3  {   border-radius :3px !important }
.bd-r4  {   border-radius :4px !important }
.bd-r5  {   border-radius :5px !important }
.bd-r10 {   border-radius :10px !important }
.bd-r15 {   border-radius :15px !important }
.bd-r20 {   border-radius :20px !important }
.bd-r25 {   border-radius :25px !important }
.bd-r30 {   border-radius :30px !important }

/**加粗**/
.bold    {   font-weight: 900  }
.b1      {   font-weight: 100  }
.b2      {   font-weight: 200  }
.b3      {   font-weight: 300  }
.b4      {   font-weight: 400  }
.b5      {   font-weight: 500  }
.b6      {   font-weight: 600  }
.b7      {   font-weight: 700  }
.b8      {   font-weight: 800  }
.b9      {   font-weight: 900  }
/**模糊**/
.vague   { opacity: .7 }
.vague1  { opacity: .1 }
.vague2  { opacity: .2 }
.vague3  { opacity: .3 }
.vague4  { opacity: .4 }
.vague5  { opacity: .5 }
.vague6  { opacity: .6 }
.vague7  { opacity: .7 }
.vague8  { opacity: .8 }
.vague9  { opacity: .9 }

.xjr-disable{
    opacity : .3;
    color   : #CCCCCC !important;
}
/**
 * 单行显示，超宽换行
 */
.oneline{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/**上下左右居中**/
.block-center{
	display:flex;
	align-items:center;
	margin:0 auto;
	justify-content:center;
}
/**灰色的边框***/
.block-dash{
    border:1px dashed #000;
}
.center{
    text-align: center;
}
/**div内文字左右均布********/
.distri{
    display: inline-block;
    text-align: justify;
    text-align-last: justify;
}
/**全屏的弹窗*/
.layer-full{
    position:fixed;
    top: 0;
    height: 100%;
    width: 100%;
    background:rgb(242, 242, 242);
    overflow: auto;
}

/**z层级**/
.z10{ z-index: 10;}
.z20{ z-index: 20;}
.z30{ z-index: 30;}
.z40{ z-index: 40;}
.z50{ z-index: 50;}
.z60{ z-index: 60;}
.z70{ z-index: 70;}
.z80{ z-index: 80;}
.z90{ z-index: 90;}
.z100{ z-index: 100;}
.z200{ z-index: 200;}
.z300{ z-index: 300;}
.z400{ z-index: 400;}
.z500{ z-index: 500;}
.z1000{ z-index: 1000;}
/**控制是否显示*/
.block { display: block; }
.show { display: block; }
.hide { display: none; }

/**flex布局***/
.flex {display:flex}
.flex1{flex:1}
.flex2{flex:2}
.flex3{flex:3}
.flex4{flex:4}
.flex5{flex:5}
.flex6{flex:6}
.flex7{flex:7}
.flex8{flex:8}
.flex9{flex:9}
.flex10{flex:10}
/**图片居中**/
.img-center{
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%
}
/** 阴影 */
.shade1{box-shadow: 1px 1px 2px 1px #cccccc;}
.shade2{box-shadow: 2px 2px 4px 1px #cccccc;}
.shade3{box-shadow: 3px 3px 6px 1px #cccccc;}
.shade4{box-shadow: 4px 4px 8px 1px #cccccc;}
.shade5{box-shadow: 5px 5px 10px 1px #cccccc;}

.text-shade {
  text-shadow: 2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white, -2px 2px 0 white
}