فهرست منبع

Merge remote-tracking branch 'origin/master'

# Conflicts:
#	app/pages/company/history.vue
#	app/pages/company/intro.vue
#	app/pages/contact/location.vue
#	app/pages/products/solutions.vue
#	app/pages/technology/patents.vue
interscope_003\interscope 2 ماه پیش
والد
کامیت
fa86d00ef2

+ 34 - 19
app/pages/company/catalog.vue

@@ -4,12 +4,16 @@
     <section class="catalog--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">저희 회사에 대한 이해를 돕기 위해 <br /><strong>카탈로그와 회사 소개서를 준비했습니다.</strong></h2>
+          <h2 class="title">
+            저희 회사에 대한 이해를 돕기 위해 <br /><strong
+              >카탈로그와 회사 소개서를 준비했습니다.</strong
+            >
+          </h2>
         </div>
         <div class="catalog--wrap">
           <div class="catalog">
             <div class="img--wrap">
-              <img src="/img/img--catalog1.png" alt="">
+              <img src="/img/img--catalog1.png" alt="" />
             </div>
             <div class="download--wrap">
               <p>카탈로그 다운로드</p>
@@ -22,7 +26,7 @@
           </div>
           <div class="catalog">
             <div class="img--wrap">
-              <img src="/img/img--catalog2.png" alt="">
+              <img src="/img/img--catalog2.png" alt="" />
             </div>
             <div class="download--wrap">
               <p>회사 소개서 다운로드</p>
@@ -39,20 +43,31 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("company")
-const title = ref("Company")
-const navigation = ref([
-  { name: "Company",
-    link: "/company/catalog" ,
-    gnbList : [
-      { name: "회사소개", link: "/company/intro" },
-      { name: "회사연혁", link: "/company/history" },
-      { name: "협력업체", link: "/company/partners" },
-      { name: "회사소개자료", link: "/company/catalog"}
-    ]
-  },
-  { name: "회사소개자료", link: "/company/catalog" }
-])
-</script>
+  const className = ref("company");
+  const title = ref("Company");
+  const navigation = ref([
+    {
+      name: "Company",
+      link: "/company/catalog",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "회사소개자료",
+      link: "/company/catalog",
+      gnbList: [
+        { name: "회사소개", link: "/company/intro" },
+        { name: "회사연혁", link: "/company/history" },
+        { name: "협력업체", link: "/company/partners" },
+        { name: "회사소개자료", link: "/company/catalog" },
+      ],
+    },
+  ]);
+</script>

+ 264 - 129
app/pages/company/history.vue

@@ -4,7 +4,10 @@
     <section class="history--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">그린웨일글로벌은 <br /><strong>새로운 친환경 미래</strong>를 만들어 가기 위해 <br />출범하였습니다.</h2>
+          <h2 class="title">
+            그린웨일글로벌은 <br /><strong>새로운 친환경 미래</strong>를 만들어 가기 위해
+            <br />출범하였습니다.
+          </h2>
         </div>
         <div class="history--desc--wrap">
           <div class="history--desc left--type">
@@ -15,14 +18,29 @@
               </picture>
             </div>
             <div class="desc--wrap">
-              <p><strong>플라스틱 환경문제</strong>는 우리가 살아가고 있는 현시대의 가장 큰 문제점 중 하나로 대두하고 있습니다.</p>
-              <p>한 미국 연구결과에 따르면, 플라스틱은 대중적으로 사용되기 시작한 1950년부터 2015년까지 생산된 총량이 <strong>83억 톤</strong>에 이르고, 그 중 약 절반은 최근 13년 내에 사용되었습니다.</p>
+              <p>
+                <strong>플라스틱 환경문제</strong>는 우리가 살아가고 있는 현시대의 가장 큰
+                문제점 중 하나로 대두하고 있습니다.
+              </p>
+              <p>
+                한 미국 연구결과에 따르면, 플라스틱은 대중적으로 사용되기 시작한
+                1950년부터 2015년까지 생산된 총량이 <strong>83억 톤</strong>에 이르고, 그
+                중 약 절반은 최근 13년 내에 사용되었습니다.
+              </p>
             </div>
           </div>
           <div class="history--desc right--type">
             <div class="desc--wrap">
-              <p>인류의 <strong>플라스틱 의존도</strong>는 날마다 급증하고, 인류에게 플라스틱 없이는 일상생활이 불가능한 시대에 봉착했습니다. 매년 증가하는 플라스틱 사용량으로 2050년에는 <strong>석유자원의 20%</strong>가 플라스틱 생산에 소비될 것으로 예측되고 있습니다. </p>
-              <p>위와 같은 현상은 온실가스양을 증가시켜 <strong>지구 온난화를 가속합니다.</strong></p>
+              <p>
+                인류의 <strong>플라스틱 의존도</strong>는 날마다 급증하고, 인류에게
+                플라스틱 없이는 일상생활이 불가능한 시대에 봉착했습니다. 매년 증가하는
+                플라스틱 사용량으로 2050년에는 <strong>석유자원의 20%</strong>가 플라스틱
+                생산에 소비될 것으로 예측되고 있습니다.
+              </p>
+              <p>
+                위와 같은 현상은 온실가스양을 증가시켜
+                <strong>지구 온난화를 가속합니다.</strong>
+              </p>
             </div>
             <div class="img--wrap">
               <picture>
@@ -39,9 +57,21 @@
               </picture>
             </div>
             <div class="desc--wrap">
-              <p>플라스틱은 생산과정에서뿐만 아니라 <strong>폐기과정</strong>에서도 지구 환경에 악영향을 끼칩니다.</p>
-              <p>현재, 전 세계적으로 매년 4억 톤 이상의 플라스틱 쓰레기가 배출되고, 이 배출된 쓰레기들은 <strong>소각</strong>되거나 땅속에 <strong>매립</strong>되고, 나머지는 <strong>바다</strong>에 버려지고 있습니다.</p>
-              <p>바다에 버려진 플라스틱 쓰레기들은 파도와 자외선에 의해 잘게 부서져 미세 플라스틱이 되어 자연 생태계를 돌고 돌아 <strong>결국 우리 인류에게 돌아오는 악순환</strong>이 반복되고 있습니다.</p>
+              <p>
+                플라스틱은 생산과정에서뿐만 아니라 <strong>폐기과정</strong>에서도 지구
+                환경에 악영향을 끼칩니다.
+              </p>
+              <p>
+                현재, 전 세계적으로 매년 4억 톤 이상의 플라스틱 쓰레기가 배출되고, 이
+                배출된 쓰레기들은 <strong>소각</strong>되거나 땅속에
+                <strong>매립</strong>되고, 나머지는 <strong>바다</strong>에 버려지고
+                있습니다.
+              </p>
+              <p>
+                바다에 버려진 플라스틱 쓰레기들은 파도와 자외선에 의해 잘게 부서져 미세
+                플라스틱이 되어 자연 생태계를 돌고 돌아
+                <strong>결국 우리 인류에게 돌아오는 악순환</strong>이 반복되고 있습니다.
+              </p>
             </div>
           </div>
           <div class="history--desc top--type">
@@ -53,8 +83,17 @@
             </div>
             <div class="desc--box--wrap">
               <div class="desc--wrap">
-                <p>그린웨일글로벌은 기존 플라스틱 대체재인 <strong>바이오 생분해성 플라스틱 및 탄소저감형 플라스틱 산업</strong> 확대를 위한 사명감으로 환경오염의 악순환을 막으며, 새로운 <strong>친환경 미래</strong>를 만들어 가기 위해 출범하였습니다.</p>
-                <p>특수 원료 인증과 국내외 특허 취득 및 상표 등록, 환경부와 중소기업부 우수기업으로 선정되는 등의 일련의 발자취를 거쳐왔으며, 앞으로도 인류의 미래 환경에 적극 대처하는 초심을 잃지 않겠습니다.</p>
+                <p>
+                  그린웨일글로벌은 기존 플라스틱 대체재인
+                  <strong>바이오 생분해성 플라스틱 및 탄소저감형 플라스틱 산업</strong>
+                  확대를 위한 사명감으로 환경오염의 악순환을 막으며, 새로운
+                  <strong>친환경 미래</strong>를 만들어 가기 위해 출범하였습니다.
+                </p>
+                <p>
+                  특수 원료 인증과 국내외 특허 취득 및 상표 등록, 환경부와 중소기업부
+                  우수기업으로 선정되는 등의 일련의 발자취를 거쳐왔으며, 앞으로도 인류의
+                  미래 환경에 적극 대처하는 초심을 잃지 않겠습니다.
+                </p>
               </div>
               <div class="desc--wrap">
                 <div>
@@ -70,9 +109,7 @@
           </div>
         </div>
         <div class="history--graph--wrap">
-          <div class="txt--wrap">
-            Achievement
-          </div>
+          <div class="txt--wrap">Achievement</div>
           <div class="graph--wrap">
             <div class="graph--box">
               <div class="deco--box">
@@ -84,17 +121,22 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2019.03</span><p>그린웨일글로벌 주식회사 설립</p>
+                      <span>2019.03</span>
+                      <p>그린웨일글로벌 주식회사 설립</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2019.08</span><p>생분해성플라스틱수지 원료 환경표지(EL724) 인증</p>
+                      <span>2019.08</span>
+                      <p>생분해성플라스틱수지 원료 환경표지(EL724) 인증</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2019.09</span><p>그린웨일글로벌 베트남 자회사 설립 <br />(B.I.G 인수 외투법인 전환)</p>
+                      <span>2019.09</span>
+                      <p>
+                        그린웨일글로벌 베트남 자회사 설립 <br />(B.I.G 인수 외투법인 전환)
+                      </p>
                     </div>
                   </li>
                 </ul>
@@ -110,22 +152,26 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2020.04</span><p>미국 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
+                      <span>2020.04</span>
+                      <p>미국 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2020.05</span><p>한국 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
+                      <span>2020.05</span>
+                      <p>한국 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2020.10</span><p>벤처기업 인증</p>
+                      <span>2020.10</span>
+                      <p>벤처기업 인증</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2020.11</span><p>윤태균 대표 공동대표 취임</p>
+                      <span>2020.11</span>
+                      <p>윤태균 대표 공동대표 취임</p>
                     </div>
                   </li>
                 </ul>
@@ -141,22 +187,26 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2021.02</span><p>레진 양산 시설 구축 완료 (베트남)</p>
+                      <span>2021.02</span>
+                      <p>레진 양산 시설 구축 완료 (베트남)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2021.03</span><p>녹색기술 인증 취득 (한국산업기술진흥원)</p>
+                      <span>2021.03</span>
+                      <p>녹색기술 인증 취득 (한국산업기술진흥원)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2021.09</span><p>우수벤처기업 선정</p>
+                      <span>2021.09</span>
+                      <p>우수벤처기업 선정</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2021.10</span><p>유럽 TUV OK Biobased 인증 (원료)</p>
+                      <span>2021.10</span>
+                      <p>유럽 TUV OK Biobased 인증 (원료)</p>
                     </div>
                   </li>
                 </ul>
@@ -172,32 +222,41 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2022.04</span><p>PCT 해외특허출원 (유럽, 아시아, 아프리카. 총 13개 권역)</p>
+                      <span>2022.04</span>
+                      <p>PCT 해외특허출원 (유럽, 아시아, 아프리카. 총 13개 권역)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2022.06</span><p>유럽 TUV OK Compost Industrial 인증 (원료, 제품)</p>
+                      <span>2022.06</span>
+                      <p>유럽 TUV OK Compost Industrial 인증 (원료, 제품)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2022.08</span><p>ISO 14001:2015 인증</p>
+                      <span>2022.08</span>
+                      <p>ISO 14001:2015 인증</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2022.09</span><p>ISO 50001:2018 인증</p>
+                      <span>2022.09</span>
+                      <p>ISO 50001:2018 인증</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>유럽 상표 등록 (GreenWhaleGlobal)</p>
+                      <span></span>
+                      <p>유럽 상표 등록 (GreenWhaleGlobal)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2022.12</span><p>남아프리카공화국 특허 등록 <br />(생분해성 플라스틱 수지 제조기술 및 제품)</p>
+                      <span>2022.12</span>
+                      <p>
+                        남아프리카공화국 특허 등록 <br />(생분해성 플라스틱 수지 제조기술
+                        및 제품)
+                      </p>
                     </div>
                   </li>
                 </ul>
@@ -213,57 +272,71 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2023.02</span><p>베트남 레진 양산 시설 증설 (연간 6,000톤)</p>
+                      <span>2023.02</span>
+                      <p>베트남 레진 양산 시설 증설 (연간 6,000톤)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>ECOIST 브랜드 출원</p>
+                      <span></span>
+                      <p>ECOIST 브랜드 출원</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.03</span><p>OAPI 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
+                      <span>2023.03</span>
+                      <p>OAPI 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>공동대표규정 폐지 (황지영 대표 사임)</p>
+                      <span></span>
+                      <p>공동대표규정 폐지 (황지영 대표 사임)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.05</span><p>미국 상표 등록 (GreenWhaleGlobal)</p>
+                      <span>2023.05</span>
+                      <p>미국 상표 등록 (GreenWhaleGlobal)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.07</span><p>대한민국 올해의 녹색상품 수상 <br />(에코이스트 행거, 폴리백, 3D프린터 필라멘트)</p>
+                      <span>2023.07</span>
+                      <p>
+                        대한민국 올해의 녹색상품 수상 <br />(에코이스트 행거, 폴리백,
+                        3D프린터 필라멘트)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>일본 상표 등록 (GreenWhaleGlobal)</p>
+                      <span></span>
+                      <p>일본 상표 등록 (GreenWhaleGlobal)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.08</span><p>친환경 제품 온라인 쇼핑몰 입점 판매 (아마존)</p>
+                      <span>2023.08</span>
+                      <p>친환경 제품 온라인 쇼핑몰 입점 판매 (아마존)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.09</span><p>울산 자유무역지구 공장 확보(450평 규모)</p>
+                      <span>2023.09</span>
+                      <p>울산 자유무역지구 공장 확보(450평 규모)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.11</span><p>산업통상자원부 장관표창 (2023 순환경제 장관상)</p>
+                      <span>2023.11</span>
+                      <p>산업통상자원부 장관표창 (2023 순환경제 장관상)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2023.12</span><p>산업통상자원부 장관표창 (2023 대한민국 기술대상 장관상)</p>
+                      <span>2023.12</span>
+                      <p>산업통상자원부 장관표창 (2023 대한민국 기술대상 장관상)</p>
                     </div>
                   </li>
                 </ul>
