@charset "utf-8";
/* =========================================================
   PM Basic — 에디토리얼 매거진 게시판 스킨 (글 게시판)
   매거진 페이지(#pm-mag)와 동일한 색상/타이포 톤
   모든 규칙은 .pm-skin 하위로 스코프
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,600&display=swap');

.pm-skin{
    --blue:#127bca; --navy:#1b3a6b; --ink:#1a1a1a; --gray:#5f6873;
    --line:#e4e9f0; --paper:#faf9f7; --tint:#f1f6fc;
    color:var(--ink);
    font-family:"Paperozi","Pretendard",-apple-system,"Malgun Gothic",sans-serif;
    max-width:1320px; margin:0 auto; padding:30px 24px 80px;
}
.pm-skin *{ box-sizing:border-box; }
.pm-skin a{ text-decoration:none; color:inherit; }
.pm-skin .serif{ font-family:"Crimson Text",serif; }
.pm-skin .sound_only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }

/* ===== 게시판 헤더 ===== */
.pm-skin .pm-bo-head{ padding:8px 0 22px; border-bottom:3px solid var(--ink); margin-bottom:0; }
.pm-skin .pm-bo-head .pm-kick{ display:inline-block; color:var(--blue); letter-spacing:5px;
    font-size:12px; font-weight:700; text-transform:uppercase; }
.pm-skin .pm-bo-head h2{ font-size:34px; font-weight:800; letter-spacing:-0.5px; margin:10px 0 0; line-height:1.2; }
.pm-skin .pm-bo-head .pm-bo-sub{ margin-top:10px; font-size:14px; color:var(--gray); }
.pm-skin .pm-bo-head .pm-bo-sub b{ color:var(--blue); font-weight:700; }

/* ===== 카테고리 ===== */
.pm-skin #bo_cate{ margin:24px 0 0; }
.pm-skin #bo_cate h2{ display:none; }
.pm-skin #bo_cate_ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.pm-skin #bo_cate_ul li a{ display:inline-block; padding:8px 18px; border:1px solid var(--line);
    border-radius:50px; font-size:14px; color:var(--gray); transition:all .2s; }
.pm-skin #bo_cate_ul li a:hover{ border-color:var(--blue); color:var(--blue); }
.pm-skin #bo_cate_ul li.gnph_li_on a,
.pm-skin #bo_cate_ul li a.on{ background:var(--blue); border-color:var(--blue); color:#fff; }

