diff --git a/public/assets/tipImages/png/baekgyeong_camera.png b/public/assets/tipImages/png/baekgyeong_camera.png
index 7bf0a0d3..6e5e1e4b 100644
Binary files a/public/assets/tipImages/png/baekgyeong_camera.png and b/public/assets/tipImages/png/baekgyeong_camera.png differ
diff --git a/public/assets/tipImages/png/baekgyeong_hand_love.png b/public/assets/tipImages/png/baekgyeong_hand_love.png
new file mode 100644
index 00000000..1c8dbe58
Binary files /dev/null and b/public/assets/tipImages/png/baekgyeong_hand_love.png differ
diff --git a/public/assets/tipImages/png/baekgyeong_hi.png b/public/assets/tipImages/png/baekgyeong_hi.png
index 3e414283..81b4ee26 100644
Binary files a/public/assets/tipImages/png/baekgyeong_hi.png and b/public/assets/tipImages/png/baekgyeong_hi.png differ
diff --git a/public/assets/tipImages/png/baekgyeong_love.png b/public/assets/tipImages/png/baekgyeong_love.png
index 2057fcf4..cc711f1c 100644
Binary files a/public/assets/tipImages/png/baekgyeong_love.png and b/public/assets/tipImages/png/baekgyeong_love.png differ
diff --git a/public/assets/tipImages/png/baekgyeong_search.png b/public/assets/tipImages/png/baekgyeong_search.png
index 5ebe84e0..b88c718b 100644
Binary files a/public/assets/tipImages/png/baekgyeong_search.png and b/public/assets/tipImages/png/baekgyeong_search.png differ
diff --git a/public/assets/tipImages/png/baekgyeong_teach.png b/public/assets/tipImages/png/baekgyeong_teach.png
index 9a774224..29cf218d 100644
Binary files a/public/assets/tipImages/png/baekgyeong_teach.png and b/public/assets/tipImages/png/baekgyeong_teach.png differ
diff --git a/public/assets/tipImages/png/pknu.png b/public/assets/tipImages/png/pknu.png
index 126c52ac..1d357e80 100644
Binary files a/public/assets/tipImages/png/pknu.png and b/public/assets/tipImages/png/pknu.png differ
diff --git a/public/assets/tipImages/webp/baekgyeong_camera.webp b/public/assets/tipImages/webp/baekgyeong_camera.webp
index 0f347d75..e888c7f3 100644
Binary files a/public/assets/tipImages/webp/baekgyeong_camera.webp and b/public/assets/tipImages/webp/baekgyeong_camera.webp differ
diff --git a/public/assets/tipImages/webp/baekgyeong_hand_love.webp b/public/assets/tipImages/webp/baekgyeong_hand_love.webp
new file mode 100644
index 00000000..1fb9682b
Binary files /dev/null and b/public/assets/tipImages/webp/baekgyeong_hand_love.webp differ
diff --git a/public/assets/tipImages/webp/baekgyeong_hi.webp b/public/assets/tipImages/webp/baekgyeong_hi.webp
index c3d32756..866c6c70 100644
Binary files a/public/assets/tipImages/webp/baekgyeong_hi.webp and b/public/assets/tipImages/webp/baekgyeong_hi.webp differ
diff --git a/public/assets/tipImages/webp/baekgyeong_love.webp b/public/assets/tipImages/webp/baekgyeong_love.webp
index 0ec1e410..122f2697 100644
Binary files a/public/assets/tipImages/webp/baekgyeong_love.webp and b/public/assets/tipImages/webp/baekgyeong_love.webp differ
diff --git a/public/assets/tipImages/webp/baekgyeong_search.webp b/public/assets/tipImages/webp/baekgyeong_search.webp
index e870bb12..31ae09a5 100644
Binary files a/public/assets/tipImages/webp/baekgyeong_search.webp and b/public/assets/tipImages/webp/baekgyeong_search.webp differ
diff --git a/public/assets/tipImages/webp/baekgyeong_teach.webp b/public/assets/tipImages/webp/baekgyeong_teach.webp
index 57de4586..2d25ad14 100644
Binary files a/public/assets/tipImages/webp/baekgyeong_teach.webp and b/public/assets/tipImages/webp/baekgyeong_teach.webp differ
diff --git a/public/assets/tipImages/webp/pknu.webp b/public/assets/tipImages/webp/pknu.webp
index 4e44b20b..8cc93f01 100644
Binary files a/public/assets/tipImages/webp/pknu.webp and b/public/assets/tipImages/webp/pknu.webp differ
diff --git a/src/@types/styles/icon.ts b/src/@types/styles/icon.ts
index 4a7a4c75..f6c4c757 100644
--- a/src/@types/styles/icon.ts
+++ b/src/@types/styles/icon.ts
@@ -5,8 +5,10 @@ export type IconKind =
   | 'menu'
   | 'notification'
   | 'school'
