Update Kia HTML and CSS files for improved layout and consistency

- Added a note in the Kia HTML file to remind users to check available digital specifications for each vehicle.
- Updated common CSS files to include a new background image for enhanced visual appeal.
- Adjusted various HTML files to ensure consistent links to the customer service and notice sections across multiple pages.
This commit is contained in:
2025-04-29 23:47:51 +09:00
parent 9822260997
commit 2b9d51aea5
109 changed files with 2504 additions and 1927 deletions

View File

@@ -31,10 +31,10 @@
<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_before.js?v1.1"></script>
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1811452"></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_before.css?v1.1" type="text/css" />
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v81552" 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">
@@ -119,28 +119,35 @@
<!-- PC 모바일 공통 메뉴 영역입니다. -->
<ul class="menu">
<li class="menuDepth1Wrap">
<a href="../kia.html#mainProductList" class="menuDepth1">디지털 사양</a>
<a href="../kia.html#mainProductList" class="menuDepth1 lower">디지털 사양</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>
<h3>디지털 사양</h3>
<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>
<li class="menuDepth2"><a href="#">KBO 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="#">NBA 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="#">아케이드 게임</a></li>
<li class="menuDepth2"><a href="#">원격 스마트 주차 보조(RSPA 2)</a></li>
<li class="menuDepth2"><a href="#">부스트(The 2025 EV9)</a></li>
<li class="menuDepth2"><a href="#">라이팅 패턴</a></li>
<li class="menuDepth2"><a href="#">스마트 회생 시스템 플러스</a></li>
<li class="menuDepth2"><a href="#">스트리밍 프리미엄</a></li>
<li class="menuDepth2"><a href="#">스트리밍 플러스</a></li>
</ul>
</div>
</li>
<li class="menuDepth1Wrap">
<a href="../info/product-usage-guide.html" class="menuDepth1" data-url="../info/product-usage-guide.html">사양별 이용 안내</a>
<div class="menuDepth2Wrap info">
<h3>사양별 이용 안내</h3>
</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>
<h3>스토어 소개</h3>
<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/registration-guide.html">스토어 가입안내</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>
@@ -149,14 +156,11 @@
<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>
<h3>고객지원</h3>
<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="../info/as-guide.html">고객센터 및 AS안내</a></li>
<li class="menuDepth2"><a href="../service/notice-list.html">공지사항</a></li>
</ul>
</div>
@@ -241,8 +245,8 @@
<div class="infoStickyInner">
<div class="stickyLeft">
<p>
<strong>Kia Dynamic LED</strong>
<span>Light Type-A</span>
<strong>NBA 디스플레이 테마</strong>
<!-- <span>30개 NBA 팀의 개성있는 디스플레이 테마로 분위기 업업~!!!</span> -->
</p>
</div>
<div class="stickyRight">
@@ -263,17 +267,14 @@
<div class="productImg">
<div class="swiper productSwiper">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp1.png" alt="이미지 상품명"></div>
<div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp2.png" alt="이미지 상품명"></div>
<div class="swiper-slide withVideo">
<div class="movie_info">이미지를 클릭해주세요.</div>
<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>
<video loop="" muted="" playsinline="" preload="auto"><source src="https://connectstore.kia.com/kr/ux_data/product/20240618/76e272db64cf42e797afdd658078aa40.mp4" type="video/mp4"></video>
<img src="https://connectstore.kia.com/kr/ux_data/product/20240620/67d138601d5e4862bb9bea3099a0112f.png" alt="NBA 디스플레이 테마" style="opacity: 1;"></p>
</div>
<div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp4.png" alt="이미지 상품명"></div>
<div class="swiper-slide swiper-slide-active" role="group" aria-label="2 / 3"><img src="https://connectstore.kia.com/kr/ux_data/product/20240620/a3f13b0fc6d3431cb2f974d4d6e9ed49.png" alt="NBA 디스플레이 테마"></div>
<div class="swiper-slide swiper-slide-next" role="group" aria-label="3 / 3"><img src="https://connectstore.kia.com/kr/ux_data/product/20240620/a4d0651092c94e0abf50b8b21f8dee1f.png" alt="NBA 디스플레이 테마"></div>
</div>
<div class="swiper-pagination"></div>
</div>
@@ -282,9 +283,9 @@
<div class="productRight">
<div class="optionWarp">
<div class="producTitle">
<span>차량SW</span>
<h1>Kia Dynamic LED</h1>
<p>특별하고 빛나는 것을 좋아 하시나요? 일상에 기쁨을 더해주는 빛의 변주, 딜라이팅 라이팅이 당신을 기다립니다.</p>
<!-- <span>차량SW</span> -->
<h1>NBA 디스플레이 테마</h1>
<p>운전에 스타일을 더 하는 특별한 테마</p>
</div>
<div class="producOption scroll">
<h2>구성 상품</h2>
@@ -295,20 +296,27 @@
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme1.png" alt="Atlanta Hawks"></p>
<div class="optionText">
<p>
<strong>Atlanta Hawks</strong>
<span>애틀란타 호크스</span>
<strong>
애틀란타 호크스
<em>Atlanta Hawks</em>
</strong>
<span>"True to Atlanta" - Feel the intensity with the Atlanta Hawks.</span>
</p>
</div>
</label>
</div>
<div class="checkBtn withVideo">
<input type="checkbox" name="check" id="check2" value="Boston Celtics">
<div class="checkBtn disabledBtn ">
<input type="checkbox" name="check" id="check2" value="Boston Celtics" disabled>
<label for="check2">
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme2.png" alt="Boston Celtics"></p>
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme2_2.png" alt="Boston Celtics"></p>
<div class="optionText">
<p>
<strong>Boston Celtics</strong>
<span>역동적인 느낌을 표현</span>
<strong>
보스턴 셀틱스
<em>Boston Celtics</em>
</strong>
<span>Boston Celtics gogo~~~!!! Boston Celtics gogo~~~!!!</span>
<i class="badge">구매완료</i>
</p>
</div>
</label>
@@ -319,8 +327,12 @@
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme3.png" alt="Chicago Bulls"></p>
<div class="optionText">
<p>
<strong>Chicago Bulls</strong>
<span>하이테크적인 미래 감성을 표현</span>
<strong>
시카고 불스
<em>chicago bulls</em>
</strong>
<span>"True to Atlanta" - Feel the intensity with the Atlanta Hawks.</span>
<i class="badge">구매완료</i>
</p>
</div>
</label>
@@ -331,8 +343,11 @@
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme4.png" alt="Brooklyn Nets"></p>
<div class="optionText">
<p>
<strong>Brooklyn Nets</strong>
<span>강인하고 견고한 느낌을 표현</span>
<strong>
브루클린 넷츠
<em>Brooklyn Nets</em>
</strong>
<span>"True to Atlanta" - Feel the intensity with the Atlanta Hawks.</span>
</p>
</div>
</label>
@@ -343,7 +358,10 @@
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme5.png" alt="Charlotte Hornets"></p>
<div class="optionText">
<p>
<strong>Charlotte Hornets</strong>
<strong>
샬럿 호넷
<em>charlotte hornets</em>
</strong>
<span>세련된 패턴으로 품격을 표현</span>
</p>
</div>
@@ -361,6 +379,18 @@
</div>
</label>
</div>
<div class="checkBtn">
<input type="checkbox" name="check" id="check6" value="ELEGANT">
<label for="check6">
<p><img src="../assets/images/kia/pdp/display_theme/NBA_Theme6.png" alt="ELEGANT"></p>
<div class="optionText">
<p>
<strong>ELEGANT</strong>
<span>역동적인 사선 패턴</span>
</p>
</div>
</label>
</div>
</div>
</div>
@@ -370,24 +400,12 @@
<div class="radioBtn">
<input type="radio" name="radioBtn" id="radioOne" value="평생이용권 150000">
<label for="radioOne">
<span>평생 이용</span>
<strong>₩ 150,000</strong>
</label>
</div>
<div class="radioBtn">
<input type="radio" name="radioBtn" id="radioTwo" value="일반 정기 구독 150000">
<label for="radioTwo">
<span>일반 정기 구독</span>
<strong>₩ 12,000/월</strong>
</label>
</div>
<div class="radioBtn disabledBtn">
<input type="radio" name="radioBtn" id="radioThree" value="1개월 무료 정기구독 150000" disabled>
<label for="radioThree">
<span>1개월 무료 정기 구독</span>
<strong>₩ 12,000/월</strong>
<span>평생 이용</span>
<span>
<span class="discount"><i>₩ 29,900</i></span>
<span class="price"><b class="dc">16%</b><strong>₩ 5,000</strong></span>
</span>
</label>
</div>
</div>
@@ -395,12 +413,13 @@
<div class="priceTotal">
<dl class="total">
<dt>총 결제 금액</dt>
<dd>\ 150,000</dd>
<dd>₩ 5,000</dd>
</dl>
<div class="paymentButton towButton">
<button class="cartBtn leftBtn"><p>장바구니</p></button>
<button class="PurchaseBtn rightBtn"><p>구매하기</p></button>
<div class="paymentButton oneButtonLine">
<!-- <button class="cartBtn leftBtn"><p>장바구니</p></button> -->
<button class="PurchaseBtn leftBtn"><p>바로구매</p></button>
</div>
</div>
</div>
</div>
@@ -415,145 +434,150 @@
<div class="comp_wide comp_1x_w_v_o_b displayTheme">
<div class="image_area visualBg">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme1_screen.png" class="web" alt="디스플레이 테마 이미지">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme1_screen_m.png" class="mobile" alt="디스플레이 테마 이미지">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme_screen.jpg" class="web" alt="디스플레이 테마 이미지">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme_screen_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">
누구보다 돋보이게 빛나고, 차별화 된 라이팅 패턴
다채로운 NBA팀의 테마를 차량 디스플레이에 적용해보세요
</h3>
<div class="info" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
운전자가 다가가면 다이나믹하게 반응하는 라이팅 패턴으로 내 차만의 특별한 존재감을 확인해 보세요.
아래의 로고를 눌러 미리 차량에 적용된 디자인을 확인 할 수 있습니다.
</div>
</div>
</div>
</div>
<div class="comp_md layer_up"></div>
<div class="comp_bottom">
<div class="comp_bottom thumb-swiper">
<div class="btn-intro">
Intro영상 다시보기
</div>
<div class="com_bottm_inner">
<div class="swiper pdpDisplayThemeSwiper">
<div class="swiper-wrapper">
<div class="swiper-slide dtthumb" value="NBA_Theme1">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme01.png" alt="Atlanta Hawks">
<p>Atlanta Hawks</p>
<p>Atlanta <br>Hawks</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme2">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme02.png" alt="Boston Celtics">
<p>Boston Celtics</p>
<p>Boston <br>Celtics</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme3">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme03.png" alt="brooklyn nets">
<p>brooklyn nets</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme4">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme04.png" alt="CHICAGO BULLS">
<p>CHICAGO BULLS</p>
<p>brooklyn <br>nets</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme5">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme04.png" alt="CHICAGO BULLS">
<p>CHICAGO <br>BULLS</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme4">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme05.png" alt="Charlotte hornets">
<p>Charlotte hornets</p>
<p>Charlotte <br>hornets</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme6">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme06.png" alt="cleveland cavaliers">
<p>cleveland cavaliers</p>
<p>cleveland <br>cavaliers</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme7">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme07.png" alt="dallas mavericks">
<p>dallas mavericks</p>
<p>dallas <br>mavericks</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme8">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme08.png" alt="Denver Nuggets">
<p>Denver Nuggets</p>
<p>Denver <br>Nuggets</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme9">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme09.png" alt="Detroit Pistons">
<p>Detroit Pistons</p>
<p>Detroit <br>Pistons</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme10">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme10.png" alt="Golden State Warriors">
<p>Golden State Warriors</p>
<p>Golden State <br>Warriors</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme11">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme11.png" alt="Houston Rockets">
<p>Houston Rockets</p>
<p>Houston <br>Rockets</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme12">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme12.png" alt="Indiana Pacers">
<p>Indiana Pacers</p>
<p>Indiana <br>Pacers</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme13">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme13.png" alt="Los Angeles Clippers">
<p>Los Angeles Clippers</p>
<p>Los Angeles <br>Clippers</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme14">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme14.png" alt="Los Angeles Lakers">
<p>Los Angeles Lakers</p>
<p>Los Angeles <br>Lakers</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme15">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme15.png" alt="Memphis Grizzlies">
<p>Memphis Grizzlies</p>
<p>Memphis <br>Grizzlies</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme16">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme16.png" alt="Miami Heat">
<p>Miami Heat</p>
<p>Miami <br>Heat</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme17">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme17.png" alt="Milwaukee Bucks">
<p>Milwaukee Bucks</p>
<p>Milwaukee <br>Bucks</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme18">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme18.png" alt="Minnesota Timberwolves">
<p>Minnesota Timberwolves</p>
<p>Minnesota <br>Timberwolves</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme19">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme19.png" alt="New Orleans Pelicans">
<p>New Orleans Pelicans</p>
<p>New Orleans <br>Pelicans</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme20">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme20.png" alt="New York Knicks">
<p>New York Knicks</p>
<p>New York <br>Knicks</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme21">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme21.png" alt="Oklahoma City Thunder">
<p>Oklahoma City Thunder</p>
<p>Oklahoma City <br>Thunder</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme22">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme22.png" alt="Orlando Magic">
<p>Orlando Magic</p>
<p>Orlando <br>Magic</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme23">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme23.png" alt="philadelphia 76ers">
<p>philadelphia 76ers</p>
<p>philadelphia <br>76ers</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme24">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme24.png" alt="Phoenix Suns">
<p>Phoenix Suns</p>
<p>Phoenix <br>Suns</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme25">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme25.png" alt="Portland Trailblazers">
<p>Portland Trailblazers</p>
<p>Portland <br>Trailblazers</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme26">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme26.png" alt="Sacramento Kings">
<p>Sacramento Kings</p>
<p>Sacramento <br>Kings</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme27">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme27.png" alt="San Antonio Spurs">
<p>San Antonio Spurs</p>
<p>San Antonio <br>Spurs</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme28">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme28.png" alt="Toronto Raptors">
<p>Toronto Raptors</p>
<p>Toronto <br>Raptors</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme29">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme29.png" alt="Utah Jazz">
<p>Utah Jazz</p>
<p>Utah <br>Jazz</p>
</div>
<div class="swiper-slide dtthumb" value="NBA_Theme30">
<img src="../assets/images/kia/pdp/display_theme/NBA/logo_theme30.png" alt="Washington Wizards">
<p>Washington Wizards</p>
<p>Washington <br>Wizards</p>
</div>
</div>
@@ -564,45 +588,116 @@
</div>
</div>
</div>
<div class="comp_md layer_up video_wrap">
<div class="video-area">
<div class="video">
<div class="youtube-box" value="TZAmmWX7Kwo"></div>
<div class="btn-close">닫기</div>
</div>
</div>
<div class="close-today">
</div>
</div>
</div>
<div class="comp_wide comp_1x_b_v_s_b displayTheme">
<div class="comp_body dtlImgs">
<div class="theme-story">
</div>
<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/display_theme/NBA_Theme1-1.png" class="themeImg" alt="디스플레이 테마1">
</div>
<div class="text_area">
<h5>Cluster</h5>
<p>
해당 사양은 디지털 패턴 라이팅 그릴이 적용된 차량에 한해서 구매할 수 있습니다. 참고하시길 바랍니다.
</p>
<div class="displayThemeDtl">
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme1-1.png" class="themeImg" alt="디스플레이 테마1">
</div>
<div class="text_area">
<h5>Cluster</h5>
<p>
클러스터 화면에 응원하는 NBA팀의 로고와 팀 칼라가 적용됩니다.<br>
게이지와 함께 차 오르는 팀 정신을 느껴 보세요.
</p>
</div>
</div>
<div class="swiper-slide">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme1-2.png" class="themeImg" alt="디스플레이 테마2">
</div>
<div class="text_area">
<h5>Navigation</h5>
<p>
내비게이션의 각 메뉴 화면을 넘길 때 마다 특별한 NBA 팀 아이콘과 팀 칼라가 적용된 것을 확인할 수 있습니다.<br>
스타일리쉬하고 특별한 운전 경험을 완성합니다.
</p>
</div>
</div>
<div class="swiper-slide">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme/NBA_Theme1-3.png" class="themeImg" alt="디스플레이 테마3">
</div>
<div class="text_area">
<h5>Profile</h5>
<p>
NBA팀의 로고와 칼라를 활용하여 디자인된 다양한 프로필 이미지를 선택할 수 있습니다.<br>
운전자 별로 다른 이미지를 골라 보세요.
</p>
</div>
</div>
</div>
</div>
<div class="swiper-navigation">
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
<div class="item aos-init aos-animate" 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/display_theme/NBA_Theme1-2.png" class="themeImg" alt="디스플레이 테마1">
</div>
<div class="text_area">
<h5>Navigation</h5>
<p>
나만의 취향과 선호도에 맞게 앱 또는 차량 내에서 자유롭게 원하는 패턴을 선택할 수 있습니다.<br>
미래지향적인 디자인으로 차량을 더욱 세련되게 스타일링 할 수 있습니다.
</p>
</div>
</div>
</div>
<div class="comp_wide displayTheme welcome-goodbye">
<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>
</div>
<div class="item aos-init aos-animate" 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/display_theme/NBA_Theme1-3.png" class="themeImg" alt="디스플레이 테마1">
</div>
<div class="text_area">
<h5>Profile</h5>
<p>
나만의 취향과 선호도에 맞게 앱 또는 차량 내에서 자유롭게 원하는 패턴을 선택할 수 있습니다.<br>
미래지향적인 디자인으로 차량을 더욱 세련되게 스타일링 할 수 있습니다.
</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 playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme/lakers_welcome.mp4" type="video/mp4">
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
</div>
<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>
</div>
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme/lakers_goodbye.mp4" type="video/mp4">
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
</div>
</div>
@@ -615,10 +710,10 @@
</div>
<div class="text_area">
<h5>
디지털 패턴 라이팅 그릴 적용 한해서 구매가능
ccNC 차량에서 선택적 구매 가능
</h5>
<p>
해당 사양은 디지털 패턴 라이팅 그릴이 적용된 차량에 한해서 구매할 수 있습니다. 참고하시길 바랍니다.
기아 ccNC 인포테인먼트 플랫폼이 적용된 차량에만 선택 가능합니다.
</p>
</div>
</div>
@@ -631,7 +726,7 @@
고객 맞춤형 설정 기능
</h5>
<p>
고객 취향과 선호도에 따라 앱 또는 차량 내에서 패턴 설정을 커스터마이징할 수 있습니다.
여러 개의 테마를 구입하여 운전자 별로 다르게 설정할 수 있습니다.
</p>
</div>
</div>
@@ -650,7 +745,7 @@
<div class="listbtnWarp">
<div class="oneButton">
<a href="https://connectstore.kia.com/kr/info/product-usage-guide-lighting"><p>사양 이용안내</p></a>
<a href="https://connectstore.kia.com/kr/info/product-usage-guide-nba"><p>사양 이용안내</p></a>
</div>
</div>
@@ -869,7 +964,7 @@
</div>
</div>
<div class="popupWarp" style="display:none;">
<div class="popupWarp" style="display:none;">
<div class="popInner termsPop" style="display:none;">
<div class="popContents">
<h1>개인정보 수집/이용 및 기타 동의</h1>
@@ -921,6 +1016,21 @@
<!--//footer-->
<script>
AOS.init();
var swiper = new Swiper(".productSwiper", {
pagination: {
el: ".swiper-pagination",
clickable: true,
},
});
enterVideo()
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>