diff --git a/hwe/css/map.css b/hwe/css/map.css
index 466bf988..87177552 100644
--- a/hwe/css/map.css
+++ b/hwe/css/map.css
@@ -94,6 +94,15 @@
     background:transparent;
 }
 
+.world_map .city_detail_name{
+    background-color:rgba(0,0,0,0.5);
+    font-size:10px;
+    position:absolute;
+    white-space:nowrap;
+    left:70%;
+    bottom:-10px;
+    color:white;
+}
 
 .city_base{
     position:absolute;
@@ -338,6 +347,8 @@
 
 /* Basic */
 
+
+
 .world_map.map_basic .city_filler{
     position:absolute;
     width:100%;
diff --git a/hwe/js/map.js b/hwe/js/map.js
index 59219ec2..0fc6dcab 100644
--- a/hwe/js/map.js
+++ b/hwe/js/map.js
@@ -276,6 +276,9 @@ function reloadWorldMap(option){
                 }
                 $imgObj.append($flagObj);
             }
+
+            var $nameObj = $('<span class="city_detail_name">{0}</span>'.format(city.name));
+            $imgObj.append($nameObj);
          
 
             $map_body.append($cityObj);
@@ -336,6 +339,8 @@ function reloadWorldMap(option){
                 $imgObj.append($capitalObj);
             }
 
+            var $nameObj = $('<span class="city_detail_name">{0}</span>'.format(city.name));
+            $imgObj.append($nameObj);
 
             $map_body.append($cityObj);
         });