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

디즈니 전용관 작업 중

Browse Source
This commit is contained in:
NEW_GIL_HOME\hyeon
2025-09-29 22:38:17 +09:00
parent d65206a8d5
commit 963917b1be
13 changed files with 220 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

145
kr/assets/css/promotion.scss
View File

@@ -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%;
}
}
}