#main_location {position: fixed; top: 50%; right:50px; z-index: 9; transform: translateY(-50%);}
#main_location ul li {height: 30px; width: 30px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px;}
#main_location ul li:last-child {margin-bottom:0;}

#main_location ul li a {height: 100%; display: flex; align-items: center; position: relative; width: 100%;}
#main_location ul li a i {transition: all .3s; opacity: 0; display: block; position: absolute; left: -10px; top: 0; width: 30px; height: 30px; border-radius: 50%;
border:1px solid rgba(255,255,255,.5); }
#main_location ul li a span {display: block; width:10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.4); transition: all .3s;}
#main_location ul li a p {position: absolute; text-align: right; font-size:15px; font-weight: 400; color:rgba(255, 255, 255, 1);  top:8px; right:52px; line-height: 1;
transition: all .3s; opacity: 0; letter-spacing: -.3px; white-space: nowrap;}


#main_location ul li a.active i,
#main_location ul li a.active p {opacity: 1; }
#main_location ul li a.active span {background: #fff;}
#main_location.black ul li a i {border-color: #014099;}
#main_location.black ul li a p {color:#014099; }
#main_location.black ul li a span {background:rgba(153,153,153,.4);}
#main_location.black ul li a.active span {background:#014099; }


@media screen and (max-width:1700px) {
	#main_location {right: 20px;}
}

@media screen and (max-width:1599px) {
    #main_location {display: none; }
}
