/* @font-face {
    font-family: 'GmarketSansMedium';
    src: url("../main/webapp/mobile/fonts/KoPubWorld Dotum Medium.ttf") format('woff');
} */
/* @font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
} */
* {margin: 0; padding: 0;letter-spacing: -1px; box-sizing: border-box; text-align: center; font-family: 'KoPub Dotum', 'serif'; list-style: none;}
section {}
form.area_full{display:flex; flex-direction:column; height:calc(100vh - 49px);}
form.put_btn{display:flex; flex-direction:column; height:calc(100vh - 93px);}/* 96px */
body{background: #fff; position: relative; width: 100%; height: 100%; font-family: 'KoPub Dotum';
	overflow:scroll-y; 
	-webkit-overflow-scrolling:touch;}
body .login {position:fixed;}
.color-gray {color:#aaa;}
/* 팝업 */
section .popup {position: absolute; top:0; width: 100%; height: 100vh; background: transparent; z-index: 11;}
section .popup .pop {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 70%; height: 360px; padding-top: 20px; background: #fff; border: 1px solid #000; border-top-left-radius: 10px; border-top-right-radius: 10px;}
section .popup .pop.short {height:260px;}
section .popup .pop label.pop_label {position:relative; top:10px; font-size: 16px;}
section .popup .pop div.pop_msg {padding:0 5%; text-align:left; position:relative; top:10px; font-size: 16px;}
section .popup .pop .pop_line {width: 90%; margin:0 5%; display:flex; border:1px solid #aaa; border-bottom:none;}
section .popup .pop .pop_line.border {border-bottom:1px solid #aaa;}
section .popup .pop .pop_line .itp_label_area {height:35px; padding:8px; width:100px; margin:0; background:#eee; border-right:1px solid #aaa;}
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: 40px; border-top: 1px solid #000;}
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;}
section .popup .pop .popup_btn button.ok { width: 64%; border-left: 1px solid #000;}
section .popup .pop .popup_btn button.cancel {width: 36%;}


section .popup2 {position: absolute; top:0; width: 100%; height: 100vh; background: rgba(200, 200,200, 0.8); z-index: 11;}
section .popup2 .content {position: fixed; z-index: 10; width:100%; background: #fff;}
section .popup2 .barcode {width: 100%;}
section .popup2 .barcode_area {width: 300px; height: 300px; margin: auto; background: #fff; border: 1px solid #000; margin-top: 10%;}
section .popup2 .barcode h1{text-align: left; width: 85%; font-size: 16px; margin:auto; margin-top: 50%;}
section .popup2 .btn_barcode {margin-top: 20%;}
section .popup2 .btn_barcode button {width: 35%; height: 40px; font-size: 15px; font-weight:100;}
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;}
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: 16px; 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; margin:3px -5px;}
section .popup2 .pop .header .header_right button img {width:22px;}
section .popup2 .pop .select_btn {position:relative; width:100%; height: 63px;}
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;}
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;}
section .popup2 .pop .select_btn button.btn_blue:active{background-color: #708cd1;}
section .popup2 .pop .select_btn img {width:12px;}
section .popup2 .pop .search_bar {width: 90%; height: 60px; margin:0 auto; padding:10px;}
section .popup2 .pop .search_bar input {width: 80%; height: 27px; position:relative; font-size:14px;}
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;}
section .popup2 .pop .search_bar button img {width: 17px; position:relative; top:-1px;}
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; position: relative; top:-40px; display:flex;}
section .popup2 .pop .search_item_bar input {width:40%; height:27px; border-radius:5px; margin:0; font-size:12px;}
section .popup2 .pop .search_item_bar select {width:22%; height:27px; padding:0 15px 0 0; border-radius:5px; margin-right:5px;}
section .popup2 .pop .search_btn_bar {width:100%; height:50px; margin-top:-30px; margin-right:10px;}
section .popup2 .pop .search_btn_bar .btn_right {float:right; margin-right:10px;}
section .popup2 .pop .search_btn_bar .btn_right button img{width:18px; height:18px; margin-right:2px;}
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;}

section .popup2 .pop .table{width:98%; margin:0 auto; border:1px solid #aaa; border-bottom:none; border-left:none; border-right:none;}
section .popup2 .pop .table .table_tr {display:flex;}
section .popup2 .pop .table .table_tr .tabel_th{width:23%;; height:30px; border-left:1px solid #aaa; background:#eee;}
section .popup2 .pop .table .table_tr .tabel_th label {font-size:14px; padding-top:5px; font-weight:100;}
section .popup2 .pop .table .table_tr .tabel_th .chkAll {margin:-5px; width:15px;}
section .popup2 .pop .m_table_body{width:100%; height:333px; margin:0 auto; overflow:auto;}
section .popup2 .pop .m_table_body .table_body{}
section .popup2 .pop .m_table_body .table_body::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}
section .popup2 .pop .table_tr {display:flex; height:31px; border-bottom:1px solid #aaa; border-right:1px solid #aaa;}
section .popup2 .pop .table_tr .table_td{display:grid; width:23%; height:30px; padding-top:5px; border-left:1px solid #aaa; background:#fff;}
section .popup2 .pop .table_tr .table_td div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:100%; font-size:12px; font-weight:100;}
section .popup2 .pop .table_tr .table_td .chkItem {margin-top:-5px; width:15px; left:50%; position:relative; transform:translateX(-50%);}

section .popup2 .pop .popup_scroll ul.mb_0 {margin-bottom:0 !important;}
section .popup2 .pop .popup_scroll {position: relative; top:-25px; width: 100%;height: 70%; overflow: auto; border-top:1px solid #E0B8AB; border-bottom:1px solid #E0B8AB;}
section .popup2 .pop .popup_scroll li {list-style: none; width: 100%; height: 50px; border-bottom: 1px solid #E0B8AB;}
section .popup2 .pop .popup_scroll li.row_2 {height: 70px; display:flex;}

section .popup2 .pop .popup_scroll li .left {position: relative; float: left;}
section .popup2 .pop .popup_scroll li .left .check_box {width:30px; float:left; height:80px; padding-left:5px; padding-top:20px;}
section .popup2 .pop .popup_scroll li .left div {display: inline-block;}
section .popup2 .pop .popup_scroll li .left label{font-size: 2.5rem;}
section .popup2 .pop .popup_scroll li .left .thick {float: left; margin: 12px 0 0 10px; font-size: 1rem; text-align: left; width: 94px; font-weight: 600;}
section .popup2 .pop .popup_scroll li .left .nomal {float: left; margin: 15px 0px 0px 15px; font-size: 1.2rem; text-align: left; width: 100%;}
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; width: calc(100% - 63px);}
section .popup2 .pop .popup_scroll li .scroll_left.item{float: left; display:grid; width: calc(100% - 141px);}
section .popup2 .pop .popup_scroll li .scroll_left div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; float: left; font-size: 14pt; font-weight: 100; width: 80%; margin:8px 6px -6px 10px;}
section .popup2 .pop .popup_scroll li .scroll_left .con_2 {padding-top:0px;}
section .popup2 .pop .popup_scroll li .scroll_left .pop_flex {display:flex; width:96%;}
section .popup2 .pop .popup_scroll li .scroll_left .pop_flex label {min-width:70px; text-align:left;}
section .popup2 .pop .popup_scroll li .scroll_left .pop_flex span {width:10px;}
section .popup2 .pop .popup_scroll li .scroll_left .pop_flex div {width:calc(100% - 80px); margin:0;}
section .popup2 .pop .popup_scroll li .scroll_left .pop_flex div.col_0 {width:auto;}
section .popup2 .pop .popup_scroll li .scroll_left .pop_flex div.text_2 {width:calc(100% - 200px); margin:0;}
section .popup2 .pop .popup_scroll li .scroll_left .mg_0 {margin:0; width:100%;}
section .popup2 .pop .popup_scroll li .scroll_left .mg_0 div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:47%; margin:0; padding: 8px 2px 0px 2px;}
section .popup2 .pop .popup_scroll li .scroll_left .mg_0 .type_hide {width:auto;}
section .popup2 .pop .popup_scroll li .scroll_left .sub{font-size:14pt; color:gray; text-align:right; }
section .popup2 .pop .popup_scroll li .scroll_left .wichi{font-size:14pt; color:gray;}
section .popup2 .pop .popup_scroll li .scroll_left .amt{font-size:14pt; color:#b88278;}
section .popup2 .pop .popup_scroll li .scroll_right {float: right; width:50px;}
section .popup2 .pop .popup_scroll li .scroll_right input[type=checkbox]{width:27px; margin:18px 11px 0 11px;}
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 0px;}
section .popup2 .pop .popup_scroll li .scroll_right button:hover {background:#708cd1;}
section .popup2 .pop .popup_scroll li .right {position: relative; display: flex; font-size: 1.6rem; font-weight: 700; float: right; top:21px; width:91px; height:27px;}
section .popup2 .pop .popup_scroll li .right button {padding: 0px; font-size: 17px; width:24px;}
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: 35%; height: 35px;font-size: 14px; font-weight:100; padding-top: 7px; margin: 0 10px;}
section .popup2	.list_line {width:98%; float:left; height:40px;display: inline-flex; margin:0 1%; font-size:12px;}
section .popup2 .border {border-bottom: 1px solid #000 !important;}
section .popup2 .list_line .list_label {width:30%;border:1px solid #000; height:40px; padding-top:10px; border-bottom:none; background:#eee;}
section .popup2 .list_line .list_label label{font-size:12pt;}
section .popup2 .list_line .list_info {width:70%;height:40px; border:1px solid #000; padding-top:10px; border-left:none; border-bottom:none;}
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-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; padding-left:10px; font-size:12pt; width:100%; }
section .popup_scroll li .right .num {padding:2px 0px; width: 43px; 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 .popup_scroll li .right button:hover {background:#FCD5C1;}
section .popup_scroll li .right button:checked {background:#ccc;}
section .popup2 .list_line .line_right {float:right; width:70%;}
section .popup2 .list_line .line_right select {width:200px; float:right; height:34px; margin-top:4px;}
section .popup2 .list_line .line_right input {width:200px; float:right;}
section .popup2 .list_line .info{width:30%; padding-top:8px; padding-left:20px; text-align:left; font-size:12pt;}

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

section .popup2 .search .left button,
section .popup2 .search .right button {width:100%;}
section .popup2 .content .line .search_wrap input {float:right; width:50%; margin-right:0px; margin-top:0;}
section .popup2 .content .line.mt_5 {margin-top:5px; width:300px;}
section .popup2 .content .line.ml_10 {}
section .popup2 .content .line .search_wrap select {float:right; width:50%; height:34px; margin-right:0px;}


section .popup3 {position: absolute; top:0;width: 100%; height: 100vh; background: transparent; z-index: 11;}
section .popup3 .content {position: fixed; z-index: 10; width:100%; height:596px; background: #fff;}
section .popup3 .content label{width:120px; margin-top:7px;}
section .popup3 .content div{font-weight:100;}
section .popup3 .pop { position: absolute; top: 37%; left: 50%; transform: translate(-50%,-40%); width: 90%; height: 85%; background: #fff; border: 2px solid #000;}
section .popup3 .pop .header {position: relative; height: 50px; background: rgb(204, 225, 240); border-bottom: 1px solid #000;}
section .popup3 .pop .header .header_left {float: left; padding-top: 5px; padding-left: 20px;}
section .popup3 .pop .header .header_left label {font-size: 1.4rem;} 
section .popup3 .pop .header .header_right {float: right; padding-right: 10px;}
section .popup3 .pop .header .header_right button {border: none; background: transparent;}
section .popup3 .pop .header .header_right button img {width:30px; height:30px;}
/* 버튼 */
button {background-color: #fff; padding: 10px;}
button.btn-primary  {color: #fff; background-color: #8f9fc6; border: 1px solid #cacfe3;}
button.btn-primary:active{background-color: #708cd1;}
button.btn-yellow   {color: #fff; background-color: #f9c03c; border: 1px solid #cacfe3;}
button.btn-m-orange	{color: #fff; background-color: #f0831e; border: 1px solid #cacfe3;}
button.btn-m-orange:hover {border:3px solid #f0831e !important; background-color: #fff; color:#B7B8B8;}
button.btn-gray     {color: #fff; background-color: #a89d9c; border: 1px solid #cacfe3;}
button.btn-danger   {color: #fff; background-color: #c8989d; border: 1px solid #cacfe3;}
button.btn-green	{color: #fff; background-color: #5cb85c; border: 1px solid #cacfe3;}
button:hover {background: rgb(229, 248, 202); color: #000;}

/* 실행,로딩 */
body.eee {height: 700px; background: #eee;}
.app_run {background: #ccc; width: 100%; height: 100%;}
.app_run .loding .start {position: absolute; width: 100%; top: 20%;}
.app_run .loding .start h2 {font-size: 1rem;}
.app_run .loding .start h1 {font-size: 2rem;}
.app_run .loding .cap {position: absolute; width: 100%; top: 50%; transform: translateY(50%);}
.app_run .loding .cap h3 {font-size: 1rem; color: #666;}
.brand_name {position: absolute; width: 100%; bottom: 0%; font-size: 1.6rem;}

/* 업그레이드 , */
.upgrade { padding-top: 50%;}
.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;}
.upgrade .info h1 { position: relative; font-size: 1rem; margin: 5px; top: 20%;}
.upgrade .info h2 { position: relative; font-size: 0.8rem; margin: 5px; top: 30%;}
.upgrade .btn { position: relative; display: block; background-color: #fff; margin: 0 auto; width: 70%; height: 50px;}
.upgrade .btn button {border-radius: 0px;position: relative;border: 1px solid #000; padding: 0; float: left;display: block;height: 50px;font-size: 1.2rem;}
.upgrade .btn .info_btn1 button{border-right: none;width: 35%;color: #000;background-color: #f5f5f5;}
.upgrade .btn .info_btn2 button {width: 65%;color: #ccc;background-color: blue;}

/* 로그인 */
.bg_gray {width:100%; height:180px; background:#ecebea; border-bottom-left-radius:50%; border-bottom-right-radius:50%;}
#ITP_LOGIN {
    transform: translateX(-50%);
    max-width: 500px;
    height:100%;
    left: 50%;
    position: fixed;}
#ITP_LOGIN .login_popup {position: relative; width: 350px; text-align: center;}
#ITP_LOGIN .login_popup h1 { font-size: 1.5rem; color: #333; font-weight: 700;}
#ITP_LOGIN .login_popup input { position: relative; height: 30px; font-size: 2.2rem;}
#ITP_LOGIN .login_popup .login_info {position:relative; top:-50px;}
#ITP_LOGIN .login_popup .login_info img {width:100px; margin-bottom:10px;}
#ITP_LOGIN .login_popup .num_area { position: relative; width: 100%;  margin-bottom: 40px;}
#ITP_LOGIN .login_popup .num_area .input_area {margin-bottom: 10px;}
#ITP_LOGIN .login_popup .num_area .input_area input {width:50%; font-size: 0.8rem; }
#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;}
#ITP_LOGIN .login_popup .itp_del_btn.reg_no {width:50px; right:123px; top:4px;}
#ITP_LOGIN .login_popup .itp_del_btn.reg_no button {width:45px; border:none; background:transparent;}
#ITP_LOGIN .login_popup .itp_del_btn {position:absolute; top:12px; right:66px; background:transparent;}
#ITP_LOGIN .login_popup .itp_del_btn button {width:25px; border:none; padding:0; background:transparent;}
#ITP_LOGIN .login_popup .itp_del_btn button img{width:18px;}
#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;}
#ITP_LOGIN .login_popup .num_area .brand_list select option {text-align: left; width: 70%; height: 50px; border: 1px solid #000; font-size: 20px;} 

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

#ITP_LOGIN .input_area {position: relative; width: 100%;  margin-bottom: 10px;}
#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;}
#ITP_LOGIN .input_area label {position: absolute; left: 18%; top: 14px; font-size: 15px; transition: all .5s ease; color:#666;}
#ITP_LOGIN .input_area input:focus + label,
#ITP_LOGIN .input_area input:valid + label {top: 4px; left: 18%; font-size: 0.6rem; color: blue;}
#ITP_LOGIN .error {margin: 0 auto; height:70px;}
#ITP_LOGIN .error label {font-size: 1rem;}
#ITP_LOGIN .login_btn {position: relative; top: -20px; left: 0;}
#ITP_LOGIN .login_btn button {
  font-weight: nomal;
  border:3px solid #fbd896; border-radius: 10px;
  color: #eee;
  background-color: #f7b014;
  width: 70%;
  height: 50px;
  font-size: 20px;
}

/* 메인화면 */


@media screen and (min-width:300px) and (max-width:430px) {
  .footer button {margin: 0 15px;}
}

.main {margin-top: 70px; height: 500px;}
.main .wicon label {font-size: 1.2rem;}
.main .wicon {width: 380px; margin: 0 auto;}
.main .wicon  button {border: 1px solid #333; margin: 8px 20px; background-color: #ccc; width: 150px; height:150px;border-radius: 30px;}
.main .wicon .icon_left {float: left;}


input {font-size:14px; margin-top: 3px; border: 1px solid #aaa; border-radius:4px; height: 34px;text-align: left; padding:0 10px;}
input[type="date"]::-webkit-calendar-picker-indicator {display:none;}

select {border: 1px solid #aaa; border-radius:5px; height: 35px; font-size: 12px; text-align: left; padding:0 10px;}
input .day {margin: 18%; width: 45%; height: 80px; float: right;}

/* 공통화면 */

#ITP_WRAPPER header {position: fixed;top: 0;width: 100%;height: 49px;background-color:#F7B014;align-items: center; z-index: 11;}
#ITP_WRAPPER header .header_wrap {width: 100%; height: 49px; margin: 0 auto; display: inline-flex;}
#ITP_WRAPPER header .header_wrap .menu_logo {width:80px; height:49px;}
#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;}
#ITP_WRAPPER header .header_wrap .menu_logo button img {width: 22px; height: 18px; margin: 0; border-radius: 0; border: none;}
#ITP_WRAPPER header .header_wrap img.brand {float: right; height: 45px; margin: 5px; border-radius: 50%; border: 1px solid #666;}
#ITP_WRAPPER header .header_wrap label{ margin-top: 15px; width: 50px; height: 25px; font-size: 1rem;float: left; color: #fff;}
#ITP_WRAPPER header .header_wrap .name_info {width: calc(100% - 120px); height:49px; display:inline-flex;}
#ITP_WRAPPER header .header_wrap .name_info .bn {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding-top:0; text-align:right; width:50%; height:22px; font-size:18px;}
#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: 50%; font-size: 15px; color:#fff; margin-top:14px;}

#ITP_WRAPPER header .header_wrap .logout {float: right; width: 40px;}
#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;}
#ITP_WRAPPER header .header_wrap .logout button img {width:17px; height:18px;}

/* 메뉴바 */
#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;}
#ITP_MENU .menu_area button {float: right; width: 50px; height: 50px; padding: 0; background: transparent; border: none;}
#ITP_MENU .menu_area button img {float: right; width: 40px; height: 40px; margin: 7px;}
#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;}
#ITP_MENU .menu_bar .menu_header {width: 100%; height: 100px; border-bottom: 1px solid #000 ;}
#ITP_MENU .menu_bar .menu_header .brand_img {position: absolute; width: 50px; height: 50px; margin: 20px 0 0 20px;}
#ITP_MENU .menu_bar .menu_header .brand_img img {width: 50px; height: 50px; border: 1px solid #000; border-radius: 5px;}
#ITP_MENU .menu_bar .menu_header .user_info {position: absolute; width: 120px; margin-left: 70px; margin-top: 20px; float: left;}
#ITP_MENU .menu_bar .menu_header .user_info div {position: absolute; width: 70px; margin-right: 10px; font-weight: 700;}
#ITP_MENU .menu_bar .menu_header .user_info div.id {font-weight: normal; color: #666; margin-left: 10px; margin-top: 5px;}
#ITP_MENU .menu_bar .menu_header .user_info label {width: auto; margin-left: 58px;}
#ITP_MENU .menu_bar .menu_header .setting {float: right;}
#ITP_MENU .menu_bar .menu_header .setting button {width: 30px; height: 30px; padding: 0; background: #666; border-radius: 5px; margin: 30px 20px 0 0;}
#ITP_MENU .menu_bar .menu_header .setting button img {width: 20px; height: 20px;}


/* ITP_SIDEBAR */
#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;}
#ITP_SIDEBAR.itp_open_nav {width: 100%; height: 100%;}
#ITP_SIDEBAR .itp_nav {list-style:none; margin:0; padding:0; height:80%; overflow-y:scroll; overflow-x:hidden; visibility:hidden;}
#ITP_SIDEBAR.itp_open_nav .itp_nav {visibility:visible;}
#ITP_SIDEBAR.itp_open_nav .itp_nav::-webkit-scrollbar{display:none;}
#ITP_SIDEBAR .itp_nav.panel-group .panel+.panel {margin-top:0;}
#ITP_SIDEBAR .itp_nav .panel-heading {padding:0;}
#ITP_SIDEBAR .itp_nav .panel-title {line-height:1.1; border-bottom:1px solid #ddd;}
#ITP_SIDEBAR .itp_nav .panel-title a {font-size:20px; display:block; padding:13px 15px; color:#333; text-decoration: none;}
#ITP_SIDEBAR .itp_nav .panel-title a .glyphicon {font-size:12px;}
#ITP_SIDEBAR .itp_nav .panel-default {margin-bottom:0; border:none;}
#ITP_SIDEBAR .itp_nav * {border-radius:0; border-width:1px 0 1px 0;}

#ITP_SIDEBAR .itp_nav .itp_svgs_body {padding:0; border-top:0; border-bottom:1px solid #ddd;}
#ITP_SIDEBAR .itp_nav .itp_svgs {display:flex; align-content:flex-start; flex-direction:column; flex-wrap:wrap; overflow:auto;}
#ITP_SIDEBAR .itp_nav .itp_svgs .itp_svg_in {position:relative;}
#ITP_SIDEBAR .itp_nav .itp_svgs li {width:100%; height:40px; border-top: 1px solid #ddd;}
#ITP_SIDEBAR .itp_nav .itp_svgs li:first-child {border-top:none;}
#ITP_SIDEBAR .itp_nav .itp_svgs li a {display:block; width:100%; color:#333; padding:10px 10px 5px 17px;}
#ITP_SIDEBAR .itp_nav .itp_svgs li:first-child a {padding-top:11px;}
#ITP_SIDEBAR .itp_nav .itp_svgs li:last-child a {padding-bottom:10px;}
#ITP_SIDEBAR .itp_nav .itp_svgs li a:hover, #ITP_SIDEBAR .itp_nav .itp_svgs li a:active {color:#000; font-weight:bold;}
#ITP_SIDEBAR .itp_nav .itp_svgs li a .glyphicon {font-size:9px; float:left; margin:2px 6px 0 0;}
#ITP_SIDEBAR .itp_nav .itp_svgs li a .itp_icon {font-size:9px; float:left; margin:4px 6px 0 15px;}
#ITP_SIDEBAR .itp_nav .itp_svgs li a .itp_icon_5 {font-size:9px; float:left; margin:4px 6px 0 25px;}
#ITP_SIDEBAR .itp_nav .itp_svgs li a .itp_tt {float:left; font-size:11pt;}

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

/* 컨텐츠 화면 */


#ITP_CONTAINER.fix {
  position:fixed;
  width: 100%;
  padding-top: 49px;
  font-size: 16px;
}
.content {position: fixed; display:contents; z-index: 10; width:100%; background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
.content .content_fix {background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
.content .content_inside {background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
.content .header {width:100% !important; margin:0 !important;}
.content .line {position: relative; display: inline-block; width: 332px; margin:0 auto; height: 40px; margin-bottom: -10px;}
.content .line.mt5 {margin-top:5px;}
.content .line.top6 {top:6px;}
.content .line.top9 {top:9px;}
.content .line.top12 {top:12px;}

.content .line .pop_right {width:50%; height:46px; float:right;}
.content .line .pop_right div {float:right; margin-right:10px; padding-top:8px; text-align:right; font-size:16px;}
.content .line .search_wrap input {float:right; width:50%; margin-right:10px;}
.content .line .search_wrap select {float:right; width:50%; height:27px; margin-right:10px;}
.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;}
.content .line div.itp_search_header img{width:14px; top:-2px; position:relative;}
.content .line label {min-width:125px; color:#898989; font-size: 14pt; float: left; text-align: left; margin-top: 7px; font-weight:100;}
.content .line label.pay_label {margin:20px 1%; width:98%;}
.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;}
.content .line .itp_label_select {padding:0;width:120px; height:34px; color:#666; font-size: 14pt; float: left;  margin:3px 5px 3px 0; font-weight:100; border:1px solid #aaa; border-radius:5px;}
.content .line .float_left {float: left; width:168px;;}
.content .line .float_left.name {width:62%;}
.content .line .float_left button {float:right; left:-2px; top:-2px; position:relative; background:transparent; border:none; width:34px; height:34px; padding:0;} 
.content .line .float_left button img {width:18px;}
.content .line .float_left input {width:100%; font-size:12pt; text-overflow:ellipsis; padding-right:22px;}
.content .line .float_left input::placeholder {color:#bbb; font-size:10pt;}
.content .line .float_left.note {width: 100%; padding: 10px;}
.content .line .float_left.note textarea {width: 100%; height: 100px; border: 1px solid #aaa; text-align: left; font-size:14px;}
.content .line .float_left div {font-size: 14pt; margin-top: 4px; margin-right:8px; text-align:right; font-weight:100;}
.content .line .float_left .input_text {background: #fff; width: 100%; height: 34px; border: 1px solid #aaa; margin-top: 3px; border-radius: 4px;}
.content .line .float_left .itp_input_btn {top:5px; margin:0; position:absolute; width:168px;}
.content .line .float_right_btn {float: left; margin-top: 3px; margin-left: 5px;}
.content .line .float_right_btn button {padding:0; width:34px; height:34px; 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: 34px; margin-top:3px; border: 1px solid #aaa; border-radius:5px; font-size: 14pt; font-weight:100;}
.content .line .line_right {float: right; margin-right: 0%; width:200px;}
.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;}
.content .line .line_right input {position: relative; text-align: center; font-size:12pt; width:100%;}
.content .line .line_right input.m9 {margin-right:93px;}
.content .line .line_right input.left {text-align: left;}
.content .line .line_right input.mg0 {margin-right:10px;}
.content .line .line_right input.date{width:140px; margin-right:132px; height:35px;} 
.content .line .line_right select {float: right; width: 180px; height: 30px; margin-top: 7px; border: 1px solid #000; font-size: 1rem; margin-right:93px;}
.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}
.content .line input.full {width: 100%;}
.content .line div.date_to {display:flex; width:62%; height:34px; float: left; margin-right:0px; margin-top:3px;}
.content .line div.date_to input {font-weight:100; width:47%; height:34px; font-size:11pt; padding:0 24px 0 3px; margin:0;}

.content .line div.date_to div.at {width: 6%;  font-size: 16px; padding-top:12px; float: right;}
.content .line .search {width: 100%; height: 50px; padding-top:12px;}
.content .line .search button {width: 40%; height: 27px; font-size: 12px; font-weight:100; padding: 0;}
.content .line .search button.col_3 {width: 25%; height:30px; margin:0 10px;}
.content .list_line {width:98%; float:left; height:50px;display: inline-flex; margin:0 1%; font-size:12px;}
.content .border {border-bottom: 1px solid #000 !important;}
.content .list_line .list_label {width:30%;border:1px solid #000; height:50px; padding-top:14px; border-bottom:none; background:#eee;}
.content .list_line .list_label label {font-size:12pt;}
.content .list_line .list_info {width:70%;height:50px; border:1px solid #000; padding-top:15px; border-left:none; border-bottom:none;}

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

.content .list_line .mail input {width:30%;}
.content .list_line .mail select {width:30%; height:34px; font-size:14px; border: 1px solid #aaa;border-radius: 5px;}
.content .list_line .list_info .pay_info {text-align:left; padding-left:17px; font-size:12pt;}
.content .table_header {margin-top: 6px; width: 100%; height: 36px;}
.content .table_header h1 {margin-left: 15px; margin-top:16px; margin-bottom:0; font-size: 13px; float: left; color: #000; font-weight: 100;}
.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;}
.detail_content {top: 0px; position: fixed; display:contents; z-index: 10; width:100%; background: #fff;}
.detail_content .detail_content_fix {background: #f5f6f6; border-bottom:1px solid #E0B8AB;}
.detail_content .detail_header {width: 330px; height: 50px; margin:0; left:50%; position:relative; transform:translateX(-50%);}
.detail_content .detail_header .detail_logo {float: left; margin-top:7px;}
.detail_content .detail_header .detail_logo img {width: 35px; margin-left: 10px;}
.detail_content .detail_header .detail_ok {float: left; margin-top:10px;}
.detail_content .detail_header .detail_ok label {margin-left: 72px; font-size: 14pt; font-weight: 700;}
.detail_content .detail_confirmation {height: 190px; margin-top:5px;}
.detail_content .detail_confirmation .detail_col {left:50%; position:relative; transform:translateX(-50%); float: left; width: 330px; height:20px; margin-bottom:11px; display: flex;}
.detail_content .detail_confirmation .detail_col label{font-size: 12pt; font-weight: 700; float: left; width: auto; text-align: left; min-width:78px;}
.detail_content .detail_confirmation .detail_col i{font-size: 12pt; font-style:normal; width: 1%; text-align: right; margin-right: 10px;}
.detail_content .detail_confirmation .detail_col div{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; font-size: 12pt; width: 210px; text-align: left;}
.detail_content .detail_company_info {width: 330px;left: 50%; position: relative; transform: translateX(-50%); height:150px; margin-top:5px;}
.detail_content .detail_company_info label{font-size: 11pt; font-weight: 600; width: auto; text-align:left;}
.detail_content .detail_company_info .weight {width:50px; margin:0 auto;}
.detail_content .detail_company_info .weight label{font-size: 13pt; font-weight: 700;}
.detail_content .detail_company_info div{font-size: 11pt; width:120px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left;}
.detail_content .detail_company_info .info_left {width: 165px; height: 150px; float: left;}
.detail_content .detail_company_info .info_left .company_info {width: 100%; float: left; display: flex; margin-left: 0px; margin-top:3px;}
.detail_content .table_header {margin-top: 6px; width: 100%; height: 36px;}
.detail_content .table_header h1 {margin-left: 15px; margin-top:16px; margin-bottom:0; font-size: 13px; float: left; color: #000; font-weight: 100;}
.detail_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;}

/* select.stcd {
  float: left;
  width: 300px;
  height: 60px;
  border: 1px solid #000;
  font-size: 1.8rem;
} */

.button_bar {width: 100%; height: 47px; background: #ccc; position: fixed; bottom: 0px; z-index: 10;}
.button_bar button.col_3{float: left; height: 47px; font-size: 14px; margin: 0; width: 33.3%; font-weight: 100; border: none;}
.button_bar button.btn-gray {border-radius: 0px; background-color: #858076; color: #eee;}
.button_bar button.btn-gray:active {border:3px solid #858076; background-color: #fff; color:#B7B8B8;}
.button_bar button.btn-w-gray{border-radius: 0px; background-color: #b6b8b8; color: #eee;}
.button_bar button.btn-w-gray:active{border:3px solid #b6b8b8; background-color: #fff; color:#B7B8B8;}

.button_bar button.btn {height: 120px;}
.button_bar button.btn_col_3 {width: 35%;}
.button_bar button.btn_col_6 {width: 65%;}
.button_bar button.btn_col_3,
.button_bar button.btn_col_6 {border:none; float: left; height: 47px; font-size: 14pt; font-weight: 100; border-radius: 0px;}
.button_bar button.col_12 {font-weight:100; width: 100%; height: 47px; font-size: 14pt; border:none;}

/* scroll_area 조정 */
.scroll_area {position: relative; top:0; flex:1; width: 100%; height: 456px; overflow: auto; background: #fff;}
.scroll_area ul {display:grid;}


.col-4{width:35% !important;}
.col-6{width:60% !important;}
.col-4 .thick{width:100% !important;}
.col-6 .thick{width:100% !important;}

.scroll_area ul.mb_0 {margin-bottom:0 !important;}
.scroll_area .itp_non_data {margin:35% auto;}

.scroll_area li {margin:0; list-style: none; width: 100vw; height: 85px; border-bottom: 1px solid #ccc; background-color: #fff;}
.scroll_area li.check {background:#f5f6f6;}
.scroll_area li.list-row {display: inline-flex; height:76px;}
.scroll_area li.list-row2 {height:130px; padding-top:8px;}

.scroll_area li .left_info {width: calc(100% - 66px); float:left;}
.scroll_area li .left_info.item {width: calc(100% - 120px); float:left;}
.scroll_area li .left_info div {display: inline-block; font-size:14pt;}
.scroll_area li .left_info .slash {width:calc(100% - 98px);}

.scroll_area li .left_info span {font-size: 14pt;}
.scroll_area li .left_info label{width:60px; font-size: 14pt; font-weight:100; margin-top:5px;}
.scroll_area li .left_info label.two{width:84px;}
.scroll_area li .left_info .check_box {padding-top:8px; height:50px; float:left; width:22px;}
.scroll_area li .left_info .check_box input[type=checkbox] {width:15px; margin:10px 0 0 7px;}
.scroll_area li .left_info .thick {float:left; text-align: left; width: 90%; height:38px; font-weight: 100;}
.scroll_area li .left_info .thick .itp_item {color:gray;text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width:calc(100% - 81px); top:7px; text-align:left; position:relative;}
.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;}
.scroll_area li .left_info .thick .auto {width:auto; float:left;}
.scroll_area li .left_info .thick .itp_amt {color:#b88278; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width: calc(100% - 105px); top: 7px; position:relative; text-align:left;}
.scroll_area li .left_info .thick .amt_wd {width:calc(100% - 95px);}
.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;}
.scroll_area li.history_list {height: 140px; padding-top:8px;}
.scroll_area li.history_list .btn_check {height:120px; margin-top:-5px; width:90%; float:right; padding-top:7px; }
.scroll_area li.history_list .scroll_btn {width:10%; height:130px; margin-top:-5px; display:inline-flex;}


.scroll_area li.history_list9 .button_right {float: right; display: grid;}
.scroll_area li.history_list9 .button_right button {width: 45px; height: 85px; font-size: 10pt; font-weight:100; margin: 0; padding:0; border-radius: 0;}

.scroll_area li.history_list1 {height: 120px;}
.scroll_area li.history_list2 {height: 160px; padding-top:5px;}
.scroll_area li.history_list2 label{min-width:95px; display:inline-flex;}
.scroll_area li.history_list3 {height: 160px; padding-top:5px;}
.scroll_area li.history_list3 .btn_check {height:158px; margin-top:-5px; width:90%; float:right; padding-top:7px; }
.scroll_area li.history_list4 {height: 150px; padding-top:4px;}
.scroll_area li.history_list5 {height: 65px; padding-top:5px;}
.scroll_area li.history_list10 {height: 90px; padding-top:5px;}
.scroll_area li.history_list8 {height: 100px; padding-top:5px;}
.scroll_area li.history_list6 {height: 110px; padding-top:5px;}
.scroll_area li.history_list7 {height: 120px; padding-top:5px;}
.scroll_area li.history_list9 {height: 170px;}
.scroll_area li.history_list11 {height: 230px; padding-top:5px;}
.scroll_area li.history_list12 {height: 170px; padding-top:4px;}

.scroll_area li .history_info {width: auto;}
.scroll_area li .left {width:100%; height:28px; margin-top:0px;}
.scroll_area li .left.btn_list{width:calc(100% - 45px);}
.scroll_area li .left div {display: inline-block;}
.scroll_area li .left label{font-size: 1.1rem;}
.scroll_area li .left .thick {float:left;  margin: 8px 20px; font-size: 1rem; text-align: left; width: 50%; font-weight: 600;}
.scroll_area li .left .history {font-weight: 700; font-size: 1.1rem; margin-top:-2px;}
.scroll_area li .left .history input{width: 150px;}

.scroll_area li .detail_line {width: 100%; height:25px; display: inline-block;}
.scroll_area li .detail_left {float: left;}
.scroll_area li .detail_left .detail_info {margin: 5px 10px;}
.scroll_area li .detail_left .detail_info div {width: auto; font-size: 14px; font-weight: 700;}
.scroll_area li .detail_left .detail_info i {width: auto; font-size: 1rem; margin: 0 20px;}
.scroll_area li .detail_left .detail_info label {position:absolute; width: auto;  font-size: 14px;}
.scroll_area li .detail_right {float: right;}
.scroll_area li .detail_right .detail_info {margin: 5px 25px;}
.scroll_area li .detail_right .detail_info label {margin: 5px 30px; font-size: 2rem;}
.scroll_area li .detail_right .detail_info div {width: auto; font-size: 14px; font-weight: 100;}
.scroll_area li .detail_right .detail_info i {width: auto; font-size: 1rem; margin: 0 20px;}

.scroll_area li .left .nomal  {position:relative; display:flex; width: 100%; height:28px; float:left; text-align: left; font-size: 1.2rem;}
.scroll_area li .left .nomal.btn {width:290px; left:44%; padding:0;}
.scroll_area li .left .nomal .half {float:left;}
.scroll_area li .left .nomal .half label {min-width:auto;}
.scroll_area li .left .nomal .half div {min-width:auto; margin-right:5px; margin-top:0;}
.scroll_area li .left .nomal  input{ width:calc(50% - 85px);height:28px; top:-5px; position:relative;}
.scroll_area li .left .nomal  select{ width:calc(50% - 85px); height:28px; top:-5px; position:relative;}

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

.scroll_area li .scroll_btn input {width:15px; margin:auto 10px;}
.scroll_area li .scroll_btn input:checked ~ .scroll_btn {background:#eee;}
.scroll_area li .left .nomal .lit{font-size:11pt;}
.scroll_area li .left .nomal div.lit {padding-right:2px;}
.scroll_area li .left .nomal span {position:relative; width:10px; font-size:15px; font-weight:700;}
.scroll_area li .left .nomal span.mg0 {margin:0;}

.scroll_area li .left .nomal .btn_bar{position: relative; width: auto; font-size: 2.2rem;}
.scroll_area li .left .nomal .btn_bar button{width: 25px; height: 30px; font-size: 1rem; padding: 0;}
.scroll_area li .left .nomal .btn_bar .col_0{min-width: auto; margin: 5px 20px;}

.scroll_area li .left .nomal .m_btn_bar{position: relative; display:inline-flex; width: 80px; height:25px; font-size: 12pt; margin-left:10px;}
.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;}
.scroll_area li .left .nomal .m_btn_bar button div{position:relative; width:10px; top:-2px; left:2px;}
.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;}

.scroll_area li .left .nomal label{position:relative; font-size:12pt; font-weight:100; min-width:70px; padding-left:5px; text-align:left;}
.scroll_area li .left .nomal label.sub_info{min-width: auto; display: inline-flex;}

.scroll_area li .left .nomal label.col_1{min-width: 45px;}
.scroll_area li .left .nomal label.col_3{min-width: 50px;}
.scroll_area li .left .nomal label.col_4{min-width: 57px;}
.scroll_area li .left .nomal label.col_6{min-width: 83px;}
.scroll_area li .left .nomal label.col_7{min-width: 91px;}
.scroll_area li .left .nomal label.col_8{min-width: 107px;}
.scroll_area li .left .nomal.over{text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.scroll_area li .left .nomal i{width: 50px; text-align: center;}
.scroll_area li .left .nomal div{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; font-weight: 700; font-size: 12pt; width:calc(50% - 80px);}
.scroll_area li .left .nomal div.text_6{width:calc(50% - 108px);}
.scroll_area li .left .nomal div.text_4{width:calc(50% - 69px);}
.scroll_area li .left .nomal div.text_btn{width:calc(50% - 56px);}
.scroll_area li .left .nomal div.text_two{width:calc(50% - 12px);}

.scroll_area li .left .nomal div.full{width:calc(100% - 90px);}
.scroll_area li .left .nomal div.full_s{width:calc(100% - 45px);}
.scroll_area li .left .nomal div.auto{width:auto;}


.scroll_area li .right {margin: 22px 10px 22px 0; position: relative; display: flex; width:110px; height:30px; font-size: 1.4rem; font-weight: 700; float: right;}
.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;}
.scroll_area li .right .fnnum {margin:5px 30px; font-size:14pt;}
.scroll_area li .right button {background:#e1cac1; color:#fff; border:1px solid #E0B8AB; padding:0px 7px; font-size: 16px; border-radius: 0px;}
.scroll_area li .right button:hover {background:#FCD5C1;}

/* ITP_FOOTER */
#ITP_FOOTER .itp_modal {z-index:10000;}
#ITP_FOOTER .itp_modal .modal-header {padding:12px 15px 12px 15px; background:#337ab7; cursor:move;}
#ITP_FOOTER .itp_modal .modal-header .close {color:#fff; opacity:1;}
#ITP_FOOTER .itp_modal .modal-title {font-size:16px; color:#fff;}
#ITP_FOOTER .itp_modal .itp_alert_txt {font-size:15px; padding:15px 0 10px 0;}
#ITP_FOOTER .itp_modal .itp_form .form-group {margin-bottom:10px;}
#ITP_FOOTER .itp_modal .itp_form .form-control {font-size:13px; color:#333;}
#ITP_FOOTER .itp_modal .itp_form .itp_lb {font-size:13px; padding-top:5px; padding-right:0; color:#333; position:relative;}
#ITP_FOOTER .itp_modal .itp_form .itp_ip {padding-left:0; padding-right:0;}
#ITP_FOOTER .itp_modal .itp_form .itp_ip_offset {padding-left:15px;}
#ITP_FOOTER .itp_modal .itp_form .itp_input {height:28px; padding:3px 9px;}
#ITP_FOOTER .itp_modal .itp_form .itp_check {margin-top:7px;}
#ITP_FOOTER .itp_modal .itp_form select.itp_input  {padding-left:4px; margin-top:-2px;}
#ITP_FOOTER .itp_modal .itp_form .itp_btn {padding:4px 10px; background:#fff;}
#ITP_FOOTER .itp_modal .itp_form .input-daterange .input-group-addon {padding:3px 5px;}
#ITP_FOOTER .itp_modal .itp_form .itp_date_to {background:#fff;}
#ITP_FOOTER .itp_modal .itp_form .itp_lb.itp_required:before {content:'*'; color:#a94442; position:absolute; top:8px; left:8px;}
#ITP_FOOTER .modal.in .modal-dialog {
  -webkit-transform:translate(0, calc(50vh - 50%));
  -ms-transform:translate(0, 50vh) translate(0, -50%);
  -o-transform:translate(0, calc(50vh - 50%));
  transform:translate(0, 50vh) translate(0, -50%);
}
/* 수발주 결제 테이블 css */
#ITP_FOOTER .itp_modal .itp_mg_btm {margin-bottom:0 !important;}
#ITP_FOOTER .itp_modal .itp_pd_none {padding:0;} 
#ITP_FOOTER .itp_modal .itp_mg_top {margin-top: 10px;} 
#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;}
#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;}

@media screen and (min-width: 550px) {
	.content .line div.date_to input {width:47%}
	.modal-dialog {margin:auto 20% !important;}
	.scroll_area li .left_info .thick {width: 90%;}
	.content .line .search_wrap select {width:78%;}	
	
}
@media screen and (min-width: 363px) {
	section .popup2 .content .line.ml_10 {left:20px;}
}
@media screen and (max-width: 362px) {
	section .popup2 .content .line.mt_5 {top:-40px;}
}
@media screen and (max-width: 380px) {
	section .popup2 .barcode_area {width: 250px; height: 250px;}
/* 	section .popup2 .pop .popup_scroll li .scroll_left .mg_0 {margin:0; width:100px;}
	.type_hide {display:none;}
	section .popup2 .pop .popup_scroll li .scroll_left .mg_0 div {margin:0; padding: 4px 8px 0px 2px;} */
}
@media screen and (min-width: 630px) {
	.content .line {margin:0 100px -10px 100px;}
	.detail_content .detail_confirmation .detail_col {width:410px;}
}
@media screen and (max-height: 720px) {
	section .popup2 .pop .popup_scroll {height: 47vh;}
}
@media screen and (max-height: 740px) {
	/* #ITP_LOGIN {position:fixed; top:80px; max-width: 500px; margin: 0 auto;}
	.bg_gray {position:relative; top:-90px;} */
	.scroll_area {height: 58vh;}
	}
@media screen and (max-height: 550px) {
	section .popup2 .pop .popup_scroll {height: 50%;}
}
/* 알림 팝업 추가 */
.modal {position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; display: none; overflow: hidden; outline: 0;}
.itp_modal {z-index: 10000;}
.modal-dialog {position: relative; width: auto; margin: 10px; /* top: 50%; transform: translateY(-50%); */}
.modal-dialog .line {display:flex;border:1px solid #aaa; border-bottom:none; height:40px;}
.modal-dialog .border{border-bottom:1px solid #aaa;}
.modal-dialog .border .label_box {height:38px !important;}
.modal-dialog .line .label_box {padding:8px; width:100px; height:39px; background:#eee; border-right:1px solid #aaa;}
.modal-dialog .line .label_box label {font-size:14px; font-weight:100;}
.modal-dialog .line .info_box {width: calc(100% - 100px); padding:10px; display:flex;}
.modal-dialog .line .info_box .email {width:30%;}
.modal-dialog .line .info_box input{position:relative; top:-4px; width:100%; height:27px; margin:0;}
.modal-dialog .line .info_box select{position:relative; top:-4px; width:100%; height:27px;}
.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;}
.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%);}
.modal-header {min-height: 16.43px; padding: 15px; border-bottom: 1px solid #e5e5e5; color:#fff; padding: 12px 15px 12px 15px; background: #337ab7; cursor: move;}
.modal-header .close { margin-top: -2px; color: #fff; opacity: 1;}
button.close {-webkit-appearance: none; padding: 0; cursor: pointer; background: 0 0; border: 0;}
.close {float: right; font-size: 21px; font-weight: 700; line-height: 1; text-shadow: 0 1px 0 #fff;}
.modal-body {position: relative; padding: 15px; }
.modal-body .text_area{padding-bottom:20px; }
.modal-footer {padding: 15px; text-align: right; border-top: none;}
.modal-footer .pop_btn_bar {float:right; margin-top:12px;}
.modal-footer .btn {border-radius:6px; padding: 6px 12px;}

/* 메인화면 공지사항 추가 */
#ITP_MAIN_CONTAINER.itp_main_box{position:relative; height:calc(100vh - 49px); overflow:auto;}
#ITP_MAIN_CONTAINER .itp_note_header {width:100%; height:46px; padding:10px; border-bottom:1px solid #aaa; background:#dce6f2;}
#ITP_MAIN_CONTAINER .itp_note_header h1 {font-size:16pt; text-align:left; margin:0;}
#ITP_MAIN_CONTAINER .itp_note_bar {height: auto; max-height:180px;}
#ITP_MAIN_CONTAINER .itp_note_bar h1 {position:relative; font-weight:700; font-size:14pt; margin:0; height:60px; padding-top:20px; border-bottom:1px solid #aaa;}
#ITP_MAIN_CONTAINER .itp_note_bar li {border-bottom:1px solid #aaa; padding:5px; height:60px;}
/* #ITP_MAIN_CONTAINER .itp_note_bar li:first-child  {border-top:none;} */
#ITP_MAIN_CONTAINER .itp_note_bar li .itp_note_info {display:flex; height:24px;}
#ITP_MAIN_CONTAINER .itp_note_bar li .itp_note_info label {font-size:12pt; text-align:left; width:62px;}
#ITP_MAIN_CONTAINER .itp_note_bar li .itp_note_info span {width:14px;}
#ITP_MAIN_CONTAINER .itp_note_bar li .itp_note_info div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; width:calc(100% - 76px);}
#ITP_MAIN_CONTAINER .itp_note_bar li .itp_note_info .under {text-decoration: underline;}
#ITP_MAIN_CONTAINER .itp_oper_info_area {border-bottom:1px solid #aaa; padding:5px;}
#ITP_MAIN_CONTAINER .itp_oper_info_area .itp_oper_info {display:flex; height:24px;}
#ITP_MAIN_CONTAINER .itp_oper_info_area .itp_oper_info label{font-size:12pt; text-align:left; width:90px;}
#ITP_MAIN_CONTAINER .itp_oper_info_area .itp_oper_info span{width:14px;}
#ITP_MAIN_CONTAINER .itp_oper_info_area .itp_oper_info div{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align: right; width:calc(100% - 114px);}
#ITP_MAIN_CONTAINER .itp_graph_area {width:98%; height:300px; border:1px solid #aaa; margin:5px 1%;}
#ITP_MAIN_CONTAINER .itp_graph_area .itp_graph_header {width:160px; margin:5px;}
#ITP_MAIN_CONTAINER .itp_graph_area .itp_graph_header label {width:80px; font-size:14pt; text-align:left; float:left;}
#ITP_MAIN_CONTAINER .itp_graph_area .itp_graph_header select {}
#ITP_MAIN_CONTAINER .mb_0 {margin-bottom:0;}
#ITP_MAIN_CONTAINER #ITP_GRAPH_INFO {height:265px;}
/* 공지사항 팝업추가 */
.itp_note_popup {position: absolute; top:46px; width: 100%; height: calc(100vh - 49px); background: rgba(200, 200,200, 0.8); z-index: 11;}
.itp_note_popup .popup_note {position:relative; top:20px; width:96%; margin:0 2%;}
.itp_note_popup .popup_note .header {position: relative; height: 40px; background: #f0831e; color:#eee; border: 1px solid #000; border-top-right-radius: 10px; border-top-left-radius: 10px;}
.itp_note_popup .popup_note .header .header_left {padding-top: 12px;}
.itp_note_popup .popup_note .header .header_left label {font-size: 16px; font-weight:100;} 
.itp_note_popup .popup_note .header .header_right {float: right; padding-right: 10px; position:relative; top:-44px;}
.itp_note_popup .popup_note .header .header_right button {border: none; background: transparent; margin:3px -5px;}
.itp_note_popup .popup_note .header .header_right button img {width:22px;}
.itp_note_popup .popup_note .itp_pop_note_area {background:#fff; height:70vh; border:1px solid #000; border-top:none;}
.itp_note_popup .popup_note .itp_pop_note_area .itp_note_title { display:flex; padding:10px; width:110%; height:45px;}
.itp_note_popup .popup_note .itp_pop_note_area .itp_note_title label {width:60px; font-size:12pt;}
.itp_note_popup .popup_note .itp_pop_note_area .itp_note_title span {width:10px;}
.itp_note_popup .popup_note .itp_pop_note_area .itp_note_title div {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; text-align:left; width:calc(100% - 70px);}
.itp_note_popup .popup_note .itp_pop_note_area .itp_pop_note_content {border:1px solid #aaa; width:98%; height:calc(100% - 60px); margin:0 1%; padding:8px;}
.itp_note_popup .popup_note .itp_pop_note_area .itp_pop_note_content div {height:100%; word-break:break-all;}




