/* 게시판 목록·보기 공통 (theme/shared/board_list.inc.php · board_view.inc.php, 국문·영문) — 2026-10
   줄 목록: 공지사항 · 협력파트너 학술행사 · 회원 전용 자료실 · 학술대회/학술집담회 공지
   카드: 보도자료 · 학술자료실 · 포토갤러리 · KAID insight(표지) · 동영상 갤러리 · VOD 자료실(영상)
   온라인 강의·지난 학술대회와 같은 규칙: 주색 #495FA1, 강조 #1A264B, 경계 #E5E5EC, 면 #F8F8FA,
   본문 #111/#505050, 보조 #767676, 모서리 4px, 알약 배지·이모지·그림자·부양 호버 없음, rem 단위.
   .ev-btn 은 conference_page.css, .ol-tag · .ol-count · .ol-filter · .ol-nav 는 online_lecture.css 것을 쓴다. */

/* 분류 */
.bk-cate{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:3.2rem}
.bk-cate a{display:inline-flex;align-items:center;min-height:4.4rem;padding:0 1.8rem;border:1px solid #E5E5EC;border-radius:4px;font-size:1.5rem;color:#505050;background:#fff;transition:border-color .2s,color .2s}
.bk-cate a:hover{border-color:#495FA1;color:#495FA1}
.bk-cate a.on{background:#495FA1;border-color:#495FA1;color:#fff;font-weight:600}
.bk .bk-sub{margin-bottom:1.6rem}

/* 안내 상자 (근조기 신청) */
.bk-intro{margin-bottom:3.2rem;padding:2.4rem 2.8rem;border:1px solid #E5E5EC;border-radius:4px;background:#F8F8FA;font-size:1.5rem;line-height:1.75;color:#505050;word-break:keep-all}
.bk-intro h4{margin-bottom:.8rem;font-size:1.7rem;font-weight:600;color:#111}
.bk-intro dl{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.6rem;margin:1.2rem 0 0}
.bk-intro dt{font-weight:600;color:#111}
.bk-intro dd{margin:0}

/* 위: 건수 · 검색 */
.bk-top{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;margin-bottom:1.6rem}
.bk-top .ol-count{margin-right:auto}
.bk-top .bk-sch{margin:0}
.bk-top .bk-sch input{width:22rem}

/* 관리 단추 (관리자에게만) */
.bk-adm{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.6rem;margin-bottom:1.2rem}
.bk-adm .ev-btn{min-height:3.6rem;padding:0 1.4rem;font-size:1.4rem}

/* 목록 */
.bk-list{border-top:2px solid #1A264B;margin:0;padding:0;list-style:none}
.bk-row{display:grid;grid-template-columns:var(--bk-grid);align-items:center;gap:1.6rem;padding:2rem 1.2rem;border-bottom:1px solid #E5E5EC;font-size:1.5rem;color:#767676}
.bk-row>span{min-width:0;font-size:1.5rem}   /* 물려받은 크기가 휴대폰에서 커지는 일이 있어 칸마다 정한다 */
.bk-row .c-num,.bk-row .c-file,.bk-row .c-date,.bk-row .c-hit{text-align:center}
.bk-row .c-chk input{width:1.6rem;height:1.6rem;margin:0;vertical-align:middle}
.bk-head{padding:1.4rem 1.2rem;background:#F8F8FA;font-weight:600;color:#111}
.bk-head .c-tit{text-align:center}
.bk-head .c-file{color:#111;font-size:1.5rem}
.bk-row.is-notice{background:#F8F8FA}
.bk-row .c-tit a{color:#111;font-size:1.65rem;font-weight:500;line-height:1.5;word-break:keep-all;overflow-wrap:break-word}
.bk-row.is-notice .c-tit a{font-weight:600}
.bk-row .c-tit a:hover{color:#495FA1;text-decoration:underline;text-underline-offset:.3rem}
.bk-row .c-file{color:#8A8F9C}
.bk-row .c-name{text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk-row .c-status{text-align:center}
.bk-row .c-status .ol-tag{font-size:1.2rem}
.bk-row .c-tit a.bk-re{display:inline-block;padding-left:calc(var(--d,0) * 1.6rem)}
.bk-row .c-tit .ol-tag{font-size:1.2rem;margin-right:.4rem}
.bk-ca{display:block;margin-bottom:.4rem;font-size:1.35rem;color:#495FA1;font-weight:500}
.bk-cmt{margin-left:.4rem;font-size:1.35rem;color:#495FA1;font-weight:600}
.bk-new{display:inline-block;margin-left:.6rem;padding:0 .4rem;border:1px solid #495FA1;border-radius:4px;font-size:1.1rem;font-weight:700;line-height:1.5;color:#495FA1;vertical-align:2px}
.bk-mark{display:inline-block;margin-right:.6rem;padding:0 .5rem;border:1px solid #D5D7DE;border-radius:4px;font-size:1.2rem;font-weight:500;line-height:1.5;color:#767676;vertical-align:2px}
.bk-chkall{padding:1rem 1.2rem;border-bottom:1px solid #E5E5EC;font-size:1.4rem;color:#505050}
.bk-chkall input{margin:0 .6rem 0 0;vertical-align:middle}
.bk-empty{padding:6rem 1rem;border-bottom:1px solid #E5E5EC;text-align:center;font-size:1.6rem;color:#767676}

/* 카드 목록 (board_cards.part.php) */
.bk-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4rem 2.4rem;margin:0;padding:3.2rem 0 0;list-style:none;border-top:2px solid #1A264B}
.bk-cards.is-covers{grid-template-columns:repeat(4,minmax(0,1fr))}
.bk-card{position:relative;display:flex;flex-direction:column;min-width:0}
.bk-card-img{position:relative;display:block;width:100%;aspect-ratio:400/232;margin:0;padding:0;overflow:hidden;border:1px solid #E5E5EC;border-radius:4px;background:#F8F8FA;cursor:pointer}
.is-videos .bk-card-img{aspect-ratio:16/9}
.is-covers .bk-card-img{aspect-ratio:750/1108}
.bk-card-img img{display:block;width:100%;height:100%;object-fit:cover;transition:opacity .2s}
.bk-card-img:hover img{opacity:.85}
.bk-card-img .ph{display:flex;align-items:center;justify-content:center;height:100%;padding:1.6rem;text-align:center;font-size:1.5rem;line-height:1.5;color:#8A8F9C;word-break:keep-all}
.bk-play-i{position:absolute;left:50%;top:50%;width:5.6rem;height:5.6rem;margin:-2.8rem 0 0 -2.8rem;border-radius:4px;background:rgba(26,38,75,.85)}
.bk-play-i::after{content:"";position:absolute;left:2.2rem;top:1.7rem;border-style:solid;border-width:1.1rem 0 1.1rem 1.7rem;border-color:transparent transparent transparent #fff}
.bk-card-img:hover .bk-play-i{background:#495FA1}
.bk-card.is-on .bk-card-img{border-color:#495FA1;outline:2px solid #495FA1;outline-offset:-2px}
.bk-card-chk{position:absolute;top:.8rem;left:.8rem;z-index:2;padding:.5rem;line-height:0;background:#fff;border:1px solid #E5E5EC;border-radius:4px}
.bk-card-chk input{width:1.6rem;height:1.6rem;margin:0}
.bk-card-body{padding-top:1.6rem}
.bk-card-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem;margin-bottom:.8rem;font-size:1.35rem;color:#767676}
.bk-card-meta>span{font-size:1.35rem}
.bk-card-meta .ol-tag{font-size:1.2rem}
.bk-card-meta .ca{color:#495FA1;font-weight:500}
.bk-card-meta .bk-new{margin-left:0}
.bk-card h3{font-size:1.75rem;font-weight:600;line-height:1.45;color:#111;word-break:keep-all;overflow-wrap:break-word}
.bk-card h3 a,.bk-card h3 button{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer}
.bk-card h3 a:hover,.bk-card h3 button:hover{color:#495FA1}
.bk-card-sum{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:.8rem;font-size:1.45rem;line-height:1.6;color:#505050}
.bk-card-foot{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.bk-card-foot .ev-btn{min-height:3.6rem;padding:0 1.4rem;font-size:1.4rem}
.bk-cards .bk-empty{grid-column:1/-1;border-bottom:0}
.bk-cards+.pg_wrap{margin-top:5.6rem}
p.bk-chkall{margin:0}

/* 영상 게시판 위쪽 플레이어 */
.bk-player{margin-bottom:4.8rem;scroll-margin-top:12rem}
.bk-player .frame{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:4px;background:#000}
.bk-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.bk-player .tit{margin-top:1.6rem;font-size:2rem;font-weight:600;line-height:1.45;color:#111;word-break:keep-all}
.bk-info-text{margin-top:1.2rem;font-size:1.5rem;line-height:1.7;color:#505050;word-break:keep-all}

/* 쪽 번호 (get_paging) — 온라인 강의 .ol-pager 와 같은 모양 */
.bk .pg_wrap{float:none;display:block;margin:4rem 0 0;text-align:center}
.bk .pg_wrap .pg{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:.4rem}
.bk .pg_page,.bk .pg_current{min-width:3.6rem;height:3.6rem;padding:0 .8rem;display:inline-flex;align-items:center;justify-content:center;border:1px solid #E5E5EC;border-radius:4px;background:#fff;font-size:1.45rem;line-height:1;color:#505050;font-weight:400;text-decoration:none;text-indent:0;overflow:visible}
.bk .pg_current{background:#495FA1;border-color:#495FA1;color:#fff;font-weight:600}
.bk .pg_page:hover{background:#fff;border-color:#495FA1;color:#495FA1}

/* 보기 */
.bk-v-head{border-top:2px solid #1A264B;border-bottom:1px solid #E5E5EC;padding:3.2rem .4rem 2.4rem}
.bk-v-ca{margin-bottom:1.2rem}
.bk-v-head h3{font-size:2.6rem;font-weight:700;line-height:1.45;color:#111;word-break:keep-all;overflow-wrap:break-word}
.bk-v-meta{display:flex;flex-wrap:wrap;gap:.4rem 2.4rem;margin-top:1.4rem;font-size:1.45rem;color:#505050}
.bk-v-meta b{margin-right:.8rem;font-weight:500;color:#767676}
.bk-v-meta a{color:#495FA1;text-decoration:underline;text-underline-offset:.3rem}
.bk #bo_v_atc{min-height:0;padding:4rem .4rem;border-bottom:1px solid #E5E5EC}
.bk #bo_v_con{margin:0;min-height:12rem;font-size:1.6rem;line-height:1.8;color:#111;word-break:keep-all;overflow-wrap:break-word}
.bk #bo_v_con a{color:#495FA1}
.bk #bo_v_img img{margin:0 0 3.2rem}
.bk .bk-photos~#bo_v_con{min-height:0}
.bk #bo_v_act{margin:3.2rem 0 0}

/* 글 보기: 근조기 신청 정보 */
.bk-sec-t{margin:0 0 1.2rem;font-size:1.7rem;font-weight:600;color:#111}
.bk-req{margin-bottom:3.2rem}
.bk-req dt{flex-basis:11rem}
.bk .bk-req~#bo_v_con{min-height:0}
.bk-req .bk-lock{font-size:1.5rem;color:#767676}
.bk-req dd small{display:block;margin-top:.2rem;font-size:1.4rem;color:#767676}

/* 글 보기: 영상 · 사진 넘겨 보기 */
.bk-video{position:relative;aspect-ratio:16/9;margin-bottom:3.2rem;overflow:hidden;border-radius:4px;background:#000}
.bk-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.bk-photos{margin-bottom:4rem}
.bk-photos .stage{position:relative;display:flex;align-items:center;justify-content:center;height:64rem;border-radius:4px;background:#F8F8FA;overflow:hidden}
.bk-photos .big{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.bk-photos .big img{max-width:100%;max-height:100%;object-fit:contain}
.bk-photos .nav{position:absolute;top:50%;width:4.8rem;height:4.8rem;margin-top:-2.4rem;padding:0;border:1px solid #E5E5EC;border-radius:4px;background:#fff;cursor:pointer}
.bk-photos .nav::after{content:"";position:absolute;left:50%;top:50%;width:1rem;height:1rem;margin:-.5rem 0 0 -.7rem;border:solid #1A264B;border-width:2px 2px 0 0;transform:rotate(45deg)}
.bk-photos .nav.prev{left:1.6rem}
.bk-photos .nav.prev::after{margin-left:-.3rem;transform:rotate(-135deg)}
.bk-photos .nav.next{right:1.6rem}
.bk-photos .nav:hover{border-color:#495FA1}
.bk-photos .count{margin:1.2rem 0;text-align:center;font-size:1.45rem;color:#767676}
.bk-photos .count b{color:#111;font-weight:600}
.bk-photos .thumbs{display:flex;gap:.8rem;margin:0;padding:0 0 .8rem;list-style:none;overflow-x:auto}
.bk-photos .thumbs li{flex:none}
.bk-photos .thumbs button{display:block;width:10.4rem;height:7.8rem;padding:0;border:1px solid #E5E5EC;border-radius:4px;overflow:hidden;background:#F8F8FA;cursor:pointer;opacity:.7}
.bk-photos .thumbs button.on{opacity:1;border-color:#495FA1;outline:2px solid #495FA1;outline-offset:-2px}
.bk-photos .thumbs button:hover{opacity:1}
.bk-photos .thumbs img{display:block;width:100%;height:100%;object-fit:cover}

.bk-box{margin-top:2.4rem;border:1px solid #E5E5EC;border-radius:4px;background:#F8F8FA;padding:2rem 2.4rem}
.bk-box h4{font-size:1.55rem;font-weight:600;color:#111;margin-bottom:1rem}
.bk-box ul{margin:0;padding:0;list-style:none}
.bk-box li+li{border-top:1px solid #E5E5EC}
.bk-box li a{display:flex;align-items:center;gap:1.2rem;padding:1.2rem 0;font-size:1.5rem;color:#111}
.bk-box .nm{flex:1;min-width:0;overflow-wrap:anywhere}
.bk-box .nm small{font-size:1.35rem;color:#767676}
.bk-box .sz{font-size:1.35rem;color:#767676;white-space:nowrap}
.bk-box .dl{flex:none;padding:.4rem 1.2rem;border:1px solid #495FA1;border-radius:4px;font-size:1.35rem;font-weight:600;color:#495FA1;background:#fff}
.bk-box li a:hover .nm{color:#495FA1;text-decoration:underline;text-underline-offset:.3rem}
.bk-box li a:hover .dl{background:#F1F4FB}

.bk .bk-nb{margin-top:4rem}
.bk-v-foot{display:flex;justify-content:center;margin-top:4rem}
.bk-v-foot .ev-btn{min-width:16rem}

/* 실시간 강의 (theme/shared/live_vod.inc.php) — 플레이어 + 강의장 목록, 권한이 없으면 안내 상자 */
.lv .lv-scope{margin-bottom:1.6rem;font-size:1.5rem;line-height:1.6;color:#505050;word-break:keep-all}
.lv .lv-scope b{font-weight:600;color:#111}
.lv .lv-scope span{margin-left:.4rem;color:#767676}
.lv .bk-player{margin-bottom:3.2rem}
.lv .bk-player .tit .ol-tag{margin-right:.4rem;font-size:1.3rem;vertical-align:3px}
.lv .lv-empty{border-top:2px solid #1A264B}
.lv-halls{margin:0;padding:0;list-style:none;border-top:2px solid #1A264B}
.lv-hall{display:flex;align-items:center;gap:2rem;padding:2.4rem 1.2rem;border-bottom:1px solid #E5E5EC}
.lv-hall.is-on{background:#F8F8FA}
.lv-hall .txt{flex:1;min-width:0}
.lv-hall .ca{display:block;margin-bottom:.4rem;font-size:1.4rem;font-weight:600;color:#495FA1}
.lv-hall h3{font-size:1.75rem;font-weight:600;line-height:1.45;color:#111;word-break:keep-all;overflow-wrap:break-word}
.lv-hall p{margin-top:.6rem;font-size:1.45rem;line-height:1.6;color:#505050;word-break:keep-all}
.lv-hall .act{display:flex;flex:none;gap:.6rem}
.lv-hall .ev-btn{min-height:4.4rem;min-width:11rem;padding:0 1.6rem;font-size:1.5rem}
.lv-gate{margin-bottom:4rem;padding:3.2rem;border:1px solid #E5E5EC;border-top:2px solid #1A264B;border-radius:0 0 4px 4px;background:#fff;word-break:keep-all}
.lv-gate h3{font-size:2.2rem;font-weight:700;line-height:1.45;color:#111}
.lv-gate .lead{margin-top:1rem;font-size:1.55rem;line-height:1.7;color:#505050}
.lv-ev{display:grid;grid-template-columns:auto 1fr;gap:.6rem 2rem;margin:2.4rem 0 0;padding:2rem 2.4rem;border-radius:4px;background:#F8F8FA;font-size:1.5rem;line-height:1.6}
.lv-ev dt{font-weight:600;color:#767676}
.lv-ev dd{margin:0;color:#111}
.lv-gate .ev-btns{max-width:48rem;margin-top:2.4rem}
.lv-nm{margin-top:3.2rem;padding-top:2.4rem;border-top:1px solid #E5E5EC}
.lv-nm h4{margin-bottom:.6rem;font-size:1.7rem;font-weight:600;color:#111}
.lv-nm .lv-hint{margin-bottom:1.4rem;font-size:1.4rem;line-height:1.6;color:#767676;word-break:keep-all}
.lv-nm .row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1.2rem}
.lv-nm label{display:flex;flex-direction:column;gap:.6rem;flex:1 1 22rem;font-size:1.4rem;color:#505050}
.lv-nm .frm_input{width:100%;height:4.8rem;padding:0 1.2rem;border:1px solid #D5D7DE;border-radius:4px;font-size:1.6rem;color:#111;background:#fff}
.lv-nm .frm_input:focus{border-color:#495FA1;outline:2px solid rgba(73,95,161,.2);outline-offset:0}
.lv-nm .ev-btn{flex:none;min-width:12rem;min-height:4.8rem}
.lv-err{margin-bottom:1.2rem;font-size:1.45rem;font-weight:500;color:#C53030}
.lv-help{margin-top:2.4rem;font-size:1.4rem;line-height:1.7;color:#767676}
.lv-help a{font-size:inherit;color:#495FA1}
.lv-adm{margin-bottom:2.4rem;padding:1.6rem 2rem;border:1px solid #E5E5EC;border-radius:4px;background:#F8F8FA;font-size:1.45rem;color:#505050}
.lv-adm b{color:#111;font-weight:700}
.lv-adm-btns{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.lv-adm .ev-btn{min-height:3.6rem;padding:0 1.4rem;font-size:1.4rem}
.lv-log{margin-top:1.2rem;max-height:32rem;overflow:auto;background:#fff;border:1px solid #E5E5EC;border-radius:4px}
.lv-log table{width:100%;border-collapse:collapse;font-size:1.35rem}
.lv-log th,.lv-log td{padding:.8rem 1rem;border-bottom:1px solid #EEEEF3;text-align:left;white-space:nowrap}
.lv-log th{background:#F8F8FA;font-weight:600;color:#111}
.lv-log .empty{text-align:center;color:#767676}

@media (max-width:1024px){
  .bk-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:3.2rem 2rem}
  .bk-cards.is-covers{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (max-width:768px){
  .bk-cate{gap:.4rem;margin-bottom:2.4rem}
  .bk-cate a{min-height:4rem;padding:0 1.2rem;font-size:1.4rem}
  .bk-top .bk-sch{flex:1 1 100%}
  .bk-top .bk-sch input{width:auto}
  .bk-row.bk-head{display:none}
  .bk-row{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem;padding:1.6rem .4rem;font-size:1.35rem}
  .bk-row>span{font-size:1.35rem}
  .bk-row .c-chk{order:0}
  .bk-row .c-tit{order:1;flex:1 1 calc(100% - 4rem)}
  .bk-row .c-tit a{font-size:1.55rem}
  .bk-row .c-num{order:2;display:none}
  .bk-row.is-notice .c-num{display:block}
  .bk-row .c-status{order:2}
  .bk-row .c-status:empty{display:none}
  .bk-row .c-name{order:3;white-space:normal}
  .bk-row .c-name:empty{display:none}
  .bk-intro{padding:2rem;font-size:1.4rem}
  .bk-intro dl{grid-template-columns:1fr}
  .bk-req dt{flex-basis:7.2rem}
  .bk-row .c-date{order:3}
  .bk-row .c-hit{order:4}
  .bk-row .c-hit::before{content:attr(data-l) " "}
  .bk-row .c-file{order:5;font-size:1.4rem}
  .bk-row .c-file:empty{display:none}
  .bk-v-head{padding:2.4rem .2rem 2rem}
  .bk-v-head h3{font-size:2.1rem}
  .bk #bo_v_atc{padding:3.2rem .2rem}
  .bk-box{padding:1.6rem}
  .bk-box li a{flex-wrap:wrap;gap:.6rem 1rem}
  .bk-box .nm{flex:1 1 100%}
  .bk-cards{grid-template-columns:1fr;gap:3.2rem;padding-top:2.4rem}
  .bk-cards.is-covers{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.4rem 1.2rem}
  .is-covers .bk-card h3{font-size:1.5rem}
  .bk-player{margin-bottom:3.2rem}
  .bk-player .tit{font-size:1.7rem}
  .bk-photos .stage{height:auto;aspect-ratio:4/3}
  .bk-photos .nav{width:4rem;height:4rem;margin-top:-2rem}
  .bk-photos .nav.prev{left:.8rem}
  .bk-photos .nav.next{right:.8rem}
  .bk-photos .thumbs button{width:8rem;height:6rem}
  .bk-video{margin-bottom:2.4rem}
  .lv-hall{flex-direction:column;align-items:stretch;gap:1.4rem;padding:2rem .4rem}
  .lv-hall .act .ev-btn{flex:1}
  .lv-hall h3{font-size:1.6rem}
  .lv-gate{padding:2.4rem 1.6rem}
  .lv-gate h3{font-size:1.9rem}
  .lv-gate .lead{font-size:1.45rem}
  .lv-ev{grid-template-columns:5.6rem 1fr;gap:.4rem 1.2rem;padding:1.6rem;font-size:1.4rem}
  .lv-nm .ev-btn{flex:1 1 100%}
}