/* 用于定义一些常用的类名与样式，避免重复书写样式 */

:root {
  --textColor: #9f9f9f;
  --themeColor: #ff5000;
}

/* 文字 */
.text-center {
  text-align: center;
}

/* 超出一行变省略号 */
.truncate {
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* 超出两行变省略号 */
.truncate-two {
  display: -webkit-box;
  overflow: hidden;
  line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  -ms-box-orient: vertical;
  -ms-line-clamp: 2;
  text-overflow: ellipsis;
}
.truncate-one {
  display: -webkit-box;
  overflow: hidden;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  -ms-box-orient: vertical;
  -ms-line-clamp: 1;
  text-overflow: ellipsis;
}
.truncate-three {
  display: -webkit-box;
  overflow: hidden;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  -ms-box-orient: vertical;
  -ms-line-clamp: 3;
  text-overflow: ellipsis;
}
/* 盒模型控制 */
.border-box {
  box-sizing: border-box;
}
.content-box {
  box-sizing: content-box;
}

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

/* 颜色 */
.font-white {
  color: #fff;
}
.font-black {
  color: #212121;
}
.bg-white {
  background-color: #fff;
}

/* 弹性布局 */
.flex {
  display: flex;
}
.justify-between {
  justify-content: space-between;
}
.justify-around {
  justify-content: space-around;
}
.items-center {
  align-items: center;
}
.justify-center {
  justify-content: center;
}
.justify-end {
  justify-content: flex-end;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex-column {
  flex-direction: column;
}

/* 版心区域宽1500px并居中 */
.main_area {
  width: 1280px;
  margin: auto;
}
.main_color {
  color: var(--themeColor);
}
.pointer {
  cursor: pointer;
}
.borderRadius8 {
  border-radius: 8px;
}
.center {
  text-align: center;
}
.fs12 {
  font-size: 12px;
}
.fs14 {
  font-size: 14px;
}
.fs16 {
  font-size: 16px;
}
.fs20 {
  font-size: 20px;
}
.margin-l-1 {
  margin-left: 10px;
}
.margin-l-2 {
  margin-left: 20px;
}
.margin-t-1 {
  margin-top: 10px;
}
.font-bold {
  font-weight: bold;
}
.none {
  display: none;
}
/* 禁止选中文字 */
.prohibit-select {
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
}

/* 针对IE11的CSS Hack */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .main_color {
    color: #ff5000;
  }
}