docs: update contact information

Author: modori1208

src/app/contact/page.css.ts

@@ -10,3 +10,42 @@ export const root = style({
   fontSize: rem(14),
   lineHeight: '200%',
 });
+
+export const contactInfo = style({
+  marginTop: rem(24),
+});
+
+export const contactTitle = style({
+  fontSize: rem(18),
+  fontWeight: '600',
+  marginBottom: rem(8),
+});
+
+export const contactAddress = style({
+  fontSize: rem(14),
+  lineHeight: '1.6',
+  color: theme.colors.white90,
+  marginBottom: rem(16),
+});
+
+export const contactText = style({
+  fontSize: rem(16),
+  fontWeight: 500,
+  marginBottom: rem(8),
+  lineHeight: 1.5,
+});
+
+export const mapContainer = style({
+  width: '100%',
+  maxWidth: rem(800),
+  height: rem(450),
+  marginTop: rem(16),
+  borderRadius: rem(24),
+  overflow: 'hidden',
+});
+
+export const map = style({
+  width: '100%',
+  height: '100%',
+  border: 0,
+});

src/app/contact/page.tsx

@@ -6,11 +6,26 @@ import * as styles from './page.css';
 export default function Page() {
   return (
     <Layout className={styles.root}>
-      <p>문의 사항은 아래 이메일로 연락 부탁드립니다.</p>
-      <a href={`mailto:${METADATA.email}`}>{METADATA.email}</a>
+      <div className={styles.contactInfo}>
+        <p className={styles.contactText}>문의 사항은 아래 이메일로 연락 부탁드립니다.</p>
+        <a href={`mailto:${METADATA.email}`}>{METADATA.email}</a>
+      </div>
       <br />
-      <p>제7회 코드페스티벌 문의 카카오톡 오픈채팅방</p>
-      <a href="https://open.kakao.com/o/gJYVpy0h">https://open.kakao.com/o/gJYVpy0h</a>
+
+      <div className={styles.contactInfo}>
+        <h2 className={styles.contactTitle}>오시는 길</h2>
+        <p className={styles.contactAddress}>{METADATA.contact.address}</p>
+        <div className={styles.mapContainer}>
+          <iframe
+            title="오시는 길 지도"
+            src={METADATA.contact.mapUrl}
+            className={styles.map}
+            allowFullScreen
+            loading="lazy"
+            referrerPolicy="no-referrer-when-downgrade"
+          ></iframe>
+        </div>
+      </div>
     </Layout>
   );
 }

src/components/common/Layout/Footer/index.tsx

@@ -6,7 +6,7 @@ const Footer = () => {
   return (
     <footer className={styles.root}>
       <p className={styles.license}>
-        <span dangerouslySetInnerHTML={{ __html: METADATA.address }} /> |&nbsp;
+        <span dangerouslySetInnerHTML={{ __html: METADATA.footer.address }} /> |&nbsp;
         <a href={`mailto:${METADATA.email}`}>{METADATA.email}</a>
         <br />© GDG on Campus HUFS. All Rights Reserved.
       </p>

src/constants/metadata.ts

@@ -5,6 +5,14 @@ export const METADATA = {
   siteName: '2025 HUFS Code Festival',
   url: 'https://codefestival.hufs.ac.kr',
   email: '[email protected]',
-  address:
-    '17035 경기도 용인시 처인구 모현읍 외대로 81 한국외국어대학교 글로벌캠퍼스 <u title="AI교육단">공학관 211-1호</u> · <u title="HUFSTORY / GDG on Campus HUFS">학생회관 313호</u>',
+  contact: {
+    address:
+      '17035 경기도 용인시 처인구 모현읍 외대로 81 한국외국어대학교 글로벌캠퍼스 학생회관 313호 (HUFSTORY · GDG on Campus HUFS)',
+    mapUrl:
+      'https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d852.4750673820683!2d127.26935181496057!3d37.33729715435895!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x357b5563d269abf7%3A0x2f73c9f69ad950c6!2z7Jqp7J247IucIOuqqO2YhOydjSDtlZzqta3smbjqta3slrTrjIDtlZnqtZAg7ZWZ7IOd7ZqM6rSA!5e0!3m2!1sko!2skr!4v1765032015549!5m2!1sko!2skr',
+  },
+  footer: {
+    address:
+      '17035 경기도 용인시 처인구 모현읍 외대로 81 한국외국어대학교 글로벌캠퍼스 <u title="AI교육단">공학관 211-1호</u> · <u title="HUFSTORY / GDG on Campus HUFS">학생회관 313호</u>',
+  },
 };