/*flex布局*/
/*水平方向*/
.flx_row {
  display: flex;
  align-items: center;
}
/* 
|AAA  |
|     |
|     |
 */
.flx_row_left_top {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
|     |
|AAA  |
|     |
 */
.flx_row_left_mid {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}
/*
|     |
|     |
|AAA  |
 */
.flx_row_left_bottom {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  flex-wrap: wrap;
}
/* 
| AAA |
|     |
|     |
 */
.flx_row_mid_top {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
|     |
| AAA |
|     |
 */
.flx_row_mid_mid {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.flx_row_mid {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
/* 
|     |
|     |
| AAA |
 */
.flx_row_mid_bottom {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  flex-wrap: wrap;
}
/* 
|  AAA|
|     |
|     |
 */
.flx_row_right_top {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
|     |
|  AAA|
|     |
 */
.flx_row_right_mid {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}
/* 
|     |
|     |
|  AAA|
 */
.flx_row_right_bottom {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
  flex-wrap: wrap;
}
/* 
|A A A|
|     |
|     |
 */
.flx_row_top_spaceBetween {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
|     |
|A A A|
|     |
 */
.flx_row_mid_spaceBetween {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
/* 
|     |
| A A A |
|     |
 */
.flx_row_mid_spaceAround {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
}
/* 
|     |
|     |
|A A A|
 */
.flx_row_bottom_spaceBetween {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
|     |
|     |
|A A A  底线|
*/
.flx_row_bottom_baseline {
  display: flex;
  align-items:end;
}

/*竖直方向*/
/* 
-----
A
A
A


-----
 */
.flx_column_left_top {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
-----

A
A
A

-----
 */

.flx_column_left_mid {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
-----


A
A
A
-----
 */
.flx_column_left_bottom {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
-----
  A
  A
  A


-----
 */
.flx_column_mid_top {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}
/* 
-----

  A
  A
  A

-----
 */
.flx_column_mid_mid {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
/* 
-----


  A
  A
  A
-----
 */
.flx_column_mid_bottom {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}
/* 
-----
    A
    A
    A


-----
 */
.flx_column_right_top {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  flex-wrap: wrap;
}
/* 
-----

    A
    A
    A
    
-----
 */
.flx_column_right_mid {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  flex-wrap: wrap;
}
/* 
-----


    A
    A
    A
-----
 */
.flx_column_right_bottom {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  flex-wrap: wrap;
}
/* 
-----
A

A

A
-----
 */
.flx_column_left_spaceBetween{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
/* 
-----
  A

  A

  A
-----
 */
.flx_column_mid_spaceBetween{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
/* 
-----
    A

    A

    A
-----
 */
.flx_column_right_spaceBetween{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
}

/*  */
.max_1_line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.max_2_line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.max_3_line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.max_4_line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
.max_6_line{
    overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
}