@@ -279,67 +352,92 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2024.01</span><p>CES2024 Innovation Award 수상</p>
+                      <span>2024.01</span>
+                      <p>CES2024 Innovation Award 수상</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2024.04</span><p>중소벤처기업부 '초격차 스타트업 1000+' 선정</p>
+                      <span>2024.04</span>
+                      <p>중소벤처기업부 '초격차 스타트업 1000+' 선정</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>인도 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
+                      <span></span>
+                      <p>인도 특허 등록 (생분해성 플라스틱 수지 제조기술 및 제품)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2024.06</span><p>베트남 상표 등록 (GreenWhaleGlobal)</p>
+                      <span>2024.06</span>
+                      <p>베트남 상표 등록 (GreenWhaleGlobal)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>Select USA Investment Summit 참가</p>
+                      <span></span>
+                      <p>Select USA Investment Summit 참가</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2024.08</span><p>재활용 플라스틱을 활용한 바이오플라스틱(PCR+) 레진 상용화</p>
+                      <span>2024.08</span>
+                      <p>재활용 플라스틱을 활용한 바이오플라스틱(PCR+) 레진 상용화</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>인도네시아 특허 등록 <br />(생분해성 플라스틱 수지 제조기술 및 제품)</p>
+                      <span></span>
+                      <p>
+                        인도네시아 특허 등록 <br />(생분해성 플라스틱 수지 제조기술 및
+                        제품)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>총380만달러 규모 바이오플라스틱 원료 공급 계약 체결 <br />(해외바이어 2개사)</p>
+                      <span></span>
+                      <p>
+                        총380만달러 규모 바이오플라스틱 원료 공급 계약 체결
+                        <br />(해외바이어 2개사)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2024.10</span><p>열가소성 전분을 포함하는 바이오매스 기반 수지 조성물 <br />(PCR+) 특허 등록</p>
+                      <span>2024.10</span>
+                      <p>
+                        열가소성 전분을 포함하는 바이오매스 기반 수지 조성물 <br />(PCR+)
+                        특허 등록
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2024.11</span><p>ECOIST 상표 등록 (한국)</p>
+                      <span>2024.11</span>
+                      <p>ECOIST 상표 등록 (한국)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2024.12</span><p>2024 벤처창업진흥 유공 포상 장관상</p>
+                      <span>2024.12</span>
+                      <p>2024 벤처창업진흥 유공 포상 장관상</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>미국향 첫 수출 완료, 글로벌 시장 확장 본격화</p>
+                      <span></span>
+                      <p>미국향 첫 수출 완료, 글로벌 시장 확장 본격화</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>LG Display 스타트업육성프로그램 (2025 Dream Play) <br />최종 선정 (상금 1천만원 수령)</p>
+                      <span></span>
+                      <p>
+                        LG Display 스타트업육성프로그램 (2025 Dream Play) <br />최종 선정
+                        (상금 1천만원 수령)
+                      </p>
                     </div>
                   </li>
                 </ul>
@@ -354,57 +452,83 @@
                 <ul>
                   <li>
                     <div>
-                      <span>2025.01</span><p>2025년 초격차 스타트업1000+ 프로젝트 <br />(정부지원사업 지원금 1억 8천만원)</p>
+                      <span>2025.01</span>
+                      <p>
+                        2025년 초격차 스타트업1000+ 프로젝트 <br />(정부지원사업 지원금
+                        1억 8천만원)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>CES2025 참가 (서울통합관 강남구)</p>
+                      <span></span>
+                      <p>CES2025 참가 (서울통합관 강남구)</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>기술능력 평가 기술등급 T-3 획득</p>
+                      <span></span>
+                      <p>기술능력 평가 기술등급 T-3 획득</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2025.03</span><p>TUV OK BIOBASED ECOIST PCR+ PC 인증 획득</p>
+                      <span>2025.03</span>
+                      <p>TUV OK BIOBASED ECOIST PCR+ PC 인증 획득</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2025.04</span><p>실로암인더스트리 MOU 체결 <br />(친환경 소재를 활용한 제품 개발 및 생산 판매)</p>
+                      <span>2025.04</span>
+                      <p>
+                        실로암인더스트리 MOU 체결 <br />(친환경 소재를 활용한 제품 개발 및
+                        생산 판매)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>ZER01NE ACCELERATOR 2025 프로그램 최종 선정 <br />(상금 1억원 수령)</p>
+                      <span></span>
+                      <p>
+                        ZER01NE ACCELERATOR 2025 프로그램 최종 선정 <br />(상금 1억원
+                        수령)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>베트남 GLOBAL SOURCING FAIR 참가</p>
+                      <span></span>
+                      <p>베트남 GLOBAL SOURCING FAIR 참가</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>2025 탄소중립 사업화 지원사업 최종 선정 <br />(정부지원사업 지원금 2억원)</p>
+                      <span></span>
+                      <p>
+                        2025 탄소중립 사업화 지원사업 최종 선정 <br />(정부지원사업 지원금
+                        2억원)
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2025.05</span><p>그린웨일글로벌 소재 HALAL 인증 절차 착수, 무슬림 시장 <br />진출 교두보 확보</p>
+                      <span>2025.05</span>
+                      <p>
+                        그린웨일글로벌 소재 HALAL 인증 절차 착수, 무슬림 시장 <br />진출
+                        교두보 확보
+                      </p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span>2025.06</span><p>한화자산운용 투자 확약</p>
+                      <span>2025.06</span>
+                      <p>한화자산운용 투자 확약</p>
                     </div>
                   </li>
                   <li>
                     <div>
-                      <span></span><p>화장품 용기 제품 개발 완료, 국내 뷰티 브랜드 납품 개시</p>
+                      <span></span>
+                      <p>화장품 용기 제품 개발 완료, 국내 뷰티 브랜드 납품 개시</p>
                     </div>
                   </li>
                 </ul>
@@ -417,74 +541,85 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
-import { gsap } from 'gsap'
-import { ScrollTrigger } from 'gsap/ScrollTrigger'
-import { onMounted } from 'vue'
+  import TopVisual from "~/components/topVisual.vue";
+  import { gsap } from "gsap";
+  import { ScrollTrigger } from "gsap/ScrollTrigger";
+  import { onMounted } from "vue";
 
-gsap.registerPlugin(ScrollTrigger)
+  gsap.registerPlugin(ScrollTrigger);
 
-const className = ref("company")
-const title = ref("Company")
-const navigation = ref([
-  { name: "Company",
-    link: "/company/history" ,
-    gnbList : [
-      { name: "회사소개", link: "/company/intro" },
-      { name: "회사연혁", link: "/company/history" },
-      { name: "협력업체", link: "/company/partners" },
-      { name: "회사소개자료", link: "/company/catalog"}
-    ]
-  },
-  { name: "회사연혁", link: "/company/history" }
-])
+  const className = ref("company");
+  const title = ref("Company");
+  const navigation = ref([
+    {
+      name: "Company",
+      link: "/company/history",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "회사연혁",
+      link: "/company/history",
+      gnbList: [
+        { name: "회사소개", link: "/company/intro" },
+        { name: "회사연혁", link: "/company/history" },
+        { name: "협력업체", link: "/company/partners" },
+        { name: "회사소개자료", link: "/company/catalog" },
+      ],
+    },
+  ]);
 
-onMounted(() => {
-  // 초기 상태 설정
-  gsap.set(".deco--box .dot", { opacity: 0 })
-  gsap.set(".deco--box .line", { height: 0 })
-  gsap.set(".history--box", { opacity: 0, x: 50 })
+  onMounted(() => {
+    // 초기 상태 설정
+    gsap.set(".deco--box .dot", { opacity: 0 });
+    gsap.set(".deco--box .line", { height: 0 });
+    gsap.set(".history--box", { opacity: 0, x: 50 });
 
-  // 각 graph--box에 대해 개별 애니메이션 적용
-  document.querySelectorAll('.graph--box').forEach((box, index) => {
-    const dot = box.querySelector('.deco--box .dot')
-    const line = box.querySelector('.deco--box .line')
-    const historyBox = box.querySelector('.history--box')
+    // 각 graph--box에 대해 개별 애니메이션 적용
+    document.querySelectorAll(".graph--box").forEach((box, index) => {
+      const dot = box.querySelector(".deco--box .dot");
+      const line = box.querySelector(".deco--box .line");
+      const historyBox = box.querySelector(".history--box");
 
-    // .dot 애니메이션
-    gsap.to(dot, {
-      opacity: 1,
-      duration: 0.5,
-      scrollTrigger: {
-        trigger: box,
-        start: "top 80%",
-        toggleActions: "play reverse play reverse"
-      }
-    })
+      // .dot 애니메이션
+      gsap.to(dot, {
+        opacity: 1,
+        duration: 0.5,
+        scrollTrigger: {
+          trigger: box,
+          start: "top 80%",
+          toggleActions: "play reverse play reverse",
+        },
+      });
 
-    // .line 애니메이션
-    gsap.to(line, {
-      height: "100%",
-      duration: 0.3,
-      scrollTrigger: {
-        trigger: box,
-        start: "top 80%",
-        toggleActions: "play reverse play reverse"
-      }
-    })
+      // .line 애니메이션
+      gsap.to(line, {
+        height: "100%",
+        duration: 0.3,
+        scrollTrigger: {
+          trigger: box,
+          start: "top 80%",
+          toggleActions: "play reverse play reverse",
+        },
+      });
 
-    // 글씨 애니메이션 (오른쪽에서 왼쪽으로)
-    gsap.to(historyBox, {
-      opacity: 1,
-      x: 0,
-      duration: 0.8,
-      ease: "power2.out",
-      scrollTrigger: {
-        trigger: box,
-        start: "top 80%",
-        toggleActions: "play reverse play reverse"
-      }
-    })
-  })
-})
-</script>
+      // 글씨 애니메이션 (오른쪽에서 왼쪽으로)
+      gsap.to(historyBox, {
+        opacity: 1,
+        x: 0,
+        duration: 0.8,
+        ease: "power2.out",
+        scrollTrigger: {
+          trigger: box,
+          start: "top 80%",
+          toggleActions: "play reverse play reverse",
+        },
+      });
+    });
+  });
+</script>

+ 54 - 30
app/pages/company/intro.vue

@@ -5,10 +5,16 @@
       <div class="sub--container">
         <div class="title--wrap">
           <div class="logo--wrap">
-            <img src="/img/company--logo.svg" alt="그린웨일글로벌">
+            <img src="/img/company--logo.svg" alt="그린웨일글로벌" />
           </div>
-          <h2 class="title">그린웨일글로벌(주)는 <br /><strong>건강하고 새로운 친환경 미래</strong>를 <br />만들기 위해 탄생했습니다.</h2>
-          <p class="sub--title">환경에 해가 되지 않는 친환경 플라스틱 대체 소재를 개발하여 <br />지구환경을 지키기 위해 노력하고 연구하는 바이오테크 회사입니다.</p>
+          <h2 class="title">
+            그린웨일글로벌(주)는 <br /><strong>건강하고 새로운 친환경 미래</strong>를
+            <br />만들기 위해 탄생했습니다.
+          </h2>
+          <p class="sub--title">
+            환경에 해가 되지 않는 친환경 플라스틱 대체 소재를 개발하여 <br />지구환경을
+            지키기 위해 노력하고 연구하는 바이오테크 회사입니다.
+          </p>
         </div>
       </div>
     </section>
@@ -25,21 +31,22 @@
         <h3 class="mission--title">Mission</h3>
         <p class="mission--desc">
           혁신적인 친환경 탄소저감형 제품 연구 개발로 <br />
-          <strong>기존의 편리함은 유지되고 자연환경은 보호할 수 있는 제품</strong>을 생산하여 <br />사회적 책임에 기여하는 기업
+          <strong>기존의 편리함은 유지되고 자연환경은 보호할 수 있는 제품</strong>을
+          생산하여 <br />사회적 책임에 기여하는 기업
         </p>
       </div>
       <div class="mission--img--wrap">
         <div class="img--wrap">
-          <img src="/img/img--mission1.png" alt="미션 이미지">
+          <img src="/img/img--mission1.png" alt="미션 이미지" />
         </div>
         <div class="img--wrap">
-          <img src="/img/img--mission2.png" alt="미션 이미지">
+          <img src="/img/img--mission2.png" alt="미션 이미지" />
         </div>
         <div class="img--wrap">
-          <img src="/img/img--mission3.png" alt="미션 이미지">
+          <img src="/img/img--mission3.png" alt="미션 이미지" />
         </div>
         <div class="img--wrap">
-          <img src="/img/img--mission4.png" alt="미션 이미지">
+          <img src="/img/img--mission4.png" alt="미션 이미지" />
         </div>
       </div>
     </section>
@@ -52,18 +59,18 @@
         <div class="product--img--wrap web">
           <div class="img--top">
             <div class="img--wrap">
-              <img src="/img/img--product1.png" alt="생산 시설">
+              <img src="/img/img--product1.png" alt="생산 시설" />
             </div>
             <div class="img--wrap">
-              <img src="/img/img--product2.png" alt="생산 시설">
+              <img src="/img/img--product2.png" alt="생산 시설" />
             </div>
           </div>
           <div class="img--bot">
             <div class="img--wrap">
-              <img src="/img/img--product3.png" alt="생산 시설">
+              <img src="/img/img--product3.png" alt="생산 시설" />
             </div>
             <div class="img--wrap">
-              <img src="/img/img--product4.png" alt="생산 시설">
+              <img src="/img/img--product4.png" alt="생산 시설" />
             </div>
           </div>
         </div>
@@ -91,7 +98,10 @@
       <div class="sub--container">
         <div class="title--wrap color--white">
           <h3 class="title">Values</h3>
-          <p class="sub--title2">끊임없는 기술혁신을 바탕으로 <br />전 인류가 친환경적인 삶을 지속가능하고 편리하게 누릴 수 있도록 만들어 가겠습니다.</p>
+          <p class="sub--title2">
+            끊임없는 기술혁신을 바탕으로 <br />전 인류가 친환경적인 삶을 지속가능하고
+            편리하게 누릴 수 있도록 만들어 가겠습니다.
+          </p>
         </div>
         <div class="values--card--wrap">
           <dl class="card">
@@ -107,7 +117,10 @@
           <dl class="card">
             <i class="ico"></i>
             <dt>기술</dt>
-            <dd>혁신적인 친환경 탄소저감형 원료 연구개발을 통해 부담없이 편하게 자연을 생각하며 사용할 수 있는 제품 생산</dd>
+            <dd>
+              혁신적인 친환경 탄소저감형 원료 연구개발을 통해 부담없이 편하게 자연을
+              생각하며 사용할 수 있는 제품 생산
+            </dd>
           </dl>
         </div>
       </div>
@@ -115,20 +128,31 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("company")
-const title = ref("Company")
-const navigation = ref([
-  { name: "Company",
-    link: "/company/intro" ,
-    gnbList : [
-      { name: "회사소개", link: "/company/intro" },
-      { name: "회사연혁", link: "/company/history" },
-      { name: "협력업체", link: "/company/partners" },
-      { name: "회사소개자료", link: "/company/catalog"}
-    ]
-  },
-  { name: "회사소개", link: "/company/intro" }
-])
-</script>
+  const className = ref("company");
+  const title = ref("Company");
+  const navigation = ref([
+    {
+      name: "Company",
+      link: "/company/intro",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "회사소개",
+      link: "/company/intro",
+      gnbList: [
+        { name: "회사소개", link: "/company/intro" },
+        { name: "회사연혁", link: "/company/history" },
+        { name: "협력업체", link: "/company/partners" },
+        { name: "회사소개자료", link: "/company/catalog" },
+      ],
+    },
+  ]);
+</script>

+ 67 - 51
app/pages/company/partners.vue

@@ -4,110 +4,115 @@
     <section class="partners--section">
       <div class="sub--container type3">
         <div class="title--wrap">
-          <h2 class="title">그린웨일글로벌과 함께 하고 있는 <br /><strong>파트너들을 소개합니다.</strong></h2>
+          <h2 class="title">
+            그린웨일글로벌과 함께 하고 있는 <br /><strong>파트너들을 소개합니다.</strong>
+          </h2>
         </div>
         <div class="partners--wrap">
           <div class="partners">
