/* 작업의뢰 화면을 협업 서비스 톤앤매너에 맞춰 정리한다. */

/* 작업의뢰 공통 레이아웃 간격과 배경을 정의한다. */
.work-request-page {
    background-color: var(--ref-bg-base);
}

/* 작업의뢰 목록/폼 공통 본문 폭과 여백을 정의한다. */
.work-request-page .job-board-wrapper {
    max-width: 1200px;
    padding: 0px 0px 56px;
    box-sizing: border-box;
}

/* 작업의뢰 상세/회사소개 본문 폭과 여백을 정의한다. */
.work-request-page .job-detail-wrapper {
    max-width: 1200px;
    padding: 32px 24px 56px;
    box-sizing: border-box;
}

/* 작업의뢰 공통 페이지 타이틀 톤을 협업 화면과 맞춘다. */
.work-request-page .page-title,
.work-request-page .form-title,
.work-request-page .job-detail-title,
.work-request-page .requester-company-hero-title {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 26px;
    font-weight: 600;
    color: var(--ref-ink);
    line-height: 1.25;
    margin-top: 10px;
}

/* 작업의뢰 공통 보조 설명 문구 톤을 정의한다. */
.work-request-page .page-subtitle,
.work-request-page .work-request-public-profile-desc,
.work-request-page .work-request-form-help,
.work-request-page .setting-row-desc {
    margin: 8px 0 0;
    color: var(--ref-gray-700);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
}

/* 작업의뢰 리스트 상단 헤더 정렬을 정의한다. */
.work-request-page .job-board-header {
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 20px;
}

/* 작업의뢰 메인 목록 헤더를 단기 채용 공고 목록과 동일한 흐름으로 정렬한다. */
.work-request-page.work-request-view-page .job-board-header {
    align-items: center;
    gap: 0;
}

/* 내 작업의뢰 상단 요약 영역의 하단 간격을 정의한다. */

/* 작업의뢰 필터 칩 배치를 정의한다. */
.work-request-page .job-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* 작업의뢰 필터 칩 기본 스타일을 정의한다. */
.work-request-page .filter-chip {
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid var(--k-color-gray-d1);
    border-radius: var(--k-radius-pill);
    background-color: var(--k-bg-white);
    color: var(--ref-gray-700);
    font-size: 13px;
    font-weight: 500;
}

/* 작업의뢰 필터 칩 hover 상태를 정의한다. */
.work-request-page .filter-chip:hover {
    border-color: var(--job-color-primary);
    color: var(--job-color-primary);
    background-color: #ecfdf5;
}

/* 작업의뢰 필터 칩 활성 상태를 정의한다. */
.work-request-page .filter-chip.active {
    border-color: var(--job-color-primary);
    background-color: #ecfdf5;
    color: var(--job-color-primary);
}

/* 작업의뢰 목록 테이블과 페이지네이션 간격을 정리한다. */
.work-request-page .job-pagination {
    margin-top: 22px;
}

/* 작업의뢰 모바일 카드 결과물 요약 영역을 정의한다. */

/* 작업의뢰 모바일 카드 결과물 라벨을 정의한다. */

/* 작업의뢰 모바일 카드 결과물 값을 정의한다. */

/* 작업의뢰 폼 외곽 컨테이너를 페이지 레이아웃 기준으로 정리한다. */
.work-request-page.work-request-form-layout .form-container,
.work-request-page.work-request-public-profile-page .form-container {
    max-width: 1040px;
    margin: 0 auto;
    padding: 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

/* 회사 프로필 수정 화면을 이미지 기준의 넓은 단일 폼 폭으로 맞춘다. */
.work-request-page.work-request-public-profile-page .company-profile-edit-form {
    max-width: 1200px;
    margin: 32px 0 0;
    padding: 0 0px 56px;
}

/* 작업의뢰 폼 헤더 간격을 정리한다. */
.work-request-page .work-request-form-header,
.work-request-page .work-request-public-profile-header {
    margin-bottom: 32px;
    padding: 0 4px;
}

/* 회사 프로필 섹션 간격을 이미지 흐름에 맞춘다. */
.work-request-page .company-profile-image-form .company-profile-form-section {
    margin-bottom: 64px;
}

/* 회사 프로필 페이지 제목 크기를 이미지 기준으로 조정한다. */
.work-request-page .company-profile-image-form .page-title {
    margin-top: 0;
    font-size: 26px;
}

/* 회사 프로필 섹션 제목과 구분선을 정의한다. */
.work-request-page .company-profile-image-form .company-profile-form-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 30px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--job-color-border);
    color: var(--job-color-text);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
}

/* 회사 프로필 섹션 체크 아이콘을 이미지 톤으로 표시한다. */
.work-request-page .company-profile-section-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: var(--k-radius-pill);
    background-color: var(--ref-logo-coral);
    color: var(--k-bg-white);
    font-size: 8px;
    line-height: 1;
    flex-shrink: 0;
}

