diff --git a/package-lock.json b/package-lock.json
index e51994b44..12ad1728b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4016,8 +4016,7 @@
     "node_modules/@sapphi-red/web-noise-suppressor": {
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/@sapphi-red/web-noise-suppressor/-/web-noise-suppressor-0.3.5.tgz",
-      "integrity": "sha512-jh3+V9yM+zxLriQexoGm0GatoPaJWjs6ypFIbFYwQp+AoUb55eUXrjKtKQyuC5zShzzeAQUl0M5JzqB7SSrsRA==",
-      "license": "MIT"
+      "integrity": "sha512-jh3+V9yM+zxLriQexoGm0GatoPaJWjs6ypFIbFYwQp+AoUb55eUXrjKtKQyuC5zShzzeAQUl0M5JzqB7SSrsRA=="
     },
     "node_modules/@shiguredo/virtual-background": {
       "version": "2023.2.0",
diff --git a/src/assets/mdi.ts b/src/assets/mdi.ts
index a438b5cb8..05e7af93f 100644
--- a/src/assets/mdi.ts
+++ b/src/assets/mdi.ts
@@ -39,6 +39,8 @@ import {
   mdiToggleSwitchOff,
   mdiToggleSwitch,
   mdiChevronDoubleLeft,
+  mdiChevronDoubleUp,
+  mdiChevronDoubleDown,
   mdiChevronLeft,
   mdiChevronRight,
   mdiBookmark,
@@ -86,7 +88,8 @@ import {
   mdiDelete,
   mdiVideo,
   mdiVideoOff,
-  mdiCommentTextMultipleOutline
+  mdiCommentTextMultipleOutline,
+  mdiCommentOffOutline
 } from '@mdi/js'
 
 interface MdiIconsMapping {
@@ -137,6 +140,8 @@ const mdi: MdiIconsMapping = {
   'toggle-switch-off': mdiToggleSwitchOff,
   'toggle-switch-on': mdiToggleSwitch,
   'chevron-double': mdiChevronDoubleLeft,
+  'chevron-double-up': mdiChevronDoubleUp,
+  'chevron-double-down': mdiChevronDoubleDown,
   'chevron-left': mdiChevronLeft,
   'chevron-right': mdiChevronRight,
   'chevron-up': mdiChevronUp,
@@ -181,7 +186,8 @@ const mdi: MdiIconsMapping = {
   delete: mdiDelete,
   video: mdiVideo,
   'video-off': mdiVideoOff,
-  'comment-outline': mdiCommentTextMultipleOutline
+  'comment-outline': mdiCommentTextMultipleOutline,
+  'comment-off-outline': mdiCommentOffOutline
 }
 
 export default mdi
diff --git a/src/components/Main/MainView/QallView/BackgroundSettingsModal.vue b/src/components/Main/MainView/QallView/BackgroundSettingsModal.vue
index fb52aac7c..466b61fbc 100644
--- a/src/components/Main/MainView/QallView/BackgroundSettingsModal.vue
+++ b/src/components/Main/MainView/QallView/BackgroundSettingsModal.vue
@@ -79,9 +79,7 @@ const handleApply = () => {
           <button :class="$style.cancelButton" @click="onClose">
             キャンセル
           </button>
-          <button :class="$style.applyButton" @click="handleApply">
-            適用
-          </button>
+          <button :class="$style.applyButton" @click="handleApply">適用</button>
         </div>
       </div>
     </div>
@@ -161,7 +159,7 @@ const handleApply = () => {
   background-color: transparent;
   border: 1px solid $theme-ui-secondary;
   color: $theme-ui-secondary;
-  
+
   &:hover {
     background-color: rgba($theme-ui-secondary, 0.1);
   }
@@ -170,7 +168,7 @@ const handleApply = () => {
 .applyButton {
   background-color: $theme-accent-primary;
   color: white;
-  
+
   &:hover {
     background-color: darken($theme-accent-primary, 5%);
   }
diff --git a/src/components/Main/MainView/QallView/DanmakuComment.vue b/src/components/Main/MainView/QallView/DanmakuComment.vue
index 3b22652b8..94c1bad45 100644
--- a/src/components/Main/MainView/QallView/DanmakuComment.vue
+++ b/src/components/Main/MainView/QallView/DanmakuComment.vue
@@ -51,5 +51,6 @@ const startAnimation = () => {
   font-size: 32px;
   color: black;
   text-shadow: 1px 1px 2px white;
+  z-index: 301;
 }
 </style>
diff --git a/src/components/Main/MainView/QallView/DanmakuContainer.vue b/src/components/Main/MainView/QallView/DanmakuContainer.vue
index 2108fea7e..dce1e600c 100644
--- a/src/components/Main/MainView/QallView/DanmakuContainer.vue
+++ b/src/components/Main/MainView/QallView/DanmakuContainer.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { nextTick, onMounted, ref, useTemplateRef } from 'vue'
+import { nextTick, ref, useTemplateRef } from 'vue'
 import DanmakuComment from './DanmakuComment.vue'
 import DanmakuStamp from './DanmakuStamp.vue'
 
@@ -57,37 +57,21 @@ messageMitt.on('updateMessage', async message => {
 })
 
 useMittListener(qallMitt, 'pushStamp', stamp => {
-  sparkle(stamp)
+  stamps.value.push({
+    id: Math.random().toString(36).substring(2, 15),
+    stampId: stamp
+  })
+  setTimeout(() => {
+    stamps.value.shift()
+  }, 1400)
+
+  //TODO: 出現ロジックを考える
+  if (Math.random() < 0.005) {
+    sparkle(stamp)
+  }
 })
 
 const { sparkle } = useDanmakuSparkle(showSparkle)
-
-onMounted(() => {
-  // 一定間隔でコメントを生成
-  setInterval(() => {
-    comments.value.push({
-      id: Math.random().toString(36).substring(2, 15),
-      markdown: 'うおおおおおおおおおお!:tada::tada.party::tada.parrot:'
-    })
-    setTimeout(() => {
-      comments.value.shift()
-    }, 6000)
-  }, 1000)
-
-  setInterval(() => {
-    stamps.value.push({
-      id: Math.random().toString(36).substring(2, 15),
-      stampId: '69c10725-2176-45ac-a4a5-22e70b8a76f7'
-    })
-    setTimeout(() => {
-      stamps.value.shift()
-    }, 1400)
-  }, 1000)
-
-  setInterval(() => {
-    sparkle('e0e0c3a6-c544-4c96-8529-d597563fd1ad')
-  }, 5000)
-})
 </script>
 
 <template>
diff --git a/src/components/Main/MainView/QallView/DanmakuStamp.vue b/src/components/Main/MainView/QallView/DanmakuStamp.vue
index fa24849e3..a14b7d522 100644
--- a/src/components/Main/MainView/QallView/DanmakuStamp.vue
+++ b/src/components/Main/MainView/QallView/DanmakuStamp.vue
@@ -57,5 +57,6 @@ onMounted(() => startAnimation())
   font-size: 32px;
   color: black;
   text-shadow: 1px 1px 2px white;
+  z-index: 300;
 }
 </style>
diff --git a/src/components/Main/MainView/QallView/QallMessageView.vue b/src/components/Main/MainView/QallView/QallMessageView.vue
index b67ecf69e..c5ccd2bf0 100644
--- a/src/components/Main/MainView/QallView/QallMessageView.vue
+++ b/src/components/Main/MainView/QallView/QallMessageView.vue
@@ -8,6 +8,7 @@ import useChannelMessageFetcher from '../ChannelView/ChannelViewContent/composab
 import { useChannelsStore } from '/@/store/entities/channels'
 import MessageElement from '/@/components/Main/MainView/MessageElement/MessageElement.vue'
 import { useSubscriptionStore } from '/@/store/domain/subscription'
+import IconButton from '/@/components/UI/IconButton.vue'
 
 const props = defineProps<{
   channelId: ChannelId
@@ -56,20 +57,6 @@ const handleScroll = () => {
     showToNewMessageButton.value = true
   }
 }
-
-const handleMessage = () => {
-  if (isMessageShow.value) {
-    isMessageShow.value = false
-    toNewMessage('smooth')
-  } else {
-    isMessageShow.value = true
-    nextTick(() => toNewMessage())
-  }
-}
-
-defineExpose({
-  handleMessage
-})
 </script>
 
 <template>
@@ -77,39 +64,66 @@ defineExpose({
     :class="$style.container"
     :data-is-not-messages-show="$boolAttr(!isMessageShow)"
   >
-    <div :class="$style.mainViewConteiner">
-      <div :class="$style.messageContainer">
+    <div :class="$style.mainViewContainer">
+      <div
+        :class="$style.messageContainer"
+        :data-is-not-messages-show="$boolAttr(!isMessageShow)"
+      >
         <scroll-loading-bar
           :class="$style.loadingBar"
           :show="isLoading && isMessageShow"
         />
         <transition name="fade-bottom" mode="out-in">
-          <messages-scroller
+          <div
             v-if="isMessageShow"
-            ref="scrollerEle"
-            :message-ids="messageIds"
-            :is-reached-end="isReachedEnd"
-            :is-reached-latest="isReachedLatest"
-            :is-loading="isLoading"
-            :last-loading-direction="lastLoadingDirection"
-            @request-load-former="onLoadFormerMessagesRequest"
-            @request-load-latter="onLoadLatterMessagesRequest"
-            @scroll-passive="handleScroll"
-            @reset-is-reached-latest="resetIsReachedLatest"
+            :class="$style.messageContainerBackgroundContainer"
           >
-            <template
-              #default="{ messageId, onChangeHeight, onEntryMessageLoaded }"
+            <div :class="$style.messageContainerBackground"></div>
+
+            <messages-scroller
+              v-if="isMessageShow"
+              ref="scrollerEle"
+              :message-ids="messageIds"
+              :is-reached-end="isReachedEnd"
+              :is-reached-latest="isReachedLatest"
+              :is-loading="isLoading"
+              :last-loading-direction="lastLoadingDirection"
+              @request-load-former="onLoadFormerMessagesRequest"
+              @request-load-latter="onLoadLatterMessagesRequest"
+              @scroll-passive="handleScroll"
+              @reset-is-reached-latest="resetIsReachedLatest"
             >
-              <message-element
-                :class="$style.element"
-                :message-id="messageId"
-                :is-archived="isArchived"
-                @change-height="onChangeHeight"
-                @entry-message-loaded="onEntryMessageLoaded"
-              />
-            </template>
-          </messages-scroller>
+              <template
+                #default="{ messageId, onChangeHeight, onEntryMessageLoaded }"
+              >
+                <message-element
+                  :class="$style.element"
+                  :message-id="messageId"
+                  :is-archived="isArchived"
+                  @change-height="onChangeHeight"
+                  @entry-message-loaded="onEntryMessageLoaded"
+                />
+              </template>
+            </messages-scroller>
+          </div>
         </transition>
+        <div :class="[$style.uiElement, $style.uiToggleButton]">
+          <IconButton
+            :icon-name="`chevron-double-${isMessageShow ? 'down' : 'up'}`"
+            icon-mdi
+            @click="
+              () => {
+                if (isMessageShow) {
+                  isMessageShow = false
+                  toNewMessage('smooth')
+                } else {
+                  isMessageShow = true
+                  nextTick(() => toNewMessage())
+                }
+              }
+            "
+          />
+        </div>
       </div>
       <slot name="default"></slot>
     </div>
@@ -130,7 +144,7 @@ defineExpose({
   flex-direction: column;
 }
 
-.mainViewConteiner {
+.mainViewContainer {
   flex-grow: 1;
   position: relative;
 }
@@ -139,7 +153,8 @@ defineExpose({
   position: absolute;
   bottom: 0;
   right: 0;
-  width: 30%;
+  width: 33%;
+  min-width: 25rem;
   height: 100%;
 
   display: flex;
@@ -149,13 +164,33 @@ defineExpose({
   &[data-is-not-messages-show] {
     pointer-events: none;
   }
+  z-index: 400;
+}
+
+.messageContainerBackgroundContainer {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.messageContainerBackground {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0.7;
+  backdrop-filter: blur(100px);
+
+  @include background-primary;
 }
 
 .loadingBar {
   position: absolute;
   top: 0;
-  left: 0;
-  right: 0;
+  width: 100%;
   height: 12px;
   z-index: $z-index-message-loading;
 }
@@ -174,4 +209,14 @@ defineExpose({
 .uiElement {
   pointer-events: all;
 }
+
+.uiToggleButton {
+  @include color-ui-secondary;
+  @include background-primary;
+  padding: 0.5rem;
+  border-radius: 2rem;
+  position: absolute;
+  bottom: 1rem;
+  right: 1rem;
+}
 </style>
diff --git a/src/components/Main/MainView/QallView/QallView.vue b/src/components/Main/MainView/QallView/QallView.vue
index 0b92ed0fc..e2120af3f 100644
--- a/src/components/Main/MainView/QallView/QallView.vue
+++ b/src/components/Main/MainView/QallView/QallView.vue
@@ -67,6 +67,7 @@ const toggleVideo = async () => {
       isCameraOn.value = false
     }
   } catch (err) {
+    // eslint-disable-next-line no-console
     console.error('Failed to toggle video:', err)
   }
 }
@@ -89,6 +90,7 @@ const toggleScreen = async () => {
       isScreenSharing.value = false
     }
   } catch (err) {
+    // eslint-disable-next-line no-console
     console.error('Failed to toggle screen sharing:', err)
   }
 }
@@ -175,23 +177,22 @@ const handleBackgroundSave = (data: {
 const showCameraDetailSetting = ref(false)
 const showShareScreenSettingDetail = ref(false)
 
-const childRef = ref<InstanceType<typeof QallMessageView> | null>(null)
-
-const showMessage = () => {
-  childRef.value?.handleMessage()
+const showDanmaku = ref(true)
+const toggleDanmaku = () => {
+  showDanmaku.value = !showDanmaku.value
 }
 </script>
 
 <template>
   <div :class="$style.Block">
-    <QallMessageView
-      ref="childRef"
-      :channel-id="callingChannel"
-      :typing-users="[]"
-    >
-      <DanmakuContainer />
+    <QallMessageView :channel-id="callingChannel" :typing-users="[]">
+      <DanmakuContainer v-if="showDanmaku" />
       <div :class="$style.iconContainer">
-        <IconButton icon-name="comment-outline" icon-mdi @click="showMessage" />
+        <IconButton
+          :icon-name="`comment${showDanmaku ? '' : '-off'}-outline`"
+          icon-mdi
+          @click="toggleDanmaku"
+        />
         <IconButton icon-name="close" icon-mdi @click="isSubView = true" />
       </div>
       <div :class="$style.stackContainer">
diff --git a/src/components/Main/MainView/QallView/ScreenShareComponent.vue b/src/components/Main/MainView/QallView/ScreenShareComponent.vue
index 69644119a..01eec8f15 100644
--- a/src/components/Main/MainView/QallView/ScreenShareComponent.vue
+++ b/src/components/Main/MainView/QallView/ScreenShareComponent.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, onUnmounted, ref, useTemplateRef } from 'vue'
+import { ref } from 'vue'
 import type { TrackInfo } from '/@/composables/qall/useLiveKitSDK'
 import AudioTrack from './AudioTrack.vue'
 import VideoComponent from './VideoComponent.vue'
diff --git a/src/components/Main/MainView/QallView/SoundBoard.vue b/src/components/Main/MainView/QallView/SoundBoard.vue
index af891e0e6..1cfed90d1 100644
--- a/src/components/Main/MainView/QallView/SoundBoard.vue
+++ b/src/components/Main/MainView/QallView/SoundBoard.vue
@@ -67,7 +67,7 @@ onMounted(() => {
   padding: 0.5rem;
   bottom: 48px;
   left: 0;
-  height: 30rem;
+  height: 4rem;
   overflow-y: scroll;
   border-radius: 0.5rem;
   @include background-primary;
diff --git a/src/components/Main/MainView/QallView/SoundBoardElement.vue b/src/components/Main/MainView/QallView/SoundBoardElement.vue
index 5afc2a129..ddefa9973 100644
--- a/src/components/Main/MainView/QallView/SoundBoardElement.vue
+++ b/src/components/Main/MainView/QallView/SoundBoardElement.vue
@@ -4,7 +4,6 @@ const { soundName, stampId } = defineProps<{
   soundName: string
   stampId: string
 }>()
-console.log(stampId)
 </script>
 
 <template>
diff --git a/src/components/Main/MainView/QallView/UserCard.vue b/src/components/Main/MainView/QallView/UserCard.vue
index d2b55e21a..5d5b6ac64 100644
--- a/src/components/Main/MainView/QallView/UserCard.vue
+++ b/src/components/Main/MainView/QallView/UserCard.vue
@@ -14,7 +14,7 @@ const iconImage = computed(() => buildUserIconPath(userIconFileId.value))
 </script>
 
 <template>
-  <div :class="$style.UserCard">
+  <div v-if="user" :class="$style.UserCard">
     <div :class="$style.OuterIcon">
       <img :src="iconImage" :class="$style.OuterImage" />
     </div>
@@ -39,6 +39,7 @@ const iconImage = computed(() => buildUserIconPath(userIconFileId.value))
 
 .InnerIcon {
   width: calc(100% / 3);
+  max-width: 128px;
   aspect-ratio: 1;
   background-size: cover;
   border-radius: 50%;
diff --git a/src/components/Main/MainView/QallView/UserList.vue b/src/components/Main/MainView/QallView/UserList.vue
index a8520b3d6..d2364aea3 100644
--- a/src/components/Main/MainView/QallView/UserList.vue
+++ b/src/components/Main/MainView/QallView/UserList.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useQall } from '/@/composables/qall/useQall'
 import VideoComponent from '/@/components/Main/MainView/QallView/VideoComponent.vue'
-import { onMounted, ref } from 'vue'
+import { onMounted, onUnmounted, ref, useTemplateRef, watchEffect } from 'vue'
 import ScreenShareComponent from './ScreenShareComponent.vue'
 import UserCard from './UserCard.vue'
 
@@ -16,6 +16,49 @@ onMounted(async () => {
 const selectedVideoInput = ref<MediaDeviceInfo>()
 const selectedSid = ref<string>()
 const showAllTracks = ref(false)
+
+const largeCard = useTemplateRef<HTMLDivElement>('largeCard')
+const largeCardParent = useTemplateRef<HTMLDivElement>('largeCardParent')
+
+const resizeObserver = new ResizeObserver(entries => {
+  for (const entry of entries) {
+    const element = entry.target
+    keepAspectRatio(element)
+  }
+})
+
+const keepAspectRatio = (element: Element) => {
+  if (!(element instanceof HTMLDivElement)) return
+  if (!largeCard.value) return
+  const { height, width } = element.getBoundingClientRect()
+  const originalRatio = height / width
+  const targetRatio = 9 / 16
+
+  let newWidth
+  let newHeight
+
+  if (originalRatio > targetRatio) {
+    newWidth = width
+    newHeight = (newWidth * 9) / 16
+  } else {
+    newHeight = height
+    newWidth = (newHeight * 16) / 9
+  }
+  largeCard.value.style.width = `${newWidth}px`
+  largeCard.value.style.height = `${newHeight}px`
+}
+
+watchEffect(() => {
+  if (!largeCardParent.value) return
+  resizeObserver.unobserve(largeCardParent.value)
+  resizeObserver.observe(largeCardParent.value)
+  keepAspectRatio(largeCardParent.value)
+})
+
+onUnmounted(() => {
+  if (!largeCardParent.value) return
+  resizeObserver.unobserve(largeCardParent.value)
+})
 </script>
 
 <template>
@@ -25,31 +68,33 @@ const showAllTracks = ref(false)
     :class="$style.parentContainer"
   >
     <div :class="$style.flexContainer">
-      <div :class="$style.largeCard">
-        <VideoComponent
-          v-if="
-            selectedTrack.trackPublication?.kind === 'video' &&
-            !screenShareTrackSidMap.has(selectedSid ?? '')
-          "
-          :track-info="selectedTrack"
-        />
-        <ScreenShareComponent
-          v-else-if="selectedTrack.trackPublication?.kind === 'video'"
-          :track-info="selectedTrack"
-          :audio-track-info="
-            tracksMap.get(screenShareTrackSidMap.get(selectedSid ?? '') ?? '')
-          "
-          not-mute
-        />
-        <UserCard
-          v-else-if="
-            selectedTrack.trackPublication?.kind === 'audio' &&
-            !screenShareTrackSidMap
-              .values()
-              ?.some?.(valueSid => valueSid === selectedSid)
-          "
-          :track-info="selectedTrack"
-        />
+      <div ref="largeCardParent" :class="$style.largeCardParent">
+        <div ref="largeCard" :class="$style.largeCard">
+          <VideoComponent
+            v-if="
+              selectedTrack.trackPublication?.kind === 'video' &&
+              !screenShareTrackSidMap.has(selectedSid ?? '')
+            "
+            :track-info="selectedTrack"
+          />
+          <ScreenShareComponent
+            v-else-if="selectedTrack.trackPublication?.kind === 'video'"
+            :track-info="selectedTrack"
+            :audio-track-info="
+              tracksMap.get(screenShareTrackSidMap.get(selectedSid ?? '') ?? '')
+            "
+            not-mute
+          />
+          <UserCard
+            v-else-if="
+              selectedTrack.trackPublication?.kind === 'audio' &&
+              !screenShareTrackSidMap
+                .values()
+                ?.some?.(valueSid => valueSid === selectedSid)
+            "
+            :track-info="selectedTrack"
+          />
+        </div>
       </div>
 
       <div :class="$style.subViewContainer">
@@ -156,13 +201,22 @@ const showAllTracks = ref(false)
   width: 100%;
 }
 
-.largeCard {
+.largeCardParent {
   flex-grow: 1;
+  max-width: 100%;
+  max-height: 100%;
   width: 100%;
+  height: 100%;
   display: flex;
   flex-direction: column;
 }
 
+.largeCard {
+  width: 100%;
+  height: 100%;
+  margin: 0 auto;
+}
+
 .subViewContainer {
   flex-grow: 0;
   height: 108px;
diff --git a/src/composables/qall/useLiveKitSDK.ts b/src/composables/qall/useLiveKitSDK.ts
index 4bf9177cd..1a378bbd7 100644
--- a/src/composables/qall/useLiveKitSDK.ts
+++ b/src/composables/qall/useLiveKitSDK.ts
@@ -26,13 +26,11 @@ import rnnoiseSimdWasmPath from '@sapphi-red/web-noise-suppressor/rnnoise_simd.w
 import {
   loadRnnoise as loadRnnoiseLib,
   loadSpeex as loadSpeexLib,
-  NoiseGateWorkletNode,
   RnnoiseWorkletNode,
   SpeexWorkletNode
 } from '@sapphi-red/web-noise-suppressor'
 import speexWasmPath from '@sapphi-red/web-noise-suppressor/speex.wasm?url'
 import speexWorkletPath from '@sapphi-red/web-noise-suppressor/speexWorklet.js?url'
-import noiseGateWorkletPath from '@sapphi-red/web-noise-suppressor/noiseGateWorklet.js?url'
 
 type NoiseSuppressionType = 'rnnoise' | 'speex' | 'none'
 
@@ -263,7 +261,8 @@ async function leaveRoom() {
 const addMicTrack = async () => {
   let stream: MediaStream | undefined
 
-  const noiseSuppression=useRtcSettings().noiseSuppression.value as NoiseSuppressionType
+  const noiseSuppression = useRtcSettings().noiseSuppression
+    .value as NoiseSuppressionType
   try {
     if (!room.value?.localParticipant?.permissions?.canPublish) {
       throw new Error('権限がありません')
@@ -275,7 +274,7 @@ const addMicTrack = async () => {
 
     stream = await navigator.mediaDevices.getUserMedia({ audio: true })
     const source = audioContext.value.createMediaStreamSource(stream)
-    
+
     let lastNode: AudioNode = source
 
     if (noiseSuppression === 'rnnoise') {
@@ -283,7 +282,6 @@ const addMicTrack = async () => {
         loadRnnoiseWasmBinary(),
         audioContext.value?.audioWorklet.addModule(rnnoiseWorkletPath)
       ])
-      console.log("rnnoise process")
       const rnnoiseNode = new RnnoiseWorkletNode(audioContext.value, {
         wasmBinary: rnnoiseBinary,
         maxChannels: 2
@@ -321,14 +319,14 @@ const addMicTrack = async () => {
       dtx: false
     })
     isMicOn.value = true
-
   } catch (e) {
+    // eslint-disable-next-line no-console
     console.error(e)
     // Cleanup
     stream?.getTracks().forEach(track => track.stop())
     if (audioContext.value) {
       await audioContext.value.close()
-      audioContext.value = undefined  
+      audioContext.value = undefined
     }
     addErrorToast('マイクの共有に失敗しました')
   }
@@ -352,6 +350,7 @@ const removeMicTrack = async () => {
     }
     // await room.value.localParticipant.setMicrophoneEnabled(false)
   } catch (e) {
+    // eslint-disable-next-line no-console
     console.error(e)
     addErrorToast('マイクのミュートに失敗しました')
   }