diff --git a/src/components/setting/NotificationSection.tsx b/src/components/setting/NotificationSection.tsx
index a6e7fef3..bd0bc069 100644
--- a/src/components/setting/NotificationSection.tsx
+++ b/src/components/setting/NotificationSection.tsx
@@ -85,7 +85,7 @@ export default function NotificationSection({
   const isDiscordPending = pendingOrgAction === "discord";
   const isAnyOrgPending = pendingOrgAction != null;
   return (
-    <Card className="p-8 tablet:p-10">
+    <Card className="p-8">
       <header className="mb-7 flex items-center gap-4">
         <BellIcon />
         <h2 className="font-heading4 text-text-title">알림 설정</h2>
@@ -159,7 +159,7 @@ export default function NotificationSection({
             </div>
           </div>
 
-          <div className="flex items-center gap-4 py-5">
+          <div className="flex items-center gap-4 py-5 tablet:flex-col tablet:items-stretch">
             <div className="flex min-w-0 flex-1 items-center gap-4">
               <SlackIcon className={rowIconClass} />
               <div className="min-w-0">
@@ -172,7 +172,7 @@ export default function NotificationSection({
               </div>
             </div>
             {slackConnected ? (
-              <div className="flex shrink-0 items-center gap-3">
+              <div className="flex shrink-0 items-center gap-3 tablet:justify-between">
                 {slackEnabled && !channelDisabled && (
                   <Badge variant="infoBlue">켜짐</Badge>
                 )}
@@ -194,7 +194,7 @@ export default function NotificationSection({
                 </Button>
               </div>
             ) : (
-              <>
+              <div className="flex shrink-0 items-center gap-3 tablet:w-full tablet:flex-col tablet:items-stretch">
                 <Input
                   aria-label="슬랙 Webhook URL"
                   placeholder="https://hooks.slack.com/..."
@@ -203,7 +203,7 @@ export default function NotificationSection({
                   error={!!slackWebhookError}
                   helperText={slackWebhookError}
                   disabled={channelDisabled || isAnyOrgPending}
-                  wrapperClassName="w-1/4 shrink-0"
+                  wrapperClassName="w-1/4 shrink-0 tablet:w-full"
                   containerClassName="h-10 rounded-lg"
                   inputClassName="px-3 font-body2"
                 />
@@ -211,7 +211,7 @@ export default function NotificationSection({
                   variant="outline"
                   size="small"
                   type="button"
-                  className="shrink-0"
+                  className="shrink-0 tablet:w-full"
                   disabled={
                     channelDisabled ||
                     isAnyOrgPending ||
@@ -222,7 +222,7 @@ export default function NotificationSection({
                 >
                   연동
                 </Button>
-              </>
+              </div>
             )}
           </div>
 
@@ -239,7 +239,7 @@ export default function NotificationSection({
               </div>
             </div>
             {discordConnected ? (
-              <div className="flex shrink-0 items-center gap-3">
+              <div className="flex shrink-0 items-center gap-3 tablet:justify-between">
                 {discordEnabled && !channelDisabled && (
                   <Badge variant="infoBlue">켜짐</Badge>
                 )}
@@ -261,7 +261,7 @@ export default function NotificationSection({
                 </Button>
               </div>
             ) : (
-              <>
+              <div className="flex shrink-0 items-center gap-3 tablet:w-full tablet:flex-col tablet:items-stretch">
                 <Input
                   aria-label="디스코드 Webhook URL"
                   placeholder="https://discord.com/api/webhooks/..."
@@ -270,7 +270,7 @@ export default function NotificationSection({
                   error={!!discordWebhookError}
                   helperText={discordWebhookError}
                   disabled={channelDisabled || isAnyOrgPending}
-                  wrapperClassName="w-1/4 shrink-0"
+                  wrapperClassName="w-1/4 shrink-0 tablet:w-full"
                   containerClassName="h-10 rounded-lg"
                   inputClassName="px-3 font-body2"
                 />
@@ -278,7 +278,7 @@ export default function NotificationSection({
                   variant="outline"
                   size="small"
                   type="button"
-                  className="shrink-0"
+                  className="shrink-0 tablet:w-full"
                   disabled={
                     channelDisabled ||
                     isAnyOrgPending ||
@@ -289,7 +289,7 @@ export default function NotificationSection({
                 >
                   연동
                 </Button>
-              </>
+              </div>
             )}
           </div>
         </div>
diff --git a/src/components/setting/PasswordSection.tsx b/src/components/setting/PasswordSection.tsx
index 4f950feb..7c37c300 100644
--- a/src/components/setting/PasswordSection.tsx
+++ b/src/components/setting/PasswordSection.tsx
@@ -36,7 +36,7 @@ export default function PasswordSection({
   const [showConfirm, setShowConfirm] = useState(false);
 
   return (
-    <Card className="p-8 tablet:p-10">
+    <Card className="p-8">
       <header className="mb-7 flex items-start justify-between gap-4">
         <div>
           <div className="flex gap-4 items-center">
@@ -51,7 +51,7 @@ export default function PasswordSection({
           </p>
         </div>
       </header>
-      <div className="grid grid-cols-1 tablet:grid-cols-1 gap-x-8 gap-y-6 tablet:max-w-4xl">
+      <div className="grid grid-cols-1 gap-x-8 gap-y-6 tablet:max-w-4xl">
         <div className="tablet:col-span-1">
           <Input
             type={showCurrent ? "text" : "password"}
diff --git a/src/components/setting/ProfileSection.tsx b/src/components/setting/ProfileSection.tsx
index fbf62036..d7c300c1 100644
--- a/src/components/setting/ProfileSection.tsx
+++ b/src/components/setting/ProfileSection.tsx
@@ -32,16 +32,16 @@ export default function ProfileSection({
   resetImage,
 }: TProfileSectionProps) {
   return (
-    <Card className="p-8 tablet:p-10">
+    <Card className="p-8">
       <header className="mb-7 flex items-start justify-between gap-4">
         <div className="flex gap-4 items-center">
           <UserProfileCircleIcon />
           <h2 className="font-heading4 text-text-title">프로필</h2>
         </div>
       </header>
-      <div className="flex tablet:flex-row gap-10">
-        <div className="flex flex-col items-center basis-1/4 shrink-0">
-          <div className="mb-4 w-full select-none text-text-title">
+      <div className="flex flex-row gap-10 tablet:flex-col tablet:gap-8">
+        <div className="flex flex-col items-center basis-1/4 shrink-0 tablet:w-full">
+          <div className="mb-4 w-full select-none text-text-title tablet:text-center">
             프로필 이미지
           </div>
           <input
diff --git a/src/components/setting/ProfileSectionSkeleton.tsx b/src/components/setting/ProfileSectionSkeleton.tsx
index 0dcac25b..9718b06d 100644
--- a/src/components/setting/ProfileSectionSkeleton.tsx
+++ b/src/components/setting/ProfileSectionSkeleton.tsx
@@ -8,7 +8,7 @@ export default function ProfileSectionSkeleton() {
         <Skeleton className="w-24 h-7" />
       </div>
 
-      <div className="flex tablet:flex-row gap-10">
+      <div className="flex flex-row tablet:flex-col gap-10 tablet:gap-8">
         <div className="flex flex-col items-center basis-1/4 shrink-0">
           <Skeleton className="w-24 h-5 mb-4" />
           <SkeletonCircle className="w-60 h-60" />
diff --git a/src/components/setting/WithdrawConfirmModal.tsx b/src/components/setting/WithdrawConfirmModal.tsx
index 970df88e..d927e10b 100644
--- a/src/components/setting/WithdrawConfirmModal.tsx
+++ b/src/components/setting/WithdrawConfirmModal.tsx
@@ -35,25 +35,26 @@ export default function WithdrawConfirmModal({
       hideCloseButton={isLoading}
       disableOverlayClick={isLoading}
     >
-      <div className="px-2 text-center">
+      <div className="px-2 text-center tablet:px-0">
         <div className="mb-6 flex justify-center">
           <WarnIcon className="h-15 w-15 text-info-red" aria-hidden="true" />
         </div>
 
-        <h3 className="mb-3 font-heading2 text-text-title">
+        <h3 className="mb-3 font-heading2 text-text-title break-keep text-pretty">
           정말로 회원탈퇴하시겠습니까?
         </h3>
 
-        <p className="mb-7 font-body1 text-text-auth-sub">
-          탈퇴 요청 시 계정은 바로 비활성화되며, <br /> 30일 후 서버에서 완전히
-          삭제됩니다. <br />이 작업은 되돌리기 어려우니 신중히 결정해 주세요
+        <p className="mb-7 font-body1 text-text-auth-sub break-keep text-pretty">
+          탈퇴 요청 시 계정은 바로 비활성화되며, 30일 후 서버에서 완전히
+          삭제됩니다.
+          <br />이 작업은 되돌리기 어려우니 신중히 결정해 주세요.
         </p>
-        <div className="flex gap-4">
+        <div className="flex flex-col gap-3">
           <Button
             type="button"
             variant="outline"
             size="big"
-            className="flex-1"
+            fullWidth
             onClick={handleClose}
             disabled={isLoading}
           >
@@ -63,7 +64,7 @@ export default function WithdrawConfirmModal({
             type="button"
             variant="danger"
             size="big"
-            className="flex-1"
+            fullWidth
             onClick={handleConfirm}
             disabled={isLoading}
             aria-label={isLoading ? "탈퇴 진행 중" : "회원 탈퇴 확인"}
diff --git a/src/components/sidebar/LogoutConfirmModal.tsx b/src/components/sidebar/LogoutConfirmModal.tsx
index d6670210..5ce09339 100644
--- a/src/components/sidebar/LogoutConfirmModal.tsx
+++ b/src/components/sidebar/LogoutConfirmModal.tsx
@@ -36,7 +36,7 @@ export default function LogoutConfirmModal({
       hideCloseButton={isLoading}
       disableOverlayClick={isLoading}
     >
-      <div className="px-2 pt-4 pb-0 text-center">
+      <div className="px-2 pt-4 pb-0 text-center tablet:px-0">
         <div className="mb-5 flex justify-center">
           <div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-info-red/8 ring-1 ring-info-red/15">
             <LogoutIcon className="h-8 w-8 text-info-red" aria-hidden />
diff --git a/src/components/timeline/TimelineBar.tsx b/src/components/timeline/TimelineBar.tsx
index 0c339a49..bc2d3805 100644
--- a/src/components/timeline/TimelineBar.tsx
+++ b/src/components/timeline/TimelineBar.tsx
@@ -118,9 +118,9 @@ export default function TimelineBar({
         <span className="truncate font-caption text-text-muted">
           {bar.subtitle}
         </span>
-        <span className="flex items-center gap-1 font-caption text-text-body">
+        <span className="flex min-w-0 items-center gap-1 font-caption text-text-body">
           <span className={twMerge("h-1.5 w-1.5 rounded-full", status.dot)} />
-          {status.label}
+          <span className="truncate">{status.label}</span>
         </span>
       </div>
       <div
diff --git a/src/components/timeline/TimelineCreateModal.tsx b/src/components/timeline/TimelineCreateModal.tsx
index 59713ba8..2ce74790 100644
--- a/src/components/timeline/TimelineCreateModal.tsx
+++ b/src/components/timeline/TimelineCreateModal.tsx
@@ -149,7 +149,7 @@ export default function TimelineCreateModal({
       title={isEditMode ? "타임라인 수정" : "타임라인 생성"}
       disableOverlayClick={isPending}
     >
-      <div className="flex w-full flex-col items-start px-4 pr-8 tablet:pr-10">
+      <div className="flex w-full flex-col items-start px-4 pr-8 tablet:pr-0 tablet:px-0">
         <h2 className="mb-2 font-heading3 text-text-title">
           {isEditMode ? "타임라인 수정" : "타임라인 생성"}
         </h2>
@@ -161,7 +161,7 @@ export default function TimelineCreateModal({
 
         <form
           onSubmit={handleSubmit(onSubmit)}
-          className="flex w-full flex-col gap-10"
+          className="flex w-full flex-col gap-10 tablet:gap-8"
           noValidate
         >
           <div className="w-full space-y-7">
@@ -174,7 +174,7 @@ export default function TimelineCreateModal({
               {...register("name")}
             />
 
-            <div className="grid grid-cols-1 gap-7 tablet:grid-cols-2">
+            <div className="grid grid-cols-2 gap-7 tablet:grid-mobile-1">
               <div
                 role="presentation"
                 className={!isPending ? "cursor-pointer" : undefined}
diff --git a/src/components/timeline/TimelineGrid.tsx b/src/components/timeline/TimelineGrid.tsx
index fd36cf0a..39004cd4 100644
--- a/src/components/timeline/TimelineGrid.tsx
+++ b/src/components/timeline/TimelineGrid.tsx
@@ -37,7 +37,7 @@ export default function TimelineGrid({
       )}
     >
       <div
-        className="relative min-h-0 flex-1"
+        className="relative min-h-full flex-1 bg-surface-200"
         style={{ minHeight: `max(${bodyHeight}px, 100%)` }}
       >
         {columns.map((column, i) => (
diff --git a/src/components/timeline/TimelinePerformancePanel.tsx b/src/components/timeline/TimelinePerformancePanel.tsx
index 90ece4da..be74a429 100644
--- a/src/components/timeline/TimelinePerformancePanel.tsx
+++ b/src/components/timeline/TimelinePerformancePanel.tsx
@@ -37,7 +37,8 @@ type TAiSummaryUiState = "idle" | "loading" | "done";
 const SECTION_SHELL_CLASS =
   "rounded-3xl border border-surface-300/70 bg-surface-100";
 
-const SECTION_INNER_CLASS = "flex flex-col gap-5 px-6 py-6";
+const SECTION_INNER_CLASS =
+  "flex flex-col gap-5 px-6 py-6 tablet:px-5 tablet:gap-6 tablet:pb-8";
 
 const SOFT_CARD_CLASS = "rounded-2xl bg-surface-100 shadow-Soft";
 
@@ -209,7 +210,7 @@ export default function TimelinePerformancePanel({
       hideHeader
       className={twMerge("max-w-2xl", className)}
     >
-      <div className="flex flex-col gap-7 px-7 pb-10 pt-6">
+      <div className="flex flex-col gap-7 px-7 pb-10 pt-6 tablet:px-5 tablet:gap-6 tablet:pb-8">
         {/* 헤더 */}
         <header className="flex flex-col gap-5">
           <div className="flex items-center justify-between">
@@ -310,13 +311,13 @@ export default function TimelinePerformancePanel({
         </section>
 
         {/* KPI — 선택한 지표 수만큼 가로 균등 분할 */}
-        <section className="flex w-full gap-2">
+        <section className="flex w-full gap-2 tablet:flex-wrap">
           {data.metrics.map((metric) => (
             <div
               key={metric.metric}
               className={twMerge(
                 SOFT_CARD_CLASS,
-                "flex min-w-0 flex-1 flex-col gap-1 px-4 py-3.5",
+                "flex min-w-0 flex-1 flex-col gap-1 px-4 py-3.5 tablet:min-w-[calc(50%-0.25rem)]",
               )}
             >
               <span className="ml-1 flex flex-col">
diff --git a/src/components/timeline/TimelinePeriodSelector.tsx b/src/components/timeline/TimelinePeriodSelector.tsx
index 1ad2fa2d..692735ef 100644
--- a/src/components/timeline/TimelinePeriodSelector.tsx
+++ b/src/components/timeline/TimelinePeriodSelector.tsx
@@ -36,7 +36,7 @@ export function TimelineViewUnitSegment({
             aria-pressed={isSelected}
             onClick={() => onViewUnitChange(option.value)}
             className={twMerge(
-              "rounded-md px-3 py-1.5 font-caption transition-ui-smooth",
+              "rounded-md px-3 py-1.5 font-caption transition-ui-smooth tablet:flex-1",
               isSelected
                 ? "bg-surface-100 text-text-title shadow-Soft"
                 : "text-text-muted hover:text-text-body",
@@ -86,7 +86,10 @@ export function TimelinePeriodNav({
         <ChevronLeftIcon className="h-3.5 w-3.5" />
       </button>
 
-      <span aria-live="polite" className="min-w-40 truncate text-center">
+      <span
+        aria-live="polite"
+        className="min-w-40 truncate text-center tablet:min-w-0 tablet:flex-1"
+      >
         {periodLabel}
       </span>
 
diff --git a/src/components/timeline/TimelineStatusLegend.tsx b/src/components/timeline/TimelineStatusLegend.tsx
index 545c6cfa..26dd0af8 100644
--- a/src/components/timeline/TimelineStatusLegend.tsx
+++ b/src/components/timeline/TimelineStatusLegend.tsx
@@ -19,7 +19,7 @@ export default function TimelineStatusLegend({
   return (
     <div
       className={twMerge(
-        "flex min-w-0 w-full items-center gap-4 rounded-2xl bg-surface-200 px-5 py-3",
+        "flex min-w-0 w-full items-center gap-4 rounded-2xl bg-surface-200 px-5 py-3 tablet:px-4 tablet:py-2.5 tablet:gap-3",
         className,
       )}
     >
diff --git a/src/components/timeline/skeleton/TimelineSkeleton.tsx b/src/components/timeline/skeleton/TimelineSkeleton.tsx
index 6d38d5ca..91bc136b 100644
--- a/src/components/timeline/skeleton/TimelineSkeleton.tsx
+++ b/src/components/timeline/skeleton/TimelineSkeleton.tsx
@@ -9,11 +9,11 @@ export default function TimelineSkeleton() {
       style={{ height: TIMELINE_PAGE_HEIGHT }}
     >
       <div className="flex min-h-0 flex-col flex-1 rounded-2xl border border-surface-400/70 bg-surface-100">
-        <div className="flex flex-col gap-4 shrink-0 border-b border-surface-400/80 px-5 py-5">
-          <Skeleton className="h-6 w-48" />
+        <div className="flex flex-col gap-4 shrink-0 border-b border-surface-400/80 px-5 py-5 tablet:px-4 tablet:py-4 tablet:gap-3">
+          <Skeleton className="h-6 w-48 tablet:w-full" />
           <Skeleton className="h-10 w-full" />
         </div>
-        <div className="flex flex-1 flex-col gap-3 p-5">
+        <div className="flex flex-1 flex-col gap-3 p-5 tablet:p-4">
           <Skeleton className="h-14 w-full" />
           <Skeleton className="h-24 w-full" />
           <Skeleton className="h-24 w-full" />
diff --git a/src/components/workspace/InviteMemberModal.tsx b/src/components/workspace/InviteMemberModal.tsx
index cb62127b..3f6b5b45 100644
--- a/src/components/workspace/InviteMemberModal.tsx
+++ b/src/components/workspace/InviteMemberModal.tsx
@@ -99,22 +99,22 @@ export default function InviteMemberModal({
       title="팀원 초대하기"
       className="w-full max-w-190 overflow-hidden"
     >
-      <div className="flex flex-col h-full max-h-[80vh] text-center px-2 py-6">
-        <div className="flex justify-between items-center px-8 py-6 pb-3 shrink-0">
+      <div className="flex flex-col h-full max-h-[80vh] text-center px-2 py-6 tablet:px-0 tablet:py-4">
+        <div className="flex justify-between items-center px-8 py-6 pb-3 shrink-0 tablet:px-5 tablet:flex-col tablet:items-stretch tablet:gap-3">
           <p className="font-heading4 text-text-title">팀원 초대하기</p>
           <button
             type="button"
             aria-label="팀원 초대 링크 복사 버튼"
             onClick={handleCopyLink}
-            className="flex items-center gap-2 rounded-lg px-2 py-1 text-primary-500 transition-opacity hover:opacity-80"
+            className="flex items-center gap-2 rounded-lg px-2 py-1 text-primary-500 transition-opacity hover:opacity-80 tablet:self-end"
           >
             <CopyIcon />
             <span className="font-body1">링크 복사</span>
           </button>
         </div>
-        <div className="px-8 py-4 shrink-0">
-          <div className="flex items-center gap-7">
-            <div className="flex-1">
+        <div className="px-8 py-4 shrink-0 tablet:px-5">
+          <div className="flex items-center gap-7 tablet:flex-col tablet:items-stretch tablet:gap-3">
+            <div className="flex-1 tablet:w-full">
               <Input
                 value={form.email}
                 placeholder="이메일을 입력해서 팀원을 초대하세요"
@@ -129,13 +129,13 @@ export default function InviteMemberModal({
               size="big"
               onClick={handleInvite}
               disabled={isInviteDisabled}
-              className="min-w-22"
+              className="min-w-22 tablet:w-full"
             >
               {inviteMutation.isPending ? "초대 중..." : "초대"}
             </Button>
           </div>
         </div>
-        <div className="min-h-0 flex-1 overflow-y-auto px-8 py-4">
+        <div className="min-h-0 flex-1 overflow-y-auto px-8 py-4 tablet:px-5">
           <ul>
             {inviteItems.map((item) => {
               if (item.inviteStatus === "PENDING") {
diff --git a/src/components/workspace/MemberItem.tsx b/src/components/workspace/MemberItem.tsx
index 4c99c35c..87f9a171 100644
--- a/src/components/workspace/MemberItem.tsx
+++ b/src/components/workspace/MemberItem.tsx
@@ -42,7 +42,7 @@ export default function MemberItem({
     !isReceiveUpdating &&
     !!onReceiveToggle;
   return (
-    <li className="flex items-center justify-between py-5 gap-4 tablet:items-start">
+    <li className="flex items-center justify-between py-5 gap-4 tablet:items-stretch">
       <div className="flex items-center gap-4 w-full min-w-0">
         <div className="flex bg-text-placeholder/30 h-12 w-12 items-center justify-center shrink-0 rounded-3xl overflow-hidden">
           {member.profileImageUrl ? (
@@ -75,7 +75,7 @@ export default function MemberItem({
           </div>
         </div>
       </div>
-      <div className="flex items-center gap-4">
+      <div className="flex items-center gap-4 shrink-0 tablet:justify-end">
         <button
           type="button"
           disabled={!canToggleReceive}
diff --git a/src/components/workspace/MemberList.tsx b/src/components/workspace/MemberList.tsx
index 486b85cd..709e9ef4 100644
--- a/src/components/workspace/MemberList.tsx
+++ b/src/components/workspace/MemberList.tsx
@@ -81,8 +81,8 @@ export default function MemberList({
   const hasVisibleItems = members.length > 0;
 
   return (
-    <Card className="p-8">
-      <header className="mb-7 flex items-start justify-between gap-4">
+    <Card className="p-8 tablet:p-6">
+      <header className="mb-7 flex items-start justify-between gap-4 tablet:flex-col tablet:items-stretch">
         <div>
           <h2 className="font-heading4 text-text-title">팀 구성원</h2>
           <p className="mt-2 font-body2 text-text-muted">
@@ -100,7 +100,7 @@ export default function MemberList({
           size="small"
           aria-label="팀원 초대 버튼"
           onClick={openInviteMember}
-          className="p-5 py-6 rounded-2xl"
+          className="p-5 py-6 rounded-2xl tablet:w-full"
         >
           <PlusIcon className="w-3 h-3 fill-white" />
           팀원 초대
diff --git a/src/components/workspace/PermissionTable.tsx b/src/components/workspace/PermissionTable.tsx
index 88912f37..eec0e911 100644
--- a/src/components/workspace/PermissionTable.tsx
+++ b/src/components/workspace/PermissionTable.tsx
@@ -165,11 +165,11 @@ export default function PermissionTable() {
         </table>
       </div>
 
-      <div className="mt-8 rounded-2xl bg-surface-200/60 px-5 py-5 sm:px-6">
+      <div className="mt-8 rounded-2xl bg-surface-200/60 px-5 py-5 tablet:px-4 tablet:py-4">
         {hasChanges ? (
           <p
             role="status"
-            className="mb-4 rounded-xl bg-primary-100/50 px-4 py-3 font-body2 text-text-title"
+            className="mb-4 rounded-xl bg-primary-100/50 px-4 py-3 font-body2 text-text-title break-keep text-pretty"
           >
             <span className="font-label text-primary-500">저장 필요</span>
             <span className="text-text-muted"> · </span>
@@ -177,19 +177,19 @@ export default function PermissionTable() {
             이전 설정으로 돌아갑니다.
           </p>
         ) : (
-          <p className="mb-4 font-body2 text-text-muted">
+          <p className="mb-4 font-body2 text-text-muted break-keep text-pretty">
             멤버 열의 토글을 바꾼 뒤, 아래에서 저장하거나 변경을 취소할 수
             있습니다.
           </p>
         )}
-        <div className="flex flex-wrap items-center justify-end gap-3">
+        <div className="flex flex-wrap items-center justify-end gap-3 tablet:flex-col tablet:items-stretch">
           <Button
             type="button"
             variant="outline"
             size="big"
             onClick={handleResetChange}
             disabled={!hasChanges || isSaving}
-            className="rounded-2xl"
+            className="rounded-2xl tablet:w-full"
           >
             변경 취소
           </Button>
@@ -199,7 +199,7 @@ export default function PermissionTable() {
             size="big"
             onClick={handleSaveChanges}
             disabled={!hasChanges || isSaving}
-            className="rounded-2xl"
+            className="rounded-2xl tablet:w-full"
           >
             {isSaving ? "저장 중..." : "변경사항 저장하기"}
           </Button>
diff --git a/src/components/workspace/TransferOwnerModal.tsx b/src/components/workspace/TransferOwnerModal.tsx
index 86e48b77..e2a11ddf 100644
--- a/src/components/workspace/TransferOwnerModal.tsx
+++ b/src/components/workspace/TransferOwnerModal.tsx
@@ -52,7 +52,7 @@ export default function TransferOwnerModal({
       title="조직 소유권 양도"
       disableOverlayClick={isLoading}
     >
-      <div className="px-2 py-4">
+      <div className="px-2 py-4 tablet:px-0">
         <div className="mb-5 flex justify-center">
           <WarnIcon className="h-12 w-12 text-info-yellow" aria-hidden="true" />
         </div>
@@ -63,7 +63,7 @@ export default function TransferOwnerModal({
         <p className="mb-1 text-center font-body1 text-text-auth-sub">
           현재 소유자: {currentOwnerName}
         </p>
-        <p className="mb-6 text-center font-body2 text-text-muted">
+        <p className="mb-6 text-center font-body2 text-text-muted break-keep text-pretty">
           양도 대상은 같은 조직의 관리자(ADMIN)만 선택할 수 있습니다.
           <br />
           양도 후에는 되돌릴 수 없으며, 새 소유자만 다시 양도 가능합니다.
@@ -85,7 +85,7 @@ export default function TransferOwnerModal({
             </p>
           )}
         </div>
-        <div className="flex justify-center gap-3">
+        <div className="flex justify-center gap-3 tablet:flex-col">
           <Button
             type="button"
             variant="outline"
diff --git a/src/pages/dashboard/timeline/Timeline.tsx b/src/pages/dashboard/timeline/Timeline.tsx
index 077c7279..98acf1ef 100644
--- a/src/pages/dashboard/timeline/Timeline.tsx
+++ b/src/pages/dashboard/timeline/Timeline.tsx
@@ -285,9 +285,9 @@ export default function Timeline() {
         FallbackComponent={AreaErrorFallback}
         resetKeys={[timelineList, viewUnit, periodIndex]}
       >
-        <div className="flex min-h-0 flex-1 w-full min-w-0 flex-col rounded-2xl border border-surface-400/70 bg-surface-100">
-          <div className="flex shrink-0 flex-col gap-4 border-b border-surface-400/80 px-5 py-5">
-            <div className="flex items-center justify-between gap-8">
+        <div className="flex min-h-full flex-1 w-full min-w-0 flex-col rounded-2xl border border-surface-400/70 bg-surface-100">
+          <div className="flex shrink-0 flex-col gap-4 border-b border-surface-400/80 px-5 py-5 tablet:px-4 tablet:py-4 tablet:gap-3">
+            <div className="flex items-center justify-between gap-8 tablet:flex-col tablet:items-stretch tablet:gap-3">
               <TimelineStatusLegend className="min-w-0 flex-1" />
               <Button
                 type="button"
@@ -305,17 +305,18 @@ export default function Timeline() {
                   "bg-primary-400/20 text-primary-500",
                   "font-body2 shadow-Soft",
                   "transition-ui-smooth hover:bg-primary-500/30",
+                  "tablet:w-full tablet:justify-center",
                 )}
               >
                 타임라인 생성
               </Button>
             </div>
 
-            <div className="grid grid-cols-[1fr_auto_1fr] items-center gap-4">
+            <div className="grid grid-cols-[1fr_auto_1fr] items-center gap-4 tablet:grid-cols-1 tablet:gap-3">
               <TimelineViewUnitSegment
                 viewUnit={viewUnit}
                 onViewUnitChange={handleViewUnitChange}
-                className="justify-self-start"
+                className="justify-self-start tablet:justify-self-stretch tablet:w-full"
               />
               <TimelinePeriodNav
                 periodLabel={periodLabel}
@@ -324,7 +325,7 @@ export default function Timeline() {
                 onGoToToday={handleGoToToday}
                 className="justify-self-center"
               />
-              <div className="flex items-center justify-self-end gap-3">
+              <div className="flex items-center justify-self-end gap-3 tablet:justify-self-end">
                 <span
                   className={TOOLBAR_ACTION_CLASS}
                   title="준비 중"
diff --git a/src/pages/setting/Setting.tsx b/src/pages/setting/Setting.tsx
index 18d8c731..73e35949 100644
--- a/src/pages/setting/Setting.tsx
+++ b/src/pages/setting/Setting.tsx
@@ -731,10 +731,10 @@ export default function Setting() {
         )}
       </div>
 
-      <div className="flex items-start justify-between">
+      <div className="flex items-start justify-between gap-4 tablet:flex-col tablet:items-stretch">
         <button
           type="button"
-          className="ml-3 font-caption text-text-muted underline decoration-surface-400 underline-offset-2 transition-colors hover:text-text-title"
+          className="ml-3 font-caption text-text-muted underline decoration-surface-400 underline-offset-2 transition-colors hover:text-text-title tablet:ml-0 tablet:self-start"
           onClick={() => setIsWithdrawModalOpen(true)}
           aria-label="회원 탈퇴"
         >
@@ -749,6 +749,7 @@ export default function Setting() {
           disabled={
             !hasChanges || isLoading || isNotificationSectionLoading || isSaving
           }
+          className="tablet:w-full"
         >
           변경사항 저장하기
         </Button>
diff --git a/src/pages/workspace/Workspace.tsx b/src/pages/workspace/Workspace.tsx
index 89d56119..a6f485f1 100644
--- a/src/pages/workspace/Workspace.tsx
+++ b/src/pages/workspace/Workspace.tsx
@@ -222,11 +222,11 @@ export default function WorkspacePage() {
       </ErrorBoundary>
 
       <Modal isOpen={createOpen} onClose={onCloseCreate} size="md" padding="lg">
-        <div className="flex flex-col items-start pr-10 px-2 tablet:px-0">
+        <div className="flex flex-col items-start pr-10 px-2 tablet:px-0 tablet:pr-0">
           <h2 className="mb-2 font-heading3 text-text-title">
             워크스페이스 생성
           </h2>
-          <p className="mb-10 text-start font-body2 text-text-muted">
+          <p className="mb-10 text-start font-body2 text-text-muted tablet:mb-8">
             워크스페이스를 생성한 사용자는 자동으로 관리자 권한을 갖습니다.
             <br className="tablet:hidden" />
             로고 이미지와 기본 정보를 입력해 주세요.
diff --git a/src/pages/workspace/WorkspaceSetting.tsx b/src/pages/workspace/WorkspaceSetting.tsx
index 6e574b7a..16533322 100644
--- a/src/pages/workspace/WorkspaceSetting.tsx
+++ b/src/pages/workspace/WorkspaceSetting.tsx
@@ -277,7 +277,7 @@ export default function WorkspaceSetting() {
           resetKeys={[detail]}
         >
           <>
-            <Card className="p-8">
+            <Card className="p-8 tablet:p-6">
               <h2 className="font-heading3 text-text-title">조직 기본 정보</h2>
               <div className="mt-6 flex flex-row gap-12 items-start tablet:flex-col tablet:gap-8">
                 <div className="flex w-60 shrink-0 flex-col items-center tablet:w-full">
@@ -400,10 +400,13 @@ export default function WorkspaceSetting() {
                     <p className="mt-2 font-body1 text-text-auth-sub">
                       현재 소유자: {currentOwner?.name ?? myName ?? "-"}
                     </p>
-                    <p className="mt-1 font-body2 text-text-muted">
+                    <p className="mt-1 font-body2 text-text-muted break-keep">
                       소유권은 같은 조직의 관리자(ADMIN)에게만 양도할 수
-                      있습니다. 양도 후에야 멤버가 있는 조직의 소유자가 회원
-                      탈퇴를 진행할 수 있습니다.
+                      있습니다.
+                    </p>
+                    <p className="mt-1 font-body2 text-text-muted break-keep">
+                      양도 후에야 멤버가 있는 조직의 소유자가 회원 탈퇴를 진행할
+                      수 있습니다.
                     </p>
                   </div>
                   <Button