html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	/*-webkit-tap-highlight-color: transparent*/
}
.clearfix:before, .clearfix:after {
    display: table;
    line-height: 0;
    content: "";
}
.clearfix:after {
    clear: both;
}
@font-face {
	font-family: 'PingFang';
	src: url(../font/pingfang.ttf)
}

@font-face {
	font-family: 'SourceHanSerifCN';
	src: url(../font/DIN Alternate Bold.ttf)
	/*src: url(../font/DIN-RegularAlternate.otf)*/
}

body {
	color: #fff;
	background: rgba(0, 34, 67, 1);
	background-size: 100% 100%;
	font-family: 'SourceHanSerifCN';
	font-size: 15px;
	height: 100vh;
}

.title {
	text-align: center;
	position: relative;
}
.title_right{
	position: absolute;
	right: 10px;
	top: 50%;
	margin-top: -36px;
	text-align: right;
}
.title_right div{
	position: absolute;
    right: 10px;
	top: 0;
	width: 1.6rem;
}
.title_right div img{
	float: right;
	width: 1.6rem;
}
.title_right div span{
	position: absolute;
    /* right: 10px; */
    /* top: 39px; */
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 600;
    color: #00C9E7;
    width: 1.6rem;
    margin: 25px 0;
    height: 40px;
    line-height: 40px;
    text-align: center;
}
.title_right div span a{
	color: #00C9E7;
    font-size: 14px;
    font-weight: 600;
    height: 40px;
    display: inline-block;
}
.title_left{
	position: absolute;
	left: 40px;
	top: 50%;
	margin-top: -23px;
	text-align: right;
}
.title_left div{
	font-size: 18px;
	color: rgba(0, 221, 252, 1);
}
.title_left span{
	color: #fff;
	padding: 0 5px;
}
.title p{
	font-size: 14px;
}
.title img {
	width: 66%;
	margin: 25px 0;
}

.c_title {
	/*font-weight: bold;*/
	color: #D8F1FF;
	/*font-size: 24px;*/
	padding-left: 0.15rem;
	font-family: 'PingFang';
	background: url(../img/titlebj.png) no-repeat;
	background-size: contain;
	background-position: left center;
	margin: 0 10px;
	font-size: 0.24rem;
	height: 30px;
	line-height: 30px;
}
.fadein{
	-webkit-transition: all 1.5s;  
	-moz-transition: all 1.5s;  
	-ms-transition: all 1.5s;  
	-o-transition: all 1.5s;  
	transition: all 1.5s;  
	opacity: 1;
}
.fadeout{
	-webkit-transition: all 1.5s;  
	-moz-transition: all 1.5s;  
	-ms-transition: all 1.5s;  
	-o-transition: all 1.5s;  
	transition: all 1.5s;  
	opacity: .5;
}
.border_c {
	margin: 0 0 16px 0;
	padding: 15px 15px 0 15px;
	/* border: 1px solid rgba(0, 109, 202, 1); */
}

.data-box1,
.data-box2,
.data-box3,
.data-box4,
.data-box5 {
	position: relative;
	background: url(../img/boxbj.png) no-repeat;
	background-size: cover;
}

.data-box3 ul {
	background: url(../img/textbj.png) no-repeat;
	background-size: contain;
	background-position: center center;
}

.data-box1 .item {
	width: 33%;
	height: 145px;
	float: left;
	text-align: center;
	margin-bottom: 2px;
	background: url(../img/left_icon1.png) no-repeat;
	background-size: contain;
	background-position: center bottom;
}

.data-box1 .item h2 {
	font-size: 0.4rem;
	color: #00DDFC;
}
.data-box1 .item p{
	font-size: .15rem;
	font-family: Lantinghei SC;
	font-weight: 600;
	color: #FFFFFF;
}

.data-box3 ul {
	padding-left: 0.23rem;
	line-height: 28px;
	height: 194px;
	overflow: hidden;
	margin: 10px 0;
}

