Feature: 프로젝트, 아카이브 QA

src/app/projects/corporate/page.tsx

@@ -12,7 +12,7 @@ async function CorporateProjectPage() {
       <ProjectTypeBanner
         title="기업 연계 프로젝트란?"
         detail={
-          "실제 기업이 고민하고 있는 경영/마케팅 문제나 개발과 관련된 과제를 받아\n팀별로 아이디어를 제시해 과제를 수행하는 프로젝트에요."
+          "실제 기업이 고민하고 있는 경영/마케팅 문제나 개발과 관련된 과제를 받아\n팀별로 아이디어를 제시해 과제를 수행하는 프로젝트예요."
         }
       />
       <CorporateProjectContainer data={corporateProjectsList.data} />

src/components/archive/interaction/TimelineHeader.tsx

@@ -18,7 +18,7 @@ export default function TimelineHeader() {
   };
   return (
     <motion.div
-      className="flex w-full justify-center desktop:pt-[460px] pt-[160px] pb-20 desktop:pb-16 overflow-hidden"
+      className="flex w-full justify-center desktop:pt-[360px] pt-[60px] pb-20 desktop:pb-16 overflow-hidden"
       variants={containerVariants}
       initial="hidden"
       whileInView="visible"
@@ -38,7 +38,7 @@ export default function TimelineHeader() {
           className="text-dark-blue-500 desktop:text-title-5 text-title-7 font-bold"
           variants={itemVariants}
         >
-          32th KUSITMS
+          32nd KUSITMS
         </motion.p>
       </div>
     </motion.div>

src/components/archive/interaction/TimelineItem.tsx

@@ -17,14 +17,14 @@ export default function TimelineItem({ isLeft, children }: TimelineItemProps) {
 
   return (
     <motion.div
-      className={`relative w-full flex mb-8 ${isLeft ? "justify-start" : "justify-end"}`}
+      className={`relative w-full flex tablet:mb-8 mb-[76px] ${isLeft ? "justify-start" : "justify-end"}`}
       initial="hidden"
       whileInView="visible"
       variants={itemVariants}
       viewport={{ once: true, amount: 0.7 }}
     >
       <div
-        className={`desktop:w-[368px] desktop:mx-10 px-4 flex flex-col items-center text-left desktop:${isLeft ? "text-right" : "text-left"}`}
+        className={`desktop:w-[368px] desktop:mx-10 tablet:px-0 px-4 flex flex-col items-center text-left desktop:${isLeft ? "text-right" : "text-left"}`}
       >
         {children}
       </div>

src/components/main/MeetupProjectCarousel.tsx

@@ -123,7 +123,7 @@ export default function MeetupProjectCarousel({
             <span className="desktop:hidden">
               <br />
             </span>
-            밋업프로젝트의 서비스들을 소개합니다.
+            밋업프로젝트의 서비스들을 소개해요.
             <br />
             이번 전시회에서는 아래 서비스들을&nbsp;
             <span className="desktop:hidden">

src/components/projectDetail/ProjectModalShell.tsx

@@ -3,6 +3,7 @@
 import Image from "next/image";
 import { useRouter } from "next/navigation";
 import type { ReactNode } from "react";
+import { useEffect } from "react";
 
 interface Props {
   children: ReactNode;
@@ -11,22 +12,30 @@ interface Props {
 export default function ProjectModalShell({ children }: Props) {
   const router = useRouter();
 
+  useEffect(() => {
+    const originalStyle = window.getComputedStyle(document.body).overflow;
+    document.body.style.overflow = "hidden";
+    return () => {
+      document.body.style.overflow = originalStyle;
+    };
+  }, []);
+
   return (
     <div
       className="fixed inset-0 z-50 flex tablet:items-center justify-center bg-black/70 tablet:pt-0 pt-[80px]"
       onClick={() => router.back()}
     >
       <div
-        className="relative w-[624px] max-h-[480px] tablet:max-h-[800px] tablet:mx-20 mx-5 pb-4 bg-white rounded-xl flex flex-col"
+        className="relative w-[624px] max-h-[480px] tablet:max-h-[800px] tablet:mx-20 mx-5 tablet:pb-10 pb-5 bg-white rounded-xl flex flex-col"
         onClick={(e) => e.stopPropagation()}
       >
         <div className="hidden tablet:flex justify-between min-h-[88px] border-b px-10 items-center bg-white rounded-t-xl">
-          <p className="text-title-7 text-gray-700">프로젝트 소개</p>
+          <p className="text-title-7 text-gray-700 font-semibold">프로젝트 소개</p>
           <button onClick={() => router.back()}>
             <Image src="/projects/icons/CloseIcon2.svg" alt="Close" width={32} height={32} />
           </button>
         </div>
-        <div className="overflow-y-auto tablet:pt-4 pt-5 flex-1 tablet:custom-scrollbar-default custom-scrollbar-none">
+        <div className="overflow-y-auto flex-1 tablet:custom-scrollbar-default custom-scrollbar-none">
           {children}
         </div>
       </div>

src/components/projectDetail/ProjectNavigation.tsx

@@ -16,16 +16,18 @@ interface NavButtonProps {
 }
 
 function NavButton({ href, positionClass, icon, size }: NavButtonProps) {
-  const iconSize = size === "large" ? { width: 13, height: 23 } : { width: 8, height: 14 };
+  const iconSize = size === "large" ? { width: 16, height: 25 } : { width: 8.15, height: 14.31 };
+  const paddingClass = size === "small" ? (icon === "left" ? "pr-0.6" : "pl-0.6") : "";
 
   return (
     <Link
       href={href}
       replace
       className={`fixed z-[9999] flex justify-center items-center 
-        bg-white/30 rounded-full hover:scale-105 transition-transform
+        bg-white/30 rounded-full 
         ${positionClass} 
         ${size === "large" ? "w-[52px] h-[52px]" : "w-[32px] h-[32px]"}
+        ${paddingClass}
       `}
     >
       <Image

src/components/projects/OldProjectSection.tsx

@@ -6,23 +6,21 @@ import TeamMember from "./common/TeamMember";
 
 function OldProjectSection({ project }: { project: MeetupProjectDetail }) {
   return (
-    <div className="flex flex-col gap-5 tablet:px-10 px-4">
+    <div className="flex flex-col gap-5 tablet:px-10 px-4 tablet:pt-7">
       <div className="flex justify-start items-center relative tablet:gap-3 gap-2">
-        <p className="tablet:text-title-6 text-body-5 text-gray-900 font-bold">{project.name}</p>
+        <p className="tablet:text-title-6 text-body-3 text-gray-900 font-bold">{project.name}</p>
         <div className="flex tablet:gap-2 gap-1">
           <div className="bg-sky-blue-100 tablet:rounded-[8px] rounded-[4px] tablet:px-4 px-2 tablet:py-1 py-0.5">
-            <p className="text-sky-blue-700 tablet:text-body-5 text-body-11">
-              {project.cardinal}기
-            </p>
+            <p className="text-sky-blue-700 tablet:text-body-5 text-body-7">{project.cardinal}기</p>
           </div>
           <div className="bg-sky-blue-100 tablet:rounded-[8px] rounded-[4px] tablet:px-4 px-2 tablet:py-1 py-0.5">
-            <p className="text-sky-blue-700 tablet:text-body-5 text-body-11">
+            <p className="text-sky-blue-700 tablet:text-body-5 text-body-7">
               {toUpperCaseOnlyLetters(project.type)}
             </p>
           </div>
         </div>
       </div>
-      <div className="relative rounded-[20px] overflow-hidden border border-gray-200">
+      <div className="relative rounded-[16px] overflow-hidden border border-gray-200">
         <Image
           src={project.poster_url ?? "/footerLogo.svg"}
           alt="poster"
@@ -34,15 +32,15 @@ function OldProjectSection({ project }: { project: MeetupProjectDetail }) {
         />
       </div>
       <div className="flex flex-col gap-2">
-        <p className="tablet:text-body-3 text-body-7 text-gray-700 font-bold">프로젝트 설명</p>
-        <p className="tablet:text-body-6 text-body-9 text-gray-500">{project.intro}</p>
+        <p className="tablet:text-body-3 text-body-5 text-gray-700 font-bold">프로젝트 설명</p>
+        <p className="tablet:text-body-6 text-body-8 text-gray-500">{project.intro}</p>
       </div>
       <div
-        className="grid gap-5"
+        className="grid gap-5 pt-5"
         style={{ gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" }}
       >
         <div className="min-w-[220px] flex flex-col gap-3">
-          <p className="tablet:text-body-3 text-body-7 text-gray-700 font-bold">프로젝트 팀원</p>
+          <p className="tablet:text-body-3 text-body-5 text-gray-700 font-bold">프로젝트 팀원</p>
           <TeamMember position="기획" members={project.team.planner} />
           <TeamMember position="디자인" members={project.team.designer} />
           {project.team.frontend && (

src/components/projects/RecentProjectSection.tsx

@@ -7,23 +7,21 @@ import TeamMember from "./common/TeamMember";
 
 function RecentProjectSection({ project }: { project: MeetupProjectDetail }) {
   return (
-    <div className="flex flex-col gap-5 tablet:px-10 px-4">
+    <div className="flex flex-col gap-5 tablet:px-10 px-4 tablet:pt-7">
       <div className="flex justify-start items-center relative tablet:gap-3 gap-2">
-        <p className="tablet:text-title-6 text-body-5 text-gray-900 font-bold">{project.name}</p>
+        <p className="tablet:text-title-6 text-body-3 text-gray-900 font-bold">{project.name}</p>
         <div className="flex tablet:gap-2 gap-1">
           <div className="bg-sky-blue-100 tablet:rounded-[8px] rounded-[4px] tablet:px-4 px-2 tablet:py-1 py-0.5">
-            <p className="text-sky-blue-700 tablet:text-body-5 text-body-11">
-              {project.cardinal}기
-            </p>
+            <p className="text-sky-blue-700 tablet:text-body-5 text-body-7">{project.cardinal}기</p>
           </div>
           <div className="bg-sky-blue-100 tablet:rounded-[8px] rounded-[4px] tablet:px-4 px-2 tablet:py-1 py-0.5">
-            <p className="text-sky-blue-700 tablet:text-body-5 text-body-11">
+            <p className="text-sky-blue-700 tablet:text-body-5 text-body-7">
               {toUpperCaseOnlyLetters(project.type)}
             </p>
           </div>
         </div>
       </div>
-      <div className="relative rounded-[20px] overflow-hidden border border-gray-200">
+      <div className="relative rounded-[16px] overflow-hidden border border-gray-200">
         <Image
           src={project.poster_url}
           alt="poster"
@@ -35,22 +33,22 @@ function RecentProjectSection({ project }: { project: MeetupProjectDetail }) {
         />
       </div>
       <div className="flex flex-col gap-2">
-        <p className="tablet:text-body-3 text-body-7 text-gray-700 font-bold">프로젝트 설명</p>
-        <p className="tablet:text-body-6 text-body-9 text-gray-500">{project.intro}</p>
+        <p className="tablet:text-body-3 text-body-5 text-gray-700 font-bold">프로젝트 설명</p>
+        <p className="tablet:text-body-6 text-body-8 text-gray-500">{project.intro}</p>
       </div>
       <div
-        className="grid gap-5"
+        className="grid gap-5 pt-5"
         style={{ gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" }}
       >
         <div className="min-w-[220px] flex flex-col gap-3">
-          <p className="tablet:text-body-3 text-body-7 text-gray-700 font-bold">프로젝트 팀원</p>
+          <p className="tablet:text-body-3 text-body-5 text-gray-700 font-bold">프로젝트 팀원</p>
           <TeamMember position="기획" members={project.team.planner} />
           <TeamMember position="디자인" members={project.team.designer} />
           <TeamMember position="프론트엔드" members={project.team.frontend} />
           <TeamMember position="백엔드" members={project.team.backend} />
         </div>
         <div className="min-w-[220px] flex flex-col gap-3">
-          <p className="tablet:text-body-3 text-body-7 text-gray-700 font-bold">링크</p>
+          <p className="tablet:text-body-3 text-body-5 text-gray-700 font-bold">링크</p>
           {[
             {
               url: project.behance_url,

src/components/projects/common/ProjectFilter.tsx

@@ -20,7 +20,7 @@ export default function ProjectFilter({ cardinal, onChange, projectList }: Proje
 
   return (
     <div className="flex justify-between">
-      <p className="tablet:text-title-7 text-body-5 text-gray-700 pb-[39px] pt-[4.5px]">
+      <p className="tablet:text-title-7 text-body-3 text-gray-700 pb-[39px] pt-[4.5px]">
         전체 프로젝트 <span className="text-dark-blue-600">{visibleCount}</span>개
       </p>
       <Dropdown

src/components/projects/common/ProjectTypeBanner.tsx

@@ -8,7 +8,7 @@ interface Props {
 
 export default function ProjectTypeBanner({ title, detail }: Props) {
   return (
-    <section className="w-full relative tablet:h-[420px] h-[149px] tablet:pb-25 mb-15 tablet:px-10 px-4 rounded-[12px] ">
+    <section className="w-full relative tablet:h-[420px] h-[149px] tablet:pb-25 pb-15 tablet:px-10 px-4 rounded-[12px] ">
       <div className="w-full h-full overflow-hidden relative">
         <Image
           src={"/projects/img/Project.png"}

src/components/projects/common/TeamMember.tsx

@@ -4,7 +4,7 @@ function TeamMember({ position, members }: { position: string; members: string[]
       <div className="bg-gray-50 rounded-[4px] text-center py-1 w-[80px]">
         <p className="tablet:text-body-8 text-body-9 text-gray-900 ">{position}</p>
       </div>
-      <div className="text-gray-500 tablet:text-body-8 text-body-10">{members.join(", ")}</div>
+      <div className="text-gray-500 tablet:text-body-8 text-body-8">{members.join(", ")}</div>
     </div>
   );
 }

src/constants/timeLineData.ts

@@ -10,7 +10,7 @@ export const TIMELINE_DATA: TimelineContent[] = [
   {
     title: "오리엔테이션",
     description:
-      "학부학 및 운영진 소개, 출결 및 상벌점 안내 등 큐시즘에 대한 안내를 받은 후 큐시즘의 기업 연계프로젝트를 함께할 기업 직행, LG전자를 소개받았어요",
+      "학부학 및 운영진 소개, 출결 및 상벌점 안내 등 큐시즘에 대한 안내를 받은 후 큐시즘의 기업 연계프로젝트를 함께할 기업 직행, LG전자를 소개받았어요.",
     isLeft: true,
     src: "/display/ot.png",
     alt: "오리엔테이션",

src/utils/projectCountUtils.ts

@@ -7,27 +7,16 @@ export interface ProjectCount {
 
 export const calculateProjectCounts = (
   projectList: MeetupItem[] | CorporateProjectItem[],
-  generations: number[] = Array.from({ length: 7 }, (_, i) => 31 - i),
 ): ProjectCount => {
-  // 프로젝트 리스트가 없거나 형식이 맞지 않으면 빈 객체 반환
-  if (!projectList) {
-    return { total: 0 };
-  }
+  if (!projectList) return { total: 0 };
 
-  const projects = projectList;
-  const counts: ProjectCount = { total: projects.length };
+  const counts: ProjectCount = { total: projectList.length };
 
-  // 각 기수별 카운트 초기화
-  generations.forEach((gen) => {
-    counts[gen.toString()] = 0;
-  });
+  projectList.forEach((project) => {
+    const cardinal = project.cardinal?.toString();
+    if (!cardinal) return;
 
-  // 각 프로젝트를 순회하며 해당 기수의 카운트 증가
-  projects.forEach((project: MeetupItem | CorporateProjectItem) => {
-    const projectCardinal = project.cardinal?.toString();
-    if (projectCardinal && counts[projectCardinal] !== undefined) {
-      counts[projectCardinal]++;
-    }
+    counts[cardinal] = (counts[cardinal] ?? 0) + 1;
   });
 
   return counts;