  /* 관련 규정 안내 아코디언: 상단 text-center 영향 받지 않도록 전부 왼쪽 정렬 (PC/모바일 공통) */
  .regulations-accordion-block,
  .regulations-accordion-block .toggle,
  .regulations-accordion-block .toggle dt,
  .regulations-accordion-block .toggle dd,
  .regulations-accordion-block .toggle dd ul,
  .regulations-accordion-block .toggle dd ol,
  .regulations-accordion-block .toggle_global {
    text-align: left;
  }

  /*2.회원등록업무*/

  /* 감정평가사 등록신청 안내 박스 */
  .register-intro-box {
    border: 2px solid #dee2e6;
    border-radius: 8px;
    padding: 28px 32px;
    margin-bottom: 30px;
    text-align: center;
    background-color: #fff;
  }

  .register-intro-box h4 {
    margin: 0 0 16px;
  }

  .register-intro-box p {
    max-width: 100%;
    margin: 0 auto;
    line-height: 1.7;
    color: var(--color-dark-3a);
  }

  /* 자격증 신청 안내: PC에서만 본문 폭을 줄여 긴 문장 가독성 확보 */
  @media (min-width: 768px) {
    .register-intro-box .certificate-intro-text {
      max-width: 640px;
    }
  }

  @media (max-width: 767px) {
    /* 모바일에서는 문장 중간의 PC용 강제 줄바꿈을 해제 */
    .pc-only-break {
      display: none;
    }

    /* 모바일에서 의미 단위가 단어 중간에 끊기지 않도록 유지 */
    .mobile-keep-phrase {
      white-space: nowrap;
    }
  }

  dl.sub_b{
    text-align: center;
    line-height: 160%;
    margin: 25px auto 0;
    width: auto;
  }
  dl.sub_b dt{font-weight: 700;margin: 5px 0;}
  dl.sub_b dd{font-weight: 400;margin:0 0 0 15px;color: var(--color-dark-3a);text-align: justify;}
  dl.sub_b dd dl dd{font-weight: 300;margin-left: 15px;color: var(--color-dark-3a);}
  dl.sub_b dd.text-blue{color: var(--kapa-blue, #0082C8);font-weight: 400;margin:0 0 10px 15px;}

  /* 지사 설립 안내: 공문 제출 안내와 상세 항목 사이 간격 축소 */
  .branch-notice {
    margin-bottom: 10px;
  }

  .branch-notice + dl.sub_b {
    margin-top: 0;
  }

/* 법인 설립 안내: 지사설립·폐쇄·소재지 이전 안내를 표와 구분되는 정보 박스로 구성 */
#guideCorp .corporate-branch-notice-box {
    width: 100%;
    max-width: 1070px;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 28px 32px;
    border: 2px solid #dee2e6;
    border-radius: 8px;
    background: #fff;
    text-align: center;
}

#guideCorp .corporate-branch-notice-box h4 {
    margin: 0 0 16px;
}

#guideCorp .corporate-branch-notice-box .branch-notice {
    margin: 0 0 10px;
}

#guideCorp .corporate-branch-notice-box .sub_b {
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
    text-align: left;
}

@media (max-width: 767px) {
    #guideCorp .corporate-branch-notice-box {
        padding: 20px 16px;
    }
}

  div.features-2-item#step{
      position: relative;
      padding: 20px;
      text-align: center;
  }

  /* 컨테이너 스타일 */
  .kapa_container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    padding: 20px;
  }

  .kapa_process {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    max-width: 90%;
    justify-content: center;
  }

/* 자격증 신청 탭: 외곽 폭은 통일하고, 안내문 본문 폭은 별도 규칙으로 유지 */
#certificate .certificate-content-shell {
    width: 100%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

/* Bootstrap의 col-md-8 및 offset 규칙을 자격증 신청 안내에만 재정의 */
#certificate .certificate-intro-shell {
    flex: 0 1 1100px;
    margin-left: auto;
    margin-right: auto;
}

/* 공통 절차·표 규칙은 유지하면서 자격증 신청 탭의 내부 폭만 외곽 기준선에 맞춤 */
#certificate .certificate-content-shell .kapa_process {
    width: 100%;
    max-width: 100%;
}

#certificate .certificate-content-shell .doc-table,
#certificate .certificate-content-shell .doc-table-3col {
    width: 100%;
    max-width: 100%;
}

/* 안내 박스의 Bootstrap 열 패딩을 기준선으로 삼아 절차도 외곽 폭을 일치 */
#certificate .notice-box-blue.certificate-content-shell {
    max-width: 1070px;
}

/* 표는 외곽 컨테이너의 과도한 패딩을 제거해 안내 박스와 같은 선에서 시작 */
#certificate .container.certificate-content-shell {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
}

