@charset "utf-8";


/* 버튼 공통 디자인  /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* 버튼하단_큰버튼 */
.button-b {display:inline-block; min-width:85px; height:43px; font-size:16px; line-height:41px; color:#333; text-align:center; margin:0 0 0 3px; padding:0 15px; border-radius:2px; border:1px solid #ccc; background:#fff;}
.button-b.dark {color:#fff; border-color:#333; background:#333;}
.button-b.gray {color:#333; border-color:#ccc; background:#f0f0f0;}
.button-b.blue {color:#fff; border-color:#193762; background:#193762;}
.button-b.red {color:#fff; border-color:#b00540; background:#b00540;}
.button-b.green {color:#fff; border-color:#168cb4; background:#168cb4;}

@media (max-width :767px) {
	.button-b {min-width:80px; height:45px; font-size:15px; line-height:43px; padding:0 10px; margin:3px;}
}
@media (max-width :481px) {
	.button-b {min-width:70px; height:40px; line-height:38px;}
}

/* 버튼상단_작은버튼 */
.button-s {display:inline-block; min-width:70px; line-height:36px; color:#333; text-align:center; padding:0 15px; border-radius:2px; border:1px solid #ccc; background:#fff;}
.button-s.dark {color:#fff; border-color:#333; background:#333;}
.button-s.gray {color:#333; border-color:#ccc; background:#f0f0f0;}
.button-s.blue {color:#fff; border-color:#193762; background:#193762;}
.button-s.red {color:#fff; border-color:#be3333; background:#be3333;}
.button-s.green {color:#fff; border-color:#168cb4; background:#168cb4;}
.button-s.download {color:#fff; background:#1f6b41;}

@media (max-width :767px) {
	.button-s {min-width:60px; height:35px; font-size:14px; line-height:33px; padding:0 10px; margin:3px;}
}

/* 버튼그룹_다운로드, 인쇄 ... */
.button-group-wrap {position:relative; display:inline-block; min-width:160px; margin:0;}
.button-group-wrap > a {position:relative; display:flex; justify-content:space-between; align-items:center; height:38px; font-size:15px; color:#555; padding:0 10px; background:#fff; border-radius:2px; border:1px solid #ddd; background:#eee;}
.button-group-wrap > a:after {content:""; position:absolute; right:10px; display:block; width:8px; height:5px; background:url('/static_root/images/common/selectArr.png') right center no-repeat;}
.button-group-wrap > a > span {display:flex; align-items:center; gap:10px;}
.button-group-wrap > a > span em {position:relative; display:flex; justify-content:center; align-items:center; width:22px; height:22px; font-style:normal; text-align:center; border-radius:50%; background:#9a9a9a;}
.button-group-wrap > a > span em:after {font-family:"Font Awesome 6 Free"; position:absolute; display:block; left:50%; top:50%; font-size:11px; font-weight:900; color:#fff; transform:translate(-50%, -50%);}
.button-group-wrap > a i {color:#fff; font-size:12px;}
.button-group-wrap > ul {position:absolute; top:45px; left:0; z-index:9; width:100%; border-radius:3px; border:1px solid #ccc; background:#fff; display:none;}
.button-group-wrap > ul li a {display:block; word-break:keep-all; color:#555; text-align:left; padding:10px; border-bottom:1px dashed #bbb;}
.button-group-wrap > ul li:last-child a {border:none;}
.button-group-wrap > ul li a:hover {background:#1F6B41; color:#fff;}
.button-group-wrap > a.print + ul li a:hover {color:#1f1f1f; background:#e8f0ff;}

.button-group-wrap > a.download > span > em:after {content:"\f019";} /* 다운로드 */
.button-group-wrap > a.upload > span > em:after {content:"\f093";} /* 업로드 */
.button-group-wrap > a.print > span > em:after {content:"\f02f";} /* 인쇄 */


/* 테이블 내부 버튼 */
.bbs-btn {display:inline-block; font-size:14px; color:#555; padding:3px 8px; margin:1px; border-radius:2px; border:1px solid #ccc; background:#fff;}
.bbs-btn:hover {color:#111; border-color:#9b9b9b;}
.bbs-btn.gray {color:#555; border-color:#ccc; background:#f0f0f0;}
.bbs-btn.gray:hover {color:#111; border-color:#9b9b9b;}
.bbs-btn.dark {color:#eee; border-color:#333; background:#313847;}
.bbs-btn.dark:hover {color:#fff; border-color:#222;}
.bbs-btn.blue {color:#125cc1; border-color:#93bcf6; background:#eff5ff;}
.bbs-btn.blue:hover {color:#074291; border-color:#6995d3;}
.bbs-btn.red {color:#e06599; border-color:#f8b2cf; background: #fef0f6;}
.bbs-btn.red:hover {color:#da005b; border-color:#dc7da5;}
.bbs-btn.green {color:#4f91b2; border:1px solid #9bbbcb; background:#f4fbff;}
.bbs-btn.green:hover {color:#4f91b2; border:1px solid #9bbbcb;}


/* 파일 개별 버튼 */
.fileDownBox {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px 50px; padding:12px 12px 12px 15px; margin-bottom:20px; border-radius:5px; border:2px dotted #ccc; background:#fff;}
.fileDownBox dfn {font-weight:500; color:#222;}
.fileDownBox div {display:flex; flex-wrap:wrap; gap:8px;}
.fileDownBox select {height:35px; border-color:#ccc;}

.file_down {display:inline-flex; height:35px; justify-content:space-between; align-items:center; gap:18px; font-size:15px; color:#555; padding:0 14px; border-radius:3px; border:2px solid #ddd; background:#fff;}
.file_down ~ .file_down {margin-left:3px;}
.file_down.large {min-width:80px; height:48px; font-size:16px; padding:3px 20px; border-width:1px; border-color:#aaa;} /* 하단버튼그룹에 위치하는 경우 */
.file_down:hover {color:#333; box-shadow:0 0 5px rgba(0,0,0,0.1);}
.file_down em {position:relative;}
.file_down em::after {font-family:"Font Awesome 6 Free"; position:absolute; top:50%; display:block; font-size:13px; font-weight:900; line-height:0; transform:translateY(-52%);}

.file_down.info em::after {content:"\f05a"; font-size:14px; color:#db0e2c;} /* 안내 */
.file_down.setting {background:#f5f5f5;} /* 설정관련 */
.file_down.setting em::after {content:"\f013"; font-size:13px; color:#999;}
.file_down.download em::after {content:"\f019"; color:#2177ce;} /* 다운로드 */
.file_down.excel em::after {content:"\f1c3"; color:#1f8b25;} /* 엑셀다운로드 */
.file_down.upload em::after {content:"\f093"; color:#6b70b3;} /* 업로드 */

