From 436d30c3cb8c720dc9f2a641f14eb7ec4ae11945 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Tue, 25 Nov 2025 19:46:20 +0900
Subject: [PATCH 01/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20=ED=99=94=EC=82=B4=ED=91=9C=20=EB=B2=84=ED=8A=BC=20=EC=82=AC?=
 =?UTF-8?q?=EC=9D=B4=EC=A6=88=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/assets/css/components/_splide.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layers/assets/css/components/_splide.css b/layers/assets/css/components/_splide.css
index 8aae5ef..dbda97b 100644
--- a/layers/assets/css/components/_splide.css
+++ b/layers/assets/css/components/_splide.css
@@ -23,7 +23,7 @@
   }
   .splide-arrow {
     @apply absolute top-1/2 w-[40px] h-[40px] bg-cover bg-center bg-no-repeat -translate-y-1/2 cursor-pointer z-[5]
-    md:w-[40px] md:h-[40px]
+    md:w-[48px] md:h-[48px]
     after:content-[''] after:absolute after:top-0 after:left-0 after:w-full after:h-full after:rounded-full after:bg-white after:transition-opacity after:duration-300 after:ease-in-out after:opacity-0
     hover:after:opacity-10;
   }

From 53ca3b7762c08b3afa7bc66020a771ea9319fe39 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Tue, 25 Nov 2025 19:59:05 +0900
Subject: [PATCH 02/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20=EC=8A=AC=EB=9D=BC=EC=9D=B4=EB=93=9C=20=EC=A0=84=ED=99=98=20?=
 =?UTF-8?q?=ED=9A=A8=EA=B3=BC=20=EB=B9=84=ED=99=9C=EC=84=B1=ED=99=94?=
 =?UTF-8?q?=EC=8B=9C=EC=97=90=EB=8F=84=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/components/blocks/slide/CenterFocus.vue     | 2 +-
 layers/components/blocks/slide/CenterHighlight.vue | 2 +-
 layers/templates/GrGallery02/index.vue             | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/layers/components/blocks/slide/CenterFocus.vue b/layers/components/blocks/slide/CenterFocus.vue
index ebccaa2..af58b98 100644
--- a/layers/components/blocks/slide/CenterFocus.vue
+++ b/layers/components/blocks/slide/CenterFocus.vue
@@ -131,6 +131,7 @@ const handleMove = (
   width: var(--banner-width-mo);
   height: var(--banner-height-mo);
   opacity: 0.5;
+  transition: all 0.6s ease-out;
 }
 .center-focus:deep(.splide__slide.is-active) {
   width: var(--banner-width-mo-container);
@@ -140,7 +141,6 @@ const handleMove = (
   width: var(--banner-width-mo-active);
   height: var(--banner-height-mo-active);
   opacity: 1;
-  transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
 }
 .center-focus:deep(.splide__slide.is-next),
 .center-focus:deep(.splide__slide.is-prev) {
diff --git a/layers/components/blocks/slide/CenterHighlight.vue b/layers/components/blocks/slide/CenterHighlight.vue
index c28c0ac..3443c9b 100644
--- a/layers/components/blocks/slide/CenterHighlight.vue
+++ b/layers/components/blocks/slide/CenterHighlight.vue
@@ -131,6 +131,7 @@ const handleMove = (
 .center-highlight:deep(.splide__slide) .slide-inner {
   width: var(--banner-width-mo);
   height: var(--banner-height-mo);
+  transition: all 0.6s ease-out;
 }
 .center-highlight:deep(.splide__slide.is-active) {
   width: var(--banner-width-mo-container);
@@ -138,7 +139,6 @@ const handleMove = (
 .center-highlight:deep(.splide__slide.is-active) .slide-inner {
   width: var(--banner-width-mo-active);
   height: var(--banner-height-mo-active);
-  transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 /* PC 스타일 */
diff --git a/layers/templates/GrGallery02/index.vue b/layers/templates/GrGallery02/index.vue
index 4c04e90..5d8ccc9 100644
--- a/layers/templates/GrGallery02/index.vue
+++ b/layers/templates/GrGallery02/index.vue
@@ -101,8 +101,8 @@ const onArrowClick = (direction, targetIndex) => {
 
 <style scoped>
 .section-standard {
-  @apply before:hidden md:before:block before:content-[''] before:absolute before:top-0 before:left-0 before:w-[104px] before:h-full before:bg-gradient-to-l from-transparent to-[rgba(0,0,0,0.7)] before:z-[5] 
-  after:hidden md:after:block after:content-[''] after:absolute after:top-0 after:right-0 after:w-[104px] after:h-full after:bg-gradient-to-r from-transparent to-[rgba(0,0,0,0.7)];
+  @apply before:hidden md:before:block before:content-[''] before:absolute before:top-0 before:left-0 before:w-[104px] before:h-full before:bg-gradient-to-l before:from-transparent before:to-[rgba(0,0,0,0.7)] before:z-[5] 
+  after:hidden md:after:block after:content-[''] after:absolute after:top-0 after:right-0 after:w-[104px] after:h-full after:bg-gradient-to-r after:from-transparent after:to-[rgba(0,0,0,0.7)];
 }
 .slide-inner {
   @apply bg-black;

From a2489b4a0c5f70e559c44f9ffde319ffef78435f Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Tue, 25 Nov 2025 19:59:27 +0900
Subject: [PATCH 03/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20=EC=9D=B8=EB=94=94=EC=BC=80=EC=9D=B4=ED=84=B0=20Height=20?=
 =?UTF-8?q?=EA=B0=92=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/templates/GrDetail01/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layers/templates/GrDetail01/index.vue b/layers/templates/GrDetail01/index.vue
index 9d12e30..a20f063 100644
--- a/layers/templates/GrDetail01/index.vue
+++ b/layers/templates/GrDetail01/index.vue
@@ -132,7 +132,7 @@ const handleSplideMove = (_splide: SplideType, newIndex: number) => {
   color: var(--pagination-disabled);
 }
 .progress-bar {
-  @apply relative w-[68px] h-0.5 overflow-hidden md:w-[184px];
+  @apply relative w-[68px] h-[1px] overflow-hidden md:w-[184px];
   background-color: var(--pagination-disabled);
 }
 .progress-fill {

From 77fced1249d2ac9802fcf9dd685041fd0c737150 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Tue, 25 Nov 2025 20:10:22 +0900
Subject: [PATCH 04/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20FX=5FSECURE=5F01=20=ED=95=AD=EB=AA=A9=20=ED=83=80=EC=9D=B4?=
 =?UTF-8?q?=ED=8B=80=20=EC=97=AC=EB=B0=B1=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/templates/FxSecure01/index.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/layers/templates/FxSecure01/index.vue b/layers/templates/FxSecure01/index.vue
index 52025a9..1e1f103 100644
--- a/layers/templates/FxSecure01/index.vue
+++ b/layers/templates/FxSecure01/index.vue
@@ -171,15 +171,15 @@ onMounted(() => {
         </div>
 
         <!-- Secure Cards -->
-        <div class="grid grid-cols-1 sm:grid-cols-3 w-full gap-3 md:gap-5 mb-6">
+        <div class="grid grid-cols-1 md:grid-cols-3 w-full gap-3 md:gap-5 mb-6">
           <div
             v-for="card in secureCards"
             :key="card.id"
-            class="flex-1 min-h-[308px] md:min-h-[384px] p-[10px] md:p-4 bg-[#FFFFFF] rounded-2xl flex flex-col gap-3 transition-all duration-300 ease-in-out"
+            class="flex-1 min-h-[308px] md:min-h-[384px] p-[10px] md:p-3 lg:p-4 bg-[#FFFFFF] rounded-2xl flex flex-col gap-3 transition-all duration-300 ease-in-out"
           >
             <!-- Card Content -->
             <div
-              class="flex-1 p-[10px] md:p-8 flex flex-col gap-[8px] md:gap-3 text-left"
+              class="flex-1 p-[10px] md:p-3 lg:p-4 flex flex-col gap-[8px] md:gap-3 text-left"
             >
               <!-- Badge -->
               <div class="inline-flex">

From 72009d43caa107e0acba88e6e31848fbdaa68955 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 13:09:39 +0900
Subject: [PATCH 05/14] =?UTF-8?q?fix.=20=EA=B3=B5=ED=86=B5=20=EC=8A=A4?=
 =?UTF-8?q?=ED=81=AC=EB=A1=A4=EB=B0=94=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95,=20=EC=97=AC=EB=B0=B1=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/assets/css/components/_base-content.css | 6 +++++-
 layers/assets/css/components/_scrollbar.css    | 4 ++--
 layers/components/blocks/modal/Content.vue     | 2 +-
 layers/components/layouts/EventNavigation.vue  | 2 +-
 layers/components/widgets/modal/Preregist.vue  | 2 +-
 5 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/layers/assets/css/components/_base-content.css b/layers/assets/css/components/_base-content.css
index d76c9f4..746bc99 100644
--- a/layers/assets/css/components/_base-content.css
+++ b/layers/assets/css/components/_base-content.css
@@ -73,7 +73,11 @@
   }
 
   .use-base img {
-    @apply max-w-full h-auto my-4;
+    @apply max-w-full h-auto;
+  }
+
+  .use-base iframe {
+    @apply max-w-full h-auto aspect-video;
   }
 
   .use-base pre {
diff --git a/layers/assets/css/components/_scrollbar.css b/layers/assets/css/components/_scrollbar.css
index 66b8c4f..5388f11 100644
--- a/layers/assets/css/components/_scrollbar.css
+++ b/layers/assets/css/components/_scrollbar.css
@@ -2,11 +2,11 @@ body ::-webkit-scrollbar-track {
   @apply bg-transparent;
 }
 body ::-webkit-scrollbar {
-  @apply w-5;
+  @apply w-[12px] h-[12px];
 }
 
 body ::-webkit-scrollbar-thumb {
-  @apply w-1 bg-[#D9D9D9] rounded-full bg-clip-padding border-solid border-transparent border-8;
+  @apply w-1 h-1 bg-[#D9D9D9] rounded-full bg-clip-padding border-solid border-transparent border-[4px];
 }
 
 .custom-theme-scrollbar::-webkit-scrollbar-thumb {
diff --git a/layers/components/blocks/modal/Content.vue b/layers/components/blocks/modal/Content.vue
index c3dc606..da57633 100644
--- a/layers/components/blocks/modal/Content.vue
+++ b/layers/components/blocks/modal/Content.vue
@@ -151,6 +151,6 @@ watch(
 }
 
 .content-tex {
-  @apply overflow-y-auto mb-4 px-6 sm:mb-6 sm:px-8;
+  @apply overflow-y-scroll mb-4 pl-6 pr-3 sm:mb-6 sm:pl-8 sm:pr-5;
 }
 </style>
diff --git a/layers/components/layouts/EventNavigation.vue b/layers/components/layouts/EventNavigation.vue
index 92a3217..20d5970 100644
--- a/layers/components/layouts/EventNavigation.vue
+++ b/layers/components/layouts/EventNavigation.vue
@@ -96,7 +96,7 @@ onMounted(async () => {
   md:p-8 md:pt-6 md:pr-4;
 }
 .navigation-list {
-  @apply flex flex-col gap-4 h-full overflow-y-auto rounded-[20px] p-4 bg-[rgba(25,25,25,0.5)] shadow-[0_2px_4px_0_rgba(0,0,0,0.06)] backdrop-blur-[25px] transition-opacity duration-300 ease-in-out;
+  @apply flex flex-col gap-4 h-full overflow-y-scroll rounded-[20px] p-4 pr-1 bg-[rgba(25,25,25,0.5)] shadow-[0_2px_4px_0_rgba(0,0,0,0.06)] backdrop-blur-[25px] transition-opacity duration-300 ease-in-out;
 }
 .item-thumbnail {
   @apply overflow-hidden relative w-[148px] h-[75px] rounded-[10px]
diff --git a/layers/components/widgets/modal/Preregist.vue b/layers/components/widgets/modal/Preregist.vue
index 8462656..af83805 100644
--- a/layers/components/widgets/modal/Preregist.vue
+++ b/layers/components/widgets/modal/Preregist.vue
@@ -308,7 +308,7 @@ defineExpose({
             <!-- Marketing Detail Content -->
             <div
               v-if="isExpandedMarketing"
-              class="mt-4 max-h-[160px] overflow-y-auto rounded-lg bg-white/[0.04] px-4 py-3 custom-theme-scrollbar"
+              class="mt-4 max-h-[160px] overflow-y-scroll rounded-lg bg-white/[0.04] pl-4 pr-1 py-3 custom-theme-scrollbar"
             >
               <p
                 v-dompurify-html="tmWithGameName('Preregist_Agree_News_Info')"

From 7e645f1072290bcd5e2f91e799cff551ed6426de Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 14:45:27 +0900
Subject: [PATCH 06/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20GR=5FGALLERY=5F02=20=EB=B0=B0=EA=B2=BD=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/blocks/slide/CenterFocus.vue   | 29 ++++++++++++-------
 layers/templates/GrGallery02/index.vue        |  4 +--
 2 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/layers/components/blocks/slide/CenterFocus.vue b/layers/components/blocks/slide/CenterFocus.vue
index af58b98..076bc04 100644
--- a/layers/components/blocks/slide/CenterFocus.vue
+++ b/layers/components/blocks/slide/CenterFocus.vue
@@ -125,25 +125,34 @@ const handleMove = (
   width: var(--banner-width-mo);
   height: var(--banner-height-mo-active);
   margin-right: var(--banner-gap-mo);
-  opacity: 0.5;
-}
-.center-focus:deep(.splide__slide) .slide-inner {
-  width: var(--banner-width-mo);
-  height: var(--banner-height-mo);
-  opacity: 0.5;
-  transition: all 0.6s ease-out;
+  transition: transform 0.6s ease-out;
+  opacity: 0.3;
 }
 .center-focus:deep(.splide__slide.is-active) {
   width: var(--banner-width-mo-container);
+}
+.center-focus:deep(.splide__slide.is-active),
+.center-focus:deep(.splide__slide.is-next),
+.center-focus:deep(.splide__slide.is-prev) {
   opacity: 1;
 }
+
+.center-focus:deep(.splide__slide) .slide-inner {
+  width: var(--banner-width-mo);
+  height: var(--banner-height-mo);
+  background-color: #191919;
+  transition: all 0.6s ease-out;
+}
 .center-focus:deep(.splide__slide.is-active) .slide-inner {
   width: var(--banner-width-mo-active);
   height: var(--banner-height-mo-active);
-  opacity: 1;
 }
-.center-focus:deep(.splide__slide.is-next),
-.center-focus:deep(.splide__slide.is-prev) {
+
+.center-focus:deep(.splide__slide) .slide-inner .inner-content {
+  opacity: 0.5;
+  transition: all 0.6s ease-out;
+}
+.center-focus:deep(.splide__slide.is-active) .slide-inner .inner-content {
   opacity: 1;
 }
 
diff --git a/layers/templates/GrGallery02/index.vue b/layers/templates/GrGallery02/index.vue
index 5d8ccc9..e126c9e 100644
--- a/layers/templates/GrGallery02/index.vue
+++ b/layers/templates/GrGallery02/index.vue
@@ -85,6 +85,7 @@ const onArrowClick = (direction, targetIndex) => {
             <BlocksVisualContent
               :resources-data="getComponentGroup(item, 'imgList')"
               object-fit="cover"
+              class="inner-content"
             />
           </div>
         </SplideSlide>
@@ -104,7 +105,4 @@ const onArrowClick = (direction, targetIndex) => {
   @apply before:hidden md:before:block before:content-[''] before:absolute before:top-0 before:left-0 before:w-[104px] before:h-full before:bg-gradient-to-l before:from-transparent before:to-[rgba(0,0,0,0.7)] before:z-[5] 
   after:hidden md:after:block after:content-[''] after:absolute after:top-0 after:right-0 after:w-[104px] after:h-full after:bg-gradient-to-r after:from-transparent after:to-[rgba(0,0,0,0.7)];
 }
-.slide-inner {
-  @apply bg-black;
-}
 </style>

From 24ff4ca629bbc494fa44551cc2bc67d345eb54ef Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 14:49:59 +0900
Subject: [PATCH 07/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20GR=5FDETAIL=5F01=20=EC=9D=B8=EB=94=94=EA=B2=8C=EC=9D=B4?=
 =?UTF-8?q?=ED=84=B0=20hover=20=ED=9A=A8=EA=B3=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/templates/GrDetail01/index.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/layers/templates/GrDetail01/index.vue b/layers/templates/GrDetail01/index.vue
index a20f063..f15dd24 100644
--- a/layers/templates/GrDetail01/index.vue
+++ b/layers/templates/GrDetail01/index.vue
@@ -124,11 +124,11 @@ const handleSplideMove = (_splide: SplideType, newIndex: number) => {
   @apply flex items-center;
 }
 .item-bullet {
-  @apply block w-3 h-3 rounded-full transition-all duration-300;
+  @apply block w-3 h-3 rounded-full transition-[background] duration-300 ease-in-out;
   background-color: var(--pagination-disabled);
 }
 .item-title {
-  @apply hidden absolute -bottom-[46px] left-1/2 -translate-x-1/2 whitespace-nowrap text-sm font-medium md:block;
+  @apply hidden absolute -bottom-[46px] left-1/2 -translate-x-1/2 whitespace-nowrap text-sm font-medium transition-[color] duration-300 ease-in-out md:block;
   color: var(--pagination-disabled);
 }
 .progress-bar {
@@ -141,9 +141,11 @@ const handleSplideMove = (_splide: SplideType, newIndex: number) => {
 }
 
 /* 활성화 상태 (현재 슬라이드) */
+.btn-pagination:hover .item-bullet,
 .is-active .item-bullet {
   background-color: var(--pagination-active);
 }
+.btn-pagination:hover .item-title,
 .is-active .item-title {
   color: var(--pagination-active);
 }

From ecb1202b3cd08b6867d7b607446117d208920441 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 14:53:24 +0900
Subject: [PATCH 08/14] =?UTF-8?q?fix.=20[=EB=94=94=EC=9E=90=EC=9D=B8=20QA]?=
 =?UTF-8?q?=20=EB=A1=9C=EB=94=A9=20=EC=9D=B4=EB=AF=B8=EC=A7=80=EC=9D=98=20?=
 =?UTF-8?q?=EC=8B=9C=EC=9D=B8=EC=84=B1=20=EA=B0=9C=EC=84=A0=EC=9D=84=20?=
 =?UTF-8?q?=EC=9C=84=ED=95=B4=20dark=20<->=20white=20=EB=AA=A8=EB=93=9C?=
 =?UTF-8?q?=EA=B0=84=20=EA=B5=90=EC=B2=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/components/atoms/loading/Full.vue  | 4 ++--
 layers/components/atoms/loading/Local.vue | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/layers/components/atoms/loading/Full.vue b/layers/components/atoms/loading/Full.vue
index ef034d4..dfcee82 100644
--- a/layers/components/atoms/loading/Full.vue
+++ b/layers/components/atoms/loading/Full.vue
@@ -18,7 +18,7 @@ const { fullLoading } = storeToRefs(loadingStore)
   @apply fixed inset-0 bg-black pt-[96px] flex items-center justify-center sm:pt-[112px] z-[150];
 }
 .spinner {
-  @apply w-[80px] h-[80px] bg-cover bg-center bg-no-repeat bg-[url('/images/common/publisning_template_loader_black.png')];
+  @apply w-[80px] h-[80px] bg-cover bg-center bg-no-repeat bg-[url('/images/common/publisning_template_loader_white.png')];
 }
 
 [data-theme='light'] {
@@ -26,7 +26,7 @@ const { fullLoading } = storeToRefs(loadingStore)
     @apply bg-white/90;
   }
   .spinner {
-    @apply bg-[url('/images/common/publisning_template_loader_white.png')];
+    @apply bg-[url('/images/common/publisning_template_loader_black.png')];
   }
 }
 </style>
diff --git a/layers/components/atoms/loading/Local.vue b/layers/components/atoms/loading/Local.vue
index 50000f8..0a4ec5b 100644
--- a/layers/components/atoms/loading/Local.vue
+++ b/layers/components/atoms/loading/Local.vue
@@ -28,12 +28,12 @@ const canTeleport = (localId: string) => {
   @apply absolute inset-0  flex items-center justify-center z-[5];
 }
 .spinner {
-  @apply w-[80px] h-[80px] bg-cover bg-center bg-no-repeat bg-[url('/images/common/publisning_template_loader_black.png')];
+  @apply w-[80px] h-[80px] bg-cover bg-center bg-no-repeat bg-[url('/images/common/publisning_template_loader_white.png')];
 }
 
 [data-theme='light'] {
   .spinner {
-    @apply bg-[url('/images/common/publisning_template_loader_white.png')];
+    @apply bg-[url('/images/common/publisning_template_loader_black.png')];
   }
 }
 </style>

From 51ad5f8d2c0bd25531e3a2907a3726180ab758fc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=B5=9C=EB=A7=8C=EC=96=B5=20=28Jo=29?=
 <maneokc@smilegate.com>
Date: Wed, 26 Nov 2025 06:00:33 +0000
Subject: [PATCH 09/14] =?UTF-8?q?feat:=20=EB=94=94=EC=9E=90=EC=9D=B8QA=20?=
 =?UTF-8?q?=EA=B0=9C=EC=84=A0=20=EB=B0=8F=20=EB=B2=84=EA=B7=B8=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/components/blocks/DatePicker.vue |   2 +-
 layers/templates/FxCoupon01/index.vue   |   6 +-
 layers/templates/FxDownload01/index.vue | 128 +++++++++++++++---------
 3 files changed, 83 insertions(+), 53 deletions(-)

diff --git a/layers/components/blocks/DatePicker.vue b/layers/components/blocks/DatePicker.vue
index 2cf9dc2..68c82a6 100644
--- a/layers/components/blocks/DatePicker.vue
+++ b/layers/components/blocks/DatePicker.vue
@@ -626,7 +626,7 @@ body .date-picker-menu-wrap .dp__calendar_item {
   padding: 2px 4px !important;
 }
 body .date-picker-menu-wrap .dp__cell_inner {
-  padding: 8px !important;
+  padding: 0px !important;
   border-radius: 100% !important;
   outline: none !important;
   border: none !important;
diff --git a/layers/templates/FxCoupon01/index.vue b/layers/templates/FxCoupon01/index.vue
index fc882c0..b10b139 100644
--- a/layers/templates/FxCoupon01/index.vue
+++ b/layers/templates/FxCoupon01/index.vue
@@ -521,10 +521,6 @@ onMounted(async () => {
               @click="handleCouponUse"
             >
               <span>{{ tm('Coupon_Registration') }}</span>
-              <AtomsIconsCouponFill
-                :size="breakpoints.isMobile ? 16 : 20"
-                color="#FFFFFF"
-              />
             </AtomsButton>
           </div>
 
@@ -804,7 +800,7 @@ onMounted(async () => {
 <style scoped>
 /* Button Style */
 .btn-period {
-  @apply border border-solid border-[#D9D9D9] rounded-[0] w-auto h-[40px] px-[16px] before:content-none after:content-none
+  @apply border border-solid border-[#D9D9D9] rounded-[0] w-auto h-[40px] px-[16px] font-[700] before:content-none after:content-none
   transition-all duration-300 ease-in-out
   hover:z-[4] hover:!bg-[#FFFFFF] hover:border-[#404040] hover:!text-[#1F1F1F];
 }
diff --git a/layers/templates/FxDownload01/index.vue b/layers/templates/FxDownload01/index.vue
index 8b90349..7e8f355 100644
--- a/layers/templates/FxDownload01/index.vue
+++ b/layers/templates/FxDownload01/index.vue
@@ -164,7 +164,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
             </span>
 
             <h4
-              class="relative flex justify-left items-center w-full gap-[4px] text-left text-[#1F1F1F] text-[18px] font-bold leading-[26px] tracking-[-0.54px] md:text-[24px] md:leading-[34px] md:tracking-[0.72px]"
+              class="relative flex justify-left items-center w-full gap-[4px] text-left text-[#1F1F1F] text-[18px] font-bold leading-[26px] tracking-[-0.54px] md:text-[24px] md:leading-[34px] md:tracking-[-0.72px]"
             >
               <span>{{ tm('Download_Box_PC_Title') }}</span>
 
@@ -299,27 +299,44 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
     <section ref="specPCRef" class="section-static">
       <WidgetsFixSubTitle :title="tm('Download_Section_PC_Title')" />
 
-      <table>
-        <thead>
-          <tr>
-            <th class="w-[80px] md:w-[172px]">
-              {{ tm('Download_Table_Item') }}
-            </th>
-            <th>{{ tm('Download_Table_Min_Spec') }}</th>
-            <th>{{ tm('Download_Table_Rec_Spec') }}</th>
-          </tr>
-        </thead>
-        <tbody>
-          <template v-for="tr in pcSpecList" :key="tr.id">
+      <div
+        class="relative w-full border border-solid border-[#D9D9D9] rounded-[12px] overflow-hidden md:rounded-[16px]"
+      >
+        <table>
+          <thead>
             <tr>
-              <th class="w-[80px] md:w-[172px]">{{ tr.itemText }}</th>
-              <template v-for="td in tr.itemData" :key="td.display.text">
-                <td>{{ td.display.text }}</td>
-              </template>
+              <th class="w-[80px] md:w-[172px] !border-l-[0]">
+                {{ tm('Download_Table_Item') }}
+              </th>
+              <th>{{ tm('Download_Table_Min_Spec') }}</th>
+              <th>{{ tm('Download_Table_Rec_Spec') }}</th>
             </tr>
-          </template>
-        </tbody>
-      </table>
+          </thead>
+          <tbody>
+            <template v-for="(tr, trIdx) in pcSpecList" :key="tr.id">
+              <tr>
+                <th
+                  :class="[
+                    'w-[80px] md:w-[172px] !border-l-[0]',
+                    trIdx === pcSpecList.length - 1 ? '!border-b-[0]' : '',
+                  ]"
+                >
+                  {{ tr.itemText }}
+                </th>
+                <template v-for="td in tr.itemData" :key="td.display.text">
+                  <td
+                    :class="
+                      trIdx === pcSpecList.length - 1 ? '!border-b-[0]' : ''
+                    "
+                  >
+                    {{ td.display.text }}
+                  </td>
+                </template>
+              </tr>
+            </template>
+          </tbody>
+        </table>
+      </div>
 
       <div
         v-if="!breakpoints.isMobile"
@@ -420,33 +437,50 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
 
     <section ref="specMobileRef" class="section-static">
       <WidgetsFixSubTitle :title="tm('Download_Section_MOBILE_Title')" />
-      <table>
-        <thead>
-          <tr>
-            <th rowspan="2" class="w-[80px] md:w-[172px]">
-              {{ tm('Download_Table_Item') }}
-            </th>
-            <th colspan="2">{{ tm('Download_Table_Min_Spec') }}</th>
-            <th colspan="2">{{ tm('Download_Table_Rec_Spec') }}</th>
-          </tr>
-          <tr>
-            <th>{{ tm('Download_Table_Device') }}</th>
-            <th>{{ tm('Download_Table_Os') }}</th>
-            <th>{{ tm('Download_Table_Device') }}</th>
-            <th>{{ tm('Download_Table_Os') }}</th>
-          </tr>
-        </thead>
-        <tbody>
-          <template v-for="tr in mobileSpecList" :key="tr.id">
+      <div
+        class="relative w-full border border-solid border-[#D9D9D9] rounded-[12px] overflow-hidden md:rounded-[16px]"
+      >
+        <table>
+          <thead>
             <tr>
-              <th class="w-[80px] md:w-[172px]">{{ tr.itemText }}</th>
-              <template v-for="td in tr.itemData" :key="td.display.text">
-                <td>{{ td.display.text }}</td>
-              </template>
+              <th rowspan="2" class="w-[80px] md:w-[172px] !border-l-[0]">
+                {{ tm('Download_Table_Item') }}
+              </th>
+              <th colspan="2">{{ tm('Download_Table_Min_Spec') }}</th>
+              <th colspan="2">{{ tm('Download_Table_Rec_Spec') }}</th>
             </tr>
-          </template>
-        </tbody>
-      </table>
+            <tr>
+              <th>{{ tm('Download_Table_Device') }}</th>
+              <th>{{ tm('Download_Table_Os') }}</th>
+              <th>{{ tm('Download_Table_Device') }}</th>
+              <th>{{ tm('Download_Table_Os') }}</th>
+            </tr>
+          </thead>
+          <tbody>
+            <template v-for="(tr, trIdx) in mobileSpecList" :key="tr.id">
+              <tr>
+                <th
+                  :class="[
+                    'w-[80px] md:w-[172px] !border-l-[0]',
+                    trIdx === mobileSpecList.length - 1 ? '!border-b-[0]' : '',
+                  ]"
+                >
+                  {{ tr.itemText }}
+                </th>
+                <template v-for="td in tr.itemData" :key="td.display.text">
+                  <td
+                    :class="
+                      trIdx === mobileSpecList.length - 1 ? '!border-b-[0]' : ''
+                    "
+                  >
+                    {{ td.display.text }}
+                  </td>
+                </template>
+              </tr>
+            </template>
+          </tbody>
+        </table>
+      </div>
     </section>
   </div>
 </template>
@@ -457,11 +491,11 @@ table {
   @apply w-full h-auto border-collapse border-spacing-0 table-fixed;
 }
 table th {
-  @apply py-[8px] px-[12px] border border-[#D9D9D9] bg-[#FAFAFA] text-[#1F1F1F] text-[14px] font-bold leading-[24px] tracking-[-0.42px]
+  @apply py-[8px] px-[12px] border-l border-b border-solid border-[#D9D9D9] bg-[#FAFAFA] text-center text-[#1F1F1F] text-[14px] font-bold leading-[24px] tracking-[-0.42px]
   md:py-[11px] md:px-[20px] md:text-[16px] md:leading-[26px] md:tracking-[-0.48px];
 }
 table td {
-  @apply h-[64px] py-[8px] px-[12px] border border-[#D9D9D9] bg-[#FFFFFF] text-[#666666] text-[14px] font-[400] leading-[24px] tracking-[-0.42px]
+  @apply h-[64px] py-[8px] px-[12px] border-l border-b border-[#D9D9D9] bg-[#FFFFFF] text-center text-[#666666] text-[14px] font-[400] leading-[24px] tracking-[-0.42px]
   md:h-[80px] md:py-[14px] md:px-[20px] md:text-[16px] md:leading-[26px] md:tracking-[-0.48px];
 }
 

From ea0ac82aab52d8029bbc3756cd50e729f6165b02 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 15:24:16 +0900
Subject: [PATCH 10/14] =?UTF-8?q?fix.=20sns=20=EB=B0=B0=EA=B2=BD=20?=
 =?UTF-8?q?=ED=88=AC=EB=AA=85=EB=8F=84=20=EC=84=A4=EC=A0=95=EC=8B=9C=20?=
 =?UTF-8?q?=EA=B2=B9=EC=B3=90=EB=B3=B4=EC=9D=B4=EB=8A=94=20=EC=9D=B4?=
 =?UTF-8?q?=EC=8A=88=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/components/blocks/Button/Sns.vue | 28 +++++++++++++++----------
 layers/components/layouts/Main.vue      |  2 +-
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/layers/components/blocks/Button/Sns.vue b/layers/components/blocks/Button/Sns.vue
index 91e87ea..4f9786e 100644
--- a/layers/components/blocks/Button/Sns.vue
+++ b/layers/components/blocks/Button/Sns.vue
@@ -43,17 +43,20 @@ const handleCopy = async () => {
 
 <template>
   <div v-if="Object.keys(snsList).length > 0" class="sns-container">
-    <AtomsButtonCircle
-      class="btn-sns"
-      sr-only="sns"
-      :style="{ backgroundColor: snsBackgroundColor }"
-      @click="handleMouseEnter"
-    >
-      <AtomsIconsShareLine class="icon-share" />
-    </AtomsButtonCircle>
+    <transition name="fade">
+      <AtomsButtonCircle
+        v-show="!showSnsList"
+        class="btn-sns"
+        sr-only="sns"
+        :style="{ backgroundColor: snsBackgroundColor }"
+        @click="handleMouseEnter"
+      >
+        <AtomsIconsShareLine class="icon-share" />
+      </AtomsButtonCircle>
+    </transition>
     <transition name="fade">
       <div
-        v-if="showSnsList"
+        v-show="showSnsList"
         class="sns-list"
         :style="{ backgroundColor: snsBackgroundColor }"
       >
@@ -96,13 +99,16 @@ const handleCopy = async () => {
 </template>
 
 <style scoped>
+.sns-container {
+  @apply relative h-[40px] md:h-[48px];
+}
+
 .btn-sns:hover .icon-share {
   @apply fill-white;
 }
 
 .sns-list {
-  @apply absolute bottom-0 right-0 flex items-center justify-center gap-4 rounded-full
-  h-[40px] md:h-[48px] pl-4 pr-3
+  @apply absolute bottom-0 right-0 flex items-center justify-center gap-4 rounded-full h-full pl-4 pr-3
   before:content-[''] before:absolute before:top-0 before:left-0 before:w-full before:h-full before:border before:border-[rgba(255,255,255,0.06)] before:rounded-full;
 }
 .sns-item {
diff --git a/layers/components/layouts/Main.vue b/layers/components/layouts/Main.vue
index 8550e1d..28421ec 100644
--- a/layers/components/layouts/Main.vue
+++ b/layers/components/layouts/Main.vue
@@ -119,7 +119,7 @@ onMounted(() => {
   @apply relative pt-[48px] md:pt-[64px];
 }
 .utile-wrap {
-  @apply fixed flex flex-col z-[100]
+  @apply fixed flex flex-col items-end z-[100]
   bottom-[12px] right-[12px] gap-2 md:bottom-[40px] md:right-[40px] md:gap-3;
 }
 .utile-wrap.is-stop {

From 7c392fb9eba9ad407afec9cbbf51e1cc1757775e Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 15:29:37 +0900
Subject: [PATCH 11/14] =?UTF-8?q?fix.=20GR=5FDETAIL=5F01=20=EB=84=A4?=
 =?UTF-8?q?=EB=B9=84=EA=B2=8C=EC=9D=B4=EC=85=98=20=ED=85=8D=EC=8A=A4?=
 =?UTF-8?q?=ED=8A=B8=20=EB=84=98=EC=B9=98=EB=8A=94=20=EC=9D=B4=EC=8A=88=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/templates/GrDetail01/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layers/templates/GrDetail01/index.vue b/layers/templates/GrDetail01/index.vue
index f15dd24..88c79f9 100644
--- a/layers/templates/GrDetail01/index.vue
+++ b/layers/templates/GrDetail01/index.vue
@@ -128,7 +128,7 @@ const handleSplideMove = (_splide: SplideType, newIndex: number) => {
   background-color: var(--pagination-disabled);
 }
 .item-title {
-  @apply hidden absolute -bottom-[46px] left-1/2 -translate-x-1/2 whitespace-nowrap text-sm font-medium transition-[color] duration-300 ease-in-out md:block;
+  @apply hidden absolute -bottom-[46px] left-1/2 max-w-[184px] line-clamp-1 text-ellipsis whitespace-nowrap text-sm font-medium -translate-x-1/2 transition-[color] duration-300 ease-in-out md:block;
   color: var(--pagination-disabled);
 }
 .progress-bar {

From 74dedd4ef9ff1cc77eb46bf2f0baff5c4e3a9003 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=B5=9C=EB=A7=8C=EC=96=B5=20=28Jo=29?=
 <maneokc@smilegate.com>
Date: Wed, 26 Nov 2025 07:53:30 +0000
Subject: [PATCH 12/14] =?UTF-8?q?fix:=20[=EB=94=94=EC=9E=90=EC=9D=B8QA]=20?=
 =?UTF-8?q?FX=5FDOWNLOAD=5F01=20=EB=B2=84=EA=B7=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/templates/FxDownload01/index.vue | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/layers/templates/FxDownload01/index.vue b/layers/templates/FxDownload01/index.vue
index 7e8f355..481ca82 100644
--- a/layers/templates/FxDownload01/index.vue
+++ b/layers/templates/FxDownload01/index.vue
@@ -137,14 +137,17 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
       <WidgetsFixSubTitle :title="tm('Download_Section_Platform_Title')" />
 
       <div
-        class="relative flex flex-col-reverse sm:flex-row-reverse items-stretch justify-center gap-[20px] w-full md:flex-row"
+        class="relative flex flex-col-reverse items-stretch justify-center sm:flex-row-reverse gap-[20px] w-full md:grid md:grid-cols-12 md:grid-rows-1"
       >
         <div
           v-if="gameData?.platform_type !== '2'"
-          class="relative flex flex-1 flex-col items-start justify-start h-[270px] py-[20px] rounded-[12px] bg-white sm:h-auto md:flex-[2] md:pt-[24px] md:pb-0 lg:pt-[32px]"
+          class="relative flex flex-1 flex-col items-start justify-start h-[270px] py-[20px] rounded-[12px] bg-white sm:h-auto md:flex-none md:pt-[24px] md:pb-0 lg:pt-[32px]"
+          :class="
+            gameData?.platform_type === '1' ? 'md:col-span-12' : 'md:col-span-8'
+          "
         >
           <div
-            class="relative flex flex-col items-start justify-start w-full max-w-[800px] h-full px-[20px] mx-auto md:h-auto md:px-[28px] lg:px-[40px]"
+            class="relative flex flex-col items-start justify-start w-full max-w-[880px] h-full px-[20px] mx-auto md:h-auto md:px-[28px] lg:px-[40px]"
           >
             <span
               v-if="!breakpoints.isMobile"
@@ -208,7 +211,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
 
             <div
               v-if="breakpoints.isMobile"
-              class="relative flex items-center justify-center w-full h-auto min-h-[48px] py-[14px] px-[40px] mt-[48px] border border-solid border-[rgba(0,0,0,0.1)] rounded-[8px] bg-[#EBEBEB] text-center text-[#999999] text-[14px] font-[500] leading-[20px] tracking-[-0.42px]"
+              class="relative flex items-center justify-center w-full h-auto min-h-[48px] py-[14px] px-[40px] mt-[48px] sm:mt-auto border border-solid border-[rgba(0,0,0,0.1)] rounded-[8px] bg-[#EBEBEB] text-center text-[#999999] text-[14px] font-[500] leading-[20px] tracking-[-0.42px]"
             >
               <span>{{ tm('Download_Button_PC_Mobile') }}</span>
             </div>
@@ -245,13 +248,16 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
 
         <div
           v-if="gameData?.platform_type !== '1'"
-          class="relative flex flex-1 flex-col items-start justify-start h-[270px] p-[20px] rounded-[12px] bg-white sm:h-auto md:py-[24px] md:px-[28px] lg:pt-[32px] lg:pb-[40px] lg:px-[40px]"
+          class="relative flex flex-1 flex-col items-start justify-start h-[270px] p-[20px] rounded-[12px] bg-white sm:h-auto md:flex-none md:py-[24px] md:px-[28px] lg:py-[32px] lg:px-[40px]"
+          :class="
+            gameData?.platform_type === '2' ? 'md:col-span-12' : 'md:col-span-4'
+          "
         >
           <div
-            class="relative flex flex-col items-start justify-start w-full max-w-[800px] mx-auto"
+            class="relative flex flex-col items-start justify-start w-full h-full max-w-[880px] mx-auto"
           >
             <h4
-              class="relative flex justify-left items-center w-full text-left text-[#1F1F1F] text-[18px] font-bold leading-[26px] tracking-[-0.54px] md:text-[24px] md:leading-[34px] md:tracking-[0.72px]"
+              class="relative flex justify-left items-center w-full text-left text-[#1F1F1F] text-[18px] font-bold leading-[26px] tracking-[-0.54px] md:text-[24px] md:leading-[34px] md:tracking-[-0.72px]"
             >
               <span>{{ tm('Download_Box_MOBILE_Title') }}</span>
             </h4>

From 97e6ab912a2d485ea5d6358ecdc6bb23b7d02feb Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 16:55:11 +0900
Subject: [PATCH 13/14] =?UTF-8?q?fix.=20=EC=97=90=EB=94=94=ED=84=B0=20?=
 =?UTF-8?q?=ED=85=8C=EC=9D=B4=EB=B8=94=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/assets/css/components/_base-content.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/layers/assets/css/components/_base-content.css b/layers/assets/css/components/_base-content.css
index 746bc99..a77e595 100644
--- a/layers/assets/css/components/_base-content.css
+++ b/layers/assets/css/components/_base-content.css
@@ -18,6 +18,7 @@
   .use-base table {
     @apply w-full border-collapse;
   }
+  .use-base .fr-alternate-rows tr:nth-child(even),
   .use-base thead,
   .use-base tfoot {
     @apply bg-[#FAFAFA];

From e06ee9776488733c537395ff7b2fbd084b465ad1 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Wed, 26 Nov 2025 17:50:26 +0900
Subject: [PATCH 14/14] =?UTF-8?q?fix:=20[=EB=94=94=EC=9E=90=EC=9D=B8QA]=20?=
 =?UTF-8?q?=EC=BB=A8=ED=85=90=EC=B8=A0=20=EC=98=81=EC=97=AD=EC=9D=98=20max?=
 =?UTF-8?q?-width=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/assets/css/components/_layout.css     |  4 ++--
 layers/components/blocks/slide/Thumbnail.vue |  2 --
 layers/templates/FxPreregist01/index.vue     |  5 ++++-
 layers/templates/GrBoard01/index.vue         |  4 ++--
 layers/templates/GrContents01/index.vue      |  6 +++---
 layers/templates/GrDetail01/index.vue        |  6 +++---
 layers/templates/GrDetail02/index.vue        |  6 +++---
 layers/templates/GrDetail03/index.vue        | 10 +++++-----
 layers/templates/GrGallery01/index.vue       |  4 ++--
 layers/templates/GrGallery02/index.vue       |  2 +-
 layers/templates/GrGallery03/index.vue       |  6 +++---
 layers/templates/GrVisual03/index.vue        |  5 +++--
 12 files changed, 31 insertions(+), 29 deletions(-)

diff --git a/layers/assets/css/components/_layout.css b/layers/assets/css/components/_layout.css
index c2d3c1a..dff5bce 100644
--- a/layers/assets/css/components/_layout.css
+++ b/layers/assets/css/components/_layout.css
@@ -36,9 +36,9 @@
     @apply line-clamp-2 text-[16px] font-[500] tracking-[-0.48px] leading-[24px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:tracking-[-0.72px] md:line-clamp-1 md:text-[24px] md:leading-[34px];
   }
   .title-sm {
-    @apply text-[15px] font-[500] leading-[24px] tracking-[-0.45px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:text-[20px] md:leading-[30px] md:tracking-[-0.6px];
+    @apply line-clamp-4 text-[15px] font-[500] leading-[24px] tracking-[-0.45px] drop-shadow-[0_2px_2px_rgba(0,0,0,0.6)] md:tracking-[-0.6px] md:line-clamp-3 md:text-[20px] md:leading-[30px];
   }
   .title-xs {
-    @apply text-[14px] font-[500] leading-[20px] tracking-[-0.42px] md:text-[18px] md:leading-[26px] md:tracking-[-0.54px];
+    @apply line-clamp-1 text-[14px] font-[500] leading-[20px] tracking-[-0.42px] md:text-[18px] md:leading-[26px] md:tracking-[-0.54px];
   }
 }
diff --git a/layers/components/blocks/slide/Thumbnail.vue b/layers/components/blocks/slide/Thumbnail.vue
index e4de38b..af68031 100644
--- a/layers/components/blocks/slide/Thumbnail.vue
+++ b/layers/components/blocks/slide/Thumbnail.vue
@@ -173,8 +173,6 @@ onBeforeUnmount(() => {
 </template>
 
 <style scoped>
-.thumbnail-carousel {
-}
 .thumbnail-carousel:deep(img) {
   @apply w-full h-full object-cover;
 }
diff --git a/layers/templates/FxPreregist01/index.vue b/layers/templates/FxPreregist01/index.vue
index 654d106..c488253 100644
--- a/layers/templates/FxPreregist01/index.vue
+++ b/layers/templates/FxPreregist01/index.vue
@@ -371,7 +371,10 @@ const handlePreregistClick = () => {
 </template>
 
 <style scoped>
-/* destroy되었을 때 (슬라이드 비활성화) 중앙 정렬 */
+.content-standard {
+  @apply max-w-[1024px] mx-auto;
+}
+
 .splide:not(.is-active):deep(.splide__list) {
   @apply flex justify-center gap-3 md:gap-4;
 }
diff --git a/layers/templates/GrBoard01/index.vue b/layers/templates/GrBoard01/index.vue
index 0f9abf0..70ffe8c 100644
--- a/layers/templates/GrBoard01/index.vue
+++ b/layers/templates/GrBoard01/index.vue
@@ -121,7 +121,7 @@ const onArrowClick = (direction, targetIndex) => {
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="title-md"
+        class="title-md max-w-[944px] mx-[20px] sm:mx-[40px]"
       />
       <ClientOnly>
         <BlocksSlideDefault
@@ -156,7 +156,7 @@ const onArrowClick = (direction, targetIndex) => {
       <WidgetsDescription
         v-if="descriptionData"
         :resources-data="descriptionData"
-        class="mt-[32px] md:mt-[48px]"
+        class="max-w-[944px] mt-[32px] mx-[20px] sm:mx-[40px] md:mt-[48px]"
       />
     </div>
   </section>
diff --git a/layers/templates/GrContents01/index.vue b/layers/templates/GrContents01/index.vue
index 29e96ec..6217536 100644
--- a/layers/templates/GrContents01/index.vue
+++ b/layers/templates/GrContents01/index.vue
@@ -36,12 +36,12 @@ const buttonListData = computed(() => {
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="title-xlg"
+        class="title-xlg max-w-[944px]"
       />
       <WidgetsSubTitle
         v-if="subTitleData"
         :resources-data="subTitleData"
-        class="title-sm mt-2"
+        class="title-sm max-w-[944px] mt-2"
       />
       <div v-if="imgListData" class="img-container">
         <div v-for="(item, index) in imgListData" :key="index" class="img-item">
@@ -62,7 +62,7 @@ const buttonListData = computed(() => {
       <WidgetsDescription
         v-if="descriptionData"
         :resources-data="descriptionData"
-        class="mt-8"
+        class="max-w-[944px] mt-8"
       />
     </div>
   </section>
diff --git a/layers/templates/GrDetail01/index.vue b/layers/templates/GrDetail01/index.vue
index 88c79f9..445ec65 100644
--- a/layers/templates/GrDetail01/index.vue
+++ b/layers/templates/GrDetail01/index.vue
@@ -62,17 +62,17 @@ const handleSplideMove = (_splide: SplideType, newIndex: number) => {
           <WidgetsMainTitle
             v-if="hasComponentGroup(item, 'mainTitle')"
             :resources-data="getComponentGroup(item, 'mainTitle')"
-            class="title-lg"
+            class="title-lg max-w-[944px]"
           />
           <WidgetsSubTitle
             v-if="hasComponentGroup(item, 'subTitle')"
             :resources-data="getComponentGroup(item, 'subTitle')"
-            class="title-md mt-0.5 line-clamp-3 md:mt-1 md:line-clamp-2"
+            class="title-md max-w-[944px] mt-0.5 line-clamp-3 md:mt-1 md:line-clamp-2"
           />
           <WidgetsDescription
             v-if="hasComponentGroup(item, 'description')"
             :resources-data="getComponentGroup(item, 'description')"
-            class="mt-4 md:mt-6"
+            class="max-w-[944px] mt-4 md:mt-6"
           />
         </div>
       </SplideSlide>
diff --git a/layers/templates/GrDetail02/index.vue b/layers/templates/GrDetail02/index.vue
index 8f67ae2..2e5adad 100644
--- a/layers/templates/GrDetail02/index.vue
+++ b/layers/templates/GrDetail02/index.vue
@@ -36,17 +36,17 @@ const paginationData = computed(() => {
           <WidgetsMainTitle
             v-if="hasComponentGroup(item, 'mainTitle')"
             :resources-data="getComponentGroup(item, 'mainTitle')"
-            class="title-lg"
+            class="title-lg max-w-[944px]"
           />
           <WidgetsSubTitle
             v-if="hasComponentGroup(item, 'subTitle')"
             :resources-data="getComponentGroup(item, 'subTitle')"
-            class="title-md mt-0.5 line-clamp-3 md:mt-1 md:line-clamp-2"
+            class="title-md max-w-[944px] mt-0.5 line-clamp-3 md:mt-1 md:line-clamp-2"
           />
           <WidgetsDescription
             v-if="hasComponentGroup(item, 'description')"
             :resources-data="getComponentGroup(item, 'description')"
-            class="mt-4 md:mt-6"
+            class="max-w-[944px] mt-4 md:mt-6"
           />
         </div>
       </SplideSlide>
diff --git a/layers/templates/GrDetail03/index.vue b/layers/templates/GrDetail03/index.vue
index 5b4a6a1..7587294 100644
--- a/layers/templates/GrDetail03/index.vue
+++ b/layers/templates/GrDetail03/index.vue
@@ -59,28 +59,28 @@ const handleSplideMove = (_splide: SplideType, newIndex: number) => {
           :resources-data="getComponentGroup(item, 'foreground')"
         />
         <div
-          class="content-standard max-w-[1024px] mx-auto items-start pt-[48px] md:pt-0"
+          class="content-standard max-w-[335px] mx-auto items-start pt-[48px] md:max-w-[1024px] md:pt-0"
         >
           <WidgetsSubTitle
             v-if="hasComponentGroup(item, 'category')"
             :resources-data="getComponentGroup(item, 'category')"
-            class="title-xs mb-2 line-clamp-1 text-left md:mb-5"
+            class="title-xs max-w-[540px] mb-2 line-clamp-1 text-left md:mb-5"
           />
           <WidgetsMainTitle
             v-if="hasComponentGroup(item, 'mainTitle')"
             :resources-data="getComponentGroup(item, 'mainTitle')"
-            class="title-lg line-clamp-1 text-left"
+            class="title-lg max-w-[540px] line-clamp-1 text-left"
           />
           <WidgetsSubTitle
             v-if="hasComponentGroup(item, 'subTitle')"
             :resources-data="getComponentGroup(item, 'subTitle')"
             tag="p"
-            class="title-md mt-1 line-clamp-1 text-left"
+            class="title-md max-w-[540px] mt-1 line-clamp-1 text-left"
           />
           <WidgetsDescription
             v-if="hasComponentGroup(item, 'description')"
             :resources-data="getComponentGroup(item, 'description')"
-            class="mt-2 text-left md:mt-5"
+            class="max-w-[540px] mt-2 text-left md:mt-5"
           />
           <AtomsVideo
             v-if="hasComponentGroup(item, 'video')"
diff --git a/layers/templates/GrGallery01/index.vue b/layers/templates/GrGallery01/index.vue
index e1abcb6..d0d9ff2 100644
--- a/layers/templates/GrGallery01/index.vue
+++ b/layers/templates/GrGallery01/index.vue
@@ -125,7 +125,7 @@ const onArrowClick = (direction, targetIndex) => {
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="title-md"
+        class="title-md max-w-[944px]"
       />
       <BlocksSlideThumbnail
         ref="slideThumbnailRef"
@@ -170,7 +170,7 @@ const onArrowClick = (direction, targetIndex) => {
 
 <style scoped>
 .thumbnail-carousel {
-  @apply w-full max-w-[688px] md:max-w-[944px];
+  @apply w-full max-w-[944px];
 }
 .thumbnail-carousel:deep(.main-splide) {
   @apply overflow-hidden rounded-lg border border-white/10 shadow-[0_4px_20px_0_rgba(0,0,0,0.5)];
diff --git a/layers/templates/GrGallery02/index.vue b/layers/templates/GrGallery02/index.vue
index e126c9e..9c48cba 100644
--- a/layers/templates/GrGallery02/index.vue
+++ b/layers/templates/GrGallery02/index.vue
@@ -69,7 +69,7 @@ const onArrowClick = (direction, targetIndex) => {
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="title-md mx-[20px] sm:mx-[40px]"
+        class="title-md max-w-[944px] mx-[20px] sm:mx-[40px]"
       />
       <BlocksSlideCenterFocus
         v-if="slideData"
diff --git a/layers/templates/GrGallery03/index.vue b/layers/templates/GrGallery03/index.vue
index 70da12f..c726e9f 100644
--- a/layers/templates/GrGallery03/index.vue
+++ b/layers/templates/GrGallery03/index.vue
@@ -78,7 +78,7 @@ const onArrowClick = (direction, targetIndex) => {
       <WidgetsMainTitle
         v-if="mainTitleData"
         :resources-data="mainTitleData"
-        class="title-md mx-[20px] sm:mx-[40px]"
+        class="title-md max-w-[944px] mx-[20px] sm:mx-[40px]"
       />
       <BlocksSlideCenterHighlight
         v-if="slideData"
@@ -101,12 +101,12 @@ const onArrowClick = (direction, targetIndex) => {
       <WidgetsSubTitle
         v-if="imgTitleData"
         :resources-data="imgTitleData"
-        class="title-lg mt-[32px] mx-[20px] line-clamp-2 sm:mx-[40px] md:line-clamp-1"
+        class="title-lg max-w-[944px] mt-[32px] mx-[20px] line-clamp-2 sm:mx-[40px] md:line-clamp-1"
       />
       <WidgetsDescription
         v-if="descriptionData"
         :resources-data="descriptionData"
-        class="mt-[8px] mx-[20px] sm:mx-[40px] md:mt-[16px]"
+        class="max-w-[944px] mt-[8px] mx-[20px] sm:mx-[40px] md:mt-[16px]"
       />
       <WidgetsButtonList
         v-if="buttonListData"
diff --git a/layers/templates/GrVisual03/index.vue b/layers/templates/GrVisual03/index.vue
index fb51901..eed919e 100644
--- a/layers/templates/GrVisual03/index.vue
+++ b/layers/templates/GrVisual03/index.vue
@@ -51,16 +51,17 @@ const onArrowClick = direction => {
           <WidgetsSubTitle
             v-if="hasComponentGroup(item, 'subTitle')"
             :resources-data="getComponentGroup(item, 'subTitle')"
-            class="title-md"
+            class="title-md max-w-[944px]"
           />
           <WidgetsMainTitle
             v-if="hasComponentGroup(item, 'mainTitle')"
             :resources-data="getComponentGroup(item, 'mainTitle')"
-            class="title-xlg"
+            class="title-xlg max-w-[944px]"
           />
           <WidgetsDescription
             v-if="hasComponentGroup(item, 'description')"
             :resources-data="getComponentGroup(item, 'description')"
+            class="max-w-[944px]"
           />
           <WidgetsButtonList
             v-if="hasComponentGroup(item, 'buttonList')"