@charset "utf-8";
/* 게시판 목록 공통 스타일 (dp_basic / dp_gallery list.skin 에서 로드) */
/* ===== 게시판 목록 공통 (연세 어린이가족연구원 디자인) - dp_bd.css 보다 뒤에 로드되어 덮어씀 ===== */
.ys-bd{display:flex;flex-direction:column;gap:2rem;width:100%;box-sizing:border-box}
.ys-bd *{box-sizing:border-box}
.ys-bd p{margin:0}
/* 카테고리 탭 */
.ys-bd .bd-cate{margin:0}
.ys-bd .bd-cate-list{display:flex;flex-wrap:nowrap;gap:.5rem;margin:0;padding:0 0 .125rem;list-style:none;overflow-x:auto;scrollbar-width:none}
.ys-bd .bd-cate-list::-webkit-scrollbar{display:none}
.ys-bd .bd-cate-list li{flex:none;display:block;min-width:0;margin:0}
.ys-bd .bd-cate-list a{display:inline-flex;align-items:center;justify-content:center;height:auto;padding:.75rem 1.5rem;background:#fff;border:1px solid #e1e2e4;border-radius:3.125rem;color:#878a93;font-size:1.125rem;font-weight:700;line-height:1.5;white-space:nowrap;transition:.2s}
.ys-bd .bd-cate-list a:hover{border-color:#0B318F;color:#0B318F}
.ys-bd .bd-cate-list a#bo_cate_on{background:#0B318F;border-color:#0B318F;color:#fff;font-weight:700}
/* 상단 : 전체 건수 + 검색 */
.ys-bd .bd-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ys-bd .bd-total{font-size:1rem;font-weight:400;color:#5a5c63;line-height:1.5}
.ys-bd .bd-total strong{font-weight:700;color:#0B318F}
.ys-bd .bd-search{display:flex;align-items:center;gap:.5rem}
.ys-bd .bd-sel{height:3rem;padding:0 2.5rem 0 1.25rem;border:1px solid #e3e3e3;border-radius:0.5rem;background:#fff url("/img/sub/icon/caret.svg") no-repeat right 1rem center/.875rem;color:#292a2d;font-size:.9375rem;font-weight:500;font-family:inherit;-webkit-appearance:none;appearance:none;cursor:pointer; outline: none !important;color:#aeb0b6;transition:border-color .2s}
.ys-bd .bd-sel:focus{border-color:#0B318F}
.ys-bd .bd-sel.on{color: #000;}
.ys-bd .bd-sel::-ms-expand{display:none}
.ys-bd .bd-inp{position:relative;display:flex;align-items:center;width:18.75rem}
.ys-bd .bd-inp input{width:100%;height:3rem;padding:0 3.25rem 0 1.25rem;border:1px solid #e3e3e3;border-radius:0.5rem;background:#fff;color:#292a2d;font-size:.9375rem;font-family:inherit;transition:border-color .2s}
.ys-bd .bd-inp input::placeholder{color:#aeb0b6;}
.ys-bd .bd-inp input:focus{outline:0;border-color:#0B318F}
.ys-bd .bd-btn{position:absolute;right:.5rem;top:50%;display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;cursor:pointer;transform:translateY(-50%);transition:.2s; background: none;}
.ys-bd .bd-btn img{width:1.25rem;height:1.25rem; filter: invert(1);}
/* 게시물 없음 (메인 .no_data 규격) */
.ys-bd .bd-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;width:100%;min-height:16.5rem;border-top:1px solid #1f2937;border-bottom:1px solid #1f2937}
.ys-bd-basic .bd-tbl + .bd-empty{border-top:0}
.ys-bd .bd-empty .icon{width:2.375rem;height:auto}
.ys-bd .bd-empty p{font-size:1.125rem;font-weight:400;line-height:1.5;color: #000;}
/* 글쓰기(관리자) */
.ys-bd .bd-btns{display:flex;justify-content:flex-end;margin-top:1.5rem}
.ys-bd .bd-write{display:inline-flex;align-items:center;justify-content:center;height:2.75rem;padding:0 1.5rem;border-radius:999px;background:#0B318F;color:#fff;font-size:.9375rem;font-weight:700;line-height:1.5;transition:.25s}
.ys-bd .bd-write:hover{background:#06265a}
/* 페이지네이션 (교육영상자료 규격) */
.ys-bd .bd-paging{display:flex;justify-content:center;margin:2.5rem 0 0;font-size:0}
.ys-bd-review .bd-paging{margin-top: 0 !important;}
.ys-bd .bd-paging .pg_wrap{float:none;display:block; margin-top: 0;}
.ys-bd .bd-paging .pg{display:flex;align-items:center;justify-content:center;gap:1.5rem}
.ys-bd .bd-paging .pg_page,.ys-bd .bd-paging .pg_current{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:0;height:auto;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font-size:1.125rem;font-weight:400;color:#999;line-height:1.2;text-indent:0;overflow:visible;transition:all 0.2s;}
.ys-bd .bd-paging .pg_page:hover{background-color:none;color:#000}
.ys-bd .bd-paging .pg_current{font-weight:700;color:#000}
.ys-bd .bd-paging .pg_start,.ys-bd .bd-paging .pg_prev,.ys-bd .bd-paging .pg_next,.ys-bd .bd-paging .pg_end{width:1.25rem;height:1.25rem;font-size:0;color:transparent;background-position:center;background-repeat:no-repeat;background-size:contain}
.ys-bd .bd-paging .pg_start{background-image:url("/img/sub/edu/video/pg-first.svg")}
.ys-bd .bd-paging .pg_prev{background-image:url("/img/sub/edu/video/pg-prev.svg")}
.ys-bd .bd-paging .pg_next{background-image:url("/img/sub/edu/video/pg-next.svg")}
.ys-bd .bd-paging .pg_end{background-image:url("/img/sub/edu/video/pg-last.svg")}
.ys-bd .bd-paging .pg_start:hover,.ys-bd .bd-paging .pg_prev:hover,.ys-bd .bd-paging .pg_next:hover,.ys-bd .bd-paging .pg_end:hover{background-color:transparent}
/* .ys-bd .bd-paging .pg_page.disabled{opacity:.35;pointer-events:none} */
/* 분류 뱃지 (교육영상자료 규격) */
.ys-bd .badge{display:inline-flex;align-items:center;padding:.25rem 1rem;border-radius:100px;font-size:.875rem;font-weight:700;line-height:1.43;white-space:nowrap}
.ys-bd .badge.cat{background:#dce4ef;color:#002b63}
@media(max-width:1024px){
  .ys-bd{gap:1.5rem}
  .ys-bd .bd-cate-list{margin-right:-1.25rem}
  .ys-bd .bd-cate-list li:last-child{margin-right:1.25rem}
  .ys-bd .bd-cate-list a{padding:.5rem 1rem;font-size:.9375rem}
  .ys-bd .bd-empty{min-height:10rem;gap:.75rem}
  .ys-bd .bd-empty .icon{width:1.75rem}
  .ys-bd .bd-empty p{font-size:.875rem;line-height:1.43}
  .ys-bd .bd-paging{margin-top:1.75rem}
  .ys-bd .bd-paging .pg{gap:1rem}
  .ys-bd .bd-paging .pg_page,.ys-bd .bd-paging .pg_current{font-size:1rem}
  .ys-bd .bd-paging .pg_start,.ys-bd .bd-paging .pg_prev,.ys-bd .bd-paging .pg_next,.ys-bd .bd-paging .pg_end{width:1rem;height:1rem;}
}
@media(max-width:768px){
  .ys-bd .bd-top{flex-direction:column;align-items:stretch;gap:.75rem}
  .ys-bd .bd-search{width:100%}
  .ys-bd .bd-sel{flex:none;width:6.5rem;padding-left:1rem;height:2.75rem}
  .ys-bd .bd-inp{flex:1;width:auto}
  .ys-bd .bd-inp input{height:2.75rem;padding-left:1rem}
  .ys-bd .bd-btn{width:2.25rem;height:2.25rem}
}

/* ===== 일반 게시판 목록 (pc-2025 .pc-tbl 규격) ===== */
.ys-bd-basic .bd-list{width:100%;overflow-x:auto;border-radius:1.25rem 1.25rem 0 0;border-top:2px solid #0B318F}
.ys-bd-basic .bd-tbl{display:table;width:100%;table-layout:fixed;margin:0;padding:0;list-style:none}
.ys-bd-basic .bd-tbl > li{display:table-row}
.ys-bd-basic .bd-tbl > li > div{display:table-cell;padding:1.25rem 1.375rem;background:#fff;border-bottom:1px solid #e1e2e4;font-size:1.125rem;font-weight:400;color:#5a5c63;line-height:1.5;text-align:center;vertical-align:middle}
.ys-bd-basic .bd-tbl > li.bd-th > div{padding:1.25rem 1.375rem;background:#06265a;color:#fff;font-size:1.125rem;font-weight:700;border-bottom:0}
.ys-bd-basic .c-num{width:6.5rem}
.ys-bd-basic .c-cate{width:10rem}
.ys-bd-basic .c-date{width:9rem}
.ys-bd-basic .c-hit{width:7rem}
.ys-bd-basic .bd-tbl > li > div.c-tit{text-align:left}
.ys-bd-basic .c-tit a{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#171719;font-size:1.125rem;font-weight:700;line-height:1.5;transition:color .2s}
.ys-bd-basic .c-tit a:hover{color:#0B318F}
.ys-bd-basic .c-tit a img{display:inline-block;vertical-align:middle;margin-left:.25rem}
.ys-bd-basic .bd-td.is-notice > div{background:#f2f7fc}
.ys-bd-basic .bd-notice{display:inline-flex;align-items:center;justify-content:center;padding:.125rem .75rem;border-radius:999px;background:#0B318F;color:#fff;font-size:.8125rem;font-weight:700;line-height:1.5}
.ys-bd-basic .bd-cu{font-size:.875rem;font-weight:700;color:#0B318F}
.ys-bd-basic .bd-tbl .badge{padding:.125rem .75rem;font-size:.8125rem}
.ys-bd-basic .bd-tbl-m{display:none;width:100%}
.ys-bd-basic .bd-m-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.875rem 1rem;background:#06265a;color:#fff;font-size:.875rem;font-weight:700;line-height:1.43}
.ys-bd-basic .bd-m-row{display:flex;flex-direction:column;gap:.375rem;padding:.875rem 1rem;background:#fff;border-bottom:1px solid #e1e2e4}
.ys-bd-basic .bd-m-row.is-notice{background:#f2f7fc}
.ys-bd-basic .bd-m-tags{display:flex;align-items:center;gap:.375rem}
.ys-bd-basic .bd-m-tit{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.9375rem;font-weight:700;color:#171719;line-height:1.5;word-break:keep-all}
.ys-bd-basic .bd-m-tit img{display:inline-block;vertical-align:middle;margin-left:.25rem}
.ys-bd-basic .bd-m-meta{display:flex;align-items:center;gap:.625rem;font-size:.875rem;font-weight:400;color:#5a5c63;line-height:1.43}
.ys-bd-basic .bd-m-meta em{font-style:normal}
.ys-bd-basic .bd-m-meta i{width:1px;height:.75rem;background:#d0d2d6}
@media(max-width:1024px){
  .ys-bd-basic .c-num{width:4.5rem}
  .ys-bd-basic .c-cate{width:7.5rem}
  .ys-bd-basic .c-date{width:7rem}
  .ys-bd-basic .c-hit{width:5rem}
  .ys-bd-basic .bd-tbl > li > div,.ys-bd-basic .bd-tbl > li.bd-th > div{padding:1rem;font-size:1rem}
  .ys-bd-basic .c-tit a{font-size:1rem}
}
@media(max-width:768px){
  .ys-bd-basic .bd-list{overflow:hidden; border-radius: 0; border-top: 1px solid #000;}
  .ys-bd-basic .bd-tbl{display:none}
  .ys-bd-basic .bd-tbl-m{display:block}
  .ys-bd-basic .bd-m-row{padding: 1rem 0;}
}

/* ===== 갤러리 게시판 목록 (교육영상자료 카드 규격) ===== */
.ys-bd-gallery .bd-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem 1.25rem;margin:0;padding:0;list-style:none}
.ys-bd-gallery .bd-card{margin:0;padding:0;width:auto}
.ys-bd-gallery .bd-card a{display:flex;flex-direction:column;height:100%}
.ys-bd-gallery .item-img{position:relative;width:100%;aspect-ratio: 21/17;border-radius:.75rem;overflow:hidden;background:#dbdcdf}
.ys-bd-gallery .item-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.ys-bd-gallery .item-info{display:flex;flex-direction:column;gap:.75rem;padding-top:1.5rem}
.ys-bd-gallery .item-tags{display:flex;align-items:center;gap:.375rem}
.ys-bd-gallery .item-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:1.125rem;font-weight:700;color:#292a2d;line-height:1.5;word-break:keep-all;transition:color .2s}
.ys-bd-gallery .bd-card a:hover .item-title{color:#0B318F}
.ys-bd-gallery .item-date{font-size:.875rem;font-weight:400;color:#70737c;line-height:1.43}
@media(max-width:1200px){
  .ys-bd-gallery .bd-gal{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:1024px){
  .ys-bd-gallery .bd-gal{gap:1.75rem 1rem}
  .ys-bd-gallery .item-info{padding-top:1rem;gap:.5rem}
  .ys-bd-gallery .item-title{font-size:1rem}
}
@media(max-width:600px){
  .ys-bd-gallery .bd-gal{grid-template-columns:1fr;gap:1.5rem}
}

/* ===== 블록 제목 (page 공통 규격) ===== */
.ys-bd .block-head{display:flex;flex-direction:row;gap:.75rem;align-items:center}
.ys-bd .block-dots{display:flex;flex:none;width:.375rem;height:1.25rem;border-radius:.25rem;background:#0B318F}
.ys-bd .block-head h3{margin:0;font-size:1.75rem;font-weight:700;color:#292a2d;letter-spacing:-.01em;line-height:1.29}
@media(max-width:1024px){
  .ys-bd .block-head h3{font-size:1.45rem}
}

/* ===== 게시글 보기 (.ys-view) — Figma 8168:11 ===== */
.ys-view{gap:2.5rem}
.ys-view .view-head{display:flex;flex-direction:column;gap:1.25rem;padding:2rem 2.25rem;background:#fff;border:1px solid #e1e2e4;border-radius:1.25rem}
.ys-view .view-tags{display:flex;align-items:center;gap:.625rem}
.ys-view .view-tags .badge{padding:.5rem 1rem;background:#eaf1fa;color:#0B318F}
.ys-view .view-title{margin:0;font-size:1.5rem;font-weight:700;color:#292a2d;letter-spacing:-.01em;line-height:1.33;word-break:keep-all}
.ys-view .view-divider{width:100%;height:1px;margin:0;border:0;background:#e1e2e4}
.ys-view .view-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1.5rem;margin:0;padding:0;list-style:none}
.ys-view .view-meta li{display:flex;align-items:center;gap:.75rem}
.ys-view .view-meta li:last-child{margin-left:auto}
.ys-view .meta-label{flex:none;font-size:1.125rem;font-weight:700;color:#878a93;line-height:1.5}
.ys-view .meta-desc{font-size:1.125rem;font-weight:400;color:#878a93;line-height:1.5;word-break:keep-all}
.ys-view .view-body{display:flex;flex-direction:column;gap:2.5rem;padding:2.5rem 2.25rem;background:#fff;border:1px solid #e1e2e4;border-radius:1.25rem}
.ys-view .view-imgs{display:flex;flex-direction:column;gap:1.25rem}
.ys-view .view-imgs img{display:block;max-width:100%;height:auto;margin:0 auto;border-radius:.75rem}
.ys-view .view-content{font-size:1.125rem;font-weight:400;color:#5a5c63;line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}
.ys-view .view-content *{font-size:1.125rem;font-weight:400;color:#5a5c63;line-height:1.7;word-break:keep-all;}
.ys-view .view-content img{max-width:100%;height:auto}
.ys-view .view-content .dp_youtube{position:relative;padding-bottom:56.25%;margin-bottom:1.5rem;overflow:hidden;border-radius:.75rem}
.ys-view .view-content .dp_youtube iframe{position:absolute;top:0;left:0;width:100%;height:100%}
.ys-view .view-files{display:flex;flex-direction:column;gap:.75rem;margin:0;padding:1.5rem 0 0;list-style:none;border-top:1px solid #e1e2e4}
.ys-view .view-files li{display:flex;align-items:center;gap:1rem}
.ys-view .file-label{flex:none;width:4.5rem;font-size:1rem;font-weight:600;color:#292a2d;line-height:1.5}
.ys-view .file-link{display:inline-flex;align-items:center;gap:.5rem;min-width:0;font-size:1rem;font-weight:400;color:#5a5c63;line-height:1.5;transition:color .2s}
.ys-view .file-link img{flex:none;width:1.125rem;height:1.125rem}
.ys-view .file-link span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ys-view .file-link em{font-style:normal;font-size:.875rem;color:#878a93}
.ys-view .file-link:hover{color:#0B318F;text-decoration:underline}
.ys-view .view-nav{margin:0;padding:0;list-style:none;border-top:1px solid #e1e2e4;border-bottom:1px solid #e1e2e4}
.ys-view .view-nav li{display:flex;align-items:center;gap:1.25rem;padding:1.125rem 1.25rem;border-top:1px solid #e1e2e4}
.ys-view .view-nav li:first-child{border-top:0}
.ys-view .nav-label{flex:none;display:inline-flex;align-items:center;gap:.5rem;width:5.875rem;font-size:1rem;font-weight:600;color:#292a2d;line-height:1.5}
.ys-view .nav-label::before{content:"";flex:none;width:1.125rem;height:1.125rem;background:url("/img/sub/icon/nav-prev.svg") no-repeat center/contain}
.ys-view .nav-next .nav-label::before{background-image:url("/img/sub/icon/nav-next.svg")}
.ys-view .view-nav a,.ys-view .nav-none{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:1rem;font-weight:400;color:#5a5c63;line-height:1.5}
/* .ys-view .view-nav a:hover{color:#0B318F} */
.ys-view .nav-none{color:#aeb0b6}
.ys-view .view-btns{display:flex;justify-content:center;gap:.75rem}
.ys-view .view-btn{display:inline-flex;align-items:center;justify-content:center;min-width:8.75rem;height:2.875rem;padding:0 1.125rem;border:1px solid #0B318F;border-radius:999px;color:#0B318F;font-size:1rem;font-weight:500;line-height:1.33;transition:.25s}
.ys-view .view-btn:hover{background:#f2f7fc}
.ys-view .view-btn.ghost{border-color:#aeb0b6;color:#5a5c63}
.ys-view .view-btn.ghost:hover{background:#f4f4f5}
@media(max-width:1024px){
  .ys-view{gap:1.5rem}
  .ys-view .view-head{gap:.875rem;padding:1.25rem}
  .ys-view .view-title{font-size:1.25rem}
  .ys-view .view-meta{gap:.25rem 1rem}
  .ys-view .meta-label,.ys-view .meta-desc,.ys-view .view-content,.ys-view .view-content *{font-size:.9375rem}
  .ys-view .file-label{width:3.75rem;font-size:.875rem}
  .ys-view .file-link{font-size:.875rem}
  .ys-view .view-body{gap:1.5rem;padding:1.25rem}
  .ys-view .view-files{padding-top:1rem;gap:.5rem}
  .ys-view .view-nav li{padding:.875rem .5rem;gap:.75rem}
  .ys-view .nav-label{width:4.5rem;font-size:.9375rem}
  .ys-view .view-nav a,.ys-view .nav-none{font-size:.9375rem}
}
@media(max-width:768px){
  .ys-view .view-title{font-size:1.125rem}
  .ys-view .view-meta li{gap:.75rem}
  .ys-view .view-files li{flex-direction:column;align-items:flex-start;gap:.25rem}
  .ys-view .file-link{max-width:100%}
}
@media(max-width:430px){
  .ys-view .view-meta{flex-direction: column; align-items: flex-start;}
  .ys-view .view-meta li:last-child{margin-left: 0;}
}

/* ===== 신청서 작성 (.ys-write / dp_apply) — 내부 워크플로우 참관신청 레이아웃 ===== */
.ys-write{gap:3.25rem}
.ys-write form{display:flex;flex-direction:column;gap:3.25rem}
.ys-write .w-block{display:flex;flex-direction:column;gap:1.5rem}
.ys-write .w-block-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:2px solid #0B318F}
.ys-write .w-ness{margin:0;font-size:.9375rem;font-weight:500;color:#878a93;line-height:1.5}
.ys-write .w-ness em,.ys-write .w-field label em,.ys-write .w-field .w-label em{font-style:normal;color:#cc1c24}
/* 2열 그리드 : 라벨 위 / 입력 아래 */
.ys-write .w-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 1.625rem}
.ys-write .w-field{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.ys-write .w-field.full{grid-column:1 / -1}
.ys-write .w-field > label,.ys-write .w-field > .w-label{font-size:1rem;font-weight:700;color:#292a2d;line-height:1.5}
.ys-write .w-inp,.ys-write .w-sel{width:100%;height:3.1875rem;padding:0 1rem;border:1px solid #e1e2e4;border-radius:.75rem;background:#fff;color:#292a2d;font-size:1rem;font-family:inherit;line-height:1.5;box-sizing:border-box;transition:.2s}
.ys-write .w-inp::placeholder{color:#aeb0b6}
.ys-write .w-inp:focus,.ys-write .w-sel:focus{outline:0;border-color:#0B318F;}
.ys-write .w-inp.w-sm{max-width:22.5rem}
.ys-write .w-inp[type="datetime-local"]{-webkit-appearance:none;appearance:none;background:#fff url("/img/sub/icon/cal_ic.svg") no-repeat right 1rem center/1.5rem}
.ys-write .w-inp[type="datetime-local"]::-webkit-calendar-picker-indicator{width:1.5rem;height:1.5rem;margin:0;padding:0;cursor:pointer;opacity:0}
.ys-write .w-sel{padding-right:2.75rem;background:#fff url("/img/sub/icon/caret.svg") no-repeat right .875rem center/1rem;-webkit-appearance:none;appearance:none;cursor:pointer}
.ys-write .w-sel::-ms-expand{display:none}
.ys-write .w-editor{display:flex;flex-direction:column;gap:.5rem}
.ys-write .w-editor textarea{width:100%;height: auto !important; min-height:9.375rem;padding:.875rem 1rem;border:1px solid #e1e2e4;border-radius:.75rem;font-size:1rem;font-family:inherit;line-height:1.7;color:#292a2d;resize:vertical;box-sizing:border-box;transition:.2s}
.ys-write .w-editor textarea:focus{outline:0;border-color:#0B318F;}
.ys-write .w-guide{display:flex;flex-direction:column;gap:.125rem;margin:0;padding:0;list-style:none;font-size:.875rem;font-weight:400;color:#878a93;line-height:1.6;word-break:keep-all}
.ys-write .w-guide li{position:relative;padding-left:.6875rem}
.ys-write .w-guide li::before{content:"";position:absolute;left:.125rem;top:.625rem;width:.1875rem;height:.1875rem;border-radius:50%;background:#878a93}
.ys-write #char_count_desc{margin:0;font-size:.9375rem;color:#878a93}
.ys-write .w-chks{display:flex;flex-wrap:wrap;gap:1.75rem;min-height:3.1875rem;align-items:center}
.ys-write .w-chk{display:inline-flex;align-items:center;gap:.625rem;cursor:pointer;font-size:1rem;font-weight:400;color:#5a5c63;line-height:1.5}
.ys-write .w-chk input{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);opacity:0}
.ys-write .chk-box{flex:none;display:block;width:1.375rem;height:1.375rem;background:#fff;border:1px solid #aeb0b6;border-radius:.25rem;box-sizing:border-box;transition:.2s}
.ys-write .w-chk input:checked + .chk-box{background:#0B318F url("/img/sub/icon/chk_ic.svg") no-repeat center/1rem;border-color:#0B318F}
.ys-write .w-files{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.ys-write .w-file{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;padding:.75rem 0;border-top:1px solid #eaebec}
.ys-write .w-file:first-child{padding-top:0;border-top:0}
.ys-write .file-label{flex:none;width:6rem;font-size:1rem;font-weight:700;color:#292a2d;line-height:1.5}
.ys-write .w-filebtn{position:relative;flex:none;display:inline-flex;align-items:center;justify-content:center;height:3.1875rem;padding:0 1.375rem;background:#878a93;border-radius:.75rem;color:#fff;font-size:1rem;font-weight:500;cursor:pointer;transition:.2s}
.ys-write .w-filebtn:hover{background:#5a5c63}
.ys-write .w-filebtn input{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);opacity:0}
.ys-write .file-state{flex:1;min-width:8rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:1rem;color:#878a93;line-height:1.5}
.ys-write .file-state.on{color:#292a2d}
.ys-write .file-content{max-width:16rem}
/* .ys-write .dpp_captha #captcha{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem} */
.ys-write .dpp_captha #captcha_key{width:10rem;height:3.1875rem;padding:0 1rem;border:1px solid #e1e2e4;border-radius:.75rem;font-size:1rem;font-family:inherit;box-sizing:border-box}
.ys-write .dpp_captha #captcha_key:focus{outline:0;border-color:#0B318F}
.ys-write .dpp_captha #captcha_reload,.ys-write .dpp_captha #captcha_mp3{width:2.5rem;height:2.5rem;border:1px solid #e1e2e4;border-radius:.5rem;background-color:#fff;cursor:pointer}
.ys-write .desc{display:none;margin:0;font-size:.875rem;font-weight:400;color:#cc1c24;line-height:1.43}
.ys-write .desc.active{display:block}
.ys-write .desc.blue{display:block;color:#878a93}
/* 개인정보 수집·이용 동의 (Figma 8151:16609) */
.ys-write .w-agree{gap:1.25rem}
.ys-write .agree-body{display:flex;flex-direction:column;gap:.5rem}
.ys-write .agree-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ys-write .agree-row .w-chk{gap:.625rem;font-size:1.125rem;font-weight:400;color:#5a5c63}
.ys-write .agree-row .w-chk b{font-weight:400;color:#cc1c24}
.ys-write .agree-more{flex:none;display:inline-flex;align-items:center;gap:.25rem;padding:.625rem 1rem .625rem 1.25rem;border:1px solid #aeb0b6;border-radius:6.25rem;background:#fff;color:#5a5c63;font-family:inherit;font-size:.875rem;font-weight:500;line-height:1.43;cursor:pointer;transition:.2s}
.ys-write .agree-more img{flex:none;width:1rem;height:1rem}
.ys-write .agree-more:hover{border-color:#0B318F;color:#0B318F}
/* 버튼 */
.ys-write .w-btns{display:flex;justify-content:center;gap:.75rem}
.ys-write .w-btn{display:inline-flex;align-items:center;justify-content:center;width:12.5rem;height:3.375rem;padding:0 1.5rem;border-radius:999px;font-family:inherit;font-size:1.125rem;font-weight:500;line-height:1.5;cursor:pointer;transition:.2s;box-sizing:border-box}
.ys-write .w-btn.primary{background:#0B318F;border:0;color:#fff}
.ys-write .w-btn.primary:hover{background:#06265a}
.ys-write .w-btn.ghost{background:#fff;border:1.5px solid #aeb0b6;color:#171719}
.ys-write .w-btn.ghost:hover{border-color:#0B318F;color:#0B318F}
/* 개인정보 수집·이용 동의 팝업 (Figma 8151:16544) */
/* program_form.css 의 비스코프 .tm-* 규칙이 서브페이지 전체에 로드되므로 상속값을 모두 명시해 초기화한다 */
.ys-write .tm-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:1.25rem}
.ys-write .tm-modal.on{display:flex}
.ys-write .tm-dim{position:absolute;inset:0;background:rgba(17,17,17,.7)}
.ys-write .tm-wrap{position:relative;z-index:1;display:flex;flex-direction:column;width:100%;max-width:42.8125rem}
.ys-write .tm-close{align-self:flex-end;display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;margin:0 0 .75rem;padding:0;border:0;border-radius:0;background:none;line-height:0;cursor:pointer}
.ys-write .tm-close img{display:block;width:1.25rem;height:1.25rem}
.ys-write .tm-panel{position:relative;display:flex;flex-direction:column;gap:1.9375rem;width:100%;max-width:none;max-height:calc(100vh - 6rem);padding:2.5rem 2.1875rem;background:#fff;border-radius:0;overflow:visible;box-shadow:none;box-sizing:border-box}
.ys-write .tm-title{padding-bottom:1.25rem;border-bottom:1px solid #000;font-size:1.25rem;font-weight:600;color:#141414;line-height:1.45;word-break:keep-all}
.ys-write .tm-body{flex:0 1 auto;min-height:0;max-height:17.875rem;padding:0 1.4375rem 0 0;border:0;overflow-y:auto;font-size:1rem;font-weight:400;color:#8e8e8e;line-height:1.5;word-break:keep-all}
.ys-write .tm-body::-webkit-scrollbar{width:2px}
.ys-write .tm-body::-webkit-scrollbar-track{background:#ddd;border-radius:.625rem}
.ys-write .tm-body::-webkit-scrollbar-thumb{background:#888;border-radius:.625rem}
.ys-write .tm-body p{margin:0 0 1.25rem; color: #8E8E8E; line-height: 1.5;}
.ys-write .tm-body b{display:block;margin:0 0 0.5rem;font-size:1.125rem;font-weight:600;color:#000;line-height:1.5}
.ys-write .tm-body > :last-child{margin-bottom:0}
.ys-write .tm-body .warn{display:block;margin-top:0;color:#cc1c24;font-weight:400}
.ys-write .tm-foot{display:flex;justify-content:center;gap:.75rem;margin-right:1.5625rem;padding:0;border:0}
.ys-write .tm-foot .w-btn{width:auto;padding:0 1.5rem}
@media(max-width:1024px){
  .ys-write,.ys-write form{gap:2.5rem}
  .ys-write .w-grid{gap:1.25rem 1.25rem}
  .ys-write .w-inp,.ys-write .w-sel,.ys-write .w-filebtn,.ys-write .dpp_captha #captcha_key,.ys-write .w-editor textarea{font-size:1rem}
  .ys-write .w-inp,.ys-write .w-sel,.ys-write .w-filebtn,.ys-write .dpp_captha #captcha_key{height:2.875rem}
  .ys-write .w-inp[type="datetime-local"]{background-size:1.375rem;background-position:right .875rem center}
  .ys-write .w-inp[type="datetime-local"]::-webkit-calendar-picker-indicator{width:1.375rem;height:1.375rem}
  .ys-write .w-btn{width:10rem;height:3rem;font-size:1rem}
}
@media(max-width:768px){
  .ys-write .w-grid{grid-template-columns:1fr;gap:1rem}
  .ys-write .w-field.full{grid-column:auto}
  .ys-write .w-inp.w-sm{max-width:none}
  .ys-write .w-chks{gap:1rem}
  .ys-write .file-label{width:100%}
  .ys-write .agree-row{flex-direction:column;align-items:flex-start;gap:.75rem}
  .ys-write .agree-row .w-chk{font-size:1rem}
  .ys-write .agree-more{width:100%;justify-content:center;min-height:2.75rem}
  /* .ys-write .w-btns{flex-direction:column;align-items:center} */
  .ys-write .w-btn{width:100%;max-width:20rem}
  .ys-write .tm-modal{padding:1rem}
  .ys-write .tm-panel{gap:1.25rem;padding:1.5rem 1.25rem}
  .ys-write .tm-title{padding-bottom:.875rem;font-size:1.125rem}
  .ys-write .tm-body{padding-right:1rem;font-size:.9375rem}
  .ys-write .tm-body p,.ys-write .tm-body b{margin-bottom:1rem}
  .ys-write .tm-body b{font-size:1rem}
  .ys-write .tm-foot{margin-right:1rem}
  .ys-write .tm-foot .w-btn{flex:1;min-width:0;max-width:none;height:2.875rem;font-size:1rem}
}
/* Firefox 는 ::-webkit-scrollbar 를 지원하지 않으므로 별도 처리 (Chrome 에서 scrollbar-color 를 쓰면 webkit 의사요소가 무시됨) */
@supports not selector(::-webkit-scrollbar){
  .ys-write .tm-body{scrollbar-width:thin;scrollbar-color:#888 #ddd}
}

/* ===== 참여후기 목록 (dp_review) ===== */
.ys-bd-review .rv-lead{font-size:1.125rem;font-weight:400;color:#878a93;line-height:1.5;word-break:keep-all}
.ys-bd-review .bd-cate-list a b{margin-left:.25rem;font-weight:700;color:inherit;opacity:.7}
.ys-bd-review .bd-cate-list a#bo_cate_on b{opacity:.85}
.ys-bd-review .rv-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.ys-bd-review .rv-card{display:flex;flex-direction:column;padding:1.5rem;background:#fff;border:1px solid #e1e2e4;border-radius:1.25rem;box-sizing:border-box;cursor:pointer;transition:.25s}
.ys-bd-review .rv-card:hover,.ys-bd-review .rv-card:focus-visible{border-color:#0B318F;box-shadow:0 .625rem 1.75rem rgba(11,49,143,.12);outline:0}
.ys-bd-review .rv-badges{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.75rem}
.ys-bd-review .rv-badge{display:inline-flex;align-items:center;padding:.25rem .875rem;border-radius:999px;background:#0B318F;color:#fff;font-size:.875rem;font-weight:700;line-height:1.5}
.ys-bd-review .rv-date{font-size:1rem;color:#878a93;line-height:1.5}
.ys-bd-review .rv-name{margin:0 0 .5rem;font-size:1.375rem;font-weight:700;color:#0B318F;line-height:1.5}
.ys-bd-review .rv-org{margin:0 0 .875rem;font-size:.875rem;font-weight:600;color:#878a93;line-height:1.43}
.ys-bd-review .rv-ex{flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 1rem;font-size:1.125rem;font-weight:400;color:#5a5c63;line-height:1.6;word-break:keep-all}
.ys-bd-review .rv-more{align-self:flex-start;font-size:1rem;font-weight:700;color:#0B318F;line-height:1.43}
.ys-bd-review .rv-full[hidden]{display:none}
/* 상세 팝업 — 신청서 약관 팝업(Figma 8151:16544)과 동일한 규격 */
.ys-bd-review .rv-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:1.25rem}
.ys-bd-review .rv-modal.open{display:flex}
.ys-bd-review .rv-modal-bg{position:absolute;inset:0;background:rgba(17,17,17,.7)}
.ys-bd-review .rv-modal-wrap{position:relative;z-index:1;display:flex;flex-direction:column;width:100%;max-width:42.8125rem}
.ys-bd-review .rv-close{align-self:flex-end;display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;margin:0 0 .75rem;padding:0;border:0;border-radius:0;background:none;line-height:0;cursor:pointer}
.ys-bd-review .rv-close img{display:block;width:1.25rem;height:1.25rem}
.ys-bd-review .rv-modal-box{position:relative;display:flex;flex-direction:column;gap:1.9375rem;width:100%;max-height:calc(100vh - 6rem);padding:2.5rem 2.1875rem;background:#fff;border-radius:0;overflow:visible;box-shadow:none;box-sizing:border-box}
.ys-bd-review .rv-modal-head{padding-bottom:1.25rem;border-bottom:1px solid #000}
.ys-bd-review .rv-modal-box .rv-badges{justify-content:flex-start;gap:.75rem;margin-bottom:.75rem;font-size:.875rem}
.ys-bd-review .rv-head-row{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.ys-bd-review .rv-modal-box .rv-name{margin:0;font-size:1.25rem;font-weight:600;color:#141414;letter-spacing:-.005em;line-height:1.45}
.ys-bd-review .rv-modal-box .rv-org{margin:.375rem 0 0}
.ys-bd-review .rv-mdate{flex:none;margin:0;font-size:.9375rem;color:#878a93;line-height:1.5;white-space:nowrap}
.ys-bd-review .rv-body{flex:0 1 auto;min-height:0;max-height:17.875rem;padding:0 1.4375rem 0 0;border:0;overflow-y:auto;font-size:1.125rem;font-weight:400;color:#5a5c63;line-height:1.5;word-break:keep-all;overflow-wrap:anywhere}
.ys-bd-review .rv-body::-webkit-scrollbar{width:2px}
.ys-bd-review .rv-body::-webkit-scrollbar-track{background:#ddd;border-radius:.625rem}
.ys-bd-review .rv-body::-webkit-scrollbar-thumb{background:#888;border-radius:.625rem}
.ys-bd-review .rv-body *{font-size:1.125rem;font-weight:400;color:#5a5c63;line-height:1.5}
.ys-bd-review .rv-body img{max-width:100%;height:auto}
@supports not selector(::-webkit-scrollbar){
  .ys-bd-review .rv-body{scrollbar-width:thin;scrollbar-color:#888 #ddd}
}
@media(max-width:1024px){
  .ys-bd-review .rv-lead{font-size:1rem}
  .ys-bd-review .rv-card{padding:1.25rem}
  .ys-bd-review .rv-name{font-size:1.25rem}
  .ys-bd-review .rv-ex{font-size:1rem}
  .ys-bd-review .rv-date,
  .ys-bd-review .rv-more{font-size: 0.9375rem;}
  .ys-bd-review .rv-modal-box{gap:1.25rem;padding:1.5rem 1.25rem}
  .ys-bd-review .rv-modal-head{padding-bottom:.875rem}
  .ys-bd-review .rv-modal-box .rv-name{font-size:1.25rem}
  .ys-bd-review .rv-body{padding-right:1rem}
  .ys-bd-review .rv-body, .ys-bd-review .rv-body *{font-size:1rem}
}
@media(max-width:768px){
  .ys-bd-review .rv-grid{grid-template-columns:1fr;gap:.75rem}
  .ys-bd-review .rv-modal{padding:1rem}
  .ys-bd-review .rv-modal-box{max-height:calc(100vh - 6rem)}
}