diff --git a/style.css b/style.css
index 39da591..dfb3ced 100644
--- a/style.css
+++ b/style.css
@@ -315,30 +315,38 @@
   width: 100%;
 }
 
+/* ====== 地図ピン（名前ラベル付き） ====== */
+
 .custom-pin {
-  transform-origin: center bottom;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
-/* ピンの位置調整（長い名前でも中央に揃う） */
-.pin-wrapper {
-  position: relative;
-  left: 50%;
-  transform: translate(-50%, -40px); /* 中央揃えに変更 */
-  text-align: center;
+/* 画像＋名前セット全体 */
+.pin-root {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  transform: translateY(-20px); /* ちょっと上に持ち上げる（お好みで調整可） */
 }
 
-.pin-img {
+.pin-root-img {
   width: 32px;
   height: 32px;
 }
 
-/* 名前ラベル */
-.pin-label {
-  background: white;
-  padding: 3px 6px;
+/* 名前ラベル（はみ出さない版） */
+.pin-root-label {
+  margin-top: 2px;
+  padding: 2px 6px;
   font-size: 12px;
+  background: #ffffff;
   border: 1px solid #ccc;
   border-radius: 6px;
-  white-space: nowrap;
-  margin-top: 2px;
+  max-width: 120px;          /* ← 横に伸びすぎないよう制限 */
+  white-space: nowrap;       /* 改行しない */
+  overflow: hidden;          /* はみ出した部分は隠す */
+  text-overflow: ellipsis;   /* はみ出したとき「…」で省略 */
+  text-align: center;
 }