@charset "utf-8";

/* 게시판 목록 */
#bo_list {position:relative;margin-bottom:20px}
#bo_list:after {display:block;visibility:hidden;clear:both;content:""}
#bo_list .td_board {width:120px;text-align:center}
#bo_list .td_chk {width:30px;text-align:center;border-top:1px solid #ecf0f1;border-bottom:1px solid #ecf0f1}
#bo_list .td_date {width:60px;text-align:center}
#bo_list .td_datetime {width:60px;text-align:center}
#bo_list .td_group {width:100px;text-align:center}
#bo_list .td_mb_id {width:100px;text-align:center}
#bo_list .td_mng {width:80px;text-align:center}
#bo_list .td_name {width:90px;text-align:left;padding:10px 0}
#bo_list .td_nick {width:100px;text-align:center}
#bo_list .td_num {width:50px;text-align:center}
#bo_list .td_num2 {width:50px;text-align:center}
#bo_list .td_numbig {width:80px;text-align:center}
#bo_list .txt_active {color:#5d910b}
#bo_list .txt_expired {color:#ccc}
#bo_list tbody tr {border-left:2px solid transparent}
#bo_list tbody tr:hover {border-left:2px solid #253dbe}
#bo_list tbody .even td {background:#fbfbfb}

#bo_cate {margin:25px 0}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {zoom:1}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {display:inline-block;padding:2px}
#bo_cate a {display:block;line-height:28px;padding:5px 15px;border-radius:30px;border:1px solid #d6e9ff;color:#6794d3}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none;background:#3a8afd;color:#fff}
#bo_cate #bo_cate_on {z-index:2;background:#3a8afd;color:#fff;font-weight:bold;border:1px solid #3a8afd;
-webkit-box-shadow:inset 0 2px 5px rgb(33, 135, 202);
-moz-box-shadow:inset 0 2px 5px rgb(33, 135, 202);
box-shadow:inset 0 2px 5px rgb(33, 135, 202)}
.td_subject img {margin-left:5px}

