diff --git a/src/components/common/VerticalScroll/VerticalScroll.style.ts b/src/components/common/VerticalScroll/VerticalScroll.style.ts
new file mode 100644
index 00000000..b3a10dd6
--- /dev/null
+++ b/src/components/common/VerticalScroll/VerticalScroll.style.ts
@@ -0,0 +1,12 @@
+import styled from '@emotion/styled';
+
+interface VerticalScrollStyledProps {
+  height: string;
+}
+
+const VerticalScrollStyled = styled.div<VerticalScrollStyledProps>`
+  height: ${({ height }) => height + 'rem'};
+  overflow: auto;
+`;
+
+export { VerticalScrollStyled };
diff --git a/src/components/common/VerticalScroll/VerticalScroll.tsx b/src/components/common/VerticalScroll/VerticalScroll.tsx
new file mode 100644
index 00000000..5ae2892d
--- /dev/null
+++ b/src/components/common/VerticalScroll/VerticalScroll.tsx
@@ -0,0 +1,16 @@
+import { VerticalScrollStyled } from './VerticalScroll.style';
+
+interface VerticalScrollProps extends React.HTMLAttributes<HTMLDivElement> {
+  children: React.ReactNode;
+  height: string;
+}
+
+const VerticalScroll = ({ children, height, ...props }: VerticalScrollProps) => {
+  return (
+    <VerticalScrollStyled height={height} {...props}>
+      {children}
+    </VerticalScrollStyled>
+  );
+};
+
+export default VerticalScroll;