diff --git a/src/assets/index.css b/src/assets/index.css
index fc3893a8..d411e6e4 100644
--- a/src/assets/index.css
+++ b/src/assets/index.css
@@ -235,6 +235,9 @@ html.dark ::-webkit-scrollbar-thumb {
   flex-direction: column;
   align-items: flex-start;
 }
+#MARKDOWN_CONTAINER .toastui-editor-contents iframe {
+  width: 100%;
+}
 [class^="toastui-editor-"] .toastui-editor-md-container {
   border-bottom: none;
 }
diff --git a/src/routes/chat/Layout/index.tsx b/src/routes/chat/Layout/index.tsx
index b949260e..bc3b5da2 100644
--- a/src/routes/chat/Layout/index.tsx
+++ b/src/routes/chat/Layout/index.tsx
@@ -109,7 +109,7 @@ const Layout: FC<Props> = ({
       <article ref={drop} className={`relative w-full rounded-r-2xl`}>
         {header}
         <main className="h-full w-full flex items-start justify-between relative" ref={messagesContainer}>
-          <div className="rounded-br-2xl w-full flex flex-col h-[calc(100vh_-_56px_-_18px)]">
+          <div className="rounded-br-2xl w-full flex flex-col h-[calc(100vh_-_64px)] md:h-[calc(100vh_-_56px_-_18px)]">
             {children}
             <div className={`px-2 py-0 md:p-4  ${selects ? "selecting" : ""}`}>
               {readonly ? (