diff --git a/src/modules/GroupChannel/components/MessageList/index.scss b/src/modules/GroupChannel/components/MessageList/index.scss
index 8c0008867..add69076f 100644
--- a/src/modules/GroupChannel/components/MessageList/index.scss
+++ b/src/modules/GroupChannel/components/MessageList/index.scss
@@ -10,9 +10,9 @@
     position: relative;
     height: 100%;
     overflow-x: hidden;
-    padding: 0px 24px;
+    padding: 0 $messages-padding;
     @include mobile() {
-      padding: 0px 12px;
+      padding: 0 $messages-padding-mobile;
     }
   }
   .sendbird-separator,
diff --git a/src/modules/GroupChannel/components/SuggestedReplies/index.scss b/src/modules/GroupChannel/components/SuggestedReplies/index.scss
index 1f4e78691..dedcfa51b 100644
--- a/src/modules/GroupChannel/components/SuggestedReplies/index.scss
+++ b/src/modules/GroupChannel/components/SuggestedReplies/index.scss
@@ -17,13 +17,29 @@
       margin-top: 8px;
     }
   }
+
   &.horizontal {
-    width: fit-content;
-    margin-left: 64px;
+    display: flex;
+    flex-direction: row;
+    overflow-x: scroll;
+
+    margin-left: -$messages-padding;
+    margin-right: -$messages-padding;
+    padding-left: $messages-padding;
+    padding-right: $messages-padding;
+    @include mobile() {
+      margin-left: -$messages-padding-mobile;
+      margin-right: -$messages-padding-mobile;
+      padding-left: calc(40px + $messages-padding-mobile);
+      padding-right: $messages-padding-mobile;
+    }
     .sendbird-suggested-replies__option:not(:last-child) {
       margin-right: 8px;
     }
   }
+  &::-webkit-scrollbar {
+    display: none;
+  }
   @include themed() {
     font-family: var(--sendbird-font-family-default);
   }
diff --git a/src/modules/GroupChannel/components/SuggestedReplies/index.tsx b/src/modules/GroupChannel/components/SuggestedReplies/index.tsx
index b5632b31f..9588bf741 100644
--- a/src/modules/GroupChannel/components/SuggestedReplies/index.tsx
+++ b/src/modules/GroupChannel/components/SuggestedReplies/index.tsx
@@ -207,15 +207,7 @@ const SuggestedReplies = ({ replyOptions, onSendMessage, type = 'vertical' }: Su
     );
   });
 
-  return (
-    type === 'vertical'
-      ? <div className="sendbird-suggested-replies vertical">
-        {children}
-      </div>
-      : <DraggableSuggestedReplies>
-        {children}
-      </DraggableSuggestedReplies>
-  );
+  return <div className={`sendbird-suggested-replies ${type}`}>{children}</div>;
 };
 
 export default SuggestedReplies;
diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss
index 26b7ad28b..8e3394ed8 100644
--- a/src/styles/_variables.scss
+++ b/src/styles/_variables.scss
@@ -1,2 +1,5 @@
 @import './color-themes';
 @import './media-query';
+
+$messages-padding: 24px;
+$messages-padding-mobile: 12px;