diff --git a/src/components/pages/ZaboPage/ZaboDetailPage.js b/src/components/pages/ZaboPage/ZaboDetailPage.js
index c4d31ba..a712dc2 100644
--- a/src/components/pages/ZaboPage/ZaboDetailPage.js
+++ b/src/components/pages/ZaboPage/ZaboDetailPage.js
@@ -1,3 +1,5 @@
+import 'moment/locale/ko';
+
 import React, { useCallback, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { Link, useHistory, useRouteMatch } from 'react-router-dom';
@@ -119,7 +121,7 @@ const ZaboDetailPage = props => {
   const schedule = schedules[0];
   const timePast = getLabeledTimeDiff (createdAt, 60, 60, 6, 0);
   const due = schedule ? moment (schedule.startAt).diff (moment (), 'days') : 0;
-  const dueFormat = schedule && moment (schedule.startAt).format ('MM/DD h:mm');
+  const dueFormat = schedule && moment (schedule.startAt).format ('MM월 DD일 (ddd) h:mm');
   const stats = [{
     type: 'like',
     count: likesCount,
@@ -186,10 +188,13 @@ const ZaboDetailPage = props => {
               {schedule && (
                 <CategoryW>
                   <button>{schedule.eventType}</button>
-                  <h3>{schedule.title}</h3>
-                  <div className="schedule-date">
-                    {dueFormat}
+                  <div className="container">
+                    <h3 className="title">{schedule.title}</h3>
+                    <div className="schedule-date">
+                      {dueFormat}
+                    </div>
                   </div>
+
                 </CategoryW>
               )}
               <section className="contents">
diff --git a/src/components/pages/ZaboPage/ZaboPage.styled.js b/src/components/pages/ZaboPage/ZaboPage.styled.js
index 99a590b..338e4bf 100644
--- a/src/components/pages/ZaboPage/ZaboPage.styled.js
+++ b/src/components/pages/ZaboPage/ZaboPage.styled.js
@@ -214,7 +214,6 @@ ZaboPageWrapper.Recommend = styled.section`
   }
 `;
 
-// TODO: temporal code - need to change
 export const CategoryW = styled.section`
   width: 99%;
   height: 66px;
@@ -236,8 +235,13 @@ export const CategoryW = styled.section`
     border: 0;
     margin-right: 8px;
     padding: 3px 8px;
+    white-space: nowrap;
   }
-  h3 {
+  .container{
+    display : flex;
+    flex-direction : row;
+  }
+  .title {
     color: #363636;
     font-size: 16px;
     font-weight: bold;
@@ -251,10 +255,16 @@ export const CategoryW = styled.section`
     color: #797979;
   }
   @media (max-width: 640px) {
-    flex-direction: column;
+    flex-direction: row;
     align-items: flex-start;
     height: 100%;
     padding: 14px 20px;
     button, h3 { margin-bottom: 5px }
+    .container{
+      flex-direction : column;
+    }
+    .schedule-date{
+      text-align: left;
+    }
   }
 `;