category

src/styles/_category.scss

@@ -11,11 +11,7 @@
   left: 0;
   width: 100%;
   height: 100%;
-  background: linear-gradient(
-    180deg,
-    rgba(0, 0, 0, 0) 50%,
-    rgba(0, 0, 0, 0.7) 100%
-  );
+  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.7) 100%);
   z-index: 2;
   pointer-events: none;
   display: flex;
@@ -70,3 +66,28 @@
   flex-direction: column;
   gap: 2.4rem;
 }
+
+@media (max-width: 1024px) {
+  .category-inner {
+    grid-template-columns: 1fr;
+    gap: 5.6rem;
+  }
+}
+
+@media (max-width: 750px) {
+  .main-img-overlay {
+    gap: 0.8rem;
+    padding: 1.6rem;
+    h2 {
+      font-size: 1.6rem;
+    }
+  }
+}
+
+@media (max-width: 550px) {
+  .main-img-overlay {
+    h2 {
+      font-size: 1.2rem;
+    }
+  }
+}