-            <img src="/img/logo--partners1.svg" alt="HYUNDAI">
+            <img src="/img/logo--partners1.svg" alt="HYUNDAI" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners2.svg" alt="CJ HDC biosol">
+            <img src="/img/logo--partners2.svg" alt="CJ HDC biosol" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners3.svg" alt="SHINSEGAE">
+            <img src="/img/logo--partners3.svg" alt="SHINSEGAE" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners4.svg" alt="OJC">
+            <img src="/img/logo--partners4.svg" alt="OJC" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners5.svg" alt="OTTERBOX">
+            <img src="/img/logo--partners5.svg" alt="OTTERBOX" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners6.svg" alt="emis">
+            <img src="/img/logo--partners6.svg" alt="emis" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners7.svg" alt="LG디스플레이">
+            <img src="/img/logo--partners7.svg" alt="LG디스플레이" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners8.svg" alt="MARIBUMI Starchtech">
+            <img src="/img/logo--partners8.svg" alt="MARIBUMI Starchtech" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners9.svg" alt="VINAMILK">
+            <img src="/img/logo--partners9.svg" alt="VINAMILK" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners10.svg" alt="금강종합산업">
+            <img src="/img/logo--partners10.svg" alt="금강종합산업" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners11.svg" alt="Gong cha">
+            <img src="/img/logo--partners11.svg" alt="Gong cha" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners12.svg" alt="EENK">
+            <img src="/img/logo--partners12.svg" alt="EENK" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners13.svg" alt="Peace">
+            <img src="/img/logo--partners13.svg" alt="Peace" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners14.svg" alt="easyGreen">
+            <img src="/img/logo--partners14.svg" alt="easyGreen" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners15.svg" alt="acecook">
+            <img src="/img/logo--partners15.svg" alt="acecook" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners16.svg" alt="cocospack">
+            <img src="/img/logo--partners16.svg" alt="cocospack" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners17.svg" alt="rapportlabs">
+            <img src="/img/logo--partners17.svg" alt="rapportlabs" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners18.svg" alt="asill">
+            <img src="/img/logo--partners18.svg" alt="asill" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners19.svg" alt="rohto">
+            <img src="/img/logo--partners19.svg" alt="rohto" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners20.svg" alt="wonlim">
+            <img src="/img/logo--partners20.svg" alt="wonlim" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners21.svg" alt="DHL Express">
+            <img src="/img/logo--partners21.svg" alt="DHL Express" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners22.svg" alt="STAND OIL">
+            <img src="/img/logo--partners22.svg" alt="STAND OIL" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners23.svg" alt="posco international">
+            <img src="/img/logo--partners23.svg" alt="posco international" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners24.svg" alt="musinsa">
+            <img src="/img/logo--partners24.svg" alt="musinsa" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners25.svg" alt="trim mate">
+            <img src="/img/logo--partners25.svg" alt="trim mate" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners26.svg" alt="polifolia">
+            <img src="/img/logo--partners26.svg" alt="polifolia" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners27.svg" alt="daehyun">
+            <img src="/img/logo--partners27.svg" alt="daehyun" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners28.svg" alt="queenit">
+            <img src="/img/logo--partners28.svg" alt="queenit" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners29.svg" alt="투디엠">
+            <img src="/img/logo--partners29.svg" alt="투디엠" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners30.svg" alt="SBGlobal">
+            <img src="/img/logo--partners30.svg" alt="SBGlobal" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners31.svg" alt="han thuy company">
+            <img src="/img/logo--partners31.svg" alt="han thuy company" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners32.svg" alt="top run total solution">
+            <img src="/img/logo--partners32.svg" alt="top run total solution" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners33.svg" alt="open yy">
+            <img src="/img/logo--partners33.svg" alt="open yy" />
           </div>
           <div class="partners">
-            <img src="/img/logo--partners34.svg" alt="사회복지법인 실로암시각장애인복지회">
+            <img
+              src="/img/logo--partners34.svg"
+              alt="사회복지법인 실로암시각장애인복지회"
+            />
           </div>
         </div>
       </div>
@@ -115,20 +120,31 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue';
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("company")
-const title = ref("Company")
-const navigation = ref([
-  { name: "Company",
-    link: "/company/partners" ,
-    gnbList : [
-      { name: "회사소개", link: "/company/intro" },
-      { name: "회사연혁", link: "/company/history" },
-      { name: "협력업체", link: "/company/partners" },
-      { name: "회사소개자료", link: "/company/catalog"}
-    ]
-  },
-  { name: "협력업체", link: "/company/partners" }
-])
-</script>
+  const className = ref("company");
+  const title = ref("Company");
+  const navigation = ref([
+    {
+      name: "Company",
+      link: "/company/partners",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "협력업체",
+      link: "/company/partners",
+      gnbList: [
+        { name: "회사소개", link: "/company/intro" },
+        { name: "회사연혁", link: "/company/history" },
+        { name: "협력업체", link: "/company/partners" },
+        { name: "회사소개자료", link: "/company/catalog" },
+      ],
+    },
+  ]);
+</script>

+ 69 - 51
app/pages/contact/faq.vue

@@ -14,56 +14,74 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue';
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("contact")
-const title = ref("Contact")
-const navigation = ref([
-  { name: "Contact",
-    link: "/contact/faq" ,
-    gnbList: [
-      { name: "공지사항", link: "/contact/notice" },
-      { name: "FAQ", link: "/contact/faq" },
-      { name: "고객센터", link: "/contact/support" },
-      { name: "오시는길", link: "/contact/location" }
-    ]
-  },
-  { name: "FAQ", link: "/contact/faq" }
-])
+  const className = ref("contact");
+  const title = ref("Contact");
+  const navigation = ref([
+    {
+      name: "Contact",
+      link: "/contact/faq",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "FAQ",
+      link: "/contact/faq",
+      gnbList: [
+        { name: "공지사항", link: "/contact/notice" },
+        { name: "FAQ", link: "/contact/faq" },
+        { name: "고객센터", link: "/contact/support" },
+        { name: "오시는길", link: "/contact/location" },
+      ],
+    },
+  ]);
 
