/* education-page-v2.css
 * Generated by Phase 4 (safe-merge) for (교육프로그램_MNU-U-080000, v2)
 * Source CSS (in cascade order): education-page-v2.css
 */

/* === source: education-page-v2.css === */
/* ============================================================
   EDUCATION DETAIL v2 — 교육·프로그램(MNU-U-080000) 상세 v2 페이지 전용 스타일
   pfmc-page-v3.css의 v3 시안 룰을 .edu-detail-v2 스코프로 흡수 (시각 동일성 보장)
   적용 파일:
     - MNU-U-080102_교육상세_design_v2.html
     - MNU-U-080202_공고안내신청상세_design_v2.html
   격리: .edu-detail-v2 wrapper 하위에서만 적용 (다른 페이지 영향 없음)
   self-contained: pfmc-page.css/education-page.css 의존성 없음

   토큰 매핑 주석:
     Figma 38px → DS font-size-36 (가까운 값)
     Figma 21px → DS font-size-22 (가까운 값)
     기타 모든 px는 DS number/size/color 토큰과 정확 일치

   교육 모듈 추가 룰 (v3에 없음):
     - .pfmc-floating-cta: 모바일 신청 CTA 고정 (현재 HTML에서 [임시 비노출] 처리 중)
     - .ds-wysiwyg > br { display:none }: 교육 본문 단락 사이 빈 br 정리
   ============================================================ */


/* ==================== BASE LAYER — pfmc-page.css에서 추출 ====================
   self-contained 동작 위해 venue-layout/pfmc-detail-*/pfmc-info-list base 룰을
   .edu-detail-v2 prefix로 포함. (이후 V01~V03 섹션의 룰이 이 base를 오버라이드) */

/* venue-layout (포스터 + 정보 영역) */
.edu-detail-v2 .venue-layout {
  display: grid;
  grid-template-columns: 3fr 7fr;
  gap: var(--ds-number-20);
  align-items: stretch;
}
.edu-detail-v2 .venue-layout__media {
  border-radius: var(--ds-radius-large);
  overflow: hidden;
  aspect-ratio: 5 / 7;
  background: var(--ds-color-gray-5);
}
.edu-detail-v2 .venue-layout__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.edu-detail-v2 .venue-layout__content {
  display: flex;
  flex-direction: column;
  gap: var(--ds-number-8);
}

/* 배지 + 타이틀 + 정보 리스트 base */
.edu-detail-v2 .pfmc-detail-badges {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.edu-detail-v2 .pfmc-detail-badges__tags {
  display: flex;
  gap: var(--ds-number-3);
}
.edu-detail-v2 .pfmc-detail-title {
  font-size: 3.6rem;
  font-weight: var(--ds-typo-font-weight-bold);
  color: var(--ds-light-color-text-bolder);
  line-height: 1.2;
  letter-spacing: -0.025em;
  word-break: keep-all;
}
.edu-detail-v2 .pfmc-info-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.edu-detail-v2 .pfmc-info-list__row {
  display: flex;
  align-items: baseline;
  padding: var(--ds-number-3) 0;
  border-bottom: var(--ds-border-width-thin) solid var(--ds-light-color-divider-gray-light);
}
.edu-detail-v2 .pfmc-info-list__row:last-child {
  border-bottom: none;
}
.edu-detail-v2 .pfmc-info-list__label {
  width: 9rem;
  flex-shrink: 0;
  font-size: var(--ds-pc-font-size-body-small);
  font-weight: var(--ds-typo-font-weight-medium);
  color: var(--ds-light-color-text-subtle);
}
.edu-detail-v2 .pfmc-info-list__value {
  font-size: var(--ds-pc-font-size-body-small);
  color: var(--ds-light-color-text-basic);
  line-height: 1.5;
}

/* CTA / 섹션 base */
.edu-detail-v2 .pfmc-detail-cta {
  display: flex;
  align-items: center;
  gap: var(--ds-number-6);
  margin-top: auto;
}
.edu-detail-v2 .pfmc-detail-section {
  margin-top: 10rem;
}


/* ==================== V01. Hero — venue-layout 오버라이드 ==================== */
.edu-detail-v2 .venue-layout {
  display: grid;
  grid-template-columns: 42rem 1fr;                     /* 좌 포스터 420px 고정 + 우 가변 */
  gap: var(--ds-number-40);                             /* 80px */
  align-items: start;                                   /* base의 stretch 막기 (포스터 비율 보호) */
}

/* Hero 우측 컨텐츠 — 자식별 margin-top으로 간격 명시 (gap 0) */
.edu-detail-v2 .venue-layout__content {
  gap: 0;
  align-self: stretch;                                  /* 그리드 행 높이(포스터 588px)에 맞춰 늘어남 */
}

/* 포스터 — 시안 420 고정 너비, 5:7 비율 (height = 588px 자동 도출) */
.edu-detail-v2 .venue-layout__media {
  width: 42rem;                                         /* 420px */
  aspect-ratio: 5 / 7;                                  /* 420 × 588 (5:7) */
  align-self: start;
}


/* ==================== V01-1. 배지 행 (카테고리/상태 + 공유/인쇄) ==================== */
.edu-detail-v2 .pfmc-detail-badges {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0;
  gap: 0;                                               /* 좌·우 정렬 (space-between) */
}
.edu-detail-v2 .pfmc-detail-badges__tags {
  gap: var(--ds-number-3);                              /* 6px */
}
/* venue-layout__content 자식 간격 — 형제 selector로 명시
   CTA는 .pfmc-detail-cta 자체 룰의 margin-top: auto 로 컬럼 바닥에 정렬 (정보리스트 행 개수 차이에도 위치 유지) */
.edu-detail-v2 .pfmc-detail-badges + .pfmc-detail-title {
  margin-top: 15px;
}
.edu-detail-v2 .pfmc-detail-title + .pfmc-info-list {
  margin-top: 30px;
}
/* DS 동기화: pfmc-page.css의 .pfmc-tag--line 룰 (배경 투명 + primary-50 보더) */
.edu-detail-v2 .pfmc-tag--line {
  background-color: transparent;
  border-color: var(--ds-comp-color, var(--ds-color-primary-50));
}
/* [CUSTOM START: .ds-tag] DS 기본 radius 8px → 시안 radius 30px (border-radius만 v3 커스텀) */
.edu-detail-v2 .pfmc-detail-badges .ds-tag {
  font-size: 14px;
  border-radius: 30px;
}
/* [CUSTOM END: .ds-tag] */


/* ==================== V01-2. 교육명/공고명 ==================== */
.edu-detail-v2 .pfmc-detail-title {
  font-size: var(--ds-font-size-36);                    /* Figma 38 → DS 36 (가까움) */
  font-weight: var(--ds-typo-font-weight-bold);
  color: var(--ds-color-gray-95);                       /* #131416 */
  line-height: 1.2;
  letter-spacing: -0.025em;
  word-break: keep-all;
  margin: 0;
  padding-bottom: var(--ds-number-11);                  /* 22px (Figma gap) */
  border-bottom: var(--ds-border-width-thin) solid var(--ds-color-primary-95);  /* #000d14 1px */
}


/* ==================== V01-3. 정보 리스트 ==================== */
.edu-detail-v2 .pfmc-info-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 0;
}
.edu-detail-v2 .pfmc-info-list__row {
  display: flex;
  align-items: flex-start;
  gap: var(--ds-number-2);
  padding-bottom: 20px;
  padding-top: 0;
  border-top: none;
  border-bottom: none;
}
.edu-detail-v2 .pfmc-info-list__label {
  width: 10rem;                                         /* 100px (시안 max-width 100) */
  flex-shrink: 0;
  font-size: var(--ds-font-size-16);                    /* 16px Semibold */
  font-weight: var(--ds-typo-font-weight-semibold);
  color: #777b80;
  line-height: 1.6;
  letter-spacing: -0.012em;
}
.edu-detail-v2 .pfmc-info-list__value {
  font-size: 16px;
  font-weight: var(--ds-typo-font-weight-semibold);     /* 600 */
  color: var(--ds-color-gray-90);                       /* #1e2124 */
  line-height: 1.6;                                     /* 라벨과 동일 — 행 세로 길이(25.6px)에 맞춤 */
  letter-spacing: -0.011em;
}


