@charset "utf-8";

table, select, input, textarea, button, label{font-family: Pretendard, -apple-system, "Helvetica Neue", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}

/* =====================================================
	spinner
======================================================*/
.spinner-layer {display: none; position: fixed; top: 0; left: 0; z-index: 19999; width: 100%; height: 100%; background-color: rgba(0,0,0,0.1); }
.spinner-layer > .spinner {position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 9998; width: 46px; height: 46px; border: 3px solid #f9f9f9; border-top: 3px solid #606060; border-radius: 100%; margin: auto; animation: spin 1s infinite linear; }

@keyframes spin {
    from{
        transform: rotate(0deg);
    } to {
        transform: rotate(360deg);
    }
}





/* =====================================================
  reset
======================================================*/
div {position: relative; }
h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0; }
p {margin: 0; }

a {text-decoration: none; color: inherit; cursor: pointer; outline: none !important; }
a:hover,
a:focus,
a:active  {color: inherit; text-decoration: none; outline: none; }

button {background-color: transparent; border: none; cursor: pointer; outline: none !important; }


hr {margin-top: 10px; margin-bottom: 10px; border-top: 1px solid #d0d0d0; }

input::placeholder{font-size:13px;}



/* =====================================================
  common
======================================================*/
/* margin & padding */
.no-pd {padding: 0 !important; }
.no-mg {margin: 0 !important; }


/* align */
.clear::after{
  content: '';
  display: block;
  clear: both;
}
.left {float: left !important; }
.right {float: right !important; }

.align-top {vertical-align: top !important; }
.align-middle {vertical-align: middle !important; }
.align-bottom {vertical-align: bottom !important; }
.align-center {margin: 0 auto; }

/* no-image */
.no-image {background-color: #ebebeb; background-image: url("../images/common/no_image.png"); background-repeat: no-repeat; background-position: center center; background-size: 22px;}






/* =====================================================
  text
======================================================*/
/* font */
.f12{font-size: 12px !important;}

/* align */
.text-left {text-align: left !important; }
.text-center {text-align: center !important; }
.text-right {text-align: right !important; }


/* text-ellipsis */
.text-ellipsis01 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-ellipsis02 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.5; height: 3em; }
.text-ellipsis03 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; line-height: 1.5; height: 4.5em; letter-spacing: -0.2px;}