-const faqContent = ref([
-  {
-    label: "바이오 플라스틱은 어떤 종류가 있어요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "생분해성 플라스틱이란 무엇인가요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "생분해성 플라스틱이 정말 친환경적인가요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "제품마다 생분해 되는 시간이 다른가요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "그린웨일글로벌 플라스틱은 어떻게 다르나요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "카사바란 무엇인가요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "정말 생분해되는지 어떻게 알 수 있나요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  },
-  {
-    label: "물에 젖거나 가열하면 부패하나요?",
-    content: "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다."
-  }
-])
-
-</script>
+  const faqContent = ref([
+    {
+      label: "바이오 플라스틱은 어떤 종류가 있어요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "생분해성 플라스틱이란 무엇인가요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "생분해성 플라스틱이 정말 친환경적인가요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "제품마다 생분해 되는 시간이 다른가요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "그린웨일글로벌 플라스틱은 어떻게 다르나요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "카사바란 무엇인가요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "정말 생분해되는지 어떻게 알 수 있나요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+    {
+      label: "물에 젖거나 가열하면 부패하나요?",
+      content:
+        "바이오플라스틱은 크게 생분해성 플라스틱(Biodegradable plastic), 바이오 베이스 플라스틱(Bio-based plastic), 그리고 산화생분해 플라스틱(Oxo-biodegradable plastic)으로 나뉩니다. 단 이 중 산화생분해 플라스틱은 최근에 마이크로플라스틱으로 분산될 뿐, 분해되지 않는다고 결론지어 친환경 플라스틱 종류에서 제외되었습니다.",
+    },
+  ]);
+</script>

+ 76 - 24
app/pages/contact/location.vue

@@ -20,31 +20,72 @@
       <div class="sub--container">
         <div class="location--wrap">
           <h4>본사</h4>
-          <p class="map"><i class="ico"></i>서울시 강남구 언주로 650 한국건설기술인협회 신관 2층 그린웨일글로벌 (06098)</p>
+          <p class="map">
+            <i class="ico"></i>서울시 강남구 언주로 650 한국건설기술인협회 신관 2층
+            그린웨일글로벌 (06098)
+          </p>
           <p class="call"><i class="ico"></i>02-3447-8801 ~ 8802</p>
           <div class="location--map">
-            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d12658.81751592391!2d127.02545755395572!3d37.51488995282799!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x357ca58e2a1fd187%3A0xc1499b8d314042e3!2z6re466aw7Juo7J286riA66Gc67KM!5e0!3m2!1sko!2skr!4v1758783859462!5m2!1sko!2skr" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+            <iframe
+              src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d12658.81751592391!2d127.02545755395572!3d37.51488995282799!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x357ca58e2a1fd187%3A0xc1499b8d314042e3!2z6re466aw7Juo7J286riA66Gc67KM!5e0!3m2!1sko!2skr!4v1758783859462!5m2!1sko!2skr"
+              width="100%"
+              height="100%"
+              style="border: 0"
+              allowfullscreen=""
+              loading="lazy"
+              referrerpolicy="no-referrer-when-downgrade"
+            ></iframe>
           </div>
         </div>
         <div class="location--wrap">
           <h4>베트남 지사</h4>
-          <p class="map"><i class="ico"></i>GREEN WHALE GLOBAL VIET NAM CO., LTD. <br />Factory C_1B_C4_B & C_1B_C4_C, Lot C_1B_CN, My Phuoc 3 Industrial Park, Thoi Hoa Ward, Ho Chi Minh City, Vietnam</p>
+          <p class="map">
+            <i class="ico"></i>GREEN WHALE GLOBAL VIET NAM CO., LTD. <br />Factory
+            C_1B_C4_B & C_1B_C4_C, Lot C_1B_CN, My Phuoc 3 Industrial Park, Thoi Hoa Ward,
+            Ho Chi Minh City, Vietnam
+          </p>
           <div class="location--map">
-            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3914.9270000355136!2d106.64953687682507!3d11.11881475278132!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3174cbf1e4323149%3A0x2e0d6ec6374c122!2sGREEN%20WHALE%20GLOBAL%20VN!5e0!3m2!1sko!2skr!4v1758784019302!5m2!1sko!2skr" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+            <iframe
+              src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3914.9270000355136!2d106.64953687682507!3d11.11881475278132!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3174cbf1e4323149%3A0x2e0d6ec6374c122!2sGREEN%20WHALE%20GLOBAL%20VN!5e0!3m2!1sko!2skr!4v1758784019302!5m2!1sko!2skr"
+              width="100%"
+              height="100%"
+              style="border: 0"
+              allowfullscreen=""
+              loading="lazy"
+              referrerpolicy="no-referrer-when-downgrade"
+            ></iframe>
           </div>
         </div>
         <div class="location--wrap">
           <h4>미국 지사</h4>
-          <p class="map"><i class="ico"></i>6940 Beach BLVD Suite D-705, Buena Park, CA 90621</p>
+          <p class="map">
+            <i class="ico"></i>6940 Beach BLVD Suite D-705, Buena Park, CA 90621
+          </p>
           <div class="location--map">
-            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3313.141775200663!2d-118.00045382288198!3d33.860236927841896!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80dd2beae3bac651%3A0xff71b496867d91ce!2s6940%20Beach%20Blvd%20Suite%20D-705%2C%20Buena%20Park%2C%20CA%2090621%20%EB%AF%B8%EA%B5%AD!5e0!3m2!1sko!2skr!4v1758784090236!5m2!1sko!2skr" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+            <iframe
+              src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3313.141775200663!2d-118.00045382288198!3d33.860236927841896!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80dd2beae3bac651%3A0xff71b496867d91ce!2s6940%20Beach%20Blvd%20Suite%20D-705%2C%20Buena%20Park%2C%20CA%2090621%20%EB%AF%B8%EA%B5%AD!5e0!3m2!1sko!2skr!4v1758784090236!5m2!1sko!2skr"
+              width="100%"
+              height="100%"
+              style="border: 0"
+              allowfullscreen=""
+              loading="lazy"
+              referrerpolicy="no-referrer-when-downgrade"
+            ></iframe>
           </div>
         </div>
         <div class="location--wrap">
           <h4>폴란드 지사</h4>
-          <p class="map"><i class="ico"></i>Grzybowska 5A; 00-132 Warszawa </p>
+          <p class="map"><i class="ico"></i>Grzybowska 5A; 00-132 Warszawa</p>
           <div class="location--map">
-            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2443.361090190472!2d20.99811167761218!3d52.23682465715538!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x471ecc89aa175c97%3A0xd75cd4ed676d6904!2zR3J6eWJvd3NrYSA1QSwgMDAtMTMyIFdhcnN6YXdhLCDtj7TrnoDrk5w!5e0!3m2!1sko!2skr!4v1758784112008!5m2!1sko!2skr" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+            <iframe
+              src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2443.361090190472!2d20.99811167761218!3d52.23682465715538!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x471ecc89aa175c97%3A0xd75cd4ed676d6904!2zR3J6eWJvd3NrYSA1QSwgMDAtMTMyIFdhcnN6YXdhLCDtj7TrnoDrk5w!5e0!3m2!1sko!2skr!4v1758784112008!5m2!1sko!2skr"
+              width="100%"
+              height="100%"
+              style="border: 0"
+              allowfullscreen=""
+              loading="lazy"
+              referrerpolicy="no-referrer-when-downgrade"
+            ></iframe>
           </div>
         </div>
       </div>
@@ -52,20 +93,31 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue';
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("contact")
-const title = ref("Contact")
-const navigation = ref([
-  { name: "Contact",
-    link: "/contact/location" ,
-    gnbList: [
-      { name: "공지사항", link: "/contact/notice" },
-      { name: "FAQ", link: "/contact/faq" },
-      { name: "고객센터", link: "/contact/support" },
-      { name: "오시는길", link: "/contact/location" }
-    ]
-  },
-  { name: "오시는길", link: "/contact/location" }
-])
-</script>
+  const className = ref("contact");
+  const title = ref("Contact");
+  const navigation = ref([
+    {
+      name: "Contact",
+      link: "/contact/location",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "오시는길",
+      link: "/contact/location",
+      gnbList: [
+        { name: "공지사항", link: "/contact/notice" },
+        { name: "FAQ", link: "/contact/faq" },
+        { name: "고객센터", link: "/contact/support" },
+        { name: "오시는길", link: "/contact/location" },
+      ],
+    },
+  ]);
+</script>

+ 234 - 73
app/pages/contact/notice.vue

@@ -8,7 +8,7 @@
         </div>
         <div class="search--wrap">
           <USelect v-model="searchValue" :items="searchItems" />
-          <UInput v-model="searchKeyword" placeholder="검색어를 입력해주세요."/>
+          <UInput v-model="searchKeyword" placeholder="검색어를 입력해주세요." />
           <UButton class="search--btn"></UButton>
         </div>
         <div class="notice--wrap">
@@ -35,7 +35,7 @@
                 v-for="page in totalPages"
                 :key="page"
                 @click="goToPage(page)"
-                :class="{ 'active': currentPage === page }"
+                :class="{ active: currentPage === page }"
               >
                 {{ page }}
               </UButton>
@@ -52,81 +52,242 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue';
-const searchItems = ref(['제목'])
-const searchValue = ref('선택')
-const searchKeyword = ref('')
+  import TopVisual from "~/components/topVisual.vue";
+  const searchItems = ref(["제목"]);
+  const searchValue = ref("선택");
+  const searchKeyword = ref("");
 
-const className = ref("contact")
-const title = ref("Contact")
-const navigation = ref([
-  { name: "Contact",
-    link: "/contact/notice" ,
-    gnbList: [
-      { name: "공지사항", link: "/contact/notice" },
-      { name: "FAQ", link: "/contact/faq" },
-      { name: "고객센터", link: "/contact/support" },
-      { name: "오시는길", link: "/contact/location" }
-    ]
-  },
-  { name: "공지사항", link: "/contact/notice" }
-])
+  const className = ref("contact");
+  const title = ref("Contact");
+  const navigation = ref([
+    {
+      name: "Contact",
+      link: "/contact/notice",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "공지사항",
+      link: "/contact/notice",
+      gnbList: [
+        { name: "공지사항", link: "/contact/notice" },
+        { name: "FAQ", link: "/contact/faq" },
+        { name: "고객센터", link: "/contact/support" },
+        { name: "오시는길", link: "/contact/location" },
+      ],
+    },
+  ]);
 
-// 뉴스 데이터 배열 생성
-const newsData = ref([
-  { id: 1, title: "그린플라스틱연합, ESG친환경대전서 '자원순환 탄소중립 GPA 컨퍼런스' 개최", date: "2025.07.11", image: "/img/img--news.png", link: "/" },
-  { id: 2, title: "친환경 플라스틱 기술 개발 동향", date: "2025.07.10", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 3, title: "탄소중립 실현을 위한 플라스틱 재활용 기술", date: "2025.07.09", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 4, title: "바이오플라스틱 시장 전망과 기술 동향", date: "2025.07.08", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 5, title: "플라스틱 감축을 위한 정부 정책 변화", date: "2025.07.07", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 6, title: "순환경제와 플라스틱 재활용 산업", date: "2025.07.06", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 7, title: "해양 플라스틱 오염 해결을 위한 혁신 기술", date: "2025.07.05", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 8, title: "친환경 포장재 개발 현황", date: "2025.07.04", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 9, title: "플라스틱 대체재 소재 연구 동향", date: "2025.07.03", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 10, title: "ESG 경영과 플라스틱 감축 전략", date: "2025.07.02", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 11, title: "글로벌 플라스틱 규제 동향", date: "2025.07.01", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 12, title: "생분해성 플라스틱 상용화 전망", date: "2025.06.30", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 13, title: "플라스틱 없는 일주일 캠페인", date: "2025.06.29", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 14, title: "재활용 플라스틱 품질 향상 기술", date: "2025.06.28", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 15, title: "플라스틱 순환경제 구축 방안", date: "2025.06.27", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 16, title: "친환경 소재 개발 투자 확대", date: "2025.06.26", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 17, title: "마이크로플라스틱 저감 기술", date: "2025.06.25", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 18, title: "플라스틱 재활용률 제고 방안", date: "2025.06.24", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 19, title: "바이오매스 기반 플라스틱 개발", date: "2025.06.23", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 20, title: "환경친화적 플라스틱 산업 전망", date: "2025.06.22", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 21, title: "플라스틱 폐기물 감축 정책", date: "2025.06.21", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 22, title: "지속가능한 포장재 솔루션", date: "2025.06.20", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 23, title: "플라스틱 리사이클링 혁신 기술", date: "2025.06.19", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 24, title: "친환경 플라스틱 인증 시스템", date: "2025.06.18", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 25, title: "탄소 발자국 감축을 위한 플라스틱 대안", date: "2025.06.17", image: "/img/img--cycle--center.png", link: "/" }
-])
+  // 뉴스 데이터 배열 생성
+  const newsData = ref([
+    {
+      id: 1,
+      title: "그린플라스틱연합, ESG친환경대전서 '자원순환 탄소중립 GPA 컨퍼런스' 개최",
+      date: "2025.07.11",
+      image: "/img/img--news.png",
+      link: "/",
+    },
+    {
+      id: 2,
+      title: "친환경 플라스틱 기술 개발 동향",
+      date: "2025.07.10",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 3,
+      title: "탄소중립 실현을 위한 플라스틱 재활용 기술",
+      date: "2025.07.09",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 4,
+      title: "바이오플라스틱 시장 전망과 기술 동향",
+      date: "2025.07.08",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 5,
+      title: "플라스틱 감축을 위한 정부 정책 변화",
+      date: "2025.07.07",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 6,
+      title: "순환경제와 플라스틱 재활용 산업",
+      date: "2025.07.06",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 7,
+      title: "해양 플라스틱 오염 해결을 위한 혁신 기술",
+      date: "2025.07.05",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 8,
+      title: "친환경 포장재 개발 현황",
+      date: "2025.07.04",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 9,
+      title: "플라스틱 대체재 소재 연구 동향",
+      date: "2025.07.03",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 10,
+      title: "ESG 경영과 플라스틱 감축 전략",
+      date: "2025.07.02",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 11,
+      title: "글로벌 플라스틱 규제 동향",
+      date: "2025.07.01",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 12,
+      title: "생분해성 플라스틱 상용화 전망",
+      date: "2025.06.30",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 13,
+      title: "플라스틱 없는 일주일 캠페인",
+      date: "2025.06.29",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 14,
+      title: "재활용 플라스틱 품질 향상 기술",
+      date: "2025.06.28",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 15,
+      title: "플라스틱 순환경제 구축 방안",
+      date: "2025.06.27",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 16,
+      title: "친환경 소재 개발 투자 확대",
+      date: "2025.06.26",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 17,
+      title: "마이크로플라스틱 저감 기술",
+      date: "2025.06.25",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 18,
+      title: "플라스틱 재활용률 제고 방안",
+      date: "2025.06.24",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 19,
+      title: "바이오매스 기반 플라스틱 개발",
+      date: "2025.06.23",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 20,
+      title: "환경친화적 플라스틱 산업 전망",
+      date: "2025.06.22",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 21,
+      title: "플라스틱 폐기물 감축 정책",
+      date: "2025.06.21",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 22,
+      title: "지속가능한 포장재 솔루션",
+      date: "2025.06.20",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 23,
+      title: "플라스틱 리사이클링 혁신 기술",
+      date: "2025.06.19",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 24,
+      title: "친환경 플라스틱 인증 시스템",
+      date: "2025.06.18",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 25,
+      title: "탄소 발자국 감축을 위한 플라스틱 대안",
+      date: "2025.06.17",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+  ]);
 
-// 페이지네이션 로직
-const currentPage = ref(1)
-const itemsPerPage = 10
-const totalPages = computed(() => Math.ceil(newsData.value.length / itemsPerPage))
+  // 페이지네이션 로직
+  const currentPage = ref(1);
+  const itemsPerPage = 10;
+  const totalPages = computed(() => Math.ceil(newsData.value.length / itemsPerPage));
 
-const paginatedNews = computed(() => {
-  const start = (currentPage.value - 1) * itemsPerPage
-  const end = start + itemsPerPage
-  return newsData.value.slice(start, end)
-})
+  const paginatedNews = computed(() => {
+    const start = (currentPage.value - 1) * itemsPerPage;
+    const end = start + itemsPerPage;
+    return newsData.value.slice(start, end);
+  });
 
-const goToPage = (page) => {
-  if (page >= 1 && page <= totalPages.value) {
-    currentPage.value = page
-  }
-}
+  const goToPage = (page) => {
+    if (page >= 1 && page <= totalPages.value) {
+      currentPage.value = page;
+    }
+  };
 
-const nextPage = () => {
-  if (currentPage.value < totalPages.value) {
-    currentPage.value++
-  }
-}
+  const nextPage = () => {
+    if (currentPage.value < totalPages.value) {
+      currentPage.value++;
+    }
+  };
 
-const prevPage = () => {
-  if (currentPage.value > 1) {
-    currentPage.value--
-  }
-}
-</script>
+  const prevPage = () => {
+    if (currentPage.value > 1) {
+      currentPage.value--;
+    }
+  };
+</script>

+ 310 - 291
app/pages/contact/support.vue

@@ -7,58 +7,38 @@
         <div class="form--contents--wrap">
           <div class="contact-form">
             <div class="form--contents half--cont">
-              <h3>작성자 (성명) <span class="required">*</span></h3>              
-              <UInput 
-                v-model="formData.name" 
-                placeholder="성명을 입력해주세요" 
-              />              
+              <h3>작성자 (성명) <span class="required">*</span></h3>
+              <UInput v-model="formData.name" placeholder="성명을 입력해주세요" />
             </div>
             <div class="form--contents half--cont">
-              <h3>직책</h3>              
-              <UInput 
-                v-model="formData.etc1" 
-                placeholder="직책을 입력해주세요" 
-              />              
+              <h3>직책</h3>
+              <UInput v-model="formData.etc1" placeholder="직책을 입력해주세요" />
             </div>
             <div class="form--contents half--cont">
-              <h3>회사명</h3>              
-              <UInput 
-                v-model="formData.etc2" 
-                placeholder="회사명을 입력해주세요" 
-              />              
+              <h3>회사명</h3>
+              <UInput v-model="formData.etc2" placeholder="회사명을 입력해주세요" />
             </div>
             <div class="form--contents half--cont">
               <h3>연락처 <span class="required">*</span></h3>
               <div class="tel-group">
-                <USelect 
-                  v-model="formData.tel_1"
-                  :options="phoneOptions"
-                />
+                <USelect v-model="formData.tel_1" :options="phoneOptions" />
                 <span>-</span>
-                <UInput 
-                  v-model="formData.tel_2" 
-                  maxlength="4" 
-                  pattern="[0-9]{3,4}" 
-                />
+                <UInput v-model="formData.tel_2" maxlength="4" pattern="[0-9]{3,4}" />
                 <span>-</span>
-                <UInput 
-                  v-model="formData.tel_3" 
-                  maxlength="4" 
-                  pattern="[0-9]{4}" 
-                />
+                <UInput v-model="formData.tel_3" maxlength="4" pattern="[0-9]{4}" />
               </div>
             </div>
             <div class="form--contents half--cont">
-              <h3>이메일 <span class="required">*</span></h3>              
-              <UInput 
-                type="email" 
-                v-model="formData.email" 
-                placeholder="이메일을 입력해주세요" 
-              />              
+              <h3>이메일 <span class="required">*</span></h3>
+              <UInput
+                type="email"
+                v-model="formData.email"
+                placeholder="이메일을 입력해주세요"
+              />
             </div>
             <div class="form--contents half--cont">
               <h3>문의항목 <span class="required">*</span></h3>
-              <URadioGroup 
+              <URadioGroup
                 v-model="formData.category"
                 :items="categoryOptions"
                 value-key="value"
@@ -67,25 +47,22 @@
               />
             </div>
             <div class="form--contents">
-              <h3>제목 <span class="required">*</span></h3>              
-              <UInput 
-                v-model="formData.title" 
-                placeholder="제목을 입력해주세요" 
-              />              
+              <h3>제목 <span class="required">*</span></h3>
+              <UInput v-model="formData.title" placeholder="제목을 입력해주세요" />
             </div>
             <div class="form--contents">
               <h3>내용 <span class="required">*</span></h3>
               <div>
                 <client-only>
-                  <SummernoteEditor 
+                  <SummernoteEditor
                     v-model="formData.contents"
                     :height="editorHeight"
                     :placeholder="editorPlaceholder"
                   />
                   <template #fallback>
-                    <textarea 
-                      v-model="formData.contents" 
-                      rows="10" 
+                    <textarea
+                      v-model="formData.contents"
+                      rows="10"
                       placeholder="내용 입력"
                     ></textarea>
                   </template>
@@ -96,75 +73,115 @@
               <h3 class="privacy--title">개인 정보 수집 및 이용 동의</h3>
               <div class="privacy-box">
                 <div class="privacy-content">
-                  그린웨일 글로벌 주식회사 ('www.greenwhaleglobal.com'이하 '그린웨일 글로벌')은(는) 「개인정보 보호법」 제30조에 따라 정부주체의 개인정보를 보호하고 이와 관련한 고충을 신속하고 원활하게 처리할 수 있도록 하기 위하여 다음과 같이 개인정보 처리방침을 수립·공개합니다.<br/><br/>
-                  
-                  <strong>● 이 개인정보처리방침은 2022년 11월 01일부터 적용됩니다.</strong><br/><br/>
-                  
-                  <strong>제1조(개인정보의 처리 목적)</strong><br/>
-                  그린웨일 글로벌은 다음의 목적을 위하여 개인정보를 처리합니다. 처리하고 있는 개인정보는 다음의 목적 이외의 용도로는 이용되지 않으며 이용 목적이 변경되는 경우에는 「개인정보 보호법」 제18조에 따라 별도의 동의를 받는 등 필요한 조치를 이행할 예정입니다.<br/>
-                  ▶ 재화 또는 서비스 제공: 맞춤 서비스 제공을 목적으로 개인정보를 처리합니다.<br/><br/>
-                  
-                  <strong>제2조(개인정보의 처리 및 보유 기간)</strong><br/>
-                  ① 그린웨일 글로벌은 법령에 따른 개인정보 보유·이용 기간 또는 정보 주체로부터 개인정보를 수집할 때 동의받은 개인정보 보유·이용 기간 내에서 개인정보를 처리·보유합니다.<br/>
-                  ② 각각의 개인정보 처리 및 보유 기간은 다음과 같습니다.<br/>
-                  • 재화 또는 서비스 제공과 관련한 개인정보는 수집.이용에 관한 동의일로부터 3년까지 위 이용목적을 위하여 보유.이용됩니다.<br/>
-                  • 보유근거 : 지속적인 피드백 관리를 위해<br/>
-                  • 관련법령 :<br/>
-                  1) 신용정보의 수집/처리 및 이용 등에 관한 기록 : 3년<br/>
-                  2) 소비자의 불만 또는 분쟁처리에 관한 기록 : 3년<br/>
-                  3) 대금결제 및 재화 등의 공급에 관한 기록 : 5년<br/>
-                  4) 계약 또는 청약철회 등에 관한 기록 : 5년<br/><br/>
-                  
-                  <strong>제3조(정보주체와 법정대리인의 권리·의무 및 그 행사방법)</strong><br/>
-                  정보 주체는 그린웨일 글로벌에 대해 언제든지 개인정보 열람·정정·삭제·처리정지 요구 등의 권리를 행사할 수 있습니다.<br/>
-                  ① 제1항에 따른 권리 행사는 그린웨일 글로벌에 대해 「개인정보 보호법」 시행령 제41조 제1항에 따라, 서면 또는 전자우편, 모사전송(FAX) 등을 통하여 하실 수 있으며 그린웨일 글로벌은 이에 대해 지체 없이 조치하겠습니다.<br/>
-                  ② 제1항에 따른 권리 행사는 정보 주체의 법정대리인이나 위임을 받은 자 등 대리인을 통하여 하실 수 있습니다.<br/>
-                  ③ 개인정보 열람 및 처리정지 요구는 「개인정보 보호법」 제35조 제4항, 제37조 제2항에 의하여 정보 주체의 권리가 제한될 수 있습니다.<br/>
-                  ④ 개인정보의 정정 및 삭제 요구는 다른 법령에서 그 개인정보가 수집 대상으로 명시되어 있는 경우에는 그 삭제를 요구할 수 없습니다.<br/>
-                  ⑤ 그린웨일 글로벌은 정보 주체 권리에 따른 열람의 요구, 정정·삭제의 요구, 처리정지의 요구 시 열람 등 요구를 한 자가 본인이거나 정당한 대리인인지를 확인합니다.<br/><br/>
-                  
-                  <strong>제4조(처리하는 개인정보의 항목 작성)</strong><br/>
-                  그린웨일 글로벌은 다음의 개인정보 항목을 처리하고 있습니다.<br/>
-                  • 재화 또는 서비스 제공<br/>
-                  • 필수항목 : 이메일, 휴대 전화번호, 이름, 회사 전화번호, 회사명<br/>
-                  • 선택항목 : 직책, 부서<br/><br/>
-                  
-                  <strong>제5조(개인정보의 파기)</strong><br/>
-                  ① 그린웨일 글로벌은 개인정보 보유기간의 경과, 처리목적 달성 등 개인정보가 불필요하게 되었을 때는 지체없이 해당 개인정보를 파기합니다.<br/>
-                  ② 정보 주체로부터 동의받은 개인정보 보유기간이 경과하거나 처리목적이 달성되었음에도 불구하고 다른 법령에 따라 개인정보를 계속 보존하여야 하는 경우에는, 해당 개인정보를 별도의 데이터베이스(DB)로 옮기거나 보관장소를 달리하여 보존합니다.<br/>
-                  ③ 개인정보 파기의 절차 및 방법은 다음과 같습니다.<br/>
-                  • 파기 절차: 그린웨일 글로벌은 파기 사유가 발생한 개인정보를 선정하고, 그린웨일 글로벌의 개인정보 보호 책임자의 승인을 받아 개인정보를 파기합니다.<br/>
-                  • 파기 방법: 전자적 파일 형태의 정보는 기록을 재생할 수 없는 기술적 방법을 사용합니다<br/><br/>
-                  
-                  <strong>제6조(개인정보의 안전성 확보 조치)</strong><br/>
-                  그린웨일글로벌은 개인정보의 안전성 확보를 위해 다음과 같은 조치를 취하고 있습니다.<br/>
-                  ① 정기적인 자체 감사 실시<br/>
-                  ② 개인정보 취급 직원의 최소화 및 교육<br/>
-                  ③ 내부관리계획의 수립 및 시행<br/>
-                  ④ 개인정보에 대한 접근 제한<br/>
-                  ⑤ 비인가자에 대한 출입 통제<br/><br/>
-                  
-                  <strong>제7조(개인정보 자동 수집 장치의 설치•운영 및 거부에 관한 사항)</strong><br/>
-                  ① 그린웨일글로벌는 이용자에게 개별적인 맞춤서비스를 제공하기 위해 이용정보를 저장하고 수시로 불러오는 '쿠키(cookie)'를 사용합니다.<br/>
-                  ② 쿠키는 웹사이트를 운영하는데 이용되는 서버(http)가 이용자의 컴퓨터 브라우저에게 보내는 소량의 정보이며 이용자들의 PC 컴퓨터내의 하드디스크에 저장되기도 합니다.<br/><br/>
-                  
-                  <strong>제8조(개인정보 보호책임자 등)</strong><br/>
-                  ① 그린웨일 글로벌은 개인정보 처리에 관한 업무를 총괄해서 책임지고, 개인정보 처리와 관련한 정보주체의 불만 처리 및 피해구제 등을 위하여 아래와 같이 개인정보 보호책임자를 지정하고 있습니다.<br/>
-                  • 담당자 : 경영지원팀 이안나 대리<br/>
-                  • 전화번호 : 02-3447-8802<br/>
-                  • 이메일 : green@greenwhaleglobal.com<br/><br/>
-                  
-                  <strong>제9조(권익침해 구제방법)</strong><br/>
-                  정보 주체는 개인정보침해로 인한 구제를 받기 위하여 개인정보분쟁조정위원회, 한국인터넷진흥원 개인정보침해신고센터 등에 분쟁해결이나 상담 등을 신청할 수 있습니다.<br/>
-                  1. 개인정보분쟁조정위원회 : (국번없이) 1833-6972 (www.kopico.go.kr)<br/>
-                  2. 개인정보침해신고센터 : (국번없이) 118 (privacy.kisa.or.kr)<br/>
-                  3. 대검찰청 : (국번없이) 1301 (www.spo.go.kr)<br/>
-                  4. 경찰청 : (국번없이) 182 (cyberbureau.police.go.kr)<br/>
+                  그린웨일 글로벌 주식회사 ('www.greenwhaleglobal.com'이하 '그린웨일
+                  글로벌')은(는) 「개인정보 보호법」 제30조에 따라 정부주체의 개인정보를
+                  보호하고 이와 관련한 고충을 신속하고 원활하게 처리할 수 있도록 하기
+                  위하여 다음과 같이 개인정보 처리방침을 수립·공개합니다.<br /><br />
+
+                  <strong>● 이 개인정보처리방침은 2022년 11월 01일부터 적용됩니다.</strong
+                  ><br /><br />
+
+                  <strong>제1조(개인정보의 처리 목적)</strong><br />
+                  그린웨일 글로벌은 다음의 목적을 위하여 개인정보를 처리합니다. 처리하고
+                  있는 개인정보는 다음의 목적 이외의 용도로는 이용되지 않으며 이용 목적이
+                  변경되는 경우에는 「개인정보 보호법」 제18조에 따라 별도의 동의를 받는
+                  등 필요한 조치를 이행할 예정입니다.<br />
+                  ▶ 재화 또는 서비스 제공: 맞춤 서비스 제공을 목적으로 개인정보를
+                  처리합니다.<br /><br />
+
+                  <strong>제2조(개인정보의 처리 및 보유 기간)</strong><br />
+                  ① 그린웨일 글로벌은 법령에 따른 개인정보 보유·이용 기간 또는 정보
+                  주체로부터 개인정보를 수집할 때 동의받은 개인정보 보유·이용 기간 내에서
+                  개인정보를 처리·보유합니다.<br />
+                  ② 각각의 개인정보 처리 및 보유 기간은 다음과 같습니다.<br />
+                  • 재화 또는 서비스 제공과 관련한 개인정보는 수집.이용에 관한
+                  동의일로부터 3년까지 위 이용목적을 위하여 보유.이용됩니다.<br />
+                  • 보유근거 : 지속적인 피드백 관리를 위해<br />
+                  • 관련법령 :<br />
+                  1) 신용정보의 수집/처리 및 이용 등에 관한 기록 : 3년<br />
+                  2) 소비자의 불만 또는 분쟁처리에 관한 기록 : 3년<br />
+                  3) 대금결제 및 재화 등의 공급에 관한 기록 : 5년<br />
+                  4) 계약 또는 청약철회 등에 관한 기록 : 5년<br /><br />
+
+                  <strong>제3조(정보주체와 법정대리인의 권리·의무 및 그 행사방법)</strong
+                  ><br />
+                  정보 주체는 그린웨일 글로벌에 대해 언제든지 개인정보
+                  열람·정정·삭제·처리정지 요구 등의 권리를 행사할 수 있습니다.<br />
+                  ① 제1항에 따른 권리 행사는 그린웨일 글로벌에 대해 「개인정보 보호법」
+                  시행령 제41조 제1항에 따라, 서면 또는 전자우편, 모사전송(FAX) 등을
+                  통하여 하실 수 있으며 그린웨일 글로벌은 이에 대해 지체 없이
+                  조치하겠습니다.<br />
+                  ② 제1항에 따른 권리 행사는 정보 주체의 법정대리인이나 위임을 받은 자 등
+                  대리인을 통하여 하실 수 있습니다.<br />
+                  ③ 개인정보 열람 및 처리정지 요구는 「개인정보 보호법」 제35조 제4항,
+                  제37조 제2항에 의하여 정보 주체의 권리가 제한될 수 있습니다.<br />
+                  ④ 개인정보의 정정 및 삭제 요구는 다른 법령에서 그 개인정보가 수집
+                  대상으로 명시되어 있는 경우에는 그 삭제를 요구할 수 없습니다.<br />
+                  ⑤ 그린웨일 글로벌은 정보 주체 권리에 따른 열람의 요구, 정정·삭제의 요구,
+                  처리정지의 요구 시 열람 등 요구를 한 자가 본인이거나 정당한 대리인인지를
+                  확인합니다.<br /><br />
+
+                  <strong>제4조(처리하는 개인정보의 항목 작성)</strong><br />
+                  그린웨일 글로벌은 다음의 개인정보 항목을 처리하고 있습니다.<br />
+                  • 재화 또는 서비스 제공<br />
+                  • 필수항목 : 이메일, 휴대 전화번호, 이름, 회사 전화번호, 회사명<br />
+                  • 선택항목 : 직책, 부서<br /><br />
+
+                  <strong>제5조(개인정보의 파기)</strong><br />
+                  ① 그린웨일 글로벌은 개인정보 보유기간의 경과, 처리목적 달성 등
+                  개인정보가 불필요하게 되었을 때는 지체없이 해당 개인정보를
+                  파기합니다.<br />
+                  ② 정보 주체로부터 동의받은 개인정보 보유기간이 경과하거나 처리목적이
+                  달성되었음에도 불구하고 다른 법령에 따라 개인정보를 계속 보존하여야 하는
+                  경우에는, 해당 개인정보를 별도의 데이터베이스(DB)로 옮기거나 보관장소를
+                  달리하여 보존합니다.<br />
+                  ③ 개인정보 파기의 절차 및 방법은 다음과 같습니다.<br />
+                  • 파기 절차: 그린웨일 글로벌은 파기 사유가 발생한 개인정보를 선정하고,
+                  그린웨일 글로벌의 개인정보 보호 책임자의 승인을 받아 개인정보를
+                  파기합니다.<br />
+                  • 파기 방법: 전자적 파일 형태의 정보는 기록을 재생할 수 없는 기술적
+                  방법을 사용합니다<br /><br />
+
+                  <strong>제6조(개인정보의 안전성 확보 조치)</strong><br />
+                  그린웨일글로벌은 개인정보의 안전성 확보를 위해 다음과 같은 조치를 취하고
+                  있습니다.<br />
+                  ① 정기적인 자체 감사 실시<br />
+                  ② 개인정보 취급 직원의 최소화 및 교육<br />
+                  ③ 내부관리계획의 수립 및 시행<br />
+                  ④ 개인정보에 대한 접근 제한<br />
+                  ⑤ 비인가자에 대한 출입 통제<br /><br />
+
+                  <strong
+                    >제7조(개인정보 자동 수집 장치의 설치•운영 및 거부에 관한
+                    사항)</strong
+                  ><br />
+                  ① 그린웨일글로벌는 이용자에게 개별적인 맞춤서비스를 제공하기 위해
+                  이용정보를 저장하고 수시로 불러오는 '쿠키(cookie)'를 사용합니다.<br />
+                  ② 쿠키는 웹사이트를 운영하는데 이용되는 서버(http)가 이용자의 컴퓨터
+                  브라우저에게 보내는 소량의 정보이며 이용자들의 PC 컴퓨터내의
+                  하드디스크에 저장되기도 합니다.<br /><br />
+
+                  <strong>제8조(개인정보 보호책임자 등)</strong><br />
+                  ① 그린웨일 글로벌은 개인정보 처리에 관한 업무를 총괄해서 책임지고,
+                  개인정보 처리와 관련한 정보주체의 불만 처리 및 피해구제 등을 위하여
+                  아래와 같이 개인정보 보호책임자를 지정하고 있습니다.<br />
+                  • 담당자 : 경영지원팀 이안나 대리<br />
+                  • 전화번호 : 02-3447-8802<br />
+                  • 이메일 : green@greenwhaleglobal.com<br /><br />
+
+                  <strong>제9조(권익침해 구제방법)</strong><br />
+                  정보 주체는 개인정보침해로 인한 구제를 받기 위하여
+                  개인정보분쟁조정위원회, 한국인터넷진흥원 개인정보침해신고센터 등에
+                  분쟁해결이나 상담 등을 신청할 수 있습니다.<br />
+                  1. 개인정보분쟁조정위원회 : (국번없이) 1833-6972 (www.kopico.go.kr)<br />
+                  2. 개인정보침해신고센터 : (국번없이) 118 (privacy.kisa.or.kr)<br />
+                  3. 대검찰청 : (국번없이) 1301 (www.spo.go.kr)<br />
+                  4. 경찰청 : (국번없이) 182 (cyberbureau.police.go.kr)<br />
                 </div>
