153 lines
6.4 KiB
PHP
153 lines
6.4 KiB
PHP
<?php $bland_code = "kia"; ?>
|
||
<!--
|
||
//메타의 각 브랜드 별 코드는 hyundai,genesis 입니다.
|
||
//브랜드 별 경로에 따라 해당 코드를 변경해주세요.
|
||
-->
|
||
<?php $gnbStyleCode = "hskey"; ?>
|
||
<!--
|
||
페이지 별 붙박이 코드입니다. 해당 변수는 JSP로만 변경해주시고, 값은 그대로 유지만 시켜주시면 됩니다.
|
||
-->
|
||
|
||
|
||
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<title>제품상세명 > 제품리스트 > 회사명</title>
|
||
<!--
|
||
//위에 순서대로 title 이 변경되어야 합니다.
|
||
-->
|
||
<?php
|
||
include($_SERVER['DOCUMENT_ROOT']."/kr/include/meta.php");
|
||
?>
|
||
<!--상품상세 페이지 css 분리-->
|
||
<link rel="stylesheet" charset="UTF-8" href="/kr/assets/css/service.css?v1" type="text/css" />
|
||
|
||
<?php
|
||
include($_SERVER['DOCUMENT_ROOT']."/kr/include/style.php");
|
||
?>
|
||
|
||
|
||
</head>
|
||
<body id="event">
|
||
<div class="contentHeaderCase case05"> </div>
|
||
|
||
<!--//header-->
|
||
<?php
|
||
include($_SERVER['DOCUMENT_ROOT']."/kr/include/header.php");
|
||
?>
|
||
<!--//header-->
|
||
|
||
<div class="pageTitle">
|
||
<h1>사양별 이용안내</h1>
|
||
</div>
|
||
|
||
<div class="contentWarp">
|
||
<div class="contentsTypeNew caseUsageDetail">
|
||
<section class="caseInfoWrap">
|
||
<h2 class="titleCase01">부스트 이용 방법</h2>
|
||
<img src="../assets/images/kia/contents/imgCaseInfo_boost.jpg" alt="부스트 이용 방법" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||
<div>
|
||
<h3 class="titleCase02" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||
부스트
|
||
</h3>
|
||
<p class="txtCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||
부스트는 향상된 가속성능을 제공합니다.<br>
|
||
구매 및 설치 후 별다른 설정 없이 활성화 됩니다.<br>
|
||
(클러스터에서 ‘BOOST ON’을 확인할 수 있습니다.)
|
||
|
||
<span style="color: #676767; display: block; padding-top: 15px;">
|
||
※ AWD 차량만 구매할 수 있습니다.
|
||
</span>
|
||
</p>
|
||
|
||
</div>
|
||
</section>
|
||
|
||
<section class="caseFunction">
|
||
<h2 class="titleCase01" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">클러스터 테마 변경 방법</h2>
|
||
|
||
<section class="storeGuideItem" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||
<header class="case">
|
||
<h3 class="titleCase03">차량</h3>
|
||
<strong>2 STEP</strong>
|
||
</header>
|
||
|
||
<div class="swiper swiper1">
|
||
<ul class="swiper-wrapper caseWide">
|
||
<li class="swiper-slide">
|
||
<img class="noBorder" src="../assets/images/kia/contents/boost01_1.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
|
||
<b>STEP 01</b>
|
||
<p class="caseBlack txtCase01">설정 > 화면구성>클러스터 테마 선택을 선택하고, ‘드라이브 모드’를 선택합니다.</p>
|
||
</li>
|
||
<li class="swiper-slide">
|
||
<img class="noBorder" src="../assets/images/kia/contents/boost01_2.jpg" alt="게임에 대한 설명을 참고한 후 게임을 실행">
|
||
<b>STEP 02</b>
|
||
<p class="caseBlack txtCase01">‘SPORT’모드로 드라이브 모드를 변경합니다.</p>
|
||
</li>
|
||
</ul>
|
||
<div class="swiper-scrollbar"></div>
|
||
<div class="swiper-scrollbar-after-space"></div>
|
||
</div>
|
||
<div class="swiper-button-next btnNextSlide1"></div>
|
||
<div class="swiper-button-prev btnPrevSlide1"></div>
|
||
</section>
|
||
</section>
|
||
|
||
<div class="contentsBtnWarp">
|
||
<div class="oneButton">
|
||
<a href="../info/product-usage-guide"><p>목록</p></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!--//footer-->
|
||
<?php
|
||
include($_SERVER['DOCUMENT_ROOT']."/kr/include/footer.php");
|
||
?>
|
||
<!--//footer-->
|
||
<script>
|
||
$(document).on('click','.functionTab button',function(){
|
||
var tabIndex = $(this).parent().index() +1;
|
||
$(this).parent('li').addClass('active').siblings('li').removeClass('active');
|
||
$('.caseFunction>section:nth-of-type('+tabIndex+')').show().siblings('section').hide();
|
||
});
|
||
|
||
var swiper1 = new Swiper(".swiper1", {
|
||
slidesPerView: "auto",
|
||
roundLengths: true,
|
||
//freeMode: true,
|
||
scrollbar: {
|
||
el: ".swiper-scrollbar",
|
||
hide: true,
|
||
},
|
||
navigation: {
|
||
nextEl: ".btnNextSlide1",
|
||
prevEl: ".btnPrevSlide1",
|
||
},
|
||
});
|
||
|
||
var swiper2 = new Swiper(".swiper2", {
|
||
slidesPerView: "auto",
|
||
roundLengths: true,
|
||
//freeMode: true,
|
||
scrollbar: {
|
||
el: ".swiper-scrollbar",
|
||
hide: true,
|
||
},
|
||
navigation: {
|
||
nextEl: ".btnNextSlide2",
|
||
prevEl: ".btnPrevSlide2",
|
||
},
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|
||
|
||
|
||
|
||
|
||
|
||
|