/*-----------------------------------------------------------------------
    
    board 홈페이지용

-----------------------------------------------------------------------*/

#boardSystem { position: relative; min-height: 750px; }
.lay_blst_wrap { position: relative; width: 1080px; margin: 15px auto 0; overflow: hidden; }
.lay_blst_leftmenu { float: left; width: 210px; }
.pt_blst_menu .head { background: url(/img/menu_sprite.png); background-position: -420px 0px; }
.lay_blst_content { line-height: 18px; font: 12px dotum; margin-top: 70px; }

/* menu */
.brdMenu { height: 50px; background: #222; padding-top: 15px; border-top: 1px solid #fff692; border-bottom: 0px; color: #aaa; }
.brdMenu li { float: left; margin-left: 25px; }
.brdMenu li:first-child { margin-left: 15px; }
.brdMenu li.selected { font-weight: bold; color: #eee; }
.brdMenu li a { color: #aaa; }
.brdMenu li.selected a { color: #fff; }

/* list */
.brdList { width: 1200px; margin:0 auto; }
.brdList thead tr th { padding: 10px 0px; text-align: center; border-bottom: 1px solid #eee; font-size: 11px; background: #f8f8f8; color: #666; }
.brdList thead tr th.writer { text-align: left; padding-left: 10px;min-width:100px }
.brdList thead tr th:first-child { min-width: 30px; }
.brdList thead tr th:nth-child(3) { min-width: 300px; }
.brdList thead tr th:nth-last-child(-1) { min-width: 40px; }
.brdList thead tr th:last-child { min-width: 40px; }
.brdList tbody tr:hover { background: #fafafa; }
.brdList tbody tr td { padding: 10px 0px; border-bottom: 1px solid #eee; color: #666; }
.brdList tbody tr td.number { width: 50px; text-align: center; font-size: 11px; color: #aaa; }
.brdList tbody tr td.content { width: 850px; padding-left: 10px; font-size: 12px;  }
.brdList tbody tr td.content a { color: #444;text-decoration:none }
.brdList tbody tr td.notice {font-weight:bold }
.brdList tbody tr td.content span { color: #00ac13; font: 12px dotum; }
.brdList tbody tr td.content span.icon { display: inline-block; border: 1px solid #ea7115; background: #ff7c19; color: #fff; font: 11px dotum; padding: 1px 2px; margin: 0px 5px; letter-spacing: -1px; }
.brdList tbody tr td.content span.number { font-weight: bold; color: #e53636 }
.brdList tbody tr td.content span.sign { color: #e53636 }
.brdList tbody tr td.content span.icon_new { display: inline-block; background: #fc8300; color: #fff; font: 11px dotum; padding: 0px 4px; margin: 0px 5px; letter-spacing: -1px; border-radius: 1px; }
.brdList tbody tr td.writer { padding-left: 10px; }
.brdList tbody tr td.writer span { vertical-align: middle; margin-left: 4px; font: bold 12px arial; }
.brdList tbody tr td.writer img { vertical-align: middle; width: 17px; height: 17px; margin-bottom: 1px; border-radius: 8px; }
.brdList tbody tr td.date { width: 70px; text-align: center; font-size: 11px; }
.brdList tbody tr td.readcount { width: 40px; text-align: center; font-size: 11px; }
.brdList tbody tr td.recommend { width: 40px; text-align: center; font-size: 11px; }
.brdList tbody tr td .new { vertical-align:middle}
.brdStockList { width: 1200px; margin:0 auto; }
.brdStockList .img_Wrap { background-color:#e3e5e8;cursor:pointer;border: 10px solid #7a91be;}
.brdStockList .img_Wrap .img_Part {max-height:480px;overflow:hidden;}
.brdStockList .img_Wrap .img_Part table { width: 100%; height: 100%; }
.brdStockList .img_Wrap .img_Part table tr td { text-align: center; width: 100%; }
.brdStockList .img_Wrap .img_Part table tr td img { max-width:100%; vertical-align: middle; }
.brdStockList .img_Wrap .img_Part .ul_Date {display:inline-block;position:absolute;right:5px;top:5px;background-color:#525252;padding:1px 3px;border-radius:3px;opacity:0.9;font-size:13px;color:#fff;font-weight:lighter }
.brdStockList .img_Wrap:hover .hover_Part { display:inline-block; }
.brdStockList .img_Wrap .hover_Part {display:none;position:absolute;top:0;left:0;width:390px;height:100%;background-color:#000;opacity:0.8; color: #fff; }
.brdStockList .img_Wrap .hover_Part .hp_Ttl {padding:10px 15px 0;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.brdStockList .img_Wrap .hover_Part .hp_Ttl img {margin-right:4px; }
.brdStockList .img_Wrap .hover_Part .hp_Ttl span {font-size:14px }
.brdStockList .img_Wrap .hover_Part .hp_Profdate {padding:10px 15px 15px;border-bottom:1px dashed #ccc;overflow:hidden;color:#fff }
.brdStockList .img_Wrap .hover_Part .hp_Profdate .lp {display:inline-block;float:left;font-size:12px;width:105px;text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.brdStockList .img_Wrap .hover_Part .hp_Profdate .lp img {width:14px;border-radius:7px;margin:0 3px 2px 0}
.brdStockList .img_Wrap .hover_Part .hp_Profdate .lp .nick { display: inline-block; vertical-align: top; }
.brdStockList .img_Wrap .hover_Part .hp_Profdate .rp {display:inline-block;float:right;width:50px;font-size:12px;text-align:left }
.brdStockList .img_Wrap .hover_Part .hp_Ment {display:inline-block;padding:10px;height:calc(100% - 110px);font-size:13px;color:#fff;overflow: hidden;text-overflow: ellipsis;}
.brdStockList .img_Wrap .hover_Part .hp_Ment .noment {color:#fff; }
.brdStockList .img_Wrap .hover_Part .hp_Ment img { max-width: 100%; }

/* view */
.lay_bview_wrap { position: relative; width: 1200px; margin: 15px auto 0; overflow: hidden; }
.lay_bview_leftmenu { float: left; width: 210px; }
.pt_bview_menu .head { background: url(/img/menu_sprite.png); background-position: -420px 0px; }
.lay_bview_content { float: right; width: 1178px; padding: 10px 10px 50px; border: 1px solid #eee; font: 13px dotum;overflow:hidden }
.lay_bview_content p { margin-bottom: 4px; }
.brdView { }
.brdView .head { position: relative; }
.brdView .head .top { position: relative; padding:35px 0 ; border-bottom: 1px dashed #ddd; }
.brdView .head .top .title { color: #222; position: absolute; top: 10px; left: 5px; font-weight: bold;font-size:14px }
.brdView .head .top .date { position: absolute; bottom: 0px; right: 10px; font: 12px dotum; color: #aaa; }
.brdView .head .top .user { position: absolute; top: 0px; right: 10px; font: 12px dotum; }
.brdView .head .top .user span { vertical-align: middle; }
.brdView .head .top .user img { width: 28px; height: 28px; margin-right: 5px; margin-bottom: 2px; border-radius: 12px; vertical-align: middle; }
.brdView .head .file { position: absolute; top: 10px; right: 5px; font: 12px dotum; }
.brdView .head .file .lbl { color: #888; }
.brdView .head .file .emphasis { color: red; font-weight: bold; }
.brdView .head .bottom { position: relative; }
.brdView .head .bottom a:hover { text-decoration: underline; }
.brdView .head .bottom .filelist { position: absolute; top: 40px; right: 5px; border: 1px solid #e6e6e6; background: #f7f7f7; padding: 15px 23px 5px 10px; text-align: right; }
.brdView .head .bottom .filelist li { height: 20px; font: 12px dotum; }
.brdView .head .bottom .filelist li span:hover { text-decoration: underline; cursor: pointer; }
.brdView .head .bottom .filelist li span, .brdView .head .bottom .filelist li img { vertical-align: middle; }
.brdView .head .bottom .filelist li.close { position: absolute; top: 3px; right: 8px; font: bold 16px dotum; }
.brdView .head .bottom .filelist li a { color: #444; margin-left: 5px; }
.brdView .head .bottom .btnlist { position: absolute; top: -30px; left: 5px; }
.brdView .body { display:block; padding: 50px 15px 80px;  word-break:break-all }
.brdView .body img { max-width: 100%; }
.brdView .body .youtube_iframe { text-align: center; }
.brdView .body .youtube_iframe iframe { width: 800px; height: 450px; }
.brdView .foot { min-height: 100px;padding:50px 0 20px }
.brdView .foot .vote { text-align: center;width:150px;margin:0 auto;overflow:hidden }
.brdView .foot .btn { cursor: pointer;float:left;width:50px;text-align:center }
.brdView .foot .btn .number{ display:block;margin-top:5px}
.brdView .foot .btn .in { color: #e94747; }
.brdView .foot .btn .out { color: #3272b0; margin-left: 5px; }
.brdView .foot .btn .inter { color: #22ac46; }
.brdView .foot .btn span { cursor: pointer; }
.brdView .foot .vote_expn { font-size: 13px; text-align: center;color:#777 }
.brdView .foot .join_banner { border: 1px solid #eee; margin: 0 auto 30px auto; width: 1148px; font-size: 0; }
.brdView .foot .join_banner img { width: 1148px; }
.brdView .other { overflow: hidden; margin-bottom:30px; border-top:1px solid #f2f2f2; padding:15px 15px 0 15px;  }
.brdView .other .title {text-align:left; margin:0 0 15px 0; }
.brdView .other .title span { font-weight:bold; margin-right:3px; font-size:14px; color:#666; }

.brdView .other ul {  }
.brdView .other ul li { float:left; width:19%; margin-left:1%;  }
.brdView .other ul li .thumb { border:1px solid #ddd; height: 140px; overflow: hidden; }
.brdView .other ul li .thumb table { width: 100%; height: 100%; }
.brdView .other ul li .thumb table tr td { padding: 0; }
.brdView .other ul li .thumb table tr td img { width:100%; }
.brdView .other ul li .info { position:relative; font:13px tahoma; color:#666; margin-top:7px;margin-left:3px; }
.brdView .other ul li .info .date {  }
.brdView .other ul li .info .readcount {  }
.brdView .other ul li .info .deco { font-size:10px; color:#888;margin:0px 5px;   }

/* pagenation */
.paginate { text-align: center; padding: 25px 0 75px; font: bold 12px dotum; }
.paginate a { color: #aaa;text-decoration:none }
.paginate b { color: #000; }
.paginate span { margin: 0px 7px; }
.paginate span.active { font-weight: bold; color: #000; }
.paginate span.right { font-weight: normal }
.paginate span.right span { margin-left: 3px; font: 11px arial; }


/* btn */
.brdBtn { position: relative; width: 1200px; margin: 0 auto; }
.brdBtn .write { position:absolute;right:0px;top:-50px; color: rgb(68, 68, 68); cursor: pointer; display: inline-block; min-width: 60px; height: 30px; text-align: center; white-space: nowrap; width: 54px; column-rule-color: rgb(68, 68, 68); perspective-origin: 36px 14.5px; transform-origin: 36px 14.5px; user-select: none; background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1);; background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(245, 245, 245), rgb(241, 241, 241)) repeat scroll 0% 0% / auto padding-box border-box; border: 1px solid rgba(0, 0, 0, 0.0980392); border-radius: 2px 2px 2px 2px; font: normal normal bold normal 14px / 27px arial, sans-serif; outline: rgb(68, 68, 68) none 0px; line-height: 30px; }
.brdViewBtn { position: relative; }
.brdViewBtn .list { position:absolute;left:0px;top:10px; color: rgb(68, 68, 68); cursor: pointer; display: inline-block; min-width: 60px; height: 30px; text-align: center; white-space: nowrap; width: 54px; column-rule-color: rgb(68, 68, 68); perspective-origin: 36px 14.5px; transform-origin: 36px 14.5px; user-select: none; background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1);; background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(245, 245, 245), rgb(241, 241, 241)) repeat scroll 0% 0% / auto padding-box border-box; border: 1px solid rgba(0, 0, 0, 0.0980392); border-radius: 2px 2px 2px 2px; font: normal normal bold normal 14px / 27px arial, sans-serif; outline: rgb(68, 68, 68) none 0px; line-height: 30px; }
.brdViewBtn .write { position:absolute;right:0px;top:10px; color: rgb(68, 68, 68); cursor: pointer; display: inline-block; min-width: 60px; height: 30px; text-align: center; white-space: nowrap; width: 54px; column-rule-color: rgb(68, 68, 68); perspective-origin: 36px 14.5px; transform-origin: 36px 14.5px; user-select: none; background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1);; background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(245, 245, 245), rgb(241, 241, 241)) repeat scroll 0% 0% / auto padding-box border-box; border: 1px solid rgba(0, 0, 0, 0.0980392); border-radius: 2px 2px 2px 2px; font: normal normal bold normal 14px / 27px arial, sans-serif; outline: rgb(68, 68, 68) none 0px; line-height: 30px; }


/* write */
.lay_bwrite_wrap { position: relative; width: 1200px; margin: 15px auto 0; overflow: hidden; }
.lay_bwrite_leftmenu { float: left; width: 210px; }
.pt_bwrite_menu .head { background: url(/img/menu_sprite.png); background-position: -420px 0px; }
.lay_bwrite_content { float: right; width: 1178px; padding: 10px; border: 1px solid #eee; float: right; line-height: 18px; font: 12px dotum; }
.brdWrite { position: relative; }
.brdWrite .head { padding-top: 20px; border: 1px solid #eee; border-bottom:0px; }
.brdWrite .head .top { position: relative; height: 50px; padding-top: 15px; }
.brdWrite .head .bottom { }
.brdWrite .head .ipt_title { width: 400px; }
.brdWrite .head tr { height: 40px; }
.brdWrite .head td:first-child { width: 120px; text-align: center }
.brdWrite .head td input { width: 950px; height: 30px; padding: 0px 10px; border: 1px solid #b5b5b5; }
.brdWrite .body { width: 1178px; padding: 0px; border-top: 0px; }
.brdWrite .body textarea { width: 1050px; min-height: 400px; padding: 10px 10px 30px 10px; resize: vertical; outline: none; border: 1px solid #ccc; }
.brdWrite .body .tx-list.imgup_deligate { padding: 0 14px 0 0; float: left; position: relative; }
.brdWrite .body .tx-list.imgup_deligate a { width: 35px; height: 25px; background: url(/img/tx_text2.gif); background-repeat: no-repeat; background-position: 0 6px; height: 25px; display: block; float: left; font-size: 0; line-height: 0; overflow: hidden; text-indent: -1000px; }
.brdWrite .foot { height: 100px; padding-top: 30px; text-align: center }
.brdWrite .foot span { position: relative; color: rgb(68, 68, 68); cursor: pointer; display: inline-block; min-width: 110px; height: 40px; text-align: center; white-space: nowrap; width: 54px; column-rule-color: rgb(68, 68, 68); perspective-origin: 36px 14.5px; transform-origin: 36px 14.5px; user-select: none; background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1); background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(245, 245, 245), rgb(241, 241, 241)) repeat scroll 0% 0% / auto padding-box border-box; border: 1px solid rgba(0, 0, 0, 0.0980392); border-radius: 2px 2px 2px 2px; font: normal normal bold normal 14px / 27px arial, sans-serif; margin: 0px 16px 0px 0px; outline: rgb(68, 68, 68) none 0px; padding: 0px 8px; line-height: 40px; }
.brdWrite .foot span:hover { background: #e8e8e8; color: #000; border: 1px solid #c7c7c7; }
.brdWrite .foot span.next:hover { background: red; background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(255, 58, 58), rgb(246, 98, 98)) repeat scroll 0% 0%; color: #fff; border: 1px solid #cc0a0a }
#tx_editor_file { width: 1px; height: 1px; display: none; }

/* comment */
.brdComment { position: relative; }
.brdComment .head { width: 1168px; margin: 0 auto; height: 30px; }
.brdComment .head .left { float: left;color:#777 }
.brdComment .head .left .ccnt,.rcnt { font-weight:bold;color:#444}
.brdComment .head .left li { float: left; margin-left: 15px; }
.brdComment .head .right { float: right; }
.brdComment .head .right li { float: right; margin-right: 15px; }
.brdComment .head .right li span:hover { text-decoration: underline; cursor: pointer; }
.brdComment .body { width: 1160px; margin: 0 auto; border: 1px solid #eee; border-bottom: 0px; background: #fafafa; }
.brdComment .body li { padding: 18px 30px 20px 20px; border-bottom: 1px dotted #ddd; }
.brdComment .body li .hnt { height: 29px; }
.brdComment .body li .hnt span { vertical-align: middle; }
.brdComment .body li .hnt img { margin:0px 2px 2px 2px;vertical-align:middle}
.brdComment .body li .hnt img.memberPhoto { width: 20px; height: 20px; border-radius: 9px; opacity: 0.8 }
.brdComment .body li .hnt img.picon { width: 17px; height: 17px; vertical-align: middle; margin-bottom: 2px; margin-left: 0px; }
.brdComment .body li .hnt .ico { color: #e84c4c; font-weight: bold; }
.brdComment .body li .hnt .nickname { color: #777; font: bold 12px dotum; }
.brdComment .body li .hnt .date { margin-left: 10px; font: 11px dotum; color: #bbb; }
.brdComment .body li .hnt .icon_reply { width: 8px; margin-left: 5px; margin-right: 0px; }
.brdComment .body li .hnt .btn_rp { margin-left: 2px; font: 11px dotum; color: #bbb; cursor: pointer; }
.brdComment .body li .hnt .btn_rp.cancle { color: #ea1212; cursor: pointer; }
.brdComment .body li .cnt { color: #222; font: 13px gulim; line-height: 15px; padding-left: 25px; }
.brdComment .body li .cnt.writer { color: #009816; }
.brdComment .body li span { vertical-align: middle; }
.brdComment .body li textarea { vertical-align: middle; }
.brdComment .body li.reply { padding: 14px 30px 16px 40px; background: #f4f4f4; }
.brdComment .body li.reply .cnt { padding-left: 44px; }
.brdComment .body li.replyInput { display: none; padding: 15px 30px 15px 40px; }
.brdComment .body li.replyInput textarea { width: 650px; padding: 10px; min-height: 100px; resize: none; margin-right: 10px; border: 1px solid #eee; }
.brdComment .body li.reply.admin { background: #ffefe8; }
.brdComment .body li.org.admin { background: #fff7f3; }
.brdComment .body .ico { color: #e84c4c }
.brdComment .body .btn { position: relative; color: rgb(68, 68, 68); cursor: pointer; display: inline-block; min-width: 50px; height: 30px; text-align: center; white-space: nowrap; width: 54px; column-rule-color: rgb(68, 68, 68); perspective-origin: 36px 14.5px; transform-origin: 36px 14.5px; user-select: none; background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1); background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(245, 245, 245), rgb(241, 241, 241)) repeat scroll 0% 0% / auto padding-box border-box; border: 1px solid rgba(0, 0, 0, 0.0980392); border-radius: 2px 2px 2px 2px; font: normal normal bold normal 14px / 27px arial, sans-serif; margin: 0px 0px 0px 5px; outline: rgb(68, 68, 68) none 0px; padding: 0px 8px; line-height: 30px; }
.brdComment .body .btn.up:hover { background: #eee; color: #000; border: 1px solid #ccc; }
.brdComment .body .cnt .tgNick { color: #aaa; }
.brdComment .body .pgn { text-align: center;padding-top:20px   }
.brdComment .body .pgn a.normal { display: inline-block; border: 1px solid #333; border-radius: 4px; padding: 2px 3%; text-decoration: none; color: #222; }
.brdComment .body .pgn a.normal span { vertical-align: middle; }
.brdComment .body .pgn a.active { display: inline-block; border: 1px solid #333; border-radius: 4px; padding: 2px 3%; background: #ffbb00; color: #000; text-decoration: none; }
.brdComment .body .pgn a.active span span { vertical-align: middle; }
.brdComment .body .pgn a.active span img { vertical-align: middle; }
.brdComment .body .pgn a.active span img.refresh {  }
.brdComment .foot { width: 1147px; margin: 0 auto; position: relative; border: 1px solid #eee; border-top: 0px; background: #fafafa; padding: 35px 0px 35px 15px }
.brdComment .foot.none { min-height: 100px; }
.brdComment .foot .lgm { text-align: center }
.brdComment .foot .lgm input { vertical-align: middle; }
.brdComment .foot .lgm input:focus { outline: #93b5ec auto; }
.brdComment .foot span { vertical-align: middle; }
.brdComment .foot .btn { position: relative; color: rgb(68, 68, 68); cursor: pointer; display: inline-block; min-width: 80px; height: 40px; text-align: center; white-space: nowrap; width: 54px; column-rule-color: rgb(68, 68, 68); perspective-origin: 36px 14.5px; transform-origin: 36px 14.5px; user-select: none; background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1); background: rgba(0, 0, 0, 0) -webkit-linear-gradient(top, rgb(245, 245, 245), rgb(241, 241, 241)) repeat scroll 0% 0% / auto padding-box border-box; border: 1px solid rgba(0, 0, 0, 0.0980392); border-radius: 2px 2px 2px 2px; font: normal normal bold normal 14px / 27px arial, sans-serif; margin: 0px 0px 0px 5px; outline: rgb(68, 68, 68) none 0px; padding: 0px 8px; line-height: 40px; }
.brdComment .foot .btn_img { position: absolute; top: 30px; right: 50px; }
.brdComment .foot .btn.up:hover { background: #eee; color: #000; border: 1px solid #ccc; }
.brdComment .foot .btn.login { width: 80%; padding-top: 10px; height: 60px; background: #192035; color: #fff; border: 1px solid #1d0000; font-weight: bold; margin-top: -10px; }
.brdComment .foot textarea { vertical-align: middle; width: 640px; padding: 10px; min-height: 40px; resize: none; margin-right: 10px; border: 1px solid #ddd;outline:none }

.board_view_popup { position: fixed; top: calc(50% - 256px); left: calc(50% - 384px); width: 736px; height: 512px; background: #fff; padding: 0 16px; box-shadow: 0 0 4px #000; border-radius: 4px; display: none; z-index: 2001; }
.board_view_popup .close_btn { width: 32px; height: 32px; position: absolute; top: 0; right: 0; }
.board_view_popup .close_btn a { display: block; width: 16px; height: 16px; padding: 8px; }
.board_view_popup .close_btn a img { width: 100%; height: 100%; vertical-align: top; }
.board_view_popup .brdView { height: 100%; }
.board_view_popup .brdView .body { padding: 16px 0 0 0; overflow: auto; height: calc(100% - 103px); }