@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;}
	.more_btn {float:left; width:100%; height:auto; margin-top:40px; text-align:center;}
	.board_list_more {display:inline-block; padding:15px 40px; background:#000; color:#fff; border:1px solid #000;}
	.board_list_more:hover {background:#fff; color:#000;}
	/* mobile */
	@media screen and (max-width: 740px) {
		.bo_btns button,
		.board_list_more {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;}

	.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;}

	.bo_cate {float:left; width:100%; height:auto; text-align:center;}
	.bo_cate ul {width:100%; height:auto;}
	.bo_cate li {display:inline-block; margin:0 1%;}
	.bo_cate li a {display:block; width:72px; height:72px; border-radius:100%; background-repeat:no-repeat; background-position:center; font-size:0;}
	.bo_cate li .ico_social_blog {background-size:48px;}
	.bo_cate li .ico_social_instagram {background-size:100%;}
	.bo_cate li span {display:block; margin-top:10px;}

	.ico_social_blog {background-image:url("./img/ico_blog.svg"); background-color:#2db400;}
	.ico_social_instagram {background-image:url("./img/ico_instagram.svg");}
	.ico_social_facebook {background-image:url("./img/ico_facebook.svg");}

	@media screen and (max-width: 740px) {
		.bo_cate {margin-bottom:30px;}
		.bo_cate li a {width:48px; height:48px;}
		.bo_cate li .ico_social_blog {background-size:36px;}
	}

	/* list */
	.bo_lst {float:left; width:100%; height:auto; margin-top:20px;}
	.bo_lst .num {padding:0 0 10px; font-size:15px; color:#000;}
	.bo_lst ul {width:100%; height:auto; display:flex; flex-wrap:wrap; border-top:2px solid #000; border-bottom:1px solid #000;}
	.bo_lst li {width:23%; height:auto; margin:2% 1%; position:relative;}
	.bo_lst li a {display:block; width:100%; height:100%; color:#000; box-sizing:border-box; border:1px solid #d7d7d7;}
	.bo_lst li .ico_social {display:block; width:48px; height:48px; padding:0; border-radius:100%; background-repeat:no-repeat; background-position:center; background-size:100%; position:absolute; top:10px; left:10px;}
	.bo_lst li .ico_social_blog {background-size:32px;}
	.bo_lst li .im_box {display:block; width:100%; height:auto; overflow:hidden; background-color:#000; line-height:0;}
	.bo_lst li .im_box img {width:100%;}
	.bo_lst li em {display:block; line-height:1.3; /* overflow:hidden; white-space:nowrap; text-overflow:ellipsis; */ border-top:1px solid #d7d7d7; padding:30px;}
	.bo_lst li span {display:block; padding:0 30px 20px; color:#797979; font-size:14px; line-height:1.6;}
	.bo_lst li span.no_image { display: block; width: 100%; height: 0; padding-bottom: 30%; padding-top: 30%; text-align: center; box-sizing: border-box; font-size:0; background:url(../../../image/common/noimg.jpg) center no-repeat;}
	.bo_lst li .date {border-top:1px solid #eee; padding-top:20px;}
	/* hover */
	.bo_lst ul li a:hover {border-color:#c0a07b;}
	.bo_lst ul li a:hover em {color:#c0a07b;}
	.bo_lst ul li a:hover .date {border-top-color:#c0a07b;}
	.bo_lst .no_data {width:100%; text-align:center; padding:100px 0;}

	/* pagination */
	.pagination {width:100%; height:auto; text-align:center; margin-top:40px; display:inline-block;}
	.pagination a {color:#000; padding:12px 18px; border:1px solid #d7d7d7; box-sizing:border-box; transition:all .4s ease;}
	.pagination a.current {background-color:#000; color:#fff; border-color:#000; font-weight:700;}
	.pagination a:hover:not(.current) {background-color: #eee;}
	/* tablet */
	@media screen and (max-width: 1024px) {
		.bo_lst li {width:31.33%;}
	}
	/* tablet */
	@media screen and (max-width: 768px) {
		.bo_lst li {width:48%;}
	}
	/* mobile */
	@media screen and (max-width: 740px) {
		.bo_lst li {width:100%; margin:2% 0;}
		/* pagination */
		.pagination a {padding:9px 15px;}
	}


/* 쓰기 */
	/* button */
	.bo_btns {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;}
	}
	.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-size:15px; font-weight:700; color:#000; border-right:1px solid #eee;}
	.bo_wirte li label strong {font-size:13px;}
	.bo_wirte li input[type=text] {box-sizing:border-box; padding:10px; width:80%; border:none;}
	.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 select {box-sizing:border-box; padding:10px;   border:1px solid #DDD;}
	.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=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=file] {width:100%; padding:10px 0;}
	}

/* 보기 */
	/* button */
	.bo_btns {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;}
	}

	/* 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;}

	.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;}

	.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;}


	#board_list .content {height:60px;}
	@media screen and (max-width: 1200px) {
		#board_list .content {height:80px;}
	}
	@media screen and (max-width: 768px) {
		#board_list .content {height:60px;}
	}
	@media screen and (max-width: 740px) {
		#board_list .content {height:auto;}
	}