.flex {
	width: 100%;
	padding: 0 20px;
	box-sizing: border-box;
	display: flex;
	justify-content: space-around;
	
}

.flex div {
	/* background: red; */
}

.flex .flexLeft {
	width: 26%;
}

.flex .flexLeft .top{
	width: 100%;
	background: url(../img/flt.png);
	background-size: 100% 100%;
	padding: 20px;
	box-sizing: border-box;
	margin: 20px 0 0;
}
.bg{
	width: 100%;
	background: url(../img/001.png);
	background-size: 100% 100%;
		padding: 10px;
		box-sizing: border-box;
}
.flex  .flexLeftTop,
.flex .flexLeftBottom {
	width: 48%;
	background: url(../img/001.png);
	background-size: 100% 100%;
	padding: 10px 0;
	box-sizing: border-box;
	margin: 10px 0;
	float: left;
	
}
.flex  .flexLeftTop{
	margin-right: 4%;
}
.Titile {
	width: 100%;
	height: 50px;
	background: url(../img/Title.png);
	background-size: 100% 100%;
	color: #00cdff;
	padding-left: 20px;
	box-sizing: border-box;
	line-height: 50px;
	font-size: 25px;

}
.smTitle{
	width: 100%;
	height: 50px;
	color: #00cdff;
	padding-left: 20px;
	box-sizing: border-box;
	line-height: 50px;
	font-size: 25px;
}
 #flexLeftPie {
	width: 100%;
	height: 250px;
}

.flex .flexLeft .flexLeftTop .flexLeftTopList {
	list-style: none;
	width: 100%;
	padding: 0 20px;
	box-sizing: border-box;
	overflow: hidden;
}

.flex .flexLeft .flexLeftTop .flexLeftTopList li {
	overflow: hidden;
	margin-bottom: 10px;
}

.flex .flexLeft .flexLeftTop .flexLeftTopList li img {
	width: 40px;
	height: 40px;
	float: left;
}

.flex .flexLeft .flexLeftTop .flexLeftTopList li div {
	width: 80%;
	float: right;
	display: flex;
	justify-content: space-between;
	color: white;
	font-size: 20px;
	line-height: 40px;
	border: 1px solid #626c8a;
	padding: 0 10px;
}

#flexLeftBar {
	width: 100%;
	height: 250px;
}

.flex .flexCenter {
	width: 42%;
	/* background: url(../img/center.png); */
	/* background-size: 100% 100%; */
	padding: 20px;
	height: 900px;
	box-sizing: border-box;
	margin: 20px 0;
	overflow: hidden;
}

.flex .flexCenter .top {
	width: 100%;
	display: flex;
	justify-content: space-between;
	/* padding: 20px; */
	margin-bottom: 20px;
	box-sizing: border-box;
}

.flex .flexCenter .top div {
	width: 30%;
	background: url(../img/centerTop.png);
	background-size: 100% 100%;
	min-height: 80px;
	padding: 20px 0;
	box-sizing: border-box;
	color: white;
	font-size: 18px;
	text-align: center;
	line-height: 30px;
}

.flex .flexCenter .top div:nth-child(1) p:nth-child(2) {
	color: #01bdfd;
	font-size: 20px;
	font-weight: 600;
}

.flex .flexCenter .top div:nth-child(2) p:nth-child(2) {
	color: #954eff;
	font-size: 20px;
	font-weight: 600;
}

.flex .flexCenter .top div:nth-child(3) p:nth-child(2) {
	color: #e2bb07;
	font-size: 20px;
	font-weight: 600;
}

.flex .flexCenter #map {
	width: 100%;
	height: 280px;
}

.flex .flexCenter .gdp {
	width: 100%;
	display: flex;
	justify-content: space-between;
	
}

.flex .flexCenter .gdp div {
	text-align: center;
	line-height: 30px;
	color: white;
}

.flex .flexCenter .gdp div>span {
	display: inline-block;
	width: 100%;
	margin-bottom: 10px;
}

.flex .flexCenter .gdp div .big {
	font-size: 25px;
	font-weight: 600;
}

.flex .flexCenter .gdp .blue {
	color: #08fcff;
margin-top: 30px;
}

.flex .flexCenter .gdp .border {
	width: 40px;

	border: 1px solid #08FCFF;
	background: #0471a9;

}

.flex .flexCenter .gdp .blue .price {
	font-size: 25px;
	font-weight: 600;
}

.flex .flexCenter .gdp .blue .small {
	font-size: 14px;
}
.flex .flexCenter .bottom {
	width: 80%;
	margin: 0 auto;
display: flex;justify-content: space-between;
}
.flex .flexCenter .bottom ul {
	width: 80%;
}

.flex .flexCenter .bottom .jiao {
	display: inline-block;
	width: 20px;
	height: 20px;

}
	
.flex .flexCenter .bottom ul{
	width: 80%;
	list-style: none;
	display: flex;
	justify-content: space-between;
	color: #a5aadc;
	border-top: 1px solid #00CDFF;
	padding: 5px 0 0 0;
}
.flex .flexCenter .bottom ul li {
}
.flex .flexCenter .bottom ul li .dot{
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #00CDFF;transform: translate(27px,-18px);
	opacity: 0;
	
}
.flex .flexCenter .bottom ul li .dot.active{
	opacity: 1;
}
.flex .flexRight {
	width: 26%;
}
.flex .flexRight .top,.flex .flexRight .bottom{
	width: 100%;
	background: url(../img/flt.png);
	background-size: 100% 100%;
	margin: 20px 0 0;
	padding: 20px;
	box-sizing: border-box;
}
.flex .flexRight .wrap,.flex .flexLeft .wrap{
	/* height: 350px;
	overflow: hidden; */
}
.flex .flexRight .wrap_content,.flex .flexLeft .wrap_content{
	/* height: 400px; */
	overflow: hidden;
}

.flex .flexRight .top li,.flex .flexLeft .top li{
	padding: 5px;
	color: white;
	font-size: 20px;
	display: flex;
	justify-content: space-between;
	margin: 15px 0;
	border: 1px solid #626c8a;
	line-height: 40px;
	padding:15px;
}
.flex .flexRight .top li:hover,.flex .flexLeft .top li:hover{
	cursor: pointer;
}
.flex .flexRight .top li .border,.flex .flexLeft .top li .border{
	background: #00CDFF;
	padding: 0 3px;
	margin-right: 5px;
	font-weight: 600;
	
}
.flex .flexRight .bottom{
	background: url(../img/frame.png);
	background-size: 100% 100%;
	padding: 40px;
	}
	.flex .flexRight .bottom .cxhj{
		width: 100%;
	}
	.flex .flexRight .bottom .cxhj>div{
		overflow: hidden;
		margin:20px 0;
	}
	.flex .flexRight .bottom .cxhj .name{
		width: 80px;
		font-size: 20px;
		color: white;
		float: left;
	}
	.flex .flexRight .bottom .cxhj .desc{
		width: 70%;
		background: url(../img/rb.png);
		line-height: 48px;
		background-size: 100% 100%;
		font-size: 20px;
		color: #00CDFF;
		font-weight: 600;
		float: right;
		padding-left: 80px;
		box-sizing: border-box;
	}
	.flex .flexRight .bottom .cxhj  .small{
		font-size: 14px;
	}
.flex .flexLeft .top li{
	margin: 10px 0;
	line-height: 24px;
	}