@charset "utf-8";

.btn_cke_sc {display:none;}
/* button */
.bo_btns {float:left; width:100%; height:auto; margin-top:40px; text-align:right;}
.bo_btns button {padding:15px 40px; box-sizing:border-box; transition:all .4s ease;}
.bo_btns i {font-size:15px;}
.bt_adm {background:#fff; border:1px solid #d7d7d7;}
.bt_adm:hover {background:#eee;}
.bt_user {background:#000; color:#fff; border:1px solid #000;}
.bt_user:hover {background:#fff; color:#000;}
/* mobile */
@media screen and (max-width: 740px) {
	.bo_btns button {padding:10px 30px;}
}

/* search icon */
.ico-sch {display:block; position:relative; width:40px; height:40px;}
.ico-sch:before, .ico-sch:after {content:''; display:block; position:absolute; top:0; left:0;}
.ico-sch:before {width:12px; height:12px; border:2px #fff solid; border-radius:100%;-webkit-border-radius:100%;-moz-border-radius:100%;}
.ico-sch:after {width:2px; height:10px; background:#fff; transform:rotate(-43deg); top:11px; left:15px;}

/* download icon */
.icon {display:inline-block; position:relative; width:24px; height:24px; box-sizing:border-box;}
.ico-download1:before{content:''; height:0; width:0; display:block; border:5px transparent solid; border-top-color:#333; position:absolute; top:14px; left:6px; }
.ico-download1:after{content:''; height:6px; width:2px; display:block; background:#333; position:absolute; top:8px; left:10px; border-radius:3px 3px 0 0;}
.ico-download2:before{content:''; height:4px; width:18px; display:block; border:2px #333 solid; border-top-width:0; position:absolute; bottom:0px; left:0px; border-radius:0 0 3px 3px;}

/* reply icon */
.ico-reply {height:20px; width:32px; position:relative;}
.ico-reply:after {content:''; height:10px; width:10px; display:block; border-bottom:1px #222 solid; border-left:1px #222 solid; position:absolute; top:0; left:5px;}

/* list */
.max_bo_lst_w {width:100%; margin-top:50px;}
/* search */
.bo_sch {position:relative; float:right; width:300px; height:50px; box-sizing:border-box; padding-left:25px; background:#eee; border-radius:25px;}
.bo_sch input {height:50px; border:0; background:none; color:#000; -webkit-appearance:none; -webkit-border-radius:0;}
.bo_sch button {position:absolute; top:0; right:0; width:50px; height:50px; border-radius:100%; font-size:0; background:#000; box-sizing:border-box; padding:15px; transition:all .4s ease;}
.bo_sch button:hover {background:#444;}
/* list */
.bo_lst {float:left; width:100%; height:auto; margin-top:20px;}
.bo_lst .num {padding:0 0 20px; font-size:15px; color:#000;}
.bo_lst .notice_icon {display:inline-block; background:#000; color:#fff; font-size:12px; padding:5px 10px;}
.bo_lst table {width:100%; height:auto;}
.bo_lst table tbody tr:hover {background:#f7f7f7;}
.bo_lst thead th {border-top:2px solid #000; border-bottom:1px solid #000; padding:20px 0; text-align:center; color:#000;}
.bo_lst tbody th,
.bo_lst tbody td {border-bottom:1px solid #d7d7d7; padding:20px 0; text-align:center; position:relative;}
.bo_lst tbody td.td_subject { text-align:left; }
.bo_lst tbody td.td_num2 { text-align:center; }
.bo_lst tbody td:nth-child(2) {text-align:left;}
.bo_lst tbody .tt {text-align:left;}
.bo_lst tbody a {color:#000;}
.bo_lst tbody a:hover {text-decoration:underline;}
.bo_lst tbody i {font-size:18px;}
/* pagination */
.pagination {width:100%; height:auto; text-align:center; margin-top:40px; display:inline-block;}
.pagination a,
.pagination strong {color:#000; padding:12px 18px; border:1px solid #d7d7d7; box-sizing:border-box; transition:all .4s ease;}
.pagination .current {background-color:#000; color:#fff; border-color:#000; font-weight:700;}
.pagination a:hover:not(.current) {background-color: #eee;}

/* mobile */
@media screen and (max-width: 740px) {
	.bo_lst .num {border-bottom:2px solid #000;}
	.bo_lst th, .bo_lst td {display:block;}
	.bo_lst tbody th {text-align:left; padding:10px 0 10px 80px; border:0;}
	.bo_lst td:before {position:absolute; top:10px; left:0; padding:0 20px; white-space:nowrap; font-weight:bold;}
	.bo_lst thead th {display:none;}
	.bo_lst tbody th:before {content:'번호'; position:absolute; top:10px; left:0; padding:0 20px; white-space:nowrap; font-weight:bold;}
	.bo_lst tbody td {text-align:left; padding:10px 0 10px 80px;}
	.bo_lst tbody td:nth-child(2), 
	.bo_lst tbody td:nth-child(3), 
	.bo_lst tbody td:nth-child(4) {border:0;}
	.bo_lst tbody td:nth-child(2):before {content:'번호';}
	.bo_lst tbody td:nth-child(3):before {content:'제목';}
	.bo_lst tbody td:nth-child(4):before {content:'조회';}
	.bo_lst tbody td:nth-child(5):before {content:'날짜';}
	/* pagination */
	.pagination a {padding:9px 15px;}
}


/* write */
.bo_wirte_w {width:100%; margin-top:50px;}
.bo_wirte {width:100%; height:auto; border-top:1px solid #000;}
.bo_wirte li {width:100%; height:auto; display:flex; align-items:center; flex-wrap:wrap; box-sizing:border-box; padding:12px 20px; border-bottom:1px solid #ccc;}
.bo_wirte li label {display:block; width:200px; max-width:100%; font-weight:700; color:#000; border-right:1px solid #eee;}
.bo_wirte li input[type=text], .bo_wirte li input[type=password] {box-sizing:border-box; padding:10px; width:80%; border:none;}
.bo_wirte li input[type=file] {box-sizing:border-box; padding:10px; width:80%; border:none;}
.bo_wirte li .wr_content {width:100%; height:300px; padding-bottom: 54px;}
/* tablet */
@media screen and (max-width: 1024px) {
	.bo_wirte li input[type=text], .bo_wirte li input[type=password], .bo_wirte li input[type=file] {width:70%;}
}
/* mobile */
@media screen and (max-width: 740px) {
	.bo_wirte li {flex-direction:column;}
	.bo_wirte li label {border-right:none; width:100%; height:auto; padding:10px 0;}
	.bo_wirte li input[type=text], .bo_wirte li input[type=password], .bo_wirte li input[type=file] {width:100%; padding:10px 0;}
}

/* view */
.max_bo_view_w {width:100%; margin-top:50px;}
/* view */
.max_bo_view_w hgroup h3 {text-align:center; font-size:35px; color:#000;}
.user_it_info {width:100%; height:auto; text-align:center; padding:25px 0; border-bottom:1px solid #000;}
.user_it_info li {display:inline-block;}
.user_it_info li:after {content:'/'; display:inline-block; color:#ccc; padding:0 10px;}

.file_box {width:100%; height:auto; box-sizing:border-box; padding:25px; border-bottom:1px solid #eee;}
.file_box p {font-weight:bold;}
.file_box ul {width:100%; height:auto; margin-top:10px;}
.file_box li {margin:5px 0;}
.file_box li span {margin-left:10px;}
.file_box li a:hover {text-decoration:underline; color:#000;}

.bo_view_cont {width:100%; height:auto; box-sizing:border-box; padding:40px 25px; line-height:1.3;}
.bo_view_cont img {max-width:100%;}

.view_lst {width:100%; height:auto; display:flex; border-top:1px solid #eee; border-bottom:1px solid #eee;}
.view_lst li {width:50%; padding:30px; display:flex; align-items:center; box-sizing:border-box; position:relative;}
.view_lst li:after {content:''; width:1px; height:30px; background:#eee; display:block; position:absolute; top:33px; right:0;}
.view_lst li:last-child {text-align:right;}
.view_lst li:last-child:after {width:0;}
.view_lst li a {display:block; width:100%; box-sizing:border-box; padding:0 10px;}
.view_lst li a:hover {text-decoration:underline;}
.view_lst li span {position:relative; display:block; overflow:hidden; width:34px; height:34px; font-size:0; transition:all .4s ease;}
.view_lst li .lst_pre:before {content:''; height:20px; width:20px; display:block; border:2px solid #333; border-right-width:0; border-bottom-width:0; transform:rotate(-45deg); position:absolute; top:7px; left:7px;}
.view_lst li .lst_nxt:before {content:''; height:20px; width:20px; display:block; border:2px solid #333; border-left-width:0; border-top-width:0; transform:rotate(-45deg); position:absolute; top:7px; left:0;}
.view_lst li .lst_nxt.mob {display:none;}
/* mobile */
@media screen and (max-width: 740px) {
	.view_lst {display:block; border-bottom:none;}
	.view_lst li {width:100%; border-bottom:1px solid #eee; padding:20px;}
	.view_lst li:after {display:none;}
	.view_lst li:last-child {text-align:left;}
	.view_lst li span {width:32px; height:18px;}
	.view_lst li .lst_pre:before {height:14px; width:14px; border-right-width:2px; border-left-width:0;}
	.view_lst li .lst_nxt:before {height:14px; width:14px; border-left-width:2px; border-right-width:0; top:-2px; left:7px;}
	.view_lst li .lst_nxt {display:none;}
	.view_lst li .lst_nxt.mob {display:block;}
}

/* comment */
.bo_comment {width:100%; height:auto; box-sizing:border-box; padding:30px; text-align:right; font-size:13px;}
.bo_comment .com_tt {display:inline-block; border-radius:50px; box-sizing:border-box; border:1px solid #d7d7d7; padding:10px 20px;}
.bo_comment .com_tt .lst_num {font-weight:700; color:#ccc;} /* 디자이너님 : 홈페이지에 맞는 색상 또는 원하는 색상으로 변경해주세요. */

.comment_lst_wrap {width:100%; height:auto; margin-top:30px;}
.comment_write {width:100%; height:auto; text-align:left; box-sizing:border-box; border:1px solid #a6a6a6; position:relative;}
 .user_info {width:100%; height:auto; border-bottom:1px solid #eee; display:inline-flex;}
 .user_info li {border-right:1px solid #eee; padding:10px 15px;}
 .user_info label {font-weight:700; color:#222;}
 .user_info input {padding:7px; border:0;}
 .write_area {display:block; width:100%; height:auto;}
 .write_area textarea {width:100%; height:100px; box-sizing:border-box; padding:10px; border:0;}
 .write_area button {box-sizing:border-box; border-left:1px solid #eee; padding:18px 20px; position:absolute; top:0; right:0; font-weight:700; background:#fff;}
 .write_area button:hover {background:#222; border-color:#000; color:#fff;} /* 디자이너님 : 홈페이지에 맞는 색상 또는 원하는 색상으로 변경해주세요. */

.comment_content {width:100%; height:auto; text-align:left; margin:20px 0;}
.comment_content .bt_prev_comm {width:100%; height:auto; border-top:1px solid #222; padding:16px 0; font-weight:700;}
.comment_content .com_lst {width:100%; height:auto; border-top:1px solid #d7d7d7;}
.comment_content .com_lst li {border-bottom:1px solid #d7d7d7; padding:20px;}
.comment_content .com_lst li:hover {background:#f5f5f5;}

.comment_box {width:100%; height:auto; overflow:hidden; position:relative;}
.comment_box .com_ico { width:auto; height:auto;}
.comment_box .fa-user {float:left; display:block; width:32px; height:32px; line-height:32px; text-align:center; border-radius:100%; background:#444; color:#fff;}
.comment_box .ico-reply {float:left; display:block;}
.comment_box .cont_info {float:left; width:auto; height:auto; padding-top:10px; margin-left:10px;}
.comment_box .cont_info strong {font-weight:700;}
.comment_box .cont_info span {color:#797979;}
.comment_box .cont_info p {padding-top:20px;}
.comment_box .comment_setting {float:left; width:100%; height:auto; margin-top:20px; text-align:right;}
.comment_box .comment_setting button {border:1px solid #d7d7d7; padding:7px 12px; box-sizing:border-box; font-size:11px;}
.comment_box .comment_setting button:hover {background:#fff;}

.cbox_reply_layer {display:none; width:100%; max-width:768px; height:auto; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); background:#fff; z-index:10;}
.cbox_reply_layer .comment_write {border:0;}
.cbox_reply_layer .comment_write .write_area textarea {height:200px;}
.bg_cbox_layer {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9; cursor:pointer;}