Merge branch 'master' of https://gogs.interscope.i234.me/mo0647/audi

* 'master' of https://gogs.interscope.i234.me/mo0647/audi:
  테크놀로지 작업중

app/assets/scss/media.scss

@@ -0,0 +1,128 @@
+@media(max-width: 1920px){
+    main{
+        .detail--container{
+            padding: 0 20px;
+            .title--wrap{
+                padding-left: 0;
+                padding-right: 0;
+                h2{
+                    font-size: 60px;
+                }
+            }
+            .content--wrap{
+                padding-left: 0;
+                padding-right: 0;
+                .tech--card--wrap{
+                    .tech--card{
+                        h3{
+                            font-size: 18px;
+                        }
+                    }
+                }
+            }
+            .img--desc--section{
+                .desc--wrap{
+                    padding-right: 0;
+                    padding-left: 20px;
+                    h3{
+                        font-size: 24px;
+                    }
+                }
+            }
+        }
+    }
+}
+@media(max-width: 1024px){
+    main{
+        .detail--container{
+            .title--wrap{
+                h2{
+                    font-size: 44px;
+                }
+            }
+            .content--wrap{
+                .tech--card--wrap{
+                    .tech--card{
+                        width: calc(50% - 8px);
+                    }
+                }
+            }
+            .title--section{
+                padding-left: 0;
+                padding-right: 0;
+                >h2{
+                    font-size: 36px;
+                }
+                >h3{
+                    font-size: 20px;
+                }
+            }
+            .desc--section{
+                padding-left: 0;
+                padding-right: 0;
+                >h3{
+                    font-size: 32px;
+                }
+                &.full--type{
+                    >ul{
+                        >li{
+                            font-size: 20px;
+                        }
+                    }
+                }
+            }
+            .img--desc--section{
+                flex-direction: column;
+                gap: 20px;
+                .img--wrap{
+                    width: 100%;
+                }
+                .desc--wrap{
+                    width: 100%;
+                }
+            }
+        }
+    }
+}
+@media(max-width: 768px){
+    main{
+        .detail--container{
+            .title--wrap{
+                h2{
+                    font-size: 24px;
+                }
+            }
+            .content--wrap{
+                .tech--card--wrap{
+                    .tech--card{
+                        width: 100%;
+                    }
+                }
+            }
+            .title--section{
+                >h2{
+                    font-size: 28px;
+                }
+            }
+            .desc--section{
+                >h3{
+                    font-size: 24px;
+                }
+            }
+        }
+    }
+}
+@media(max-width: 500px){
+    main{
+        .detail--container{
+            .img--section{
+                &.type2{
+                    flex-direction: column;
+                    .img--box{
+                        width: 100%;
+                    }
+                }
+            }
+        }
+    }
+}

app/assets/scss/style.scss

