SHcommit · Nov 9, 2026 · Nov 8, 2026 · Nov 9, 2026 · Nov 9, 2026 · Nov 9, 2026
diff --git a/changelog.md b/changelog.md
@@ -4,6 +4,13 @@ Lightweight human-readable summary of meaningful repository changes. This does n
 
 ## [Unreleased]
 
+## [v0.1.24] - 2026-11-09
+
+- 모바일 좌우 여백을 16px로 통일:
+  - 한옥·K-마루·소리마루·저니 큐레이터·지도마루 피드·계절 카드의 페이지 래퍼를 `calc(100% - 32px)`로 맞추고, 수결첩 루트의 좌우 패딩 0을 수정했다.
+  - 전국 한옥 도감을 모바일에서 2열로 표시하고, 지역별 한옥 스테이의 결과 개수를 제목 오른쪽으로 옮겼다.
+  - 가로 스크롤러의 스크롤바를 숨기고, 푸터에 모바일 하단 탭바 높이만큼 여백을 추가했다.
+  - 소리마루 "오늘, 여기에서"에서 "기본 위치" 라벨과 장식용 "?" 글자를 제거했다.
 - 카카오 장소 검색 기반 온기(방문 후기) 등록 404 오류 수정:
   - 백엔드 Issue #643 신규 외부 장소 등록 규격(`POST /api/v1/visit-reviews`) 연동:
     - 카카오 검색 장소 선택 시 카카오 외부 장소 페이로드(`provider: "KAKAO"`, `externalId`, `name`, `lat`, `lng`)를 신규 엔드포인트로 전송하도록 클린 아키텍처 포트, 유스케이스, 리포지토리 및 모달 UI를 수정했다.

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "onmaru-frontend",
-  "version": "0.1.23",
+  "version": "0.1.24",
   "private": true,
   "scripts": {
     "dev": "next dev",

diff --git a/src/app/mypage/page.tsx b/src/app/mypage/page.tsx
@@ -52,13 +52,13 @@ type FilterTab = 'ALL' | 'TIMELINE' | 'EXPLORATION' | 'JOURNEY' | 'SOUND' | 'BOO
 /* -------------------------------------------------------------------------- */
 
 const PageContainer = styled.div`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   margin: 0 auto;
   padding-top: 104px;
   padding-bottom: 96px;
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
     padding-top: 84px;
     padding-bottom: 64px;
   }

diff --git a/src/features/hanok-archive/HanokArchive.tsx b/src/features/hanok-archive/HanokArchive.tsx
@@ -69,17 +69,17 @@ const PageInner = styled.div`
 
 const SectionContainer = styled.div`
   margin: 0 auto;
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   padding: ${spacingLayout.sectionGap} 0;
 
   @media (max-width: 1023px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
     padding: ${spacingLayout.sectionGap} 0;
   }
 
   ${mq.mobile} {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
   }
 `;
 
@@ -116,7 +116,7 @@ const ArchiveSection = styled.div`
 const IntroStage = styled.div`
   position: relative;
   overflow: hidden;
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   border-radius: 24px;
@@ -126,12 +126,12 @@ const IntroStage = styled.div`
   justify-content: center;
 
   @media (max-width: 1023px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
     margin: 0 auto;
   }
 
   ${mq.mobile} {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
     margin: 0 auto;
     border-radius: 18px;
     min-height: 240px;

diff --git a/src/features/hanok-archive/sections/HanokGrid.tsx b/src/features/hanok-archive/sections/HanokGrid.tsx
@@ -21,7 +21,7 @@ const Section = styled.section``;
 
 const Grid = styled(motion.div)`
   display: grid;
-  grid-template-columns: repeat(1, 1fr);
+  grid-template-columns: repeat(2, 1fr);
   gap: ${spacingLayout.cardGap};
 
   ${mq.tablet} {

diff --git a/src/features/hanok-archive/sections/HanokStayAccordion.tsx b/src/features/hanok-archive/sections/HanokStayAccordion.tsx
@@ -21,6 +21,23 @@ const Section = styled.section`
   position: relative;
 `;
 
+const StayHeaderRow = styled.div`
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 28px;
+`;
+
+const StayHeaderTitle = styled.div`
+  min-width: 0;
+  flex: 1 1 auto;
+
+  & > * {
+    margin-bottom: 0;
+  }
+`;
+
 const FilterToolbar = styled.div`
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
@@ -841,7 +858,14 @@ export default function HanokStayAccordion({
 
   return (
     <Section id="hanok-stays" aria-labelledby="stay-heading">
-      <SectionHeader id="stay-heading" title="지역별 한옥 스테이" />
+      <StayHeaderRow>
+        <StayHeaderTitle>
+          <SectionHeader id="stay-heading" title="지역별 한옥 스테이" />
+        </StayHeaderTitle>
+        <ResultCount role="status" aria-live="polite">
+          {resultCountLabel}
+        </ResultCount>
+      </StayHeaderRow>
 
       <FilterToolbar>
         <RegionFilterBar aria-label="한옥 스테이 지역 필터">
@@ -862,9 +886,6 @@ export default function HanokStayAccordion({
             );
           })}
         </RegionFilterBar>
-        <ResultCount role="status" aria-live="polite">
-          {resultCountLabel}
-        </ResultCount>
       </FilterToolbar>
 
       {currentBatch.length > 0 ? (

diff --git a/src/features/journey-curator/components/BentoJourneyGrid.tsx b/src/features/journey-curator/components/BentoJourneyGrid.tsx
@@ -11,13 +11,13 @@ import { transientProps } from '@/design-system/styled';
 import { useJourneyStore } from '../store/useJourneyStore';
 
 const Container = styled.div`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   padding: 0 0 48px;
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
   }
 
   @media (max-width: 640px) {
@@ -56,6 +56,8 @@ const DayTabsWrap = styled.div`
   gap: 8px;
   margin-bottom: 14px;
   overflow-x: auto;
+  scrollbar-width: none;
+  &::-webkit-scrollbar { display: none; }
   padding-bottom: 2px;
 `;
 

diff --git a/src/features/journey-curator/components/JourneyDiscoveryFeed.tsx b/src/features/journey-curator/components/JourneyDiscoveryFeed.tsx
@@ -23,7 +23,7 @@ import {
 } from './homePresentationContracts';
 
 const FeedContainer = styled.div`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   padding: 24px 0 80px;
@@ -32,13 +32,13 @@ const FeedContainer = styled.div`
   gap: 120px;
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
     padding-bottom: 60px;
     gap: 74px;
   }
 
   @media (max-width: 640px) {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
     gap: 52px;
   }
 `;

diff --git a/src/features/journey-curator/components/JourneyEnrichmentSections.tsx b/src/features/journey-curator/components/JourneyEnrichmentSections.tsx
@@ -18,7 +18,7 @@ import type { NearbyAudioStory } from '../types/enrichment.types';
 import { palette, surface, ringShadow, fontSize } from '@/design-system/tokens';
 
 const Wrap = styled.section`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   padding: 8px 0 56px;
@@ -27,11 +27,11 @@ const Wrap = styled.section`
   gap: 48px;
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
   }
 
   @media (max-width: 640px) {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
     padding: 4px 0 40px;
     gap: 32px;
   }

diff --git a/src/features/journey-curator/components/JourneyFlowRail.tsx b/src/features/journey-curator/components/JourneyFlowRail.tsx
@@ -29,6 +29,8 @@ const Rail = styled.div`
   align-items: flex-start;
   gap: 0;
   overflow-x: auto;
+  scrollbar-width: none;
+  &::-webkit-scrollbar { display: none; }
   scroll-snap-type: x proximity;
   padding: 6px 4px 14px;
   margin: -4px -4px -14px;

diff --git a/src/features/journey-curator/components/JourneyFlowRailSection.tsx b/src/features/journey-curator/components/JourneyFlowRailSection.tsx
@@ -25,17 +25,17 @@ type ViewMode = 'JOURNEY' | 'MAP' | 'RELATION';
 const VIEW_LABEL: Record<ViewMode, string> = { JOURNEY: '여정', MAP: '지도', RELATION: '연결' };
 
 const Wrap = styled.section`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   padding: 32px 0 8px;
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
   }
 
   @media (max-width: 640px) {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
   }
 `;
 
@@ -76,6 +76,8 @@ const DiffRow = styled.div`
   display: flex;
   gap: 20px;
   overflow-x: auto;
+  scrollbar-width: none;
+  &::-webkit-scrollbar { display: none; }
   padding: 4px 4px 12px;
 `;
 

diff --git a/src/features/journey-curator/components/KnowledgeGraphView.tsx b/src/features/journey-curator/components/KnowledgeGraphView.tsx
@@ -11,17 +11,17 @@ import { useJourneyStore } from '../store/useJourneyStore';
 import { surface, fontSize } from '@/design-system/tokens';
 
 const Container = styled.div`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto 36px;
   padding: 0;
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
   }
 
   @media (max-width: 640px) {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
   }
 `;
 

diff --git a/src/features/k-culture-discovery/KCultureDiscovery.tsx b/src/features/k-culture-discovery/KCultureDiscovery.tsx
@@ -36,7 +36,7 @@ const TYPE_LABEL: Partial<Record<WorkType, string>> = {
 };
 
 const PageWrap = styled.div`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   padding-top: 64px;
@@ -47,11 +47,11 @@ const PageWrap = styled.div`
   }
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
   }
 
   @media (max-width: 640px) {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
   }
 `;
 

diff --git a/src/features/k-culture-discovery/presentation/components/PlaceDetailView.tsx b/src/features/k-culture-discovery/presentation/components/PlaceDetailView.tsx
@@ -27,7 +27,7 @@ const shimmerAnim = keyframes`
 `;
 
 const Page = styled.article`
