gil/fod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'feature/20250824-gil-mickey' into feature/20250810-new-car-list

Browse Source
This commit is contained in:
NEW_GIL_HOME\hyeon
2025-08-27 23:10:10 +09:00
parent e51a668184 503f5cff56
commit 06e6efc41d
94 changed files with 2081 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

210
kr/assets/css/pdp_detail.css
View File

@@ -19,6 +19,15 @@
.comp_wide:first-child {
margin-top: 0;
}
.comp_wide .text-left {
text-align: left !important;
}
.comp_wide .text-center {
text-align: center !important;
}
.comp_wide .text-right {
text-align: right !important;
}
.comp_body {
width: 100%;
@@ -3820,6 +3829,9 @@
letter-spacing: -0.095rem;
line-height: 1.3;
}
.displayThemeDesney .comp_body .text_area h3.color-000 {
color: #000;
}
@media (min-width: 768px) {
.displayThemeDesney .comp_body .text_area h3 {
margin: 1.2rem 0 3rem;
@@ -3831,6 +3843,9 @@
letter-spacing: -0.075rem;
line-height: 1.5;
}
.displayThemeDesney .comp_body .text_area .info.color-000 {
color: #000;
}
.displayThemeDesney .comp_body .text_area .info br {
display: none;
}
@@ -3911,13 +3926,12 @@
.displayThemeDesney .available-theme .list ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
justify-content: center;
width: 100%;
gap: 5.6rem 0;
gap: 5.6rem 0.8rem;
}
@media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul {
justify-content: center;
gap: 2.4rem;
}
}
@@ -3959,6 +3973,7 @@
@media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul li a .txt {
padding: 2rem 2.4rem;
text-align: left;
}
}
.displayThemeDesney .available-theme .list ul li a .txt strong {
@@ -3989,23 +4004,13 @@
.displayThemeDesney .available-theme .list ul li.more {
overflow: visible;
position: relative;
display: block;
width: 100%;
aspect-ratio: 320/190;
padding: 0;
margin: 0;
background-color: transparent;
border-radius: 0;
box-shadow: none;
}
.displayThemeDesney .available-theme .list ul li.more a {
padding: 6.6666666667vw 5.5555555556vw;
}
@media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul li.more a {
padding: 4.8rem 4rem;
}
}
.displayThemeDesney .available-theme .list ul li.more:before {
content: "";
display: block;
@@ -4024,6 +4029,17 @@
background: url(../images/kia/pdp/display_theme_disney/box_more.png) no-repeat center/auto 100%;
}
}
.displayThemeDesney .available-theme .list ul li.more a {
display: block;
width: 100%;
height: 100%;
padding: 6.6666666667vw 5.5555555556vw;
}
@media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul li.more a {
padding: 4.8rem 4rem;
}
}
@media (min-width: 768px) {
.displayThemeDesney .available-theme .list ul li.more {
width: 57.4rem;
@@ -4059,14 +4075,15 @@
position: absolute;
top: -5.5rem;
left: 5rem;
background-color: #fbc707;
background-color: #fff;
border: 0.14rem solid #000;
padding: 0.6rem 0.9rem;
border-radius: 0.4rem;
font-size: 1.2rem;
color: #000;
line-height: 1.3;
font-weight: 600;
text-align: center;
text-align: left;
white-space: nowrap;
}
@media (min-width: 768px) {
@@ -4081,14 +4098,24 @@
}
.displayThemeDesney .available-theme .list ul li.more strong .speech-bubble::after {
content: "";
display: block;
position: absolute;
bottom: -1rem;
bottom: -0.7rem;
left: 50%;
transform: translateX(-50%);
border-left: 1rem solid transparent;
border-right: 1rem solid transparent;
border-top: 1rem solid #fbc707;
border-width: 0.7rem 0.7rem 0 0.7rem;
border-style: solid;
border-color: #000 transparent transparent transparent;
}
.displayThemeDesney .available-theme .list ul li.more strong .speech-bubble::before {
content: "";
position: absolute;
bottom: -0.6rem;
left: 50%;
transform: translateX(-50%);
border-width: 0.7rem 0.7rem 0 0.7rem;
border-style: solid;
border-color: #fff transparent transparent transparent;
z-index: 1;
}
.displayThemeDesney .available-theme .list ul li.more .arrow {
display: inline-block;
@@ -4135,6 +4162,7 @@
.displayThemeDesney .available-theme .list ul li.more .hashs {
font-size: 1.6rem;
margin-top: 2.2rem;
text-align: left;
}
}
.displayThemeDesney.discover-epic-design {
@@ -4152,6 +4180,14 @@
background: url(../images/kia/pdp/display_theme_disney/bg_design.jpg) no-repeat center top/192rem auto;
}
}
.displayThemeDesney.discover-epic-design.mickey {
background: url(../images/kia/pdp/display_theme_mickey/bg_design_m.jpg) no-repeat center top/100% auto;
}
@media (min-width: 768px) {
.displayThemeDesney.discover-epic-design.mickey {
background: url(../images/kia/pdp/display_theme_mickey/bg_design.jpg) no-repeat center top/192rem auto;
}
}
.displayThemeDesney.discover-epic-design .comp_top {
padding: 0 2rem 2.4rem;
}
@@ -4311,6 +4347,14 @@
background-image: url(../images/kia/pdp/display_theme_disney/ico_tab_active.png);
}
}
@media (min-width: 768px) {
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu.blue ul li.active .tab-btn {
background: linear-gradient(90deg, #1c5eed 0%, #1031b5 100%);
}
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu.blue ul li.active .tab-btn:before {
background: url(../images/kia/pdp/display_theme_mickey/ico_tab_active.png) no-repeat center top/100% auto;
}
}
.displayThemeDesney.discover-epic-design .tab-wrap .text_area {
margin-top: 1.6rem;
text-align: left;
@@ -4405,6 +4449,24 @@
margin-top: 0.4rem;
}
}
.displayThemeDesney.mickey .layer_up.comp_body .text_area {
margin-top: 11.4rem;
}
@media (min-width: 768px) {
.displayThemeDesney.mickey .layer_up.comp_body .text_area {
margin-top: 13.7rem;
}
}
.displayThemeDesney.mickey .available-theme .list ul li.more strong .speech-bubble {
top: -5.4rem;
transform: translateX(35%);
}
@media (min-width: 768px) {
.displayThemeDesney.mickey .available-theme .list ul li.more strong .speech-bubble {
top: -7.8rem;
transform: translateX(-20%);
}
}
.displayThemeDesney .image_area {
position: relative;
max-width: 100%;
@@ -4465,15 +4527,38 @@
display: none;
}
}
.displayThemeDesney .three-reasons .tit-area .inner {
position: relative;
padding-left: 1.8rem;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .tit-area .inner {
padding-left: 3.6rem;
}
}
.displayThemeDesney .three-reasons .tit-area .inner:before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 0.6rem;
height: 5rem;
background: #ea0029;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .tit-area .inner:before {
width: 1.2rem;
height: 10rem;
}
}
.displayThemeDesney .three-reasons .tit-area h3 {
display: inline-flex;
align-items: center;
height: 3.5rem;
padding: 0.4rem 0.8rem 0;
padding: 0;
font-size: 2.4rem;
color: #fff;
font-weight: 600;
background-color: #ed1c24;
white-space: nowrap;
}
@media (min-width: 768px) {
@@ -4481,17 +4566,16 @@
height: 6.4rem;
padding: 0 0.8rem;
font-size: 4.8rem;
line-height: 6.4rem;
}
}
.displayThemeDesney .three-reasons .tit-area p {
margin: 0 0 0.2rem;
font-size: 2.4rem;
color: #000;
font-weight: 600;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .tit-area p {
margin: 0 0 1.1rem;
font-size: 4.8rem;
color: #000;
}
@@ -4522,21 +4606,19 @@
}
}
.displayThemeDesney .three-reasons .reasons li p {
position: relative;
flex: 1;
padding: 1rem 2rem 0 4.2rem;
margin: 0 0 1.6rem 4rem;
padding: 1rem 2rem 0 3.6rem;
margin: 0 0 1.6rem 2rem;
font-size: 1.4rem;
color: #fff;
line-height: 1.52;
background: url(../images/kia/pdp/display_theme_disney/number1.png) no-repeat 0 0/2.3rem auto;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li p {
margin: 0;
padding: 0 2rem 0 7.2rem;
padding: 0 2rem 0 4.8rem;
font-size: 1.6rem;
background-position: 0 0;
background-size: 3.1rem auto;
}
}
.displayThemeDesney .three-reasons .reasons li p .add {
@@ -4549,26 +4631,64 @@
font-size: 1.4rem;
}
}
.displayThemeDesney .three-reasons .reasons li p::before {
content: "1";
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 1rem;
left: 0;
width: 2.4rem;
height: 2.4rem;
padding-top: 0.2rem;
font-size: 1.6rem;
color: #05141f;
font-weight: 600;
background-color: #fff;
box-shadow: 0px 0px 0.4rem 0px rgba(0, 0, 0, 0.6);
border-radius: 0.4rem;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li p::before {
top: 0.3rem;
width: 3.2rem;
height: 3.2rem;
font-size: 2rem;
box-shadow: 0px 0px 0.8rem 0px rgba(0, 0, 0, 0.6);
border-radius: 0.8rem;
}
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li:nth-child(1) p {
padding-bottom: 0.7rem;
}
}
.displayThemeDesney .three-reasons .reasons li:nth-child(2) p {
padding: 1rem 6rem 0 0;
padding: 1rem 3.6rem 0 0;
margin: 0 2rem 2.3rem 2rem;
background: url(../images/kia/pdp/display_theme_disney/number2.png) no-repeat calc(100% - 0.6rem) 0/3.7rem auto;
text-align: right;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li:nth-child(2) p {
padding: 0 2rem 0 7.2rem;
padding: 0 2rem 0 4.8rem;
margin: 0;
background-position: 0 1.2rem;
background-size: 5.1rem auto;
text-align: left;
}
}
.displayThemeDesney .three-reasons .reasons li:nth-child(2) p::before {
content: "2";
left: auto;
right: 0;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li:nth-child(2) p::before {
left: 0;
right: auto;
}
}
.displayThemeDesney .three-reasons .reasons li:nth-child(2) .img-area {
display: flex;
justify-content: center;
@@ -4581,23 +4701,27 @@
}
}
.displayThemeDesney .three-reasons .reasons li:nth-child(3) p {
padding-left: 5.4rem;
margin-left: 2.7rem;
background: url(../images/kia/pdp/display_theme_disney/number3.png) no-repeat 0 0/3.6rem auto;
margin-bottom: 2.8rem;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li:nth-child(3) p {
margin: 0;
padding: 0 2rem 0 7.2rem;
padding: 0 2rem 0 4.8rem;
background-position: 0 0;
background-size: 4.9rem auto;
}
}
.displayThemeDesney .three-reasons .reasons li:nth-child(3) p::before {
content: "3";
}
.displayThemeDesney .three-reasons .reasons li:nth-child(3) .img-area {
display: flex;
justify-content: flex-end;
padding-left: 8rem;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li:nth-child(3) .img-area {
justify-content: center;
padding-left: 0;
}
}
@@ -4648,7 +4772,7 @@
}
}
.displayThemeDesney .three-reasons .reasons li .img-area .img-msg img {
width: 18rem;
width: 50vw;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li .img-area .img-msg img {
@@ -4660,14 +4784,14 @@
justify-content: flex-end;
align-items: flex-start;
flex-direction: column;
width: 13rem;
height: 11.7rem;
width: 36.1111111111vw;
height: 32.5vw;
padding: 1.4rem;
font-size: 1rem;
font-weight: 600;
color: #fff;
line-height: 1.5;
background: url(../images/kia/pdp/display_theme_disney/img_reason_msg.png) no-repeat 0 0/100% auto;
background: url(../images/kia/pdp/display_theme_disney/img_reason_msg.png) no-repeat 0 0/cover;
}
@media (min-width: 768px) {
.displayThemeDesney .three-reasons .reasons li .img-area .img-msg .msg {

2
kr/assets/css/pdp_detail.css.map
View File

File diff suppressed because one or more lines are too long

309
kr/assets/css/pdp_detail.scss
View File

@@ -12,6 +12,16 @@
&:first-child {
margin-top: 0;
}
.text-left {
text-align: left !important;
}
.text-center {
text-align: center !important;
}
.text-right {
text-align: right !important;
}
}
.comp_body {
@@ -1563,7 +1573,7 @@
}
}
.btn-select.on+.list-member {
.btn-select.on + .list-member {
display: block;
}
@@ -1834,7 +1844,7 @@
font-size: 1.8rem;
}
>p {
> p {
position: relative;
width: 93%;
@@ -1910,7 +1920,7 @@
}
}
dt.active+dd {
dt.active + dd {
display: block;
}
@@ -2042,7 +2052,7 @@
}
}
button+button {
button + button {
margin-top: 1rem;
@include tablet {
@@ -2054,7 +2064,7 @@
}
}
>.dd-padding {
> .dd-padding {
padding-left: 6.5rem;
}
}
@@ -2075,9 +2085,10 @@
content: none;
}
&:hover {}
&:hover {
}
>p {
> p {
span {
color: #9ea1a2;
}
@@ -2085,7 +2096,7 @@
}
}
dl+dl {
dl + dl {
margin-top: 1rem;
}
}
@@ -2305,7 +2316,6 @@
}
@include maxtablet {
&:before,
&:after {
display: none;
@@ -2374,7 +2384,6 @@
// height: 10rem;
.comp_body {
.text_area {
// display: flex;
h3 {
font-size: 3rem;
@@ -2385,7 +2394,7 @@
font-size: 1.6rem;
}
>* {
> * {
flex: 1;
}
}
@@ -2461,7 +2470,7 @@
}
}
&+.item {
& + .item {
margin-top: 8rem;
@include maxtablet {
@@ -2475,7 +2484,7 @@
}
}
&+.comp_1x_b_v_s_b {
& + .comp_1x_b_v_s_b {
position: relative;
z-index: 2;
margin-top: 0;
@@ -2501,7 +2510,7 @@
margin-top: 8rem;
.comp_body {
&+.comp_body {
& + .comp_body {
margin-top: 10rem;
}
@@ -2518,7 +2527,7 @@
.displayThemeDtl {
.swiper-navigation {
>* {
> * {
top: 210px;
left: -65px;
width: 5rem;
@@ -2753,7 +2762,6 @@
}
@include maxtablet {
&:before,
&:after {
display: none;
@@ -2824,13 +2832,12 @@
.comp_body {
.text_area {
// display: flex;
h3 {
margin-bottom: 2rem;
}
>* {
> * {
flex: 1;
}
}
@@ -2899,7 +2906,7 @@
}
}
&+.item {
& + .item {
margin-top: 8rem;
@include maxtablet {
@@ -2913,7 +2920,7 @@
}
}
&+.comp_1x_b_v_s_b {
& + .comp_1x_b_v_s_b {
position: relative;
z-index: 2;
margin-top: 2rem;
@@ -3186,7 +3193,7 @@
}
}
.contentWarp .productView .productRight .optionWarp .producOption .optionList .checkBtn.type2 input[type="checkbox"]+label {
.contentWarp .productView .productRight .optionWarp .producOption .optionList .checkBtn.type2 input[type="checkbox"] + label {
height: auto;
padding: 2rem 2rem 2rem 0;
@@ -3382,13 +3389,12 @@
// }
.comp_body {
.text_area {
// display: flex;
h3 {
margin-bottom: 2rem;
}
>* {
> * {
flex: 1;
}
}
@@ -3418,7 +3424,7 @@
.comp_wide {
&.title-only {
&+.comp_wide {
& + .comp_wide {
margin-top: 4rem;
}
}
@@ -3666,7 +3672,6 @@
}
&.paused {
.btn-play,
.btn-sound {
display: block !important;
@@ -3798,7 +3803,6 @@
}
&.playing {
.comp_body.layer_up,
.thumb-swiper,
.pdpInCarGameSwiper,
@@ -3939,7 +3943,7 @@
.pdpDtl {
.swiper-navigation {
>* {
> * {
top: 210px;
left: -65px;
width: 5rem;
@@ -3988,7 +3992,8 @@
}
.scroll_area {
@include maxtablet {}
@include maxtablet {
}
.web {
display: block;
@@ -4282,7 +4287,7 @@
display: block;
.swiper-slide {
&+.swiper-slide {
& + .swiper-slide {
margin-top: 5rem;
}
}
@@ -4290,7 +4295,7 @@
}
.swiper-navigation {
>* {
> * {
top: 210px;
left: -65px;
width: 5rem;
@@ -4374,6 +4379,10 @@
letter-spacing: -0.095rem;
line-height: 1.3;
&.color-000 {
color: #000;
}
@include tablet {
margin: 1.2rem 0 3rem;
font-size: 4.8rem;
@@ -4385,6 +4394,10 @@
letter-spacing: -0.075rem;
line-height: 1.5;
&.color-000 {
color: #000;
}
br {
display: none;
@@ -4465,12 +4478,11 @@
ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
justify-content: center;
width: 100%;
gap: 5.6rem 0;
gap: 5.6rem 0.8rem;
@include tablet {
justify-content: center;
gap: 2.4rem;
}
@@ -4514,6 +4526,7 @@
@include tablet {
padding: 2rem 2.4rem;
text-align: left;
}
strong {
@@ -4537,7 +4550,7 @@
font-size: 1.6rem;
}
>* {
> * {
display: inline-block;
}
}
@@ -4553,7 +4566,6 @@
// height: vw(194);
aspect-ratio: 320 / 190;
// padding: 2.4rem 2rem;
padding: vw(24) vw(20);
margin: 0;
// border-radius: 2rem 0.8rem 2rem 0.8rem;
background-color: transparent;
@@ -4578,10 +4590,20 @@
}
}
a {
display: block;
width: 100%;
height: 100%;
padding: vw(24) vw(20);
@include tablet {
padding: 4.8rem 4rem;
}
}
@include tablet {
width: 57.4rem;
height: 36.9rem;
padding: 4.8rem 4rem;
margin: 0 0 0;
border-radius: 0;
box-shadow: none;
@@ -4615,14 +4637,15 @@
position: absolute;
top: -5.5rem;
left: 5rem;
background-color: #fbc707;
background-color: #fff;
border: 0.14rem solid #000;
padding: 0.6rem 0.9rem;
border-radius: 0.4rem;
font-size: 1.2rem;
color: #000;
line-height: 1.3;
font-weight: 600;
text-align: center;
text-align: left;
white-space: nowrap;
@include tablet {
@@ -4634,19 +4657,44 @@
font-size: 1.6rem;
}
// 말풍선 꼬리
&::after {
content: "";
display: block;
position: absolute;
bottom: -1rem;
bottom: -0.7rem; // 꼬리가 박스 아래로 나가게
left: 50%;
transform: translateX(-50%);
border-left: 1rem solid transparent;
border-right: 1rem solid transparent;
border-top: 1rem solid #fbc707;
@include tablet {}
border-width: 0.7rem 0.7rem 0 0.7rem; // 아래쪽이 뾰족
border-style: solid;
border-color: #000 transparent transparent transparent;
}
// 꼬리 내부 흰색 부분 (외곽선 안쪽)
&::before {
content: "";
position: absolute;
bottom: -0.6rem;
left: 50%;
transform: translateX(-50%);
border-width: 0.7rem 0.7rem 0 0.7rem;
border-style: solid;
border-color: #fff transparent transparent transparent;
z-index: 1;
}
// &::after {
// content: "";
// display: block;
// position: absolute;
// bottom: -1rem;
// left: 50%;
// transform: translateX(-50%);
// border-left: 1rem solid transparent;
// border-right: 1rem solid transparent;
// border-top: 1rem solid #fbc707;
// @include tablet {}
// }
}
}
@@ -4694,6 +4742,7 @@
@include tablet {
font-size: 1.6rem;
margin-top: 2.2rem;
text-align: left;
}
}
}
@@ -4716,6 +4765,14 @@
background: url(../images/kia/pdp/display_theme_disney/bg_design.jpg) no-repeat center top / 192rem auto;
}
&.mickey {
background: url(../images/kia/pdp/display_theme_mickey/bg_design_m.jpg) no-repeat center top / 100% auto;
@include tablet {
background: url(../images/kia/pdp/display_theme_mickey/bg_design.jpg) no-repeat center top / 192rem auto;
}
}
.comp_top {
padding: 0 2rem 2.4rem;
@@ -4880,6 +4937,24 @@
}
}
}
&.blue {
ul {
li {
&.active {
.tab-btn {
@include tablet {
background: linear-gradient(90deg, #1c5eed 0%, #1031b5 100%);
&:before {
background: url(../images/kia/pdp/display_theme_mickey/ico_tab_active.png) no-repeat center top / 100% auto;
}
}
}
}
}
}
}
}
.text_area {
@@ -4984,6 +5059,39 @@
}
}
&.mickey {
.layer_up {
&.comp_body {
.text_area {
margin-top: 11.4rem;
@include tablet {
margin-top: 13.7rem;
}
}
}
}
.available-theme {
.list {
ul {
li {
&.more {
strong {
.speech-bubble {
top: -5.4rem;
transform: translateX(35%);
@include tablet {
top: -7.8rem;
transform: translateX(-20%);
}
}
}
}
}
}
}
}
}
.image_area {
position: relative;
max-width: 100%;
@@ -4996,7 +5104,7 @@
.welcome-goodbye {
.image_area {
&+.image_area {
& + .image_area {
margin-top: 0.4rem;
@include tablet {
@@ -5057,33 +5165,51 @@
display: none;
}
}
.inner {
position: relative;
padding-left: 1.8rem;
@include tablet {
padding-left: 3.6rem;
}
&:before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 0.6rem;
height: 5rem;
background: #ea0029;
@include tablet {
width: 1.2rem;
height: 10rem;
}
}
}
h3 {
display: inline-flex;
align-items: center;
height: 3.5rem;
padding: 0.4rem 0.8rem 0;
padding: 0;
font-size: 2.4rem;
color: #fff;
font-weight: 600;
background-color: #ed1c24;
white-space: nowrap;
@include tablet {
height: 6.4rem;
padding: 0 0.8rem;
font-size: 4.8rem;
line-height: 6.4rem;
}
}
p {
margin: 0 0 0.2rem;
font-size: 2.4rem;
color: #000;
font-weight: 600;
@include tablet {
margin: 0 0 1.1rem;
font-size: 4.8rem;
color: #000;
}
@@ -5106,7 +5232,7 @@
align-items: center;
}
&+li {
& + li {
margin-top: 3.7rem;
@include tablet {
@@ -5115,20 +5241,19 @@
}
p {
position: relative;
flex: 1;
padding: 1rem 2rem 0 4.2rem;
margin: 0 0 1.6rem 4rem;
padding: 1rem 2rem 0 3.6rem;
margin: 0 0 1.6rem 2rem;
font-size: 1.4rem;
color: #fff;
line-height: 1.52;
background: url(../images/kia/pdp/display_theme_disney/number1.png) no-repeat 0 0 / 2.3rem auto;
// background: url(../images/kia/pdp/display_theme_disney/number1.png) no-repeat 0 0 / 2.3rem auto;
@include tablet {
margin: 0;
padding: 0 2rem 0 7.2rem;
padding: 0 2rem 0 4.8rem;
font-size: 1.6rem;
background-position: 0 0;
background-size: 3.1rem auto;
}
.add {
@@ -5140,6 +5265,34 @@
font-size: 1.4rem;
}
}
&::before {
content: "1";
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 1rem;
left: 0;
width: 2.4rem;
height: 2.4rem;
padding-top: 0.2rem;
font-size: 1.6rem;
color: #05141f;
font-weight: 600;
background-color: #fff;
box-shadow: 0px 0px 0.4rem 0px #00000099;
border-radius: 0.4rem;
@include tablet {
top: 0.3rem;
width: 3.2rem;
height: 3.2rem;
font-size: 2rem;
box-shadow: 0px 0px 0.8rem 0px #00000099;
border-radius: 0.8rem;
}
}
}
&:nth-child(1) {
@@ -5152,18 +5305,27 @@
&:nth-child(2) {
p {
padding: 1rem 6rem 0 0;
padding: 1rem 3.6rem 0 0;
margin: 0 2rem 2.3rem 2rem;
background: url(../images/kia/pdp/display_theme_disney/number2.png) no-repeat calc(100% - 0.6rem) 0 / 3.7rem auto;
// background: url(../images/kia/pdp/display_theme_disney/number2.png) no-repeat calc(100% - 0.6rem) 0 / 3.7rem auto;
text-align: right;
@include tablet {
padding: 0 2rem 0 7.2rem;
padding: 0 2rem 0 4.8rem;
margin: 0;
background-position: 0 1.2rem;
background-size: 5.1rem auto;
text-align: left;
}
&::before {
content: "2";
left: auto;
right: 0;
@include tablet {
left: 0;
right: auto;
}
}
}
.img-area {
@@ -5180,22 +5342,27 @@
&:nth-child(3) {
p {
padding-left: 5.4rem;
margin-left: 2.7rem;
background: url(../images/kia/pdp/display_theme_disney/number3.png) no-repeat 0 0 / 3.6rem auto;
margin-bottom: 2.8rem;
// background: url(../images/kia/pdp/display_theme_disney/number3.png) no-repeat 0 0 / 3.6rem auto;
@include tablet {
margin: 0;
padding: 0 2rem 0 7.2rem;
padding: 0 2rem 0 4.8rem;
background-position: 0 0;
background-size: 4.9rem auto;
}
&::before {
content: "3";
}
}
.img-area {
display: flex;
justify-content: flex-end;
padding-left: 8rem;
@include tablet {
justify-content: center;
padding-left: 0;
}
}
@@ -5250,7 +5417,7 @@
}
img {
width: 18rem;
width: 50vw;
@include tablet {
width: 25.6rem;
@@ -5262,14 +5429,14 @@
justify-content: flex-end;
align-items: flex-start;
flex-direction: column;
width: 13rem;
height: 11.7rem;
width: 36.11111111111111vw;
height: 32.5vw;
padding: 1.4rem;
font-size: 1rem;
font-weight: 600;
color: #fff;
line-height: 1.5;
background: url(../images/kia/pdp/display_theme_disney/img_reason_msg.png) no-repeat 0 0 / 100% auto;
background: url(../images/kia/pdp/display_theme_disney/img_reason_msg.png) no-repeat 0 0 / cover;
@include tablet {
width: 18.5rem;
@@ -5498,4 +5665,4 @@
text-indent: -9999em;
background: url(../images/kia/pdp/display_theme_disney/btn_zoom_close.png) no-repeat 0 0 / 100% auto;
cursor: pointer;
}
}

BIN
kr/assets/images/kia/contents/.DS_Store vendored
View File

Binary file not shown.

BIN
kr/assets/images/kia/contents/display_theme1_1.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
kr/assets/images/kia/contents/display_theme1_2.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

BIN
kr/assets/images/kia/contents/display_theme1_3.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 43 KiB

BIN
kr/assets/images/kia/contents/display_theme1_4.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 20 KiB

BIN
kr/assets/images/kia/contents/display_theme1_5.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 23 KiB

BIN
kr/assets/images/kia/contents/display_theme1_6.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 25 KiB

BIN
kr/assets/images/kia/contents/display_theme1_7.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 117 KiB

After

Width:  |  Height:  |  Size: 83 KiB

BIN
kr/assets/images/kia/contents/display_theme2_1.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
kr/assets/images/kia/contents/display_theme2_2.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 18 KiB

BIN
kr/assets/images/kia/contents/display_theme2_3.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 43 KiB

BIN
kr/assets/images/kia/contents/display_theme2_4.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 87 KiB

After

Width:  |  Height:  |  Size: 57 KiB

BIN
kr/assets/images/kia/contents/display_theme2_5.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 91 KiB

After

Width:  |  Height:  |  Size: 59 KiB

BIN
kr/assets/images/kia/contents/display_theme2_6.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 60 KiB

BIN
kr/assets/images/kia/contents/display_theme2_7.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
kr/assets/images/kia/contents/display_theme2_8.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
kr/assets/images/kia/contents/imgCaseInfo.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 184 KiB

After

Width:  |  Height:  |  Size: 161 KiB

BIN
kr/assets/images/kia/contents/imgUsageList10.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 345 KiB

After

Width:  |  Height:  |  Size: 161 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_2.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_3.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_4.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_5.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_6.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 35 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme1_7.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 117 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_2.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_3.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_4.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_5.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 91 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_6.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 92 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_7.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

BIN
kr/assets/images/kia/contents/marvel/display_theme2_8.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB

BIN
kr/assets/images/kia/contents/marvel/imgCaseInfo.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 184 KiB

BIN
kr/assets/images/kia/contents/marvel/imgUsageList10.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 345 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Assemble_Cluster.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Assemble_Home.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 593 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Assemble_Map.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 193 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Assemble_Profile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 539 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Comics_Cluster.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.3 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Comics_Home.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Comics_Map.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 202 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Avengers_Comics_Profile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Icon_heart.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Goodbye.mov Normal file
View File

Binary file not shown.

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Goodbye.webm Normal file
View File

Binary file not shown.

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Welcome.mov Normal file
View File

Binary file not shown.

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Welcome.webm Normal file
View File

Binary file not shown.

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Theme_screen.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/Theme_screen_m.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 661 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/available-h3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/bg_design.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/bg_design_m.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/bg_pattern.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/box_more.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/box_more_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.1 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/box_more_m2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 36 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/btn_zoom.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/btn_zoom_close.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 336 B

BIN
kr/assets/images/kia/pdp/display_theme_mickey/ico_arrow_down.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 208 B

BIN
kr/assets/images/kia/pdp/display_theme_mickey/ico_megaphone.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/ico_tab.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/ico_tab_active.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 504 B

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_Cluster.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 650 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_Home.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 643 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_Map.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 140 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_Profile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 662 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_next.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 825 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_next_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 994 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reason_mickey.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 68 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reason_msg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reasons1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reasons1_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 217 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reasons2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 132 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reasons2_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 294 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reasons3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 100 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/img_reasons3_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 160 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/marvel_logo1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/number1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/number2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/number3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/producy-temp1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 314 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/thumb_theme1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

BIN
kr/assets/images/kia/pdp/display_theme_mickey/thumb_theme_more.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 113 KiB

582
kr/info/product-usage-guide-display-theme-marvel.html Normal file
View File

@@ -0,0 +1,582 @@
<!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?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>
<!--상품상세 페이지 css 분리-->
<link rel="stylesheet" charset="UTF-8" href="../assets/css/service.css?v1" 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="../assets/css/kia/kia.css?v1" type="text/css" />
</head>
<body id="event">
<div class="contentHeaderCase case05">&nbsp;</div>
<!--//header-->
<div class="hederWarp_n hskey">
<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="/kr/kia.html#mainProductList" class="menuDepth1 lower">디지털 사양</a>
<div class="menuDepth2Wrap info">
<h3><a href="/kr/kia.html#mainProductList">디지털 사양</a></h3>
<ul>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme_disney.html">디즈니 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme_kbo.html">KBO 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme.html">NBA 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_in_car_game.html">아케이드 게임</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_rspa2.html">원격 스마트 주차 보조(RSPA 2)</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_rspa2_ev9.html">부스트(The 2025 EV9)</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_lighting_pattern.html">라이팅 패턴</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_srs_plus.html">스마트 회생 시스템 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_premium.html">스트리밍 프리미엄</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
</ul>
</div>
</li>
<li class="menuDepth1Wrap">
<a href="/kr/info/product-usage-guide.html" class="menuDepth1" data-url="/kr/info/product-usage-guide.html">사양별 이용 안내</a>
<div class="menuDepth2Wrap info">
<h3><a href="/kr/info/product-usage-guide.html">사양별 이용 안내</a></h3>
</div>
</li>
<li class="menuDepth1Wrap">
<a href="/kr/info/service-info.html" class="menuDepth1 lower" data-url="/kr/info/service-info.html">스토어 소개</a>
<div class="menuDepth2Wrap info">
<h3><a href="/kr/info/service-info.html">스토어 소개</a></h3>
<ul>
<li class="menuDepth2"><a href="/kr/info/service-info.html">스토어 소개</a></li>
<li class="menuDepth2"><a href="/kr/info/registration-guide.html">스토어 가입안내</a></li>
<li class="menuDepth2"><a href="/kr/info/buying-Installation-guide.html">스토어 이용안내</a></li>
<li class="menuDepth2"><a href="/kr/service/event-list.html">이벤트</a></li>
</ul>
</div>
</li>
<li class="menuDepth1Wrap">
<a href="/kr/info/as-guide.html" class="menuDepth1 lower" data-url="/kr/info/as-guide.html">고객지원</a>
<div class="menuDepth2Wrap support">
<h3><a href="/kr/info/as-guide.html">고객지원</a></h3>
<ul>
<li class="menuDepth2"><a href="/kr/service/faq.html">자주하는 질문</a></li>
<li class="menuDepth2"><a href="/kr/service/inquiry-list.html">문의하기</a></li>
<li class="menuDepth2"><a href="/kr/info/as-guide.html">고객센터 및 AS안내</a></li>
<li class="menuDepth2"><a href="/kr/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="/kr/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-->
<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.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">
클러스터/인포테인먼트 시스템 디자인을 NBA / KBO / 마블 테마로 변경하여 운전자의 특별한 개성을 표현할 수 있습니다. 테마 다운로드에는 약 5분(환경에 따라 상이)이 소요되며 적용을 위해 재시동이 필요합니다.
<span style="color: #676767; display: block; padding-top: 15px">※ 테마는 카테고리와 상관 없이 최대 3개까지만 다운로드하여 저장 가능하며, 삭제 / 재설치가 가능합니다.</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="functionDetail active" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<section class="storeGuideItem">
<header class="case">
<h4 class="titleCase03">테마 다운로드/적용 방법</h4>
<strong>7 STEP</strong>
</header>
<div class="swiper swiper1">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme1_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/display_theme1_2.jpg" alt="'설정 메뉴에서 화면구성 서브메뉴에 진입" />
<b>STEP 02</b>
<p class="caseBlack txtCase01">설정 메뉴에서 화면구성 서브메뉴에 진입합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme1_3.jpg" alt="좌측상단의 디스플레이 테마에서 미리보기" />
<b>STEP 03</b>
<p class="caseBlack txtCase01">좌측상단의 디스플레이 테마를 터치한 후 원하는 테마 카테고리를 선택합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme1_4.jpg" alt="구매한 사양은 다운로드 버튼이 활성화되며 터치 시 다운로드" />
<b>STEP 04</b>
<p class="caseBlack txtCase01">구매한 사양은 다운로드 버튼이 활성화되며 터치 시 다운로드가 진행됩니다.(약 5분 소요)</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme1_5.jpg" alt="다운로드가 완료되면 재부팅을 진행" />
<b>STEP 05</b>
<p class="caseBlack txtCase01">다운로드가 완료되면 재부팅을 진행합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme1_6.jpg" alt="프로필별로 설정" />
<b>STEP 06</b>
<p class="caseBlack txtCase01">프로필별로 설정 가능합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme1_7.jpg" alt="로그인하면 적용된 테마를 확인" />
<b>STEP 07</b>
<p class="caseBlack txtCase01">로그인하면 적용된 테마를 확인하실 수 있습니다.</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>
<section class="functionDetail">
<section class="storeGuideItem">
<header class="case">
<h4 class="titleCase03">테마 삭제 방법</h4>
<strong>8 STEP</strong>
</header>
<div class="swiper swiper2">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_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/display_theme2_2.jpg" alt="'설정 메뉴에서 화면구성 서브메뉴에 진입" />
<b>STEP 02</b>
<p class="caseBlack txtCase01">설정 메뉴에서 화면구성 서브메뉴에 진입합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_3.jpg" alt="좌측상단의 디스플레이 테마 메뉴를 터치" />
<b>STEP 03</b>
<p class="caseBlack txtCase01">좌측상단의 디스플레이 테마를 터치한 후 원하는 테마 카테고리를 선택합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_4.jpg" alt="좌측하단 햄버거 메뉴를 터치하고 삭제 메뉴" />
<b>STEP 04</b>
<p class="caseBlack txtCase01">좌측하단 햄버거 메뉴를 터치하고 삭제 메뉴를 터치합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_5.jpg" alt="삭제할 팀 테마를 선택" />
<b>STEP 05</b>
<p class="caseBlack txtCase01">삭제할 테마를 선택합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_6.jpg" alt="테마가 선택된 상태에서 삭제 버튼을 터치" />
<b>STEP 06</b>
<p class="caseBlack txtCase01">테마가 선택된 상태에서 삭제 버튼을 터치합니다.</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_7.jpg" alt="삭제 진행" />
<b>STEP 07</b>
<p class="caseBlack txtCase01">삭제가 진행됩니다.(약 2분 소요)</p>
</li>
<li class="swiper-slide">
<img class="noBorder" src="../assets/images/kia/contents/display_theme2_8.jpg" alt="삭제 완료" />
<b>STEP 08</b>
<p class="caseBlack txtCase01">삭제가 완료되었습니다. 이제 새 테마를 다운로드 받을 수 있습니다.</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space"></div>
</div>
<div class="swiper-button-next btnNextSlide2"></div>
<div class="swiper-button-prev btnPrevSlide2"></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-->
<div class="floating_menu">
<a href="/kr/service/faq.html" class="floating_faq"><img src="../assets/images/common/floating_inquiry.png" alt="자주하는 질문" /></a>
<a href="/kr/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="/kr/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="/kr/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">
<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();
$(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>

2
kr/info/product-usage-guide-display-theme.html
View File

@@ -252,7 +252,7 @@
<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">
클러스터/인포테인먼트 시스템 디자인을 NBA / KBO / 마블 테마로 변경하여 운전자의 특별한 개성을 표현할 수 있습니다. 테마 다운로드에는 약 5분(환경에 따라 상이)이 소요되며 적용을 위해 재시동이 필요합니다.
클러스터/인포테인먼트 시스템 디자인을 NBA / KBO / 마블 / 디즈니 테마로 변경하여 운전자의 특별한 개성을 표현할 수 있습니다. 테마 다운로드에는 약 5분(환경에 따라 상이)이 소요되며 적용을 위해 재시동이 필요합니다.
<span style="color: #676767; display: block; padding-top: 15px">※ 테마는 카테고리와 상관 없이 최대 3개까지만 다운로드하여 저장 가능하며, 삭제 / 재설치가 가능합니다.</span>
</p>
</div>

2
kr/info/product-usage-guide.html
View File

@@ -251,7 +251,7 @@
<section>
<h2 class="titleCase01">기아 커넥트 스토어 디지털 사양 이용안내</h2>
<div class="listType01">
<a href="/kr/info/product-usage-guide-displayThemes.html" style="background-image: url('../assets/images/kia/contents/imgUsageList10.jpg')" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>디스플레이 테마</b></a>
<a href="/kr/info/product-usage-guide-display-theme.html" style="background-image: url('../assets/images/kia/contents/imgUsageList10.jpg')" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>디스플레이 테마</b></a>
<a href="/kr/info/product-usage-guide-incargame.html" style="background-image: url('../assets/images/kia/contents/imgUsageList06.jpg')" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>아케이드 게임</b></a>
<a href="/kr/info/product-usage-guide-srs.html" style="background-image: url('../assets/images/kia/contents/imgUsageList07.jpg')" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스마트 회생 시스템 플러스</b></a>
<!-- <a href="#" style="background-image: url('../assets/images/kia/contents/imgUsageList08_comingsoon.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스트리밍 프리미엄 (Coming Soon)</b></a> -->

8
kr/kia.html
View File

@@ -52,9 +52,7 @@
<div class="logoWrap">
<a href="">
<i class="logoImg"></i>
<!-- <span>
Connect Store
</span> -->
<!-- <span>Connect Store</span> -->
</a>
</div>
<div class="menuWarp">
@@ -63,9 +61,7 @@
<div class="mobileLogoWrap">
<a href="">
<i class="logoImg"></i>
<!-- <span>
Connect store
</span> -->
<!-- <span> Connect store </span> -->
</a>
</div>
<span class="closeBtn" id="closeBtn">

320
kr/product/pdp_display_theme_disney_en.html
View File

@@ -34,7 +34,7 @@
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v2"></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" />
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v81553123" 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" />
@@ -122,7 +122,7 @@
<div class="menuDepth2Wrap info">
<h3><a href="/kr/kia.html#mainProductList">디지털 사양</a></h3>
<ul>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme_disney.html">디즈니 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme_mickey.html">디즈니 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme_kbo.html">KBO 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_display_theme.html">NBA 디스플레이 테마</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_in_car_game.html">아케이드 게임</a></li>
@@ -244,14 +244,14 @@
<div class="infoStickyInner">
<div class="stickyLeft">
<p>
<strong>KBO 디스플레이 테마</strong>
<strong>Disney Mickey & Friends Display Theme</strong>
<!-- <span>30개 NBA 팀의 개성있는 디스플레이 테마로 분위기 업업~!!!</span> -->
</p>
</div>
<div class="stickyRight">
<dl>
<dt>평생 이용권</dt>
<dd>₩ 150,000</dd>
<dt>Lifetime pass</dt>
<dd>₩ 29,900</dd>
</dl>
</div>
</div>
@@ -265,14 +265,14 @@
<div class="productImg">
<div class="swiper productSwiper">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="../assets/images/kia/pdp/display_theme_disney/producy-temp1.png" alt="이미지 상품명" /></div>
<div class="swiper-slide"><img src="../assets/images/kia/pdp/display_theme_mickey/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">
<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_theme_disneyNBA_Theme_AVNT.jpg" alt="이미지 상품명" />
<img src="../assets/images/kia/pdp/display_theme_mickeyNBA_Theme_AVNT.jpg" alt="이미지 상품명" />
</p>
</div>
<div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp4.png" alt="이미지 상품명" /></div>
@@ -286,10 +286,11 @@
<div class="producTitle">
<!-- <span>차량SW</span> -->
<h1>
Marvel’s Avengers Display Themes
Disney<br />
Mickey & Friends Display Theme
<button type="button" class="btn-wish"></button>
</h1>
<p>Marvel's Avengers Special Themes that add style to your drive</p>
<p>Disney's Mickey & Friends special theme adds style to your drive</p>
</div>
<div class="producOption scroll">
<h2>Select product option you want.</h2>
@@ -297,21 +298,10 @@
<div class="checkBtn withVideo">
<input type="checkbox" name="check" id="check1" value="kia" checked />
<label for="check1">
<p><img src="../assets/images/kia/pdp/display_theme_disney/marvel_logo1.png" alt="marvel1" /></p>
<p><img src="../assets/images/kia/pdp/display_theme_mickey/marvel_logo1.png" alt="marvel1" /></p>
<div class="optionText">
<p>
<strong>Marvel’s Avengers Comics</strong>
</p>
</div>
</label>
</div>
<div class="checkBtn">
<input type="checkbox" name="check" id="check2" value="samsung" disabled />
<label for="check2">
<p><img src="../assets/images/kia/pdp/display_theme_disney/marvel_logo2.png" alt="marvel2" /></p>
<div class="optionText">
<p>
<strong>Marvel’s Avengers Assemble</strong>
<strong>Disney Mickey & Friends</strong>
</p>
</div>
</label>
@@ -319,10 +309,10 @@
<div class="checkBtn disabledBtn">
<input type="checkbox" name="check" id="check2" value="samsung" disabled />
<label for="check2">
<p><img src="../assets/images/kia/pdp/display_theme_disney/marvel_logo2.png" alt="marvel2" /></p>
<p><img src="../assets/images/kia/pdp/display_theme_mickey/marvel_logo1.png" alt="marvel2" /></p>
<div class="optionText">
<p>
<strong>Marvel’s Avengers Assemble</strong>
<strong>Disney Mickey & Friends</strong>
<i class="badge">구매완료</i>
</p>
</div>
@@ -332,15 +322,18 @@
</div>
<div class="priceOption">
<h2>원하시는 결제 옵션을 선택해주세요</h2>
<h2>Select your preferred payment plan.</h2>
<div class="priceList">
<div class="radioBtn">
<input type="radio" name="radioBtn" id="radioOne" value="평생이용권 150000" />
<label for="radioOne">
<span>평생 이용</span>
<span>Lifetime pass</span>
<span>
<span class="discount"><i>₩ 29,900</i></span>
<span class="price"><b class="dc">16%</b><strong>₩ 5,000</strong></span>
<!-- <span class="discount"><i>₩ 29,900</i></span> -->
<span class="price">
<!-- <b class="dc">16%</b> -->
<strong>₩ 29,000</strong>
</span>
</span>
</label>
</div>
@@ -348,12 +341,12 @@
</div>
<div class="priceTotal">
<dl class="total">
<dt>총 결제 금액</dt>
<dt>Total costs (VAT included)</dt>
<dd>₩ 29,900</dd>
</dl>
<div class="paymentButton oneButtonLine">
<!-- <button class="cartBtn leftBtn"><p>장바구니</p></button> -->
<button class="PurchaseBtn leftBtn"><p>바로구매</p></button>
<button class="PurchaseBtn leftBtn"><p>Buy now</p></button>
</div>
</div>
</div>
@@ -365,48 +358,43 @@
<!--에디터 영역-->
<div class="editorWarp pdpDetail">
<div class="editorInner">
<div class="comp_wide displayThemeDesney">
<div class="comp_wide displayThemeDesney mickey">
<div class="image_area visualBg">
<img src="../assets/images/kia/pdp/display_theme_disney/Theme_screen.jpg" class="web" alt="디스플레이 테마 이미지" />
<img src="../assets/images/kia/pdp/display_theme_disney/Theme_screen_m.jpg" class="mobile" alt="디스플레이 테마 이미지" />
<img src="../assets/images/kia/pdp/display_theme_mickey/Theme_screen.jpg" class="web" alt="디스플레이 테마 이미지" />
<img src="../assets/images/kia/pdp/display_theme_mickey/Theme_screen_m.jpg" class="mobile" alt="디스플레이 테마 이미지" />
</div>
<div class="comp_body layer_up">
<div class="text_area">
<h2 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img src="../assets/images/kia/pdp/display_theme_disney/logo_marvel.png" width="89" class="web" alt="MARVEL" />
<img src="../assets/images/kia/pdp/display_theme_disney/logo_marvel.png" width="53" class="mobile" alt="MARVEL" />
</h2>
<h3 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Bring artwork from the Marvel Universe to your Kia!</h3>
<div class="info" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Kia and Marvel's Avengers come together to present a unique in-car experience like no other. <br />Starting with the Marvel's Avengers display themes, Make every drive special with a unique onboard experience.</div>
<h3 class="color-000" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Bring Disney artwork <br class="br-m" />to your Kia!</h3>
<div class="info color-000" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
Kia and Disney come together to present a unique in-car experience like no other.<br />
Starting with Disney's Mickey & Friends display theme, make every drive special with a unique onboard experience.
</div>
</div>
</div>
<div class="comp_bottom available-theme">
<h3>Available Marvel Themes</h3>
<h3>
<span class="text-center">Available Disney Themes</span>
</h3>
<div class="list">
<ul>
<li>
<a href="#">
<img src="../assets/images/kia/pdp/display_theme_disney/thumb_theme1.png" alt="MARVEL" />
<img src="../assets/images/kia/pdp/display_theme_mickey/thumb_theme1.png" alt="MARVEL" />
<span class="txt">
<strong>Marvel’s Avengers Comics</strong>
<span class="hashs">#TheOriginal #ComicVibes #Vibrant</span>
</span>
</a>
</li>
<li>
<a href="#">
<img src="../assets/images/kia/pdp/display_theme_disney/thumb_theme2.png" alt="MARVEL" />
<span class="txt">
<strong>Marvel’s Avengers Comics</strong>
<span class="hashs">#AvengersHeadquaters #Holographic #Chic</span>
<strong>Disney<br />Mickey & Friends</strong>
<span class="hashs"><span>#StickerStyle</span> <span>#Playful</span> <span>#Evergreen</span></span>
</span>
</a>
</li>
<li class="more">
<a href="#">
<strong>More to Come <span class="arrow"></span></strong>
<img src="../assets/images/kia/pdp/display_theme_disney/thumb_theme_more.png" alt="MARVEL" />
<span class="hashs">※ Availability may change.</span>
<strong>
This is Just the Beginning
<em class="speech-bubble"> Stay tuned for the next<br />Disney Display Themes! </em>
</strong>
<img src="../assets/images/kia/pdp/display_theme_mickey/thumb_theme_more.png" alt="MARVEL" />
<span class="hashs">※ Themes to be released are subject to change.</span>
</a>
</li>
</ul>
@@ -414,22 +402,19 @@
</div>
</div>
<div class="comp_wide discover-epic-design displayThemeDesney">
<div class="comp_wide discover-epic-design displayThemeDesney mickey">
<div class="comp_top">
<h3>Discover Epic Designs</h3>
<p class="info">Pick a theme and preview the exciting changes to your screen!</p>
<h3>Discover <br class="br-m" />Adorable Designs</h3>
<p class="info">Pick a theme and preview <br class="br-m" />the fun changes to your screen!</p>
</div>
<div class="comp_body">
<div class="tab-wrap">
<div class="tab-menu cont-select">
<div class="tab-menu blue cont-select">
<div class="inner">
<div class="btn-select">Marvel’s Avengers Comics</div>
<div class="btn-select">Disney Mickey & Friends</div>
<ul>
<li class="active">
<span class="tab-btn">Marvel’s Avengers Comics</span>
</li>
<li>
<span class="tab-btn">Marvel’s Avengers Assemble</span>
<span class="tab-btn">Disney Mickey & Friends</span>
</li>
</ul>
</div>
@@ -441,60 +426,62 @@
<div class="item welcome-goodbye" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<video class="video-welcome" playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme_disney/welcome.mp4" type="video/mp4" />
<source src="../assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Welcome.mov" type="video/quicktime" />
<source src="../assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Welcome.webm" type="video/webm" />
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
<div class="image_area">
<video class="video-goodbye" playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme_disney/goodbye.mp4" type="video/mp4" />
<source src="../assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Goodbye.mov" type="video/quicktime" />
<source src="../assets/images/kia/pdp/display_theme_mickey/Marvel_Avengers_Goodbye.webm" type="video/webm" />
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
<div class="text_area">
<h4>Welcome & Goodbye Video</h4>
<p>Marvel-themed motion graphics are displayed upon vehicle start-up and shutdown.</p>
<p>Disney-themed motion graphics play once at <br class="br-m" />start-up (from sleep mode) and shutdown.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont3.png" class="themeImg box1-cluster" alt="디스플레이 테마1" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_Cluster.png" class="themeImg box1-cluster" alt="Cluster" />
</div>
<div class="text_area">
<h4>Cluster</h4>
<p>The selected Marvel theme appears on the cluster with themed graphics and gauges.</p>
<p>The selected Disney theme appears on the cluster with themed graphics and gauges.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont4.png" class="themeImg box1-navigation" alt="디스플레이 테마1" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_Map.png" class="themeImg box1-navigation" alt="Navigation" />
</div>
<div class="text_area">
<h4>Navigation</h4>
<p>Marvel artwork highlights your current location during navigation.</p>
<p>Disney artwork highlights your current location during navigation.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont5.png" class="themeImg box1-homecard" alt="디스플레이 테마1" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_Home.png" class="themeImg box1-homecard" alt="Homecard" />
</div>
<div class="text_area">
<h4>Homecard</h4>
<p>Artwork of Marvel characters and logos appear across various menu screens.</p>
<p>Artwork of Disney characters and logos appear across various menu screens.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont6.png" class="themeImg box1-profile" alt="디스플레이 테마1" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_Profile.png" class="themeImg box1-profile" alt="Profile" />
</div>
<div class="text_area">
<h4>Profile</h4>
<p>Choose from Marvel-themed profile images—set a unique one for each driver.</p>
<p>Choose from Disney-themed profile images—choose a unique one for each driver.</p>
</div>
</div>
</div>
@@ -503,8 +490,8 @@
<div class="three-reasons">
<div class="tit-area">
<div class="inner" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<h3>Three Reasons</h3>
<p>Why you can't miss out</p>
<p>Three Reasons</p>
<h3>Why you can’t miss out</h3>
</div>
</div>
<div class="reasons">
@@ -512,184 +499,43 @@
<ol>
<li>
<p>
<strong>A Wonderful In-Car Experience</strong>
Once you transform your display with Marvel themes, <br />
you might find it hard to return to the standard setup.
<strong>A Delightful <br class="br-m" />In-Car Experience</strong>
Once you transform your display with <br class="br-m" />Disney themes, you might find it hard to return to the standard setup.
</p>
<div class="img-area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons1.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons1_m.png" class="mobile" alt="" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_reasons1.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_reasons1_m.png" class="mobile" alt="" />
</div>
</li>
<li>
<p>
<strong>Themes for Every Taste</strong>
Whether you're a fan of Spider-Man, Deadpool, or Wolverine, <br />
a variety of Marvel themes will soon be available to match your favorite character.
Whether you're a fan of Mickey & Friends, Frozen, or Disney Princess, a variety of Disney themes will be available to match favorite characters.
<span class="add">※ Themes to be released are subject to change.</span>
</p>
<div class="img-area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons2.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons2_m.png" class="mobile" alt="" />
<span class="img-msg">
<img src="../assets/images/kia/pdp/display_theme_mickey/img_reason_mickey.png" alt="" />
<span class="msg"
>Our Themes<br />
Are Expanding</span
>
</span>
</div>
</li>
<li>
<p>
<strong>Your One-of-a-kind Journey Starts Here</strong>
Marvel in-car experience offers something you won’t see anywhere else - made uniquely for Kia owners.
<strong>Your Distinctive Journey <br class="br-m" />Starts Here</strong>
For the first time, Kia owners can now experience Disney in-car experiences.
</p>
<div class="img-area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons3.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons3_m.png" class="mobile" alt="" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_reasons3.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_mickey/img_reasons3_m.png" class="mobile" alt="" />
</div>
</li>
</ol>
</div>
</div>
</div>
<div class="coming-next">
<div class="inner">
<div class="tit-area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<h3>
What’s <br />Coming Up <br />
<span class="next"
>Next<em class="speech-bubble">Stay tuned for the next <br />Marvel Display Themes!</em></span
>?
</h3>
</div>
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_next.png" class="web" alt="What’s Coming Up Next?" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_next_m.png" class="mobile" alt="What’s Coming Up Next?" />
</div>
</div>
</div>
</div>
<div class="tab-box box2">
<div class="discover">
<div class="inner">
<div class="item welcome-goodbye" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme_disney/lakers_welcome.mp4" type="video/mp4" />
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
<div class="image_area">
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme_disney/lakers_goodbye.mp4" type="video/mp4" />
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
<div class="text_area">
<h4>Welcome & Goodbye Video</h4>
<p>Marvel-themed motion graphics are displayed upon vehicle start-up and shutdown.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont3.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Cluster</h4>
<p>The selected Marvel theme appears on the cluster with themed graphics and gauges.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont4.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Navigation</h4>
<p>Marvel artwork highlights your current location during navigation.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont5.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Homecard</h4>
<p>Artwork of Marvel characters and logos appear across various menu screens.</p>
</div>
</div>
<div class="item" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont6.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Profile</h4>
<p>Choose from Marvel-themed profile images—set a unique one for each driver.</p>
</div>
</div>
</div>
</div>
<div class="three-reasons" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="tit-area">
<div class="inner">
<h3>Three Reasons</h3>
<p>Why you can't miss out</p>
</div>
</div>
<div class="reasons">
<div class="inner">
<ol>
<li>
<p>
<strong>A Wonderful In-Car Experience</strong>
Once you transform your display with Marvel themes, <br />
you might find it hard to return to the standard setup.
</p>
<div class="img-area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons1.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons1_m.png" class="mobile" alt="" />
</div>
</li>
<li>
<p>
<strong>Themes for Every Taste</strong>
Whether you're a fan of Spider-Man, Deadpool, or Wolverine, <br />
a variety of Marvel themes will soon be available to match your favorite character.
</p>
<div class="img-area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons2.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons2_m.png" class="mobile" alt="" />
</div>
</li>
<li>
<p>
<strong>Your One-of-a-kind Journey Starts Here</strong>
Marvel in-car experience offers something you won’t see anywhere else - made uniquely for Kia owners.
</p>
<div class="img-area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons3.png" class="web" alt="" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons3_m.png" class="mobile" alt="" />
</div>
</li>
</ol>
</div>
</div>
</div>
<div class="coming-next">
<div class="inner" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<div class="tit-area">
<h3>
What’s <br />Coming Up <br />
<span class="next"
>Next<em class="speech-bubble">Stay tuned for the next <br />Marvel Display Themes!</em>?</span
>
</h3>
</div>
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_next.png" class="web" alt="What’s Coming Up Next?" />
<img src="../assets/images/kia/pdp/display_theme_disney/img_next_m.png" class="mobile" alt="What’s Coming Up Next?" />
<div class="copyright">ⓒ Disney</div>
</div>
</div>
</div>
@@ -706,7 +552,7 @@
</div>
<div class="text_area">
<h5>ccNC 차량에서 선택적 구매 가능</h5>
<p>기아 ccNC 인포테인먼트 플랫폼이 적용된 차량에만 선택 가능합니다.</p>
<p>기아 ccNC 인포테인먼트 플랫폼 중 12.3인치 클러스터가 적용된 차량에만 선택 가능합니다.</p>
</div>
</div>
<div class="item">

0
kr/product/pdp_display_theme_disney.html → kr/product/pdp_display_theme_marverl.html
View File

1006
kr/product/pdp_display_theme_marverl_en.html Normal file
View File

File diff suppressed because it is too large Load Diff