@charset "UTF-8";
/* ************************  弹性盒子布局  *********************** */
.flex {
  display: flex;
}

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

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

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

.flex-around {
  justify-content: space-around;
}

.flex-start {
  justify-content: flex-start;
}

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

/* *********************** text ********************* */
.text-left {
  text-align: left;
}

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

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

.text-indent {
  text-indent: 2em;
}

.text-lower {
  text-transform: lowercase;
}

.text-upper {
  text-transform: uppercase;
}

.text-capitalize {
  text-transform: capitalize;
}

.text-through {
  text-decoration: line-through;
}

.text-underline {
  text-decoration: underline;
}

.text-overline {
  text-decoration: overline;
}

/* ***************************  dispaly  ************************** */
.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.hide {
  display: none;
}

/* **************************  overflow  ************************** */
.overflow-hidden {
  overflow: auto;
}

.overflow-x-scroll {
  overflow-x: scroll;
}

.overflow-y-scroll {
  overflow-y: scroll;
}

.overflow-auto {
  overflow: auto;
}

.visible-hidden {
  visibility: hidden;
}

/* **************************  other  ************************** */
.margin-auto {
  margin: 0 auto;
}

.border-box {
  box-sizing: border-box;
}