Files
fod/kr/info/product-usage-guide-srs.php

246 lines
14 KiB
PHP

<?php $bland_code = "kia"; ?>
<!--
//메타의 각 브랜드 별 코드는 hyundai,genesis 입니다.
//브랜드 별 경로에 따라 해당 코드를 변경해주세요.
-->
<?php $gnbStyleCode = "hskey"; ?>
<!--
페이지 별 붙박이 코드입니다. 해당 변수는 JSP로만 변경해주시고, 값은 그대로 유지만 시켜주시면 됩니다.
-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>제품상세명 &gt; 제품리스트 &gt; 회사명</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">&nbsp;</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_srsp.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">
스마트 회생 시스템 플러스 기능(내비게이션 연동 감속기능 4종)은 사양 구매 후 이용 할 수 있으며,
플러스 기능의 경우 내비게이션 목적지를 설정할 시 보다 정확한 서비스를 제공합니다.
플러스 기능을 구매하지 않을 시, 스마트 회생 시스템 기본 제공 기능만 이용 가능합니다.
<span style="color: #676767; display: block; padding-top: 15px;">
※ 플러스 기능은 한시적으로 0원 구매 무상 제공 중입니다.
</span>
<span style="color: #676767; display: block; padding-top: 8px;">
<em style="display: block;">※ 기본 제공 기능 :</em> 과속카메라 속도 조절 / 내리막길 속도 유지 / 선행차량 거리 유지 / 정차 제어
</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>
<div class="functionTab" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<ul>
<li class="active"><button><b>사양이용</b></button></li>
<li><button><b>기능설정</b></button></li>
</ul>
</div>
<script>
$(document).ready(function() {
const btn = $(".selectInner_new2").find(".btn-select");
const list = $(".selectInner_new2").find(".list-member");
$(document).on("click",".selectInner_new2 .btn-select",function(){
$(this).toggleClass("on");
});
$(document).on("click",".selectInner_new2 .list-member li button",function(event){
if (event.target.nodeName === "BUTTON") {
btn.html(event.target.innerText);
btn.removeClass('on');
var tabIndex = $(this).parent().index() +1;
$('.caseFunction>section:nth-of-type('+tabIndex+')').show().siblings('section').hide();
}
});
});
</script>
<div class="selectInner_new2">
<div class="cont-select">
<button class="btn-select">사양이용</button>
<ul class="list-member">
<li><button>사양이용</button></li>
<li><button>기능설정</button></li>
</ul>
</div>
</div>
<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>1 STEP</strong>
</header>
<div class="swiper swiper1">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/srsp01_1.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
<b>STEP 01</b>
<p class="caseBlack txtCase01">오른쪽 패들 시프트 레버를 약 0.5초 이상 당겨서 홀딩하면
스마트 회생 시스템이 작동되며, 클러스터에 단계 별로
표시되던 회생 제동량이 'AUTO' 표시등으로 전환 됩니다.</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 class="functionDetail">
<section class="storeGuideItem">
<header class="case" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<h4 class="titleCase03">거리 단계 조절</h4>
<strong>2 STEP</strong>
</header>
<div class="swiper swiper2">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img src="../assets/images/kia/contents/srsp02_1.jpg" alt="스마트 회생 시스템 기능 설정을 위해 인포테인먼트 시스템 홈 화면의 EV 항목을 선택">
<b>STEP 01</b>
<p class="caseBlack txtCase01">스마트 회생 시스템 기능 설정을 위해 인포테인먼트
시스템 홈 화면의 EV 항목을 선택합니다.</p>
</li>
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img class="noBorder" src="../assets/images/kia/contents/srsp02_2.jpg" alt="스마트 회생제동 메뉴에서, 스마트 회생 제동 거리 단계를 1~3단계로 설정">
<b>STEP 02</b>
<p class="caseBlack txtCase01">스마트 회생제동 메뉴에서, 스마트 회생 제동 거리 단계를 1~3단계로 설정하여 앞 차와의 거리를 조절 할 수
있습니다.</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"></div>
</div>
<div class="swiper-button-next btnNextSlide2"></div>
<div class="swiper-button-prev btnPrevSlide2"></div>
</section>
<section class="storeGuideItem">
<header data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<h4 class="titleCase03">내비게이션 연동기능 선택/해제</h4>
<strong>2 STEP</strong>
</header>
<div class="swiper swiper3">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img src="../assets/images/kia/contents/srsp02_1.jpg" alt="스마트 회생 시스템 기능 설정을 위해 인포테인먼트 시스템 홈 화면의 EV 항목을 선택">
<b>STEP 01</b>
<p class="caseBlack txtCase01">스마트 회생 시스템 기능 설정을 위해 인포테인먼트
시스템 홈 화면의 EV 항목을 선택합니다.</p>
</li>
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img class="noBorder" src="../assets/images/kia/contents/srsp03_1.jpg" alt="스마트 회생제동 메뉴에서, 스마트 회생 제동 거리 단계를 1~3단계로 설정">
<b>STEP 02</b>
<p class="caseBlack txtCase01">스마트 회생제동 메뉴에서, Kia Connect Store를 통해 구매 한 스마트 회생시스템 플러스 기능은 내비게이션
연동 선택/해제를 통해 on/off 할 수 있습니다.</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"></div>
</div>
<div class="swiper-button-next btnNextSlide3"></div>
<div class="swiper-button-prev btnPrevSlide3"></div>
</section>
</section>
</section>
<div class="contentsBtnWarp">
<div class="oneButton">
<a href="/kr/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>