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; /* 内側の余白をゼロに */
        }