/* 게시판 목록 공통 */
.selec_chk {position:absolute;top:0;left:0;width:0;height:0;opacity:0;outline:0;z-index:-1;overflow:hidden}
.chk_box {position:relative}
.chk_box input[type="checkbox"] + label {position:relative;color:#676e70}
.chk_box input[type="checkbox"] + label:hover {color:#2172f8}
.chk_box input[type="checkbox"] + label span {float:left;width:15px;height:15px;display:block;background:#fff;border:1px solid #d0d4df;border-radius:3px}
.write_div .chk_box input[type="checkbox"] + label, .bo_vc_w .chk_box input[type="checkbox"] + label {padding-left:20px}
.write_div .chk_box input[type="checkbox"] + label span, .bo_vc_w .chk_box input[type="checkbox"] + label span {position:absolute;top:2px;left:0;width:15px;height:15px;display:block;margin:0;background:#fff;border:1px solid #d0d4df;border-radius:3px}
.chk_box input[type="checkbox"]:checked + label {color:#000}
.chk_box input[type="checkbox"]:checked + label span {background:url(./img/chk.png) no-repeat 50% 50% #3a8afd;border-color:#1471f6;border-radius:3px}


#bo_btn_top {margin:10px 0}
#bo_btn_top:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx {margin-bottom:5px;float:right;zoom:1}
.bo_fx:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx ul {margin:0;padding:0;list-style:none}
#bo_list_total {float:left;line-height:34px;font-size:0.92em;color:#4e546f}

.btn_bo_user {float:right;margin:0;padding:0;list-style:none}
.btn_bo_user li {float:left;width:40px;text-align:center;margin-left:5px;background:#fff}
.btn_bo_user > li {position:relative}
.btn_bo_adm {float:left}
.btn_bo_adm li {float:left;margin-right:5px}
.btn_bo_adm input {padding:0 8px;border:0;background:#d4d4d4;color:#666;text-decoration:none;vertical-align:middle}
.bo_notice td {background:#fff6fa !important;border-bottom:1px solid #f8e6ee}
.bo_notice td a {font-weight:bold}
.bo_notice .notice_icon {display:inline-block;line-height:25px;border-radius:5px;font-weight:bold;color:#f9267f}

.more_opt {display:none;position:absolute;top:45px;right:0;background:#fff;border:1px solid #b8bfc4;z-index:999}
.more_opt:before {content:"";position:absolute;top:-8px;right:13px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #b8bfc4 transparent}
.more_opt:after {content:"";position:absolute;top:-6px;right:13px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #fff transparent}
.more_opt li {border-bottom:1px solid #f1f1f1;padding:10px;float:inherit;width:90px;margin:0;color:#6b757c;text-align:left}
.more_opt li:last-child {border-bottom:0}
.more_opt li button, .more_opt li a {width:100%;border:0;background:#fff;color:#6b757c}
.more_opt li:hover a,
.more_opt li:hover button {color:#000}
.more_opt li i {float:right;line-height:20px}

.td_num strong {color:#000}
.bo_cate_link {float:left;display:inline-block;margin-right:10px;background:#e2eaf6;color:#3a8afd;font-weight:normal !important;height:20px;line-height:10px;padding:5px 8px;border-radius:5px;font-size:0.95em} /* 글제목줄 분류스타일 */
.bo_cate_link:hover {text-decoration:none}
.bo_tit {display:block;color:#000;font-weight:bold}
.bo_current {color:#e8180c}
#bo_list .profile_img img {border-radius:50%}
#bo_list .cnt_cmt {background:#e9eff5;color:#3a8afd;font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;vertical-align:middle}

#bo_list .bo_tit .title_icon {margin-right:2px}
#bo_list .bo_tit .fa-heart {color:#ff0000}
#bo_list .bo_tit .fa-lock {display:inline-block;line-height:14px;width:16px;font-size:0.833em;color:#4f818c;background:#cbe3e8;text-align:center;border-radius:2px;font-size:12px;border:1px solid #cbe3e8;vertical-align:middle}
#bo_list .bo_tit .new_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#23db79;background:#b9ffda;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}
#bo_list .bo_tit .hot_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#ff0000;background:#ffb9b9;text-align:center;border-radius:2px;vertical-align:middle}
#bo_list .bo_tit .fa-caret-right {color:#bbb}
#bo_list .bo_tit .fa-download {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#daae37;background:#ffefb9;text-align:center;border-radius:2px;margin-left:5px;vertical-align:middle}
#bo_list .bo_tit .fa-link {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#b451fd;background:#edd3fd;text-align:center;border-radius:2px;margin-left:5px;vertical-align:middle}

.bo_sch_wrap {display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:999}
.bo_sch {position:absolute;top:50%;left:50%;background:#fff;text-align:left;width:330px;max-height:300px;margin-left:-125px;margin-top:-180px;overflow-y:auto;border-radius:5px;-webkit-box-shadow:1px 1px 18px rgba(0,0,0,0.2);-moz-box-shadow:1px 1px 18px rgba(0,0,0,0.2);box-shadow:1px 1px 18px rgba(0,0,0,0.2);border:1px solid #dde7e9;background:#fff;border-radius:3px}
.bo_sch:after {display:block;visibility:hidden;clear:both;content:""}
.bo_sch h3 {padding:15px;border-bottom:1px solid #e8e8e8}
.bo_sch legend {background:red}
.bo_sch form {padding:15px;display:block}
.bo_sch select {border:0;width:100%;height:40px;border:1px solid #d0d3db;border-radius:2px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075)}
.bo_sch .sch_bar {display:inline-block;width:100%;clear:both;margin-top:15px;border:1px solid #d0d3db;border-radius:2px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075)}
.bo_sch .sch_input {width:250px;height:38px;border:0;padding:0;background-color:transparent;float:left}
.bo_sch .sch_btn {height:38px;float:right;color:#656565;background:none;border:0;width:40px;font-size:15px}
.bo_sch .bo_sch_cls {position:absolute;right:0;top:0;color:#b5b8bb;border:0;padding:12px 15px;font-size:16px;background:#fff}
.bo_sch_bg {background:#000;background:rgba(0,0,0,0.1);width:100%;height:100%}

/* 게시판 쓰기 */
#char_count_desc {display:block;margin:0 0 5px;padding:0}
#char_count_wrap {margin:5px 0 0;text-align:right}
#char_count {font-weight:bold}

#autosave_wrapper {position:relative}
#autosave_pop {display:none;z-index:10;position:absolute !important;top:34px;right:0;width:350px;height:auto !important;height:180px;max-height:180px;border:1px solid #565656;background:#fff;
-webkit-box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2)}
#autosave_pop:before {content:"";position:absolute;top:-8px;right:45px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #000 transparent}
#autosave_pop:after {content:"";position:absolute;top:-7px;right:45px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #fff transparent}
html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div {text-align:center;margin:0 !important}
#autosave_pop button {margin:0;padding:0;border:0}
#autosave_pop ul {padding:15px;border-top:1px solid #e9e9e9;list-style:none;overflow-y:scroll;height:130px;border-bottom:1px solid #e8e8e8}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #fff;background:#eee;zoom:1}
#autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""}
#autosave_pop a {display:block;float:left}
#autosave_pop span {display:block;float:right;font-size:0.92em;font-style:italic;color:#999}
.autosave_close {cursor:pointer;width:100%;height:30px;background:none;color:#888;font-weight:bold;font-size:0.92em}
.autosave_close:hover {background:#f3f3f3;color:#3597d9}
.autosave_content {display:none}
.autosave_del {background:url(./img/close_btn.png) no-repeat 50% 50%;text-indent:-999px;overflow:hidden;height:20px;width:20px}

/* 게시판 읽기 */
#bo_v {margin-bottom:20px;background:#fff;box-sizing:border-box}

#bo_v_table {position:absolute;top:0;right:16px;margin:0;padding:0 5px;height:25px;background:#ff3061;color:#fff;font-weight:bold;line-height:2.2em}

#bo_v_title {}
#bo_v_title .bo_v_cate {display:inline-block;line-height:20px;background:#e2eaf6;color:#3a8afd;padding:0 10px;border-radius:3px;}
#bo_v_title .bo_v_tit {display:block;font-size:2em;margin:5px 0 0;word-break:break-all}

#bo_v_info {margin:0;border-bottom:1px solid #f1f1f1;color:#666}
#bo_v_info:after {display:block;visibility:hidden;clear:both;content:""} 
#bo_v_info h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}

#bo_v_info .profile_info {margin:20px 0 10px;display:inline-block;float:left}
#bo_v_info .profile_info .pf_img {float:left;margin-right:10px}
#bo_v_info .profile_info .pf_img img {border-radius:50%;width:50px;height:50px}
#bo_v_info .profile_info .profile_info_ct {float:left;padding:5px 0;line-height:18px}

#bo_v_info strong {display:inline-block;margin:0 10px 0 0;font-weight:normal}
#bo_v_info .sv_member,
#bo_v_info .sv_guest,
#bo_v_info .member,
#bo_v_info .guest {font-weight:bold}
#bo_v_info .profile_img {display:none}
#bo_v_info .sv_member {color:#000}
#bo_v_info .if_date {margin:0;color:#888}

#bo_v_file h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_file ul {margin:0;list-style:none}
#bo_v_file li {padding:15px;position:relative;margin:10px 0;border:1px solid #dfdfdf;border-radius:5px;
-webkit-box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%);
-moz-box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%);
box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%)}
#bo_v_file li i {float:left;color:#b2b2b2;font-size:2.35em;margin-right:20px}
#bo_v_file a {float:left;display:block;text-decoration:none;word-wrap:break-word;color:#000}
#bo_v_file a:focus, #bo_v_file li:hover a, #bo_v_file a:active {text-decoration:underline;color:#3a8afd}
#bo_v_file img {float:left;margin:0 10px 0 0}
#bo_v_file .bo_v_file_cnt {color:#b2b2b2;font-size:0.92em}
#bo_v_file li:hover {border-color:#bed4f4;color:#bed4f4}
#bo_v_file li:hover i {color:#3a8afd}
#bo_v_file li:hover .bo_v_file_cnt {color:#99c2fc}


#bo_v_link h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_file ul {margin:0;list-style:none}
#bo_v_link li {padding:15px;position:relative;margin:10px 0;border:1px solid #dfdfdf;border-radius:5px;
-webkit-box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%);
-moz-box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%);
box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%)}
#bo_v_link li i {float:left;color:#b2b2b2;font-size:2.35em;margin-right:20px}
#bo_v_link a {float:left;display:block;text-decoration:none;word-wrap:break-word;color:#000}
#bo_v_link a:focus, #bo_v_link li:hover a, #bo_v_link a:active {text-decoration:underline;color:#3a8afd}
#bo_v_link .bo_v_link_cnt {color:#b2b2b2;font-size:0.92em}
#bo_v_link li:hover {border-color:#bed4f4;color:#bed4f4}
#bo_v_link li:hover i {color:#3a8afd}
#bo_v_link li:hover .bo_v_link_cnt {color:#99c2fc}

#bo_v_top {zoom:1}
#bo_v_top:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_top h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_top ul {padding:0;list-style:none;word-break:break-all;background:#fff}

#bo_v_bot {zoom:1}
#bo_v_bot:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_bot h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_bot ul {padding:0;list-style:none}

.bo_v_com {margin:20px 0;float:right}
.bo_v_com > li {position:relative;float:left;margin-left:5px}

.bo_v_nb {position:relative;margin:20px 0;clear:both;text-align:left}
.bo_v_nb:after {display:block;visibility:hidden;clear:both;content:""}
.bo_v_nb li {border-top:1px solid #f1f1f1;padding:13px}
.bo_v_nb li:last-child {border-bottom:1px solid #f1f1f1}
.bo_v_nb li:hover {background:#f6f6f6}
.bo_v_nb li i {font-size:13px;color:#b3b3b3}
.bo_v_nb li .nb_tit {display:inline-block;padding-right:20px;color:#b3b3b3}
.bo_v_nb li .nb_date {float:right;color:#b3b3b3}

#bo_v_atc {min-height:200px;height:auto !important;height:200px}
#bo_v_atc_title {position:absolute;font-size:0;line-height:0;overflow:hidden}

#bo_v_img {width:100%;overflow:hidden;zoom:1}
#bo_v_img:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_img a.view_image {display:block}
#bo_v_img img {margin-bottom:20px;max-width:100%;height:auto}

#bo_v_con {margin:10px 0 30px;width:100%;line-height:1.7em;min-height:200px;word-break:break-all;overflow:hidden}
#bo_v_con a {color:#000;text-decoration:underline}
#bo_v_con img {max-width:100%;height:auto}

#bo_v_act {margin-bottom:30px;text-align:center}
#bo_v_act .bo_v_act_gng {position:relative}
#bo_v_act a {margin-right:5px;vertical-align:middle;color:#4a5158}
#bo_v_act a:hover {background-color:#fff;color:#ff484f;border-color:#ff484f}
#bo_v_act i {font-size:1.4em;margin-right:5px}
#bo_v_act_good, #bo_v_act_nogood {display:none;position:absolute;top:30px;left:0;z-index:9999;padding:10px 0;width:165px;background:#ff3061;color:#fff;text-align:center}
#bo_v_act .bo_v_good {display:inline-block;border:1px solid #dedede;width:70px;line-height:46px;border-radius:30px}
#bo_v_act .bo_v_nogood {display:inline-block;border:1px solid #dedede;width:70px;line-height:46px;border-radius:30px}

#bo_v_sns {padding:0;list-style:none;zoom:1;float:left;display:inline-block}
#bo_v_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_sns li {float:left;width:135px;margin-right:5px;text-align:left}
#bo_v_sns li a {height:35px;line-height:35px;text-align:center;border-radius:5px;color:#fff;font-size:0.95em}
#bo_v_sns li img {vertical-align:middle;margin-right:5px}
#bo_v_sns li .sns_f {display:block;background:#3b5997}
#bo_v_sns li .sns_t {display:block;background:#09aeee}
#bo_v_sns li .sns_g {display:block;background:#ea4026}
#bo_v_sns li .sns_k {display:block;background:#fbe300}

#bo_v_share {position:relative;padding:20px 0}
#bo_v_share:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_share .btn {padding:0 10px;color:#555;font-weight:normal;font-size:1em;width:80px;line-height:35px;height:35px;border-color:#d5d5d5;border-radius:5px}
#bo_v_share .btn:hover {background:#fff}
#bo_v_share .btn i {margin-right:5px;color:#4b5259;vertical-align:middle}

/* 게시판 댓글 */
.cmt_btn {width:100%;text-align:left;border:0;border-bottom:1px solid #f0f0f0;background:#fff;font-weight:bold;margin:30px 0 0px;padding:0 0 15px}
.cmt_btn span.total {position:relative;display:inline-block;margin-right:5px;font-size:1em;color:#3a8afd}
.cmt_btn span.cmt_more {float:right;display:inline-block;width:15px;height:10px;background:url(./img/btn_cmt.png) no-repeat right 2px;margin-top:5px}
.cmt_btn_op span.cmt_more {background-position:right -8px}
.cmt_btn b {font-size:1.2em;color:#000}
.cmt_btn span.total:after {position:absolute;bottom:-17px;left:0;display:inline-block;background:#3a8afd;content:"";width:100%;height:2px}
#bo_vc {}
#bo_vc h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_vc article {margin:20px 0;position:relative;border-bottom:1px solid #f0f0f0}
#bo_vc article:after {display:block;visibility:hidden;clear:both;content:""}
#bo_vc article .profile_img img {border-radius:50%}
#bo_vc article .pf_img {float:left;margin-right:10px}
#bo_vc article .pf_img img {border-radius:50%;width:50px;height:50px}
#bo_vc article .cm_wrap {float:left;max-width:870px;width:90%}
#bo_vc header {position:relative;width:100%}
#bo_vc header:after {display:block;visibility:hidden;clear:both;content:""}
#bo_vc header .profile_img {display:none}
#bo_vc header .icon_reply {position:absolute;top:15px;left:-20px}
#bo_vc .member, #bo_vc .guest, #bo_vc .sv_member, #bo_vc .sv_guest {font-weight:bold}
.bo_vc_hdinfo {color:#777}
#bo_vc h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_vc .cmt_contents {line-height:1.8em;padding:0 0 20px}
#bo_vc p a {text-decoration:underline}
#bo_vc p a.s_cmt {text-decoration:underline;color:#ed6479}
#bo_vc_empty {margin:0;padding:80px 0 !important;color:#777;text-align:center}
#bo_vc #bo_vc_winfo {float:left}
#bo_vc .bo_vl_opt {position:absolute;top:0;right:0}

.bo_vc_act {display:none;position:absolute;right:0;top:40px;width:58px;text-align:right;border:1px solid #b8bfc4;margin:0;list-style:none;background:#fff;zoom:1;z-index:9999}
.bo_vc_act:before {content:"";position:absolute;top:-8px;right:5px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #b8bfc4 transparent}
.bo_vc_act:after {content:"";position:absolute;top:-6px;right:5px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #fff transparent}
.bo_vc_act li {border-bottom:1px solid #f0f0f0}
.bo_vc_act li:last-child {border-bottom:0}
.bo_vc_act li a {display:inline-block;padding:10px 15px}
.bo_vc_act li a:hover {color:#3a8afd}

.bo_vc_w {position:relative;margin:10px 0;display:block}
.bo_vc_w:after {display:block;visibility:hidden;clear:both;content:""}
.bo_vc_w h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.bo_vc_w #char_cnt {display:block;margin:0 0 5px}
.bo_vc_w textarea {border:1px solid #ccc;background:#fff;color:#000;vertical-align:middle;border-radius:3px;padding:5px;width:100%;height:120px;
-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1)}
#wr_secret {}
.bo_vc_w_info {margin:10px 0;float:left}
.bo_vc_w_info:after {display:block;visibility:hidden;clear:both;content:""}
.bo_vc_w_info .frm_input {float:left;margin-right:5px}
.bo_vc_w_info #captcha {padding-top:10px;display:block;clear:both}
.bo_vc_w .btn_confirm {clear:both;margin-top:10px}
.bo_vc_w .btn_confirm label {display:inline-block;margin-right:10px;border-radius:3px;font-size:1.5em;text-align:center}
.bo_vc_w .btn_submit {height:45px;padding:0 20px;border-radius:3px;font-weight:bold;font-size:1.083em}
.bo_vc_w .btn_confirm .secret_cm label {font-size:1em !important}
.bo_vc_w_wr:after {display:block;visibility:hidden;clear:both;content:""}
.secret_cm {display:inline-block;float:left}

#bo_vc_send_sns {display:inline-block;float:left}
#bo_vc_sns {display:inline-block;margin:0;padding:0;list-style:none;zoom:1}
#bo_vc_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_vc_sns li {float:left;margin:0 5px 0 0}
#bo_vc_sns .sns_li_f {border-radius:3px;background:#3a589b;height:40px;line-height:40px;padding:0 0 0 10px}
#bo_vc_sns .sns_li_t {border-radius:3px;background:#00aced;height:40px;line-height:40px;padding:0 0 0 10px}
#bo_vc_sns .sns_li_off {background:#bbb}
#bo_vc_sns a {display:inline-block;padding:0 15px 0 5px}
#bo_vc_sns input {margin:0 5px 0 0}

/*글쓰기*/
#bo_w .bo_v_option li {display:inline-block;float:left;text-align:left;margin:0 5px 0 0}
#bo_w .bo_v_option li label {vertical-align:baseline}
#bo_w .bo_v_option .chk_box input[type="checkbox"] + label span {margin-left:0;margin-right:5px}
#bo_w .write_div {margin:10px 0;position:relative}
#bo_w .write_div:after {display:block;visibility:hidden;clear:both;content:""}
#bo_w .bo_w_info:after {display:block;visibility:hidden;clear:both;content:""}
#bo_w .bo_w_info .frm_input {float:left;margin-bottom:1%}
#bo_w #wr_password, #bo_w #wr_homepage {margin-left:1%}
#bo_w .wr_content.smarteditor2 iframe {background:#fff}
#bo_w .bo_w_tit {position:relative}
#bo_w .bo_w_tit .frm_input {padding-right:120px}
#bo_w .bo_w_tit #btn_autosave {position:absolute;top:5px;right:5px;line-height:30px;height:30px}
#bo_w .bo_w_link label {position:absolute;top:1px;left:1px;border-radius:3px 0 0 3px;height:38px;line-height:38px;width:40px;font-size:1.2em;text-align:center;color:#b2b2b2}
#bo_w .bo_w_link .frm_input {padding-left:50px}
#bo_w .bo_w_flie .lb_icon {position:absolute;top:0px;left:0px;border-radius:3px 0 0 3px;height:38px;line-height:38px;width:40px;font-size:1.2em;text-align:center;color:#b2b2b2}
#bo_w .bo_w_flie .frm_file {padding-left:50px;margin-top:3px}
#bo_w .bo_w_flie .file_wr {position:relative;border:1px solid #ccc;background:#fff;color:#000;vertical-align:middle;border-radius:3px;padding:5px;height:40px;margin:0}
#bo_w .bo_w_flie .frm_input {margin:10px 0 0}
#bo_w .bo_w_flie .file_del {position:absolute;top:10px;right:10px;font-size:0.92em;color:#7d7d7d}
#bo_w .bo_w_select select {border:1px solid #d0d3db;width:100%;height:40px;border-radius:3px}
#bo_w .btn_submit {padding:0 20px;font-size:1.167em}
#bo_w .btn_cancel {border-radius:3px;font-size:1.167em}
/* ============================================================
   tubevideo skin — 유튜브 / 비메오 영상 게시판
   ============================================================ */

.tv_wrap {
    --tv-radius: 12px;
    --tv-line: #e5e7eb;
    --tv-muted: #6b7280;
    --tv-text: #111827;
    --tv-bg-thumb: #0f1115;
    --tv-yt: #ff0033;
    --tv-vm: #1ab7ea;
    --tv-shadow: 0 1px 2px rgba(17,24,39,.06), 0 8px 24px rgba(17,24,39,.06);
}

/* --- 상단 정보줄 ---
   ★ overflow:hidden 을 쓰면 안 된다.
   "게시판 리스트 옵션" 드롭다운(.more_opt)이 position:absolute; top:45px 으로
   이 줄 아래로 튀어나오는데, overflow:hidden 이면 그대로 잘려서 안 보인다.
   float 정리용이었으므로 flex 로 바꿔 clearfix 자체를 없앤다. */
.tv_top {display:flex;align-items:center;justify-content:flex-start;gap:14px;flex-wrap:wrap;
         padding:0 0 14px;border-bottom:1px solid var(--tv-line);margin-bottom:18px}
.tv_total {font-size:1.05em;color:var(--tv-text);line-height:1.4}
.tv_total strong {color:var(--tv-yt);font-weight:700}
.tv_total .tv_page {color:var(--tv-muted);font-size:.9em;margin-left:8px}

/* ul/li 의 float 을 푼다 — flex 안에서 float 는 정렬을 어긋나게 한다.
   li 의 고정폭(40px)도 없앤다. 아이콘만 있는 버튼과 글자가 있는 버튼의
   폭이 달라야 해서, 내용에 맞게 늘어나도록 auto 로 둔다. */
.tv_top .btn_bo_user {float:none;margin:0;display:flex;align-items:center;gap:4px}
.tv_top .btn_bo_user > li {float:none;width:auto;margin-left:0;background:none}

/* 기본 테마의 .btn 은 35px 높이에 font-size:1.4em 이라 이 줄에서 과하게 크다.
   여기서만 줄인다(다른 스킨/페이지는 그대로). */
.tv_top .btn_bo_user .btn,
.tv_top .btn_bo_user a.btn,
.tv_top .btn_bo_user button.btn {
    height:30px;line-height:30px;padding:0 9px;font-size:.95em;font-weight:600;
    border-radius:8px;border:1px solid var(--tv-line);background:#fff;color:var(--tv-muted)
}
.tv_top .btn_bo_user .btn:hover,
.tv_top .btn_bo_user a.btn:hover,
.tv_top .btn_bo_user button.btn:hover {border-color:#c7cbd3;color:var(--tv-text);background:#fafafa}
.tv_top .btn_bo_user .btn_admin {color:#d13f4a}
.tv_top .btn_bo_user .btn_admin:hover {color:#ff3746;border-color:#f0c4bd;background:#fdf0ee}
/* 드롭다운 위치도 버튼 높이에 맞춘다 (기본 45px 은 30px 버튼에선 뜬다) */
.tv_top .more_opt {top:36px}
/* 글자가 붙는 버튼이라 아이콘 버튼보다 좌우 여백을 조금 더 준다
   (!important 는 .btn 의 padding 을 이기기 위해 원래부터 있던 것) */
.tv_btn_write {padding:0 12px !important}
.tv_btn_tx {margin-left:4px}
.tv_allchk {margin:0 0 12px}

/* --- 정렬 --- */
.tv_sort {display:flex;gap:6px;margin:0 0 18px;flex-wrap:wrap}
.tv_sort__item {
    display:inline-block;padding:6px 14px;border-radius:999px;
    border:1px solid var(--tv-line);background:#fff;
    color:var(--tv-muted);font-size:.9em;line-height:1.5;text-decoration:none;
}
.tv_sort__item:hover {border-color:#c7cbd3;color:var(--tv-text);text-decoration:none}
.tv_sort__item.is-on {background:var(--tv-text);border-color:var(--tv-text);color:#fff;font-weight:700}

/* --- 세로 영상 --- */
/* 세로 카드는 썸네일만 9:16 으로 바꾼다. 카드 폭은 그대로라 그리드 열이 흐트러지지 않고,
   대신 카드 높이가 달라지므로 .tv_item 을 align-self:start 로 둬 아래가 늘어나지 않게 한다. */
.tv_item {align-self:start}
.tv_item--v .tv_thumb {aspect-ratio:9/16}
/* 쇼츠 썸네일은 유튜브가 16:9 로 레터박스를 넣어 주는 경우가 있어, 잘라서 채운다 */
.tv_item--v .tv_thumb img {object-fit:cover}

/* 세로/가로 구분선 — 그리드 한 줄 전체를 차지한다 */
.tv_divider {
    grid-column:1 / -1;
    margin:6px 0 -6px;
    font-size:.9em;font-weight:700;color:var(--tv-muted);
    display:flex;align-items:center;gap:10px;
}
.tv_divider::after {content:"";flex:1;height:1px;background:var(--tv-line)}
.tv_divider:first-child {margin-top:0}

/* --- 카테고리 --- */
.tv_cate {margin-bottom:16px}

/* --- 카드 그리드 --- */
.tv_grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
    gap:24px 18px;
    margin:0;padding:0;list-style:none;
}
.tv_item {min-width:0}
.tv_card {height:100%;display:flex;flex-direction:column}

/* --- 메이슨리 ---
   가로(16:9)와 세로(9:16) 카드가 섞이면 기본 그리드에서는 한 줄의 높이가 가장 큰 카드에
   맞춰져 가로 카드 아래에 큰 빈칸이 생긴다. 그래서 행을 잘게 쪼개고(--tv-row) 각 카드가
   제 높이만큼 행을 차지하게 한다.

   ★ is-masonry 클래스는 JS 가 붙인다.
     grid-auto-rows 를 CSS 에만 두면, JS 가 막히거나 실행 전인 순간에 모든 카드가 4px 로
     찌그러진다. 클래스 방식이면 그 경우 기존 격자 그대로 남는다(약간의 빈칸 < 깨진 화면). */
.tv_grid.is-masonry {
    --tv-row:4px;      /* 행 단위가 작을수록 정렬이 촘촘해진다 */
    --tv-row-gap:24px; /* 위 gap 의 세로값과 반드시 같아야 계산이 맞는다 */
    grid-auto-rows:var(--tv-row);
    row-gap:0;         /* 간격은 span 계산에 포함시키므로 그리드 자체 간격은 없앤다 */
    align-items:start;
}
.tv_grid.is-masonry > .tv_item,
.tv_grid.is-masonry > .tv_divider {
    /* JS 가 grid-row-end 를 채우기 전까지의 기본값 */
    grid-row-end:span 1;
    /* 간격은 전부 span 계산이 만든다. 마진이 남아 있으면 getBoundingClientRect 가
       마진을 빼고 재므로 그만큼 어긋난다. */
    margin:0;
}
/* 카드 높이를 재는 기준이 되므로, 열을 늘려 채우지 않게 한다 */
.tv_grid.is-masonry .tv_card {height:auto}

/* --- 썸네일 --- */
.tv_thumb {
    position:relative;
    aspect-ratio:16/9;
    border-radius:var(--tv-radius);
    overflow:hidden;
    background:var(--tv-bg-thumb);
    box-shadow:var(--tv-shadow);
}
.tv_thumb_link {display:block;width:100%;height:100%}
.tv_thumb img {
    width:100%;height:100%;
    object-fit:cover;
    display:block;
    transition:transform .35s ease, opacity .2s ease;
}
.tv_card:hover .tv_thumb img {transform:scale(1.05)}
.tv_noimg {
    display:flex;align-items:center;justify-content:center;
    width:100%;height:100%;
    color:#4b5563;font-size:2.4em;
}

/* --- 재생 버튼 --- */
.tv_play {
    position:absolute;inset:0;
    z-index:2;
    width:100%;height:100%;
    border:0;padding:0;
    background:transparent;
    cursor:pointer;
}
.tv_play_ico {
    position:absolute;top:50%;left:50%;
    transform:translate(-50%,-50%) scale(.92);
    width:54px;height:54px;
    border-radius:50%;
    background:rgba(15,17,21,.72) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M8 5.5v13l11-6.5z'/%3E%3C/svg%3E") no-repeat 52% 50%/22px 22px;
    box-shadow:0 4px 16px rgba(0,0,0,.35);
    opacity:0;
    transition:opacity .2s ease, transform .2s ease, background-color .2s ease;
}
.tv_thumb:hover .tv_play_ico,
.tv_play:focus .tv_play_ico {opacity:1;transform:translate(-50%,-50%) scale(1)}
.tv_play:hover .tv_play_ico {background-color:var(--tv-yt)}
.tv_play:focus {outline:none}
.tv_play:focus-visible {outline:3px solid #2563eb;outline-offset:-3px}

/* --- 뱃지 --- */
.tv_badge {
    display:inline-block;
    padding:3px 8px;
    border-radius:5px;
    font-size:.72em;font-weight:700;line-height:1.4;
    letter-spacing:.02em;
    color:#fff;
    vertical-align:middle;
}
.tv_thumb .tv_badge {position:absolute;left:8px;bottom:8px;z-index:3;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.tv_badge_youtube {background:var(--tv-yt)}
.tv_badge_vimeo   {background:var(--tv-vm)}
.tv_badge_notice  {background:#111827;left:auto !important;right:8px}
.tv_chk {position:absolute;top:8px;left:8px;z-index:3}

/* --- 카드 본문 --- */
.tv_body {padding:12px 2px 0;display:flex;flex-direction:column;flex:1}
.tv_cate_link {
    display:inline-block;margin-bottom:6px;
    padding:2px 7px;border:1px solid var(--tv-line);border-radius:4px;
    font-size:.75em;color:var(--tv-muted);
}
.tv_cate_link:hover {border-color:#9ca3af;color:var(--tv-text)}
.tv_tit {
    display:block;
    font-size:1.02em;font-weight:600;line-height:1.45;
    color:var(--tv-text);
    max-height:2.9em;overflow:hidden;
    word-break:break-all;
}
.tv_tit:hover {text-decoration:underline}
.tv_desc {
    margin:6px 0 10px;
    font-size:.86em;line-height:1.5;color:var(--tv-muted);
    max-height:3em;overflow:hidden;
}
.tv_meta {
    margin-top:auto;
    font-size:.78em;color:var(--tv-muted);
    display:flex;align-items:center;gap:5px;
    white-space:nowrap;
}
.tv_meta .tv_name {max-width:90px;overflow:hidden;text-overflow:ellipsis}
.tv_dot {width:2px;height:2px;border-radius:50%;background:#c4c9d2;flex:0 0 2px}
.tv_meta_r {margin-left:auto}
.tv_meta_r i {margin:0 3px 0 7px;opacity:.8}

/* --- 조회수 (원본/사이트) --- */
.tv_hits {white-space:nowrap}
.tv_hits_sep {margin:0 1px;color:#c4c9d2}
.tv_hits_origin i {color:var(--tv-yt);opacity:1}
.tv_hits_origin i.fa-vimeo {color:var(--tv-vm)}
.tv_v_hits {white-space:nowrap}
.tv_v_hits .tv_hits_sep {margin:0 4px}
.tv_item_now .tv_thumb {outline:3px solid var(--tv-yt);outline-offset:2px}
.tv_item_notice .tv_tit {color:var(--tv-yt)}

/* --- 목록 없음 --- */
.tv_empty {
    grid-column:1/-1;
    padding:70px 20px;text-align:center;color:var(--tv-muted);
    border:1px dashed var(--tv-line);border-radius:var(--tv-radius);
}
.tv_empty i {font-size:2.6em;color:#d1d5db;display:block;margin-bottom:12px}
.tv_empty p {margin:0 0 16px}

/* --- 반응형 임베드 (16:9) --- */
.tv_embed {
    position:relative;
    aspect-ratio:16/9;
    background:#000;
    border-radius:var(--tv-radius);
    overflow:hidden;
}
.tv_embed iframe {position:absolute;inset:0;width:100%;height:100%;border:0}

/* --- 바로재생 모달 --- */
body.tv_modal_open {overflow:hidden}
.tv_modal {position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.tv_modal[hidden] {display:none}
.tv_modal_bg {position:absolute;inset:0;background:rgba(9,11,15,.82)}
.tv_modal_box {position:relative;width:100%;max-width:900px}
.tv_modal_head {display:flex;align-items:center;gap:12px;margin-bottom:10px}
.tv_modal_head strong {
    flex:1;color:#fff;font-size:1.05em;font-weight:600;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.tv_modal_cls {
    flex:0 0 auto;width:34px;height:34px;
    border:0;border-radius:50%;
    background:rgba(255,255,255,.12);color:#fff;
    font-size:1.05em;cursor:pointer;
    transition:background-color .15s ease;
}
.tv_modal_cls:hover {background:rgba(255,255,255,.24)}
.tv_modal_player .tv_embed,
.tv_modal_player {position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--tv-radius);overflow:hidden}
.tv_modal_player iframe {position:absolute;inset:0;width:100%;height:100%;border:0}

/* --- 세로 영상 모달 (wr_9 = 'v') ---
   9:16 은 폭을 그대로 두면 세로가 화면 밖으로 나간다(900px 폭 → 1600px 높이).
   그래서 "쓸 수 있는 화면 높이"에서 거꾸로 폭을 계산해 씌운다.
   빼는 값 = 모달 상하 패딩(20*2) + 제목줄(약 44px) + 여유. */
.tv_modal--v .tv_modal_player {aspect-ratio:9/16}
.tv_modal--v .tv_modal_box {max-width:calc((100vh - 110px) * 9 / 16)}
/* 주소창이 접혔다 펴지는 모바일에서는 dvh 가 더 정확하다 (미지원 브라우저는 위 규칙 유지) */
@supports (height:100dvh) {
    .tv_modal--v .tv_modal_box {max-width:calc((100dvh - 110px) * 9 / 16)}
}

/* --- 본문 보기 --- */
.tv_view .tv_v_player {margin:0 0 20px}
.tv_view .tv_v_player .tv_embed {box-shadow:var(--tv-shadow)}

/* 세로 영상 상세 — 9:16 로 재생하고 가운데 정렬.
   폭은 500~640px 범위에서 화면 높이에 맞춰 정한다.
     · 창이 낮은 노트북: 500px 을 보장해 너무 작아지지 않게 (이전에는 270px 대까지 줄었다)
     · 세로로 긴 화면: 640px 을 넘지 않게 — 더 키우면 높이가 화면 몇 배가 된다
   본문이 그보다 좁으면 100% 가 이긴다. */
.tv_v_player--v .tv_embed {
    aspect-ratio:9/16;
    max-width:min(100%, 640px, max(500px, (100vh - 40px) * 9 / 16));
    margin:0 auto;
}
@supports (height:100dvh) {
    .tv_v_player--v .tv_embed {max-width:min(100%, 640px, max(500px, (100dvh - 40px) * 9 / 16))}
}
/* 모바일은 화면 폭이 곧 최대치 — 폭을 꽉 채운다 */
@media (max-width:640px) {
    .tv_v_player--v .tv_embed {max-width:100%}
}
.tv_view #bo_v_title {padding-bottom:6px}
.tv_v_source {margin:0 0 14px;padding:0 0 14px;border-bottom:1px solid var(--tv-line);font-size:.85em}
.tv_v_origin {margin-left:8px;color:var(--tv-muted)}
.tv_v_origin:hover {color:var(--tv-text);text-decoration:underline}

/* --- 쓰기 : 영상 URL --- */
.tv_w_video {
    padding:16px;margin-bottom:12px;
    border:1px solid var(--tv-line);border-radius:var(--tv-radius);
    background:#fafbfc;
}
.tv_w_label {display:block;margin-bottom:8px;font-weight:600;color:var(--tv-text)}
.tv_w_label i {color:var(--tv-yt);margin-right:4px}
.tv_w_status {margin:8px 0 0;font-size:.82em;color:var(--tv-muted);line-height:1.6}
.tv_w_status.tv_ok {color:#047857}
.tv_w_status.tv_ng {color:#b91c1c}
.tv_w_preview {margin-top:12px;max-width:420px}
.tv_w_preview[hidden] {display:none}

/* --- 모바일 --- */
@media screen and (max-width:768px) {
    .tv_grid {grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));gap:18px 12px}
    .tv_total {float:none;margin-bottom:8px;line-height:1.6}
    .tv_top .btn_bo_user {float:none}
    .tv_tit {font-size:.94em}
    .tv_desc {display:none}
    .tv_modal {padding:12px}
    .tv_play_ico {width:44px;height:44px;background-size:18px 18px;opacity:1}
}
@media screen and (max-width:480px) {
    .tv_grid {grid-template-columns:1fr}
    .tv_desc {display:block}
}

/* --- 상세 하단 : 관련 기사 · 관련 영상 · 배너 (news 스킨 하단과 동일 구성) --- */
.tv_newsec {margin:34px 0 0;padding-top:20px;border-top:2px solid #111827}
.tv_newsec_h {font-size:18px;font-weight:800;color:#111827;margin:0 0 8px}
.tv_newsec_h a {color:#111827;text-decoration:none}
.tv_newsec_h span {color:#9ca3af;font-weight:600}
.tv_news_list {list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 34px}
.tv_news_list li {border-top:1px solid #f2f2f2}
.tv_news_list li:nth-child(1), .tv_news_list li:nth-child(2) {border-top:0}
.tv_news_list li a {display:block;position:relative;padding:11px 0 11px 14px;color:#374151;font-size:15px;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv_news_list li a::before {content:"";position:absolute;left:3px;top:18px;width:3px;height:3px;border-radius:50%;background:#9ca3af}
.tv_news_list li a:hover {color:#2563eb}

.tv_relsec {margin:30px 0 0;padding-top:20px;border-top:2px solid #111827}
.tv_relsec_h {font-size:18px;font-weight:800;color:#111827;margin:0 0 16px}
.tv_relsec_h a {color:#111827;text-decoration:none}
.tv_relsec_h span {color:#9ca3af;font-weight:600}
.tv_relgrid {display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:18px 14px}
.tv_relcard {display:block;text-decoration:none}
.tv_relthumb {position:relative;display:block;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#111827}
.tv_relthumb img {width:100%;height:100%;object-fit:cover;display:block}
.tv_relplay {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);color:#fff;font-size:12px;padding-left:2px}
.tv_relcard:hover .tv_relplay {background:rgba(0,0,0,.75)}
.tv_reltitle {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:8px 1px 0;color:#1f2937;font-size:13.5px;font-weight:600;line-height:1.4}
.tv_relcard:hover .tv_reltitle {color:#2563eb}

.tv_hbanner {margin:28px 0;display:flex;justify-content:center}
.tv_hb_slot {display:flex;align-items:center;justify-content:center;width:100%;min-height:90px;border:1px dashed #d1d5db;border-radius:10px;background:#f9fafb;text-decoration:none}
.tv_hb_ph {color:#9ca3af;font-size:13.5px;text-align:center;line-height:1.5}
.tv_hb_ph small {display:block;font-size:11.5px;color:#c2c7cf}

@media screen and (max-width:768px) {
    .tv_relgrid {grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media screen and (max-width:640px) {
    .tv_news_list {grid-template-columns:1fr}
    .tv_news_list li:nth-child(2) {border-top:1px solid #f2f2f2}
}