@charset "utf-8";

/* board ======================================================================================================*/
.board_search label{position: absolute; left: -5000px; height: 0; line-height: 0; width: 0; font-size: 0; margin: 0; padding: 0; overflow: hidden}
.board_search{/* display: inline-block; */position: relative; text-align: right; margin-bottom: 15px;}
.board_search select{width: 110px; height: 44px;}
.board_search input[type="text"]{padding:0 42px 0 10px; height: 44px; }
.board_search input[type="submit"]{font-size: 0; width :42px; height: 44px; background: url(../images/common/ico_search.png)no-repeat 50% 50%; position: absolute; top:0; right:0; cursor: pointer;}
.board_search .countWrap{position: absolute; top: 0; left: 0; line-height: 44px;}
.board_search .countWrap span{font-weight: 700; color: #00ae8e;}
@media screen and (max-width: 900px){
	.board_search{margin-bottom: 0;}
	.board_search select{width: 100%; margin-bottom: 5px;}
	.board_search input[type="text"]{width: 100%;}
	.board_search input[type="submit"]{top: 49px;}
	.board_search .countWrap{position: relative; text-align: left;}

}


/* list */
.board_list {table-layout: fixed; width: 100%; border-top: 2px solid #474b53; border-bottom: 1px solid #ddd; text-align: center; word-break: break-all }
.board_list thead th { color: #444; font-weight: bold }
/*.board_list a:hover { text-decoration: underline !important }*/
.board_list tbody tr:hover{background: #f5fcfb;}
.board_list th { padding: 13px 2px; position: relative; color: #000; font-weight: 700 }
.board_list th:first-child:before { display: none }
.board_list td { padding: 15px 5px; border-top: 1px solid #ddd; text-align: center;/*vertical-align: top*/}
.board_list tbody td.cell_notice{color: #dd3900;}
.board_list tbody td.cell_type{text-align: left;}

.gallery_list{border-top: 2px solid #333; border-bottom: 1px solid #f1f1f1; padding-top: 40px;}
.gallery_list ul{font-size: 0;}
.gallery_list li{display: inline-block; width: 25%; padding: 0 20px; box-sizing: border-box; margin-bottom: 60px;}
.gallery_list li .thum{position: relative; width: 100%; height: 0; padding-bottom: 56.25%; border: 1px solid #eaeaea; box-sizing: border-box;}
.gallery_list li .thum a{display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.gallery_list li .thum a img{width: 100%; height: 100% !important;}
.gallery_list li .tit{font-size: 17px; line-height: 1em; color: #333; margin: 20px 0 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.gallery_list li .date{font-size: 15px; line-height: 1em; color: #666;}
@media screen and (max-width:900px) {
	.board_list col, .board_list colgroup, .board_list table, .board_list tbody, .board_list td, .board_list th, .board_list thead, .board_list tr { display: block }
	.board_list thead { display: none }
	.board_list tbody { text-align: left }
	.board_list tbody tr { border-top: 1px solid #ddd; display: flex; /*flex-wrap: wrap;*/ padding: 10px 0 }
	.board_list tbody tr:first-child { border-top: 0 }
	.board_list tbody td { text-align: left; border: none; padding: 5px 10px }
	.board_list tbody td.cell_type{width: 100%;}
	.board_list tbody td.file,.board_list tbody td.writer,.board_list tbody td.hit{display: none;}

	.gallery_list li{width: 50%;}
}
@media screen and (max-width: 768px){
	.gallery_list{padding-top: 20px;}
	.gallery_list li{margin-bottom: 30px; padding: 0 10px;}
}

.paging{position:relative;text-align:center;margin:50px auto 0;font-size:0;}
.paging *{vertical-align:middle;}
.paging ul{display:inline-block;margin:0 30px;font-size:0;}
.paging li{display:inline-block;}
.paging li~li{margin-left:10px}
.paging li a,.paging li strong{position:relative;display:inline-block;width:34px;height:34px;line-height:34px; font-size:17px;text-align:center;color:#666;box-sizing:border-box}
.paging li strong a,.paging ul li strong{color:#000; position: relative;}
.paging li strong a:after,.paging ul li strong:after{content:''; width: 50%; height: 1px; background: #666; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.paging .prev,.paging .next,.paging .first,.paging .last{display:inline-block;width:34px;height:34px;font-size:0;text-indent:-5000px;border:1px solid #e2e2e2;}
.paging .prev{margin-left:-1px;background:url(../images/common/btn_pre.png) no-repeat 50% 50%;}
.paging .next{background:url(../images/common/btn_nxt.png) no-repeat 50% 50%; margin-right: -1px;}
.paging .first{margin-right:5px;background:url(../images/common/btn_first.png) no-repeat 50% 50%;}
.paging .last{margin-left:5px;background:url(../images/common/btn_last.png) no-repeat 50% 50%;}
@media screen and (max-width:900px) {
	.paging ul{margin: 0 5px}
	.paging li~li{margin-left: 5px;}
	.paging li a, .paging li strong{width: 20px; height: 20px; line-height: 20px; font-size: 16px;}
	.paging .prev, .paging .next, .paging .first, .paging .last{width: 20px; height: 20px;}
}
@media screen and (max-width: 768px) {
	.paging{margin: 25px auto 0;}
}


/* view */
.board_view { width: 100%; border-bottom: solid 1px #cdcdcd; border-top: 2px solid #333; }
.board_view h3{font-size: 28px !important; color: #000 !important; padding: 30px 20px !important; margin: 0 !important; text-align: left !important;}
.board_view h3:after{content: none !important;}
.board_view tr:first-child td, .board_view tr:first-child th { border-top: solid 1px #f1f1f1;  }
.board_view tr:last-child td, .board_view tr:last-child th{border-top: solid 1px #f1f1f1;border-bottom: solid 1px #cdcdcd;}
.board_view td, .board_view th { padding: 10px 8px; vertical-align: top; border-top: solid 1px #ddd; }
.board_view th { color: #666; text-align: left;}
.board_view td.part ul li~li{margin-top: 5px;}
/*.board_view td .board-box { min-height: 150px; padding: 10px }
.board_view td .board-box img { max-width: 100% }*/
.board_view .memo{padding: 50px 40px; box-sizing: border-box;}
.board_view .memo .video,.board_view .memo .video video{max-width: 900px; width: 100%;}
.board_view .memo .video > div{position: relative; width: 100%; height: 0; padding-bottom: 56.25%;}
.board_view .memo .video > div > iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block;}



/*.board_view .tit_box { border-bottom: 1px solid #ddd }
.board_view .tit_box p.tit { float: left }
.board_view .tit_box p.tit .type_t { display: inline-block; vertical-align: middle; font-size: 13px; color: #fff; font-weight: 400; background: #666; letter-spacing: -0.8px; padding: 0 5px; height: 25px; line-height: 23px; box-sizing: border-box; margin-right: 10px }
.board_view .tit_box p.tbl_detail_span { float: right }
.board_view .tit_box p.tbl_detail_span span:first-child:before { display: none }
.board_view .tit_box p.tbl_detail_span span:before { display: inline-block; overflow: hidden; width: 1px; height: 10px; margin: -1px 7px 0 4px; background: #bbb; content: ""; vertical-align: middle }*/

/*.board_view{position:relative;border-top:2px solid #000;    border-bottom: 1px solid #000;}
.board_view>h4{font-size:28px;color:#000; border-bottom: 1px solid #f1f1f1; padding: 20px 0 20px 20px;}
.board_view .subTableWrap ul{border-bottom: 1px solid #dbdee1; font-size: 0;}
.board_view .subTableWrap ul li{font-size: 15px; color: #666; line-height: 50px;display: inline-block; padding:0 20px; background: url(../images/common/bg_gubun.jpg) no-repeat 100% 50%; }
.board_view .subTableWrap ul li:last-child{ background: 0;}
.board_view .subTableWrap ul li span{color: #000; padding-left: 5px;}
.board_view .subTableWrap .fileWrap{ padding:20px; font-size: 15px;}
.board_view .subTableWrap .fileWrap .tit{vertical-align: top; color: #000;}
.board_view .subTableWrap .fileWrap .file{display: inline-block; margin-left: 20px;}
.board_view .subTableWrap .fileWrap .file a{display: block;color: #666;font-weight: 300;}*/

@media screen and (max-width:900px) {
	.board_view h3{padding: 15px 10px !important; word-break: break-all;}
	.board_view > table > colgroup,.board_view > table > tbody,.board_view > table > tbody > tr{display: block; width: 100%;}	
	.board_view > table > tbody > tr > th:nth-child(5),.board_view > table > tbody > tr > td:nth-child(6){display: none;}
/*	.board_view > table > tbody > tr:first-child{display: flex;}
	.board_view > table > tbody > tr > td, .board_view > table > tbody > tr > th{width: 100%;}	*/
	.board_view > table > tbody > tr{display: table; width: 100%;}
	.board_view > table > tbody > tr th,.board_view > table > tbody > tr td{width: 20%; display: table-cell;}
	.board_view > table > tbody > tr td{width: 30%;}
	.board_view > table > tbody > tr:nth-child(2) th,.board_view > table > tbody > tr:nth-child(2) td{width: 25%;}
	.board_view > table > tbody > tr:nth-child(2) td{width: 75%;}
	.board_view .memo{padding: 25px 20px; overflow-x: auto;}
	.board_view .memo table{width: auto;}

}
@media screen and (max-width: 768px) {
	.board_view h3{font-size: 22px !important;}
}



/* write */

.board_write{table-layout:fixed;width:100%;border-collapse:collapse;border-top:1px solid #222;margin:0}
.board_write *{vertical-align:middle}
.board_write tr:first-child th,table.board_write tr:first-child td{border-top:0}
.board_write th{width:220px;border-bottom:1px solid #e1e1e1; text-align:left;color:#444;padding:15px 10px 15px 25px}
.board_write th span{display:block;margin-top:12px;   }
.board_write th strong{position:relative;top:3px;margin-right:5px;color:#007766;}
.board_write td{height:40px;line-height:20px;vertical-align:middle;border-bottom:1px solid #e1e1e1;background:#fff;padding:15px 20px 15px 0}
.board_write input[type=text],.board_write input[type=file]{width:100%;}
.board_write input[type=tel]{width:100%;font-family:'arial';}
.board_write select{width:100%; max-width: 300px;}
.board_write textarea{overflow-y:auto;width:100%;height:345px;}
.board_write strong{vertical-align:top;}
.board_write .txt{font-size:14px;line-height:26px;color:#444}

@media screen and (max-width:900px) {
	.board_write tr{display:block;}
	.board_write th{display:block;width:auto;padding-left:0;border-bottom:0;font-weight: 500;}
	.board_write td{display:block;height:auto;padding-left:0;padding-right:0;padding-top:0}
	.board_write textarea{height:220px;}
	.board_write select{width: 100%; max-width: : none;}
	.board_write select.two{width: calc(50% - 5px);max-width: none;}
	.board_write select.two~.two{margin-left: 5px}

	.board_write select.three{width: calc(100% / 3 - 2px);max-width: none;}

}

/* file upload */
.filebox{position:relative;padding-right:120px;}
.filebox input[type="file"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.filebox label{position:absolute;top:0;right:0;display:inline-block;width:108px;height:38px;line-height:38px;text-align:center;color:#222;border:1px solid #222;}
.filebox .upload_name{display:block;width:100%;height:40px;line-height:40px;padding-left:10px;border:1px solid #c2c2c2;background:#fff;box-sizing:border-box;color:#c2c2c2;}

/* ÄÚ¸àÆ® ¿µ¿ª */
.reple_write { margin-top: 60px; }
.reple_write h3 span { margin-left: 10px; }
.reple_write .wrt .link_lgoin { font-size: .875em; line-height: 60px; position: relative; display: block; width: 100%; height: 60px; margin-top: 10px; padding-left: 45px; vertical-align: middle; border: 1px solid #c0c0c0; }
.reple_write .wrt .link_lgoin i { font-size: 2em; position: absolute; top: 15px; left: 15px; color: #b2b2b2; }
.reple_write .wrt ul { width: 100%; margin: 10px 0; }
.reple_write .wrt ul li { position: relative; display: inline-block; }
.reple_write .wrt ul li label { font-size: .875em; position: absolute; top: 10px; left: 15px; color: #b2b2b2; }
.reple_write .wrt ul li input { font-size: 1em; height: 40px; border: 1px solid #ccc; }
.reple_write .wrt .comment { position: relative; margin-top: 10px; padding-right: 85px; }
.reple_write .wrt .comment textarea {width:100%; font-size: 12px; overflow: auto; height: 80px; resize: vertical; }
.reple_write .wrt .comment button { font-size: 16px; font-weight: 500; position: absolute; top: 0; right: 0; width: 80px; height: 80px;color: #fff !important; background: #00ae8e; }
.reple_write .reple_view { margin-top: 30px; }
.reple_write .reple_view li div { position: relative; }
.reple_write .reple_view li ~ li { margin-top: 20px; padding-top: 20px; border-top: 1px dashed #ddd; }
.reple_write .reple_view span { display: inline-block; }
.reple_write .reple_view .name { font-size: 16px; font-weight: 500; margin-right: 20px; color: #37c; }
.reple_write .reple_view .date { font-family: sans-serif; font-size: 13px; margin-right: 20px; padding-top: 2px; color: #999; }
.reple_write .reple_view .btn { position: absolute; top: -3px; right: 0; }
.reple_write .reple_view .btn button { font-size: 11px; padding: 3px 6px 2px; color: #000; border: 1px solid #ccc; background: #fafafa; }
.reple_write .reple_view .btn button:hover { background: #ccc; }
.reple_write .reple_view  .memo { font-size: 14px; line-height: 1.5; clear: both; margin-top: 8px; letter-spacing: -1px; }
