gnb 원뎁스

This commit is contained in:
2025-11-23 23:23:25 +09:00
parent cfb9b1c4d4
commit 9f67ce0682
41 changed files with 7909 additions and 6710 deletions

View File

@@ -36,22 +36,22 @@
.mainContentsWrap {
width: 100%;
margin: 0 auto;
margin-top: 59rem;
margin-top: 68rem;
z-index: 1;
}
@media (min-width: 768px) {
.mainContentsWrap {
margin-top: 59rem;
margin-top: 65rem;
}
}
@media (min-width: 1025px) {
.mainContentsWrap {
margin-top: 64rem;
margin-top: 72rem;
}
}
@media (min-width: 1240px) {
.mainContentsWrap {
margin-top: 76.8rem;
margin-top: 84.8rem;
}
}
@@ -143,7 +143,7 @@
height: 35rem;
overflow: hidden;
margin: 0 auto;
border: 1px solid #DEDEDE;
border: 1px solid #dedede;
border-radius: 0.6rem;
}
@media (max-width: 1024px) {
@@ -236,7 +236,7 @@
display: inline-block;
height: 2.5rem;
padding: 0.6rem 0.8rem 0.5rem;
border: 1px solid #9EA1A2;
border: 1px solid #9ea1a2;
font-size: 1.3rem;
font-weight: 400;
color: #000;
@@ -255,14 +255,14 @@
}
}
.mainProductItem .item .infoArea .infoTop .tag span.available {
background-color: #5D7D2B;
background-color: #5d7d2b;
color: #fff;
border-color: #5D7D2B;
border-color: #5d7d2b;
}
.mainProductItem .item .infoArea .infoTop .tag span.promotion {
background-color: #F3C300;
background-color: #f3c300;
color: #000;
border-color: #F3C300;
border-color: #f3c300;
}
.mainProductItem .item .infoArea .infoTop h2 {
width: 100%;
@@ -278,7 +278,7 @@
}
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoTop h2 {
color: #FFFFFF;
color: #ffffff;
font-size: 3rem;
}
}
@@ -332,7 +332,7 @@
min-width: 16rem;
height: 9.2rem;
padding: 1.6rem;
background-color: #F2F2F2;
background-color: #f2f2f2;
border-radius: 0.6rem;
}
@media (max-width: 1024px) {
@@ -396,7 +396,7 @@
display: block;
margin: 0.6rem 0 0;
font-size: 1.4rem;
color: #9EA1A2;
color: #9ea1a2;
text-align: left;
}
@media (max-width: 1024px) {
@@ -404,7 +404,7 @@
width: 100%;
margin: 0 0 0;
font-size: 0.9rem;
color: #9EA1A2;
color: #9ea1a2;
text-align: right;
}
}
@@ -422,7 +422,7 @@
}
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .dc {
font-size: 1.1rem;
color: #EA0029;
color: #ea0029;
}
@media (min-width: 1025px) {
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .dc {
@@ -589,7 +589,7 @@
.mainTopKey {
width: 100%;
position: absolute;
top: 0;
top: 10.6rem;
left: 50%;
transform: translate(-50%, 0);
}
@@ -598,6 +598,11 @@
max-width: 192rem;
}
}
@media (min-width: 768px) {
.mainTopKey {
top: 8rem;
}
}
.mainTopKey .mainSwiper {
max-width: 192rem;
width: 100%;
@@ -634,7 +639,7 @@
z-index: 2;
}
.mainTopKey .mainSwiper ul li {
displaY: flex;
display: flex;
align-items: center;
height: 59rem;
background-size: cover;
@@ -688,7 +693,7 @@
}
.mainTopKey .mainSwiper ul li .mainText p strong,
.mainTopKey .mainSwiper ul li .mainText p span {
displaY: block;
display: block;
width: 100%;
color: #fff;
line-height: 1.1;
@@ -874,9 +879,9 @@
}
}
.mainTopKey .mycarInfo .mycarInfoInner .mainCarNum .carlist span {
color: #F3C300;
color: #f3c300;
font-weight: 400;
displaY: flex;
display: flex;
width: auto;
min-width: 2.2rem;
}
@@ -899,15 +904,15 @@
}
.mainTopKey .mycarInfo .mycarInfoInner .mainCarNum .carlist span + span::before {
content: "";
displaY: block;
display: block;
width: 1px;
height: 1.4rem;
background-color: #DEDEDE;
background-color: #dedede;
margin-left: 1rem;
margin-right: 1rem;
}
.mainTopKey .mycarInfo .mycarInfoInner .mainCarNum .carlist .carItem {
displaY: flex;
display: flex;
height: 5rem;
font-size: 1.4rem;
align-items: center;
@@ -918,7 +923,7 @@
content: "";
width: 2.5rem;
height: 0.8rem;
displaY: block;
display: block;
background: url("/kr/assets/images/common/icon-wtbarrow.svg") center right no-repeat;
background-size: 1.2rem;
}
@@ -970,7 +975,7 @@
.mainTopKey .mycarInfo .mycarInfoInner .mainCarNum .carlist .carlistItem .boxBullet {
width: 1.4rem;
height: 1rem;
displaY: block;
display: block;
position: absolute;
top: -0.9rem;
left: 73%;
@@ -989,7 +994,7 @@
display: block;
padding: 2rem;
background-color: #fff;
border: 1px solid #DEDEDE;
border: 1px solid #dedede;
}
.mainTopKey .mycarInfo .mycarInfoInner .mainCarNum .carlist .carlistItem ul li a {
display: flex;
@@ -1000,9 +1005,9 @@
color: #000;
}
.mainTopKey .mycarInfo .mycarInfoInner .mainCarNum .carlist .carlistItem ul li a span {
color: #9EA1A2;
color: #9ea1a2;
font-weight: 400;
displaY: flex;
display: flex;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
@@ -1062,7 +1067,8 @@
display: block;
}
}
.mainProductList .mainContensTitle h1, .mainProductList .mainContensTitle p {
.mainProductList .mainContensTitle h1,
.mainProductList .mainContensTitle p {
text-align: center;
}
.mainProductList .mainContensTitle h1 {
@@ -1227,15 +1233,17 @@
margin-top: 3rem;
}
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl {
displaY: flex;
display: flex;
text-align: left;
}
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dt, .mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dd {
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dt,
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dd {
color: #fff;
font-size: 1.4rem;
}
@media (min-width: 1025px) {
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dt, .mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dd {
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dt,
.mainProductList .mainProductInner ul li a .contentInfo .listOtionPrice dl dd {
font-size: 1.6rem;
}
}
@@ -1282,8 +1290,9 @@
z-index: 1;
background-size: cover;
}
.mainProductList .mainProductInner ul li a:hover .descript, .mainProductList .mainProductInner ul li a:hover .listImgBtn {
displaY: block;
.mainProductList .mainProductInner ul li a:hover .descript,
.mainProductList .mainProductInner ul li a:hover .listImgBtn {
display: block;
-webkit-animation: fadein 1s;
animation: fadein 1s;
}
@@ -1329,7 +1338,7 @@
}
}
.mainSevice .left span {
color: #05141F;
color: #05141f;
font-size: 1.6rem;
}
.mainSevice .left h2 {
@@ -1362,7 +1371,7 @@
height: 14rem;
padding: 3rem;
border-radius: 0.6rem;
border: 1px solid #DEDEDE;
border: 1px solid #dedede;
color: #000000;
}
@media (min-width: 768px) {
@@ -1376,23 +1385,26 @@
}
}
.mainSevice .right a:hover {
border: 1px solid #05141F;
border: 1px solid #05141f;
}
.mainSevice .right a .faq, .mainSevice .right a .cs {
.mainSevice .right a .faq,
.mainSevice .right a .cs {
display: flex;
height: 100%;
flex-direction: column;
justify-content: space-between;
}
.mainSevice .right a .faq span, .mainSevice .right a .cs span {
.mainSevice .right a .faq span,
.mainSevice .right a .cs span {
position: relative;
displaY: block;
display: block;
}
.mainSevice .right a .faq span::after, .mainSevice .right a .cs span::after {
.mainSevice .right a .faq span::after,
.mainSevice .right a .cs span::after {
content: "";
position: absolute;
right: 0;
displaY: inline-block;
display: inline-block;
width: 0.8rem;
height: 1.6rem;
background-size: contain;
@@ -1400,7 +1412,8 @@
background-position: center right;
background-image: url(/kr/assets/images/common/icon-bgo.svg);
}
.mainSevice .right a .faq::before, .mainSevice .right a .cs::before {
.mainSevice .right a .faq::before,
.mainSevice .right a .cs::before {
content: "";
display: block;
width: 4.5rem;
@@ -1454,10 +1467,10 @@
justify-content: center;
padding: 0.6rem 0.8rem 0.5rem;
margin: 0 0.4rem 0 0.6rem;
border: 1px solid #9EA1A2;
border: 1px solid #9ea1a2;
font-size: 1.3rem;
font-weight: 400;
color: #9EA1A2;
color: #9ea1a2;
line-height: 1;
}
@media (max-width: 768px) {
@@ -1465,17 +1478,17 @@
display: inline-flex;
margin-left: 0;
font-size: 1.1rem;
color: #FFFFFF;
border: 1px solid #FFFFFF;
color: #ffffff;
border: 1px solid #ffffff;
}
}
.specNoti .tag.available {
background-color: #5D7D2B;
background-color: #5d7d2b;
color: #fff;
border: 0;
}
.specNoti .tag.promotion {
background-color: #F3C300;
background-color: #f3c300;
color: #000;
border: 0;
}