메인 html 크기 조정

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

@@ -174,97 +174,9 @@
                 <div class="itp_item fnItemNm">품목명</div>
               </div>
               <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
-              </div>
-            </div>
-            <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 class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
-          </li>
-          <li class="list-row">
-            <div class="left_info">
-              <div class="check_box">
-                <input type="checkbox" name="brandUnitUnqNo" class="fnBrandUnitUnqNo" />
-              </div>
-              <div class="thick">
-                <div class="itp_item fnItemNm">품목명</div>
-              </div>
-              <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
-              </div>
-            </div>
-            <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 class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
-          </li>
-          <li class="list-row">
-            <div class="left_info">
-              <div class="check_box">
-                <input type="checkbox" name="brandUnitUnqNo" class="fnBrandUnitUnqNo" />
-              </div>
-              <div class="thick">
-                <div class="itp_item fnItemNm">품목명</div>
-              </div>
-              <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
-              </div>
-            </div>
-            <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 class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
-          </li>
-          <li class="list-row">
-            <div class="left_info">
-              <div class="check_box">
-                <input type="checkbox" name="brandUnitUnqNo" class="fnBrandUnitUnqNo" />
-              </div>
-              <div class="thick">
-                <div class="itp_item fnItemNm">품목명</div>
-              </div>
-              <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
+                <div class="itp_gram fnUnitAmt">12,120,000</div>
+                <span>/</span>
+                <div class="itp_amt fnUnitAmt">12,012,000</div>
               </div>
             </div>
             <div class="right">
@@ -272,101 +184,6 @@
               <div class="num fnPchReqQty">1</div>
               <button id="ITP_BTN_MPOMNG01010_DETAIL_PLUS">+</button>
             </div>
-            <div class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
-          </li>
-          <li class="list-row">
-            <div class="left_info">
-              <div class="check_box">
-                <input type="checkbox" name="brandUnitUnqNo" class="fnBrandUnitUnqNo" />
-              </div>
-              <div class="thick">
-                <div class="itp_item fnItemNm">품목명</div>
-              </div>
-              <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
-              </div>
-            </div>
-            <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 class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
-          </li>
-          <li class="list-row">
-            <div class="left_info">
-              <div class="check_box">
-                <input type="checkbox" name="brandUnitUnqNo" class="fnBrandUnitUnqNo" />
-              </div>
-              <div class="thick">
-                <div class="itp_item fnItemNm">품목명</div>
-              </div>
-              <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
-              </div>
-            </div>
-            <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 class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
-          </li>
-           <li class="list-row">
-            <div class="left_info">
-              <div class="check_box">
-                <input type="checkbox" name="brandUnitUnqNo" class="fnBrandUnitUnqNo" />
-              </div>
-              <div class="thick">
-                <div class="itp_item fnItemNm">품목명</div>
-              </div>
-              <div class="thick">
-                <div class="itp_gram fnUnitAmt"></div>
-              </div>
-              <div class="thick">
-                <div class="itp_amt fnUnitAmt"></div>
-              </div>
-            </div>
-            <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 class="md_info">
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            	<div class="thick">
-            		<div></div>
-            	</div>
-            </div>
           </li>
         </div>
       </div>
@@ -429,7 +246,7 @@
             </div>
         </div>
     </div>
-    <div id="ITP_POP_MPOMNG01010_WHS_AREA" class="popup2 mobile-pop-close" style="display: none;">
+    <div id="ITP_POP_MPOMNG01010_WHS_AREA" class="popup2 mobile-pop-close" style="display: block;">
         <div class="pop">
             <div class="header">
                 <div class="header_left">
@@ -448,7 +265,7 @@
                 </form>
             </div>
             <div class="select_btn">
-                <button id="ITP_BTN_MPOMNG01010_POP_WHS_NM" class="btn_blue">납품장소  ▼</button>
+                <button id="ITP_BTN_MPOMNG01010_POP_WHS_NM" class="btn_blue">납품장소 <img src="../img/arrow_down.png"></button>
             </div>    
             <div id="ITP_LIST_MPOMNG01010_POP_WHS_AREA" class="popup_scroll">
                 <ul id="ITP_LIST_MPOMNG01010_POP_WHS_ROWS" class="mb_0 itp_nav"></ul>

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

