diff --git a/button.css b/button.css
index cc2f60c..ad7f4b4 100644
--- a/button.css
+++ b/button.css
@@ -1,38 +1,45 @@
 body {
-            margin: 0;
-            overflow: hidden;
-        }
-        #WebGL-output {
-            width: 80vw; /* 80%の幅 */
-            height: 100vh; /* 高さは全体 */
-            position: absolute;
-            top: 0;
-            left: 0;
-        }
-        #overlay {
-            width: 20vw; /* 20%の幅 */
-            height: 100vh; /* 高さは全体 */
-            position: absolute;
-            top: 0;
-            right: 0;
-            background-color: rgba(255, 255, 255, 0); /* 透明 */
-            z-index: 1; /* WebGL出力の上に配置 */
-        }
-        #myCircleButton {
-            background-color: #4CAF50; /* ボタンの背景色 */
-            color: white; /* テキスト色 */
-            border: none; /* 枠線なし */
-            width: 120px; /* 幅を2倍に */
-            height: 120px; /* 高さを2倍に */
-            border-radius: 50%; /* 丸くする */
-            font-size: 24px; /* フォントサイズを調整 */
-            cursor: pointer; /* ポインタカーソル */
-            position: absolute; /* 位置を絶対指定 */
-            bottom: 20px; /* 下からの位置 */
-            right: 20px; /* 右からの位置 */
-            display: flex; /* フレックスボックス */
-            justify-content: center; /* 中央揃え */
-            align-items: center; /* 中央揃え */
-            text-align: center; /* テキストを中央揃え */
-            padding: 0; /* 内側の余白をゼロに */
-        }
+    margin: 0;
+    overflow: hidden;
+}
+
+#WebGL-output {
+    width: 80vw; /* 80%の幅 */
+    height: 100vh; /* 高さは全体 */
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+#overlay {
+    width: 20vw; /* 20%の幅 */
+    height: 100vh; /* 高さは全体 */
+    position: absolute;
+    top: 0;
+    right: 0;
+    background-color: rgba(255, 255, 255, 0); /* 透明 */
+    z-index: 1; /* WebGL出力の上に配置 */
+}
+
+#myCircleButton {
+    background-color: #FFC0CB; /* 薄ピンク色 */
+    color: white; /* テキスト色 */
+    border: none; /* 枠線なし */
+    width: 120px; /* 幅 */
+    height: 120px; /* 高さ */
+    border-radius: 50%; /* 丸くする */
+    font-size: 24px; /* フォントサイズ */
+    cursor: pointer; /* ポインタカーソル */
+    position: absolute; /* 位置を絶対指定 */
+    bottom: 20px; /* 下からの位置 */
+    right: 20px; /* 右からの位置 */
+    display: flex; /* フレックスボックス */
+    justify-content: center; /* 中央揃え */
+    align-items: center; /* 中央揃え */
+    text-align: center; /* テキストを中央揃え */
+    padding: 0; /* 内側の余白をゼロに */
+}
+
+#myCircleButton:hover {
+    background-color: #FFB6C1; /* ホバー時の色（少し濃いピンク） */
+}