모바일 html 수정

src/main/webapp/mobile/app/mpomng/MPOMNG01010.html

@@ -120,7 +120,7 @@
             </div>
         </div>
     </div>
-    <div id="ITP_POP_MPOMNG01010_WHS_AREA" class="popup2 mobile-pop-close" style="display: block;">
+    <div id="ITP_POP_MPOMNG01010_WHS_AREA" class="popup2 mobile-pop-close" style="display: none;">
         <div class="pop">
             <div class="header">
                 <div class="header_left">
@@ -172,7 +172,7 @@
         <div class="pop">
             <div class="header">
                 <div class="header_left">
-                    <label>> 품목 검색</label>
+                    <label>품목 검색</label>
                 </div>
                 <div class="header_right">
                     <button type="button" id="ITP_BTN_MPOMNG01010_POP_ITEM_CLOSE" class="btn-pop-close"><img src="../img/close.png"></button>
@@ -185,36 +185,46 @@
                     <input id="ITP_FORM_MPOMNG01010_POP_ITEM_KEYWORD" name="sitemNm" type="text" placeholder="품목명/품목번호" />
                     <button id="ITP_BTN_MPOMNG01010_POP_ITEM_SEARCH"><img src="../img/search.png"></button>
                 </div>
-                <div class="search_bar">
-                    <button id="ITP_BTN_MPOMNG01010_POP_ITEM_NM" class="btn_blue">품목명▼</button>
+                <div class="select_btn">
+                    <button id="ITP_BTN_MPOMNG01010_POP_ITEM_NM" class="btn_blue">품목명 V</button>
                 </div>
             </form>
             <div id="ITP_LIST_MPOMNG01010_POP_ITEM_AREA" class="popup_scroll">
-                <ul id="ITP_LIST_MPOMNG01010_POP_ITEM_ROWS" class="panel-group"></ul>
-                <div id="ITP_LIST_MPOMNG01010_POP_ITEM_ROWCOPY" style="display:none;">
-                    <li class="row_2">
-                        <div class="left" style="width:180px;">
-                            <!--<div class="check_box">
-                                <input type="checkbox" id="ITP_FORM_MPOMNG01010_POP_ITEM_CHECKBOX" name="itemId" />
-                            </div>-->
-                            <div class="thick">
-                                <div class="fnItemNm">품목명</div>
-                                <div>-</div>
-                                <div class="fnUnit">EA</div>
-                            </div>
-                            <div class="thick" style="font-weight:100;">
-                                <div class="space">구매가 :</div>
-                                <div class="fnUnitAmt">0</div>
-                            </div>
+                <ul id="ITP_LIST_MPOMNG01010_POP_ITEM_ROWS" class="mb_0"></ul>
+                <div id="ITP_LIST_MPOMNG01010_POP_ITEM_ROWCOPY" style="display: block;">
+                     <li class="row_2">
+                        <div class="scroll_left">
+                            <div class="fnItemNm">품목명 001</div>
+                            <div class="sub fnKg">700g</div>
+                            <div class="amt fnItemAmt">30,500원</div>
                         </div>
-                        <div class="right">
-                            <button id="ITP_BTN_MPOMNG01010_POP_ITEM_MINUS" class="POP_ITEM_MINUS">-</button>
-                            <div class="num fnPchReqQty">1</div>
-                            <button id="ITP_BTN_MPOMNG01010_POP_ITEM_PLUS" class="POP_ITEM_PLUS">+</button>
+                        <div class="scroll_right">
+                            <button id="ITP_BTN_MPOMNG01010_POP_ITEM_ADD" class="POP_ITEM_ADD">추가</button>
                         </div>
-                        <div class="add">
+                      	<div class="itp_num_set">
+		                      <div class="right">
+				              <button id="ITP_BTN_MPOMNG01010_DETAIL_MINUS">-</button>
+				              <div class="num fnPchReqQty">1</div>
+				              <button id="ITP_BTN_MPOMNG01010_DETAIL_PLUS">+</button>
+				            </div>
+			            </div>
+                    </li>
+                     <li class="row_2">
+                        <div class="scroll_left">
+                            <div class="fnItemNm">품목명 001</div>
+                            <div class="sub fnKg">700g</div>
+                            <div class="amt fnItemAmt">30,500원</div>
+                        </div>
+                        <div class="scroll_right">
                             <button id="ITP_BTN_MPOMNG01010_POP_ITEM_ADD" class="POP_ITEM_ADD">추가</button>
                         </div>
+                      	<div class="itp_num_set">
+		                      <div class="right">
+				              <button id="ITP_BTN_MPOMNG01010_DETAIL_MINUS">-</button>
+				              <div class="num fnPchReqQty">1</div>
+				              <button id="ITP_BTN_MPOMNG01010_DETAIL_PLUS">+</button>
+				            </div>
+			            </div>
                     </li>
                 </div>
             </div>

src/main/webapp/mobile/css/style.css