@@ -23,8 +23,8 @@ section .popup .pop .pop_line .itp_label_area {height:35px; padding:8px; width:1
 section .popup .pop .pop_line .itp_label_area label {margin:0;font-size: 14px; text-align:left; float: left; min-width: 100px;}
 section .popup .pop .pop_line .itp_info_area {width:calc(100% - 100px); margin:0; padding:6px;}
 section .popup .pop .pop_line div {text-align: right; float: right; font-size: 16px; margin-right: 10px; 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; margin:0; font-size: 18px; font-weight: 100; border-radius: 0px; border: none;}
+section .popup .pop .popup_btn { position: absolute; background-color: #ccc; bottom: 0; width: 100%; height: 40px; border-top: 2px solid #000;}
+section .popup .pop .popup_btn button { position: relative; float: left; width: 100%; height: 38px; margin:0; font-size: 18px; font-weight: 100; border-radius: 0px; border: none;}
 section .popup .pop .popup_btn button.ok { width: 64%; border-left: 2px solid #000;}
 section .popup .pop .popup_btn button.cancel {width: 36%;}
 
@@ -37,18 +37,19 @@ section .popup2 .barcode h1{text-align: left; width: 85%; font-size: 20px; margi
 section .popup2 .btn_barcode {margin-top: 20%;}
 section .popup2 .btn_barcode button {width: 35%; height: 50px; font-size: 15px; font-weight:100;}
 section .popup2 .pop { position: absolute; top: 45%; left: 50%; transform: translate(-50%,-50%); width: 95%; height: 85%; background: #fff; border: 1px solid #000; border-radius:10px;}
-section .popup2 .pop .header {position: relative; height: 50px; background: #f0831e; color:#eee; border-bottom: 1px solid #000; border-top-right-radius: 10px; border-top-left-radius: 10px;}
+section .popup2 .pop .header {position: relative; height: 40px; background: #f0831e; color:#eee; border-bottom: 1px solid #000; border-top-right-radius: 10px; border-top-left-radius: 10px;}
 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: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 .select_btn button.btn_blue {float: right; width: 90px; height: 25px; background:#d9baaf; color: #fff; font-size: 12px; padding-top:4px; border: 1px solid #cca597;}
+section .popup2 .pop .select_btn img {width:12px;}
 section .popup2 .pop .search_bar {width: 100%; height: 60px; padding:10px;}
-section .popup2 .pop .search_bar input {width: 90%; margin:0 5%; height: 40px; position:relative; top:-37px; font-size:14px;}
-section .popup2 .pop .search_bar button {position:relative; top:-74px; background:transparent; margin-right:5%; float: right; border: none; padding-top:3px;}
-section .popup2 .pop .search_bar button img {width: 22px;}
+section .popup2 .pop .search_bar input {width: 90%; margin:0 5%; height: 27px; position:relative; top:-37px; font-size:14px;}
+section .popup2 .pop .search_bar button {position:relative; top:-64px; background:transparent; margin-right:5%; float: right; border: none; padding-top:3px;}
+section .popup2 .pop .search_bar button img {width: 18px;}
 section .popup2 .pop .search_bar button.search {float: none; width: 50%; height: 35px; background:rgb(46, 46, 248); color: #fff; font-size: 1rem; padding: 0; border: 1px solid #000; margin: 0 auto;}
 section .popup2 .pop .search_item_bar {width:98%;margin:5px auto; display:flex;}
 section .popup2 .pop .search_item_bar input {width:40%; border-radius:5px; margin:0;}
@@ -317,7 +318,7 @@ input .day {margin: 18%; width: 45%; height: 80px; float: right;}
 .content .line .float_right_btn button {padding:0; width:27px; height:27px; border-radius:5px; border:1px solid #aaa;}
 .content .line .float_right_btn button img {width:18px; height:18px;}
 .content .line .float_left select {float: left; width: 100%; height: 36px; border: 1px solid #aaa; border-radius:5px; font-size: 14px;}
-.content .line .line_right {font-size: 2rem; float: left; margin-right: 0%; width:65%}
+.content .line .line_right {font-size: 2rem; float: left; margin-right: 0%; width:50%}
 .content .line .line_right div {float: right; font-size: 16px; margin-top: 12px; margin-right:3%; color:#555;}
 .content .line .line_right input {position: relative; text-align: right; margin-right: 84px;}
 .content .line .line_right input.m9 {margin-right:93px;}
@@ -389,7 +390,7 @@ input .day {margin: 18%; width: 45%; height: 80px; float: right;}
 .button_bar button.col_12 {font-weight:100; width: 100%; height: 60px; font-size: 18px;}
 
 /* scroll_area 조정 */
-.scroll_area {position: absolute; width: 100%; height: 392px;border-bottom:2px solid #000; bottom: 30px; overflow: auto; background: #fff;}
+.scroll_area {position: absolute; width: 100%; height: 456px;border-bottom:2px solid #000; bottom: 30px; overflow: auto; background: #fff;}
 
 .row-1{top: 225px;}
 .row-1-1{top:363px;}
@@ -420,14 +421,14 @@ input .day {margin: 18%; width: 45%; height: 80px; float: right;}
 .scroll_area li.list-row {display: inline-flex; height:60px;}
 .scroll_area li.list-row2 {height:130px; padding-top:8px;}
 
-.scroll_area li .left_info {width: calc(100% - 100px); float:left; margin-top:6px;}
+.scroll_area li .left_info {width: calc(100% - 100px); float:left; margin-top:4px;}
 .scroll_area li .left_info div {display: inline-block; font-size:14px;}
 .scroll_area li .left_info span {font-size: 14px;}
 .scroll_area li .left_info label{font-size: 16px; font-weight:100; margin-left:10px;}
 .scroll_area li .left_info .check_box {padding:10px; height:72px; float:left; width:30px;}
-.scroll_area li .left_info .thick {float:left;  margin-top: 2px; font-size: 18px; text-align: left; width: 200px;; font-weight: 100;}
+.scroll_area li .left_info .thick {float:left; margin-top: 2px; font-size: 18px; text-align: left; width: 200px; height:20px; font-weight: 100;}
 .scroll_area li .left_info .thick .itp_item {color:gray;}
-.scroll_area li .left_info .thick .itp_gram {color:#aaa; font-size:16px;}
+.scroll_area li .left_info .thick .itp_gram {color:#aaa; font-size:14px;}
 .scroll_area li .left_info .thick .itp_amt {color:#b88278; margin-top: 4px;}
 .scroll_area li .left_info .history {font-weight: 700; font-size: 1.1rem; margin-top:-2px;}
 .scroll_area li .left_info .history input{width: 150px;}
@@ -492,7 +493,7 @@ input .day {margin: 18%; width: 45%; height: 80px; float: right;}
 .scroll_area li .left .nomal div{ display: inline-flex; font-weight: 100; font-size: 15px;}
 .scroll_area li .left .nomal .col_5{min-width:50px;}
 
-.scroll_area li .right {margin: 20px 10px 0 0; position: relative; display: flex; height:35px; font-size: 1.4rem; font-weight: 700; float: right;}
+.scroll_area li .right {margin: 12px 10px 0 0; position: relative; display: flex; height:35px; font-size: 1.4rem; font-weight: 700; float: right;}
 .scroll_area li .right .num {padding:8px 22px; width: auto; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB;}
 .scroll_area li .right .fnnum {margin:10px 30px;}
 .scroll_area li .right button {background:#e1cac1; color:#fff; border:1px solid #E0B8AB; padding:0px 7px; font-size: 1.5rem; border-radius: 0px;}
@@ -546,6 +547,7 @@ input .day {margin: 18%; width: 45%; height: 80px; float: right;}
 @media screen and (max-height: 720px) {
 	#ITP_LOGIN {position:fixed; top:80px; max-width: 500px; margin: 0 auto;}
 	.bg_gray {position:relative; top:-90px;}
+	.scroll_area {height: 400px;}
 	
 	}
 /* 알림 팝업 추가 */