html{
    font-size: 100px;
  }
  body{
    font-size: 12px;
    width: 100%;
    font-family: 'Microsoft yahei';
    /* line-height: 0; */
  }
 
  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  #allmap *{
    box-sizing: content-box;
    
  }

  ul,li{
    list-style-type: none;
  }
  a,a:hover,a:active{
    text-decoration: none;
  }

  .bf4{
    background: #f4f4f4;
  }
  .bf1{
    background: #f1f1f1;
  }
  .bf{
    background: #fff;
  }
  .bg_mask{
    background: rgba(0,0,0,.3);
    /* position: absolute; */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* width: 100%;
    height: 100%; */
    z-index: 100;
  }
  
  
  .ellipsis{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .overflows{
    overflow: hidden;
  }
  .pointer{
    cursor: pointer;
  }
  .widths{
    width: 100%;
  }
  .heights{
    height: 100%;
  }
  .min{
    min-width: 12.6rem;
  }
  .width1260{
    width: 12.6rem;
  }
  .width1200{
    width: 12rem;
  }
  .width1060{
    width: 10.6rem;
  }
  .width1000{
    width: 10rem;
  }
  .widths50{
    width: 50%;
  }
  .autos{
    margin: 0 auto;
  }
  .minW{
    min-width: 0;
  }
  .minH{
    min-height: 0;
  }
  
  /* radius */
  .radius{
    border-radius: 50%;
  }
  .radius2{
    border-radius: 2px;
  }
 
  .radius4{
    border-radius: 4px;
  }

  .radius6{
    border-radius: 6px;
  }
  
  .radius8{
    border-radius: 8px;
  }

  /* 清楚浮动 */
  .clear::after{
    content: '';
    height: 0;
    visibility: hidden;
    clear: both;
    display: block;
  }
  .clearLeft::after{
    content: '';
    height: 0;
    visibility: hidden;
    clear: left;
    display: block;
  }
  .clearRight::after{
    content: '';
    height: 0;
    visibility: hidden;
    clear: right;
    display: block;
  }
  
  /* flex布局 */
  .flex {
    display: -webkit-flex !important;
    display: flex !important;
  }
  .inlineFlex {
    display: -webkit-inline-flex !important;
    display: inline-flex !important;
  } 
   /* 水平轴 */
  .flexRow {
    -webkit-flex-direction: row ;
    flex-direction: row ;
  }
  .flexRow-reverse {
    -webkit-flex-direction: row-reverse ;
    flex-direction: row-reverse ;
  }
  /* 垂直轴 */
  .flexColumn {
    -webkit-flex-direction: column ;
    flex-direction: column ;
  }
  .flexColumn-reverse {
    -webkit-flex-direction: column-reverse ;
    flex-direction: column-reverse ;
  }
  /* 换行 */
  .flexWrap  {
    -webkit-flex-wrap : wrap ;
    flex-wrap : wrap ;
  }
  .flexNowrap   {
    -webkit-flex-wrap : nowrap  ;
    flex-wrap : nowrap  ;
  }
  .flexWrap-reverse  {
    -webkit-flex-wrap : wrap-reverse ;
    flex-wrap : wrap-reverse ;
  }
  /* 对齐模式 */
  .justifyStart {
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
  }
  .justifyEnd  {
    -webkit-justify-content: flex-end ;
    justify-content: flex-end ;
  }
  .justifyCenter {
    -webkit-justify-content: center;
    justify-content: center;
  }
  .justifyBetween {
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
  .justifyAround {
    -webkit-justify-content: space-around;
    justify-content: space-around;
  }
  /* 轴线对齐 */
  .itemsStart {
    -webkit-align-items: flex-start;
    align-items: flex-start;
  }
  .itemsEnd {
    -webkit-align-items: flex-end ;
    align-items: flex-end ;
  }
  .itemsCenter {
    -webkit-align-items: center ;
    align-items: center ;
  }
  .itemsBaseline {
    -webkit-align-items: baseline  ;
    align-items: baseline  ;
  }
  .itemsStretch {
    -webkit-align-items: stretch ;
    align-items: stretch ;
  }
  
  /* 多轴对齐 */
  .contentStart {
    -webkit-align-content: flex-start;
    align-content: flex-start;
  }
  .contentEnd {
    -webkit-align-content: flex-end ;
    align-content: flex-end ;
  }
  .contentCenter {
    -webkit-align-content: center ;
    align-content: center ;
  }
  .contentBaseline {
    -webkit-align-content: baseline  ;
    align-content: baseline  ;
  }
  .contentStretch {
    -webkit-align-content: stretch ;
    align-content: stretch ;
  }

  .flexShrink{
    /* flex:1,1,auto; */
    flex-shrink:1;
    flex-grow:1;
    flex-basis:auto;
  }
  .flexGrow{
    /* flex:0,0,auto; */
    flex-shrink:0;
    flex-grow:0;
    flex-basis:auto;
  }
  
  /* item属性 */
  /* order  项目的排列顺序 默认为0*/
  /* flex-grow   项目的放大比例  默认为0  项目不放大*/
  /* flex-shrink   项目的缩小比例  默认为1  项目缩小 */
  /* flex-basis (px)  项目占据的主轴空间  默认值为auto  即项目的本来大小 */

  /* flex   flex-grow, flex-shrink 和 flex-basis的简写   默认值为0 1 auto */
  /* flex: none | auto;  优先使用*/

  /* align-self 属性允许单个项目有与其他项目不一样的对齐方式，可覆盖align-items属性。默认值为auto */
  /* align-self: auto | flex-start | flex-end | center | baseline | stretch; */

  .selfAuto {
    -webkit-align-self: auto;
    align-self: auto;
  }
  .selfStart {
    -webkit-align-self: start;
    align-self: start;
  }
  .selfEnd {
    -webkit-align-self: end;
    align-self: end;
  }
  .selfCenter {
    -webkit-align-self: center;
    align-self: center;
  }
  .selfBaseline {
    -webkit-align-self: baseline;
    align-self: baseline;
  }
  .selfStretch {
    -webkit-align-self: stretch;
    align-self: stretch;
  }

  /* position */
  .relative{
    position: relative;
  }
  .absolute{
    position: absolute;
  }
  .fixed{
    position: fixed;
  }
  

  /* display */
  .none{
    display: none;
  }
  .inlineBlock{
    display: inline-block;
  }
  .block{
    display: block ;
  }
  .nones{
    display: none !important;
  }
  .inlineBlocks{
    display: inline-block !important;
  }
  .blocks{
    display: block !important;
  }


  .middles{
    vertical-align: middle;
  }
  .centers{
    text-align: center;
  }
  .index10{
    z-index: 10;
  }
  .index20{
    z-index: 20;
  }
  .index30{
    z-index: 30;
  }
  .index40{
    z-index: 40;
  }
  .index50{
    z-index: 50;
  }
  .index100{
    z-index: 100;
  }