-                
+
                 <div class="agree-check">
                   <h4>개인정보 수집 및 이용에 동의합니까?</h4>
-                  <URadioGroup 
+                  <URadioGroup
                     v-model="formData.agree"
                     :items="agreeOptions"
                     value-key="value"
@@ -174,210 +191,212 @@
                 </div>
               </div>
             </div>
-            
+
             <div class="btn--wrap">
-              <UButton 
-                :loading="isSubmitting"
-                @click="submitForm"
-                size="lg"                
-              >
-                {{ isSubmitting ? '전송중...' : '보내기' }}
+              <UButton :loading="isSubmitting" @click="submitForm" size="lg">
+                {{ isSubmitting ? "전송중..." : "보내기" }}
               </UButton>
             </div>
-            
           </div>
         </div>
-
-        
       </div>
     </section>
   </main>
 </template>
 
 <script setup>
-import { ref, computed, onMounted } from 'vue'
-import TopVisual from '~/components/topVisual.vue'
-import SummernoteEditor from '~/components/SummernoteEditor.vue'
+  import { ref, computed, onMounted } from "vue";
+  import TopVisual from "~/components/topVisual.vue";
+  import SummernoteEditor from "~/components/SummernoteEditor.vue";
 
-// 전화번호 옵션
-const phoneOptions = [
-  { value: '010', label: '010' },
-  { value: '011', label: '011' },
-  { value: '016', label: '016' },
-  { value: '017', label: '017' },
-  { value: '018', label: '018' },
-  { value: '019', label: '019' },
-  { value: '02', label: '02' },
-  { value: '031', label: '031' },
-  { value: '032', label: '032' },
-  { value: '033', label: '033' }
-]
+  // 전화번호 옵션
+  const phoneOptions = [
+    { value: "010", label: "010" },
+    { value: "011", label: "011" },
+    { value: "016", label: "016" },
+    { value: "017", label: "017" },
+    { value: "018", label: "018" },
+    { value: "019", label: "019" },
+    { value: "02", label: "02" },
+    { value: "031", label: "031" },
+    { value: "032", label: "032" },
+    { value: "033", label: "033" },
+  ];
 
-// 문의항목 옵션
-const categoryOptions = computed(() => [
-  { 
-    value: '원료', 
-    label: '원료',
-    ui: formData.value.category === '원료' ? { label: 'actv' } : {}
-  },
-  { 
-    value: '제품', 
-    label: '제품',
-    ui: formData.value.category === '제품' ? { label: 'actv' } : {}
-  },
-  { 
-    value: '기술', 
-    label: '기술',
-    ui: formData.value.category === '기술' ? { label: 'actv' } : {}
-  },
-  { 
-    value: '기타', 
-    label: '기타',
-    ui: formData.value.category === '기타' ? { label: 'actv' } : {}
-  }
-])
+  // 문의항목 옵션
+  const categoryOptions = computed(() => [
+    {
+      value: "원료",
+      label: "원료",
+      ui: formData.value.category === "원료" ? { label: "actv" } : {},
+    },
+    {
+      value: "제품",
+      label: "제품",
+      ui: formData.value.category === "제품" ? { label: "actv" } : {},
+    },
+    {
+      value: "기술",
+      label: "기술",
+      ui: formData.value.category === "기술" ? { label: "actv" } : {},
+    },
+    {
+      value: "기타",
+      label: "기타",
+      ui: formData.value.category === "기타" ? { label: "actv" } : {},
+    },
+  ]);
 
-// 동의 옵션
-const agreeOptions = [
-  { value: 'Y', label: '동의합니다.' },
-  { value: 'N', label: '동의하지 않습니다.' }
-]
+  // 동의 옵션
+  const agreeOptions = [
+    { value: "Y", label: "동의합니다." },
+    { value: "N", label: "동의하지 않습니다." },
+  ];
 