/* 회사 프로필 로고 영역을 이미지와 같은 가로 흐름으로 배치한다. */
.work-request-page .company-profile-logo-row {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    align-items: center;
    gap: 32px;
    padding-left: 28px;
}

/* 회사 프로필 로고 미리보기 크기를 고정해 레이아웃 흔들림을 줄인다. */
.work-request-page .company-profile-logo-preview {
    width: 170px;
    height: 90px;
    border: 1px solid var(--job-color-border);
    border-radius: var(--k-radius-md);
    background-color: var(--k-bg-white);
}

/* 회사 프로필 로고 도움말과 버튼을 세로 흐름으로 정렬한다. */
.work-request-page .company-profile-logo-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

/* 회사 프로필 로고 업로드 안내문을 이미지와 같은 작은 문구로 표시한다. */
.work-request-page .company-profile-logo-help {
    margin: 0;
    color: var(--job-color-text-light);
    font-size: 13px;
    line-height: 1.5;
}

/* 회사 프로필 로고 버튼 묶음의 간격을 정의한다. */
.work-request-page .company-profile-logo-buttons {
    align-items: center;
    gap: 8px;
    margin: 0;
}

/* 회사 프로필 입력 본문을 라벨/입력 행 구조로 정렬한다. */
.work-request-page .company-profile-form-body {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding-left: 24px;
}

/* 회사 프로필 입력 행을 좌측 라벨과 우측 입력으로 구성한다. */
.work-request-page .company-profile-form-row {
    display: grid;
    grid-template-columns: 76px minmax(0, 560px);
    align-items: center;
    gap: 22px;
    min-width: 0;
}