-  | 'arrowBack'
+  | 'schoolBuilding'
   | 'arrowRight'
+  | 'arrowDown'
+  | 'arrowBack'
   | 'plus'
   | 'edit'
   | 'suggest'
diff --git a/src/components/Card/InformCard/index.test.tsx b/src/components/Card/InformCard/index.test.tsx
index f5f16cbb..4612960e 100644
--- a/src/components/Card/InformCard/index.test.tsx
+++ b/src/components/Card/InformCard/index.test.tsx
@@ -18,7 +18,7 @@ type INFORM_CARD_TYPE = 'ANNOUNCEMENT' | 'GRADUATION';
 type INFORM_CARD_DATA = {
   [key in INFORM_CARD_TYPE]: {
     title: string;
-    icon: IconKind & ('school' | 'notification');
+    icon: IconKind & ('school' | 'schoolBuilding');
     onClick: () => void;
   };
 };
@@ -26,8 +26,8 @@ type INFORM_CARD_DATA = {
 const graduationLink = 'https://ce.pknu.ac.kr/ce/2889';
 const INFORM_CARD: INFORM_CARD_DATA = {
   ANNOUNCEMENT: {
-    title: '공지사항',
-    icon: 'notification',
+    title: '학교 공지사항',
+    icon: 'schoolBuilding',
     onClick: () => mockRouterTo('/announcement'),
   },
   GRADUATION: {
diff --git a/src/components/Card/InformCard/index.tsx b/src/components/Card/InformCard/index.tsx
index 6822bf2a..61a3f3c9 100644
--- a/src/components/Card/InformCard/index.tsx
+++ b/src/components/Card/InformCard/index.tsx
@@ -8,7 +8,7 @@ import { THEME } from '@styles/ThemeProvider/theme';
 import { IconKind } from '@type/styles/icon';
 
 interface InformCardProps {
-  icon: IconKind & ('school' | 'notification');
+  icon: IconKind & ('school' | 'schoolBuilding' | 'speaker');
   title: string;
   majorRequired: boolean;
   onClick: () => void;
diff --git a/src/components/Common/Icon/index.tsx b/src/components/Common/Icon/index.tsx
index 8bfe3c23..8e54dcd8 100644
--- a/src/components/Common/Icon/index.tsx
+++ b/src/components/Common/Icon/index.tsx
@@ -5,6 +5,7 @@ import {
   MdHome,
   MdAccountCircle,
   MdSchool,
+  MdOutlineLocationCity,
   MdNotifications,
   MdMenu,
   MdArrowBackIos,
@@ -26,6 +27,7 @@ import {
   MdOutlineMyLocation,
   MdOutlineError,
   MdOutlineKeyboardArrowRight,
+  MdOutlineKeyboardArrowDown,
 } from 'react-icons/md';
 
 const ICON: { [key in IconKind]: IconType } = {
@@ -35,8 +37,10 @@ const ICON: { [key in IconKind]: IconType } = {
   menu: MdMenu,
   notification: MdNotifications,
   school: MdSchool,
-  arrowBack: MdArrowBackIos,
+  schoolBuilding: MdOutlineLocationCity,
   arrowRight: MdOutlineKeyboardArrowRight,
+  arrowDown: MdOutlineKeyboardArrowDown,
+  arrowBack: MdArrowBackIos,
   plus: MdAddCircleOutline,
   edit: MdOutlineModeEdit,
   suggest: MdOutlineQuestionAnswer,
diff --git a/src/components/FAQBox/index.tsx b/src/components/FAQBox/index.tsx
index c5b55c1e..0678b66c 100644
--- a/src/components/FAQBox/index.tsx
+++ b/src/components/FAQBox/index.tsx
@@ -18,15 +18,12 @@ const FAQBox = ({ question, answer }: FAQBoxProps) => {
   const [showAnswer, setShowAnswer] = useState<boolean>(false);
   const toggleAnswer = () => setShowAnswer((prevState) => !prevState);
 
+  const seperatedAnswerText = answer.text.split(FAQ_CONSTANTS.LINE_SEPERATOR);
   const moveToLink = () => {
     if (!answer.link) return;
     openLink(answer.link);
   };
-
   const hasAnswerLink = () => !!answer.link;
-  const answerTextSeperatedLine = answer.text.split(
-    FAQ_CONSTANTS.LINE_SEPERATOR,
-  );
 
   return (
     <>
@@ -34,12 +31,12 @@ const FAQBox = ({ question, answer }: FAQBoxProps) => {
         <QuestionMark>{FAQ_CONSTANTS.QUESTION_MARK}</QuestionMark>
         <QuestionText>{question}</QuestionText>
         <IconContainer>
-          <Icon kind="arrowRight" size="24" />
+          <Icon kind="arrowDown" size="24" />
         </IconContainer>
       </QuestionContainer>
       {showAnswer && (
         <AnswerContainer>
-          {answerTextSeperatedLine.map((line, index) => (
+          {seperatedAnswerText.map((line, index) => (
             <p key={index}>{line}</p>
           ))}
           {hasAnswerLink() && (
@@ -47,7 +44,6 @@ const FAQBox = ({ question, answer }: FAQBoxProps) => {
           )}
         </AnswerContainer>
       )}
-
       <BoundaryLine />
     </>
   );
@@ -66,7 +62,7 @@ const QuestionContainer = styled.div<{ showAnswer: boolean }>`
       color: ${showAnswer && THEME.PRIMARY};
     }
     & > div > svg {
-      transform: ${showAnswer ? 'rotate(90deg)' : 'rotate(0deg)'};
+      transform: ${showAnswer ? 'rotate(-180deg)' : 'rotate(0deg)'};
       transition: all ease 0.3s;
     }
   `}
@@ -84,8 +80,6 @@ const IconContainer = styled.div`
   position: absolute;
   right: 0;
   display: flex;
-  align-items: center;
-  justify-content: flex-end;
 `;
 
 const AnswerContainer = styled.div`
@@ -102,6 +96,8 @@ const StyledLink = styled.span`
   border-bottom: 1px solid ${THEME.PRIMARY};
 `;
 
-const BoundaryLine = styled.div`
-  border-bottom: 1px solid #ededed;
+const BoundaryLine = styled.hr`
+  height: 1px;
+  background-color: #ededed;
+  border: none;
 `;
diff --git a/src/pages/Announcement/components/AnnounceSearch.tsx b/src/components/InformUpperLayout/InformSearchForm.tsx
similarity index 76%
rename from src/pages/Announcement/components/AnnounceSearch.tsx
rename to src/components/InformUpperLayout/InformSearchForm.tsx
index 08e1804a..6fdf920a 100644
--- a/src/pages/Announcement/components/AnnounceSearch.tsx
+++ b/src/components/InformUpperLayout/InformSearchForm.tsx
@@ -7,19 +7,19 @@ import useRouter from '@hooks/useRouter';
 import useToasts from '@hooks/useToast';
 import React, { useRef } from 'react';
 
-interface AnnounceSearchProps {
+interface InformSearchForm {
   category: 'school' | 'major';
 }
 
-const AnnounceSearch = ({ category }: AnnounceSearchProps) => {
+const InformSearchForm = ({ category }: InformSearchForm) => {
   const { routerTo } = useRouter();
   const { addToast } = useToasts();
-
   const inputRef = useRef<HTMLInputElement>(null);
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     if (!inputRef.current) return;
     e.preventDefault();
+
     if (inputRef.current.value.length === 0) {
       addToast(TOAST_MESSAGES.SEARCH_KEYWORD);
       return;
@@ -31,22 +31,20 @@ const AnnounceSearch = ({ category }: AnnounceSearchProps) => {
   };
 
   return (
-    <div>
-      <StyledForm onSubmit={handleSubmit}>
-        <StyledInput
-          ref={inputRef}
-          type="text"
-          placeholder={PLCACEHOLDER_MESSAGES.SEARCH_TITLE}
-        />
-        <StyledIconWrapper onClick={() => handleSubmit}>
-          <Icon kind="search" color="#7A9DD3" />
-        </StyledIconWrapper>
-      </StyledForm>
-    </div>
+    <StyledForm onSubmit={handleSubmit}>
+      <StyledInput
+        ref={inputRef}
+        type="text"
+        placeholder={PLCACEHOLDER_MESSAGES.SEARCH_TITLE}
+      />
+      <StyledIconWrapper onClick={() => handleSubmit}>
+        <Icon kind="search" color="#7A9DD3" />
+      </StyledIconWrapper>
+    </StyledForm>
   );
 };
 
-export default AnnounceSearch;
+export default InformSearchForm;
 
 const StyledForm = styled.form`
   display: flex;
diff --git a/src/components/InformUpperLayout/domain/getInformUpperLayoutSubElement.ts b/src/components/InformUpperLayout/domain/getInformUpperLayoutSubElement.ts
index 790baa3f..fbc2779d 100644
--- a/src/components/InformUpperLayout/domain/getInformUpperLayoutSubElement.ts
+++ b/src/components/InformUpperLayout/domain/getInformUpperLayoutSubElement.ts
@@ -1,5 +1,6 @@
 import { Children, isValidElement } from 'react';
 
+import InformSearchForm from '../InformSearchForm';
 import InformSubTitle from '../InformSubTitle';
 import InformTitle from '../InformTitle';
 import InformTypeButton from '../InformTypeButton';
@@ -7,7 +8,8 @@ import InformTypeButton from '../InformTypeButton';
 type InformUpperLayoutChildType =
   | typeof InformTitle
   | typeof InformSubTitle
-  | typeof InformTypeButton;
+  | typeof InformTypeButton
+  | typeof InformSearchForm;
 
 const getInformUpperLayoutSubElement = (
   children: React.ReactNode,
diff --git a/src/components/InformUpperLayout/index.tsx b/src/components/InformUpperLayout/index.tsx
index 838d025e..1fd14cdc 100644
--- a/src/components/InformUpperLayout/index.tsx
+++ b/src/components/InformUpperLayout/index.tsx
@@ -2,6 +2,7 @@ import styled from '@emotion/styled';
 import React from 'react';
 
 import getInformUpperLayoutSubElement from './domain/getInformUpperLayoutSubElement';
+import InformSearchForm from './InformSearchForm';
 import InformSubTitle from './InformSubTitle';
 import InformTitle from './InformTitle';
 import InformTypeButton from './InformTypeButton';
@@ -18,11 +19,16 @@ const InformUpperLayout = ({ children }: StrictPropsWithChildren) => {
     children,
     InformTypeButton,
   );
+  const informSearchForm = getInformUpperLayoutSubElement(
+    children,
+    InformSearchForm,
+  );
 
   return (
     <Container>
       {informTitle}
       {informSubTitle}
+      {informSearchForm}
       {informTypeButton && (
         <TypeButtonContainer>{informTypeButton}</TypeButtonContainer>
       )}
@@ -35,6 +41,7 @@ export default InformUpperLayout;
 InformUpperLayout.InformTitle = InformTitle;
 InformUpperLayout.InformSubTitle = InformSubTitle;
 InformUpperLayout.InformTypeButton = InformTypeButton;
+InformUpperLayout.InformSearchForm = InformSearchForm;
 
 const Container = styled.section`
   padding: 0px 20px 0px 20px;
@@ -43,7 +50,7 @@ const Container = styled.section`
 `;
 
 const TypeButtonContainer = styled.div`
-  padding: 0 0 10px 0;
+  padding: 10px 0 10px 0;
   display: flex;
   column-gap: 10px;
 `;
diff --git a/src/components/List/AnnounceList/index.tsx b/src/components/List/AnnounceList/index.tsx
index 240e7fc1..79e23884 100644
--- a/src/components/List/AnnounceList/index.tsx
+++ b/src/components/List/AnnounceList/index.tsx
@@ -1,7 +1,5 @@
 import { ANNOUNCEMENT_TYPE } from '@constants/announcement';
-import styled from '@emotion/styled';
 import { AnnounceSearchList } from '@pages/Announcement/components';
-import { THEME } from '@styles/ThemeProvider/theme';
 import { AnnounceItemList, AnnouncementType } from '@type/announcement';
 import { AxiosError, AxiosResponse } from 'axios';
 import { Fragment } from 'react';
@@ -32,7 +30,6 @@ const AnnounceList = ({ resource, type }: AnnounceListProps) => {
 
   return (
     <>
-      <BoundaryLine />
       {type === ANNOUNCEMENT_TYPE.NORMAL &&
         normalAnnouncemnet.map((announce, idx) => (
           <Fragment key={idx}>
@@ -55,7 +52,3 @@ const AnnounceList = ({ resource, type }: AnnounceListProps) => {
 };
 
 export default AnnounceList;
-
-const BoundaryLine = styled.div`
-  border-bottom: 1px solid ${THEME.TEXT.BLACK};
-`;
diff --git a/src/constants/tip.ts b/src/constants/tip.ts
index 4f29d101..190518ec 100644
--- a/src/constants/tip.ts
+++ b/src/constants/tip.ts
@@ -38,8 +38,8 @@ export const SHORTCUT_DATA: readonly TipData[] = [
   {
     title: '이루미',
     subTitle: '부경대 포털 사이트\n바로가기',
-    webpPath: '/assets/tipImages/webp/baekgyeong_teach.webp',
-    pngPath: '/assets/tipImages/png/baekgyeong_teach.png',
+    webpPath: '/assets/tipImages/webp/baekgyeong_hand_love.webp',
+    pngPath: '/assets/tipImages/png/baekgyeong_hand_love.png',
     link: 'https://portal.pknu.ac.kr/',
   },
   {
diff --git a/src/pages/Announcement/components/AnnounceContainer.tsx b/src/pages/Announcement/components/AnnounceContainer.tsx
index 36f693f8..426787f1 100644
--- a/src/pages/Announcement/components/AnnounceContainer.tsx
+++ b/src/pages/Announcement/components/AnnounceContainer.tsx
@@ -1,4 +1,5 @@
 import fetchAnnounceList from '@apis/Suspense/fetch-announce-list';
+import InformUpperLayout from '@components/InformUpperLayout';
 import AnnounceList from '@components/List/AnnounceList';
 import AnnounceCardSkeleton from '@components/List/AnnounceList/Skeleton';
 import { ANNOUNCEMENT_TYPE } from '@constants/announcement';
@@ -6,6 +7,7 @@ import PATH from '@constants/path';
 import { keyframes } from '@emotion/react';
 import styled from '@emotion/styled';
 import useRouter from '@hooks/useRouter';
+import { THEME } from '@styles/ThemeProvider/theme';
 import {
   AnnounceItemList,
   AnnouncementCategory,
@@ -14,9 +16,6 @@ import {
 import React, { Suspense, useMemo } from 'react';
 import { useParams } from 'react-router-dom';
 
-import AnnounceSearch from './AnnounceSearch';
-import AnnounceTypeButtons from './AnnounceTypeButtons';
-
 interface AnnounceContainerProps {
   title: string;
   category: AnnouncementCategory;
@@ -45,20 +44,21 @@ const AnnounceContainer = ({
 
   return (
     <Container>
-      <AnnounceTitle>{title}</AnnounceTitle>
-      <AnnounceSearch category={category} />
-      <ButtonContainer>
-        <AnnounceTypeButtons
+      <InformUpperLayout>
+        <InformUpperLayout.InformTitle title={title} />
+        <InformUpperLayout.InformSearchForm category={category} />
+        <InformUpperLayout.InformTypeButton
           type="일반"
-          onClick={showNormalAnnouncement}
           isActive={type === ANNOUNCEMENT_TYPE.NORMAL}
+          onClick={showNormalAnnouncement}
         />
-        <AnnounceTypeButtons
+        <InformUpperLayout.InformTypeButton
           type="고정"
-          onClick={showPinnedAnnouncement}
           isActive={type === ANNOUNCEMENT_TYPE.PINNED}
+          onClick={showPinnedAnnouncement}
         />
-      </ButtonContainer>
+      </InformUpperLayout>
+      <BoundaryLine />
       <AnnounceListContainer type={type as AnnouncementType}>
         <Suspense fallback={<AnnounceCardSkeleton length={30} />}>
           <AnnounceList resource={resource} type={type as AnnouncementType} />
@@ -71,23 +71,9 @@ const AnnounceContainer = ({
 export default AnnounceContainer;
 
 const Container = styled.div`
-  overflow-x: hidden;
   display: flex;
   flex-direction: column;
-
-  row-gap: 15px;
-  padding: 10px;
-`;
-
-const AnnounceTitle = styled.span`
-  margin-top: 1rem;
-  font-size: 1.5rem;
-  font-weight: bold;
-`;
-
-const ButtonContainer = styled.div`
-  display: flex;
-  column-gap: 10px;
+  overflow-x: hidden;
 `;
 
 const getAnimationType = (type: AnnouncementType) => {
@@ -96,7 +82,8 @@ const getAnimationType = (type: AnnouncementType) => {
 };
 
 const AnnounceListContainer = styled.div<{ type: AnnouncementType }>`
-  width: 100%;
+  padding: 0 20px 0 20px;
+
   overflow: hidden;
   animation: ${({ type }) => getAnimationType(type)} 0.3s forwards;
 `;
@@ -118,3 +105,11 @@ const AnnounceSlideLeft = keyframes`
     transform: translateX(0%);
   }
 `;
+
+const BoundaryLine = styled.hr`
+  height: 1px;
+  width: calc(100% - 40px);
+  margin: 0 auto;
+  background-color: ${THEME.TEXT.BLACK};
+  border: none;
+`;
diff --git a/src/pages/Announcement/components/AnnounceTypeButtons.tsx b/src/pages/Announcement/components/AnnounceTypeButtons.tsx
deleted file mode 100644
index 2a2c1323..00000000
--- a/src/pages/Announcement/components/AnnounceTypeButtons.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import Button from '@components/Common/Button';
-import { css } from '@emotion/react';
-import { THEME } from '@styles/ThemeProvider/theme';
-import React from 'react';
-
-interface AnnounceTypeButtonsProps {
-  type: '일반' | '고정';
-  isActive: boolean;
-  onClick: () => void;
-}
-
-const AnnounceTypeButtons = ({
-  type,
-  isActive,
-  onClick,
-}: AnnounceTypeButtonsProps) => {
-  return (
-    <Button
-      css={css`
-        margin: 0px;
-        height: 2rem;
-        width: 4rem;
-        border-radius: 4rem;
-        font-weight: normal;
-        background-color: ${isActive ? THEME.BUTTON.BLUE : THEME.BUTTON.GRAY};
-        color: ${isActive ? THEME.TEXT.WHITE : THEME.TEXT.GRAY};
-      `}
-      onClick={onClick}
-    >
-      {type}
-    </Button>
-  );
-};
-
-export default AnnounceTypeButtons;
diff --git a/src/pages/Announcement/components/index.ts b/src/pages/Announcement/components/index.ts
index 2bce755e..83f18c43 100644
--- a/src/pages/Announcement/components/index.ts
+++ b/src/pages/Announcement/components/index.ts
@@ -1,4 +1,2 @@
 export { default as AnnounceContainer } from './AnnounceContainer';
-export { default as AnnounceSearch } from './AnnounceSearch';
 export { default as AnnounceSearchList } from './AnnounceSearchList';
-export { default as AnnounceTypeButtons } from './AnnounceTypeButtons';
diff --git a/src/pages/FAQ/index.tsx b/src/pages/FAQ/index.tsx
index 22e2a344..00472387 100644
--- a/src/pages/FAQ/index.tsx
+++ b/src/pages/FAQ/index.tsx
@@ -1,4 +1,5 @@
 import FAQBox from '@components/FAQBox';
+import InformUpperLayout from '@components/InformUpperLayout';
 import { FAQ_DATA, FAQ_CONSTANTS } from '@constants/FAQ';
 import styled from '@emotion/styled';
 import { THEME } from '@styles/ThemeProvider/theme';
@@ -7,16 +8,14 @@ import React from 'react';
 const FAQPage = () => {
   return (
     <Container>
-      <TextContainer>
-        <FAQTitle>{FAQ_CONSTANTS.TITLE}</FAQTitle>
-        <FAQSubTitle>{FAQ_CONSTANTS.SUB_TITLE}</FAQSubTitle>
-        <BoundaryLine />
-      </TextContainer>
+      <InformUpperLayout>
+        <InformUpperLayout.InformTitle title={FAQ_CONSTANTS.TITLE} />
+        <InformUpperLayout.InformSubTitle subTitle={FAQ_CONSTANTS.SUB_TITLE} />
+      </InformUpperLayout>
+      <BoundaryLine />
       <FAQContainer>
         {FAQ_DATA.map((data, index) => (
-          <React.Fragment key={index}>
-            <FAQBox {...data} />
-          </React.Fragment>
+          <FAQBox {...data} key={index} />
         ))}
       </FAQContainer>
     </Container>
@@ -26,32 +25,18 @@ const FAQPage = () => {
 export default FAQPage;
 
 const Container = styled.div`
-  padding: 10px;
   display: flex;
   flex-direction: column;
 `;
 
-const TextContainer = styled.section`
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-`;
-
-const FAQTitle = styled.span`
-  margin-top: 1rem;
-  font-size: 1.5rem;
-  font-weight: bold;
+const BoundaryLine = styled.hr`
+  height: 1px;
+  width: calc(100% - 40px);
+  background-color: ${THEME.TEXT.BLACK};
+  border: none;
 `;
 
-const FAQSubTitle = styled.span`
-  color: ${THEME.TEXT.GRAY};
-  line-height: 1.3;
-`;
-
-const FAQContainer = styled.div`
+const FAQContainer = styled.section`
+  padding: 0 20px 0 20px;
   line-height: 4;
 `;
-
-const BoundaryLine = styled.div`
-  border-bottom: 1px solid ${THEME.TEXT.BLACK};
-`;
diff --git a/src/pages/Home/components/InformCardList.tsx b/src/pages/Home/components/InformCardList.tsx
index e7102cba..28c992f9 100644
--- a/src/pages/Home/components/InformCardList.tsx
+++ b/src/pages/Home/components/InformCardList.tsx
@@ -13,13 +13,13 @@ const InformCardList = () => {
   return (
     <>
       <InformCard
-        icon="notification"
+        icon="schoolBuilding"
         title={ANNOUNCEMENT_TITLE.SCHOOL}
         majorRequired={false}
         onClick={() => routerTo(PATH.NORMAL_ANNOUNCEMENT('school'))}
       />
       <InformCard
-        icon="notification"
+        icon="speaker"
         title={ANNOUNCEMENT_TITLE.MAROR}
         majorRequired={true}
         onClick={() => routerTo(PATH.NORMAL_ANNOUNCEMENT('major'))}