🎨 style: Modal 스타일 순서 변경

Author: Yun-Jinwoo

src/components/Modal/Modal.module.scss

@@ -1,42 +1,40 @@
 @use '../../assets/styles/variables.scss' as *;
 
 .backdrop {
+  display: flex;
   position: fixed;
   top: 0;
   left: 0;
+  z-index: 999;
   width: 100vw;
   height: 100vh;
-
   background-color: rgba(0, 0, 0, 0.6);
-  display: flex;
   justify-content: center;
   align-items: center;
-  z-index: 999;
 }
 
 .modal {
   display: flex;
+  flex-direction: column;
+  overflow: hidden;
   position: fixed;
   top: 50%;
   left: 50%;
-  transform: translate(-50%, -50%);
   z-index: 1000;
-  gap: 16px;
   width: 600px;
   height: 476px;
-  background-color: $white;
+  padding: 40px;
   border-radius: 20px;
+  background-color: $white;
+  transform: translate(-50%, -50%);
   box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.08);
-
-  flex-direction: column;
-  overflow: hidden;
-  padding: 40px;
+  gap: 16px;
 
   &__header {
     display: flex;
-    gap: 16px;
     justify-content: space-between;
     align-items: center;
+    gap: 16px;
     padding-bottom: 16px;
     border-bottom: 1px solid $gray-200;
   }
@@ -59,18 +57,18 @@
 
   &__user-info {
     display: flex;
-    flex: 1;
     flex-direction: column;
+    flex: 1;
     gap: 6px;
   }
 
   &__profile-name {
     display: -webkit-box;
-    -webkit-box-orient: vertical;
     overflow: hidden;
+    @include font-20-regular;
+    -webkit-box-orient: vertical;
     -webkit-line-clamp: 1;
     line-clamp: 1;
-    @include font-20-regular;
 
     span {
       @include font-20-bold;