@charset "utf-8";
/* CSS Document */

@import url(../Scripts/mapplic/css/map.css);
@import url(../Scripts/mapplic/mapplic/mapplic.css);

#cityInfo a.btn_detail{ display:inline-block; color:#fff; background:#209ec7; border-radius:6px; padding:10px 30px; margin-top:15px; transition:all 0.4s ease;}
#cityInfo a.btn_detail:hover{ opacity:0.8;}

.mapBox{ float:left; width:60%; min-height:500px;}
.bg_map{ width:100%; min-height:500px; position:relative; z-index:1;/* top:-80px;*/}
.bg_map:after{ width:100%; min-height:500px; content:""; position:absolute; left:0; top:-10px; background:url(../images/svg_map/bg_map.png) no-repeat left bottom; background-size: contain; z-index:-1; opacity:0.5;}

.mapBox .hover{ opacity:0; transition:all 0.4s ease;}
.mapBox text{ opacity:0; transition: all 0.4s ease;}
.mapBox path, .mapBox polygon { transition: all 0.4s ease;}
/*
.out:hover .hover{ opacity:1;}
*/
.mapBox .out:hover text{ opacity:1;}



.mapBox .out.current path,
.mapBox .out.current polygon
{ fill:#00aad0 !important; }

.mapBox .out:hover path,
.mapBox .out:hover polygon
{ fill:#00aad0 !important;}


.mapBox .out.current text{ opacity:1;}

.mapBox .out .txt{ display:none;}

.mapBox .markPin{ display:none;}


@media (max-width:640px){
.mapBox{ display:none;}
.mapBoxSearch .ContentsBox .rightBox p.ex{ display:none;}
#cityInfo a.btn_detail{ display:none;}
}