@charset "utf-8";
/* 디자인 요소 */

/* 테이블:S */
/* 테이블:E */

/* 버튼:S */
.btn-type01 { display: inline-block; min-width: 50px; border-radius: 3px; background-color: #4265ED; text-align: center; vertical-align: middle; padding: 0 18px; height: 30px; line-height: 28px;  white-space: nowrap; font-size: 12px; color: #fff; margin-left: 10px; cursor: pointer; font-weight: 300; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #4c66cd; transition: background-color .25s ease, box-shadow .25s ease; }
.btn-type01:hover { background-color: #2E53E3; box-shadow: 0 8px 25px -8px rgba(0,0,0,0.2); }
.btn-type02 { display: inline-block; min-width: 50px; border-radius: 3px; background-color: #199B58; text-align: center; vertical-align: middle; padding: 0 18px; height: 30px; line-height: 28px;  white-space: nowrap; font-size: 12px; color: #fff; margin-left: 10px; cursor: pointer; font-weight: 300; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #1A8850; transition: background-color .25s ease, box-shadow .25s ease; }
.btn-type02:hover { background-color: #1A8850; box-shadow: 0 8px 25px -8px rgba(0,0,0,0.2); }
.btn-type03 { display: inline-block; min-width: 50px; border-radius: 3px; background-color: #465C7E; text-align: center; vertical-align: middle; padding: 0 18px; height: 30px; line-height: 28px;  white-space: nowrap; font-size: 12px; color: #fff; margin-left: 10px; cursor: pointer; font-weight: 300; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #364966; transition: background-color .25s ease, box-shadow .25s ease; }
.btn-type03:hover { background-color: #364966; box-shadow: 0 8px 25px -8px rgba(0,0,0,0.2); }
.btn-type04 { display: inline-block; min-width: 50px; border-radius: 3px; background-color: #3D3D3D; text-align: center; vertical-align: middle; padding: 0 18px; height: 30px; line-height: 28px;  white-space: nowrap; font-size: 12px; color: #fff; margin-left: 10px; cursor: pointer; font-weight: 300; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #232323; transition: background-color .25s ease, box-shadow .25s ease; }
.btn-type04:hover { background-color: #232323; box-shadow: 0 8px 25px -8px rgba(0,0,0,0.2); }
.btn-type05 { display: inline-block; min-width: 50px; border-radius: 3px; background-color: #fff; text-align: center; vertical-align: middle; padding: 0 18px; height: 30px; line-height: 28px;  white-space: nowrap; font-size: 12px; color: #465C7E; margin-left: 10px; cursor: pointer; font-weight: 500; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #63789A; transition: background-color .25s ease, box-shadow .25s ease; }
.btn-type05:hover { background: #465C7E; color: #fff; font-weight: 300; border-color: #465C7E; }
.dlink {text-decoration:underline;}
.btn-type06 { display: inline-block; min-width: 50px; border-radius: 3px; background-color: #E03235; text-align: center; vertical-align: middle; padding: 0 18px; height: 30px; line-height: 28px;  white-space: nowrap; font-size: 12px; color: #fff; margin-left: 10px; cursor: pointer; font-weight: 300; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #D71B1E; transition: background-color .25s ease, box-shadow .25s ease; }
.btn-type06:hover { background: #D71B1E; color: #fff; font-weight: 300; border-color: #D71B1E; }
.dlink {text-decoration:underline;}
.button-label { display: inline; padding: .2em .6em .3em; font-size: 75%; font-weight: 700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em; }


/* 캘린더 버튼 */
.cal-btn { font-size: 13px; cursor: pointer; border: none; height: 35px; width: 35px; background: #EDEDED; color: #666; border-radius: 3px; outline: 0; }
.cal-btn:hover { background: #DFDFDF; }
input[type=text].date ~ img.tcalIcon { opacity: 0; width: 35px; height: 35px; }

.list-btn { font-size: 12px; }
.list-btn i { margin-right: 4px; font-size: 11px; }

/* 버튼:E */

/* 셀렉트 */
.selectbox:before { width: 15px; height: 15px; position: absolute; content: ''; right: 7px; top: 50%; z-index: 2; margin-top: -8px; background: url("../../img/arrow_d.svg"); background-size: 15px 15px; opacity: 0.3; }

/* 체크박스 */
input[type=checkbox] { display: none; }
input[type=checkbox] + label { padding-left: 20px; position: relative; padding-right: 5px; }
input[type=checkbox] + label:before { width: 15px; height: 15px; background: url("../../img/check.png"); background-size: 15px 30px; background-position: 0 0; position: absolute; content: ''; left: 0; top: 2px; }
input[type=checkbox]:checked + label:before { background: url("../../img/check.png"); background-size: 15px 30px; background-position: 0 -15px; }

/* 라디오 */
input[type=radio] { display: none; }
input[type=radio] + label { padding-left: 20px; position: relative; padding-right: 5px; }
input[type=radio] + label:before { width: 15px; height: 15px; background: url("../../img/radio.png"); background-size: 15px 30px; background-position: 0 0; position: absolute; content: ''; left: 0; top: 2px; }
input[type=radio]:checked + label:before { background: url("../../img/radio.png"); background-size: 15px 30px; background-position: 0 -15px; }

/*페이징*/
.table-paging { padding: 20px 0; }
.list-area .table-paging { display: block; }
.list-area .table-paging ul { float: right; }
.list-area .table-paging ul li {float: left; text-align: center; }

.table-paging ul li{display: inline-block; height: 27px; margin-left: 5px; }
.table-paging ul a {display: inline-block; padding: 0 10px; height: 100%; line-height: 25px; background: #fff; border: 1px solid #dee3eb; font-weight: bold; border-radius: 3px; overflow: hidden; }
.table-paging ul li { display: inline-block; height: 27px; font-size: 11px; color: #c8c8c8; text-align: center; }
.table-paging ul li a:active,
.table-paging ul li a:focus {color: #f7f7f7;background: #4265ED; border-color: #4265ED;}
.table-paging ul li a.current {color: #f7f7f7;background: #4265ED; border-color: #4265ED; }
.table-paging ul li:active,
.table-paging ul li:focus {color: #f7f7f7; background: #4265ED; border-color: #4265ED;}

/* 콘텐츠셀렉트 */
.content-type-select-wrap { width: 100%; margin-bottom: 20px; }
.content-type-select-wrap ul li { float: left; width: 11.1111%; height: 40px; } /* 탭 갯수에 따라 width 조절해야함*/
.content-type-select-wrap ul li a { display: block; height: 100%; border: 1px solid #dee3eb; color: #b2b5c0; line-height: 38px; white-space: nowrap; text-align: center; border-right: none; background: #EBF0F5 }
.content-type-select-wrap ul li:last-child a { border-right: 1px solid #dee3eb; }
.content-type-select-wrap ul li.select a { background: transparent; border-bottom: none; border-top: 2px solid #4265ED; color: #4265ED }

/* 타이틀 */
.content-sub-title-area { font-size: 16px; font-weight: bold; color: #3C4757; }
.content-sub-table-header { font-size: 14px; font-weight: bold; color: #3C4757; margin-top: 10px; }

/* 인풋 리스트 테이블 */
.input-table-area { margin-top: 10px; box-shadow: 0 5px 25px -8px rgba(0,0,0,0.1); border: 1px solid #eee; border-top: 1px solid #072597; }
.input-table-area tbody { background: #fff; }
.input-table-area tbody tr { border-bottom: 1px solid #f5f2f2; }
.input-table-area tbody tr th { font-size: 13px; font-weight: bold; color: #868BA0; width: 200px; padding: 8px 10px; background-color: #fdfdfd; border-right: 1px solid #f5f2f2; text-align: center; }
.input-table-area tbody tr td { padding: 8px 10px; }
.input-table-area tbody tr td input[type=text] { height: 35px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; border: 1px solid #e7e7e7;  font-size: 13px; color: #555; padding-left: 8px; }

.input-table-area thead { border-bottom: 1px solid #E1E8ED; }
.input-table-area thead tr th { background: #EBF0F5; font-size: 13px; color: #193F9C; font-weight: bold; text-align: center; padding: 8px 5px; }

/* 인풋 페이지 버튼 */
.input-btn-wrap { margin-left: 0px; margin-top: 10px; }
.input-btn-wrap ul {display:inline-block; width:100%;}
.input-btn-wrap ul li{display: inline-block; float:right;}
.input-btn-wrap ul .change-btn { display: inline-block; width: 45px; height: 13px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background-color: #7189ad; text-align: center; vertical-align: middle; padding: 4px 2px 6px 0; font-size: 12px; color: #fff; text-shadow: 0 0 5px rgba(113,137,173,.47); cursor: pointer; }

/* 파일 인풋 */
.file-input { position:relative; width:100%; height: 32px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;  border: 1px solid #e7e7e7; }
.file-input input { width:100%; position:absolute; top:0; left:0; height:100%; z-index: 1; opacity: 0; }
.file-input label { width:100%; height:100%; padding-left:90px; padding-right:10px; line-height: 30px; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-size: 13px; color:#444; }
.file-input .file-btn {position:absolute; top:0; left: 0; width: 80px; line-height: 30px; text-align: center; background: #4265ED; color: #fff; font-size:12px;}
.input-table-area .imp { font-size: 12px; color: #FF0004; display: block; margin-top: 3px; }



/* 기록 로그 */
.record-log-wrap .afterglow-label, 
.record-log-wrap .advance-label {padding: 0px 3px 1px; font-size: 0.5rem; margin-right: 4px; color: #fff; border-radius: 5px; position: relative; top: 0}
.record-log-wrap .advance-label {background:#36446E}
.record-log-wrap .afterglow-label {background: #dc4f4f}



/* block layer popup ui */
.layer-pop-wrap { position: fixed; top:0; left: 0; width:100%; height:100%; background: rgba(0,0,0,0.5); z-index: 99; }
.layer-pop-wrap .layer-pop {position: absolute; top: 50%; left: 50%; width: 500px; background-color: #fff; transform: translate(-50%,-50%); box-shadow: 0px 10px 20px rgba(0,0,0,0.2); overflow:hidden; }
.layer-pop-wrap .layer-pop .head-area {padding: 10px 20px; font-size: 15px; font-weight: 600; border-bottom: 1px solid #dee3eb; position: relative;}
.layer-pop-wrap .layer-pop .head-area .close-btn { position: absolute; right:16px; top: 11px; cursor: pointer}
.layer-pop-wrap .layer-pop .head-area .close-btn:hover {opacity: 0.8}
.layer-pop-wrap .layer-pop .head-area .close-btn img {width: 20px; height: 20px; opacity: 0.5}
.layer-pop-wrap .layer-pop .body-area {padding: 40px 20px; font-size: 13px; line-height: 20px; text-align: center; }
.layer-pop-wrap .layer-pop .foot-area .btn-wrapper { border-top: 1px solid #dee3eb; }
.layer-pop-wrap .layer-pop .foot-area .btn-wrapper { text-align: center; }
.pop-relative { position: relative !important; z-index: 99; }
.pop-relative .inner-pop { position: absolute !important; }


/* 테이블 */
.normal-table { position: relative; }
.normal-table table { width: 100%; font-size: 12px; border-top: 1px solid #aaa; table-layout: fixed; text-align: center; border-right: 1px solid #dee3eb; }
.normal-table table thead tr { background: #ECECEC; border-bottom: 1px solid #dee3eb; }
.normal-table table thead tr th { vertical-align: middle; padding: 5px; font-weight: bold; text-align: center; }
.normal-table table tbody tr { background: #fff; transition: background .25s ease; border-bottom: 1px solid #dee3eb; }
.normal-table table tbody tr td { vertical-align: middle;  padding: 5px; border-left: 1px solid #dee3eb; }