YAPP-admin · YAPPgit · Apr 15, 2026 · Oct 16, 2025 · Oct 18, 2025 · Oct 24, 2025
diff --git a/components/common/HamburgerMenu/index.tsx b/components/common/HamburgerMenu/index.tsx
@@ -71,7 +71,7 @@ const MenuList = styled.div`
   gap: 32px;
 `;
 
-const MenuItem = styled.a<{ active: boolean }>`
+const MenuItem = styled.span<{ active: boolean }>`
   cursor: pointer;
   ${({ theme }) => theme.textStyleV2.fix.font_20}
   color: ${({ theme, active }) =>

diff --git a/components/common/Header/index.tsx b/components/common/Header/index.tsx
@@ -42,7 +42,7 @@ function Header(): ReactElement {
           <Logo onClick={() => router.push(Path.Home)} />
           <HeaderMenu>
             {HEADER_MENUS.map(({ name, path }) => (
-              <Link key={`${name}_${path}`} href={path} scroll={false} passHref>
+              <Link key={`${name}_${path}`} href={path} scroll={false}>
                 <MenuText active={asPath === path}>{name}</MenuText>
               </Link>
             ))}
@@ -99,7 +99,7 @@ const HeaderMenu = styled.div`
   }
 `;
 
-const MenuText = styled.a<{ active: boolean }>`
+const MenuText = styled.span<{ active: boolean }>`
   cursor: pointer;
   color: ${({ theme, active }) =>
     active ? theme.palette.white : theme.palette.white_50};

diff --git a/components/common/JoinSection/index.tsx b/components/common/JoinSection/index.tsx
@@ -30,7 +30,7 @@ function JoinSection({
               title={title || 'FIND YOUR BALANCE'}
               subTitle={
                 subTitle ||
-                `지원하기 버튼 하나로\nYAPP 27기의 야뿌가 되어보세요.`
+                `지원하기 버튼 하나로\nYAPP ${Yapp.YAPP_GENERATION}기의 야뿌가 되어보세요.`
               }
               caution={caution}
               align="center"
@@ -46,7 +46,7 @@ function JoinSection({
                 }
               }}
             >
-              {btnText || '27기 지원하기'}
+              {btnText || `${Yapp.YAPP_GENERATION}기 지원하기`}
             </Button>
           </InnerContainer>
         </ImageContainer>

diff --git a/components/common/ProjectCard/index.tsx b/components/common/ProjectCard/index.tsx
@@ -15,15 +15,15 @@ function ProjectCard({ project, isSubCard }: ProjectCardProps) {
   const { title, thumbnail, tags, generation, url } = project;
 
   return (
-    <Link href={isSubCard ? `${url}` : `project/${url}`}>
-      <StyledProjectCard isSubCard={isSubCard}>
+    <Link href={isSubCard ? `${url}` : `project/${url}`} passHref>
+      <StyledProjectCard>
         <AnimatedImage
           className="project-card-image"
           src={thumbnail}
           alt="project-image"
           height={214}
         />
-        <ContentContainer isSubCard={isSubCard}>
+        <ContentContainer>
           <DetailWrapper>
             {isSubCard ? (
               <ProjectSubTitleWrapper>{title}</ProjectSubTitleWrapper>
@@ -55,25 +55,17 @@ const StyledProjectCard = styled.div<{ isSubCard?: boolean }>`
   will-change: transform;
   animation: ${fadeIn} 0.5s ease-in-out;
   box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);
+  transition: filter 0.5s;
 
-  ${({ isSubCard }) =>
-    isSubCard
-      ? css`
-          .project-card-image {
-            border-radius: 20px;
-          }
-        `
-      : css`
-          filter: drop-shadow(
-            0px 5px 40px ${({ theme }) => theme.palette.grey_850 + '10'}
-          );
-          transition: filter 0.5s;
-          :hover {
-            filter: drop-shadow(
-              0px 5px 40px ${({ theme }) => theme.palette.grey_850 + '30'}
-            );
-          }
-        `}
+  filter: drop-shadow(
+    0px 5px 40px ${({ theme }) => theme.palette.grey_850 + '10'}
+  );
+
+  :hover {
+    filter: drop-shadow(
+      0px 5px 40px ${({ theme }) => theme.palette.grey_850 + '30'}
+    );
+  }
 
   ${media.mobile} {
     width: 335px;
@@ -92,14 +84,6 @@ const ContentContainer = styled.div<{ isSubCard?: boolean }>`
   ${media.mobile} {
     margin: 20px 24px;
   }
-  ${({ isSubCard }) =>
-    isSubCard &&
-    css`
-      margin: 16px 0 0 0;
-      ${media.mobile} {
-        margin: 10px 0 0 0;
-      }
-    `}
 `;
 
 const DetailWrapper = styled.div`
@@ -124,6 +108,7 @@ const ProjectSubTitleWrapper = styled.span`
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  color: ${({ theme }) => theme.palette.grey_850};
 
   ${({ theme }) => theme.textStyleV2.resp.body_point_md};
 

diff --git a/components/home/RecuitBtn/index.tsx b/components/home/RecuitBtn/index.tsx
@@ -65,7 +65,7 @@ function RecuitBtn(): ReactElement {
     >
       <InfoText>10.16(목) - 10.25(토)</InfoText>
       <AnimatedButton animate={controls} whileTap={{ scale: 0.97 }}>
-        27기 지원하기
+        {Yapp.YAPP_GENERATION}기 지원하기
       </AnimatedButton>
     </BtnContainer>
   );

diff --git a/components/project/ProjectContent/index.tsx b/components/project/ProjectContent/index.tsx
@@ -22,6 +22,7 @@ function ProjectContent({ project }: Props): ReactElement {
     playStoreLink,
     oneStoreLink,
     webLink,
+    behanceLink,
     linkTreeLink,
     description,
     program,
@@ -74,15 +75,33 @@ function ProjectContent({ project }: Props): ReactElement {
         )}
 
         {/* Web 링크 */}
-        {webLink && (
-          <Link href={webLink} passHref target="_blank">
+        {(Array.isArray(webLink) ? webLink : webLink ? [webLink] : []).map(
+          (url, index) => (
+            <Link key={`web-${index}`} href={url} passHref target="_blank">
+              <DeployLinkButton variant="black">
+                <WebLink />
+                Web
+                <BtnArrowRight />
+              </DeployLinkButton>
+            </Link>
+          ),
+        )}
+
+        {/* Behance 링크 */}
+        {(Array.isArray(behanceLink)
+          ? behanceLink
+          : behanceLink
+          ? [behanceLink]
+          : []
+        ).map((url, index) => (
+          <Link key={`behance-${index}`} href={url} passHref target="_blank">
             <DeployLinkButton variant="black">
               <WebLink />
-              Web
+              Behance
               <BtnArrowRight />
             </DeployLinkButton>
           </Link>
-        )}
+        ))}
 
         {/* App 링크(24기 이전에는 aos 또는 ios, 24기 이후로는 ios) */}
         {deployLink && (

diff --git a/components/recruit/FrequentlyAskedQuestions/index.tsx b/components/recruit/FrequentlyAskedQuestions/index.tsx
@@ -75,7 +75,7 @@ function FrequentlyAskedQuestions(): ReactElement {
             onClick={() => window.open(Yapp.YAPP_FAQ_NOTION, '_blank')}
             style={{ width: 'fit-content', marginTop: '32px' }}
           >
-            27기 채용 FAQ 바로가기
+            {Yapp.YAPP_GENERATION}기 채용 FAQ 바로가기
           </Button>
         </SectionContent>
       </SectionInner>

diff --git a/components/recruit/RecruitBanner/index.tsx b/components/recruit/RecruitBanner/index.tsx
@@ -36,7 +36,7 @@ function RecruitBanner() {
           variant="primary"
           onClick={() => {
             if (!IS_RECRUITING) {
-              window.location.href = NEXT_GENERATION_RECRUIT_LINK;
+              window.open(NEXT_GENERATION_RECRUIT_LINK, '_blank');
               return;
             }
             window.open(Yapp.YAPP_RECRUIT_ALL, '_blank');

diff --git a/components/recruit/RecruitField/index.tsx b/components/recruit/RecruitField/index.tsx
@@ -1,4 +1,8 @@
-import { RECRUIT_FIELD_NAMES, RECRUIT_TITLE } from 'database/recruit';
+import {
+  IS_RECRUITING,
+  RECRUIT_FIELD_NAMES,
+  RECRUIT_TITLE,
+} from 'database/recruit';
 import { ReactElement, useEffect, useState } from 'react';
 import SectionTitle from 'components/common/SectionTitle';
 import styled from 'styled-components';
@@ -31,7 +35,7 @@ function RecruitField(): ReactElement {
             key={field.name}
             variants={itemVariants}
             onClick={() => {
-              if (field.url) {
+              if (IS_RECRUITING && field.url) {
                 window.open(field.url, '_blank');
               }
             }}
@@ -44,6 +48,7 @@ function RecruitField(): ReactElement {
               isFlipped={flippedIndex === index}
               onHoverStart={() => setFlippedIndex(index)}
               onHoverEnd={() => setFlippedIndex(null)}
+              isRecruiting={IS_RECRUITING}
             />
           </motion.li>
         ))}

diff --git a/components/recruit/RecuitCard/index.tsx b/components/recruit/RecuitCard/index.tsx
@@ -12,6 +12,7 @@ interface CardProps {
   isFlipped: boolean;
   onHoverStart: () => void;
   onHoverEnd: () => void;
+  isRecruiting?: boolean;
 }
 
 function RecruitCard({
@@ -22,6 +23,7 @@ function RecruitCard({
   isFlipped,
   onHoverStart,
   onHoverEnd,
+  isRecruiting = true,
 }: CardProps): ReactElement {
   return (
     <CardContainer
@@ -38,6 +40,7 @@ function RecruitCard({
           <ApplyBtn
             color={backgroundColor === 'white' ? 'black_100' : 'white_100'}
             back={false}
+            disabled={!isRecruiting}
           >
             <p>지원하기</p>
             <CircleArrow />
@@ -47,7 +50,7 @@ function RecruitCard({
           {backInfo.map((info, idx) => (
             <p key={idx}>{info}</p>
           ))}
-          <ApplyBtn back>
+          <ApplyBtn back disabled={!isRecruiting}>
             <p>지원하기</p>
             <CircleArrow />
           </ApplyBtn>
@@ -118,10 +121,15 @@ const CardBack = styled(CardFace)`
   color: ${theme.palette.white_100};
 `;
 
-const ApplyBtn = styled.button<{ back: boolean; color?: PaletteKeyTypes }>`
+const ApplyBtn = styled.button<{
+  back: boolean;
+  color?: PaletteKeyTypes;
+  disabled?: boolean;
+}>`
   background: transparent;
   border: none;
-  cursor: pointer;
+  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
+  opacity: ${({ disabled }) => (disabled ? 0.5 : 1)};
   display: flex;
   align-items: center;
   justify-content: center;

diff --git a/components/story/MediumCard/index.tsx b/components/story/MediumCard/index.tsx
@@ -59,6 +59,7 @@ const MediumCardContainer = styled.article`
     flex-direction: row;
     gap: 16px;
     width: 100%;
+    height: fit-content;
   }
 `;
 
@@ -86,7 +87,7 @@ const ImageContainer = styled.div`
 const MediumInfo = styled.section`
   width: 100%;
   margin: 0;
-  height: -webkit-fill-available;
+  height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: flex-end;

diff --git a/constants/yapp.ts b/constants/yapp.ts
@@ -17,7 +17,7 @@ const Yapp = {
     'https://yapp-recruit.career.greetinghr.com/ko/o/177931',
   YAPP_RECRUIT_IOS: 'https://yapp-recruit.career.greetinghr.com/ko/o/177938',
   YAPP_RECRUIT_ANDROID:
-    'https://yapp-recruit.career.greetinghr.com/ko/o/177938',
+    'https://yapp-recruit.career.greetinghr.com/ko/o/177936',
   YAPP_RECRUIT_FRONT_END:
     'https://yapp-recruit.career.greetinghr.com/ko/o/177934',
   YAPP_RECRUIT_BACK_END:

diff --git a/database/home.ts b/database/home.ts
@@ -1,3 +1,5 @@
+import Yapp from 'constants/yapp';
+
 /** Grid Section */
 export const CURRENT_INFO_DATA = [
   {
@@ -183,3 +185,20 @@ export const SPONSOR_DATA = [
     alt: 'sponsor greeting',
   },
 ];
+
+/* 모집 관련 상수 */
+export const RECRUIT_BANNER = {
+  title: 'FIND YOUR BALANCE',
+  subTitle: `다음 기수의 모집 소식을 가장 먼저 만나보세요`,
+  date: '지금은 모집 기간이 아닙니다',
+  buttonName: `${Number(Yapp.YAPP_GENERATION) + 1}기 모집 알림 신청하기`,
+};
+
+export const RECRUIT_BANNER_PRE = {
+  title: 'FIND YOUR BALANCE',
+  subTitle: `지원하기 버튼 하나로\nYAPP ${Number(
+    Yapp.YAPP_GENERATION,
+  )}기의 야뿌가 되어보세요.`,
+  date: '10.16(목) - 10.25(토)',
+  buttonName: `${Number(Yapp.YAPP_GENERATION)}기 지원하기`,
+};
diff --git a/database/projects/26th/ssok.json b/database/projects/26th/ssok.json
@@ -75,5 +75,6 @@
     }
   ],
   "webLink": "https://ssok.info/",
+  "behanceLink": "https://www.behance.net/gallery/242522831/Ssok-Web-UXUI-for-Automated-Travel-Stay-Comparison",
   "description": "나에게 딱 맞는 여행 숙소 찾기, 복잡할 필요 없어요.<br />쏙에서 링크만 넣으면 자동으로 비교표가 완성돼요.<br />가격·평점·후기를 한눈에 보고, 친구와 의견도 쉽게 모을 수 있답니다.<br />탭을 수십 개 열 필요 없이, 한 곳에서 빠르게 결정!<br />여행 준비는 단순하게, 설렘은 더 크게 만들어보세요 ✨"
 }