-// 반응형 데이터
-const isSubmitting = ref(false)
-const formData = ref({
-  name: '',
-  etc1: '', // 직책
-  etc2: '', // 회사명
-  tel_1: '010',
-  tel_2: '',
-  tel_3: '',
-  email: '',
-  category: '원료',
-  title: '',
-  contents: '',
-  agree: 'Y'
-})
+  // 반응형 데이터
+  const isSubmitting = ref(false);
+  const formData = ref({
+    name: "",
+    etc1: "", // 직책
+    etc2: "", // 회사명
+    tel_1: "010",
+    tel_2: "",
+    tel_3: "",
+    email: "",
+    category: "원료",
+    title: "",
+    contents: "",
+    agree: "Y",
+  });
 
-// Summernote 에디터 설정
-const editorHeight = 400
-const editorPlaceholder = '내용 입력'
+  // Summernote 에디터 설정
+  const editorHeight = 400;
+  const editorPlaceholder = "내용 입력";
 
-// 페이지 설정
-const className = "contact"
-const title = "Contact"
-const navigation = ref([
-  { name: "Contact",
-    link: "/contact/support" ,
-    gnbList: [
-      { name: "공지사항", link: "/contact/notice" },
-      { name: "FAQ", link: "/contact/faq" },
-      { name: "고객센터", link: "/contact/support" },
-      { name: "오시는길", link: "/contact/location" }
-    ]
-  },
-  { name: "고객센터", link: "/contact/support" }
-])
+  // 페이지 설정
+  const className = "contact";
+  const title = "Contact";
+  const navigation = ref([
+    {
+      name: "Contact",
+      link: "/contact/support",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "고객센터",
+      link: "/contact/support",
+      gnbList: [
+        { name: "공지사항", link: "/contact/notice" },
+        { name: "FAQ", link: "/contact/faq" },
+        { name: "고객센터", link: "/contact/support" },
+        { name: "오시는길", link: "/contact/location" },
+      ],
+    },
+  ]);
 
