kbo 작업중

This commit is contained in:
2025-03-26 21:19:14 +09:00
parent 225c99a5b3
commit 19dc9a5b63
6 changed files with 512 additions and 250 deletions

View File

@@ -3647,11 +3647,28 @@
height: 76rem;
}
}
.displayTheme-kbo.comp_wide .dtlImgs {
padding-top: 4rem;
}
@media (max-width: 768px) {
.displayTheme-kbo.comp_wide .dtlImgs {
padding-top: 0;
}
}
.displayTheme-kbo.comp_wide .tooltip {
top: -6.5rem;
}
.displayTheme-kbo.comp_wide .swiper-info {
padding: 0 0 0.6rem;
color: #fff;
font-size: 1.6rem;
}
.displayTheme-kbo.comp_wide .swiper-slide .image_area img {
box-shadow: 0px 0px 20px 0px rgba(234, 229, 188, 0.3019607843);
}
.displayTheme-kbo.comp_wide .swiper-pagination {
top: 48.4rem;
}
@media (max-width: 768px) {
.displayTheme-kbo.comp_wide .comp_top .comp_body .text_area h3 {
letter-spacing: -0.075em;

File diff suppressed because one or more lines are too long

View File

@@ -4169,10 +4169,29 @@
}
}
.dtlImgs {
padding-top: 4rem;
@include maxtablet {
padding-top: 0;
}
}
.tooltip {
top: -6.5rem;
}
.swiper-info {
padding: 0 0 0.6rem;
color: #fff;
font-size: 1.6rem;
}
.swiper-slide {
.image_area {
img {
box-shadow: 0px 0px 20px 0px #eae5bc4d;
}
}
}
.swiper-pagination {
top: 48.4rem;
}
.comp_top {
.comp_body {
.text_area {

View File

@@ -268,6 +268,7 @@ $(document).ready(function () {
pdpDisplayThemeSwiperDtl();
pdpInCarGameSwiper();
pdpInCarGameSwiperDtl();
pdpDisplayThemeKbo();
pdpSwiperDtl(".streamingPremium-swiper1");
pdpSwiperDtl(".streamingPremium-swiper2");
pdpSwiperDtl(".streamingPremium-swiper3");

647
kia.html
View File

@@ -8,16 +8,16 @@
<html lang="en">
<head>
<title>제품상세명 &gt; 제품리스트 &gt; 회사명</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 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" />
@@ -30,19 +30,19 @@
<link rel="stylesheet" charset="UTF-8" href="assets/css/common.css?v1" 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"></script>
<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"></script>
<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="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="assets/css/kia/kia.css?v1" type="text/css" />
<link rel="stylesheet" charset="UTF-8" href="assets/css/kia/kiamain.css" type="text/css" />
</head>
</head>
<body>
<!--//header-->
<div class="hederWarp_n">
@@ -96,22 +96,22 @@
<div class="carlistItem">
<ul>
<li>
<a href="javascript:void(0)">
<span>MV</span>
<span>KMTKEXXBPMU000081</span>
</a>
<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>
<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>
<a href="javascript:void(0)">
<span>MV</span>
<span>452허 1234</span>
</a>
</li>
</ul>
</div>
@@ -122,8 +122,8 @@
<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"/>
<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>
@@ -135,8 +135,8 @@
<a href="#" 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"/>
<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>
@@ -150,8 +150,8 @@
<a href="#" 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"/>
<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>
@@ -182,8 +182,8 @@
</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"/>
<path d="M7 1L1 10H13L7 1Z" fill="white" />
<path d="M1 9L7 1L13 9" stroke="#DEDEDE" />
</svg>
<ul>
<li>
@@ -204,26 +204,25 @@
<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">
@@ -238,57 +237,60 @@
<div class="mainTopKey">
<div class="swiper mainSwiper">
<ul class="swiper-wrapper">
<li class="swiper-slide">
<video class="mainKvMoviePc" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height:100%;position: absolute;left:0; top:0;object-fit: cover; ">
<source src="./assets/images/FOD_Intro_pc.mp4" type="video/mp4"> <!-- pc mp4 -->
<li class="swiper-slide">
<video class="mainKvMoviePc" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover">
<source src="./assets/images/FOD_Intro_pc.mp4" type="video/mp4" />
<!-- pc mp4 -->
</video>
<video class="mainKvMovieMo" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height:100%;position: absolute;left:0; top:0;object-fit: cover; ">
<source src="./assets/images/FOD_Intro_mobile.mp4" type="video/mp4"> <!-- pc mp4 -->
<video class="mainKvMovieMo" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover">
<source src="./assets/images/FOD_Intro_mobile.mp4" type="video/mp4" />
<!-- pc mp4 -->
</video>
<div class="mainText">
<p>
<strong>Kia Connect Store</strong>
<span>Software Defined Vehicle.<br>소프트웨어로 여는 새로운 모빌리티 시대로</span>
<span>Software Defined Vehicle.<br />소프트웨어로 여는 새로운 모빌리티 시대로</span>
</p>
<div class="oneButton">
<a href="product/product-carsw-view.html"><p>자세히 보기</p></a>
</div>
</div>
</li>
<li class="swiper-slide">
<video class="mainKvMoviePc" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height:100%;position: absolute;left:0; top:0;object-fit: cover; ">
<source src="https://worldwide.kia.com/kr/image/video/ev9/premiere/ev9-wp-discover-hero-d.mp4" type="video/mp4"> <!-- pc mp4 -->
<li class="swiper-slide">
<video class="mainKvMoviePc" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover">
<source src="https://worldwide.kia.com/kr/image/video/ev9/premiere/ev9-wp-discover-hero-d.mp4" type="video/mp4" />
<!-- pc mp4 -->
</video>
<video class="mainKvMovieMo" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height:100%;position: absolute;left:0; top:0;object-fit: cover; ">
<source src="https://www.kia.com//content/dam/kwp/kr/ko/main-kv-contents/202210/kv_Kia_FIFAWC_221024.mp4" type="video/mp4"> <!-- pc mp4 -->
<video class="mainKvMovieMo" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="" style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover">
<source src="https://www.kia.com//content/dam/kwp/kr/ko/main-kv-contents/202210/kv_Kia_FIFAWC_221024.mp4" type="video/mp4" />
<!-- pc mp4 -->
</video>
<div class="mainText">
<p>
<strong>Kia Connect Store</strong>
<span>Software Defined Vehicle.<br>소프트웨어로 여는 새로운 모빌리티 시대로</span>
<span>Software Defined Vehicle.<br />소프트웨어로 여는 새로운 모빌리티 시대로</span>
</p>
<div class="oneButton">
<a href="product/product-carsw-view.html"><p>자세히 보기</p></a>
</div>
</div>
</li>
<li class="swiper-slide">
<li class="swiper-slide">
<div class="imageArea mainKvImagePc">
<img src="assets/images/kia/kia-keyb.png" alt="">
<img src="assets/images/kia/kia-keyb.png" alt="" />
</div>
<div class="imageArea mainKvImageMo">
<img src="assets/images/kia/keybg/mnotice-key.png" alt="">
<img src="assets/images/kia/keybg/mnotice-key.png" alt="" />
</div>
<div class="mainText">
<p>
<strong>Kia Connect Store</strong>
<span>Software Defined Vehicle.<br>소프트웨어로 여는 새로운 모빌리티 시대로</span>
<span>Software Defined Vehicle.<br />소프트웨어로 여는 새로운 모빌리티 시대로</span>
</p>
</div>
</li>
</ul>
<div class="swiper-pagination"></div>
</div>
@@ -298,56 +300,257 @@
<div class="swiper-button-next kvNextBtn"></div>
<div class="swiper-button-prev kvPrevBtn"></div>
</div>
</div>
<!--//content-warp-->
<div class="mainContentsWrap">
<div class="mainContentsWrap">
<div class="mainTopCopy">
<div class="title" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
당신의 일상에 딱 맞는 <br>새로운 기술과 서비스를 간편하게 경험해보세요.
</div>
<div class="title" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">당신의 일상에 딱 맞는 <br />새로운 기술과 서비스를 간편하게 경험해보세요.</div>
</div>
</div>
<div id="mainProductList" class="mainProductListWrap">
<div class="mainProductListTop">
<!-- [S] Ajax 호출 전 디폴트 영역 -->
<div class="mainProductItem">
<div class="item defualt" style="background-color:#dedede;">
<div class="item defualt" style="background-color: #dedede">
<div class="defaultLogo">
<img src="assets/images/common/default_image_logo.png" alt="logo">
</div>
<div class="infoArea defualt" style="background-image:url('assets/images/common/default_image_600x845.png');">
<img src="assets/images/common/default_image_logo.png" alt="logo" />
</div>
<div class="infoArea defualt" style="background-image: url('assets/images/common/default_image_600x845.png')"></div>
</div>
</div>
<div class="mainProductItem">
<div class="item defualt" style="background-color:#dedede;">
<div class="item defualt" style="background-color: #dedede">
<div class="defaultLogo">
<img src="assets/images/common/default_image_logo.png" alt="logo">
</div>
<div class="infoArea defualt" style="background-image:url('assets/images/common/default_image_600x845.png');">
<img src="assets/images/common/default_image_logo.png" alt="logo" />
</div>
<div class="infoArea defualt" style="background-image: url('assets/images/common/default_image_600x845.png')"></div>
</div>
</div>
<!-- [E] Ajax 호출 전 디폴트 영역 -->
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/pdp_display_theme_kbo.html" class="imageArea withVideo">
<p class="productSmallVideo">
<video loop muted playsinline preload="auto" poster="https://connectstore.kia.com/kr/ux_data/product/20240620/fd8c6dd697514b6b948784f6d14b5be6.png">
<source src="https://connectstore.kia.com/kr/ux_data/product/20240618/f189f27d1aee4933951916e7fc6d3a6e.mp4" type="video/mp4" />
</video>
<img src="assets/images/kia/pdp/display_theme_kbo/producy-temp1.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image: url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
<!-- 신상품 설정된 상태에 표시되는 Badge 입니다. -->
<span>NEW</span>
<!-- 프로모션 설정된 상태에 표시되는 Badge 입니다. -->
<span>Promotion</span>
<!-- 구매 가능 상품인 경우 표시되는 Badge 입니다. -->
<span>구매가능</span>
</div>
<h2>KBO 디스플레이 테마</h2>
<p class="descript">운전에 스타일을 더 하는 특별한 테마</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
<dl>
<dt>평생 이용</dt>
<dd>\29,000</dd>
</dl>
</div>
<div class="listImgBtn">
<div class="oneButton">
<a href="product/pdp_display_theme_kbo.html"><p>자세히 보기</p></a>
</div>
</div>
</div>
<a href="product/pdp_display_theme_kbo.html" class="mobileLinker"></a>
</div>
</div>
</div>
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/pdp_display_theme_0429.html" class="imageArea withVideo">
<p class="productSmallVideo">
<video loop muted playsinline preload="auto" poster="https://connectstore.kia.com/kr/ux_data/product/20240620/fd8c6dd697514b6b948784f6d14b5be6.png">
<source src="https://connectstore.kia.com/kr/ux_data/product/20240618/f189f27d1aee4933951916e7fc6d3a6e.mp4" type="video/mp4" />
</video>
<img src="https://connectstore.kia.com/kr/ux_data/product/20240620/fd8c6dd697514b6b948784f6d14b5be6.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image: url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
<!-- 신상품 설정된 상태에 표시되는 Badge 입니다. -->
<span>NEW</span>
<!-- 프로모션 설정된 상태에 표시되는 Badge 입니다. -->
<span>Promotion</span>
<!-- 구매 가능 상품인 경우 표시되는 Badge 입니다. -->
<span>구매가능</span>
</div>
<h2>NBA 디스플레이 테마</h2>
<p class="descript">운전에 스타일을 더 하는 특별한 테마</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
<dl>
<dt>평생 이용</dt>
<dd>\29,000</dd>
</dl>
</div>
<div class="listImgBtn">
<div class="oneButton">
<a href="product/pdp_display_theme_0429.html"><p>자세히 보기</p></a>
</div>
</div>
</div>
<a href="product/pdp_display_theme_0429.html" class="mobileLinker"></a>
</div>
</div>
</div>
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/pdp_in_car_game.html" class="imageArea withVideo">
<p class="productSmallVideo">
<video loop muted playsinline preload="auto" poster="https://connectstore.kia.com/kr/ux_data/product/20240620/fd8c6dd697514b6b948784f6d14b5be6.png">
<source src="https://connectstore.kia.com/kr/ux_data/product/20240618/f189f27d1aee4933951916e7fc6d3a6e.mp4" type="video/mp4" />
</video>
<img src="https://connectstore.kia.com/kr/ux_data/product/20241231/6ee723c9c4e244478a1fd0649cfc778e.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image: url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
<!-- 신상품 설정된 상태에 표시되는 Badge 입니다. -->
<span>NEW</span>
<!-- 프로모션 설정된 상태에 표시되는 Badge 입니다. -->
<span>Promotion</span>
<!-- 구매 가능 상품인 경우 표시되는 Badge 입니다. -->
<span>구매가능</span>
</div>
<h2>아케이드 게임</h2>
<p class="descript">차안에서 게임을 즐기며 시간을 보내보세요. 기다림의 시간을 즐겁게 만들어 줄 8종의 캐주얼 게임이 당신을 기다립니다.</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
<dl>
<dt>평생 이용</dt>
<dd>\6,900</dd>
</dl>
</div>
<div class="listImgBtn">
<div class="oneButton">
<a href="product/pdp_in_car_game.html"><p>자세히 보기</p></a>
</div>
</div>
</div>
<a href="product/pdp_in_car_game.html" class="mobileLinker"></a>
</div>
</div>
</div>
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/pdp_streaming_premium_0216.html" class="imageArea withVideo">
<p class="productSmallVideo">
<video loop muted playsinline preload="auto" poster="https://connectstore.kia.com/kr/ux_data/product/20240620/fd8c6dd697514b6b948784f6d14b5be6.png">
<source src="https://connectstore.kia.com/kr/ux_data/product/20240618/f189f27d1aee4933951916e7fc6d3a6e.mp4" type="video/mp4" />
</video>
<img src="https://connectstore.kia.com/kr/ux_data/product/20250227/4a68060dda7244faa9a6ea0dfd5e536a.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image: url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
<!-- 신상품 설정된 상태에 표시되는 Badge 입니다. -->
<span>NEW</span>
<!-- 프로모션 설정된 상태에 표시되는 Badge 입니다. -->
<span>Promotion</span>
<!-- 구매 가능 상품인 경우 표시되는 Badge 입니다. -->
<span>구매가능</span>
</div>
<h2>스트리밍 프리미엄</h2>
<p class="descript">이제 차안에서도 스마트하게 여러 콘텐츠를 이용해보세요</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
<!-- <dl>
<dt>평생 이용</dt>
<dd>\29,000</dd>
</dl> -->
</div>
<div class="listImgBtn">
<div class="oneButton">
<a href="product/pdp_streaming_premium_0216.html"><p>자세히 보기</p></a>
</div>
</div>
</div>
<a href="product/pdp_streaming_premium_0216.html" class="mobileLinker"></a>
</div>
</div>
</div>
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/pdp_srs_plus.html" class="imageArea withVideo">
<p class="productSmallVideo">
<video loop muted playsinline preload="auto" poster="https://connectstore.kia.com/kr/ux_data/product/20240620/fd8c6dd697514b6b948784f6d14b5be6.png">
<source src="https://connectstore.kia.com/kr/ux_data/product/20240618/f189f27d1aee4933951916e7fc6d3a6e.mp4" type="video/mp4" />
</video>
<img src="https://connectstore.kia.com/kr/ux_data/product/20240718/055c6c16820e46b3b7bf7a97c75b744d.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image: url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
<!-- 신상품 설정된 상태에 표시되는 Badge 입니다. -->
<span>NEW</span>
<!-- 프로모션 설정된 상태에 표시되는 Badge 입니다. -->
<span>Promotion</span>
<!-- 구매 가능 상품인 경우 표시되는 Badge 입니다. -->
<span>구매가능</span>
</div>
<h2>스마트 회생 시스템 플러스</h2>
<p class="descript">내비게이션 정보를 활용하여 더욱 스마트해진 EV 드라이빙</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
<dl>
<dt>평생 이용</dt>
<dd>\0</dd>
</dl>
</div>
<div class="listImgBtn">
<div class="oneButton">
<a href="product/pdp_srs_plus.html"><p>자세히 보기</p></a>
</div>
</div>
</div>
<a href="product/pdp_srs_plus.html" class="mobileLinker"></a>
</div>
</div>
</div>
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/product-carsw-view.html" class="imageArea withVideo">
<p class="productSmallVideo">
<video loop muted playsinline preload="auto" poster="assets/images/sample_pdp/sample_main_product_pc_01.png">
<source src="assets/images/sample_pdp/sample_main_product_01.mp4" type="video/mp4">
<source src="assets/images/sample_pdp/sample_main_product_01.mp4" type="video/mp4" />
</video>
<img src="https://connectstore.kia.com/kr/ux_data/product/20230620/ab5da8542c31441ba25f35993ff18000.png" alt="이미지 상품명">
<img src="https://connectstore.kia.com/kr/ux_data/product/20230620/ab5da8542c31441ba25f35993ff18000.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image:url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png');">
<div class="infoArea" style="background-image: url('https://connectstore.kia.com/kr/ux_data/product/20230620/dbac827600a14a1496c1d4c75419e2a2.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
@@ -359,7 +562,11 @@
<span>구매가능</span>
</div>
<h2>Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern Lighting Pattern</h2>
<p class="descript">디지털 라이팅 그릴의 다이나믹한 패턴은 운전자에 반응하여 역동적이고 마법같은 빛의 경험을 만들어 냅니다. 라이팅 패턴을 통해 내 차 만의 딜라이트한 디지털 라이팅의 경험을 느껴보세요.디지털 라이팅 그릴의 다이나믹한 패턴은 운전자에 반응하여 역동적이고 마법같은 빛의 경험을 만들어 냅니다. 라이팅 패턴을 통해 내 차 만의 딜라이트한 디지털 라이팅의 경험을 느껴보세요.디지털 라이팅 그릴의 다이나믹한 패턴은 운전자에 반응하여 역동적이고 마법같은 빛의 경험을 만들어 냅니다. 라이팅 패턴을 통해 내 차 만의 딜라이트한 디지털 라이팅의 경험을 느껴보세요.</p>
<p class="descript">
디지털 라이팅 그릴의 다이나믹한 패턴은 운전자에 반응하여 역동적이고 마법같은 빛의 경험을 만들어 냅니다. 라이팅 패턴을 통해 내 차 만의 딜라이트한 디지털 라이팅의 경험을 느껴보세요.디지털 라이팅 그릴의 다이나믹한
패턴은 운전자에 반응하여 역동적이고 마법같은 빛의 경험을 만들어 냅니다. 라이팅 패턴을 통해 내 차 만의 딜라이트한 디지털 라이팅의 경험을 느껴보세요.디지털 라이팅 그릴의 다이나믹한 패턴은 운전자에 반응하여 역동적이고
마법같은 빛의 경험을 만들어 냅니다. 라이팅 패턴을 통해 내 차 만의 딜라이트한 디지털 라이팅의 경험을 느껴보세요.
</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
@@ -386,15 +593,14 @@
</div>
</div>
<div class="mainProductItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="item">
<a href="product/product-carsw-view.html" class="imageArea">
<p class="productSmallVideo">
<img src="assets/images/sample_pdp/sample_main_product_pc_02.png" alt="이미지 상품명">
<img src="assets/images/sample_pdp/sample_main_product_pc_02.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image:url('assets/images/sample_pdp/sample_main_product_mo_02.png');">
<div class="infoArea" style="background-image: url('assets/images/sample_pdp/sample_main_product_mo_02.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
@@ -406,7 +612,7 @@
<span>구매가능</span>
</div>
<h2>RSPA2</h2>
<p class="descript">피곤했던 드라이브를 깔끔하게 마무리하고 싶으신가요?<br>버튼 하나만 누르면 쉽게 주차해주는 RSPA 2가 여러분을 기다립니다.</p>
<p class="descript">피곤했던 드라이브를 깔끔하게 마무리하고 싶으신가요?<br />버튼 하나만 누르면 쉽게 주차해주는 RSPA 2가 여러분을 기다립니다.</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
@@ -431,10 +637,10 @@
<div class="item">
<a href="product/product-streaming-view.html" class="imageArea">
<p class="productSmallVideo">
<img src="assets/images/sample_pdp/sample_main_product_pc_03.png" alt="이미지 상품명">
<img src="assets/images/sample_pdp/sample_main_product_pc_03.png" alt="이미지 상품명" />
</p>
</a>
<div class="infoArea" style="background-image:url('/assets/images/sample_pdp/sample_main_product_mo_03.png');">
<div class="infoArea" style="background-image: url('/assets/images/sample_pdp/sample_main_product_mo_03.png')">
<div class="infoTop">
<!-- 신상품, 프로모션, 구매가능 모두 조건에 해당되지 않으면, tag 영역은 전체 노출되지 않습니다. -->
<div class="tag">
@@ -446,8 +652,10 @@
<span>구매가능</span>
</div>
<h2>Streaming Plus</h2>
<p class="descript">AVNT를 통한 제어를 통해 유명 음악 스트리밍을 보다 쉽고 빠르게 할 수 있습니다.<br>
블루투스로 전화를 연결하는 번거로움과 낮은 음질은 문제가 되지않습니다.</p>
<p class="descript">
AVNT를 통한 제어를 통해 유명 음악 스트리밍을 보다 쉽고 빠르게 할 수 있습니다.<br />
블루투스로 전화를 연결하는 번거로움과 낮은 음질은 문제가 되지않습니다.
</p>
</div>
<div class="infoBottom">
<div class="listOtionPrice">
@@ -467,40 +675,41 @@
</div>
</div>
</div>
</div>
<!--//content-warp-->
<div class="mainSevice">
<div class="left">
<h2>궁금하신 점이나<br> 문의사항이 있으신가요?</h2>
<h2>
궁금하신 점이나<br />
문의사항이 있으신가요?
</h2>
</div>
<div class="right">
<a href="service/faq.html"><p class="faq"><span>자주 찾는 질문</span></p></a>
<a href="service/inquiry-list.html"><p class="cs"><span>문의하러 가기</span></p></a>
<a href="service/faq.html"
><p class="faq"><span>자주 찾는 질문</span></p></a
>
<a href="service/inquiry-list.html"
><p class="cs"><span>문의하러 가기</span></p></a
>
</div>
</div>
<!-- [S] 배너 영역 -->
<div class="mainBannerArea">
<div class="mainBannerImageArea">
<!-- 배너 PC 이미지 입니다. -->
<img src="assets/images/kia/event_banner_pc.jpg" alt="이미지 상품명" class="mainBannerPC">
<img src="assets/images/kia/event_banner_pc.jpg" alt="이미지 상품명" class="mainBannerPC" />
<!-- 배너 모바일 이미지 입니다. -->
<img src="assets/images/kia/event_banner_mobile.jpg" alt="이미지 상품명" class="mainBannerMO">
<img src="assets/images/kia/event_banner_mobile.jpg" alt="이미지 상품명" class="mainBannerMO" />
</div>
<div class="mainBannerInfo">
<div class="mainBannerInfoInner">
<div class="textArea">
<div class="title">
RSAP2
</div>
<div class="title">RSAP2</div>
<div class="text">
피곤했던 드라이브를 간편하게 마무리하고 싶으신가요?<br>
피곤했던 드라이브를 간편하게 마무리하고 싶으신가요?<br />
버튼 하나로 쉽게 주차를 도와주는 RSPA 2가 여러분을 기다립니다.
</div>
</div>
@@ -521,7 +730,7 @@
<h2>공지사항</h2>
<div class="mainNiticeList">
<ul class="swiper-wrapper">
<li class="swiper-slide">
<li class="swiper-slide">
<a href="service/notice-view.html">
<dl>
<dt>2023.03.09</dt>
@@ -529,7 +738,7 @@
</dl>
</a>
</li>
<li class="swiper-slide">
<li class="swiper-slide">
<a href="service/notice-view.html">
<dl>
<dt>2023.03.11</dt>
@@ -547,131 +756,133 @@
</div>
</div>
<!--//mainNotice-->
<!--//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">
<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">
<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>
<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>
<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 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>
</div>
</div>
<p class="copyRight"><span></span> Kia CORP. ALL RIGHTS RESERVED.</p>
</div>
<div class="popInner payInfo" style="display:none;">
<div class="popContents">
<h1>결제 방법 안내</h1>
<div class="payInfoCon">
<p>
<strong>등록된 결제 방법이 없어 요금제 가입 진행이 불가합니다. 결제 카드 등록은 블루링크 App에서 진행해주시길 바랍니다.</strong>
</p>
</div>
<div>
<div class="oneButton">
<a href=""><p>닫기</p></a>
</div>
</div>
</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>
<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">
<div class="popContents">
<h1>결제 방법 안내</h1>
<div class="payInfoCon">
<p>
<strong>등록된 결제 방법이 없어 요금제 가입 진행이 불가합니다. 결제 카드 등록은 블루링크 App에서 진행해주시길 바랍니다.</strong>
</p>
</div>
<div>
<div class="oneButton">
<a href=""><p>닫기</p></a>
</div>
</div>
</div>
</div>
</div>
<!--//footer-->
<script>
AOS.init();
</script>
</body>
</html>

View File

@@ -31,7 +31,7 @@
<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?v1811453"></script>
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v12811453"></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?v81552" type="text/css" />
@@ -239,7 +239,7 @@
<div class="infoStickyInner">
<div class="stickyLeft">
<p>
<strong>NBA 디스플레이 테마</strong>
<strong>KBO 디스플레이 테마</strong>
<!-- <span>30개 NBA 팀의 개성있는 디스플레이 테마로 분위기 업업~!!!</span> -->
</p>
</div>
@@ -507,6 +507,7 @@
<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="displayThemeDtl">
<p class="swiper-info">좌우 화살표를 눌러 더 많은 디자인을 확인해보세요!</p>
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
@@ -567,7 +568,7 @@
<div class="comp_body">
<div class="text_area">
<h4 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Welcome Video</h4>
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">NBA팀별 로고와 캐릭터가 반영된 Video가 차량 Sleep 모드 동작 이후 차량 시동을 켤 때에 1회 실행됩니다.</p>
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">KBO팀별 로고와 캐릭터가 반영된 Video가 차량 Sleep 모드 동작 이후 차량 시동을 켤 때에 1회 실행됩니다.</p>
</div>
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<video class="video-welcome" playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
@@ -579,7 +580,7 @@
<div class="comp_body">
<div class="text_area">
<h4 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Goodbye Video</h4>
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">NBA팀별 로고와 컨셉이 반영된 Video가 차량 시동이 꺼질 때 마다 실행됩니다.</p>
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">KBO팀별 로고와 컨셉이 반영된 Video가 차량 시동이 꺼질 때 마다 실행됩니다.</p>
</div>
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<video class="video-goodbye" playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
@@ -638,34 +639,40 @@
<h2>정보고시</h2>
<div class="disclaimerList">
<div class="item">
<div class="title">이용조건</div>
<div class="title">단말기 안내</div>
<div class="bar"></div>
<ul class="contents">
<li>상품 구매 및 이용가능 여부는 차량에 설치된 하드웨어 구성 및 OTA펌웨어 버전에 따라 다르기에 로그인하시면 확인하실 수 있습니다.</li>
<li>상품 이용을 위해 구입 후 가이드에 따라 차량에 설치를 완료하셔야 합니다.</li>
<li>EV6 (2021 이후, EV6 GT, Niro (2022), Sportage (2021 이후), K3 (2022), K9 (2021 이후)</li>
</ul>
</div>
<div class="item">
<div class="title">이용기간</div>
<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>품명 및 모델명 : 사양 설명 및 사양 이미지 참조</li>
<li>구성품 : 사양 설명 및 사양 이미지 참조</li>
<li>품질보증기준 : 관련 법 소비자 분쟁해결 규정에 따름</li>
<li>제조사/수입자 : 사양 설명 및 사양 이미지 참조</li>
<li>
월/연 구독은 언제든지 취소할 수 있으며<br />
- 기능을 한번도 이용하지 않은 고객이 7일 이내에 구독 취소를 한 경우에는 구독 비용이 전액 환불됩니다.<br />
- 7일 이내 기능을 이용하거나 7일 이후에 구독 취소를 한 경우에는 중도 해지 및 이에 따른 환불이 가능합니다.<br />
유의사항<br />
※ 해당 내용은 전자상거래 등에서의 사양정보제공 고시에 따라 작성되었습니다
</li>
</ul>
</div>
<div class="item">
<div class="title">A/S 안내</div>
<div class="bar"></div>
<ul class="contents">
<li>무상 A/S 정책</li>
<li>품질 보증 기간: 활성화 일 부터 3개월 (구매 증빙 필요)</li>
<li>품질보증기간 내 정상 사용 상태에서 기능이나 성능상 하자가 발생한 경우 무상으로 서비스 신청이 가능합니다.</li>
<li>품질보증기간 내 제품 하자가 맞을 경우, 전국 Kia 정비센터에 방문하셔서 수리를 받을 수 있습니다.</li>
<li>
제품하자/고장이 아닌 경우, 고객 과실 및 취급부주의에 의한 고장일 경우, 제품 시리얼 넘버가 식별이 불가 시,<br />
품질 보증 기간 이후에는 유상 서비스가 제공됩니다.
</li>
<li>구매 취소는 차량 내 설치된 상품이 삭제완료 된 후에 진행됩니다.</li>
</ul>
</div>
@@ -673,21 +680,28 @@
<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>
<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="title">기타 유의사항</div>
<div class="bar"></div>
<ul class="contents">
<li>기타 문의는 고객센터(080-200-2000)나 1:1문의로 신청바랍니다.</li>
<li>구독 서비스를 해지하시면 해지한 다음달부터 결제가 진행되지 않습니다.</li>
<li>
만약 이미 결제된 서비스에 대해 결제 취소를 원하시는 경우, 결제 7일 이내에 홈페이지 또는 고객센터를 통해 결제 취소 신청을 해 주셔야 합니다. <br />
단, 구독 사양과 쿠폰 등을 이미 사용/등록하신 경우에는 결제취소가 불가합니다. (예시: 5월 구독 해지 신청 시, 6월부터 결제되지 않음 / <br />
5월 결제 건에 대해 취소가 필요한 경우, 별도 결제 취소 신청)
</li>
<li>모든 가격은 부가가치세가 포함된 가격이며, 추가로 결제되는 금액은 없습니다.</li>
<li>서비스 구매한 날짜에 매월 정기결제 됩니다. 결제한 날짜가 다음 달에 없다면 마지막일로 정기결제일이 변경 됩니다.</li>
</ul>
</div>
</div>