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

1120사이즈 UIUX수정

Browse Source
This commit is contained in:
NEW_GIL_HOME\hyeon
2025-05-29 00:44:25 +09:00
parent ed9b8e8b3b
commit 09914b462e
19 changed files with 712 additions and 3887 deletions
Download Patch File Download Diff File Expand all files Collapse all files

180
kr/assets/css/common copy.css → assets/css/common.css
View File

@@ -638,6 +638,9 @@ video::-webkit-media-controls {
.hederWarp.hBoder {
border-bottom: 1px solid #dedede;
}
.hederWarp.hBoder.menu-open .user .icon-user {
background-image: url(../images/common/icon-user.svg);
}
.hederWarp_n {
position: relative;
@@ -646,33 +649,26 @@ video::-webkit-media-controls {
overflow-x: clip;
background-color: transparent;
}
.hederWarp_n::before {
opacity: 1;
transition: opacity 0.1s ease-in-out;
}
@media (max-width: 1240px) {
.hederWarp_n {
padding: 0 2rem;
padding: 0 1.5rem;
}
}
.hederWarp_n.menu-open {
background-color: #fff;
}
.hederWarp_n.menu-open:before {
opacity: 0 !important;
}
.hederWarp_n.menu-open + .pageTitle {
.hederWarp_n.menu-open ~ .pageTitle {
z-index: 0 !important;
}
.hederWarp_n.menu-open ~ .contentWarp {
z-index: 0 !important;
}
.hederWarp_n.menu-open .user .icon-user {
background-image: url(../images/common/icon-user.svg) !important;
}
.hederWarp_n.menu-open .headerInner .gnb .logoWrap a {
color: #05141f;
}
.hederWarp_n.menu-open .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1 {
color: #05141f;
}
.hederWarp_n.menu-open .headerInner .gnb .menuWarp .menuBg {
opacity: 1;
}
.hederWarp_n.menu-open .headerInner .func .carlist .carItem span {
color: #05141f;
}
@@ -697,7 +693,7 @@ video::-webkit-media-controls {
.hederWarp_n.menu-open .headerInner .func .userLogin > a:hover {
border: 1px solid rgb(5, 20, 31);
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n.menu-open .headerInner .func .moblieMenu .burgur .top-line {
background-color: #000;
}
@@ -705,6 +701,11 @@ video::-webkit-media-controls {
background-color: #000;
}
}
@media (min-width: 1120px) {
.hederWarp_n.menu-open .headerInner .menuBg::after {
opacity: 1;
}
}
.hederWarp_n .headerInner {
display: flex;
justify-content: space-between;
@@ -713,20 +714,47 @@ video::-webkit-media-controls {
height: 8rem;
margin: 0 auto;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner {
height: 5.6rem;
}
}
.hederWarp_n .headerInner .menuBg {
display: none;
}
@media (min-width: 1120px) {
.hederWarp_n .headerInner .menuBg {
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 1;
background-color: #fff;
transition: height 0.2s;
}
.hederWarp_n .headerInner .menuBg::after {
content: "";
position: absolute;
top: 80px;
left: 0;
right: 0;
border-top: 1px solid #dedede;
z-index: 2;
opacity: 0;
transition: opacity 0.2s;
}
}
.hederWarp_n .headerInner .gnb {
display: flex;
justify-content: flex-start;
align-items: center;
}
.hederWarp_n .headerInner .gnb .logoWrap {
z-index: 0;
position: relative;
z-index: 2;
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .logoWrap {
display: flex;
align-items: center;
@@ -747,13 +775,13 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .logoWrap a span {
margin-left: 1rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .logoWrap a span {
font-size: 1.5rem;
margin-top: 0.4rem;
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp {
position: fixed;
top: 0;
@@ -775,7 +803,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileMenuTop {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileMenuTop {
display: flex;
justify-content: space-between;
@@ -814,7 +842,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileFunc {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileFunc {
display: flex;
width: 100%;
@@ -848,7 +876,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist {
display: block;
position: relative;
@@ -874,10 +902,12 @@ video::-webkit-media-controls {
font-size: 1.4rem;
font-weight: 600;
display: flex;
align-items: center;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
min-width: 2.2rem;
word-break: break-word;
}
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist .mobilecarItem .item span + span {
color: #676767;
@@ -949,28 +979,17 @@ video::-webkit-media-controls {
margin-top: 1rem;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .menuBg {
transition: all 0.1s ease;
background-color: #fff;
}
@media (min-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .menuBg {
display: block;
position: absolute;
top: 8rem;
left: 0;
right: 0;
z-index: 1;
height: 0;
opacity: 0;
border-top: 1px solid #DEDEDE;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .menu {
display: flex;
margin-left: 4.5rem;
transition: margin-left 0.2s ease-in-out;
}
@media (min-width: 1024px) {
@media (max-width: 1220px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu {
margin-left: 2rem;
}
}
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li .menuDepth2Wrap.info {
display: block;
width: 27rem;
@@ -979,28 +998,28 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li .menuDepth2Wrap h3 {
margin-bottom: 2.8rem;
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(1) .menuDepth2Wrap {
left: -15.6rem;
left: -11.6rem;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(2) .menuDepth2Wrap {
left: 3.4rem;
left: 5.4rem;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(3) .menuDepth2Wrap {
left: 19.6rem;
left: 21.6rem;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(4) .menuDepth2Wrap {
display: block;
left: 28.4rem;
left: 30.4rem;
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu {
display: block;
margin-left: 0;
@@ -1014,7 +1033,7 @@ video::-webkit-media-controls {
position: relative;
z-index: 2;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap {
padding: 0 2rem;
}
@@ -1028,8 +1047,14 @@ video::-webkit-media-controls {
font-size: 1.6rem;
font-weight: 600;
color: #ffffff;
white-space: nowrap;
}
@media (max-width: 1024px) {
@media (max-width: 1220px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1 {
padding: 0 1.25rem;
}
}
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1 {
position: relative;
justify-content: flex-start;
@@ -1076,7 +1101,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap h3 a {
color: #000;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap {
position: initial;
width: 100%;
@@ -1094,7 +1119,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.info {
width: 14rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.info {
width: 100%;
}
@@ -1102,7 +1127,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.support {
width: 16rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.support {
width: 100%;
}
@@ -1132,7 +1157,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap ul .menuDepth2 a:hover {
color: #05141f;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap ul .menuDepth2 a {
padding: 0.6rem 0;
}
@@ -1140,7 +1165,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu {
display: flex;
position: absolute;
@@ -1162,7 +1187,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .loginBtn {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .loginBtn {
position: absolute;
bottom: 2rem;
@@ -1174,12 +1199,20 @@ video::-webkit-media-controls {
display: flex;
justify-content: flex-end;
align-items: center;
position: relative;
z-index: 2;
}
.hederWarp_n .headerInner .func .carlist {
position: relative;
margin-right: 2.5rem;
margin-right: 2rem;
transition: all 0.2s ease-in-out;
}
@media (max-width: 1024px) {
@media (max-width: 1220px) {
.hederWarp_n .headerInner .func .carlist {
margin-right: 1.5rem;
}
}
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .carlist {
display: none;
}
@@ -1190,7 +1223,7 @@ video::-webkit-media-controls {
}
.hederWarp_n .headerInner .func .carlist .carItem {
display: flex;
justify-content: center;
justify-content: flex-end;
align-items: center;
height: 8rem;
}
@@ -1207,6 +1240,10 @@ video::-webkit-media-controls {
border: none;
outline: none;
}
.hederWarp_n .headerInner .func .carlist .carItem.on::after {
transform: rotate(-180deg);
background-position-x: left;
}
.hederWarp_n .headerInner .func .carlist .carItem.on .carlistItem {
display: block;
}
@@ -1218,7 +1255,7 @@ video::-webkit-media-controls {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
min-width: 2.2rem;
white-space: nowrap;
}
.hederWarp_n .headerInner .func .carlist .carItem span + span::before {
content: "";
@@ -1296,7 +1333,7 @@ video::-webkit-media-controls {
display: block;
margin-right: 2rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .userLogin {
display: none;
}
@@ -1317,9 +1354,9 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .func .user {
position: relative;
display: block;
margin-right: 2rem;
margin-right: 0;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .user {
display: none;
}
@@ -1391,7 +1428,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .func .moblieMenu {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .moblieMenu {
display: flex;
justify-content: center;
@@ -1447,6 +1484,11 @@ video::-webkit-media-controls {
background: url("../images/common/icon-tbarrow.svg") center right no-repeat;
background-size: 1.2rem;
}
.hederWarp_n.noBoder .headerInner .func .carlist .carItem.on::after,
.hederWarp_n.hBoder .headerInner .func .carlist .carItem.on::after {
transform: rotate(-180deg);
background-position-x: left;
}
.hederWarp_n.noBoder .headerInner .func .carlist.on a::after,
.hederWarp_n.hBoder .headerInner .func .carlist.on a::after {
transform: rotate(-180deg);
@@ -1462,7 +1504,7 @@ video::-webkit-media-controls {
.hederWarp_n.hBoder .headerInner .func .userLogin > a:hover {
border: 1px solid rgb(5, 20, 31);
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n.noBoder .headerInner .func .moblieMenu .burgur .top-line,
.hederWarp_n.hBoder .headerInner .func .moblieMenu .burgur .top-line {
background-color: #000;
@@ -3826,7 +3868,7 @@ video::-webkit-media-controls {
width: calc(100% - 4rem);
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.installInfoPopup .popInner {
padding: 3rem 3rem;
}

1
assets/css/common.css.map Normal file
View File

File diff suppressed because one or more lines are too long

2
kr/assets/css/kia.css → assets/css/kia.css
View File

@@ -388,11 +388,13 @@ html .hederWarp_n .headerInner .gnb .logoWrap a .logoImg {
height: 1.5rem;
background-image: url(../../images/kia/kia-logo-n.svg);
background-repeat: no-repeat;
transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
}
@media (min-width: 1025px) {
html .hederWarp_n .headerInner .gnb .logoWrap a .logoImg {
height: 2rem;
width: 22.8rem;
transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
}
}
html .hederWarp_n.menu-open .headerInner .gnb .logoWrap a .logoImg {

1
assets/css/kia.css.map Normal file
View File

File diff suppressed because one or more lines are too long

3724
assets/css/service.css
View File

File diff suppressed because it is too large Load Diff

1
assets/css/service.css.map
View File

File diff suppressed because one or more lines are too long

103
kr/assets/css/common.css
View File

@@ -651,10 +651,13 @@ video::-webkit-media-controls {
}
@media (max-width: 1240px) {
.hederWarp_n {
padding: 0 2rem;
padding: 0 1.5rem;
}
}
.hederWarp_n.menu-open + .pageTitle {
.hederWarp_n.menu-open ~ .pageTitle {
z-index: 0 !important;
}
.hederWarp_n.menu-open ~ .contentWarp {
z-index: 0 !important;
}
.hederWarp_n.menu-open .user .icon-user {
@@ -690,7 +693,7 @@ video::-webkit-media-controls {
.hederWarp_n.menu-open .headerInner .func .userLogin > a:hover {
border: 1px solid rgb(5, 20, 31);
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n.menu-open .headerInner .func .moblieMenu .burgur .top-line {
background-color: #000;
}
@@ -698,7 +701,7 @@ video::-webkit-media-controls {
background-color: #000;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n.menu-open .headerInner .menuBg::after {
opacity: 1;
}
@@ -711,7 +714,7 @@ video::-webkit-media-controls {
height: 8rem;
margin: 0 auto;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner {
height: 5.6rem;
}
@@ -719,7 +722,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .menuBg {
display: none;
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .menuBg {
display: block;
position: absolute;
@@ -751,7 +754,7 @@ video::-webkit-media-controls {
position: relative;
z-index: 2;
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .logoWrap {
display: flex;
align-items: center;
@@ -772,13 +775,13 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .logoWrap a span {
margin-left: 1rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .logoWrap a span {
font-size: 1.5rem;
margin-top: 0.4rem;
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp {
position: fixed;
top: 0;
@@ -800,7 +803,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileMenuTop {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileMenuTop {
display: flex;
justify-content: space-between;
@@ -839,7 +842,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileFunc {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileFunc {
display: flex;
width: 100%;
@@ -873,7 +876,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist {
display: block;
position: relative;
@@ -899,10 +902,12 @@ video::-webkit-media-controls {
font-size: 1.4rem;
font-weight: 600;
display: flex;
align-items: center;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
min-width: 2.2rem;
word-break: break-word;
}
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist .mobilecarItem .item span + span {
color: #676767;
@@ -977,8 +982,14 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu {
display: flex;
margin-left: 4.5rem;
transition: margin-left 0.2s ease-in-out;
}
@media (min-width: 1024px) {
@media (max-width: 1220px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu {
margin-left: 2rem;
}
}
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li .menuDepth2Wrap.info {
display: block;
width: 27rem;
@@ -987,28 +998,28 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li .menuDepth2Wrap h3 {
margin-bottom: 2.8rem;
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(1) .menuDepth2Wrap {
left: -15.6rem;
left: -11.6rem;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(2) .menuDepth2Wrap {
left: 3.4rem;
left: 5.4rem;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(3) .menuDepth2Wrap {
left: 19.6rem;
left: 21.6rem;
}
}
@media (min-width: 1024px) {
@media (min-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(4) .menuDepth2Wrap {
display: block;
left: 28.4rem;
left: 30.4rem;
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu {
display: block;
margin-left: 0;
@@ -1022,7 +1033,7 @@ video::-webkit-media-controls {
position: relative;
z-index: 2;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap {
padding: 0 2rem;
}
@@ -1036,8 +1047,14 @@ video::-webkit-media-controls {
font-size: 1.6rem;
font-weight: 600;
color: #ffffff;
white-space: nowrap;
}
@media (max-width: 1024px) {
@media (max-width: 1220px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1 {
padding: 0 1.25rem;
}
}
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1 {
position: relative;
justify-content: flex-start;
@@ -1084,7 +1101,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap h3 a {
color: #000;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap {
position: initial;
width: 100%;
@@ -1102,7 +1119,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.info {
width: 14rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.info {
width: 100%;
}
@@ -1110,7 +1127,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.support {
width: 16rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap.support {
width: 100%;
}
@@ -1140,7 +1157,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap ul .menuDepth2 a:hover {
color: #05141f;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap ul .menuDepth2 a {
padding: 0.6rem 0;
}
@@ -1148,7 +1165,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu {
display: flex;
position: absolute;
@@ -1170,7 +1187,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .loginBtn {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .gnb .menuWarp .loginBtn {
position: absolute;
bottom: 2rem;
@@ -1187,9 +1204,15 @@ video::-webkit-media-controls {
}
.hederWarp_n .headerInner .func .carlist {
position: relative;
margin-right: 2.5rem;
margin-right: 2rem;
transition: all 0.2s ease-in-out;
}
@media (max-width: 1024px) {
@media (max-width: 1220px) {
.hederWarp_n .headerInner .func .carlist {
margin-right: 1.5rem;
}
}
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .carlist {
display: none;
}
@@ -1200,7 +1223,7 @@ video::-webkit-media-controls {
}
.hederWarp_n .headerInner .func .carlist .carItem {
display: flex;
justify-content: center;
justify-content: flex-end;
align-items: center;
height: 8rem;
}
@@ -1232,7 +1255,7 @@ video::-webkit-media-controls {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
min-width: 2.2rem;
white-space: nowrap;
}
.hederWarp_n .headerInner .func .carlist .carItem span + span::before {
content: "";
@@ -1310,7 +1333,7 @@ video::-webkit-media-controls {
display: block;
margin-right: 2rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .userLogin {
display: none;
}
@@ -1331,9 +1354,9 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .func .user {
position: relative;
display: block;
margin-right: 2rem;
margin-right: 0;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .user {
display: none;
}
@@ -1405,7 +1428,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .func .moblieMenu {
display: none;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n .headerInner .func .moblieMenu {
display: flex;
justify-content: center;
@@ -1481,7 +1504,7 @@ video::-webkit-media-controls {
.hederWarp_n.hBoder .headerInner .func .userLogin > a:hover {
border: 1px solid rgb(5, 20, 31);
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.hederWarp_n.noBoder .headerInner .func .moblieMenu .burgur .top-line,
.hederWarp_n.hBoder .headerInner .func .moblieMenu .burgur .top-line {
background-color: #000;
@@ -3845,7 +3868,7 @@ video::-webkit-media-controls {
width: calc(100% - 4rem);
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.installInfoPopup .popInner {
padding: 3rem 3rem;
}

1
kr/assets/css/common.css copy.map
View File

File diff suppressed because one or more lines are too long

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

File diff suppressed because one or more lines are too long

101
kr/assets/css/common.scss
View File

@@ -733,14 +733,17 @@ video::-webkit-media-controls {
background-color: transparent;
@media (max-width: 1240px) {
padding: 0 2rem;
padding: 0 1.5rem;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
// height: 5.6rem;
}
&.menu-open {
&+.pageTitle {
&~.pageTitle {
z-index: 0 !important;
}
&~.contentWarp {
z-index: 0 !important;
}
.user .icon-user {
@@ -809,7 +812,7 @@ video::-webkit-media-controls {
}
.moblieMenu {
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.burgur .top-line {
background-color: #000;
}
@@ -822,7 +825,7 @@ video::-webkit-media-controls {
}
.menuBg {
@media (min-width: 1024px) {
@media (min-width: 1120px) {
&::after{
opacity: 1;
}
@@ -844,13 +847,13 @@ video::-webkit-media-controls {
margin: 0 auto;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
height: 5.6rem;
}
.menuBg {
display: none;
@media (min-width: 1024px) {
@media (min-width: 1120px) {
display: block;
position: absolute;
top: 0;
@@ -881,7 +884,7 @@ video::-webkit-media-controls {
.logoWrap {
position: relative;
z-index: 2;
@media (min-width: 1024px) {
@media (min-width: 1120px) {
display: flex;
align-items: center;
height: 8rem;
@@ -902,7 +905,7 @@ video::-webkit-media-controls {
span {
margin-left: 1rem;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
font-size: 1.5rem;
margin-top: 0.4rem;
}
@@ -911,7 +914,7 @@ video::-webkit-media-controls {
}
.menuWarp {
@media (max-width: 1024px) {
@media (max-width: 1120px) {
position: fixed;
top: 0;
bottom: 0;
@@ -932,7 +935,7 @@ video::-webkit-media-controls {
.mobileMenuTop {
display: none;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: flex;
justify-content: space-between;
align-items: center;
@@ -979,7 +982,7 @@ video::-webkit-media-controls {
.mobileFunc {
display: none;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: flex;
width: 100%;
@@ -1016,7 +1019,7 @@ video::-webkit-media-controls {
.mobileCarlist {
display: none;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: block;
position: relative;
@@ -1042,8 +1045,10 @@ video::-webkit-media-controls {
font-size: 1.4rem;
font-weight: 600;
display: flex;
align-items: center;
width: fit-content;
min-width: 2.2rem;
word-break: break-word;
}
span+span {
@@ -1136,11 +1141,15 @@ video::-webkit-media-controls {
.menu {
display: flex;
margin-left: 4.5rem;
transition: margin-left 0.2s ease-in-out;
@media (max-width: 1220px) {
margin-left: 2rem;
}
&.open {
li {
.menuDepth2Wrap {
&.info {
@media (min-width: 1024px) {
@media (min-width: 1120px) {
display: block;
width: 27rem;
}
@@ -1154,39 +1163,39 @@ video::-webkit-media-controls {
li:nth-child(1) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
left: -15.6rem;
@media (min-width: 1120px) {
left: -11.6rem;
}
}
}
li:nth-child(2) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
left: 3.4rem;
@media (min-width: 1120px) {
left: 5.4rem;
}
}
}
li:nth-child(3) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
left: 19.6rem;
@media (min-width: 1120px) {
left: 21.6rem;
}
}
}
li:nth-child(4) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
@media (min-width: 1120px) {
display: block;
left: 28.4rem;
left: 30.4rem;
}
}
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: block;
margin-left: 0;
margin-top: 2rem;
@@ -1199,7 +1208,7 @@ video::-webkit-media-controls {
position: relative;
z-index: 2;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
padding: 0 2rem;
}
@@ -1212,8 +1221,13 @@ video::-webkit-media-controls {
font-size: 1.6rem;
font-weight: 600;
color: #ffffff;
white-space: nowrap;
@media (max-width: 1024px) {
@media (max-width: 1220px) {
padding: 0 1.25rem;
}
@media (max-width: 1120px) {
position: relative;
justify-content: flex-start;
height: initial;
@@ -1271,7 +1285,7 @@ video::-webkit-media-controls {
}
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
position: initial;
width: 100%;
transform: initial;
@@ -1290,7 +1304,7 @@ video::-webkit-media-controls {
&.info {
width: 14rem;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
width: 100%;
}
}
@@ -1298,7 +1312,7 @@ video::-webkit-media-controls {
&.support {
width: 16rem;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
width: 100%;
}
}
@@ -1333,7 +1347,7 @@ video::-webkit-media-controls {
color: #05141f;
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
padding: .6rem 0;
}
}
@@ -1346,7 +1360,7 @@ video::-webkit-media-controls {
.mobileSubMenu {
display: none;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: flex;
position: absolute;
bottom:3.2rem;
@@ -1372,7 +1386,7 @@ video::-webkit-media-controls {
.loginBtn {
display: none;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
position: absolute;
bottom: 2rem;
display: block;
@@ -1391,9 +1405,13 @@ video::-webkit-media-controls {
.carlist {
position: relative;
margin-right: 2.5rem;
margin-right: 2rem;
transition: all 0.2s ease-in-out;
@media (max-width: 1024px) {
@media (max-width: 1220px) {
margin-right: 1.5rem;
}
@media (max-width: 1120px) {
display: none;
}
@@ -1408,7 +1426,7 @@ video::-webkit-media-controls {
.carItem {
display: flex;
justify-content: center;
justify-content: flex-end;
align-items: center;
height: 8rem;
@@ -1444,7 +1462,8 @@ video::-webkit-media-controls {
font-weight: 400;
display: flex;
width: fit-content;
min-width: 2.2rem;
// min-width: 2.2rem;
white-space: nowrap;
}
span+span {
@@ -1540,7 +1559,7 @@ video::-webkit-media-controls {
display: block;
margin-right: 2rem;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: none;
}
@@ -1563,9 +1582,9 @@ video::-webkit-media-controls {
.user {
position: relative;
display: block;
margin-right: 2rem;
margin-right: 0;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: none;
}
@@ -1648,7 +1667,7 @@ video::-webkit-media-controls {
.moblieMenu {
display: none;
@media (max-width: 1024px) {
@media (max-width: 1120px) {
display: flex;
justify-content: center;
align-items: center;
@@ -1755,7 +1774,7 @@ video::-webkit-media-controls {
}
.moblieMenu {
@media (max-width: 1024px) {
@media (max-width: 1120px) {
.burgur .top-line {
background-color: #000;
}
@@ -4335,7 +4354,7 @@ video::-webkit-media-controls {
width: calc(100% - 4rem);
}
@media (max-width: 1024px) {
@media (max-width: 1120px) {
padding: 3rem 3rem;
}

1
kr/assets/css/kia.css.map
View File

File diff suppressed because one or more lines are too long

2
kr/assets/css/kia/kia.css
View File

@@ -388,11 +388,13 @@ html .hederWarp_n .headerInner .gnb .logoWrap a .logoImg {
height: 1.5rem;
background-image: url(../../images/kia/kia-logo-n.svg);
background-repeat: no-repeat;
transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
}
@media (min-width: 1025px) {
html .hederWarp_n .headerInner .gnb .logoWrap a .logoImg {
height: 2rem;
width: 22.8rem;
transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
}
}
html .hederWarp_n.menu-open .headerInner .gnb .logoWrap a .logoImg {

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

File diff suppressed because one or more lines are too long

2
kr/assets/css/kia/kia.scss
View File

@@ -481,10 +481,12 @@ html {
height: 1.5rem;
background-image: url(../../images/kia/kia-logo-n.svg);
background-repeat: no-repeat;
transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
@include desktopMin {
height: 2rem;
width: 22.8rem;
transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
}
}

16
kr/info/buying-Installation-guide.html
View File

@@ -131,6 +131,20 @@
<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_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_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_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>
@@ -239,10 +253,12 @@
</div>
</div>
<!--//header-->
<script></script>
<div class="pageTitle">
<h1>스토어 이용안내</h1>
</div>
<script></script>
<div class="contentWarp">
<div class="contentsTypeNew caseStoreguide">

6
kr/info/registration-guide.html
View File

@@ -131,6 +131,11 @@
<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_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>
@@ -475,6 +480,7 @@
</div>
<!--//footer-->
<script>
AOS.init();
var swiper1 = new Swiper(".swiper1", {
slidesPerView: "auto",
//freeMode: true,

23
kr/kia.html
View File

@@ -27,7 +27,7 @@
<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?v3" type="text/css" />
<link rel="stylesheet" charset="UTF-8" href="assets/css/common.css?v4" 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>
@@ -88,8 +88,8 @@
<div class="mobileCarlist">
<a href="javascript:void(0)" class="mobilecarItem">
<div class="item">
<span>MV</span>
<span>161어 1660</span>
<span>스포티지 HEV/PHEV 개조25</span>
<span>KNAPX81GDSK215530</span>
</div>
<div class="arrow"></div>
</a>
@@ -132,6 +132,15 @@
<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>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
<li class="menuDepth2"><a href="/kr/product/pdp_streaming_plus.html">스트리밍 플러스</a></li>
</ul>
</div>
</li>
@@ -182,8 +191,8 @@
<!-- PC 전용 차량 선택 UI입니다. -->
<div class="carlist">
<a href="javascript:void(0)" class="carItem">
<span>MV</span>
<span>161어 1660</span>
<span>스포티지 HEV/PHEV 개조25</span>
<span>KNAPX81GDSK215530</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">
@@ -214,9 +223,9 @@
</div>
<!-- PC 전용 로그인 버튼입니다. -->
<div class="userLogin">
<!-- <div class="userLogin">
<a href="#">로그인/가입</a>
</div>
</div> -->
<!-- PC 전용 USER 관련 링크 영역입니다. -->
<div class="user">

414
kr/mypage/my-product-view_popup.html Normal file
View File

@@ -0,0 +1,414 @@
<!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/mypage.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" />
<style>
.alertPopup {
gap: 10px;
}
.alertPopup .popInner {
position: relative ;
top: auto;
left: auto;
transform:translate(0)
}
</style>
</head>
<body>
<!--알럿팝업-->
<!-- [S] 요금제 리스트에서 변경 또는 해지 버튼을 클릭 시 노출되는 레이어 팝업 -->
<div id="terminationService" class="alertPopup" style="display: none; opacity: 0">
<div class="popInner">
<div class="content">
<p>
<span> 요금제 변경을 위해서는 사용중인 요금제를 해지하신 후, 다시 구매하셔야 합니다. 요금제를 해지하시겠습니까? </span>
</p>
<div class="carswBtn">
<div class="towButton">
<a href="javascript:;" class="cartBtn leftBtn" onClick="javascript:close_layer_popup('terminationService');"><p>취소</p></a>
<a href="javascript:;" class="PurchaseBtn rightBtn" onClick="javascript:close_layer_popup('terminationService');open_layer_popup('terminationFinish');"><p>요금제 해지</p></a>
</div>
</div>
</div>
</div>
</div>
<!-- [E] 요금제 리스트에서 변경 또는 해지 버튼을 클릭 시 노출되는 레이어 팝업 -->
<!-- [S] 뮤직 스트리밍 서비스 해지 컨펌 레이어 팝업에서 요금제 해지를 클릭한 경우 -->
<div id="terminationFinish" class="alertPopup" style="display: none; opacity: 0">
<div class="popInner">
<div class="content">
<p>
<span> 요금제 해지가 완료되었습니다. </span>
</p>
<div class="carswBtn">
<div class="oneButton">
<!-- 뮤직 스트리밍 PDP 페이지로 이동합니다. -->
<a href=""><p>확인</p></a>
</div>
</div>
</div>
</div>
</div>
<!-- [E] 뮤직 스트리밍 서비스 해지 컨펌 레이어 팝업에서 요금제 해지를 클릭한 경우 -->
<!--알럿팝업-->
<!--//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="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>
<div id="cancelPremiumAlert" class="alertPopup cancelPremiumPopup" style="display: flex; opacity: 1">
<div class="popInner">
<div class="content">
<strong class="alertMessage">
<em>즉시 해지(결제 7일 이내)</em>
스트리밍 프리미엄 약정 사양 구독을 해지 하시겠습니까?
</strong>
<!-- [즉시 해지] (결제 7일 이내) -->
<div class="alertSubMessage">
<ul>
<li>∙ 구독을 해지하시면 차량에서 해당 사양의 이용이 중지됩니다.</li>
<li>
∙ 해지 시 과금/환불 비용 구분<br />
<ul>
<li>
<span>가) 차량용 webOS 콘텐츠 플랫폼</span>
가입일로부터 7일 이내에 환불 요청 시, 전체 환불 처리 됩니다.
</li>
<li>
<span>나) 스트리밍 프리미엄 데이터 요금제</span>
통신사 정책에 따라 사후 일할 계산됩니다.<br />(문의 : 기아 커넥트 센터 1899-2121)
</li>
</ul>
</li>
</ul>
<div class="totalRefund radioArea">
<b>총 받으실 금액 : <span class="minusPriceInfo">6,000</span>원</b>
</div>
<ul>
<li>
차량용 webOS 콘텐츠 플랫폼 비용 상세 사항
<ul>
<li>
<span><b>a) 환불 금액 : 6,000원</b> (잔여 이용 기간에 대하여 돌려받으실 환불 금액 )</span>
i) 일할 계산 : 7일 이내 전체 환불
</li>
<li>
<span><b>b) 중도 해지 납부 금액 : 0원</b> (약정 사양 중도 해지로 인한 납부 금액) </span>
i) 할인 반환금 : 0원 <br />
ii)중도해지 위약금 : 0원 (약정 기간 종료 전 해지로 인한 위약금)
</li>
<li>
<span><b>c) 총 받으실 금액 : 6,000원</b></span>
i) 환불 금액 6,000원 - 중도 해지 납부 금액 0원
</li>
</ul>
</li>
</ul>
</div>
<div class="carswBtn">
<div class="towButton">
<a href="" id="alertCancel" class="cartBtn leftBtn">
<p>계속 구독하기</p>
</a>
<a href="" id="alertCancelPremiumReservation" class="PurchaseBtn rightBtn">
<p>구독 해지</p>
</a>
</div>
</div>
</div>
</div>
<div class="popInner">
<div class="content">
<strong class="alertMessage">
<em>즉시 해지(결제 7일 이내)</em>
스트리밍 프리미엄 약정 사양 구독을 해지 하시겠습니까?
</strong>
<!-- [즉시 해지] (결제 7일 초과) -->
<div class="alertSubMessage">
<ul>
<li>∙ 구독을 해지하시면 차량에서 해당 사양의 이용이 중지됩니다.</li>
<li>
∙ 해지 시 과금/환불 비용 구분<br />
<ul>
<li>
<span>가) 차량용 webOS 콘텐츠 플랫폼</span>
∙ 납부하신 당월 결제 금액은 일할 계산되어 환불 처리 됩니다.<br />
∙ 총 납부하실 금액은 구독 해지 즉시 결제 진행됩니다.
</li>
<li>
<span>나) 스트리밍 프리미엄 데이터 요금제</span>
통신사 정책에 따라 사후 일할 계산됩니다. (문의 : 기아 커넥트 센터 1899-2121)
</li>
</ul>
</li>
</ul>
<div class="totalRefund radioArea">
<b>총 받으실 금액 : <span class="minusPriceInfo">2,000</span>원</b>
</div>
<ul>
<li>
차량용 webOS 콘텐츠 플랫폼 비용 상세 사항
<ul>
<li>
<span><b>a) 환불 금액 : 5,000원</b> (잔여 이용 기간에 대하여 돌려받으실 환불 금액 )</span>
i) 일할 계산 환불 금액: 월 요금 - (월 요금 * (사용일수/결제월 총일수의 반올림))
</li>
<li>
<span><b>b) 중도 해지 납부 금액 : 3,000원</b> (약정 사양 중도 해지로 인한 납부 금액) </span>
i) 할인 반환금 : 1,000원 (할인 받으셨던 기간 동안의 해택 반환금) <br />
ii)중도해지 위약금 : 0원 (약정 기간 종료 전 해지로 인한 위약금)<br />
</li>
<li>
<span><b>c) 총 받으실 금액 : 2,000원</b></span>
i) 환불 금액 5,000원 - 중도 해지 납부 금액 3,000원
</li>
</ul>
</li>
</ul>
</div>
<!--// [즉시 해지] (결제 7일 초과) -->
<!-- [예약 해지] (다음 회차 정기결제 시점 해지) -->
<!-- <div class="alertSubMessage">
<ul>
<li>
∙ 디지털 사양 구독 해지를 예약하시면 다음 회차 정기 결제 일에 해지되며 차량에서 해당 사양의 이용이 중지됩니다.<br />
(2024.10.26 구독해지 예정)
</li>
<li>
∙ 해지 시 과금/환불 비용 구분<br />
<ul>
<li>
<span>가) 차량용 webOS 콘텐츠 플랫폼</span>
∙ 다음 회차 정기 결제 일에 해지되며 환불받으실 금액은 없습니다.<br />
∙ 총 납부하실 금액은 구독 해지 예약 신청 즉시 결제 진행됩니다.
</li>
<li>
<span>나) 스트리밍 프리미엄 데이터 요금제</span>
통신사 정책에 따라 사후 일할 계산됩니다. (문의 : 기아 커넥트 센터 1899-2121)
</li>
</ul>
</li>
</ul>
<div class="totalRefund radioArea">
<b>총 납부하실 금액 : <span class="minusPriceInfo">15,000</span>원</b>
</div>
<ul>
<li>
차량용 webOS 콘텐츠 플랫폼 비용 상세 사항
<ul>
<li>
<span><b>a) 환불 금액 : 0원</b> (잔여 이용 기간에 대하여 돌려받으실 환불 금액 )</span>
i) 일할 계산 : 다음 회차 정기 결제일에 해지되어 일할 계산할 금액이 없습니다.
</li>
<li>
<span><b>b) 중도 해지 납부 금액 : 30,000원</b> (약정 사양 중도 해지로 인한 납부 금액) </span>
i) 할인 반환금 : 15,000원 (할인 받으셨던 기간 동안의 해택 반환금)<br />
ii)중도해지 위약금 : 15,000원 (약정 기간 종료 전 해지로 인한 위약금)
</li>
<li>
<span><b>c) 총 납부하실 금액 : 15,000원</b></span>
i) 환불 금액 15,000원 - 중도 해지 납부 금액 30,000원
</li>
</ul>
</li>
</ul>
</div> -->
<!--// [예약 해지] (다음 회차 정기결제 시점 해지) -->
<div class="carswBtn">
<div class="towButton">
<a href="" id="alertCancel" class="cartBtn leftBtn">
<p>계속 구독하기</p>
</a>
<a href="" id="alertCancelPremiumReservation" class="PurchaseBtn rightBtn">
<p>구독 해지</p>
</a>
</div>
</div>
</div>
</div>
<div class="popInner">
<div class="content">
<strong class="alertMessage">
<em>즉시 해지(결제 7일 이내)</em>
스트리밍 프리미엄 약정 사양 구독을 해지 하시겠습니까?
</strong>
<!-- [예약 해지] (다음 회차 정기결제 시점 해지) -->
<div class="alertSubMessage">
<ul>
<li>
∙ 디지털 사양 구독 해지를 예약하시면 다음 회차 정기 결제 일에 해지되며 차량에서 해당 사양의 이용이 중지됩니다.<br />
(2024.10.26 구독해지 예정)
</li>
<li>
∙ 해지 시 과금/환불 비용 구분<br />
<ul>
<li>
<span>가) 차량용 webOS 콘텐츠 플랫폼</span>
∙ 다음 회차 정기 결제 일에 해지되며 환불받으실 금액은 없습니다.<br />
∙ 총 납부하실 금액은 구독 해지 예약 신청 즉시 결제 진행됩니다.
</li>
<li>
<span>나) 스트리밍 프리미엄 데이터 요금제</span>
통신사 정책에 따라 사후 일할 계산됩니다. (문의 : 기아 커넥트 센터 1899-2121)
</li>
</ul>
</li>
</ul>
<div class="totalRefund radioArea">
<b>총 납부하실 금액 : <span class="minusPriceInfo">15,000</span>원</b>
</div>
<ul>
<li>
차량용 webOS 콘텐츠 플랫폼 비용 상세 사항
<ul>
<li>
<span><b>a) 환불 금액 : 0원</b> (잔여 이용 기간에 대하여 돌려받으실 환불 금액 )</span>
i) 일할 계산 : 다음 회차 정기 결제일에 해지되어 일할 계산할 금액이 없습니다.
</li>
<li>
<span><b>b) 중도 해지 납부 금액 : 30,000원</b> (약정 사양 중도 해지로 인한 납부 금액) </span>
i) 할인 반환금 : 15,000원 (할인 받으셨던 기간 동안의 해택 반환금)<br />
ii)중도해지 위약금 : 15,000원 (약정 기간 종료 전 해지로 인한 위약금)
</li>
<li>
<span><b>c) 총 납부하실 금액 : 15,000원</b></span>
i) 환불 금액 15,000원 - 중도 해지 납부 금액 30,000원
</li>
</ul>
</li>
</ul>
</div>
<!--// [예약 해지] (다음 회차 정기결제 시점 해지) -->
<div class="carswBtn">
<div class="towButton">
<a href="" id="alertCancel" class="cartBtn leftBtn">
<p>계속 구독하기</p>
</a>
<a href="" id="alertCancelPremiumReservation" class="PurchaseBtn rightBtn">
<p>구독 해지</p>
</a>
</div>
</div>
</div>
</div>
</div>
<!--//footer-->
</body>
</html>

15
kr/service/event-list.html
View File

@@ -129,6 +129,18 @@
<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_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_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_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>
@@ -240,9 +252,12 @@
</div>
<!--//header-->
<script></script>
<div class="pageTitle">
<h1>이벤트</h1>
</div>
<script></script>
<!--//content-warp-->
<div class="contentWarp">