@@ -99,73 +99,73 @@ footer{
 }
 
 main{
-    max-width: 1920px;
-    width: 100%;
-    margin: 0 auto;
-    .title--wrap{
-        padding: 40px;
-        text-align: center;
-        h2{
-            font-size: 72px;
-            margin-bottom: 24px;
-        }
-        p{
-            color: rgba(252, 252, 253, 0.7);
-            font-size: 16px;
+    .detail--container{
+        max-width: 1920px;
+        width: 100%;
+        margin: 0 auto;
+        .title--wrap{
+            padding: 40px;
+            text-align: center;
+            h2{
+                font-size: 72px;
+                margin-bottom: 24px;
+            }
+            p{
+                color: rgba(252, 252, 253, 0.7);
+                font-size: 16px;
+            }
         }
-    }
-    .content--wrap{
-        padding: 40px 88px;
-        .tech--card--wrap{
-            display: flex;
-            row-gap: 72px;
-            column-gap: 16px;
-            flex-wrap: wrap;
-            .tech--card{
-                width: calc((100% - 48px) / 4);
+        .content--wrap{
+            padding: 40px 88px;
+            .tech--card--wrap{
                 display: flex;
-                flex-direction: column;
-                .img--wrap{
-                    margin-bottom: 24px;
-                    border-radius: 20px;
-                    overflow: hidden;
-                    >img{
-                        width: 100%;
-                        aspect-ratio: 16 / 9;
-                        object-fit: cover;
+                row-gap: 72px;
+                column-gap: 16px;
+                flex-wrap: wrap;
+                .tech--card{
+                    width: calc((100% - 48px) / 4);
+                    display: flex;
+                    flex-direction: column;
+                    .img--wrap{
+                        margin-bottom: 24px;
+                        border-radius: 20px;
+                        overflow: hidden;
+                        >img{
+                            width: 100%;
+                            aspect-ratio: 16 / 9;
+                            object-fit: cover;
+                        }
                     }
-                }
-                >h3{
-                    font-size: 24px;
-                    margin-bottom: 8px;
-                }
-                >p{
-                    margin-bottom: 24px;
-                    color: rgba(252, 252, 253, 0.7);
-                    font-size: 16px;
-                    font-stretch: 105%;
-                    &.type2{
-                        margin-top: 40px;
+                    >h3{
+                        font-size: 24px;
+                        margin-bottom: 8px;
+                    }
+                    >p{
+                        margin-bottom: 24px;
                         color: rgba(252, 252, 253, 0.7);
-                        font-size: 14px;
+                        font-size: 16px;
+                        font-stretch: 105%;
+                        &.type2{
+                            margin-top: 40px;
+                            color: rgba(252, 252, 253, 0.7);
+                            font-size: 14px;
+                        }
                     }
-                }
-                >a{
-                    display: flex;
-                    font-size: 16px;
-                    text-underline-offset: 7px;
-                    text-decoration: underline 1px rgb(252, 252, 253);
-                    align-items: center;
-                    .ico{
-                        width: 24px;
-                        height: 24px;
-                        background-image: url(/img/ico--arrow.svg);
+                    >a{
+                        display: flex;
+                        font-size: 16px;
+                        text-underline-offset: 7px;
+                        text-decoration: underline 1px rgb(252, 252, 253);
+                        align-items: center;
+                        .ico{
+                            width: 24px;
+                            height: 24px;
+                            background-image: url(/img/ico--arrow.svg);
+                        }
                     }
                 }
             }
         }
-    }
-    .detail--container{
         .img--section{
             .img--wrap{
                 overflow: hidden;
@@ -196,14 +196,22 @@ main{
             .desc--wrap{
                 margin-top: 24px;
                 font-size: 16px;
+                color: #fcfcfdb2;
             }
         }
         .title--section{
             text-align: center;
             padding: 64px 96px;
+            &.mid--type{
+                max-width: 1248px;
+                margin: 0 auto;
+            }
             >h2{
                 margin-bottom: 24px;
                 font-size: 44px;
+                &.big--title{
+                    font-size: 72px;
+                }
             }
             >h3{
                 font-size: 24px;
@@ -211,7 +219,11 @@ main{
             }
             >p{
                 color: rgba(252, 252, 253, 0.7);
-                font-size: 14px;
+                font-size: 16px;
+                &.desc{
+                    color: rgba(252, 252, 253, 0.7);
+                    font-size: 14px;
+                }
             }
         }
         .desc--section{
@@ -227,6 +239,9 @@ main{
                 color: rgba(252, 252, 253, 0.7);
                 font-size: 16px;
             }
+            &.mid--type{
+                max-width: 1440px;
+            }
             &.full--type{
                 width: 100%;
                 max-width: 100%;
@@ -270,19 +285,78 @@ main{
                 }
             }
         }
+        .more--section{
+            margin-top: 100px;
+            >h2{
+                font-size: 44px;
+                margin-bottom: 40px;
+            }
+            .tech--card--wrap{
+                display: flex;
+                column-gap: 16px;
+                .tech--card{
+                    width: calc((100% - 48px) / 4);
+                    display: flex;
+                    flex-direction: column;
+                    .img--wrap{
+                        margin-bottom: 24px;
+                        border-radius: 20px;
+                        overflow: hidden;
+                        >img{
+                            width: 100%;
+                            aspect-ratio: 16 / 9;
+                            object-fit: cover;
+                        }
+                    }
+                    >h3{
+                        font-size: 24px;
+                        margin-bottom: 8px;
+                    }
+                    >p{
+                        margin-bottom: 24px;
+                        color: rgba(252, 252, 253, 0.7);
+                        font-size: 16px;
+                        font-stretch: 105%;
+                        &.type2{
+                            margin-top: 40px;
+                            color: rgba(252, 252, 253, 0.7);
+                            font-size: 14px;
+                        }
+                    }
+                    >a{
+                        display: flex;
+                        font-size: 16px;
+                        text-underline-offset: 7px;
+                        text-decoration: underline 1px rgb(252, 252, 253);
+                        align-items: center;
+                        .ico{
+                            width: 24px;
+                            height: 24px;
+                            background-image: url(/img/ico--arrow.svg);
+                        }
+                    }
+                }
+            }
+        }
     }
 }
 .btn--gray{
     transition: all 0.3s;
     width: fit-content;
     font-size: 14px;
+    display: inline-block;
     font-weight: 400;
     padding: 12px 24px;
     color: #fff;
     border-radius: 100px;
-    background-color: rgb(101, 112, 129);
+    background-color: #657081;
     &:hover{
         background-color: rgb(44, 52, 63);
         box-shadow: rgba(219, 223, 230, 0.2) 0px 0px 0px 1px inset;
     }
+    &.big--btn{
+        font-size: 16px;
+        padding: 16px 32px;
+        width: 248px;
+    }
 }

app/pages/stories/technology/index.vue

@@ -1,170 +1,172 @@
 <template>
     <main>
-        <div class="title--wrap">
-            <h2 class="en">Technology</h2>
-            <p>기술을 통한 진보. 진보적인 기술과 열정적인 창의성이 현재를 위한 매력적인 차량과 솔루션을 만들어냅니다. 혁신이 성공의 핵심인 이유를 발견해보세요.</p>
-        </div>
-        <div class="content--wrap">
-            <div class="tech--card--wrap">
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech1.jpg" alt="Evolution x Vision: 아우디의 콰트로 드라이브">
-                    </div>
-                    <h3>Evolution x Vision: 아우디의 콰트로 드라이브</h3>
-                    <p>45년 동안, 아우디의 콰트로 드라이브는 '기술을 통한 진보' (Vorsprung durch Technik) 를 독창적인 방식으로 경험할 수 있게 해왔습니다. 오늘날 아우디는 이 성공 스토리를 꾸준히 이어가고 있습니다.</p>
-                    <NuxtLink to="/stories/technology/45-years-audi-quattro-drive">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech2.jpg" alt="A6 스포트백 e-tron: 역대 가장 공기역학적인 아우디">
-                    </div>
-                    <h3>A6 스포트백 e-tron: 역대 가장 공기역학적인 아우디</h3>
-                    <p>아우디 A6 스포트백 e-tron이 Cd 값 0.21을 달성하며 아우디 역사에 또 하나의 기록을 남겼습니다. 역대 가장 공기역학적인 아우디 차량임과 동시에, 폭스바겐 그룹 내 해당 세그먼트 전체를 통틀어 선두에 서는 기록입니다.</p>
-                    <NuxtLink to="/stories/technology/a6-sportback-e-tron-the-most-aerodynamic-audi-of-all-time/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech3.jpg" alt="소리를 '맛보다': 아우디 A6 e-tron의 새로운 사운드 경험">
-                    </div>
-                    <h3>소리를 '맛보다': 아우디 A6 e-tron의 새로운 사운드 경험</h3>
-                    <p>아우디 사운드 랩에서는 신형 The new Audi A6 e-tron에서 엔터테인먼트와 정보를 특별한 사운드 경험으로 바꾸기 위한 시스템을 개발하고 있습니다.</p>
-                    <NuxtLink to="/stories/technology/acoustic-umami-the-sound-experience-in-the-audi-a6-e-tron/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech4.jpg" alt="일상에 최적화된 만능 SUV: The new Audi Q5">
-                    </div>
-                    <h3>일상에 최적화된 만능 SUV: The new Audi Q5</h3>
-                    <p>아우디 Q5는 진정한 다재다능함의 상징입니다. 2008년 첫 등장 이후 SUV 두 세대에 걸쳐 Q5는 수많은 고객들에게 큰 사랑을 받아왔습니다.</p>
-                    <NuxtLink to="/stories/technology/the-all-rounder-for-every-day--the-audi-q5/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech5.jpg" alt="헤이 아우디, 나 발이 시려워!">
-                    </div>
-                    <h3>"헤이 아우디, 나 발이 시려워!"</h3>
-                    <p>음성 명령으로 차량 및 인포테인먼트 기능을 제어하는 아우디 어시스턴트는 아우디와의 상호작용을 새로운 차원으로 끌어올립니다. 그리고 훨씬 더 다양한 기능을 제공하죠.</p>
-                    <NuxtLink to="/stories/technology/hey-audi-ich-habe-kalte-fuesse/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech6.jpg" alt="MHEV plus: 아우디의 차세대 하이브리드 기술">
-                    </div>
-                    <h3>MHEV plus: 아우디의 차세대 하이브리드 기술</h3>
-                    <p>파워트레인 제너레이터(PTG)를 전기모터로 활용하는 MHEV plus 기술은 부분 전기 구동을 통해 한층 향상된 효율성을 실현합니다.</p>
-                    <NuxtLink to="/stories/technology/mhev-plus-the-next-generation-of-hybridization-at-audi/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech7.jpg" alt="전기 주행 경험을 위한 새 기반">
-                    </div>
-                    <h3>전기 주행 경험을 위한 새 기반</h3>
-                    <p>신형 프리미엄 플랫폼 일렉트릭(Premium Platform Electric, PPE)을 기반으로 한 아우디 Q6 e-tron은 주행 거리, 충전 성능, 디자인 전반에서 새로운 기준을 제시합니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech8.jpg" alt="차별화: The new Audi Q6 e-tron의 라이트 기술">
-                    </div>
-                    <h3>차별화: The new Audi Q6 e-tron의 라이트 기술</h3>
-                    <p>The new Audi Q6 e-tron에 적용된 액티브 디지털 라이트 시그니처는 세계 최초로 선보이는 기술입니다. 또한 후미등과 헤드라이트에 탑재된 커뮤니케이션 라이트는 도로 안전을 향상시킵니다. 두 기능 모두 2세대 디지털 OLED 기술과 디지털 주간 주행등이 결합되어 구현됐습니다.</p>
-                    <NuxtLink to="/stories/technology/unique-the-lighting-technology-of-the-audi-q6-e-tron/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech9.jpg" alt="눈 속 전기차의 운동신경">
-                    </div>
-                    <h3>눈 속 전기차의 운동신경</h3>
-                    <p>눈과 얼음 위에서 전기차를 안전하게 운전하는 방법은 무엇일까요? 스타 스키 선수 아나 파이트(Anna Veith)의 아우디 드라이빙 익스피리언스에서 알아보세요.</p>
-                    <NuxtLink to="/stories/technology/electric-athleticism-in-the-snow/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech10.jpg" alt="커뮤니케이션의 수단인 라이트">
-                    </div>
-                    <h3>커뮤니케이션의 수단인 라이트</h3>
-                    <p>아우디 Q4 e-트론의 새로운 디지털 주간 주행등은 주문 제작이 가능하며 보는 사람과 소통하는 다이내믹 라이트 시퀀스를 표시합니다.</p>
-                    <NuxtLink to="/stories/technology/light-as-a-means-of-communication/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                    <p class="type2">Q4 e-트론 <br>복합 전기 소비량: 19.5~16.2kWh/100km(WLTP), 복합 CO₂ 배출량: 0g/km(WLTP)<br>NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech11.jpg" alt="그냥 기분이 좋아요.">
-                    </div>
-                    <h3>"그냥 기분이 좋아요."</h3>
-                    <p>스노보드 선수인 아나 가서(Anna Gasser)는 대부분의 시간을 자연에서 보냅니다. 지속 가능성은 모빌리티를 포함하여 그녀의 삶에서 중요한 역할을 합니다. 아우디 e-트론 스토리의 이번 편에서 그녀가 아우디 Q4 e-트론을 선택한 이유에 관해 말합니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                    <p class="type2">Q4 e-트론<br>복합 전기 소비량: 19.5~16.2kWh/100km(WLTP), 복합 CO₂ 배출량: 0g/km(WLTP)<br>NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech12.jpg" alt="일반적으로 '효율 모드'로 운전합니다.">
-                    </div>
-                    <h3>"일반적으로 '효율 모드'로 운전합니다."</h3>
-                    <p>톰 크리스텐센(Tom Kristensen)은 20년이 넘게 아우디의 레이스 드라이버였습니다. 그러나 그는 레이스에서 순수 전기차를 운전한 적이 없습니다. 하지만 아우디 e-트론 스토리의 이번 에피소드에서 그는 이제 전기로 전환되는 일상적인 자동차 생활에 대한 인사이트를 제시합니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                    <p class="type2">NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech13.jpg" alt="저는 도로에 있을 때 항상 매우 여유가 있습니다.">
-                    </div>
-                    <h3>"저는 도로에 있을 때 항상 매우 여유가 있습니다."</h3>
-                    <p>스위스 최고의 셰프인 안드레아스 카미나다(Andreas Caminada)는 간편한 e-모빌리티 홍보대사입니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                    <p class="type2">NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech14.jpg" alt="우리가 원하는 다른 주행 경험이란 어떤 것일까요?">
-                    </div>
-                    <h3>"우리가 원하는 다른 주행 경험이란 어떤 것일까요?"</h3>
-                    <p>Holoride의 CEO인 닐스 월니(Nils Wollny)는 디지털 영역에서 영향력을 행사하고 싶다면 물리적 세계의 마법이 필요하다고 말합니다. 이 아우디 e-트론 스토리에서 그는 미래에 자동차가 할 수 있는 역할, e-모빌리티로 가는 길을 찾은 방법, 초창기의 작은 문제들을 고민하지 않아도 되는 이유를 설명합니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech15.jpg" alt="LED에서 매트릭스 LED 및 OLED 기술까지 아우르는 라이트 기술">
-                    </div>
-                    <h3>LED에서 매트릭스 LED 및 OLED 기술까지 아우르는 라이트 기술</h3>
-                    <p>더 나은 가시성, 더 정밀한 조명: 아우디는 차량의 헤드라이트와 테일라이트를 통해 끊임없이 기술적 우위를 구축하고 있습니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech16.jpg" alt="짜릿한 사운드">
-                    </div>
-                    <h3>짜릿한 사운드</h3>
-                    <p>아우디 사운드 엔지니어인 루돌프 할프마이어(Rudolf Halbmeir)와 슈테판 그젤(Stephan Gsell)은 아우디 e-트론 GT 콰트로 모델의 사운드를 개발했습니다. 여기서는 비하인드 스토리를 알아보고 창의적 과정, 영감의 원천, 남은 과제를 살펴보겠습니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                    <p class="type2">NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech17.jpg" alt="몰입형 사운드 경험">
-                    </div>
-                    <h3>몰입형 사운드 경험</h3>
-                    <p>아우디의 전문가들은 오디오 애호가를 위한 차에서 몰입형 사운드 경험을 형성합니다. 아우디 사운드 랩을 방문했습니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech18.jpg" alt="공기역학: 소수점 기록">
+        <div class="detail--container">
+            <div class="title--wrap">
+                <h2 class="en">Technology</h2>
+                <p>기술을 통한 진보. 진보적인 기술과 열정적인 창의성이 현재를 위한 매력적인 차량과 솔루션을 만들어냅니다. 혁신이 성공의 핵심인 이유를 발견해보세요.</p>
+            </div>
+            <div class="content--wrap">
+                <div class="tech--card--wrap">
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech1.jpg" alt="Evolution x Vision: 아우디의 콰트로 드라이브">
+                        </div>
+                        <h3>Evolution x Vision: 아우디의 콰트로 드라이브</h3>
+                        <p>45년 동안, 아우디의 콰트로 드라이브는 '기술을 통한 진보' (Vorsprung durch Technik) 를 독창적인 방식으로 경험할 수 있게 해왔습니다. 오늘날 아우디는 이 성공 스토리를 꾸준히 이어가고 있습니다.</p>
+                        <NuxtLink to="/stories/technology/45-years-audi-quattro-drive">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech2.jpg" alt="A6 스포트백 e-tron: 역대 가장 공기역학적인 아우디">
+                        </div>
+                        <h3>A6 스포트백 e-tron: 역대 가장 공기역학적인 아우디</h3>
+                        <p>아우디 A6 스포트백 e-tron이 Cd 값 0.21을 달성하며 아우디 역사에 또 하나의 기록을 남겼습니다. 역대 가장 공기역학적인 아우디 차량임과 동시에, 폭스바겐 그룹 내 해당 세그먼트 전체를 통틀어 선두에 서는 기록입니다.</p>
+                        <NuxtLink to="/stories/technology/a6-sportback-e-tron-the-most-aerodynamic-audi-of-all-time/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech3.jpg" alt="소리를 '맛보다': 아우디 A6 e-tron의 새로운 사운드 경험">
+                        </div>
+                        <h3>소리를 '맛보다': 아우디 A6 e-tron의 새로운 사운드 경험</h3>
+                        <p>아우디 사운드 랩에서는 신형 The new Audi A6 e-tron에서 엔터테인먼트와 정보를 특별한 사운드 경험으로 바꾸기 위한 시스템을 개발하고 있습니다.</p>
+                        <NuxtLink to="/stories/technology/acoustic-umami-the-sound-experience-in-the-audi-a6-e-tron/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech4.jpg" alt="일상에 최적화된 만능 SUV: The new Audi Q5">
+                        </div>
+                        <h3>일상에 최적화된 만능 SUV: The new Audi Q5</h3>
+                        <p>아우디 Q5는 진정한 다재다능함의 상징입니다. 2008년 첫 등장 이후 SUV 두 세대에 걸쳐 Q5는 수많은 고객들에게 큰 사랑을 받아왔습니다.</p>
+                        <NuxtLink to="/stories/technology/the-all-rounder-for-every-day--the-audi-q5/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech5.jpg" alt="헤이 아우디, 나 발이 시려워!">
+                        </div>
+                        <h3>"헤이 아우디, 나 발이 시려워!"</h3>
+                        <p>음성 명령으로 차량 및 인포테인먼트 기능을 제어하는 아우디 어시스턴트는 아우디와의 상호작용을 새로운 차원으로 끌어올립니다. 그리고 훨씬 더 다양한 기능을 제공하죠.</p>
+                        <NuxtLink to="/stories/technology/hey-audi-ich-habe-kalte-fuesse/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech6.jpg" alt="MHEV plus: 아우디의 차세대 하이브리드 기술">
+                        </div>
+                        <h3>MHEV plus: 아우디의 차세대 하이브리드 기술</h3>
+                        <p>파워트레인 제너레이터(PTG)를 전기모터로 활용하는 MHEV plus 기술은 부분 전기 구동을 통해 한층 향상된 효율성을 실현합니다.</p>
+                        <NuxtLink to="/stories/technology/mhev-plus-the-next-generation-of-hybridization-at-audi/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech7.jpg" alt="전기 주행 경험을 위한 새 기반">
+                        </div>
+                        <h3>전기 주행 경험을 위한 새 기반</h3>
+                        <p>신형 프리미엄 플랫폼 일렉트릭(Premium Platform Electric, PPE)을 기반으로 한 아우디 Q6 e-tron은 주행 거리, 충전 성능, 디자인 전반에서 새로운 기준을 제시합니다.</p>
+                        <NuxtLink to="/stories/technology/the-new-basis-for-electrified-driving-experiences">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech8.jpg" alt="차별화: The new Audi Q6 e-tron의 라이트 기술">
+                        </div>
+                        <h3>차별화: The new Audi Q6 e-tron의 라이트 기술</h3>
+                        <p>The new Audi Q6 e-tron에 적용된 액티브 디지털 라이트 시그니처는 세계 최초로 선보이는 기술입니다. 또한 후미등과 헤드라이트에 탑재된 커뮤니케이션 라이트는 도로 안전을 향상시킵니다. 두 기능 모두 2세대 디지털 OLED 기술과 디지털 주간 주행등이 결합되어 구현됐습니다.</p>
+                        <NuxtLink to="/stories/technology/unique-the-lighting-technology-of-the-audi-q6-e-tron/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech9.jpg" alt="눈 속 전기차의 운동신경">
+                        </div>
+                        <h3>눈 속 전기차의 운동신경</h3>
+                        <p>눈과 얼음 위에서 전기차를 안전하게 운전하는 방법은 무엇일까요? 스타 스키 선수 아나 파이트(Anna Veith)의 아우디 드라이빙 익스피리언스에서 알아보세요.</p>
+                        <NuxtLink to="/stories/technology/electric-athleticism-in-the-snow/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech10.jpg" alt="커뮤니케이션의 수단인 라이트">
+                        </div>
+                        <h3>커뮤니케이션의 수단인 라이트</h3>
+                        <p>아우디 Q4 e-트론의 새로운 디지털 주간 주행등은 주문 제작이 가능하며 보는 사람과 소통하는 다이내믹 라이트 시퀀스를 표시합니다.</p>
+                        <NuxtLink to="/stories/technology/light-as-a-means-of-communication/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                        <p class="type2">Q4 e-트론 <br>복합 전기 소비량: 19.5~16.2kWh/100km(WLTP), 복합 CO₂ 배출량: 0g/km(WLTP)<br>NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech11.jpg" alt="그냥 기분이 좋아요.">
+                        </div>
+                        <h3>"그냥 기분이 좋아요."</h3>
+                        <p>스노보드 선수인 아나 가서(Anna Gasser)는 대부분의 시간을 자연에서 보냅니다. 지속 가능성은 모빌리티를 포함하여 그녀의 삶에서 중요한 역할을 합니다. 아우디 e-트론 스토리의 이번 편에서 그녀가 아우디 Q4 e-트론을 선택한 이유에 관해 말합니다.</p>
+                        <NuxtLink to="/stories/technology/it-just-feels-good/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                        <p class="type2">Q4 e-트론<br>복합 전기 소비량: 19.5~16.2kWh/100km(WLTP), 복합 CO₂ 배출량: 0g/km(WLTP)<br>NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech12.jpg" alt="일반적으로 '효율 모드'로 운전합니다.">
+                        </div>
+                        <h3>"일반적으로 '효율 모드'로 운전합니다."</h3>
+                        <p>톰 크리스텐센(Tom Kristensen)은 20년이 넘게 아우디의 레이스 드라이버였습니다. 그러나 그는 레이스에서 순수 전기차를 운전한 적이 없습니다. 하지만 아우디 e-트론 스토리의 이번 에피소드에서 그는 이제 전기로 전환되는 일상적인 자동차 생활에 대한 인사이트를 제시합니다.</p>
+                        <NuxtLink to="/stories/technology/i-usually-drive-in-efficiency-mode/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                        <p class="type2">NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech13.jpg" alt="저는 도로에 있을 때 항상 매우 여유가 있습니다.">
+                        </div>
+                        <h3>"저는 도로에 있을 때 항상 매우 여유가 있습니다."</h3>
+                        <p>스위스 최고의 셰프인 안드레아스 카미나다(Andreas Caminada)는 간편한 e-모빌리티 홍보대사입니다.</p>
+                        <NuxtLink to="/stories/technology/i-am-always-very-relaxed-when-i-am-on-the-road/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                        <p class="type2">NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech14.jpg" alt="우리가 원하는 다른 주행 경험이란 어떤 것일까요?">
+                        </div>
+                        <h3>"우리가 원하는 다른 주행 경험이란 어떤 것일까요?"</h3>
+                        <p>Holoride의 CEO인 닐스 월니(Nils Wollny)는 디지털 영역에서 영향력을 행사하고 싶다면 물리적 세계의 마법이 필요하다고 말합니다. 이 아우디 e-트론 스토리에서 그는 미래에 자동차가 할 수 있는 역할, e-모빌리티로 가는 길을 찾은 방법, 초창기의 작은 문제들을 고민하지 않아도 되는 이유를 설명합니다.</p>
+                        <NuxtLink to="/stories/technology/how-did-we-ever-want-to-drive-anything-else/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech15.jpg" alt="LED에서 매트릭스 LED 및 OLED 기술까지 아우르는 라이트 기술">
+                        </div>
+                        <h3>LED에서 매트릭스 LED 및 OLED 기술까지 아우르는 라이트 기술</h3>
+                        <p>더 나은 가시성, 더 정밀한 조명: 아우디는 차량의 헤드라이트와 테일라이트를 통해 끊임없이 기술적 우위를 구축하고 있습니다.</p>
+                        <NuxtLink to="/stories/technology/from-led-to-matrix-led-and-oled-technology">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech16.jpg" alt="짜릿한 사운드">
+                        </div>
+                        <h3>짜릿한 사운드</h3>
+                        <p>아우디 사운드 엔지니어인 루돌프 할프마이어(Rudolf Halbmeir)와 슈테판 그젤(Stephan Gsell)은 아우디 e-트론 GT 콰트로 모델의 사운드를 개발했습니다. 여기서는 비하인드 스토리를 알아보고 창의적 과정, 영감의 원천, 남은 과제를 살펴보겠습니다.</p>
+                        <NuxtLink to="/stories/technology/electrifying-sound/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                        <p class="type2">NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.</p>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech17.jpg" alt="몰입형 사운드 경험">
+                        </div>
+                        <h3>몰입형 사운드 경험</h3>
+                        <p>아우디의 전문가들은 오디오 애호가를 위한 차에서 몰입형 사운드 경험을 형성합니다. 아우디 사운드 랩을 방문했습니다.</p>
+                        <NuxtLink to="/stories/technology/an-immersive-sound-experience/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech18.jpg" alt="공기역학: 소수점 기록">
+                        </div>
+                        <h3>공기역학: 소수점 기록</h3>
+                        <p>아주 작은 공기역학적 개선도 전기차의 주행 거리를 늘려줍니다. 아우디의 공기역학/공기음향 개발 책임자인 모니 이슬람(Moni Islam) 박사가 아우디 e-트론 모델의 완벽을 향한 노력에 대해 이야기합니다.</p>
+                        <NuxtLink to="/stories/technology/aerodynamics-scoring-decimal-points/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                    </div>
+                    <div class="tech--card">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech19.jpg" alt="디지털 필수품">
+                        </div>
+                        <h3>디지털 필수품</h3>
+                        <p>라이너 데닝거(Rainer Denninger)에 따르면 아우디 스마트폰 인터페이스는 이제 필수품이 되었습니다.</p>
+                        <NuxtLink to="/stories/technology/a-digital-must-have/">자세히 알아보기 <i class="ico"></i></NuxtLink>
+                        <p class="type2">
+                            복합 전력 소비량: NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.
+                        </p>
                     </div>
-                    <h3>공기역학: 소수점 기록</h3>
-                    <p>아주 작은 공기역학적 개선도 전기차의 주행 거리를 늘려줍니다. 아우디의 공기역학/공기음향 개발 책임자인 모니 이슬람(Moni Islam) 박사가 아우디 e-트론 모델의 완벽을 향한 노력에 대해 이야기합니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                </div>
-                <div class="tech--card">
-                    <div class="img--wrap">
-                        <img src="/img/stories/technology/img--tech19.jpg" alt="디지털 필수품">
-                    </div>
-                    <h3>디지털 필수품</h3>
-                    <p>라이너 데닝거(Rainer Denninger)에 따르면 아우디 스마트폰 인터페이스는 이제 필수품이 되었습니다.</p>
-                    <NuxtLink to="/">자세히 알아보기 <i class="ico"></i></NuxtLink>
-                    <p class="type2">
-                        복합 전력 소비량: NEDC가 아닌 WLTP에 따른 사용 및 배출 값만 차량에 사용할 수 있습니다.
-                    </p>
                 </div>
             </div>
         </div>

app/pages/stories/technology/the-new-basis-for-electrified-driving-experiences.vue

@@ -0,0 +1,109 @@
+<template>
+    <main>
+        <div class="detail--container">
+            <section class="title--section">
+                <h2>전기 주행 경험을 위한 새 기반</h2>
+                <h3>신형 프리미엄 플랫폼 일렉트릭(Premium Platform Electric, PPE)을 기반으로 한 아우디 Q6 e-tron은 주행 거리, 충전 성능, 디자인 전반에서 새로운 기준을 제시합니다.</h3>
+                <p class="desc">읽기 시간: 5분 - Copy: Patrick Morda - Photo: AUDI AG, Robert Fischer Nadia Riaz-Ahmed - 2024. 03. 05.</p>
+            </section>
+            <section class="img--section">
+                <div class="img--wrap">
+                    <img src="/img/stories/technology/img--tech7--detail1.jpg" alt="">
+                </div>
+                <div class="desc--wrap">
+                    <p>아우디 Q6 e-tron는 아우디 최초로 PPE 플랫폼을 탑재한 순수 전기차 라인업입니다. 아우디에게 있어 이는 커넥티드 전기 프리미엄 모빌리티를 향한 일보전진입니다.</p>
+                </div>
+            </section>
+            <section class="desc--section mid--type mt--60 mb--60">
+                <p>신형 아우디 Q6 e-tron 전기차를 통해 아우디는 순수 전기차 제품군을 체계적으로 확대하고 있습니다. 주행 성능, 충전 성능, 효율성, 주행 거리, 인테리어 경험 등 다방면에서 인상적인 모습을 보여줍니다. 이를 가능하게 하는 핵심은 전기차를 위해 특별히 개발된 플랫폼입니다. 아우디 Q6 e-tron 시리즈는  아우디가 포르쉐와 공동 개발한 신형 PPE 플랫폼을 탑재한 첫 모델입니다.<br><br>“PPE와 같은 플랫폼의 가장 큰 장점은 바로 높은 유연성입니다.” 아우디 Q6 e-tron과 향후 PPE 기반으로 선보일 아우디 모델의 제품 마케팅을 담당하는 피터 히르슈펠트(Peter Hirschfeld)는 말합니다. 그는 PPE를 ‘모듈 시스템’에 비유하며 휠베이스, 트레드, 차량 높이 등을 조정할 수 있다고 설명합니다. PPE는 프리미엄 전기 모빌리티 설계에서 큰 진전이며, ‘기술을 통한 진보’ 라는 아우디의 철학과 완전히 일치합니다.</p>
+                <h3 class="mt--60">프리미엄 전기 모빌리티를 위한 일관적인 설계</h3>
+                <p>전기차의 개별 구성 요소를 조합한 패키지는 내연기관차보다 높은 자유도를 제공합니다. “그 결과, 고객은 디자인이나 일상에서의 활용성 측면에서 가시적이고 실질적인 이점을 얻습니다.”  PPE 설계에서는 외관 디자인에 특히 중점을 두어, 긴 휠베이스와 짧은 오버행이라는 프리미엄 특유의 비율이 구현되었습니다. 히르슈펠트  “이런 부분에서 아우디 DNA에 기반한 스포티함과 우수한 디자인이 드러납니다.” 라고 말합니다.<br><br>또한, 긴 휠베이스와 전기 구동 기술의 결합으로 실내 공간은 더욱 넓어졌습니다. “그 덕분에 우리가 고객에게 새로운 차량 실내 경험을 제공할 수 있는 여지가 훨씬 커졌습니다.” 히르슈펠트는 무엇보다 고객의 시선을 가장 먼저 생각합니다. “제 역할은 고객의 입장에서 생각하고, 그들의 니즈를 모델 개발과 시장 출시 이후까지, 전체 제품 수명 주기 전반에 걸쳐 반영하는 것입니다.”</p>
+            </section>
+            <section class="img--section type2">
+                <div class="img--box">
+                    <div class="img--wrap">
+                        <img src="/img/stories/technology/img--tech7--detail2.jpg" alt="">
+                    </div>
+                    <div class="desc--wrap">
+                        <p>아우디는 PPE를 통해 여러 부문에서 높은 기술성을 갖춘 순수 전기차를 출시할 수 있게 되었습니다.</p>
+                    </div>
+                </div>
+                <div class="img--box">
+                    <div class="img--wrap">
+                        <img src="/img/stories/technology/img--tech7--detail3.jpg" alt="">
+                    </div>
+                    <div class="desc--wrap">
+                        <p>피터 히르슈펠트는 특히 아우디 Q6 e-tron 및 기타 e-tron 전기차 모델과 관련해 고객의 요구사항에 주의를 기울입니다.</p>
+                    </div>
+                </div>
+            </section>
+            <section class="title--section mt--60 mb--60">
+                <h2 class="">“PPE 플랫폼의 신형 아우디 Q6 e-tron는 정말 인상적입니다.”</h2>
+                <p class="">피터 히르슈펠트</p>
+            </section>
+            <section class="img--section">
+                <div class="img--wrap">
+                    <img src="/img/stories/technology/img--tech7--detail4.jpg" alt="">
+                </div>
+                <div class="desc--wrap">
+                    <p>신형 아우디 Q6 e-tron은 PPE 플랫폼을 탑재한 고성능 순수 전기 SUV입니다. 긴 휠베이스와 짧은 오버행이 스포티함과 우수한 디자인을 돋보이게 합니다.</p>
+                </div>
+            </section>
+            <section class="desc--section mid--type mt--60">
+                <p><b>고객 입장에서 생각하기</b><br>피터 히르슈펠트는 매력적인 디자인 외에도, 현대 모빌리티의 필수 요소이자 PPE 개발에서도 요구되는 세 가지 핵심 요소에 집중했습니다. “무엇보다도 사람들은 장거리 주행에 적합한 긴 주행 거리, 우수한 충전 성능, 그리고 마지막으로 아우디 특유의 주행 경험을 갖추기를 기대합니다.” 아우디 Q6 e-tron같은 PPE 플랫폼 차량에 쓰이는 배터리와 전기 모터를 개선함으로써 에너지 소비량이 크게 감소함과 동시에 전력 밀도(kW/kg)와 토크 밀도(Nm/kg)는 크게 향상되었습니다. 히르슈펠트에 의하면, “PPE 플랫폼 개발자 및 엔지니어들은 전기차에 들어가는 모든 구성 요소를 세세히 살피며 최적화합니다.” 그 결과, 신형 아우디 Q6 e-tron는 620km가 넘는 주행 거리를 자랑합니다.<br><br>히르슈펠트는 “전기차의 주행 거리를 말할 때는 충전 속도도 반드시 고려해야 합니다.”라고 말합니다. PPE플랫폼은 800V 온보드 시스템을 탑재하고 있어 아우디 Q6 e-tron을 최대 270kW로 충전할 수 있습니다. HV 배터리의 효율적인 열 관리 기능 덕분에 적절한 갖춰진 충전소에서는 20분이 조금 넘는 시간 동안 배터리 용량을10%에서 80%까지 충전이 가능합니다. “열 관리 시스템은 배터리를 냉각시킬 뿐만 아니라 저온 환경에서도 높은 충전 성능을 유지할 수 있도록 사전 예열 기능도 제공합니다. 따라서 아우디 Q6 e-tron는 실제로 10분가량만 충전하면 250 km이상 주행 가능한 수준입니다.</p>
+            </section>
+            <section class="img--section type2">
+                <div class="img--box">
+                    <div class="img--wrap">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech7--detail5.jpg" alt="">
+                        </div>
+                    </div>
+                    <div class="desc--wrap">
+                        <p>피터 히르슈펠트에게 PPE플랫폼은 기술적 성과이자 ‘기술을 통한 진보’ 구현 그 자체입니다.</p>
+                    </div>
+                </div>
+                <div class="img--box">
+                    <div class="img--wrap">
+                        <img src="/img/stories/technology/img--tech7--detail6.jpg" alt="">
+                    </div>
+                    <div class="desc--wrap">
+                        <p>PPE는 트랙 너비, 휠베이스, 지상고 면에서 향후 개발될 아우디 모델에 높은 유연성을 제공합니다.</p>
+                    </div>
+                </div>
+            </section>
+            <section class="desc--section mid--type mt--60 mb--60">
+                <p><b>느낌이 어떠냐고요? 모든 면에서 아우디 그 자체죠.</b><br>아우디만의 느낌은 어떨까요? “곧 아우디 Q6 e-tron에서 직접 경험하실 수 있습니다.” 라고 히르슈펠트가 약속합니다. 그는 이미 시승을 통해 아우디만의 감각을 경험했습니다. 여기에는 주행 경험은 물론, 점점 더 중요해지고 있는 디지털 서비스와 사용자 경험도 포함됩니다. “그렇기 때문에 PPE와 함께 E³ 1.2라는 신형 전기 아키텍처를 공동 개발했습니다.” E1.2는 컨트롤 유닛과 도메인 컴퓨터 간의 고성능 네트워크뿐 아니라, 다양한 고객 중심의 백엔드 서비스를 통합한 것이 특징입니다. 무엇보다도, 이 새로운 전기 아키텍처는 미래 혁신과 신규 기능을 가능하게 하는 기술적 기반 역할을 합니다.<br><br>히르슈펠트가 말하는 내용은 신형 아우디 Q6 e-tron에 탑승하면 바로 경험할 수 있습니다. 디스플레이와 조작 시스템이 완전히 새로워졌으며, 내비게이션을 포함한 다양한 기능도 업그레이드 되었습니다. E³는 신형 아우디 Q6 e-tron에서 끊김 없는 디지털 경험을 제공합니다. “우리는 넓은 실내 공간을 디지털 스테이지로 만들어, 고객들에게 특별한 경험을 선사합니다.” 이제 아우디 Q6 e-tron에서는 운전자는 물론 동승자도 각자의 네트워크 연결 디스플레이를 사용할 수 있습니다.<br><br>“전기차는 중독적인 것 같습니다. PPE 기반의 아우디 Q6 e-tron은 섀시, 신규 전기 모터, 일상 속 실용성, 실내 경험까지 모두를 아우르는 완성도로 깊은 인상을 남깁니다.”</p>
+            </section>
+            <section class="img--section type2">
+                <div class="img--box">
+                    <div class="img--wrap">
+                        <div class="img--wrap">
+                            <img src="/img/stories/technology/img--tech7--detail7.jpg" alt="">
+                        </div>
+                    </div>
+                    <div class="desc--wrap">
+                        <p>PPE는 아우디 Q6 e-tron처럼 차체 하부가 높은 SUV는 물론, 향후 출시될 살룬형 플랫 플로어 모델에도 적용할 수 있습니다.</p>
+                    </div>
+                </div>
+                <div class="img--box">
+                    <div class="img--wrap">
+                        <img src="/img/stories/technology/img--tech7--detail8.jpg" alt="">
+                    </div>
+                    <div class="desc--wrap">
+                        <p>PPE 개발 단계에서는 ‘기술을 통한 진보’를 실질적인 경험으로 구현하기 위해 심혈을 기울였고, 이를 아우디 Q6 e-tron에서 실감할 수 있습니다.</p>
+                    </div>
+                </div>
+            </section>
+            <section class="img--desc--section mt--60 mb--200">
+                <div class="img--wrap">
+                    <img src="/img/stories/technology/img--tech7--detail9.jpg" alt="">
+                </div>
+                <div class="desc--wrap">
+                    <h3>동종 최초</h3>
+                    <p>아우디 Q6 e-tron은 아우디 전기차 라인업에 새롭게 합류한 최신 순수 전기 SUV입니다. 새로운 PPE 플랫폼을 바탕으로, 아우디 Q6 e-tron은 실내 경험, 전자 아키텍처, 충전·배터리 기술, 디자인 전반에 걸쳐 혁신을 보여줍니다. 새로운 프리미엄 SUV에 대해 알아보세요.</p>
+                </div>
+            </section>
+        </div>
+    </main>
+</template>

nuxt.config.ts

@@ -31,8 +31,9 @@ export default defineNuxtConfig({
   },
   css: [
     '~/assets/scss/style.scss',
+    '~/assets/scss/media.scss',
     '~/assets/scss/admin.scss',
-    '~/assets/scss/responsive.scss'
+    '~/assets/scss/responsive.scss',
   ],
   vite: {
     css: {