{isVisible ? (
-
}>
-
-
+
}>{children}
) : (
)}
diff --git a/src/components/common/title/PageTitle.tsx b/src/components/common/title/PageTitle.tsx
index 5057dde1..30a57aa5 100644
--- a/src/components/common/title/PageTitle.tsx
+++ b/src/components/common/title/PageTitle.tsx
@@ -9,13 +9,11 @@ import Title from '../typography/Title';
const MainTitlelayout = styled.div`
width: 100%;
max-width: 1024px;
+ margin-top: 50px;
display: flex;
flex-direction: column;
align-items: flex-start;
-
- margin-top: 50px;
- margin-left: 60px;
`;
const MobileMainTitlelayout = styled.div`
diff --git a/src/components/feature/footer/FooterLink.ts b/src/components/feature/footer/FooterLink.ts
new file mode 100644
index 00000000..8eea47e5
--- /dev/null
+++ b/src/components/feature/footer/FooterLink.ts
@@ -0,0 +1,37 @@
+import CompanyLogo from '@gdg/assets/CompanyLogo.svg';
+import GithubLogo from '@gdg/assets/GithubLogo.svg';
+import InstagramLogo from '@gdg/assets/InstagramLogo.svg';
+import Phone from '@gdg/assets/Phone.svg';
+
+type FooterLink = {
+ icon: string;
+ title: string;
+ content: string;
+ href?: string;
+};
+
+export const footerLinks: FooterLink[] = [
+ {
+ icon: Phone,
+ title: '대표 연락처',
+ content: '010-4922-7687',
+ },
+ {
+ icon: GithubLogo,
+ title: 'GDG KNU 팀 깃허브',
+ content: 'Github 바로가기',
+ href: 'https://github.com/GDG-on-Campus-KNU',
+ },
+ {
+ icon: InstagramLogo,
+ title: '인스타그램',
+ content: '@gdgoc.knu 바로가기',
+ href: 'https://www.instagram.com/gdgoc.knu/',
+ },
+ {
+ icon: CompanyLogo,
+ title: '협력사',
+ content: '데이터융복합연구원 바로가기',
+ href: 'https://datainstitute.knu.ac.kr/contents/main.do',
+ },
+];
diff --git a/src/components/feature/footer/MainFooter.tsx b/src/components/feature/footer/MainFooter.tsx
index 51134a55..bfc60461 100644
--- a/src/components/feature/footer/MainFooter.tsx
+++ b/src/components/feature/footer/MainFooter.tsx
@@ -1,7 +1,3 @@
-import CompanyLogo from '@gdg/assets/CompanyLogo.svg';
-import GithubLogo from '@gdg/assets/GithubLogo.svg';
-import InstagramLogo from '@gdg/assets/InstagramLogo.svg';
-import Phone from '@gdg/assets/Phone.svg';
import Text from '@gdg/components/common/typography/Text';
import {
Footer,
@@ -12,6 +8,22 @@ import {
TableData,
} from '@gdg/styles/FooterLayoutStyle';
+import { footerLinks } from './FooterLink';
+
+const FooterRow = ({
+ items,
+ renderItem,
+}: {
+ items: typeof footerLinks;
+ renderItem: (item: (typeof footerLinks)[0]) => React.ReactNode;
+}) => (
+
+ {items.map((item, i) => (
+ {renderItem(item)}
+ ))}
+
+);
+
const MainFooter = () => {
return (