/* 회사 프로필 라벨을 이미지 기준의 굵기와 색상으로 맞춘다. */
.work-request-page .company-profile-image-form .label-freemode {
    margin-bottom: 0;
    color: var(--job-color-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

/* 회사 프로필 입력 요소의 높이와 테두리를 이미지와 맞춘다. */
.work-request-page .company-profile-image-form .input-freemode,
.work-request-page .company-profile-image-form .select-freemode {
    height: 36px;
    border-color: var(--job-color-border);
    background-color: var(--k-bg-white);
}

/* 회사 프로필 기업구분과 근로자수를 한 줄에 배치한다. */
.work-request-page .company-profile-form-row-inline {
    grid-template-columns: 76px 210px 86px 130px;
}

/* 회사 프로필 기업구분 선택 상자의 폭을 고정한다. */
.work-request-page .company-profile-select {
    width: 210px;
}

/* 회사 프로필 근로자수 라벨 간격을 한 줄 배치에 맞춘다. */
.work-request-page .company-profile-worker-label {
    justify-self: end;
}

/* 회사 프로필 근로자수 입력과 단위를 정렬한다. */
.work-request-page .company-profile-worker-field {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* 회사 프로필 근로자수 입력 폭을 고정한다. */
.work-request-page .company-profile-worker-input {
    width: 78px;
    text-align: right;
}

/* 회사 프로필 근로자수 단위 문구를 본문 톤으로 표시한다. */
.work-request-page .company-profile-worker-field span {
    color: var(--job-color-text-light);
    font-size: 13px;
    white-space: nowrap;
}

/* 회사 프로필 짧은 입력 행 폭을 이미지에 맞춘다. */
.work-request-page .company-profile-form-row-short {
    grid-template-columns: 76px 210px;
}

/* 회사 프로필 설립일 입력 폭을 고정한다. */
.work-request-page .company-profile-date-input {
    width: 210px;
}

/* 회사 프로필 소재지 행을 근무지 주소와 같은 2줄 구조로 배치한다. */
.work-request-page .company-profile-form-row-address {
    grid-template-columns: 76px minmax(0, 1fr);
    max-width: none;
}

/* 회사 프로필 주소 입력 그룹 간격을 근무지 주소와 동일하게 맞춘다. */
.work-request-page .company-profile-address-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 회사 프로필 주소 읽기 전용 입력 배경을 근무지 주소와 동일하게 유지한다. */
.work-request-page .company-profile-address-group .form-control[readonly] {
    background: var(--k-bg-white);
    cursor: default;
}

/* 회사 프로필 소개 입력 영역을 전체 폭으로 배치한다. */
.work-request-page .company-profile-intro-body {
    padding-left: 0;
}

/* 회사 프로필 소개 textarea 높이를 이미지와 맞춘다. */
.work-request-page .company-profile-intro-body .work-request-public-profile-textarea {
    width: 100%;
    min-height: 306px;
    resize: vertical;
}

/* 회사 프로필 하단 액션 버튼 폭과 높이를 이미지에 맞춘다. */
.work-request-page .company-profile-image-form .work-request-public-profile-actions .btn-freemode {
    min-width: 134px;
    height: 44px;
}

@media screen and (max-width: 640px) {
    /* 모바일에서 회사 프로필 로고 편집 영역을 단일 열로 전환한다. */
    .work-request-page .company-profile-logo-row {
        grid-template-columns: 1fr;
        padding-left: 0;
    }

    .work-request-page .company-profile-logo-preview {
        width: 100%;
    }

    .work-request-page .company-profile-logo-buttons {
        flex-wrap: wrap;
    }

    .work-request-page .company-profile-form-body {
        padding-left: 0;
    }

    .work-request-page .company-profile-form-row,
    .work-request-page .company-profile-form-row-inline,
    .work-request-page .company-profile-form-row-short,
    .work-request-page .company-profile-form-row-address {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .work-request-page .company-profile-select,
    .work-request-page .company-profile-date-input {
        width: 100%;
    }

    .work-request-page .company-profile-worker-label {
        justify-self: start;
    }

}

/* 작업의뢰 폼 카드 톤을 협업 카드와 통일한다. */
.work-request-page .work-request-public-profile-form .card-freemode {
    margin-bottom: 18px;
    padding: 24px;
    border: var(--k-border-thin);
    border-radius: var(--k-radius-md);
    box-shadow: var(--k-shadow-hard-sm) !important;
}

/* 외주 프로젝트 등록 화면을 이미지 기준의 섹션형 폭으로 확장한다. */
.work-request-page.work-request-form-layout .work-request-registration-form-page {
    max-width: 1260px;
    padding: 32px 0 48px;
}

/* 외주 프로젝트 등록 화면 섹션 본문 좌우 여백을 단기 채용 등록 화면과 맞춘다. */
.work-request-page .work-request-registration-section .job-posting-section-body {
    padding-left: 24px;
    padding-right: 24px;
}

/* 외주 프로젝트 등록 화면 행 내부 체크박스를 입력 컨트롤 높이에 맞춘다. */
.work-request-page .work-request-inline-check {
    min-height: var(--k-input-height);
}

/* 외주 프로젝트 등록 화면 필요기술 칩 목록 간격을 정의한다. */
.work-request-page .work-request-skill-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 32px;
}

/* 외주 프로젝트 등록 화면 필요기술 칩 형태를 정의한다. */
.work-request-page .work-request-skill-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 12px;
    border-radius: var(--k-radius-pill);
    background: var(--k-bg-gray-light);
    color: var(--ref-ink);
    font-size: 13px;
    font-weight: 600;
}

/* 외주 프로젝트 등록 화면 필요기술 칩 삭제 버튼을 아이콘형으로 정리한다. */
.work-request-page .work-request-skill-chip button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 0;
    border-radius: var(--k-radius-pill);
    background: transparent;
    color: var(--k-color-gray-888);
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
}

/* 외주 프로젝트 등록 화면 큰 입력 영역의 높이를 이미지 기준으로 맞춘다. */
.work-request-page .work-request-large-textarea {
    min-height: 280px;
}

/* 외주 프로젝트 등록 화면 읽기 전용 담당자 입력 배경을 유지한다. */
.work-request-page .work-request-registration-form-page .form-control[readonly]:not(.work-request-date-input) {
    background: var(--k-bg-white);
    cursor: default;
}

/* 외주 프로젝트 등록 화면 준비자료 입력 그룹 간격을 분리한다. */
.work-request-page .work-request-material-field {
    margin-bottom: 18px;
}

/* 외주 프로젝트 등록 화면 준비자료 마지막 입력 그룹의 하단 여백을 정리한다. */
.work-request-page .work-request-material-field:last-child {
    margin-bottom: 0;
}

/* 외주 프로젝트 등록 화면 하단 주요 버튼을 중앙에 배치한다. */
.work-request-page .work-request-form-actions .job-form-action-primary {
    display: flex;
    justify-content: center;
    gap: 10px;
}

/* 작업의뢰 폼 섹션 타이틀 톤을 정리한다. */
.work-request-page .setting-page-title {
    margin: 0;
    color: var(--ref-ink);
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 12px;
}

/* 작업의뢰 폼 라벨 톤을 협업 입력 라벨과 맞춘다. */
.work-request-page .form-container .form-label {
    color: var(--ref-ink);
    font-size: 14px;
    font-weight: 500;
}

/* 작업의뢰 폼 입력 기본 톤을 협업 입력 스타일에 맞춘다. */
.work-request-page .form-container .form-control {
    height: var(--k-input-height);
    padding: 0 14px;
    border: var(--k-border-thin);
    border-radius: var(--k-radius-md);
    color: var(--ref-ink);
    font-size: 14px;
    background-color: var(--k-bg-white);
}

/* 작업의뢰 폼 textarea 높이와 패딩을 정리한다. */
.work-request-page .form-container textarea.form-control {
    height: auto;
    padding: 10px 14px;
}

/* 작업의뢰 폼 버튼 영역 간격을 정리한다. */
.work-request-page .btn-area {
    margin-top: 28px;
}

/* 작업의뢰 폼 하단 액션 영역을 저장 버튼 그룹 기준으로 중앙 정렬한다. */
.work-request-page .work-request-form-actions {
    align-items: center;
    justify-content: center;
}

/* 작업의뢰 수정 화면 삭제 버튼을 왼쪽 끝에 배치한다. */

/* 작업의뢰 일정 입력 필드를 달력 컴포넌트용 입력처럼 표시한다. */
.work-request-page .work-request-date-input {
    cursor: pointer;
    background-color: var(--k-bg-white);
}

/* 작업의뢰 상세 상단 요약 카드를 정의한다. */
.work-request-page .job-detail-header {
    padding: 26px 28px;
    border: var(--k-border-thin);
    border-radius: var(--k-radius-md);
    border-bottom: var(--k-border-thin);
    background-color: var(--k-bg-white);
    box-shadow: var(--k-shadow-hard-sm);
}

/* 작업의뢰 상세 콘텐츠 영역 간격을 정리한다. */
.work-request-page .job-detail-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* 작업의뢰 상세 섹션을 카드형 블록으로 정리한다. */
.work-request-page .job-detail-section {
    margin-bottom: 0;
    padding: 24px;
    border: var(--k-border-thin);
    border-radius: var(--k-radius-md);
    background-color: var(--k-bg-white);
    box-shadow: var(--k-shadow-hard-sm);
}

/* 작업의뢰 상세 섹션 타이틀 톤을 정의한다. */
.work-request-page .section-title {
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--k-color-gray-f0);
    color: var(--ref-ink);
    font-size: 17px;
    font-weight: 600;
}