/* ==================== V01-4. CTA 버튼 영역 ====================
   margin-top: auto + padding-top: 30px — 컬럼 stretch 시 항상 바닥 정렬,
   정보 리스트와의 최소 30px 간격은 padding-top 으로 보장 (행 개수가 적어도 보기 자연스럽게) */
.edu-detail-v2 .pfmc-detail-cta {
  display: flex;
  align-items: stretch;
  gap: var(--ds-number-10);                             /* 20px */
  margin-top: auto;
  padding-top: 30px;
}
/* 신청하기 — ds-btn--xl 위 시안 추가 스펙 (버튼 컴포넌트 상세 스펙) */
.edu-detail-v2 .pfmc-detail-cta .ds-btn--xl {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 28rem;                                     /* 280px */
  min-height: var(--ds-number-28);                      /* 56px */
  padding: var(--ds-number-10) var(--ds-number-18);     /* 20px 36px */
  gap: var(--ds-number-6);                              /* 12px (icon ↔ text) */
  font-size: var(--ds-font-size-22);                    /* Figma 21 → DS 22 (가까움) */
  font-weight: var(--ds-typo-font-weight-bold);
}
.edu-detail-v2 .pfmc-detail-cta .ds-btn__icon {
  width: var(--ds-number-12);                           /* 24px */
  height: var(--ds-number-12);
  display: inline-block;
  flex-shrink: 0;
}


/* ==================== V02. 교육안내/공고안내 섹션 ==================== */
/* 풀 폭 그라데이션 띠 — 페이지 좌우 컨테이너 폭을 벗어나 화면 전체로 */
.edu-detail-v2 .pfmc-subtitle-v3-wrap {
  width: 100vw;
  position: relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: linear-gradient(180deg, var(--ds-color-gray-5) 0%, var(--ds-color-gray-0) 100%);
  padding-top: var(--ds-number-30);                     /* 60px */
  padding-bottom: var(--ds-number-15);                  /* 30px */
  margin-top: 10rem;                                    /* 100px (Hero ↔ 안내 섹션) */
}
/* inner — sub-page-wrap과 동일 폭/패딩으로 정확히 좌측 정렬 */
.edu-detail-v2 .pfmc-subtitle-v3-inner {
  max-width: var(--ds-contents-size-wide);              /* 1440px */
  margin-inline: auto;
  padding-inline: 0;
}
@media (max-width: 1440px) {
  .edu-detail-v2 .pfmc-subtitle-v3-inner {
    padding-inline: var(--ds-pc-padding-layout-side);   /* 30px (PC/태블릿) */
  }
}
@media (max-width: 767px) {
  .edu-detail-v2 .pfmc-subtitle-v3-inner {
    padding-inline: var(--ds-mobile-padding-layout-side, 1.6rem); /* 16px (모바일 sub-page-wrap과 정렬) */
  }
}
.edu-detail-v2 .pfmc-subtitle-v3 {
  display: inline-flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--ds-number-6);                              /* 12px */
}
.edu-detail-v2 .pfmc-subtitle-v3__title {
  font-size: var(--ds-font-size-28);                    /* 28px */
  font-weight: var(--ds-typo-font-weight-bold);
  color: var(--ds-color-gray-95);                       /* #131416 */
  line-height: 1.2;
  letter-spacing: -0.007em;
  margin: 0;
}
.edu-detail-v2 .pfmc-subtitle-v3__line {
  width: 100%;
  height: var(--ds-border-width-medium);                /* 2px */
  background: var(--ds-color-brand-dark);               /* #343A48 */
}

