/*-----------------------------------------------------------------------------
version:   	1.0.0
-----------------------------------------------------------------------------*/
@charset "utf-8";

html,
body {
  margin: 0;
  padding: 0;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  font: normal 14px "Microsoft Yahei", simsun, Verdana, Lucida, Arial, Helvetica,
    sans-serif;
  color: #131313;
  background-color: #fff;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
cite,
code,
del,
dfn,
em,
img,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dd,
dl,
dt,
li,
ol,
ul,
fieldset,
form,
label,
input,
textarea,
legend,
button,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-style: normal;
  font-size: 100%;
  line-height: 1;
  font-family: inherit;
  outline: none;
}

nav,
section,
aside,
article,
figure,
header,
footer,
details,
hgroup,
figcaption {
  display: block;
  clear: both;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

ol,
ul,
nav ul,
footer ul {
  list-style: none;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:focus {
  outline: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
  content: "";
}

audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

audio:not([controls]) {
  display: none;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

blockquote {
  border-left: 3px solid #999;
  padding-left: 15px;
}

input::-webkit-input-placeholder {
  color: #bbb !important; /* WebKit browsers */
  white-space: nowrap;
  text-overflow: ellipsis;
}
input:-moz-placeholder {
  color: #bbb !important; /*Mozilla Firefox 4 to 18 */
  white-space: nowrap;
  text-overflow: ellipsis;
}
input::-moz-placeholder {
  color: #bbb !important; /*Mozilla Firefox 19+ */
  white-space: nowrap;
  text-overflow: ellipsis;
}
input:-ms-input-placeholder {
  color: #bbb !important; /* Internet Explorer 10+ */
  white-space: nowrap;
  text-overflow: ellipsis;
}

.widthauto {
  width: auto !important;
}

.left,
.fl-left,
.fl {
  float: left;
}

.right,
.fl-right,
.fr {
  float: right;
}

.clearfix,
.clear {
  clear: both;
  height: 0;
  overflow: hidden;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  zoom: 1;
}

.clearfix:after {
  clear: both;
}

.ib {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.ib.middle {
  vertical-align: middle;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.hidden {
  display: none;
}

.pointer {
  cursor: pointer;
}

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

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

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

/* flex布局 */
.flex {
  display: flex;
  flex-direction: row;
  align-items: center;
}
/* 换行 */
.flex-wrap {
  flex-wrap: wrap;
}
/* 不换行 */
.flex-nowrap {
  flex-wrap: nowrap;
}
/* 由于align-items: flex-start在后面，故覆盖了"flex"的align-items: center */
.col-top {
  align-items: flex-start;
}
/* 垂直居中 */
.col-center {
  align-items: center;
}
/* 顶部对齐 */
.col-top {
  align-items: flex-start;
}
/* 底部对齐 */
.col-bottom {
  align-items: flex-end;
}
/* 左边对齐 */
.row-left {
  justify-content: flex-start;
}
/* 水平居中 */
.row-center {
  justify-content: center;
}
/* 右边对齐 */
.row-right {
  justify-content: flex-end;
}
/* 水平两端对齐，项目之间的间隔都相等 */
.row-between {
  justify-content: space-between;
}
/* 水平每个项目两侧的间隔相等，所以项目之间的间隔比项目与父元素两边的间隔大一倍 */
.row-around {
  justify-content: space-around;
}
.flex-1 {
  flex: 1;
}
.flex-2 {
  flex: 2;
}
.flex-3 {
  flex: 3;
}
.flex-4 {
  flex: 4;
}
.flex-5 {
  flex: 5;
}
.flex-6 {
  flex: 6;
}
.flex-7 {
  flex: 7;
}
.flex-8 {
  flex: 8;
}
.flex-9 {
  flex: 9;
}
.flex-10 {
  flex: 10;
}
.flex-11 {
  flex: 11;
}
.flex-12 {
  flex: 12;
}

/* 字体大小 */
.font-xs {
  font-size: 12px;
}
.font-sm {
  font-size: 13px;
}
.font-md {
  font-size: 14px;
}
.font-lg {
  font-size: 15px;
}
.font-xl {
  font-size: 16px;
}

/* 文字省略 */
.line-1 {
	white-space: nowrap; /* 防止文本换行 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}
.line-2 {
	display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
	-webkit-line-clamp: 2; /* 限制在一个块元素显示的文本的行数 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}
.line-3 {
	display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
	-webkit-line-clamp: 3; /* 限制在一个块元素显示的文本的行数 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}
.line-4 {
	display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
	-webkit-line-clamp: 4; /* 限制在一个块元素显示的文本的行数 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}
.line-5 {
	display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
	-webkit-line-clamp: 5; /* 限制在一个块元素显示的文本的行数 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}
.line-7 {
	display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
	-webkit-line-clamp: 7; /* 限制在一个块元素显示的文本的行数 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}
.line-10 {
	display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
	-webkit-line-clamp: 10; /* 限制在一个块元素显示的文本的行数 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	overflow: hidden; /* 隐藏超出容器的内容 */
	text-overflow: ellipsis; /* 显示省略号 */
}

.vert-top {
  position: relative;
  bottom: 0;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}

.vert-middle {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.vert-bottom {
  position: relative;
  bottom: -100%;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}