diff --git a/apps/mobile/src/app/(main)/page.tsx b/apps/mobile/src/app/(main)/page.tsx
index b1fc642..d442a5a 100644
--- a/apps/mobile/src/app/(main)/page.tsx
+++ b/apps/mobile/src/app/(main)/page.tsx
@@ -23,7 +23,7 @@ const MainPage = () => {
         <h1 className={`${heading2Style} ${textCenter}`}>
           우리학교, 우리지역의
           <br />
-          개발 실력을 겨루어보자(가제)
+          개발자 만나기
         </h1>
 
         <div className={buttonDivStyle}>
@@ -48,19 +48,15 @@ const MainPage = () => {
         <h1 className={heading1Style}>유저 랭킹</h1>
 
         <h2 className={heading2Style}>
-          level별
+          tier별
           <br />
-          개발자들의 랭킹을
+          유저들의 랭킹을
           <br />
           확인해보세요
         </h2>
 
         <p className={paragraphStyle}>
-          rankit에서
-          <br />
-          분석한 깃허브 점수를
-          <br />
-          보여드려요(가제)
+          rankit에서 깃허브를 분석한 점수를 보여드려요.
         </p>
 
         <RankBoardWithTier />
diff --git a/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.css.ts b/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.css.ts
index 4101c49..185dafe 100644
--- a/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.css.ts
+++ b/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.css.ts
@@ -52,7 +52,7 @@ export const userNameStyle = style({
 });
 
 export const userCommentStyle = style({
-  ...globalTheme.fonts.mobileDetailReg14,
+  ...globalTheme.fonts.mobileDetailMed10,
   color: globalTheme.colors.blue_66,
 });
 
diff --git a/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.tsx b/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.tsx
index 0fa001f..2ac1a58 100644
--- a/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.tsx
+++ b/apps/mobile/src/app/about/_components/aboutDeveloper/aboutDeveloper.tsx
@@ -23,14 +23,12 @@ const AboutDeveloper = ({
   userName,
   userComment,
   userTier, // 새로운 prop 추가
-  userGithub,
   userImage,
 }: {
   userPosition: string;
   userName: string;
   userComment: string;
   userTier: number; // 1부터 6까지의 숫자
-  userGithub: string;
   userImage: StaticImageData;
 }) => {
   // 티어에 따른 컴포넌트 선택
@@ -49,9 +47,6 @@ const AboutDeveloper = ({
       <div className={divMainContentStyle}>
         <div className={divSubContentStyle1}>
           <p className={userPositionStyle}>{userPosition}</p>
-          <a href={userGithub} className="">
-            github 방문
-          </a>
         </div>
 
         <div className={divSubContentStyle2}>
diff --git a/apps/mobile/src/app/about/page.tsx b/apps/mobile/src/app/about/page.tsx
index f251f55..081e7cc 100644
--- a/apps/mobile/src/app/about/page.tsx
+++ b/apps/mobile/src/app/about/page.tsx
@@ -150,7 +150,6 @@ const AboutPage = () => {
               userTier={1}
               userName="김효준"
               userComment="자유롭게 살고 싶어요."
-              userGithub="https://github.com/khyojun"
               userImage={hyojun}
             />
             <AboutDeveloper
@@ -158,7 +157,6 @@ const AboutPage = () => {
               userTier={2}
               userName="이승준"
               userComment="맥북 쓰고 싶어요."
-              userGithub="https://github.com/leesj000603"
               userImage={seungjun}
             />
           </div>
@@ -168,7 +166,6 @@ const AboutPage = () => {
               userTier={3}
               userName="서대원"
               userComment="힙합 is my life."
-              userGithub="https://github.com/suwonthugger"
               userImage={daewon}
             />
             <AboutDeveloper
@@ -176,7 +173,6 @@ const AboutPage = () => {
               userTier={4}
               userName="박우석"
               userComment="아직도 맥북을 안"
-              userGithub="https://github.com/jamooooong"
               userImage={wooseok}
             />
           </div>
diff --git a/apps/mobile/src/app/auth/_components/authRegion/authRegion.css.ts b/apps/mobile/src/app/auth/_components/authRegion/authRegion.css.ts
index 59d13f4..efbf4f2 100644
--- a/apps/mobile/src/app/auth/_components/authRegion/authRegion.css.ts
+++ b/apps/mobile/src/app/auth/_components/authRegion/authRegion.css.ts
@@ -45,11 +45,9 @@ export const bottomDivStyle = style({
 });
 
 export const skipButtonStyle = style({
-  ...globalTheme.fonts.mobileDetailReg14,
   position: 'absolute',
-  top: '1.1rem',
+  top: '0.8rem',
   right: 0,
-  color: globalTheme.colors.blue_33,
 });
 
 export const InputMenuPlaceholderStyle = style({
diff --git a/apps/mobile/src/app/auth/_components/authRegion/authRegion.tsx b/apps/mobile/src/app/auth/_components/authRegion/authRegion.tsx
index f524096..ffab3f4 100644
--- a/apps/mobile/src/app/auth/_components/authRegion/authRegion.tsx
+++ b/apps/mobile/src/app/auth/_components/authRegion/authRegion.tsx
@@ -1,4 +1,5 @@
 import { useState } from 'react';
+import CustomAlertDialog from '@/shared/components/alertDialog/AlertDialog';
 import Button from '@/shared/components/button/button';
 import Input from '@/shared/components/input/input';
 import { useGetRegionNames, usePostAuthJoin } from '@/shared/apis/auth/queries';
@@ -93,7 +94,23 @@ const AuthRegion = ({ handleNextStep, 대학교 }: AuthRegionProps) => {
       <div className={bottomDivStyle}>
         <Button onClick={handle회원가입}>다음</Button>
 
-        <button className={skipButtonStyle}>건너뛰기</button>
+        <div className={skipButtonStyle}>
+          <CustomAlertDialog
+            att="yesOrNo"
+            variant="textBtn"
+            color="blue"
+            title="알림!"
+            description={[
+              '소속 지역 등록을 건너뜁니다.',
+              <br key="br" />,
+              '"지역 없음"으로 표시됩니다.',
+            ]}
+            cancelText="취소"
+            confirmText="확인"
+            triggerText="건너뛰기"
+            onConfirm={() => handleNextStep('completion')}
+          />
+        </div>
       </div>
     </div>
   );
diff --git a/apps/mobile/src/app/auth/_components/authSchool/authSchool.css.ts b/apps/mobile/src/app/auth/_components/authSchool/authSchool.css.ts
index 046ddde..c9963ac 100644
--- a/apps/mobile/src/app/auth/_components/authSchool/authSchool.css.ts
+++ b/apps/mobile/src/app/auth/_components/authSchool/authSchool.css.ts
@@ -54,11 +54,9 @@ export const bottomDivStyle = style({
 });
 
 export const skipButtonStyle = style({
-  ...globalTheme.fonts.mobileDetailReg14,
   position: 'absolute',
-  top: '9.5rem',
+  top: '9.1rem',
   right: 0,
-  color: globalTheme.colors.blue_33,
 });
 
 export const InputMenuPlaceholderStyle = style({
diff --git a/apps/mobile/src/app/auth/_components/authSchool/authSchool.tsx b/apps/mobile/src/app/auth/_components/authSchool/authSchool.tsx
index 753074d..5844d87 100644
--- a/apps/mobile/src/app/auth/_components/authSchool/authSchool.tsx
+++ b/apps/mobile/src/app/auth/_components/authSchool/authSchool.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import { useState } from 'react';
+import CustomAlertDialog from '@/shared/components/alertDialog/AlertDialog';
 import Button from '@/shared/components/button/button';
 import Input from '@/shared/components/input/input';
 import {
@@ -164,7 +165,23 @@ const AuthSchool = ({ handleNextStep, handle대학교변경 }: AuthSchoolProps)
 
         <Button onClick={handle인증번호검증}>다음</Button>
 
-        <button className={skipButtonStyle}>건너뛰기</button>
+        <div className={skipButtonStyle}>
+          <CustomAlertDialog
+            att="yesOrNo"
+            variant="textBtn"
+            color="blue"
+            title="알림!"
+            description={[
+              '소속 대학교 등록을 건너뜁니다.',
+              <br key="br" />,
+              '"학교 없음"으로 표시됩니다.',
+            ]}
+            cancelText="취소"
+            confirmText="확인"
+            triggerText="건너뛰기"
+            onConfirm={() => handleNextStep('region')}
+          />
+        </div>
       </div>
     </div>
   );
diff --git a/apps/mobile/src/app/board/boardPage.css.ts b/apps/mobile/src/app/board/boardPage.css.ts
index 0cea1f3..596aaf9 100644
--- a/apps/mobile/src/app/board/boardPage.css.ts
+++ b/apps/mobile/src/app/board/boardPage.css.ts
@@ -1,5 +1,5 @@
-import { globalTheme } from '@/shared/styles/globalTheme.css';
 import { style } from '@vanilla-extract/css';
+import { globalTheme } from '@/shared/styles/globalTheme.css';
 
 export const heading2Style = style({
   ...globalTheme.fonts.mobileTitleBold28,
@@ -25,6 +25,10 @@ export const container = style([
     width: '100%',
   },
 ]);
+export const heading1Style = style({
+  ...globalTheme.fonts.mobileTitleSemiBold20,
+  color: globalTheme.colors.blue_main,
+});
 
 export const divStyle = style({
   display: 'flex',
diff --git a/apps/mobile/src/app/board/page.tsx b/apps/mobile/src/app/board/page.tsx
index 4546069..f80912b 100644
--- a/apps/mobile/src/app/board/page.tsx
+++ b/apps/mobile/src/app/board/page.tsx
@@ -6,24 +6,16 @@ import {
   heading2Style,
   inputStyle,
   paragraphStyle,
+  heading1Style,
 } from './boardPage.css';
 
 const SchoolPage = () => {
   return (
     <div className={container}>
       <div className={divStyle}>
-        <h2 className={heading2Style}>
-          고지를
-          <br />
-          선점하기 위해
-          <br />
-          싸워라.
-        </h2>
-
+        <h1 className={heading1Style}>보드</h1>
         <p className={paragraphStyle}>
-          rankit의 모든 유저들이
-          <br />
-          자유롭게 소통하는 공간입니다.
+          rankit의 모든 유저들이 자유롭게 소통하는 공간입니다.
           <br />
           부적절한 멘트는 지양해주세요.
         </p>
diff --git a/apps/mobile/src/app/region/page.tsx b/apps/mobile/src/app/region/page.tsx
index e00c336..181b2d2 100644
--- a/apps/mobile/src/app/region/page.tsx
+++ b/apps/mobile/src/app/region/page.tsx
@@ -31,11 +31,7 @@ const SchoolPage = () => {
         </h2>
 
         <p className={paragraphStyle}>
-          지역명을 눌러서
-          <br />
-          지역내 유저들의
-          <br />
-          순위를 볼 수 있어요.
+          지역명을 눌러서 지역내 유저들의 순위를 볼 수 있어요.
         </p>
 
         <Input
diff --git a/apps/mobile/src/app/school/page.tsx b/apps/mobile/src/app/school/page.tsx
index a768465..7629aa7 100644
--- a/apps/mobile/src/app/school/page.tsx
+++ b/apps/mobile/src/app/school/page.tsx
@@ -59,11 +59,7 @@ const SchoolPage = () => {
         </h2>
 
         <p className={paragraphStyle}>
-          학교명을 눌러서
-          <br />
-          교내 유저들의
-          <br />
-          순위를 볼 수 있어요.
+          학교명을 눌러서 교내 유저들의 순위를 볼 수 있어요.
         </p>
 
         <Input
diff --git a/apps/mobile/src/app/user/userSetting/main-setting/page.tsx b/apps/mobile/src/app/user/userSetting/main-setting/page.tsx
index 5ef993f..3bf458a 100644
--- a/apps/mobile/src/app/user/userSetting/main-setting/page.tsx
+++ b/apps/mobile/src/app/user/userSetting/main-setting/page.tsx
@@ -50,7 +50,7 @@ const MainSetting = ({ userSchool, userRegion }: MainSettingProps) => {
                 소속학교 == {userSchool || '학교 없음'}
               </p>
               <Link href="/school-setting">
-                <Button>변경</Button>
+                <Button size="sm">변경</Button>
               </Link>
             </div>
             <p className={paragraphStyle2}>
@@ -63,7 +63,7 @@ const MainSetting = ({ userSchool, userRegion }: MainSettingProps) => {
                 소속지역 == {userRegion || '지역 없음'}
               </p>
               <Link href="/region-setting">
-                <Button>변경</Button>
+                <Button size="sm">변경</Button>
               </Link>
             </div>
             <p className={paragraphStyle2}>소속지역를 변경할 수 있습니다.</p>
diff --git a/apps/mobile/src/app/user/userSetting/region-setting/page.tsx b/apps/mobile/src/app/user/userSetting/region-setting/page.tsx
index a141343..e7d3a01 100644
--- a/apps/mobile/src/app/user/userSetting/region-setting/page.tsx
+++ b/apps/mobile/src/app/user/userSetting/region-setting/page.tsx
@@ -1,50 +1,101 @@
 'use client';
 
-import Link from 'next/link';
 import { useState } from 'react';
 import Button from '@/shared/components/button/button';
 import Input from '@/shared/components/input/input';
+import { useGetRegionNames, usePostAuthJoin } from '@/shared/apis/auth/queries';
 import ArrowBackIcon from '@/shared/assets/svgs/arrow_back.svg';
 import {
-  headingStyle,
-  sectionStyle,
+  bottomDivStyle,
   container,
-  divStyle,
+  InputMenuPlaceholderStyle,
+  middleDivStyle,
+  paragraphStyle,
   topDivIconStyle,
-  middleDivParagraphStyle,
+  topDivStyle,
 } from './region-setting.css';
 
-const SchoolSetting = () => {
-  const [checked, setChecked] = useState(false);
-  const handleToggleCheck = () => setChecked((prev) => !prev);
+interface RegionSettingProps {
+  handleNextStep: (step: string) => void;
+  대학교: string;
+}
+
+const RegionSetting = ({ handleNextStep, 대학교 }: RegionSettingProps) => {
+  const [지역검색키워드, set지역검색키워드] = useState('');
+
+  const { data } = useGetRegionNames();
+  const { mutate } = usePostAuthJoin();
+
+  const filteredData = data?.filter((region: string) =>
+    region.includes(지역검색키워드),
+  );
+
+  const handle지역검색키워드변경 = (e: React.ChangeEvent<HTMLInputElement>) => {
+    set지역검색키워드(e.target.value);
+  };
+
+  const handle지역선택 = (region: string) => {
+    set지역검색키워드(region);
+  };
+
+  const handle지역변경 = () => {
+    mutate(
+      { univName: 대학교, regionName: 지역검색키워드 },
+      {
+        onSuccess: () => {
+          alert('변경되었습니다.');
+        },
+        onError: (error) => {
+          alert('지역 변경에 실패했습니다. 다시 시도해주세요.');
+          console.error(error);
+        },
+      },
+    );
+  };
 
   return (
     <div className={container}>
-      <div className={divStyle}>
-        {/* heading */}
-        <div className={topDivIconStyle}>
-          <Link href="/main-setting">
-            <button>
-              <ArrowBackIcon />
-            </button>
-          </Link>
-          <p className={headingStyle}>소속지역 변경</p>
-        </div>
-
-        {/* changeInfo */}
-        <section className={sectionStyle}>
-          <Input device="mobile" placeholder="지역 선택" />
-
-          <p className={middleDivParagraphStyle}>
-            본인이 거주 및 출생한 지역을 자유롭게 선택할 수 있습니다. 지역정보는
-            서비스 내 지역 경쟁 콘텐츠에 사용됩니다.
-          </p>
-
-          <Button>인증번호 전송</Button>
-        </section>
+      <div className={topDivStyle}>
+        <button onClick={() => {}}>
+          <ArrowBackIcon className={topDivIconStyle} />
+        </button>
+
+        <h1>소속지역 변경</h1>
+      </div>
+
+      <div className={middleDivStyle}>
+        <Input
+          value={지역검색키워드}
+          onChange={handle지역검색키워드변경}
+          device="mobile"
+          placeholder="지역 선택">
+          <Input.List>
+            {filteredData?.length > 0 ? (
+              filteredData.map((region: string) => (
+                <Input.MenuItem
+                  key={region}
+                  onClick={() => handle지역선택(region)}>
+                  {region}
+                </Input.MenuItem>
+              ))
+            ) : (
+              <p className={InputMenuPlaceholderStyle}>검색 결과가 없습니다.</p>
+            )}
+          </Input.List>
+        </Input>
+
+        <p className={paragraphStyle}>
+          본인이 거주 및 출생한 지역을 자유롭게 선택할 수 있습니다.
+          <br />
+          지역정보는 서비스 내 지역 경쟁 콘텐츠에 사용됩니다.
+        </p>
+      </div>
+
+      <div className={bottomDivStyle}>
+        <Button onClick={handle지역변경}>완료</Button>
       </div>
     </div>
   );
 };
 
-export default SchoolSetting;
+export default RegionSetting;
diff --git a/apps/mobile/src/app/user/userSetting/region-setting/region-setting.css.ts b/apps/mobile/src/app/user/userSetting/region-setting/region-setting.css.ts
index 066a337..efbf4f2 100644
--- a/apps/mobile/src/app/user/userSetting/region-setting/region-setting.css.ts
+++ b/apps/mobile/src/app/user/userSetting/region-setting/region-setting.css.ts
@@ -1,60 +1,58 @@
 import { style } from '@vanilla-extract/css';
 import { globalTheme } from '@/shared/styles/globalTheme.css';
 
-export const flexColumnCenter = style({
+export const container = style({
   display: 'flex',
   flexDirection: 'column',
   alignItems: 'center',
+  position: 'relative',
 });
 
-export const container = style([
-  flexColumnCenter,
-  {
-    width: '100%',
-  },
-]);
+export const topDivStyle = style({
+  ...globalTheme.fonts.mobileTitleBold28,
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+});
 
-export const divStyle = style({
-  width: '39.3rem',
+export const topDivIconStyle = style({
+  position: 'absolute',
+  left: 0,
+});
+
+export const middleDivStyle = style({
   display: 'flex',
   flexDirection: 'column',
   alignItems: 'center',
-  alignContent: 'center',
-  paddingTop: '4rem',
-  paddingBottom: '4rem',
-  paddingLeft: '2.1rem',
-  paddingRight: '2.1rem',
+  marginTop: '4rem',
+  gap: '1.6rem',
 });
 
-export const headingStyle = style({
-  ...globalTheme.fonts.mobileTitleBold28,
-  color: globalTheme.colors.gray_19,
+export const paragraphStyle = style({
+  ...globalTheme.fonts.mobileDetailReg14,
+  width: '32.3rem',
   textAlign: 'center',
-  flex: 1,
 });
 
-export const topDivIconStyle = style({
+export const bottomDivStyle = style({
   display: 'flex',
-  flexDirection: 'row',
+  flexDirection: 'column',
   alignItems: 'center',
-  alignContent: 'center',
+  gap: '2.4rem',
+  marginTop: '2.4rem',
+  position: 'relative',
   width: '100%',
-  marginBottom: '1.6rem',
 });
 
-export const sectionStyle = style({
-  display: 'flex',
-  flexDirection: 'column',
-  width: '100%',
-  marginTop: '2.4rem',
-  background: 'white',
-  justifyContent: 'column',
-  alignItems: 'center',
-  alignContent: 'center',
-  gap: '1.6rem',
+export const skipButtonStyle = style({
+  position: 'absolute',
+  top: '0.8rem',
+  right: 0,
 });
 
-export const middleDivParagraphStyle = style({
-  ...globalTheme.fonts.mobileDetailReg14,
-  marginBottom: '0.8rem',
+export const InputMenuPlaceholderStyle = style({
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  height: '100%',
 });
diff --git a/apps/mobile/src/app/user/userSetting/school-setting/page.tsx b/apps/mobile/src/app/user/userSetting/school-setting/page.tsx
index 0378687..c256da8 100644
--- a/apps/mobile/src/app/user/userSetting/school-setting/page.tsx
+++ b/apps/mobile/src/app/user/userSetting/school-setting/page.tsx
@@ -1,77 +1,169 @@
 'use client';
 
-import Link from 'next/link';
 import { useState } from 'react';
-import CustomAlertDialog from '@/shared/components/alertDialog/AlertDialog';
 import Button from '@/shared/components/button/button';
 import Input from '@/shared/components/input/input';
+import {
+  useGetSchoolNames,
+  usePostUnivCertificate,
+  usePostUnivValidate,
+} from '@/shared/apis/auth/queries';
 import ArrowBackIcon from '@/shared/assets/svgs/arrow_back.svg';
-import CheckBoxChecked from '@/shared/assets/svgs/check_c_btn.svg';
-import CheckBoxUnchecked from '@/shared/assets/svgs/check_u_btn.svg';
+import CheckboxEmptyIcon from '@/shared/assets/svgs/check_btn_empty.svg';
+import CheckboxFillIcon from '@/shared/assets/svgs/check_btn_fill.svg';
 import {
-  headingStyle,
-  sectionStyle,
-  container,
-  divStyle,
-  topDivIconStyle,
+  bottomDivStyle,
   checkDivStyle,
+  container,
+  InputMenuPlaceholderStyle,
   middleDivParagraphStyle,
+  middleDivStyle,
   spanStyle,
+  topDivIconStyle,
+  topDivStyle,
 } from './school-setting.css';
 
-const SchoolSetting = () => {
-  const [checked, setChecked] = useState(false);
-  const handleToggleCheck = () => setChecked((prev) => !prev);
+interface SchoolSettingProps {
+  handleNextStep: (step: string) => void;
+  handle대학교변경: (대학교이름: string) => void;
+}
+
+const SchoolSetting = ({
+  handleNextStep,
+  handle대학교변경,
+}: SchoolSettingProps) => {
+  const [대학교검색키워드, set대학교검색키워드] = useState('');
+  const [대학교이메일, set대학교이메일] = useState('');
+  const [약관동의, set약관동의] = useState(false);
+  const [인증번호, set인증번호] = useState('');
+
+  const Checkbox = 약관동의 ? CheckboxFillIcon : CheckboxEmptyIcon;
+
+  const { data } = useGetSchoolNames();
+  const { mutate: 인증번호전송함수 } = usePostUnivCertificate();
+  const { mutate: 인증번호검증함수 } = usePostUnivValidate();
+
+  const filteredData = data?.filter((school: string) =>
+    school.includes(대학교검색키워드),
+  );
+
+  const handle대학교검색키워드변경 = (
+    e: React.ChangeEvent<HTMLInputElement>,
+  ) => {
+    set대학교검색키워드(e.target.value);
+  };
+
+  const handle대학교선택 = (school: string) => {
+    set대학교검색키워드(school);
+  };
+
+  const handle대학교이메일변경 = (e: React.ChangeEvent<HTMLInputElement>) => {
+    set대학교이메일(e.target.value);
+  };
+
+  const handle약관동의 = () => {
+    set약관동의(!약관동의);
+  };
+
+  const handle인증번호전송 = () => {
+    인증번호전송함수(
+      { email: 대학교이메일, univName: 대학교검색키워드 },
+      {
+        onSuccess: () => {
+          alert('인증번호가 전송되었습니다.');
+        },
+        onError: (error) => {
+          alert('인증번호 전송에 실패했습니다. 다시 시도해주세요.');
+          console.error(error);
+        },
+      },
+    );
+  };
+
+  const handle인증번호변경 = (e: React.ChangeEvent<HTMLInputElement>) => {
+    set인증번호(e.target.value);
+  };
+
+  const handle인증번호검증 = () => {
+    인증번호검증함수(
+      { email: 대학교이메일, univName: 대학교검색키워드, code: 인증번호 },
+      {
+        onSuccess: () => {
+          alert('인증번호가 검증되었습니다.');
+          handle대학교변경(대학교검색키워드);
+        },
+        onError: (error) => {
+          alert('인증번호 검증에 실패했습니다. 다시 시도해주세요.');
+          console.error(error);
+        },
+      },
+    );
+  };
 
   return (
     <div className={container}>
-      <div className={divStyle}>
-        {/* heading */}
-        <div className={topDivIconStyle}>
-          <Link href="/main-setting">
-            <button>
-              <ArrowBackIcon />
-            </button>
-          </Link>
-          <p className={headingStyle}>소속학교 변경</p>
+      <div className={topDivStyle}>
+        <button onClick={() => {}}>
+          <ArrowBackIcon className={topDivIconStyle} />
+        </button>
+
+        <h1>소속학교 변경</h1>
+      </div>
+
+      <div className={middleDivStyle}>
+        <Input
+          value={대학교검색키워드}
+          onChange={handle대학교검색키워드변경}
+          device="mobile"
+          variant="search"
+          placeholder="대학교 검색">
+          <Input.List>
+            {filteredData?.length > 0 ? (
+              filteredData.map((school: string) => (
+                <Input.MenuItem
+                  key={school}
+                  onClick={() => handle대학교선택(school)}>
+                  {school}
+                </Input.MenuItem>
+              ))
+            ) : (
+              <p className={InputMenuPlaceholderStyle}>검색 결과가 없습니다.</p>
+            )}
+          </Input.List>
+        </Input>
+        <Input
+          value={대학교이메일}
+          onChange={handle대학교이메일변경}
+          device="mobile"
+          placeholder="대학 이메일 확인"
+        />
+
+        <div className={checkDivStyle}>
+          <button onClick={handle약관동의}>
+            <Checkbox />
+          </button>
+
+          <p className={middleDivParagraphStyle}>
+            서비스 제공을 목적으로
+            <span className={spanStyle}> 개인정보 수집 및 이용</span>(필수)에
+            동의 합니다.
+          </p>
         </div>
 
-        {/* changeInfo */}
-        <section className={sectionStyle}>
-          <Input device="mobile" variant="search" placeholder="대학교 검색" />
-          <Input device="mobile" placeholder="대학 이메일 확인" />
-
-          <div className={checkDivStyle}>
-            <button onClick={handleToggleCheck}>
-              {checked ? <CheckBoxChecked /> : <CheckBoxUnchecked />}
-            </button>
-            <p className={middleDivParagraphStyle}>
-              서비스 제공을 목적으로
-              <span className={spanStyle}> 개인정보 수집 및 이용</span>(필수)에
-              동의 합니다.
-            </p>
-          </div>
-          <CustomAlertDialog
-            att="noti"
-            variant="normalBtn"
-            color="blue"
-            title="알림!"
-            description={[
-              '입력하신 이메일 주소로',
-              <br key="br" />,
-              '인증번호를 보냈습니다',
-            ]}
-            cancelText="취소"
-            confirmText="확인"
-            triggerText="인증번호 전송"
-          />
-        </section>
-        <section className={sectionStyle}>
-          <Input device="mobile" placeholder="인증번호 입력" />
-          <Link href="/main-setting">
-            <Button>완료</Button>
-          </Link>
-        </section>
+        <span>
+          <Button onClick={handle인증번호전송}>인증번호 전송</Button>
+        </span>
+      </div>
+
+      <div className={bottomDivStyle}>
+        <Input
+          value={인증번호}
+          onChange={handle인증번호변경}
+          device="mobile"
+          placeholder="인증번호 입력"
+        />
+
+        <Button onClick={handle인증번호검증}>완료</Button>
       </div>
     </div>
   );
diff --git a/apps/mobile/src/app/user/userSetting/school-setting/school-setting.css.ts b/apps/mobile/src/app/user/userSetting/school-setting/school-setting.css.ts
index ec8f29a..9c7ff26 100644
--- a/apps/mobile/src/app/user/userSetting/school-setting/school-setting.css.ts
+++ b/apps/mobile/src/app/user/userSetting/school-setting/school-setting.css.ts
@@ -1,100 +1,62 @@
 import { style } from '@vanilla-extract/css';
 import { globalTheme } from '@/shared/styles/globalTheme.css';
 
-export const flexColumnCenter = style({
+export const container = style({
   display: 'flex',
   flexDirection: 'column',
   alignItems: 'center',
+  position: 'relative',
 });
 
-export const container = style([
-  flexColumnCenter,
-  {
-    width: '100%',
-  },
-]);
-
-export const divStyle = style({
-  width: '39.3rem',
-  display: 'flex',
-  flexDirection: 'column',
-  alignItems: 'center',
-  alignContent: 'center',
-  paddingTop: '4rem',
-  paddingBottom: '4rem',
-  paddingLeft: '2.1rem',
-  paddingRight: '2.1rem',
-});
-
-export const subDivBetweenStyle = style({
-  width: '100%',
-  display: 'flex',
-  flexDirection: 'row',
-  justifyContent: 'space-between',
-});
-
-export const headingStyle = style({
+export const topDivStyle = style({
   ...globalTheme.fonts.mobileTitleBold28,
-  color: globalTheme.colors.gray_19,
-  textAlign: 'center',
-  flex: 1,
-});
-
-export const topDivIconStyle = style({
   display: 'flex',
-  flexDirection: 'row',
+  justifyContent: 'center',
   alignItems: 'center',
-  alignContent: 'center',
-  width: '100%',
-  marginBottom: '1.6rem',
 });
 
-export const paragraphStyle = style({
-  flex: 1,
-  textAlign: 'center',
+export const topDivIconStyle = style({
+  position: 'absolute',
+  left: 0,
 });
 
-export const sectionStyle = style({
+export const middleDivStyle = style({
   display: 'flex',
   flexDirection: 'column',
-  width: '100%',
-  marginTop: '2.4rem',
-  background: 'white',
-  justifyContent: 'column',
   alignItems: 'center',
-  alignContent: 'center',
+  marginTop: '4rem',
   gap: '1.6rem',
 });
 
-export const subSectionStyle = style({
-  display: 'flex',
-  flexDirection: 'column',
-  gap: '1.6rem',
-  paddingTop: '0.8rem',
-  paddingBottom: '0.8rem',
-  borderBottom: `1px ${globalTheme.colors.gray_stroke_E2} solid`,
-});
-
-export const paragraphStyle1 = style({
-  ...globalTheme.fonts.mobileHeadSemiBold18,
-  color: globalTheme.colors.gray_19,
-});
-export const paragraphStyle2 = style({
-  ...globalTheme.fonts.mobileDetailReg14,
-  color: globalTheme.colors.gray_71,
-});
-
 export const checkDivStyle = style({
   display: 'flex',
   alignItems: 'center',
   gap: '1.2rem',
 });
 
+export const spanStyle = style({
+  color: globalTheme.colors.blue_main,
+});
+
 export const middleDivParagraphStyle = style({
   ...globalTheme.fonts.mobileDetailReg14,
   width: '30rem',
 });
 
-export const spanStyle = style({
-  color: globalTheme.colors.blue_main,
+export const bottomDivStyle = style({
+  display: 'flex',
+  flexDirection: 'column',
+  alignItems: 'center',
+  gap: '2.4rem',
+  marginTop: '2.4rem',
+  marginBottom: '4.8rem',
+  position: 'relative',
+  width: '100%',
+});
+
+export const InputMenuPlaceholderStyle = style({
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  height: '100%',
 });
diff --git a/apps/mobile/src/shared/styles/globalTheme.css.ts b/apps/mobile/src/shared/styles/globalTheme.css.ts
index dc2de0e..84a8adf 100644
--- a/apps/mobile/src/shared/styles/globalTheme.css.ts
+++ b/apps/mobile/src/shared/styles/globalTheme.css.ts
@@ -24,6 +24,7 @@ const fontSizes = {
   mobileBodyReg16: '1.6rem',
   mobileDetailSemiBold14: '1.4rem',
   mobileDetailReg14: '1.4rem',
+  mobileDetailMed10: '1rem',
 };
 
 const fontWeights = {
@@ -152,6 +153,11 @@ export const globalTheme = createGlobalTheme(':root', {
       fontWeight: fontWeights.regular,
       lineHeight: lineHeights.small,
     },
+    mobileDetailMed10: {
+      fontSize: fontSizes.mobileDetailMed10,
+      fontWeight: fontWeights.medium,
+      lineHeight: lineHeights.small,
+    },
   },
   colors: {
     blue_main: '#1368E8',