@charset "utf-8";

/**
 *	텍스트 
 */

/* 안내문구 */
div.desc-text,
p.desc-text{margin-top:5px;}
span.desc-text{margin-left:5px;}
.text-warning{color:#f14b4b;font-size:14px;font-weight:bold;}
.text-warning .star{position:relative;top:3px;margin-right:2px;}
.control-info{color: #f14b4b;word-break:keep-all;font-weight:400;}
span.control-info{display: inline-block; margin-left: 6px; vertical-align: middle;}
.control-info .star{position:relative;top:3px;margin-right:2px;}
div + p.control-info{margin-top:.5em;}

/* 링크 */
a.text-link{display:inline-block; color: inherit;}
a.text-link:hover,
a.text-link:focus{text-decoration:underline;}

/* 필수항목 */
.required{position:relative;word-break:keep-all;}
.required::after{content: '*';position:relative;top:1px;margin-left:3px; color: #f14b4b; font-size: 114%; font-weight: bold;vertical-align:middle;}

/*=========================================================================================================================================*/
/** 
 *  버튼
 *	.btn: 버튼 기본 클래스
 *
 *   !!!주의!!!: 클래스는 1, 2, 3 순서로(옵션, 종류, 크기 순으로) 지정
 *    1. 옵션(선택)
 *        .no-radius (둥근 모서리가 없는 버튼)
 *    2. 종류(필수)
 *	     .btn.btn-background: 배경이 채워진 버튼
 *	     .btn.btn-border: 테두리만 있는 버튼
 *    3. 크기(선택)
 *       .btn-xsmall, .btn-small, .btn-large , btn-xlarge
 */
.btn{display: inline-block;text-align: center;cursor: pointer;white-space: nowrap;vertical-align:middle;box-shadow:none !important;border-radius:3px !important;}
.btn.no-radius{border-radius:0 !important;}
.btn[disabled]{opacity:.6;cursor:default;}

.btn.btn-right{position:absolute;top:-7px;right:0;}

/*** 버튼 - 채워진 형태 ***/
.btn.btn-background{min-width: 70px; height: 38px; padding: 0 20px; border: none; background: #666; color: #fff !important; font-size: 14px; font-weight: bold; line-height: 38px;}
/*.btn.btn-background:hover,.btn.btn-background:focus,.btn.btn-background:active{background: #333;}*/
/* 크기*/
.btn.btn-background.btn-xsmall{min-width: 50px; padding: 0 15px; height: 30px; line-height: 30px;font-weight:normal;}
.btn.btn-background.btn-small{min-width: 60px; height: 34px; line-height: 34px;}
.btn.btn-background.btn-large{height: 44px; padding: 0 25px; font-size: 16px; line-height: 44px;}
.btn.btn-background.btn-xlarge{width: 100%; height: 44px; font-size: 16px; line-height: 44px;}
/* 색상*/
.btn.btn-background.btn-gray{background: #4f555a}
.btn.btn-background.regist{background: #2760a7} /* 등록 */
.btn.btn-background.list{background: #444} /* 목록 */
.btn.btn-background.add{background: #6aa837} /* 추가 */
.btn.btn-background.search{background: #666} /* 찾기 */
.btn.btn-background.delete{background: #e74139} /* 삭제 */
.btn.btn-background.modify{background: #4f9c6c} /* 수정 */
.btn.btn-background.check{background: #e87a2c} /* 중복검사 */
.btn.btn-background.cancel{background: #6f7174} /* 취소 */
.btn.btn-background.close{background: #888} /* 닫기 */
.btn.btn-background.confirm, /* 확인 */
.btn.btn-background.create, /* 생성 */
.btn.btn-background.save{background: #184f7d} /* 저장 */
.btn.btn-background.preview, /* 미리보기 */
.btn.btn-background.download{background: #004970} /* 다운로드1 */
.btn.btn-background.download2{background: #00701c} /* 다운로드2 */
.btn.btn-background.prev{background: #30739c} /* 이전 */
.btn.btn-background.next{background: #2878be} /* 다음 */
.btn.btn-background.status, /* 상태, 처리 */
.btn.btn-background.pw-modify, /* 비밀번호 변경 */
.btn.btn-background.setting{background: #4160b4} /* 설정 */
.btn.btn-background.apply{background: #2d79be} /* 신청 */
.btn.btn-background.file-search{position: relative; height: 34px; padding: 0 13px; background: #9e9e9e; line-height: 34px; vertical-align: middle;}
.btn.btn-background.file{min-width: 75px; padding: 10px 13px; line-height: 1}
.btn.btn-background.file.add{background: #678494}
.btn.btn-background.file.del{background: #787878}
.btn.btn-background.btn-link{height:38px;padding:0 30px 0 20px; font-size: 14px; font-weight: normal; background: #333 url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_neebj_evtug.tvs) no-repeat 94% 50%;line-height:38px;}

/*** 버튼 - 라인 형태 ***/
.btn.btn-border{min-width: 70px; height:38px; padding:0 15px; border: 1px solid #666; background: #fff; color: #666; font-size: 14px; line-height: 36px;}
/* 크기 */
.btn.btn-border.btn-xsmall{min-width: 50px; padding: 0 10px; height: 30px; font-size: 13px; line-height: 28px;}
.btn.btn-border.btn-small{min-width: 60px; padding: 0 20px; height: 34px; font-size: 14px; line-height: 32px;}
.btn.btn-border.btn-large{height: 44px; padding: 0 25px; font-size: 16px; line-height: 42px;}
.btn.btn-border.btn-xlarge{width: 100%; height: 44px; font-size: 16px; line-height: 44px;}
/* 색상 */
.btn.btn-border.btn-blue{border-color: #649ed9}
.btn.btn-border.btn-green{border-color: #77c035}
.btn.btn-border.btn-gray{border-color: #8a8d91}
.btn.btn-border.btn-pink{border-color: #e58a9e}
.btn.btn-border.write{border-color: #1f6db1; color: #1f6db1;} /* 쓰기 */
.btn.btn-border.search, /* 조회 */
.btn.btn-border.modify{border-color: #214b64; color: #214b64;} /* 수정 */
.btn.btn-border.delete{border-color: #888; color: #888;} /* 삭제 */
.btn.btn-border.close, /* 닫기 */
.btn.btn-border.cancel{border-color: #888; color: #888;} /* 취소 */
.btn.btn-border.create, /* 생성 */
.btn.btn-border.list, /* 목록 */
.btn.btn-border.save, /* 저장 */
.btn.btn-border.select{border-color: #1f6db1; color: #1f6db1;} /* 선택 */
.btn.btn-border.btn-download{height:40px;padding:0 38px 0 20px;border-color: #777;color: #333;font-size: 14px; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_svyr_qbjaybnq.tvs) no-repeat 93% 50%;line-height:40px;}

/***** 관리자 *****/
.admin .btn{border-radius:5px;}

/*** 버튼 - 채워진 형태 ***/
.admin .btn.btn-background{min-width:86px;height:34px;font-size:14px;font-weight:400;line-height:34px;}
.admin .btn.btn-background.btn-xsmall{min-width: 50px; padding: 0 10px; height: 28px; font-size: 13px; line-height: 28px;}
.admin .btn.btn-background.btn-small{min-width: 60px; padding:0 15px; height: 30px; font-size: 13px; line-height: 30px;}
.admin .btn.btn-background.btn-large{min-width: 70px; height: 40px; padding: 0 16px; font-size: 15px; line-height: 40px;}
.admin .btn.btn-background.btn-xlarge{width: 100%; height: 40px; font-size: 15px; line-height: 40px;}

/*** 버튼 - 라인 형태 ***/
.admin .btn.btn-border{padding:0 16px;height:34px;font-size:14px;line-height:32px;}
.admin .btn.btn-border.btn-xsmall{min-width: 50px; padding: 0 10px; height: 28px; font-size: 13px; line-height: 26px;}
.admin .btn.btn-border.btn-small{min-width: 60px; padding: 0 15px; height: 30px; font-size: 13px; line-height: 28px;}
.admin .btn.btn-border.btn-large{min-width: 70px; height: 40px; padding: 0 16px; font-size: 15px; line-height: 38px;}
.admin .btn.btn-border.btn-xlarge{width: 100%; height: 40px; font-size: 15px; line-height: 38px;}

/*=========================================================================================================================================*/
/** 
 *  버튼 그룹
 *	.btn-group: 버튼 그룹 기본 클래스
 *	.btn-group .left-group: 왼쪽 정렬 버튼 그룹
 *	.btn-group .right-group: 오른쪽 정렬 버튼 그룹
 *	.btn-group .center-group: 중앙 정렬 버튼 그룹
 */
.btn-group{display:table;width:100%;/* table-layout:fixed; */margin-top:20px;}
.btn-group.top{margin-top:0;margin-bottom:20px;}

.btn-group [class$="group"]{display:table-cell;vertical-align:middle;}
.btn-group .left-group{text-align:left;}
.btn-group .right-group{text-align:right;}
.btn-group .center-group{text-align:center;}
.btn-group .left-group a,
.btn-group .left-group .btn{margin-right:4px;}
.btn-group .right-group a,
.btn-group .right-group .btn{margin-left:4px;}
.btn-group .center-group a,
.btn-group .center-group .btn{margin:0 2px;}

/*=========================================================================================================================================*/
/** 
 *	폼요소
 *  .form-control: 폼요소를 감싸는 기본 클래스. 폼요소의 너비를 지정하기 위한 용도.
 *		div.form-control: 폼요소를 block 으로 지정하여 세로로 정렬. (너비 지정 가능)
 *		div.form-control.horizonal: 폼요소를 inline-block 으로 지정하여 가로로 정렬. (너비 지정 가능)
 *		span.form-control: 폼요소를 inline-block 으로 지정하여 가로로 정렬. (너비 지정 불가)
 *			span.form-control.check-control: 가로로 정렬하는 폼요소가 radio, checkbox 일 경우 지정. (너비 지정 불가)
 *
 *   !!!주의!!!: 클래스는 1, 2 순서로(옵션, 길이 순으로) 지정
 *     1. 옵션
 *      .no-radius: .form-control안의 모든 폼요소에 둥근 모서리가 없도록 지정함

 *      .with-btn: 버튼과 함께 있는 폼요소를 감싸기 위함(버튼은 80px로 고정)
 *      .with-btn-search: 버튼과 함께 있는 폼요소를 감싸기 위함(버튼은 110px로 고정)

 *      .date: datepicker와 같은 날짜 선택 아이콘이 있는 폼요소를 감싸기 위함
 *      .email: 이메일 요소를 감싸기 위함(기본: select box가 있는 이메일)
 *         .email.no-select: 이메일 요소를 감싸기 위함(select box가 없는 이메일)
 *      .phone: 유선전화, 휴대전화 등 전화번호를 감싸기 위함
 *     2. 전체 길이(지정하지 않을 경우 100%)
 *      .number(75px), .xsmall(120px), .small(240px), .medium(360px), .large(480px), .xlarge(600px)
 *
 */ 
div.form-control{width: 100%; max-width: 100%;}
div.form-control:not(.horizonal)+div.form-control:not(.horizonal){margin-top: 5px;}
div.form-control input.inp-text,
div.form-control input.inp-file,
div.form-control select.sel{width:100%;}

span.form-control{display: inline-block; max-width: 100%; margin:2px 5px 2px 0; vertical-align: middle;}
span.form-control:last-child{margin-right:0;}
.lbl + span.form-control{margin-left:5px;}
span.form-control.check-control{margin-right:14px;}
span.form-control.check-control:last-child{margin-right:0;}

.form-control.control-split + .form-control.control-split{margin-left:2px;}
.form-control.control-split + .form-control.control-split:before{content:'';display:inline-block;width:1px;height:26px;margin-right:10px;background:#c1c1c1;vertical-align:middle;}

.form-control.horizonal{display: inline-block; width: auto; margin:2px 5px 2px 0; vertical-align: middle;}
/* .form-control.horizonal+.form-control.horizonal{margin-top: 0;} */
.form-control.no-radius *{border-radius: 0 !important;}
.form-control.control-center{margin-left:auto;margin-right:auto;}

/* 버튼이 있는 폼요소 */
div.form-control.with-btn{position: relative; padding-right: 94px;}
div.form-control.with-btn .btn{position: absolute; top: 0; right: 0; width: 90px; padding-left: 0; padding-right: 0; margin-right:0;}
div.form-control.with-btn-search{position: relative; padding-right: 115px;}
div.form-control.with-btn-search .btn{position: absolute; top: 0; right: 0; width: 110px; padding-left: 0; padding-right: 0;}
div.form-control .btn{margin-right: 3px;}

/* 날짜 아이콘이 있는 폼요소 */
.form-control.date{position: relative; width:147px; padding-right: 27px}
/* .form-control.date .inp-text{text-align:center;} */
.form-control.date img{position: absolute; top: 50%; right: 0; margin-top: -12px; cursor: pointer;}
.form-control.date button{position: absolute; top: 50%; right: 0; margin-top: -12px;}
.form-control.date button img{position:static;margin-top:0;}

/* 이메일 */
div.form-control.email{*zoom: 1;}
div.form-control.email::after{content: ''; display: block; clear: both;}
div.form-control.email .inp-text{float: left; width: 32%;}
div.form-control.email .email-at{float: left; width: 5%; height: 100%; margin-top: 7px; text-align: center;}
div.form-control.email select{float: left; width: 30%; margin-left: 1%;}
div.form-control.email.no-select .inp-text{float: left; width: 47%;}
div.form-control.email.no-select .email-at{float: left; width: 6%; height: 100%; margin-top: 7px; text-align: center;}

/* 전화번호 */
div.form-control.phone{*zoom: 1;}
div.form-control.phone::after{content: ''; display: block; clear: both;}
div.form-control.phone select{float: left; width: 30%;}
div.form-control.phone .phone-bar{float: left; width: 5%; height: 100%; margin-top: 6px; font-size: 20px; text-align: center;}
div.form-control.phone .inp-text{float: left; width: 30%;}
div.form-control.eventphone select:first-child{width:35%;}
div.form-control.eventphone select{float: left;width: 13%;}
div.form-control.eventphone .inp-text{float: left;width: 13%;}
div.form-control.eventphone .phone-bar{float: left; width: 5%; height: 100%; margin-top: 6px; font-size: 20px; text-align: center;}

/** 크기 **/
.form-control.number{width: 75px;}
.form-control.xsmall{width: 120px;}
.form-control.small{width: 240px;}
.form-control.medium{width: 360px;}
.form-control.large{width: 480px;}
.form-control.xlarge{width: 600px;}

/* 라벨이 있는 폼요소 */
.form-control.with-label{position:relative;padding-left:80px;}
.form-control.with-label .lbl{position:absolute;left:0;top:50%;width:80px;color:#3f3f3f;font-size:14px;font-weight:500;transform:translateY(-50%);}
.form-control.with-label .rdo + .lbl,
.form-control.with-label .chk + .lbl{position:static;width:auto;font-weight:400;}
/* 라벨이 길 경우 */
.form-group.label .form-control{position:relative;padding-left:100px;}
.form-group.label .form-control .lbl{position:absolute;left:0;top:50%;width:100px;color:#3f3f3f;font-size:14px;font-weight:500;transform:translateY(-50%);}

/* placeholder */
::-webkit-input-placeholder{color: #828282;}
:-moz-placeholder{color: #828282;}
::-moz-placeholder{color: #828282;}
:-ms-input-placeholder{color: #828282;}

/* input[type=text, password] */
input.inp-text{height: 38px; padding: 0 10px; font-size: 14px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; vertical-align: middle;}
input.inp-text.small{height: 28px; padding: 0 10px; font-size: 13px;}
input.inp-text.large{width:100%;}
input.inp-text[readonly],
input.inp-text[disabled]{background:#efefef !important;cursor:default;}

/* input[type=file] */
input.inp-file{height: 38px; padding: 4px 10px; font-size: 14px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; vertical-align: middle;}
input.file{border:1px solid #ccc;}

/* input[type=checkbox] */
input.chk{vertical-align:middle;}
label.lbl + input.rdo,
label.lbl + input.chk{margin-left:4px;}

/* input[type=radio] */
input.rdo{vertical-align:middle;}

/* label */
label.lbl{vertical-align:middle;}
input.rdo + label.lbl,
input.chk + label.lbl{margin-left:4px;}

/* textarea */
textarea.txtarea{width: 100%; resize: none; padding: 8px 10px; font-size: 14px; border: 1px solid #ccc; border-radius: 3px;  vertical-align: middle;}
textarea.txtarea[disabled]{background:#efefef !important;}

/* select box */
select.sel{height: 38px; padding: 0 6px;  border: 1px solid #ccc; border-radius: 3px;color: #666; font-size: 14px; vertical-align: middle;}
select.sel.small{height: 28px; padding: 0 6px; font-size: 13px;}
select.sel[disabled]{background:#efefef !important;cursor:default;}

/***** 관리자 *****/
.admin input.inp-text,
.admin input.inp-file,
.admin select.sel{height:34px;border-radius:5px;}
.admin textarea.txtarea{border-radius:5px;}

/*=========================================================================================================================================*/
/** 
 *  게시판
 *
 * 	1. 공통
 *	.search-area : 공통 검색영역
 *	.pagination : 공통 페이징
 *		.pagination.small : 작은 페이징
 *	.file-upload : 첨부파일 목록
 *	.board-answer : 문의하기(Q&A)
 *
 *	2. 테이블형
 *	.board-option : 게시판 상단 옵션
 *	.board-list : 게시판 목록
 *		.board-list.image : 이미지형 게시판 목록
 *		.board-list.video : 비디오형 게시판 목록
 *	.board-write : 게시판 상세보기, 쓰기
 *	.view-option : 이전글, 다음글
 *
 *		2-1) 테이블형 옵션
 *		.board-list.table-small : 작은 게시판 목록
 *		.board-write.table-small : 작은 게시판 상세보기, 쓰기
 *		.only-pc : 반응형으로 작아졌을 때 숨김 (<col>, <th>, <td>에 사용)
 *		.nodata : 등록된 게시글이 없을 경우
 */

/* 검색영역 */
.search-area{position: relative; margin-bottom: 10px;min-height:38px;}
.search-area .total{float:left; margin-top: 12px; color: #666; font-size: 15px; font-weight: bold}
.search-area .total strong{color: #f34b4b;}
.search-area .total .bar{font-size: 12px; font-weight: normal}
.search-area .total .number{font-size: 14px; font-weight: normal}
.search-area .search-wrap{float: right; position: relative;}
.search-area .search-wrap select.sel{width: 130px; margin-right:4px;}
.search-area .search-wrap input.inp-text{width:200px;margin-right:-6px;padding-right:2px;}
.search-area .search-wrap input.inp-text.news{padding-right:10px; margin-right: 10px;}
.search-area .search-wrap .btn.search{height:38px;background-color: #055dcd;/* padding: 7px 30px;*/ vertical-align: middle;line-height:38px;}
.search-area .search-wrap .form-control select.sel,
.search-area .search-wrap .form-control input.inp-text{width:100%;margin:0;}
.search-area .search-wrap .form-control.horizonal{margin-right:0;}

/***** 관리자 *****/
.admin .search-area .search-wrap input.inp-text{margin-right:-8px;padding-right:5px;}
.admin .search-area .search-wrap .btn.search{height:34px;padding:0 30px;line-height:34px;}

/* pagination */
.pagination{margin-top: 30px; text-align: center}
.pagination .pagination-wrap{display: inline-block; vertical-align: top;}
.pagination .pagination-wrap:after{content: ''; display: block; clear: both;}
.pagination a,.pagination img{vertical-align: top;}
.pagination a{float:left;display: inline-block; width:29px; height:29px; margin-right: 4px;}
.pagination a:last-child{margin-right: 0}
.pagination a.num{width: auto; min-width: 29px; padding: 0 8px; border: 1px solid #d4d4d4; color: #666; font-size: 14px; line-height: 27px;}
.pagination a.num.on{background-color: #353535; color: #fff;}
.pagination img{max-width: 100%;}
/*크기가 작은 pagination */
.pagination.small{margin-top: 20px;}
.pagination.small a{float:left; width: 24px; height: 24px; margin-right:3px;}
.pagination.small a.num{width: auto; min-width: 24px; padding: 0 5px;border: 1px solid #d4d4d4; font-size: 13px; line-height: 24px;}
.pagination.small a.num.on{background: #353535; color: #fff}

/*** table ***/
.board-option{margin-bottom:10px;text-align:right;}
/* 텍스트 정렬 */
table .text-left{text-align:left !important;}
table .text-right{text-align:right !important;}
table .text-center{text-align:center !important;}
/* 등록된 게시물이 없을 경우 */
table .nodata{padding:80px 0;text-align:center;}
table .nodata p{font-weight:bold;}
/* 데이터 정렬 */
table .sort{position:relative;display:block;min-height:40px;margin:-6px -10px;padding-right:10px;cursor:pointer;line-height:40px;}
table .sort:after{content:'\f0dc';position:absolute;top:50%;right:5%;margin-top:-11px;font-family:"Font Awesome 5 Pro";font-size:16px;text-align:center;line-height:22px;font-weight:bold;}
/* table .sort.asc:after,
table .sort.desc:after{color:#abc;} */
table .sort.asc:after{content:'\f0de';}
table .sort.desc:after{content:'\f0dd';}
/* 파일첨부 */
table .file-down{display: inline-block; margin-right: 10px; color: #666666; /* font-size: 15px; */ text-decoration: underline}

/* 목록 */
table.board-list{width:100%; border-top: 2px solid #141414;table-layout:fixed;}
table.board-list th,
table.board-list td {
    padding: 6px 10px;
    height: 48px;
    border-left: 1px solid #d1d1d1;
    border-bottom: 1px solid #d1d1d1;
    color: #555;
    font-size: 15px;
    text-align: center;
    line-height: 1.4;
}
table.board-list th:first-child,
table.board-list td:first-child{border-left: none;}
table.board-list th{font-weight: bold;}
table.board-list td{word-wrap:break-word;}
table.board-list thead th{border-bottom-color: #b9bcc3;}
table.board-list th.left,
table.board-list td.left{text-align: left; padding-left: 20px; padding-right: 15px;}
table.board-list tr.notice td{background:#f2f2f2;font-weight:bold;color:#333}
table.board-list tr.notice a.text-link{font-weight:bold;color:#333}
/* 선이 없는 테이블 */
table.board-list.no-bordered th,
table.board-list.no-bordered td{border-left:0;}
/* 작은 테이블 */
table.board-list.table-small th,
table.board-list.table-small td{height: 40px;padding: 4px 10px;}
table.board-list.table-small th{font-size: 14px;}
table.board-list.table-small td{font-size: 13px;}
/* 게시판(이미지형-썸네일형) 목록 */
table.board-list.image .thum-image{position: relative; /*width: 165px;*/ width:88%; margin: 0 auto; padding: 14px 0;}
table.board-list.image .thum-image img{width: 100%; max-width: 100%; border: 1px solid #e0e0e0;}
table.board-list.image .thum-meta{text-align: left; line-height: 1.4}
table.board-list.image .thum-meta .tit{color: #333; font-size: 15px; font-weight: bold}
table.board-list.image .thum-meta .tit a{color: inherit;}
table.board-list.image .thum-meta .txt{margin-top: 3px; color: #666; font-size: 15px}
/* 게시판(이미지형-가로형) 목록 */
table.board-list.video .thum-video{position: relative; /*width: 165px;*/ width:88%; margin: 0 auto; border:1px solid #efefef;}
table.board-list.video .thum-video a{display:block;}
table.board-list.video .thum-video a:after{content: ''; position: absolute; top: 50%; left: 50%; width: 42px; height: 42px; margin-top: -21px; margin-left: -21px; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_cynl.cat) no-repeat}
table.board-list.video .thum-video img{width: 100%; max-width: 100%;}
table.board-list.video .thum-meta{text-align: left; line-height: 1.4}
table.board-list.video .thum-meta .tit{color: #333; font-size: 15px; font-weight: bold}
table.board-list.video .thum-meta .tit a{color: inherit;}
table.board-list.video .thum-meta .txt{margin-top: 3px; color: #666; font-size: 15px}
table.board-list.video .thum-meta .btn-group{margin-bottom: 0}
table.board-list.video .thum-meta .btn.detail{padding: 0 12px 0 30px; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_cynl_fznyy.cat) no-repeat 9px 50%, #fff}
/* 게시판(Q&A,비밀글) 목록 */
table.board-list a.text-link.link-secret,
table.board-list a.text-link.link-reply{background-repeat:no-repeat;}
table.board-list a.text-link.link-secret{padding-right:20px;background-image:url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpb_frperg.cat);background-position:100% 50%;}
table.board-list a.text-link.link-reply{padding-left:40px;background-image:url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_er.cat);background-position:0 0;}
table.board-list a.text-link img{vertical-align:middle;margin-left:4px;}

/***** 관리자 *****/
.admin table.board-list{border-top:1px solid #616161;}
.admin table.board-list th,
.admin table.board-list td{height:40px;border-left-color:#e9eaed;border-bottom-color:#e9eaed;}
.admin table.board-list th{color:#515151;}
.admin table.board-list td{color:#616161;}

/* 상세보기, 등록 */
table.board-write{width: 100%; border-top: 2px solid #444; table-layout: fixed;}
table.board-write > tbody > tr > th,
table.board-write > tbody > tr > td{height:48px; padding: 10px 10px; color: #555; border: solid #d1d1d1; border-width: 1px 1px 1px 0;}
table.board-write > tbody > tr > th{background:#f2f2f2; font-size: 15px; font-weight: bold; text-align:center;}
table.board-write > tbody > tr > th strong{color:#264f8c;}
table.board-write > tbody > tr > td{font-size: 15px; text-align:left; padding-left: 20px;word-wrap:break-word;}
table.board-write > tbody > tr > td.center{text-align: center; padding-left: 10px; padding-right: 10px;}
table.board-write > tbody > tr > th:last-child,
table.board-write > tbody > tr > td:last-child{border-right: none;}
table.board-write > tbody > tr > th.border-right,
table.board-write > tbody > tr > td.border-right{border-right:1px solid #d1d1d1;}
table.board-write > tbody > tr > td.tb-content{padding: 30px 20px;/* word-break:keep-all; */}
table.board-write > tbody > tr > td.tb-content table{max-width:100%;}
table.board-write.text-left > tbody > tr > th,
table.board-write.text-left > tbody > tr > td{text-align: left !important;} /* 전체 왼쪽 정렬하는 옵션*/
table.board-write .btn-group{margin-top:10px;}
/* 작은 테이블 */
table.board-write.table-small > tbody > tr > th,
table.board-write.table-small > tbody > tr > td{height: 44px; padding: 4px 10px;}
table.board-write.table-small > tbody > tr > th{font-size: 14px;}
table.board-write.table-small > tbody > tr > td{font-size: 13px;}

/***** 관리자 *****/
.admin table.board-write{border-top:1px solid #616161;}
.admin table.board-write > tbody > tr > th,
.admin table.board-write > tbody > tr > td{height:40px;padding:3px 10px;border:0;border-right:1px solid #e4e4e4;border-bottom:1px solid #e4e4e4;}
.admin table.board-write > tbody > tr > th{color:#515151;font-size:14px;}
.admin table.board-write > tbody > tr > td{color: #616161; font-size: 14px; text-align:left; padding-left: 15px; padding-right: 15px;}
.admin table.board-write > tbody > tr > th:last-child,
.admin table.board-write > tbody > tr > td:last-child{border-right: none;}
.admin table.board-write > tbody > tr > td.tb-content{padding:20px 10px;}
.admin table.board-write > tbody > tr > td .file-down{font-size:14px;}

/* 이전글, 다음글 */
table.view-option{position: relative; margin-top: -1px; border-top: 1px solid #d1d1d1; border-bottom: 1px solid #d1d1d1}
.board-answer + table.view-option{margin-top:0;}
table.view-option a.text-link{display:block; overflow-x: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; color: inherit;}
table.view-option a.text-link:hover,
table.view-option a.text-link:focus{text-decoration:underline;}
table.view-option .btn-view{position:relative;display:inline-block;padding-left:20%;}
table.view-option .btn-view:before{content:'';position:absolute;top:50%;left:0;display:inline-block;width:11px;height:8px;margin-top:-4px;background-repeat:no-repeat;}
table.view-option .btn-view.next:before{background-image:url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpb_zbir_arkg.tvs);}
table.view-option .btn-view.prev:before{background-image:url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpb_zbir_ceri.tvs);}

/***** 관리자 *****/
.admin table.view-option{border-top:1px solid #e4e4e4;}

/* 파일 첨부 */
.file-upload .upload-wrap input[type="file"]{overflow:hidden;width:1px;height:1px;margin-top:-1px;display: block;padding: 0;border: 0;}
/* .file-upload .file-list{margin-top: 10px;} */
/* .file-upload .upload-wrap + .file-list{padding-top: 10px; border-top: 1px solid #e1e1e1;} */
.file-upload .file-list .file-wrap{color:#333;font-size:15px;font-weight: bold}
.file-upload .file-list .file-wrap:first-of-type{margin-top: 10px;padding-top: 10px; border-top: 1px solid #e1e1e1;}
.file-upload .file-list .file-wrap + .file-wrap{margin-top: 5px}
.file-upload .file-list .file-wrap a{color:inherit;font-size:inherit;font-weight:inherit;}
.file-upload .file-list .file-del{margin-left: 5px; width: 27px; height: 20px; border: none; border-radius: 3px; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_pybfr.tvs) no-repeat; text-indent: -999em;}
.file-upload .file-list .rdo-main-img{display:none;}
.file-upload .file-list .lbl-main-img{width: 77px; height: 20px; border-radius: 3px; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_znva_bss.tvs) no-repeat; text-indent: -999em}
.file-upload .file-list .rdo-main-img:checked + .lbl-main-img{background-image: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_znva_ba.tvs)}

/* 문의하기(Q&A) 답변 */
.board-answer{margin-bottom:20px;border:1px solid #dbdbdb;padding:24px 25px 30px;}
table.board-write + .board-answer{margin-top:-1px;}
.board-answer .answer-head{position:relative;padding-bottom:8px;border-bottom:1px solid #e5e5e5;}
.board-answer .answer-title{color:#555;font-size:16px;font-weight:bold;}
.board-answer .answer-title:before{content:'\f2bd';display:inline-block;margin-right:10px;color:#7daee0;font-size:37px;font-family:"Font Awesome 5 Pro";font-weight:bold;vertical-align:-20%;line-height:1;}
.board-answer .answer-date{color:#333;font-size:14px;}
.board-answer .answer-date:before{content:'\f017';display:inline-block;margin-right:8px;color:#c8c8c8;font-size:19px;font-family:"Font Awesome 5 Pro";vertical-align:text-bottom;line-height:1;}
.board-answer .answer-head .answer-date{position:absolute;top:10px;right:0;}
.board-answer .answer-body{margin-top:30px;color:#333;font-size:15px;/* word-break:keep-all; */word-wrap:break-word;}

/* 게시판(이미지형-썸네일형) 목록 */
.gallery-list:after{content:'';display:block;clear:both;}
.gallery-list > li{float: left; width: 32.33333%; margin-right: 1.5%; margin-bottom: 1.5%}
.gallery-list > li:nth-child(3n){margin-right: 0}
.gallery-list > li .gallery-item{background-color: #fff; color: #111; min-height: 130px;}
.gallery-list > li .gallery-item .item-wrap,
.gallery-list > li .gallery-item > a{display:block; position: relative; border: 1px solid #ddd;}
.gallery-list > li .gallery-item > a:hover,
.gallery-list > li .gallery-item > a:active,
.gallery-list > li .gallery-item > a:focus{border-color:#bababa;}
.gallery-list > li .gallery-item .gallery-thum{display: block; overflow: hidden; width: 100%; height: 200px;}
.gallery-list > li .gallery-item .gallery-thum img{width: 100%; height: 100%;}
.gallery-list > li .gallery-item .gallery-meta{padding:15px; border-top: 1px solid #ccc}
.gallery-list > li .gallery-item .gallery-meta h2{height: 48px; overflow: hidden; color: #1a1a1a; font-size: 18px; font-weight: normal; line-height: 24px}
.gallery-list > li .gallery-item > a:hover .gallery-meta h2,
.gallery-list > li .gallery-item > a:active .gallery-meta h2,
.gallery-list > li .gallery-item > a:focus .gallery-meta h2{text-decoration: underline;}
.gallery-list > li .gallery-item .gallery-meta .gallery-info{position: relative; display: block; width: 100%; margin-top:11px; padding: 11px 0 0; border-top: 1px solid #ebebeb; color: #333; font-size: 13px; line-height: 18px}
.gallery-list > li .gallery-item .gallery-meta .gallery-info .gallery-date{position: absolute; bottom: 0; right: 0; color: #888;}
/* 웹진처럼 세로로 길 경우 */
.gallery-list.col-4 > li{width:23.875%;}
.gallery-list.col-4 > li:nth-child(3n){margin-right:1.5%;}
.gallery-list.col-4 > li:nth-child(4n){margin-right:0;}
.gallery-list.col-4 > li .gallery-item .gallery-thum{padding:20px;height:245px;}
.gallery-list.col-4 > li .gallery-item .gallery-thum div{height:100%;}
/* 등록된 게시물이 없을 경우 */
.gallery-list .nodata{margin:0;width:100%;padding:100px 0;border-top:2px solid #141414;border-bottom:1px solid #dcdee2;text-align:center;}
.gallery-list .nodata p{color:#1a1a1a;font-size:16px;font-weight:bold;}
/* 비디오형 갤러리 */
.gallery-list.video > li .gallery-item .gallery-thum{position:relative;text-align:center;}
.gallery-list.video>li .gallery-item .gallery-thum:after {
    content: '\f144';
    font-family: 'Font Awesome 5 Pro';
    font-weight: bold;
    color: #fff;
    font-size: 44px;
    line-height: 200px;
    text-shadow: 1px 1px 6px rgba(0,0,0,.14);
}

/* 게시판(이미지형) 상세보기 */
.fotorama{margin-bottom:20px;}
.fotorama .fotorama__nav{background:#ececec;text-align:left;}
.fotorama .fotorama__thumb-border{border-color:#777;}

/* 게시판(비디오형) 상세보기 */
.video-wrap{margin-bottom:30px;}
.video-wrap .video-area{float: left; width: 65%; height: 300px;}
.video-wrap .video-area video{width: 100%; max-width: 100%; height: 100%; background: #000}
.video-wrap .video-desc{float: left; width: 35%; background: #ededed; padding: 20px 30px; height: 300px; overflow-y: auto}
.video-wrap .video-desc .desc-title{font-size: 20px; color: #333; line-height: 1.5; margin-bottom: 25px}
.video-wrap .video-desc .desc-txt{font-size: 15px; color: #7a7a7a; line-height: 1.5;}
.video-wrap .video-frame{position:relative;padding-bottom:56.25%;height:0;}
.video-wrap .video-frame iframe{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;}

/*=========================================================================================================================================*/
/** 
 *  테이블
 */

/***** 기본 테이블 *****/
.table-basic{width:100%; table-layout: fixed; border-top: 2px solid #141414; line-height: 1.3}
.table-basic th,.table-basic td{height:55px;padding:10px 15px;border: solid #d1d1d1; border-width: 1px 1px 1px 0;text-align:center;}
.table-basic th.left,.table-basic td.left{text-align: left;}
.table-basic th.text-left,
.table-basic.text-left th{text-align: left;padding-left:20px;}
.table-basic th:last-child,.table-basic td:last-child{border-right: none;}
.table-basic th{color: #333; font-size: 15px}
.table-basic thead th{border-bottom: 1px solid #b9bcc3;}
.table-basic td{color: #555; font-size: 14px; text-align: center}
.table-basic th.border-right,
.table-basic td.border-right{border-right:1px solid #d1d1d1;}
/* 양쪽 선이 있는 테이블 */
.table-basic.table-bordered th,.table-basic.table-bordered td{border: 1px solid #d1d1d1;}
/* 작은 테이블 */
.table-basic.table-small th,.table-basic.table-small td{height: 40px; padding: 4px 10px; font-size: 13px;}

/***** 기본 테이블2 *****/
.table-basic2{width: 100%; table-layout: fixed; line-height: 1.3}
.table-basic2 th,.table-basic2 td{height: 55px; padding: 10px 15px; border: solid #d1d1d1; border-width: 1px 1px 1px 0; color: #555; font-size: 14px; text-align: center}
.table-basic2 th.left,.table-basic2 td.left{text-align: left;}
.table-basic2 th.text-left,
.table-basic2.text-left th{text-align: left;padding-left:20px;}
.table-basic2 th:last-child,.table-basic2 td:last-child{border-right: none;}
.table-basic2 th{background-color: #ebebeb;/* word-break: keep-all;*/}
.table-basic2 td{word-break:break-all;}
.table-basic2 div.btn-wrap{margin-top:8px;}
.table-basic2 span.btn-wrap{margin-left:6px;vertical-align:middle;}
.table-basic2 th.border-right,
.table-basic2 td.border-right{border-right:1px solid #d1d1d1;}
.table-basic2 th.border-bottom,
.table-basic2 td.border-bottom{border-bottom: 1px solid #d1d1d1;}
.table-basic2 .text-small{margin-top:5px;font-size:86%;font-weight:normal;}
/* 양쪽 선이 있는 테이블 */
.table-basic2.table-bordered th,.table-basic2.table-bordered td{border: 1px solid #d1d1d1;}
/* 줄무늬 행 테이블 */
.table-basic2.table-striped tr:nth-child(odd) td{background-color: #fff}
.table-basic2.table-striped tr:nth-child(even) td{background-color: #f7f7f7}
/* 진한 선이 있는 테이블 */
.table-basic2.table-bold th,.table-basic2.table-bold td{border-top: none;}
/* .table-basic2.table-bold tbody tr:last-child > *{border-bottom: none;} */
.table-basic2.table-bold{border-top: 2px solid #444;/*  border-bottom: 1px solid #3b3b3b; */}
/* 작은 테이블 */
.table-basic2.table-small th,.table-basic2.table-small td{height: 40px; padding: 4px 10px; font-size: 13px;}

/***** 기본 테이블3 *****/
.table-basic3{width: 100%; table-layout: fixed; line-height: 1.3; border-top: 1px solid #36818c;}
.table-basic3 th,
.table-basic3 td {
    padding: 15px 12px;
    border: 1px solid #d1d1d1;
    border-top: none;
    background-color: #fff;
    color: #555;
    font-size: 14px;
    text-align: center
}
.table-basic3 th.left,.table-basic2 td.left{text-align: left;}
.table-basic3 thead th{background-color:#fcfcfc; color:#1c1c1c; font-size: 16px;}
.table-basic3 tbody td{color: #666; font-size: 15px;}

.table-basic3 .table-title{position: relative; margin: 5px 0 5px 20px; padding-left: 15px; color: #039ab2; text-align: left;}
.table-basic3 .table-title::before{content: ''; position: absolute; top: 10px; left: 0; width: 9px; height: 3px; background-color: #039ab2;}
.table-basic3 .join-box{max-width: 80%; margin: 0 auto; padding: 35px 0; border-bottom: 1px solid #e1e1e1;}
.table-basic3 .join-box-wrap{max-width: 490px; margin: 0 auto; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Szrzore%2Svpba_wbva_zrzore.tvs) no-repeat 0 50%; padding-left: 80px; color:#0d5a65; font-size:15px; text-align:left; line-height:23px;  font-weight: bold;}
.table-basic3 .join-in-table{max-width: 450px; width: 80%; margin: 35px auto; border: 0;}
.table-basic3 .join-in-table td{padding: 5px 0; border: none; font-weight: bold; text-align: left;}

/*=========================================================================================================================================*/
/**
 *	자주묻는질문(FAQ)
 */
.accordian-box .acdn-toggle{float: right; border: none; padding: 13px 38px 9px 17px; background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_cyhf.cat) no-repeat 89% 60%, #555;font-size: 16px; font-weight: bold; color: #fff;}
.accordian-box .acdn-toggle.open{background-image: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Svpba_zvahf.cat)}
.accordian-box .accordian{padding:0; border-top: 3px solid #555;clear:right;}
.accordian-box .acdn-title{border-bottom:1px solid #d1d1d1;background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Sdan_03.tvs) no-repeat 15px 50%; }
.accordian-box .acdn-title a {
    position: relative;
    display: block;
    padding: 20px 50px 20px 70px;
    color: #333;
    font-size: 15px;
    font-weight: bold;
    word-break: keep-all;
    transition: all .15s ease;
}
.accordian-box .acdn-title a:after{content:''; position: absolute; right: 22px; top: 50%; width: 12px; height: 7px;margin-top:-3px;background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Snee_02.tvs) no-repeat;}
.accordian-box li.open .acdn-title a:after{-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); transition: all .15s ease}
.accordian-box .acdn-text {
    display: none;
    padding: 20px 20px 20px 70px;
    background: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Sdan_04.cat) no-repeat 20px 10px, #f3f3f3;
    color: #555;
    font-size: 15px;
    line-height: 1.5;
    border-bottom: 1px solid #ccc;
}
.accordian-box .acdn-text p{word-break: keep-all}
.accordian-box .acdn-text p + p{margin-top:5px;}

/*=========================================================================================================================================*/
/**
 *	캘린더
 */
.calendar-box{}
.calendar-box.fc .fc-toolbar>*>*{margin-left:0}
.calendar-box.fc .fc-toolbar h2{display:inline-block;margin:0 40px;color:#333;font-size:22px;font-weight:bold;}
.calendar-box.fc .fc-toolbar .fc-center > *{vertical-align:middle;float:none;}

/*.calendar-box .fc-day-header{background-color:#e9e9e9;height:34px;vertical-align:middle;}*/
.calendar-box .fc-day-header{background-color:#e9e9e9;/* border-color:#fff; color:#fff;*/height:34px;vertical-align:middle;}
.calendar-box .fc-day-header:not(:first-child){border-left-color:#cacaca;}
/*.calendar-box .fc-day-header.fc-sat{color:#2479c1;}
.calendar-box .fc-day-header.fc-sun{color:#dc4441;}*/
.calendar-box .fc-day-header.fc-sat{color:#2479c1;}
.calendar-box .fc-day-header.fc-sun{color:#dc4441;}
.calendar-box .fc-basic-view .fc-day-top{padding:6px;}
.calendar-box .fc-basic-view .fc-day-top .fc-day-number{float:none !important;}
.calendar-box .fc-bg td.fc-today{opacity:1;background-color:#c9e0f4 !important;font-weight:bold;border-color:#ddd;}
.calendar-box td.fc-day.fc-disabled-day{background:none;}
.calendar-box .fc-row .fc-content-skeleton{padding-bottom:8px;}
.calendar-box .fc-row .fc-content-skeleton table tbody td{padding:0 6px;}
.calendar-box .fc-day-grid-event{margin-left:0;margin-right:0;}
.calendar-box .fc-day-grid-event .fc-content{text-overflow:ellipsis;/*color:#fff;*/padding:2px 4px;}
.calendar-box .fc-day-grid-event .fc-time{display:none;}

.calendar-box button.fc-button{text-shadow:none;box-shadow:none;}
.calendar-box button.fc-today-button{border:0;padding:0 16px;height:44px;background:#358bd5;color:#fff;font-size:15px;}
.calendar-box .fc-center button.fc-button{width:44px;height:44px;background-image:url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Sjjj.nxf.np.xe%2Spff%2Sbavbapzf%2S..%2S..%2Svzntrf%2Sbavbapzf%2Ssbez%2Soga_pnyraqne.cat);background-repeat:no-repeat;background-color:transparent;border:none;}
.calendar-box .fc-center button.fc-button .fc-icon{display:none;}
.calendar-box .fc-center button.fc-prevYear-button{margin-right:-1px;background-position:0 0;border-top-right-radius:0;border-bottom-right-radius:0;}
.calendar-box .fc-center button.fc-prev-button{background-position:-43px 0;border-top-left-radius:0;border-bottom-left-radius:0;}
.calendar-box .fc-center button.fc-next-button{background-position:0 -44px;border-top-right-radius:0;border-bottom-right-radius:0;}
.calendar-box .fc-center button.fc-nextYear-button{margin-left:-1px;background-position:-43px -44px;border-top-left-radius:0;border-bottom-left-radius:0;}

/**
 *	팝업
 */
/* 모달 팝업 */
.modal-bg{opacity: 0.4; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; z-index: 999}

.modal{display:none; position: fixed; top: 50%; left: 50%;max-width:93%; z-index: 1000; transform: translate(-50%,-50%); -ms-transform: translate3d(-50%,-50%,0px);animation:animatetop 0.4s;}
.modal.on{display:block;}
.modal .modal-wrap{position:relative;width:480px;max-width:100%;background-color:#fff;}
.modal.modal-small .modal-wrap{width:360px;}
.modal.modal-large .modal-wrap{width:600px;}
.modal.modal-xlarge .modal-wrap{width:720px;}
.modal .modal-btn-group .btn{margin:0 2px;}
.modal .table-scroll{max-height:260px;overflow-y: auto;}

.modal .search-area{margin-bottom:0;min-height:0;}
.modal .search-area .search-wrap{float:none;position:relative;padding-right:70px;}
.modal .search-area .search-wrap input.inp-text{width:100%;}
.modal .search-area .search-wrap .btn.search{width:66px;position:absolute;top:0;right:0;padding:0 11px;}

.modal p.desc + .modal-info{margin-top:15px;}
.modal .modal-info + .table-scroll{margin-top:15px;}

.modal .modal-btn-group{margin-top:20px;text-align:right;}
.modal .btn.confirm{background:#2d85bb;} /* 확인, 적용 */
.modal .btn.close{background:#666;} /* 닫기 */

/***** 사용자 *****/
.user .modal .modal-wrap{}
.user .modal .modal-header{height:55px;padding:16px 30px;background-color:#3867b1;}
.user .modal .modal-header .header-title{color:#fff;font-size:18px;font-weight:600;}
.user .modal .modal-content{position:relative;padding:25px 30px;}
.user .modal .modal-content .content-title{margin-bottom:10px;color:#333;font-size:20px;}
.user .modal p.desc{color:#333;font-size:15px;}

.user .modal .modal-info{padding:16px 20px;border:1px solid #c8d2e1;border-radius:3px;background:#eef2f7;}
.user .modal .modal-info p{color:#323232;font-size:16px;letter-spacing:-.02em;}
.user .modal .modal-info p + p{margin-top:10px;}
.user .modal .modal-info p strong{color:#3a73c4;font-size:20px;font-weight:bold;}
.user .modal .modal-info p em{margin-left:4px;font-size:18px;font-weight:bold;}

.user .modal .modal-close .btn-close{position: absolute;right:20px;top:17px;display:inline-block;width:32px;height:32px;vertical-align:top;text-align:center;}
.user .modal .modal-close .btn-close:after {
    content: '\f00d';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    color: #fff;
    font-size: 22px;
    font-family: "Font Awesome 5 PRO";
    line-height: 24px;
}

/***** 관리자 *****/
.admin .modal .modal-header{position: relative; height: 50px; padding: 13px 20px; background-color: #2b5faa;}
.admin .modal .modal-header .header-title{color: #fff; font-size: 18px;}
.admin .modal .modal-content{padding:25px;border: 4px solid #3a73c4; border-top:0; }
.admin .modal .modal-content .content-title{margin-bottom: 10px; color: #333; font-size: 20px; margin-bottom: 10px;}
.admin .modal .modal-section{margin-top:20px;}

.admin .modal .modal-btn-group{margin-top:25px; text-align: center;}
.admin .modal .btn.btn-confirm{background:#3a73c4;}
.admin .modal .table-scroll{max-height:260px;overflow-y: auto;}

.admin .modal .modal-info{padding:25px 30px;border:1px solid #c8d2e1;border-radius:10px;background:#eef2f7;}
.admin .modal .modal-info p{color:#323232;font-size:16px;letter-spacing:-.02em;}
.admin .modal .modal-info p + p{margin-top:10px;}
.admin .modal .modal-info p strong{color:#3a73c4;font-size:20px;font-weight:bold;}
.admin .modal .modal-info p em{margin-left:4px;font-size:18px;font-weight:bold;}

.admin .modal .modal-top-box{display:table;width:100%;margin-bottom:20px;padding:10px 20px;border:1px solid #d1d1d1;border-radius:3px;}
.admin .modal .modal-top-box span{display:table-cell;vertical-align:middle;}
.admin .modal .modal-top-box .box-title{width:80px;color:#636363;font-size:15px;}
.admin .modal .modal-top-box .box-desc{color:#323232;font-size:15px;font-weight:500;}

.admin .modal .modal-close .btn-close{position: absolute;right:10px;top:14px;display:inline-block;width:24px;height:24px;vertical-align:top;text-align:center;}
.admin .modal .modal-close .btn-close:after {
    content: '\f00d';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    color: #fff;
    font-size: 18px;
    font-family: "Font Awesome 5 Pro";
    font-weight: bold;
    line-height: 24px;
}

/* Animation */
@keyframes animatetop {
    from {top: 46%; opacity: 0}
    to {top: 50%; opacity: 1}
}
@keyframes alertTop {
    from {transform:translateY(-10px); opacity: 0}
    to {transform:translateY(0); opacity: 1}
}
