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

20240429 수정

Browse Source
This commit is contained in:
NEW_GIL_HOME\hyeon
2024-05-06 20:06:11 +09:00
parent a8daeea014
commit ba4872ca76
9 changed files with 1397 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

169
assets/css/pdp_detail.css
View File

@@ -1959,7 +1959,7 @@
}
.displayTheme .visualBg:after {
content: "";
display: block;
display: none;
position: absolute;
bottom: 0;
left: 0;
@@ -1969,11 +1969,8 @@
background: rgb(255, 255, 255);
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 43%, rgb(255, 255, 255) 100%);
}
.displayTheme.comp_wide {
overflow: hidden;
}
.displayTheme.comp_wide .comp_body.layer_up .text_area {
margin-top: 7rem;
margin-top: 5.2rem;
}
@media (max-width: 768px) {
.displayTheme.comp_wide .comp_body .text_area {
@@ -1991,8 +1988,6 @@
align-items: center;
position: relative;
z-index: 2;
padding: 4rem 0;
background-color: rgba(0, 0, 0, 0.8);
}
@media (max-width: 1025px) {
.displayTheme.comp_wide .comp_bottom {
@@ -2004,6 +1999,15 @@
padding: 2rem 0;
}
}
.displayTheme.comp_wide .comp_bottom.thumb-swiper {
overflow: hidden;
flex-wrap: wrap;
padding: 17rem 0 0;
}
.displayTheme.comp_wide .comp_bottom.thumb-swiper .com_bottm_inner {
padding: 3.4rem 0;
background-color: rgba(0, 0, 0, 0.8);
}
.displayTheme.comp_wide .comp_bottom .com_bottm_inner {
display: flex;
justify-content: center;
@@ -2059,7 +2063,7 @@
transition-timing-function: linear;
}
.displayTheme.comp_wide .comp_bottom .com_bottm_inner .swiper .swiper-wrapper .swiper-slide {
width: 16.6rem !important;
width: 11.6rem !important;
padding: 6px;
border: 2px solid transparent;
cursor: pointer;
@@ -2080,7 +2084,7 @@
}
.displayTheme.comp_wide .comp_bottom .com_bottm_inner .swiper .swiper-wrapper .swiper-slide p {
margin-top: 0.3rem;
font-size: 1.4rem;
font-size: 1.2rem;
font-weight: 400;
color: #fff;
text-transform: uppercase;
@@ -2091,15 +2095,21 @@
margin-top: 0.5rem;
}
}
.displayTheme.comp_wide .comp_bottom .com_bottm_inner .swiper .swiper-wrapper .swiper-slide.selected {
border: 2px dashed rgba(255, 255, 255, 0.5);
}
.displayTheme.comp_wide .comp_bottom .com_bottm_inner .swiper .swiper-wrapper .swiper-slide.active {
border-color: #fff;
border: 2px solid #F8C40C;
}
.displayTheme .comp_top {
z-index: 2;
height: 36rem;
}
.displayTheme .comp_top .comp_body .text_area h3 {
margin-bottom: 2rem;
font-size: 3rem;
margin-bottom: 1rem;
}
.displayTheme .comp_top .comp_body .text_area .info {
font-size: 1.6rem;
}
.displayTheme .comp_top .comp_body .text_area > * {
flex: 1;
@@ -2116,6 +2126,40 @@
height: 3rem;
}
}
.displayTheme .comp_md.video_wrap {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
padding-top: 56.25%;
z-index: 4;
background: #000;
opacity: 1;
transition: all 0.3s ease;
}
.displayTheme .comp_md.video_wrap video {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
max-width: 160rem;
height: 100%;
max-height: 60rem;
}
.displayTheme .comp_md.video_wrap .btn-close {
position: absolute;
top: 2rem;
right: 2rem;
width: 6rem;
height: 6rem;
background: url(../images/kia/pdp/display_theme/btn_video_close.png) no-repeat center/contain;
cursor: pointer;
text-indent: -9999em;
}
.displayTheme.type2 .comp_bottom {
background-color: transparent;
}
@@ -2145,6 +2189,10 @@
color: #fff;
text-transform: uppercase;
}
.displayTheme .dtlImgs {
position: relative;
padding-top: 7.2rem;
}
.displayTheme .dtlImgs .item {
transition: opacity 0.2s;
}
@@ -2170,7 +2218,7 @@
.displayTheme + .comp_1x_b_v_s_b {
position: relative;
z-index: 2;
margin-top: 9rem;
margin-top: 0;
}
@media (max-width: 768px) {
.displayTheme + .comp_1x_b_v_s_b {
@@ -2205,6 +2253,19 @@
right: -65px;
transform: rotate(180deg);
}
.displayThemeDtl .swiper-pagination {
top: 46.4rem;
}
.displayThemeDtl .swiper-pagination .swiper-pagination-bullet {
opacity: 1;
width: 5.6rem;
height: 0.4rem;
border-radius: 0;
background-color: #E9E9E9;
}
.displayThemeDtl .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
background-color: #000;
}
.inCarGame .visualBg {
position: absolute;
@@ -2583,4 +2644,86 @@
text-indent: -9999em;
cursor: pointer;
}
.theme-story {
display: flex;
align-items: center;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
position: absolute;
top: 1.4rem;
left: 0;
width: 100%;
max-width: 120rem;
margin: 0 auto;
}
@media (max-width: 1025px) {
.theme-story {
overflow-x: auto;
padding: 0 2rem;
}
}
.theme-story .tooltip {
display: none;
}
.theme-story .btn-dtthumb {
position: relative;
}
.theme-story .dtthumb {
display: flex;
align-items: center;
width: 15.5rem;
height: 4.4rem;
padding: 0 0 0 0.8rem;
font-size: 1.2rem;
color: #fff;
border: 1px solid #fff;
border-radius: 2.2rem;
background-color: rgba(236, 221, 193, 0.5);
text-align: left;
cursor: pointer;
}
.theme-story .dtthumb img {
display: block;
width: 3rem;
height: 3rem;
margin-right: 0.8rem;
border-radius: 50%;
}
.theme-story .btn-remove {
position: absolute;
top: 50%;
right: 0.6rem;
width: 2.4rem;
height: 2.4rem;
margin-top: -1.2rem;
background: url("../images/kia/pdp/display_theme/ico_close2.png") no-repeat center/1rem auto;
text-indent: -9999em;
cursor: pointer;
}
.displayTheme .btn-intro {
display: flex;
align-items: center;
position: absolute;
top: 5rem;
right: 3rem;
z-index: 3;
font-size: 1.4rem;
font-weight: 600;
color: #000;
cursor: pointer;
}
.displayTheme .btn-intro:before {
content: "";
display: block;
width: 2.8rem;
height: 2.8rem;
margin-right: 0.5rem;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
border-radius: 50%;
background: #fff url("../images/kia/pdp/display_theme/ico_media.png") no-repeat center/1.6rem auto;
text-indent: -9999em;
cursor: pointer;
}
/*# sourceMappingURL=pdp_detail.css.map */