fix.[SWV-798] sns 수정 관련_푸터 스타일 수정

layers/components/blocks/LanguageSwitcher.vue

@@ -70,7 +70,7 @@
       <svg
         v-else
         class="w-3 h-3 text-gray-300 transition-transform duration-200"
-        :class="{ 'rotate-180': isDropdownOpen }"
+        :class="{ 'rotate-180': !isDropdownOpen }"
         viewBox="0 0 12 12"
         fill="currentColor"
         xmlns="http://www.w3.org/2000/svg"
@@ -125,7 +125,6 @@
 </template>
 
 <script setup lang="ts">
-
 interface LanguageOrder {
   languageOrder?: any[]
 }
@@ -154,29 +153,29 @@ const availableLanguages = computed(() => {
   if (filteredLanguages.length === 0) {
     return [{ code: 'ko', name: '한국어' }]
   }
-    //languageOrder 값이 있는 경우 정렬, 없는 경우 기본 순서 유지
-  const defaultLanguageOrder = [ 'ko', 'en', 'ja', 'zh-cn', 'zh-tw', 'th' ]
+  //languageOrder 값이 있는 경우 정렬, 없는 경우 기본 순서 유지
+  const defaultLanguageOrder = ['ko', 'en', 'ja', 'zh-cn', 'zh-tw', 'th']
   const languageOrder = props.languageOrder || defaultLanguageOrder
   // 정렬: 우선순위 언어 먼저, 그 다음 나머지
   const sortedLanguages = filteredLanguages.sort((a, b) => {
     const indexA = languageOrder.indexOf(a.code)
     const indexB = languageOrder.indexOf(b.code)
-    
+
     // 둘 다 우선순위 목록에 있는 경우
     if (indexA !== -1 && indexB !== -1) {
       return indexA - indexB
     }
-    
+
     // a만 우선순위 목록에 있는 경우
     if (indexA !== -1) {
       return -1
     }
-    
+
     // b만 우선순위 목록에 있는 경우
     if (indexB !== -1) {
       return 1
     }
-    
+
     // 둘 다 우선순위 목록에 없는 경우 원래 순서 유지
     return 0
   })

layers/components/layouts/Footer.vue

@@ -180,35 +180,29 @@ const footerAgeRatingInfo = computed((): string[] => {
 </script>
 
 <template>
-  <footer id="footer" ref="footerRef" class="relative bg-blac">
+  <footer id="footer" ref="footerRef" class="relative px-5 sm:px-10">
     <div
-      class="inner relative max-w-7xl mx-auto px-5 py-4 text-[12px] text-gray-400 md:px-4 md:py-9 md:text-[12px]"
+      class="relative max-w-[1300px] mx-auto pt-4 pb-10 text-[13px] text-white/50"
     >
       <ClientOnly>
-        <div class="menu-area py-4 pb-4">
-          <ul class="flex items-center flex-wrap gap-x-6 gap-y-2">
-            <li
-              v-for="(footerMenuItem, index) in footerLinks"
-              :key="index"
-              class="text-[15px] text-white/50 md:tracking-[-0.5px] relative flex items-center"
-            >
+        <div class="py-4 border-b border-white/10">
+          <ul
+            class="flex items-center flex-wrap gap-x-6 gap-y-2 text-[15px] tracking-[-0.5px]"
+          >
+            <li v-for="(footerMenuItem, index) in footerLinks" :key="index">
               <NuxtLink
                 :to="footerMenuItem.url"
                 :target="footerMenuItem.target"
                 :class="[
                   footerMenuItem.active === 'y' && 'text-white/50',
-                  index === 2 && 'text-[#fff]',
-                  'hover:text-gray-600 transition-colors',
+                  index === 2 && 'text-white',
                 ]"
               >
                 {{ footerMenuItem.title }}
               </NuxtLink>
             </li>
             <li v-if="useGameRating" class="relative">
-              <button
-                class="text-[15px] text-white/50 hover:text-gray-600 transition-colors"
-                @click="toggleAgeRating"
-              >
+              <button @click="toggleAgeRating">
                 <em v-dompurify-html="tm('Footer_AgeRating')"></em>
               </button>
               <div
@@ -335,37 +329,33 @@ const footerAgeRatingInfo = computed((): string[] => {
             </li>
           </ul>
         </div>
-        <div class="address-area mt-4 hidden sm:block">
-          <address class="not-italic text-white/50">
-            <div class="row my-1.5 leading-5">
-              <span
-                v-dompurify-html="tm('Footer_Address')"
-                class="text-[13px] [&_a]:cursor-pointer [&_a]:text-white/50 [&_a]:underline"
-              ></span>
-            </div>
-          </address>
-        </div>
-
         <div
-          class="language-area static md:absolute bottom-7 right-10 text-white mt-5 md:mt-0 md:bottom-5.5 md:right-4"
+          class="flex flex-col items-start mt-4 md:flex-row md:justify-between"
         >
+          <address class="hidden not-italic leading-5 sm:block md:mr-6">
+            <div
+              v-dompurify-html="tm('Footer_Address')"
+              class="text-[13px] [&_a]:cursor-pointer [&_a]:text-white/50 [&_a]:underline"
+            />
+          </address>
           <BlocksLanguageSwitcher
             :language-order="tm('Footer_Language_Order')"
+            class="mt-4 sm:mt-5 md:mt-0"
           />
         </div>
 
-        <div v-if="hasCautionText" class="mt-6 md:mt-6 hidden sm:block">
+        <div v-if="hasCautionText" class="mt-5 hidden sm:block">
           <div
             v-dompurify-html="tm('Footer_caution')"
             class="text-xs text-white/30"
           ></div>
         </div>
 
-        <div class="copyright-area mt-6 text-[13px] text-white/50 md:mt-4">
+        <div class="mt-5">
           <span v-dompurify-html="tm('Footer_Copyright')"></span>
         </div>
 
-        <div class="logo-area flex items-center gap-7 mt-6 md:mt-6">
+        <div class="flex items-center gap-7 mt-6 md:mt-6">
           <span>
             <a
               :href="tm('Footer_Smilegate_Link')"