/***********************************************************************************
* Copyright (C)RFLOGIX since 2010.08.24 (rflogix@rflogix.com)
************************************************************************************
* ● 프로젝트	: 크로닉
* ○ 파일명		: board.css
************************************************************************************/




/***********************************************************************************
* 4번째 탭 - 커뮤니티
***********************************************************************************/

.page_community .tab_wrap {width:100%; height:52px; z-index:2;}
.page_community .tab_wrap .tab {width:100%; height:100%; color:#7d7d7d; font-size:14px; background-image:linear-gradient(0deg,#E6E6E6 1px,hsla(0,0%,82%,0) 0); transition:background 0.2s;}
.page_community .tab_wrap .tab.active {color:#333340; font-weight:bold; background-image:linear-gradient(0deg,#333340 2.5px,rgba(156,39,176,0) 0); background-size:100% 100%,100% 100%;}

.page_community .content {height:calc(100% - 105px); overflow-y:auto; overflow-x:hidden; z-index:1;  -ms-overflow-style: none;}
.page_community .content::-webkit-scrollbar{ display:none; }

.page_community .board_wrap {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1); border-bottom: 5px solid #f6f6f6; background-color: #ffffff; z-index:2}
.page_community .board_wrap .board_header{border-bottom: 1px solid #ebeaea; padding-bottom: 10px; padding: 15.6px 20px 16px 20px; }
.page_community .board_wrap .board_header.comment{border-bottom: 1px solid #ebeaea; padding-bottom: 10px; padding: 15.6px 20px 16px 20px; }
.page_community .board_wrap .board_bottom{border-top: 1px solid #ebeaea; display:flex; color:#8f8f8f; padding:10px;}

.page_community .board_wrap .content {min-height:40px; margin:0 0 35px 0; line-height:20px; font-size:14px; color:#333340;max-height: 4800px;}

.page_community .board_wrap .ProfileURL {width:38.8px; height:38.8px; background-image:url('../image/board/ico_user.png');}
.page_community .board_wrap .UserNM {margin-left:17.6px; font-size:14px; color:#4b4b4b;}
.page_community .board_wrap .WriteDT {flex:1; margin-left:23px; font-size:11px; color:#b1b1b1;}
.page_community .board_wrap .btn_more {width:30px; height:38.8px; background-size:auto 18px; background-position:center right; background-image:url('../image/board/ico_more.png');}

.page_community .board_wrap .tag_wrap {flex:1; overflow-y:hidden; overflow-x:auto;}
.page_community .board_wrap .btn {width:26px; height:26px; margin:0 3px 0 7px;}
.page_community .board_wrap .btn.like {background-image:url('../image/board/ico_like.png');}
.page_community .board_wrap .btn.comment {background-image:url('../image/board/ico_comment.png');}
.page_community .board_wrap .btn.share {background-image:url('../image/board/ico_share.png');}

.page_community .board_wrap .text_content{ font-size: 16px;}

.page_community .comment_wrap {width:calc(100% - 40px); margin-left:40px;}
.page_community .comment_wrap .ProfileURL {width:30.8px; height:30.8px; background-image:url('../image/board/ico_user.png');}
.page_community .comment_wrap .UserNM {margin-left:17.6px; font-size:14px; color:#4b4b4b;}
.page_community .comment_wrap .WriteDT {flex:1; margin-left:23px; font-size:11px; color:#b1b1b1;}

.page_community .qna_comment_wrap {display: flex;justify-content: space-between;padding: 15.6px 20px 16px 20px;}
.page_community .qna_comment_wrap .ProfileURL {width:30.8px; height:30.8px; background-image:url('../image/board/ico_user.png');}
.page_community .qna_comment_wrap .UserNM {margin-left:17.6px; font-size:14px; color:#4b4b4b;}
.page_community .qna_comment_wrap .WriteDT {flex:1; margin-left:23px; font-size:11px; color:#b1b1b1;}

.page_community .tag {color: #3f729b; display:inline;}

.page_community .btn_write {width:80px; height:80px; right:20px; bottom:150px; position:fixed; z-index:2; background-image:url('../image/board/btn_write.png');}
.page_community .CommentHTML{height: 80px; font-size: 13px; overflow:scroll}

.page_community .reply_insert_container{width: 93%; margin: 0 auto; border-radius: 8px; padding: 5px; display: flex;}
.page_community .reply_insert_container .CommentHTML{margin: 0 auto; width: 85%; align-items: center; border-radius: 5px; height: 30px;}
.page_community .reply_insert_container .reply_insert_btn_container{width: 15%; display: flex; align-items: center;}
.page_community .reply_insert_container .reply_insert_btn_container .reply_insert_button{width: 100%; float: right; height: 30px; color: #c4c4c4; font-family: SpoqaHanSansB; font-weight: 700; font-size: 12px;}

.popup_board {width:87%; height:100%; padding:0 6.5%; position:absolute; justify-content:center; background-color:rgba(0,0,0,0.8);}
.popup_board .content_wrap {width:100%; height:90%; position:relative; background:white; border-radius:10px; overflow:hidden;}
.popup_board .content_wrap > .title {width:calc(100% - 60px); height:55px; margin:0 30px 0 30px; font-size:18px; font-weight:bold; color:#333340;}
.popup_board .content_wrap > .btn_close {width:auto; height:55px; padding:0 30px; right:0; top:0; position:absolute; color:#333340; font-size:30px;}
.popup_board .content_wrap > .content {width:100%; height:calc(100% - 123px);  font-size:18px; color:#333340; overflow-x:hidden; overflow-y:auto;}
.popup_board .content_html {width:calc(100% - 40px); height:calc(100% - 330px);; padding:20px; font-size:14px; font-family: 'Noto Sans KR', sans-serif;}
.popup_board .btn_wrap {width:100%; height:68px; position: absolute; bottom: 0;}
.popup_board .btn_wrap .btn_close {width:50%; height:100%; font-size:18px; color:white; background-color:#444445;}
.popup_board .btn_wrap .btn_save {width:50%; height:100%; font-size:18px; color:white; background-color:#79d2de;}
.popup_board .comment_wrap {width:calc(100% - 40px); margin-left:40px;}
.popup_board .community_preview_img{display: flex; justify-content: center; height:200px;}
.popup_board .community_upload_img{height: 100%;width: auto;}
.popup_board .community_img_box{display:flex; align-items:center;}
.popup_board .prev_img_array{margin-top: 10px;display:flex;flex-direction:row;text-align: center; width: 100%;justify-content: center;}
.popup_board .prev_img_container{height: 30px;max-width: 30px;margin-left: 5px; position: relative;}
.popup_board .prev_img{	height: 100%;}

.popup_board_QNA {width:87%; height:100%; padding:0 6.5%; position:absolute; justify-content:center; background-color:rgba(0,0,0,0.8);}
.popup_board_QNA .content_wrap {width:100%; height:90%; position:relative; background:white; border-radius:10px; overflow:hidden;}
.popup_board_QNA .content_wrap > .title {width:calc(100% - 60px); height:55px; margin:0 30px 0 30px; font-size:18px; font-weight:bold; color:#333340;}
.popup_board_QNA .content_wrap > .btn_close {width:auto; height:55px; padding:0 30px; right:0; top:0; position:absolute; color:#333340; font-size:30px;}
.popup_board_QNA .content_wrap > .content {width:100%; height:calc(100% - 123px); font-size:18px; color:#333340; overflow-x:hidden; overflow-y:auto;}
.popup_board_QNA .content_html {width:calc(100% - 40px); height:calc(100% - 105px);; padding:20px; font-size:14px; font-family: 'Noto Sans KR', sans-serif;}
.popup_board_QNA .btn_wrap {width:100%; height:68px; position: absolute; bottom: 0;}
.popup_board_QNA .btn_wrap .btn_close {width:50%; height:100%; font-size:18px; color:white; background-color:#444445;}
.popup_board_QNA .btn_wrap .btn_save {width:50%; height:100%; font-size:18px; color:white; background-color:#79d2de;}
.popup_board_QNA .comment_wrap {width:calc(100% - 40px); margin-left:40px;}
.popup_board_QNA .community_preview_img{display: flex; justify-content: center; height:200px;}
.popup_board_QNA .community_upload_img{height: 100%;width: auto;}
.popup_board_QNA .community_img_box{display:flex; align-items:center;}
.popup_board_QNA .prev_img_array{margin-top: 10px;display:flex;flex-direction:row;text-align: center; width: 100%;justify-content: center;}
.popup_board_QNA .prev_img_container{height: 30px;max-width: 30px;margin-left: 5px; position: relative;}
.popup_board_QNA .prev_img{	height: 100%;}
.que:first-child{
}
  
.que{
  	position: relative;
  	padding: 17px 0;
  	cursor: pointer;
  	font-size: 14px;
  	border-bottom: 1px solid #dddddd;
}
  
.que::before{
  	display: inline-block;
  	font-size: 14px;
  	color: #006633;
  	margin-right: 5px;
}

.que.on>span{
  	font-weight: bold;
  	color: #006633; 
}
  
.anw {
  	display: none;
    overflow: hidden;
  	font-size: 14px;
  	padding: 27px 0;
}
  
.anw::before {
  	display: inline-block;
  	font-size: 14px;
  	font-weight: bold;
  	color: #666;
  	margin-right: 5px;
}



.page_community .CommentHTML{
	user-select: text;
	-webkit-user-select: text;
}
.popup_board .CommentHTML{
	user-select: text;
	-webkit-user-select: text;
}

.board_wrap .community_preview_img{
	height: 375px;
}

.board_wrap .community_upload_img{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
}

.board_wrap .community_img_box{
	display:flex; 
	align-items:center;
}

.board_wrap .prev_img_array{
	margin-top: 10px;
	display:flex;
	flex-direction:row;
	text-align: center;
    width: 100%;
    justify-content: center;
}

.board_wrap .prev_img_container{
	height: 30px;
	max-width: 30px;
	margin-left: 5px;
    position: relative;
}

.board_wrap .prev_img{
	height: 100%;
}

.board_wrap .text_content{
	padding:15px;
	display: inline-block; 
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis;  
	white-space: normal;
	line-height: 1.2; 
}
.board_wrap .text_content.hidden{
	max-height: 45px;
}

.board_wrap .more_view_btn{display:none;white-space:nowrap;}

.board_wrap .more_menu_container{
	list-style:none;
	padding-left:0px;
	position: absolute;
    right: 10px;
    top: 50px;
    z-index: 3;
    background-color: white;
    padding: 0;
    border: 1px solid #ebeaea;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding:5px;
}
.board_wrap .more_menu_container li{
	margin:7px;	
}




.board_wrap .board_swiper .swiper-pagination-bullet {
    background: #79D2DE;
}



































.popup_boardtype {width:calc(100% - 30px); height:100%; padding:0 15px; position:absolute; justify-content:center; background-color:rgba(0,0,0,0.8);}
.popup_boardtype .content_wrap {width:100%; max-height:calc(100% - 30px); background:white; border-radius:10px; overflow:hidden;}
.popup_boardtype .content_wrap > .title {width:calc(100% - 30px); height:54px; margin:13.5px 15px 0 15px; font-size:18px; font-weight:bold; color:#333340; border-bottom:1px solid #c2c2c2;}
.popup_boardtype .content_wrap > .content {width:calc(100% - 30px); height:auto; flex:1; padding:20px 15px 20px 15px; font-size:18px; color:#333340; overflow-y:auto;}
.popup_boardtype .content_wrap .btn_close {width:54px; height:54px; right:0; top:0; position:absolute;}

.popup_boardtype .board_wrap {width:calc(100% - 40px); margin:23.5px 0 31px 0; padding: 15.6px 20px 16px 20px; border-radius: 5px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff;}

.popup_boardtype .board_wrap .content {min-height:40px; margin:12.6px 0 20px 0; line-height:20px; font-size:14px; color:#333340;}

.popup_boardtype .board_wrap .ProfileURL {width:38.8px; height:38.8px; background-image:url('../image/board/ico_user.png');}
.popup_boardtype .board_wrap .UserNM {margin-left:17.6px; font-size:14px; color:#4b4b4b;}
.popup_boardtype .board_wrap .WriteDT {flex:1; margin-left:23px; font-size:11px; color:#b1b1b1;}
.popup_boardtype .board_wrap .btn_more {width:30px; height:38.8px; background-size:auto 18px; background-position:center right; background-image:url('../image/board/ico_more.png');}

.popup_boardtype .board_wrap .tag_wrap {flex:1; overflow-y:hidden; overflow-x:auto;}
.popup_boardtype .board_wrap .btn {width:26px; height:26px; margin:0 3px 0 7px;}
.popup_boardtype .board_wrap .btn.like {background-image:url('../image/board/ico_like.png');}
.popup_boardtype .board_wrap .btn.comment {background-image:url('../image/board/ico_comment.png');}
.popup_boardtype .board_wrap .btn.share {background-image:url('../image/board/ico_share.png');}

.popup_boardtype .comment_wrap {width:calc(100% - 40px); margin-left:40px;}

.popup_boardtype .btn_write {width:80px; height:80px; right:20px; bottom:20px; position:absolute; z-index:2; background-image:url('../image/board/btn_write.png'); display:none;}
.popup_boardtype .btn_write.active {display:inline-block;}
