diff --git a/src/pages/shop/section/productList/components/ButtonList.tsx b/src/pages/shop/section/productList/components/ButtonList.tsx
index 2cc254d..73aa5e1 100644
--- a/src/pages/shop/section/productList/components/ButtonList.tsx
+++ b/src/pages/shop/section/productList/components/ButtonList.tsx
@@ -7,13 +7,13 @@ const ButtonList = ({
   setActiveId,
 }: ButtonListProps) => {
   return (
-    <div className="w-full h-full gap-4 grid max-sm:grid-cols-1 max-md:grid-cols-2 md:grid-cols-4 ">
+    <div className="w-full h-full gap-4 flex flex-wrap justify-center max-sm:grid max-sm:grid-cols-1 ">
       {ProductsList?.map((i) => {
         return (
           <Button
             key={i.id}
             active={i.id === activeId}
-            extra="py-4 text-lg"
+            extra="py-2 text-lg"
             onClick={() => setActiveId(i.id)}
           >
             {i.title}
diff --git a/src/pages/tutorial/section/components/ListTutorial.tsx b/src/pages/tutorial/section/components/ListTutorial.tsx
index 8741906..80facc1 100644
--- a/src/pages/tutorial/section/components/ListTutorial.tsx
+++ b/src/pages/tutorial/section/components/ListTutorial.tsx
@@ -7,7 +7,7 @@ const ListTutorials = ({
 }: ListTutorialsProps) => {
   return (
     <div className="w-full h-full mt-4">
-      <ul className="grid grid-cols-2 gap-2 md:grid-cols-6 justify-center items-center">
+      <ul className="flex flex-wrap max-sm:grid max-sm:grid-cols-1 gap-2  justify-center items-center">
         {tutorialList?.map((i) => {
           return (
             <li