css 최신화

src/main/webapp/ux/mo/css/common_m.css

@@ -232,7 +232,7 @@ select,
 /* form style (hyangah_0223_수정중 - input[type="text"] padding 수정) */
 input,  textarea {font-size:1.2rem; font-family:'Noto Sans KR', 'LATO', sans-serif; color:#666666; vertical-align:middle;}
 select{font-size:1.2rem; font-family:'Noto Sans KR', 'LATO', sans-serif; color:#666666; vertical-align:middle;}
-input[type="text"], input[type="password"] {padding:0 1.5rem; border:0.1rem solid #dddddd;box-sizing: border-box;}
+input[type="text"], input[type="password"] {padding:0 1.5rem; border:0.1rem solid #dddddd;box-sizing: border-box; -webkit-appearance: none; -webkit-border-radius: 0;}
 input[type="text"]:focus, input[type="password"]:focus,
 input[type="text"].active, input[type="password"].active {border-color: #aaaaaa;} 
 input[type="text"]:disabled, input[type="password"]:disabled, input[type="select"]:disabled,
@@ -670,7 +670,7 @@ body.gnb_on {height: 100vh;overflow: hidden !important;}
 
 /* header, htop, btn_gnb, header.main, hmenu, bng, bnb */
 header {
-  position: fixed;left: 0;top: 0; width: 100%;z-index: 80;
+  position: fixed;left: 0;top: 0; width: 100%;z-index: 101;
   /*position: sticky;*/width: 100%;transition: top 0.3s;/* background-color: #fff; */ transform: translate3d(0,0,0);
 } /* 210526_ main.container 여백 때문에 sticky 속성 주석. */
 header::after{content: '';display: block;clear: both;}
@@ -852,7 +852,7 @@ header .hmenus .bnb ul > li > a{display: block; padding: 0.8rem 0; font-size: 1.
 /* gnb */
 body.header-show .app .gnb{top: 5.0rem;}
 .app .gnb {position: -webkit-sticky; position: sticky; top: 0; padding-right: 3.0rem; background-color: #fefefe; z-index: 9; /*background-color: #000; transition: top 0.3s;*/ width: 100%;}
-.app .gnb {background-color:#fefefe; position:relative; z-index:79;} /* layout_m 재확인 */
+.app .gnb {background-color:#fefefe; position:relative; z-index:100;} /* layout_m 재확인 */
 .app .gnb.expand{padding-right: 3.0rem;}
 
 .app .gnb .gnb-inner{position: relative; width: 100%; padding: 0.9rem 1.0rem; overflow-x: scroll;}
@@ -880,7 +880,7 @@ section.main, section.ev_list, section.dp_exhibition, section.dp_lookbook, secti
 section.main.scr, section.ev_list.scr, section.dp_exhibition.scr, section.dp_lookbook.scr, section.dp_outlets.scr, section.dp_submain.scr, section.dp_hotdeal.scr, section.br_main.scr, section.dp_best.scr, section.br_lookbook.scr {margin-top: 5.5rem;}
 
 /* .tabbar */
-.tabbar{-webkit-transform: translate(0, 8.0rem);-ms-transform: translate(0, 8.0rem);-moz-transform: translate(0, 8.0rem); transform: translate(0, 8.0rem);transition-duration: 0.25s; position: fixed;width: 100%;bottom: 0;background-color: #f8f8f8;z-index: 20; padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);}
+.tabbar{-webkit-transform: translate(0, 8.0rem);-ms-transform: translate(0, 8.0rem);-moz-transform: translate(0, 8.0rem); transform: translate(0, 8.0rem);transition-duration: 0.25s; position: fixed;width: 100%;bottom: 0;background-color: #f8f8f8;z-index: 100; padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);}
 .tabbar.fixed{-webkit-transform: translate(0, 0);-ms-transform: translate(0, 0);-moz-transform: translate(0, 0);transform: translate(0, 0);}
 .tabbar .tabbar-inner{display: -webkit-box;display: -moz-box;display: -webkit-flex;display: -ms-flexbox;display: flex; -webkit-box-pack: justify;-moz-box-pack: justify;-ms-flex-pack: justify;-webkit-justify-content: space-between;justify-content: space-between; padding: 0.6rem 2.0rem;}
 .tabbar .tabbar-inner [class*=btn-]{display: block;width: 4.2rem; height: 3.0666rem; font-size: 0;position: relative;background: url(/images/mo/ico_tabbar.png) no-repeat center;background-size: 18.0rem 2.16rem;padding: 0rem 1rem;}

src/main/webapp/ux/mo/css/layout_m.css

@@ -155,7 +155,7 @@
 .cs_contactUs_my .select,
 .cs_contactUs_my input[type="text"] {width:100%; font-weight:200; box-sizing:border-box; color:#222; font-size:1.2rem; font-weight:300;}	
 .cs_contactUs_my input[type="text"]::placeholder,
-.cs_contactUs_my .form_control {height:4.2rem; color:#222; font-size:1.4rem;}
+.cs_contactUs_my .form_control {height:4.2rem; color:#222; font-size:1.4rem; line-height: 4.5rem;}
 .cs_contactUs_my .input_label {line-height:4.2rem;}
 .cs_contactUs_my .contactus_cnt {color:#888}
 .cs_contactUs_my .select {height:4.2rem; font-size:1.2rem;}
@@ -399,7 +399,8 @@
 /* 슬라이드아이템*/
 .item_prod {display: inline-block;width: 100%;font-size: 0;vertical-align: top;color: rgb(31, 31, 31);position: relative;letter-spacing: -0.025em;}
 .item_prod .item_state {position: relative; padding:0; box-sizing: border-box;}
-.item_prod .item_state.soldout::before {content: 'SOLD OUT';position: absolute;top: 25%;left: 50%;transform: translate(-50%, 0%);width:100%;height: auto;font-size: 1.5rem;font-weight: 500;color: #fff;z-index: 30;text-align: center;}
+/* .item_prod .item_state.soldout::before {content: 'SOLD OUT';position: absolute;top: 25%;left: 50%;transform: translate(-50%, 0%);width:100%;height: auto;font-size: 1.5rem;font-weight: 500;color: #fff;z-index: 30;text-align: center;} */
+.item_state.soldout .itemPic:after {content: 'SOLD OUT';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width:100%;height: auto;font-size: 1.5rem;font-weight: 500;color: #fff;z-index: 30;text-align: center; opacity: 1; background: transparent;}
 .item_prod .item_state.soldout .itemPic:before {content:''; position: absolute; top: 50%; left: 50%;  background: rgba(0,0,0,.7); width: 100%; height: 100%; transform:translate(-50%, -50%); z-index: 20; text-align: center;}
 .item_prod .item_state.AD .itemPic:before {content:'AD'; position: absolute; bottom: 0.666rem; right: 0.666rem; font-size: 1rem; font-weight: 300; letter-spacing: -0.025em; color:#888888; width: auto; height: auto; line-height: 1rem; z-index: 21; text-align: right;}
 
@@ -418,7 +419,7 @@
 .item_prod .itemPic .pd_img {position: absolute;width: 100%;height: auto;top: 50%;left: 0;transform: translateY(-50%);}
 .item_prod .itemPic .pd_mov {position: absolute;width: 100%;height: 100%;top: 50%;left: 0;transform: translateY(-50%);z-index: 2;}
 .item_prod .itemBrand {display: inline-block; margin: 0 0.5rem 0.3rem; font-size: 1rem;font-weight: 300;color: rgb(137, 137, 137); text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:10rem;overflow:hidden;}
-.item_prod .itemComment{margin: 0.8rem 0.5rem 0.4rem;line-height: 1; height: 1.2rem; font-size: 1.1rem;font-weight: 300;color: #fd4802;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
+.item_prod .itemComment{margin: 0.8rem 0.5rem 0.4rem; height: 1.3rem; font-size: 1.1rem;font-weight: 300;color: #fd4802;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
 .item_prod .itemName {margin: 0 0.5rem 0.8rem; font-size: 1.1rem; font-weight:300; color: rgb(31, 31, 31); height: 3rem; max-height: 3rem; position: relative; overflow: hidden; white-space: normal; overflow-wrap: break-word; display: block; letter-spacing: -0.025rem;}
 /*.item_prod .itemName {display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}*/
 .item_prod .itemName .tit_option{font-weight:500;}
@@ -1686,6 +1687,7 @@
 .dp .dp_util li a.refresh{color:#888!important;}
 .dp .dp_util li a.refresh:after{content:''; position:relative; top:0.1rem;  margin-left:0.8rem; display:inline-block; width:1.1rem; height:1.1rem; background: url(/images/mo/icon_best_refresh.png) center center no-repeat; background-size:contain;}
 .dp .count_wrap {padding:2rem 0;}
+.dp .count_wrap.fixed {position: fixed; top: 5.5rem; left: 0; width: 100%; padding: 2rem; background: #fff; z-index: 100;}
 .dp .count_wrap:after{display:block; content:''; clear:both;}
 .dp .count_wrap div:nth-child(1) {float:left;}
 .dp .count_wrap div:nth-child(1) p {font-size:1.2rem; color:#888;}
@@ -1728,7 +1730,7 @@
 .dp .dp_outlets .outlets_visual .txtWrap.w {color: #fff;}
 .dp .dp_outlets .outlets_visual .txtWrap p {font-size: 3rem; font-weight: 500; line-height: 1.2; display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical; overflow:hidden;}
 .dp .dp_outlets .outlets_visual .txtWrap p.txt_xs {font-size: 1.4rem; margin-top: 1.6rem; font-weight: 300; -webkit-line-clamp: 1;}
-.dp .dp_outlets .dp_cate_list {margin:-1.2rem 0;}
+.dp .dp_outlets .dp_cate_list {margin:-1.2rem 0; border-top: 0.1rem solid #ddd;}
 .dp .dp_outlets .dp_cate_list:after {content:''; display: block; clear: both;}
 .dp .dp_outlets .dp_cate_list a {position:relative; float:left; width:50%; line-height:5rem; padding:0 3rem 0 2rem; font-size:1.3rem; font-weight: 500; color: #222; text-align: left; background: #fff url(/images/mo/ico_more_lg.png) no-repeat right 2rem center; border-bottom:0.1rem solid #ddd; box-sizing:border-box; }
 .dp .dp_outlets .dp_cate_list a:nth-child(2n){ border-left:0.1rem solid #ddd;}
@@ -1819,7 +1821,7 @@
 .dp_hotdeal .itemsGrp.rowtype .item_prod .shape:after{display:none;}
 .dp_hotdeal .itemsGrp.rowtype .item_prod .itemPic::after {background: #f5f5f5; opacity:1; z-index: 7;}
 .dp_hotdeal .itemsGrp.rowtype .item_prod .itemPic .pd_img {z-index: 8;}
-.dp_hotdeal .itemsGrp.rowtype .item_prod.sold_out .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size:1.4rem; color:#fff; font-weight:600; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height:23.4rem;; z-index: 99; text-align: center;}
+.dp_hotdeal .itemsGrp.rowtype .item_prod.sold_out .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size:1.4rem; color:#fff; font-weight:600; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height:23.4rem;; z-index: 98; text-align: center;}
 .dp_hotdeal .itemsGrp.rowtype .item_prod .shape{position:relative;}
 .dp_hotdeal .itemsGrp.rowtype .item_prod .itemBrand {margin:1.5rem 0 0.5rem;}
 .dp_hotdeal .itemsGrp.rowtype .item_prod .itemComment {position: relative; top:-6rem; margin:0;}
@@ -2581,7 +2583,6 @@
 
 
 .sch .sch_result .item_prod{width:100%;}
-.sch .sch_result .item_prod .itemName{margin-top:1rem; color:#535353}
 .sch .sch_result .item_prod .rank::after{background-color:#fd4802;}
 .sch .sch_result .item_prod .rank > span{font-size:0.9rem;}
 .sch .sch_result .item_prod .itemPic.ver{padding-top:99%; margin-top:3rem;}

src/main/webapp/ux/pc/css/common.css

@@ -794,7 +794,8 @@ content: "〉";font-size: 12px;padding-left: 8px;
 
 .item_prod {width: 20%;display: inline-block;font-size: 0px;vertical-align: top;color: rgb(31, 31, 31);position: relative;letter-spacing: -0.2px;}
 .item_state {position: relative; padding: 0px 10px 60px; box-sizing: border-box;}
-.item_state.soldout .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size: 28px; font-weight: 500; color:#fff; background: rgba(0,0,0,.7); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 20; text-align: center;}
+.item_state.soldout .itemPic:after {content: 'SOLD OUT';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width:100%;height: auto;font-size: 18px;font-weight: 500;color: #fff;z-index: 30;text-align: center; opacity: 1; background: transparent;}
+.item_state.soldout .itemPic:before {content:''; position: absolute; top: 50%; left: 50%; font-size: 28px; font-weight: 500; color:#fff; background: rgba(0,0,0,.7); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 20; text-align: center;}
 .item_state.AD .itemPic:before {content:'AD'; position: absolute; bottom: 20px; right: 20px; font-size: 14px; font-weight: 300; letter-spacing: -0.025em; color:#888888; width: auto; height: auto; line-height: 14px; z-index: 21; text-align: right;}
 @media (max-width: 1919px) and (min-width: 1401px){/* .item_state {padding-left: 6px;padding-right: 6px;} */}
 .hgbgCa {width: 100%;height: 100%;}

src/main/webapp/ux/pc/css/layout.css

@@ -333,7 +333,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 .partners_pop .tbl.type2 table td {font-size: 14px; font-weight: 300; color:#666;}
 
 /* 퀵메뉴 */
-#quick_menu {position:fixed; bottom:0; right:0; z-index:100; /*padding-left: 60px;*/}
+#quick_menu {position:fixed; bottom:0; right:0; z-index:102; /*padding-left: 60px;*/}
 #quick_menu.active {right: 0;}
 #quick_menu:before {content:''; position: fixed; bottom: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5); display: none;}
 #quick_menu.active:before {display: block;}
@@ -362,12 +362,13 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 /* 퀵메뉴_최근 본 상품 */
 #quick_menu .history .itemsGrp {margin:0 -7px;}
 #quick_menu .history .item_prod {width: 50%;}
-#quick_menu .history .item_state {padding:0 7px 14px;}
+#quick_menu .history .item_state {padding:0; margin:0 7px 14px;}
 #quick_menu .history .itemPic {margin-bottom: 0;}
 #quick_menu .history .no_item {display: none;}
 #quick_menu .history .quick_body.nodata .item_prod, #quick_menu .quick_con .quick_body.nodata .product_count {display: none;}
 #quick_menu .history .quick_body.nodata .item_prod {display: none;}
 #quick_menu .history .quick_body.nodata .no_item {display: block; line-height: 700px; text-align: center; font-size: 16px; color: #888;}
+#quick_menu .itemsGrp:not(.rowtype) .item_prod .item_state.soldout::before {top: 50%; transform:translate(-50%, -50%);}
 
 /* 퀵메뉴_쇼핑백 */
 .itemsGrp {margin-bottom:0;}
@@ -393,9 +394,9 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 #quick_menu .shopingbag .itemsGrp .item_prod .itemLike {z-index: 99;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemPic {position: absolute; top: 0; left: 0; margin-bottom: 0; width: 120px; padding-top: 180px;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemPic .shape {z-index: 89;}
-#quick_menu .shopingbag .itemsGrp .item_prod .itemPic::after {background: #f9f9f9; opacity:1; z-index: 87;}
-#quick_menu .shopingbag .itemsGrp .item_prod .itemPic .pd_img {z-index: 88;}
-#quick_menu .shopingbag .itemsGrp .item_state.soldout .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size: 20px; color:#fff; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 1; text-align: center;}
+/* #quick_menu .shopingbag .itemsGrp .item_prod .itemPic::after {background: #f9f9f9; opacity:1; z-index: 87;}
+ #quick_menu .shopingbag .itemsGrp .item_prod .itemPic .pd_img {z-index: 88;}
+ #quick_menu .shopingbag .itemsGrp .item_state.soldout .itemPic:before {content:'SOLD OUT'; position: absolute; top: 50%; left: 50%; font-size: 20px; color:#fff; background: rgba(0,0,0,.5); width: 100%; height: 100%; transform:translate(-50%, -50%); line-height: 420px; z-index: 1; text-align: center;} */
 #quick_menu .shopingbag .itemsGrp .item_prod .itemBrand {margin:0px 0 15px; font-size: 12px; line-height:14px; font-weight: 300;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemComment {font-size: 12px;margin-left: 0;}
 #quick_menu .shopingbag .itemsGrp .item_prod .itemName {margin:0px 0 13px; font-size: 14px; font-weight: 300; line-height: 1.5; max-height:44px; overflow:hidden;}
@@ -3804,7 +3805,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.sch_result .cont_body .sch_result_cont .exhi_list .item_prod:nth-child(5n+0) {margin-right: 0;}
 	.sch_result .cont_body .sch_result_cont .exhi_list .item_prod:nth-child(6n+0) {margin-right: 20px;}
 	.sch_result .cont_body .sch_result_cont .exhi_list .itemsGrp {margin-bottom: 80px;}
-	.sch_result .cont_body .sch_result_cont .exhi_list .itemsGrp .exhi_item {float:left; width: calc((100% - 60px)/4); overflow: hidden; margin:0 20px 80px 0;}
+	.sch_result .cont_body .sch_result_cont .exhi_list .itemsGrp .exhi_item {float:left; width: calc((100% - 60px)/4); overflow: hidden; margin:0 20px 80px 0; min-height:717px;}
 	.sch_result .cont_body .sch_result_cont .exhi_list .itemsGrp .exhi_item:nth-child(4n) {margin:0 0 40px 0;}
 	.sch_result .cont_body .sch_result_cont .exhi_list .itemsGrp .exhi_item .exhi_item_img {width: 100%; height: auto; overflow: hidden;} 
 	.sch_result .cont_body .sch_result_cont .exhi_list .itemsGrp .exhi_item .exhi_item_img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height:auto;}
@@ -4471,7 +4472,7 @@ ul.maintabs li [class^='box_depth'] {display:none; position:absolute; left:100%;
 	.hookGrp .hook_list ul li a:hover span:after,
 	.hookGrp .hook_list ul li a:focus span:after{content: '';display: block; color: #fd4802; box-sizing: border-box; border-bottom: 1px solid #fd4802;}
 	.hookGrp .hook_cont {font-size:16px;color:#666666;line-height:26px;letter-spacing:-0.025em;}
-	.hookGrp .hook_cont div{margin-top: 0px;}
+	.hookGrp .hook_cont div{margin-top: 62px;}
 	
 	.hookGrp .hook_cont h4 {font-size:24px;font-weight:500;color:#222222;line-height:26px;letter-spacing:-0.025em;}
 	.hookGrp .hook_cont p {font-size:16px;color:#666666;line-height:26px;letter-spacing:-0.025em;}