/* ===== 상단 툴바 ===== */
.pm-skin #bo_btn_top{ display:flex; justify-content:space-between; align-items:center; padding:20px 0 14px; gap:14px; }
.pm-skin #bo_list_total{ font-size:14px; color:var(--gray); }
.pm-skin #bo_list_total span{ color:var(--ink); font-weight:700; }
.pm-skin .btn_bo_user{ list-style:none; margin:0; padding:0; display:flex; gap:8px; align-items:center; position:relative; }
.pm-skin .btn_bo_user .btn{ display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border:1px solid var(--line); border-radius:9px; color:var(--gray);
    font-size:15px; transition:all .2s; background:#fff; cursor:pointer; }
.pm-skin .btn_bo_user .btn:hover{ border-color:var(--blue); color:var(--blue); }
.pm-skin .btn_bo_user a.btn_b01.btn[title="글쓰기"],
.pm-skin .bo_fx .btn_bo_user a[title="글쓰기"]{ width:auto; padding:0 20px; background:var(--blue); border-color:var(--blue); color:#fff; font-weight:700; }
.pm-skin .btn_bo_user a[title="글쓰기"]:hover{ background:var(--navy); }
.pm-skin .more_opt{ position:absolute; right:0; top:48px; background:#fff; border:1px solid var(--line);
    border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.1); padding:6px; list-style:none; margin:0; z-index:30; display:none; min-width:150px; }
.pm-skin .more_opt li button{ width:100%; text-align:left; background:none; border:none; padding:10px 14px;
    font-size:14px; color:var(--ink); cursor:pointer; border-radius:7px; }
.pm-skin .more_opt li button:hover{ background:var(--tint); color:var(--blue); }

/* ===== 목록 테이블 ===== */
.pm-skin .tbl_head01{ width:100%; }
.pm-skin .tbl_head01 table{ width:100%; border-collapse:collapse; table-layout:fixed; }
.pm-skin .tbl_head01 caption{ display:none; }
.pm-skin .tbl_head01 thead th{ padding:15px 10px; font-size:12.5px; letter-spacing:1px; font-weight:700;
    color:var(--gray); border-bottom:2px solid var(--ink); text-align:center; white-space:nowrap; }
.pm-skin .tbl_head01 thead th a{ color:var(--gray); }
.pm-skin .tbl_head01 thead th:nth-child(2){ width:80px; }   /* 번호 (체크박스 없을 때) */
.pm-skin .tbl_head01 td{ padding:18px 10px; border-bottom:1px solid var(--line); text-align:center;
    font-size:14px; color:var(--gray); vertical-align:middle; }
.pm-skin .tbl_head01 tbody tr:hover td{ background:var(--tint); }
.pm-skin .td_num2, .pm-skin .td_num{ width:80px; font-family:"Crimson Text",serif; font-size:16px; }
.pm-skin .td_name{ width:120px; }
.pm-skin .td_datetime{ width:110px; font-size:13px; }
.pm-skin .chk_box{ width:42px; }

.pm-skin .td_subject{ text-align:left; }
.pm-skin .bo_cate_link{ display:inline-block; color:var(--blue); border:1px solid var(--blue);
    border-radius:50px; padding:2px 11px; font-size:12px; margin-right:8px; vertical-align:middle; }
.pm-skin .bo_tit{ display:inline; }
.pm-skin .bo_tit a{ font-size:16px; font-weight:600; color:var(--ink); transition:color .2s; }
.pm-skin .bo_tit a:hover{ color:var(--blue); }
.pm-skin .new_icon{ display:inline-block; background:var(--blue); color:#fff; font-size:10px; font-weight:800;
    padding:2px 6px; border-radius:4px; margin-left:7px; vertical-align:middle; line-height:1.4; }
.pm-skin .cnt_cmt{ color:var(--blue); font-weight:700; margin-left:6px; font-size:14px; }
.pm-skin .notice_icon{ display:inline-block; background:var(--navy); color:#fff; font-size:11px; font-weight:700;
    padding:4px 11px; border-radius:50px; }
.pm-skin .bo_current{ color:var(--blue); font-weight:700; }
.pm-skin tr.bo_notice td{ background:var(--paper); }
.pm-skin tr.bo_notice .bo_tit a{ font-weight:700; }
.pm-skin .empty_table{ padding:80px 0 !important; text-align:center !important; color:var(--gray); font-size:15px; }

/* ===== 페이지네이션 ===== */
.pm-skin .pg_wrap{ display:flex; justify-content:center; margin:40px 0 0; }
.pm-skin .pg{ display:flex; gap:6px; align-items:center; }
.pm-skin .pg a, .pm-skin .pg strong{ display:inline-flex; align-items:center; justify-content:center;
    min-width:42px; height:42px; padding:0 12px; border:1px solid var(--line); border-radius:9px;
    font-size:14px; color:var(--gray); font-family:"Crimson Text",serif; }
.pm-skin .pg a:hover{ border-color:var(--blue); color:var(--blue); }
.pm-skin .pg strong.pg_current{ background:var(--blue); border-color:var(--blue); color:#fff; font-weight:700; }

/* ===== 하단 버튼 ===== */
.pm-skin .bo_fx{ display:flex; justify-content:flex-end; margin-top:24px; }

/* ===== 검색 ===== */
.pm-skin .bo_sch_wrap{ display:none; position:fixed; inset:0; z-index:1000; }
.pm-skin .bo_sch_bg{ position:absolute; inset:0; background:rgba(15,25,45,.5); }
.pm-skin .bo_sch{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    background:#fff; border-radius:16px; padding:36px; width:90%; max-width:460px; z-index:2; box-shadow:0 30px 70px rgba(0,0,0,.25); }
.pm-skin .bo_sch h3{ font-size:20px; font-weight:800; margin:0 0 20px; }
.pm-skin .bo_sch select{ width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:9px; margin-bottom:10px; font-size:15px; }
.pm-skin .bo_sch .sch_bar{ display:flex; gap:8px; }
.pm-skin .bo_sch .sch_input{ flex:1; padding:13px 14px; border:1px solid var(--line); border-radius:9px; font-size:15px; }
.pm-skin .bo_sch .sch_input:focus{ outline:none; border-color:var(--blue); }
.pm-skin .bo_sch .sch_btn{ width:52px; border:none; background:var(--blue); color:#fff; border-radius:9px; cursor:pointer; font-size:16px; }
.pm-skin .bo_sch_cls{ position:absolute; top:16px; right:16px; background:none; border:none; font-size:18px; color:var(--gray); cursor:pointer; }

/* =========================================================
   게시물 보기 (view)
   ========================================================= */
.pm-skin#bo_v{ max-width:1320px; }
.pm-skin #bo_v_title{ margin:0; }
.pm-skin #bo_v_title .bo_v_cate{ display:inline-block; color:var(--blue); border:1px solid var(--blue);
    border-radius:50px; padding:4px 14px; font-size:13px; font-weight:700; margin-bottom:18px; }
.pm-skin #bo_v_title .bo_v_tit{ display:block; font-size:34px; font-weight:800; line-height:1.35; letter-spacing:-0.5px; }
.pm-skin #bo_v_info{ display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:22px 0; margin:22px 0 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); flex-wrap:wrap; }
.pm-skin #bo_v_info h2{ display:none; }
.pm-skin .profile_info{ display:flex; align-items:center; gap:14px; }
.pm-skin .pf_img img{ width:44px; height:44px; border-radius:50%; object-fit:cover; }
.pm-skin .profile_info_ct{ font-size:13px; color:var(--gray); line-height:1.7; }
.pm-skin .profile_info_ct strong{ color:var(--ink); font-weight:700; margin-right:14px; }
.pm-skin .profile_info_ct .fa{ color:var(--blue); margin-right:4px; }
.pm-skin .profile_info_ct a{ color:var(--gray); }
.pm-skin #bo_v_top .btn_bo_user{ justify-content:flex-end; }

.pm-skin #bo_v_atc{ padding:14px 0 0; }
.pm-skin #bo_v_atc_title{ display:none; }
.pm-skin #bo_v_share{ display:flex; justify-content:flex-end; gap:8px; margin-bottom:10px; }
.pm-skin #bo_v_con{ font-size:16.5px; line-height:1.95; color:#2b313a; padding:40px 0 50px; min-height:160px; word-break:break-word; }
.pm-skin #bo_v_con img{ max-width:100%; height:auto; border-radius:6px; }
.pm-skin #bo_v_con p{ margin:0 0 16px; }

/* 추천/비추천 */
.pm-skin #bo_v_act{ display:flex; justify-content:center; gap:14px; margin:10px 0 40px; }
.pm-skin #bo_v_act a, .pm-skin #bo_v_act span.bo_v_good, .pm-skin #bo_v_act span.bo_v_nogood{
    display:inline-flex; align-items:center; gap:8px; padding:12px 26px; border:1px solid var(--line);
    border-radius:50px; font-size:14px; color:var(--gray); }
.pm-skin #bo_v_act a.bo_v_good:hover{ border-color:var(--blue); color:var(--blue); }
.pm-skin #bo_v_act strong{ font-family:"Crimson Text",serif; font-size:17px; color:var(--ink); }

/* 첨부/링크 */
.pm-skin #bo_v_file, .pm-skin #bo_v_link{ background:var(--paper); border-radius:12px; padding:22px 26px; margin-top:20px; }
.pm-skin #bo_v_file h2, .pm-skin #bo_v_link h2{ font-size:14px; font-weight:800; color:var(--navy); margin:0 0 12px; letter-spacing:1px; }
.pm-skin #bo_v_file ul, .pm-skin #bo_v_link ul{ list-style:none; margin:0; padding:0; }
.pm-skin #bo_v_file li, .pm-skin #bo_v_link li{ padding:8px 0; font-size:14px; }
.pm-skin #bo_v_file .fa, .pm-skin #bo_v_link .fa{ color:var(--blue); margin-right:8px; }
.pm-skin .bo_v_file_cnt, .pm-skin .bo_v_link_cnt{ color:var(--gray); font-size:12px; }

/* 이전/다음글 */
.pm-skin .bo_v_nb{ list-style:none; margin:34px 0 0; padding:0; border-top:1px solid var(--line); }
.pm-skin .bo_v_nb li{ display:flex; align-items:center; gap:14px; padding:16px 4px; border-bottom:1px solid var(--line); }
.pm-skin .bo_v_nb .nb_tit{ font-size:13px; font-weight:700; color:var(--blue); min-width:74px; }
.pm-skin .bo_v_nb a{ flex:1; font-size:15px; color:var(--ink); }
.pm-skin .bo_v_nb a:hover{ color:var(--blue); }
.pm-skin .bo_v_nb .nb_date{ font-size:12px; color:var(--gray); }

/* =========================================================
   글쓰기 / 수정 (write)
   ========================================================= */
.pm-skin#bo_w{ max-width:1320px; }
.pm-skin #bo_w .write_div{ margin-bottom:14px; }
.pm-skin .bo_w_info{ display:flex; gap:12px; flex-wrap:wrap; }
.pm-skin .frm_input{ width:100%; padding:14px 16px; border:1px solid var(--line); border-radius:10px;
    font-size:15px; font-family:inherit; color:var(--ink); background:#fff; transition:border-color .2s; }
.pm-skin .frm_input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(18,123,202,.12); }
.pm-skin .half_input{ flex:1; min-width:200px; }
.pm-skin select#ca_name{ width:100%; padding:14px 16px; border:1px solid var(--line); border-radius:10px; font-size:15px; }
.pm-skin .bo_v_option{ list-style:none; margin:0; padding:0; display:flex; gap:18px; flex-wrap:wrap; }
.pm-skin .bo_v_option .chk_box{ display:flex; align-items:center; gap:7px; font-size:14px; color:var(--gray); }
.pm-skin .wr_content textarea, .pm-skin #wr_content{ width:100%; min-height:320px; padding:16px;
    border:1px solid var(--line); border-radius:10px; font-size:15px; line-height:1.8; font-family:inherit; resize:vertical; }
.pm-skin .wr_content textarea:focus{ outline:none; border-color:var(--blue); }
.pm-skin #char_count_desc{ font-size:13px; color:var(--gray); margin:0 0 8px; }
.pm-skin #char_count_wrap{ text-align:right; font-size:12px; color:var(--gray); margin-top:6px; }
.pm-skin .bo_w_link label, .pm-skin .file_wr label{ display:inline-flex; align-items:center; gap:6px;
    font-size:13px; color:var(--gray); margin-bottom:6px; }
.pm-skin .frm_file{ font-size:14px; }
.pm-skin .file_del{ font-size:13px; color:var(--gray); display:inline-block; margin-top:6px; }
.pm-skin .btn_confirm{ display:flex; justify-content:center; gap:12px; margin-top:30px; }
.pm-skin .btn_submit{ background:var(--blue); color:#fff; border:none; padding:15px 50px; border-radius:50px;
    font-size:16px; font-weight:700; cursor:pointer; transition:background .2s; }
.pm-skin .btn_submit:hover{ background:var(--navy); }
.pm-skin .btn_cancel{ display:inline-flex; align-items:center; padding:15px 40px; border:2px solid var(--line);
    border-radius:50px; font-size:16px; font-weight:700; color:var(--gray); }
.pm-skin .btn_cancel:hover{ border-color:var(--ink); color:var(--ink); }

/* =========================================================
   댓글 (comment)
   ========================================================= */
.pm-skin .cmt_btn{ display:inline-flex; align-items:center; gap:8px; background:none; border:none;
    font-size:16px; font-weight:800; color:var(--ink); cursor:pointer; margin:46px 0 18px; padding:0; }
.pm-skin .cmt_btn .total b{ color:var(--blue); }
.pm-skin #bo_vc{ }
.pm-skin #bo_vc > h2{ display:none; }
.pm-skin #bo_vc article{ display:flex; gap:14px; padding:22px 0; border-top:1px solid var(--line); position:relative; }
.pm-skin #bo_vc .pf_img img{ width:42px; height:42px; border-radius:50%; object-fit:cover; }
.pm-skin #bo_vc .cm_wrap{ flex:1; }
.pm-skin #bo_vc header{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.pm-skin #bo_vc header h2{ display:none; }
.pm-skin #bo_vc header > *:not(h2){ font-size:14px; font-weight:700; color:var(--ink); }
.pm-skin #bo_vc .bo_vc_hdinfo{ font-size:12px; color:var(--gray); font-weight:400; }
.pm-skin #bo_vc .bo_vc_hdinfo .fa{ color:var(--blue); }
.pm-skin .cmt_contents{ margin-top:8px; font-size:15px; line-height:1.8; color:#2b313a; }
.pm-skin .cmt_contents p{ margin:0; }
.pm-skin .bo_vl_opt{ position:absolute; top:22px; right:0; }
.pm-skin .btn_cm_opt{ background:none; border:1px solid var(--line); border-radius:8px; width:34px; height:34px; color:var(--gray); cursor:pointer; }
.pm-skin .bo_vc_act{ display:none; position:absolute; right:0; top:40px; background:#fff; border:1px solid var(--line);
    border-radius:10px; box-shadow:0 10px 26px rgba(0,0,0,.12); list-style:none; margin:0; padding:6px; min-width:96px; z-index:20; }
.pm-skin .bo_vc_act li a{ display:block; padding:9px 14px; font-size:13px; border-radius:7px; }
.pm-skin .bo_vc_act li a:hover{ background:var(--tint); color:var(--blue); }
.pm-skin #bo_vc_empty{ padding:40px 0; text-align:center; color:var(--gray); border-top:1px solid var(--line); }

/* 댓글 쓰기 */
.pm-skin #bo_vc_w{ background:var(--paper); border-radius:14px; padding:24px; margin-top:24px; }
.pm-skin #bo_vc_w h2{ font-size:15px; font-weight:800; margin:0 0 14px; color:var(--navy); }
.pm-skin #bo_vc_w textarea{ width:100%; min-height:110px; padding:14px; border:1px solid var(--line);
    border-radius:10px; font-size:15px; line-height:1.7; font-family:inherit; resize:vertical; }
.pm-skin #bo_vc_w textarea:focus{ outline:none; border-color:var(--blue); }
.pm-skin #char_cnt{ font-size:12px; color:var(--gray); }
.pm-skin .bo_vc_w_wr{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:12px; flex-wrap:wrap; }
.pm-skin .bo_vc_w_info{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.pm-skin .bo_vc_w_info input{ padding:11px 14px; border:1px solid var(--line); border-radius:9px; font-size:14px; }
.pm-skin .btn_confirm{ display:flex; align-items:center; gap:14px; }
.pm-skin .secret_cm{ display:flex; align-items:center; gap:6px; font-size:14px; color:var(--gray); }
.pm-skin #bo_vc_w .btn_submit{ padding:13px 34px; font-size:15px; }

/* =========================================================
   반응형
   ========================================================= */
@media (max-width:767px){
    .pm-skin{ padding:20px 16px 60px; }
    .pm-skin .pm-bo-head h2{ font-size:25px; }
    .pm-skin #bo_v_title .bo_v_tit{ font-size:25px; }

    /* 목록 테이블 → 카드형 스택 */
    .pm-skin .tbl_head01 table{ table-layout:auto; }
    .pm-skin .tbl_head01 thead{ display:none; }
    .pm-skin .tbl_head01 tbody tr{ display:block; padding:16px 4px; border-bottom:1px solid var(--line); }
    .pm-skin .tbl_head01 tbody tr:hover td{ background:none; }
    .pm-skin .tbl_head01 td{ display:inline; border:none; padding:0; text-align:left; }
    .pm-skin .td_num2{ display:none; }
    .pm-skin .td_subject{ display:block !important; margin-bottom:8px; }
    .pm-skin .bo_tit a{ font-size:16px; }
    .pm-skin .td_name::before{ content:"\f007"; font-family:FontAwesome; color:var(--blue); margin-right:5px; font-size:11px; }
    .pm-skin .td_name{ font-size:13px; color:var(--gray); }
    .pm-skin .td_name::after{ content:"·"; margin:0 8px; color:var(--line); }
    .pm-skin .td_datetime{ font-size:13px; color:var(--gray); }
    .pm-skin .td_num{ display:none; }
    .pm-skin .chk_box{ display:none !important; }

    .pm-skin #bo_v_info{ }
    .pm-skin #bo_v_con{ font-size:16px; padding:30px 0 40px; }
    .pm-skin .bo_w_info{ flex-direction:column; }
}