@@ -12,10 +12,10 @@ body{background: #fff; position: relative; width: 100%; height: auto; font-famil
 section .popup { position: fixed; width: 100%; height: 100%; background: transparent; z-index: 11;}
 section .popup .pop { position: absolute; top: 45%; left: 50%; transform: translate(-50%,-50%); width: 70%; height: 250px; padding-top: 30px; background: #fff; border: 2px solid #000; border-top-left-radius: 10px; border-top-right-radius: 10px;}
 section .popup .pop label.pop_label {position:relative; top:10px; font-size: 1.2rem;}
-section .popup .pop div.pop_msg {position:relative; top:10px; font-size: 1.2rem;}
+section .popup .pop div.pop_msg {position:relative; top:10px; font-size: 18px;}
 section .popup .pop .pop_line { width: 100%; height: 30px;}
-section .popup .pop .pop_line label { font-size: 1.2rem; margin-left: 20px; float: left; width: auto; text-align: left;}
-section .popup .pop .pop_line div {text-align: right; float: right; font-size: 1.2rem; margin-right: 20px; width: auto;}
+section .popup .pop .pop_line label { font-size: 16px; margin-left: 20px; float: left; width: auto; text-align: left;}
+section .popup .pop .pop_line div {text-align: right; float: right; font-size: 16px; margin-right: 20px; width: auto;}
 section .popup .pop .popup_btn { position: absolute; background-color: #ccc; bottom: 0; width: 100%; height: 51px; border-top: 2px solid #000;}
 section .popup .pop .popup_btn button { position: relative; float: left; width: 100%; height: 50px; font-size: 1rem; font-weight: 700; border-radius: 0px; border: none;}
 section .popup .pop .popup_btn button.ok { width: 64%; border-left: 2px solid #000;}
@@ -35,7 +35,7 @@ section .popup2 .pop .header .header_left {padding-top: 12px;}
 section .popup2 .pop .header .header_left label {font-size: 18px; font-weight:100;} 
 section .popup2 .pop .header .header_right {float: right; padding-right: 10px; position:relative; top:-44px;}
 section .popup2 .pop .header .header_right button {border: none; background: transparent;}
-section .popup2 .pop .header .header_right button img {width:30px; height:30px;}
+section .popup2 .pop .header .header_right button img {width:22px;}
 section .popup2 .pop .select_btn button.btn_blue {float: right; width: 100px; height: 30px; background:#d9baaf; color: #fff; font-size: 13px; padding-top:6px; border: 1px solid #cca597;}
 section .popup2 .pop .select_btn {position:relative; top:-25px; left:55px; width:100%; height: 20px;}
 section .popup2 .pop .search_bar {width: 100%; height: 60px; padding:10px;}
@@ -67,13 +67,13 @@ section .popup2 .pop .popup_scroll li .left .nomal {float: left; margin: 15px 0p
 section .popup2 .pop .popup_scroll li .left .history {font-weight: 700; font-size: 2.4rem; margin-left: 20px;}
 section .popup2 .pop .popup_scroll li .left .history input{width: 150px;}
 section .popup2 .pop .popup_scroll li .scroll_left {float: left; display:grid;}
-section .popup2 .pop .popup_scroll li .scroll_left div {text-align:left; float: left; font-size: 18px; font-weight: 100; width: auto; margin:9px 6px -6px 10px;}
+section .popup2 .pop .popup_scroll li .scroll_left div {text-align:left; float: left; font-size: 18px; font-weight: 100; width: auto; margin:8px 6px -6px 10px;}
 section .popup2 .pop .popup_scroll li .scroll_left .sub{font-size:14px; color:gray;}
+section .popup2 .pop .popup_scroll li .scroll_left .amt{font-size:16px; color:#b88278;}
 section .popup2 .pop .popup_scroll li .scroll_right {float: right;}
 section .popup2 .pop .popup_scroll li .scroll_right button {width: 50px; height: 38px; padding: 0; background:#8f9fc6; border:1px solid #cacfe3; color:#eee; border-radius: 10px; font-size: 14px; margin:25px 10px;}
-section .popup2 .pop .popup_scroll li .right {position: relative; display: flex; font-size: 1.6rem; font-weight: 700; float: left; top:20px;}
-section .popup2 .pop .popup_scroll li .right .num {margin: 0 20px; width: auto;}
-section .popup2 .pop .popup_scroll li .right button {padding: 5px; font-size: 1rem; border-radius: 0px;}
+section .popup2 .pop .popup_scroll li .right {position: relative; display: flex; font-size: 1.6rem; font-weight: 700; float: right; top:24px; height:38px;}
+section .popup2 .pop .popup_scroll li .right button {padding: 5px; font-size: 22px; width:30px;}
 section .popup2 .pop .popup_scroll li .add button{float: right; width: 60px; height: 55px; margin: 12px 9px; border-radius: 10px; font-size: 1rem; background: rgb(198, 170, 250);}
 section .popup2 .pop .content .line button {width: 40%; height: 35px;font-size: 1rem; padding: 0; margin: 0 10px;}
 section .popup2	.list_line {width:98%; float:left; height:50px;display: inline-flex; margin:0 1%; font-size:12px;}
@@ -84,7 +84,8 @@ section .popup2 .list_line .list_info input{width:90%;}
 section .popup2 .list_line .mail input {width:30%;}
 section .popup2 .list_line .mail select {width:30%;}
 section .popup2 .list_line .list_info .pay_info {text-align:left; padding-left:17px;}
-
+section .popup_scroll li .right .num {padding:8px 22px; width: auto; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB;}
+section .popup_scroll li .right button {background:#e1cac1; color:#fff; border:1px solid #E0B8AB; padding:0px 7px; font-size: 1.5rem; border-radius: 0px;}
 section .popup2 .list_line .line_right {float:right; width:70%;}
 section .popup2 .list_line .line_right select {width:200px; float:right;}
 section .popup2 .list_line .line_right input {width:200px; float:right;}