Kaynağa Gözat

모바일 js, css 최신화

eskim 5 yıl önce
ebeveyn
işleme
1c790b64b4

+ 4 - 4
src/main/webapp/ux/mo/css/common_m.css

@@ -84,7 +84,7 @@ button {overflow: visible;background: none;border: none;padding: 0;}
 button,select {text-transform: none;}
 button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button;cursor: pointer;}
 button[disabled],html input[disabled] {cursor: default;pointer-events: none;}
-button:focus {outline: #007bce dotted thin;}
+button:focus {outline: transparent;}
 button::-moz-focus-inner,input::-moz-focus-inner {padding: 0;border: 0;}
 input {line-height: normal;}
 input[type="checkbox"],input[type="radio"] {-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0;}
@@ -679,10 +679,11 @@ header .htop.trans{position:absolute; background:transparent !important;}
 header #htopSub{border-bottom: 0px solid #e5e5e5;box-sizing: border-box;}
 header #htopSubs{border-bottom: 0px solid #000000;box-sizing: border-box;}
 header #htopSub.my_main {background-color: #f5f5f5; border-bottom: 1px solid rgba(0, 0, 0, 0.0)!important;}
-header .htop h1 {display: inline-block;position: relative;width: 10.666rem;height: 100%;line-height: 4.5rem;vertical-align: middle;margin: 0px 0 0 2.0rem;font-size: 1.8rem;color: #222;}
+header .htop h1 {display: inline-block;position: relative;width:auto;height: 5.5rem;line-height: 5.5rem;vertical-align: middle;margin: 0px 0 0 2.0rem;font-size: 1.8rem;color: #222;}
 header .htop h1#htopTitle {display: inline-block;position: relative;max-width: 18rem;width: auto;height: 100%;line-height: 4.5rem;vertical-align: middle;padding: 0px 1.5rem 0px 0rem;font-size: 1.8rem;color: #222;}
 header .htop h1 a {height: 100%;width: 100%;display: block;}
-header .htop h1 img {position: absolute;top: 50%;left: 0;right: 0;transform: translate(0, -50%);margin: 0px 0;width: 10.666rem;height: auto;line-height: 1.6rem;vertical-align: middle;}
+header .htop h1 img {margin: 0px 0;width: 10.666rem;height: auto;line-height: 1.6rem;vertical-align: middle;}
+header .htop h1 a p{color: #fff;line-height: 5.5rem;font-size: 2.0rem;height: 5.5rem;display: inline;vertical-align: middle;}
 header .htop .btn_back {margin: 10px 0 0 15px;width: 35px;height: 35px;}
 header .htop .btn_back span {display: block;width: 24px;height: 24px;margin: 0 auto;position: relative;}
 header .htop .btn_back span i {display: block;position: absolute;background: #222;-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
@@ -2069,4 +2070,3 @@ button.alertCls {-webkit-appearance: none;padding: 0;cursor: pointer;background:
 	80% {bottom:8.0rem; opacity:1; z-index:99999;}
 	100% {opacity:0; z-index:0;}
 }
-

+ 20 - 7
src/main/webapp/ux/mo/css/layout_m.css

@@ -175,11 +175,14 @@
 .cs_contactUs_my .info_addfile {margin-top:2rem; color:#666; font-size:1.2rem; font-weight:200;}
 .cs_contactUs_my .sec_foot {margin-top:6rem}
 .cs_contactUs_my .sec_foot .btn.btn_md {margin:0px 0.5rem; font-weight:300; padding:1.5rem 9rem;}
-.cs_contactUs_my .txt_cnt {position:absolute; right:1.5rem; bottom:1.5rem; text-align:right; font-size:1.2rem;}
+.cs_contactUs_my .txt_cnt {position:absolute; right:1.5rem; bottom:1.5rem; text-align:right; font-size:1.4rem; font-weight: 300; background-color: #ffffff;}
 .cs_contactUs_my .cellphone .input_wrap{display:flex; flex-wrap:wrap;}
 .cs_contactUs_my .cellphone .input_wrap .tt{padding:0.3rem 0; margin-right:3rem; font-weight:600;}
 .cs_contactUs_my .img_group .thumb_pic {position:relative; display:inline-block; width:7.4rem; height:7.4rem; border:0.1rem solid #ddd; margin-right:0.4rem; box-sizing:border-box; overflow:hidden;} 
 .cs_contactUs_my .img_group .thumb_pic img {position:absolute; top:50%; transform: translateY(-50%); width:100%; height: auto;}
+.cs_contactUs_my .form_wrap .form_field:nth-of-type(3) .input_wrap{padding:0 1rem; padding-bottom:2.5rem; border: 1px solid #d7d7d7;}
+.cs_contactUs_my .form_wrap .form_field:nth-of-type(3) .input_wrap textarea{border:0px none; outline:none;}
+.cs_contactUs_my .form_wrap .form_field:nth-of-type(3) .input_wrap .txt_cnt{bottom:0.1rem}
 .cs_contactUs_1 .ui_foot .btn{width:100%; height: 4rem;}
 .modal#myQuestion .modal-body {padding:0 2rem 5.7rem;}
 
@@ -654,7 +657,8 @@
 [class*="pd_descrp"] .mdhtml_box {margin-top:4rem;}
 [class*="pd_descrp"] .mdhtml_box a{display:block; margin:0 -2rem; padding-top: 26%; overflow: hidden; position: relative;}
 [class*="pd_descrp"] .mdhtml_box img {width:100%;}
-[class*="pd_descrp"] .mdhtml_box img {/*width:100%;*/max-width: none;width: auto;height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
+[class*="pd_descrp"] .mdhtml_box img {width:100%;height: 100%; display: block;}
+[class*="pd_descrp"] .mdhtml_box a img {/*width:100%;*/max-width: none;width: auto;height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
 [class*="pd_descrp"] .mdhtml_box iframe {display:block; margin-left:auto; margin-right:auto}
 [class*="pd_descrp"] .mdhtml_box .movblock {position:relative; display:block; height:0; line-height:0; margin-left:auto; margin-right:auto; padding-top:56.25%; background:#eee}
 [class*="pd_descrp"] .mdhtml_box .movblock > iframe {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:100%; z-index:2}
@@ -858,6 +862,10 @@
 .pd_pop.Purchase_pop .pop_option_select .opt_header .check_excluding.form_field input[type="checkbox"] + label{ font-size:1.3rem; color:#222;}
 .pd_pop.Purchase_pop .pop_option_select .text_excluding{margin-top:-1rem; padding:1.2rem; background-color:#383838; font-size:1.3rem; color:#fff; text-align:center;}
 .pd_pop.Purchase_pop .select_custom .combo .select{font-size:1.4rem; height:auto; text-overflow: ellipsis; word-wrap: normal; overflow: hidden; padding-right: 4rem;}
+.pd.deal .pd_detail .pd_pop.Purchase_pop .select_custom .combo .select{color: #777777;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;overflow: hidden;padding-right: 4rem;padding-left: 5rem;}
+.pd.deal .pd_detail .pd_pop.Purchase_pop .form_field:nth-child(1) .select_custom .combo .select::before{content: '상품';display: inline-block;width: 0;height: 0;position: absolute;left: 1rem; color:#333333}
+.pd.deal .pd_detail .pd_pop.Purchase_pop .form_field:nth-child(2) .select_custom .combo .select::before{content: '옵션1';display: inline-block;width: 0;height: 0;position: absolute;left: 1rem; color:#333333}
+.pd.deal .pd_detail .pd_pop.Purchase_pop .form_field:nth-child(3) .select_custom .combo .select::before{content: '옵션2';display: inline-block;width: 0;height: 0;position: absolute;left: 1rem; color:#333333}
 .pd_pop.Purchase_pop .pop_option_select .setOption{}
 .pd_pop.Purchase_pop .pop_option_select .setOption .title{margin-bottom:1rem;}
 .pd_pop.Purchase_pop .pop_option_select .setOption .form_wrap{margin-top:2rem;}
@@ -865,7 +873,7 @@
 .pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field .select{color:#777777; text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden; padding-right:4rem;padding-left: 5rem;}
 .pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field .select:before{color:#333333}
 .pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field .select .opt_name{pointer-events: none;}
-.pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field .select .opt_price{pointer-events: none;}
+.pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field .select .opt_price{pointer-events: none;display: none;}
 .pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field:nth-child(1) .select:before {content: '옵션1';display: inline-block;width: 0;height: 0;position: absolute;left: 1rem;}
 .pd_pop.Purchase_pop div[class$="Option"] .form_wrap .form_field:nth-child(2) .select:before {content: '옵션2';display: inline-block;width: 0;height: 0;position: absolute;left: 1rem;}
 
@@ -1142,8 +1150,9 @@
 .modal.pd_pop.pd_qnawrite_pop .form_field {display:block;}
 .modal.pd_pop.pd_qnawrite_pop .form_field .lap{position:relative;}
 .modal.pd_pop.pd_qnawrite_pop .input_box {margin-top:3rem}
-.modal.pd_pop.pd_qnawrite_pop .input_box textarea {display:block; width:100%; height:20rem; padding:1.5rem; color:#222; font-size: 1.2rem; font-weight: 300; box-sizing: border-box;}
-.modal.pd_pop.pd_qnawrite_pop .input_box .txt_cnt {display:block; position:absolute; margin-top:0; right: 1rem; bottom: 0.1rem; text-align: right; font-size: 1.2rem; z-index:1; width:95%; background-color:#fff;}
+.modal.pd_pop.pd_qnawrite_pop .input_box textarea {display:block; width:100%; height:20rem; padding:0 1rem 0; color:#222; font-size: 1.2rem; font-weight: 300; box-sizing: border-box; border:0 none; outline: none;}
+.modal.pd_pop.pd_qnawrite_pop .input_box .txt_cnt {position: absolute;right: 1.5rem;bottom: 0.1rem;text-align: right;font-size: 1.4rem;font-weight: 300;background-color: #ffffff;}
+.modal.pd_pop.pd_qnawrite_pop .input_box .input_wrap{width:100%; padding:1.5rem; padding-bottom:2.5rem; border: 1px solid #d7d7d7;}
 .modal.pd_pop.pd_qnawrite_pop .secret_box {margin-top:1rem;}
 .modal.pd_pop.pd_qnawrite_pop .push_box {margin-top:3rem;}
 .modal.pd_pop.pd_qnawrite_pop .push_box dl {display:flex; flex-wrap: wrap; align-items: center; color:#222; font-size:1.3rem;}
@@ -1176,6 +1185,7 @@
 .pd_delivery .change .pop_table tr th {width: 10rem; padding: 0 0 0 1.2rem; color:#222; font-weight:500; background: #f5f5f5; text-align:left; word-break: break-all;}
 
 /* pd_pop > 상품리뷰 페이지 */
+.modal.pd_pop.pd_review_pop {overflow-x: hidden;overflow-y: auto;}
 .modal.pd_pop.pd_review_pop .modal-header{border-bottom:1px solid #eee !important;}
 .modal.pd_pop.pd_review_pop .modal-body{margin-top:9.3rem; padding:0}
 .modal.pd_pop.pd_review_pop  .modal-header{height:auto;}
@@ -1183,7 +1193,7 @@
 .modal.pd_pop.pd_review_pop .riview_box .area_slider{margin-bottom:0;}
 .modal.pd_pop.pd_review_pop .btn_group_flex > div > .btn{height:5.3rem;}
 .modal.pd_pop.pd_review_pop .pd_review .area_rv_empty .btn_group_flex{position:fixed; width: 100%; bottom: 0; left:0; margin-top: 0; z-index:10;}
-.pd_review{background:#f5f5f5;}
+.pd_review{background:#f5f5f5;overflow-x: hidden;}
 .pd_review.best,
 .pd_review.photo{background:#fff; position:relative; bottom:0; z-index:999; max-height:35rem;}
 .pd_review [class^="area_rv"]{padding:4rem 1.33rem; margin-bottom:1.2rem; background:#fff; line-height: 1.4;}
@@ -1353,13 +1363,15 @@
 .modal.pd_pop[class*="reviewdetail_pop"] .modal-header{border-bottom:0;}
 .modal.pd_pop[class*="reviewdetail_pop"] .modal-body{margin-top:5.2rem; padding:0 0;}
 .modal.pd_pop[class*="reviewdetail_pop"] .modal-body .pd_review .area_rv_all .review_list{border-top:0;}
-.modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb{position:relative; width:100%; height:100%;}
+.modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb{position:relative; width:100%; height:100%; min-height:45.6rem;}
+.modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb iframe {position: absolute;top: 0;left: 0;}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb img,
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb video{position: absolute; left: 50%; right: 0; top: 45%; bottom: auto; transform: translate(-50%, -50%); width: auto; height: auto; max-height: 100%; max-width: 100%; margin: auto 0; cursor: pointer;}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb{position:relative; background-color:#ddd; /*background-position:center center; background-repeat:no-repeat; background-size:contain;*/}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb.nodata:before{display:block; content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.5); z-index:1;}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .thumb.nodata:after{display:block; content:'리뷰에 등록된 이미지가 없습니다.'; position:absolute; top:50%; left:50%; width:90%; font-size:1.2rem; color:#fff; text-align:center; z-index:2; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .swiper-pagination {display: inline-block; width: auto; padding: 0.2rem 1rem; border-radius: 2rem; font-size: 1.2rem; color: #fff; background-color: rgba(34,34,34,.5);}
+.modal.pd_pop[class*="reviewdetail_pop"] .area_slider .swiper-pagination::before {content: '';display: block;height: 2.0rem;margin-top: -2.0rem;visibility: hidden;}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_slider .swiper-pagination-fraction {position: absolute; left: 50%; bottom: 6rem; margin:0; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_rv_all{padding-top:1rem;}
 .modal.pd_pop[class*="reviewdetail_pop"] .area_rv_all .review_list > ul > li {padding-top:1.5rem;}
@@ -2267,6 +2279,7 @@
 .br .br_main .special_shop .swiper-container{overflow:visible;}
 .br .br_main .special_shop .swiper-slide .sp_item{}
 .br .br_main .special_shop .swiper-slide .sp_item .sp_img{position:relative; margin-bottom:1.9rem;}
+.br .br_main .special_shop .swiper-slide .sp_item .sp_img a{display: block;}
 .br .br_main .special_shop .swiper-slide .sp_item .sp_img img{width:100%;}
 .br .br_main .special_shop .swiper-slide .sp_item .sp_img .s-text{position:absolute; bottom:4rem; padding:0 2rem; left:0; width:100%; box-sizing:border-box;}
 .br .br_main .special_shop .swiper-slide .sp_item .sp_img .s-text p{font-size:2.3rem; font-weight:500;; color:#fff; font-weight:300;}

+ 2 - 3
src/main/webapp/ux/mo/css/style24_m.css

@@ -401,7 +401,6 @@
 
 .main_pick .pick-cont {display: none;transition: ease-in, 1000;}
 .main_pick .pick-cont.active {display: block;transition: ease-out, 1000;}
-.main_pick .pick-cont .btn_group_flex {margin-top: 0;}
 
 .main_pick .pick-post {margin-top: 2rem; white-space: nowrap; overflow-x:auto; font-size: 0; -ms-overflow-style: none; scrollbar-width: none;}
 .main_pick .pick-post::-webkit-scrollbar {display: none;}
@@ -658,7 +657,7 @@ main.container .inner h2[data-style~="unusual"] {font-size:2.0rem;top: 0;positio
 .cmt_wrap .comment_textarea .input_wrap{display: block;}
 .cmt_wrap .cmt_thumb {padding:0 2rem;}
 /* .cmt_wrap .cmt_thumb .imgUpload {margin:0 -1%;} */
-.cmt_wrap .doc_contactus {width: 100%; height: 15rem; padding: 1.5rem; margin:3rem 0 1rem;}
+.cmt_wrap textarea {width: 100%; height: 15rem; padding: 1.5rem; margin:3rem 0 1rem;}
 .cmt_wrap .doc_ans {width: 100%; height: 15rem; padding: 20px; font-size: 1.3rem; line-height: 1.6; color: #888; font-weight: 300; resize:none;}
 .cmt_wrap .txt_cnt {position: absolute; right: 1.6rem; bottom: 1.6rem; margin-top: 0;}
 .cmt_wrap .txt_cnt {position: absolute; right: 1.6rem; bottom: 1.6rem; margin-top: 0; color: #888;}
@@ -1190,7 +1189,7 @@ main.container .inner h2[data-style~="unusual"] {font-size:2.0rem;top: 0;positio
 .my .review .tbl_wrap .tbl.review_tbl td {padding-left: 0;}
 .my .review .tbl_wrap .tbl.review_tbl td textarea {height: 200px;}
 .my .review .tbl_wrap .tbl td .select {width: 400px;}
-.my .review .tbl_wrap .tbl td .txt_cnt {background: #fff; width: calc(100% - 3.0rem); position: absolute; bottom: 1.6rem; right: 1.5rem; margin-top: 0; padding:0.5rem 0 0.5rem; font-size: 1.3rem; text-align: right; color: #888;}
+.my .review .tbl_wrap .tbl td .txt_cnt {background: #fff; width: calc(100% - 3.0rem); position: absolute; bottom: 1.7rem; right: 1.5rem; margin-top: 0; padding:0.5rem 0 0.5rem; font-size: 1.3rem; text-align: right; color: #888;}
 .my .review .tbl_wrap .tbl td .rev_height, 
 .my .review .tbl_wrap .tbl td .rev_weight {border:1px solid #ddd; position: relative;}
 .my .review .tbl_wrap .tbl td .rev_height input, 

+ 6 - 5
src/main/webapp/ux/mo/js/common_m.js

@@ -778,11 +778,12 @@ $(document).ready(function () {
             popOpenScroll();
             $('.container').addClass('btPop_open');
             // autome.style.top  = autotop /10 + "vh";
-            if (autotop > 251) {
-                autome.style.top = 25.0 + "vh";
-            }else{
-                autome.style.top  = pxtop/10 + "vh";
-            }
+            // 210524 _ 임시 제거
+            // if (autotop > 251) {
+            //     autome.style.top = 25.0 + "vh";
+            // }else{
+            //     autome.style.top  = pxtop/10 + "vh";
+            // }
             return false;
         });