﻿@charset "UTF-8";
/*CSS重置*/

html {
	font-size: 40px;
	/*PS: 1px = 0.025rem*/
}
@media only screen and (min-width:320px){html{font-size:34.14px!important}
}
@media only screen and (min-width:325px){html{font-size:34.66px!important}
}
@media only screen and (min-width:330px){html{font-size:35.2px!important}
}
@media only screen and (min-width:335px){html{font-size:35.74px!important}
}
@media only screen and (min-width:340px){html{font-size:36.26px!important}
}
@media only screen and (min-width:345px){html{font-size:36.8px!important}
}
@media only screen and (min-width:350px){html{font-size:37.34px!important}
}
@media only screen and (min-width:355px){html{font-size:37.86px!important}
}
@media only screen and (min-width:360px){html{font-size:38.4px!important}
}
@media only screen and (min-width:365px){html{font-size:38.94px!important}
}
@media only screen and (min-width:370px){html{font-size:39.46px!important}
}
@media only screen and (min-width:375px){html{font-size:40px!important}
}
html,
body{
	width: 100%;
	height: 100%;
	font-family: "Microsoft Yahei", Tahoma, Arial !important;
	-webkit-font-smoothing: antialiased;
}
img {
	width: 100%;
	vertical-align: top;
	-webkit-touch-callout: none;
}
ol,ul,li{
	list-style: none;
}
input {
	outline: 0;
}
*{
	padding: 0;
	margin: 0;
}
button {
	background: none;
	outline: medium;
	cursor: pointer;
	border: none;
}
*,
:after,
:before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
input[type=checkbox],
input[type=radio] {
	cursor: pointer;
	padding: 0;
}
/*正式样式*/
header{
	height: 1rem;
	width: 100%;
	line-height: 1rem;
	text-align: center;
	font-size: .32rem;
	background: #212226;
	color: #efefef;
}
.container {
	background: url(../images/test/img-bg.png) no-repeat center top;
	background-size: cover;
	min-height: 20rem;
}

.container > div.content {
	text-align: center;
}

.container > div.content {
	padding: 8.5rem 0.3rem 0 0.3rem;
}

.container > div.content img {
	max-width: 100%;
	/*height: 8.56rem;*/
}

.footer-tips {
	padding: 0 0.3rem;
	margin-top: 0.25rem;
}

.footer-tips h2 {
	font-size: .36rem;
	color: #ccc;
	padding-bottom: 0.2rem;
}

.footer-tips > div > p {
	font-size: .32rem;
	color: #efefef;
	
}
.footer-tips > div > p:not(:first-child){
	margin-top:0.25rem;
}
.footer-box {
	padding: 0 0.3rem;
}

.footer-box > div > input {
	width: 100%;
	height: .88rem;
	border-radius: .1rem;
	border: none;
	padding: 0 0.25rem;
}

.footer-box > div {
	text-align: center;
}

.footer-box > div > button {
	width: 60%;
	height: .9rem;
	border-radius: .44rem;
	background: #b79058;
	color: #ffffff;
	font-size: .34rem;
}

.content-top {
	width: 100%;
	background: #d2cfcf;
	padding-top: .4rem;
}

.content-top .module-title {
	width: 100%;
	height: 1rem;
	background: url(../images/test/title.png) no-repeat center center;
	background-size: 3.76rem .79rem;
	font-size: .36rem;
	text-align: center;
	line-height: 0.8rem;
	color: #ffffff;
}

.f24 {
	font-size: .24rem;
}

.f26 {
	font-size: .26rem;
}

.f28 {
	font-size: .28rem;
}

.f30 {
	font-size: .3rem;
}

.f32 {
	font-size: .32rem;
}

.f34 {
	font-size: .34rem;
}

.f36 {
	font-size: .36rem;
}
.f38{
	font-size: .38rem;
}
.f40{
	font-size: .4rem;
}