/* guide */
.text-guide {font-size: 13px; line-height: 16px; color: #222; } /* 해당내용의 보조 설명 */
.text-guide02 {font-size: 13px; line-height: 16px; color: #817053; } /* 진한 블루 */
.text-guide03 {font-size: 13px; line-height: 16px; color: #166d99; } /* 파일첨부 사이즈 가이드 */

/* padding */
.padding-center{padding: 0 10px !important;}

/* 화폐단위 */
.symbol {font-style: normal; }

.title-area {position: relative; width: 100%; height: 35px; padding: 0 5px; margin-bottom: 3px; border-bottom: 2px solid #817053; }
.title-area:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.title {font-size: 14px; font-weight: 700; line-height: 35px;}
.title-area .title {float: left; margin: 0; margin-right: 10px; padding-left: 11px; background-image: url("../images/common/bul_arrow.png"); background-repeat: no-repeat; background-position: left center; background-size: 6px 8px; }
.title-area .btn-small {margin-top: 6px;}
.title-area .text-guide,
.title-area .text-guide02,
.title-area .text-guide03 {line-height: 35px;}

.color-red {color: red !important; }
.color-blue {color: blue !important; }
.color-green {color: green !important; }
.color-white {color: white !important; }


/* panel-header
-----------------------------------------------------*/
/*.panel-header {}
.panel-header:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


.panel-header
.panel-header .btn {margin-top: 5px; }


.panel-header p,
.panel-header span,
.panel-header strong,
.panel-header em,
.panel-header i {line-height: 35px; }
*/

/* =====================================================
  color
======================================================*/
/* background */
.bg-modify {background-color: #fffaea; } /* 구) bg-pink */
.bg-modify:hover {background-color: #fffaea !important; }


/* bullet */
.bullet {padding-left: 10px; background-image: url("../images/common/bul_gray.png"); background-repeat: no-repeat; background-position: left center; color: #222; }
.bullet-blue {padding-left: 10px; background-image: url("../images/common/bul_blue.png"); background-repeat: no-repeat; background-position: left center; }
.bullet-red {padding-left: 10px; background-image: url("../images/common/bul_red.png"); background-repeat: no-repeat; background-position: left center; }





/* =====================================================
  page header
======================================================*/
.page-header {position: relative; width: 100%; margin: 0 0 15px; padding: 0; border-bottom: 0; }
.page-header:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* page-title */
.page-title {float: left; margin-right: 5px; font-size: 16px; line-height: 20px; color: #222; font-weight: 700; }
.page-title label {margin: 0; font-size: 16px; line-height: 20px; color: #222; font-weight: 700; cursor: pointer; }


/* page-bookmark */
.page-bookmark {float: left; width: 20px; height: 20px; margin: 0 5px 0 0; padding: 0; border: none; background-color: transparent; background-image: url("../images/common/bookmark.png"); background-repeat: no-repeat; background-position: left center; background-size: 16px auto; }
.page-bookmark.on {background-image: url("../images/common/bookmark_on.png");}
.page-bookmark:hover {background-image: url("../images/common/bookmark_hover.png"); }


/* page-guide */
.page-guide {float: left; width: 20px; height: 20px; background-image: url("../images/common/icon_guide.png"); background-repeat: no-repeat; background-position: center center; background-size: 16px; line-height: 20px; }

.layer-guidebox {display: none; position: fixed; top: 40px; z-index: 100; padding-top: 5px; }
.layer-guidebox .layer-header {height: 30px; background-color: #fff; box-sizing: border-box; }
.layer-guidebox .layer-title {line-height: 15px; text-align: left; color: #666; font-size: 14px; }
.layer-guidebox .layer-content {width: 280px; padding: 10px; border-radius: 5px; box-sizing: border-box; background-color: #fff; box-shadow: 0px 3px 9px 5px rgba(7, 7, 7, 0.1); white-space: normal; word-break: normal; word-wrap: break-word; font-size: 14px; color: #666; }


/*.btn-popup-close02 {position: absolute; top: 0px; right: -25px; width: 20px; height: 20px; background-image: url("../images/common/btn_popup_close02.png"); background-repeat: no-repeat; background-position: center center; background-size: 10px; }*/

.breadcrumbs {float: right; }
.breadcrumbs:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.breadcrumbs li {float: left; padding-right: 16px; margin-right: 10px; background-image: url("../images/common/breadcrumbs_arrow.png"); background-repeat: no-repeat; background-position: right center; background-size: 6px 10px; font-size: 13px; color: #222; cursor: default;}
.breadcrumbs li:last-child {padding-right: 0; margin-right: 0; background-image: none; font-weight: 700; color: #422e1a;  }

.breadcrumbs li > a,
.breadcrumbs li > span {display: inline-block; font-size: 12px; color: #422e1a; }

.breadcrumbs .home a,
.breadcrumbs .home span {width: 16px; height: 17px; background-image: url("../images/common/breadcrumbs_home.png"); background-repeat: no-repeat; background-position: center center; background-size: 14px auto; text-indent: -9999px; vertical-align:top;}





/* =====================================================
  box
======================================================*/
.box {position: relative; display: block; width: 100%; margin: 0; padding: 10px 10px; background-color: #fff; border: 2px solid #e1e3e4;}
.box:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


.box-blue {position: relative; display: block; width: 100%; margin: 0; padding: 10px 10px; box-sizing: border-box; background-color: #422e1a; color: #fff; }
.box-blue:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


.box-input {position: relative; display: block; width: 100%; margin: 0; padding: 10px 10px; border: 1px solid #422e1a; border-radius: 5px; box-sizing: border-box; background-color: #fafbfd}


/* prebox */
.prebox {width: 100%; display: block; padding: 0; margin: 0; border: none; box-sizing: border-box; border-radius: 0; background-color: transparent; font-family: Pretendard, -apple-system, "Helvetica Neue", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-size: 14px; font-weight: 400; line-height: 1.5; text-align: left; color: #222; word-break: normal; word-wrap: break-word; white-space: pre-line; -ms-appearance: none; -webkit-appearance: none; appearance: none; -ms-overflow-style: none; }
.prebox::-webkit-scrollbar,
.prebox::-ms-scrollbar {appearance: none; }


/* overflow */
.over-scroll {position: relative; overflow: hidden; overflow-y: auto; }
.over-scroll-x {position: relative; overflow: hidden; overflow-x: auto; }
.over-scroll-both {position: relative; overflow: scroll; }





/* =====================================================
  list
======================================================*/
ul, ol, li, dl, dt, dd {list-style: none; padding: 0; margin: 0; }

ul:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
ol:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
dl:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.list-dash {}
.list-dash > li {}
.list-dash > li:before {content: "-"; padding-right: 5px; }

.list-dot {}
.list-dot > li {}
.list-dot > li:before {content: ""; display: inline-block; width: 3px; height: 3px; padding-right: 5px; background-image: url("../images/common/list_dot.png"); background-repeat: no-repeat; background-position: left top; vertical-align: middle; }





/* =====================================================
  table
======================================================*/
table {width: 100%; padding: 0; border-collapse: collapse; border-spacing: 0; table-layout: fixed; border: 0; background-image: none; }

/*table tr:hover {background-color: #f7f7f7; }*/
table.no-hover tr:hover {background-color: transparent; }

table th,
table td {padding: 6px 10px; height: 34px; box-sizing: border-box; word-break: normal; white-space: normal; vertical-align: middle; font-size: 14px; color: #222; }

table img {max-width: 100%; }

table thead tr:hover {background-color: transparent; }

table .line th,
table .line td {height: 1px; padding: 4px 0; border-bottom: 1px solid #dfdfdf; }

table .line + tr th,
.table-write .line + tr td {padding-top: 8px; }

td.td-open-content {padding-right: 10px; background-image: url("../images/common/arrow_up_triangle.png"); background-repeat: no-repeat; background-position: right 10px center; background-size: 7px auto; vertical-align: middle; }
td.td-open-content.active {background-image: url("../images/common/arrow_down_triangle.png");}


/* 가로형 */
.table-horizon {border: 1px solid #eaeaea; }
.table-horizon th,
.table-horizon td {border-right: 1px solid #eaeaea; padding: 10px 6px; border-top: 1px solid #eaeaea; }
.table-horizon th {background-color: #fff; font-weight: 700; color: #222; }
.table-horizon th > * {color: #222; font-size: 14px;}
.table-horizon td {background-color: #fff; }

.table-horizon .table-write th,
.table-horizon .table-write td {border-top: 0; border-right: 0; }



/* table-header
-----------------------------------------------*/
.table-header {padding-bottom: 5px; }
.table-header:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.table-header h4{font-weight: 600; line-height: 35px;}
.tit-deco{font-size: 14px;}

/* table-roof */
.table-roof thead tr th,
.table-roof thead tr td {border: none; border-top-left-radius: 5px; border-top-right-radius: 5px; box-sizing: border-box; background-color: #464644; overflow: hidden; }

/* table count */
.table-count {margin: 0; padding: 0; font-size: 14px; color: #222; vertical-align: bottom; line-height: 28px; }
.table-count .count-all {font-size: 14px; color: #222; font-weight: 700; }
.table-count .count-current {font-size: 14px; color: #422e1a; font-weight: 700; }


/* table header btn group*/
.table-header .btn-group {}
.table-header .right > * {float: left; line-height: 30px;}
.table-header .right > * + * {margin-left: 5px; }
.table-header .right > div + div {margin-left: 10px; } /* 2021-01-19 김유란 */
.table-header .right > div + div:last-child {margin-left: 15px; } /* 2021-01-19 김유란 */
.table-header .right > .unit-total {line-height: 28px; } /* 2021-01-19 김유란 */




/* table-bottom
-----------------------------------------------*/
.table-bottom {width: 100%; margin: 10px 0; text-align: center; }

.btn.table-next {width: 148px; height: 36px; border-radius: 36px; outline: none; border: 1px solid #dbdbdb; background-color: #fff; color: #6c6c6c; font-size: 12px; text-align: center; } /* 구 btn-next */
.btn.table-next:hover,
.btn.table-next:focus,
.btn.table-next.focus {background-color: #f4f4f4; border-color: #dbdbdb; color: #6c6c6c; }



/* table common
-----------------------------------------------*/
table td.col-button .btn {min-width: 50px; }
table td.col-image {padding: 6px 2px; }
table td.col-image img {width: 40px; }



/* table-default 검색결과 리스트
-----------------------------------------------*/
.table-default thead th,
.table-default thead td {padding: 6px 0; border-left: 1px solid #ccc; color: #222; line-height: 22px; text-align: center; vertical-align: middle; background-color: #ededed;}

.table-default.small-table thead th,
.table-default.small-table tbody td{padding: 4px; font-size: 12px; height: auto;}

.table-default thead tr.fixed-top .fixedHeader {top: 0; }

.table-default th,
.table-default td {padding: 10px 10px; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; line-height: 22px; text-align: center; vertical-align: middle; color:#222 ; background-color:#fff;}



/* table-sorter
-----------------------------------------------*/
.table-sorter { border-collapse: separate;    border-spacing: 0;  border-right: 1px solid #ccc;  border-top: 1px solid #ccc; }
.table-sorter thead .header {background-color: #f5f5f5; background-image: url("../images/common/sorter.png"); background-repeat: no-repeat; background-position: center right; cursor: pointer; background-size: 21px 9px; padding:0 15px 0 8px; box-sizing:border-box;}

.table-sorter thead .headerSortUp {background-color: #f5f5f5; background-image: url("../images/common/sorter_asc.png"); background-repeat: no-repeat; background-position: center right; background-size: 21px 5px;  }
.table-sorter thead .headerSortDown {background-color: #f5f5f5; background-image: url(../images/common/sorter_desc.png);  background-repeat: no-repeat; background-position: center right; background-size: 21px 5px;  }

/*.class='tbl-tr' */

.tbl-tr td{background-color:#f7f7f7;}


/* table-write
-----------------------------------------------*/
.table-write tr:hover {background-color: transparent; }
.table-write > tbody > td {padding: 8px 10px 8px; vertical-align: top; }

.table-write > tbody > tr > td:first-child {padding-left: 0; }
.table-write > tbody > tr > td:last-child {padding-right: 0; }

.table-write:first-child > tr:first-child > th,
.table-write:first-child > tr:first-child > td,
.table-write:first-child > tbody > tr:first-child > th,
.table-write:first-child > tbody > tr:first-child > td{padding-top: 0; }





/* =====================================================
  icon
======================================================*/
.icon-excel {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_xls.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-pdf {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_pdf.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-ppt {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_ppt.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-png {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_png.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-zip {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_zip.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-jpg {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_jpg.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-doc {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_doc.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }
.icon-etc {display: inline-block; width: 24px; height: 24px; background-image: url("../images/common/icon_etc.png"); background-repeat: no-repeat; background-position: center center; background-size: 24px auto; }

.icon-arrowdown-triangle {display: inline-block; width: 16px; height: 16px; background-image: url("../images/common/arrow_down_triangle.png"); background-repeat: no-repeat; background-position: center center; background-size: 7px auto; vertical-align: middle; }

.icon-open {display: inline-block; width: 14px; height: 14px; margin-left: 3px; background-image: url("../images/common/icon_open.png"); background-repeat: no-repeat; background-position: center center; background-size: 12px auto; vertical-align: middle; }
.icon-open:hover {background-image: url("../images/common/icon_open_on.png"); }




/* =====================================================
  button
======================================================*/
.btn {display: inline-block; min-width: 30px;  height: 30px; margin: 0; padding: 0 10px; border: 1px solid #000; box-sizing: border-box; border-radius: 3px; outline: none; background-color: #000; font-size: 14px; font-weight: 400; color: #fff; line-height: 28px; text-align: center; white-space: nowrap; vertical-align: middle; -webkit-appearance: none; }

.btn:hover,
.btn:focus,
.btn.focus {background-color: #000; border-color: #000; color: #fff; outline: none; box-shadow: none; }

/* 사용불가능*/
.btn-dis,
.btn-dis:hover,
.btn-dis:focus,
.btn-dis.focus {border: 1px solid #bdbdbd !important; background-color: #bdbdbd !important; color: #fff !important; cursor: not-allowed;}

/* 초기화 */
.btn-reset {min-width: 30px; height: 30px; padding: 0; background-color: #fff; border-color: #ccc; background-image: url("../images/common/btn_reset.png"); background-repeat: no-repeat; background-position: center center; background-size: 14px 14px; text-indent: -9999px; }
.btn-reset:hover,
.btn-reset:focus,
.btn-reset.focus {background-color: #fff; border-color: #ccc;}


/* 검색 */
.btn-search {background-color: #422e1a; border-color: #422e1a; }
.btn-search:hover,
.btn-search:focus,
.btn-search.focus {background-color: #422e1a; border-color: #422e1a; }


.btn-search-dis {background-color: #bdbdbd; border-color: #bdbdbd; cursor: default; }
.btn-search-dis:hover,
.btn-search-dis:focus,
.btn-search-dis.focus {background-color: #bdbdbd; border-color: #bdbdbd; cursor: default; }


/* 일괄수정 */
.btn-alledit {padding-left: 28px; background-color: #7265B0; background-image: url("../images/common/all_edit.png");  background-repeat: no-repeat; background-size: 13px; background-position: left 10px center; border-color: #7265b0; }
.btn-alledit:hover,
.btn-alledit:focus,
.btn-alledit.focus {background-color: #7265B0; border-color: #7265B0; }

/* 선택항목 일괄 API 갱신 */
.btn-upload{background-image: url(../images/common/icon_upload.png);padding-left: 32px;}
.btn-api{background-image: url(../images/common/icon_synchronization.png);}

/* 선택수정 */
.btn-modify {background-color: #9083cb; border-color: #9083cb; color: #fff; }
.btn-modify:hover,
.btn-modify:focus,
.btn-modify.focus {background-color: #9083cb; border-color: #9083cb; }

/* 미리보기 */
.btn-mail-preview { background-color: #666; border: 1px solid #666; margin-top: 5px; }
.btn-mail-preview:hover { background-color: #888; border: 1px solid #888;  }

/* 글작성 + 등록 구_btn-pink */
.btn-write {padding-left: 35px; background-color: #422e1a; background-image: url("../images/common/icon_write.png"); background-repeat: no-repeat; background-size: 16px 16px; background-position: left 10px center; border-color: #422e1a; }

.btn-write:hover,
.btn-write:focus,
.btn-write.focus {background-color: #422e1a; border-color: #422e1a; }

/*바코드 추가 22-03-30 (LSJ)*/
.btn-barcode {padding-left: 35px; background-color: #e0f55c; background-image: url("../images/common/icon_barcode.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: left 10px center; border-color: #422e1a; }

.btn-barcode:hover,
.btn-barcode:focus,
.btn-barcode.focus {background-color: #422e1a; border-color: #422e1a; }


/* 글 삭제 */
.btn-delete {background-color: #222; border-color: #222; }
.btn-delete:hover,
.btn-delete:focus,
.btn-delete.focus {background-color: #222; border-color: #222; }


/* 저장 구_btn-deepblue*/
.btn-save  {background-color: #422e1a; border-color: #422e1a; }

.btn-save:hover,
.btn-save:focus,
.btn-save.focus {background-color: #422e1a; border-color: #422e1a; }


/* 플러스 버튼 */
.btn-add {min-width: 30px; }



/* 삭제 버튼*/
.btn-cancel {width: 30px; background-color: #fff; border-color: #e3e3e3; color: #686868; }

.btn-cancel:hover,
.btn-cancel:focus,
.btn-cancel.focus {background-color: #f1f1f1; border-color: #e3e3e3; color: #686868; }


/* 일자 삭제 */
.btn.btn-time-del { background-color: #fff; border: 1px solid #ccc; background-position: center; background-repeat: no-repeat; background-size: 13px auto; text-indent: -999px; background-image: url(/AppData/images//common/icon_trash.png);  }
.btn.btn-time-del:hover { background-color: #f5f5f5; border-color: #ccc; }

/* 다운로드 버튼 구_btn-download-file */
.btn-download {display: inline-block; padding-left: 28px; background-color: #53aea0; border-color: #53aea0; background-image: url("../images/common/btn_download.png"); background-repeat: no-repeat; background-position: left 10px center; text-align: left; }
.btn-download:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

/* 강은아 btn-dwnload hover, focus 효과 추가 */
.btn-download:hover,
.btn-download:focus,
.btn-download.focus {background-color: #4f8e84; border-color: #4f8e84; }

.btn-download + .btn-download  {margin-top: 5px;}

.btn-download .icon {float: left; display: inline-block; width: 24px; height: 24px; background-size: 24px auto; }
.btn-download span {float: left; display: inline-block; width: calc(100% - 30px); color: #7b83ab; margin-left: 5px; line-height: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }


/* 다운로드 버튼 (확장자 아이콘) */
.btn-download.filename-extension {display: inline-block; padding-left: 0; background-color: #fff; background-image: none; border-color: #53aea0;text-align: left; cursor: pointer; }
.btn-download.filename-extension span {width: calc(100% - 29px); }


/* 업로드 버튼 구_btn-download-file */
.btn-upload {min-width: 50px; background-color: #222; border-color: #222; color:#fff;}
.btn-upload:hover,
.btn-upload:focus,
.btn-upload.focus {background-color: #222; border-color: #222; }

.upload-wrapper {}
.upload-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.upload-wrapper > * {float: left; }
.upload-wrapper .btn-upload {float: left; min-width: 50px; }
.upload-wrapper .btn {margin-right: 10px; }

.upload-viewer {display: block; margin-top: 5px; }



/* 엑셀 다운로드 버튼 */
.btn-excel {float: left; background-color: #fff; border-color: #ccc; background-image: url("../images/common/btn_excel.png"); background-repeat: no-repeat; background-position: center center; background-size: 18px;  }
.btn-excel:hover,
.btn-excel:focus,
.btn-excel.focus {background-color: #fff; border-color: #ccc;}

.btn-excel.excel-txt {float: none; padding-left: 30px; background-position: left 8px center; color: #0c5625; }

.btn-excel-dis {float: left; padding: 0;  min-width: 30px; width: 30px; height: 30px; background-color: #BDBDBD; border-color: #BDBDBD; background-image: url("../images/common/btn_excel_dis.png"); background-repeat: no-repeat; background-position: center center; background-size: 18px;  }
.btn-excel-dis:hover,
.btn-excel-dis:focus,
.btn-excel-dis.focus {background-color: #BDBDBD; border-color: #BDBDBD; cursor: not-allowed; }


/* 엑셀 업로드 버튼 */
.btn-excel-upload { padding-left: 35px;  background-image: url(../images/common/btn_excel_w.png);  background-repeat: no-repeat;  background-position: left 10px center;  background-size: 16px; border-color: #0c5625; background-color: #0c5625;}
.btn-excel-upload:hover,
.btn-excel-upload:focus,
.btn-excel-upload .focus { background-color: #0c5625; border-color: #0c5625; }
.btn-excel-upload-dis {   background-color: #BDBDBD;  border-color: #BDBDBD;  background-image: url(../images/common/btn_excel_dis.png); background-size: 16px; color: #444; }
.btn-excel-upload-dis:hover,
.btn-excel-upload-dis:focus,
.btn-excel-upload-dis.focus{   background-color: #BDBDBD;  border-color: #BDBDBD;  cursor: not-allowed; color: #444; }


/* 전화 걸기 + 전화 끊기 22-05-11 이승진*/
.btn-call{min-width: 30px; height: 30px; padding: 0; background-color: #fff; border-color: #d7d7d7; background-repeat: no-repeat; background-position: center center; background-size: 18px; background-image: url(../images/common/btn_call_gr.png); text-indent: -9999px;}
.btn-hangup{min-width: 30px; height: 30px; padding: 0; background-color: #fff; border-color: #d7d7d7; background-repeat: no-repeat; background-position: center center; background-size: 18px; background-image: url(../images/common/btn_call_rd.png); text-indent: -9999px;}

.btn-call:hover,
.btn-call:focus,
.btn-call.focus {background-color: rgba(51, 138, 94, .1); border-color: #d7d7d7;}

.btn-hangup:hover,
.btn-hangup:focus,
.btn-hangup.focus {background-color: rgba(208, 24, 24, .1); border-color: #d7d7d7;}

/* 계산기 22-05-20 고동표 */
.btn-calculator {min-width: 30px; height: 30px; padding: 0; background-color: #fff; border-color: #d7d7d7; background-image: url("../images/common/icon_calculator.png"); background-repeat: no-repeat; background-position: center center; background-size: 40px 40px; text-indent: -9999px; }
.btn-calculator:hover,
.btn-calculator:focus,
.btn-calculator.focus {background-color: #f1f1f1; border-color: #d7d7d7;}

/* =====================================================
  upload-wrapper
=====================================================



.upload-wrapper > input[type="text"] {width: 220px; float: left; }




.upload-wrapper .btn-delete {float: left; min-width: 50px; height: 24px; font-size: 12px; line-height: 22px; }


.upload-viewer {margin-top: 2px; }


*/

/* color
-----------------------------------------------*/
/* white */
.btn-white {background-color: #fff; border-color: #e3e3e3; color: #686868; }

.btn-white:hover,
.btn-white:focus,
.btn-white.focus {background-color: #fff; border-color: #e3e3e3; color: #686868; }



/* blue */
.btn-blue {background-color: #81a1bf; border-color: #81a1bf; }

.btn-blue:hover,
.btn-blue:focus,
.btn-blue.focus {background-color: #81a1bf; border-color: #81a1bf; }


/* yellow */
.btn-yellow {background-color: #eba639; border-color: #eba639; }

.btn-yellow:hover,
.btn-yellow:focus,
.btn-yellow.focus {background-color: #eba639; border-color: #eba639; }


/* pink */
.btn-pink {background-color: #222; border-color: #222; color:#fff;}

/*.btn-pink:hover,
.btn-pink:focus,
.btn-pink.focus {background-color: #e9970a; border-color: #e9970a; }*/

.btn-pink-line {background-color: #222; border-color: #222; color: #fff; }

/*.btn-pink-line:hover,
.btn-pink-line:focus,
.btn-pink-line.focus {background-color: #ffdbdb; border-color: #222; color: #222; }*/




/* size */
.btn-full {width: 100% !important; }
.btn-small {height: 24px !important; font-size: 12px; line-height: 22px !important; }


/* =====================================================
  tab-wrapper
======================================================*/
.tab-wrapper {position: relative; width: 100%; margin: 7px 0; background: none; }


/* tab-style01 */
.tab-style01 {border-bottom: 1px solid #422e1a; background-color: #fff; }
.tab-style01:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.tab-style01 > li {position: relative; float: left; padding: 5px 10px;  color: #222; text-align: center; }
.tab-style01 > li > a,
.tab-style01 > li > button {display: block; margin: 0; padding: 0; font-size: 13px; font-weight: 400; color: #222; text-align: center; }

.tab-style01 > li.current {margin-bottom: -1px; padding: 5px 10px; border: 1px solid #422e1a; border-bottom-left-radius: 0; border-bottom-right-radius: 0; box-sizing: border-box; border-bottom: 0; background-color: inherit; overflow: hidden; }
.tab-style01 > li.current > a,
.tab-style01 > li.current > button {color: #222; font-size: 14px; font-weight: 700; }




/* =====================================================
  input
======================================================*/
input {outline: none; }
label {margin: 0; font-weight: 400; color: #222; font-size: 14px; cursor: pointer; }


input[type="text"],
input[type="password"] {display: inline-block; width: 100%; height: 30px; padding: 0 8px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; box-sizing: border-box; font-size: 14px; line-height: 1.5; color: #222; font-weight: 400; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; }


/* readonly & disabled */
input[type="text"]:read-only {background-color: #eee; color: #222; cursor: auto; }
input[type="text"][readonly="readonly"] {background-color: #eee; color: #222; cursor: auto; }
input[type="text"].readonly {background-color: #eee; color: #222; cursor: auto; }

input[type="text"]:disabled {background-color: #eee; color: #666; cursor: not-allowed; }
input[type="text"][disabled="disabled"] {background-color: #eee; color: #666; cursor: not-allowed; }
input[type="text"].disabled {background-color: #eee; color: #666; cursor: not-allowed; }

input[type="password"]:read-only {background-color: #eee; color: #222; cursor: auto; }
input[type="password"][readonly="readonly"] {background-color: #eee; color: #222; cursor: auto; }
input[type="password"].readonly {background-color: #eee; color: #222; cursor: auto; }

input[type="password"]:disabled {background-color: #eee; color: #666; cursor: not-allowed; }
input[type="password"][disabled="disabled"] {background-color: #eee; color: #666; cursor: not-allowed; }
input[type="password"].disabled {background-color: #eee; color: #666; cursor: not-allowed; }


/* placeholder */
input:-webkit-input-placeholder {color: #98aaaf !important; font-weight: 400 !important; }
input:-moz-placeholder  {color: #98aaaf !important; font-weight: 400 !important; }
input:-ms-input-placeholder  {color: #98aaaf !important; font-weight: 400 !important; }
input:placeholder {color: #98aaaf !important; font-weight: 400 !important; }
input::placeholder {color: #98aaaf !important; font-weight: 400 !important; }


input[type="text"]:read-only:-webkit-input-placeholder {color: #222 !important; }
input[type="text"]:read-only:-moz-placeholder {color: #222 !important; }
input[type="text"]:read-only:-ms-input-placeholder {color: #222 !important; }
input[type="text"]:read-only:placeholder {color: #222 !important; }
input[type="text"]:read-only::placeholder {color: #222 !important; }

input[type="text"].readonly:-webkit-input-placeholder {color: #222 !important; }
input[type="text"].readonly:-moz-placeholder {color: #222 !important; }
input[type="text"].readonly:-ms-input-placeholder {color: #222 !important; }
input[type="text"].readonly:placeholder {color: #222 !important; }
input[type="text"].readonly::placeholder {color: #222 !important; }

input[type="text"][readonly="readonly"]:-webkit-input-placeholder {color: #222 !important; }
input[type="text"][readonly="readonly"]:-moz-placeholder {color: #222 !important; }
input[type="text"][readonly="readonly"]:-ms-input-placeholder {color: #222 !important; }
input[type="text"][readonly="readonly"]:placeholder {color: #222 !important; }
input[type="text"][readonly="readonly"]::placeholder {color: #222 !important; }


input[type="text"]:disabled:-webkit-input-placeholder {color: #222 !important; }
input[type="text"]:disabled:-moz-placeholder {color: #222 !important; }
input[type="text"]:disabled:-ms-input-placeholder {color: #222 !important; }
input[type="text"]:disabled:placeholder {color: #222 !important; }
input[type="text"]:disabled::placeholder {color: #222 !important; }

input[type="text"].disabled:-webkit-input-placeholder {color: #222 !important; }
input[type="text"].disabled:-moz-placeholder {color: #222 !important; }
input[type="text"].disabled:-ms-input-placeholder {color: #222 !important; }
input[type="text"].disabled:placeholder {color: #222 !important; }
input[type="text"].disabled::placeholder {color: #222 !important; }

input[type="text"][disabled="disabled"]:-webkit-input-placeholder {color: #222 !important; }
input[type="text"][disabled="disabled"]:-moz-placeholder {color: #222 !important; }
input[type="text"][disabled="disabled"]:-ms-input-placeholder {color: #222 !important; }
input[type="text"][disabled="disabled"]:placeholder {color: #222 !important; }
input[type="text"][disabled="disabled"]::placeholder {color: #222 !important; }


/* focus */
input[type="text"]:focus,
input[type="password"]:focus {border-color: #ccc; }

input[type="text"]:read-only:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }
input[type="text"].readonly:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }
input[type="text"][readonly="readonly"]:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }
input[type="text"]:disabled:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: not-allowed; }
input[type="text"].disabled:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: not-allowed; }
input[type="text"][disabled="disabled"]:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }

input[type="password"]:read-only:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }
input[type="password"].readonly:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }
input[type="password"][readonly="readonly"]:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: auto; }
input[type="password"]:disabled:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: not-allowed; }
input[type="password"].disabled:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: not-allowed; }
input[type="password"][disabled="disabled"]:focus {background-color: #ddd; border-color: #ccc; color: #222; cursor: not-allowed; }


/**/
input[type="text"].input-show {height: 1.5em; padding: 0; background-color: transparent; border: none; outline: none; line-height: 25px; vertical-align: top;}
input[type="text"].input-show:focus {background: transparent; }


/* input size */
.input-small {width: 100px !important; }
.input-medium {width: 300px !important; }
.input-large {width: 500px !important; }
.input-half {width: 50% !important; }
.input-full {width: 100% !important; }


/* input login */
input.input-login {width: 460px; height: 45px; box-sizing: border-box; }


/* input-group */
.input-group {display: block; }
.input-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.input-group input {float: left; margin-right: 5px; }


/* input-time */
.time-group {}
.time-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
input[type="text"].input-time {width: 100%; padding-left: 28px; background-image: url("../images/common/icon_time.png");  background-repeat: no-repeat; background-position: 8px center; background-size: auto 12px; text-align: left; }

/*

.input-group {display: block; }
.input-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.input-group > * {float: left; }

.input-group > input[type="checkbox"],
.input-group > input[type="radio"] {float: left; margin-top: 6px; }

.input-group > input[type="checkbox"] + label,
.input-group > input[type="radio"] + label {float: left; line-height: 24px; margin-right: 20px; color: #222; }



.input-group > input[type="text"] {width: 200px; }
.input-group > input[type="checkbox"] + input[type="text"],
.input-group > input[type="radio"] + input[type="text"] {margin-left: 5px; }

.input-group > input[type="text"] + input[type="checkbox"],
.input-group > input[type="text"] + input[type="radio"] {width: 200px; margin-right: 15px; }


input[type="text"] + .btn,
input[type="text"] + .btn + .btn {height: 24px; line-height: 22px; font-size: 12px; }

*/


/* checkbox & radio
-----------------------------------------------*/
input[type="checkbox"],
input[type="radio"] {display: inline-block; margin: 0; vertical-align: middle;width:17px;height:17px; }

input[type="checkbox"] + label,
input[type="radio"] + label {display: inline-block; margin-left: 5px; margin-right: 15px;  }

input[type="checkbox"] + input[type="text"],
input[type="text"] +  input[type="checkbox"],
input[type="radio"] + input[type="text"],
input[type="text"] + input[type="radio"] {margin-left: 5px; }



/* 가로형 checkbox & radio 그룹 */
.check-group {height: 30px; line-height: 30px; }
.check-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.check-group > input,
.check-group > label {float: left; }

.check-group > input[type="checkbox"],
.check-group > input[type="radio"] {margin-top: 8px; }





/* =====================================================
  select
======================================================*/
select {display: inline-block; width: 100%; height: 30px; padding: 0 25px 0 8px; overflow: hidden; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; box-sizing: border-box; box-shadow: none; font-size: 14px; line-height: 28px; color: #222; font-weight: 400; vertical-align: middle; word-wrap: break-word; outline: 0; background-image:url(../images/common/select_arrow_down.png); background-repeat:no-repeat; background-position:right 8px center; background-size:10px auto;  -webkit-appearance:none; /* 크롬 화살표 없애기 */
    -moz-appearance:none; /* 파이어폭스 화살표 없애기 */
    appearance:none /* 화살표 없애기 */}
select:focus {border-color: #ccc; outline: 0; }

select.wd100 {width: 100% !important; }
select.wd100 + .select2 {width: 100% !important; }

.select-disabled {background-color: #f0f0f0; border-color: #ccc; color: #222; cursor: not-allowed; }


/* select size */
.select-small {width: 100px !important; }
.select-medium {width: 300px !important; }
.select-large {width: 500px !important; }
.select-half {width: 50%; }
.select-full {width: 100%; }

select + select {margin-left: 5px; }
select + input {margin-left: 5px; }

.select-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.select-group.vertical select + select,
.select-group.vertical select + input {margin-left: 0; margin-top: 5px; }



/* =====================================================
  textarea
======================================================*/
textarea {position: relative; display: block; width: 100%; height: 200px; padding: 8px 8px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; box-sizing: border-box; box-shadow: none; font-size: 14px; line-height: 1.5; color: #222; font-weight: 400; resize: none; }

textarea:-webkit-input-placeholder {color: #98aaaf !important; font-weight: 400 !important; }
textarea:-moz-placeholder {color: #98aaaf !important; font-weight: 400 !important; }
textarea:-ms-input-placeholder {color: #98aaaf !important; font-weight: 400 !important; }
textarea:-ms-input-placeholder {color: #98aaaf !important; font-weight: 400 !important; }
textarea:-moz-placeholder {color: #98aaaf !important; font-weight: 400 !important; }
textarea::placeholder {color: #98aaaf !important; font-weight: 400 !important; }
textarea:placeholder {color: #98aaaf !important; font-weight: 400 !important; }

textarea:focus {border-color: #ccc; outline: 0; }


/* focus :: readonly & disabled */
textarea.readonly {background-color: #fff; color: #222; cursor: auto; }
textarea:focus.readonly {border-color: #ccc; }

textarea + .textarea-count {margin-bottom: 0; text-align: right; font-size: 12px; }






/* =====================================================
  form
======================================================*/
.item-title {display: block; font-size: 13px; color: #222; font-weight: bold; line-height: 25px; }

.item-title .text-guide,
.item-title .text-guide02,
.item-title .text-guide03 {font-size: 13px; font-weight: normal; padding-left: 10px; line-height: 25px; }

.item-require {font-weight: 700; font-size: 13px; }
.item-require:before {content: "*"; color: #ff0000; padding-right:2px;}

.file-list li {  margin-top: 5px; }
 
/* range-wrapper */
.range-wrapper {}
.range-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.range-wrapper input[type="text"] {float: left; width: 100px; margin-right: 5px; text-align: center; }


.range-wrapper .input-date-group {float: left; margin-right: 10px; }

.range-wrapper .btn {position: relative; z-index: 1; float: left; min-width: 50px; border-radius: 0; }
.range-wrapper .btn.active {z-index: 3; }

.range-wrapper .btn:first-of-type {border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
.range-wrapper .btn:last-of-type {border-top-right-radius: 3px; border-bottom-right-radius: 3px; }

/* form - li*/
.list-form ul::after{
  content: '';
  display: block;
  clear: both;
}
.list-form ul li{
  width: 20%;
  float: left;
  padding: 10px 20px 10px 0;
  box-sizing: border-box;
  min-height: 80px;
}
/*.list-form ul li:nth-child(3n){padding-right: 0;}*/

/* =====================================================
  search-container
======================================================*/
.search-container {position:  relative; display: block; width: 100%; margin: 0 auto 35px; padding: 10px 15px; background-color: #f5f5f5; border: 1px solid #ccc; box-sizing: border-box; }
.search-container:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.search-container .check-group,
.search-container .input-date-group {float: left; }


/* search-wrapper */
.search-wrapper {}
.search-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* search-area */
.search-area {float: left; width: calc(100% - 190px); }
.search-area:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.search-area li {float: left; margin: 5px 0; }
.search-area li + li {margin-left: 15px; }

.search-area .bullet-red {color: #222; font-weight: 700; }

.search-area input[type="text"],
.search-area select {width: 150px; }
.search-area label {margin-right: 4px; }
.search-area input[type="file"],
.search-area input[type="checkbox"] {display: inline-block; font-size: 12px; }
.search-area input[type="file"] {width: 200px; height: 30px; overflow: hidden; text-overflow: ellipsis; line-height: 24px; }

.search-area .input-date-group {display: inline-block; }


/* search-btn-group */
.search-btn-group {float: right; padding-left: 15px; margin-top: 6px; }
.search-btn-group .btn + .btn {margin-left: 5px; }
.search-btn-group .btn-search {float: left; width: 100px; height: 30px; }
.search-btn-group .btn-reset {float: left; }


/* search-input-group box */
.search-input-group {display: inline-block; padding: 0 10px; border: 1px solid #422e1a; border-radius: 5px; }
.search-input-group label {font-size: 12px; }
.search-input-group label:last-child {margin-right: 0; }


.search-guidebox {display: inline-block; margin-top: 10px; border: 1px solid #422e1a; border-radius: 5px; padding: 10px 10px; }




/* 상세검색
-----------------------------------------------*/
/* 상세검색 열기 & 닫기  버튼 */
.btn-search-detail {position: absolute; top: 100%; left: 50%; margin-left: -60px; z-index: 1; display: block; width: 120px; height: 28px; background-color: #fff; border-color: #ccc; border-radius: 10px; border-top-left-radius: 0; border-top-right-radius: 0; color: #222; font-size: 12px; text-align: center; line-height: 26px; }
.btn-search-detail span {float: none; padding-left: 3px; font-size: 12px; color: #222; font-weight: 400; opacity: 1; text-shadow: none; }

.btn-search-detail:hover,
.btn-search-detail:focus,
.btn-search-detail.focus {background-color: #fff; border-color: #ccc; color: #222; }

.btn-search-detail .close {display: none; }
.btn-search-detail .close:hover{opacity:1;}
.btn-search-detail .open {display: inline-block; }

.search-container.active .btn-search-detail .close {display: inline-block; }
.search-container.active .btn-search-detail .open {display: none; }


/* 상세검색 영역 */
.search-detail-wrapper {display: none; margin-top: 5px; padding-top: 10px; border-top: 1px solid #e2e2e2; }
.search-container.active .search-detail-wrapper {display: block; }


/* 항상 상세검색 */
.search-always {margin-bottom: 5px; }
.search-always:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.search-always label {cursor: pointer; }
.search-always label:hover {font-weight: 700; }
.search-always input:checked ~ label {font-weight: 700; }


/* 상세검색  table */
.search-detail-table {position: relative; }
.search-detail-table tr:hover {background-color: transparent; }








/* =====================================================
  popup-layer
======================================================*/
.b-modal {display: none !important; }
.popup-layer {display: none; position: relative; min-width: 400px; z-index: 20; margin: 0 auto; background-color: #fff; box-shadow: 3px 3px 10px 10px rgba(7, 7, 7, 0.3); box-sizing: border-box;  }

.popup-depth .popup-header {background-color: #422e1a; }
.popup-depth2 .popup-header { background-color: #422e1a; }


/* popup header
-----------------------------------------------*/
.popup-header {width: 100%; height: 36px; padding: 0 10px; box-sizing: border-box; background-color: #422e1a; cursor: default; vertical-align: middle; text-align: left; }
.popup-header:hover {
  cursor: move; /* fallback if grab cursor is unsupported */
  cursor: -moz-grab;
  cursor: -webkit-grab;
  cursor: grab;
}
.popup-header:active {
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.popup-header:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


.popup-title {float: left; margin: 0; line-height: 36px; color: #fff; font-size: 14px; font-weight: 700; }

.btn-popup-close {float: right; margin-top: 2px; width: 30px; height: 30px; background-image: url("../images/common/btn_popup_close.png"); background-repeat: no-repeat; background-position: right center; background-size: 12px 12px; }

.popup-header .text-require {line-height: 36px; color: #fff; margin-right: 5px; }



/* popup bottom
-----------------------------------------------*/
.popup-bottom {width: 100%; padding: 10px 10px; line-height: 30px; box-sizing: border-box; background-color: #f3f3f3; border-top: #eaebed; }
.popup-bottom:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.popup-content.over-scroll + .popup-bottom {padding-top: 10px; }

.popup-bottom .btn {min-width: 70px;}


/* popup content
-----------------------------------------------*/
.popup-content {position: relative; width: 100%; overflow-y: auto; padding: 10px 10px; background-color: #fff; box-sizing: border-box; }
.popup-content:after {content: ""; clear: both; display: block; height: 0; visibility: hidden;}
.popup-content .con-half{padding: 20px 100px;}
.popup-content .con-half ul::after{content: ''; display: block; clear: both;}
.popup-content .con-half ul li{float: left; width: 50%; text-align: center;}


/* search */
.popup-content .search-wrapper .search-area {width: auto; }
.popup-content .search-wrapper .btn-search {margin: 5px 0; }


/* table-default */
.popup-content .table-default {/*min-height: 200px;*/ }
.popup-content .table-default .fixedHeader {top: -10px; }

/* product_log_list */
.popup-content #product_log_list ol {margin-bottom: 20px}
.popup-content #product_log_list ol li{ font-size: 12px; position: relative; padding-left: 10px; margin-bottom: 4px;}
.popup-content #product_log_list ol li::before{content: ''; display: block; clear: both; width: 3px; height: 3px; border-radius: 2px; background-color: #333; position: absolute; top: 7px; left: 0;}

/*  */
.popup-content .border-line th{
  background-color: #f1fda9;
  padding: 4px 10px !important;
}
.popup-content .border-line th,
.popup-content .border-line td{border: 1px solid #422e1a;}

.popup-content select, .popup-content input, .popup-content textarea{border-color:#ccc;}

/* popup-board
-----------------------------------------------*/
.popup-board {}
.popup-board .popup-content {min-height: 400px; max-height: 700px; }

.popup-board .board-header {position: relative; margin-bottom: 10px; padding: 0 10px 5px; border-bottom: 1px solid #cfd1dd;  }
.popup-board .board-title {font-size: 15px; font-weight: 700; color: #222; line-height: 1.5; }
.popup-board .board-date {font-size: 11px; color: #222; }

.popup-board .board-content {padding: 10px 10px; box-sizing: border-box; }
.popup-board .board-content img {display: block; max-width: 100%; margin: 0px 0; }





/* =====================================================
  input-date-group
======================================================*/
.input-date-group {line-height: 30px; }
.input-date-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.input-date-group input,
.input-date-group span {float: left; line-height: 30px; margin-right: 5px; }

.input-date-group label,
.input-date-group strong {float: left; margin-right: 8px; font-weight: normal; }

.input-date-group .input-date,
.input-date-group .input-datepicker {width: 130px; padding-left: 31px; background-image: url("../images/common/icon_date.png"); background-repeat: no-repeat; background-position: 8px center; background-size: auto 12px; text-align: left; cursor: pointer; }

.input-date-group .input-date.readonly,
.input-date-group .input-datepicker.readonly {background-image: url("../images/common/icon_date_readonly.png");}





/* datepicker
-----------------------------------------------*/
.ui-datepicker {width: 230px; height: auto; margin: 5px auto 0; padding: 10px; border: 1px solid #eaeaea; font-size: 11px; }

/* datepicker header  */
.ui-datepicker .ui-widget-header {border: 0; background-color: #fff; }

.ui-datepicker .ui-datepicker-title {background-color: #fff; }
.ui-datepicker .ui-datepicker-title select {margin: 1px 2px; padding: 0 4px; font-size: 12px; }


/* datepicker 화살표 */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {top: 7px; background-repeat: no-repeat; background-position: center center; background-size: 70% auto; }

.ui-datepicker .ui-datepicker-prev {background-image: url("../images/common/datepicker_arrow_prev.png"); }
.ui-datepicker .ui-datepicker-next {background-image: url("../images/common/datepicker_arrow_next.png");  }

.ui-datepicker-calendar tr:hover {background-color: transparent; }

.ui-datepicker-calendar th,
.ui-datepicker-calendar td {padding: 1px; height: 32px; }

.ui-datepicker-calendar td a,
.ui-datepicker-calendar td span {padding: 4px; text-align: center; }




/* default */
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {border: 0; border-radius: 100%; background-color: #fff; color: #222; text-align: center; }


/* hover */
.ui-state-default:hover,
.ui-widget-content .ui-state-default:hover,
.ui-widget-header .ui-state-default:hover,
.ui-button, .ui-button.ui-state-disabled:hover,
.ui-button.ui-state-disabled:active {border-radius: 100%; background-color: #422e1a; color: #222; }

.ui-datepicker-buttonpane button:hover{background-color:transparent !important; color:#422e1a !important;}

/* highlight */
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {background-color: #e0f55c; color: #222; }


/* active */
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {background-color: #422e1a; color: #fff; font-weight: bold; }


/* active + hover */
.ui-state-active:hover,
.ui-widget-content .ui-state-active:hover,
.ui-widget-header .ui-state-active:hover,
a.ui-button:active:hover,
.ui-button:active:hover,
.ui-button.ui-state-active:hover {background-color: #064781; color: #fff; }





/* =====================================================
  sum-wrapper
======================================================*/
.sum-wrapper {border: 1px solid #eaeaea; background-color: #f7f7f7; }
.sum-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.sum-wrapper th,
.sum-wrapper td {background-color: #fff; font-size: 12px; }
.sum-wrapper thead th:first-child,
.sum-wrapper tbody td:first-child {border-left: 0; }

.sum-wrapper thead th:last-child,
.sum-wrapper tbody td:last-child {border-right: 0; }


.sum-list {width: 100%; display: table; table-layout: fixed; background-color: #ecdada; }
.sum-list:after {content: ""; display: none; }
.sum-list li {position: relative; display: table-cell; width: 1%; height: 30px; padding: 3px 5px; border-right: 1px solid #fff; box-sizing: border-box; white-space: normal; text-align: center; font-weight: bold; color: #de5454; vertical-align: middle; }
.sum-list li:last-child {border-right: 0; }

/* table sum-list
.sum-list {width: 100%; background-color: #ffeded; }
.sum-list
.sum-list li {float: left;  text-align: center;  }
.sum-list li:last-child
 */




/* =====================================================
  move-group-list
======================================================*/
.move-group-list {width: 100%; }

.move-group-list li {padding: 10px 7px; border: 1px solid #ddd; box-sizing: content-box; cursor: pointer; background-color: #fafafa; margin: 5px 0; }
.move-group-list li:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.move-group-list li:hover {border-color: #55a0ff; }





/* =====================================================
  prodia-setting
======================================================*/
.prodia-setting {width:100%; height:220px; margin:0 auto 10px; border: 1px solid #dadada; }
.prodia-setting:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


.prodia-setting-list {white-space:nowrap; overflow-x: auto; }
.prodia-setting-list li {display:inline-block; width: 130px; margin: 10px 10px 15px; }

.prodia-setting-list .list-thumb {position: relative; width: 130px; height: 130px; background-color: #fff; border: 1px solid #d4d4d4; box-sizing: border-box; -webkit-transition: .5s ease-out; transition: .5s ease-out; }
.prodia-setting-list .list-thumb img {width: 100%; height: 100%; }
.prodia-setting-list .setting-site {position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 28px; overflow: hidden; background-color: #c5e5ea;  }
.prodia-setting-list .setting-site p {display: block; width: 100%; height: 28px; padding: 0 5px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; line-height: 28px; letter-spacing: -0.25px; color: #817053; cursor: default; }


.prodia-setting-list .title {margin-top: 5px; font-size: 12px; font-weight: 400; line-height: 1.3; }
.prodia-setting-list .title.text-ellipsis02 {height: 2.6em; }



.setting-btn-group {opacity: 0; position: absolute; left: 0; bottom: -1px; width: 100%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -ms-flex; display: -moz-flex; -webkit-transition: .2s ease-out; transition: .2s ease-out; }
.setting-btn-group.top {top: -1px; }

.setting-btn-group .btn {width: 100%; height: 32px; display: inline-block; background: rgba(0,0,0,0.6); border: 0; border-radius: 0; text-align: center; font-size: 11px; line-height: 0; color: #fff; white-space: nowrap; }
.prodia-setting-list li:hover .setting-btn-group {opacity: 1; }
.prodia-setting-list li .setting-btn-group .btn:hover {background-color: #55a0ff; }


.prodia-setting.video {height: 146px;}
.prodia-setting.video .prodia-setting-list  .list-thumb {width: 130px; height: 73px; }







/* =====================================================
  summernote
======================================================*/
.note-editor.note-frame {border: 1px solid #ccc !important; border-radius: 3px; }

.note-popover .popover-content,
.card-header.note-toolbar {background: #f5f5f5; border-bottom: 1px solid #ccc; }

.note-popover .popover-content > .btn-group,
.card-header.note-toolbar > .btn-group {margin-right: 3px !important; }

.note-popover .popover-content .note-color .dropdown-toggle,
.card-header.note-toolbar .note-color .dropdown-toggle {min-width: 12px; background-repeat: no-repeat; background-position: center center; background-image: url("../images/common/editor_bottom_arrow.png"); background-size: 5px auto; }
.note-popover .popover-content .note-fontsize-10,
.card-header.note-toolbar .note-fontsize-10 {color: #222; }

.note-popover.popover {z-index: 10000; }
.tooltip.fade {z-index: 10000; } /* 에디터에서 이미지 첨부 후 클릭 시 뜨는 note-popver tooltip */

.note-btn-group.btn-group .note-btn {min-width: 30px; padding: 0 2px; background-color: #fff; border-color: #eaeaea; }
.note-btn-group.btn-group .note-btn i {color: #565252; }

.note-btn-group.btn-group.note-fontname {}
.note-btn-group.btn-group.note-fontname .note-btn {width: 100px !important; padding: 0 8px; text-align: left; overflow: hidden; text-overflow: ellipsis; color: #565252; font-size: 12px; }

.dropdown-menu.note-check.dropdown-fontname {width: 150px; padding: 4px 10px 4px 4px; }
.dropdown-menu.note-check.dropdown-fontname:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.dropdown-menu.note-check.dropdown-fontname > a {display: block; margin: 3px 0;}
.dropdown-menu.note-check.dropdown-fontname > a:hover {text-decoration: underline;}
.dropdown-menu.note-check.dropdown-fontname > a:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.note-editor.note-frame .note-editing-area {height: 450px; }


/* 편집기 css */

.note-fontsize .btn-group > .btn:first-child{
  margin-left: 0;
}

.note-current-fontsize{color: #333;}

.note-fontsize .btn-group-vertical > .btn,
.note-fontsize .btn-group > .btn{
  position: relative;
  float: left;
}

.note-fontsize .btn-group-sm > .btn,
.note-fontsize .btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
.note-fontsize .dropdown-menu > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

.note-fontsize .btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 3px 5px rgb(0 0 0 / 13%);
    box-shadow: inset 0 3px 5px rgb(0 0 0 / 13%);
}

.note-fontsize .btn-group .dropdown-toggle:active,
.note-fontsize .btn-group.open .dropdown-toggle {
    outline: 0;
}



/*에디터 풀스크린 23-01-12*/
.popup-content .btn-fullscreen{display:none;}



/* search-area
.search-area .select-group {display: inline-block; } */


/* search-btn-group



.search-btn-group .btn-excel {float: left; min-width: 30px; width: 30px; height: 30px; background-color: #fff; border-color: #5f8b6e; background-image: url("../images/common/btn_excel.png"); background-repeat: no-repeat; background-position: center center; background-size: 18px;  }
.search-btn-group .btn-excel:hover,
.search-btn-group .btn-excel:focus,
.search-btn-group .btn-excel.focus {background-color: #f1f1f1; }


.search-btn-group .btn-excel-dis {float: left; min-width: 30px; width: 30px; height: 30px; background-color: #BDBDBD; border-color: #BDBDBD; background-image: url("../images/common/btn_excel_dis.png"); background-repeat: no-repeat; background-position: center center; background-size: 18px;  }
.search-btn-group .btn-excel-dis:hover,
.search-btn-group .btn-excel-dis:focus,
.search-btn-group .btn-excel-dis.focus {background-color: #BDBDBD; border-color: #BDBDBD; cursor: default; }


.search-btn-group .btn-search {float: left; width: 100px; height: 30px; background-color: #222; border-color: #222; }
.search-btn-group .btn-search:hover,
.search-btn-group .btn-search:focus,
.search-btn-group .btn-search.focus {background-color: #e9970a; border-color: #e9970a;}

.search-btn-group .btn-search-dis {float: left; width: 100px; height: 30px; background-color: #BDBDBD; border-color: #BDBDBD; }
.search-btn-group .btn-search-dis:hover,
.search-btn-group .btn-search-dis:focus,
.search-btn-group .btn-search-dis.focus {background-color: #BDBDBD; border-color: #BDBDBD; cursor: default; }



.search-btn-group .btn-reset {float: left; min-width: 30px; height: 30px; padding: 0; background-color: #fff; border-color: #d7d7d7; background-image: url("../images/common/btn_reset.png"); background-repeat: no-repeat; background-position: center center; text-indent: -9999px; }
.search-btn-group .btn-reset:hover,
.search-btn-group .btn-reset:focus,
.search-btn-group .btn-reset.focus {background-color: #f1f1f1; }

*/





/* label
-----------------------------------
label {margin-right: 5px; margin-bottom: 0; font-weight: 400; color: #222; font-size: 12px;}


.label-text {line-height: 30px; font-size: 12px; font-weight: 400; }

.label-count-group {margin: 10px auto; text-align: center; }
.label-count-group:after {content: ""; display: block; clear: both; height: 0; visibility: hidden; }
.label-count {height: 30px;  border-radius: 3px; line-height: 30px; color: #fff; text-align: center; }
.label-count span {display: inline-block; float: left; min-width: 80px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; background-color: #eba639;}
.label-count input[type="text"] {float: left; width: 110px; border-top-left-radius: 0; border-bottom-left-radius: 0; text-align: right; color: #666; }



*/







/*table tbody input[type="text"],
table tbody select {width: 100%; }*/






/* =====================================================
  table
=====================================================*/

/*
table input[type="text"],
table select,
table textarea {width: 100%; }
table td:first-child {padding-left: 0; }


table td img {max-width: 100%; }

table th label {margin-right: 0; }
*/




/* table-default 테이블 리스트
-----------------------------------------------*/



/* table */

/*
.table-default thead th:first-child,
.table-default thead td:first-child {border-left: 0; }*/






/* table-group-border
table td.table-group-borer,
table#t_sorter td.table-group-borer {padding: 2px; background-color: #eaeaea; }

*/

/* table-write 입력테이블
-----------------------------------------------*/
/*.table-write {margin-bottom: 10px; }*/


/*

.table-write tbody tr:hover {background-color: transparent; }

.table-write th {padding: 2px 0; vertical-align: top; }

.table-write th label,
.table-write th span {display: block; width: 100%; min-height: 28px; margin: 0; padding: 0 7px; background-color: #edf2f7; vertical-align: middle; font-size: 12px; line-height: 28px; text-align: left; white-space: nowrap; color: #222; font-weight: 700; }
.table-write th .label-require {color: #157bd7; }



.table-write td {padding: 2px 10px 2px 5px; }
.table-write td:last-child {padding-right: 0; }



.table-write .upload-wrapper {vertical-align: top; }

.table-write .table-default th {vertical-align: middle; }
.table-write .table-default td {padding: 3px 5px; }
*/


/* table-row-group
-----------------------------------------------*/
/*.table-row-group th {background-color: #edf2f7; border-bottom: 3px solid white; }
.table-row-group td {padding-top: 0; padding-bottom: 0; border-bottom: 3px solid white; }
.table-row-group table th,
.table-row-group table td {border-bottom: 1px solid white; }
.table-row-group table th {background-color: #edf2f7;}

.table-row-group .td-input-group input[type="text"] {margin-top: 2px; }
.table-row-group .td-input-group input[type="text"]:first-child {margin-top: 0; }


*/



/*
.text-guide {margin-bottom: 0; color: #222; font-size: 12px; line-height: 16px; }
.text-guide-blue {margin-bottom: 0; font-size: 12px; color: #817053; line-height: 16px;}
.text-link {text-decoration: underline; color: #7b83ab; }
.text-require {float: left; color: #fff; font-size: 11px; }
.color-white {color: #fff !important;}

.title {margin-top: 8px; margin-bottom: 5px; font-size: 14px; line-height: 18px; font-weight: 700; color: #202020; }

*/











/* section-header
-----------------------------------------------------
.section-header {position: relative; width: 100%; height: 35px; padding: 0 10px; background-color: #8b93a9; border-top-left-radius: 5px; border-top-right-radius: 5px; }
.section-header:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.section-header strong {float:left; display: inline-block; margin-right: 10px; font-size: 14px; font-weight: 400; line-height: 35px; color: #fff; }

.section-header .btn {margin-top: 5px; }

.section-header p,
.section-header span,
.section-header strong,
.section-header em,
.section-header i {line-height: 35px; }
*/










/*
.bool-yn {font-weight: 900; }

*/

/*==================================================================
	button
==================================================================*/







/* btn disabled */
/*.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {cursor: not-allowed; filter: alpha(opacity=65); opacity: .65; }

a.btn.disabled,
fieldset[disabled] a.btn {cursor: not-allowed; pointer-events: none; }
*/




/* button color
-----------------------------------------------------*/
/* white

*/

/* red 수정전
.btn-red {background-color: #222; border-color: #222; }

.btn-red:hover,
.btn-red:focus,
.btn-red.focus {background-color: #e9970a; border-color: #e9970a; }
*/



/* purple
.btn-purple {background-color: #7265b0; border-color: #7265b0; }

.btn-purple:hover,
.btn-purple:focus,
.btn-purple.focus {background-color: #564e7e; border-color: #564e7e; }
*/


/* yellow

*/
/* gray
.btn-gray {background-color: #efefef; border-color: #efefef; color: #808080; }

.btn-gray:hover,
.btn-gray:focus,
.btn-gray.focus {background-color: #d7d7d7; border-color: #d7d7d7; color: #808080; }
*/

/*.btn-icon {display: inline-block; min-width: 10px; height: 30px; margin: 0; padding: 0 5px; border: 1px solid #565252; border-radius: 5px; box-sizing: border-box; outline: none; line-height: 28px; text-align: center; white-space: nowrap; vertical-align: middle; font-size: 14px; }*/






/* button function
-----------------------------------------------------*/
/* excel text button
.btn-excel {background-color: #5f8b6e; border-color: #5f8b6e; }

.btn-excel:hover,
.btn-excel:focus,
.btn-excel.focus {background-color: #4f6c59; border-color: #4f6c59; }
*/

/* pdf text button
.btn-pdf {background-color: #c25757; border-color: #c25757; }

.btn-pdf:hover,
.btn-pdf:focus,
.btn-pdf.focus {background-color: #9a3b3b; border-color: #9a3b3b; }
*/

/* word text button/
.btn-word {background-color: #536eb1; border-color: #536eb1; }

.btn-word:hover,
.btn-word:focus,
.btn-word.focus {background-color: #475d93; border-color: #475d93; }
 *

/* upload text button
.btn-upload {background-color: #c95284; border-color: #c95284; }

.btn-upload:hover,
.btn-upload:focus,
.btn-upload.focus {background-color: #ad5479; border-color: #ad5479; }
 */

/* upload text button
.btn-upload.cancel {background-color: #fff; border-color: #c95284; color: #c95284; }

.btn-upload.cancel:hover,
.btn-upload.cancel:focus,
.btn-upload.cancel.focus {background-color: #f3e3ea; border-color: #c95284; color: #c95284; }
*/

/* download text button
.btn-download {padding-left: 28px; background-color: #53aea0; border-color: #53aea0; background-image: url("../images/common/btn_download.png"); background-repeat: no-repeat; background-size: 13px; background-position: left 10px center; }

.btn-download:hover,
.btn-download:focus,
.btn-download.focus {background-color: #4f8e84; border-color: #4f8e84; }
*/




/* lock icon + text button */
/*.btn-lock {padding-left: 28px; background-color: #fff; background-image: url("../images/common/lock.png"); background-repeat: no-repeat; background-size: 15px; background-position: left 10px center; border-color: #e3e3e3; color: #686868; }
.btn-lockoff {padding-left: 28px; border-color: #e3e3e3; background-color: #fff; background-image: url("../images/common/lock_off.png"); background-repeat: no-repeat; background-size: 15px; background-position: left 10px center; color: #686868; }*/

/*.btn-lock:hover,
.btn-lock:focus,
.btn-lock.focus,
.btn-lockoff:hover,
.btn-lockoff:focus,
.btn-lockoff.focus {background-color: #f1f1f1; border-color: #e3e3e3; color: #686868; }*/


/* wizard
.btn-wizard {padding-left: 28px; border-color: #c957c0; background-color: #c957c0; background-image: url(../images/common/wizard.png); background-size: 16px; background-repeat: no-repeat;background-position: left 10px center; color: #fff; }
.btn-wizard:hover,
.btn-wizard:focus {background-color: #a5459d; border-color: #a5459d; color: #fff;}
*/

/* 사용불가능한 버튼

*/

/* + button
.popup-content input + .btn-small {min-width: 30px; }


*/


/* editor button
.note-popover .popover-content > .btn-group,
.card-header.note-toolbar > .btn-group {}
.note-btn.btn-sm {min-width: 30px; background-color: #fff; border-color: #ececec; color: #666; }

*/

/* pagination
-----------------------------------------------
.pagination {height: 30px; margin: 20px auto 0; text-align: center; }

.page-arrow,
.pagination-page {display: inline-block; }

.pagination-arrow,
.pagination-page li {display: inline; }

.pagination a {display: inline-block; min-width: 30px; height: 30px; padding: 0 4px; border-radius: 5px; box-sizing: border-box; color: #222; font-size: 14px; letter-spacing: -0.5px; text-align: center; text-decoration: none; vertical-align: middle; line-height: 30px; }
.pagination a:hover {background-color: #f2f2f2; }
.pagination a.current {background-color: #222; color: #fff; }
.pagination-arrow a {padding: 0; }

.pagination-page {margin: 0 8px; }

*/



/*==================================================================
  tag
==================================================================
.tag {display: inline-block; min-width: 57px; height: 24px; padding: 0 4px; background: transparent; border: 2px solid #393939; border-radius: 5px; cursor: default; line-height: 20px; text-align: center; white-space: nowrap; vertical-align: middle; font-size: 12px; font-weight: 400; color: #393939;}

.tag-red {border-color: #222; color: #222; }
.tag-skyblue {border-color: #57b0c6; color: #57b0c6; }
.tag-purple {border-color: #7265b0; color: #7265b0; }
.tag-orange {border-color: #f8a219; color: #f8a219; }

*/












/* =====================================================
  popup
=====================================================*/




/* board








*/


/*.popup-content table tbody tr:hover {background: none; }
.popup-content table th,
.popup-content table td {padding: 5px 3px; }
.popup-content .left,
.popup-content .right {margin-right: 20px; }
.popup-content > div,
.popup-content .left > div,
.popup-content .right > div {margin-bottom: 5px; }
.popup-content > div:after {content: ""; clear: both; display: block; height: 0; visibility: hidden;}
.popup-content .right + div {clear: both; }*/
















/*
.ui-widget-content .ui-state-highlight:hover,
.ui-widget-header .ui-state-highlight:hover {background-color: #222; color: #fff; }

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {width: 23px; height: 23px; border-radius: 100%; background-color: #222; color: #fff; text-align: center; }
*/
/*

.input-date > label {font-weight: 700; }
.input-date > input[type="text"] {line-height: 22px; width: 100px; }
.input-date > span {line-height: 24px; }




.input-date > input[type="text"].input-datepicker,
.input-datepicker {width: 100px !important; cursor: pointer; text-align: center; color: #666; font-size: 12px; text-align: left; }*/

/* tr:hover {background-color: #fff; }*/



/* ===========================================================
  popup - 상품정보입력
  ==============================================================*/
.gds_info_list { }
.gds_info_list:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.gds_info_list li {float: left; cursor: all-scroll;}
.gds_info_list li .list_thum {position: relative; width: 70px; height: 70px; margin-left: 20px; }
.gds_info_list li:first-child .list_thum {margin-left: 0; }
.gds_info_list li .list_thum .thumb {width: 100%; height: 100%; background: #fff; box-sizing: border-box; -webkit-transition: .5s ease-out; transition: .5s ease-out; text-align: center;}
.gds_info_list li .list_thum .thumb img {width: 100%; height: 100%; }
.gds_info_list li .list_thum .button {position: absolute; bottom: -1px; display: -webkit-box; display: -ms-flexbox;  display: -webkit-flex; display: -ms-flex; display: -moz-flex; width: 100%; -webkit-transition: .2s ease-out; transition: .2s ease-out; }

.gds_info_list li .list_thum:hover .thumb {border-color:#a5a5a5; }
.gds_info_list li .list_thum:hover .button {opacity: 1; }

.gds_info_list li .list_thum .button[class*="btn"]:hover {background-color: #55a0ff; }


.gds_info_list.detail li .list_thum {position: relative; width: 50px; height: 67px; }


.btnAdd {overflow: hidden; width: 100%; height: 100%; cursor: pointer; text-indent:-150%; white-space:nowrap; font-size: 1px; line-height: 0; color: transparent; box-sizing: border-box; border: 1px solid #d4d4d4; -webkit-transition: .3s ease-out; transition: .3s ease-out; }
.btnAdd:hover {background-color:#f5f6f8; }
.btnAdd:before {content:""; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; margin:-1px 0 0 -8px; background-color: #565656; background-image: none; }
.btnAdd:after {content:""; position:absolute; top: 50%; left: 50%; width: 2px; height: 16px; margin: -8px 0 0 -1px; background-color: #565656; transform: rotate(180deg); -webkit-transform: rotate(180deg); background-image:none; }
.btnAdd .file {position: absolute; z-index: 1; right: 0; bottom: 0; width: 100%; height: 100%; cursor: pointer; opacity: 0; filter: alpha(opacity=0); }

.button .btnEdit,
.button .btnDelete {display: inline-block; overflow: hidden; -webkit-flex: 1; -ms-flex: 1; flex: 1; height: 32px; background: rgba(0,0,0,0.6); text-align: center; font-size: 11px; line-height: 0; color: #fff; white-space: nowrap; -webkit-transition: .3s ease-out; transition: .3s ease-out; }
.button-wrap .btnDelet {width: 50%;}
.button-wrap .btnLink { width: 50%; background-color: #000; color: #fff; font-size: 11px; }


.img-wrapper {position: relative; width: 80px; height: 80px; }
.img-wrapper:hover .thumb {border-color:#a5a5a5; }
.img-wrapper:hover .button {opacity: 1; }


.img-wrapper .thumb {width: 100%; height: 100%; background: #fff;box-sizing: border-box; -webkit-transition: .5s ease-out; transition: .5s ease-out; text-align: center; }
.img-wrapper .thumb img {border: 1px solid #ddd;  width: 100%; height: 100%; }


.img-wrapper .button {position: absolute; bottom: -1px; display: -webkit-box; display: -ms-flexbox;  display: -webkit-flex; display: -ms-flex; display: -moz-flex; width: 100%; opacity: 0; -webkit-transition: .2s ease-out; transition: .2s ease-out; }

.img-wrapper .button [class*="btn"]:hover {background-color: #55a0ff; }


.img-add {position: relative; width: 70px; height: 70px; margin: 0 auto; }
.img-add .thumb {width: 100%; height: 100%; }
.img-add .button {position: absolute; bottom: -1px; display: -webkit-box; display: -ms-flexbox;  display: -webkit-flex; display: -ms-flex; display: -moz-flex; width: 100%; -webkit-transition: .2s ease-out; transition: .2s ease-out; opacity: 0; }
.img-add:hover .button {opacity: 1; }



.box-approach {position: relative; width: 100%; height: 100%; }
.box-approach strong {position: absolute; top: 50%; left: 50%; font-size: 20px; margin-top: -30px; transform: translateX(-50%);}


/* 22-02-09 리사이징 추가되면서 팝업 위에 노출되는 오류 때문에 추가됨 */
.JCLRgrip {z-index: 0 !important; }

/* ===========================================================
text-guidebox
==============================================================*/
.text-guidebox {position: relative; display: inline-block; vertical-align: middle; }
.text-guidebox button {display: block; position: relative; width: 14px; height: 14px; border: 1px solid #e0e0e0; border-radius: 999px; background-color: #fff; text-indent: -9999px; transform: all 0.3s; }
.text-guidebox button:after {content: "?"; display: block; position: absolute; top: 50%; left: 50%; width: 14px; height: 14px; font-size: 10px; color: #666; text-indent: 1px; line-height: 14px; text-align: center; transform: translate(-50%, -50%); transform: all 0.3s; }
.text-guidebox .text-guidetext {display: none; position: absolute; top: 16px; left: 0; width: 180px; padding: 5px 10px; border: 1px solid #eee; border-radius: 5px; box-sizing: border-box; box-shadow: 0 0 8px rgb(0 0 0 / 8%); background-color: #fff; z-index: 10; }
.text-guidebox .text-guidetext p {font-size: 12px; font-weight: 400; color: #222; line-height: 1.5; }

.text-guidebox:hover button {border-color: #ccc; color: #222; }
.text-guidebox:hover .text-guidetext {display: block; }

/* ===========================================================
서비스 처리상태 색상
==============================================================*/
.state_color_00 { } /* 처리대기 */
.state_color_01 { color : #002fff !important} /* 신청완료 */
.state_color_02 { color : #ff0000 !important} /* 신청취소 */
.state_color_03 { } /* 사용중 */
.state_color_04 { } /* 사용완료 */
.state_color_05 { color : #ff0000 !important} /* 사용취소 */


/* =======================================================
  address
========================================================*/

/* address-contents */
/* 221103 추가 (adress) */

.address-contents { padding: 10px 20px; }
.address-contents .address-search-tip { padding: 0 10px; }
.address-contents .address-result-container .count { background-color: rgb(239, 239, 239); }
.address-contents .address-result-container { background-color: #fff; padding-bottom: 0; }

.address-search-container {
  padding: 10px 0;
  box-sizing: border-box;
  background-color: #fff;
}

.address-search {
  position: relative;
}

  .address-search .input-search {
    width: 100%;
    padding-right: 50px;
    padding-left: 15px;
    height: 40px;
    border: 2px solid #444;
  }

  .address-search .btn-search {
    position: absolute;
    right: 10px;
    top: 0;
    z-index: 3;
    display: block;
    background:none;
  }

  .address-search .icon-search {
    display: block;
    width: 40px;
    height: 40px;
    background-image: url("/images/common/icon_search.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
  }

  /* 해외 주소 직접 입력 */
  .btn.address-btn { float:right; border-top-left-radius: 0px; border-top-right-radius: 3px; border-bottom-right-radius: 3px;border-bottom-left-radius: 0px; border-left: none; }
  .input-btn-group .input-text.input-search { width:calc(100% - 71px);  border-top-left-radius: 3px; border-top-right-radius: 0px; border-bottom-right-radius: 0px;border-bottom-left-radius: 3px; border-right: none; }


/* 검색 전
-----------------------------------------------*/
.address-search-tip {
  margin-top: 20px;
  padding: 0 20px;
  box-sizing: border-box;
}

  .address-search-tip strong {
    display: block;
    margin-bottom: 15px;
    font-size: 16px;
    font-weight: 700;
    color: #444;
  }

  .address-search-tip p {
    font-size: 14px;
    color: #666;
  }

  .address-search-tip .text-guide {
    margin-top: 10px;
    font-size: 13px;
    color: #aaa;
  }



/* 검색 후
-----------------------------------------------*/


.address-result-container {
  border-top: 1px solid #e9eaee;
  background-color: #efefef;
  /*min-height: calc(100vh - 131px);*/
  padding-bottom: 20px;
  box-sizing: border-box;
  /*141px */
}

  .address-result-container .count {
    font-size: 12px;
    color: #888;
    line-height: 30px;
    text-align: center;
  }

  
    .address-result-container .count span {
      font-weight: 500;
    }

.address-list li {
  width: 100%;
  padding: 10px 20px;
  box-sizing: border-box;
  background-color: #fff;
  border-bottom: 1px solid #dadbdf;
}

  .address-list li hr {
    margin: 3px 0;
  }

  .address-list li + li {
    margin-top: 10px;
  }

  .address-list li:last-child { border: none;}

  .address-list li a {
    display: inline-block;
    font-size: 14px;
    color: #444;
  }

  .address-list li .txtClr {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 400;
  }


.address-result-container .pagination-wrapper {
  margin-top: 8px;
  margin-bottom: 0;
  text-align: center;
}
/* 데이터 없는 경우 */
.address-list .nodata {
  padding: 40px 20px;
}

  .address-list .nodata p {
    color: #888;
    font-size: 12px;
    border-top: 1px solid #f2f2f2;
  }

    .address-list .nodata p:first-child {
      text-align: center;
      font-size: 14px;
      border-top: none;
    }

    .address-list .nodata p + p {
      margin-top: 40px;
      padding-top: 10px;
    }

  .address-list .nodata .input-btn-group {
    margin-top: 20px;
  }

  /* address-result-container pagination */
  /* 221103 추가 */
  .address-result-container .pagination { margin: 10px 0; }
  .address-result-container .pagination .page-pprev {
    background: url("/images/common/page_pprev.png") no-repeat center center;
    background-size: 10px 10px;
    height: 32.56px;
  }
  .address-result-container .pagination .page-prev {
    background: url("/images/common/page_prev.png") no-repeat center center;
    background-size: 6px 10px;
    height: 32.56px;
  }
  .address-result-container .pagination .page-next {
    background: url("/images/common/page_next.png") no-repeat center center;
    background-size: 6px 10px;
    height: 32.56px;
  }
  .address-result-container .pagination .page-nnext {
     background: url("/images/common/page_nnext.png") no-repeat center center;
    background-size: 10px 10px;
    height: 32.56px;
  }
  .address-result-container .pagination .current > a {
    color: #fff;
    background-color: #222;
  }



/* 다음조회 버튼 2023.04.14  (S)*/
#listdown button span{
  position: relative;
  padding-right: 20px;
}
#listdown button span:before {content:'';position:absolute;right:0;top:50%;width:12px;height:1px;background:#777777;
  opacity:1;will-change:transform,opacity;
  -webkit-animation:btn_more_w 1.3s infinite;
  -moz-animation:btn_more_w 1.3s infinite;
  animation:btn_more_w 1.3s infinite;
  transform: translateY(-50%);
}
#listdown button span:after {content:'';position:absolute;right:5px;top:50%;width:1px;height:12px;margin-top:-5px;background:#777777;
  opacity:1;will-change:transform,opacity;
  -webkit-animation:btn_more_h 1.3s infinite;
  -moz-animation:btn_more_h 1.3s infinite;
  animation:btn_more_h 1.3s infinite;
  transform: translateY(-50%);
}

@keyframes btn_more_w {
  0% {transform:translateX(0);opacity:1;}
  40% {transform:translateX(10px);opacity:0;}
  41% {transform:translateX(-10px);opacity:0;}
  80%, 100% {transform:translateX(0);opacity:1;}
}
@keyframes btn_more_h {
  0%, 20% {transform:translateY(0);opacity:1;}
  50% {transform:translateY(10px);opacity:0;}
  51% {transform:translateY(-10px);opacity:0;}
  90%, 100% {transform:translateY(0);opacity:1;}
}
/* 다음조회 버튼 2023.04.14  (E)*/