@charset "utf-8";

/********** 공통 **********/
a {transition:all .4s;-webkit-transition:all .4s;}
/********** skip_nav **********/
.skip_nav {position:absolute;z-index:1000;left:0;right:0;top:0;display:block;overflow:hidden;height:0;background:#000;text-align:center;}
.skip_nav:focus {overflow:auto;height:auto;padding:5px 0;color:#fff;}


/********** 숨김 **********/
.hide {overflow:hidden;position:absolute;left:-9999px;top:9999px;width:0;height:0;font-size:0;}


/********** 말줄임(공지사항 리스트_가로값과 같이사용) **********/
.ellipsis {overflow:hidden;display:inline-block;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:95%;}
.ellipsis2 {overflow:hidden;display:inline-block;width:95%;white-space:normal;display:-webkit-box;line-height:1.6;height:3em;word-wrap:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical;}

/********** 가로값 **********/
.wh100p {width:100%;}
.wh99p {width:99%;}
.wh70p {width:70%;}
.wh50p {width:50%;}
.wh45p {width:45%;}
.wh40p {width:40%;}
.wh30p {width:30%;}
.wh200 {width:200px;}
.wh150 {width:150px;}
@media only screen and (max-width:767px){
	.wh99p,
	.wh70p,
	.wh50p,
	.wh45p,
	.wh40p,
	.wh30p {width:100%;}
	.wh200 {width:100%;}
}

/********** 폰트색상 **********/
.cr_red {color:#ff0000;}
.cr_blue {color:#149EC7;}
.cr_gray {color:#5a5a5a;}


/********** 정렬 **********/
.ta-l {text-align:left;}
.ta-c {text-align:center;}
.ta-r {text-align:right;}


/********** 전역클래스 **********/
.ft-l {float:left;}
.ft-r {float:right;}
.block {display:block;}
.inblock {display:inline-block;}
.clear:after {content:"";display:block;clear:both;}

/********** 타이틀 **********/
.tith3 {font-size:32px;font-weight:800;color:#222;}
.tith4 {font-size:30px;font-weight:800;color:#090405;background:url(/images/fs/common/h.png) no-repeat left top;padding-left:40px;}
.tith5 {font-size:23px;font-weight:700;color:#433d3f;}
.tith5:before {content:"";display:block;width: 20px;height: 4px;margin-bottom:7px;background: #3561ad;}
.tith6 {position:relative;padding-left:15px;margin-left:15px;font-size:15px;color:#000;}
.tith6:after {content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:#86c43e;border-radius:100%;}
@media only screen and (max-width:767px){
	.tith4 {font-size:16px;}
	.tith5 {font-size:15px;}
}

/********** 참고텍스트 **********/
/* 느낌표_흰배경파란 */
.point1 {display:block;padding-left:20px;background:url(/images/fs/common/ico_caution1.gif) no-repeat 0 6px;}
/* 느낌표_흰배경빨강 */
.point2 {display:block;padding-left:20px;background:url(/images/fs/common/ico_caution2.gif) no-repeat 0 6px;}
/* 느낌표_빨강배경흰색 */
.point3 {display:block;padding-left:20px;background:url(/images/fs/common/ico_caution3.gif) no-repeat 0 6px;}



/********** 리스트 **********/
/* 리스트_1 */
.list1 > li {position:relative;padding-left:14px;color:#666;}
.list1 > li:after {content:"";position:absolute;left:0;top:10px;width:4px;height:4px;border-radius:50px;background:#333;}
/* 리스트_2 */
.list2 > li {}
/* 리스트_3 */
.list3 > li {position:relative;padding-left:12px;color:#666;}
.list3 > li:after {content:"";position:absolute;left:0;top:11px;width:5px;height:1px;background:#777;}


/********** 버튼 **********/
/* 기본 */
button {font-family:'Pretendard', Sans-serif;}
.btn_bace {display:inline-block;height:45px;line-height:45px;padding:0 40px;background:#276ce2;border-radius:5px;font-size:17px;font-weight:500;border:1px solid #276ce2;cursor:pointer;color:#fff;text-align:center; transition:all .3s;-webkit-transition:all .3s;}
.btn_bace:hover,.btn_bace:focus,.btn_bace:active {background: #0c2b5c;border:1px solid #0c2b5c;color:#fff;}

.btn_bace.small {height:35px;line-height:35px;font-size:14px;padding:0 20px;}
.btn_bace.black {background:#5a5a5a;border:1px solid #5a5a5a;}
.btn_bace.black:hover, .btn_bace.black:active, .btn_bace.black:focus {background:#3561ad;border:1px solid #3561ad;color:#fff;}

/* 선버튼 */
.btn_line {display:inline-block;height:45px;line-height:45px;padding:0 40px;background:#fff;border-radius:5px;border:1px solid #bbb;text-align:center;color:#5a5a5a;font-weight:500;font-size:17px; transition:all .3s;-webkit-transition:all .3s;}
.btn_line:hover,.btn_line:focus,.btn_line:active {border-color:#3561ad;color:#3561ad;text-decoration:none;}

.btn_line.small {height:35px;line-height:35px;font-size:14px;padding:0 20px;}
.btn_line.small.black:hover, .btn_line.small.black:focus, .btn_line.small.black:active {background:#333;border:1px solid #333;color:#fff;}

/* 반응형 */
@media only screen and (max-width:767px){
	.btn_bace, .btn_line {height:40px;line-height:40px;font-size:15px;}

	/* 관리자 */
	.btnbox.flexbox {display:block;}
	.btnbox.flexbox .flexbox {flex-wrap:wrap;}
	.btnbox.flexbox .flexbox .btn_line {width:100px;margin-bottom:5px;}
}


/* 라디오 버튼 */
.checks {position: relative;}
.checks input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.checks input[type="radio"] + label {color:#666;font-weight:500;vertical-align:middle; display: inline-block; position: relative; padding-left:25px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
.checks input[type="radio"] + label:before { content: ''; position: absolute; left: 0; top:4px; width: 20px; height: 20px; text-align: center; background: #fff; border: 1px solid #ddd; border-radius: 100%; }

.checks input[type="radio"] + label:active:before, .checks input[type="radio"]:checked + label:active:before { }
.checks input[type="radio"]:checked + label:before {  }
.checks input[type="radio"]:checked + label:after { content: ''; position: absolute; top:9px;left:5px; width: 10px; height:10px; background: #3561ad; border-radius: 100%;}

/* 체크 버튼 */
.checks {position:relative;}
.checks input[type="checkbox"] { /* 실제 체크박스는 화면에서 숨김 */ position: absolute;  width: 1px;  height: 1px;  padding: 0;  margin: -1px;  overflow: hidden;  clip:rect(0,0,0,0);  border: 0}
.checks input[type="checkbox"] + label { color:#666;font-weight:500;display: inline-block;  position: relative;  cursor: pointer;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;}
.checks input[type="checkbox"] + label:before {  /* 가짜 체크박스 */
	content: ' ';  display: inline-block;  width: 20px; height: 20px; line-height: 20px;margin:-2px 10px 0 0;  text-align: center;
	vertical-align: middle;  background:#fff;border:1px solid #ddd;}

.checks input[type="checkbox"] + label:active:before,
.checks input[type="checkbox"]:checked + label:active:before {}
.checks input[type="checkbox"]:checked + label:before {  /* 체크박스를 체크했을때 */
	content: '';background:url(/images/fs/common/check.png) no-repeat center #333;font-size:14px;border:1px solid #333;}


/********** 총게시글 수 **********/
.total_box {margin-bottom:10px;}
.total_box p {color:#222;}
.total_box p span {display:inline-block;margin-left:5px;color:#3561ad;font-weight:bold;}


/********** 페이징 **********/
.pagination_box {margin-top:20px;}
.pagination {display:flex;justify-content:center;width:100%;}
.pagination > li {display:inline-block;width:40px;height:40px;margin:1px;}
.pagination > li a {position:relative;display:block;width:100%;line-height:38px;border:1px solid #fff;transition:all .4s;-webkit-transition:all .4s;}
.pagination > li a.on,
.pagination > li a:hover {border:1px solid #ddd;}
.pagination > li.txt {font-size:0;}
.pagination > li.txt a:after {content:'';position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;display:inline-block;width:40px;height:40px;opacity: .3;}
.pagination > li.txt a:hover:after {opacity: .7;}
.pagination > li.prev_first a:after {background:url(/images/fs/common/page_ico02.png) no-repeat left;}
.pagination > li.prev a:after {background:url(/images/fs/common/page_ico01.png) no-repeat left;}
.pagination > li.next_last a:after {background:url(/images/fs/common/page_ico02.png) no-repeat right;}
.pagination > li.next a:after {background:url(/images/fs/common/page_ico01.png) no-repeat right;}
/* 반응형 */
@media only screen and (max-width:767px){
	.pagination > li {width:35px;height:35px;}
	.pagination > li a {line-height:35px;}
	.pagination > li.txt a:after {width:35px;height:35px;}
}



/********** 검색 **********/
.search_box {display:inline-block;width:100%;}
.search_box .sch-board {float:right;max-width:50%;width:45%;border-bottom:2px solid #222;}
.search_box .sch-board fieldset {display:flex;}
.search_box .sch-board fieldset .sch-category {}
.search_box .sch-board fieldset .sch-category select {padding-left:10px;width:140px;line-height:50px;border:0;outline:none;}
.search_box .sch-board fieldset .sch-input {width:calc(100% - 190px);}
.search_box .sch-board fieldset .sch-input input {width:100%;line-height:50px;border:0;outline:none;background:#fff;}
.search_box .sch-board fieldset .sch-btn {width:50px;height:50px;}
.search_box .sch-board fieldset .sch-btn input {display:block;height:100%;line-height:50px;background:url(/images/fs/common/search_ico.png) no-repeat center;font-size:0;width:50px;outline:none;border:0;}
/* 반응형 */
@media only screen and (max-width:767px){
	.search_box .sch-board {float:none;margin:auto;width:90%;max-width:unset;}
}

/********** 테이블 **********/
caption {visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0}/* position:absolute; 사용시 아이폰 테이블 사이즈 조절안됨 */
table td a.board-title {display:block;width:100%;text-align: left;font-weight:500;color:#000;font-size:16px;}
table td a.board-title:hover {text-decoration: underline;}
table td a.board-title .secret {display:inline-block;position:relative;top:3px;width:15px;height:16px;margin-right:5px;background:url(/images/fs/common/ico_secret.png) no-repeat center;}
table td.num {padding:15px 10px;}
table td.num span.notice {display:inline-block;padding:0 7px;border:1px solid #222;color:#fff;background:#333;font-weight:600;font-size:13px;line-height:20px;border-radius:3px;}
table td.file span {font-size:0;display:inline-block;background:url(/images/fs/common/ico_file.png) no-repeat;width:20px;height:15px;}

.tableA {width:100%;border-bottom:1px solid #ddd;border-top:2px solid #222;word-break:normal;/* text-align: center; */color:#999;font-size:16px;table-layout:fixed;}
.tableA thead th {padding:15px 20px;border-bottom:1px solid #222;background:#fff;color:#090405;}
.tableA thead th:first-child {border-left:0;}
.tableA tfoot th {padding:15px 20px;background:#e8e8e2;border-top:1px solid #eee;}
.tableA tfoot td {padding:15px 20px;border-top:1px solid #eee;background:#f5f5f5;}
.tableA tbody th {padding:15px 20px;border-top:1px solid #eee;background:#f5f5f5;text-align:left;vertical-align:middle;font-weight:700;color:#222;}
.tableA tbody td {padding:15px 20px;border-top:1px solid #eee;color:#666;}
.tableA tbody tr th:first-child,
.tableA tbody tr td:first-child {border-left:0;}
.tableA tbody tr:first-child th,
.tableA tbody tr:first-child td {border-top:1px solid #fff;}
.tableA tbody tr th.bd_none,.tableA tbody tr td.bd_none,
.tableA thead tr th.bd_none,.tableA thead tr td.bd_none {border-left:0;}
.tableA tbody tr th.bd_left,.tableA tbody tr td.bd_left,
.tableA thead tr th.bd_left,.tableA thead tr td.bd_left {border-left:1px solid #cdd2d5;}

/* 게시판 */
.board_box .tableA tbody tr:hover {background:#f9f9f9;}

.select_wrap.manage select {border:none;border-bottom:1px solid #eee;margin-bottom:10px;}

/* 반응형 */
@media only screen and (max-width:767px){
	/*게시판*/
	.board_box table.responsive .num {display:none;}
	.board_box table.responsive .file {display:none;}
	.board_box table.responsive tbody tr {display:flex;}
	.board_box table.responsive tbody tr td {padding:15px 10px;border-bottom: 1px solid #eee;}
	.board_box table.responsive tbody tr td.title {width:calc(100% - 120px);}
	.board_box table.responsive tbody tr td.date {text-align:right;width:120px;}
}
/* 반응형 */
@media only screen and (max-width:560px){
	.board_view_box .btnarea a {width:32%;padding:0;}
}

/* 반응형테이블 */
@media screen and (max-width:1023px){
	table.responsive {border-top:#a6a6a6 solid 1px;}
	table.responsive thead {display:none;}
	table.responsive colgroup {display:none;}
	table.responsive tbody tr {display:block; position:relative; border-bottom:1px solid #d9d9d9;padding:12px 0;}
	table.responsive tbody tr:after {content:"."; display:block; clear:both; visibility:hidden; height:0;}
	table.responsive tbody tr:nth-child(odd) {background:var(--lay-bg-th);}
	table.responsive tbody td {display:flex;padding:5px 0; border:none; background-color:transparent; box-sizing:border-box;text-align:left !important;line-height:24px;width: 95%;}
	table.responsive tbody td p {width:calc(100% - 70px);display:block;}
	table.responsive tbody th {display:block; padding:5px 0; border:none; background-color:transparent; text-align:left; vertical-align:middle;line-height:24px;}
	table.responsive tbody tr:first-child td, table.responsive tbody tr:first-child th {border-top:none;}
	table.responsive > tbody > th:before, table.responsive > tbody td:before {background:#f1f1f1;padding:0 5px;flex-shrink:0;margin-right:10px;width:100px;font-size:13px;line-height:24px;font-weight:500;color:#000;content:attr(data-content)''; display:inline;text-align: center;}/* thead의 내용을 tbody의 th, td에 각각 삽입 */
	.board_box .tableA tbody tr td .committee {width:auto !important;font-size:12px !important;display:table !important;}

	table.responsive tfoot {display:block;}
	table.responsive tfoot tr {display:block; position:relative; border-bottom:1px solid #d9d9d9;}
	table.responsive tfoot tr:after {content:"."; display:block; clear:both; visibility:hidden; height:0;}
	table.responsive tfoot tr:nth-child(odd) {background:#e8fff3;}
	table.responsive tfoot td {display:block; padding:5px 3%; border:none; background-color:transparent; text-align:left; box-sizing:border-box;}
	table.responsive tfoot th {display:block; padding:5px 3%; border:none; background-color:transparent; text-align:left; vertical-align:middle;}
	table.responsive tfoot tr:first-child td, table.responsive tfoot tr:first-child th {border-top:none;}
	table.responsive tfoot th:before, table.responsive tfoot td:before {content:attr(data-content)' : '; display:inline;}/* thead의 내용을 tbody의 th, td에 각각 삽입 */

	table.responsive tbody tr th.bd_left,table.responsive tbody tr td.bd_left,
	table.responsive thead tr th.bd_left,table.responsive thead tr td.bd_left {border-left:0;}

	table.responsive .checks > input[type="checkbox"] ~ span {padding:0;}
}
@media only screen and (max-width:499px){
	table.responsive tbody th {min-height: auto;}
	table.responsive tbody td {min-height: auto;}
}


/********** 인풋스타일 **********/
textarea::placeholder,
input::placeholder,
select::placeholder {color:#bbb;}

.input_style {border:1px solid #dfdfdf;height:45px;line-height:45px;padding:0 20px;font-size:16px;outline: none;}
.input_style:focus {border:1px solid #333;}
.select_style {position:relative;height:45px;line-height:45px;padding:0 0 0 20px;background:url(/images/fs/common/select_ico.gif) no-repeat right 50%;border:1px solid #dfdfdf;border-radius:0px;font-family:inherit;font-size:16px;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline: none;}
.select_style::-ms-expand {display:none;}
.textarea_style {border:1px solid #dfdfdf;padding:20px;letter-spacing:1px;word-break:break-all;font-size:16px;font-family:"Spoqa Han Sans",sans-serif;color:#222;outline: none;resize: none;}
.textarea_style:focus {border:1px solid #333;}
.file_style {border:1px solid #dfdfdf;background:#fff;height:45px;line-height:45px;}
@media only screen and (max-width:767px){
	.input_style, .select_style {height:40px;line-height:40px;}
}


/********** 가장자리_외부(margin)_필요시 작성 **********/
/* 위 */
.mt0 {margin-top:0;}
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt12 {margin-top:12px;}
.mt15 {margin-top:15px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt60 {margin-top:60px;}
.mt80 {margin-top:80px;}
@media only screen and (max-width:767px){
	.mt40 {margin-top:30px;}
	.mt60 {margin-top:40px;}
	.mt80 {margin-top:40px;}
}
/* 우측 */
.mr5 {margin-right:5px;}
.mr20 {margin-right:20px;}
/* 좌측 */
.ml5 {margin-left:5px;}
.ml13 {margin-left:13px;}
.ml15 {margin-left:15px;}
.ml20 {margin-left:20px;}