.flex-box {
	display: -webkit-flex;
	/* Safari */
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	margin-top:0.2rem;
}

.flex-cell-1 {
	
}

.flex-cell-2 {
	-moz-flex: 2.0;
	/* Firefox */
	-webkit-flex: 2.0;
	/* Safari and Chrome */
	flex: 2.0;
	margin-left:0.5rem;
	margin-right:0.5rem;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.tcenter {
	text-align: center;
}

.tright {
	text-align: right;
}

.tleft {
	text-align: left;
}

.black-333 {
	color: #333333!important;
}

.black-666 {
	color: #666!important;
}

.stock-detail-list li {
	border-bottom: 1px solid #cccaca;
}

.icon-throw {
	display: inline-block;
	width: .8rem;
	height: .8rem;
	font-size: .3rem;
	border-radius: 50%;
	line-height: 0.65rem;
	text-align: center;
	background: #5eb2f2;
	border: .06rem solid #ffffff;
	font-weight: bold;
	color: #ffffff;
	vertical-align: super;
}

.icon-threw {
	display: inline-block;
	width: .8rem;
	height: .8rem;
	font-size: .3rem;
	border-radius: 50%;
	line-height: 0.65rem;
	text-align: center;
	background: #999999;
	border: .06rem solid #ffffff;
	font-weight: bold;
	color: #ffffff;
	vertical-align:super;
}

.black-444 {
	color: #444444;
}

.gray-777 {
	color: #7777;
}

.red {
	color: #cc3131;
}

.chart-container > div {
	float: left;
}

.clear-both {
	clear: both;
}

.chart-text {
	line-height: 0.5rem;
	padding-top: 0.6rem;
}

.chart-text > div {
	margin-top: 0.15rem;
}

.chart-text > div:first-child {
	margin-top: 0;
}

.top-head img {
	width: .6rem;
	height: .6rem;
	border-radius: 50%;
}

.top-head {
	position: absolute;
	font-size: .18rem;
	color: #666666;
	left: 0.5rem;
	top: 0.2rem;
	/*text-align: center;*/
}

.chat-line {
	color: #444444;
	font-size: .26rem;
}

.chat-list {
	background: #eaeaea;
	border-radius: 0.1rem;
	padding-bottom: 0.3rem;
    padding-top: 0.25rem;
}

.chat-list li {
	position: relative;
	padding-left: 0.8rem;
	padding-right: 0.3rem;
}
.chat-list li:(:not-first){
	margin-top: 0.2rem;
}
.chat-list li .chat-line {
	padding: 0.2rem 0.15rem;
	background: #ffffff;
	display: inline-block;
	vertical-align: super;
	margin-left: 1rem;
	border-radius: .12rem;
	position: relative;
	margin-top: 0.2rem
}

.chat-list li .chat-line:before {
	content: "";
	position: absolute;
	left: -0.1rem;
	top: 0.2rem;
	width: 0;
	height: 0;
	border-top: 0.1rem solid transparent;
	border-right: 0.1rem solid #ffffff;
	border-bottom: 0.1rem solid transparent;
}
.chat-box {
	border-top: 1px solid #e5e5e5;
	padding: 0 0.2rem;
	
}
.chat-box input{
	width: 77%;
	height: .8rem;
	background: #ffffff;
	border: none;
	border-radius: .1rem;
	padding: 0 0.3rem;
}
.chat-box>button{
	margin-left: 3%;
	width: 20%;
	text-align: center;
	height: .8rem;
	line-height: .8rem;
	background: #5eb2f2;
	color: #fff;
	border-radius:.1rem;
}
.chat-container{
   background: #eaeaea;
	padding-bottom: .3rem;
}
.rankings-container{
  margin-top: .2rem;
	padding-top: .4rem;
}
.module-title{
    width: 100%;
    height: 1rem;
    background: url(../images/test/title.png) no-repeat center center;
    background-size: 3.76rem .79rem;
    font-size: .36rem;
    text-align: center;
    line-height: 0.8rem;
    color: #ffffff;
}
.rankings-container{
	background: #d2cfcf;
	padding-bottom: 0.2rem;
}
.rankings-time{
	color: #999999;
	font-size: .2rem;
	text-align: center;
	margin-top: 0.1rem;
}
.blue{
	color:#5eb2f2!important;
}
.gray-999{
	color:#999999;
}
.rankings-list{
	padding: 0 0.3rem;
	margin-top: 0.2rem;
}
.rankings-list>li{
	line-height: 0.9rem;
	padding: 0 0.3rem;
}
.rankings-list>li:not(:first-child){
	border-top: 1px solid #cfcccc;
}
.bg-white{
	background: #ffffff;
	border-radius: .1rem;
}
.inline-block{
    display: inline-block;
	vertical-align: bottom;
}
.ml40{
	margin-left: .4rem;
}
.ml30{
	margin-left: 1rem;
}
.ml10{
	margin-left: .1rem;
}
.rankings-head img{
	width: .5rem;
	height: .5rem;
	border-radius: 50%;
	vertical-align: -15%;
	margin-right: 0.1rem;
}
.flex{
	display: flex;
	
}
.num{
	padding-left: 0.25rem;
	color: #666666;
	display: inline-block;
	width: 0.6rem;
}
.order-num{
	
	background: url(../images/test/red-up.png) no-repeat left center;
	background-size: .23rem .38rem;
}

.order-numGreen{
	
	background: url(../images/test/green-downd.png) no-repeat left center;
	background-size: .23rem .38rem;
}

.more-btn{
	width: 100%;
	height: .8rem;
	background: url(../images/test/pull-down.png) no-repeat center center;
	background-size: .41rem .26rem;
}
.font-yellow,.font-red,.font-blue{
	position: relative;
}
.font-yellow:before{
	content: "";
	display: inline-block;
	width: .12rem;
	height: .12rem;
	background: #ecb634;
	border-radius: 50%;
	position: absolute;
	left: -0.25rem;
	top: 35%;
}
.font-red:before{
	content: "";
	display: inline-block;
	width: .12rem;
	height: .12rem;
	background: #ef6898;
	border-radius: 50%;
	position: absolute;
	left: -0.25rem;
	top: 35%;
}
.font-blue:before{
	content: "";
	display: inline-block;
	width: .12rem;
	height: .12rem;
	background: #5eb2f2;
	border-radius: 50%;
	position: absolute;
	left: -0.25rem;
	top: 35%;
}

 @media only screen and (min-width: 420px){
               body{margin:0 auto;width:15rem;}

        }

 .green {
    color: #01a81c;
}

 .rules-pop{
	width: 12rem;
	background: #fff;
	border-radius: 6px;
	position: absolute;
    left: 50%; 
    top: 50%;
    transform: translate(-50%, -50%); /* 50%为自身尺寸的一半 */
    -webkit-transform: translate(-50%, -50%);
	z-index: 100000;
}
.rules-top{
	padding: 0.35rem 0 0 0;
	position: relative;
} 
.rules-content{
	padding:0.35rem 0.625rem 0.625rem 0.625rem;
}
.rules-content p{
	line-height: 0.55rem;
}
.rules-content p:not(:first-child){
	margin-top: 0.3rem;
}
.icon-closePop{
	display: inline-block;
	width: 1rem;
	height: 1rem;
	background: url(../images/test/icon-close.png) no-repeat center center;
	background-size: .4rem .4rem;
	position: absolute;
	right: 0;
	top: 0;
}
.z_mask{
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 1);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	opacity: 0.302;
	/*display: none;*/

}
.module-title{
	position: relative;
}
.module-title .rule-link{
	color: #777777;
	position: absolute;
	right: 0.25rem;
	top: 0.1rem;
	
}