diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html
index 78be71cf..19a36c2d 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.html
@@ -1,6 +1,5 @@
 <div class="date-split">
   <span class="line"></span>
-  <!-- {{ message.sendDate | date: 'short' }} -->
-  <span class="date">{{ dateInfo }}2019.10.3</span>
+  <span class="date">{{ dateInfo }}</span>
   <span class="line"></span>
 </div>
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts
index f7356003..3f4d4891 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/date-splitter.component.ts
@@ -18,7 +18,7 @@ export class DateSplitterComponent implements OnInit {
   ngOnInit() {
     this.dateInfo = this.datePipe.transform(
       this.message.sendDate,
-      'yyyy-MM-dd EEE'
+      'yyyy.MM.dd EEE'
     );
   }
 }
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/information.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/information.component.html
index 899a0e49..d54534ca 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/information.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/information.component.html
@@ -1,3 +1,3 @@
-<p>
+<div>
   {{ contents }}
-</p>
+</div>
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.html
index cc60a60c..42373c8e 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.html
@@ -1,12 +1,11 @@
 <div class="bubble-main">
-  <span>
+  <span class="content">
     {{ content }}
   </span>
   <span>
     {{ message.sendDate | date: 'short' }}
   </span>
 </div>
-  {{detailButteonShow}}
 <div *ngIf="detailButteonShow" class="btn-box">
-    <button mat-button (click)="onClickDetailView()">Detail View</button>
+  <button mat-button (click)="onClickDetailView()">Detail View</button>
 </div>
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.scss
index aa2dfae1..ddad5bc9 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.scss
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass.component.scss
@@ -1,6 +1,12 @@
+@charset 'utf-8';
+@import '../../../../ucap-webmessenger-app/src/assets/scss/global/common.scss';
 .bubble-main {
   padding: 14px;
   text-align: left;
+  .content {
+    max-width: 250px;
+    @include ellipsis(1);
+  }
 }
 
 .btn-box {
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html
index 44021797..d07c3966 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.html
@@ -1,8 +1,5 @@
 <div class="chat-messages">
   <!-- MESSAGE -->
-  <ucap-chat-message-box-date-splitter *ngIf="getDateSplitter(i)" [message]="message">
-  </ucap-chat-message-box-date-splitter>
-
   <div
     *ngFor="let message of messages; let i = index"
     class="message-row"
@@ -11,6 +8,13 @@
       contact: message.senderSeq !== loginRes.userSeq
     }"
   >
+    <div>
+      <ucap-chat-message-box-date-splitter
+        *ngIf="getDateSplitter(i)"
+        [message]="message"
+      >
+      </ucap-chat-message-box-date-splitter>
+    </div>
 
     <div
       *ngIf="getIsInformation(message); then information; else contents"
@@ -46,7 +50,7 @@
     </ng-template>
     <ng-template #contents>
       <div *ngIf="getUserProfile(message.senderSeq) != ''" class="profile-img">
-            <!-- <img
+        <!-- <img
               class="avatar"
               style="width: 50px; height: 50px;"
               [src]="
@@ -59,71 +63,71 @@
                   | async
               "
             /> -->
-            <ucap-ui-imaage
-              [style]="'width: 50px; height: 50px;'"
-              [imageClass]="'avatar'"
-              [base]="profileImageRoot"
-              [path]="getUserProfile(message.senderSeq)"
-              [default]="'assets/images/img_nophoto_50.png'"
-            ></ucap-ui-imaage>
+        <ucap-ui-imaage
+          [style]="'width: 50px; height: 50px;'"
+          [imageClass]="'avatar'"
+          [base]="profileImageRoot"
+          [path]="getUserProfile(message.senderSeq)"
+          [default]="'assets/images/img_nophoto_50.png'"
+        ></ucap-ui-imaage>
       </div>
 
       <div class="message-main">
         <div class="chat-name">
-            {{ getUserName(message.senderSeq) }}
+          {{ getUserName(message.senderSeq) }}
         </div>
 
