Update index.html

index.html

@@ -379,7 +379,7 @@ document.addEventListener('DOMContentLoaded', function () {
             /* プログレスバーのマーカー */
             .progress-marker {
             position: absolute;
-            bottom: -10px;
+            bottom: 0px;
             width: 0;
             height: 0;
             border-left: 5px solid transparent;
@@ -1200,29 +1200,14 @@ window.addEventListener('load', async () => {
                         <button class="time-set-button" id="reset-end-time" disabled>動画の長さに戻す</button>
                     </div>
                 </div>
-                <div class="setting-item">
-                    <button class="combine-button" id="apply-time-btn" disabled>時間設定を適用</button>
-                </div>
-                <h2>設定</h2>
-                <div class="setting-item">
-                    <label for="start-time">再生開始秒数:</label>
-                    <div>
-                        <input type="number" id="start-time" min="0" value="0" step="0.01" disabled>
-                        <button class="time-set-button" id="set-start-time" disabled>現在の秒数に設定</button>
-                    </div>
-                </div>
-                <div class="setting-item">
-                    <label for="end-time">再生終了秒数:</label>
-                    <div>
-                        <input type="number" id="end-time" min="0" value="0" step="0.01" disabled>
-                        <button class="time-set-button" id="set-end-time" disabled>現在の秒数に設定</button>
-                        <button class="time-set-button" id="reset-end-time" disabled>動画の長さに戻す</button>
-                    </div>
-                </div>
                 <div class="setting-item">
                     <label for="loop">ループ再生:</label>
                     <input type="checkbox" id="loop" disabled>
                 </div>
+                <div class="setting-item">
+                    <button class="combine-button" id="apply-time-btn" disabled>時間設定を適用</button>
+                </div>
+                <h2>設定</h2>
                 <div class="setting-item">
                     <div class="global-volume-container">
                         <label>全体音量係数:</label>
@@ -1249,418 +1234,444 @@ window.addEventListener('load', async () => {
         <!-- 全画面時のロックボタン -->
         <button class="lock-controls-btn" id="lock-controls-btn" title="コントロールバーを固定">🔒</button>
         <script>
-            document.addEventListener('DOMContentLoaded', function() {
-                // 同期管理用の変数
-                let lastSyncTime = 0;
-                let isBuffering = false;
-                let syncDriftLog = [];
-                let syncCheckInterval;
-                let audioContext;
-                let controlsHideTimeout;
-                let isControlsLocked = false;
-                let controlsVisible = true;
-                let isCheckingSync = false;
-                let isInBackgroundTab = false;
-                
-                try {
-                    audioContext = new (window.AudioContext || window.webkitAudioContext)();
-                } catch (e) {
-                    console.error('Web Audio APIがサポートされていません:', e);
-                }
-            
-                // テクノロジー風背景を生成
-                function createTechBackground() {
-                    const bg = document.getElementById('techBg');
-                    
-                    for (let i = 0; i < 200; i++) {
-                        const line = document.createElement('div');
-                        line.className = 'circuit-line';
-                        
-                        const isHorizontal = Math.random() > 0.5;
-                        if (isHorizontal) {
-                            line.style.width = `${Math.random() * 300 + 100}px`;
-                            line.style.height = '1px';
-                        } else {
-                            line.style.width = '1px';
-                            line.style.height = `${Math.random() * 300 + 100}px`;
-                        }
-                        
-                        line.style.left = `${Math.random() * 100}%`;
-                        line.style.top = `${Math.random() * 100}%`;
-                        line.style.opacity = Math.random() * 0.5 + 0.1;
-                        bg.appendChild(line);
-                    }
-            
-                    for (let i = 0; i < 200; i++) {
-                        const dot = document.createElement('div');
-                        dot.className = 'grid-dot';
-                        dot.style.left = `${Math.random() * 100}%`;
-                        dot.style.top = `${Math.random() * 100}%`;
-                        bg.appendChild(dot);
-                    }
-            
-                    for (let i = 0; i < 15; i++) {
-                        const hex = document.createElement('div');
-                        hex.className = 'hexagon';
-                        hex.style.left = `${Math.random() * 100}%`;
-                        hex.style.top = `${Math.random() * 100}%`;
-                        hex.style.transform = `rotate(${Math.random() * 360}deg)`;
-                        hex.style.animation = `float ${Math.random() * 10 + 5}s infinite ease-in-out`;
-                        bg.appendChild(hex);
-                    }
-            
-                    for (let i = 0; i < 8; i++) {
-                        const pulse = document.createElement('div');
-                        pulse.className = 'pulse';
-                        pulse.style.left = `${Math.random() * 100}%`;
-                        pulse.style.top = `${Math.random() * 100}%`;
-                        pulse.style.animationDelay = `${Math.random() * 2}s`;
-                        bg.appendChild(pulse);
-                    }
-                }
-                
-                createTechBackground();
-              
-                const urlParams = new URLSearchParams(window.location.search);
-                const isTMode = urlParams.has('mode') && urlParams.get('mode') === 't';
-                const basePath = isTMode ? '/t/' : '/';
-              
-                // ローディング状態を管理
-                let loadingCount = 0;
-                let totalToLoad = 6; // 動画 + 5つの音声ファイル
-                let lastUpdateTime = 0;
-                const updateInterval = 1;
-                
-                function checkLoadingComplete() {
-                    loadingCount++;
-                    if (loadingCount >= totalToLoad) {
-                        setTimeout(function() {
-                            const loadingOverlay = document.getElementById('loadingOverlay');
-                            loadingOverlay.style.opacity = '0';
-                            setTimeout(function() {
-                                loadingOverlay.style.display = 'none';
-                            }, 1000);
-                        }, 500);
-                    }
-                }
-                
-                function handleError(error, message) {
-                    console.error(message, error);
-                    window.alert(`${message}\n\nエラー詳細: ${error.message}`);
-                }
-            
-                // 要素を取得
-                const video = document.getElementById('video');
-                video.preservesPitch = true;
-                video.mozPreservesPitch = true; // Firefox用
-                video.webkitPreservesPitch = true; // 古いWebKit用
-                const videoContainer = document.getElementById('video-container');
-                const playPauseBtn = document.getElementById('play-pause-btn');
-                const timeDisplay = document.getElementById('time-display');
-                const progressContainer = document.getElementById('progress-container');
-                const progressBar = document.getElementById('progress-bar');
-                const progressTime = document.getElementById('progress-time');
-                const volumeBtn = document.getElementById('volume-btn');
-                const volumeSlider = document.getElementById('volume-slider');
-                const speedSlider = document.getElementById('speed-slider');
-                const speedValue = document.getElementById('speed-value');
-                const playbackSpeedSlider = document.getElementById('playback-speed');
-                const playbackSpeedValue = document.getElementById('playback-speed-value');
-                const fullscreenBtn = document.getElementById('fullscreen-btn');
-                const startTimeInput = document.getElementById('start-time');
-                const endTimeInput = document.getElementById('end-time');
-                const loopCheckbox = document.getElementById('loop');
-                const globalVolumeSlider = document.getElementById('global-volume');
-                const globalVolumeValue = document.getElementById('global-volume-value');
-                const audioSliders = document.querySelectorAll('.audio-slider');
-                const volumeValues = document.querySelectorAll('.volume-value');
-                const setStartTimeBtn = document.getElementById('set-start-time');
-                const setEndTimeBtn = document.getElementById('set-end-time');
-                const resetEndTimeBtn = document.getElementById('reset-end-time');
-                const disabledOverlay = document.getElementById('disabledOverlay');
-                const combineButton = document.getElementById('combine-button');
-                const combineStatus = document.getElementById('combine-status');
-                const previewSection = document.getElementById('preview-section');
-                const previewButton = document.getElementById('preview-button');
-                const previewTime = document.getElementById('preview-time');
-                const bufferingIndicator = document.getElementById('buffering-indicator');
-                const syncStatus = document.getElementById('sync-status');
-                const syncStatusText = document.getElementById('sync-status-text');
-                const syncStatusClose = document.getElementById('sync-status-close');
-                const lockControlsBtn = document.getElementById('lock-controls-btn');
-                const startMarker = document.getElementById('start-marker');
-                const endMarker = document.getElementById('end-marker');
-                const tempoInput = document.getElementById('tempo');
-                const tempoSpeedValue = document.getElementById('tempo-speed-value');
-                const videoControls = document.querySelector('.video-controls');
-                const applyTimeBtn = document.getElementById('apply-time-btn');
-              
-                // 音声オブジェクトを作成
-                const audioElements = {};
-                const audioBuffers = {};
-                const audioFiles = ['p', 'a', 't', 's', 'k'];
-                let combinedAudioElement = null;
-                let isAudioCombined = false;
-                let currentVolumes = { p: 0, a: 1, t: 1, s: 1, k: 0 };
-                
-                // 初期化
-                let videoDuration = 0;
-                let isPlaying = false;
-                let lastVolume = 1;
-                let currentPlaybackRate = 1;
-                let isFullscreen = false;
-            
-                async function enterPiP() {
-                if (!document.pictureInPictureElement && !video.paused) {
-                  try {
-                    await video.requestPictureInPicture();
-                  } catch (err) {
-                    console.warn('PiP開始失敗:', err);
-                  }
-                }
-              }
-            
-              async function exitPiP() {
-                if (document.pictureInPictureElement) {
-                  try {
-                    await document.exitPictureInPicture();
-                  } catch (err) {
-                    console.warn('PiP終了失敗:', err);
-                  }
-                }
-              }
-            
-              
-                // 動画のバッファリング状態を監視
-                video.addEventListener('waiting', function() {
-                    isBuffering = true;
-                    bufferingIndicator.style.display = 'block';
-                    if (combinedAudioElement) {
-                        combinedAudioElement.pause();
-                    }
-                });
-                
-                video.addEventListener('playing', function() {
-                    isBuffering = false;
-                    bufferingIndicator.style.display = 'none';
-                    if (combinedAudioElement && isPlaying) {
-                        syncAudioWithVideo();
-                    }
-                });
-                
-                video.addEventListener('suspend', function() {
-                    console.log('動画の読み込みが一時停止しました');
-                });
-                
-                video.addEventListener('stalled', function() {
-                    console.log('動画の読み込みが停滞しました');
-                    if (isPlaying) {
-                        pauseMedia();
-                    }
-                });
-            
-            function startSyncCheck() {
-              if (isCheckingSync) return;
-              isCheckingSync = true;
-              if (syncCheckInterval) clearInterval(syncCheckInterval);
-              syncCheckInterval = setInterval(checkSync, 1000);
-            }
+document.addEventListener('DOMContentLoaded', function() {
+    // 同期管理用の変数
+    let lastSyncTime = 0;
+    let isBuffering = false;
+    let syncDriftLog = [];
+    let syncCheckInterval;
+    let audioContext;
+    let controlsHideTimeout;
+    let isControlsLocked = false;
+    let controlsVisible = true;
+    let isCheckingSync = false;
+    let isInBackgroundTab = false;
+    let isBlankMode = false; // 消画モードフラグ
+    
+    try {
+        audioContext = new (window.AudioContext || window.webkitAudioContext)();
+    } catch (e) {
+        console.error('Web Audio APIがサポートされていません:', e);
+    }
+
+    // テクノロジー風背景を生成
+    function createTechBackground() {
+        const bg = document.getElementById('techBg');
+        
+        for (let i = 0; i < 200; i++) {
+            const line = document.createElement('div');
+            line.className = 'circuit-line';
             
-            function stopSyncCheck() {
-              isCheckingSync = false;
-              if (syncCheckInterval) clearInterval(syncCheckInterval);
+            const isHorizontal = Math.random() > 0.5;
+            if (isHorizontal) {
+                line.style.width = `${Math.random() * 300 + 100}px`;
+                line.style.height = '1px';
+            } else {
+                line.style.width = '1px';
+                line.style.height = `${Math.random() * 300 + 100}px`;
             }
             
-            function checkSync() {
-              if (!isAudioCombined || !isPlaying || isBuffering || isInBackgroundTab) return;
-              
-              const videoTime = video.currentTime;
-              const audioTime = combinedAudioElement.currentTime;
-              const drift = videoTime - audioTime;
-              
-              syncDriftLog.push(drift);
-              if (syncDriftLog.length > 5) syncDriftLog.shift();
-              
-              const avgDrift = syncDriftLog.reduce((a, b) => a + b, 0) / syncDriftLog.length;
-              syncStatusText.textContent = `同期ズレ: ${avgDrift.toFixed(3)}秒`;
-              
-              if (Math.abs(avgDrift) > 0.1) {
-                console.log(`同期ズレを修正: ${avgDrift.toFixed(3)}秒`);
-                syncAudioWithVideo();
-              }
-            }
+            line.style.left = `${Math.random() * 100}%`;
+            line.style.top = `${Math.random() * 100}%`;
+            line.style.opacity = Math.random() * 0.5 + 0.1;
+            bg.appendChild(line);
+        }
+
+        for (let i = 0; i < 200; i++) {
+            const dot = document.createElement('div');
+            dot.className = 'grid-dot';
+            dot.style.left = `${Math.random() * 100}%`;
+            dot.style.top = `${Math.random() * 100}%`;
+            bg.appendChild(dot);
+        }
 
-              applyTimeBtn.addEventListener('click', function() {
-    // 現在再生中なら一時停止
-    const wasPlaying = isPlaying;
-    if (isPlaying) {
-        pauseMedia();
+        for (let i = 0; i < 15; i++) {
+            const hex = document.createElement('div');
+            hex.className = 'hexagon';
+            hex.style.left = `${Math.random() * 100}%`;
+            hex.style.top = `${Math.random() * 100}%`;
+            hex.style.transform = `rotate(${Math.random() * 360}deg)`;
+            hex.style.animation = `float ${Math.random() * 10 + 5}s infinite ease-in-out`;
+            bg.appendChild(hex);
+        }
+
+        for (let i = 0; i < 8; i++) {
+            const pulse = document.createElement('div');
+            pulse.className = 'pulse';
+            pulse.style.left = `${Math.random() * 100}%`;
+            pulse.style.top = `${Math.random() * 100}%`;
+            pulse.style.animationDelay = `${Math.random() * 2}s`;
+            bg.appendChild(pulse);
+        }
     }
     
-    // 開始時間と終了時間を取得
-    const startTime = parseFloat(startTimeInput.value) || 0;
-    const endTime = parseFloat(endTimeInput.value) || video.duration;
+    createTechBackground();
+  
+    const urlParams = new URLSearchParams(window.location.search);
+    const isTMode = urlParams.has('mode') && urlParams.get('mode') === 't';
+    const basePath = isTMode ? '/t/' : '/';
+  
+    // ローディング状態を管理
+    let loadingCount = 0;
+    let totalToLoad = 6; // 動画 + 5つの音声ファイル
+    let lastUpdateTime = 0;
+    const updateInterval = 1;
     
-    // 現在位置が開始時間より前なら開始時間に移動
-    if (video.currentTime < startTime) {
-        video.currentTime = startTime;
-        if (combinedAudioElement) {
-            combinedAudioElement.currentTime = startTime;
+    function checkLoadingComplete() {
+        loadingCount++;
+        if (loadingCount >= totalToLoad) {
+            setTimeout(function() {
+                const loadingOverlay = document.getElementById('loadingOverlay');
+                loadingOverlay.style.opacity = '0';
+                setTimeout(function() {
+                    loadingOverlay.style.display = 'none';
+                }, 1000);
+            }, 500);
+        }
+    }
+    
+    function handleError(error, message) {
+        console.error(message, error);
+        window.alert(`${message}\n\nエラー詳細: ${error.message}`);
+    }
+
+    // 要素を取得
+    const video = document.getElementById('video');
+    video.preservesPitch = true;
+    video.mozPreservesPitch = true; // Firefox用
+    video.webkitPreservesPitch = true; // 古いWebKit用
+    const videoContainer = document.getElementById('video-container');
+    const playPauseBtn = document.getElementById('play-pause-btn');
+    const timeDisplay = document.getElementById('time-display');
+    const progressContainer = document.getElementById('progress-container');
+    const progressBar = document.getElementById('progress-bar');
+    const progressTime = document.getElementById('progress-time');
+    const volumeBtn = document.getElementById('volume-btn');
+    const volumeSlider = document.getElementById('volume-slider');
+    const speedSlider = document.getElementById('speed-slider');
+    const speedValue = document.getElementById('speed-value');
+    const playbackSpeedSlider = document.getElementById('playback-speed');
+    const playbackSpeedValue = document.getElementById('playback-speed-value');
+    const fullscreenBtn = document.getElementById('fullscreen-btn');
+    const startTimeInput = document.getElementById('start-time');
+    const endTimeInput = document.getElementById('end-time');
+    const loopCheckbox = document.getElementById('loop');
+    const globalVolumeSlider = document.getElementById('global-volume');
+    const globalVolumeValue = document.getElementById('global-volume-value');
+    const audioSliders = document.querySelectorAll('.audio-slider');
+    const volumeValues = document.querySelectorAll('.volume-value');
+    const setStartTimeBtn = document.getElementById('set-start-time');
+    const setEndTimeBtn = document.getElementById('set-end-time');
+    const resetEndTimeBtn = document.getElementById('reset-end-time');
+    const disabledOverlay = document.getElementById('disabledOverlay');
+    const combineButton = document.getElementById('combine-button');
+    const combineStatus = document.getElementById('combine-status');
+    const previewSection = document.getElementById('preview-section');
+    const previewButton = document.getElementById('preview-button');
+    const previewTime = document.getElementById('preview-time');
+    const bufferingIndicator = document.getElementById('buffering-indicator');
+    const syncStatus = document.getElementById('sync-status');
+    const syncStatusText = document.getElementById('sync-status-text');
+    const syncStatusClose = document.getElementById('sync-status-close');
+    const lockControlsBtn = document.getElementById('lock-controls-btn');
+    const startMarker = document.getElementById('start-marker');
+    const endMarker = document.getElementById('end-marker');
+    const tempoInput = document.getElementById('tempo');
+    const tempoSpeedValue = document.getElementById('tempo-speed-value');
+    const videoControls = document.querySelector('.video-controls');
+    const applyTimeBtn = document.getElementById('apply-time-btn');
+    const blankModeBtn = document.getElementById('blank-mode-btn'); // 消画モードボタン
+  
+    // 音声オブジェクトを作成
+    const audioElements = {};
+    const audioBuffers = {};
+    const audioFiles = ['p', 'a', 't', 's', 'k'];
+    let combinedAudioElement = null;
+    let isAudioCombined = false;
+    let currentVolumes = { p: 0, a: 1, t: 1, s: 1, k: 0 };
+    let appliedStartTime = 0;
+    let appliedEndTime = 0;
+    
+    // 初期化
+    let videoDuration = 0;
+    let isPlaying = false;
+    let lastVolume = 1;
+    let currentPlaybackRate = 1;
+    let isFullscreen = false;
+
+    // 消画モード切り替え
+    function toggleBlankMode() {
+        isBlankMode = !isBlankMode;
+        if (isBlankMode) {
+            video.style.backgroundColor = 'black';
+            video.style.opacity = '0';
+            blankModeBtn.textContent = '消画モード: ON';
+            blankModeBtn.classList.add('active');
+        } else {
+            video.style.backgroundColor = '';
+            video.style.opacity = '1';
+            blankModeBtn.textContent = '消画モード: OFF';
+            blankModeBtn.classList.remove('active');
         }
     }
-    // 現在位置が終了時間より後なら開始時間に移動
-    else if (video.currentTime > endTime) {
-        video.currentTime = startTime;
+
+    async function enterPiP() {
+        if (!document.pictureInPictureElement && !video.paused) {
+            try {
+                await video.requestPictureInPicture();
+            } catch (err) {
+                console.warn('PiP開始失敗:', err);
+            }
+        }
+    }
+
+    async function exitPiP() {
+        if (document.pictureInPictureElement) {
+            try {
+                await document.exitPictureInPicture();
+            } catch (err) {
+                console.warn('PiP終了失敗:', err);
+            }
+        }
+    }
+  
+    // 動画のバッファリング状態を監視
+    video.addEventListener('waiting', function() {
+        isBuffering = true;
+        bufferingIndicator.style.display = 'block';
         if (combinedAudioElement) {
-            combinedAudioElement.currentTime = startTime;
+            combinedAudioElement.pause();
+        }
+    });
+    
+    video.addEventListener('playing', function() {
+        isBuffering = false;
+        bufferingIndicator.style.display = 'none';
+        if (combinedAudioElement && isPlaying) {
+            syncAudioWithVideo();
+        }
+    });
+    
+    video.addEventListener('suspend', function() {
+        console.log('動画の読み込みが一時停止しました');
+    });
+    
+    video.addEventListener('stalled', function() {
+        console.log('動画の読み込みが停滞しました');
+        if (isPlaying) {
+            pauseMedia();
         }
+    });
+
+    function startSyncCheck() {
+        if (isCheckingSync) return;
+        isCheckingSync = true;
+        if (syncCheckInterval) clearInterval(syncCheckInterval);
+        syncCheckInterval = setInterval(checkSync, 1000);
     }
     
-    // 再生中だった場合は再開
-    if (wasPlaying) {
-        playMedia();
+    function stopSyncCheck() {
+        isCheckingSync = false;
+        if (syncCheckInterval) clearInterval(syncCheckInterval);
     }
     
-    // マーカーを更新
-    updateProgressMarkers();
-});
+    function checkSync() {
+        if (!isAudioCombined || !isPlaying || isBuffering || isInBackgroundTab) return;
+        
+        const videoTime = video.currentTime;
+        const audioTime = combinedAudioElement.currentTime;
+        const drift = videoTime - audioTime;
+        
+        syncDriftLog.push(drift);
+        if (syncDriftLog.length > 5) syncDriftLog.shift();
+        
+        const avgDrift = syncDriftLog.reduce((a, b) => a + b, 0) / syncDriftLog.length;
+        syncStatusText.textContent = `同期ズレ: ${avgDrift.toFixed(3)}秒`;
+        
+        if (Math.abs(avgDrift) > 0.1) {
+            console.log(`同期ズレを修正: ${avgDrift.toFixed(3)}秒`);
+            syncAudioWithVideo();
+        }
+    }
 
-                // 音声を動画に同期させる関数
-                function syncAudioWithVideo() {
-                    if (!isAudioCombined || !isPlaying) return;
-                    
-                    const currentTime = video.currentTime;
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.currentTime = currentTime;
-                        if (isPlaying) {
-                            combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
-                        }
+    applyTimeBtn.addEventListener('click', function() {
+        // 現在再生中なら一時停止
+        const wasPlaying = isPlaying;
+        if (isPlaying) {
+            pauseMedia();
+        }
+        
+        // 開始時間と終了時間を取得
+        appliedStartTime = parseFloat(startTimeInput.value) || 0;
+        appliedEndTime = parseFloat(endTimeInput.value) || video.duration;
+        
+        // 現在位置が開始時間より前なら開始時間に移動
+        if (video.currentTime < appliedStartTime) {
+            video.currentTime = appliedStartTime;
+            if (combinedAudioElement) {
+                combinedAudioElement.currentTime = appliedStartTime;
+            }
+        }
+        // 現在位置が終了時間より後なら開始時間に移動
+        else if (video.currentTime > appliedEndTime) {
+            video.currentTime = appliedStartTime;
+            if (combinedAudioElement) {
+                combinedAudioElement.currentTime = appliedStartTime;
+            }
+        }
+        
+        // 再生中だった場合は再開
+        if (wasPlaying) {
+            playMedia();
+        }
+        
+        // マーカーを更新
+        updateProgressMarkers();
+    });
+
+    // 音声を動画に同期させる関数
+    function syncAudioWithVideo() {
+        if (!isAudioCombined || !isPlaying) return;
+        
+        const currentTime = video.currentTime;
+        
+        if (combinedAudioElement) {
+            combinedAudioElement.currentTime = currentTime;
+            if (isPlaying) {
+                combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
+            }
+        }
+        
+        // ズレ記録をリセット
+        syncDriftLog = [];
+        lastSyncTime = performance.now();
+    }
+
+    // 音声ファイルをロード
+    function loadAudioFiles() {
+        audioFiles.forEach(file => {
+            try {
+                const audio = new Audio(`${basePath}${file}.mp3`);
+                audio.preload = 'auto';
+                audio.loop = false;
+                audioElements[file] = audio;
+                
+                audio.addEventListener('loadedmetadata', function() {
+                    console.log(`${basePath}${file}.mp3 loaded`);
+                    checkLoadingComplete();
+                });
+                
+                audio.addEventListener('error', function() {
+                    console.error(`音声ファイル読み込みエラー (${basePath}${file}.mp3):`, audio.error);
+                    checkLoadingComplete();
+                });
+            } catch (error) {
+                console.error(`音声ファイル初期化エラー (${basePath}${file}.mp3):`, error);
+                checkLoadingComplete();
+            }
+        });
+    }
+
+    // 音声を結合する関数
+    async function combineAudio() {
+        // 既存の音声を停止して解放
+        if (combinedAudioElement) {
+            combinedAudioElement.pause();
+            combinedAudioElement.src = '';
+            combinedAudioElement = null;
+        }
+        
+        combineButton.disabled = true;
+        combineStatus.textContent = "音声を合成中...";
+
+        try {
+            // 現在の音量設定を保存
+            audioFiles.forEach(file => {
+                currentVolumes[file] = parseFloat(document.querySelector(`.audio-slider[data-audio="${file}"]`).value);
+            });
+
+            // 各音声ファイルをデコード
+            const audioBufferPromises = audioFiles.map(async file => {
+                const audio = audioElements[file];
+                if (!audio) return null;
+
+                // 音量が0の場合はスキップ
+                if (currentVolumes[file] === 0) return null;
+
+                const response = await fetch(`${basePath}${file}.mp3`);
+                const arrayBuffer = await response.arrayBuffer();
+                return await audioContext.decodeAudioData(arrayBuffer);
+            });
+
+            // すべての音声バッファを取得
+            const buffers = await Promise.all(audioBufferPromises);
+            audioFiles.forEach((file, index) => {
+                audioBuffers[file] = buffers[index];
+            });
+
+            // 最長の音声バッファの長さを取得
+            const maxDuration = Math.max(...buffers.filter(b => b).map(b => b.duration));
+
+            // 新しい音声バッファを作成
+            const combinedAudioBuffer = audioContext.createBuffer(
+                2, // ステレオ
+                audioContext.sampleRate * maxDuration,
+                audioContext.sampleRate
+            );
+
+            // 各音声バッファを結合
+            for (let file of audioFiles) {
+                if (!audioBuffers[file] || currentVolumes[file] === 0) continue;
+
+                const buffer = audioBuffers[file];
+                const volume = currentVolumes[file];
+
+                // 各チャンネルに音声を加算
+                for (let channel = 0; channel < 2; channel++) {
+                    const inputData = buffer.getChannelData(channel % buffer.numberOfChannels);
+                    const outputData = combinedAudioBuffer.getChannelData(channel);
+
+                    for (let i = 0; i < inputData.length; i++) {
+                        outputData[i] += inputData[i] * volume;
                     }
-                    
-                    // ズレ記録をリセット
-                    syncDriftLog = [];
-                    lastSyncTime = performance.now();
                 }
-            
-                // 音声ファイルをロード
-                function loadAudioFiles() {
-                    audioFiles.forEach(file => {
-                        try {
-                            const audio = new Audio(`${basePath}${file}.mp3`);
-                            audio.preload = 'auto';
-                            audio.loop = false;
-                            audioElements[file] = audio;
-                            
-                            audio.addEventListener('loadedmetadata', function() {
-                                console.log(`${basePath}${file}.mp3 loaded`);
-                                checkLoadingComplete();
-                            });
-                            
-                            audio.addEventListener('error', function() {
-                                console.error(`音声ファイル読み込みエラー (${basePath}${file}.mp3):`, audio.error);
-                                checkLoadingComplete();
-                            });
-                        } catch (error) {
-                            console.error(`音声ファイル初期化エラー (${basePath}${file}.mp3):`, error);
-                            checkLoadingComplete();
-                        }
-                    });
+            }
+
+            // 音量を正規化 (クリッピング防止)
+            for (let channel = 0; channel < 2; channel++) {
+                const outputData = combinedAudioBuffer.getChannelData(channel);
+                let max = 0;
+                
+                for (let i = 0; i < outputData.length; i++) {
+                    if (Math.abs(outputData[i]) > max) {
+                        max = Math.abs(outputData[i]);
+                    }
                 }
-            
-                // 音声を結合する関数
-                async function combineAudio() {
-                    combineButton.disabled = true;
-                    combineStatus.textContent = "音声を合成中...";
-            
-                    try {
-                        // 現在の音量設定を保存
-                        audioFiles.forEach(file => {
-                            currentVolumes[file] = parseFloat(document.querySelector(`.audio-slider[data-audio="${file}"]`).value);
-                        });
-            
-                        // 各音声ファイルをデコード
-                        const audioBufferPromises = audioFiles.map(async file => {
-                            const audio = audioElements[file];
-                            if (!audio) return null;
-            
-                            // 音量が0の場合はスキップ
-                            if (currentVolumes[file] === 0) return null;
-            
-                            const response = await fetch(`${basePath}${file}.mp3`);
-                            const arrayBuffer = await response.arrayBuffer();
-                            return await audioContext.decodeAudioData(arrayBuffer);
-                        });
-            
-                        // すべての音声バッファを取得
-                        const buffers = await Promise.all(audioBufferPromises);
-                        audioFiles.forEach((file, index) => {
-                            audioBuffers[file] = buffers[index];
-                        });
-            
-                        // 最長の音声バッファの長さを取得
-                        const maxDuration = Math.max(...buffers.filter(b => b).map(b => b.duration));
-            
-                        // 新しい音声バッファを作成
-                        const combinedAudioBuffer = audioContext.createBuffer(
-                            2, // ステレオ
-                            audioContext.sampleRate * maxDuration,
-                            audioContext.sampleRate
-                        );
-            
-                        // 各音声バッファを結合
-                        for (let file of audioFiles) {
-                            if (!audioBuffers[file] || currentVolumes[file] === 0) continue;
-            
-                            const buffer = audioBuffers[file];
-                            const volume = currentVolumes[file];
-            
-                            // 各チャンネルに音声を加算
-                            for (let channel = 0; channel < 2; channel++) {
-                                const inputData = buffer.getChannelData(channel % buffer.numberOfChannels);
-                                const outputData = combinedAudioBuffer.getChannelData(channel);
-            
-                                for (let i = 0; i < inputData.length; i++) {
-                                    outputData[i] += inputData[i] * volume;
-                                }
-                            }
-                        }
-            
-                        // 音量を正規化 (クリッピング防止)
-                        for (let channel = 0; channel < 2; channel++) {
-                            const outputData = combinedAudioBuffer.getChannelData(channel);
-                            let max = 0;
-                            
-                            for (let i = 0; i < outputData.length; i++) {
-                                if (Math.abs(outputData[i]) > max) {
-                                    max = Math.abs(outputData[i]);
-                                }
-                            }
-            
-                            if (max > 1) {
-                                for (let i = 0; i < outputData.length; i++) {
-                                    outputData[i] /= max;
-                                }
-                            }
-                        }
-            
-                        // AudioBufferをBlobに変換
-                        const blob = bufferToWave(combinedAudioBuffer);
-                        const url = URL.createObjectURL(blob);
-            
-                        // 新しいaudio要素を作成
-                        combinedAudioElement = new Audio(url);
-                        combinedAudioElement.preservesPitch = true;
-                        combinedAudioElement.mozPreservesPitch = true;
-                        combinedAudioElement.webkitPreservesPitch = true;
-                        combinedAudioElement.playbackRate = currentPlaybackRate;
-            
-                        isAudioCombined = true;
-                        combineStatus.textContent = "音声の合成が完了しました";
-                        enablePlayerControls();
-            
-                        combineButton.disabled = false;
-            
+
+                if (max > 1) {
+                    for (let i = 0; i < outputData.length; i++) {
+                        outputData[i] /= max;
+                    }
+                }
+            }
+
+            // AudioBufferをBlobに変換
+            const blob = bufferToWave(combinedAudioBuffer);
+            const url = URL.createObjectURL(blob);
+
+            // 新しいaudio要素を作成
+            combinedAudioElement = new Audio(url);
+            combinedAudioElement.preservesPitch = true;
+            combinedAudioElement.mozPreservesPitch = true;
+            combinedAudioElement.webkitPreservesPitch = true;
+            combinedAudioElement.playbackRate = currentPlaybackRate;
+
+            isAudioCombined = true;
+            combineStatus.textContent = "音声の合成が完了しました";
+            enablePlayerControls();
+
+            combineButton.disabled = false;
+
             document.addEventListener('visibilitychange', async () => {
                 if (document.hidden) {
                     // タブが非表示になった場合
@@ -1716,682 +1727,687 @@ window.addEventListener('load', async () => {
                 }
             });
             
+            // 動画終了時に自動的にPiPを閉じる（次回再開のため）
+            video.addEventListener('ended', exitPiP);
             
-              // 動画終了時に自動的にPiPを閉じる（次回再開のため）
-              video.addEventListener('ended', exitPiP);
-                        // 合成後に音量と再生速度を適用
-                        applyVolume();
-                        applyPlaybackRate();
-            
-                    } catch (error) {
-                        console.error('音声合成エラー:', error);
-                        combineStatus.textContent = "音声の合成に失敗しました";
-                        combineButton.disabled = false;
-                    }
-                }
-            
-                function bufferToWave(abuffer) {
-                    const numOfChan = abuffer.numberOfChannels,
-                        length = abuffer.length * numOfChan * 2 + 44,
-                        buffer = new ArrayBuffer(length),
-                        view = new DataView(buffer),
-                        channels = [],
-                        sampleRate = abuffer.sampleRate;
-                        
-                    // posをletで宣言（constから変更）
-                    let pos = 0;
-            
-                    // write WAV header
-                    setUint32(0x46464952); // "RIFF"
-                    setUint32(length - 8); // file length - 8
-                    setUint32(0x45564157); // "WAVE"
-            
-                    setUint32(0x20746d66); // "fmt " chunk
-                    setUint32(16); // length = 16
-                    setUint16(1); // PCM (uncompressed)
-                    setUint16(numOfChan);
-                    setUint32(sampleRate);
-                    setUint32(sampleRate * 2 * numOfChan);
-                    setUint16(numOfChan * 2);
-                    setUint16(16);
-            
-                    setUint32(0x61746164); // "data" - chunk
-                    setUint32(length - pos - 4);
-            
-                    // write interleaved data
-                    for (let i = 0; i < abuffer.length; i++) {
-                        for (let channel = 0; channel < numOfChan; channel++) {
-                            let sample = abuffer.getChannelData(channel)[i] * 0x7fff;
-                            if (sample < -32768) sample = -32768;
-                            if (sample > 32767) sample = 32767;
-                            view.setInt16(pos, sample, true);
-                            pos += 2;
-                        }
-                    }
-            
-                    function setUint16(data) {
-                        view.setUint16(pos, data, true);
-                        pos += 2;
-                    }
-            
-                    function setUint32(data) {
-                        view.setUint32(pos, data, true);
-                        pos += 4;
-                    }
-            
-                    return new Blob([buffer], { type: 'audio/wav' });
-                }
-            
-                function applyVolume() {
-                    if (!isAudioCombined) return;
-                    
-                    // ベース音量 (0-1)
-                    const baseVolume = parseFloat(volumeSlider.value);
-                    // グローバル音量係数 (0-10)
-                    const globalVolume = parseFloat(globalVolumeSlider.value) / 10; // 0-1に変換
-                    
-                    // 最終音量 (0-1)
-                    const finalVolume = Math.max(0, Math.min(1, baseVolume * globalVolume));
-                    
-                    // 動画と音声の音量を設定
-                    video.volume = finalVolume;
-                    if (combinedAudioElement) {
-                        combinedAudioElement.volume = finalVolume;
-                    }
-                    
-                    // 音量アイコンを更新
-                    updateVolumeIcon();
-                }
-            
-                function applyPlaybackRate() {
-                    if (!isAudioCombined) return;
-                    
-                    const speed = parseFloat(playbackSpeedSlider.value);
-                    currentPlaybackRate = speed;
-                    video.playbackRate = speed;
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.playbackRate = speed;
-                    }
-                    
-                    speedValue.textContent = speed.toFixed(2) + 'x';
-                    playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
-                    speedSlider.value = speed;
-                }
-            
-                // プレイヤーコントロールを有効化
-                function enablePlayerControls() {
-                    disabledOverlay.style.display = 'none';
-                    playPauseBtn.disabled = false;
-                    volumeBtn.disabled = false;
-                    volumeSlider.disabled = false;
-                    speedSlider.disabled = false;
-                    fullscreenBtn.disabled = false;
-                    startTimeInput.disabled = false;
-                    endTimeInput.disabled = false;
-                    resetEndTimeBtn.disabled = false;
-                    loopCheckbox.disabled = false;
-                    globalVolumeSlider.disabled = false;
-                    setStartTimeBtn.disabled = false;
-                    setEndTimeBtn.disabled = false;
-                    playbackSpeedSlider.disabled = false;
-                    applyTimeBtn.disabled = false;
-                }
-            
-                // プレビュー再生
-                function togglePreview() {
-                    if (!isAudioCombined || !combinedAudioElement) return;
-            
-                    if (previewButton.textContent === '▶') {
-                        // 再生
-                        combinedAudioElement.currentTime = 0;
-                        combinedAudioElement.play()
-                            .then(() => {
-                                previewButton.textContent = '⏸';
-                                
-                                // プレビューの時間表示を更新
-                                const updatePreviewTime = () => {
-                                    if (!combinedAudioElement || !isAudioCombined) return;
-                                    
-                                    const currentTime = combinedAudioElement.currentTime;
-                                    const duration = combinedAudioElement.duration;
-                                    
-                                    if (currentTime >= duration) {
-                                        previewButton.textContent = '▶';
-                                        previewTime.textContent = `00:00 / ${formatTime(duration)}`;
-                                        return;
-                                    }
-                                    
-                                    previewTime.textContent = `${formatTime(currentTime)} / ${formatTime(duration)}`;
-                                    requestAnimationFrame(updatePreviewTime);
-                                };
-                                
-                                updatePreviewTime();
-                            })
-                            .catch(e => console.error('プレビュー再生エラー:', e));
-                    } else {
-                        // 一時停止
-                        combinedAudioElement.pause();
-                        previewButton.textContent = '▶';
-                    }
-                }
-            
-                // 時間をフォーマットするヘルパー関数
-                function formatTime(seconds) {
-                    const mins = Math.floor(seconds / 60);
-                    const secs = Math.floor(seconds % 60);
-                    return `${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
-                }
+            // 合成後に音量と再生速度を適用
+            applyVolume();
+            applyPlaybackRate();
+
+        } catch (error) {
+            console.error('音声合成エラー:', error);
+            combineStatus.textContent = "音声の合成に失敗しました";
+            combineButton.disabled = false;
+        }
+    }
+
+    function bufferToWave(abuffer) {
+        const numOfChan = abuffer.numberOfChannels,
+            length = abuffer.length * numOfChan * 2 + 44,
+            buffer = new ArrayBuffer(length),
+            view = new DataView(buffer),
+            channels = [],
+            sampleRate = abuffer.sampleRate;
             
-                // 動画のメタデータが読み込まれたら
-                video.addEventListener('loadedmetadata', function() {
-                    try {
-                        videoDuration = video.duration;
-                        endTimeInput.value = videoDuration.toFixed(2);
-                        endTimeInput.max = videoDuration;
-                        startTimeInput.max = videoDuration - 0.1;
-                        updateTimeDisplay();
-                        checkLoadingComplete();
-                    } catch (error) {
-                        handleError(error, '動画メタデータ読み込み中にエラーが発生しました');
-                    }
-                });
-                
-                // 動画エラー処理
-                video.addEventListener('error', function() {
-                    handleError(video.error, '動画読み込み中にエラーが発生しました');
-                });
-                
-                // 再生ボタンクリック
-                playPauseBtn.addEventListener('click', function() {
-                    const endTime = parseFloat(endTimeInput.value) || videoDuration;
-                    if (video.currentTime >= endTime) {
-                        const startTime = parseFloat(startTimeInput.value) || 0;
-                        seekMedia(startTime);
-                    }
-                    togglePlayPause();
-                });
-                
-                // 時間表示を更新
-                function updateTimeDisplay() {
-                    const now = performance.now();
-                    if (now - lastUpdateTime < updateInterval && !isFullscreen) return;
-                    lastUpdateTime = now;
+        // posをletで宣言（constから変更）
+        let pos = 0;
+
+        // write WAV header
+        setUint32(0x46464952); // "RIFF"
+        setUint32(length - 8); // file length - 8
+        setUint32(0x45564157); // "WAVE"
+
+        setUint32(0x20746d66); // "fmt " chunk
+        setUint32(16); // length = 16
+        setUint16(1); // PCM (uncompressed)
+        setUint16(numOfChan);
+        setUint32(sampleRate);
+        setUint32(sampleRate * 2 * numOfChan);
+        setUint16(numOfChan * 2);
+        setUint16(16);
+
+        setUint32(0x61746164); // "data" - chunk
+        setUint32(length - pos - 4);
+
+        // write interleaved data
+        for (let i = 0; i < abuffer.length; i++) {
+            for (let channel = 0; channel < numOfChan; channel++) {
+                let sample = abuffer.getChannelData(channel)[i] * 0x7fff;
+                if (sample < -32768) sample = -32768;
+                if (sample > 32767) sample = 32767;
+                view.setInt16(pos, sample, true);
+                pos += 2;
+            }
+        }
+
+        function setUint16(data) {
+            view.setUint16(pos, data, true);
+            pos += 2;
+        }
+
+        function setUint32(data) {
+            view.setUint32(pos, data, true);
+            pos += 4;
+        }
+
+        return new Blob([buffer], { type: 'audio/wav' });
+    }
+
+    function applyVolume() {
+        if (!isAudioCombined) return;
+        
+        // ベース音量 (0-1)
+        const baseVolume = parseFloat(volumeSlider.value);
+        // グローバル音量係数 (0-10)
+        const globalVolume = parseFloat(globalVolumeSlider.value) / 10; // 0-1に変換
+        
+        // 最終音量 (0-1)
+        const finalVolume = Math.max(0, Math.min(1, baseVolume * globalVolume));
+        
+        // 動画と音声の音量を設定
+        video.volume = finalVolume;
+        if (combinedAudioElement) {
+            combinedAudioElement.volume = finalVolume;
+        }
+        
+        // 音量アイコンを更新
+        updateVolumeIcon();
+    }
+
+    function applyPlaybackRate() {
+        if (!isAudioCombined) return;
+        
+        const speed = parseFloat(playbackSpeedSlider.value);
+        currentPlaybackRate = speed;
+        video.playbackRate = speed;
+        
+        if (combinedAudioElement) {
+            combinedAudioElement.playbackRate = speed;
+        }
+        
+        speedValue.textContent = speed.toFixed(2) + 'x';
+        playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
+        speedSlider.value = speed;
+    }
+
+    // プレイヤーコントロールを有効化
+    function enablePlayerControls() {
+        disabledOverlay.style.display = 'none';
+        playPauseBtn.disabled = false;
+        volumeBtn.disabled = false;
+        volumeSlider.disabled = false;
+        speedSlider.disabled = false;
+        fullscreenBtn.disabled = false;
+        startTimeInput.disabled = false;
+        endTimeInput.disabled = false;
+        resetEndTimeBtn.disabled = false;
+        loopCheckbox.disabled = false;
+        globalVolumeSlider.disabled = false;
+        setStartTimeBtn.disabled = false;
+        setEndTimeBtn.disabled = false;
+        playbackSpeedSlider.disabled = false;
+        applyTimeBtn.disabled = false;
+        blankModeBtn.disabled = false;
+    }
+
+    // プレビュー再生
+    function togglePreview() {
+        if (!isAudioCombined || !combinedAudioElement) return;
+
+        if (previewButton.textContent === '▶') {
+            // 再生
+            combinedAudioElement.currentTime = 0;
+            combinedAudioElement.play()
+                .then(() => {
+                    previewButton.textContent = '⏸';
                     
-                    try {
-                        const currentTime = video.currentTime;
-                        const duration = video.duration || videoDuration;
+                    // プレビューの時間表示を更新
+                    const updatePreviewTime = () => {
+                        if (!combinedAudioElement || !isAudioCombined) return;
                         
-                        const currentMinutes = Math.floor(currentTime / 60);
-                        const currentSeconds = Math.floor(currentTime % 60);
-                        const currentMilliseconds = Math.floor((currentTime % 1) * 100);
-                        const durationMinutes = Math.floor(duration / 60);
-                        const durationSeconds = Math.floor(duration % 60);
-                        const durationMilliseconds = Math.floor((duration % 1) * 100);
+                        const currentTime = combinedAudioElement.currentTime;
+                        const duration = combinedAudioElement.duration;
                         
-                        timeDisplay.textContent = 
-                            `${String(currentMinutes).padStart(2, '0')}:${String(currentSeconds).padStart(2, '0')}.${String(currentMilliseconds).padStart(2, '0')} / ` +
-                            `${String(durationMinutes).padStart(2, '0')}:${String(durationSeconds).padStart(2, '0')}.${String(durationMilliseconds).padStart(2, '0')}`;
+                        if (currentTime >= duration) {
+                            previewButton.textContent = '▶';
+                            previewTime.textContent = `00:00 / ${formatTime(duration)}`;
+                            return;
+                        }
                         
-                        const progressPercent = (currentTime / duration) * 100;
-                        progressBar.style.width = `${progressPercent}%`;
-                    } catch (error) {
-                        console.error('時間表示更新エラー:', error);
-                    }
-                }
-                
-                // 再生/一時停止をトグル
-                function togglePlayPause() {
-                    if (isPlaying) {
-                        pauseMedia();
-                    } else {
-                        playMedia();
-                    }
-                }
-                
-            function playMedia() {
-                try {
-                    const duration = video.duration || videoDuration;
-                    const startTime = parseFloat(startTimeInput.value) || 0;
-                    const endTime = parseFloat(endTimeInput.value) || duration;
+                        previewTime.textContent = `${formatTime(currentTime)} / ${formatTime(duration)}`;
+                        requestAnimationFrame(updatePreviewTime);
+                    };
+                    
+                    updatePreviewTime();
+                })
+                .catch(e => console.error('プレビュー再生エラー:', e));
+        } else {
+            // 一時停止
+            combinedAudioElement.pause();
+            previewButton.textContent = '▶';
+        }
+    }
+
+    // 時間をフォーマットするヘルパー関数
+    function formatTime(seconds) {
+        const mins = Math.floor(seconds / 60);
+        const secs = Math.floor(seconds % 60);
+        return `${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
+    }
+
+    // 動画のメタデータが読み込まれたら
+    video.addEventListener('loadedmetadata', function() {
+        try {
+            videoDuration = video.duration;
+            endTimeInput.value = videoDuration.toFixed(2);
+            endTimeInput.max = videoDuration;
+            startTimeInput.max = videoDuration - 0.1;
+            updateTimeDisplay();
+            checkLoadingComplete();
+        } catch (error) {
+            handleError(error, '動画メタデータ読み込み中にエラーが発生しました');
+        }
+    });
+    
+    // 動画エラー処理
+    video.addEventListener('error', function() {
+        handleError(video.error, '動画読み込み中にエラーが発生しました');
+    });
+    
+    // 再生ボタンクリック
+    playPauseBtn.addEventListener('click', function() {
+        if (video.currentTime >= appliedEndTime) {
+            video.currentTime = appliedStartTime;
+            if (combinedAudioElement) {
+                combinedAudioElement.currentTime = appliedStartTime;
+            }
+        }
+        togglePlayPause();
+    });
+    
+    // 時間表示を更新
+    function updateTimeDisplay() {
+        const now = performance.now();
+        if (now - lastUpdateTime < updateInterval && !isFullscreen) return;
+        lastUpdateTime = now;
+        
+        try {
+            const currentTime = video.currentTime;
+            const duration = video.duration || videoDuration;
+            
+            const currentMinutes = Math.floor(currentTime / 60);
+            const currentSeconds = Math.floor(currentTime % 60);
+            const currentMilliseconds = Math.floor((currentTime % 1) * 100);
+            const durationMinutes = Math.floor(duration / 60);
+            const durationSeconds = Math.floor(duration % 60);
+            const durationMilliseconds = Math.floor((duration % 1) * 100);
+            
+            timeDisplay.textContent = 
+                `${String(currentMinutes).padStart(2, '0')}:${String(currentSeconds).padStart(2, '0')}.${String(currentMilliseconds).padStart(2, '0')} / ` +
+                `${String(durationMinutes).padStart(2, '0')}:${String(durationSeconds).padStart(2, '0')}.${String(durationMilliseconds).padStart(2, '0')}`;
+            
+            const progressPercent = (currentTime / duration) * 100;
+            progressBar.style.width = `${progressPercent}%`;
+        } catch (error) {
+            console.error('時間表示更新エラー:', error);
+        }
+    }
+    
+    // 再生/一時停止をトグル
+    function togglePlayPause() {
+        if (isPlaying) {
+            pauseMedia();
+        } else {
+            playMedia();
+        }
+    }
+    
+    function playMedia() {
+        try {
+            const duration = video.duration || videoDuration;
+            
+            if (video.currentTime >= appliedEndTime) {
+                video.currentTime = appliedStartTime;
+            }
+            
+            const playPromise = video.play();
+            
+            if (playPromise !== undefined) {
+                playPromise.then(() => {
+                    isPlaying = true;
+                    playPauseBtn.textContent = '⏸';
                     
-                    if (video.currentTime >= endTime) {
-                        video.currentTime = startTime;
+                    // 音声を同期して再生
+                    if (isAudioCombined) {
+                        combinedAudioElement.currentTime = video.currentTime;
+                        combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
                     }
                     
-                    const playPromise = video.play();
+                    startSyncCheck();
                     
-                    if (playPromise !== undefined) {
-                        playPromise.then(() => {
-                            isPlaying = true;
-                            playPauseBtn.textContent = '⏸';
-                            
-                            // 音声を同期して再生
-                            if (isAudioCombined) {
-                                combinedAudioElement.currentTime = video.currentTime;
-                                combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
-                            }
-                            
-                            startSyncCheck();
-                            
-                            video.playbackRate = currentPlaybackRate;
-                        }).catch(error => {
-                            console.error('動画再生エラー:', error);
-                            isPlaying = false;
-                            playPauseBtn.textContent = '▶';
-                        });
-                    }
-                } catch (error) {
-                    console.error('メディア再生エラー:', error);
+                    video.playbackRate = currentPlaybackRate;
+                }).catch(error => {
+                    console.error('動画再生エラー:', error);
                     isPlaying = false;
                     playPauseBtn.textContent = '▶';
-                }
+                });
             }
+        } catch (error) {
+            console.error('メディア再生エラー:', error);
+            isPlaying = false;
+            playPauseBtn.textContent = '▶';
+        }
+    }
+    
+    function pauseMedia() {
+        try {
+            video.pause();
+            isPlaying = false;
+            playPauseBtn.textContent = '▶';
+            stopSyncCheck();
             
-            function pauseMedia() {
-                try {
-                    video.pause();
-                    isPlaying = false;
-                    playPauseBtn.textContent = '▶';
-                    stopSyncCheck();
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.pause();
-                    }
-                } catch (error) {
-                    console.error('メディア一時停止エラー:', error);
+            if (combinedAudioElement) {
+                combinedAudioElement.pause();
+            }
+        } catch (error) {
+            console.error('メディア一時停止エラー:', error);
+        }
+    }
+    
+    // 時間更新時の処理
+    video.addEventListener('timeupdate', function() {
+        const duration = video.duration || videoDuration;
+        
+        if (video.currentTime >= appliedEndTime && appliedEndTime > 0) {
+            if (loopCheckbox.checked) {
+                video.currentTime = appliedStartTime;
+                if (combinedAudioElement) {
+                    combinedAudioElement.currentTime = appliedStartTime;
                 }
+            } else {
+                pauseMedia();
+                video.currentTime = appliedEndTime;
             }
-                
-                // 時間更新時の処理
-video.addEventListener('timeupdate', function() {
-    const duration = video.duration || videoDuration;
-    const endTime = parseFloat(endTimeInput.value) || duration;
+        }
+        
+        updateTimeDisplay();
+    });
     
-    if (video.currentTime >= endTime && endTime > 0) {
-        if (loopCheckbox.checked) {
-            const startTime = parseFloat(startTimeInput.value) || 0;
-            video.currentTime = startTime;
+    // プログレスバークリックでシーク
+    progressContainer.addEventListener('click', function(e) {
+        if (!video.duration) return;
+        
+        const rect = this.getBoundingClientRect();
+        const pos = (e.clientX - rect.left) / rect.width;
+        const seekTime = pos * video.duration;
+        
+        seekMedia(seekTime);
+    });
+    
+    // 指定した時間にシーク (改良���)
+    function seekMedia(time) {
+        try {
+            const duration = video.duration || videoDuration;
+            const seekTime = Math.max(appliedStartTime, Math.min(time, appliedEndTime));
+            video.currentTime = seekTime;
+            
             if (combinedAudioElement) {
-                combinedAudioElement.currentTime = startTime;
+                combinedAudioElement.currentTime = seekTime;
+                if (isPlaying) {
+                    combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
+                }
             }
+        } catch (error) {
+            console.error('メディアシークエラー:', error);
+        }
+    }
+    
+    // プログレスバー上でマウス移動時に時間を表示
+    progressContainer.addEventListener('mousemove', function(e) {
+        if (!video.duration) return;
+        
+        const rect = this.getBoundingClientRect();
+        const pos = (e.clientX - rect.left) / rect.width;
+        const hoverTime = pos * video.duration;
+        
+        const minutes = Math.floor(hoverTime / 60);
+        const seconds = Math.floor(hoverTime % 60);
+        const milliseconds = Math.floor((hoverTime % 1) * 100);
+        
+        progressTime.textContent = `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}.${String(milliseconds).padStart(2, '0')}`;
+        progressTime.style.display = 'block';
+        progressTime.style.left = `${pos * 100}%`;
+    });
+    
+    progressContainer.addEventListener('mouseleave', function() {
+        progressTime.style.display = 'none';
+    });
+    
+    // 動画クリックで再生/一時停止
+    video.addEventListener('click', function() {
+        togglePlayPause();
+    });
+
+    volumeSlider.addEventListener('input', function() {
+        if (!isAudioCombined) return;
+        
+        lastVolume = parseFloat(this.value);
+        applyVolume();
+    });
+    
+    volumeBtn.addEventListener('click', function() {
+        if (!isAudioCombined) return;
+        
+        if (video.volume > 0) {
+            lastVolume = parseFloat(volumeSlider.value);
+            volumeSlider.value = 0;
         } else {
-            pauseMedia();
-            video.currentTime = endTime;
+            volumeSlider.value = lastVolume;
+        }
+        
+        applyVolume();
+    });
+    
+    // 音量アイコンを更新
+    function updateVolumeIcon() {
+        if (video.volume === 0) {
+            volumeBtn.textContent = '🔇';
+        } else if (video.volume < 3) {
+            volumeBtn.textContent = '🔈';
+        } else {
+            volumeBtn.textContent = '🔊';
         }
     }
     
-    updateTimeDisplay();
-});
-                
-                // プログレスバークリックでシーク
-                progressContainer.addEventListener('click', function(e) {
-                    if (!video.duration) return;
-                    
-                    const rect = this.getBoundingClientRect();
-                    const pos = (e.clientX - rect.left) / rect.width;
-                    const seekTime = pos * video.duration;
-                    
-                    seekMedia(seekTime);
-                });
-                
-                // 指定した時間にシーク (改良版)
-                function seekMedia(time) {
-                    try {
-                        const duration = video.duration || videoDuration;
-                        const startTime = parseFloat(startTimeInput.value) || 0;
-                        const endTime = parseFloat(endTimeInput.value) || duration;
-                        
-                        const seekTime = Math.max(startTime, Math.min(time, endTime));
-                        video.currentTime = seekTime;
-                        
-                        if (combinedAudioElement) {
-                            combinedAudioElement.currentTime = seekTime;
-                            if (isPlaying) {
-                                combinedAudioElement.play().catch(e => console.error('音声再生エラー:', e));
-                            }
-                        }
-                    } catch (error) {
-                        console.error('メディアシークエラー:', error);
-                    }
-                }
-                
-                // プログレスバー上でマウス移動時に時間を表示
-                progressContainer.addEventListener('mousemove', function(e) {
-                    if (!video.duration) return;
-                    
-                    const rect = this.getBoundingClientRect();
-                    const pos = (e.clientX - rect.left) / rect.width;
-                    const hoverTime = pos * video.duration;
-                    
-                    const minutes = Math.floor(hoverTime / 60);
-                    const seconds = Math.floor(hoverTime % 60);
-                    const milliseconds = Math.floor((hoverTime % 1) * 100);
-                    
-                    progressTime.textContent = `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}.${String(milliseconds).padStart(2, '0')}`;
-                    progressTime.style.display = 'block';
-                    progressTime.style.left = `${pos * 100}%`;
-                });
-                
-                progressContainer.addEventListener('mouseleave', function() {
-                    progressTime.style.display = 'none';
-                });
-                
-                // 動画クリックで再生/一時停止
-                video.addEventListener('click', function() {
-                    togglePlayPause();
-                });
+    // 再生速度スライダー (動画プレイヤー)
+    speedSlider.addEventListener('input', function() {
+        if (!isAudioCombined) return;
+        
+        const speed = parseFloat(this.value);
+        speedValue.textContent = speed.toFixed(2) + 'x';
+        playbackSpeedSlider.value = speed;
+        playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
+        updatePlaybackRate(speed);
+    });
+    
+    // 再生速度スライダー (設定メニュー)
+    playbackSpeedSlider.addEventListener('input', function() {
+        if (!isAudioCombined) return;
+        
+        const speed = parseFloat(this.value);
+        playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
+        speedSlider.value = speed;
+        speedValue.textContent = speed.toFixed(2) + 'x';
+        updatePlaybackRate(speed);
+    });
+    
+    // テンポ入力による再生速度更新
+    tempoInput.addEventListener('input', function() {
+        const tempo = parseFloat(this.value);
+        const baseTempo = isTMode ? 66 : 92;
+        const speed = tempo / baseTempo;
+        
+        const clampedSpeed = Math.max(0.001, Math.min(5.0, speed));
+        
+        playbackSpeedSlider.value = clampedSpeed;
+        playbackSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
+        speedSlider.value = clampedSpeed;
+        speedValue.textContent = clampedSpeed.toFixed(2) + 'x';
+        tempoSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
+        
+        updatePlaybackRate(clampedSpeed);
+    });
+    
+    function updatePlaybackRate(speed) {
+        if (!isAudioCombined) return;
+        
+        currentPlaybackRate = speed;
+        video.playbackRate = speed;
+        
+        // ピッチ保持を再設定
+        video.preservesPitch = true;
+        video.mozPreservesPitch = true;
+        video.webkitPreservesPitch = true;
+        
+        if (combinedAudioElement) {
+            combinedAudioElement.playbackRate = speed;
             
-                volumeSlider.addEventListener('input', function() {
-                    if (!isAudioCombined) return;
-                    
-                    lastVolume = parseFloat(this.value);
-                    applyVolume();
-                });
-                
-                volumeBtn.addEventListener('click', function() {
-                    if (!isAudioCombined) return;
-                    
-                    if (video.volume > 0) {
-                        lastVolume = parseFloat(volumeSlider.value);
-                        volumeSlider.value = 0;
-                    } else {
-                        volumeSlider.value = lastVolume;
-                    }
-                    
-                    applyVolume();
-                });
-                
-                // 音量アイコンを更新
-                function updateVolumeIcon() {
-                    if (video.volume === 0) {
-                        volumeBtn.textContent = '🔇';
-                    } else if (video.volume < 3) {
-                        volumeBtn.textContent = '🔈';
-                    } else {
-                        volumeBtn.textContent = '🔊';
-                    }
-                }
-                
-                // 再生速度スライダー (動画プレイヤー)
-                speedSlider.addEventListener('input', function() {
-                    if (!isAudioCombined) return;
-                    
-                    const speed = parseFloat(this.value);
-                    speedValue.textContent = speed.toFixed(2) + 'x';
-                    playbackSpeedSlider.value = speed;
-                    playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
-                    updatePlaybackRate(speed);
-                });
-                
-                // 再生速度スライダー (設定メニュー)
-                playbackSpeedSlider.addEventListener('input', function() {
-                    if (!isAudioCombined) return;
-                    
-                    const speed = parseFloat(this.value);
-                    playbackSpeedValue.textContent = speed.toFixed(2) + 'x';
-                    speedSlider.value = speed;
-                    speedValue.textContent = speed.toFixed(2) + 'x';
-                    updatePlaybackRate(speed);
-                });
-                
-                // テンポ入力による再生速度更新
-                tempoInput.addEventListener('input', function() {
-                    const tempo = parseFloat(this.value);
-                    const baseTempo = isTMode ? 66 : 92;
-                    const speed = tempo / baseTempo;
-                    
-                    const clampedSpeed = Math.max(0.001, Math.min(5.0, speed));
-                    
-                    playbackSpeedSlider.value = clampedSpeed;
-                    playbackSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
-                    speedSlider.value = clampedSpeed;
-                    speedValue.textContent = clampedSpeed.toFixed(2) + 'x';
-                    tempoSpeedValue.textContent = clampedSpeed.toFixed(2) + 'x';
-                    
-                    updatePlaybackRate(clampedSpeed);
-                });
-                
-                function updatePlaybackRate(speed) {
-                    if (!isAudioCombined) return;
-                    
-                    currentPlaybackRate = speed;
-                    video.playbackRate = speed;
-                    
-                    // ピッチ保持を再設定
-                    video.preservesPitch = true;
-                    video.mozPreservesPitch = true;
-                    video.webkitPreservesPitch = true;
-                    
-                    if (combinedAudioElement) {
-                        combinedAudioElement.playbackRate = speed;
-                        
-                        // 合成音声のピッチ保持を設定
-                        combinedAudioElement.preservesPitch = true;
-                        combinedAudioElement.mozPreservesPitch = true;
-                        combinedAudioElement.webkitPreservesPitch = true;
-                    }
-                }
-                
-                // 全画面ボタン
-                fullscreenBtn.addEventListener('click', function() {
-                    if (!isFullscreen) {
-                        if (videoContainer.requestFullscreen) {
-                            videoContainer.requestFullscreen();
-                        } else if (videoContainer.webkitRequestFullscreen) {
-                            videoContainer.webkitRequestFullscreen();
-                        } else if (videoContainer.msRequestFullscreen) {
-                            videoContainer.msRequestFullscreen();
-                        }
-                    } else {
-                        if (document.exitFullscreen) {
-                            document.exitFullscreen();
-                        } else if (document.webkitExitFullscreen) {
-                            document.webkitExitFullscreen();
-                        } else if (document.msExitFullscreen) {
-                            document.msExitFullscreen();
-                        }
-                    }
-                });
-                
-                // 全画面変更イベント
-                document.addEventListener('fullscreenchange', handleFullscreenChange);
-                document.addEventListener('webkitfullscreenchange', handleFullscreenChange);
-                document.addEventListener('msfullscreenchange', handleFullscreenChange);
-                
-                function handleFullscreenChange() {
-                    isFullscreen = !!(document.fullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement);
-                    fullscreenBtn.textContent = isFullscreen ? '⛶' : '⛶';
-                    video.controls = false;
-                    
-                    // 全画面時にロックボタンを表示
-                    lockControlsBtn.style.display = isFullscreen ? 'flex' : 'none';
-                    
-                    // 全画面時にコントロールバー自動非表示機能を有効化
-                    if (isFullscreen) {
-                        resetControlsHideTimer();
-                        document.addEventListener('mousemove', handleFullscreenMouseMove);
-                    } else {
-                        document.removeEventListener('mousemove', handleFullscreenMouseMove);
-                        clearTimeout(controlsHideTimeout);
-                        showControls();
-                    }
-                }
-                
-                // 全画面時のマウス移動処理
-                function handleFullscreenMouseMove() {
-                    if (!isControlsLocked) {
-                        showControls();
-                        resetControlsHideTimer();
-                    }
-                }
-                
-                // コントロールバーを表示
-                function showControls() {
-                    if (!controlsVisible) {
-                        videoControls.style.opacity = '1';
-                        controlsVisible = true;
-                    }
-                }
-                
-                // コントロールバーを非表示
-                function hideControls() {
-                    if (!isControlsLocked && controlsVisible) {
-                        videoControls.style.opacity = '0';
-                        controlsVisible = false;
-                    }
-                }
-                
-                // コントロールバー非表示タイマーをリセット
-                function resetControlsHideTimer() {
-                    clearTimeout(controlsHideTimeout);
-                    if (!isControlsLocked) {
-                        controlsHideTimeout = setTimeout(hideControls, 1500); // 1.5秒後に非表示
-                    }
-                }
-                
-                // ロックボタンのクリック処理
-                lockControlsBtn.addEventListener('click', function() {
-                    isControlsLocked = !isControlsLocked;
-                    this.classList.toggle('locked', isControlsLocked);
-                    
-                    if (isControlsLocked) {
-                        showControls();
-                        clearTimeout(controlsHideTimeout);
-                    } else {
-                        resetControlsHideTimer();
-                    }
-                });
-                
-                // キーボードイベント (ESCで全画面終了)
-                document.addEventListener('keydown', function(e) {
-                    if (e.key === 'Escape' && isFullscreen) {
-                        if (document.exitFullscreen) {
-                            document.exitFullscreen();
-                        } else if (document.webkitExitFullscreen) {
-                            document.webkitExitFullscreen();
-                        } else if (document.msExitFullscreen) {
-                            document.msExitFullscreen();
-                        }
-                    }
-                });
-                
-                // ボリュームスライダーのイベント
-                audioSliders.forEach((slider, index) => {
-                    slider.addEventListener('input', function() {
-                        const value = parseFloat(this.value);
-                        volumeValues[index].textContent = value.toFixed(2);
-                        
-                        const percent = value * 100;
-                        this.style.backgroundSize = `${percent}% 100%`;
-                    });
-                });
-                
-                globalVolumeSlider.addEventListener('input', function() {
-                    const value = parseFloat(this.value);
-                    globalVolumeValue.textContent = value.toFixed(1);
-                    
-                    const percent = (value - this.min) / (this.max - this.min) * 100;
-                    this.style.backgroundSize = `${percent}% 100%`;
-                    
-                    applyVolume();
-                });
-                
-                // ループ設定変更時
-                loopCheckbox.addEventListener('change', function() {
-                    // 合成音声ではループは動画に依存する
-                });
-                
-                // 現在の秒数を開始時間に設定
-                setStartTimeBtn.addEventListener('click', function() {
-                    startTimeInput.value = video.currentTime.toFixed(2);
-                    updateProgressMarkers();
-                });
-                
-                // 現在の秒数を終了時間に設定
-                setEndTimeBtn.addEventListener('click', function() {
-                    endTimeInput.value = video.currentTime.toFixed(2);
-                    updateProgressMarkers();
-                });
-                
-                // 終了時間を動画の長さにリセット
-                resetEndTimeBtn.addEventListener('click', function() {
-                    endTimeInput.value = video.duration.toFixed(2);
-                    updateProgressMarkers();
-                });
-                
-                // プログレスバーのマーカーを更新
-                function updateProgressMarkers() {
-                    const duration = video.duration || videoDuration;
-                    const startTime = parseFloat(startTimeInput.value) || 0;
-                    const endTime = parseFloat(endTimeInput.value) || duration;
-                    
-                    if (duration > 0) {
-                        startMarker.style.left = `${(startTime / duration) * 100}%`;
-                        endMarker.style.left = `${(endTime / duration) * 100}%`;
-                        
-                        startMarker.style.display = 'block';
-                        endMarker.style.display = 'block';
-                    }
-                }
-                
-                // 開始/終了時間変更時にマーカーを更新
-                startTimeInput.addEventListener('input', updateProgressMarkers);
-                endTimeInput.addEventListener('input', updateProgressMarkers);
-                
-                // 合成ボタンクリック
-                combineButton.addEventListener('click', combineAudio);
-                
-                // プレビューボタンクリック
-                previewButton.addEventListener('click', togglePreview);
-                
-                // 同期ステータスを閉じる
-                syncStatusClose.addEventListener('click', function() {
-                    syncStatus.style.display = 'none';
-                });
-                
-                // 初期化
-                loadAudioFiles();
-                updateVolumeIcon();
-                volumeSlider.value = video.volume;
-                video.controls = false;
+            // 合成音声のピッチ保持を設定
+            combinedAudioElement.preservesPitch = true;
+            combinedAudioElement.mozPreservesPitch = true;
+            combinedAudioElement.webkitPreservesPitch = true;
+        }
+    }
+    
+    // 全画面ボタン
+    fullscreenBtn.addEventListener('click', function() {
+        if (!isFullscreen) {
+            if (videoContainer.requestFullscreen) {
+                videoContainer.requestFullscreen();
+            } else if (videoContainer.webkitRequestFullscreen) {
+                videoContainer.webkitRequestFullscreen();
+            } else if (videoContainer.msRequestFullscreen) {
+                videoContainer.msRequestFullscreen();
+            }
+        } else {
+            if (document.exitFullscreen) {
+                document.exitFullscreen();
+            } else if (document.webkitExitFullscreen) {
+                document.webkitExitFullscreen();
+            } else if (document.msExitFullscreen) {
+                document.msExitFullscreen();
+            }
+        }
+    });
+    
+    // 全画面変更イベント
+    document.addEventListener('fullscreenchange', handleFullscreenChange);
+    document.addEventListener('webkitfullscreenchange', handleFullscreenChange);
+    document.addEventListener('msfullscreenchange', handleFullscreenChange);
+    
+    function handleFullscreenChange() {
+        isFullscreen = !!(document.fullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement);
+        fullscreenBtn.textContent = isFullscreen ? '⛶' : '⛶';
+        video.controls = false;
+        
+        // 全画面時にロックボタンを表示
+        lockControlsBtn.style.display = isFullscreen ? 'flex' : 'none';
+        
+        // 全画面時にコントロールバー自動非表示機能を有効化
+        if (isFullscreen) {
+            resetControlsHideTimer();
+            document.addEventListener('mousemove', handleFullscreenMouseMove);
+        } else {
+            document.removeEventListener('mousemove', handleFullscreenMouseMove);
+            clearTimeout(controlsHideTimeout);
+            showControls();
+        }
+    }
+    
+    // 全画面時のマウス移動処理
+    function handleFullscreenMouseMove() {
+        if (!isControlsLocked) {
+            showControls();
+            resetControlsHideTimer();
+        }
+    }
+    
+    // コントロールバーを表示
+    function showControls() {
+        if (!controlsVisible) {
+            videoControls.style.opacity = '1';
+            controlsVisible = true;
+        }
+    }
+    
+    // コントロールバーを非表示
+    function hideControls() {
+        if (!isControlsLocked && controlsVisible) {
+            videoControls.style.opacity = '0';
+            controlsVisible = false;
+        }
+    }
+    
+    // コントロールバー非表示タイマーをリセット
+    function resetControlsHideTimer() {
+        clearTimeout(controlsHideTimeout);
+        if (!isControlsLocked) {
+            controlsHideTimeout = setTimeout(hideControls, 1500); // 1.5秒後に非表示
+        }
+    }
+    
+    // ロックボタンのクリック処理
+    lockControlsBtn.addEventListener('click', function() {
+        isControlsLocked = !isControlsLocked;
+        this.classList.toggle('locked', isControlsLocked);
+        
+        if (isControlsLocked) {
+            showControls();
+            clearTimeout(controlsHideTimeout);
+        } else {
+            resetControlsHideTimer();
+        }
+    });
+    
+    // キーボードイベント (ESCで全画面終了)
+    document.addEventListener('keydown', function(e) {
+        if (e.key === 'Escape' && isFullscreen) {
+            if (document.exitFullscreen) {
+                document.exitFullscreen();
+            } else if (document.webkitExitFullscreen) {
+                document.webkitExitFullscreen();
+            } else if (document.msExitFullscreen) {
+                document.msExitFullscreen();
+            }
+        }
+    });
+    
+    // ボリュームスライダーのイベント
+    audioSliders.forEach((slider, index) => {
+        slider.addEventListener('input', function() {
+            const value = parseFloat(this.value);
+            volumeValues[index].textContent = value.toFixed(2);
+            
+            const percent = value * 100;
+            this.style.backgroundSize = `${percent}% 100%`;
+        });
+    });
+    
+    globalVolumeSlider.addEventListener('input', function() {
+        const value = parseFloat(this.value);
+        globalVolumeValue.textContent = value.toFixed(1);
+        
+        const percent = (value - this.min) / (this.max - this.min) * 100;
+        this.style.backgroundSize = `${percent}% 100%`;
+        
+        applyVolume();
+    });
+    
+    // ループ設定変更時
+    loopCheckbox.addEventListener('change', function() {
+        // 合成音声ではループは動画に依存する
+    });
+    
+    // 現在の秒数を開始時間に設定
+    setStartTimeBtn.addEventListener('click', function() {
+        startTimeInput.value = video.currentTime.toFixed(2);
+        updateProgressMarkers();
+    });
+    
+    // 現在の秒数を終了時間に設定
+    setEndTimeBtn.addEventListener('click', function() {
+        endTimeInput.value = video.currentTime.toFixed(2);
+        updateProgressMarkers();
+    });
+    
+    // 終了時間を動画の長さにリセット
+    resetEndTimeBtn.addEventListener('click', function() {
+        endTimeInput.value = video.duration.toFixed(2);
+        updateProgressMarkers();
+    });
+    
+    // プログレスバーのマーカーを更新
+    function updateProgressMarkers() {
+        const duration = video.duration || videoDuration;
+        const startTime = parseFloat(startTimeInput.value) || 0;
+        const endTime = parseFloat(endTimeInput.value) || duration;
+        
+        if (duration > 0) {
+            // 開始時間が0の場合はマーカーを非表示
+            if (startTime <= 0) {
+                startMarker.style.display = 'none';
+            } else {
+                startMarker.style.left = `${(startTime / duration) * 100}%`;
+                startMarker.style.display = 'block';
+            }
+            
+            // 終了時間が動画の長さと同じ場合はマーカーを非表示
+            if (endTime >= duration) {
+                endMarker.style.display = 'none';
+            } else {
+                endMarker.style.left = `${(endTime / duration) * 100}%`;
+                endMarker.style.display = 'block';
+            }
+        }
+    }
+    
+    // 消画モードボタンのクリック処理
+    blankModeBtn.addEventListener('click', toggleBlankMode);
+    
+    // 合成ボタンクリック
+    combineButton.addEventListener('click', combineAudio);
+    
+    // プレビューボタンクリック
+    previewButton.addEventListener('click', togglePreview);
+    
+    // 同期ステータスを閉じる
+    syncStatusClose.addEventListener('click', function() {
+        syncStatus.style.display = 'none';
+    });
+    
+    // 初期化
+    loadAudioFiles();
+    updateVolumeIcon();
+    volumeSlider.value = video.volume;
+    video.controls = false;
+    
+    // スライダーの背景を初期化
+    function initSliderBackgrounds() {
+        const sliders = [
+            volumeSlider, 
+            speedSlider, 
+            globalVolumeSlider, 
+            playbackSpeedSlider, 
+            ...audioSliders
+        ];
+        
+        sliders.forEach(slider => {
+            if (slider) {
+                slider.style.backgroundImage = 'linear-gradient(#64ffda, #64ffda)';
+                slider.style.backgroundRepeat = 'no-repeat';
                 
-                // スライダーの背景を初期化
-                function initSliderBackgrounds() {
-                    const sliders = [
-                        volumeSlider, 
-                        speedSlider, 
-                        globalVolumeSlider, 
-                        playbackSpeedSlider, 
-                        ...audioSliders
-                    ];
-                    
-                    sliders.forEach(slider => {
-                        if (slider) {
-                            slider.style.backgroundImage = 'linear-gradient(#64ffda, #64ffda)';
-                            slider.style.backgroundRepeat = 'no-repeat';
-                            
-                            if (slider === globalVolumeSlider) {
-                                const percent = (slider.value - slider.min) / (slider.max - slider.min) * 100;
-                                slider.style.backgroundSize = `${percent}% 100%`;
-                                globalVolumeValue.textContent = slider.value;
-                            } else {
-                                slider.style.backgroundSize = `${slider.value * 100}% 100%`;
-                            }
-                        }
-                    });
+                if (slider === globalVolumeSlider) {
+                    const percent = (slider.value - slider.min) / (slider.max - slider.min) * 100;
+                    slider.style.backgroundSize = `${percent}% 100%`;
+                    globalVolumeValue.textContent = slider.value;
+                } else {
+                    slider.style.backgroundSize = `${slider.value * 100}% 100%`;
                 }
-                
-                initSliderBackgrounds();
-                startSyncCheck(); // 同期チェックを開始
-                
-                // 初期テンポ設定
-                tempoInput.value = isTMode ? 66 : 92;
-                tempoInput.dispatchEvent(new Event('input'));
-            });
-            // タイムマーカー関連のコードを修正
+            }
+        });
+    }
+    
+    initSliderBackgrounds();
+    startSyncCheck(); // 同期チェックを開始
+    
+    // 初期テンポ設定
+    tempoInput.value = isTMode ? 66 : 92;
+    tempoInput.dispatchEvent(new Event('input'));
+});
+
+// タイムマーカー関連のコード
 document.addEventListener('DOMContentLoaded', function() {
-    // まず必要なDOM要素を取得
+    // 必要なDOM要素を取得
     const startMarker = document.getElementById('start-marker');
     const endMarker = document.getElementById('end-marker');
     const video = document.getElementById('video');
@@ -2491,12 +2507,22 @@ document.addEventListener('DOMContentLoaded', function() {
                     if(startMarker) startMarker.style.left = `${(startTime / duration) * 100}%`;
                     if(endMarker) endMarker.style.left = `${(endTime / duration) * 100}%`;
 
-                    if(startMarker) startMarker.style.display = 'block';
-                    if(endMarker) endMarker.style.display = 'block';
+                    // 開始時間が0の場合はマーカーを非表示
+                    if(startTime <= 0 && startMarker) {
+                        startMarker.style.display = 'none';
+                    } else if(startMarker) {
+                        startMarker.style.display = 'block';
+                    }
+
+                    // 終了時間が動画の長さと同じ場合はマーカーを非表示
+                    if(endTime >= duration && endMarker) {
+                        endMarker.style.display = 'none';
+                    } else if(endMarker) {
+                        endMarker.style.display = 'block';
+                    }
             }
     }
 });
-            
         </script>
     </body>
 </html>