/* 작업의뢰 상세 메타 정보를 보조 정보 톤으로 정리한다. */
.work-request-page .job-detail-meta {
    gap: 20px;
    flex-wrap: wrap;
    color: var(--ref-gray-700);
    font-size: 13px;
}

/* 작업의뢰 상세 메타 아이콘 묶음 간격을 정의한다. */

/* 작업의뢰 상세 한 줄 브리프 문구를 정의한다. */

/* 작업의뢰 상세 핵심 요약 카드를 배치한다. */

/* 작업의뢰 상세 핵심 요약 카드 스타일을 정의한다. */

/* 작업의뢰 상세 핵심 요약 라벨을 정의한다. */

/* 작업의뢰 상세 핵심 요약 값을 정의한다. */

/* 작업의뢰 상세 정보 라벨 톤을 정의한다. */
.work-request-page .info-label {
    color: var(--ref-gray-700);
    font-weight: 500;
}

/* 작업의뢰 상세 본문 문단 톤을 정의한다. */
.work-request-page .content-text {
    color: var(--k-text-body);
}

/* 작업의뢰 상세 내부 카드형 보조 박스 톤을 통일한다. */
.work-request-page .requester-profile-info-item,
.work-request-page .requester-company-copy-block,
.work-request-page .work-request-guide-box {
    border-radius: var(--k-radius-md);
    border: var(--k-border-thin);
    box-shadow: none;
}

/* 작업의뢰 공개 프로필 배지 톤을 메인 컬러 기준으로 정리한다. */

/* 작업의뢰 회사소개 대표 카드 톤을 협업 카드와 통일한다. */

/* 작업의뢰 회사소개 화면은 채용 회사소개 화면과 동일하게 카드 장식을 제거한다. */
.work-request-page.work-request-company-page .job-detail-wrapper.job-posting-detail-page.requester-company-page {
    max-width: 1180px;
    padding: 32px 24px 64px;
}

/* 작업의뢰 회사소개 섹션은 채용 회사소개와 동일하게 카드형 블록을 사용하지 않는다. */
.work-request-page.work-request-company-page .job-detail-section {
    margin-bottom: 58px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 회사소개 섹션 제목을 채용 회사소개와 동일한 문서형 제목으로 표시한다. */
.work-request-page.work-request-company-page .section-title {
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--job-color-border);
    color: var(--job-color-text);
    font-size: 16px;
    font-weight: 800;
    gap: 9px;
}

/* 작업의뢰 회사소개 대표 영역을 채용 회사소개와 같은 낮은 장식 패널로 표시한다. */

/* 작업의뢰 회사소개 상단 회사명을 채용 회사소개와 동일하게 표시한다. */
.work-request-page.work-request-company-page .requester-company-hero-title {
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--job-color-text);
    font-size: 26px;
    font-weight: 800;
    line-height: 1.25;
}

/* 작업의뢰 회사소개 상단 설명 문구를 채용 회사소개와 동일하게 표시한다. */