-      <div class="bubble">
-        <ng-container
-          class="bubble"
-          *ngIf="message.type !== EventType.NotificationForTimerRoom"
-          [ngSwitch]="message.type"
-        >
-          <ucap-chat-message-box-mass
-            *ngSwitchCase="EventType.MassText"
-            [message]="message"
-            (massDetail)="onMassDetail($event)"
+        <div class="bubble">
+          <ng-container
+            class="bubble"
+            *ngIf="message.type !== EventType.NotificationForTimerRoom"
+            [ngSwitch]="message.type"
           >
-          </ucap-chat-message-box-mass>
-          <ucap-chat-message-box-file
-            *ngSwitchCase="EventType.File"
-            [message]="message"
-            (save)="onSave($event)"
-            (imageViewer)="onImageViewer($event)"
-          >
-          </ucap-chat-message-box-file>
-          <ucap-chat-message-box-sticker
-            *ngSwitchCase="EventType.Sticker"
-            [message]="message"
-          >
-          </ucap-chat-message-box-sticker>
-          <ucap-chat-message-box-recall
-            *ngSwitchCase="EventType.RecalledMessage"
-          ></ucap-chat-message-box-recall>
-          <ucap-chat-message-box-text
-            *ngSwitchCase="EventType.Character"
-            [message]="message"
-            (contextmenu)="onContextMenuMessage($event, message)"
-          >
-          </ucap-chat-message-box-text>
-          <div *ngSwitchDefault>
-            mass-translation
-            <ucap-chat-message-box-mass-translation></ucap-chat-message-box-mass-translation>
-            notice
-            <ucap-chat-message-box-notice></ucap-chat-message-box-notice>
-            <ucap-chat-message-box-schedule></ucap-chat-message-box-schedule>
-            translation
-            <ucap-chat-message-box-translation></ucap-chat-message-box-translation>
-            video-conference
-            <ucap-chat-message-box-video-conference></ucap-chat-message-box-video-conference>
+            <ucap-chat-message-box-mass
+              *ngSwitchCase="EventType.MassText"
+              [message]="message"
+              (massDetail)="onMassDetail($event)"
+            >
+            </ucap-chat-message-box-mass>
+            <ucap-chat-message-box-file
+              *ngSwitchCase="EventType.File"
+              [message]="message"
+              (save)="onSave($event)"
+              (imageViewer)="onImageViewer($event)"
+            >
+            </ucap-chat-message-box-file>
+            <ucap-chat-message-box-sticker
+              *ngSwitchCase="EventType.Sticker"
+              [message]="message"
+            >
+            </ucap-chat-message-box-sticker>
+            <ucap-chat-message-box-recall
+              *ngSwitchCase="EventType.RecalledMessage"
+            ></ucap-chat-message-box-recall>
+            <ucap-chat-message-box-text
+              *ngSwitchCase="EventType.Character"
+              [message]="message"
+              (contextmenu)="onContextMenuMessage($event, message)"
+            >
+            </ucap-chat-message-box-text>
+            <div *ngSwitchDefault>
+              mass-translation
+              <ucap-chat-message-box-mass-translation></ucap-chat-message-box-mass-translation>
+              notice
+              <ucap-chat-message-box-notice></ucap-chat-message-box-notice>
+              <ucap-chat-message-box-schedule></ucap-chat-message-box-schedule>
+              translation
+              <ucap-chat-message-box-translation></ucap-chat-message-box-translation>
+              video-conference
+              <ucap-chat-message-box-video-conference></ucap-chat-message-box-video-conference>
 
-            <div class="message">
-              {{ message.sentMessage }}
+              <div class="message">
+                {{ message.sentMessage }}
+              </div>
             </div>
-          </div>
-        </ng-container>
+          </ng-container>
+        </div>
       </div>
-    </div>
 
       <div class="time secondary-text">
         {{ message.sendDate | date: 'a hh:mm' }}