body{
	background-color: #060b1e;
	color: #fff;
	font-size: 0.63vw;
}
.top{
	width: 100%;
	height: 2.8125vw;
	background: url(../img/top_bg.jpg) no-repeat center;
	background-size: cover;
	text-align: center;
}
.top_title{
	/* padding: 0.417vw 3.416vw;
	display: inline-block;
	background: linear-gradient(45deg,transparent 15px,#102042 0) bottom left,linear-gradient(-45deg,transparent 15px,#102042 0) bottom right,linear-gradient(135deg,transparent 0px,#102042 0) top left,linear-gradient(-135deg,transparent 0px,#102042 0) top right;
	background-size: 50% 50%;
	background-repeat: no-repeat; */
	background: url(../img/top.jpg) no-repeat center;
	background-size: contain;
	width: 24.58vw;
	height: 2.875vw;
	margin: 0 auto;
}
/* .top_title h1{
	font-size: 1.67vw;
	background-image:-webkit-linear-gradient(bottom,#3bc0df,#ffffff); 
	-webkit-background-clip:text; 
	-webkit-text-fill-color:transparent;
	letter-spacing:0.417vw;
} */

.center_con{
	padding: 0 0.58vw;
}
.c_c_left{
	width: 31.625vw;
	box-sizing: border-box;
}

