feat: srs 플러스 추가

assets/css/pdp_detail.css

@@ -2247,11 +2247,11 @@
 .displayTheme + .comp_1x_b_v_s_b .image_area {
   height: auto;
 }
-.displayTheme .comp_body .text_area h5 {
+.displayTheme .comp_body .swiper-slide .text_area h5 {
   font-size: 3rem;
 }
 @media (max-width: 768px) {
-  .displayTheme .comp_body .text_area h5 {
+  .displayTheme .comp_body .swiper-slide .text_area h5 {
     font-size: 2rem;
   }
 }
@@ -2291,6 +2291,12 @@
   background-color: #000;
 }
 
+@media (max-width: 768px) {
+  .inCarGame.comp_1x_w_v_o_b .image_area {
+    overflow: hidden;
+    height: 80rem;
+  }
+}
 .inCarGame .visualBg {
   position: absolute;
   width: 100%;
@@ -2448,7 +2454,7 @@
 }
 .inCarGame .comp_top {
   z-index: 2;
-  height: 27.5vw;
+  height: 340px;
   max-height: 529px;
 }
 @media (max-width: 768px) {
@@ -2592,9 +2598,14 @@
 .inCarGame + .comp_1x_b_v_s_b .dtlImgs.theme12 .text_theme12 {
   display: block;
 }
-.inCarGame .comp_body .text_area h5 {
+.inCarGame .comp_body .swiper-slide .text_area h5 {
   font-size: 3rem;
 }
+@media (max-width: 768px) {
+  .inCarGame .comp_body .swiper-slide .text_area h5 {
+    font-size: 2rem;
+  }
+}
 .inCarGame .inCarGameDtl {
   overflow: hidden;
   border-radius: 0.8rem;
@@ -2796,4 +2807,96 @@
   position: relative;
   z-index: 2;
 }
+
+.streamingPremium .mobile {
+  display: none;
+}
+@media (max-width: 768px) {
+  .streamingPremium .web {
+    display: none;
+  }
+  .streamingPremium .mobile {
+    display: block;
+    -o-object-fit: initial;
+       object-fit: initial;
+    height: auto;
+  }
+}
+.streamingPremium.comp_1x_b_v_s_b {
+  margin-top: 4rem;
+}
+.streamingPremium.comp_1x_b_v_s_b .mt-12 {
+  margin-top: 6rem;
+}
+@media (max-width: 768px) {
+  .streamingPremium.comp_1x_w_v_o_b .image_area {
+    overflow: hidden;
+    height: 80rem;
+  }
+}
+.streamingPremium .visualBg {
+  overflow: hidden;
+  position: relative;
+  width: 100%;
+  max-width: 192rem;
+  max-height: 70rem;
+}
+@media (max-width: 768px) {
+  .streamingPremium .visualBg {
+    max-height: auto;
+  }
+}
+.streamingPremium .visualBg img {
+  width: 100%;
+}
+.streamingPremium.comp_wide .comp_body.layer_up .text_area {
+  margin-top: 7rem;
+}
+.streamingPremium.comp_wide .comp_body.layer_up .text_area .info {
+  line-height: 1.5;
+}
+.streamingPremium.comp_wide .comp_body.layer_up .text_area .info br {
+  display: none;
+}
+@media (max-width: 768px) {
+  .streamingPremium.comp_wide .comp_body.layer_up .text_area .info br {
+    display: block;
+  }
+}
+@media (max-width: 768px) {
+  .streamingPremium.comp_wide .comp_body .text_area {
+    margin-top: 3rem;
+  }
+  .streamingPremium.comp_wide .comp_body .text_area h3 {
+    font-size: 3rem;
+    line-height: 4rem;
+  }
+  .streamingPremium.comp_wide .comp_body .text_area .info {
+    font-size: 1.4rem;
+  }
+}
+.streamingPremium.comp_1x_b_v_s_b .image_area {
+  height: auto;
+}
+.streamingPremium .comp_top {
+  z-index: 2;
+}
+.streamingPremium .comp_top .comp_body .text_area h3 {
+  margin-bottom: 2rem;
+}
+.streamingPremium .comp_top .comp_body .text_area > * {
+  flex: 1;
+}
+.streamingPremium .comp_md {
+  position: absolute;
+  z-index: 2;
+  top: 0;
+  height: 48rem;
+  background-color: rgba(0, 0, 0, 0);
+}
+@media (max-width: 768px) {
+  .streamingPremium .comp_md {
+    height: 3rem;
+  }
+}
 /*# sourceMappingURL=pdp_detail.css.map */

assets/css/pdp_detail.scss

@@ -2150,8 +2150,7 @@
 
         }
     }
-
-    .comp_body .text_area h5 {
+    .comp_body .swiper-slide .text_area h5 {
         font-size: 3rem;
         @include maxtablet{
             font-size: 2rem;
@@ -2199,6 +2198,14 @@
 }
  
 .inCarGame {
+    &.comp_1x_w_v_o_b {
+        .image_area {
+            @include maxtablet{
+                overflow: hidden;
+                height: 80rem;
+            }
+        }
+    }
     .visualBg {
         position: absolute;
         width: 100%;
@@ -2362,7 +2369,7 @@
     .comp_top {
         z-index: 2;
         // height: 46rem;
-        height: 27.5vw;
+        height: 340px;
         max-height: 529px;
         @include maxtablet{
             height: 43.9rem;
@@ -2478,8 +2485,12 @@
         }
     }
 
-    .comp_body .text_area h5 {
+    .comp_body .swiper-slide .text_area h5 {
         font-size: 3rem;
+        
+        @include maxtablet{
+            font-size: 2rem;
+        }
     }
     .inCarGameDtl {
         overflow: hidden;
@@ -2680,3 +2691,113 @@
     z-index: 2;
 }
 
+
+.streamingPremium {
+    
+    .mobile {display: none;}
+
+    @include maxtablet{
+        .web {display: none;}
+        .mobile {
+            display: block;
+            object-fit: initial;
+            height: auto;
+        }
+    }
+    &.comp_1x_b_v_s_b {
+        margin-top:4rem;
+        .mt-12 {
+            margin-top:6rem;
+        }
+    }
+    &.comp_1x_w_v_o_b {
+        .image_area {
+            @include maxtablet{
+                overflow: hidden;
+                height: 80rem;
+            }
+        }
+    }
+    .visualBg {
+        overflow: hidden;
+        position: relative;
+        width: 100%;
+        max-width: 192rem;
+        max-height: 70rem;
+        @include maxtablet{
+            max-height: auto;
+        }
+        img {
+            width: 100%;
+
+        }
+    }
+
+    &.comp_wide {
+        .comp_body {
+            &.layer_up {
+                .text_area {
+                    margin-top:7rem;
+                    .info {
+                        line-height: 1.5;
+                        br {
+                            display: none;
+                            @include maxtablet{
+                                display: block;
+                            }
+                        }
+
+                    }
+                }
+            }
+            .text_area {
+                @include maxtablet{
+                    margin-top: 3rem;
+                    h3 {
+                        font-size: 3rem;
+                        line-height: 4rem;
+                    }
+                    .info {
+                        font-size: 1.4rem;
+                    }
+                }
+
+            }
+        }
+    }
+
+    &.comp_1x_b_v_s_b {
+        .image_area {
+            height: auto;
+        }
+    }
+
+    .comp_top {
+        z-index: 2;
+        // height: 70rem;
+        // @include maxtablet{
+        //     height: 43.9rem;
+        // }
+        .comp_body  {
+            .text_area {
+                // display: flex;
+                h3 {
+                    margin-bottom:2rem;
+                }
+                > * {
+                    flex:1;
+                }
+            }
+        }
+    }
+    .comp_md {
+        position: absolute;
+        z-index: 2;
+        top: 0;
+        height: 48rem;
+        background-color: rgba(0,0,0,0);
+        @include maxtablet{
+            height: 3rem;
+        }
+    }
+}

assets/js/common.js

@@ -422,12 +422,12 @@ function pdpInCarGameSwiper(){
         var swiperTheme = new Swiper(".pdpInCarGameSwiper", {
             slidesPerView: "auto",
             loop:true,  
-            freeMode: true,
+            freeMode: false,
             autoplay: {
-                delay:1,
+                delay:0,
                 disableOnInteraction: false,
             },
-            speed: 2400,
+            speed: 3000,
             breakpoints: {
                 // when window width is >= 320px
                 320: {

product/pdp_in_car_game.html

@@ -447,7 +447,7 @@
                     퍼즐 자르기
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    아주 독특한 퍼즐 게임을 해보세요. 각 조각에 공이 하나만 남도록 도형을 잘라내야 합니다. 꽤 간단한 것 같죠? 120개의 레벨을 모두 통과하려면 뛰어난 지략과 관찰력, 손재주가 필요합니다.
                 </p>
             </div>
             <div class="text_area text_theme2">
@@ -455,7 +455,7 @@
                     마인드 게임
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    이 게임은 신중하게 생각하는 것을 좋아하는 사람들을 위해 엄선된 6종의 셀렉션입니다. 사고력을 자극하고, 인식 속도 및 상황추론 능력을 향상시켜 보세요. 최적의 솔루션을 찾을 수 있는 능력을 개발할 수 있습니다.
                 </p>
             </div>
             <div class="text_area text_theme3">
@@ -463,7 +463,7 @@
                     다른 그림 찾기
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    힌트를 사용하지 않고 두 사진의 차이점을 찾으세요. 4개의 시즌에서 5가지 게임 모드를 모두 발견하세요. 탐정이 되어 봄, 여름, 가을, 겨울의 80단계의 아름다운 이미지와 놀라운 풍경을 잠금 해제하세요.
                 </p>
             </div>
             <div class="text_area text_theme4">
@@ -471,7 +471,7 @@
                     우드 벤처
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    마작 커넥트 게임에는 간단한 규칙이 있습니다. 두 타일 사이의 경로에 최대 2회전이 있으면 두 타일을 연결할 수 있습니다. 당신의 목표는 전체 보드를 클리어하는 것입니다.
                 </p>
             </div>
             <div class="text_area text_theme5">
@@ -479,7 +479,7 @@
                     스펀지밥 런
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    플랑크톤의 사악한 로봇들이 크러스티 크랩을 훔쳤고, 그것을 되찾는 것은 당신에게 달려 있습니다! 피클을 잡고, 플랫폼을 뛰어넘고, 각 레벨을 이기기 위해 해파리를 피하세요. 여러분의 친구 패트릭 스타와 샌디 칙스를 만나면, 그들은 여러분이 게임에서 이기도록 도와줄 아주 멋진 파워업을 제공할지도 모릅니다!
                 </p>
             </div>
             <div class="text_area text_theme6">
@@ -487,7 +487,7 @@
                     벽돌 깨기 퀘스트
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    벽돌을 향해서 공들을 발사해 봅시다. 모든 벽돌을 부수면 스테이지 클리어. 마음을 편하게 하세요! 최고의 킬링타임 게임!
                 </p>
             </div>
             <div class="text_area text_theme7">
@@ -503,7 +503,7 @@
                     타워 디펜스 킹
                 </h5>
                 <p>
-                    볼을 발사하여 3개를 만들면 상쇄하고 점수를 획득할 수 있습니다. 마블미션에는 수많은 레벨이 준비되어 있습니다. 모든 레벨에서 세개의 별을 획득해 보세요!
+                    지금 몬스터들이 모이고 있습니다. 화살 한 방! 화려한 마법! 강력한 폭발! 전투의 시간이 돌아왔습니다. 강력한 탑으로 방어선을 구축하고 왕국을 지키십시오. 왕국의 운명은 여러분의 손에 달려 있습니다.
                 </p>
             </div>
         </div>
@@ -824,6 +824,12 @@
         <!--//footer-->
         <script>
             AOS.init();
+
+            if($(".youtubeArea").hasClass("youtubeArea_pdp") === true) {
+                var youtube_id = $('.youtubeArea_pdp').attr('value');
+                var youtube_frame = '<iframe src="https://www.youtube.com/embed/'+youtube_id+'?controls=1&rel=0&showsearch=0" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
+                $('.youtubeArea_pdp').html(youtube_frame);
+            }
         </script>
     </body>
 </html>

product/pdp_srs_plus.html

@@ -0,0 +1,724 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>제품상세명 &gt; 제품리스트 &gt; 회사명</title>
+        <!--
+            //위에 순서대로 title 이 변경되어야 합니다. 
+        -->
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover, user-scalable=no, shrink-to-fit=no" /> 
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="apple-mobile-web-app-title" content="">
+        <meta name="apple-mobile-web-app-capable" content="yes">
+        <meta name="apple-touch-fullscreen" content="yes">
+        <meta name="title" content="">
+        <meta name="keywords" content="">
+        <meta name="description" content="">
+        <meta name="format-detection" content="telephone=no">
+        <meta property="og:title" content="Page Title" />
+        <meta property="og:type" content="Page Contens" />
+        <meta property="og:image" content="../assets/images/kia/meta_img.png" />
+        <meta property="og:site_name" content="Page name" />
+        <meta property="og:description" content="Page Coment" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/library/jquery-ui.min.css?v1" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/library/swiper.min.css?v1" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/library/aos.css?v1" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/basic.css?v1" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/common.css?v2" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/contents.css?v1" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/popup.css?v1" type="text/css" />
+        <script type="text/javascript"  charset="UTF-8"  src="../assets/js/library/jquery.js?v1"></script>
+        <script type="text/javascript"  charset="UTF-8"  src="../assets/js/library/jquery-ui.min.js?v1"></script>
+        <script type="text/javascript"  charset="UTF-8"  src="../assets/js/library/swiper.min.js?v1"></script>
+        <script type="text/javascript"  charset="UTF-8"  src="../assets/js/library/aos.js?v1"></script>
+        <script type="text/javascript"  charset="UTF-8"  src="../assets/js/common.js?v1.1"></script>
+        <!--상품상세 페이지 css 분리-->
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/product.css?v1.2" type="text/css" />
+        <link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v5" type="text/css" />
+        <link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
+        <link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
+        <link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">
+        <link rel="icon" href="../assets/images/kia/favicon-16x16.png">
+        <link rel="stylesheet" href="../assets/css/kia/kia-font.css?v1" type="text/css" />
+        <link rel="stylesheet" href="https://connectstore.kia.com/kr/assets/css/kia/kia.css?v1" type="text/css" />
+    </head> 
+    <body>
+        
+        <!--//header-->
+        <div class="hederWarp_n noBoder">
+            <div class="headerInner">
+                <div class="gnb">
+                    <!-- GNB 로고 영역입니다. -->
+                    <div class="logoWrap">
+                        <a href="">
+                            <i class="logoImg"></i>
+                            <!-- <span>
+                                Connect Store
+                            </span> -->
+                        </a>
+                    </div>
+                    <div class="menuWarp">
+                        <div class="mobileMenuTop">
+                            <!-- 모바일 슬라이드 메뉴의 로고 영역입니다. -->
+                            <div class="mobileLogoWrap">
+                                <a href="">
+                                    <i class="logoImg"></i>
+                                    <!-- <span>
+                                        Connect store
+                                    </span> -->
+                                </a>
+                            </div>
+                            <span class="closeBtn" id="closeBtn">
+                                <a href="#"></a>
+                            </span>
+                        </div>
+                        <!-- 모바일 전용 USER 관련 링크 영역입니다. -->
+                        <div class="mobileFunc">
+                            <button>
+                                <span>마이페이지</span>
+                                <!--<span>로그인</span>-->
+                            </button>
+                            <!-- <button>
+                                
+                                <span>장바구니</span>
+                                
+                            </button> -->
+                        </div>
+                        <!-- 모바일 전용 차량 선택 UI입니다. -->
+                        <div class="mobileCarlist">
+                            <a href="javascript:void(0)" class="mobilecarItem">
+                                <div class="item">
+                                    <span>MV</span>
+                                    <span>161어 1660</span>
+                                </div>
+                                <div class="arrow"></div>
+                            </a>
+                            <div class="carlistItem">
+                                <ul>
+                                    <li>
+                                    <a href="javascript:void(0)">
+                                        <span>MV</span>
+                                        <span>KMTKEXXBPMU000081</span>
+                                    </a>
+                                    </li>
+                                    <li>
+                                    <a href="javascript:void(0)">
+                                        <span>SX</span>
+                                        <span>161어 1660</span>
+                                    </a>
+                                    </li>
+                                    <li>
+                                    <a href="javascript:void(0)">
+                                        <span>MV</span>
+                                        <span>452허 1234</span>
+                                    </a>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                        <!-- PC 모바일 공통 메뉴 영역입니다. -->
+                        <ul class="menu">
+                            <li class="menuDepth1Wrap">
+                                <a href="../kia.html#mainProductList" class="menuDepth1">디지털 사양</a>
+                                <div class="menuDepth2Wrap info">
+                                    <svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="boxBullet">
+                                        <path d="M7 1L1 10H13L7 1Z" fill="white"/>
+                                        <path d="M1 9L7 1L13 9" stroke="#DEDEDE"/>
+                                    </svg>
+                                    <ul>
+                                        <li class="menuDepth2"><a href="../kia.html#mainProductList">디지털 사양</a></li>
+                                        <li class="menuDepth2"><a href="../info/product-usage-guide.html" class="active">사양별 이용안내</a></li>
+                                    </ul>
+                                </div>
+                            </li>
+                            <li class="menuDepth1Wrap">
+                                <a href="../info/service-info.html" class="menuDepth1 lower" data-url="../info/service-info.html">스토어 소개</a>
+                                <div class="menuDepth2Wrap info">
+                                    <svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="boxBullet">
+                                        <path d="M7 1L1 10H13L7 1Z" fill="white"/>
+                                        <path d="M1 9L7 1L13 9" stroke="#DEDEDE"/>
+                                    </svg>
+                                    <ul>
+                                        <li class="menuDepth2"><a href="../info/service-info.html">스토어 소개</a></li>
+                                        <li class="menuDepth2"><a href="../info/registration-guide.html" class="active">스토어 가입안내</a></li>
+                                        <li class="menuDepth2"><a href="../info/buying-Installation-guide.html">스토어 이용안내</a></li>
+                                        <li class="menuDepth2"><a href="../service/event-list.html">이벤트</a></li>
+                                    </ul>
+                                </div>
+                            </li>
+                            <li class="menuDepth1Wrap">
+                                <a href="../info/as-guide.html" class="menuDepth1 lower" data-url="../info/as-guide.html">고객지원</a>
+                                <div class="menuDepth2Wrap support">
+                                    <svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="boxBullet">
+                                        <path d="M7 1L1 10H13L7 1Z" fill="white"/>
+                                        <path d="M1 9L7 1L13 9" stroke="#DEDEDE"/>
+                                    </svg>
+                                    <ul>
+                                        <li class="menuDepth2"><a href="../service/faq.html">자주하는 질문</a></li>
+                                        <li class="menuDepth2"><a href="../service/inquiry-list.html">문의하기</a></li>
+                                        <li class="menuDepth2"><a href="../info/as-guide.html" class="active">고객센터 및 AS안내</a></li>
+                                        <li class="menuDepth2"><a href="../service/notice-list.html">공지사항</a></li>
+                                    </ul>
+                                </div>
+                            </li>
+                        </ul>
+                        <!-- 모바일 전용 추가 메뉴 영역입니다. -->
+                        <div class="mobileSubMenu">
+                            <a href="https://privacy.kia.com/overview/full-policy/" target="_blank">개인정보 처리방침</a>
+                            <a href="../member/terms.html">이용약관</a>
+                        </div>
+                        <!-- 모바일 전용 로그아웃 버튼입니다. -->
+                        <!-- <div class="loginBtn oneButton">
+                            <button><p>로그아웃</p></button>
+                        </div> -->
+                    </div>
+                </div>
+                <div class="func">
+                    <!-- PC 전용 차량 선택 UI입니다. -->
+                    <div class="carlist">
+                        <a href="javascript:void(0)" class="carItem">
+                            <span>MV</span>
+                            <span>161어 1660</span>
+                        </a>
+                        <div class="carlistItem">
+                            <svg width="14" height="10" viewBox="0 0 14 10" fill="none" xmlns="http://www.w3.org/2000/svg" class="boxBullet">
+                                <path d="M7 1L1 10H13L7 1Z" fill="white"/>
+                                <path d="M1 9L7 1L13 9" stroke="#DEDEDE"/>
+                            </svg>
+                            <ul>
+                                <li>
+                                    <a href="javascript:void(0)">
+                                        <span>MV</span>
+                                        <span>KMTKEXXBPMU000081</span>
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="javascript:void(0)">
+                                        <span>SX</span>
+                                        <span>161어 1660</span>
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="javascript:void(0)">
+                                        <span>MV</span>
+                                        <span>452허 1234</span>
+                                    </a>
+                                </li>
+                                
+                            </ul>
+                        </div>
+                    </div>
+        
+                    <!-- PC 전용 로그인 버튼입니다. -->
+                    <div class="userLogin">
+                        <a href="#">로그인/가입</a>
+                    </div>
+        
+                    <!-- PC 전용 USER 관련 링크 영역입니다. -->
+                    <div class="user">
+                        <a href="../mypage/my-product-list.html"><i class="icon-user"></i></a>
+                    </div>
+        
+                    <!-- PC 모바일 공통 장바구니 버튼입니다. -->
+                    <!-- <div class="cart">
+                        <a href="" class="login-alrt"><i class="icon-cart"></i></a>
+                    </div> -->
+        
+                    <!-- 모바일 전용 햄버거 메뉴 버튼입니다. -->
+                    <div class="moblieMenu burgurBtn">
+                        <span class="burgur" id="burgur">
+                            <span class="top-line"></span>
+                            <span class="bot-line"></span>
+                        </span>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!--//header-->
+
+         <!--//sticky-->
+        <div  class="infoSticky">
+           <div class="infoStickyInner">
+                <div class="stickyLeft">
+                    <p>
+                        <strong>Kia Dynamic LED</strong>
+                        <span>Light Type-A</span>
+                    </p>
+                </div>
+                <div class="stickyRight">
+                    <dl>
+                        <dt>평생 이용권</dt>
+                        <dd>₩ 150,000</dd>
+                    </dl>
+                </div>
+           </div>                         
+        </div>
+        <!--//sticky-->
+        
+
+        <!--//content-warp-->
+        <div class="contentWarp">
+           <div class="productView">
+                <div class="productLeft">
+                    <div class="productImg">
+                       <div class="swiper productSwiper">
+                            <div class="swiper-wrapper">
+                                <div class="swiper-slide"><img src="../assets/images/kia/pdp/streaming_premium/streaming_premium1.png" alt="이미지 상품명"></div>
+                                <div class="swiper-slide"><img src="../assets/images/kia/pdp/streaming_premium/streaming_premium1.png" alt="이미지 상품명"></div>
+                                <div class="swiper-slide withVideo">
+                                    <p class="productSmallVideo">
+                                        <video loop muted playsinline preload="auto" poster="/kr/assets/images/kia/product-img/producy-temp3.png">
+                                            <source src="../assets/images/kia/video/producy-temp3-video.mp4" type="video/mp4">
+                                        </video>
+                                        <img src="../assets/images/kia/pdp/display_themeNBA_Theme_AVNT.jpg" alt="이미지 상품명">
+                                    </p>
+                                </div>
+                                <div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp4.png" alt="이미지 상품명"></div>
+                            </div>
+                            <div class="swiper-pagination"></div>
+                        </div>
+                    </div>
+                </div>
+                <div class="productRight">
+                    <div class="optionWarp">
+                        <div class="producTitle">
+                            <!-- <span>차량SW</span> -->
+                            <h1>SRS Plus</h1>
+                            <p>차량에서도 즐길 수 있는 게임</p>
+                        </div>
+                        <div class="producInfoWarp">
+                            <div class="producOption">
+                                <h2>요금제</h2>
+                                <div class="optionList">
+                                    <div class="checkBtn type2">
+                                        <input type="checkbox" name="check" id="check1" value="Atlanta Hawks"  checked >
+                                        <label for="check1">
+                                            <div class="optionText">
+                                                <p>
+                                                    <strong>
+                                                        스마트 TV 솔루션즈 플러스
+    
+                                                    <span>차량에서 스마트 TV 서비스를  이용 가능합니다.</span>
+    
+                                                    </strong>
+                                                    <span>단, 비디오 스트리밍의 경우 지원 차량이 제한되오니 하단의
+                                                        상세 정보를 확인바랍니다.</span>
+                                                </p>
+                                            </div>
+                                        </label>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="producInfoLogOut">
+                                <p>본 요금제는 스트리밍 서비스 이용 시 사용하는 이용권이며, 서비스 이용을 위한 콘텐츠 플랫폼사 이용권은 별도로 구매 후 연동하셔야 합니다.</p>
+                                <span>(단, 구독 중인 콘텐츠 플랫폼의 이용권이  모바일 기기만 지원 할 경우, 차량 내 스트리밍 서비스를 이용하실 수 없습니다) </span>
+                            </div>
+                            <!-- [E] 로그아웃 케이스 -->
+
+                        </div>
+                        
+                        <div class="priceTotal">
+                            <div class="oneButtonBlack">
+                                <a href="" class="requireLogin"><p>요금제 가입하기</p></a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+           </div>
+        </div>
+         <!--//content-warp-->
+
+        <!--에디터 영역-->
+        <div class="editorWarp pdpDetail">
+            <div class="editorInner">
+                
+
+<div class="comp_wide comp_1x_w_v_o_b streamingPremium">
+    <div class="image_area visualBg">
+        <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium.jpg" class="web" alt="스트리밍 프리미엄">
+        <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_m.jpg" class="mobile" alt="스트리밍 프리미엄">
+    </div>
+    <div class="comp_top">
+        <div class="comp_body layer_up">
+            <div class="text_area">
+                <h3 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
+                    이미지와 상품 안내 문구 필요합니다.
+                </h3>
+                <div class="info" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
+                    다양한 OTT 컨텐츠와 더불어 뉴스, SNS,  회의, 스포츠 등 스마트TV에서 이용하던 다양한 서비스를 사용할 수 있습니다.
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="comp_md layer_up"></div>
+
+</div>
+
+<div class="comp_wide comp_1x_b_v_s_b"> 
+    <div class="comp_body"> 
+        <div class="image_area aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"> 
+            <img src="../assets/images/kia/pdp/srs_plus/srs_plus_contents_01.png" alt="네비게이션 정보를 활용하여 더욱 안전하고 편리해진 EV 주행 이미지"> 
+        </div> 
+        <div class="text_area"> 
+            <h4 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800" class="aos-init aos-animate">네비게이션 정보를 활용하여 더욱 안전하고 편리해진 EV 주행</h4> 
+            <p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800" class="aos-init aos-animate">스마트 회생제시스템 플러스는 편리하고 안전한 운전을 지원합니다.
+                원페달 운전을 가능하게 하여 가속과 제동을 더욱 편리하게 제어할 수 있습니다.
+                교통 체증 및 도심 주행에서도 피로 없이 운전하며 운전의 즐거움을 느껴보세요.
+            </p> 
+        </div> 
+    </div> 
+</div>
+
+<div class="comp_wide comp_1x_b_h_s_e1"> 
+    <div class="comp_body"> 
+        <div class="image_area aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"> 
+            <img src="../assets/images/kia/pdp/srs_plus/srs_plus_contents_02.png" alt="에너지 세이빙을 통한 친환경 드라이브 이미지"> 
+        </div> 
+        <div class="text_area aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"> 
+            <h4>에너지 세이빙을 통한 친환경 드라이브</h4> 
+            <p>스마트 회생제동 시스템은 제동 에너지를 회수하여 주행거리를 
+            향상 시켜 줍니다.<br>
+            에너지 재활용을 통해 탄소 배출량을 줄여 환경 보호에 기여합니다.
+            스마트 회생제동 시스템으로 미래 세대에게 깨끗한 지구를 물려주세요.
+            </p> 
+        </div> 
+    </div>
+    <div class="comp_body"> 
+        <div class="image_area aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"> 
+            <img src="../assets/images/kia/pdp/srs_plus/srs_plus_contents_03.png" alt="EV9 비쥬얼 이미지"> 
+        </div> 
+        <div class="text_area aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"> 
+            <h4>EV만의 독특한 주행 경험을 제공하는 기술 혁신</h4> 
+            <p>스마트 회생제동 시스템은 제동 에너지를 회수하여 주행거리를 향상 
+                시켜 줍니다.
+                에너지 재활용을 통해 탄소 배출량을 줄여 환경 보호에 기여합니다.
+                스마트 회생제동 시스템으로 미래 세대에게 깨끗한 지구를 물려주세요.
+            </p> 
+        </div> 
+    </div> 
+</div>
+
+<div class="comp_wide comp_2x_b_h_s_e2">
+    <div class="comp_body">
+        <div class="item">
+            <div class="image_area">
+                <img src="../assets/images/kia/pdp/lighting_pattern/lighting_pattern_contents_04.png" alt="아이콘 이미지">
+            </div>
+            <div class="text_area">
+                <h5>
+                    기아 커넥트 가입 고객 구매 가능
+                </h5>
+                <p>
+                    기아 커넥트 서비스 가입 상태인 고객에 한하여 가입 및 플레이 가능하오니 구매에 참고 바랍니다.
+                </p>
+            </div>
+        </div>
+        <div class="item">
+            <div class="image_area">
+                <img src="../assets/images/kia/pdp/lighting_pattern/lighting_pattern_contents_05.png" alt="아이콘 이미지">
+            </div>
+            <div class="text_area">
+                <h5>
+                    CCNC 차량에 한하여 구매 가능
+                </h5>
+                <p>
+                    해당 아이템은 12.5인치 CCNC 플랫폼 적용 차량에 한하여 구입 가능합니다.
+                </p>
+            </div>
+        </div>  
+    </div>
+</div>
+
+
+<div class="comp_1x_b_n_n_e1 displayTheme">
+    <div class="comp_body">
+        <h5>
+            사양 이용 영상
+        </h5>
+        <div class="youtubeArea youtubeArea_pdp" value="AJWgnJIOyRU">
+        </div>
+    </div>
+</div>
+
+<div class="listbtnWarp">
+    <div class="oneButton">
+        <a href="https://connectstore.kia.com/kr/info/product-usage-guide-lighting"><p>사양 이용안내</p></a>
+    </div>
+</div>
+
+
+
+            </div>
+        </div>
+        <!--에디터 영역-->
+
+        <!-- [S] [2차]정보고시 -->
+        
+        <div class="editorWarp disclaimerWrap">
+            <!-- [S]관리자에서 에디터로 등록되는 영역입니다. -->
+<div class="comp_wide disclaimerArea">
+    <div class="comp_body disclaimerInner">
+        <h2>정보고시</h2>
+        <div class="disclaimerList">
+
+            <div class="item">
+                <div class="title">
+                    이용조건
+                </div>
+                <div class="bar"></div>
+                <ul class="contents">
+                    <li>상품 구매 및 이용가능 여부는 차량에 설치된 하드웨어 구성 및 OTA펌웨어 버전에 따라 다르기에 로그인하시면 확인하실 수 있습니다.</li>
+                    <li>상품 이용을 위해 구입 후 가이드에 따라 차량에 설치를 완료하셔야 합니다.</li>
+                </ul>
+            </div>
+
+            <div class="item">
+                <div class="title">
+                    이용기간
+                </div>
+                <div class="bar"></div>
+                <ul class="contents">
+                    <li>평생 이용 선택 시 기간 제한 없이 이용이 가능합니다.</li>
+                    <li>월/연 구독 선택 시 명기된 기간동안 이용이 가능합니다.</li>
+                </ul>
+            </div>
+
+            <div class="item">
+                <div class="title">
+                    청약철회
+                </div>
+                <div class="bar"></div>
+                <ul class="contents">
+                    <li>평생 이용은 결제 후 7일 내 구매 취소가 가능합니다.</li>
+                    <li>월/연 구독은 언제든지 취소할 수 있으며<br>
+                    - 기능을 한번도 이용하지 않은 고객이 7일 이내에 구독 취소를 한 경우에는 구독 비용이 전액 환불됩니다.<br>
+                    - 7일 이내 기능을 이용하거나 7일 이후에 구독 취소를 한 경우에는 중도 해지 및 이에 따른 환불이 가능합니다.<br></li>
+                    <li>구매 취소는 차량 내 설치된 상품이 삭제완료 된 후에 진행됩니다.</li>
+                </ul>
+            </div>
+
+            <div class="item">
+                <div class="title">
+                    취소/해지/반품/환불 안내
+                </div>
+                <div class="bar"></div>
+                <ul class="contents">
+                    <li>고객님의 상품 이용 현황에 따라 정기 결제를 취소하거나 바로 해지하실 수 있습니다.</li>
+                    <li>상품별 해지/환불 정책은 이용 안내 또는 상품 상세 설명을 참고해 주시기 바랍니다.</li>
+                    <li>정기 결제를 취소하시면 구독 종료일까지 상품을 정상적으로 이용하실 수 있으며, 다음 정기 결제일에 해지됩니다.</li>
+                    <li>구독 할인쿠폰이 적용된 상품을 해지하시면 쿠폰 사용 기간이 남아 있더라도 쿠폰은 소멸됩니다.</li>
+                    <li>구독 할인쿠폰이 적용된 상품을 변경하셔도 쿠폰이 소멸될 수 있으니, 변경 신청 전 안내 내용을 꼼꼼히 확인해 주시기 바랍니다.</li>
+                    <li>상품을 즉시 해지하는 경우, 재가입 및 혜택 이용이 제한될 수 있습니다.</li>
+                    <li>정기 결제 당일에는 상품 해지가 불가 합니다. (정기 결제가 완료된 이후에는 결제 취소 가능하며, 재결제 기간 종료 후 자동으로 해지 됩니다.)</li>
+                </ul>
+            </div>
+
+            <div class="item">
+                <div class="title">
+                    고객센터
+                </div>
+                <div class="bar"></div>
+                <ul class="contents">
+                    <li>기타 문의는 고객센터(080-200-2000)나 1:1문의로 신청바랍니다.</li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>
+            <!-- [E]관리자에서 에디터로 등록되는 영역입니다. -->
+        </div>
+        <!-- [E] [2차]정보고시 -->
+        
+
+
+        <!--관련상품-->
+        <div class="relatedProducts">
+            <div class="relatedInnder">
+                <h2>관련상품</h2>
+                <div class="relatedList">
+                    <a href="">
+                        <div class="relatedListItem">
+                            <div class="itemInner">
+                                <div class="itemLeft">
+                                    <p class="img"><img src="../assets/images/kia/product-img/producy-temp5.png" alt="이미지 상품명"></p>
+                                    <div class="productName">
+                                        <dl>
+                                            <dt>Kia Dynamic LEDKia Dynamic LEDKia Dynamic LEDKia Dynamic LEDKia Dynamic LEDLEDKia Dynamic LEDLEDKia Dynamic LED</dt>
+                                            <dd>더 특별하 게 더 반짝이게더 특별하 게 더 반짝이게더 특별하 게 더 반짝이게더 특별하 게 더 반짝이게더 특별하 게 더 반짝이게더 특별하 게 더 반짝이게특별하 게 더 반짝이게더 특별하 게 더 반짝이게특별하 게 더 반짝이게더 특별하 게 더 반짝이게특별하 게 더 반짝이게더 특별하 게 더 반짝이게</dd>
+                                        </dl>
+                                    </div>
+                                </div>
+                                <div class="productPrice">
+                                    <dl>
+                                        <dt>평생 이용권</dt>
+                                        <dd>\520,000</dd>
+                                    </dl>
+                                    <dl>
+                                        <dt>일반 정기 구독</dt>
+                                        <dd>\12,000/월</dd>
+                                    </dl>
+                                </div>
+                            </div>
+                        </div>
+                    </a>
+                    <a href="">
+                        <div class="relatedListItem">
+                            <div class="itemInner">
+                                <div class="itemLeft">
+                                    <p class="img"><img src="../assets/images/kia/product-img/producy-temp5.png" alt="이미지 상품명"></p>
+                                    <div class="productName">
+                                        <dl>
+                                            <dt>Kia Dynamic LEDKia Dynamic </dt>
+                                            <dd>더 특별하 게 더 반짝이게</dd>
+                                        </dl>
+                                    </div>
+                                </div>
+                                <div class="productPrice">
+                                    <dl>
+                                        <dt>평생 이용권</dt>
+                                        <dd>\520,000</dd>
+                                    </dl>
+                                    <dl>
+                                        <dt>일반 정기 구독</dt>
+                                        <dd>\12,000/월</dd>
+                                    </dl>
+                                </div>
+                            </div>
+                        </div>
+                    </a>
+                </div>
+            </div>
+        </div>
+        <!--관련상품-->
+
+
+
+
+        <!--//footer-->
+        <div class="floating_menu">
+            <a href="../service/faq.html" class="floating_faq"><img src="../assets/images/common/floating_inquiry.png" alt="자주하는 질문"></a>
+            <a href="../service/inquiry-list.html" class="floating_inquiry"><img src="../assets/images/common/floating_faq.png" alt="문의하기"></a>
+            <a href="javascript:;" class="floating_top"><img src="../assets/images/common/floating_top.png" alt="top"></a>
+         </div>
+         <div class="footer">
+            <div class="kiaInner">
+               <div class="tLeft">
+                     <div class="logoSEction">
+                        <a href="../kia.html"><img src="../assets/images/kia/kia-logo.svg" alt="kia"></a>
+                     </div>
+                     <div class="companyInfo">
+                        <ul>
+                        <li><a href="https://privacy.kia.com/overview/full-policy/" target="_blank">개인정보 처리방침</a></li>
+                           <li><a href="../member/terms.html">이용약관</a></li>
+                        </ul>
+                        <ul>
+                           <li>사업자: 기아주식회사, 대표 송호성, 최준영</li>
+                           <li>주소: 서울특별시 서초구 현릉로 12 기아</li>
+                           <li>사업자등록번호: 119-81-02316</li>
+                           <li>통신판매신고: 2006-07935</li>
+                           <li>호스팅제공자: 현대오토에버</li>
+                           <li>이메일: KiaConnectStore@kia.com</li>
+                           <li>개인정보책임자: 기아정보보호센터 이상영 상무, privacy@kia.com / 080-200-2000</li>
+                        </ul>
+                     </div>
+               </div>
+               <div class="csTime">
+                  <div>
+                     <p>
+                        <strong>고객센터: 080-200-2000</strong>
+                     </p>
+                     <p><span>오류문의: 24시간 연중 무휴</span></p>
+                     <p>
+                        <span>
+                           일반 문의: 주중 08:30 ~ 18:00<br><span style="margin-left:64px;">(토·일·공휴일 휴무)</span>
+                        </span>
+                     </p>
+                  </div>
+                  <div class="familyBoxWarp">
+                     <div class="familyBox">
+                           <div class="familyInner">
+                              <div class="cont-select">
+                                 <ul class="list-member">
+                                    <li><a href="https://www.kia.com/kr" target="_balnk">기아</a></li>
+                                    <li><a href="https://connect.kia.com/kr" target="_balnk">기아 커넥트</a></li>
+                                    <li><a href="https://worldwide.kia.com/kr" target="_balnk">Worldwide</a></li>
+                                    <li><a href="https://www.hyundai.co.kr" target="_balnk">현대자동차그룹</a></li>
+                                    <li><a href="https://members.kia.com" target="_balnk">기아멤버스</a></li>
+                                    <li><a href="https://drivingexperience.hyundai.co.kr/" target="_balnk">기아 드라이빙 아카데미</a></li>
+                                    <li><a href="https://worldwide.kia.com/kr/company/ir" target="_balnk">IR</a></li>
+                                    <li><a href="http://winwin.hyundai.com/" target="_balnk">동반성장</a></li>
+                                    <li><a href="https://gbic.hyundai.com/" target="_balnk">글로벌경영연구소</a></li>
+                                    <li><a href="https://tigers.co.kr" target="_balnk">기아타이거즈</a></li>
+                                    <li><a href="https://special.kia.com" target="_balnk">기아군용</a></li>
+                                 </ul>
+                                 <button class="btn-select">Family Site</button>
+                              </div>
+                           </div>
+                     </div>
+                  </div>
+               </div>
+               <p class="copyRight"><span>Ⓒ</span> Kia CORP. ALL RIGHTS RESERVED.</p>
+            </div>
+         </div>
+         
+         <div class="popupWarp"  style="display:none;">
+            <div class="popInner termsPop" style="display:none;">
+               <div class="popContents">
+                  <h1>개인정보 수집/이용 및 기타 동의</h1>
+                  <div class="termsCon">
+                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. ManyLorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many </p> 
+                  </div>
+                  <div>
+                     <div class="oneButton">
+                        <a href=""><p>닫기</p></a>
+                     </div>
+                  </div>
+               </div>
+            </div>
+         
+            <div class="popInner payInfo"  style="display:none;">
+               <div class="popContents">
+                  <h1>결제 방법 안내</h1>
+                  <div class="payInfoCon">
+                    <p>
+                        <strong>이미 등록된 결제 방법이 있습니다.<br>(지로, 서울특별시 OO구 OOO로 OO길 OO)<br>해당 결제 방법으로 요금을 납부하시겠습니까?</strong>
+                        <span>※ 결제 방법을 다른 카드로 변경하실 경우 CCS앱에서 변경 가능합니다.</span>
+                    </p> 
+                  </div>
+                  <div>
+                     <div class="towButton">
+                           <button class="cartBtn leftBtn"><p>취소</p></button>
+                           <button class="PurchaseBtn rightBtn"><p>확인</p></button>
+                        </div>
+                  </div>
+               </div>
+            </div>
+         
+            <div class="popInner payInfo"  style="display:none;"> 
+               <dㅇㅇㅇㅇiv class="popContents">
+                  <h1>결제 방법 안내</h1>
+                  <div class="payInfoCon">
+                    <p>
+                        <strong>등록된 결제 방법이 없어 요금제 가입 진행이 불가합니다. 결제 카드 등록은 블루링크 App에서 진행해주시길 바랍니다.</strong>
+                    </p> 
+                  </div>
+                  <div>
+                      <div class="oneButton">
+                        <a href=""><p>닫기</p></a>
+                     </div>
+                  </div>
+               </dㅇㅇㅇㅇiv>
+            </div>
+         </div>
+        <!--//footer-->
+        <script>
+            AOS.init();
+
+            if($(".youtubeArea").hasClass("youtubeArea_pdp") === true) {
+                var youtube_id = $('.youtubeArea_pdp').attr('value');
+                var youtube_frame = '<iframe src="https://www.youtube.com/embed/'+youtube_id+'?controls=1&rel=0&showsearch=0" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
+                $('.youtubeArea_pdp').html(youtube_frame);
+            }
+        </script>
+    </body>
+</html>

product/pdp_streaming_premium.html

@@ -333,10 +333,10 @@
             <div class="editorInner">
                 
 
-<div class="comp_wide comp_1x_w_v_o_b ">
+<div class="comp_wide comp_1x_w_v_o_b streamingPremium">
     <div class="image_area visualBg">
-        <img src="../assets/images/kia/pdp/streaming_premium/theme1_screen.jpg" class="web" alt="스트리밍 프리미엄">
-        <!-- <img src="../assets/images/kia/pdp/streaming_premium/theme1_screen_m.jpg" class="mobile" alt="스트리밍 프리미엄"> -->
+        <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium.jpg" class="web" alt="스트리밍 프리미엄">
+        <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_m.jpg" class="mobile" alt="스트리밍 프리미엄">
     </div>
     <div class="comp_top">
         <div class="comp_body layer_up">
@@ -354,11 +354,12 @@
 
 </div>
 
-<div class="comp_wide comp_1x_b_v_s_b ">
+<div class="comp_wide comp_1x_b_v_s_b streamingPremium">
     <div class="comp_body">
         <div class="item aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-offset="9999" data-aos-duration="200">
             <div class="image_area">
-                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img1.png?ver=1" class="themeImg" alt="비디오 스트리밍">
+                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img1.png" class="themeImg web" alt="비디오 스트리밍">
+                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img1_m.png" class="themeImg mobile" alt="비디오 스트리밍">
             </div>
             <div class="text_area">
                 <h5>비디오 스트리밍</h5>
@@ -369,7 +370,8 @@
         </div>
         <div class="item aos-init aos-animate mt-12" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="200">
             <div class="image_area">
-                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img2.png?ver=1" class="themeImg" alt="엔터테인먼트">
+                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img2.png" class="themeImg web" alt="엔터테인먼트">
+                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img2_m.png" class="themeImg mobile" alt="엔터테인먼트">
             </div>
             <div class="text_area">
                 <h5>라이브 채널</h5>
@@ -380,7 +382,8 @@
         </div>
         <div class="item aos-init aos-animate mt-12" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="200">
             <div class="image_area">
-                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img3.png?ver=1" class="themeImg" alt="Profile">
+                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img3.png" class="themeImg web" alt="Profile">
+                <img src="../assets/images/kia/pdp/streaming_premium/streaming_premium_img3_m.png" class="themeImg mobile" alt="Profile">
             </div>
             <div class="text_area">
                 <h5>엔터테인먼트</h5>