ホーム エクスプローラ ヘルプ
登録 サインイン
orderqueen
/
oqpo-view
Watch 3
Star 0
Fork 0
Files 課題 0 プルリクエスト 0 Wiki
ツリー: 6f4d32be8a
ブランチ タグ
oqpo-view
/
src
/
main
/
webapp
/
mobile
/
css
/
style.css

style.css 47 KB
履歴 Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643 
  1. /* @font-face {
    2. 

  2.     font-family: 'GmarketSansMedium';
    3. 

  3.     src: url("../main/webapp/mobile/fonts/KoPubWorld Dotum Medium.ttf") format('woff');
    4. 

  4. } */
    5. 

  5. /* @font-face {
    6. 

  6.     font-family: 'GmarketSansMedium';
    7. 

  7.     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    8. 

  8.     font-weight: normal;
    9. 

  9.     font-style: normal;
    10. 

  10. } */
    11. 

  11. * {margin: 0; padding: 0;letter-spacing: -1px; box-sizing: border-box; text-align: center; font-family: 'KoPub Dotum', 'serif'; list-style: none;}
    12. 

  12. section {}
    13. 

  13. body{background: #fff; position: relative; width: 100%; height: auto; font-family: 'KoPub Dotum';
    14. 

  14. 	overflow:scroll-y; 
    15. 

  15. 	-webkit-overflow-scrolling:touch;}
    16. 

  16. body .login {position:fixed;}
    17. 

  17. .color-gray {color:#aaa;}
    18. 

  18. /* 팝업 */
    19. 

  19. section .popup {position: absolute; top:0; width: 100%; height: 100vh; background: transparent; z-index: 11;}
    20. 

  20. section .popup .pop {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 70%; height: 360px; padding-top: 20px; background: #fff; border: 2px solid #000; border-top-left-radius: 10px; border-top-right-radius: 10px;}
    21. 

  21. section .popup .pop.short {height:260px;}
    22. 

  22. section .popup .pop label.pop_label {position:relative; top:10px; font-size: 16px;}
    23. 

  23. section .popup .pop div.pop_msg {padding:0 5%; text-align:left; position:relative; top:10px; font-size: 16px;}
    24. 

  24. section .popup .pop .pop_line {width: 90%; margin:0 5%; display:flex; border:1px solid #aaa; border-bottom:none;}
    25. 

  25. section .popup .pop .pop_line.border {border-bottom:1px solid #aaa;}
    26. 

  26. section .popup .pop .pop_line .itp_label_area {height:35px; padding:8px; width:100px; margin:0; background:#eee; border-right:1px solid #aaa;}
    27. 

  27. section .popup .pop .pop_line .itp_label_area label {margin:0;font-size: 14px; text-align:left; float: left; min-width: 100px;}
    28. 

  28. section .popup .pop .pop_line .itp_info_area {width:calc(100% - 100px); margin:0; padding:6px;}
    29. 

  29. section .popup .pop .pop_line div {text-align: right; float: right; font-size: 16px; margin-right: 10px; width: auto;}
    30. 

  30. section .popup .pop .popup_btn { position: absolute; background-color: #ccc; bottom: 0; width: 100%; height: 40px; border-top: 2px solid #000;}
    31. 

  31. section .popup .pop .popup_btn button { position: relative; float: left; width: 100%; height: 38px; margin:0; font-size: 14px; font-weight: 100; border-radius: 0px; border: none;}
    32. 

  32. section .popup .pop .popup_btn button.ok { width: 64%; border-left: 2px solid #000;}
    33. 

  33. section .popup .pop .popup_btn button.cancel {width: 36%;}
    34. 

  34. 

  35. 

  36. section .popup2 {position: absolute; top:0; width: 100%; height: 100vh; background: rgba(200, 200,200, 0.8); z-index: 11;}
    37. 

  37. section .popup2 .content {position: fixed; z-index: 10; width:100%; background: #fff;}
    38. 

  38. section .popup2 .barcode {width: 100%;}
    39. 

  39. section .popup2 .barcode_area {width: 300px; height: 300px; margin: auto; background: #fff; border: 1px solid #000; margin-top: 10%;}
    40. 

  40. section .popup2 .barcode h1{text-align: left; width: 85%; font-size: 16px; margin:auto; margin-top: 50%;}
    41. 

  41. section .popup2 .btn_barcode {margin-top: 20%;}
    42. 

  42. section .popup2 .btn_barcode button {width: 35%; height: 40px; font-size: 15px; font-weight:100;}
    43. 

  43. section .popup2 .pop { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 95%; height: 70%; background: #fff; border: 1px solid #000; border-radius:10px;}
    44. 

  44. 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;}
    45. 

  45. section .popup2 .pop .header .header_left {padding-top: 12px;}
    46. 

  46. section .popup2 .pop .header .header_left label {font-size: 16px; font-weight:100;} 
    47. 

  47. section .popup2 .pop .header .header_right {float: right; padding-right: 10px; position:relative; top:-44px;}
    48. 

  48. section .popup2 .pop .header .header_right button {border: none; background: transparent; margin:3px -5px;}
    49. 

  49. section .popup2 .pop .header .header_right button img {width:22px;}
    50. 

  50. section .popup2 .pop .select_btn {position:relative; width:100%; height: 63px;}
    51. 

  51. section .popup2 .pop .select_btn button.btn_red {float: right; width: 90px; height: 25px; margin:0 7px; background:#d9baaf; color: #fff; font-size: 12px; padding-top:4px; border: 1px solid #cca597;}
    52. 

  52. section .popup2 .pop .select_btn button.btn_blue {float: right; width: 90px; height: 25px; margin:0 7px; background:#8f9fc6; color: #fff; font-size: 12px; padding-top:4px; border: 1px solid #cacfe3;}
    53. 

  53. section .popup2 .pop .select_btn button.btn_blue:active{background-color: #708cd1;}
    54. 

  54. section .popup2 .pop .select_btn img {width:12px;}
    55. 

  55. section .popup2 .pop .search_bar {width: 90%; height: 60px; margin:0 auto; padding:10px;}
    56. 

  56. section .popup2 .pop .search_bar input {width: 80%; height: 27px; position:relative; font-size:14px;}
    57. 

  57. section .popup2 .pop .search_bar button {position:relative; width:27px; height:27px; background:transparent; margin-right:0%; margin-top:3px; border: 1px solid #aaa; border-radius:4px; padding:0px;}
    58. 

  58. section .popup2 .pop .search_bar button img {width: 17px; position:relative; top:-1px;}
    59. 

  59. 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;}
    60. 

  60. section .popup2 .pop .search_item_bar {width:98%;margin:5px auto; position: relative; top:-40px; display:flex;}
    61. 

  61. section .popup2 .pop .search_item_bar input {width:40%; height:27px; border-radius:5px; margin:0; font-size:12px;}
    62. 

  62. section .popup2 .pop .search_item_bar select {width:22%; height:27px; padding:0 15px 0 0; border-radius:5px; margin-right:5px;}
    63. 

  63. section .popup2 .pop .search_btn_bar {width:100%; height:50px; margin-top:-30px; margin-right:10px;}
    64. 

  64. section .popup2 .pop .search_btn_bar .btn_right {float:right; margin-right:10px;}
    65. 

  65. section .popup2 .pop .search_btn_bar .btn_right button img{width:18px; height:18px; margin-right:2px;}
    66. 

  66. section .popup2 .pop .search_btn_bar .btn_right button {height:30px; padding:5px 12px; font-size:12px; font-weight:100; border-radius:3px; border:1px solid #333;}
    67. 

  67. 

  68. section .popup2 .pop .table{width:98%; margin:0 auto; border:1px solid #aaa; border-bottom:none;}
    69. 

  69. section .popup2 .pop .table .table_tr {display:flex;}
    70. 

  70. section .popup2 .pop .table .table_tr .tabel_th{width:23%;; height:30px; border-left:1px solid #aaa; background:#eee;}
    71. 

  71. section .popup2 .pop .table .table_tr .tabel_th label {font-size:14px; padding-top:5px; font-weight:100;}
    72. 

  72. section .popup2 .pop .table .table_tr .tabel_th .chkAll {margin:-5px; width:15px;}
    73. 

  73. 

  74. section .popup2 .pop .table_body .table_body{width:98%; height:120px; margin:0 auto; border:1px solid #aaa; border-bottom: none; overflow:auto;}
    75. 

  75. section .popup2 .pop .table_body .table_body::-webkit-scrollbar {
    76. 

  76.     display: none; /* Chrome, Safari, Opera*/
    77. 

  77. }
    78. 

  78. section .popup2 .pop .table_tr {display:flex; height:31px; border-bottom:1px solid #aaa;}
    79. 

  79. section .popup2 .pop .table_tr .table_td{display:grid; width:23%; height:30px; padding-top:5px; border-left:1px solid #aaa; background:#fff;}
    80. 

  80. section .popup2 .pop .table_tr .table_td div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:100%; font-size:12px; font-weight:100;}
    81. 

  81. section .popup2 .pop .table_tr .table_td .chkItem {margin-top:-5px; width:15px; left:50%; position:relative; transform:translateX(-50%);}
    82. 

  82. 

  83. section .popup2 .pop .popup_scroll ul.mb_0 {margin-bottom:0 !important;}
    84. 

  84. section .popup2 .pop .popup_scroll {position: relative; top:-25px; width: 100%;height: 75%; overflow: auto; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB;}
    85. 

  85. section .popup2 .pop .popup_scroll li {list-style: none; width: 100%; height: 50px; border-bottom: 1px solid #E0B8AB;}
    86. 

  86. section .popup2 .pop .popup_scroll li.row_2 {height: 70px;}
    87. 

  87. 

  88. section .popup2 .pop .popup_scroll li .left {position: relative; float: left;}
    89. 

  89. section .popup2 .pop .popup_scroll li .left .check_box {width:30px; float:left; height:80px; padding-left:5px; padding-top:20px;}
    90. 

  90. section .popup2 .pop .popup_scroll li .left div {display: inline-block;}
    91. 

  91. section .popup2 .pop .popup_scroll li .left label{font-size: 2.5rem;}
    92. 

  92. section .popup2 .pop .popup_scroll li .left .thick {float: left; margin: 12px 0 0 10px; font-size: 1rem; text-align: left; width: 140px; font-weight: 600;}
    93. 

  93. section .popup2 .pop .popup_scroll li .left .nomal {float: left; margin: 15px 0px 0px 15px; font-size: 1.2rem; text-align: left; width: 100%;}
    94. 

  94. section .popup2 .pop .popup_scroll li .left .history {font-weight: 700; font-size: 2.4rem; margin-left: 20px;}
    95. 

  95. section .popup2 .pop .popup_scroll li .left .history input{width: 150px;}
    96. 

  96. section .popup2 .pop .popup_scroll li .scroll_left {float: left; display:grid; width:50%;}
    97. 

  97. section .popup2 .pop .popup_scroll li .scroll_left div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; float: left; font-size: 18px; font-weight: 100; width: 80%; margin:8px 6px -6px 10px;}
    98. 

  98. section .popup2 .pop .popup_scroll li .scroll_left .con_2 {padding-top:0px;}
    99. 

  99. section .popup2 .pop .popup_scroll li .scroll_left .mg_0 {margin:0; width:100%;}
    100. 

  100. section .popup2 .pop .popup_scroll li .scroll_left .mg_0 div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:40%; margin:0; padding: 8px 2px 0px 2px;}
    101. 

  101. section .popup2 .pop .popup_scroll li .scroll_left .mg_0 .type_hide {width:auto;}
    102. 

  102. section .popup2 .pop .popup_scroll li .scroll_left .sub{font-size:14pt; color:gray; width:45px !important;}
    103. 

  103. section .popup2 .pop .popup_scroll li .scroll_left .wichi{font-size:14pt; color:gray;}
    104. 

  104. section .popup2 .pop .popup_scroll li .scroll_left .amt{font-size:14pt; color:#b88278;}
    105. 

  105. section .popup2 .pop .popup_scroll li .scroll_right {float: right;}
    106. 

  106. section .popup2 .pop .popup_scroll li .scroll_right input[type=checkbox]{width:27px; margin:18px 11px 0 11px;}
    107. 

  107. 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:16px 10px;}
    108. 

  108. section .popup2 .pop .popup_scroll li .scroll_right button:hover {background:#708cd1;}
    109. 

  109. section .popup2 .pop .popup_scroll li .right {position: relative; display: flex; font-size: 1.6rem; font-weight: 700; float: right; top:21px; height:27px;}
    110. 

  110. section .popup2 .pop .popup_scroll li .right button {padding: 0px; font-size: 17px; width:24px;}
    111. 

  111. 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);}
    112. 

  112. section .popup2 .pop .content .line button {width: 35%; height: 35px;font-size: 14px; font-weight:100; padding-top: 7px; margin: 0 10px;}
    113. 

  113. section .popup2	.list_line {width:98%; float:left; height:40px;display: inline-flex; margin:0 1%; font-size:12px;}
    114. 

  114. section .popup2 .border {border-bottom: 1px solid #000 !important;}
    115. 

  115. section .popup2 .list_line .list_label {width:30%;border:1px solid #000; height:40px; padding-top:10px; border-bottom:none; background:#eee;}
    116. 

  116. section .popup2 .list_line .list_label label{font-size:12pt;}
    117. 

  117. section .popup2 .list_line .list_info {width:70%;height:40px; border:1px solid #000; padding-top:10px; border-left:none; border-bottom:none;}
    118. 

  118. section .popup2 .list_line .list_info input{width:90%;}
    119. 

  119. section .popup2 .list_line .mail input {width:30%;}
    120. 

  120. section .popup2 .list_line .mail select {width:30%;}
    121. 

  121. section .popup2 .list_line .list_info .pay_info {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; padding-left:10px; font-size:12pt; width:100%; }
    122. 

  122. section .popup_scroll li .right .num {padding:2px 0px; width: 43px; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB;}
    123. 

  123. section .popup_scroll li .right button {background:#e1cac1; color:#fff; border:1px solid #E0B8AB; padding:0px 7px; font-size: 1.5rem; border-radius: 0px;}
    124. 

  124. section .popup_scroll li .right button:hover {background:#FCD5C1;}
    125. 

  125. section .popup_scroll li .right button:checked {background:#ccc;}
    126. 

  126. section .popup2 .list_line .line_right {float:right; width:70%;}
    127. 

  127. section .popup2 .list_line .line_right select {width:200px; float:right; height:34px; margin-top:4px;}
    128. 

  128. section .popup2 .list_line .line_right input {width:200px; float:right;}
    129. 

  129. section .popup2 .list_line .info{width:30%; padding-top:8px; padding-left:20px; text-align:left; font-size:12pt;}
    130. 

  130. 

  131. section .popup2 .search .left {width:20%; float:left; margin:20px;}
    132. 

  132. section .popup2 .search .right {width:20%; float:right; margin:20px;}
    133. 

  133. 

  134. section .popup2 .search .left button,
    135. 

  135. section .popup2 .search .right button {width:100%;}
    136. 

  136. section .popup2 .content .line .search_wrap input {float:right; width:50%; margin-right:0px; margin-top:0;}
    137. 

  137. section .popup2 .content .line.mt_5 {margin-top:5px; width:300px;}
    138. 

  138. section .popup2 .content .line.ml_10 {}
    139. 

  139. section .popup2 .content .line .search_wrap select {float:right; width:50%; height:34px; margin-right:0px;}
    140. 

  140. 

  141. 

  142. section .popup3 {position: absolute; top:0;width: 100%; height: 100vh; background: transparent; z-index: 11;}
    143. 

  143. section .popup3 .content {position: fixed; z-index: 10; width:100%; height:596px; background: #fff;}
    144. 

  144. section .popup3 .content label{width:120px; margin-top:7px;}
    145. 

  145. section .popup3 .content div{font-weight:100;}
    146. 

  146. section .popup3 .pop { position: absolute; top: 37%; left: 50%; transform: translate(-50%,-40%); width: 90%; height: 85%; background: #fff; border: 2px solid #000;}
    147. 

  147. section .popup3 .pop .header {position: relative; height: 50px; background: rgb(204, 225, 240); border-bottom: 1px solid #000;}
    148. 

  148. section .popup3 .pop .header .header_left {float: left; padding-top: 5px; padding-left: 20px;}
    149. 

  149. section .popup3 .pop .header .header_left label {font-size: 1.4rem;} 
    150. 

  150. section .popup3 .pop .header .header_right {float: right; padding-right: 10px;}
    151. 

  151. section .popup3 .pop .header .header_right button {border: none; background: transparent;}
    152. 

  152. section .popup3 .pop .header .header_right button img {width:30px; height:30px;}
    153. 

  153. /* 버튼 */
    154. 

  154. button {background-color: #fff; padding: 10px;}
    155. 

  155. button.btn-primary  {color: #fff; background-color: #8f9fc6; border: 1px solid #cacfe3;}
    156. 

  156. button.btn-primary:active{background-color: #708cd1;}
    157. 

  157. button.btn-yellow   {color: #fff; background-color: #f9c03c; border: 1px solid #cacfe3;}
    158. 

  158. button.btn-m-orange	{color: #fff; background-color: #f0831e; border: 1px solid #cacfe3;}
    159. 

  159. button.btn-m-orange:hover {border:3px solid #f0831e !important; background-color: #fff; color:#B7B8B8;}
    160. 

  160. button.btn-gray     {color: #fff; background-color: #a89d9c; border: 1px solid #cacfe3;}
    161. 

  161. button.btn-danger   {color: #fff; background-color: #c8989d; border: 1px solid #cacfe3;}
    162. 

  162. button.btn-green	{color: #fff; background-color: #5cb85c; border: 1px solid #cacfe3;}
    163. 

  163. button:hover {background: rgb(229, 248, 202); color: #000;}
    164. 

  164. 

  165. /* 실행,로딩 */
    166. 

  166. body.eee {height: 700px; background: #eee;}
    167. 

  167. .app_run {background: #ccc; width: 100%; height: 100%;}
    168. 

  168. .app_run .loding .start {position: absolute; width: 100%; top: 20%;}
    169. 

  169. .app_run .loding .start h2 {font-size: 1rem;}
    170. 

  170. .app_run .loding .start h1 {font-size: 2rem;}
    171. 

  171. .app_run .loding .cap {position: absolute; width: 100%; top: 50%; transform: translateY(50%);}
    172. 

  172. .app_run .loding .cap h3 {font-size: 1rem; color: #666;}
    173. 

  173. .brand_name {position: absolute; width: 100%; bottom: 0%; font-size: 1.6rem;}
    174. 

  174. 

  175. /* 업그레이드 , */
    176. 

  176. .upgrade { padding-top: 50%;}
    177. 

  177. .upgrade .info { position: relative; background-color: #fff; margin: 0 auto; width: 70%; height: 150px; padding: 20px; border: 1px solid #000; border-bottom: none; border-top-left-radius: 10px; border-top-right-radius: 10px;}
    178. 

  178. .upgrade .info h1 { position: relative; font-size: 1rem; margin: 5px; top: 20%;}
    179. 

  179. .upgrade .info h2 { position: relative; font-size: 0.8rem; margin: 5px; top: 30%;}
    180. 

  180. .upgrade .btn { position: relative; display: block; background-color: #fff; margin: 0 auto; width: 70%; height: 50px;}
    181. 

  181. .upgrade .btn button {border-radius: 0px;position: relative;border: 1px solid #000; padding: 0; float: left;display: block;height: 50px;font-size: 1.2rem;}
    182. 

  182. .upgrade .btn .info_btn1 button{border-right: none;width: 35%;color: #000;background-color: #f5f5f5;}
    183. 

  183. .upgrade .btn .info_btn2 button {width: 65%;color: #ccc;background-color: blue;}
    184. 

  184. 

  185. /* 로그인 */
    186. 

  186. .bg_gray {width:100%; height:180px; background:#ecebea; border-bottom-left-radius:50%; border-bottom-right-radius:50%;}
    187. 

  187. #ITP_LOGIN {
    188. 

  188.     transform: translateX(-50%);
    189. 

  189.     max-width: 500px;
    190. 

  190.     height:100%;
    191. 

  191.     left: 50%;
    192. 

  192.     position: fixed;}
    193. 

  193. #ITP_LOGIN .login_popup {position: relative; width: 350px; text-align: center;}
    194. 

  194. #ITP_LOGIN .login_popup h1 { font-size: 1.5rem; color: #333; font-weight: 700;}
    195. 

  195. #ITP_LOGIN .login_popup input { position: relative; height: 30px; font-size: 2.2rem;}
    196. 

  196. #ITP_LOGIN .login_popup .login_info {position:relative; top:-50px;}
    197. 

  197. #ITP_LOGIN .login_popup .login_info img {width:100px; margin-bottom:10px;}
    198. 

  198. #ITP_LOGIN .login_popup .num_area { position: relative; width: 100%;  margin-bottom: 40px;}
    199. 

  199. #ITP_LOGIN .login_popup .num_area .input_area {margin-bottom: 10px;}
    200. 

  200. #ITP_LOGIN .login_popup .num_area .input_area input {width:50%; font-size: 0.8rem; }
    201. 

  201. #ITP_LOGIN .login_popup .num_area .input_area button {margin-left: 0.1%; width: 19.5%; height: 45px; background-color: #f7b014; color: #eee; font-size: 16px; padding: 0; border:3px solid #fbd896; border-radius: 10px;}
    202. 

  202. #ITP_LOGIN .login_popup .itp_del_btn.reg_no {width:50px; right:123px; top:4px;}
    203. 

  203. #ITP_LOGIN .login_popup .itp_del_btn.reg_no button {width:45px; border:none; background:transparent;}
    204. 

  204. #ITP_LOGIN .login_popup .itp_del_btn {position:absolute; top:12px; right:66px; background:transparent;}
    205. 

  205. #ITP_LOGIN .login_popup .itp_del_btn button {width:25px; border:none; padding:0;}
    206. 

  206. #ITP_LOGIN .login_popup .itp_del_btn button img{width:18px;}
    207. 

  207. #ITP_LOGIN .login_popup .num_area .brand_list select {padding-left: 10px; width: 70%; height: 45px; font-size: 0.8rem; border:2px solid #ddd; border-radius:10px; background: url(../img/downarrow.png)no-repeat 95% 50%/20px auto; -webkit-appearance:none; appearance:none;}
    208. 

  208. #ITP_LOGIN .login_popup .num_area .brand_list select option {text-align: left; width: 70%; height: 50px; border: 1px solid #000; font-size: 20px;} 
    209. 

  209. 

  210. #ITP_LOGIN .login_page {position: relative; width: 100%;  margin-bottom: 30px;}
    211. 

  211. 

  212. #ITP_LOGIN .input_area {position: relative; width: 100%;  margin-bottom: 10px;}
    213. 

  213. #ITP_LOGIN .input_area input {width: 70%; height: 45px; position: relative; padding: 10px; text-align: left; border:2px solid #ddd; border-radius:10px; font-size: 0.7rem; color: #000; outline: none; margin:0;}
    214. 

  214. #ITP_LOGIN .input_area label {position: absolute; left: 18%; top: 14px; font-size: 15px; transition: all .5s ease; color:#666;}
    215. 

  215. #ITP_LOGIN .input_area input:focus + label,
    216. 

  216. #ITP_LOGIN .input_area input:valid + label {top: 4px; left: 18%; font-size: 0.6rem; color: blue;}
    217. 

  217. #ITP_LOGIN .error {margin: 0 auto; height:70px;}
    218. 

  218. #ITP_LOGIN .error label {font-size: 1rem;}
    219. 

  219. #ITP_LOGIN .login_btn {position: relative; top: -20px; left: 0;}
    220. 

  220. #ITP_LOGIN .login_btn button {
    221. 

  221.   font-weight: nomal;
    222. 

  222.   border:3px solid #fbd896; border-radius: 10px;
    223. 

  223.   color: #eee;
    224. 

  224.   background-color: #f7b014;
    225. 

  225.   width: 70%;
    226. 

  226.   height: 50px;
    227. 

  227.   font-size: 20px;
    228. 

  228. }
    229. 

  229. 

  230. /* 메인화면 */
    231. 

  231. 

  232. 

  233. @media screen and (min-width:300px) and (max-width:430px) {
    234. 

  234.   .footer button {margin: 0 15px;}
    235. 

  235. }
    236. 

  236. 

  237. .main {margin-top: 70px; height: 500px;}
    238. 

  238. .main .wicon label {font-size: 1.2rem;}
    239. 

  239. .main .wicon {width: 380px; margin: 0 auto;}
    240. 

  240. .main .wicon  button {border: 1px solid #333; margin: 8px 20px; background-color: #ccc; width: 150px; height:150px;border-radius: 30px;}
    241. 

  241. .main .wicon .icon_left {float: left;}
    242. 

  242. 

  243. 

  244. input {font-size:14px; margin-top: 3px; border: 1px solid #aaa; border-radius:4px; height: 34px;text-align: left; padding:0 10px;}
    245. 

  245. input[type="date"]::-webkit-calendar-picker-indicator {display:none;}
    246. 

  246. 

  247. select {border: 1px solid #aaa; border-radius:5px; height: 35px; font-size: 12px; text-align: left; padding:0 10px;}
    248. 

  248. input .day {margin: 18%; width: 45%; height: 80px; float: right;}
    249. 

  249. 

  250. /* 공통화면 */
    251. 

  251. 

  252. #ITP_WRAPPER header {position: fixed;top: 0;width: 100%;height: 49px;background-color:#F7B014;align-items: center; z-index: 11;}
    253. 

  253. #ITP_WRAPPER header .header_wrap {width: 100%; height: 49px; margin: 0 auto; display: inline-flex;}
    254. 

  254. #ITP_WRAPPER header .header_wrap .menu_logo {width:80px; height:49px;}
    255. 

  255. #ITP_WRAPPER header .header_wrap .menu_logo button {width: 22px; height: 18px; float: left; padding: 0; background: transparent; border: none; margin-left:10px; margin-top: 14px;}
    256. 

  256. #ITP_WRAPPER header .header_wrap .menu_logo button img {width: 22px; height: 18px; margin: 0; border-radius: 0; border: none;}
    257. 

  257. #ITP_WRAPPER header .header_wrap img.brand {float: right; height: 45px; margin: 5px; border-radius: 50%; border: 1px solid #666;}
    258. 

  258. #ITP_WRAPPER header .header_wrap label{ margin-top: 15px; width: 50px; height: 25px; font-size: 1rem;float: left; color: #fff;}
    259. 

  259. #ITP_WRAPPER header .header_wrap .name_info {width: calc(100% - 120px); height:49px; display:inline-flex;}
    260. 

  260. #ITP_WRAPPER header .header_wrap .name_info .bn {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding-top:0; text-align:right; width:115%; height:22px; font-size:18px;}
    261. 

  261. #ITP_WRAPPER header .header_wrap .name_info div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding-left:3px; padding-top:2px; text-align:left; width: 85%; font-size: 15px; color:#fff; margin-top:14px;}
    262. 

  262. 

  263. #ITP_WRAPPER header .header_wrap .logout {float: right; width: 40px;}
    264. 

  264. #ITP_WRAPPER header .header_wrap .logout button {margin-top: 15px; margin-right:20px; padding:0; width: 20px; height: 20px; border:none; font-size: 0.8rem;background: transparent;}
    265. 

  265. #ITP_WRAPPER header .header_wrap .logout button img {width:17px; height:18px;}
    266. 

  266. 

  267. /* 메뉴바 */
    268. 

  268. #ITP_MENU .menu_area {position: fixed; width: 100%; height: 100%; top: 0; left: -0%; background: #000; opacity: 0.7; z-index: 12; transition: all 0.5s;}
    269. 

  269. #ITP_MENU .menu_area button {float: right; width: 50px; height: 50px; padding: 0; background: transparent; border: none;}
    270. 

  270. #ITP_MENU .menu_area button img {float: right; width: 40px; height: 40px; margin: 7px;}
    271. 

  271. #ITP_MENU .menu_bar {position: fixed; width: 70%; height: 100%; left: -0%; top: 0; background: #fff; opacity: 1; z-index: 13; transition: all 0.5s;}
    272. 

  272. #ITP_MENU .menu_bar .menu_header {width: 100%; height: 100px; border-bottom: 1px solid #000 ;}
    273. 

  273. #ITP_MENU .menu_bar .menu_header .brand_img {position: absolute; width: 50px; height: 50px; margin: 20px 0 0 20px;}
    274. 

  274. #ITP_MENU .menu_bar .menu_header .brand_img img {width: 50px; height: 50px; border: 1px solid #000; border-radius: 5px;}
    275. 

  275. #ITP_MENU .menu_bar .menu_header .user_info {position: absolute; width: 120px; margin-left: 70px; margin-top: 20px; float: left;}
    276. 

  276. #ITP_MENU .menu_bar .menu_header .user_info div {position: absolute; width: 70px; margin-right: 10px; font-weight: 700;}
    277. 

  277. #ITP_MENU .menu_bar .menu_header .user_info div.id {font-weight: normal; color: #666; margin-left: 10px; margin-top: 5px;}
    278. 

  278. #ITP_MENU .menu_bar .menu_header .user_info label {width: auto; margin-left: 58px;}
    279. 

  279. #ITP_MENU .menu_bar .menu_header .setting {float: right;}
    280. 

  280. #ITP_MENU .menu_bar .menu_header .setting button {width: 30px; height: 30px; padding: 0; background: #666; border-radius: 5px; margin: 30px 20px 0 0;}
    281. 

  281. #ITP_MENU .menu_bar .menu_header .setting button img {width: 20px; height: 20px;}
    282. 

  282. 

  283. 

  284. /* ITP_SIDEBAR */
    285. 

  285. #ITP_SIDEBAR {width:0px; float:left; margin-left:-2px; height:calc(100vh - 68px); background:#ddd; transition:all .25s ease; border-style:solid; border-color:#ddd; border-width:0 1px 1px 1px;}
    286. 

  286. #ITP_SIDEBAR.itp_open_nav {width: 100%; height: 100%;}
    287. 

  287. #ITP_SIDEBAR .itp_nav {list-style:none; margin:0; padding:0; height:80%; overflow-y:scroll; overflow-x:hidden; visibility:hidden;}
    288. 

  288. #ITP_SIDEBAR.itp_open_nav .itp_nav {visibility:visible;}
    289. 

  289. #ITP_SIDEBAR.itp_open_nav .itp_nav::-webkit-scrollbar{display:none;}
    290. 

  290. #ITP_SIDEBAR .itp_nav.panel-group .panel+.panel {margin-top:0;}
    291. 

  291. #ITP_SIDEBAR .itp_nav .panel-heading {padding:0;}
    292. 

  292. #ITP_SIDEBAR .itp_nav .panel-title {line-height:1.1; border-bottom:1px solid #ddd;}
    293. 

  293. #ITP_SIDEBAR .itp_nav .panel-title a {font-size:20px; display:block; padding:13px 15px; color:#333; text-decoration: none;}
    294. 

  294. #ITP_SIDEBAR .itp_nav .panel-title a .glyphicon {font-size:12px;}
    295. 

  295. #ITP_SIDEBAR .itp_nav .panel-default {margin-bottom:0; border:none;}
    296. 

  296. #ITP_SIDEBAR .itp_nav * {border-radius:0; border-width:1px 0 1px 0;}
    297. 

  297. 

  298. #ITP_SIDEBAR .itp_nav .itp_svgs_body {padding:0; border-top:0; border-bottom:1px solid #ddd;}
    299. 

  299. #ITP_SIDEBAR .itp_nav .itp_svgs {display:flex; align-content:flex-start; flex-direction:column; flex-wrap:wrap; overflow:auto;}
    300. 

  300. #ITP_SIDEBAR .itp_nav .itp_svgs .itp_svg_in {position:relative;}
    301. 

  301. #ITP_SIDEBAR .itp_nav .itp_svgs li {width:100%; height:47px;}
    302. 

  302. #ITP_SIDEBAR .itp_nav .itp_svgs li a {display:block; width:100%; color:#333; padding:5px 10px 5px 17px;}
    303. 

  303. #ITP_SIDEBAR .itp_nav .itp_svgs li:first-child a {padding-top:10px;}
    304. 

  304. #ITP_SIDEBAR .itp_nav .itp_svgs li:last-child a {padding-bottom:10px;}
    305. 

  305. #ITP_SIDEBAR .itp_nav .itp_svgs li a:hover, #ITP_SIDEBAR .itp_nav .itp_svgs li a:active {color:#000; font-weight:bold;}
    306. 

  306. #ITP_SIDEBAR .itp_nav .itp_svgs li a .glyphicon {font-size:9px; float:left; margin:4px 6px 0 0;}
    307. 

  307. #ITP_SIDEBAR .itp_nav .itp_svgs li a .itp_icon {font-size:9px; float:left; margin:4px 6px 0 15px;}
    308. 

  308. #ITP_SIDEBAR .itp_nav .itp_svgs li a .itp_icon_5 {font-size:9px; float:left; margin:4px 6px 0 25px;}
    309. 

  309. #ITP_SIDEBAR .itp_nav .itp_svgs li a .itp_tt {float:left;}
    310. 

  310. 

  311. #ITP_SIDEBAR.itp_open_nav .nav_bottom {position: fixed; width: 70%; left: -0%; background: #eee; opacity: 1; z-index: 13; transition: all 0.5s;}
    312. 

  312. #ITP_SIDEBAR.itp_open_nav .nav_bottom .fnMenuNm {color:#0000ff;}
    313. 

  313. #ITP_SIDEBAR.itp_open_nav .nav_bottom .fnVersion {color:#0000ff;}
    314. 

  314. 

  315. /* 컨텐츠 화면 */
    316. 

  316. 

  317. 

  318. #ITP_CONTAINER.fix {
    319. 

  319.   position:fixed;
    320. 

  320.   width: 100%;
    321. 

  321.   padding-top: 49px;
    322. 

  322.   font-size: 16px;
    323. 

  323. }
    324. 

  324. .content {position: fixed; display:contents; z-index: 10; width:100%; background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
    325. 

  325. .content .content_fix {background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
    326. 

  326. .content .content_inside {background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
    327. 

  327. .content .header {width:100% !important; margin:0 !important;}
    328. 

  328. .content .line {position: relative; display: inline-block; width: 332px; margin:0 auto; height: 40px; margin-bottom: -10px;}
    329. 

  329. .content .line.mt5 {margin-top:5px;}
    330. 

  330. .content .line.top6 {top:6px;}
    331. 

  331. .content .line.top9 {top:9px;}
    332. 

  332. .content .line.top12 {top:12px;}
    333. 

  333. 

  334. .content .line .pop_right {width:50%; height:46px; float:right;}
    335. 

  335. .content .line .pop_right div {float:right; margin-right:10px; padding-top:8px; text-align:right; font-size:16px;}
    336. 

  336. .content .line .search_wrap input {float:right; width:50%; margin-right:10px;}
    337. 

  337. .content .line .search_wrap select {float:right; width:50%; height:27px; margin-right:10px;}
    338. 

  338. .content .line div.itp_search_header {height:40px; font-weight:100;padding:8px 10px 5px 10px; text-align: left; color:#b88278;border-bottom: 1px solid #aaa;font-size:14pt;}
    339. 

  339. .content .line div.itp_search_header img{width:14px; top:-2px; position:relative;}
    340. 

  340. .content .line label {min-width:125px; color:#898989; font-size: 14pt; float: left; text-align: left; margin-top: 7px; font-weight:100;}
    341. 

  341. .content .line label.pay_label {margin:20px 1%; width:98%;}
    342. 

  342. .content .line select.label {border: 1px solid #000; font-size: 0.9rem;margin:9px 0 0 5px; float: left; width: 120px; height: 30px; text-align: left;}
    343. 

  343. .content .line .itp_label_select {padding:0;width:120px; height:34px; color:#666; font-size: 14pt; float: left;  margin:3px 2.5px; font-weight:100; border:1px solid #aaa; border-radius:5px;}
    344. 

  344. .content .line .float_left {float: left; width:168px;;}
    345. 

  345. .content .line .float_left.name {width:60%;}
    346. 

  346. .content .line .float_left button {float:right; left:-2px; top:-2px; position:relative; background:transparent; border:none; width:34px; height:34px; padding:0;} 
    347. 

  347. .content .line .float_left button img {width:18px;}
    348. 

  348. .content .line .float_left input {width:100%; font-size:14pt;}
    349. 

  349. .content .line .float_left.note {width: 100%; padding: 10px;}
    350. 

  350. .content .line .float_left.note textarea {width: 100%; height: 100px; border: 1px solid #aaa; text-align: left; font-size:14px;}
    351. 

  351. .content .line .float_left div {font-size: 14pt; margin-top: 4px; margin-right:8px; text-align:right; font-weight:100;}
    352. 

  352. .content .line .float_left .input_text {background: #fff; width: 100%; height: 34px; border: 1px solid #aaa; margin-top: 3px; border-radius: 4px;}
    353. 

  353. .content .line .float_left .itp_input_btn {top:5px; margin:0; position:absolute; width:168px;}
    354. 

  354. .content .line .float_right_btn {float: left; margin-top: 3px; margin-left: 5px;}
    355. 

  355. .content .line .float_right_btn button {padding:0; width:34px; height:34px; border-radius:5px; border:1px solid #aaa;}
    356. 

  356. .content .line .float_right_btn button img {width:18px; height:18px;}
    357. 

  357. .content .line .float_left select {float: left; width: 100%; height: 34px; margin-top:3px; border: 1px solid #aaa; border-radius:5px; font-size: 14pt; font-weight:100;}
    358. 

  358. .content .line .line_right {float: right; margin-right: 0%; width:200px;}
    359. 

  359. .content .line .line_right div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:100%; text-align:right; float: right; font-size: 14pt; margin-top: 7px; margin-right:0%; color:#555;padding-right:5px;}
    360. 

  360. .content .line .line_right input {position: relative; text-align: center; font-size:12pt; width:100%;}
    361. 

  361. .content .line .line_right input.m9 {margin-right:93px;}
    362. 

  362. .content .line .line_right input.left {text-align: left;}
    363. 

  363. .content .line .line_right input.mg0 {margin-right:10px;}
    364. 

  364. .content .line .line_right input.date{width:140px; margin-right:132px; height:35px;} 
    365. 

  365. .content .line .line_right select {float: right; width: 180px; height: 30px; margin-top: 7px; border: 1px solid #000; font-size: 1rem; margin-right:93px;}
    366. 

  366. .content .line input.date {width: 168px; height: 34px; float: left; text-align:center; font-size:14pt; background: url(../img/calender.png) 95%/18px no-repeat white}
    367. 

  367. .content .line input.full {width: 100%;}
    368. 

  368. .content .line div.date_to {display:flex; width:60%; height:34px; float: left; margin-right:0px; margin-top:3px;}
    369. 

  369. .content .line div.date_to input {font-weight:100; width:47%; height:34px; font-size:11pt; padding:0 24px 0 3px; margin:0;}
    370. 

  370. 

  371. .content .line div.date_to div.at {width: 6%;  font-size: 16px; padding-top:12px; float: right;}
    372. 

  372. .content .line .search {width: 100%; height: 50px; padding-top:12px;}
    373. 

  373. .content .line .search button {width: 40%; height: 27px; font-size: 12px; font-weight:100; padding: 0;}
    374. 

  374. .content .line .search button.col_3 {width: 25%; height:30px; margin:0 10px;}
    375. 

  375. .content .list_line {width:98%; float:left; height:50px;display: inline-flex; margin:0 1%; font-size:12px;}
    376. 

  376. .content .border {border-bottom: 1px solid #000 !important;}
    377. 

  377. .content .list_line .list_label {width:30%;border:1px solid #000; height:50px; padding-top:14px; border-bottom:none; background:#eee;}
    378. 

  378. .content .list_line .list_label label {font-size:12pt;}
    379. 

  379. .content .list_line .list_info {width:70%;height:50px; border:1px solid #000; padding-top:15px; border-left:none; border-bottom:none;}
    380. 

  380. 

  381. .content .list_line .list_info input{width:90%; margin:0;}
    382. 

  382. 

  383. .content .list_line .mail input {width:30%;}
    384. 

  384. .content .list_line .mail select {width:30%; height:34px; font-size:14px; border: 1px solid #aaa;border-radius: 5px;}
    385. 

  385. .content .list_line .list_info .pay_info {text-align:left; padding-left:17px; font-size:12pt;}
    386. 

  386. .content .table_header {margin-top: 6px; width: 100%; height: 36px;}
    387. 

  387. .content .table_header h1 {margin-left: 15px; margin-top:16px; margin-bottom:0; font-size: 13px; float: left; color: #000; font-weight: 100;}
    388. 

  388. .content .table_header button {float: right; width: 68px; height:26px; font-size: 12px; font-weight: 100; padding:0px; margin: 4px 12px 6px 0; border-radius:15px;}
    389. 

  389. .detail_content {top: 0px; position: fixed; z-index: 10; width:100%; background: #fff;}
    390. 

  390. .detail_content .detail_content_fix {background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
    391. 

  391. .detail_content .detail_header {width: 100%; height: 80px; padding-top:65px}
    392. 

  392. .detail_content .detail_header .detail_logo {float: left;}
    393. 

  393. .detail_content .detail_header .detail_logo img {width: 70px; margin-left: 15px;}
    394. 

  394. .detail_content .detail_header .detail_ok {float: left;}
    395. 

  395. .detail_content .detail_header .detail_ok label {margin-left: 50px; font-size: 1.6rem; font-weight: 700;}
    396. 

  396. .detail_content .detail_confirmation {height: 260px; }
    397. 

  397. .detail_content .detail_confirmation .detail_col {float: left; width: 100%; display: inline-flex; margin-left: 15px; margin-bottom: 10px;}
    398. 

  398. .detail_content .detail_confirmation .detail_col label{font-size: 12pt; font-weight: 700; float: left; width: 100px; text-align: left;}
    399. 

  399. .detail_content .detail_confirmation .detail_col i{font-size: 1rem; font-style:normal; width: 1%; text-align: right; margin-right: 10px;}
    400. 

  400. .detail_content .detail_confirmation .detail_col div{font-size: 1rem; width: auto; text-align: left;}
    401. 

  401. .detail_content .detail_company_info {height:150px;}
    402. 

  402. .detail_content .detail_company_info label{font-size: 1rem; font-weight: 600;}
    403. 

  403. .detail_content .detail_company_info .weight {margin-bottom: 20px;}
    404. 

  404. .detail_content .detail_company_info .weight label{font-size: 1.2rem; font-weight: 700;}
    405. 

  405. .detail_content .detail_company_info div{font-size: 1rem;}
    406. 

  406. .detail_content .detail_company_info .info_left {width: 50%; height: 150px; float: left;}
    407. 

  407. .detail_content .detail_company_info .info_left .company_info {width: 100%; float: left; display: flex; margin-left: 15px; margin-top:3px;}
    408. 

  408. .detail_content .table_header {margin: 0% auto; width: 100%; height: 45px; background-color: skyblue; align-items: center; position: fixed; z-index: 10;}
    409. 

  409. .detail_content .table_header h1 {margin-top: 12px; margin-left: 15px; font-size: 1.2rem; float: left;}
    410. 

  410. .detail_content .table_header button {float: right; width: 200px; font-size: 2rem; padding: 5px 20px; margin: 20px;}
    411. 

  411. 

  412. /* select.stcd {
    413. 

  413.   float: left;
    414. 

  414.   width: 300px;
    415. 

  415.   height: 60px;
    416. 

  416.   border: 1px solid #000;
    417. 

  417.   font-size: 1.8rem;
    418. 

  418. } */
    419. 

  419. 

  420. .button_bar {width: 100%; height: 47px; background: #ccc; position: fixed; bottom: 0px; z-index: 10;}
    421. 

  421. .button_bar button.col_3{float: left; height: 47px; font-size: 14px; margin: 0; width: 33.3%; font-weight: 100; border: none;}
    422. 

  422. .button_bar button.btn-gray {border-radius: 0px; background-color: #858076; color: #eee;}
    423. 

  423. .button_bar button.btn-gray:active {border:3px solid #858076; background-color: #fff; color:#B7B8B8;}
    424. 

  424. .button_bar button.btn-w-gray{border-radius: 0px; background-color: #b6b8b8; color: #eee;}
    425. 

  425. .button_bar button.btn-w-gray:active{border:3px solid #b6b8b8; background-color: #fff; color:#B7B8B8;}
    426. 

  426. 

  427. .button_bar button.btn {height: 120px;}
    428. 

  428. .button_bar button.btn_col_3 {width: 35%;}
    429. 

  429. .button_bar button.btn_col_6 {width: 65%;}
    430. 

  430. .button_bar button.btn_col_3,
    431. 

  431. .button_bar button.btn_col_6 {border:none; float: left; height: 47px; font-size: 14pt; font-weight: 100; border-radius: 0px;}
    432. 

  432. .button_bar button.col_12 {font-weight:100; width: 100%; height: 47px; font-size: 14pt;}
    433. 

  433. 

  434. /* scroll_area 조정 */
    435. 

  435. .scroll_area {position: relative; top:0; width: 100%; height: 456px;border-bottom:2px solid #000;overflow: auto; background: #fff;}
    436. 

  436. .scroll_area ul {display:grid;}
    437. 

  437. 

  438. 

  439. .col-4{width:35% !important;}
    440. 

  440. .col-6{width:60% !important;}
    441. 

  441. .col-4 .thick{width:100% !important;}
    442. 

  442. .col-6 .thick{width:100% !important;}
    443. 

  443. 

  444. .scroll_area ul.mb_0 {margin-bottom:0 !important;}
    445. 

  445. .scroll_area .itp_non_data {margin:35% auto;}
    446. 

  446. 

  447. .scroll_area li {margin:0; list-style: none; width: 100%; height: 85px; border-bottom: 1px solid #ccc; background-color: #fff;}
    448. 

  448. .scroll_area li.check {background:#f5f6f6;}
    449. 

  449. .scroll_area li.list-row {display: inline-flex; height:76px;}
    450. 

  450. .scroll_area li.list-row2 {height:130px; padding-top:8px;}
    451. 

  451. 

  452. .scroll_area li .left_info {width: calc(100% - 66px); float:left;}
    453. 

  453. .scroll_area li .left_info div {display: inline-block; font-size:14pt;}
    454. 

  454. .scroll_area li .left_info span {font-size: 14pt;}
    455. 

  455. .scroll_area li .left_info label{font-size: 14pt; font-weight:100; margin-left:10px; margin-top:5px;}
    456. 

  456. .scroll_area li .left_info .check_box {padding-top:8px; height:50px; float:left; width:22px;}
    457. 

  457. .scroll_area li .left_info .check_box input[type=checkbox] {width:15px; margin:10px 0 0 7px;}
    458. 

  458. .scroll_area li .left_info .thick {float:left; text-align: left; width: 90%; height:38px; font-weight: 100;}
    459. 

  459. .scroll_area li .left_info .thick .itp_item {color:gray;text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:60%; top:7px; text-align:left; position:relative;}
    460. 

  460. .scroll_area li .left_info .thick .itp_gram {position:relative; top:7px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; color:#aaa; font-size:14pt; text-align:right; width: 85px;}
    461. 

  461. .scroll_area li .left_info .thick .itp_amt {color:#b88278; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:auto; top: 7px; position:relative; text-align:left;}
    462. 

  462. .scroll_area li .left_info .history {font-weight: 700; font-size: 1.1rem; margin-top:-2px;}
    463. 

  463. .scroll_area li .left_info .history input{width: 150px;}
    464. 

  464. .scroll_area li.history_list {height: 140px; padding-top:8px;}
    465. 

  465. .scroll_area li.history_list .btn_check {height:120px; margin-top:-5px; width:90%; float:right; padding-top:7px; }
    466. 

  466. .scroll_area li.history_list .scroll_btn {width:10%; height:130px; margin-top:-5px; display:inline-flex;}
    467. 

  467. 

  468. 

  469. .scroll_area li.history_list1 .button_right {float: right; display: grid;}
    470. 

  470. .scroll_area li.history_list1 .button_right button {width: 50px; height: 60px; font-size: 15px; font-weight:100; margin: 0; border-radius: 0;}
    471. 

  471. 

  472. .scroll_area li.history_list1 {height: 120px;}
    473. 

  473. .scroll_area li.history_list2 {height: 160px; padding-top:5px;}
    474. 

  474. .scroll_area li.history_list2 label{min-width:95px; display:inline-flex;}
    475. 

  475. .scroll_area li.history_list3 {height: 160px; padding-top:5px;}
    476. 

  476. .scroll_area li.history_list3 .btn_check {height:158px; margin-top:-5px; width:90%; float:right; padding-top:7px; }
    477. 

  477. .scroll_area li.history_list4 {height: 150px; padding-top:4px;}
    478. 

  478. .scroll_area li.history_list5 {height: 65px; padding-top:5px;}
    479. 

  479. .scroll_area li.history_list8 {height: 100px; padding-top:5px;}
    480. 

  480. .scroll_area li.history_list6 {height: 110px; padding-top:5px;}
    481. 

  481. .scroll_area li.history_list7 {height: 120px; padding-top:5px;}
    482. 

  482. 

  483. .scroll_area li .history_info {width: auto;}
    484. 

  484. .scroll_area li .left {width:100%; height:28px; margin-top:0px;}
    485. 

  485. .scroll_area li .left div {display: inline-block;}
    486. 

  486. .scroll_area li .left label{font-size: 1.1rem;}
    487. 

  487. .scroll_area li .left .thick {float:left;  margin: 8px 20px; font-size: 1rem; text-align: left; width: 50%; font-weight: 600;}
    488. 

  488. .scroll_area li .left .history {font-weight: 700; font-size: 1.1rem; margin-top:-2px;}
    489. 

  489. .scroll_area li .left .history input{width: 150px;}
    490. 

  490. 

  491. .scroll_area li .detail_line {width: 100%; height:25px; display: inline-block;}
    492. 

  492. .scroll_area li .detail_left {float: left;}
    493. 

  493. .scroll_area li .detail_left .detail_info {margin: 5px 10px;}
    494. 

  494. .scroll_area li .detail_left .detail_info div {width: auto; font-size: 14px; font-weight: 700;}
    495. 

  495. .scroll_area li .detail_left .detail_info i {width: auto; font-size: 1rem; margin: 0 20px;}
    496. 

  496. .scroll_area li .detail_left .detail_info label {position:absolute; width: auto;  font-size: 14px;}
    497. 

  497. .scroll_area li .detail_right {float: right;}
    498. 

  498. .scroll_area li .detail_right .detail_info {margin: 5px 25px;}
    499. 

  499. .scroll_area li .detail_right .detail_info label {margin: 5px 30px; font-size: 2rem;}
    500. 

  500. .scroll_area li .detail_right .detail_info div {width: auto; font-size: 14px; font-weight: 100;}
    501. 

  501. .scroll_area li .detail_right .detail_info i {width: auto; font-size: 1rem; margin: 0 20px;}
    502. 

  502. 

  503. .scroll_area li .left .nomal  {position:relative; left:50%; transform: translateX(-50%); width: 330px; height:28px; float:left; text-align: left; font-size: 1.2rem;}
    504. 

  504. .scroll_area li .left .nomal.btn {width:290px; left:44%; padding:0;}
    505. 

  505. .scroll_area li .left .nomal .half {float:left;}
    506. 

  506. .scroll_area li .left .nomal .half label {min-width:auto;}
    507. 

  507. .scroll_area li .left .nomal .half div {min-width:auto; margin-right:5px; margin-top:0;}
    508. 

  508. .scroll_area li .left .nomal  input{width: 73px; height:28px; top:-5px; position:relative;}
    509. 

  509. 

  510. .scroll_area li .scroll_btn {width:10%; height:158px; margin-top:-5px; display:inline-flex;}
    511. 

  511. 

  512. .scroll_area li .scroll_btn input {width:15px; margin:auto 10px;}
    513. 

  513. .scroll_area li .scroll_btn input:checked ~ .scroll_btn {background:#eee;}
    514. 

  514. .scroll_area li .left .nomal .lit{font-size:11pt;}
    515. 

  515. .scroll_area li .left .nomal div.lit {padding-right:2px;}
    516. 

  516. .scroll_area li .left .nomal span {position:relative; top:-5px; margin:0 2px; font-size:15px; font-weight:700;}
    517. 

  517. .scroll_area li .left .nomal span.mg0 {margin:0;}
    518. 

  518. 

  519. .scroll_area li .left .nomal .btn_bar{position: relative; width: auto; font-size: 2.2rem;}
    520. 

  520. .scroll_area li .left .nomal .btn_bar button{width: 25px; height: 30px; font-size: 1rem; padding: 0;}
    521. 

  521. .scroll_area li .left .nomal .btn_bar .col_0{min-width: auto; margin: 5px 20px;}
    522. 

  522. 

  523. .scroll_area li .left .nomal .m_btn_bar{position: relative; display:inline-flex; width: 100px; height:25px; font-size: 12pt;}
    524. 

  524. .scroll_area li .left .nomal .m_btn_bar button{width: 20px; height: 25px; font-size: 12pt; padding: 0; border:1px solid #E0B8AB; background: #e1cac1; color:#fff;}
    525. 

  525. .scroll_area li .left .nomal .m_btn_bar button div{position:relative; width:10px; top:-2px; left:2px;}
    526. 

  526. .scroll_area li .left .nomal .m_btn_bar .col_0{width: 40px; text-align:center; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB;}
    527. 

  527. 

  528. .scroll_area li .left .nomal label{position:relative; top:-5px; font-size:12pt; font-weight:100; min-width:75px; text-align:left;}
    529. 

  529. .scroll_area li .left .nomal label.sub_info{min-width: auto; display: inline-flex;}
    530. 

  530. 

  531. .scroll_area li .left .nomal label.col_0{min-width: auto;}
    532. 

  532. .scroll_area li .left .nomal label.col_1{min-width: 45px;}
    533. 

  533. .scroll_area li .left .nomal label.col_3{min-width: 60px;}
    534. 

  534. .scroll_area li .left .nomal label.col_2{width: 95px;}
    535. 

  535. 

  536. .scroll_area li .left .nomal i{width: 50px; text-align: center;}
    537. 

  537. .scroll_area li .left .nomal div{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; font-weight: 700; font-size: 12pt; width:73px;}
    538. 

  538. 

  539. .scroll_area li .left .nomal .full{width:240px;}
    540. 

  540. .scroll_area li .left .nomal .col_0{width:auto;}
    541. 

  541. .scroll_area li .left .nomal .col_6{width:60px;}
    542. 

  542. .scroll_area li .left .nomal .col_7{width:74px;}
    543. 

  543. .scroll_area li .left .nomal .col_75{width:75px;}
    544. 

  544. .scroll_area li .left .nomal .col_8{width:80px;}
    545. 

  545. .scroll_area li .left .nomal .col_9{width:90px;}
    546. 

  546. .scroll_area li .left .nomal .col_10{width:100px;}
    547. 

  547. 

  548. 

  549. .scroll_area li .right {margin: 22px 10px 22px 0; position: relative; display: flex; height:30px; font-size: 1.4rem; font-weight: 700; float: right;}
    550. 

  550. .scroll_area li .right .num {padding:2px 22px; width: auto; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB; background:#fff; font-size:14pt;}
    551. 

  551. .scroll_area li .right .fnnum {margin:5px 30px; font-size:14pt;}
    552. 

  552. .scroll_area li .right button {background:#e1cac1; color:#fff; border:1px solid #E0B8AB; padding:0px 7px; font-size: 16px; border-radius: 0px;}
    553. 

  553. .scroll_area li .right button:hover {background:#FCD5C1;}
    554. 

  554. 

  555. /* ITP_FOOTER */
    556. 

  556. #ITP_FOOTER .itp_modal {z-index:10000;}
    557. 

  557. #ITP_FOOTER .itp_modal .modal-header {padding:12px 15px 12px 15px; background:#337ab7; cursor:move;}
    558. 

  558. #ITP_FOOTER .itp_modal .modal-header .close {color:#fff; opacity:1;}
    559. 

  559. #ITP_FOOTER .itp_modal .modal-title {font-size:16px; color:#fff;}
    560. 

  560. #ITP_FOOTER .itp_modal .itp_alert_txt {font-size:15px; padding:15px 0 10px 0;}
    561. 

  561. #ITP_FOOTER .itp_modal .itp_form .form-group {margin-bottom:10px;}
    562. 

  562. #ITP_FOOTER .itp_modal .itp_form .form-control {font-size:13px; color:#333;}
    563. 

  563. #ITP_FOOTER .itp_modal .itp_form .itp_lb {font-size:13px; padding-top:5px; padding-right:0; color:#333; position:relative;}
    564. 

  564. #ITP_FOOTER .itp_modal .itp_form .itp_ip {padding-left:0; padding-right:0;}
    565. 

  565. #ITP_FOOTER .itp_modal .itp_form .itp_ip_offset {padding-left:15px;}
    566. 

  566. #ITP_FOOTER .itp_modal .itp_form .itp_input {height:28px; padding:3px 9px;}
    567. 

  567. #ITP_FOOTER .itp_modal .itp_form .itp_check {margin-top:7px;}
    568. 

  568. #ITP_FOOTER .itp_modal .itp_form select.itp_input  {padding-left:4px; margin-top:-2px;}
    569. 

  569. #ITP_FOOTER .itp_modal .itp_form .itp_btn {padding:4px 10px; background:#fff;}
    570. 

  570. #ITP_FOOTER .itp_modal .itp_form .input-daterange .input-group-addon {padding:3px 5px;}
    571. 

  571. #ITP_FOOTER .itp_modal .itp_form .itp_date_to {background:#fff;}
    572. 

  572. #ITP_FOOTER .itp_modal .itp_form .itp_lb.itp_required:before {content:'*'; color:#a94442; position:absolute; top:8px; left:8px;}
    573. 

  573. #ITP_FOOTER .modal.in .modal-dialog {
    574. 

  574.   -webkit-transform:translate(0, calc(50vh - 50%));
    575. 

  575.   -ms-transform:translate(0, 50vh) translate(0, -50%);
    576. 

  576.   -o-transform:translate(0, calc(50vh - 50%));
    577. 

  577.   transform:translate(0, 50vh) translate(0, -50%);
    578. 

  578. }
    579. 

  579. /* 수발주 결제 테이블 css */
    580. 

  580. #ITP_FOOTER .itp_modal .itp_mg_btm {margin-bottom:0 !important;}
    581. 

  581. #ITP_FOOTER .itp_modal .itp_pd_none {padding:0;} 
    582. 

  582. #ITP_FOOTER .itp_modal .itp_mg_top {margin-top: 10px;} 
    583. 

  583. #ITP_FOOTER .itp_modal .itp_form .itp_mlb {font-size:13px; height:42px; text-align:left; padding:12px 5px 8px 10px; color:#333; border:1px solid #ccc;}
    584. 

  584. #ITP_FOOTER .itp_modal .itp_form .itp_mip {padding: 8px 5px 4px 12px; height:42px; text-align: left; font-size: 16px; border:1px solid #ccc;}
    585. 

  585. 

  586. @media screen and (min-width: 550px) {
    587. 

  587. 	.content .line div.date_to input {width:47%}
    588. 

  588. 	.modal-dialog {margin:auto 20% !important;}
    589. 

  589. 	.scroll_area li .left_info .thick {width: 90%;}
    590. 

  590. 	.content .line .search_wrap select {width:78%;}	
    591. 

  591. 	
    592. 

  592. }
    593. 

  593. @media screen and (min-width: 363px) {
    594. 

  594. 	section .popup2 .content .line.ml_10 {left:20px;}
    595. 

  595. }
    596. 

  596. @media screen and (max-width: 362px) {
    597. 

  597. 	section .popup2 .content .line.mt_5 {top:-40px;}
    598. 

  598. }
    599. 

  599. @media screen and (max-width: 380px) {
    600. 

  600. 	section .popup2 .barcode_area {width: 250px; height: 250px;}
    601. 

  601. /* 	section .popup2 .pop .popup_scroll li .scroll_left .mg_0 {margin:0; width:100px;}
    602. 

  602. 	.type_hide {display:none;}
    603. 

  603. 	section .popup2 .pop .popup_scroll li .scroll_left .mg_0 div {margin:0; padding: 4px 8px 0px 2px;} */
    604. 

  604. }
    605. 

  605. @media screen and (min-width: 630px) {
    606. 

  606. 	.content .line {margin:0 100px -10px 100px;}
    607. 

  607. }
    608. 

  608. @media screen and (max-height: 720px) {
    609. 

  609. 	#ITP_LOGIN {position:fixed; top:80px; max-width: 500px; margin: 0 auto;}
    610. 

  610. 	.bg_gray {position:relative; top:-90px;}
    611. 

  611. 	.scroll_area {height: 58vh;}
    612. 

  612. 	section .popup2 .pop .popup_scroll {height: 65%;}
    613. 

  613. 	}
    614. 

  614. @media screen and (max-height: 550px) {
    615. 

  615. 	section .popup2 .pop .popup_scroll {height: 50%;}
    616. 

  616. }
    617. 

  617. /* 알림 팝업 추가 */
    618. 

  618. .modal {position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; display: none; overflow: hidden; outline: 0;}
    619. 

  619. .itp_modal {z-index: 10000;}
    620. 

  620. .modal-dialog {position: relative; width: auto; margin: 10px; /* top: 50%; transform: translateY(-50%); */}
    621. 

  621. .modal-dialog .line {display:flex;border:1px solid #aaa; border-bottom:none; height:40px;}
    622. 

  622. .modal-dialog .border{border-bottom:1px solid #aaa;}
    623. 

  623. .modal-dialog .border .label_box {height:38px !important;}
    624. 

  624. .modal-dialog .line .label_box {padding:8px; width:100px; height:39px; background:#eee; border-right:1px solid #aaa;}
    625. 

  625. .modal-dialog .line .label_box label {font-size:14px; font-weight:100;}
    626. 

  626. .modal-dialog .line .info_box {width: calc(100% - 100px); padding:10px; display:flex;}
    627. 

  627. .modal-dialog .line .info_box .email {width:30%;}
    628. 

  628. .modal-dialog .line .info_box input{position:relative; top:-4px; width:100%; height:27px; margin:0;}
    629. 

  629. .modal-dialog .line .info_box select{position:relative; top:-4px; width:100%; height:27px;}
    630. 

  630. .modal-dialog .line .info_box div{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:100%; text-align:left; font-size:14px; font-weight:100;}
    631. 

  631. .modal-content {position: relative; background-color: #fff; background-clip: padding-box; border: 1px solid #999; border: 1px solid rgba(0,0,0,.2); border-radius: 6px; outline: 0; box-shadow: 0 3px 9px rgb(0 0 0 / 50%);}
    632. 

  632. .modal-header {min-height: 16.43px; padding: 15px; border-bottom: 1px solid #e5e5e5; color:#fff; padding: 12px 15px 12px 15px; background: #337ab7; cursor: move;}
    633. 

  633. .modal-header .close { margin-top: -2px; color: #fff; opacity: 1;}
    634. 

  634. button.close {-webkit-appearance: none; padding: 0; cursor: pointer; background: 0 0; border: 0;}
    635. 

  635. .close {float: right; font-size: 21px; font-weight: 700; line-height: 1; text-shadow: 0 1px 0 #fff;}
    636. 

  636. .modal-body {position: relative; padding: 15px; }
    637. 

  637. .modal-body .text_area{padding-bottom:20px; }
    638. 

  638. .modal-footer {padding: 15px; text-align: right; border-top: none;}
    639. 

  639. .modal-footer .pop_btn_bar {float:right; margin-top:12px;}
    640. 

  640. .modal-footer .btn {border-radius:6px; padding: 6px 12px;}
    641. 

  641. 

  642. 

  643.