.table-area{
	width: 9.6rem;
	margin: 0 auto;
	padding: 0.1rem;
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -o-flex;
	border: 1px solid #e1e1e1;
	box-sizing: border-box;
	border-radius: 0.1rem;
}

.table-area span{
	height: 0.8rem;
	line-height: 0.4rem;
	display: block;
	word-break: break-all;
	text-align: color;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	box-sizing: border-box;
}

.table-title{
	width: 2rem;
	flex: 0 0 auto;
	-webkit-flex: 0 0 auto;
	-ms-flex: 0 0 auto;
	-moz-flex: 0 0 auto;
	-o-flex: 0 0 auto;
}
.table-title>span{
	width: 100%;
	text-align: center;
	font-size: 0.2rem;
	color: #666;
}

.table-title span:nth-of-type(odd){
  background:#c7dbff
}

.table-title span:nth-of-type(even){
	background:#e0ebff
}

.table-title span:nth-of-type(1){
	background: #83aefd;
}

.table-content{
	flex:1;
	-webkit-flex:1;
	-ms-flex:1;
	-moz-flex:1;
	-o-flex:1;
	overflow-x: scroll;
}

.table-content span{
	width: 1.5rem;
	line-height: 0.8rem;
	flex: 0 0 auto;
	text-align: center;
	font-size: 0.2rem;
}

.table-content .table-row:nth-of-type(odd) span{
  background:#c7dbff;
}

.table-content .table-row:nth-of-type(even) span{
  background:#e0ebff;
}

.table-content .table-row:nth-of-type(1) span{
	background: #83aefd;
}

.table-row{
	width: 24rem;
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -o-flex;
}

.table-area .table-head{
	color: #fff;
}


.table-area .content-false{
  color: #fd8d3b;
}

.table-area .content-true{
  color: #3b7bfd;
}