.itembox .item {
	width: 20%;
	float: left;
	text-align: center;
	background: url(../img/middle_icon1.png) no-repeat;
	background-size: 98% 100%;
	margin-bottom: 10px;
	background-position: center center;
	height: 84px;
	padding: 0 5px;
	display: table;
}

.itembox .item div {
	display: table-cell;
   text-align: center;
   vertical-align: middle;
}

.itembox .item p {
	margin-bottom: 10px;
}

.itembox .item h2 {
	font-size: 0.4rem;
	line-height: .3rem;
}

.color1 {
	color: rgba(0, 221, 252, 1);
}

.color2 {
	color: rgba(0, 240, 157, 1);
}

.color3 {
	color: rgba(0, 221, 252, 1);
}

.color4 {
	color: rgba(255, 200, 51, 1);
}

.color5 {
	color: rgba(255, 200, 51, 1);
}

.color6 {
	color: rgba(0, 221, 252, 1);
}

.color7 {
	color: rgba(0, 240, 157, 1);
}

.color8 {
	color: rgba(255, 200, 51, 1);
}

.data-box1 {
	height: 120px;
}
.data-box3 {
	height: 254px;
}

.data-box4 {
	height: 424px;
}
.data-box4 .itembox1,
.data-box4 .itembox2 {
	padding: 25px 0px;
}

.data-box4 .itembox1 .item {
	width: 25%;
	float: left;
	text-align: center;
	height: 100px;
}
.data-box4 .itembox1 .item > div{
	background: url(../img/sj.png) no-repeat;
	background-size: 70% 100%;
	background-position: center center;
	height: 90%;
	position: relative;
}
.data-box4 .itembox1 .item > div img{
	width: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.data-box4 .itembox1 .item h2{
	font-size: 0.34rem;
	color: rgba(255, 200, 51, 1);
}
.data-box4 .itembox2{
	height: 2.5rem;
	position: relative;
}
.data-box4 .itembox2 .item h2 {
	color: #FFFFFF;
	font-size: .24rem;
	font-family: DIN Alternate;
	font-weight: bold;
}
.data-box4 .itembox2 .cen{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.data-box4 .itembox2 .item1{
	position: absolute;
	left: .4rem;
    top: .3rem;
}
.data-box4 .itembox2 .item2{
	position: absolute;
    left: .5rem;
    top: .9rem;
}
.data-box4 .itembox2 .item3{
    position: absolute;
    left: .3rem;
    top: 1.6rem;
}
.data-box4 .itembox2 .item4{
	position: absolute;
	right: -.3rem;
    top: .6rem;
}
.data-box4 .itembox2 .item5{
	position: absolute;
	right: -.3rem;
    top: 1.4rem;
}
.data-box4 .itembox1 .item h2 i{
	font-style: normal;
	font-size: .14rem;
	font-family: PingFang SC;
	font-weight: 400;
	color: #FFFFFF;
}

.hr {
	height: 2px;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(101, 221, 209, 0.8), rgba(255, 255, 255, 0));
	opacity: 0.7;
}

@keyframes rotating {
	from {
		transform: rotate(0);
	}
	to {
		transform: rotate(360deg);
	}
}

.data-box4 .itembox1 .item img {
	width: 60%;
}

.card-flipped img {
	animation: rotating 3s linear infinite;
}

.data-box4 .itembox2 .item {
	width: 2rem;
}
.data-box4 .itembox1 .item1 {
	width: 25%;
	float: left;
	text-align: center;
}
.data-box4 .itembox1 .item1 p {
	font-size: .15rem;
	font-family: Lantinghei SC;
	font-weight: 600;
	color: #00DDFC;
}

.data-box4 .itembox2 .item p {
	font-size: .13rem;
	font-family: Lantinghei SC;
	font-weight: 600;
	color: #00DDFC;
}

.data-box4 .itembox2 .item img {
	width: 75%;
}

.topL {
	width: 20px;
	height: 20px;
	border-top-width: 2px;
	border-top-color:rgba(0, 240, 157, 1);
	border-top-style: solid;
	border-left-width: 2px;
	border-left-color:rgba(0, 240, 157, 1);
	border-left-style: solid;
	position: absolute;
	top: -2px;
	left: -2px;
}

.topR {
	width: 20px;
	height: 20px;
	border-top-width: 2px;
	border-top-color: rgba(0, 240, 157, 1);
	border-top-style: solid;
	border-right-width: 2px;
	border-right-color: rgba(0, 240, 157, 1);
	border-right-style: solid;
	position: absolute;
	top: -2px;
	right: -2px;
}

.bottomL {
	width: 20px;
	height: 20px;
	border-bottom-width: 2px;
	border-bottom-color: rgba(0, 240, 157, 1);
	border-bottom-style: solid;
	border-left-width: 2px;
	border-left-color: rgba(0, 240, 157, 1);
	border-left-style: solid;
	position: absolute;
	bottom: -2px;
	left: -2px;
}

.bottomR {
	width: 20px;
	height: 20px;
	border-bottom-width: 2px;
	border-bottom-color: rgba(0, 240, 157, 1);
	border-bottom-style: solid;
	border-right-width: 2px;
	border-right-color: rgba(0, 240, 157, 1);
	border-right-style: solid;
	position: absolute;
	bottom: -2px;
	right: -2px;
}

.map-box {
	width: 100%;
	height: 620px;
	position: relative;
}

.tig {
	/* width: 178px; */
	background: rgba(67, 225, 219, .9);
	border-radius: 10px;
	color: rgba(17, 50, 125, 1);
	padding: 15px;
	font-size: 16px;
	line-height: 26px;
	position: relative;
	top: -20px;
}

#triangle-down {
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 15px solid rgba(67, 225, 219, .9);
	position: absolute;
	bottom: -14px;
	left: 47%;
}