.ec_list{
	text-align: center;
}
.ec_list_title{
	display: inline-block;
	padding: 0.208vw 1.875vw;
	background: linear-gradient(#225ba2, #0f2a55);
	font-size: 1.08vw;
	border: 1px solid #589dd8;
	letter-spacing: 0.17vw;
	position: relative;
	bottom: -0.5vw;
	z-index: 10;
}
.ec_list_title::after{
}
.ec_l_info{
	/* width: 100%;
	background-color: #091b3f;
	padding: 0.83vw 0.3vw;
	background:linear-gradient(45deg,transparent 15px, #091b3f 0);
	border: 1px solid #589dd8; */
	
	clip-path: polygon(
	0 0, calc(100% - 15px) 0,
	100% 0, 100% calc(100% - 15px),
	calc(100% - 15px) 100%, 15px 100%,
	0 calc(100% - 15px),0 0);
	background:
		linear-gradient(-45deg,#589dd8 10px, #091b3f 0) bottom right,
		linear-gradient(45deg,#589dd8 10px, #091b3f 0) bottom left,
		linear-gradient(135deg,transparent 0, #091b3f 0) top left,
		linear-gradient(-135deg,transparent 0,#091b3f 0) top right;
	
	background-size: 50% 51%;

	background-repeat: no-repeat;
	border: solid 2px #589dd8;
}
.ec_l_left{
	width: 16.2vw;
}
.ec_l_left .ec_chart{
	width: 16vw;
	height: 11.42vw;
}
/* 设置滚动条的样式 */
.ec_l_left::-webkit-scrollbar {
	width:0px;
}
/* 滚动槽 */
.ec_l_left::-webkit-scrollbar-track {
-webkit-box-shadow:inset 0 0 4px rgba(2,178,246,1);
border-radius:2px;
}
/* 滚动条滑块 */
.ec_l_left::-webkit-scrollbar-thumb {
border-radius:2px;
background:rgba(2,178,246,0.7);
-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,0.5);
}
.ec_l_left::-webkit-scrollbar-thumb:window-inactive {
background:rgba(2,178,246,0.7);
}

.ec_l_right{
	width: 14vw;
	margin-left: 0.8vw;
}
/* 设置滚动条的样式 */
.ec_l_right::-webkit-scrollbar {
	width:0;
}
/* 滚动槽 */
.ec_l_right::-webkit-scrollbar-track {
-webkit-box-shadow:inset 0 0 4px rgba(2,178,246,1);
border-radius:2px;
}
/* 滚动条滑块 */
.ec_l_right::-webkit-scrollbar-thumb {
border-radius:2px;
background:rgba(2,178,246,0.7);
-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,0.5);
}
.ec_l_right::-webkit-scrollbar-thumb:window-inactive {
background:rgba(2,178,246,0.7);
}
.ec_l_r_list{
	/* border: 1px solid #589dd8; */
	box-shadow:inset 0 0 10px 2px #557cc6;
	padding: 0.08vw 0.41vw;
	margin-bottom: 0.41vw;
	font-size: 0.66vw;
}
.ec_l_r_title{
	/* margin-top: 1.2vw; */
}
.ec_l_r_list .diqu{
	width: 39%;
}
.ec_l_r_list .zaizu{
	width: 30%;
	text-align: center;
}
.ec_l_r_list .kucun{
	width: 30%;
	text-align: center;
}

.ld_r_list{
	width: 6.5vw;
	float: left;
	/* margin-top: 0.45vw; */
}
.ld_r_list:nth-child(2n-1){
	margin-right: 0.25vw;
}
.ld_l_title{
	text-align: center;
	color: #41c0ed;
	text-align: center;
	font-size: 0.75vw;
	margin-bottom: 0.15vw;
}
.ld_l_info{
	overflow: hidden;
	box-shadow:inset 0 0 15px 3px #183a5f;
	border-radius: 0.25vw;
}
.ld_info_list{
	float: left;
	width: 50%;
	text-align: center;
	padding: 0.25vw 0;
	position: relative;
}
.ld_info_title{
	font-size: 0.58vw;
	color: #40a1cb;
	margin-bottom: 0.15vw;
}
.ld_info_num span{
	font-size: 0.75vw;
}
.ld_l_info .ld_info_list:first-child::after{
	content: '';
	position: absolute;
	width: 1px;
	height: 50%;
	right: 0;
	top: 25%;
	border-right: 1px dashed #183869;
}
.ld_l_info .ld_info_list:first-child .ld_info_num{
	color: #80c39a;
}
.ld_l_info .ld_info_list:last-child .ld_info_num{
	color: #fbd449;
}

.c_c_center{
	width: 34.2vw;
}
.c_t_list{
	width: 7.575vw;
	height: 3.325vw;
	background: url(../img/c_top_bg.png) no-repeat center;
	background-size: cover;
	text-align: center;
	margin-right: 0.83vw;
}
.c_t_list:first-child{
	margin-left: 0.41vw;
}
.c_t_list:last-child{
	margin-right: 0;
}
.c_t_title{
	font-size: 0.94vw;
	padding-top: 0.2vw;
}
.c_t_num{
	font-size: 1vw;
	color: #40a1cb;
	font-weight: bolder;
}
.map_box{
	text-align: center;
	margin-top: 3.5vw;
	position: relative;
}

.c_c_right{
	width: 31.625vw;
	box-sizing: border-box;
}
.ec_chart{
	height: 11.42vw;
}

.con_bottom{
	padding: 0 0.58vw;
	margin-top: 0.9vw;
}
.con_bottom .ec_list{
	width: 48.5vw;
}
.con_bottom .ec_chart{
	height: 11.25vw;
}


.nameBox{
	/* position: absolute; */
	
}
.name_b_list{
	position: absolute;
	width: 15%;
	text-align: center;
}
/* .name_b_list:nth-child(1){
	top: 39%;
	left: 0%;
}
.name_b_list:nth-child(2){
	top: 39%;
	left: 13%;
}
.name_b_list:nth-child(3){
	top: 39%;
	left: 24.8%;
}
.name_b_list:nth-child(4){
	top: 39%;
	left: 37%;
}
.name_b_list:nth-child(5){
	top: 83%;
	left: 0%;
}
.name_b_list:nth-child(6){
	top: 83%;
	left: 13%;
}
.name_b_list:nth-child(7){
	top: 83%;
	left: 24.8%;
}
.name_b_list:nth-child(8){
	top: 83%;
	left: 37%;
} */


.name_l_list{
	position: absolute;
	width: 25%;
	text-align: center;
}
/* .name_l_list:nth-child(1){
	top: 43%;
	left: 0.2%;
}
.name_l_list:nth-child(2){
    top: 43%;
    left: 26%;
}
.name_l_list:nth-child(3){
    top: 43%;
    left: 51%;
}
.name_l_list:nth-child(4){
	top: 43%;
	left: 77%;
}
.name_l_list:nth-child(5){
	top: 83%;
	left: 0.2%;
}
.name_l_list:nth-child(6){
	top: 83%;
	left: 26%;
}
.name_l_list:nth-child(7){
	top: 83%;
	left: 51%;
}
.name_l_list:nth-child(8){
	top: 83%;
	left: 77%;
} */



.point {
	width: 10px;
	height: 10px;
	background-color: #ecf422;
	border-radius: 50%;
	position: absolute;
	
}
.point1{
	top: 47%;
	right: 36.5%;
}
.point2{
	top: 45%;
	right: 28%;
}
.point3{
	top: 54.5%;
	right: 25%;
}
.point4{
	top: 53%;
	right: 29%;
}
.point5{
	top: 64%;
	right: 30%;
}
.point6{
	top: 61%;
	right: 42%;
}

/* 设置动画前颜色 */
.point-flicker:after {
	background-color: #ecf422;
}

/* 设置动画后颜色 */
.point-flicker:before {
	background-color: rgba(238, 246, 30, 0.2);
}

/* 设置动画 */
.point-flicker:before,
.point-flicker:after {
	content: '';
	width: 20px;
	height: 20px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -10px;
	margin-top: -10px;
	border-radius: 50%;
	/* CSS3 animation 属性 网址 */
	/* https://www.w3school.com.cn/cssref/pr_animation.asp */
	animation: warn 1.5s ease-out 0s infinite;
}

/* @keyframes 规则用于创建动画。在 @keyframes 中规定某项 CSS 样式，就能创建由当前样式逐渐改为新样式的动画效果。 */
@keyframes warn {
0% {
  transform: scale(0.5);
  opacity: 1;
}

30% {
  opacity: 1;
}

100% {
  transform: scale(1.4);
  opacity: 0;
}
}