/* 본문 (WYSIWYG) — 시안 스펙 (margin 기반 자식 간격) */
.edu-detail-v2 .pfmc-detail-section {
  margin-top: 0;                                        /* 위 wrap에 margin 있음 */
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg {
  padding-top: var(--ds-number-15);                     /* 30px (그라데이션 wrap → 본문) */
}
/* 인접 형제 간 기본 간격 = 24px */
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg > * + * {
  margin-top: var(--ds-number-12);                      /* 24px */
}
/* 이미지 → 다음 텍스트 간격 = 20px */
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg img + * {
  margin-top: var(--ds-number-10);                      /* 20px */
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg p {
  font-size: 1.8rem;                                    /* 18px (DS에 18 토큰 없어 literal) */
  font-weight: var(--ds-typo-font-weight-regular);
  color: var(--ds-color-gray-90);                       /* #1e2124 */
  letter-spacing: -0.01em;
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg img {
  width: 100%;
  max-width: 96rem;                                     /* 960px 상한 */
  height: auto;                                         /* 상세이미지는 자연 비율로 전체 출력 (긴 세로 이미지 대응) */
  margin-inline: auto;                                  /* 가운데 정렬 */
  border-radius: 0;
  display: block;
}
/* [교육 모듈 추가] 본문 br 정리 — 단락 구분용 빈 br 제거 (자식 간격은 margin으로 처리) */
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg > br {
  display: none;
}
/* 본문 글머리 리스트 (ul: 4×4 dot bullet, ol: decimal) */
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ul,
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol {
  font-size: var(--ds-font-size-19);
  color: var(--ds-color-gray-90);
  line-height: 1.6;
  padding-left: 0;
  list-style: none;
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ul li,
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol li {
  position: relative;
  padding-left: var(--ds-number-6);                     /* 12px (bullet + gap) */
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: var(--ds-number-2);
  height: var(--ds-number-2);
  border-radius: var(--ds-radius-max);
  background: currentColor;
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol {
  counter-reset: ds-ol;
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol li {
  counter-increment: ds-ol;
  padding-left: var(--ds-number-9);                     /* 18px */
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol li::before {
  content: counter(ds-ol) ".";
  position: absolute;
  left: 0;
  top: 0;
}
.edu-detail-v2 .pfmc-detail-section .ds-wysiwyg li + li {
  margin-top: var(--ds-number-3);                       /* 6px */
}


/* ==================== V03. 하단 목록 버튼 영역 ==================== */
.edu-detail-v2 .ds-detail-actions {
  border-top: var(--ds-border-width-thin) solid var(--ds-color-gray-10);  /* #e6e8ea */
  padding-top: var(--ds-number-30);                     /* 60px */
  text-align: center;
  margin-top: var(--ds-number-30);                      /* 60px (본문 ↔ 목록버튼) */
}
.edu-detail-v2 .ds-detail-actions .ds-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: var(--ds-number-20);                      /* 40px */
  padding: var(--ds-number-5) var(--ds-number-12);      /* 10px 24px */
  font-size: var(--ds-font-size-16);                    /* 16px (이미지 비례) */
  font-weight: var(--ds-typo-font-weight-bold);
  letter-spacing: -0.01em;
}
/* layout.css의 ds-detail-actions .ds-btn:first-child가 자동 gray-60 fill을 강제하므로
   v3에서는 first-child 룰을 명시적으로 transparent + color-utility 컬러로 복구 */
.edu-detail-v2 .ds-detail-actions .ds-btn:first-child {
  background-color: transparent;
  color: var(--ds-comp-color);
  border: var(--ds-border-width-thin) solid var(--ds-comp-color);
}
.edu-detail-v2 .ds-detail-actions .ds-btn:first-child:hover {
  background-color: color-mix(in srgb, var(--ds-comp-color) 8%, white);
}


/* ==================== [교육 모듈 추가] 모바일 플로팅 CTA ==================== */
/* PC 숨김 — 현재 HTML에서 신청하기 [임시 비노출] 처리에 맞춰 함께 미노출 (HTML 주석 제어) */
.edu-detail-v2 .pfmc-floating-cta {
  display: none;
}


/* ==================== R. 반응형 — 태블릿 (768~1199px) ==================== */
@media (max-width: 1199px) and (min-width: 768px) {
  .edu-detail-v2 .venue-layout {
    grid-template-columns: 4fr 6fr;                     /* 비율 자동 축소 (포스터 ~40%, 텍스트 ~60%) */
    gap: var(--ds-number-30);                           /* 60px (6rem) */
    align-items: start;
  }
  .edu-detail-v2 .venue-layout__media {
    width: 100%;
    max-width: 42rem;                                   /* PC 시안 420 초과 금지 */
    height: auto;
    aspect-ratio: 5 / 7;                                /* 5:7 비율 */
    align-self: start;
  }
  .edu-detail-v2 .venue-layout__content {
    gap: 0;
  }
  .edu-detail-v2 .pfmc-detail-badges + .pfmc-detail-title {
    margin-top: 15px;
  }
  .edu-detail-v2 .pfmc-detail-title + .pfmc-info-list,
  .edu-detail-v2 .pfmc-info-list + .pfmc-detail-cta {
    margin-top: var(--ds-number-9);                     /* 18px */
  }
  .edu-detail-v2 .pfmc-detail-badges .ds-tag {
    font-size: var(--ds-font-size-15);                  /* 15px */
  }
  .edu-detail-v2 .pfmc-detail-title {
    font-size: var(--ds-font-size-28);
    padding-bottom: var(--ds-number-9);                 /* 18px */
  }
  .edu-detail-v2 .pfmc-info-list__row {
    padding: var(--ds-number-5) 0;                      /* 10px */
  }
  .edu-detail-v2 .pfmc-info-list__label {
    width: 8rem;                                        /* 80px */
    font-size: var(--ds-font-size-14);
  }
  .edu-detail-v2 .pfmc-info-list__value {
    font-size: var(--ds-font-size-15);
    line-height: 1.6;
  }
  .edu-detail-v2 .pfmc-detail-cta {
    gap: var(--ds-number-6);                            /* 12px */
    padding-top: var(--ds-number-15);                   /* 30px */
  }
  .edu-detail-v2 .pfmc-detail-cta .ds-btn--xl {
    flex: 1 1 0;
    min-width: 0;
    min-height: var(--ds-number-24);                    /* 48px */
    padding: var(--ds-number-7) var(--ds-number-10);    /* 14px 20px */
    font-size: var(--ds-font-size-17);
    gap: var(--ds-number-4);                            /* 8px (icon ↔ text) */
  }
  .edu-detail-v2 .pfmc-detail-cta .ds-btn__icon {
    width: var(--ds-number-10);                         /* 20px */
    height: var(--ds-number-10);
  }
  .edu-detail-v2 .pfmc-subtitle-v3-wrap {
    margin-top: 10rem;
    padding-top: var(--ds-number-30);
    padding-bottom: var(--ds-number-15);
  }
  .edu-detail-v2 .pfmc-subtitle-v3__title {
    font-size: var(--ds-font-size-22);                  /* 22px */
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg {
    gap: var(--ds-number-9);                            /* 18px */
    padding-top: var(--ds-number-10);
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg p {
    font-size: var(--ds-font-size-16);
    line-height: 1.6;
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ul,
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol {
    font-size: var(--ds-font-size-16);
    padding-left: var(--ds-number-9);                   /* 18px */
  }
  .edu-detail-v2 .ds-detail-actions {
    padding-top: var(--ds-number-30);
    margin-top: var(--ds-number-30);
  }
}


/* ==================== R. 반응형 — 모바일 (≤ 767px) ==================== */
@media (max-width: 767px) {
  .edu-detail-v2 .venue-layout {
    grid-template-columns: 1fr;
    gap: var(--ds-number-15);                           /* 30px */
    align-items: start;
  }
  .edu-detail-v2 .venue-layout__media {
    width: 100%;
    max-width: none;
    height: auto;
    aspect-ratio: 5 / 7;
    align-self: stretch;
  }
  .edu-detail-v2 .venue-layout__content {
    gap: 0;
  }
  .edu-detail-v2 .pfmc-detail-badges + .pfmc-detail-title {
    margin-top: 15px;
  }
  .edu-detail-v2 .pfmc-detail-title + .pfmc-info-list,
  .edu-detail-v2 .pfmc-info-list + .pfmc-detail-cta {
    margin-top: var(--ds-mobile-padding-7, 1.8rem);     /* 18px */
  }
  .edu-detail-v2 .pfmc-detail-badges .ds-tag {
    min-height: var(--ds-number-14);                    /* 28px */
    height: auto;
    padding: 0 var(--ds-number-4);                      /* 0 8px */
    font-size: var(--ds-font-size-12);                  /* 12px */
    line-height: var(--ds-number-14);                   /* 28px (vertical center) */
  }
  .edu-detail-v2 .pfmc-detail-title {
    font-size: var(--ds-mobile-font-size-heading-medium, 2.2rem);
    padding-bottom: var(--ds-mobile-padding-5, 1.4rem);
  }
  .edu-detail-v2 .pfmc-info-list__row {
    padding: 5px 0;
    gap: var(--ds-number-5);                            /* 10px */
  }
  .edu-detail-v2 .pfmc-info-list__label {
    width: 7rem;                                        /* 70px */
    font-size: var(--ds-font-size-13);                  /* 13px */
    line-height: 1.4;
  }
  .edu-detail-v2 .pfmc-info-list__value {
    font-size: var(--ds-font-size-14);                  /* 14px */
    line-height: 1.5;
  }
  .edu-detail-v2 .pfmc-detail-cta {
    flex-direction: column;
    gap: var(--ds-mobile-padding-4, 1.2rem);
    padding-top: var(--ds-mobile-padding-7, 1.8rem);
  }
  .edu-detail-v2 .pfmc-detail-cta .ds-btn--xl {
    width: 100%;
    min-width: 0;
    min-height: var(--ds-btn--height-l);                /* 48px */
    padding: var(--ds-number-6) var(--ds-number-8);     /* 12px 16px */
    font-size: var(--ds-mobile-font-size-label-small, 1.5rem);  /* 15px */
    gap: var(--ds-number-4);                            /* 8px (icon ↔ text) */
  }
  .edu-detail-v2 .pfmc-detail-cta .ds-btn__icon {
    width: var(--ds-number-10);                         /* 20px */
    height: var(--ds-number-10);
  }
  .edu-detail-v2 .pfmc-subtitle-v3__title {
    font-size: var(--ds-mobile-font-size-heading-small, 1.8rem);
  }
  .edu-detail-v2 .pfmc-subtitle-v3-wrap {
    margin-top: 10rem;
    padding-top: var(--ds-number-30);
    padding-bottom: var(--ds-number-15);
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg {
    padding-top: var(--ds-mobile-padding-5, 1.4rem);
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg > * + * {
    margin-top: var(--ds-mobile-padding-5, 1.4rem);     /* 14px */
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg img + * {
    margin-top: var(--ds-mobile-padding-4, 1.2rem);     /* 12px */
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg p {
    font-size: var(--ds-mobile-font-size-body-medium, 1.5rem);
  }
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ul,
  .edu-detail-v2 .pfmc-detail-section .ds-wysiwyg ol {
    font-size: var(--ds-mobile-font-size-body-medium, 1.5rem);
    padding-left: var(--ds-mobile-padding-5, 1.4rem);
  }
  .edu-detail-v2 .ds-detail-actions {
    padding-top: var(--ds-number-30);
    margin-top: var(--ds-number-30);
  }
  /* [교육 모듈 추가] 모바일 플로팅 CTA — 신청하기 활성화 시 노출 (현재 HTML 주석 처리 상태) */
  .edu-detail-v2 .pfmc-floating-cta {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    padding: var(--ds-number-4) var(--ds-mobile-padding-layout-side);
    background: var(--ds-color-gray-0);
    border-top: var(--ds-border-width-thin) solid var(--ds-light-color-border-gray-light);
    box-shadow: var(--ds-shadow-m);
  }
  .edu-detail-v2 .pfmc-floating-cta .ds-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--ds-number-4);                            /* 8px */
  }
  .edu-detail-v2 .pfmc-floating-cta .ds-btn__icon {
    width: var(--ds-number-10);                         /* 20px */
    height: var(--ds-number-10);
  }
}

/* 포스터 확대 모달 hidden 보장 — component.css의 .ds-modal-backdrop{display:flex}가
   HTML [hidden] 기본값(display:none)을 덮어써, 진입 즉시 노출되고 X 닫기(re-set hidden)가
   무반응되는 문제 방지 (pfmc #etiquetteModal #421과 동일 패턴). */
#posterModal[hidden] {
  display: none !important;
}


/* ============================================================
   [추가/APPEND-ONLY] 사업소개 > 거버넌스 탭 전용 (.pccf-gov)
   - 원본: 사업소개 거버넌스 페이지 인라인 <style> 이관 (CMS 콘텐츠의 인라인 style 제거 목적)
   - 기존 규칙 일절 미변경, 파일 끝에 추가만
   - base64 이미지 파일 추출: --face -> ../../img/gov-face.png (캐릭터 SVG는 콘텐츠에서 참조)
   - 원본 Pretendard CDN @import 는 파일끝 append 시 무효라 제외 (font-family 폴백 동작)
   ============================================================ */
.pccf-gov{--ac:#e5402a;--navy:#2f3540;--face:url("../../img/gov-face.png");font-family:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;color:#262329;max-width:1200px;margin:0 auto;padding:8px 24px 24px;line-height:1.5;}
.pccf-gov *{box-sizing:border-box;}
.pccf-gov__eyebrow{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ac);margin:0 0 16px;}
.pccf-gov__eyebrow::before{content:"";display:block;width:26px;height:2px;background:var(--ac);}
.pccf-gov__hero{display:grid;grid-template-columns:1.25fr .8fr;gap:48px;align-items:center;padding:24px 0 56px;}
.pccf-gov__hero>div:first-child{margin-top:-26px;}
.pccf-gov__title{margin:0;font-size:50px;line-height:1.18;font-weight:800;letter-spacing:-.03em;color:#1f1c22;}
.pccf-gov__u{position:relative;display:inline-block;}
.pccf-gov__u svg{position:absolute;left:-4px;right:-4px;bottom:-12px;width:calc(100% + 8px);height:13px;overflow:visible;}
.pccf-gov__chip{display:inline-flex;flex-direction:column;gap:3px;padding:14px 22px;background:#f5f6f7;border:1px solid #e6e7ea;border-radius:16px;margin-top:32px;}
.pccf-gov__chip b{font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#a7a7ad;text-transform:uppercase;}
.pccf-gov__chip i{font-size:16px;font-weight:700;color:#2f2c30;font-style:normal;}
.pccf-gov__charwrap{position:relative;display:flex;justify-content:center;align-items:center;min-height:300px;}
.pccf-gov__ring{position:absolute;top:8px;left:18px;width:210px;height:210px;border:2px dashed #d8dade;border-radius:48% 52% 55% 45%/52% 48% 52% 48%;}
.pccf-gov__bubble{position:absolute;top:-6px;left:50%;transform:translateX(-44%);background:#fff;border:2px solid var(--navy);border-radius:18px 18px 18px 4px;padding:11px 16px;font-size:15px;font-weight:800;color:#2f2c30;box-shadow:3px 4px 0 rgba(47,53,64,.12);z-index:3;}
.pccf-gov__bubble::after{content:"";position:absolute;left:14px;bottom:-9px;width:14px;height:14px;background:#fff;border-left:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(-45deg);}
.pccf-gov__face{width:208px;height:208px;border-radius:50%;background:#f4f5f7 var(--face) no-repeat center bottom;background-size:72% auto;border:2px solid var(--navy);box-shadow:6px 8px 0 rgba(47,53,64,.1);animation:pccfFloat 5s ease-in-out infinite;}
.pccf-gov__panel{background:#f5f6f7;border:1px solid #e6e7ea;border-radius:28px;padding:48px 44px;margin-bottom:64px;}
.pccf-gov__h2{margin:0 0 36px;font-size:34px;font-weight:700;letter-spacing:-.025em;color:#1f1c22;}
.pccf-gov__grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.pccf-gov__purpose{background:#fff;border:none;border-radius:62px 18px 46px 24px;padding:40px 34px;}
.pccf-gov__grid3 .pccf-gov__purpose:nth-child(2){border-radius:20px 58px 26px 50px;}
.pccf-gov__grid3 .pccf-gov__purpose:nth-child(3){border-radius:44px 30px 16px 66px;}
.pccf-gov__num{width:50px;height:50px;display:flex;align-items:center;justify-content:center;border:2px solid var(--ac);font-size:17px;font-weight:800;color:var(--ac);margin-bottom:18px;}
.pccf-gov__num--1{border-radius:47% 53% 50% 50%/55% 48% 52% 45%;border-color:#ef4123;color:#ef4123;}
.pccf-gov__num--2{border-radius:53% 47% 52% 48%/48% 52% 48% 52%;border-color:#50b848;color:#50b848;}
.pccf-gov__num--3{border-radius:50% 50% 47% 53%/52% 45% 55% 48%;border-color:#047bc1;color:#047bc1;}
.pccf-gov__purpose p{margin:0;font-size:17px;line-height:1.6;font-weight:600;color:#34302c;}
.pccf-gov__purpose strong{color:#1f1c22;font-weight:800;}
.pccf-gov__card{position:relative;background:#fff;border:1px solid #e6e7ea;border-radius:24px;padding:32px 28px 30px;overflow:hidden;}
.pccf-gov__card--dark{background:var(--navy);border-color:var(--navy);box-shadow:0 10px 24px rgba(47,53,64,.18);}
.pccf-gov__cardtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.pccf-gov__tag{font-size:11.5px;font-weight:800;letter-spacing:.12em;color:#a7a7ad;}
.pccf-gov__card--dark .pccf-gov__tag{color:#8c93a0;}
.pccf-gov__charbadge{position:relative;}
.pccf-gov__minibubble{position:absolute;top:-6px;right:54px;background:var(--navy);color:#fff;border-radius:12px 12px 3px 12px;padding:5px 10px;font-size:12px;font-weight:800;white-space:nowrap;}
.pccf-gov__card--dark .pccf-gov__minibubble{background:var(--ac);}
.pccf-gov__cardface{width:56px;height:56px;border-radius:50%;background:#f4f5f7 var(--face) no-repeat center bottom;background-size:78% auto;border:2px solid var(--ac);}
.pccf-gov__cardface.is-flip{transform:scaleX(-1);}
.pccf-gov__cardface--w{background-color:#fff;}
.pccf-gov__cardface--icon{background-image:none;background-color:#f1f2f4;display:flex;align-items:center;justify-content:center;border:none;}
.pccf-gov__cardface--icon svg{width:42%;height:42%;color:#4b4d55;}
.pccf-gov__sub{margin:0 0 4px;font-size:15px;font-weight:700;color:#9b9ba2;}
.pccf-gov__name{margin:0 0 16px;font-size:24px;font-weight:800;color:#1f1c22;letter-spacing:-.02em;}
.pccf-gov__card--dark .pccf-gov__sub{color:#9aa1ae;}
.pccf-gov__card--dark .pccf-gov__name{color:#fff;}
.pccf-gov__desc{margin:0;font-size:15.5px;line-height:1.65;color:#5a5a62;}
.pccf-gov__card--dark .pccf-gov__desc{color:#c9cdd5;}
.pccf-gov__card--dark .pccf-gov__list li{color:#c9cdd5;}
.pccf-gov__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.pccf-gov__list li{display:flex;gap:0;font-size:15.5px;line-height:1.5;color:#5a5a62;}
.pccf-gov__list li::before{display:none;}
.pccf-gov__bar{position:absolute;left:0;bottom:0;width:46%;height:5px;background:var(--ac);border-radius:0 5px 0 24px;}
@keyframes pccfFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@media (max-width:880px){
 .pccf-gov__hero{grid-template-columns:1fr;gap:24px;}
 .pccf-gov__title{font-size:38px;}
 .pccf-gov__grid3{grid-template-columns:1fr;}
 .pccf-gov__panel{padding:32px 22px;}
 .pccf-gov__h2{font-size:28px;}
}


/* ============================================================
   [추가/APPEND-ONLY] 사업소개 > 생활문화 탭 전용 (.pccf-life)
   - 원본은 .pccf-gov 클래스를 재사용 → 거버넌스(.pccf-gov)와 충돌 방지 위해 .pccf-life 로 네임스페이스 분리
   - 기존 규칙 일절 미변경, 파일 끝에 추가만 / --face 는 기존 gov-face.png 재사용
   - 원본 Pretendard CDN @import 제외 (파일끝 무효, font-family 폴백 동작)
   ============================================================ */
.pccf-life{--ac:#e5402a;--navy:#2f3540;--face:url("../../img/gov-face.png");font-family:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;color:#262329;max-width:1200px;margin:0 auto;padding:8px 24px 24px;line-height:1.5;}
.pccf-life *{box-sizing:border-box;}
.pccf-life__eyebrow{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ac);margin:0 0 16px;}
.pccf-life__eyebrow::before{content:"";display:none;width:26px;height:2px;background:var(--ac);}
.pccf-life__hero{display:grid;grid-template-columns:1.25fr .8fr;gap:48px;align-items:center;padding:24px 0 56px;}
.pccf-life__hero>div:first-child{margin-top:-26px;}
.pccf-life__title{margin:0;font-size:50px;line-height:1.18;font-weight:800;letter-spacing:-.03em;color:#1f1c22;}
.pccf-life__u{position:relative;display:inline-block;}
.pccf-life__u svg{position:absolute;left:-4px;right:-4px;bottom:-12px;width:calc(100% + 8px);height:13px;overflow:visible;}
.pccf-life__chip{display:inline-flex;flex-direction:column;gap:3px;padding:14px 22px;background:#f5f6f7;border:1px solid #e6e7ea;border-radius:16px;margin-top:32px;}
.pccf-life__chip b{font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#a7a7ad;text-transform:uppercase;}
.pccf-life__chip i{font-size:16px;font-weight:700;color:#2f2c30;font-style:normal;}
.pccf-life__charwrap{position:relative;display:flex;justify-content:center;align-items:center;min-height:300px;}
.pccf-life__ring{position:absolute;top:8px;left:18px;width:210px;height:210px;border:2px dashed #d8dade;border-radius:48% 52% 55% 45%/52% 48% 52% 48%;}
.pccf-life__bubble{position:absolute;top:-6px;left:50%;transform:translateX(-44%);background:#fff;border:2px solid var(--navy);border-radius:18px 18px 18px 4px;padding:11px 16px;font-size:15px;font-weight:800;color:#2f2c30;box-shadow:3px 4px 0 rgba(47,53,64,.12);z-index:3;}
.pccf-life__bubble::after{content:"";position:absolute;left:14px;bottom:-9px;width:14px;height:14px;background:#fff;border-left:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(-45deg);}
.pccf-life__face{width:208px;height:208px;border-radius:50%;background:#f4f5f7 var(--face) no-repeat center bottom;background-size:72% auto;border:2px solid var(--navy);box-shadow:6px 8px 0 rgba(47,53,64,.1);animation:pccfFloat 5s ease-in-out infinite;}
.pccf-life__panel{background:#f5f6f7;border:1px solid #e6e7ea;border-radius:28px;padding:48px 44px;margin-bottom:64px;}
.pccf-life__h2{margin:0 0 36px;font-size:34px;font-weight:700;letter-spacing:-.025em;color:#1f1c22;}
.pccf-life__grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;grid-auto-rows:1fr;}
.pccf-life__purpose{background:#fff;border:none;border-radius:62px 18px 46px 24px;padding:40px 34px;}
.pccf-life__grid3 .pccf-life__purpose:nth-child(2){border-radius:20px 58px 26px 50px;}
.pccf-life__grid3 .pccf-life__purpose:nth-child(3){border-radius:44px 30px 16px 66px;}
.pccf-life__num{width:50px;height:50px;display:flex;align-items:center;justify-content:center;border:2px solid var(--ac);font-size:17px;font-weight:800;color:var(--ac);margin-bottom:18px;}
.pccf-life__num--1{border-radius:47% 53% 50% 50%/55% 48% 52% 45%;border-color:#ef4123;color:#ef4123;}
.pccf-life__num--2{border-radius:53% 47% 52% 48%/48% 52% 48% 52%;border-color:#50b848;color:#50b848;}
.pccf-life__num--3{border-radius:50% 50% 47% 53%/52% 45% 55% 48%;border-color:#047bc1;color:#047bc1;}
.pccf-life__purpose p{margin:0;font-size:17px;line-height:1.6;font-weight:600;color:#34302c;}
.pccf-life__purpose strong{color:#1f1c22;font-weight:800;}
.pccf-life__card{position:relative;background:#fff;border:1px solid #e6e7ea;border-radius:24px;padding:32px 28px 30px;overflow:hidden;}
.pccf-life__card--dark{background:var(--navy);border-color:var(--navy);box-shadow:0 10px 24px rgba(47,53,64,.18);}
.pccf-life__cardtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.pccf-life__tag{font-size:11.5px;font-weight:800;letter-spacing:.12em;color:#a7a7ad;}
.pccf-life__card--dark .pccf-life__tag{color:#8c93a0;}
.pccf-life__charbadge{position:relative;}
.pccf-life__minibubble{position:absolute;top:-6px;right:54px;background:var(--navy);color:#fff;border-radius:12px 12px 3px 12px;padding:5px 10px;font-size:12px;font-weight:800;white-space:nowrap;}
.pccf-life__card--dark .pccf-life__minibubble{background:var(--ac);}
.pccf-life__cardface{width:56px;height:56px;border-radius:50%;background:#f4f5f7 var(--face) no-repeat center bottom;background-size:78% auto;border:2px solid var(--ac);}
.pccf-life__cardface.is-flip{transform:scaleX(-1);}
.pccf-life__cardface--w{background-color:#fff;}
.pccf-life__cardface--icon{background-image:none;background-color:#f1f2f4;display:flex;align-items:center;justify-content:center;border:none;}
.pccf-life__cardface--icon svg{width:42%;height:42%;color:#4b4d55;}
.pccf-life__sub{margin:0 0 4px;font-size:15px;font-weight:700;color:#9b9ba2;}
.pccf-life__name{margin:0 0 16px;font-size:24px;font-weight:800;color:#1f1c22;letter-spacing:-.02em;}
.pccf-life__card--dark .pccf-life__sub{color:#9aa1ae;}
.pccf-life__card--dark .pccf-life__name{color:#fff;}
.pccf-life__desc{margin:0;font-size:14.5px;line-height:1.8;color:#5a5a62;}
.pccf-life__card--dark .pccf-life__desc{color:#c9cdd5;}
.pccf-life__card--dark .pccf-life__list li{color:#c9cdd5;}
.pccf-life__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.pccf-life__list li{display:flex;gap:0;font-size:15.5px;line-height:1.5;color:#5a5a62;}
.pccf-life__list li::before{display:none;}
.pccf-life__bar{position:absolute;left:0;bottom:0;width:46%;height:5px;background:var(--ac);border-radius:0 5px 0 24px;}
@keyframes pccfFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@media (max-width:880px){
 .pccf-life__hero{grid-template-columns:1fr;gap:24px;}
 .pccf-life__title{font-size:38px;}
 .pccf-life__grid3{grid-template-columns:1fr;}
 .pccf-life__panel{padding:32px 22px;}
 .pccf-life__h2{font-size:28px;}
}
  .pccf-life__cardface--num{background-image:none;background:#f1f2f4;border:none;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:800;color:#4b4d55;letter-spacing:-.01em;}
.pccf-life__lead{margin:22px 0 0;font-size:16px;line-height:1.72;color:#5a5560;font-weight:500;}
.pccf-life__cta{display:flex;align-items:center;justify-content:space-between;gap:32px;background:var(--navy);border-radius:24px;padding:40px 36px;margin-top:64px;}
.pccf-life__cta-eyebrow{margin:0 0 10px;font-size:14px;font-weight:700;color:#9aa1ae;letter-spacing:.01em;}
.pccf-life__cta-title{margin:0;font-size:34px;font-weight:800;color:#fff;letter-spacing:-.02em;}
.pccf-life__cta-sub{margin:14px 0 0;font-size:16px;color:#c9cdd5;font-weight:500;}
.pccf-life__cta-btn{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;background:#1577c2;color:#fff;font-size:16px;font-weight:700;text-decoration:none;padding:13px 34px;border-radius:8px;border:none;}
.pccf-life__cta-btn:hover{background:#1267a8;}
@media (max-width:768px){.pccf-life__cta{flex-direction:column;align-items:flex-start;gap:24px;padding:32px 28px;}.pccf-life__cta-title{font-size:28px;}.pccf-life__cta-btn{width:100%;justify-content:center;}}


/* ============================================================
   [추가/APPEND-ONLY] 사업소개 > 문화예술교육 탭 전용 (.pccf-edu)
   - 원본 .pccf-gov 재사용 → 거버넌스(.pccf-gov)/생활문화(.pccf-life)와 충돌 방지 위해 .pccf-edu 네임스페이스 분리
   - 기존 규칙 미변경(append only) / --face 는 기존 gov-face.png 재사용 / @import 제외
   ============================================================ */
.pccf-edu{--ac:#e5402a;--navy:#2f3540;--face:url("../../img/gov-face.png");font-family:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;color:#262329;max-width:1200px;margin:0 auto;padding:8px 24px 24px;line-height:1.5;}
.pccf-edu *{box-sizing:border-box;}
.pccf-edu__eyebrow{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ac);margin:0 0 16px;}
.pccf-edu__eyebrow::before{content:"";display:none;width:26px;height:2px;background:var(--ac);}
.pccf-edu__hero{display:grid;grid-template-columns:1.25fr .8fr;gap:48px;align-items:center;padding:24px 0 56px;}
.pccf-edu__hero>div:first-child{margin-top:-26px;}
.pccf-edu__title{margin:0;font-size:50px;line-height:1.18;font-weight:800;letter-spacing:-.03em;color:#1f1c22;}
.pccf-edu__u{position:relative;display:inline-block;}
.pccf-edu__u svg{position:absolute;left:-4px;right:-4px;bottom:-12px;width:calc(100% + 8px);height:13px;overflow:visible;}
.pccf-edu__chip{display:inline-flex;flex-direction:column;gap:3px;padding:14px 22px;background:#f5f6f7;border:1px solid #e6e7ea;border-radius:16px;margin-top:32px;}
.pccf-edu__chip b{font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#a7a7ad;text-transform:uppercase;}
.pccf-edu__chip i{font-size:16px;font-weight:700;color:#2f2c30;font-style:normal;}
.pccf-edu__charwrap{position:relative;display:flex;justify-content:center;align-items:center;min-height:300px;}
.pccf-edu__ring{position:absolute;top:8px;left:18px;width:210px;height:210px;border:2px dashed #d8dade;border-radius:48% 52% 55% 45%/52% 48% 52% 48%;}
.pccf-edu__bubble{position:absolute;top:-6px;left:50%;transform:translateX(-44%);background:#fff;border:2px solid var(--navy);border-radius:18px 18px 18px 4px;padding:11px 16px;font-size:15px;font-weight:800;color:#2f2c30;box-shadow:3px 4px 0 rgba(47,53,64,.12);z-index:3;}
.pccf-edu__bubble::after{content:"";position:absolute;left:14px;bottom:-9px;width:14px;height:14px;background:#fff;border-left:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(-45deg);}
.pccf-edu__face{width:208px;height:208px;border-radius:50%;background:#f4f5f7 var(--face) no-repeat center bottom;background-size:72% auto;border:2px solid var(--navy);box-shadow:6px 8px 0 rgba(47,53,64,.1);animation:pccfFloat 5s ease-in-out infinite;}
.pccf-edu__panel{background:#f5f6f7;border:1px solid #e6e7ea;border-radius:28px;padding:48px 44px;margin-bottom:64px;}
.pccf-edu__h2{margin:0 0 36px;font-size:34px;font-weight:700;letter-spacing:-.025em;color:#1f1c22;}
.pccf-edu__grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;grid-auto-rows:1fr;}
.pccf-edu__purpose{background:#fff;border:none;border-radius:62px 18px 46px 24px;padding:40px 34px;}
.pccf-edu__grid3 .pccf-edu__purpose:nth-child(2){border-radius:20px 58px 26px 50px;}
.pccf-edu__grid3 .pccf-edu__purpose:nth-child(3){border-radius:44px 30px 16px 66px;}
.pccf-edu__num{width:50px;height:50px;display:flex;align-items:center;justify-content:center;border:2px solid var(--ac);font-size:17px;font-weight:800;color:var(--ac);margin-bottom:18px;}
.pccf-edu__num--1{border-radius:47% 53% 50% 50%/55% 48% 52% 45%;border-color:#ef4123;color:#ef4123;}
.pccf-edu__num--2{border-radius:53% 47% 52% 48%/48% 52% 48% 52%;border-color:#50b848;color:#50b848;}
.pccf-edu__num--3{border-radius:50% 50% 47% 53%/52% 45% 55% 48%;border-color:#047bc1;color:#047bc1;}
.pccf-edu__purpose p{margin:0;font-size:17px;line-height:1.6;font-weight:600;color:#34302c;}
.pccf-edu__purpose strong{color:#1f1c22;font-weight:800;}
.pccf-edu__card{position:relative;background:#fff;border:1px solid #e6e7ea;border-radius:24px;padding:32px 28px 30px;overflow:hidden;}
.pccf-edu__card--dark{background:var(--navy);border-color:var(--navy);box-shadow:0 10px 24px rgba(47,53,64,.18);}
.pccf-edu__cardtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.pccf-edu__tag{font-size:11.5px;font-weight:800;letter-spacing:.12em;color:#a7a7ad;}
.pccf-edu__card--dark .pccf-edu__tag{color:#8c93a0;}
.pccf-edu__charbadge{position:relative;}
.pccf-edu__minibubble{position:absolute;top:-6px;right:54px;background:var(--navy);color:#fff;border-radius:12px 12px 3px 12px;padding:5px 10px;font-size:12px;font-weight:800;white-space:nowrap;}
.pccf-edu__card--dark .pccf-edu__minibubble{background:var(--ac);}
.pccf-edu__cardface{width:56px;height:56px;border-radius:50%;background:#f4f5f7 var(--face) no-repeat center bottom;background-size:78% auto;border:2px solid var(--ac);}
.pccf-edu__cardface.is-flip{transform:scaleX(-1);}
.pccf-edu__cardface--w{background-color:#fff;}
.pccf-edu__cardface--icon{background-image:none;background-color:#f1f2f4;display:flex;align-items:center;justify-content:center;border:none;}
.pccf-edu__cardface--icon svg{width:42%;height:42%;color:#4b4d55;}
.pccf-edu__sub{margin:0 0 4px;font-size:15px;font-weight:700;color:#9b9ba2;}
.pccf-edu__name{margin:0 0 16px;font-size:24px;font-weight:800;color:#1f1c22;letter-spacing:-.02em;}
.pccf-edu__card--dark .pccf-edu__sub{color:#9aa1ae;}
.pccf-edu__card--dark .pccf-edu__name{color:#fff;}
.pccf-edu__desc{margin:0;font-size:14.5px;line-height:1.8;color:#5a5a62;}
.pccf-edu__card--dark .pccf-edu__desc{color:#c9cdd5;}
.pccf-edu__card--dark .pccf-edu__list li{color:#c9cdd5;}
.pccf-edu__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.pccf-edu__list li{display:flex;gap:0;font-size:15.5px;line-height:1.5;color:#5a5a62;}
.pccf-edu__list li::before{display:none;}
.pccf-edu__bar{position:absolute;left:0;bottom:0;width:46%;height:5px;background:var(--ac);border-radius:0 5px 0 24px;}
@keyframes pccfFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@media (max-width:880px){
 .pccf-edu__hero{grid-template-columns:1fr;gap:24px;}
 .pccf-edu__title{font-size:38px;}
 .pccf-edu__grid3{grid-template-columns:1fr;}
 .pccf-edu__panel{padding:32px 22px;}
 .pccf-edu__h2{font-size:28px;}
}
  .pccf-edu__cardface--num{background-image:none;background:#f1f2f4;border:none;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:800;color:#4b4d55;letter-spacing:-.01em;}
.pccf-edu__lead{margin:22px 0 0;font-size:16px;line-height:1.72;color:#5a5560;font-weight:500;}
.pccf-edu__cta{display:flex;align-items:center;justify-content:space-between;gap:32px;background:var(--navy);border-radius:24px;padding:40px 36px;margin-top:64px;}
.pccf-edu__cta-eyebrow{margin:0 0 10px;font-size:14px;font-weight:700;color:#9aa1ae;letter-spacing:.01em;}
.pccf-edu__cta-title{margin:0;font-size:34px;font-weight:800;color:#fff;letter-spacing:-.02em;}
.pccf-edu__cta-sub{margin:14px 0 0;font-size:16px;color:#c9cdd5;font-weight:500;}
.pccf-edu__cta-btn{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;background:#1577c2;color:#fff;font-size:16px;font-weight:700;text-decoration:none;padding:13px 34px;border-radius:8px;border:none;}
.pccf-edu__cta-btn:hover{background:#1267a8;}
@media (max-width:768px){.pccf-edu__cta{flex-direction:column;align-items:flex-start;gap:24px;padding:32px 28px;}.pccf-edu__cta-title{font-size:28px;}.pccf-edu__cta-btn{width:100%;justify-content:center;}}
.pccf-edu__grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;grid-auto-rows:1fr;}
@media (max-width:768px){.pccf-edu__grid2{grid-template-columns:1fr;}}
.pccf-edu__num--4{border-radius:50% 50% 53% 47%/48% 55% 45% 52%;border-color:#f0a020;color:#f0a020;}
.pccf-edu__grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.pccf-edu__grid4 .pccf-edu__purpose{padding:28px 22px;}
@media (max-width:768px){.pccf-edu__grid4{grid-template-columns:1fr;}}


/* ============================================================
   [추가/APPEND-ONLY] 교육·공고 상세 신청서 서식 chip (pfmc-attach-chip)
   - eduPgmView wrapper 는 .pfmc-detail-v3 → 상단 .edu-detail-v2 스코프가 안 먹으므로 .pfmc-detail-v3 로 이식
   - 퍼블 education-page-v2.css 의 .pfmc-attach-chip 스펙 동일 (흰 배경 + 브랜드 블루 라인/텍스트, pill, 다운로드 아이콘)
   ============================================================ */
.pfmc-detail-v3 .pfmc-info-list__value--attach {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.8rem;
}
.pfmc-detail-v3 .pfmc-attach-chip.ds-btn {
  --ds-btn--bg: var(--ds-color-gray-0);                  /* 흰 배경 */
  --ds-btn--color: var(--ds-color-primary-60);           /* 텍스트 — 브랜드 블루 */
  --ds-btn--border: var(--ds-color-primary-60);          /* 라인 — 브랜드 블루 */
  --ds-btn--radius: 99rem;                               /* 둥근 chip */
  min-height: 0;
  padding-block: 0.7rem;
  padding-inline: 1.6rem;
  gap: var(--ds-number-2);
  font-size: var(--ds-font-size-13);
}


/* ============================================================
   [추가/APPEND-ONLY] 접수상태 태그(접수중/접수마감)가 없을 때 제목 줄 레이아웃
   - 제목 좌측 + 공유/인쇄 우측 한 줄, 구분선은 제목+버튼 전체 폭까지
   - 제목(.pfmc-detail-title)의 하단 구분선을 titlebar 로 이동
   ============================================================ */
.pfmc-detail-v3 .pfmc-detail-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-top: 1.5rem;
  padding-bottom: var(--ds-number-11);                 /* 22px */
  border-bottom: var(--ds-border-width-thin) solid var(--ds-color-primary-95);
}
.pfmc-detail-v3 .pfmc-detail-titlebar .pfmc-detail-title {
  margin: 0;
  padding-bottom: 0;
  border-bottom: none;                                 /* 구분선은 titlebar 로 이동 */
}
.pfmc-detail-v3 .pfmc-detail-titlebar .ds-share-actions {
  flex-shrink: 0;
}

/* ── [간격 통일] 사업소개 콘텐츠(거버넌스·생활문화·문화예술교육) — 탭 ↔ 콘텐츠 50/28/28 ──
   CMS 등록본 맨 위 <link>가 .sub-page-wrap 직계 형제로 끼어
   글로벌 `.sub-page-wrap > .ds-tab/select + *` 인접 규칙이 콘텐츠 래퍼에 미적용 → 직접 보정.
   모바일은 사용자 지정값 28(케이스 B 기본 16 대신). 다른 페이지 영향 없음. */
.sub-page-wrap > .pccf-gov,
.sub-page-wrap > .pccf-life,
.sub-page-wrap > .pccf-edu { margin-top: 5rem; }                                                /* 50 — PC */
@media (max-width: 1199px) {
  .sub-page-wrap > .pccf-gov,
  .sub-page-wrap > .pccf-life,
  .sub-page-wrap > .pccf-edu { margin-top: var(--ds-number-14); }                                /* 28 — 태블릿 */
}
@media (max-width: 767px) {
  .sub-page-wrap > .pccf-gov,
  .sub-page-wrap > .pccf-life,
  .sub-page-wrap > .pccf-edu { margin-top: var(--ds-number-14); }                                /* 28 — 모바일(사용자 지정) */
}

/* ── [공고 목록 MNU-U-080201] 페이지네이션 우측 '이전 공고 보러가기' 버튼 (게시물 존재 시 상시 노출) ──
   .ds-pagination(flex·중앙정렬)은 유지하고 버튼만 우측 끝에 절대배치 →
   페이지네이션 중앙정렬과 `.ds-poster-list ~ .ds-pagination` 형제 간격 규칙을 모두 보존.
   .edu-notice-pager 는 이 JSP 전용 클래스라 다른 페이지 영향 없음. */
.edu-notice-pager { position: relative; min-height: 4rem; }
.edu-notice-pager .edu-notice-pager__prev {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}
/* 태블릿·모바일(≤1199): 우측 절대배치가 페이지네이션과 겹치므로 아래 새 줄 중앙으로 흐름 배치 전환 */
@media (max-width: 1199px) {
  .edu-notice-pager { flex-wrap: wrap; min-height: 0; }
  .edu-notice-pager .edu-notice-pager__prev {
    position: static;
    transform: none;
    flex-basis: 100%;
    margin-top: 1.6rem;
  }
}

/* ── [사업소개 hero 모바일 가로 오버플로우 방지 MNU-U-080301] ──
   3탭(생활문화·문화예술교육·거버넌스) hero 캐릭터 영역 .hwahap-hero 는 CMS 콘텐츠에
   인라인 width:360px/height:360px 로 고정 → 내부가 전부 position:absolute + px 좌표라
   반응형이 안 되고, 모바일 콘텐츠 폭(≈280~300px)을 초과해 좌/우 스크롤을 유발한다.
   charwrap 을 뷰포트 폭에 가두고(min-width:0·overflow:hidden), hero 를 축소(scale)해
   실제 점유 폭을 줄인다. 축소분 상하 여백은 음수 margin 으로 회수. 이 클래스들은
   사업소개 전용(이 파일에만 정의)이라 다른 페이지 영향 없음. */
@media (max-width: 767px) {
  .pccf-gov__charwrap,
  .pccf-life__charwrap,
  .pccf-edu__charwrap {
    min-width: 0;
    overflow: hidden;
  }
  /* 세 탭 hero 는 배경원(300)·궤도(330)·캐릭터 크기가 모두 동일 → 같은 scale 로 통일.
     거버넌스=img, 생활문화·문화예술교육=inline SVG 로 캐릭터 방식만 다를 뿐 치수는 같음. */
  .pccf-gov__charwrap .hwahap-hero,
  .pccf-life__charwrap .hwahap-hero,
  .pccf-edu__charwrap .hwahap-hero {
    transform: scale(0.76);
    transform-origin: center center;
    margin: -43px 0;                                    /* 360*(1-0.76)/2 ≈ 43 — 축소분 상하 여백 회수 */
  }
}