.tig p {
	margin: 0;
}

.tig span {
	float: right;
}

.rightlist {
	width: 260px;
}

.rightlist div {
	background: rgba(101, 221, 209, .3);
	position: relative;
	padding: 10px 10px 15px;
	margin-left: 3px;
}

.rightlist h2 {
	font-weight: normal;
	font-size: 16px;
	margin-bottom: 20px;
	height: 44px;
	line-height: 50px;
	background: url(../img/map_title.png) no-repeat;
	background-size: 100% 100%;
	padding-left: .25rem;
}

.rightlist div p {
	font-size: 15px;
	padding: 5px 0 5px .1rem;
	margin-top: 5px;
}

.rightlist div p span {
	background: rgba(0, 0, 0, .5);
	padding: 5px;
	display: inline-block;
	float: right;
	text-align: center;
	width: 80px;
}

.bottom {
	position: fixed;
	bottom: 2px;
	left: 2px;
	right: 3px;
	text-align: center;
	background: rgba(0, 0, 0, 0.7);
	height: 88px;
	width: calc(100% - 5px);
	display: table;
	table-layout: fixed;
}

.bottom div {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

.bottom div h2 {
	font-size: .32rem;
	color: rgba(0, 219, 249, 1);
	font-weight: normal;
}

.bottom div p {
	color: #fff;
	font-size: .15rem;
}

.map {
	height: 620px;
	background: url(../img/map_bj.png) no-repeat;
	background-size: 100% 100%;
}

.qp_btn{
	width: 21px;
	height: 20px;
	background: url(../img/f11.png) no-repeat;
	position: absolute;
	right: 10px;
    top: 50%;
	margin-top: -10px;
    display: none;
    text-indent: -9999px;
}

/*.map_bj {
	position: fixed;
	top: 0;
	bottom: 88px;
	left: 0;
	right: 310px;
	z-index: 111;
}

@media (max-width: 1400px) {
	.map_bj {
		display: none;
	}
}*/

.area_before{
	display: inline-block;
}

.select_box {
	width: 40%; 
	position:relative; 
    height: 30px;
    background: rgba(0, 101, 149, 1);
    border: 1px solid rgba(0, 101, 149, 1);
    outline: none;
	color: #fff;
	font-size: 14px;
	float: left;
	margin: 0 15px;
}
.select_box input {
	cursor:pointer; 
	display:block; 
	line-height:30px; 
	width:100%; 
	height:30px; 
	overflow:hidden;
    background: rgba(0, 101, 149, 1);
    border: 1px solid rgba(0, 101, 149, 1);
	padding-right:20px; 
	padding-left:10px;
	color: #fff;
	outline: none;
	background-image: url('../img/down.png');
	background-position: right;
	background-repeat: no-repeat;
	background-size: 15px 15px;
}
.select_box ul {
	width:180px; 
	position:absolute; 
	left:0; 
	top:30px; 
	border:1px solid rgba(0, 0, 0, .7); 
	overflow: hidden;
	display:none; 
	background:rgba(0, 0, 0, .7);
	z-index: 1;
}
.select_box ul li {
	display:block;
	height:30px;
	overflow:hidden;
	line-height:30px;
	padding-left:5px;
	width:100%;
	cursor:pointer;
}
.hover {
	background:rgba(71, 143, 228, 1);
}

.country{
	position: absolute;
    right: 300px;
    top: 0;
	top: 50%;
	width: 200px;
    margin-top: -35px;
	text-align: right;
	cursor: pointer;
}
.country .screen span{
	margin: 25px 0;
	display: block;
	float: left;
}
.country .screen img{
	width: 20px;
	height: 20px;
	margin-left: 10px;
	float: left;
}
.country-select{
	position:absolute; 
	left: -100px; 
	top:50px; 
	border:1px solid rgba(0, 101, 149, 1); 
	overflow: hidden;
	display:none; 
	background:rgba(0, 0, 0, .9);
	z-index: 1;
	padding: 10px;
}
.country-select .top{
	display: flex;
	margin-bottom: 20px;
}
.country-select .top input{
	width: 300px;
	height: 30px;
    background: rgba(0, 101, 149, 1);
	border: 1px solid rgba(0, 101, 149, 1);
	color: #fff;
	outline: none;
}
.country-select .top input::-webkit-input-placeholder {
	color: #fafafa;
	font-size: 12px;
}
.country-select .top .text{
	padding-left: 10px
}
.country-select .top .button{
	width: 50px;
	margin-left: 10px;
	cursor: pointer;
}
.btn_qd {
    width: 64px;
    height: 30px;
    line-height: 30px;
    float: right;
    margin-left: 5px;
    border-radius: 3px;
    border: 0px;
    background-color: rgba(0, 101, 149, 1);
    color: #fff;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
    user-select: none;
}



/* select css */

.select2-drop {
    background: transparent;
    color: #0085ff;
}

.select2-results .select2-highlighted {
    background: #74fff7;
}

.select2-search input {
    display: none;
}

.select2-search {
    z-index: -10000;
}

.select2-container .select2-choice .select2-arrow {
    background: transparent;
    border-left: 1px solid #0085ff;
}

.select2-container .select2-choice {
    border: 1px solid #0085ff;
    color: #0085ff;
    background: transparent;
}

.select2-drop-mask {
    background: transparent;
}

/* .select2-container .select2-choice .select2-arrow b {
    background: url('../images/select2.png') no-repeat 0 1px;
} */

.select2-results .select2-highlighted {
    color: #0085ff;
}

.select2-selection,
.select2-container,
.select2-container--default .select2-selection--single {
    background: transparent;
    border: 1px solid #00d3e3;
    outline: none;
}

.select2-container {
    margin-left: 5px;
    float: left;
    border: none;
    outline: none;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #00d3e3;
	outline: none;
	text-align: left;
}

.select2-dropdown,
.select2-dropdown--below {
    background: #002767;
    border: 1px solid #00d3e3;
    color: #00d3e3;
}

.select2-container--default .select2-results>.select2-results__options .select2-results__option--highlighted {
    background-color: #00d3e3;
}