#certificate .container.certificate-content-shell > .kapa_container {
    padding-left: 0;
    padding-right: 0;
}

/* 절차도는 내부 여백만 축소해 넓이를 유지하면서 단계 배치 공간 확보 */
#certificate .notice-box-blue.certificate-content-shell .notice-box-blue-inner {
    padding-left: 12px;
    padding-right: 12px;
}

/* 입회·등록갱신·법인 설립 안내: 탭별 주요 안내와 표의 외곽 기준선 통일 */
#mission .guide-standard-shell,
#renew .guide-standard-shell,
#guideCorp .guide-standard-shell {
    width: 100%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

/* 등록갱신 상단 안내는 Bootstrap 열 폭 대신 공통 기준선을 사용 */
#renew .guide-standard-intro {
    flex: 0 1 1100px;
}

/* 컨테이너·행·표 내부의 중복 여백을 조정해 실제 표 선까지 같은 기준선에 맞춤 */
#mission .container.guide-standard-shell,
#renew .container.guide-standard-shell,
#guideCorp .container.guide-standard-shell {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
}

#mission .guide-standard-shell > .row,
#renew .guide-standard-shell > .row {
    margin-left: 0;
    margin-right: 0;
}

#mission .guide-standard-shell .kapa_container,
#renew .guide-standard-shell .kapa_container,
#guideCorp .guide-standard-shell .kapa_container {
    padding-left: 0;
    padding-right: 0;
}

#mission .guide-standard-shell .kapa_process,
#renew .guide-standard-shell .kapa_process,
#guideCorp .guide-standard-shell .kapa_process {
    width: 100%;
    max-width: 100%;
}

#mission .guide-standard-shell .doc-table,
#renew .guide-standard-shell .doc-table-grid,
#guideCorp .guide-standard-shell .doc-table-3col {
    width: 100%;
    max-width: 100%;
}

#mission .membership-contact-phone {
    white-space: nowrap;
}

#mission .membership-account-number {
    display: inline-block;
    white-space: nowrap;
}

/* 입회 안내 담당 카드: 설립목적 카드와 같은 정보 위계(아이콘·제목·설명) 적용 */
#mission .membership-contact-card {
    width: 100%;
    min-height: 220px;
    box-sizing: border-box;
    padding: 36px 24px;
}

#mission .membership-contact-card .features-2-icon {
    width: 64px;
    height: 64px;
    margin-bottom: 18px;
    font-size: 32px;
}

#mission .membership-contact-card .features-2-title {
    margin-bottom: 8px;
}

#mission .membership-contact-card .features-2-descr {
    margin: 0;
    line-height: 1.5;
}

/* 등록갱신 관련 규정: 제출서류 표와 같은 기준선으로 토글 폭 정렬 */
#renew .renew-regulations-shell .container {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
}

#renew .renew-regulations-shell .row {
    margin-left: 0;
    margin-right: 0;
}

/* PC: 제목·제출서류 표와 토글 선의 실제 시작점을 일치 */
@media (min-width: 768px) {
    #renew .renew-regulations-shell .container {
        padding-left: 0;
        padding-right: 0;
    }

    #renew .renew-regulations-shell .toggle_global {
        padding-left: 0;
        padding-right: 0;
    }
}

  /* 입회신청 절차: 타이틀 ↔ 블루 박스 간격 축소 */
  #mission .join-process-title {
    margin-bottom: 12px !important;
  }

  #mission .join-process-block .notice-box-blue {
    margin-bottom: 0;
  }

  #mission .join-process-block .kapa_container {
    padding-top: 12px;
    padding-bottom: 12px;
  }

/*2.회원등록업무 -  입회신청 테이블 디자인*/

.doc-table {
    width: 1200px;
    margin: 0 auto;
    color: #333;
  }

  .doc-row {
    display: flex;
    border-bottom: 1px solid #dee2e6;
  }

  .doc-header {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #495057;
    border-top: 2px solid #dee2e6;
    text-align: center;
  }

  .doc-cell {
    padding: 5px;
    line-height: 1.5;
    letter-spacing: -0.05em;
    text-align: center;
  }
  .doc-cell p {
    margin: 5px 0;
  }
  .doc-cell:not(:last-child) {
    border-right: 1px solid #dee2e6;
  }

  .cell-doc {
    width: 50%;
  }

  .cell-method {
    width: 50%;
    word-break: keep-all;
  }

