diff --git a/desafio-react-typescript/src/assets/svgs/plus.svg b/desafio-react-typescript/src/assets/svgs/plus.svg
new file mode 100644
index 0000000..d64bfd8
--- /dev/null
+++ b/desafio-react-typescript/src/assets/svgs/plus.svg
@@ -0,0 +1,3 @@
+<svg width="8" height="9" viewBox="0 0 8 9" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.625 3.32031H7.79688V4.6875H4.625V8.28125H3.17188V4.6875H0V3.32031H3.17188V0H4.625V3.32031Z" fill="#303030"/>
+</svg>
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.module.scss b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.module.scss
index 2fbbd9d..1d800d8 100644
--- a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.module.scss
+++ b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.module.scss
@@ -19,6 +19,8 @@
 
     @include mq($lg, max) {
       flex-direction: column;
+      width: 100%;
+      gap: 12px;
     }
 
     @include mq($xl, min) {
@@ -34,3 +36,4 @@
     }
   }
 }
+
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.tsx b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.tsx
index c7cdbfe..8b9f38a 100644
--- a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.tsx
+++ b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/FooterTop.tsx
@@ -1,24 +1,25 @@
 import React from "react";
-import MenuListInfo from "./components/MenuListInfo";
-import MenuListLink from "./components/MenuListLink";
+
+import MenuListInfo from "./components/InfoFaleConosco";
 import RedesSociais from "./components/RedesSociais";
 
 import styles from "./FooterTop.module.scss";
