디즈니 전용관 작업 중
@@ -29,6 +29,11 @@
|
||||
max-width: 100%;
|
||||
margin-top: 0;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .contentWarp {
|
||||
margin-bottom: 16rem;
|
||||
}
|
||||
}
|
||||
#promotion .promotionHeader {
|
||||
width: 100%;
|
||||
aspect-ratio: 360/550;
|
||||
@@ -36,32 +41,39 @@
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .promotionHeader {
|
||||
height: 108rem;
|
||||
height: 95rem;
|
||||
background: url("../images/kia/promotion/kv_promotion.jpg") no-repeat center center/auto 100%;
|
||||
}
|
||||
}
|
||||
#promotion .promotionHeader .promotionHeaderInner {
|
||||
width: 100%;
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
padding-top: 86vw;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .promotionHeader .promotionHeaderInner {
|
||||
padding-top: 71.4rem;
|
||||
padding-top: 76.4rem;
|
||||
}
|
||||
}
|
||||
#promotion .promotionHeader .promotionHeaderInner .pageTitle {
|
||||
text-align: center;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .promotionHeader .promotionHeaderInner .pageTitle {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
#promotion .promotionHeader .promotionHeaderInner .pageTitle h1 {
|
||||
font-size: 3rem;
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .promotionHeader .promotionHeaderInner .pageTitle h1 {
|
||||
font-size: 4.8rem;
|
||||
margin-bottom: 2.4rem;
|
||||
}
|
||||
}
|
||||
#promotion .promotionHeader .promotionHeaderInner .pageTitle p {
|
||||
@@ -80,6 +92,7 @@
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 4rem;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #fff;
|
||||
@@ -87,7 +100,6 @@
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .tabNavigation {
|
||||
width: 100%;
|
||||
height: 5.4rem;
|
||||
padding: 0;
|
||||
}
|
||||
@@ -103,7 +115,7 @@
|
||||
}
|
||||
}
|
||||
#promotion .tabNavigation .tabNavigationInner {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .tabNavigation .tabNavigationInner {
|
||||
@@ -181,7 +193,7 @@
|
||||
position: relative;
|
||||
}
|
||||
#promotion .contentSection .contentSectionInner {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
@@ -194,20 +206,20 @@
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .contentSection .title-area {
|
||||
margin-bottom: 8rem;
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
}
|
||||
#promotion .contentSection h2 {
|
||||
font-size: 3rem;
|
||||
font-weight: 600;
|
||||
color: #05141f;
|
||||
margin-bottom: 2.4rem;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 2.8rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .contentSection h2 {
|
||||
font-size: 4.8rem;
|
||||
margin-bottom: 2.4rem;
|
||||
margin-bottom: 4.2rem;
|
||||
}
|
||||
}
|
||||
#promotion .contentSection p {
|
||||
@@ -240,7 +252,7 @@
|
||||
}
|
||||
}
|
||||
#promotion .overview .contentSectionInner {
|
||||
padding: 4.8rem 2rem 0;
|
||||
padding: 5.4rem 2rem 0;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .overview .contentSectionInner {
|
||||
@@ -258,7 +270,12 @@
|
||||
}
|
||||
#promotion .overview .disneySwiperContainer .disneySwiper {
|
||||
width: 100%;
|
||||
padding: 2rem 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .overview .disneySwiperContainer .disneySwiper {
|
||||
padding: 2rem 0 0;
|
||||
}
|
||||
}
|
||||
#promotion .overview .disneySwiperContainer .disneySwiper .swiper-slide {
|
||||
overflow: hidden;
|
||||
@@ -312,7 +329,7 @@
|
||||
transform: scale(1.2);
|
||||
}
|
||||
#promotion .available-cars {
|
||||
padding: 6.4rem 2rem 0;
|
||||
padding: 7rem 2rem 0;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .available-cars {
|
||||
@@ -320,7 +337,7 @@
|
||||
}
|
||||
}
|
||||
#promotion .available-cars .contentSection {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#promotion .available-cars .contentSection .title-area {
|
||||
@@ -330,7 +347,7 @@
|
||||
font-size: 2.4rem;
|
||||
font-weight: 600;
|
||||
color: #05141f;
|
||||
margin-bottom: 0.8rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .available-cars .contentSection .title-area h3 {
|
||||
@@ -378,8 +395,7 @@
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .available-cars .noticeBox ul li {
|
||||
padding-left: 1.4rem;
|
||||
font-size: 1.4rem;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
}
|
||||
#promotion .available-cars .noticeBox ul li:before {
|
||||
@@ -411,9 +427,9 @@
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .theme-select-guide .contentSection {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
padding: 12rem 0;
|
||||
padding: 16.8rem 2rem;
|
||||
}
|
||||
}
|
||||
#promotion .theme-select-guide .contentSection .title-area {
|
||||
@@ -421,7 +437,12 @@
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .theme-select-guide .contentSection .title-area {
|
||||
margin-bottom: 6.4rem;
|
||||
margin-bottom: 5.2rem;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .theme-select-guide .contentSection .title-area h2 {
|
||||
margin-bottom: 2.3rem;
|
||||
}
|
||||
}
|
||||
#promotion .theme-select-guide .contentSection .title-area h3 {
|
||||
@@ -638,7 +659,8 @@
|
||||
background: url("../images/kia/promotion/ico_stay_tuned.svg") no-repeat center/contain;
|
||||
}
|
||||
#promotion .theme-select-guide .guides-wrap .guides-section .guides-content .stay-tuned strong {
|
||||
padding: 0;
|
||||
padding: 0.2rem 0 0;
|
||||
line-height: 1;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .theme-select-guide .guides-wrap .guides-section .guides-content .stay-tuned {
|
||||
@@ -700,13 +722,13 @@
|
||||
background: url("../images/kia/promotion/bg_national_pattern.png") no-repeat center top/100% auto;
|
||||
}
|
||||
#promotion .more-features .contentSection {
|
||||
padding: 8rem 0;
|
||||
padding: 7.9rem 0;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .more-features .contentSection {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
padding: 12rem 0 8rem;
|
||||
padding: 7rem 2rem 12rem;
|
||||
}
|
||||
}
|
||||
#promotion .more-features .contentSection .title-area {
|
||||
@@ -730,7 +752,7 @@
|
||||
}
|
||||
}
|
||||
#promotion .more-features .features-list {
|
||||
margin-bottom: 2.4rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .more-features .features-list {
|
||||
@@ -813,31 +835,30 @@
|
||||
border-top: 1px solid #dedede;
|
||||
}
|
||||
#promotion .information .contentSection {
|
||||
padding: 8rem 2rem;
|
||||
padding: 7.8rem 2rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .information .contentSection {
|
||||
padding: 12rem 2rem 8rem;
|
||||
max-width: 120rem;
|
||||
padding: 11.5rem 2rem 8rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
#promotion .information .contentSection .title-area {
|
||||
margin-bottom: 4rem;
|
||||
margin-bottom: 2.7rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .information .contentSection .title-area {
|
||||
margin-bottom: 8rem;
|
||||
margin-bottom: 3.5rem;
|
||||
}
|
||||
}
|
||||
#promotion .information .contentSection .title-area h2 {
|
||||
margin-bottom: 0.8rem;
|
||||
font-size: 2.4rem;
|
||||
font-size: 2rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .information .contentSection .title-area h2 {
|
||||
margin-bottom: 1.6rem;
|
||||
font-size: 3.2rem;
|
||||
font-size: 3rem;
|
||||
}
|
||||
}
|
||||
#promotion .information .info-section {
|
||||
@@ -859,10 +880,10 @@
|
||||
}
|
||||
}
|
||||
#promotion .information .info-section .item h3 {
|
||||
font-size: 1.8rem;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
color: #05141f;
|
||||
margin-bottom: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
#promotion .information .info-section .item h3 {
|
||||
@@ -920,38 +941,40 @@
|
||||
#promotion .information .info-section .item ul li.bu-none:before {
|
||||
display: none;
|
||||
}
|
||||
#promotion .infoGrid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(28rem, 1fr));
|
||||
gap: 3rem;
|
||||
margin-top: 3rem;
|
||||
#promotion .goto-area {
|
||||
display: none;
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
#promotion .infoGrid .infoSection h3 {
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin-bottom: 1.5rem;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid #e5e5e5;
|
||||
@media (min-width: 768px) {
|
||||
#promotion .goto-area {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
#promotion .infoGrid .infoSection ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
@media (min-width: 768px) {
|
||||
#promotion .goto-area .contentSection {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
max-width: 124rem;
|
||||
height: 10rem;
|
||||
padding: 0 2rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
#promotion .infoGrid .infoSection ul li {
|
||||
padding: 0.8rem 0;
|
||||
font-size: 1.4rem;
|
||||
color: #666;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
#promotion .infoGrid .infoSection ul li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
#promotion .infoGrid .infoSection ul li:before {
|
||||
content: "•";
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
margin-right: 1rem;
|
||||
@media (min-width: 768px) {
|
||||
#promotion .goto-area .contentSection .btn-goto {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
color: #05141f;
|
||||
}
|
||||
#promotion .goto-area .contentSection .btn-goto:before {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 3.2rem;
|
||||
height: 1.5rem;
|
||||
margin-right: 1.3rem;
|
||||
background: url("../images/kia/promotion/ico_goto.svg") no-repeat center/auto 100%;
|
||||
}
|
||||
}
|
||||
/*# sourceMappingURL=promotion.css.map */
|
||||
@@ -23,6 +23,9 @@ $KiaBlack: #05141f;
|
||||
.contentWarp {
|
||||
max-width: 100%;
|
||||
margin-top: 0;
|
||||
@include tablet {
|
||||
margin-bottom: 16rem;
|
||||
}
|
||||
}
|
||||
.promotionHeader {
|
||||
width: 100%;
|
||||
@@ -30,25 +33,30 @@ $KiaBlack: #05141f;
|
||||
aspect-ratio: 360 / 550;
|
||||
background: url("../images/kia/promotion/kv_promotion_m.jpg") no-repeat center center / cover;
|
||||
@include tablet {
|
||||
height: 108rem;
|
||||
height: 95rem;
|
||||
background: url("../images/kia/promotion/kv_promotion.jpg") no-repeat center center / auto 100%;
|
||||
}
|
||||
.promotionHeaderInner {
|
||||
width: 100%;
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
padding-top: 86vw;
|
||||
@include tablet {
|
||||
padding-top: 71.4rem;
|
||||
padding-top: 76.4rem;
|
||||
}
|
||||
.pageTitle {
|
||||
text-align: center;
|
||||
@include tablet {
|
||||
text-align: left;
|
||||
}
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
margin-bottom: 1.2rem;
|
||||
@include tablet {
|
||||
font-size: 4.8rem;
|
||||
margin-bottom: 2.4rem;
|
||||
}
|
||||
}
|
||||
p {
|
||||
@@ -69,12 +77,12 @@ $KiaBlack: #05141f;
|
||||
overflow-x: auto;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 4rem;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #fff;
|
||||
z-index: 100;
|
||||
@include tablet {
|
||||
width: 100%;
|
||||
height: 5.4rem;
|
||||
padding: 0;
|
||||
&:after {
|
||||
@@ -89,7 +97,7 @@ $KiaBlack: #05141f;
|
||||
}
|
||||
}
|
||||
.tabNavigationInner {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
@include tablet {
|
||||
margin: 0 auto;
|
||||
}
|
||||
@@ -157,7 +165,7 @@ $KiaBlack: #05141f;
|
||||
min-height: 60rem;
|
||||
position: relative;
|
||||
.tabContentInner {
|
||||
// max-width: 120rem;
|
||||
// max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
.tabContent {
|
||||
@@ -172,7 +180,7 @@ $KiaBlack: #05141f;
|
||||
|
||||
.contentSection {
|
||||
.contentSectionInner {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
@include tablet {
|
||||
padding: 0;
|
||||
@@ -182,7 +190,7 @@ $KiaBlack: #05141f;
|
||||
.title-area {
|
||||
margin-bottom: 3.2rem;
|
||||
@include tablet {
|
||||
margin-bottom: 8rem;
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -190,11 +198,11 @@ $KiaBlack: #05141f;
|
||||
font-size: 3rem;
|
||||
font-weight: 600;
|
||||
color: $KiaBlack;
|
||||
margin-bottom: 2.4rem;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 2.8rem;
|
||||
line-height: 1.2;
|
||||
@include tablet {
|
||||
font-size: 4.8rem;
|
||||
margin-bottom: 2.4rem;
|
||||
margin-bottom: 4.2rem;
|
||||
}
|
||||
}
|
||||
p {
|
||||
@@ -224,7 +232,7 @@ $KiaBlack: #05141f;
|
||||
|
||||
.overview {
|
||||
.contentSectionInner {
|
||||
padding: 4.8rem 2rem 0;
|
||||
padding: 5.4rem 2rem 0;
|
||||
@include tablet {
|
||||
padding: 8rem 2rem 0;
|
||||
}
|
||||
@@ -239,7 +247,10 @@ $KiaBlack: #05141f;
|
||||
|
||||
.disneySwiper {
|
||||
width: 100%;
|
||||
padding: 2rem 0 0;
|
||||
padding: 0;
|
||||
@include tablet {
|
||||
padding: 2rem 0 0;
|
||||
}
|
||||
|
||||
.swiper-slide {
|
||||
overflow: hidden;
|
||||
@@ -301,12 +312,12 @@ $KiaBlack: #05141f;
|
||||
}
|
||||
|
||||
.available-cars {
|
||||
padding: 6.4rem 2rem 0;
|
||||
padding: 7rem 2rem 0;
|
||||
@include tablet {
|
||||
padding: 12rem 2rem 3.2rem;
|
||||
}
|
||||
.contentSection {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
.title-area {
|
||||
margin-bottom: 3.2rem;
|
||||
@@ -314,7 +325,7 @@ $KiaBlack: #05141f;
|
||||
font-size: 2.4rem;
|
||||
font-weight: 600;
|
||||
color: $KiaBlack;
|
||||
margin-bottom: 0.8rem;
|
||||
margin-bottom: 1rem;
|
||||
@include tablet {
|
||||
font-size: 3.2rem;
|
||||
margin-bottom: 1.6rem;
|
||||
@@ -358,8 +369,7 @@ $KiaBlack: #05141f;
|
||||
color: $KiaBlack;
|
||||
line-height: 1.5;
|
||||
@include tablet {
|
||||
padding-left: 1.4rem;
|
||||
font-size: 1.4rem;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
&:before {
|
||||
@@ -391,14 +401,19 @@ $KiaBlack: #05141f;
|
||||
.contentSection {
|
||||
padding: 8rem 2rem;
|
||||
@include tablet {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
padding: 12rem 0;
|
||||
padding: 16.8rem 2rem;
|
||||
}
|
||||
.title-area {
|
||||
margin-bottom: 6.4rem;
|
||||
@include tablet {
|
||||
margin-bottom: 6.4rem;
|
||||
margin-bottom: 5.2rem;
|
||||
}
|
||||
h2 {
|
||||
@include tablet {
|
||||
margin-bottom: 2.3rem;
|
||||
}
|
||||
}
|
||||
h3 {
|
||||
font-size: 1.8rem;
|
||||
@@ -607,7 +622,8 @@ $KiaBlack: #05141f;
|
||||
background: url("../images/kia/promotion/ico_stay_tuned.svg") no-repeat center / contain;
|
||||
}
|
||||
strong {
|
||||
padding: 0;
|
||||
padding: 0.2rem 0 0;
|
||||
line-height: 1;
|
||||
}
|
||||
@include tablet {
|
||||
display: block;
|
||||
@@ -686,11 +702,11 @@ $KiaBlack: #05141f;
|
||||
// More Features 탭 스타일
|
||||
.more-features {
|
||||
.contentSection {
|
||||
padding: 8rem 0;
|
||||
padding: 7.9rem 0;
|
||||
@include tablet {
|
||||
max-width: 120rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
padding: 12rem 0 8rem;
|
||||
padding: 7rem 2rem 12rem;
|
||||
}
|
||||
.title-area {
|
||||
padding: 0 2rem;
|
||||
@@ -710,7 +726,7 @@ $KiaBlack: #05141f;
|
||||
}
|
||||
}
|
||||
.features-list {
|
||||
margin-bottom: 2.4rem;
|
||||
margin-bottom: 2rem;
|
||||
@include tablet {
|
||||
margin-bottom: 8rem;
|
||||
}
|
||||
@@ -788,23 +804,22 @@ $KiaBlack: #05141f;
|
||||
.information {
|
||||
border-top: 1px solid #dedede;
|
||||
.contentSection {
|
||||
padding: 8rem 2rem;
|
||||
padding: 7.8rem 2rem;
|
||||
@include tablet {
|
||||
padding: 12rem 2rem 8rem;
|
||||
max-width: 120rem;
|
||||
padding: 11.5rem 2rem 8rem;
|
||||
max-width: 124rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.title-area {
|
||||
margin-bottom: 4rem;
|
||||
margin-bottom: 2.7rem;
|
||||
@include tablet {
|
||||
margin-bottom: 8rem;
|
||||
margin-bottom: 3.5rem;
|
||||
}
|
||||
h2 {
|
||||
margin-bottom: 0.8rem;
|
||||
font-size: 2.4rem;
|
||||
font-size: 2rem;
|
||||
@include tablet {
|
||||
margin-bottom: 1.6rem;
|
||||
font-size: 3.2rem;
|
||||
font-size: 3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -824,10 +839,10 @@ $KiaBlack: #05141f;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.8rem;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
color: $KiaBlack;
|
||||
margin-bottom: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
|
||||
@include tablet {
|
||||
flex: 0 0 auto;
|
||||
@@ -892,38 +907,36 @@ $KiaBlack: #05141f;
|
||||
}
|
||||
}
|
||||
|
||||
// Information 탭 스타일
|
||||
.infoGrid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(28rem, 1fr));
|
||||
gap: 3rem;
|
||||
margin-top: 3rem;
|
||||
.infoSection {
|
||||
h3 {
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin-bottom: 1.5rem;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid #e5e5e5;
|
||||
.goto-area {
|
||||
display: none;
|
||||
background-color: #f3f3f3;
|
||||
@include tablet {
|
||||
display: block;
|
||||
}
|
||||
.contentSection {
|
||||
@include tablet {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
max-width: 124rem;
|
||||
height: 10rem;
|
||||
padding: 0 2rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
li {
|
||||
padding: 0.8rem 0;
|
||||
font-size: 1.4rem;
|
||||
color: #666;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.btn-goto {
|
||||
@include tablet {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
color: $KiaBlack;
|
||||
&:before {
|
||||
content: "•";
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
margin-right: 1rem;
|
||||
content: "";
|
||||
display: block;
|
||||
width: 3.2rem;
|
||||
height: 1.5rem;
|
||||
margin-right: 1.3rem;
|
||||
background: url("../images/kia/promotion/ico_goto.svg") no-repeat center / auto 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
4
kr/assets/images/kia/promotion/ico_goto.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="33" height="16" viewBox="0 0 33 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M33 7.87988L0.999999 7.87988" stroke="black"/>
|
||||
<path d="M9.23438 15.3799L1.0058 7.87988L9.23438 0.379883" stroke="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 235 B |
|
Before Width: | Height: | Size: 100 KiB After Width: | Height: | Size: 57 KiB |
BIN
kr/assets/images/kia/promotion/img_available_cars2.png
Normal file
|
After Width: | Height: | Size: 100 KiB |
|
Before Width: | Height: | Size: 193 KiB After Width: | Height: | Size: 67 KiB |
BIN
kr/assets/images/kia/promotion/img_available_cars_m2.png
Normal file
|
After Width: | Height: | Size: 193 KiB |
|
Before Width: | Height: | Size: 1.3 MiB After Width: | Height: | Size: 873 KiB |
BIN
kr/assets/images/kia/promotion/kv_promotion2.jpg
Normal file
|
After Width: | Height: | Size: 1.3 MiB |
BIN
kr/assets/images/kia/promotion/marvel_logo1_m.png
Normal file
|
After Width: | Height: | Size: 49 KiB |
BIN
kr/assets/images/kia/promotion/marvel_logo2_m.png
Normal file
|
After Width: | Height: | Size: 49 KiB |
@@ -460,6 +460,8 @@
|
||||
<div class="noticeBox">
|
||||
<h4>Notice</h4>
|
||||
<ul>
|
||||
<li>Availabe after OTA updates : EV6, EV9, Sorento, Carnival, K5, K8</li>
|
||||
<li>2026 The New Sorento is available for purchase regardless OTA updates.</li>
|
||||
<li>It can be purchased only for users of the Kia Connect service.</li>
|
||||
<li>It is only available for vehicles with a 12.3-inch cluster among the ccNC infotainment platforms.</li>
|
||||
<li>Purchase availability can be found on the detailed page of each product.</li>
|
||||
@@ -789,6 +791,12 @@
|
||||
</div>
|
||||
<!--//content-warp-->
|
||||
|
||||
<div class="goto-area">
|
||||
<div class="contentSection">
|
||||
<a href="/kr/info/registration-guide" class="btn-goto">Go to the list</a>
|
||||
</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>
|
||||
@@ -1002,39 +1010,7 @@
|
||||
$(document).ready(function () {
|
||||
// Disney 스와이퍼 초기화
|
||||
var disneySwiper = new Swiper(".disneySwiper", {
|
||||
slidesPerView: 4.2,
|
||||
spaceBetween: 24,
|
||||
loop: true,
|
||||
autoplay: {
|
||||
delay: 1500,
|
||||
disableOnInteraction: false,
|
||||
},
|
||||
// pagination: {
|
||||
// el: ".swiper-pagination",
|
||||
// clickable: true,
|
||||
// },
|
||||
// navigation: {
|
||||
// nextEl: ".swiper-button-next",
|
||||
// prevEl: ".swiper-button-prev",
|
||||
// },
|
||||
breakpoints: {
|
||||
640: {
|
||||
slidesPerView: 1,
|
||||
spaceBetween: 0,
|
||||
},
|
||||
768: {
|
||||
slidesPerView: 3,
|
||||
spaceBetween: 24,
|
||||
},
|
||||
1024: {
|
||||
slidesPerView: 4.5,
|
||||
spaceBetween: 24,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
var disneyFeaturesSwiper = new Swiper(".features-list-swiper", {
|
||||
slidesPerView: 2.15,
|
||||
slidesPerView: "auto",
|
||||
spaceBetween: 16,
|
||||
loop: true,
|
||||
autoplay: {
|
||||
@@ -1049,15 +1025,46 @@
|
||||
// nextEl: ".swiper-button-next",
|
||||
// prevEl: ".swiper-button-prev",
|
||||
// },
|
||||
breakpoints: {
|
||||
768: {
|
||||
slidesPerView: 3,
|
||||
},
|
||||
1024: {
|
||||
slidesPerView: 4,
|
||||
spaceBetween: 16,
|
||||
},
|
||||
// breakpoints: {
|
||||
// 640: {
|
||||
// slidesPerView: 3,
|
||||
// spaceBetween: 16,
|
||||
// },
|
||||
// 768: {
|
||||
// slidesPerView: 3,
|
||||
// spaceBetween: 24,
|
||||
// },
|
||||
// 1024: {
|
||||
// slidesPerView: 4.5,
|
||||
// spaceBetween: 24,
|
||||
// },
|
||||
// },
|
||||
});
|
||||
|
||||
var disneyFeaturesSwiper = new Swiper(".features-list-swiper", {
|
||||
slidesPerView: "auto",
|
||||
spaceBetween: 16,
|
||||
loop: true,
|
||||
autoplay: {
|
||||
delay: 1500,
|
||||
disableOnInteraction: false,
|
||||
},
|
||||
// pagination: {
|
||||
// el: ".swiper-pagination",
|
||||
// clickable: true,
|
||||
// },
|
||||
// navigation: {
|
||||
// nextEl: ".swiper-button-next",
|
||||
// prevEl: ".swiper-button-prev",
|
||||
// },
|
||||
// breakpoints: {
|
||||
// 768: {
|
||||
// slidesPerView: 3,
|
||||
// },
|
||||
// 1024: {
|
||||
// slidesPerView: 4,
|
||||
// },
|
||||
// },
|
||||
});
|
||||
|
||||
// 탭 클릭 이벤트
|
||||
|
||||