@charset "utf-8";
html {
   height: 100%;
   scrollbar-3dLight-Color: #666666; 
   scrollbar-arrow-color: #666666; 
   scrollbar-base-color: #efefef; 
   scrollbar-Face-Color: #8D8D8D; 
   scrollbar-Track-Color: #efefef; 
   scrollbar-DarkShadow-Color: #666666; 
   scrollbar-Highlight-Color: #efefef; 
   scrollbar-Shadow-Color: #efefef
}

.dummyScrollbar {
   scrollbar-3dLight-Color: #efefef; 
   scrollbar-arrow-color: #efefef; 
   scrollbar-base-color: #efefef; 
   scrollbar-Face-Color: #efefef; 
   scrollbar-Track-Color: #efefef; 
   scrollbar-DarkShadow-Color: #efefef; 
   scrollbar-Highlight-Color: #efefef; 
   scrollbar-Shadow-Color: #efefef
}

/* Webkit(Safari, Chrome) scroll bar */
::-webkit-scrollbar{width: 8px; height:8px;}
::-webkit-scrollbar-thumb {background-color:#8D8D8D;}
::-webkit-scrollbar-thumb:hover {background: #666666;}
::-webkit-scrollbar-track {background: #efefef;}
/* 파일 인풋박스 커서 모양 변경 */
::-webkit-file-upload-button { cursor:pointer; }
/*
::-webkit-scrollbar {width: 8px; height: 8px; border: 3px solid #fff; }
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background: url(`./images/bg.png`) #efefef}
::-webkit-scrollbar-track {background: #efefef; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.2); -webkit-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}
*/




/* 기존 ATOZ 폰트 */
/* body { */
/*    font-family: 'Noto Sans KR', sans-serif; */
/*    font-size: 12px; */
/*    width: 100%; */
/*    height: 100%; */
/*    background:#d7d7d7; */
/* } */

/* TBeye CRM 폰트 */
body {
/* 일본어 사용시 아래 활성화 */
/* font-family:  "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", */
/*       "ＭＳ Ｐゴシック", 'Noto Sans Japanese'; */
   font-size: 12px;
   width: 100%;
   height: 100%;
   background:#dcdcdc;
   -ms-overflow-style: none; /* IE and Edge */
   scrollbar-width: none; /* Firefox */
}

.body::-webkit-scrollbar {
   display: none; /* Chrome, Safari, Opera*/
}

/* ***** ***** div ***** ***** */
div {
   display: block;
}

div.inline {
   display: inline-block;
}




/* ***** controls ***** */

label {
   margin-bottom: 0px;
   font-weight: normal;
}

/* -- input -- */
input {
   border-style: solid;
   border-width: 1px;
   border-color: #AAA;
}

input[type=text], select.form-control {
   height: 24px;
}

input[type=text].btn-style {
   height: 28px;
   font-size: 14px;
}

input[type=checkbox]
, input[type=radio] {
   position: relative;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   margin-right: 2px;
   vertical-align: middle;
   overflow: hidden;
   clip: rect(0, 0, 0, 0);
   border: 0;
   
}

input[type="checkbox"]+label {
   display: inline-block;
   position: relative;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
}

input[type="checkbox"]+label:before {
   content: ' ';
   display: inline-block;
   width: 15px;
   height: 15px;
   line-height: 15px;
   margin: -2px 4px 0 0;
   text-align: center;
   vertical-align: middle;
   background: #fafafa;
   border: 1px solid #cacece;
   border-radius: 0px;
   box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px
      rgba(0, 0, 0, 0.05);
}
input[type="checkbox"][disabled]+label:before{
   background: #dedede;
   border: 1px solid #c0c0c0;
}

input[type="checkbox"]+label:active:before, 
input[type="checkbox"]:checked+label:active:before{
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px
      rgba(0, 0, 0, 0.1);
}

input[type="checkbox"]:checked+label:before {
   font: normal normal normal 14px/1 FontAwesome;
   content: '\f00c';
   color: #4599DD;
   text-shadow: 1px 1px #fff;
   background-color: rgba(0, 0, 0, 0);
   border-color: #adb8c0;
}

input[type="radio"]+label {
   display: inline-block;
   position: relative;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
}

input[type="radio"]+label:before { 
   content: ' ';
   display: inline-block;
   width: 15px;
   height: 15px;
   line-height: 15px;
   margin: -2px 4px 0 0;
   text-align: center;
   vertical-align: middle;
   background: #fafafa;
   border: 1px solid #cacece;
   border-radius: 8px;
   box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px
      rgba(0, 0, 0, 0.05);
}

input[type="radio"]+label:active:before, input[type="radio"]:checked+label:active:before {
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px
      rgba(0, 0, 0, 0.1);
}

input[type="radio"]:checked+label:before {
   background-color: rgba(0, 0, 0, 0);
   border-color: #adb8c0;
}

input[type="radio"]:checked+label:after {
   content: '';
   position: absolute;
   top: 15px;
   left: 3px;
   width: 9px;
   height: 9px;
   background: #4599DD;
   border-radius: 6px;
   box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0);
}
.radioWrap input[type="radio"]{
    visibility: hidden;
}
input[type="file"] {
   width: 450px;
   height: 28px;
   display: inline-block;
   padding-top: 2px;
   padding-bottom: 2px;
}

textarea {
   resize: none;
}

.ime-mode-active {
   -webkit-ime-mode:active; 
   -moz-ime-mode:active; 
   -ms-ime-mode:active; 
   ime-mode:active; 
}

/*-- datepicker --*/
.input-group.date {
   vertical-align: middle;
   display: block;
   margin-top: 8px;
}

.input-group.date>input {
   width: 78px;
   height: 24px;
   background-color: #ffffff;
   padding-left: 3px;
   padding-right: 3px;
   font-size: 12px;
}
.input-group.date>input[disabled] {
   background-color: #eee;
}

.input-group.date>span {
   padding: 0;
}

.input-group.date span.input-group-addon {
   width: 26px;
   height: 24px;
}

.input-group.date .timepicker .btn {
   color: #333;
}

/* -- button -- */
.btn {
   padding: 3px 6px;
   color: #fff;
}

.btn.btn-small {
   font-size: 12px;
   height: 24px;
   padding: 0px 10px;
   color: #fff;
   border: 0px;
   border-radius: 2px;
}

.btn.btn-sky-blue {
   background-color: #55ACEF;
   border-color: #55ACEF;
}

.btn.btn-dark-blue {
   background-color: #35404F;
   border-color: #35404F;
}

.btn.btn-dark-blue:hover {
   color: #fff;
}

.btn.btn-red {
   background-color: #EB5C58;
   border-color: #EB5C58;
}
.btn.btn-orange {
   background-color: #FF8040;
   border-color: #FF8040;
}

.btn.btn-gray {
   background-color: #8D8D8D;
   border-color: #8D8D8D;
}

.btn.btn-light-gray {
   background-color: #CFD5DA;
   border-color: #CFD5DA;
   color: #333;
}

.btn.btn-green {
   background-color: #009f00;
   border-color: #8D8#009f00;
}



/* ***** ***** tooltip ***** ***** */
.tooltipBox {
   position: absolute;
   z-index: 1200;
   top: 100px;
   right: 100px;
   width: auto;
   height: auto;
   min-width: 300px;
   min-height: 150px;
   text-align: center;
   background-color: #FFFFFF;
   display: none;
}

.tooltipBox.show {
   display: block;
}

.tooltipBox .tooltipTitle {
   height: 30px;
   color: #FFFFFF;
   font-weight: 600;
   padding: 6px;
   background-color: #34404E;
}

.tooltipBox .tooltipText {
   padding: 10px;
   text-align: left;
   display: block;
   font-size: 11px;
   word-wrap: break-word;
}

.tooltipBox[data-align=left]::after {
   content: " ";
   position: absolute;
   top: 50%;
   left: 100%;
   z-index: 1001;
   margin-top: -3px;
   margin-left: 0px;
   border-width: 7px;
   border-style: solid;
   border-color: transparent transparent transparent #CCCCCC;
}

.tooltipBox[data-align=right]::before {
   content: " ";
   position: absolute;
   top: 50%;
   left: 0;
   z-index: 1001;
   margin-top: -5px;
   margin-left: -16px;
   border-width: 7px;
   border-style: solid;
   border-color: transparent #CCCCCC transparent transparent;
}

/* Login */
.loginScreen {
   position: absolute;
   top: 0px;
   left: 0px;
   right: 0px;
   bottom: 0px;
   background-color: #fff;
   z-index: 5000;
   min-height: 725px;
}

.loginScreen .title {
   font-size: 60px;
   color: #FFFFFF;
   margin: 150px 0px 50px;
   text-align: center;
}

.loginScreen .inputArea {
   width: 100%;
   text-align: center;
}

.loginScreen .inputArea form {
   width: 460px;
   margin: 0 auto;
   padding: 50px;
   box-shadow:2px 2px 3px rgba(0, 0, 0, .1);
   border:1px solid #ddd;
   background-color: #fff;
}

.loginScreen .inputArea form input {
   height: 50px;
   font-size: 14px;
   font-weight: 600;
   border:0;
   border-bottom:1px solid #ddd;
   padding: .8em 2.5em;
   margin: 0 auto 10px;
   display:block;
   width:100%;
}
.loginScreen .inputArea form input[type="radio"] {
    display:none;
}
.loginScreen .inputArea form input[type="radio"]+label{
    margin-right:10px;
}
.loginScreen .inputArea form input[type="radio"]+label:after{
    top:4px;
}

.loginScreen .inputArea form button {
   width: 100%;
   height: 50px;
   margin: 10px 0 0;
   font-size: 20px;
   font-family: bold;
   line-height: 20px;
   background:#f0871a;
}

/* 로그인 이미지 마크 */
.htmlImg_mark { position:absolute; top:40px; left:40px; }
.htmlWebLv {text-align:center; font-size:24px; font-weight:500; color:#555;}
.mobile_mark { margin-top:20px; position:relative; }
.mobile_mark img:last-child { margin-left:14px; }
.mobile_mark .androidDeactiv { position:absolute; background:#e9e9e9; width:170px; height:78px; top:0; left:8px; opacity:0.9; }
.mobile_mark .iosDeactiv { position:absolute; background:#e9e9e9; width:170px; height:78px; top:0; left:189px; opacity:0.9; }

input[type="password"] {
    font-family: caption;
}

.loginIdRemem { float:left; color:#555; margin-top:4px; }
.loginIdRemem > input { width:17px!important; height:17px!important; margin:0 auto!important; display:inline-block!important; }

.loginScreen .selectLangSection > select { height:22px; font-size:12px; padding:2px 3px; display:block; width:100px; color:#555; background-color:#fff;
                                          background-image:none; border:1px solid #ccc; border-radius:3px; float:right; }

/* Error */
.errorScreen {
   position: absolute;
   top: 0px;
   left: 0px;
   right: 0px;
   bottom: 0px;
   background-color: #35404F;
   z-index: 5000;
}

.errorScreen .title {
   font-size: 30px;
   color: #FFFFFF;
   margin: 50px 0px 25px 0px;
   text-align: center;
}

.errorScreen .detail {
   width: 100%;
   text-align: center;
}

.errorScreen .detail .message {
   color: white;
   width: 100%;
   font-size: 15px;
   padding: 10px 50px;
   text-align: center;
   max-height: 250px;
   overflow-y: auto;
}

/* --- sweet-alert add ---*/
.sweet-overlay {
  /* IE8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
  /* IE8 */
  background-color: rgba(0, 0, 0, 0.0);
}

.sweet-alert.showSweetAlert {
   border : 1px solid #8D8D8D;
}

.nav-container {
   position: relative;
   height: 100%;
}

.nav.nav-tabs {
   border-color: #CCCCCC;
   
   position: absolute;
   bottom: 0px;
}

.nav.nav-tabs.border-bottom-none {
   border-bottom: none;
}

.nav.nav-tabs>li {
   min-width: 125px;
   margin-bottom: 0px;
}

.nav-tabs>li.active {
   margin-bottom: -1px;
}
   

.nav.nav-tabs li.disabled-tab {
   pointer-events: none;
}

.nav.nav-tabs li a {
   color: #999999;
   padding: 3px 5px;
   font-size: 14px;
   font-weight: 600;
   border-color: transparent;
   border-radius: 0px;
   text-align: center;
   
   background-color: #EAEAEA;
}

.nav.nav-tabs li a.medium {
   font-size: 12px;
   min-height: 28px;
   padding-top: 5px;
}
.nav.nav-tabs li a.small {
   font-size: 10px;
   min-height: 28px;
   padding-top: 7px;
}

.nav.nav-tabs li.active a {
   color: #F46800;
   font-weight: 900;
   border-color: #CCCCCC;
   border-top: 2px solid #E45F56;
   border-bottom-color: transparent;
   
   background-color: #FFFFFF;
}

.nav.nav-tabs li.active.sky-blue a {
   border-top: 2px solid #55ACEF;
   color: #55ACEF;
}

.nav.nav-tabs li.active a:focus
, .nav.nav-tabs li.active a:hover {
   background-color: #FFFFFF;
}


.textOverflow {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 20px;
   max-height: 120px;
   -webkit-line-clamp: 6;
   -webkit-box-orient: vertical;
}

.textOverflow_3 {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 20px;
   max-height: 100px;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
}

.textOverflow_5 {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 20px;
   max-height: 100px;
   -webkit-line-clamp: 5;
   -webkit-box-orient: vertical;
}

.textOverflow_10 {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 20px;
   max-height: 200px;
   -webkit-line-clamp: 10;
   -webkit-box-orient: vertical;
}



.table.noBorder
, .table.noBorder>thead>tr>th
, .table.noBorder>tbody>tr>th
, .table.noBorder>tfoot>tr>th
, .table.noBorder>thead>tr>td
, .table.noBorder>tbody>tr>td
, .table.noBorder>tfoot>tr>td{
   border: 0px solid #C8C8C0;
}

/* .table {
   width: 100%;
   border: 1px solid #C8C8C0;
   margin-bottom: 0px;
}

.table tr{
   height: 30px;
} 부트스트랩과 중복돼서 제거.  */

.table>thead>tr>th
, .table>tbody>tr>th
, .table>tfoot>tr>th {
   border: 1px solid #C8C8C0;
   background-color: #EBF6FE;
   padding: 1px 3px;
   font-weight: 600;
   vertical-align: middle;
   text-align: center;
}

.infoTable.table th{
   background-color: #F9F9F9;
   padding-left: 3px;
}
.infoTable.table td{
   word-wrap: break-word;
}

.infoTable.table.title-c th{
   text-align: center;
}
.infoTable.table.text-al-c td{
   text-align: center;
}
.infoTable.table.bg-light-orange th{
   background-color: #FFCC66;
   padding-left: 3px;
}
.infoTable.table.bg-light-orange>thead>tr>td
, .infoTable.table.bg-light-orange>tbody>tr>td
, .infoTable.table.bg-light-orange>tfoot>tr>td
, .infoTable.table.bg-light-orange>thead>tr>th
, .infoTable.table.bg-light-orange>tbody>tr>th
, .infoTable.table.bg-light-orange>tfoot>tr>th {
   border: 3px solid #FFCC66;
}

.table>thead>tr>th.bg-color-light-pink
, .table>tbody>tr>th.bg-color-light-pink {
   background-color: #F7E6E5;
}

/* .table>tbody>tr
, .table>tfoot>tr {
   background-color: #FFFFFF;
}
   
.table>thead>tr>td
, .table>tbody>tr>td
, .table>tfoot>tr>td {
   border: 1px solid #C8C8C0;
   background-color: #FFFFFF;
   padding: 1px 3px;
   vertical-align: middle;
   text-align: center;
   min-height: 23px;
}  부트스트랩과 중복돼서 제거. */

.table tr th input[type="checkbox"].mg-zero+label:before
, .table tr td input[type="checkbox"].mg-zero+label:before {
   margin: 0px;
}

.table.thAlignLeft>thead>tr>th
, .table.thAlignLeft>tbody>tr>th
, .table.tdAlignLeft>thead>tr>td
, .table.thAlignLeft>tbody>tr>td {
   text-align: left;
   padding-left: 5px;
   padding-right: 5px;
}

.table>tbody>tr>td.alignLeft {
   text-align: left;
   padding-left: 5px;
   padding-right: 5px;
}

.table tr td .input-group.date {
   vertical-align: middle;
   padding: 3px;
   display: block;
}

.table .input-group.date>span {
   padding: 6px;
}

.searchForm .table>tbody>tr>th {
   text-align: right;
}

.searchForm .table>tbody>tr>td {
   text-align: left;
}

.searchForm .table>tbody>tr>td input {
   height: 29px;
}



.pageBox {
   width: 100%;
   height: 100%;
   min-width: 1200px;
}

.form-control {
   display:block;
   height: 29px;
   font-size: 12px;
   padding: 2px 3px;
}

.contentBox {
   position: absolute;
   overflow: auto;
   background-color: #ecf0f5;
   width: 100%;
   top: 50px;
   bottom: 0px;
   min-width: 1200px;
}

.titleRow {
   color: #586E82;
   font-size: 15px;
   font-weight: 600;
   padding-top: 10px;
   padding-left: 5px;
   margin-bottom: 0px;
}

.dataRow {
   width: 100%;
   height: auto;
   
   padding: 10px 10px;
   
   border: 1px solid #cccccc;
}

.dataRow.borderTopOnly {
   padding: 5px 0px 0px;;
   border: 0px solid #cccccc;
   border-top: 1px solid #cccccc;
}


.registerBox {
   width: 100%;
   font-size: 12px;
   margin-top: 3px;
   margin-bottom: 2px; 
   table-layout: fixed;
}

.registerBox>tbody>tr {
   height: 32px;
}

.registerBox>tbody>tr>th {
   border: 1px solid #C8C8C0;
   background-color: #EBF6FE;
   vertical-align: middle;
   text-align: left;
   padding: 1px;
   padding-left: 15px;
}

.registerBox tbody tr th label {
   font-weight: bold;
}
.registerBox tbody tr th .asterisk {
   display:inline-block;
   position:relative;
}
.registerBox tbody tr th .asterisk:before {
   position:absolute;
   left:-10px;
   top:0;
   content:"*";
   color:#e12d4a;
   font-weight:bold;
}

.registerBox>tbody>tr>td {
   border: 1px solid #CCCCCC;
   background-color: #FFFFFF;
   vertical-align: middle;
   text-align: left;
   padding: 3px;
}

.registerBox>tbody>tr.infoTr>td {
   padding: 0px;
}

.registerBox ul {
   padding: 0px;
   margin-bottom: 0px;
   text-align: left;
   list-style-type: none;
}

.registerBox ul li {
   padding-bottom: 3px;
}

.registerBox .btn {
   vertical-align: baseline;
}

.registerBox .input-group-addon {
   padding: 2px 12px;
}

.registerBox input, .registerBox select {
   height: 25px;
   vertical-align: middle;
   display: inline-block;
   padding: 2px 3px;
}

.registerBox tr td .input-group.date {
   vertical-align: middle;
   padding: 1px 2px;
   display: inline-block;
}
.registerBox tr td .input-group.date>input 
, .registerBox tr td .input-group.date span.input-group-addon {
   height: 25px;
}

.registerBox tr td .input-group.date>span {
   padding: 4px;
}

.registerBox .infoTr th {
   padding: 5px 5px 0px 5px;
}

.registerBox .infoTr td {
   padding: 0px 5px 5px 5px;
}

.registerBox .infoTr .info-title {
   height: 25px;
   font-weight: 600;
   border-bottom: 1px solid #959595;
   padding-left: 15px;
   padding-bottom: 2px;
   margin-bottom: 6px;
}

.registerBox .infoTr th .asterisk {
   display:inline-block;
   position:relative;
}
.registerBox .infoTr th .asterisk:before {
   position:absolute;
   left:-10px;
   top:0;
   content:"*";
   color:#e12d4a;
   font-weight:bold;
}

.registerBox .infoTr .info-title>select,
.registerBox .infoTr .info-title>button {
   height: 20px;
   position: absolute;
   font-size: 11px;
   margin-left: 5px;
   padding: 0px;
}

.registerBox .infoTr .info-text {
   padding-left: 3px;
   color: #000000;
   min-height: 40px;
}

.registerBox .infoTr textarea {
   height: 120px;
   padding: 2px 3px;
}

.registerBox .nav-tabs {
   border-color: #CCCCCC;
   border-bottom: 1px solid #959595;
}

.registerBox .nav-tabs > li {
   min-width: 100px;
   margin-bottom: 0px;
   padding-bottom: 0px;
}

.registerBox .nav-tabs > li > a {
   color: #999999;
   font-size: 13px;
   font-weight: normal;
   text-align: center;
   background-color: #FFFFFF;
   border: 1px solid #CCCCCC;
   border-bottom-style: none;
   border-radius: 0px;
   padding: 5px 3px;
   margin-top: 2px;
   margin-right: 0px; 
   margin-left: 2px;
}

.registerBox .nav-tabs > li.active > a {
   background-color: #FFFFFF;
   color: #F46800;
   font-weight: 600;
   border-top: 2px solid #E45F56;
   border-bottom-color: transparent;
   margin-top: 1px;
}

.registerBox .nav-tabs>li.active>a:focus, .registerBox .nav-tabs>li.active>a:hover {
   background-color: #FFFFFF;
   border-bottom-width: 0px;
}

.registerBox .note-editor {
   margin-bottom: 0px;
   border-color: #CCCCCC;
}

.registerBox .note-editable {
   padding: 2px 3px !important;
}

.registerBox .search [data-disp=N], 
.registerBox .search .selected [data-disp=Y]{
   display: none;
}
.registerBox .search [data-disp=Y], 
.registerBox .search .selected [data-disp=N]{
   display: inline;
}



.fileUploadList {
   display: inline-block;
   width: 100%;
   padding: 3px;
   overflow-y: auto; 
   overflow-x: hidden;
   white-space: normal; 
}

.loadingArea {
   position: absolute;
   width: 100%;
   height: 100%;
   background-color: rgba(230, 230, 230, 0.5);
   top: 0px;
   left: 0px;
   display: table-cell;
   vertical-align: middle;
   text-align: center;
}
.loadingArea i {
   color: #C0C0C0;
}

.fileUploadList .fileList {
   padding:0; 
   border-spacing:0px; 
   border:0; 
   border-collapse:collapse;
   width: 100%;
   background-color: transparent;
}

.fileUploadList .fileList col.fileNameDisp {
   width: 150px;
}

.fileUploadList .fileList col.delete {
   width: 22px;
}

.fileUploadList .fileList .fileItem {
  width: 100%;
  height: 24px;
  margin: 1px;
}

.fileUploadList .fileList .fileItem td {
   padding:0px;
   border: 0px;
}

.fileUploadList .fileList .fileItem .fileName {
   width: 100%;
   background: #FAFAFA;
   height: 22px;
   line-height: 22px;
   text-indent: 5px;
   border: 1px solid #bbb;
   margin-bottom: 0px;
   overflow: hidden;
}
.fileUploadList .fileList .fileItem .fileNameDisp {
   width: 150px;;
   background: #ffffff;
   height: 22px;
   line-height: 22px;
   text-indent: 5px;
   border: 1px solid #bbb;
   margin-bottom: 0px;
   overflow: hidden;
}

.fileUploadList .fileList .fileItem.new .fileName {
   background: #EFD1D1;
}
.fileUploadList .fileList .fileItem .fileDelete {
   font-size: 10px;
   width: 22px;
   height: 22px;
   margin: 1px;
   color: #FFFFFF;
   background-color: #E45F56;
   border: 1px solid #C85555;
   border-radius: 2px;
}

.fileUploadList .fileList .fileItem .fileDelete.delete {
   font-size: 12px;
   width: 45px;
}
.fileUploadList .fileList .fileItem .fileDelete.cancel {
   background-color: #8D8D8D;
   border: 1px solid #8D8D8D;
}

.fileUploadList .fileList .fileItem [type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0 none;
}

.fileUloadBtn {
  display: inline-block;
  min-width: 53px;
  height: 20px;
  line-height: 20px;
  padding: 0 10px;
  border-radius: 2px;
  font-size: 12px;
  background-color: #333;
  color: #fff;
  text-align: center;
  cursor: pointer;
}

.fileUloadMinBtn {
  display: inline-block;
  font-size: 10px;
}

.fileUploadList .fileList col.fileNameDisp.short {
   width: 80px;
}
.fileUploadList .fileList .fileItem .fileNameDisp.short {
   width: 80px;;
}


/* multiSelectDropBox */
.form-control[readonly] {background-color : #ffffff;}
.dropDown {position: relative;}
.multiSelectDropBox {position:absolute; z-index:999; height:0; overflow:hidden; width:100%;}
.multiSelectDropBox.on {height:auto; padding:10px 0; border:1px solid #ddd; background:#fff;}
.multiSelectDropBox ul li:hover,
.multiSelectDropBox ul li.on {background:#eee;}
.multiSelectDropBox ul li label,.multiSelectDropBox ul li a {display:block; padding:0 10px;}
.multiSelectDropBox ul li label input {margin-right:5px;}
.multiSelectDropBox .btn_save {display:block; margin:10px auto 0; border:1px solid #ccc; padding:5px; margin-top: 10px !important;}
.multiSelectDropBox .btn_close {display:block; height:0; overflow:hidden;}
.multiSelectDropBox .on .btn_close,
.multiSelectDropBox .on .btn_close_check {
    position:fixed;
    z-index:-1;
    left:0;
    top:0;
    width:100%;
    height:100%;
    cursor:default;
    text-indent:-99999px;
}
.multiSelectDropBox ul {
   padding: 0px;
   margin-bottom: 0px;
   text-align: left;
   list-style-type: none;
   line-height: 10px;
}
.multiSelectDropBox ul li {
   padding-bottom: 3px;
}


.onlySingleByteNumber {
   text-align: right;
   ime-mode: disabled;
}

/** paging **/
.paging_div {
   width:auto;
   padding:10px 0 0 0;
}
.paging *{vertical-align:top;}
.paging{width:auto;text-align:center;}
.paging .before{display:inline-block; width:30px; height:30px; padding: 0px; margin-right: 5px;}
.paging .after{display:inline-block; width:30px; height:30px; padding: 0px; margin-right: 5px;}
/* .paging .before{margin:0 5px 0 -2px;display:inline-block;width:30px;height:30px;line-height:30px;color:#777;font-size:12px;padding-top: 3px;} */
/* .paging .before:focus{margin:0 5px 0 -2px;display:inline-block;width:30px;height:30px;line-height:30px;color:#fff;font-size:12px;padding-top: 3px;} */
/* .paging .after{margin:0 -2px 0 5px;display:inline-block;width:30px;height:30px;line-height:30px;color:#777;font-size:12px;padding-top: 3px;} */
/* .paging .after:focus{margin:0 -2px 0 5px;display:inline-block;width:30px;height:30px;line-height:30px;color:#fff;font-size:12px; padding-top: 3px;} */
.paging .current{margin:0 -1px;display:inline-block;width:30px;height:30px;line-height:30px;background:#00b3c8;border:1px solid #2e6da4;color:#fff;font-size:12px;}
.paging .lnk{margin:0 -1px;display:inline-block;width:30px;height:30px;line-height:30px;background:#fff;border:1px solid #e5e5e5;color:#777;font-size:12px;}
.paging .lnk:hover,
.paging .lnk:active,
.paging .lnk:focus{display:inline-block;width:30px;height:30px;line-height:30px;background:#00b3c8;border:1px solid #2e6da4;color:#fff;font-size:12px;}





.editAbleBox .edit .editArea [data-disp=N],
.editAbleBox .editArea [data-disp=Y] {
   display: inline;
}
.editAbleBox .editArea [data-disp=Y][data-disp-type=block] {
   display: block;
}
.editAbleBox .edit .editArea [data-disp=N][data-disp-type=inline-block] {
   display: inline-block;
}
.editAbleBox .edit .editArea .input-group {
   display: table;
}
.editAbleBox .edit .editArea [data-disp=Y],
.editAbleBox .editArea [data-disp=N] {
   display: none;
}


.mastManageBox .titleRow {
   color: #586E82;
   font-size: 15px;
   font-weight: 600;
   padding-left: 5px;
   margin-bottom: 7px;
}

.mastManageBox .headArea {
   display: inline-block;
   vertical-align: top;
   width: 300px;
}

.mastManageBox .headArea .zinGridBody {
   overflow-y: auto;
}

.mastManageBox .detailArea {
   display: inline-block;
   vertical-align: top;
   width: 400px;
   margin-left: 3px;
}

.mastManageBox .zinGridBody {
   height: 600px;
}

.mastManageBox .zinGridBody td {
   padding: 5px;
   height: 32px;
   text-align: left;
}

.noSearchResults{
   height:60px;
   line-height: 60px;
}
.noSearchResults:after {
  content: "NO DATA";
}

.onlyZenkaku {
   ime-mode:active;
}

.validationError {
   border-color: #EB5C58;
}
tr.validationError > td {
   background-color: #ffc8b3!important; 
   /*
   border-color: #EB5C58;
   border-style: solid;
   border-width: 2px;
   */
   
}

div.loginUser{
    float:left;
    margin: 3px 10px 0px 0px;
    height:28px;
    line-height:28px;
    width:120px; 
    text-align:center;
    font-size:15px;
    color : black;
    font-weight:bold;
    color:white;
}

.readonly{
    background-color:#eee!important;
}

@media (max-width:450px){
    .loginScreen .inputArea form { width: 300px; padding:10px; height:auto; }
    .loginScreen .inputArea form input { width: 100%; }
    .loginScreen .inputArea form button { width: 100%; margin-top:0; }
}