+import InfoLinks from "./components/InfoLinks";
 
 const FooterTop = () => {
   return (
     <div className={styles["footerTop"]}>
       <div className={styles["footerTop__menu-link-wrapper"]}>
-        <MenuListLink
-          title="institucional"
+        <InfoLinks
+          title="Institucional"
           list={[
             "Quem somos",
-            "Política de Privacidade",
+            "Politíca de Privacidade",
             "Segurança",
             "Seja um Revendedor",
           ]}
         />
-        <MenuListLink
+        <InfoLinks
           title="Dúvidas"
           list={[
             "Entrega",
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListInfo.module.scss b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoFaleConosco.module.scss
similarity index 69%
rename from desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListInfo.module.scss
rename to desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoFaleConosco.module.scss
index d78f21b..abc2f78 100644
--- a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListInfo.module.scss
+++ b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoFaleConosco.module.scss
@@ -3,6 +3,26 @@
 .menu-list {
   width: 21.923623%;
 
+  @include mq($lg, max) {
+    width: 100%;
+  }
+
+  &__unselect{
+    display: none;
+  }
+
+  &__title-wrapper {
+    @include display(flex, row, center, space-between);
+
+    img {
+      display: none;
+
+      @include mq($lg, max) {
+        display: block;
+      }
+    }
+  }
+
   &__title {
     @include fontStyle(500, 14px, 16px, $primary-200);
     text-transform: uppercase;
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoFaleConosco.tsx b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoFaleConosco.tsx
new file mode 100644
index 0000000..b71add0
--- /dev/null
+++ b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoFaleConosco.tsx
@@ -0,0 +1,56 @@
+import React, { useState, useEffect } from "react";
+
+import styles from "./InfoFaleConosco.module.scss";
+import plus from "../../../../../assets/svgs/plus.svg";
+
+const InfoFaleConosco = () => {
+  const verificarTamanhoDaWindow = () => {
+    if (window.innerWidth <= 1024) {
+      return false;
+    } else {
+      return true;
+    }
+  };
+
+  const [isActive, setIsActive] = useState(verificarTamanhoDaWindow());
+
+  useEffect(() => {
+    window.addEventListener("resize", () => {
+      if (window.innerWidth <= 1024) {
+        setIsActive(false);
+      } else {
+        setIsActive(true);
+      }
+    });
+  });
+  return (
+    <section className={styles["menu-list"]}>
+      <div className={styles["menu-list__title-wrapper"]}>
+        <h4 className={styles["menu-list__title"]}>Fale Conosco</h4>
+        <img
+          src={plus}
+          alt="Abrir/Fechar"
+          onClick={() => setIsActive(!isActive)}
+        />
+      </div>
+      {isActive && (
+        <ul
+          className={
+            isActive
+              ? `${styles["menu-list__container"]}`
+              : `${styles["menu-list__unselect"]}`
+          }
+        >
+          <li className={styles["menu-list__item"]}>
+            Atendimento Ao Consumidor
+          </li>
+          <li className={styles["menu-list__telephone"]}>(11) 4159 9504</li>
+          <li className={styles["menu-list__item"]}>Atendimento Online</li>
+          <li className={styles["menu-list__telephone"]}>(11) 99433-8825</li>
+        </ul>
+      )}
+    </section>
+  );
+};
+
+export default InfoFaleConosco;
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListLink.module.scss b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoLinks.module.scss
similarity index 68%
rename from desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListLink.module.scss
rename to desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoLinks.module.scss
index 4e20049..d6eeed6 100644
--- a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListLink.module.scss
+++ b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoLinks.module.scss
@@ -2,6 +2,27 @@
 
 .menu-list {
   width: 21.923623%;
+
+  @include mq($lg, max) {
+    width: 100%;
+  }
+
+  &__unselect{
+    display: none;
+  }
+
+  &__title-wrapper {
+    @include display(flex, row, center, space-between);
+
+    img {
+      display: none;
+
+      @include mq($lg, max) {
+        display: block;
+      }
+    }
+  }
+
   &__title {
     @include fontStyle(500, 14px, 16px, $primary-200);
     text-transform: uppercase;
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoLinks.tsx b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoLinks.tsx
new file mode 100644
index 0000000..af38f65
--- /dev/null
+++ b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/InfoLinks.tsx
@@ -0,0 +1,62 @@
+import React, { useState, useEffect } from "react";
+
+import styles from "./InfoLinks.module.scss";
+import plus from "../../../../../assets/svgs/plus.svg";
+
+interface IInfoLinks {
+  title: string;
+  list: Array<string>;
+}
+
+const InfoLinks = ({ title, list }: IInfoLinks) => {
+  
+  const verificarTamanhoDaWindow = () => {
+    if (window.innerWidth <= 1024) {
+      return false;
+    } else {
+      return true;
+    }
+  };
+
+  const [isActive, setIsActive] = useState(verificarTamanhoDaWindow());
+
+  useEffect(() => {
+
+    window.addEventListener("resize", () => {
+      if (window.innerWidth <= 1024) {
+        setIsActive(false);
+      } else {
+        setIsActive(true);
+      }
+    });
+  });
+
+  return (
+    <section className={styles["menu-list"]}>
+      <div className={styles["menu-list__title-wrapper"]}>
+        <h4 className={styles["menu-list__title"]}>{title}</h4>
+        <img
+          src={plus}
+          alt="Abrir/Fechar"
+          onClick={() => setIsActive(!isActive)}
+        />
+      </div>
+
+      {isActive && <ul
+        className={styles["menu-list__container"]}
+      >
+        {list.map((item, index) => {
+          return (
+            <li key={index}>
+              <a className={styles["menu-list__item"]} href="/">
+                {item}
+              </a>
+            </li>
+          );
+        })}
+      </ul>}
+    </section>
+  );
+};
+
+export default InfoLinks;
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListInfo.tsx b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListInfo.tsx
deleted file mode 100644
index 4f83cc7..0000000
--- a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListInfo.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from "react";
-
-import styles from "./MenuListInfo.module.scss";
-
-
-const MenuListInfo = () => {
-  return (
-    <div className={styles["menu-list"]}>
-      <h4 className={styles["menu-list__title"]}>Fale Conosco</h4>
-      <ul className={styles["menu-list__container"]}>
-        <li className={styles["menu-list__item"]}>Atendimento Ao Consumidor</li>
-        <li className={styles["menu-list__telephone"]}>(11) 4159 9504</li>
-        <li className={styles["menu-list__item"]}>Atendimento Online</li>
-        <li className={styles["menu-list__telephone"]}>(11) 99433-8825</li>
-        
-      </ul>
-    </div>
-  );
-};
-
-export default MenuListInfo;
-
diff --git a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListLink.tsx b/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListLink.tsx
deleted file mode 100644
index e82fc5a..0000000
--- a/desafio-react-typescript/src/components/Footer/components/FooterTop.tsx/components/MenuListLink.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from "react";
-
-import styles from "./MenuListLink.module.scss";
-interface MenuListLinkProps {
-  title: string;
-  list: Array<string>;
-}
-const MenuListLink = ({ title, list }: MenuListLinkProps) => {
-  return (
-    <div className={styles["menu-list"]}>
-      <h4 className={styles["menu-list__title"]}>{title}</h4>
-      <ul className={styles["menu-list__container"]}>
-        {list.map((item, index) => (
-          <li key={index}>
-            <a className={styles["menu-list__item"]} href="/">
-              {item}
-            </a>
-          </li>
-        ))}
-      </ul>
-    </div>
-  );
-};
-
-export default MenuListLink;