Merge pull request #91 from codeit-maso/feature/Yun

🎨 style: 반응형 기준 수정 (1024px -> 1023px , 768px -> 767px)

Author: Yun-Jinwoo

src/components/Card/Card.module.scss

@@ -133,13 +133,13 @@
   }
 }
 
-@media (max-width: 1024px) {
+@media (max-width: 1023px) {
   .card {
     height: 284px;
   }
 }
 
-@media (max-width: 768px) {
+@media (max-width: 767px) {
   .card {
     height: 230px;
 

src/components/Modal/Modal.module.scss

@@ -110,7 +110,7 @@
   }
 }
 
-@media (max-width: 768px) {
+@media (max-width: 767px) {
   .modal {
     width: calc(100% - 48px);
   }

src/pages/CreateRecipient/CreateRecipient.module.scss

@@ -177,7 +177,7 @@
   display: none;
 }
 
-@media (max-width: 1024px) {
+@media (max-width: 1023px) {
   .create-page {
     position: relative;
     min-height: calc(100vh - 57px - 65px);
@@ -189,8 +189,7 @@
   }
 }
 
-// 모바일 (768px 이하)
-@media (max-width: 768px) {
+@media (max-width: 767px) {
   .create-page {
     margin: 50px 20px 0;
 

src/pages/Recipient/Recipient.module.scss

@@ -95,7 +95,7 @@
   }
 }
 
-@media (max-width: 1024px) {
+@media (max-width: 1023px) {
   .card-container {
     grid-template-columns: repeat(2, calc((100% - 16px) / 2));
     gap: 16px;
@@ -123,7 +123,7 @@
   }
 }
 
-@media (max-width: 768px) {
+@media (max-width: 767px) {
   .card-container {
     grid-template-columns: repeat(1, 1fr);
     gap: 16px;