@charset "UTF-8";
/* ====================================================================================================
   채용공고 게시판 스킨 (view3_recruit_00)
   · 값은 Figma(6VyWMIbCAfkN6wryUq1iLm / 1:386) 추출값. 1920 캔버스 · 콘텐츠 폭 1500 기준.
   · 모든 선택자는 .rc_board 하위. 공통 CSS 는 건드리지 않는다.
   · 기본 모바일 → 768 / 1080 / 1260 확장 (기존 사이트 브레이크포인트).
   ==================================================================================================== */

.rc_board{width:90%;max-width:1500px;margin:30px auto 0}

/* ---- 필터 ----------------------------------------------------------------------------------------- */
.rc_board .rc_filter_fields{display:flex;flex-wrap:wrap;gap:8px}
.rc_board .rc_field{width:100%}
.rc_board .rc_field_kwd{position:relative}
.rc_board .rc_sel,
.rc_board .rc_kwd{width:100%;height:50px;padding:0 20px;border:0;border-radius:0;box-sizing:border-box;background-color:rgba(255,255,255,0.7);font-family:'NotoSansKR-Regular';font-size:1rem;letter-spacing:-0.02em;color:#555}
.rc_board .rc_sel{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:50px;background-image:url('../img/rc_sel_arrow260807.svg');background-repeat:no-repeat;background-position:right 20px center;background-size:18px 9px}
.rc_board .rc_sel::-ms-expand{display:none}
.rc_board .rc_kwd{padding-right:55px}
.rc_board .rc_kwd::-webkit-input-placeholder{color:#888}
.rc_board .rc_kwd:-ms-input-placeholder{color:#888}
.rc_board .rc_kwd::placeholder{color:#888}
.rc_board .rc_kwd_btn{overflow:hidden;position:absolute;right:20px;top:50%;width:27px;height:27px;margin-top:-13.5px;padding:0;border:0;background:url('../img/rc_search260807.svg') no-repeat center;background-size:27px 27px;cursor:pointer}
.rc_board .rc_reset{display:flex;align-items:center;justify-content:center;gap:10px;height:50px;margin-top:8px;padding:0 20px;border-radius:8px;background:#e4e4e4;font-family:'NotoSansKR-Medium';font-size:0.875rem;letter-spacing:-0.02em;color:#555}
.rc_board .rc_reset:before{content:'';display:block;flex:none;width:19px;height:20px;background:url('../img/rc_reset260807.svg') no-repeat center;background-size:19px 20px}

/* ---- 리스트 --------------------------------------------------------------------------------------- */
.rc_board .rc_table{margin-top:30px}
.rc_board .rc_thead{display:none}
.rc_board .rc_nodata{padding:60px 0;border-top:1px solid rgba(0,0,0,0.1);font-family:'NotoSansKR-DemiLight';font-size:1rem;letter-spacing:-0.02em;color:#555}
.rc_board .rc_list{border-top:1px solid rgba(0,0,0,0.1)}
.rc_board .rc_item{display:flex;flex-wrap:wrap;align-items:center;padding:24px 0;border-bottom:1px solid rgba(0,0,0,0.1)}
.rc_board .rc_item .rc_col_ttl{order:1;width:100%}
.rc_board .rc_item_head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rc_board .rc_badge{display:flex;align-items:center;justify-content:center;flex:none;width:100px;height:36px;border-radius:99px;background:#bf1e2e;font-family:'NotoSansKR-Bold';font-size:0.875rem;letter-spacing:-0.02em;color:#fff}
.rc_board .rc_state_end .rc_badge{background:#888}
.rc_board .rc_item_ttl{font-family:'NotoSansKR-Medium';font-size:1.0625rem;line-height:1.5;letter-spacing:-0.02em;color:#000}
.rc_board .rc_item_date{display:flex;align-items:center;gap:10px;margin-top:10px}
.rc_board .rc_left{font-family:'NotoSansKR-Medium';font-size:0.875rem;line-height:1.5;letter-spacing:-0.02em;color:#555}
.rc_board .rc_date_bar{display:block;width:1px;height:16px;background:#000;opacity:0.1}
.rc_board .rc_term{font-family:'NotoSansKR-DemiLight';font-size:0.875rem;line-height:1.5;letter-spacing:-0.02em;color:#555}
.rc_board .rc_item .rc_col_sca,
.rc_board .rc_item .rc_col_role,
.rc_board .rc_item .rc_col_career{margin:12px 8px 0 0;padding:4px 10px;background:rgba(0,0,0,0.04);font-family:'NotoSansKR-Medium';font-size:0.8125rem;line-height:1.5;letter-spacing:-0.02em;color:#555}
.rc_board .rc_item .rc_col_sca{order:2}
.rc_board .rc_item .rc_col_role{order:3}
.rc_board .rc_item .rc_col_career{order:4}

/* ---- 페이징 --------------------------------------------------------------------------------------- */
.rc_board .rc_paging{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:40px}
.rc_board .rc_pg_arrow{display:block;width:24px;height:24px;background:url('../img/rc_page_arrow260807.svg') no-repeat center;background-size:24px 24px}
.rc_board .rc_pg_prev{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.rc_board .rc_pg_off{opacity:0.25}
.rc_board .rc_pg_num{display:flex;align-items:center;gap:8px}
.rc_board .rc_pg{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:18px;font-family:'NotoSansKR-Regular';font-size:1rem;letter-spacing:-0.02em;color:#000}
.rc_board .rc_pg.on{background:#bf1e2e;font-family:'NotoSansKR-Bold';color:#fff}

/* ====================================================================================================
   상세 (Figma 30:552) — 콘텐츠 폭 1200
   ==================================================================================================== */
/* enter_5.css 의 `.rc_page > div`(0,1,1) 보다 세야 하므로 클래스 2개로 잡는다 */
.rc_board.rc_view{max-width:1200px;margin-top:40px}
.rc_view .rc_item{cursor:default}

.rc_view_head{padding-bottom:16px}
.rc_view_ttl{font-family:'NotoSansKR-Bold';font-size:1.25rem;line-height:1.5;letter-spacing:-0.02em;color:#000}
.rc_view_date{margin-top:6px;font-family:'NotoSansKR-Regular';font-size:0.9375rem;line-height:1.5;letter-spacing:-0.02em;color:#555}

.rc_view_info{border-top:1px solid #e5e5e5}
.rc_info_row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid #e5e5e5}
.rc_info_ttl{flex:none;font-family:'NotoSansKR-Regular';font-size:0.875rem;line-height:1.5;letter-spacing:-0.02em;color:#767676}
.rc_info_val{overflow:hidden;font-family:'NotoSansKR-Medium';font-size:0.9375rem;line-height:1.5;letter-spacing:-0.02em;color:#000;text-align:right;text-overflow:ellipsis}

.rc_view_body{padding:30px 0}
.rc_view_img + .rc_view_img{margin-top:10px}
.rc_view_img img{display:block;margin:0 auto}
.rc_view_txt{padding-top:20px;font-family:'NotoSansKR-Regular';font-size:0.9375rem;line-height:1.7;letter-spacing:-0.02em;color:#333;word-break:break-all}
.rc_view_txt img{max-width:100%;height:auto}
.rc_view_file{margin-top:20px;padding-top:16px;border-top:1px solid #e5e5e5}
.rc_view_file li + li{margin-top:6px}
.rc_view_file a{font-family:'NotoSansKR-Regular';font-size:0.875rem;letter-spacing:-0.02em;color:#555;text-decoration:underline}

.rc_view_nav{border-top:1px solid #e5e5e5}
.rc_nav_row{display:flex;align-items:center;gap:12px;padding:16px 8px;border-bottom:1px solid #e5e5e5}
.rc_nav_ico{flex:none;width:20px;height:20px;background:url('../img/rc_chevron260807.svg') no-repeat center;background-size:20px 20px}
.rc_nav_prev .rc_nav_ico{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}
.rc_nav_next .rc_nav_ico{-webkit-transform:rotate(90deg);transform:rotate(90deg)}
.rc_nav_ttl{flex:1 1 auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:'NotoSansKR-Regular';font-size:0.875rem;line-height:1.5;letter-spacing:-0.02em;color:#000}
.rc_nav_date{flex:none;font-family:'NotoSansKR-Regular';font-size:0.875rem;line-height:1.5;letter-spacing:-0.02em;color:#999}

.rc_view_btn{margin-top:40px}
.rc_list_btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border:1px solid #bbb;border-radius:6px;background:#fdfdfd;font-family:'NotoSansKR-Medium';font-size:0.9375rem;line-height:1.5;letter-spacing:-0.02em;color:#767676}

/* ==================================================================================================== */
@media screen and (min-width:768px) {
    .rc_board{margin-top:50px}
    .rc_view_ttl{font-size:1.375rem}
    .rc_board .rc_filter{display:flex;align-items:center;justify-content:space-between}
    .rc_board .rc_filter_fields{flex:1;gap:12px}
    .rc_board .rc_field_sel{width:calc(50% - 6px)}
    .rc_board .rc_field_kwd{width:100%}
    .rc_board .rc_reset{flex:none;margin-top:0;margin-left:12px}
    .rc_board .rc_item_ttl{font-size:1.25rem}
    .rc_board .rc_badge{font-size:1rem}
}

/* ==================================================================================================== */
@media screen and (min-width:1080px) {
    /* 상세 : 정보 2×2 배치 */
    .rc_view_info{display:flex;flex-wrap:wrap}
    .rc_info_row{width:50%;box-sizing:border-box}
    .rc_view_body{padding:40px 0}

    /* 1080~1260 구간에서는 Figma 고정폭(200/400)이 넘쳐서 비율로 늘린다. 1260 이상에서 고정폭으로 되돌린다. */
    .rc_board .rc_filter_fields{flex-wrap:nowrap;gap:16px}
    .rc_board .rc_field_sel{flex:1 1 0;width:auto;min-width:0}
    .rc_board .rc_field_kwd{flex:2 1 0;width:auto;min-width:0}
    .rc_board .rc_sel,
    .rc_board .rc_kwd{padding-left:12px}
    .rc_board .rc_sel{padding-right:38px;background-position:right 12px center}

    /* 테이블형 전환 : Figma 컬럼비 150 / 900 / 250 / 250 */
    .rc_board .rc_thead{display:flex;align-items:center;border-bottom:1px solid rgba(0,0,0,0.1)}
    .rc_board .rc_thead span{display:block;padding:20px 10px;box-sizing:border-box;font-family:'NotoSansKR-DemiLight';font-size:1rem;line-height:1.5;letter-spacing:-0.02em;color:#555;text-align:center}
    .rc_board .rc_list{padding-top:48px;border-top:0}
    .rc_board .rc_item{flex-wrap:nowrap;align-items:flex-start;padding:0 0 48px}
    .rc_board .rc_item + .rc_item{padding-top:48px}
    .rc_board .rc_col_sca{width:9.677%}
    .rc_board .rc_col_ttl{width:58.065%}
    .rc_board .rc_col_role{width:16.129%}
    .rc_board .rc_col_career{width:16.129%}
    .rc_board .rc_item .rc_col_ttl{order:0;padding:0 20px;box-sizing:border-box}
    .rc_board .rc_item .rc_col_sca,
    .rc_board .rc_item .rc_col_role,
    .rc_board .rc_item .rc_col_career{display:flex;align-items:center;justify-content:center;order:0;min-height:82px;margin:0;padding:0;background:none;font-family:'NotoSansKR-Medium';font-size:1rem;line-height:1.5;letter-spacing:-0.02em;color:#555;text-align:center}
    .rc_board .rc_item_head{flex-wrap:nowrap;gap:12px}
    .rc_board .rc_item_date{gap:16px;margin-top:16px}
    .rc_board .rc_left,
    .rc_board .rc_term{font-size:1rem}
    .rc_board .rc_paging{margin-top:60px}
}

/* ==================================================================================================== */
@media screen and (min-width:1260px) {
    /* 상세 : Figma 실측값 */
    .rc_board.rc_view{margin-top:60px}
    .rc_view_ttl{font-size:1.5rem}                /* 24px */
    .rc_view_date{margin-top:10px;font-size:1.125rem}  /* 18px */
    .rc_view_head{padding-bottom:20px}
    .rc_info_ttl{font-size:1rem}                  /* 16px */
    .rc_info_val{font-size:1.125rem}              /* 18px */
    .rc_view_body{padding:62px 0}
    .rc_nav_ttl,
    .rc_nav_date{font-size:1rem}                  /* 16px */
    .rc_view_btn{margin-top:80px}
    .rc_list_btn{font-size:1.125rem}              /* 18px */

    .rc_board{margin-top:80px}
    /* Figma 고정폭(200/400)은 컨테이너가 1500 일 때만 들어간다.
       1260~1580 구간에서는 컨테이너가 그보다 좁으므로 flex-shrink 로 줄어들게 둔다. */
    .rc_board .rc_field_sel{flex:0 1 200px;width:auto;min-width:0}
    .rc_board .rc_field_kwd{flex:0 1 400px;width:auto;min-width:0}
    .rc_board .rc_filter_fields{min-width:0}
    .rc_board .rc_sel,
    .rc_board .rc_kwd{padding-left:20px;font-size:1.125rem}   /* 18px */
    .rc_board .rc_sel{padding-right:50px;background-position:right 20px center}
    .rc_board .rc_reset{font-size:1rem}           /* 16px */
    .rc_board .rc_table{margin-top:60px}
    .rc_board .rc_thead span{font-size:1.125rem}
    .rc_board .rc_badge{font-size:1.125rem}
    .rc_board .rc_item_ttl{font-size:1.5rem}      /* 24px */
    .rc_board .rc_left,
    .rc_board .rc_term,
    .rc_board .rc_item .rc_col_sca,
    .rc_board .rc_item .rc_col_role,
    .rc_board .rc_item .rc_col_career{font-size:1.25rem}   /* 20px */
    .rc_board .rc_paging{margin-top:80px}
}
