/***********************************************************************************
* Copyright (C)RFLOGIX since 2010.08.24 (rflogix@rflogix.com)
************************************************************************************
* ● 프로젝트	: AGM-모바일
* ○ 파일		: board.css
* ○ 생성		: 2017.06.29(수요일)
* ○ 최종변경	: 2017.06.29(수요일)
***********************************************************************************/




/***********************************************************************************
* 게시판 제목
***********************************************************************************/

.title_wrap {border-bottom:1px solid #1d1d1d; padding-bottom:10px; text-transform:uppercase; font-family:"Roboto"; font-size:25px; color:white; font-weight:300;}
.title_wrap span {font-size:13px; color:#666; font-weight:300;}




/***********************************************************************************
* 게시판 리스트
***********************************************************************************/

.board_list_wrap {overflow:hidden; padding-top:10px;}

.board_list_wrap .no-item {height:50px; padding-top:30px; font-size:20px; text-align:center; color:#636363; display:flex; align-items:center; justify-content:center;}

.board_list {overflow:hidden; border-bottom:1px solid #1d1d1d; padding:10px 0 10px 0; cursor:pointer;}
.board_list .board_title {height:20px; line-height:20px; font-size:15px; text-align:left; color:white; font-weight:100; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}
.board_list .board_info {height:20px; line-height:20px; font-family:"Roboto"; font-size:13px; text-align:left; color:#666; font-weight:300; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}
.board_list .board_info span {font-size:13px; color:#bd824e;}

/* FAQ */
.board_list_wrap .tab.faq {overflow:hidden;}

.board_list_wrap .tab.faq>div {width:calc((100% - 4px) / 3); height:30px; line-height:30px; border-top:1px solid #666; border-left:1px solid #666; text-align:center; font-size:13px; font-weight:normal; color:#636363; cursor:pointer; transition:all 0.5s ease; float:left; overflow:hidden;}
.board_list_wrap .tab.faq>div:nth-child(3n) {border-right:1px solid #666;}
.board_list_wrap .tab.faq>div:nth-child(4) {border-bottom:1px solid #666;}
.board_list_wrap .tab.faq>div:nth-child(5) {border-bottom:1px solid #666;}
.board_list_wrap .tab.faq>div:nth-child(6) {border-bottom:1px solid #666;}
.board_list_wrap .tab.faq>div.select {color:#fefefe; background:#bd824e;}

.board_list_wrap .faq_list_wrap {padding-top:10px; padding-bottom:50px;}

.board_list_wrap .title.faq {height:0px; border-bottom:0px; overflow:hidden;}
.board_list_wrap .title.faq.select {height:40px; border-bottom:1px solid #1d1d1d;}
.board_list_wrap .title.faq .write_type {width:70px; height:40px; line-height:1em; float:left; display:flex; align-items:center; justify-content:center;}
.board_list_wrap .title.faq .write_type span {width:68px; height:20px; line-height:18px; text-align:center; font-size:10px; font-weight:normal; border:1px solid #bd824e; color:#bd824e; display:inline-block;}
.board_list_wrap .title.faq .board_title {width:calc(100% - 70px); height:40px; line-height:40px; font-size:14px; font-weight:normal; color:#fefefe; float:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}


.board_list_wrap .board_edit_wrap {width:100%; height:100%}
.board_list_wrap .board_edit_wrap .btn_b_wrap 	{width:40%; text-align:center; margin:0 auto;}
.board_list_wrap .board_edit_wrap .btn_b		{width:40%; color:#666; padding:5px 0; border:1px solid #61442b; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.3s;float:left;margin-bottom:30px;float:left;}
.board_list_wrap .board_edit_wrap .btn_b:hover 	{background-color:#61442b; color:white;}
.board_list_wrap .board_edit_wrap .btn_b.delete {margin-left:10px;}


/* 문의하기 버튼 */
.btn_wrap {height:56px; padding-top:50px; padding-bottom:50px; display:flex; align-items:center; justify-content:center;}
.btn_insert {width:40%; height:50px; background:#000; font-size:18px; font-weight:400; color:#bd824e; cursor:pointer; display:flex; align-items:center; justify-content:center;}


/* 댓글 관련 */
.comment_list_wrap {width:100%}

.reply_list {margin:50px 0 50px 10%; width:70%; background:#0c0c0c;} /* padding:10px 5px 10px 5px; border:1px solid #61442b;*/
.comment_list_wrap .commentRow {width:100%; height:auto; border-top:1px solid #61442b; clear:both; overflow:hidden; float:left}
.comment_list_wrap .commentRow .col1st {width:50%; float:left; display: table; padding:15px 0px;}
.comment_list_wrap .commentRow .col1st .NameIp {display: table-cell; vertical-align:middle;}
.comment_list_wrap .commentRow .col3rd	{width:50%; height:auto; float:left; padding:15px 0px; text-align:right;}
.comment_list_wrap .commentRow .col2nd	{width:100%; height:auto; float:left; padding:0 0 15px 0;}
.comment_list_wrap .commentRow .col2nd a {color:#666}

.comment_list_wrap .comment_edit_wrap {width:100%; height:100%}
.comment_list_wrap .comment_edit_wrap .btn_c_wrap 	{width:40%; text-align:center; margin:0 auto;}
.comment_list_wrap .comment_edit_wrap .btn_c		{width:40%; color:#666; padding:5px 0; border:1px solid #61442b; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.3s;float:left;margin-bottom:30px;float:left;}
.comment_list_wrap .comment_edit_wrap .btn_c:hover 	{background-color:#61442b; color:white;}
.comment_list_wrap .comment_edit_wrap .btn_c.delete {margin-left:10px;}

.comment_list_wrap .comment_edit_wrap .btn_cu_wrap 	 {width:40%; text-align:center; margin:0 auto;display:none;}
.comment_list_wrap .comment_edit_wrap .btn_cu		 {width:40%; color:#666; padding:5px 0; border:1px solid #61442b; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.3s;float:left;margin-bottom:30px;float:left;}
.comment_list_wrap .comment_edit_wrap .btn_cu:hover  {background-color:#61442b; color:white;}
.comment_list_wrap .comment_edit_wrap .btn_cu.cancel {margin-left:10px;}


.comment_add_wrap {width:100%; margin:0 auto; margin-top:20px; padding-bottom:40px; padding-top:20px; border-top:1px solid #61442b; overflow:hidden;}
.comment_add_wrap .btn_add {margin-left:5px; width:80px; height:80px; line-height:80px; border:1px solid #61442b; color:#000; background-color:#61442b; cursor:pointer; }
.comment_add_wrap .btn_add:focus {color:#fff; border:1px solid #8a7b6f;}
.comment_add_wrap .btn_add:hover {color:#fff; border:1px solid #8a7b6f;}


/***********************************************************************************
* 이미지 업로드 관련
***********************************************************************************/

.board_img					{width:calc(177px - 10px); height:calc(177px - 10px); border:1px solid #61442b; padding:4px; margin:10px; overflow:hidden; position:relative}
.board_img.dragover			{border:5px dotted #61442b; padding:0;}
.board_img.loading			{background:url(../image/common/loading.gif) center center no-repeat;}
.board_img.upload			{background:url();}

.board_img .delete			{width:17px; height:17px; right:5px; top:5px; position:absolute; z-index:1; cursor:pointer; background:url(../image/common/btn_close_17x17.png) no-repeat; background-color:#999; display:inline-block; transition:background-color 0.3s;}
.board_img .delete:hover	{background-color:#00c2c7;}
.board_img .upload			{width:90px; height:32px; left:calc(50% - 45px); bottom:10px; position:absolute; z-index:1; cursor:pointer; background:url(../image/common/btn_img_upload.png) 0 -32px no-repeat; display:inline-block; transition:background-color 0.3s;}
.board_img .upload:hover	{background:url(../image/common/btn_img_upload.png) 0 0 no-repeat;}

.board_img img				{width:100%; top:0; left:0; position:absolute; z-index:-1; background-size:contain; background-position:center; background-repeat:no-repeat; opacity:0; transition:opacity 0.3s;}
.board_img img.show			{opacity:1;}
.board_img input[type='file']	{display:none;}