@charset "utf-8";
body { background-color:#2E2E2E;}
.datav-layout { /*position: fixed; top:75px; left: 15px; right:15px;*/ margin:0 15px 0; min-width: 1440px;}

.datav-top { height: 100px; overflow: hidden; background: #0A1012; position: relative;}
.datav-top .toptitle { width:400px; color: #fff; text-align: center; margin: 0 auto; padding-top: 10px;}
.datav-top .toptitle h2 {  position: relative; }
.datav-top .toptitle h2 span { width:400px; position:absolute; z-index: 1; font-size:24px; background: #0A1012; display: block; }

.datav-top .m-selectbox { position: absolute; z-index:999; top:50px; right: 20px;}
/*.datav-top .m-selectbox .m-select .dropdown-toggle { background: transparent;}*/
/*.datav-top .m-selectbox .m-select .option { background: rgba(0, 0, 0, 1);}*/
.datav-top .m-selectbox select {color:#3f8cff;border:solid 1px #fff;padding:2px 5px;min-width:80px;appearance:none;-moz-appearance:none;-webkit-appearance:none;padding-right:14px;background:url("../images/arrow.png") no-repeat scroll right center transparent;}

.datav-top .toptitle h2::after { position:absolute; z-index: 0; width:1068px; left: -334px; top:18px; display: block;  content:''; border-top:2px solid #0B3B51;}
.datav-top .toptitle p { font-size: 12px; padding-top:30px;}
.datav-top .topimg { position: absolute; top:-120px; z-index: 0; height:400px; left: 50%; margin-left: -355px;}
.datav-top .topimg img { height:400px; width: auto; display: block; margin: 0 auto;}
.datav-main { position: relative; flex: 1; margin-top: 15px; min-height:600px; min-width: 1440px;}
.datav-left { position: absolute; width:600px; left: 0; top:0; bottom: 0; background: #0A1012;}
.datav-right { position: absolute; width:140px; right: 0; top:0; bottom: 0; background: #0A1012;}
.datav-bottom { height: 150px; overflow: visible; background: #000; margin-top: 15px;}
.datav-center { position: absolute; left:615px; top:0; bottom: 0; right:155px; background:#033447;}

.m-datatitle { font-size: 16px; color: #fff; padding:10px;}
.m-leftchartbox { padding: 0 10px 10px;}
.m-leftchart1 { width: 25%; text-align: center; height: 120px;}
.m-leftchart2 { width: 25%; text-align: center; height: 120px;}
.m-leftchart3 { width:50%; text-align: center; height: 120px;}
.m-leftchart4 {  text-align: center; height: 200px;}
.m-leftchart5 { width:45%; text-align: center; height: 240px;}
.m-leftchart6 { width: 55%; text-align: center; height: 240px;}
.m-lchartt { color: #fff; font-size: 12px;}
.m-lchartt strong { font-weight: 400; font-size: 14px;}
.m-lchartt strong span { margin: 0 5px; color:#FF7500;}

.m-rightchart { background:#082735; margin: 10px 10px 5px;}
.m-rightchart dt { background: #064864; font-size: 12px; color: #fff; padding: 0 3px;}
.m-rightchart dd { width: 50%; float: left; font-size: 10px; color: rgba(255, 255, 255, 0.8); padding: 3px; box-sizing: border-box;}
.m-rightchart dd span { display: block; font-size: 14px;}
.m-rightchart dd span { color:#5BE6EB;}
.m-rightchart dd:last-child span { color:#D1660A;}

.m-blchartbox { width:60%; min-width: 864px; box-sizing: border-box; display: flex;}
.m-brchartbox { width:40%;}
.m-blchart { box-sizing: border-box; width: 25%; margin-right: 5px; background: #1B1E20; height: 150px; flex:1;}
.m-blchart .m-blchartinfo { color: rgba(255, 255, 255, 0.8); padding:5px 10px;}
.m-blchart .m-blchartinfo span { color: #fff; font-size: 14px;}
.m-blchart .m-blchartinfo span strong { margin: 0 5px; color:#03ADE6; font-size: 16px;}

.m-brchart1 { width:60%;}
.m-brchart2 { width: 40%;}