/*重置&默认(reset&base)(tags) */
*{ box-sizing: border-box; }
*[hidefocus],input,textarea,a{outline:none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,table,thead,tbody,th,td{padding:0;margin:0;}
fieldset,img,html,body,iframe{border:0;}
table{border-collapse:collapse;border-spacing:0; border: 1;}
li{list-style:none;}
/*h1,h2,h3,h4,h5,h6{font-size:100%;}*/
/*caption,th{font-weight:normal;font-style:normal;text-align:center;}*/
em,strong{font-weight:bold;font-style:normal;}
body,textarea,select,input,pre{font-size:14px;color:#555;}
body{-webkit-text-size-adjust:none;}
a,button{cursor:pointer;}
textarea{resize:none;overflow:auto;}
pre{white-space:pre-wrap;}
a{text-decoration:none;}

/*文字分散对齐*/
.justify{ text-align: justify;}
.justify:after{content: ""; display: inline-block; padding-left: 100%; }

/*图片左右居中--区别与使用背景的居中*/
.img_center_box{width: 100px; text-indent: 50%; }
.img_center_box img{ margin-left: -50px; }

/*任意高度的垂直居中--不兼容IE8*/
.h-mid{ position: relative; top: 50%; 
	transform: translate(0,-50%); 
	-ms-transform: translate(0,-50%);/*IE9*/
	-webkit-transform: translate(0,-50%);/*safari and chrome*/}

/*任意高度的垂直居中--兼容IE8及以下*/
.parent-table{ display: table; } /*父元素*/
.table-cell{ display: table-cell; vertical-align: middle; *position: absolute;/*IE6、7、8*/ top: 50%;} /*中间元素*/
.table-cell>div{ *position: relative; top: -50%; /*IE6、7、8*/ } /*目标元素*/

/*任意高度的垂直居中--flex布局方法---flex不兼容IE9--建议只用于移动端，那么可以去掉兼容前缀*/
.h-mid-flex{ display: flex;display: -ms-flex;/*IE10*/ display: -webkit-flex; /*safari*/ display: -moz-flex; /*firefox*/align-items: center; }

/*父元素定高的任意高度的垂直居中--兼容所有*/
.parent-box{ height: 200px; line-height: 200px; } /*父元素*/
.child-box{ vertical-align: middle; display: inline-block; } 
.child-box>.text{ line-height: 20px; } /*如果有文字，文字行高恢复正常*/

/*子元素定高的父元素任意高度的垂直居中,使用绝对定位加上margin取负值即可--兼容所有*/
/*子元素定高的父元素任意高度的垂直居中,使用绝对定位,定位位置都为0，加上margin取auto即可--不兼容IE8*/


/*单行文字，溢出省略号代替*/
.ellipsis{text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }


/*多行文字，溢出省略号代替---兼容所有*/
.ellipsis-num1{ 
	    position:relative;
	    line-height:1.4em;
	    /* 3 times the line-height to show 3 lines */
	    height:4.2em;
	    overflow:hidden;
 }
.ellipsis-num1:after{ 
		content:". . .";
	    position:absolute;
	    bottom:0;
	    right:0;
	    padding: 0 0.6em;
 }

/*多行文字，溢出省略号代替---只适合移动端*/
.ellipsis-num2{ display: -webkit-box; overflow: hidden; white-space:nowrap;text-overflow: ellipsis; word-break: break-all;
	-webkit-box-orient: vertical; -webkit-line-clamp: 3; 
 }



/*清除浮动*/
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{zoom:1;}

/*浮动*/
.fl{ float: left; }
.fr{ float: right; }

input{
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-modify: read-write-plaintext-only;
} 
button{
	-webkit-tap-highlight-color: rgba(255,255,255,0)
}

/*手机端，设计稿750px。量出来多少，除以100，就是多少rem*/
@media screen and (min-width:320px) and (max-width:359px) {
  html {
    font-size: 42.6667px;
  }
}
/*针对iphone4段屏手机*/
@media screen and (min-width:320px) and (max-height:480px) {
  html {
    font-size: 42.6667px;
  }
}
@media screen and (min-width:360px) and (max-width:374px) {
  html {
    font-size: 48px;
  }
}
@media screen and (min-width:375px) and (max-width:383px) {
  html {
    font-size: 50px;
  }
}
@media screen and (min-width:384px) and (max-width:399px) {
  html {
    font-size: 51.2px;
  }
}
@media screen and (min-width:400px) and (max-width:411px) {
  html {
    font-size: 53.3333px;
  }
}
@media screen and (min-width:412px) and (max-width:431px) {
  html {
    font-size: 54.93333px;
  }
}