@charset "utf-8";

/* CSS Document */

* {
    margin: 0;
    padding: 0;
    vertical-align: top;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}

a{
    -webkit-tap-highlight-color:transparent;
    color: inherit;
}

body {
    font: 12px "微软雅黑", Arial, Tahoma, Helvetica, \5b8b\4f53, sans-serif;
}

html,
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
object,
code,
em,
span,
var,
legend,
button,
input,
textarea,
a,
img,
header,
footer,
nav,
aside,
audio,
datalist,
section {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}


/*清除内外边距*/

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    font-size: 100%;
}


/*设置默认字体*/

:focus {
    outline: 0;
}

ul,
ol,
ul li,
ol li {
    list-style: none;
}


/*重置列表*/

address,
caption,
cite,
em,
code,
dfn,
th,
var,
i {
    font-style: normal;
    font-weight: normal;
}


/*form label {
	cursor: pointer;
}*/

input,
button,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    outline: none;
}

textarea {
    resize: none
}

input {
    vertical-align: middle;
}

img {
    border: 0;
}


/*重置图片元素*/

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/*重置表格*/

button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
    line-height: normal !important;
}

a {
    text-decoration: none;
}

img {
    vertical-align: top;
}

input {
    _filter: chroma(color=#000000);
}


/*--清除浮动
------------------------------------------------------------------------------------------*/

.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}

.clearfix {
    zoom: 1;
}

.overflow {
    overflow: hidden;
    _zoom: 1;
}

.clear {
    clear: both;
}

.l {
    float: left;
}

.r {
    float: right;
}


/*省略号*/

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}
.ellipsis-s2 {
    display: -webkit-box;
    display: -moz-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.ellipsis-s3 {
    display: -webkit-box;
    display: -moz-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.ellipsis-s4 {
    display: -webkit-box;
    display: -moz-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}
.ellipsis-s5 {
    display: -webkit-box;
    display: -moz-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}

/*内联块元素*/

.line {
    display: inline-block;
}
/*加载动画(一) 底部样式*/
#loading_1 {
	text-align: center;
	font-size: 15px;
	line-height: 25px;
	display: none;
}
#loading_1 img {
	width: 25px;
	height: 25px;
}
/*加载动画(二) 弹层样式*/
#loading_2 {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-color: rgba(0,0,0,0.8);
	padding: 10px;
	color: #f0f0f0;
	line-height: 30px;
	font-size: 15px;
	display: none;
}
#loading_2>img {
	width: 30px;
	height: 30px;
	margin-right: 10px;
}
/*msg公众消息提示*/

.msg {
	position: fixed;
	top: 35%;
	left: 50%;
	transform: translateX(-50%);
	padding: 8px;
	background-color: rgba(0, 0, 0, .8);
	color: #fff;
	font-size: 15px;
	border-radius: 10px;
	display: none;
	z-index: 9999;
}
/*按钮按下效果*/
/*普通效果****************************************/
.eleactive0 {
	position: relative;
	overflow: hidden;
}
.eleactive0:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,.2);
	opacity: 0;
	transition: all .1s; 
}
.eleactive0:active:after {
	opacity: 1;
	transition: all 0s;
}
/*水波纹效果*******************************/
.eleactive1 {
    position: relative;
    /*隐藏溢出的径向渐变背景*/
    overflow: hidden;
}

.eleactive1:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /*pointer-events: none;*/
    /*设置径向渐变*/
    background-image: radial-gradient(circle, #222 10%, transparent 10.01%);
    background-repeat: no-repeat;
    background-position: 50%;
    transform: scale(10, 10);
    opacity: 0;
    transition: transform .3s, opacity .5s;
}

.eleactive1:active:after {
    transform: scale(0, 0);
    opacity: .3;
    /*设置初始状态*/
    transition: 0s;
}
/*溢出效果********************************************/
.eleactive2 {
    position: relative;
    /*此处不需要设置overflow:hidden,因为after元素需要溢出显示*/
}
.eleactive2:focus{
    outline: none;
}

.eleactive2:after {
    content: "";
    display: block;
    position: absolute;
    /*扩大伪类元素4个方向各10px*/
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;
    pointer-events: none;
    background-color: #333;
    background-repeat: no-repeat;
    background-position: 50%;
    opacity: 0;
    transition: all .3s;
}

.eleactive2:active:after {
    opacity: .3;
    /*设置初始状态*/
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: 0s;
}
.hollowRedBorder {
	border: 1px solid #E04646;
	color: #E04646;
}
.solidRed {
	background-color: #E04646;
	color: #fff;
}
.hollowYellowBorder {
	border: 1px solid #FF9800;
	color: #FF9800;
}
.solidYellow {
	background-color: #FF9800;
	color: #fff;
}
.hollowBlueBorder {
	border: 1px solid #4390EE;
	color: #4390EE;
}
.solidBlue {
	background-color: #4390EE;
	color: #4390EE;
}