@charset "utf-8";

/* selectbox */
select { font-family:'Nanum Gothic', 'Apple SD Gothic Neo', Droidsans, AppleSDGothic, sans-serif; color:#757575; font-size:13px; margin:0 !important; vertical-align: middle; border: 1px solid #dedede;}
.select_all { margin-right: 2px;}

.select_box { position: relative; display: inline-block; height: 34px; background: #fff url(../images/bbs/bg_select.png) right center no-repeat; border: 1px solid #dedede;}
.select_box.disabled { background-color: #eee;}
.select_box label { position: absolute; font-size: 14px; color: #000; top: 10px; left: 10px; z-index: 1; letter-spacing: -0.04em;}
.select_box select { position: relative; width: 100%; height: 34px; line-height: 36px; padding: 0; opacity: 0; filter: alpha(opacity=0); z-index: 2; cursor: pointer;}

/* Board list */
.con_bbs { background: #fff !important;}

.b_wrap { position: relative; padding: 10px 15px;}
.tit_wrap { position: relative; padding: 20px 15px 10px; background: #fff; border-top: 1px solid #dedede;}
.page_tit { font-size: 21px;}
.board_search_top { position: relative; padding: 20px 15px 10px; background: #fff; border-top: 1px solid #dedede;}
.board_search_top > h2 { font-size: 16px; color: #222;}
.board_search_top > h2 > span { font-size: 21px; color: #d4253e;}

.btn_img { font-size: 18px;}
.btn_img > img { position: relative; top: -2px; margin-right: 6px;}
.btn_img.tap { opacity: .7;}

.btn_img.pos_right { position: absolute; right: 15px; top: -33px;}

.board_list { position: relative;}
.board_list .list_thumb { border-bottom:1px solid #ddd;}
.board_list .list_thumb > li { position:relative; border-top:1px solid #ddd;}
.board_list .list_thumb > li > a { position:relative; display:block; padding:15px 15px 10px;}
.board_list .list_thumb > li > a.tap { color:#666;}
.board_list .list_thumb > li > a > b { display: block; color: #808080; font-size: 14px; font-weight: normal; margin-bottom: 4px;}
.board_list .list_thumb > li > a > b > span { display: inline-block; background: #2162af; height: 20px; line-height: 21px; padding: 0 6px; border-radius: 10px; color: #fff; margin-right: 5px; margin-left: -3px; margin-top: -3px;}
.board_list .list_thumb > li > a > h3 { font-weight: normal; line-height:1.2; margin-top:-2px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.board_list .list_thumb > li > a > h3.icon_new { padding-right: 18px; background: url(../images/bbs/icon_new.png) no-repeat right 0;}
.board_list .list_thumb > li.on_thumb > a { display: block; padding-left:105px; min-height:55px;}
.board_list .list_thumb > li.on_thumb > a .thumbs { position:absolute; left:15px; top:15px; display:block; width:80px; height:55px; overflow:hidden;}
.board_list .list_thumb > li.on_thumb > a .thumbs img { width:80px;}

.board_list .list_thumb > li.notice { background: #f4f4f4;}
.board_list .list_thumb > li.reply { padding-left: 40px; background: url(../images/bbs/icon_reply.png) no-repeat 10px 0; border-top: 0;}
.board_list .list_thumb > li.reply > a { border-top: 1px solid #dedede; padding-left: 0;}
.board_list .list_thumb > li.on_thumb.reply > a { padding-left: 90px;}
.board_list .list_thumb > li.on_thumb.reply > a .thumbs { left:0; top:15px;}
.board_list .list_thumb > li.no_result { padding: 25px 0 23px; text-align: center; font-size: 16px; color: #000;}

.board_list .ac_info:after { content:""; display:block; clear:both;}
.board_list .ac_info > li { position: relative; display: inline; font-size:13px; color:#808080;}
.board_list .ac_info > li:after { content: "·"; margin: 0 0 0 3px;}
.board_list .ac_info > li:last-child:after { display: none;}
.board_list .ac_info > li > span { line-height: inherit;}

.board_search { border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; height: 45px;}
.search_con { position: relative; padding: 0 60px 0 95px;}
.search_con .select_box { position: absolute; left: 0; top: 0; height: 45px; border: 0; border-right: 1px solid #dedede;}
.search_con .select_box label { top: 14px; left: 15px; z-index: 1; letter-spacing: -0.04em; font-size: 16px;}
.search_con .select_box select { height: 43px; line-height: 45px;}
.search_con .btn_search { position: absolute; right: 0; top: 0; width: 40px; height: 45px; background: url(../images/bbs/btn_search.png) no-repeat center center; text-indent: -9999em;}
.search_con input { position: relative; top: 5px; font-size: 16px;}

/* paging */
.paging { position: relative; background: #f6f6f6; text-align: center; padding: 15px 0;}
.paging .board_nav li { display:inline-block; font-family: rubik, sans-serif; color: #b6b6b6;}
.paging .board_nav li a { position:absolute; bottom:13px; display:block; text-indent:-9999px; width:30px; height:30px; background:url(../images/bbs/btn_page.svg) no-repeat 0 0;}
.paging .board_nav li.prev a { background-position:0 0; left:90px;}
.paging .board_nav li.next a { background-position:-30px 0; right:90px;}
.paging .board_nav li a:hover { opacity: .5;}
.paging .board_nav li > span, .board_nav li > i { font-size: 20px; letter-spacing: 1px; font-style: normal;}
.paging li > i { color: #2162af !important; font-style: normal;}

/* Board Detail */
.board_detail { padding: 15px; border-top:1px solid #ddd;}

.board_detail .board_top { position:relative; background:#fff; border-bottom:1px solid #ddd; padding: 10px 0;}
.board_detail .board_top > h3 { font-size:22px; font-weight: bold; margin-bottom:5px; line-height: 1.2;}
.board_detail .board_top > h3 > span { position: relative; top: -2px; display: inline-block; background: #2162af; height: 20px; line-height: 21px; padding: 2px 8px; border-radius: 15px; color: #fff; margin-right: 5px; margin-left: -3px; font-size: 14px;}

.board_detail .ac_info:after { content:""; display:block; clear:both;}
.board_detail .ac_info > li { position: relative; display: inline; font-size:13px; color:#808080;}
.board_detail .ac_info > li:after { content: "·"; margin: 0 2px 0 5px;}
.board_detail .ac_info > li:last-child:after { display: none;}
.board_detail .ac_info > li > span { line-height: inherit;}

.board_detail .board_con { position:relative; color: #333; padding: 15px 0; border-bottom: 1px solid #ddd; min-height: 180px;}
.board_detail .board_con * { line-height:1.76; font-family: Apple SD Gothic Neo, San Francisco, 돋움, Dotum, Helvetica, Droid Sans, AppleSDGothic, Arial, sans-serif !important; letter-spacing: -.04em;}
.board_detail .board_con:after { content:""; display:block; clear:both;}
.board_detail .board_con img { max-width: 100%; margin-bottom: 15px;}

.board_detail .file_box { padding: 10px 0; font-size: 15px; border-bottom: 1px solid #ddd;}
.board_detail .file_box ul li a { display: block; padding: 5px 0; padding-left: 25px; background: url(../images/bbs/icon_file.png) no-repeat 0 5px;}
.board_detail .file_box ul li a.tap { text-decoration: underline;}

.board_detail .btn_share_small { font-size: 0; text-align: center; border-bottom: 1px solid #ddd; padding: 10px 0;}
.board_detail .btn_share_small:after { content: ""; display: block; clear: both;}
.board_detail .btn_share_small li { display: inline-block; margin-right: 5px;}
.board_detail .btn_share_small li a { display: block; width: 35px; height: 35px; background: url(../images/bbs/btn_share_small.png) no-repeat 0 0; text-indent: -9999px; overflow: hidden;}
.board_detail .btn_share_small li.bsm01 a { background-position: 0 0;}
.board_detail .btn_share_small li.bsm02 a { background-position: -40px 0;}
.board_detail .btn_share_small li.bsm03 a { background-position: -80px 0;}
.board_detail .btn_share_small li.bsm04 a { background-position: 0 -40px;}
.board_detail .btn_share_small li.bsm05 a { background-position: -40px -40px;}
.board_detail .btn_share_small li.bsm06 a { background-position: -80px -40px;}
.board_detail .btn_share_small li.bsm07 a { background-position: 0 -80px;}
.board_detail .btn_share_small li.bsm08 a { background-position: -40px -80px;}
.board_detail .btn_share_small li.bsm09 a { background-position: -80px -80px;}
.board_detail .btn_share_small li a.tap { opacity: 0.8;}

.bbs_btn_wrap { position: relative; background: #eee; margin: 0 -15px; padding: 15px; margin-top: -1px;}
.bbs_btn_wrap:after { content: ""; display: block; clear: both;}
.bbs_btn_wrap .bbw_l { float: left;}
.bbs_btn_wrap .bbw_r { float: right;}
.bbs_btn_wrap a, .bbs_btn_wrap button { font-size: 18px; background: transparent;}
.bbs_btn_wrap a img, .bbs_btn_wrap button img { margin-right: 5px; position: relative; top: -1px;}

.btn_con_bot { text-align: center; padding: 15px; position: relative;}

.btn_recom { position: relative; display: inline-block; height: 37px; line-height: 38px !important; padding: 0 19px 0 45px; border: 1px solid #898989; font-size: 18px;}
.btn_recom:after { position: absolute; left: 19px; top: 8px; content: ""; display: block; width: 18px; height: 20px; background: url(../images/bbs/btn_recom.png) no-repeat 0 0;}
.btn_recom.on { background-color: #2162af; border-color: #2162af; color: #fff;}
.btn_recom.on:after { background-position: 0 -20px;}

.btn_report { position: relative; display: inline-block; height: 23px; line-height: 24px !important; padding: 0 7px 0 24px; border: 1px solid #959595; font-size: 14px;}
.btn_report:after { position: absolute; left: 7px; top: 1px; content: ""; display: block; width: 13px; height: 18px; background: url(../images/bbs/btn_report.png) no-repeat 0 0;}
.btn_report.on { background-color: #f83d3d; border-color: #f83d3d; color: #fff;}
.btn_report.on:after { background-position: 0 -20px; top: 2px;}

.btn_con_bot .btn_report { position: absolute; right: 0; bottom: 15px;}

/* 댓글 */
.board_detail .reply_nav { position: relative; border-top: 1px solid #ddd; background: #fff; padding: 0 15px; margin: 0 -15px;}
.board_detail .reply_nav ul li { text-align: center; font-size: 18px;}
.board_detail .reply_nav ul li a { display: block; font-size: 18px; color: #9a9a9a; border-bottom: 2px solid #c0bfbf; padding: 15px 0 10px;}
.board_detail .reply_nav ul li a.on { border-color: #000; color: #000;}
.board_detail .reply_nav ul li b { font-size: 14px; color: #2162af !important;}

.board_detail .no_result { padding: 50px 0; text-align: center; font-size: 18px;}
.board_detail .no_result a { display: block; width: 90px; border: 1px solid #999; margin: 10px auto 0; padding: 5px 0 3px;}

.board_detail .reply_list { position: relative;}
.board_detail .reply_list > li, .reply_list > li > ul > li { border-top: 1px solid #ddd;}
.board_detail .reply_list > li:first-child { border-top: 0;}
.board_detail .reply_list > li > ul > li { margin-left: 16px;}

.board_detail .reply { position: relative; padding: 15px 0;}
.board_detail .reply:after { content: ""; display: block; clear: both;}
.board_detail .reply h5 { font-size: 18px; padding-right: 70px;}
.board_detail .reply b { display: inline-block; font-size: 13px; font-weight: normal; margin-bottom: 5px; color: #2162af !important;}
.board_detail .reply .btn_open_p { font-size: 13px; margin-left: 5px;}
.board_detail .reply p { padding: 0 0 10px; font-size: 15px;}

.board_detail .reply_list > li > ul > li .reply { padding-left: 15px; margin-left: -15px; background: url(../images/bbs/icon_reply.png) no-repeat 0 0;}
.board_detail .reply_list > li > ul > li .reply p { margin-left: 30px;}

.board_detail .btn_block { display: block; border: 1px solid #999; padding: 3px 7px 2px; font-size: 14px;}
.board_detail .btn_block.atop { position: absolute; right: 60px; top: 18px;}
.board_detail .btn_block.abot { display: inline-block;}
.board_detail .reply .btn_report { position: absolute; right: 0; top: 18px;}
.board_detail .reply .pw_input { background: #f2f2f2; border: 1px solid #dedede; border-bottom: 2px solid #dedede; padding: 10px; margin-bottom: 7px;}
.board_detail .reply .pw_input label { display: block; font-size: 14px; margin-bottom: 5px;}
.board_detail .reply .pw_input input { box-sizing: border-box; height: 40px; border: 1px solid #eaeaea;}
.board_detail .reply .pw_input a { display: inline-block; font-size: 14px; width: 55px; text-align: center; background: #888; color: #fff; height: 25px; line-height: 25px; border-radius: 3px; margin: 0 1px;}

.board_detail .recommand { position: relative; float: right;}
.board_detail .recommand:after { content: ""; display: block; clear: both;}
.board_detail .recommand li { float: left; margin-left: 10px;}
.board_detail .recommand li a { position: relative; font-size: 20px; padding-left: 25px;}
.board_detail .recommand li a:after { position: absolute; left: 0; top: 0; content: ""; display: block; width: 25px; height: 25px; background: url(../images/bbs/btn_recom_reply.png) no-repeat 0 0;}
.board_detail .recommand li.recom01 a:after { background-position: 0 0;}
.board_detail .recommand li.recom02 a:after { background-position: -25px 0;}
.board_detail .recommand li a.tap { color: #999;}

.board_detail .btn_listmore { display: block; background: #eee; margin: 0 -15px; text-align: center; height: 40px; line-height: 40px; font-size: 16px;}
.board_detail .btn_listmore.tap { background: #ddd;}

.board_detail .reply_write { position: relative; padding-bottom: 15px; border-bottom: 1px solid #ddd;}
.board_detail .reply_write textarea { padding: 15px 0; border: 0; height: 100px; font-size: 16px;}
.board_detail .reply_write > span { font-family: rubik, sans-serif; font-size: 13px; display: block; margin-top: 30px;}
.board_detail .reply_write > span b { font-weight: normal; color: #2162af !important;}
.board_detail .reply_write > button { position: absolute; bottom: 15px; right: 0; background: #fff; border: 1px solid #999; padding: 5px 15px;}
.board_detail .reply_write > button:active { color: #666;}

.board_detail .reply_form { position: relative; background: #eee; padding: 10px 10px 5px; margin-top: 10px;}
.board_detail .reply_form > h5 { font-weight: normal; font-size: 13px; margin-bottom: 10px;}
.board_detail .reply_form > ul { position: relative; margin: 0 -6px 10px;}
.board_detail .reply_form > ul:after { content: ""; display: block; clear: both;}
.board_detail .reply_form > ul li { float: left; width: 50%;}
.board_detail .reply_form > ul li div { position: relative; padding-right: 16px; margin: 0 6px;}
.board_detail .reply_form > ul li div input { padding: 10px 7px;}

.board_detail .reply_form > dl { position: relative; margin-bottom: 10px;}
.board_detail .reply_form > dl dt { font-size: 15px; color: #666; font-size: 13px;}
.board_detail .reply_form > dl dd { position: relative; padding-left: 130px;}
.board_detail .reply_form > dl dd:after { content: ""; display: block; clear: both;}
.board_detail .reply_form > dl dd span { position: absolute; left: 0; top: 2px; display: block; margin-right: 10px; margin-bottom: 5px;}
.board_detail .reply_form > dl dd div { position: relative; padding-right: 16px;}
.board_detail .reply_form > dl dd div input { padding: 10px 7px;}

/* 글쓰기 */
.board_write { border-top: 2px solid #222;}
.board_write dl { position: relative; padding-left: 85px; border-bottom: 1px solid #eee;}
.board_write dl dt { position: absolute; left: 13px; top: 16px; font-size: 16px;}
.board_write dl dd { padding: 7px 15px; margin-right: 20px;}

.board_write input[type=text], 
.board_write input[type=password], 
.board_write input[type=number], 
.board_write input[type=tel], 
.board_write input[type=email] {
	border: 1px solid #dedede;
}

.file_wrap { padding: 5px 15px 10px; border-bottom: 1px solid #ddd;}
.file_wrap input[type=file] {
	border:1px solid #d8d8d8;
	color: #222; 
	font-size:14px !important; 
	width:100%; 
	padding: 7px 10px; 
	border-radius: 5px; 
	margin:0; 
	box-sizing: border-box; 
	-ms-box-sizing: border-box; 
	background: transparent;	
    outline: 0;
    font-size: 100px;
    position: static;
    opacity: 1;
    filter: alpha(opacity=1);
    -ms-filter: "alpha(opacity=1)";
    -khtml-opacity: 1;
    -moz-opacity: 1;
    height: inherit;
    cursor: pointer;
}

.board_write .chk_list { padding: 9px 0;}
.board_write .chk_list:after { content: ""; display: block; clear: both;}
.board_write .chk_list > li { position: relative; margin-right: 15px; float: left;}
.board_write .chk_list .chk { margin: 2px 5px 0; vertical-align: top;}
.board_write .bbs_text { margin-top: -1px; margin-right: 30px;}
.board_write .bbs_text textarea { padding: 15px; resize: none; color: #222; min-height: 150px;}

.terms_wrap { position: relative; margin: 10px 15px 5px; border: 1px solid #ccc;}
.terms_wrap > h3 { background: #eee; padding: 8px 15px 6px; font-size: 16px; font-weight: normal;}
.terms_wrap > div { padding: 10px; font-size: 13px; height: 50px; overflow-y: scroll;}

.terms_agree { position: relative; padding: 5px 5px 10px 15px;}

.terms_wrap .terms_box h1 { font-size: 15px;}
.terms_wrap .terms_box h2 { font-size: 14px;}
.terms_wrap .terms_box p { font-size: 13px; text-align: justify; margin-bottom: 15px;}
.terms_wrap .terms_box h1, .terms_wrap .terms_box h2, .terms_wrap .terms_box h3 { margin-bottom: 5px;}
.terms_wrap .terms_box ol { margin-bottom: 15px;}
.terms_wrap .terms_box li { margin: 3px 0; line-height: 1.4; text-align: justify;}

.terms_wrap .terms_h_control { position: relative; display: block; background: #cdcdcd; padding: 13px 0 11px; padding-left: 30px; text-align: center;}
.terms_wrap .terms_h_control:after { position: absolute; left: 50%; top: 17px; content: ""; display: block; width: 20px; height: 10px; background: url(../images/bbs/btn_collap.png) no-repeat 0 0; margin-left: -40px;}
.terms_wrap .terms_h_control.on:after { background-position: 0 -12px;}

/* Media Query */
@media only screen and (-webkit-min-device-pixel-ratio:1.5) {
.select_box { background-image: url(../images/bbs/retina/bg_select.png); background-size:25px 6px; -webkit-background-size:25px 6px;}
.board_list .list_thumb > li > a > h3.icon_new { background-image: url(../images/bbs/retina/icon_new.png); background-size:16px 16px; -webkit-background-size:16px 16px;}
.board_list .list_thumb > li.reply { background-image: url(../images/bbs/retina/icon_reply.png); background-size:25px 51px; -webkit-background-size:25px 51px;}
.search_con .btn_search { background-image: url(../images/bbs/retina/btn_search.png); background-size:30px 30px; -webkit-background-size:30px 30px;}
.board_detail .btn_share_small li a { background: url(../images/bbs/retina/btn_share_small.png); background-size:115px 115px; -webkit-background-size:115px 115px;}
.btn_recom:after { background-image: url(../images/bbs/retina/btn_recom.png); background-size:18px 40px; -webkit-background-size:18px 40px;}
.btn_report:after { background-image: url(../images/bbs/retina/btn_report.png); background-size:13px 38px; -webkit-background-size:13px 38px;}
.board_detail .file_box ul li a { background-image: url(../images/bbs/retina/icon_file.png); background-size:20px 20px; -webkit-background-size:20px 20px;}
.board_detail .reply_list > li > ul > li .reply { background-image: url(../images/bbs/retina/icon_reply_reply.png); background-size:37px 75px; -webkit-background-size:37px 75px;}
.board_detail .recommand li a:after { background-image: url(../images/bbs/retina/btn_recom_reply.png); background-size:50px 25px; -webkit-background-size:50px 25px;}
.terms_wrap .terms_h_control:after { background-image: url(../images/bbs/retina/btn_collap.png); background-size:20px 22px; -webkit-background-size:20px 22px;}

}