-  width: min(calc(100% - 40px), 1140px);
+  width: min(calc(100% - 32px), 1140px);
   max-width: 1140px;
   margin: 0 auto;
   padding-bottom: 80px;
@@ -39,11 +39,11 @@ const Page = styled.article`
   }
 
   @media (max-width: 1024px) {
-    width: calc(100% - 28px);
+    width: calc(100% - 32px);
   }
 
   @media (max-width: 640px) {
-    width: calc(100% - 24px);
+    width: calc(100% - 32px);
   }
 `;
 

diff --git a/src/features/map/components/feed/SmartAroundFeed.tsx b/src/features/map/components/feed/SmartAroundFeed.tsx
@@ -77,7 +77,7 @@ interface SmartAroundFeedProps {
 
 const Wrapper = styled.div`
   position: relative;
-  padding: 0 14px;
+  padding: 0 16px;
 
   &:hover .om-feed-floating-btn {
     opacity: 1;

diff --git a/src/features/map/components/feed/SorimaruSpotlightBanner.tsx b/src/features/map/components/feed/SorimaruSpotlightBanner.tsx
@@ -30,7 +30,7 @@ import { useMapStore } from '@/features/map/hooks/useMapStore';
 
 const CardContainer = styled.div`
   position: relative;
-  margin: 0 14px;
+  margin: 0 16px;
   padding: 16px 18px;
   border-radius: 18px;
   background: linear-gradient(135deg, ${lightPalette.jangmi[50]} 0%, ${surface.light.card} 100%);
@@ -48,7 +48,7 @@ const CardContainer = styled.div`
 `;
 
 const SectionHeading = styled.h3`
-  margin: 0 14px 12px;
+  margin: 0 16px 12px;
   font-size: 0.9375rem;
   font-weight: 700;
   letter-spacing: -0.02em;

diff --git a/src/features/seasons/presentation/SeasonGateway.module.css b/src/features/seasons/presentation/SeasonGateway.module.css
@@ -22,7 +22,7 @@
 .mark{position:absolute;right:5%;bottom:3%;z-index:1;color:rgba(255,255,255,.24);font-size:clamp(8rem,20vw,22rem);font-weight:650;line-height:.8;letter-spacing:-.14em;white-space:nowrap;pointer-events:none}
 @media(max-width:900px){.gateway{grid-template-columns:42% 58%}.copy{padding:48px 32px}.copy h2{font-size:clamp(2.7rem,5.4vw,5rem)}.lead{font-size:1.18rem}}
 @media(max-width:760px){
-  .gateway{display:flex;flex-direction:column;min-height:0;border-radius:20px;margin:16px auto;width:calc(100% - 28px);box-shadow:0 12px 36px rgba(0,0,0,.35)}
+  .gateway{display:flex;flex-direction:column;min-height:0;border-radius:20px;margin:16px auto;width:calc(100% - 32px);box-shadow:0 12px 36px rgba(0,0,0,.35)}
   .visualLink{order:1;height:240px}
   .visual{height:100%;min-height:240px}
   .copy{order:2;min-height:0;padding:28px 22px 36px}