-// 폼 유효성 검증
-const validateForm = () => {
-  if (!formData.value.name) {
-    alert('성명을 입력해주세요.')
-    return false
-  }
-  if (!formData.value.tel_2 || !formData.value.tel_3) {
-    alert('연락처를 입력해주세요.')
-    return false
-  }
-  if (!formData.value.email) {
-    alert('이메일을 입력해주세요.')
-    return false
-  }
-  if (!formData.value.category) {
-    alert('문의항목을 선택해주세요.')
-    return false
-  }
-  if (!formData.value.title) {
-    alert('제목을 입력해주세요.')
-    return false
-  }
-  if (!formData.value.contents || formData.value.contents === '<p><br></p>' || formData.value.contents === '') {
-    alert('내용을 입력해주세요.')
-    return false
-  }
-  if (formData.value.agree !== 'Y') {
-    alert('개인정보 수집 및 이용에 동의해주세요.')
-    return false
-  }
-  return true
-}
-
-// 폼 제출
-const submitForm = async () => {
-  if (!validateForm()) return
-
-  isSubmitting.value = true
-
-  try {
-    const submitData = {
-      act: 'ins',
-      boardId: 'contact',
-      name: formData.value.name,
-      etc1: formData.value.etc1,
-      etc2: formData.value.etc2,
-      tel_1: formData.value.tel_1,
-      tel_2: formData.value.tel_2,
-      tel_3: formData.value.tel_3,
-      email: formData.value.email,
-      category: formData.value.category,
-      title: formData.value.title,
-      contents: formData.value.contents
+  // 폼 유효성 검증
+  const validateForm = () => {
+    if (!formData.value.name) {
+      alert("성명을 입력해주세요.");
+      return false;
     }
-
-    const response = await $postForm('/board_proc', submitData)
-
-    if (response && response.success) {
-      alert('문의가 정상적으로 접수되었습니다.')
-      resetForm()
-    } else {
-      console.error('API 응답 오류:', response)
-      alert(`문의 접수 중 오류가 발생했습니다. 응답: ${JSON.stringify(response)}`)
+    if (!formData.value.tel_2 || !formData.value.tel_3) {
+      alert("연락처를 입력해주세요.");
+      return false;
+    }
+    if (!formData.value.email) {
+      alert("이메일을 입력해주세요.");
+      return false;
+    }
+    if (!formData.value.category) {
+      alert("문의항목을 선택해주세요.");
+      return false;
     }
-  } catch (error) {
-    if (error.response) {
-      alert(`API 호출 오류: ${error.response.status} - ${error.response.statusText}`)
-    } else if (error.request) {
-      alert('서버에 연결할 수 없습니다. 네트워크 연결을 확인해주세요.')
-    } else {
-      alert(`요청 설정 오류: ${error.message}`)
+    if (!formData.value.title) {
+      alert("제목을 입력해주세요.");
+      return false;
     }
-  } finally {
-    isSubmitting.value = false
-  }
-}
+    if (
+      !formData.value.contents ||
+      formData.value.contents === "<p><br></p>" ||
+      formData.value.contents === ""
+    ) {
+      alert("내용을 입력해주세요.");
+      return false;
+    }
+    if (formData.value.agree !== "Y") {
+      alert("개인정보 수집 및 이용에 동의해주세요.");
+      return false;
+    }
+    return true;
+  };
 
-// 폼 초기화
-const resetForm = () => {
-  formData.value = {
-    name: '',
-    etc1: '',
-    etc2: '',
-    tel_1: '010',
-    tel_2: '',
-    tel_3: '',
-    email: '',
-    category: '원료',
-    title: '',
-    contents: '',
-    agree: 'Y'
-  }
-}
+  // 폼 제출
+  const submitForm = async () => {
+    if (!validateForm()) return;
 
+    isSubmitting.value = true;
 
-onMounted(() => {
-  
-})
+    try {
+      const submitData = {
+        act: "ins",
+        boardId: "contact",
+        name: formData.value.name,
+        etc1: formData.value.etc1,
+        etc2: formData.value.etc2,
+        tel_1: formData.value.tel_1,
+        tel_2: formData.value.tel_2,
+        tel_3: formData.value.tel_3,
+        email: formData.value.email,
+        category: formData.value.category,
+        title: formData.value.title,
+        contents: formData.value.contents,
+      };
 
+      const response = await $postForm("/board_proc", submitData);
 
-</script>
+      if (response && response.success) {
+        alert("문의가 정상적으로 접수되었습니다.");
+        resetForm();
+      } else {
+        console.error("API 응답 오류:", response);
+        alert(`문의 접수 중 오류가 발생했습니다. 응답: ${JSON.stringify(response)}`);
+      }
+    } catch (error) {
+      if (error.response) {
+        alert(`API 호출 오류: ${error.response.status} - ${error.response.statusText}`);
+      } else if (error.request) {
+        alert("서버에 연결할 수 없습니다. 네트워크 연결을 확인해주세요.");
+      } else {
+        alert(`요청 설정 오류: ${error.message}`);
+      }
+    } finally {
+      isSubmitting.value = false;
+    }
+  };
+
+  // 폼 초기화
+  const resetForm = () => {
+    formData.value = {
+      name: "",
+      etc1: "",
+      etc2: "",
+      tel_1: "010",
+      tel_2: "",
+      tel_3: "",
+      email: "",
+      category: "원료",
+      title: "",
+      contents: "",
+      agree: "Y",
+    };
+  };
 
+  onMounted(() => {});
+</script>

+ 233 - 70
app/pages/media/news.vue

@@ -4,8 +4,10 @@
     <section class="news--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">친환경 플라스틱과 관련한 <br />
-            <strong>새로운 소식들을 전해드립니다.</strong></h2>
+          <h2 class="title">
+            친환경 플라스틱과 관련한 <br />
+            <strong>새로운 소식들을 전해드립니다.</strong>
+          </h2>
         </div>
         <div class="news--wrap">
           <div class="news--list">
@@ -20,7 +22,7 @@
                 <span>{{ news.date }}</span>
               </div>
               <div class="news--thumb--wrap">
-                <img :src="news.image" alt="">
+                <img :src="news.image" alt="" />
               </div>
             </NuxtLink>
           </div>
@@ -35,7 +37,7 @@
                 v-for="page in totalPages"
                 :key="page"
                 @click="goToPage(page)"
-                :class="{ 'active': currentPage === page }"
+                :class="{ active: currentPage === page }"
               >
                 {{ page }}
               </UButton>
@@ -52,76 +54,237 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("media")
-const title = ref("Media")
-const navigation = ref([
-  { name: "Media",
-    link: "/media/news" ,
-    gnbList : [
-      { name: "환경뉴스", link: "/media/news" },
-      { name: "보도자료", link: "/media/press" },
-    ]
-  },
-  { name: "환경뉴스", link: "/media/news" }
-])
+  const className = ref("media");
+  const title = ref("Media");
+  const navigation = ref([
+    {
+      name: "Media",
+      link: "/media/news",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "환경뉴스",
+      link: "/media/news",
+      gnbList: [
+        { name: "환경뉴스", link: "/media/news" },
+        { name: "보도자료", link: "/media/press" },
+      ],
+    },
+  ]);
 
-// 뉴스 데이터 배열 생성
-const newsData = ref([
-  { id: 1, title: "그린플라스틱연합, ESG친환경대전서 '자원순환 탄소중립 GPA 컨퍼런스' 개최", date: "2025.07.11", image: "/img/img--news.png", link: "/" },
-  { id: 2, title: "친환경 플라스틱 기술 개발 동향", date: "2025.07.10", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 3, title: "탄소중립 실현을 위한 플라스틱 재활용 기술", date: "2025.07.09", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 4, title: "바이오플라스틱 시장 전망과 기술 동향", date: "2025.07.08", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 5, title: "플라스틱 감축을 위한 정부 정책 변화", date: "2025.07.07", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 6, title: "순환경제와 플라스틱 재활용 산업", date: "2025.07.06", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 7, title: "해양 플라스틱 오염 해결을 위한 혁신 기술", date: "2025.07.05", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 8, title: "친환경 포장재 개발 현황", date: "2025.07.04", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 9, title: "플라스틱 대체재 소재 연구 동향", date: "2025.07.03", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 10, title: "ESG 경영과 플라스틱 감축 전략", date: "2025.07.02", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 11, title: "글로벌 플라스틱 규제 동향", date: "2025.07.01", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 12, title: "생분해성 플라스틱 상용화 전망", date: "2025.06.30", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 13, title: "플라스틱 없는 일주일 캠페인", date: "2025.06.29", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 14, title: "재활용 플라스틱 품질 향상 기술", date: "2025.06.28", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 15, title: "플라스틱 순환경제 구축 방안", date: "2025.06.27", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 16, title: "친환경 소재 개발 투자 확대", date: "2025.06.26", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 17, title: "마이크로플라스틱 저감 기술", date: "2025.06.25", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 18, title: "플라스틱 재활용률 제고 방안", date: "2025.06.24", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 19, title: "바이오매스 기반 플라스틱 개발", date: "2025.06.23", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 20, title: "환경친화적 플라스틱 산업 전망", date: "2025.06.22", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 21, title: "플라스틱 폐기물 감축 정책", date: "2025.06.21", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 22, title: "지속가능한 포장재 솔루션", date: "2025.06.20", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 23, title: "플라스틱 리사이클링 혁신 기술", date: "2025.06.19", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 24, title: "친환경 플라스틱 인증 시스템", date: "2025.06.18", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 25, title: "탄소 발자국 감축을 위한 플라스틱 대안", date: "2025.06.17", image: "/img/img--cycle--center.png", link: "/" }
-])
+  // 뉴스 데이터 배열 생성
+  const newsData = ref([
+    {
+      id: 1,
+      title: "그린플라스틱연합, ESG친환경대전서 '자원순환 탄소중립 GPA 컨퍼런스' 개최",
+      date: "2025.07.11",
+      image: "/img/img--news.png",
+      link: "/",
+    },
+    {
+      id: 2,
+      title: "친환경 플라스틱 기술 개발 동향",
+      date: "2025.07.10",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 3,
+      title: "탄소중립 실현을 위한 플라스틱 재활용 기술",
+      date: "2025.07.09",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 4,
+      title: "바이오플라스틱 시장 전망과 기술 동향",
+      date: "2025.07.08",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 5,
+      title: "플라스틱 감축을 위한 정부 정책 변화",
+      date: "2025.07.07",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 6,
+      title: "순환경제와 플라스틱 재활용 산업",
+      date: "2025.07.06",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 7,
+      title: "해양 플라스틱 오염 해결을 위한 혁신 기술",
+      date: "2025.07.05",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 8,
+      title: "친환경 포장재 개발 현황",
+      date: "2025.07.04",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 9,
+      title: "플라스틱 대체재 소재 연구 동향",
+      date: "2025.07.03",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 10,
+      title: "ESG 경영과 플라스틱 감축 전략",
+      date: "2025.07.02",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 11,
+      title: "글로벌 플라스틱 규제 동향",
+      date: "2025.07.01",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 12,
+      title: "생분해성 플라스틱 상용화 전망",
+      date: "2025.06.30",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 13,
+      title: "플라스틱 없는 일주일 캠페인",
+      date: "2025.06.29",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 14,
+      title: "재활용 플라스틱 품질 향상 기술",
+      date: "2025.06.28",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 15,
+      title: "플라스틱 순환경제 구축 방안",
+      date: "2025.06.27",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 16,
+      title: "친환경 소재 개발 투자 확대",
+      date: "2025.06.26",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 17,
+      title: "마이크로플라스틱 저감 기술",
+      date: "2025.06.25",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 18,
+      title: "플라스틱 재활용률 제고 방안",
+      date: "2025.06.24",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 19,
+      title: "바이오매스 기반 플라스틱 개발",
+      date: "2025.06.23",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 20,
+      title: "환경친화적 플라스틱 산업 전망",
+      date: "2025.06.22",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 21,
+      title: "플라스틱 폐기물 감축 정책",
+      date: "2025.06.21",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 22,
+      title: "지속가능한 포장재 솔루션",
+      date: "2025.06.20",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 23,
+      title: "플라스틱 리사이클링 혁신 기술",
+      date: "2025.06.19",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 24,
+      title: "친환경 플라스틱 인증 시스템",
+      date: "2025.06.18",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 25,
+      title: "탄소 발자국 감축을 위한 플라스틱 대안",
+      date: "2025.06.17",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+  ]);
 
-// 페이지네이션 로직
-const currentPage = ref(1)
-const itemsPerPage = 10
-const totalPages = computed(() => Math.ceil(newsData.value.length / itemsPerPage))
+  // 페이지네이션 로직
+  const currentPage = ref(1);
+  const itemsPerPage = 10;
+  const totalPages = computed(() => Math.ceil(newsData.value.length / itemsPerPage));
 
-const paginatedNews = computed(() => {
-  const start = (currentPage.value - 1) * itemsPerPage
-  const end = start + itemsPerPage
-  return newsData.value.slice(start, end)
-})
+  const paginatedNews = computed(() => {
+    const start = (currentPage.value - 1) * itemsPerPage;
+    const end = start + itemsPerPage;
+    return newsData.value.slice(start, end);
+  });
 
-const goToPage = (page) => {
-  if (page >= 1 && page <= totalPages.value) {
-    currentPage.value = page
-  }
-}
+  const goToPage = (page) => {
+    if (page >= 1 && page <= totalPages.value) {
+      currentPage.value = page;
+    }
+  };
 
-const nextPage = () => {
-  if (currentPage.value < totalPages.value) {
-    currentPage.value++
-  }
-}
+  const nextPage = () => {
+    if (currentPage.value < totalPages.value) {
+      currentPage.value++;
+    }
+  };
 
-const prevPage = () => {
-  if (currentPage.value > 1) {
-    currentPage.value--
-  }
-}
-</script>
+  const prevPage = () => {
+    if (currentPage.value > 1) {
+      currentPage.value--;
+    }
+  };
+</script>

+ 261 - 78
app/pages/media/press.vue

@@ -4,37 +4,59 @@
     <section class="press--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">그린웨일글로벌의 <br />
-            <strong>새로운 소식들을 전해드립니다.</strong></h2>
+          <h2 class="title">
+            그린웨일글로벌의 <br />
+            <strong>새로운 소식들을 전해드립니다.</strong>
+          </h2>
         </div>
         <div class="sns--wrap">
           <h3>SNS</h3>
           <div class="sns--list">
             <NuxtLink class="sns" to="/">
-              <div class="img--wrap" style="background-image: url('/img/img--sns1.png')"></div>
+              <div
+                class="img--wrap"
+                style="background-image: url('/img/img--sns1.png')"
+              ></div>
               <div class="txt--wrap">
-                <h4>그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌</h4>
+                <h4>
+                  그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌
+                </h4>
                 <span>바로가기<i class="ico"></i></span>
               </div>
             </NuxtLink>
             <NuxtLink class="sns" to="/">
-              <div class="img--wrap" style="background-image: url('/img/img--sns2.png')"></div>
+              <div
+                class="img--wrap"
+                style="background-image: url('/img/img--sns2.png')"
+              ></div>
               <div class="txt--wrap">
-                <h4>그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌</h4>
+                <h4>
+                  그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌
+                </h4>
                 <span>바로가기<i class="ico"></i></span>
               </div>
             </NuxtLink>
             <NuxtLink class="sns" to="/">
-              <div class="img--wrap" style="background-image: url('/img/img--sns3.png')"></div>
+              <div
+                class="img--wrap"
+                style="background-image: url('/img/img--sns3.png')"
+              ></div>
               <div class="txt--wrap">
-                <h4>그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌</h4>
+                <h4>
+                  그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌
+                </h4>
                 <span>바로가기<i class="ico"></i></span>
               </div>
             </NuxtLink>
             <NuxtLink class="sns" to="/">
-              <div class="img--wrap" style="background-image: url('/img/img--sns4.png')"></div>
+              <div
+                class="img--wrap"
+                style="background-image: url('/img/img--sns4.png')"
+              ></div>
               <div class="txt--wrap">
-                <h4>그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌</h4>
+                <h4>
+                  그린웨일글로벌, 녹색인프라 수출펀드 첫 투자기업 선정. 그린웨일글로벌
+                </h4>
                 <span>바로가기<i class="ico"></i></span>
               </div>
             </NuxtLink>
@@ -54,7 +76,7 @@
                 <span>{{ news.date }}</span>
               </div>
               <div class="news--thumb--wrap">
-                <img :src="news.image" alt="">
+                <img :src="news.image" alt="" />
               </div>
             </NuxtLink>
           </div>
@@ -69,7 +91,7 @@
                 v-for="page in totalPages"
                 :key="page"
                 @click="goToPage(page)"
-                :class="{ 'active': currentPage === page }"
+                :class="{ active: currentPage === page }"
               >
                 {{ page }}
               </UButton>
@@ -86,76 +108,237 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("media")
-const title = ref("Media")
-const navigation = ref([
-  { name: "Media",
-    link: "/media/press" ,
-    gnbList : [
-      { name: "환경뉴스", link: "/media/news" },
-      { name: "보도자료", link: "/media/press" },
-    ]
-  },
-  { name: "보도자료", link: "/media/press" }
-])
+  const className = ref("media");
+  const title = ref("Media");
+  const navigation = ref([
+    {
+      name: "Media",
+      link: "/media/press",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "보도자료",
+      link: "/media/press",
+      gnbList: [
+        { name: "환경뉴스", link: "/media/news" },
+        { name: "보도자료", link: "/media/press" },
+      ],
+    },
+  ]);
 
-// 뉴스 데이터 배열 생성
-const newsData = ref([
-  { id: 1, title: "그린플라스틱연합, ESG친환경대전서 '자원순환 탄소중립 GPA 컨퍼런스' 개최", date: "2025.07.11", image: "/img/img--news.png", link: "/" },
-  { id: 2, title: "친환경 플라스틱 기술 개발 동향", date: "2025.07.10", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 3, title: "탄소중립 실현을 위한 플라스틱 재활용 기술", date: "2025.07.09", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 4, title: "바이오플라스틱 시장 전망과 기술 동향", date: "2025.07.08", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 5, title: "플라스틱 감축을 위한 정부 정책 변화", date: "2025.07.07", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 6, title: "순환경제와 플라스틱 재활용 산업", date: "2025.07.06", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 7, title: "해양 플라스틱 오염 해결을 위한 혁신 기술", date: "2025.07.05", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 8, title: "친환경 포장재 개발 현황", date: "2025.07.04", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 9, title: "플라스틱 대체재 소재 연구 동향", date: "2025.07.03", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 10, title: "ESG 경영과 플라스틱 감축 전략", date: "2025.07.02", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 11, title: "글로벌 플라스틱 규제 동향", date: "2025.07.01", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 12, title: "생분해성 플라스틱 상용화 전망", date: "2025.06.30", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 13, title: "플라스틱 없는 일주일 캠페인", date: "2025.06.29", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 14, title: "재활용 플라스틱 품질 향상 기술", date: "2025.06.28", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 15, title: "플라스틱 순환경제 구축 방안", date: "2025.06.27", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 16, title: "친환경 소재 개발 투자 확대", date: "2025.06.26", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 17, title: "마이크로플라스틱 저감 기술", date: "2025.06.25", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 18, title: "플라스틱 재활용률 제고 방안", date: "2025.06.24", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 19, title: "바이오매스 기반 플라스틱 개발", date: "2025.06.23", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 20, title: "환경친화적 플라스틱 산업 전망", date: "2025.06.22", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 21, title: "플라스틱 폐기물 감축 정책", date: "2025.06.21", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 22, title: "지속가능한 포장재 솔루션", date: "2025.06.20", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 23, title: "플라스틱 리사이클링 혁신 기술", date: "2025.06.19", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 24, title: "친환경 플라스틱 인증 시스템", date: "2025.06.18", image: "/img/img--cycle--center.png", link: "/" },
-  { id: 25, title: "탄소 발자국 감축을 위한 플라스틱 대안", date: "2025.06.17", image: "/img/img--cycle--center.png", link: "/" }
-])
+  // 뉴스 데이터 배열 생성
+  const newsData = ref([
+    {
+      id: 1,
+      title: "그린플라스틱연합, ESG친환경대전서 '자원순환 탄소중립 GPA 컨퍼런스' 개최",
+      date: "2025.07.11",
+      image: "/img/img--news.png",
+      link: "/",
+    },
+    {
+      id: 2,
+      title: "친환경 플라스틱 기술 개발 동향",
+      date: "2025.07.10",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 3,
+      title: "탄소중립 실현을 위한 플라스틱 재활용 기술",
+      date: "2025.07.09",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 4,
+      title: "바이오플라스틱 시장 전망과 기술 동향",
+      date: "2025.07.08",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 5,
+      title: "플라스틱 감축을 위한 정부 정책 변화",
+      date: "2025.07.07",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 6,
+      title: "순환경제와 플라스틱 재활용 산업",
+      date: "2025.07.06",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 7,
+      title: "해양 플라스틱 오염 해결을 위한 혁신 기술",
+      date: "2025.07.05",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 8,
+      title: "친환경 포장재 개발 현황",
+      date: "2025.07.04",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 9,
+      title: "플라스틱 대체재 소재 연구 동향",
+      date: "2025.07.03",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 10,
+      title: "ESG 경영과 플라스틱 감축 전략",
+      date: "2025.07.02",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 11,
+      title: "글로벌 플라스틱 규제 동향",
+      date: "2025.07.01",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 12,
+      title: "생분해성 플라스틱 상용화 전망",
+      date: "2025.06.30",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 13,
+      title: "플라스틱 없는 일주일 캠페인",
+      date: "2025.06.29",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 14,
+      title: "재활용 플라스틱 품질 향상 기술",
+      date: "2025.06.28",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 15,
+      title: "플라스틱 순환경제 구축 방안",
+      date: "2025.06.27",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 16,
+      title: "친환경 소재 개발 투자 확대",
+      date: "2025.06.26",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 17,
+      title: "마이크로플라스틱 저감 기술",
+      date: "2025.06.25",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 18,
+      title: "플라스틱 재활용률 제고 방안",
+      date: "2025.06.24",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 19,
+      title: "바이오매스 기반 플라스틱 개발",
+      date: "2025.06.23",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 20,
+      title: "환경친화적 플라스틱 산업 전망",
+      date: "2025.06.22",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 21,
+      title: "플라스틱 폐기물 감축 정책",
+      date: "2025.06.21",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 22,
+      title: "지속가능한 포장재 솔루션",
+      date: "2025.06.20",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 23,
+      title: "플라스틱 리사이클링 혁신 기술",
+      date: "2025.06.19",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 24,
+      title: "친환경 플라스틱 인증 시스템",
+      date: "2025.06.18",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+    {
+      id: 25,
+      title: "탄소 발자국 감축을 위한 플라스틱 대안",
+      date: "2025.06.17",
+      image: "/img/img--cycle--center.png",
+      link: "/",
+    },
+  ]);
 
-// 페이지네이션 로직
-const currentPage = ref(1)
-const itemsPerPage = 10
-const totalPages = computed(() => Math.ceil(newsData.value.length / itemsPerPage))
+  // 페이지네이션 로직
+  const currentPage = ref(1);
+  const itemsPerPage = 10;
+  const totalPages = computed(() => Math.ceil(newsData.value.length / itemsPerPage));
 
-const paginatedNews = computed(() => {
-  const start = (currentPage.value - 1) * itemsPerPage
-  const end = start + itemsPerPage
-  return newsData.value.slice(start, end)
-})
+  const paginatedNews = computed(() => {
+    const start = (currentPage.value - 1) * itemsPerPage;
+    const end = start + itemsPerPage;
+    return newsData.value.slice(start, end);
+  });
 
-const goToPage = (page) => {
-  if (page >= 1 && page <= totalPages.value) {
-    currentPage.value = page
-  }
-}
+  const goToPage = (page) => {
+    if (page >= 1 && page <= totalPages.value) {
+      currentPage.value = page;
+    }
+  };
 
-const nextPage = () => {
-  if (currentPage.value < totalPages.value) {
-    currentPage.value++
-  }
-}
+  const nextPage = () => {
+    if (currentPage.value < totalPages.value) {
+      currentPage.value++;
+    }
+  };
 
-const prevPage = () => {
-  if (currentPage.value > 1) {
-    currentPage.value--
-  }
-}
-</script>
+  const prevPage = () => {
+    if (currentPage.value > 1) {
+      currentPage.value--;
+    }
+  };
+</script>

+ 67 - 30
app/pages/products/materials.vue

@@ -4,8 +4,10 @@
     <section class="title--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">그린 지구를 만드는 그린웨일글로벌의 <br />
-            <strong>탄소저감형 바이오 플라스틱 제품 및 서비스를 소개합니다.</strong></h2>
+          <h2 class="title">
+            그린 지구를 만드는 그린웨일글로벌의 <br />
+            <strong>탄소저감형 바이오 플라스틱 제품 및 서비스를 소개합니다.</strong>
+          </h2>
         </div>
         <div class="tab--wrap">
           <NuxtLink to="/products/materials" class="active">Materials</NuxtLink>
@@ -14,13 +16,16 @@
         <div class="materials--wrap">
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--materials1.png" alt="">
+              <img src="/img/img--materials1.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Ecoist®-Terra</h4>
               <h5>"자연으로 돌아가는 플라스틱"</h5>
               <ul>
-                <li>자연 속에서 분해되는 생분해성 소재(PBAT, PLA, PHA 등)와 카사바 전분 기반 TPS를 컴파운딩한 소재로, 환경에 남지 않고 스스로 사라지는 친환경 대안입니다.
+                <li>
+                  자연 속에서 분해되는 생분해성 소재(PBAT, PLA, PHA 등)와 카사바 전분 기반
+                  TPS를 컴파운딩한 소재로, 환경에 남지 않고 스스로 사라지는 친환경
+                  대안입니다.
                 </li>
                 <li>농업, 식품, 일회용품 등에 적합합니다.</li>
               </ul>
@@ -28,53 +33,74 @@
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--materials2.png" alt="">
+              <img src="/img/img--materials2.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Ecoist®-Revo</h4>
               <h5>"되살아나는 플라스틱"</h5>
               <ul>
-                <li>사용 후 버려진 플라스틱을 다시 살려낸 재활용 소재 기반 원료입니다.</li>
-                <li>PCR(Post-Consumer Recycled)과  바이오매스를 활용해 순수 플라스틱 사용량을 줄임으로써 탄소 배출을 줄이고 순환경제에 기여합니다.</li>
+                <li>
+                  사용 후 버려진 플라스틱을 다시 살려낸 재활용 소재 기반 원료입니다.
+                </li>
+                <li>
+                  PCR(Post-Consumer Recycled)과 바이오매스를 활용해 순수 플라스틱 사용량을
+                  줄임으로써 탄소 배출을 줄이고 순환경제에 기여합니다.
+                </li>
               </ul>
             </div>
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--materials3.png" alt="">
+              <img src="/img/img--materials3.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Ecoist®-Nova</h4>
               <h5>"새로운 세대의 바이오 폴리머"</h5>
               <ul>
-                <li>카사바, 사탕수수, 옥수수 등 식물에서 유래한 Bio-PE, Bio-PP 등으로 구성된 차세대 바이오 플라스틱입니다. </li>
-                <li>석유 기반 원료를 대체하면서 기존 플라스틱과 유사한 물성을 구현합니다.</li>
+                <li>
+                  카사바, 사탕수수, 옥수수 등 식물에서 유래한 Bio-PE, Bio-PP 등으로 구성된
+                  차세대 바이오 플라스틱입니다.
+                </li>
+                <li>
+                  석유 기반 원료를 대체하면서 기존 플라스틱과 유사한 물성을 구현합니다.
+                </li>
               </ul>
             </div>
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--materials4.png" alt="">
+              <img src="/img/img--materials4.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Ecoist®-Boost</h4>
               <h5>"강화 & 성능 향상"</h5>
               <ul>
-                <li>기초 바이오매스 소재인 TPS에 기능성 첨가제를 결합한 마스터배치입니다.</li>
-                <li>재활용 플라스틱의 물성을 보완하거나, 기존 제품에 탄소 저감 효과를 더할 수 있습니다.</li>
+                <li>
+                  기초 바이오매스 소재인 TPS에 기능성 첨가제를 결합한 마스터배치입니다.
+                </li>
+                <li>
+                  재활용 플라스틱의 물성을 보완하거나, 기존 제품에 탄소 저감 효과를 더할
+                  수 있습니다.
+                </li>
               </ul>
             </div>
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--materials5.png" alt="">
+              <img src="/img/img--materials5.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Halastic®</h4>
               <h5>"세계 최초 할랄 인증 친환경 바이오플라스틱"</h5>
               <ul>
-                <li>중동 지역 진출 제품들의 패키징 솔루션을 위해 세계 최초로 할랄 인증을 받은 소재를 개발하였습니다.</li>
-                <li>할라스틱은 식품·의료·생활·뷰티 산업 전반에서 이슬람 국가들의 종교적 가치는 물론, 글로벌 친환경 기준까지 충족하는 솔루션입니다.</li>
+                <li>
+                  중동 지역 진출 제품들의 패키징 솔루션을 위해 세계 최초로 할랄 인증을
+                  받은 소재를 개발하였습니다.
+                </li>
+                <li>
+                  할라스틱은 식품·의료·생활·뷰티 산업 전반에서 이슬람 국가들의 종교적
+                  가치는 물론, 글로벌 친환경 기준까지 충족하는 솔루션입니다.
+                </li>
               </ul>
             </div>
           </div>
@@ -84,18 +110,29 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("products")
-const title = ref("Products")
-const navigation = ref([
-  { name: "Products",
-    link: "/products/materials" ,
-    gnbList : [
-      { name: "Materials", link: "/products/materials" },
-      { name: "Solutions", link: "/products/solutions" },
-    ]
-  },
-  { name: "Materials", link: "/products/materials" }
-])
-</script>
+  const className = ref("products");
+  const title = ref("Products");
+  const navigation = ref([
+    {
+      name: "Products",
+      link: "/products/materials",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "Materials",
+      link: "/products/materials",
+      gnbList: [
+        { name: "Materials", link: "/products/materials" },
+        { name: "Solutions", link: "/products/solutions" },
+      ],
+    },
+  ]);
+</script>

+ 59 - 29
app/pages/products/solutions.vue

@@ -4,8 +4,10 @@
     <section class="title--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">그린 지구를 만드는 그린웨일글로벌의 <br />
-            <strong>탄소저감형 바이오 플라스틱 제품 및 서비스를 소개합니다.</strong></h2>
+          <h2 class="title">
+            그린 지구를 만드는 그린웨일글로벌의 <br />
+            <strong>탄소저감형 바이오 플라스틱 제품 및 서비스를 소개합니다.</strong>
+          </h2>
         </div>
         <div class="tab--wrap">
           <NuxtLink to="/products/materials">Materials</NuxtLink>
@@ -30,20 +32,22 @@
               </div>
             </div>
             <div class="img--wrap">
-              <img src="/img/img--solutions1.png" alt="">
+              <img src="/img/img--solutions1.png" alt="" />
             </div>
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--solutions2.png" alt="">
+              <img src="/img/img--solutions2.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Health & Pharmaceutical</h4>
               <h5>"건강을 위한 선택에도 친환경이 함께합니다"</h5>
               <ul>
-                <li>건강기능식품 용기, 약통, 영양제 케이스, 보건용 패키징
+                <li>건강기능식품 용기, 약통, 영양제 케이스, 보건용 패키징</li>
+                <li>
+                  인체와 환경에 안전한 바이오 기반 소재로, 의료·건강 제품의 신뢰도를
+                  높이는 친환경 대안을 제시합니다.
                 </li>
-                <li>인체와 환경에 안전한 바이오 기반 소재로, 의료·건강 제품의 신뢰도를 높이는 친환경 대안을 제시합니다.</li>
               </ul>
               <div class="tag--wrap">
                 <span>#사출</span>
@@ -60,7 +64,10 @@
               <h5>"매일 버려지는 것을 자연으로 되돌립니다"</h5>
               <ul>
                 <li>빨대, 커틀러리, 식품 용기, 트레이, 피자 세이버, 과일 포장실망</li>
-                <li>음식과 함께 사라지는 생분해성 소재로, 일회용 플라스틱 사용을 최소화합니다.</li>
+                <li>
+                  음식과 함께 사라지는 생분해성 소재로, 일회용 플라스틱 사용을
+                  최소화합니다.
+                </li>
               </ul>
               <div class="tag--wrap">
                 <span>#사출</span>
@@ -71,19 +78,25 @@
               </div>
             </div>
             <div class="img--wrap">
-              <img src="/img/img--solutions3.png" alt="">
+              <img src="/img/img--solutions3.png" alt="" />
             </div>
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--solutions4.png" alt="">
+              <img src="/img/img--solutions4.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Household & Smart Living</h4>
               <h5>"생활의 모든 순간을 친환경으로 바꿉니다"</h5>
               <ul>
-                <li>문구류, 반려동물 배변 봉투, 페인트통, 부탄가스 캡, 멀칭필름, 모종 트레이, 가습기, 가전 포장재</li>
-                <li>일상용품부터 소형 가전까지, 생활 전반에 적용 가능한 친환경 소재로 폐기물을 줄이고 지속가능한 라이프스타일을 만듭니다.</li>
+                <li>
+                  문구류, 반려동물 배변 봉투, 페인트통, 부탄가스 캡, 멀칭필름, 모종
+                  트레이, 가습기, 가전 포장재
+                </li>
+                <li>
+                  일상용품부터 소형 가전까지, 생활 전반에 적용 가능한 친환경 소재로
+                  폐기물을 줄이고 지속가능한 라이프스타일을 만듭니다.
+                </li>
               </ul>
               <div class="tag--wrap">
                 <span>#사출</span>
@@ -100,7 +113,10 @@
               <h5>"기술의 진보에 자연을 담습니다"</h5>
               <ul>
                 <li>전자기기 케이스, 리모컨 커버, 드론 외장재, 로봇 커버</li>
-                <li>고기능성이 요구되는 전자 및 로봇 분야에서도 탄소 저감과 내열성 등 기술적 요건을 충족하며 지속가능한 대안을 제시합니다.</li>
+                <li>
+                  고기능성이 요구되는 전자 및 로봇 분야에서도 탄소 저감과 내열성 등 기술적
+                  요건을 충족하며 지속가능한 대안을 제시합니다.
+                </li>
               </ul>
               <div class="tag--wrap">
                 <span>#사출</span>
@@ -111,19 +127,22 @@
               </div>
             </div>
             <div class="img--wrap">
-              <img src="/img/img--solutions5.png" alt="">
+              <img src="/img/img--solutions5.png" alt="" />
             </div>
           </div>
           <div class="materials--box">
             <div class="img--wrap">
-              <img src="/img/img--solutions6.png" alt="">
+              <img src="/img/img--solutions6.png" alt="" />
             </div>
             <div class="desc--wrap">
               <h4>Mobility & Construction</h4>
               <h5>"이동과 공간, 모두 탄소를 줄입니다"</h5>
               <ul>
                 <li>자동차 부품, 전기차 내장재, 단열재, 몰딩 부자재, 건축 완충 부품</li>
-                <li>모빌리티와 건축 산업 전반에 적용 가능한 고기능성 친환경 소재로, 제조현장의 탄소배출과 플라스틱 사용을 획기적으로 줄입니다.</li>
+                <li>
+                  모빌리티와 건축 산업 전반에 적용 가능한 고기능성 친환경 소재로,
+                  제조현장의 탄소배출과 플라스틱 사용을 획기적으로 줄입니다.
+                </li>
               </ul>
               <div class="tag--wrap">
                 <span>#사출</span>
@@ -140,18 +159,29 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("products")
-const title = ref("Products")
-const navigation = ref([
-  { name: "Products",
-    link: "/products/solutions" ,
-    gnbList : [
-      { name: "Materials", link: "/products/materials" },
-      { name: "Solutions", link: "/products/solutions" },
-    ]
-  },
-  { name: "Solutions", link: "/products/solutions" }
-])
-</script>
+  const className = ref("products");
+  const title = ref("Products");
+  const navigation = ref([
+    {
+      name: "Products",
+      link: "/products/solutions",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "Solutions",
+      link: "/products/solutions",
+      gnbList: [
+        { name: "Materials", link: "/products/materials" },
+        { name: "Solutions", link: "/products/solutions" },
+      ],
+    },
+  ]);
+</script>

+ 46 - 26
app/pages/technology/facilities.vue

@@ -4,20 +4,22 @@
     <section class="title--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">그린웨일글로벌의 <br />
-            <strong>탄소 저감형 원료의 라이프 사이클을 소개합니다.</strong></h2>
+          <h2 class="title">
+            그린웨일글로벌의 <br />
+            <strong>탄소 저감형 원료의 라이프 사이클을 소개합니다.</strong>
+          </h2>
         </div>
         <div class="life--cycle--wrap">
           <div class="cycle">
             <div class="img--wrap">
-              <img src="/img/img--cycle1.png" alt="">
+              <img src="/img/img--cycle1.png" alt="" />
               <div class="txt">
                 <span>01</span>
                 <p>카사바와 옥수수를 재배 및 수확합니다.</p>
               </div>
             </div>
             <div class="img--wrap">
-              <img src="/img/img--cycle2.png" alt="">
+              <img src="/img/img--cycle2.png" alt="" />
               <div class="txt">
                 <span>02</span>
                 <p>수확한 작물에서 레진을 제작합니다.</p>
@@ -26,17 +28,17 @@
           </div>
           <div class="cycle">
             <div class="img--wrap">
-              <img src="/img/img--cycle6.png" alt="">
+              <img src="/img/img--cycle6.png" alt="" />
               <div class="txt">
                 <span>06</span>
-                <p>청정한 흙 속에서 작물이 자라나는 선순환 고리가  만들어집니다.</p>
+                <p>청정한 흙 속에서 작물이 자라나는 선순환 고리가 만들어집니다.</p>
               </div>
             </div>
             <div class="img--wrap">
-              <img src="/img/img--cycle--center.png" alt="">
+              <img src="/img/img--cycle--center.png" alt="" />
             </div>
             <div class="img--wrap">
-              <img src="/img/img--cycle3.png" alt="">
+              <img src="/img/img--cycle3.png" alt="" />
               <div class="txt">
                 <span>03</span>
                 <p>그린웨일글로벌만의 혁신기술로 친환경 플라스틱을 생산합니다.</p>
@@ -45,17 +47,24 @@
           </div>
           <div class="cycle">
             <div class="img--wrap">
-              <img src="/img/img--cycle5.png" alt="">
+              <img src="/img/img--cycle5.png" alt="" />
               <div class="txt">
                 <span>05</span>
-                <p>생분해성 플라스틱의 경우, 미생물이 친환경 플라스틱을 분해하여 청정하고 무해한 흙이 됩니다.</p>
+                <p>
+                  생분해성 플라스틱의 경우, 미생물이 친환경 플라스틱을 분해하여 청정하고
+                  무해한 흙이 됩니다.
+                </p>
               </div>
             </div>
             <div class="img--wrap">
-              <img src="/img/img--cycle4.png" alt="">
+              <img src="/img/img--cycle4.png" alt="" />
               <div class="txt">
                 <span>04</span>
-                <p>사용이 다해진 제품은 매립되어 생분해가 되거나, 수거하여 재활용할 수 있습니다. 소각되더라도 순수 플라스틱 대비 현저하게 적은 탄소를 배출하며, 유해물질이 없습니다.</p>
+                <p>
+                  사용이 다해진 제품은 매립되어 생분해가 되거나, 수거하여 재활용할 수
+                  있습니다. 소각되더라도 순수 플라스틱 대비 현저하게 적은 탄소를 배출하며,
+                  유해물질이 없습니다.
+                </p>
               </div>
             </div>
           </div>
@@ -109,18 +118,29 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("technology")
-const title = ref("Technology")
-const navigation = ref([
-  { name: "Technology",
-    link: "/technology/facilities" ,
-    gnbList : [
-      { name: "시설", link: "/technology/facilities" },
-      { name: "특허 / 인증", link: "/technology/patents" },
-    ]
-  },
-  { name: "시설", link: "/technology/facilities" }
-])
-</script>
+  const className = ref("technology");
+  const title = ref("Technology");
+  const navigation = ref([
+    {
+      name: "Technology",
+      link: "/technology/facilities",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "시설",
+      link: "/technology/facilities",
+      gnbList: [
+        { name: "시설", link: "/technology/facilities" },
+        { name: "특허 / 인증", link: "/technology/patents" },
+      ],
+    },
+  ]);
+</script>

+ 45 - 27
app/pages/technology/patents.vue

@@ -4,8 +4,11 @@
     <section class="title--section">
       <div class="sub--container type2">
         <div class="title--wrap">
-          <h2 class="title">그린웨일글로벌은 까다롭기로 유명한 <br />
-            <strong>친환경 플라스틱 관련 미국 특허 및 유럽 인증을 획득</strong>하여 <br />그 기술력을 입증받았습니다.</h2>
+          <h2 class="title">
+            그린웨일글로벌은 까다롭기로 유명한 <br />
+            <strong>친환경 플라스틱 관련 미국 특허 및 유럽 인증을 획득</strong>하여
+            <br />그 기술력을 입증받았습니다.
+          </h2>
         </div>
         <div class="tab--wrap patents">
           <NuxtLink to="/" class="active">전체</NuxtLink>
@@ -61,28 +64,32 @@
             <UModal v-model:open="isModalOpen" title="특허 / 인증 크게보기" :close="false">
               <UButton @click="openModal('/img/img--patents.png')" class="patents">
                 <div class="img--wrap">
-                  <img src="/img/img--patents.png" alt="">
+                  <img src="/img/img--patents.png" alt="" />
                 </div>
                 <h4>플라스틱 감축 소재 인증서</h4>
               </UButton>
               <template #content>
                 <UButton @click="isModalOpen = false" class="modal--close--btn"></UButton>
                 <div class="modal--img--container">
-                  <img :src="selectedImage" alt="">
+                  <img :src="selectedImage" alt="" />
                 </div>
               </template>
             </UModal>
-            <UModal v-model:open="isModalOpen" title="특허 / 인증 크게보기" :close="false">
+            <UModal
+              v-model:open="isModalOpen"
+              title="특허 / 인증 크게보기"
+              :close="false"
+            >
               <UButton @click="openModal('/img/top_ban_technology.jpg')" class="patents">
                 <div class="img--wrap">
-                  <img src="/img/top_ban_technology.jpg" alt="">
+                  <img src="/img/top_ban_technology.jpg" alt="" />
                 </div>
                 <h4>플라스틱 감축 소재 인증서</h4>
               </UButton>
               <template #content>
                 <UButton @click="isModalOpen = false" class="modal--close--btn"></UButton>
                 <div class="modal--img--container">
-                  <img :src="selectedImage" alt="">
+                  <img :src="selectedImage" alt="" />
                 </div>
               </template>
             </UModal>
@@ -104,26 +111,37 @@
   </main>
 </template>
 <script setup>
-import TopVisual from '~/components/topVisual.vue'
+  import TopVisual from "~/components/topVisual.vue";
 
-const className = ref("technology");
-const title = ref("Technology");
-const isModalOpen = ref(false);
-const navigation = ref([
-  { name: "Technology",
-    link: "/technology/patents" ,
-    gnbList : [
-      { name: "시설", link: "/technology/facilities" },
-      { name: "특허 / 인증", link: "/technology/patents" },
-    ]
-  },
-  { name: "특허 / 인증", link: "/technology/patents" }
-])
+  const className = ref("technology");
+  const title = ref("Technology");
+  const isModalOpen = ref(false);
+  const navigation = ref([
+    {
+      name: "Technology",
+      link: "/technology/patents",
+      gnbList: [
+        { name: "Company", link: "/company/intro" },
+        { name: "Product", link: "/products/materials" },
+        { name: "Technology", link: "/technology/facilities" },
+        { name: "Media", link: "/media/news" },
+        { name: "Contact", link: "/contact/notice" },
+      ],
+    },
+    {
+      name: "특허 / 인증",
+      link: "/technology/patents",
+      gnbList: [
+        { name: "시설", link: "/technology/facilities" },
+        { name: "특허 / 인증", link: "/technology/patents" },
+      ],
+    },
+  ]);
 
-const selectedImage = ref('/img/img--patents.png');
+  const selectedImage = ref("/img/img--patents.png");
 
-const openModal = (imagePath) => {
-  selectedImage.value = imagePath;
-  isModalOpen.value = true;
-};
-</script>
+  const openModal = (imagePath) => {
+    selectedImage.value = imagePath;
+    isModalOpen.value = true;
+  };
+</script>