p.text-red {
    color: red;
  }

  /* Grid 테이블 스타일 */
  .doc-table-grid {
    width: 1200px;
    margin: 0 auto;
    color: #333;
    display: grid;
    grid-template-columns: 10% 45% 45%;
  }

  .doc-cell-grid {
    padding: 5px 5px 5px 15px;
    line-height: 1.5;
    letter-spacing: -0.05em;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
  }

  /* 3열 테이블 스타일 - 컨셉: 양끝(좌/우) 보더 없음, 칸 나뉘는 곳에만 세로선 */
  .doc-table-3col {
    width: 1200px;
    margin: 0 auto;
    color: #333;
    display: grid;
    grid-template-columns: 15% 10% 75%;
  }

  .doc-cell-3col {
    padding: 5px 5px 5px 20px;
    line-height: 1.5;
    letter-spacing: -0.05em;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    border-left: none;
    text-align: left;
  }
  .doc-cell-3col p {
    margin: 5px 0;
  }

  /* 마지막 열: 오른쪽 보더 없음 (PC/모바일 공통). cell-col-last 붙인 셀만 */
  .doc-cell-3col.cell-col-last {
    border-right: none;
  }

  .doc-header-3col {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #495057;
    border-top: 2px solid #dee2e6;
    text-align: center;
  }

  /* Rowspan 효과를 위한 공통 스타일 */
  .rowspan-base {
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #dee2e6;
    background-color: #f8f9fa;
    font-weight: bold;
    text-align: center;
    padding: 10px;
  }

  /* 사무소 개설: 유형 셀 안에 전자신고 CTA를 제목 아래로 배치 */
  .office-open-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .office-open-cta .btn-mod {
    white-space: nowrap;
    font-weight: 600;
  }

  .e-report-path {
    color: var(--kapa-blue-dark, #005DAB);
    font-weight: 700;
  }

  /* Grid 테이블용 rowspan */
  .rowspan-cell {
    grid-row: span 5;
  }

  .rowspan-cell-3 {
    grid-row: span 3;
  }

  .rowspan-cell-3-right {
    grid-row: span 3;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
  }

  /* 3열 테이블용 rowspan */
  .rowspan-cell-3col-2 {
    grid-row: span 2;
  }

  .rowspan-cell-3col-3 {
    grid-row: span 3;
  }

  /* 유틸리티 클래스 */
  .light-font {
    font-weight: 200;
  }

  /* sub_B_01: Chrome 다운로드 — btn-hover-anim :before(z-index:0)가 글자를 덮는 문제
     (base.css는 > span, > svg 만 z-index:1 — 텍스트/i는 span으로 감싸고 레이어 올림) */
  a.chrome-download-btn.btn-mod.btn-hover-anim > span,
  a.chrome-download-btn.btn-mod.btn-hover-anim > i {
    position: relative;
    z-index: 1;
  }

  a.chrome-download-btn.btn-mod.btn-hover-anim,
  a.chrome-download-btn.btn-mod.btn-hover-anim:hover,
  a.chrome-download-btn.btn-mod.btn-hover-anim:focus,
  a.chrome-download-btn.btn-mod.btn-hover-anim:focus-visible,
  a.chrome-download-btn.btn-mod.btn-hover-anim:active {
    color: #fff !important;
    -webkit-text-fill-color: #fff;
  }

  a.chrome-download-btn.btn-mod.btn-hover-anim:hover > span,
  a.chrome-download-btn.btn-mod.btn-hover-anim:hover > i,
  a.chrome-download-btn.btn-mod.btn-hover-anim:focus > span,
  a.chrome-download-btn.btn-mod.btn-hover-anim:focus > i,
  a.chrome-download-btn.btn-mod.btn-hover-anim:focus-visible > span,
  a.chrome-download-btn.btn-mod.btn-hover-anim:focus-visible > i {
    color: #fff !important;
  }

  /* Chrome 다운로드 버튼 ↔ 안내 문구 간격 */
  .chrome-download-notice {
    margin-top: 0.5rem;
  }

  /* sub_B_01: 외부 링크 아이콘 버튼 — 텍스트+아이콘 가운데 정렬, 한 줄 유지 (컨테이너 정렬은 그대로) */
  a.btn-mod.d-inline-flex.align-items-center:has(> .mi-external-link) {
    justify-content: center;
  }

  a.btn-mod.d-inline-flex.align-items-center:has(> .mi-external-link) > span {
    white-space: nowrap;
  }

  a.btn-mod.d-inline-flex.align-items-center:has(> .mi-external-link) > .mi-external-link {
    flex-shrink: 0;
  }

  /* btn-hover-anim :before(z-index:0) 위에 텍스트·아이콘 표시 */
  a.btn-mod.btn-hover-anim.d-inline-flex.align-items-center > span,
  a.btn-mod.btn-hover-anim.d-inline-flex.align-items-center > .mi-external-link {
    position: relative;
    z-index: 1;
  }

  /* sub_B_01: features-list-icon(동그라미 배경) 제거 변형 */
  .features-list-icon.features-list-icon--no-bg{
    background: transparent !important;
    border-radius: 0 !important;
    width: auto;
    height: auto;
    margin-right: 10px; /* 기존 간격 유지 */
    color: inherit;
    top: 0 !important; /* demo-main .features-list-icon { top: 0.185em } 보정 */
    align-self: center;
    line-height: 0; /* SVG 하단 여백(ascender gap) 제거 */
  }

  /* base.css .features-list-icon svg { 1em }(18px) 덮어쓰기 */
  .features-list-icon.features-list-icon--no-bg svg{
    width: 32px;
    height: 32px;
    display: block;
    margin: 0;
    vertical-align: middle;
  }

  .bg-white {
    background-color: #fff;
  }

  .section-end {
    border-bottom: 2px solid #dee2e6;
  }

  .grid-3-col {
    grid-template-columns: 10% 45% 45%;
  }


/*2.회원등록업무 - 갱신등록신청*/

.category-title {
    font-size: 19px;
    font-weight: 600;
    color: #2c3e50;
    padding: 10px;
    border-bottom: 2px solid #2c3e50;
}

.file-link {
    color: #3498db;
    text-decoration: none;
}

.file-link:hover {
    text-decoration: underline;
}

/* 반응형 스타일 - 모바일에서도 테이블 행은 좌우(row) 유지 */
@media screen and (max-width: 768px) {
    /* 입회안내 features 박스 3개: col-md-6만 있으면 768px 미만에서 콘텐츠 너비로 줄어듦 → 100%로 통일 */
    .row .col-md-6.col-lg-4.d-flex.align-items-stretch {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
    }

    .row .col-md-6.col-lg-4 .features-2-item {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .row .col-md-6.col-lg-4 .features-2-descr {
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* 모바일: 공통 컨테이너 좌우 여백 과다 보정 */
    .kapa_container {
        padding-left: 10px;
        padding-right: 10px;
    }

    .doc-row {
        flex-direction: row;
    }

    .doc-table {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
    }

    .doc-cell {
        min-width: 0;
        font-size: 13px;
        padding: 5px 3px;
    }

    .cell-doc,
    .cell-method {
        flex: 1;
        min-width: 0;
    }

    .doc-title {
        font-weight: 600;
    }

    /* 모바일: dl.sub_b 전체 폰트 크기/줄간격 축소 (법 조문/안내문 텍스트) */
    dl.sub_b {
        font-size: 13px;
        line-height: 1.5;
    }

    dl.sub_b dt,
    dl.sub_b dd {
        font-size: 13px;
        line-height: 1.5;
    }

    /* 모바일: 알림 박스(notice-box*) 폰트/패딩 축소 (checkFragment 등 공통) */
    .notice-box-inner {
        padding: 14px 16px;
    }

    .notice-title {
        font-size: 14px;
        line-height: 1.5;
        margin-bottom: 10px;
    }

    .notice-list {
        font-size: 13px;
        line-height: 1.6;
    }

    .notice-list li {
        font-size: 13px;
        line-height: 1.6;
        margin-bottom: 6px;
    }

    /* 모바일: flow step 박스와 버튼 폭/정렬 통일 */
    .kapa_process .step {
        flex: 0 0 100%;
        width: 100%;
        max-width: 280px;
        margin-left: auto;
        margin-right: auto;
    }

    /* 같은 섹션의 [입회신청서 작성 바로가기] 버튼 폭도 step과 맞춤 */
    .local-scroll .btn.btn-mod.btn-large.btn-round {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 280px;
        margin-left: auto;
        margin-right: auto;
    }

    .local-scroll .btn.btn-mod.btn-large.btn-round > span {
        white-space: nowrap;
    }

    /* 두 번째 버튼부터 위쪽 여백 (겹침 방지) */
    .local-scroll .btn.btn-mod.btn-large.btn-round + .btn.btn-mod.btn-large.btn-round {
        margin-top: 10px;
    }

    /* sub_B_01: 본문 안내문 단락(중앙 정렬 p[max-width:100%;margin:0 auto]) 모바일 폰트 축소 */
    p[style*="max-width:100%;margin:0 auto;"] {
        font-size: 13px;
        line-height: 1.6;
    }

    /* sub_B_01 내 3열 테이블(doc-table-3col) 공통 모바일 폰트/패딩 축소 */
    .doc-table-3col .doc-cell-3col {
        font-size: 12px;
        line-height: 1.4;
        padding: 6px 8px;
    }

    .doc-table-3col .doc-cell-3col p,
    .doc-table-3col .doc-cell-3col a,
    .doc-table-3col .doc-cell-3col span,
    .doc-table-3col .doc-cell-3col strong,
    .doc-table-3col .doc-cell-3col li {
        font-size: 12px;
        line-height: 1.4;
    }

    .doc-table-3col .office-open-cta .btn-mod,
    .doc-table-3col .office-open-cta .btn-mod span {
        font-size: 13px;
        line-height: 1.35;
    }

    /* 등록신청시 제출서류 그리드 테이블만: 모바일 (다른 스텝/테이블은 미적용) */
    .register-doc-table-wrap {
        display: flex;
        flex-direction: column;
        /* 기존 .kapa_container의 align-items:center 영향 제거 (스크롤 영역이 화면폭을 가져야 함) */
        align-items: stretch;
        justify-content: flex-start;
        margin-left: -6px;
        margin-right: -6px;
        padding: 4px 6px 8px;
        box-sizing: border-box;
    }

    /* 안내 문구: 블록으로 위에 고정, 테이블과 별도 줄 */
    .register-doc-table-wrap .table-scroll-hint {
        display: block;
        width: 100%;
        flex-shrink: 0;
        margin: 0 0 8px 0;
        padding: 4px 0;
        font-size: 12px;
        box-sizing: border-box;
    }

    /* 스크롤은 테이블을 감싼 영역에만 */
    .register-doc-table-wrap .kapa_process {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap;
        max-width: none;
        min-width: 0;
        width: 100%;
        /* 가운데 정렬(기본값)로 인해 표가 중간부터 보이는 현상 방지 */
        justify-content: flex-start;
        align-items: stretch;
        gap: 0;
    }

    .register-doc-table-wrap .doc-table-grid {
        /* 모바일에서는 표 자체 폭을 750px로 두고(스크롤 전제) 가독성 확보 */
        display: grid !important;
        min-width: 750px;
        width: 750px;
        /* 구분 10% / 제출서류·제출방법 각 45% (합 100%) */
        grid-template-columns: 10% 45% 45%;
    }

    /* 셀 안 글씨가 셀 밖으로 나오지 않도록 */
    .register-doc-table-wrap .doc-cell-grid {
        font-size: 12px;
        line-height: 1.4;
        padding: 4px 6px;
        border-bottom-width: 1px;
        /* 모바일 공통 responsive.css에서 border-right를 제거하는 규칙을 이 테이블에서는 무시 */
        border-right: 1px solid #dee2e6 !important;
        min-width: 0;
        overflow-wrap: break-word;
        word-break: break-word;
        box-sizing: border-box;
    }

    .register-doc-table-wrap .doc-cell-grid.doc-header {
        display: block !important;
        padding: 6px 6px;
        font-size: 12px;
    }

    .register-doc-table-wrap .rowspan-base {
        padding: 6px 4px;
        font-size: 12px;
        min-width: 0;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    .register-doc-table-wrap .doc-cell-grid a,
    .register-doc-table-wrap .doc-cell-grid .tbl_plus_bnt {
        word-break: break-word;
        white-space: normal;
    }

    /* 자격증 신청 > 2. 구비서류 안내(3col)만: 모바일 전용 레이아웃/폰트 보정 */
    .cert-doc-3col-wrap {
        align-items: stretch;
        justify-content: flex-start;
    }

    /* 스크롤은 테이블을 감싼 영역에만 + 항상 왼쪽부터 보이게 */
    .cert-doc-3col-wrap .kapa_process {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        min-width: 0;
        /* 기본(center) 정렬로 인해 가운데부터 잘려 보이는 현상 방지 */
        justify-content: flex-start;
        align-items: stretch;
        gap: 0;
        /* 일부 브라우저에서 스크롤바가 너무 얇게 겹치는 것 방지 */
        padding-bottom: 6px;
        box-sizing: border-box;
    }

    .cert-doc-3col-wrap .doc-table-3col {
        /* responsive.css에서 block/1열로 바꿔버리는 것을 되돌리고,
           모바일에서도 3열 grid 유지 (가로 스크롤 전제) */
        display: grid !important;
        /* 전체 폭 기준 약 15% / 15% / 70% 비율 */
        min-width: 750px;
        width: 750px;
        grid-template-columns: 15% 15% 70%;
        font-size: 12px;
        line-height: 1.4;
    }

    .cert-doc-3col-wrap .doc-cell-3col {
        font-size: 12px !important;
        line-height: 1.4;
        padding: 6px 8px !important;
        /* 오른쪽 보더는 기본 .doc-cell-3col(1px solid #dee2e6) 유지. 여기서 덮지 않아야 선이 제대로 보임 */
        word-break: break-word;
        overflow-wrap: break-word;
        box-sizing: border-box;
    }

    /* 구비서류(마지막 열) 전부 오른쪽 보더 없음 */
    .cert-doc-3col-wrap .doc-cell-3col.cell-col-last {
        border-right: none !important;
    }

    .cert-doc-3col-wrap .doc-cell-3col p,
    .cert-doc-3col-wrap .doc-cell-3col a,
    .cert-doc-3col-wrap .doc-cell-3col span,
    .cert-doc-3col-wrap .doc-cell-3col strong,
    .cert-doc-3col-wrap .doc-cell-3col li {
        font-size: 12px !important;
        line-height: 1.4;
    }

    .cert-doc-3col-wrap .tbl_link_bnt,
    .cert-doc-3col-wrap .tbl_plus_bnt {
        font-size: 12px;
        padding: 4px 8px;
        margin-left: 6px;
    }
}

/* 스크롤 안내: 해당 블록 외에서는 숨김 */
.table-scroll-hint {
    display: none;
    font-size: 13px;
    color: #6c757d;
    margin-bottom: 10px;
    padding: 6px 0;
}


/*회원등록업무*/

.document-note {
    margin-top: 8px;
    padding-left: 35px;
    font-size: 13px;
    color: #6c757d;
    line-height: 1.4;
  }

  .document-note a {
    color: #007bff;
    text-decoration: none;
  }

  .document-note a:hover {
    text-decoration: underline;
  }

  /* 공통 스타일 양식 다운로드  */
  .tbl_link_bnt {
    display: inline-block;
    background-color: #36a367;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    text-decoration: none;
    margin-left: 10px;
  }
  .tbl_link_bnt:hover {
    background-color: green;
  }

  .tbl_plus_bnt {
    display: inline-block;
    background-color: #007bff;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    text-decoration: none;
    margin-left: 10px;
  }

  .tbl_plus_bnt:hover {
    background-color: #0056b3;
  }

  .tbl_plus_bnt i {

    margin-left: 5px;
    vertical-align:middle;
    font-weight: 800;
  }

  .highlight-red {
    background-color: red;
    color: #fff;
    padding: 6px 10px;
    border-radius: 1em;
    margin: 0 10px;
    letter-spacing: -0.02em;
    display: inline-block;
    font-size:medium;
  }

/*회원등록업무> 자격증신청 flow chart css*/
.step {
    margin-right: 25px;
    padding: 10px 20px;
    background: white;
    border: 2px solid #333;
    border-radius: 10px;
    position: relative;
    font-weight: bold;
    text-align: center;
    min-width: 200px;
}
.step#first_btn {
    background: var(--color-primary-light-1);
    border: 2px solid var(--color-primary-1-a);
}
.step#first_btn:hover a{
    transform: translateY(-3px);
    text-decoration: none;
}
.step::after {
    content: '\25B6'; /* ▶ 화살표 */
    font-size: 20px;
    color: #333;
    position: absolute;
    right: -35px;
    top: 50%;
    transform: translateY(-50%);
}
.step:last-child::after {
    content: ''; /* 마지막 요소의 화살표 제거 */
}
@media (max-width: 600px) {
    .process {
        flex-direction: column;
        gap: 10px;
    }
    .step::after {
        content: '\25BC'; /* ▼ 아래 방향 화살표 */
        right: 50%;
        top: 100%;
        transform: translateX(50%);
    }
}

/* 6번째 탭 감정평가사사무소 개설확인증 진위여부 확인 */

/* 알림 박스 - 회색 테두리 */
.notice-box-gray {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background-color: #fff;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

/* 선택 가능한 박스 스타일 (두 개의 박스용) - fee-table 스타일 참고 */
.notice-box-gray.selectable-box {
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    height: 100%;
    width: 100%;
    overflow: hidden;
    border: 1px solid #e0e0e0;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.notice-box-gray.selectable-box:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.notice-box-gray.selectable-box.active {
    border: 2px solid var(--primary-color, #72a2d5);
    box-shadow: 0 4px 12px rgba(114, 162, 213, 0.3);
}

.notice-box-gray.selectable-box.active .notice-box-inner {
    background: #e3f2fd;
}

.notice-box-gray.selectable-box:hover .notice-box-inner {
    background: #e3f2fd;
}

.notice-box-gray.selectable-box .notice-box-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    transition: background-color 0.2s ease;
    align-items: center;
    justify-content: center;
    text-align: center;
    word-break: keep-all;
}

.notice-box-gray.selectable-box .notice-box-inner p:not(.notice-title) {
    flex-grow: 1;
    margin-bottom: 0;
    line-height: 1.8;
    color: var(--color-dark-3a);
    text-align: center;
    word-break: keep-all;
}

/* 두 박스를 똑같은 크기로 만들기 위한 컨테이너 */
.selectable-box-container {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 20px;
    width: 100%;
    box-sizing: border-box;
}

.selectable-box-container .col-md-6 {
    flex: 0 0 calc((100% - 20px) / 2);
    min-width: 0;
    width: calc((100% - 20px) / 2);
    max-width: calc((100% - 20px) / 2);
    box-sizing: border-box;
}

.selectable-box-container .col-md-6.d-flex {
    display: flex;
    width: calc((100% - 20px) / 2);
    flex: 0 0 calc((100% - 20px) / 2);
}

/* 토글 내용 박스 */
.toggle-content-box {
    width: 100%;
    margin-top: 20px;
    animation: fadeIn 0.3s ease;
}

.toggle-content-box.hidden {
    display: none;
}

.toggle-content-box .notice-box-inner {
    text-align: center;
    word-break: keep-all;
}

.toggle-content-box .notice-box-inner .notice-title {
    text-align: center;
    word-break: keep-all;
}

.toggle-content-box .notice-box-inner .notice-list {
    text-align: left;
    display: inline-block;
    word-break: keep-all;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 반응형 */
@media (max-width: 768px) {
    .selectable-box-container {
        flex-direction: column;
        gap: 15px;
    }

    .selectable-box-container .col-md-6 {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
    }

    /* .col-md-6.d-flex가 더 구체적이라 모바일에서 50%가 다시 먹는 현상 방지 */
    .selectable-box-container .col-md-6.d-flex {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
    }
}

/* 알림 박스 내부 컨테이너 */
.notice-box-inner {
    box-sizing: border-box;
    padding: 20px;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background-color: #f8f9fa;
}

/* notice-box-inner 내부의 모든 p 태그 폰트 통일 */
.notice-box-inner p:not(.notice-title) {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    color: var(--color-dark-3a);
    margin-bottom: 10px;
}

.notice-box-inner p:not(.notice-title):last-child {
    margin-bottom: 0;
}

/* 알림 박스 - 파란색 테두리 */
.notice-box-blue {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background-color: #fff;
    margin-bottom: 20px;
}

/* 알림 박스 파란색 내부 컨테이너 */
.notice-box-blue-inner {
    box-sizing: border-box;
    padding: 20px;
    border: 1px solid var(--color-primary-light-1-a);
    border-radius: 8px;
    background-color: var(--color-primary-light-1);
}

/* 알림 제목 */
.notice-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-dark-3a);
    margin-bottom: 15px;
    text-align: left;
}

/* selectable-box 내부의 notice-title은 헤더 스타일 적용 */
.selectable-box .notice-title {
    color: #fff;
    background: var(--primary-color, #72a2d5);
    padding: 15px;
    border-radius: 4px;
    margin-left: -20px;
    margin-right: -20px;
    margin-top: -20px;
    margin-bottom: 15px;
    text-align: center;
    word-break: keep-all;
    width: calc(100% + 40px);
}

/* 알림 리스트 (ul, ol 공통) */
.notice-list {
    padding-left: 20px;
    line-height: 1.8;
    margin-bottom: 0;
    text-align: left;
    color: var(--color-dark-3a);
}

.notice-list li {
    margin-bottom: 8px;
    text-align: left;
}

.notice-list li:last-child {
    margin-bottom: 0;
}

/* 「 기호의 좌측 여백으로 인한 시각적 시작선 차이 보정 */
.notice-list-visual-indent {
    padding-left: 0.45em;
}

.notice-list .primary-color-text {
    color: var(--color-primary-1);
}

/* 진위여부 확인 폼 디자인 */
.verification-form {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 30px; /* 검색 행 ↔ 발급번호 행 간격 (<br> 대신) */
}

/* 토글 내용 박스 내부의 폼은 세로 배치 */
.toggle-content-box .verification-form {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

.toggle-content-box .verification-form-row {
    flex-direction: column;
    align-items: stretch;
}

.toggle-content-box .verification-form-group {
    width: 100%;
    min-width: 100%;
    flex: 1 1 100%;
}

.verification-form-row {
    display: flex;
    gap: 15px;
    align-items: flex-end;
    flex-wrap: wrap;
    margin: 0; /* gap으로 행 간격 처리 */
}

.verification-form-group {
    flex: 1;
    min-width: 200px;
    display: flex;
    flex-direction: column;
}

.verification-form-group.verification-form-button {
    flex: 0 0 auto;
    min-width: 120px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.verification-form-group.verification-form-button::before {
    content: '';
    display: block;
    height: 28px;
    margin-bottom: 8px;
}

.verification-form-group.verification-form-button-full {
    flex: 1 1 100%;
    width: 100%;
    min-width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 15px;
}

.verification-form-group.verification-form-button-full::before {
    content: '';
    display: block;
    height: 0;
    margin-bottom: 0;
}

.verification-btn-full {
    width: 100% !important;
}

.verification-label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-dark-3a);
    margin-bottom: 8px;
}

.verification-input {
    width: 100%;
    padding: 10px 15px;
    font-size: 14px;
    color: var(--color-dark-3a);
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    transition: all 0.2s ease;
    box-sizing: border-box;
    height: 44px;
}

.verification-input:focus {
    outline: none;
    border-color: var(--color-primary-1);
    box-shadow: 0 0 0 3px rgba(69, 103, 237, 0.1);
}

.verification-input::placeholder {
    color: var(--color-gray-3);
}

.verification-btn {
    width: 100%;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    height: 44px;
    box-sizing: border-box;
}

.verification-btn.btn,
.btn {
    display: inline-block;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.verification-btn.btn-warning,
.btn.btn-warning {
    color: #fff;
    background: var(--color-warning, #f59e0b);
    border: 1px solid var(--color-warning, #f59e0b);
}

.verification-btn.btn-warning:hover,
.verification-btn.btn-warning:focus,
.btn.btn-warning:hover,
.btn.btn-warning:focus {
    background: var(--color-warning-dark, #d97706);
    border-color: var(--color-warning-dark, #d97706);
    color: #fff;
}

.verification-btn.btn-success,
.btn.btn-success {
    color: #fff;
    background: var(--color-success, #10b981);
    border: 1px solid var(--color-success, #10b981);
}

.verification-btn.btn-success:hover,
.verification-btn.btn-success:focus,
.btn.btn-success:hover,
.btn.btn-success:focus {
    background: var(--color-success-dark, #059669);
    border-color: var(--color-success-dark, #059669);
    color: #fff;
}

.btn-sm {
    padding: 8px 16px;
    font-size: 13px;
    height: auto;
}

/* 텍스트 스타일 */
.text-italic {
    font-style: italic;
    color: var(--color-dark-4);
    font-size: 14px;
    display: block;
    margin-bottom: 5px;
}

/* 버튼 전체 너비 */
.btn-full-width {
    width: 100%;
}

/* 숨김 요소 */
.hidden {
    display: none;
}

/* 진위여부 확인 폼 반응형 */
@media screen and (max-width: 768px) {
    .verification-form-row {
        flex-direction: column;
        gap: 15px;
    }

    .verification-form-group {
        width: 100%;
        min-width: 100%;
    }

    .verification-form-group.verification-form-button {
        width: 100%;
        min-width: 100%;
    }
}

/* 검색 결과 팝업 목록 스타일 */
.appcode-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 4px;
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    max-height: 300px;
    overflow-y: auto;
    z-index: 1000;
}

.appcode-dropdown.active {
    display: block !important;
}

.appcode-dropdown .appcode-item {
    padding: 10px 15px;
    cursor: pointer;
    transition: background-color 0.2s;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    color: #333;
}

.appcode-dropdown .appcode-item:last-child {
    border-bottom: none;
}

.appcode-dropdown .appcode-item:hover {
    background-color: #f8f9fa;
}

.appcode-dropdown .appcode-item.selected {
    background-color: rgba(37, 99, 235, 0.1);
    color: #2563eb;
    font-weight: 500;
}

.appcode-dropdown .appcode-item.empty {
    cursor: default;
    color: #6c757d;
    text-align: center;
    padding: 15px;
}

.appcode-dropdown .appcode-item.empty:hover {
    background-color: transparent;
}

/* sub_B_01 히어로 배경: WebP 우선, PNG 폴백 */
.sub-b-01-hero {
    background-image: url(/images/full-width-images/section-image6-kapa2.png);
    background-image: image-set(
        url(/images/full-width-images/section-image6-kapa2.webp) type("image/webp"),
        url(/images/full-width-images/section-image6-kapa2.png) type("image/png")
    );
}

/* ── 등록신청 / 자격증신청 폼 공통 스타일 ── */
.apply-section-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-dark-3a);
    margin-bottom: 12px;
}

.apply-form-table {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.apply-form-row {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.apply-form-label {
    flex: 0 0 140px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-dark-3a);
    padding-top: 10px;
    line-height: 1.4;
}

.apply-form-value {
    flex: 1;
    min-width: 0;
}

/* selectable-box 선택 상태 */
.selectable-box.selected {
    border: 2px solid var(--color-primary-1);
    background-color: #f0f4ff;
}

.selectable-box.selected .notice-title {
    color: var(--color-primary-1);
}

@media screen and (max-width: 576px) {
    .apply-form-row {
        flex-direction: column;
        gap: 6px;
    }
    .apply-form-label {
        flex: none;
        padding-top: 0;
    }
}