/* 작업의뢰 회사소개 상단 브랜드명을 채용 회사소개와 동일한 톤으로 표시한다. */

/* 작업의뢰 회사소개 통계 항목의 카드 테두리와 그림자를 제거한다. */

/* 작업의뢰 회사소개 본문 블록을 채용 회사소개처럼 문서형으로 표시한다. */
.work-request-page.work-request-company-page .requester-company-copy-block {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 회사소개 최근 목록 카드를 채용 회사소개와 같은 절제된 목록형으로 표시한다. */

/* 작업의뢰 회사소개 최근 목록 hover 장식을 채용 회사소개와 동일하게 낮춘다. */

/* 공통 기업정보 화면의 전체 문서 폭과 여백을 정의한다. */
.company-profile-page.job-posting-detail-page {
    max-width: 1180px;
    padding: 32px 24px 64px;
}

/* 공통 기업정보 화면 섹션을 이미지 기준의 문서형 블록으로 표시한다. */
.company-profile-page .job-detail-section {
    margin: 0 0 58px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 공통 기업정보 화면 최상단 제목을 정의한다. */
.company-profile-page .company-profile-title {
    margin: 0 0 32px;
    color: var(--job-color-text);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.35;
}

/* 공통 기업정보 상단 요약 패널을 연한 배경 박스로 표시한다. */
.company-profile-page .company-profile-overview-card {
    padding: 22px 16px 24px;
    border-radius: 8px;
    background: var(--k-color-gray-fa);
}

/* 공통 기업정보 로고와 회사명 행을 배치한다. */
.company-profile-page .company-profile-brand-line {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 24px;
}

/* 공통 기업정보 로고 박스를 디자인 이미지 비율로 표시한다. */
.company-profile-page .company-profile-logo {
    width: 176px;
    height: 54px;
    border-radius: 8px;
    background: var(--k-bg-white);
    color: var(--job-color-text-light);
    font-size: 20px;
}

/* 공통 기업정보 회사명을 로고 옆 주요 텍스트로 표시한다. */
.company-profile-page .company-profile-name {
    margin: 0;
    color: var(--job-color-text);
    font-size: 26px;
    font-weight: 800;
    line-height: 1.25;
}

/* 공통 기업정보 기본 정보 그리드를 2열 문서형으로 정리한다. */
.company-profile-page .company-profile-info-panel {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 96px;
    row-gap: 16px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

/* 공통 기업정보 기본 정보 항목을 라벨과 값으로 배치한다. */
.company-profile-page .company-profile-info-panel .requester-profile-info-item {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 공통 기업정보 기본 정보 라벨 톤을 정의한다. */
.company-profile-page .company-profile-info-panel .requester-profile-info-label {
    color: var(--job-color-text-light);
    font-size: 14px;
    font-weight: 600;
    text-align: left;
}

/* 공통 기업정보 기본 정보 값을 진하게 표시한다. */
.company-profile-page .company-profile-info-panel .requester-profile-info-value {
    color: var(--job-color-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
    text-align: left;
    word-break: break-word;
}

/* 공통 기업정보 회사소개 본문을 문서형 텍스트로 표시한다. */
.company-profile-page .requester-company-copy-block {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--job-color-text);
    font-size: 14px;
    line-height: 1.85;
}

/* 공통 기업정보 섹션 제목과 더보기 버튼 행을 배치한다. */
.company-profile-page .company-profile-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--job-color-border);
}

/* 공통 기업정보 섹션 제목이 남은 폭을 채우도록 한다. */
.company-profile-page .company-profile-section-head .section-title {
    flex: 1;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

/* 공통 기업정보 하단 목록 테이블 영역을 정의한다. */
.company-profile-page .company-profile-list-table {
    width: 100%;
}

/* 공통 기업정보 외주 프로젝트 마감 배지를 코랄 포인트로 표시한다. */
.company-profile-page .company-profile-deadline-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 26px;
    padding: 0 10px;
    border-radius: var(--k-radius-pill);
    background: var(--ref-accent-orange-bg-soft);
    color: var(--ref-logo-coral);
    font-size: 12px;
    font-weight: 800;
}

/* 공통 기업정보 마감된 외주 프로젝트 배지 톤을 낮춘다. */
.company-profile-page .company-profile-deadline-badge.is-closed {
    color: var(--job-color-text-light);
}

/* 공통 기업정보 하단 목록 빈 상태를 표시한다. */
.company-profile-page .company-profile-empty-row {
    padding: 26px 16px;
    border-bottom: 1px solid var(--job-color-border);
    color: var(--job-color-text-light);
    font-size: 14px;
    text-align: center;
}

/* 공통 기업정보 안내 문구 박스를 하단에 표시한다. */
.company-profile-page .company-profile-notice {
    margin-top: -6px;
    padding: 18px 20px;
    border-radius: 8px;
    background: var(--k-color-gray-fa);
    color: var(--job-color-text-light);
    font-size: 13px;
    line-height: 1.7;
}

/* 공통 기업정보 안내 문구의 기본 여백을 제거한다. */
.company-profile-page .company-profile-notice p {
    margin: 0;
}

/* 공통 기업정보 안내 문구 사이 간격을 정의한다. */
.company-profile-page .company-profile-notice p + p {
    margin-top: 4px;
}

/* 모바일 공통 기업정보 화면을 단일 열로 재배치한다. */
@media screen and (max-width: 768px) {
    .company-profile-page.job-posting-detail-page {
        padding: 24px 16px 44px;
    }

    .company-profile-page .company-profile-title {
        margin-bottom: 24px;
        font-size: 24px;
    }

    .company-profile-page .company-profile-brand-line {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .company-profile-page .company-profile-logo {
        width: 156px;
        height: 48px;
    }

    .company-profile-page .company-profile-name {
        font-size: 23px;
    }

    .company-profile-page .company-profile-info-panel {
        grid-template-columns: 1fr;
        column-gap: 0;
    }

    .company-profile-page .company-profile-info-panel .requester-profile-info-item {
        grid-template-columns: 86px minmax(0, 1fr);
    }

    .company-profile-page .company-profile-section-head {
        align-items: center;
    }
}

/* 작업의뢰 하단 목록 버튼 영역 간격을 정리한다. */

/* 작업의뢰 상태 배지 크기와 두께를 정리한다. */
.work-request-page .work-request-status-tag {
    font-size: 12px;
    font-weight: 600;
}

/* 작업의뢰 상세 페이지의 외곽 래퍼만 큰 카드로 사용한다. */
.work-request-detail-page .job-detail-wrapper {
    background-color: var(--k-bg-white);
}

/* 작업의뢰 상세 페이지 헤더 카드 스타일을 제거하고 상단 구분선만 유지한다. */
.work-request-detail-page .job-detail-header {
    padding: 0 0 24px;
    border: 0;
    border-bottom: 1px solid var(--k-color-gray-e8);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 페이지 섹션 간격을 카드 대신 구분선 기준으로 재구성한다. */
.work-request-detail-page .job-detail-content {
    gap: 0;
}

/* 작업의뢰 상세 페이지 섹션의 카드 스타일을 제거한다. */
.work-request-detail-page .job-detail-section {
    margin-bottom: 0;
    padding: 28px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 페이지 섹션 사이에만 구분선을 넣는다. */
.work-request-detail-page .job-detail-section + .job-detail-section {
    margin-top: 28px;
    border-top: 1px solid var(--k-color-gray-f0);
}

/* 작업의뢰 상세 페이지 섹션 제목의 카드형 하단 라인을 제거한다. */
.work-request-detail-page .section-title {
    margin-bottom: 16px;
    padding-bottom: 0;
    border-bottom: 0;
}

/* 작업의뢰 상세 페이지의 개별 보조 카드 스타일을 모두 평면형으로 정리한다. */
.work-request-detail-page .work-request-copy-block,
.work-request-detail-page .requester-profile-info-item,
.work-request-detail-page .work-request-guide-box {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 페이지의 링크/첨부파일 행 카드 스타일을 제거한다. */
.work-request-detail-page .work-request-reference-item,
.work-request-detail-page .work-request-attachment-item {
    padding: 14px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 페이지의 링크/첨부파일 행 사이를 구분선으로만 나눈다. */
.work-request-detail-page .work-request-reference-item + .work-request-reference-item,
.work-request-detail-page .work-request-attachment-item + .work-request-attachment-item {
    border-top: 1px solid var(--k-color-gray-f0);
}

/* 작업의뢰 상세 페이지의 의뢰자 프로필 통계/정보 그리드가 평면형으로 보이도록 간격을 조정한다. */
.work-request-detail-page .requester-profile-info-grid {
    gap: 16px;
}

/* 작업의뢰 상세 페이지의 하단 버튼 영역을 본문 카드 내부 간격에 맞춘다. */

/* 작업의뢰 상세 화면을 채용 상세와 같은 문서형 레이아웃으로 고정한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page {
    max-width: 1180px;
    padding: 32px 24px 64px;
    background: transparent;
}

/* 작업의뢰 상세 헤더의 카드 장식을 제거하고 채용 상세 상단 구조와 맞춘다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-header {
    margin-bottom: 34px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 제목을 채용 상세 제목 톤으로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-title {
    margin: 0 0 14px;
    padding: 0;
    border: 0;
    color: var(--job-color-text);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.35;
}

/* 작업의뢰 상세 메타 정보를 채용 상세와 같은 한 줄 문서형으로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    color: var(--job-color-text-light);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.6;
}

/* 작업의뢰 상세 본문 섹션의 카드형 구분을 제거한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-content {
    display: block;
    gap: 0;
}

/* 작업의뢰 상세 본문 섹션의 카드형 구분을 제거한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-section {
    margin: 0 0 38px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 섹션 사이의 별도 구분선을 제거한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-section + .job-detail-section {
    margin-top: 0;
    border-top: 0;
}

/* 작업의뢰 상세 섹션 제목을 채용 상세와 동일하게 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .section-title {
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--job-color-border);
    color: var(--job-color-text);
    font-size: 16px;
    font-weight: 800;
    gap: 9px;
}

/* 작업의뢰 상세 섹션 헤더 라인을 우측 버튼 아래까지 확장한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-section-head {
    align-items: flex-start;
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--job-color-border);
}

/* 작업의뢰 상세 섹션 헤더 내부 제목의 자체 라인을 제거한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-section-head .section-title {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

/* 작업의뢰 상세 신고하기 버튼을 이미지처럼 작은 pill 버튼으로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-report-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 68px;
    height: 28px;
    padding: 0 10px;
    border-radius: var(--k-radius-pill);
    background: var(--k-bg-white);
    color: var(--job-color-text-light);
    font-size: 11px;
    font-weight: 500;
}

/* 작업의뢰 상세 신고하기 버튼 아이콘 크기를 버튼 높이에 맞춘다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-report-btn i {
    color: var(--job-color-text-light);
    font-size: 10px;
}

/* 작업의뢰 상세 기업정보 더보기 버튼을 이미지처럼 작은 pill 버튼으로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-company-intro-btn {
    min-width: 82px;
    height: 28px;
    padding: 14px 12px;
    border-radius: var(--k-radius-pill);
    background: var(--k-bg-white);
    color: var(--job-color-text-light);
    font-size: 11px;
    font-weight: 500;
}

/* 작업의뢰 상세 핵심 정보 라벨 폭을 긴 항목명 기준으로 조정한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .job-detail-info-row {
    grid-template-columns: 112px minmax(0, 1fr);
}

/* 작업의뢰 상세 핵심 정보 라벨을 채용 상세와 동일하게 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .info-label {
    color: var(--job-color-text-light);
    font-weight: 600;
}

/* 작업의뢰 상세 핵심 정보 값을 채용 상세와 동일하게 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .info-value {
    color: var(--job-color-text);
    font-weight: 500;
    line-height: 1.6;
    word-break: break-word;
}

/* 작업의뢰 상세 내용 블록의 별도 카드 장식을 제거한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-copy-block,
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-guide-box {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 문서형 본문 텍스트를 이미지와 같은 밀도로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-copy-block {
    color: var(--job-color-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.85;
    word-break: break-word;
}

/* 작업의뢰 상세 참고 링크와 첨부파일을 이미지형 낮은 행으로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-reference-item,
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-attachment-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 54px;
    padding: 0 14px;
    border: 1px solid var(--job-color-border);
    border-radius: 8px;
    background: var(--k-bg-white);
}

/* 작업의뢰 상세 준비자료 행 사이 추가 구분선을 제거한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-reference-item + .work-request-reference-item,
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-attachment-item + .work-request-attachment-item {
    border-top: 1px solid var(--job-color-border);
}

/* 작업의뢰 상세 첨부파일 본문 영역을 한 줄로 정렬한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-attachment-item-main {
    min-width: 0;
    flex: 1;
}

/* 작업의뢰 상세 첨부파일 정보 영역을 파일명과 용량으로 배치한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-attachment-info {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

/* 작업의뢰 상세 첨부파일 이름을 주요 텍스트로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-attachment-name {
    color: var(--job-color-text);
    font-size: 13px;
    font-weight: 700;
}

/* 작업의뢰 상세 첨부파일 용량을 보조 텍스트로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .work-request-attachment-meta {
    color: var(--job-color-text-light);
    font-size: 12px;
}

/* 작업의뢰 상세 의뢰자 정보 패널을 채용 상세 기업정보와 동일한 문서형 패널로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .requester-profile-info-panel {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 96px;
    row-gap: 16px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

/* 작업의뢰 상세 의뢰자 정보 항목을 라벨/값 2열로 표시한다. */
.work-request-detail-page .job-detail-wrapper.job-posting-detail-page .requester-profile-info-panel .requester-profile-info-item {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* 작업의뢰 상세 하단 버튼 영역의 카드형 상단선을 제거한다. */

/* 태블릿 이하에서 작업의뢰 공통 레이아웃을 재배치한다. */
@media screen and (max-width: 1023px) {
    /* 작업의뢰 목록/상세 공통 좌우 여백을 줄인다. */
    .work-request-page .job-board-wrapper,
    .work-request-page .job-detail-wrapper {
        padding: 24px 16px 40px;
    }

    /* 작업의뢰 리스트 헤더를 세로 배치로 전환한다. */
    .work-request-page .job-board-header {
        align-items: stretch;
        flex-direction: column;
    }

    /* 작업의뢰 브리프 카드 상단 영역 간격을 태블릿 이하에서 줄인다. */

    /* 작업의뢰 브리프 카드 핵심 지표를 태블릿 이하에서 2열로 줄인다. */

    /* 작업의뢰 브리프 카드 주요 조건의 줄 간격을 태블릿 이하에서 확보한다. */

    /* 작업의뢰 브리프 카드 주요 조건 홀수 항목의 왼쪽 구분선을 제거한다. */

    /* 작업의뢰 브리프 카드 주요 조건 짝수 항목의 왼쪽 구분선을 유지한다. */

    /* 작업의뢰 폼 2열 레이아웃을 단일 열로 전환한다. */

    /* 작업의뢰 상세 카드 내부 헤더를 세로 배치로 전환한다. */

    /* 작업의뢰 상세 통계/정보 그리드를 단일 열로 전환한다. */
    .work-request-page .requester-profile-info-grid {
        grid-template-columns: 1fr;
    }

    /* 작업의뢰 상세 페이지 모바일 카드 내부 여백을 조정한다. */
    .work-request-detail-page .job-detail-wrapper {
        padding: 24px 16px 32px;
    }
}

/* 모바일에서 작업의뢰 브리프 카드 내부 지표를 단일 열에 가깝게 압축한다. */
@media screen and (max-width: 640px) {

    /* 모바일에서 외주 프로젝트 등록 하단 버튼을 세로로 배치한다. */
    .work-request-page .work-request-form-actions .job-form-action-primary {
        flex-direction: column;
        width: 100%;
    }

}

/* 외주 프로젝트 목록 본문 여백을 단기 채용 목록과 동일한 폭으로 정의한다. */
.work-request-page .work-request-list-shell {
    max-width: 1200px;
    padding: 32px 0px 48px;
}

/* 외주 프로젝트 목록 제목 영역의 간격을 정의한다. */
.work-request-page .work-request-list-shell .job-list-page-header {
    margin-bottom: 28px;
}

/* 외주 프로젝트 목록 제목 크기와 굵기를 정의한다. */
.work-request-page .work-request-list-shell .job-section-title {
    margin: 0;
    color: var(--ref-ink);
    font-size: 26px;
    font-weight: 600;
    line-height: 1.35;
}

/* 외주 프로젝트 목록 정렬 칩 기본 상태를 정의한다. */
.work-request-page .work-request-list-shell .filter-chip {
    min-height: 26px;
    padding: 6px 12px;
    border-color: var(--job-color-border);
    border-radius: var(--k-radius-pill);
    background-color: var(--k-bg-white);
    color: var(--job-color-text-light);
    font-size: 13px;
    font-weight: 500;
}

/* 외주 프로젝트 목록 정렬 칩 hover 상태를 정의한다. */
.work-request-page .work-request-list-shell .filter-chip:hover {
    border-color: var(--ref-logo-coral);
    background-color: var(--k-bg-white);
    color: var(--ref-logo-coral);
}

/* 외주 프로젝트 목록 활성 정렬 칩을 정의한다. */
.work-request-page .work-request-list-shell .filter-chip.active {
    border-color: var(--ref-logo-coral);
    background-color: var(--ref-logo-coral);
    color: var(--k-bg-white);
}

/* 지원내역/관심목록 본문 여백을 목록형 화면과 동일하게 정의한다. */
.application-list-page .application-list-shell {
    max-width: 1200px;
    padding: 32px 0px 48px;
}

/* 지원내역/관심목록 기존 테이블 영역을 라인형 목록 전환 후 숨긴다. */
.application-list-page .application-list-shell .list-view-content {
    display: none;
}

/* 지원자관리 헤더를 목록형 화면의 제목과 액션 구조로 정렬한다. */
.work-request-applicant-page .work-request-applicant-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* 지원내역 하단 안내 박스를 정의한다. */
.application-list-page .my-apply-notice-box {
    display: grid;
    margin-top: 88px;
    padding: 16px;
    border-radius: var(--k-radius-sm);
    background-color: var(--k-color-gray-fa);
    color: var(--job-color-text-light);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.45;
}

/* 지원내역 하단 안내 문단을 정의한다. */
.application-list-page .my-apply-notice-box p {
    margin: 0;
}

/* 관심목록 하단 안내 문단을 아이콘과 함께 정렬한다. */
.application-list-page .bookmark-notice-box p {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* 관심목록 하단 안내 아이콘 색상을 정의한다. */
.application-list-page .bookmark-notice-box i {
    color: var(--career-muted);
}

/* 지원내역/관심목록 태블릿 이하 레이아웃을 정의한다. */
@media screen and (max-width: 900px) {

    .application-list-page .my-apply-notice-box {
        margin-top: 36px;
    }
}