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

UIUX수정

Browse Source
This commit is contained in:
NEW_GIL_HOME\hyeon
2025-05-06 16:13:47 +09:00
parent 2b9d51aea5
commit 8c1e29d7c1
21 changed files with 1809 additions and 947 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
assets/css/common.css
View File

@@ -642,12 +642,58 @@ video::-webkit-media-controls {
width: 100%;
z-index: 101;
overflow-x: clip;
background-color: transparent;
transition: background-color 0.2s ease-in-out;
}
@media (max-width: 1240px) {
.hederWarp_n {
padding: 0 2rem;
}
}
.hederWarp_n.menu-open {
background-color: #fff;
}
.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;
}
.hederWarp_n.menu-open .headerInner .func .carlist .carItem::after {
content: "";
display: block;
width: 2.5rem;
height: 0.8rem;
margin-top: -0.4rem;
background: url("../images/common/icon-tbarrow.svg") center right no-repeat;
background-size: 1.2rem;
}
.hederWarp_n.menu-open .headerInner .func .carlist.on a::after {
transform: rotate(-180deg);
background-position-x: left;
}
.hederWarp_n.menu-open .headerInner .func .userLogin > a {
border: 1px solid rgba(5, 20, 31, 0.3);
color: #05141f;
transition: 0.3s;
}
.hederWarp_n.menu-open .headerInner .func .userLogin > a:hover {
border: 1px solid rgb(5, 20, 31);
}
@media (max-width: 1024px) {
.hederWarp_n.menu-open .headerInner .func .moblieMenu .burgur .top-line {
background-color: #000;
}
.hederWarp_n.menu-open .headerInner .func .moblieMenu .burgur .bot-line {
background-color: #000;
}
}
.hederWarp_n .headerInner {
display: flex;
justify-content: space-between;
@@ -849,7 +895,7 @@ video::-webkit-media-controls {
.hederWarp_n .headerInner .gnb .menuWarp .mobileCarlist .carlistItem {
position: absolute;
display: none;
z-index: 1;
z-index: 10;
width: 100%;
top: 5.6rem;
border-bottom: 1px solid #dedede;
@@ -892,6 +938,10 @@ video::-webkit-media-controls {
margin-top: 1rem;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .menuBg {
transition: all 0.2s ease-in-out;
background-color: #fff;
}
@media (min-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .menuBg {
display: block;
@@ -900,7 +950,8 @@ video::-webkit-media-controls {
left: 0;
right: 0;
z-index: 1;
background-color: #fff;
height: 0;
opacity: 0;
border-top: 1px solid #DEDEDE;
}
}
@@ -910,12 +961,12 @@ video::-webkit-media-controls {
}
@media (min-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li .menuDepth2Wrap.info {
display: block !important;
display: block;
width: 27rem;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li .menuDepth2Wrap h3 {
margin-bottom: 3.6rem;
margin-bottom: 2.8rem;
}
@media (min-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu.open li:nth-child(1) .menuDepth2Wrap {
@@ -943,6 +994,9 @@ video::-webkit-media-controls {
display: block;
margin-left: 0;
margin-top: 2rem;
overflow: hidden;
overflow-y: auto;
height: 63vh;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap {
@@ -969,7 +1023,7 @@ video::-webkit-media-controls {
position: relative;
justify-content: flex-start;
height: initial;
padding: 1rem 0;
padding: 1.3rem 0;
color: #000000;
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1.lower::after {
@@ -982,6 +1036,9 @@ video::-webkit-media-controls {
background: url("../images/common/icon-arrow_right.svg") center center no-repeat;
transition: transform 0.2s ease;
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1.lower.on {
margin-bottom: 0.3rem;
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1.lower.on::after {
content: "";
position: absolute;
@@ -991,16 +1048,19 @@ video::-webkit-media-controls {
transform: rotate(270deg);
background: url("../images/common/icon-arrow_right.svg") center center no-repeat;
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth1.lower.on ~ .menuDepth2Wrap {
margin-bottom: 1rem;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap {
position: absolute;
display: none;
display: block;
width: 100%;
min-width: 11rem;
top: 7.9rem;
left: 50%;
transform: translate(-50%, 0);
padding: 4rem 2rem 6rem;
padding: 4rem 2rem 5rem;
}
@media (max-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap {
@@ -1050,7 +1110,7 @@ video::-webkit-media-controls {
font-size: 1.4rem;
font-weight: 400;
color: #9ea1a2;
padding: 0.9rem 0;
padding: 0.8rem 0;
}
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap ul .menuDepth2 a.active {
color: #05141f;
@@ -1060,7 +1120,7 @@ video::-webkit-media-controls {
}
@media (max-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .menu .menuDepth1Wrap .menuDepth2Wrap ul .menuDepth2 a {
padding: 1rem 0;
padding: 0.6rem 0;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu {
@@ -1068,18 +1128,22 @@ video::-webkit-media-controls {
}
@media (max-width: 1024px) {
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu {
display: block;
padding: 0 2rem;
margin-top: 3rem;
display: flex;
position: absolute;
bottom: 3.2rem;
left: 0;
right: 0;
}
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu a {
display: block;
width: 100%;
padding: 1rem 0;
font-size: 1.6rem;
padding: 0 2rem;
font-size: 1.4rem;
font-weight: 600;
color: #676767;
}
.hederWarp_n .headerInner .gnb .menuWarp .mobileSubMenu a + a {
border-left: 1px solid #dedede;
}
}
.hederWarp_n .headerInner .gnb .menuWarp .loginBtn {
display: none;

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

File diff suppressed because one or more lines are too long

148
assets/css/common.scss
View File

@@ -6,7 +6,7 @@ pre {
font-family: "KiaSignature";
}
/*비디오 콘트롤러 없앰*/
/*비디오 콘트롤러 없앰*/
video::-webkit-media-controls {
display: none !important;
}
@@ -723,6 +723,8 @@ video::-webkit-media-controls {
z-index: 101;
overflow-x: clip;
background-color: transparent;
transition: background-color 0.2s ease-in-out;
@media (max-width: 1240px) {
padding: 0 2rem;
@@ -732,6 +734,87 @@ video::-webkit-media-controls {
// height: 5.6rem;
}
&.menu-open {
background-color: #fff;
.headerInner {
.gnb {
.logoWrap {
a {
color: #05141f;
}
}
.menuWarp {
.menu {
.menuDepth1Wrap {
.menuDepth1 {
color: #05141f;
}
}
}
.menuBg {
opacity: 1;
}
}
}
.func {
.carlist {
.carItem {
span {
color: #05141f;
}
&::after {
content: "";
display: block;
width: 2.5rem;
height: 0.8rem;
margin-top: -0.4rem;
background: url("../images/common/icon-tbarrow.svg") center right no-repeat;
background-size: 1.2rem;
}
}
&.on {
a {
&::after {
transform: rotate(-180deg);
background-position-x: left;
}
}
}
}
.userLogin {
>a {
border: 1px solid rgba(5, 20, 31, 0.3);
color: #05141f;
transition: 0.3s;
&:hover {
border: 1px solid rgba(5, 20, 31, 1);
}
}
}
.moblieMenu {
@media (max-width: 1024px) {
.burgur .top-line {
background-color: #000;
}
.burgur .bot-line {
background-color: #000;
}
}
}
}
}
}
.headerInner {
display: flex;
justify-content: space-between;
@@ -751,6 +834,7 @@ video::-webkit-media-controls {
.logoWrap {
z-index: 0;
@media (min-width: 1024px) {
display: flex;
align-items: center;
@@ -949,7 +1033,7 @@ video::-webkit-media-controls {
.carlistItem {
position: absolute;
display: none;
z-index: 1;
z-index: 10;
width: 100%;
top: 5.6rem;
border-bottom: 1px solid #dedede;
@@ -1004,14 +1088,17 @@ video::-webkit-media-controls {
}
.menuBg {
transition: all 0.2s ease-in-out;
background-color: #fff;
@media (min-width: 1024px) {
display: block;
position: absolute;
top:8rem;
top: 8rem;
left: 0;
right: 0;
z-index: 1;
background-color: #fff;
height: 0;
opacity: 0;
border-top: 1px solid #DEDEDE;
}
}
@@ -1019,18 +1106,18 @@ video::-webkit-media-controls {
.menu {
display: flex;
margin-left: 4.5rem;
&.open {
li {
.menuDepth2Wrap {
&.info {
@media (min-width: 1024px) {
display: block !important;
display: block;
width: 27rem;
}
}
h3 {
margin-bottom: 3.6rem;
margin-bottom: 2.8rem;
}
}
}
@@ -1042,6 +1129,7 @@ video::-webkit-media-controls {
}
}
}
li:nth-child(2) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
@@ -1049,6 +1137,7 @@ video::-webkit-media-controls {
}
}
}
li:nth-child(3) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
@@ -1056,6 +1145,7 @@ video::-webkit-media-controls {
}
}
}
li:nth-child(4) {
.menuDepth2Wrap {
@media (min-width: 1024px) {
@@ -1070,6 +1160,9 @@ video::-webkit-media-controls {
display: block;
margin-left: 0;
margin-top: 2rem;
overflow: hidden;
overflow-y: auto;
height: 63vh;
}
.menuDepth1Wrap {
@@ -1094,7 +1187,7 @@ video::-webkit-media-controls {
position: relative;
justify-content: flex-start;
height: initial;
padding: 1rem 0;
padding: 1.3rem 0;
color: #000000;
&.lower {
@@ -1110,6 +1203,7 @@ video::-webkit-media-controls {
}
&.on {
margin-bottom:.3rem;
&::after {
content: "";
position: absolute;
@@ -1119,6 +1213,9 @@ video::-webkit-media-controls {
transform: rotate(270deg);
background: url("../images/common/icon-arrow_right.svg") center center no-repeat;
}
& ~ .menuDepth2Wrap {
margin-bottom:1rem;
}
}
}
}
@@ -1126,13 +1223,16 @@ video::-webkit-media-controls {
.menuDepth2Wrap {
position: absolute;
display: none;
display: block;
width: 100%;
min-width: 11rem;
top: 7.9rem;
left: 50%;
transform: translate(-50%, 0);
padding: 4rem 2rem 6rem;
padding: 4rem 2rem 5rem;
// opacity: 0;
// transition: opacity 0.2s ease-in .1s;
// transition-delay: 2s;
// background-color: #fff;
// border: 1px solid #dedede;
@@ -1146,7 +1246,10 @@ video::-webkit-media-controls {
.boxBullet {
display: none !important;
}
h3 {display: none;}
h3 {
display: none;
}
}
&.info {
@@ -1185,7 +1288,7 @@ video::-webkit-media-controls {
font-size: 1.4rem;
font-weight: 400;
color: #9ea1a2;
padding: .9rem 0;
padding: .8rem 0;
&.active {
color: #05141f;
@@ -1196,7 +1299,7 @@ video::-webkit-media-controls {
}
@media (max-width: 1024px) {
padding: 1rem 0;
padding: .6rem 0;
}
}
}
@@ -1209,17 +1312,24 @@ video::-webkit-media-controls {
display: none;
@media (max-width: 1024px) {
display: block;
padding: 0 2rem;
margin-top: 3rem;
display: flex;
position: absolute;
bottom:3.2rem;
left: 0;
right: 0;
// padding: 0 2rem;
// margin-top: 3rem;
a {
display: block;
width: 100%;
padding: 1rem 0;
font-size: 1.6rem;
// width: 100%;
padding: 0 2rem;
font-size: 1.4rem;
font-weight: 600;
color: #676767;
&+a {
border-left: 1px solid #dedede;
}
}
}
}

12
assets/css/kia.css
View File

@@ -194,12 +194,14 @@ html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl {
flex-wrap: nowrap;
}
}
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt, html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt,
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
font-size: 1.4rem;
width: 100%;
}
@media (min-width: 768px) {
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt, html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt,
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
font-size: 1.6rem;
width: -webkit-fit-content;
width: -moz-fit-content;
@@ -302,7 +304,8 @@ html .mainBanner .mabannerInner {
html .mainBanner .mabannerInner dl {
width: 100%;
}
html .mainBanner .mabannerInner dl dt, html .mainBanner .mabannerInner dl dd {
html .mainBanner .mabannerInner dl dt,
html .mainBanner .mabannerInner dl dd {
width: 100%;
color: #fff;
}
@@ -392,6 +395,9 @@ html .hederWarp_n .headerInner .gnb .logoWrap a .logoImg {
width: 22.8rem;
}
}
html .hederWarp_n.menu-open .headerInner .gnb .logoWrap a .logoImg {
background-image: url(../../images/kia/kia-blogo-n.svg);
}
html .mainSwiper ul li .mainText p strong + span {
margin-top: 2.5rem;
}

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

File diff suppressed because one or more lines are too long

12
assets/css/kia/kia.css
View File

@@ -194,12 +194,14 @@ html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl {
flex-wrap: nowrap;
}
}
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt, html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt,
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
font-size: 1.4rem;
width: 100%;
}
@media (min-width: 768px) {
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt, html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dt,
html .mainNotice .noticInnerWarp .noticeInner .mainNiticeList ul li dl dd {
font-size: 1.6rem;
width: -webkit-fit-content;
width: -moz-fit-content;
@@ -302,7 +304,8 @@ html .mainBanner .mabannerInner {
html .mainBanner .mabannerInner dl {
width: 100%;
}
html .mainBanner .mabannerInner dl dt, html .mainBanner .mabannerInner dl dd {
html .mainBanner .mabannerInner dl dt,
html .mainBanner .mabannerInner dl dd {
width: 100%;
color: #fff;
}
@@ -392,6 +395,9 @@ html .hederWarp_n .headerInner .gnb .logoWrap a .logoImg {
width: 22.8rem;
}
}
html .hederWarp_n.menu-open .headerInner .gnb .logoWrap a .logoImg {
background-image: url(../../images/kia/kia-blogo-n.svg);
}
html .mainSwiper ul li .mainText p strong + span {
margin-top: 2.5rem;
}

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

File diff suppressed because one or more lines are too long

1748
assets/css/kia/kia.scss
View File

File diff suppressed because it is too large Load Diff

61
assets/css/kia/kiamain.scss
View File

@@ -46,7 +46,7 @@
display: none;
}
.title {
font-size: 5.2rem;
font-size: 5rem;
font-weight: 600;
color: #000000;
line-height: 5.8rem;
@@ -155,7 +155,7 @@
position: relative;
display: flex;
width: 100%;
padding: 3rem;
padding: 3rem 2rem 2rem;
background-size: cover;
background-position: center;
&::before {
@@ -190,7 +190,8 @@
}
span {
display: inline-block;
padding: 0.5rem 0.8rem;
height: 2.5rem;
padding: 0.6rem 0.8rem 0.5rem;
border: 1px solid #9EA1A2;
font-size: 1.3rem;
font-weight: 400;
@@ -200,6 +201,8 @@
margin-left: 0.3rem;
}
@media(max-width: 1024px){
height: 2.3rem;
padding: 0.5rem 0.6rem;
font-size: 1.1rem;
color: #FFFFFF;
border: 1px solid #FFFFFF;
@@ -207,16 +210,12 @@
&.available {
background-color: #5D7D2B;
color: #fff;
@media(max-width: 1024px){
border: 0;
}
border-color: #5D7D2B;
}
&.promotion {
background-color: #F3C300;
color: #000;
@media(max-width: 1024px){
border: 0;
}
border-color: #F3C300;
}
}
}
@@ -276,6 +275,7 @@
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
min-width: 16rem;
height: 9.2rem;
padding:1.6rem;
background-color: #F2F2F2;
@@ -286,7 +286,7 @@
align-items: center;
width: 100%;
height: 4.8rem;
padding: 1rem 1.6rem;
padding: 0 1.6rem;
&:not(:first-child){
margin-top: 1rem;
}
@@ -298,8 +298,9 @@
color: #676767;
@media(max-width: 1024px){
position: relative;
font-size: 1.4rem;
font-size: 1.1rem;
color: #000;
font-weight: 400;
margin-left: 0;
padding-left: 0;
// &::before {
@@ -331,6 +332,7 @@
.price {
@media(max-width: 1024px){
display: flex;
align-items: center;
em {
order: 2;
}
@@ -349,7 +351,8 @@
text-align: left;
@media(max-width: 1024px){
width: 100%;
margin:.2rem 0 0;
margin:0 0 0;
font-size: 0.9rem;
color: #9EA1A2;
text-align: right;
}
@@ -357,12 +360,18 @@
font-weight: 600;
}
i {
@include desktopMin{
font-size: 1.2rem;
}
font-weight: 400;
text-decoration:line-through;
}
}
.dc {
font-size: 1.4rem;
font-size: 1.1rem;
@include desktopMin{
font-size: 1.4rem;
}
color: #EA0029;
}
}
@@ -1301,20 +1310,24 @@
.specNoti {
display: flex;
align-items: center;
max-width: 120rem;
height: 6.5rem;
padding:0 2.4rem;
margin: 6rem auto -3rem;
display: block;
padding:1.2rem;
margin: -2rem 2rem 2rem;
font-size: 1.4rem;
line-height: 2.2rem;
background-color: #f1f1f1;
border-radius: .6rem;;
@include maxtablet{
display: block;
padding:1.2rem;
@include tablet {
display: flex;
align-items: center;
height: 6.5rem;
max-width: 120rem;
padding:0 2.4rem;
margin: -2rem 2rem 2rem;
font-size: 1.4rem;
line-height: 2.2rem;
}
@include desktopMin{
margin: 6rem auto -3rem;
}
.tag {
display: flex;

71
assets/css/kiamain.css
View File

@@ -71,7 +71,7 @@
}
}
.mainTopCopy .title {
font-size: 5.2rem;
font-size: 5rem;
font-weight: 600;
color: #000000;
line-height: 5.8rem;
@@ -192,7 +192,7 @@
position: relative;
display: flex;
width: 100%;
padding: 3rem;
padding: 3rem 2rem 2rem;
background-size: cover;
background-position: center;
}
@@ -234,7 +234,8 @@
}
.mainProductItem .item .infoArea .infoTop .tag span {
display: inline-block;
padding: 0.5rem 0.8rem;
height: 2.5rem;
padding: 0.6rem 0.8rem 0.5rem;
border: 1px solid #9EA1A2;
font-size: 1.3rem;
font-weight: 400;
@@ -246,6 +247,8 @@
}
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoTop .tag span {
height: 2.3rem;
padding: 0.5rem 0.6rem;
font-size: 1.1rem;
color: #FFFFFF;
border: 1px solid #FFFFFF;
@@ -254,20 +257,12 @@
.mainProductItem .item .infoArea .infoTop .tag span.available {
background-color: #5D7D2B;
color: #fff;
}
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoTop .tag span.available {
border: 0;
}
border-color: #5D7D2B;
}
.mainProductItem .item .infoArea .infoTop .tag span.promotion {
background-color: #F3C300;
color: #000;
}
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoTop .tag span.promotion {
border: 0;
}
border-color: #F3C300;
}
.mainProductItem .item .infoArea .infoTop h2 {
width: 100%;
@@ -334,6 +329,7 @@
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
min-width: 16rem;
height: 9.2rem;
padding: 1.6rem;
background-color: #F2F2F2;
@@ -346,7 +342,7 @@
align-items: center;
width: 100%;
height: 4.8rem;
padding: 1rem 1.6rem;
padding: 0 1.6rem;
}
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl:not(:first-child) {
margin-top: 1rem;
@@ -360,8 +356,9 @@
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dt {
position: relative;
font-size: 1.4rem;
font-size: 1.1rem;
color: #000;
font-weight: 400;
margin-left: 0;
padding-left: 0;
}
@@ -385,6 +382,7 @@
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .price {
display: flex;
align-items: center;
}
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .price em {
order: 2;
@@ -404,7 +402,8 @@
@media (max-width: 1024px) {
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .discount {
width: 100%;
margin: 0.2rem 0 0;
margin: 0 0 0;
font-size: 0.9rem;
color: #9EA1A2;
text-align: right;
}
@@ -416,10 +415,20 @@
font-weight: 400;
text-decoration: line-through;
}
@media (min-width: 1025px) {
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .discount i {
font-size: 1.2rem;
}
}
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .dc {
font-size: 1.4rem;
font-size: 1.1rem;
color: #EA0029;
}
@media (min-width: 1025px) {
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl dd .dc {
font-size: 1.4rem;
}
}
.mainProductItem .item .infoArea .infoBottom .listOtionPrice dl:not(:first-child) {
margin-left: 0.8rem;
}
@@ -1416,21 +1425,27 @@
}
.specNoti {
display: flex;
align-items: center;
max-width: 120rem;
height: 6.5rem;
padding: 0 2.4rem;
margin: 6rem auto -3rem;
display: block;
padding: 1.2rem;
margin: -2rem 2rem 2rem;
font-size: 1.4rem;
line-height: 2.2rem;
background-color: #f1f1f1;
border-radius: 0.6rem;
}
@media (max-width: 768px) {
@media (min-width: 768px) {
.specNoti {
display: block;
padding: 1.2rem;
display: flex;
align-items: center;
height: 6.5rem;
max-width: 120rem;
padding: 0 2.4rem;
margin: -2rem 2rem 2rem;
font-size: 1.4rem;
line-height: 2.2rem;
}
}
@media (min-width: 1025px) {
.specNoti {
margin: 6rem auto -3rem;
}
}
.specNoti .tag {

2
assets/css/kiamain.css.map
View File

File diff suppressed because one or more lines are too long

8
assets/css/product.css
View File

@@ -752,6 +752,12 @@
border-radius: 0.6rem;
border: 1px solid #DEDEDE;
}
@media (max-width: 1024px) {
.contentWarp .productView .productRight .optionWarp .priceOption .priceList .radioBtn label {
height: 8rem;
padding: 2rem;
}
}
.contentWarp .productView .productRight .optionWarp .priceOption .priceList .radioBtn label span {
font-size: 1.4rem;
font-weight: 400;
@@ -799,7 +805,7 @@
text-decoration: line-through;
}
.contentWarp .productView .productRight .optionWarp .priceOption .priceList .radioBtn label .dc {
margin-right: 0.4rem;
margin-right: 0.8rem;
color: #EA0029;
}
.contentWarp .productView .productRight .optionWarp .priceOption .priceList .radioBtn input[type=radio] {

2
assets/css/product.css.map
View File

File diff suppressed because one or more lines are too long

6
assets/css/product.scss
View File

@@ -691,6 +691,10 @@
position: relative;
border-radius: 0.6rem;
border:1px solid #DEDEDE;
@media(max-width: 1024px){
height:8rem;
padding: 2rem;
}
span{
font-size:1.4rem;
font-weight: 400;
@@ -734,7 +738,7 @@
}
}
.dc {
margin-right: .4rem;
margin-right: .8rem;
color: #EA0029;
}
}

45
assets/js/common.js
View File

@@ -121,36 +121,37 @@ $(document).ready(function () {
body.className = "desktop";
if (targetSize != "desktop") {
let isEntered = false;
menu_init();
$(document).on("mouseenter", ".desktop .menu, .desktop .logoWrap", function () {
if (!$(".menuBg").length) {
$(".desktop .menu").addClass("open");
$(".menuDepth2Wrap").css("display", "block");
if (isEntered) return;
isEntered = true;
const menuDepth2WrapHeights = $(".desktop .menuDepth2Wrap")
.toArray()
.map((el) => Math.floor($(el).outerHeight()));
const menuDepth2WrapHeight = Math.max(...menuDepth2WrapHeights);
$(".desktop .menu").after(`<div class="menuBg" style="height:${menuDepth2WrapHeight}px"></div>`);
}
$(".menuDepth2Wrap").hide().stop(true).fadeIn(200);
$(".desktop .menu").addClass("open");
$(".desktop .hederWarp_n").addClass("menu-open");
const menuDepth2WrapHeights = $(".desktop .menuDepth2Wrap")
.toArray()
.map((el) => Math.floor($(el).outerHeight()));
const menuDepth2WrapHeight = Math.max(...menuDepth2WrapHeights);
$(".desktop .menuBg").css("height", menuDepth2WrapHeight);
});
$(document).on("mouseleave", ".desktop .menuWarp", function (e) {
if (!$(e.relatedTarget).hasClass("menuBg")) {
$(".desktop .menu").removeClass("open");
$(".menuDepth2Wrap").css("display", "none");
$(".menuBg").remove();
}
});
$(document).on("mouseleave", ".desktop .gnb, .desktop .menuWarp", function (e) {
const toElement = e.relatedTarget;
$(document).on("mouseleave", ".menuBg", function () {
// gnb, menuWarp, logoWrap, menu 내부로 이동한 경우는 무시
if ($(toElement).closest(".desktop .gnb, .desktop .menuWarp, .desktop .logoWrap, .desktop .menu").length > 0) {
return;
}
$(".menuDepth2Wrap").stop(true).hide();
$(".desktop .menu").removeClass("open");
$(".menuDepth2Wrap").css("display", "none");
$(".menuBg").remove();
});
$(document).on("click", ".menuDepth1Wrap > a", function () {
location.href = $(this).data("url");
$(".desktop .hederWarp_n").removeClass("menu-open");
$(".desktop .menuBg").css("height", "0");
isEntered = false;
});
}
targetSize = "desktop";