/* --- 인사말 페이지 전용 스타일 --- */
.greeting-wrap {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    color: #333;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    line-height: 1.7;
}

/* 상단 헤드라인 */
.greeting-header {
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 2px solid #1459d8; /* 메인 컬러 */
}
.greeting-header h3 {
    font-size: 28px;
    font-weight: 700;
    color: #111;
    margin: 0 0 15px 0;
    letter-spacing: -0.05em;
}
.greeting-header p {
    font-size: 18px;
    color: #666;
    margin: 0;
    font-weight: 400;
}

/* 본문 섹션 공통 */
.greeting-section {
    margin-bottom: 40px;
}
.greeting-text {
    font-size: 16px;
    color: #444;
    word-break: keep-all;
    margin-bottom: 20px;
}

/* 강조 박스 (명언) */
.greeting-quote {
    background-color: #f5f7fb; /* 연한 배경 */
    padding: 40px;
    border-radius: 12px;
    margin: 40px 0;
    position: relative;
    text-align: center;
}
.greeting-quote::before {
    content: "❝";
    display: block;
    font-size: 60px;
    color: #1459d8;
    opacity: 0.2;
    line-height: 1;
    margin-bottom: 10px;
}
.greeting-quote strong {
    display: block;
    font-size: 22px;
    font-weight: 700;
    color: #1459d8;
    margin-bottom: 15px;
}
.greeting-quote p {
    font-size: 16px;
    color: #555;
    margin: 0;
}
.greeting-quote span {
    display: block;
    margin-top: 15px;
    font-size: 14px;
    color: #888;
    font-style: italic;
}

/* 하단 약속 영역 */
.greeting-promise {
    background: #fff;
    padding: 20px 0;
}
.greeting-promise h4 {
    font-size: 20px;
    color: #111;
    margin-bottom: 15px;
    font-weight: 700;
}

/* 서명 영역 */
.greeting-sign {
    margin-top: 60px;
    text-align: right;
    padding-top: 30px;
    border-top: 1px solid #eee;
}
.greeting-sign span {
    font-size: 15px;
    color: #666;
    margin-right: 10px;
}
.greeting-sign strong {
    font-size: 24px;
    color: #111;
    font-weight: 800;
}

/* 모바일 대응 */
@media (max-width: 768px) {
    .greeting-header h3 { font-size: 24px; }
    .greeting-header p { font-size: 16px; }
    .greeting-quote strong { font-size: 18px; }
    .greeting-sign { text-align: center; }
}

/* --- 대학교 입시홍보(유보통합) 포스터 스타일 --- */
/* 폰트어썸 (필요시 추가, 이미 있다면 생략 가능) */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

/* [대학교 입시홍보 - 모던 프로페셔널 스타일] */
.univ-pro-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155; /* Slate-700 (부드러운 검정) */
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 타이틀 섹션 */
.pro-header {
    text-align: center;
    margin-bottom: 60px;
    padding-bottom: 40px;
    border-bottom: 1px solid #e2e8f0;
}
.pro-badge {
    display: inline-block;
    background: #eff6ff; /* 아주 연한 블루 */
    color: #1459d8;      /* 메인 키 컬러 */
    font-size: 14px;
    font-weight: 700;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 16px;
    letter-spacing: 0.05em;
}
.pro-header h2 {
    font-size: 38px;
    font-weight: 800;
    color: #0f172a; /* Slate-900 */
    margin: 0 0 16px 0;
    line-height: 1.3;
}
.pro-header p {
    font-size: 18px;
    color: #64748b; /* Slate-500 */
    margin: 0;
}

/* 2. 이슈 & 솔루션 섹션 (좌우 배치 or 상하 배치) */
.pro-section {
    margin-bottom: 80px;
}
.issue-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 10px 40px -10px rgba(0,0,0,0.05);
}
.issue-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 20px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 20px;
}
.issue-title i {
    color: #ef4444; /* 이슈 강조 레드 */
    font-size: 24px;
}
.issue-text {
    font-size: 16px;
    margin-bottom: 24px;
    word-break: keep-all;
}
.issue-text strong {
    color: #0f172a;
    font-weight: 700;
    background: linear-gradient(180deg, rgba(255,255,255,0) 60%, #fecaca 60%); /* 형광펜 효과 */
}

/* 솔루션 강조 영역 */
.solution-card {
    margin-top: 30px;
    background: #1459d8; /* 메인 블루 */
    color: #fff;
    border-radius: 16px;
    padding: 30px;
    display: flex;
    align-items: center;
    gap: 24px;
    box-shadow: 0 20px 25px -5px rgba(20, 89, 216, 0.3);
}
.sol-icon-circle {
    width: 60px;
    height: 60px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    flex-shrink: 0;
}
.sol-text h4 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 6px 0;
    color: #fff;
}
.sol-text p {
    font-size: 16px;
    margin: 0;
    opacity: 0.9;
    font-weight: 300;
}

/* 3. 정보 그리드 (3단) */
.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.info-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 32px;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.info-card:hover {
    transform: translateY(-5px);
    border-color: #1459d8;
    box-shadow: 0 20px 40px -5px rgba(0,0,0,0.08);
}
.icon-box {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    margin-bottom: 24px;
}
/* 카드별 아이콘 색상 테마 */
.theme-1 { background: #eff6ff; color: #2563eb; } /* 블루 */
.theme-2 { background: #f0fdf4; color: #16a34a; } /* 그린 */
.theme-3 { background: #fff7ed; color: #ea580c; } /* 오렌지 */

.info-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 16px 0;
}
.check-list {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}
.check-list li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 12px;
    font-size: 15px;
    color: #475569;
}
.check-list li:last-child { margin-bottom: 0; }
.check-list li::before {
    content: '\f00c'; /* FontAwesome Check */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 12px;
    color: #1459d8; /* 체크 아이콘 색상 */
}
.sub-desc {
    display: block;
    font-size: 13px;
    color: #94a3b8;
    margin-top: 2px;
}

/* 4. 하단 CTA (Call to Action) */
.pro-footer {
    text-align: center;
    margin-top: 60px;
    padding: 40px;
    background: #f8fafc;
    border-radius: 24px;
}
.pro-footer p {
    font-size: 16px;
    color: #64748b;
    margin-bottom: 12px;
}
.contact-number {
    font-size: 32px;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: center;
    gap: 12px;
}
.contact-number i {
    color: #1459d8;
}

/* 반응형 */
@media (max-width: 768px) {
    .pro-header h2 { font-size: 28px; }
    .info-grid { grid-template-columns: 1fr; }
    .solution-card { flex-direction: column; text-align: center; }
    .issue-box { padding: 24px; }
}


/* [사회복지사 2급 페이지 전용 스타일] */
/* 폰트 및 아이콘 로드 */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

.os-clean-section {
    font-family: 'Pretendard', sans-serif;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: #f9fafb; /* 전체 배경색 */
    box-sizing: border-box;
}

.os-clean-section * {
    box-sizing: border-box;
}

/* --- 공통 레이아웃 래퍼 (최대 폭 제한 및 중앙 정렬) --- */
.os-content-max {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* --- 상단 헤더 영역 --- */
.os-clean-header {
    background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%); /* 진한 네이비 블루 */
    color: #ffffff;
    padding: 60px 0 80px; /* 위아래 여백 넉넉히 */
    text-align: center;
    border-bottom-left-radius: 40px;  /* 왼쪽 아래 둥글게 */
    border-bottom-right-radius: 40px; /* 오른쪽 아래 둥글게 */
}

.os-tag {
    display: inline-block;
    background-color: rgba(255,255,255,0.15);
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.9rem;
    margin-bottom: 20px;
    border: 1px solid rgba(255,255,255,0.2);
}

.os-main-title {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 20px 0;
}

.os-highlight {
    color: #ffd700; /* 황금색 강조 */
}

.os-sub-text {
    font-size: 1.05rem;
    opacity: 0.9;
    line-height: 1.6;
    font-weight: 300;
    margin: 0;
}

/* --- 하단 카드 영역 --- */
.os-clean-body {
    padding: 50px 0 80px; /* 헤더와 카드 사이 간격 확보 */
}

.os-card-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 모바일: 2칸씩 */
    gap: 15px;
}

/* 개별 카드 디자인 */
.os-box {
    background-color: #ffffff;
    border-radius: 12px;
    padding: 25px 20px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05); /* 연한 그림자 */
    border: 1px solid #eeeeee;
    transition: transform 0.3s, border-color 0.3s;
}

.os-box:hover {
    transform: translateY(-5px);
    border-color: #3b82f6; /* 호버 시 파란 테두리 */
}

.os-ico {
    font-size: 2rem;
    color: #1e3a8a;
    margin-bottom: 15px;
}

.os-box:hover .os-ico {
    color: #3b82f6;
}

.os-box h4 {
    margin: 0 0 10px 0;
    font-size: 1.1rem;
    color: #333;
}

.os-box p {
    margin: 0;
    font-size: 0.9rem;
    color: #666;
    line-height: 1.4;
    word-break: keep-all; /* 단어 단위 줄바꿈 */
}

/* --- 버튼 영역 --- */
.os-btn-area {
    margin-top: 50px;
    text-align: center;
}

.os-big-btn {
    display: inline-block;
    background-color: #e65100; /* 오렌지색 포인트 */
    color: white;
    padding: 18px 40px;
    font-size: 1.1rem;
    font-weight: bold;
    border-radius: 50px;
    text-decoration: none;
    box-shadow: 0 10px 20px rgba(230, 81, 0, 0.2);
    transition: background-color 0.3s;
}

.os-big-btn:hover {
    background-color: #c44400;
}

.pc-br { display: block; } /* 모바일에서 줄바꿈 */

/* --- PC 해상도 대응 (992px 이상) --- */
@media screen and (min-width: 992px) {
    .os-clean-header {
        padding: 80px 0 100px;
        border-bottom-left-radius: 60px;
        border-bottom-right-radius: 60px;
    }

    .os-main-title {
        font-size: 3rem; /* PC 폰트 크기 키움 */
        margin-bottom: 20px;
    }

    .os-sub-text {
        font-size: 1.25rem;
    }
    
    .pc-br { display: none; } /* PC에선 한 줄로 */

    .os-clean-body {
        padding-top: 60px;
    }

    .os-card-list {
        grid-template-columns: repeat(4, 1fr); /* PC: 4칸씩 */
        gap: 25px;
    }

    .os-box {
        padding: 35px 20px;
    }
}


/* 학점은행제 */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

.os-premium-section {
    font-family: 'Pretendard', sans-serif;
    width: 100%;
    margin: 0 auto;
    background-color: #f8f9fc; /* 전체 배경 아주 연한 블루그레이 */
    box-sizing: border-box;
}

.os-premium-section * {
    box-sizing: border-box;
}

/* --- 상단 헤더 (히어로 섹션) --- */
.os-hero-banner {
    background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%); /* 로얄 블루 그라데이션 */
    color: white;
    padding: 60px 20px 80px; /* 하단 패딩을 넉넉히 주어 여유 확보 */
    text-align: center;
    position: relative;
    border-radius: 0 0 30px 30px; /* 하단 둥글게 */
}

.os-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.2);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 20px;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.os-title {
    font-size: 2rem; /* 모바일 기준 */
    font-weight: 800;
    line-height: 1.3;
    margin: 0 0 15px 0;
}

.highlight-text {
    color: #ffd700; /* 골드 컬러 포인트 */
}

.os-desc {
    font-size: 1rem;
    opacity: 0.9;
    font-weight: 400;
    line-height: 1.6;
    margin: 0;
}

/* --- 콘텐츠 그리드 영역 --- */
.os-grid-container {
    padding: 0 20px 60px;
    margin-top: -40px; /* 헤더 영역 위로 살짝 올라가게 겹침 효과 */
}

.os-grid-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 모바일: 2열 */
    gap: 15px;
    max-width: 1200px;
    margin: 0 auto;
}

/* 카드 디자인 */
.os-card {
    background: white;
    padding: 24px 20px;
    border-radius: 16px;
    text-align: center;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08); /* 부드러운 그림자 */
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.03);
}

.os-card:hover {
    transform: translateY(-5px); /* 호버 시 위로 둥둥 */
    box-shadow: 0 15px 35px rgba(37, 99, 235, 0.15); /* 파란 그림자 */
    border-color: #2563eb;
}

.os-icon-box {
    width: 50px;
    height: 50px;
    background-color: #eff6ff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 16px;
    color: #2563eb;
    font-size: 1.4rem;
    transition: all 0.3s;
}

.os-card:hover .os-icon-box {
    background-color: #2563eb;
    color: white;
}

.os-card-content h4 {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 8px 0;
}

.os-card-content p {
    font-size: 0.85rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.4;
    word-break: keep-all;
}

/* --- 버튼 영역 --- */
.os-cta-wrapper {
    text-align: center;
    margin-top: 40px;
}

.os-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: #111827; /* 진한 블랙네이비 */
    color: white;
    padding: 18px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 1.1rem;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transition: transform 0.2s, background-color 0.2s;
}

.os-cta-btn:hover {
    background-color: #2563eb; /* 호버시 블루로 변경 */
    transform: scale(1.03);
}

.pc-hide { display: block; } /* 모바일에서 줄바꿈 허용 */

/* --- PC / 태블릿 대응 (미디어쿼리) --- */
@media screen and (min-width: 992px) {
    /* 헤더 PC 스타일 */
    .os-hero-banner {
        padding: 80px 20px 100px;
        border-radius: 0; /* PC에선 꽉 차게 */
    }

    .os-title {
        font-size: 3rem; /* 폰트 대폭 확대 */
        margin-bottom: 20px;
    }

    .os-desc {
        font-size: 1.2rem;
    }

    .pc-hide { display: none; } /* PC에서 불필요한 줄바꿈 제거 */

    /* 그리드 PC 스타일 (4열) */
    .os-grid-wrapper {
        grid-template-columns: repeat(4, 1fr); /* 4열 배치 */
        gap: 25px;
    }

    .os-grid-container {
        margin-top: -60px; /* 더 많이 겹치게 */
    }

    .os-card {
        padding: 30px 20px;
    }
}


/* [사회복지사 2급 페이지 스타일] */
.sw-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155; /* Slate-700 */
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 */
.sw-banner {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); /* 짙은 네이비 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.15);
    position: relative;
    overflow: hidden;
}
.sw-banner::before {
    content: '';
    position: absolute;
    top: -50px; right: -50px;
    width: 200px; height: 200px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
}
.sw-banner .badge {
    display: inline-block;
    background: #1459d8;
    padding: 6px 16px;
    border-radius: 100px;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 16px;
    color: #fff;
}
.sw-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.sw-banner p {
    font-size: 18px;
    color: #94a3b8;
    margin: 0;
}

/* 2. 섹션 공통 */
.sw-section { margin-bottom: 70px; }
.sw-title {
    font-size: 24px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
    border-left: 5px solid #1459d8;
    padding-left: 20px;
}

/* 3. 정의 박스 */
.def-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}
.def-text { font-size: 16px; margin-bottom: 10px; color: #475569; word-break: keep-all; }
.def-text:last-child { margin-bottom: 0; }
.def-text strong { color: #1459d8; font-weight: 700; }
.def-sub {
    font-size: 14px;
    color: #64748b;
    background: #f8fafc;
    padding: 15px;
    border-radius: 8px;
    margin-top: 15px;
}

/* 4. 주요 업무 리스트 */
.duty-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
}
.duty-item {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    gap: 20px;
    transition: 0.3s;
}
.duty-item:hover { border-color: #1459d8; box-shadow: 0 5px 15px rgba(0,0,0,0.05); }
.duty-icon {
    width: 50px;
    height: 50px;
    background: #eff6ff;
    color: #1459d8;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
}
.duty-content h4 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: #1e293b;
}
.duty-list {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 15px;
    color: #475569;
}
.duty-list li {
    margin-bottom: 6px;
    padding-left: 16px;
    position: relative;
    word-break: keep-all;
}
.duty-list li::before {
    content: '-';
    position: absolute;
    left: 0;
    color: #94a3b8;
}

/* 5. 자격요건 & 개정법 비교 테이블 */
.req-info {
    background: #f0fdf4; /* 연한 초록 배경 */
    border: 1px solid #bbf7d0;
    color: #166534;
    padding: 20px;
    border-radius: 12px;
    margin-bottom: 30px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 12px;
}
.req-info i { font-size: 20px; }

.compare-box {
    overflow-x: auto; /* 모바일 스크롤 */
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}
.sw-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    min-width: 700px; /* 테이블 최소 너비 */
}
.sw-table th {
    padding: 24px;
    font-size: 17px;
    font-weight: 700;
    background: #f8fafc;
    color: #475569;
    border-bottom: 2px solid #e2e8f0;
    text-align: center;
}
/* 현재 기준(개정 후) 강조 */
.sw-table th.current {
    background: #1459d8;
    color: #fff;
    border-bottom: 2px solid #0f172a;
    position: relative;
}
.sw-table th.current .tag {
    display: inline-block;
    background: #fbbf24;
    color: #000;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
    margin-left: 8px;
    vertical-align: middle;
    font-weight: 800;
}

.sw-table td {
    padding: 30px;
    border-bottom: 1px solid #e2e8f0;
    font-size: 16px;
    vertical-align: middle;
    text-align: center;
    color: #334155;
    line-height: 1.6;
}
.sw-table tr:last-child td { border-bottom: none; }
.sw-table td:first-child { background: #fcfcfc; border-right: 1px dashed #e2e8f0; color: #94a3b8; } /* 이전 법 */
.sw-table td:last-child { background: #fff; font-weight: 600; color: #0f172a; } /* 개정 후 */

/* 강조 텍스트 */
.point-blue { color: #1459d8; font-weight: 800; font-size: 20px; }
.sub-txt { display: block; font-size: 14px; color: #64748b; margin-top: 6px; font-weight: 400; }

/* 6. 하단 안내 */
.sw-footer {
    background: #f8fafc;
    border-radius: 16px;
    padding: 30px;
    text-align: center;
    margin-top: 50px;
}
.sw-footer p { font-size: 16px; color: #475569; margin: 0 0 10px 0; }
.tel-box {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 28px;
    font-weight: 800;
    color: #0f172a;
}
.tel-box i { color: #1459d8; }

/* 반응형 */
@media (max-width: 768px) {
    .sw-banner h2 { font-size: 26px; }
    .sw-table th, .sw-table td { padding: 15px 10px; font-size: 14px; }
    .point-blue { font-size: 16px; }
    .duty-item { flex-direction: column; gap: 15px; }
    .duty-icon { margin: 0 auto; }
    .duty-content { text-align: center; }
    .duty-list li { text-align: left; display: inline-block; }
}


@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

.os-full-guide {
    font-family: 'Pretendard', sans-serif;
    width: 100%;
    background-color: #fff;
    color: #333;
    line-height: 1.6;
}
.os-full-guide * { box-sizing: border-box; }
.os-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* 1. 히어로 섹션 */
.os-hero-section {
    background: linear-gradient(135deg, #1a2b4c 0%, #2a4b8d 100%);
    color: #fff;
    padding: 80px 0 60px;
    text-align: center;
}
.os-hero-badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
    padding: 6px 16px;
    border-radius: 30px;
    font-size: 0.9rem;
    margin-bottom: 20px;
}
.os-hero-title {
    font-size: 2rem;
    font-weight: 800;
    margin: 0 0 20px 0;
    line-height: 1.3;
}
.os-highlight { color: #ffd700; }
.os-hero-desc {
    font-size: 1.05rem;
    opacity: 0.85;
    font-weight: 300;
}

/* 2. 정의 섹션 (긴 텍스트 디자인) */
.os-definition-section {
    padding: 60px 0;
    background-color: #f8f9fa;
}
.os-def-box {
    background: #fff;
    border-radius: 16px;
    padding: 40px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border-left: 6px solid #1a2b4c; /* 포인트 컬러 바 */
}
.os-section-header {
    font-size: 1.5rem;
    color: #1a2b4c;
    margin: 0 0 20px 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.os-section-header i { color: #cbd5e1; } /* 따옴표 아이콘 연하게 */

.os-def-content p {
    margin: 0;
    font-size: 1.05rem;
    color: #4b5563;
    text-align: justify; /* 양쪽 정렬로 단정하게 */
    word-break: keep-all;
}
.os-def-content strong {
    color: #1a2b4c;
    font-weight: 700;
    background: linear-gradient(to top, #e0e7ff 40%, transparent 40%); /* 형광펜 효과 */
}
.os-divider {
    border: 0;
    height: 1px;
    background: #e5e7eb;
    margin: 20px 0;
}

/* 3. 프로세스 섹션 */
.os-process-section {
    padding: 80px 0;
    background-color: #fff;
}
.os-section-title {
    text-align: center;
    font-size: 1.8rem;
    color: #111;
    font-weight: 800;
    margin: 0 0 10px 0;
}
.os-section-desc {
    text-align: center;
    color: #666;
    margin-bottom: 50px;
}

.os-process-flow {
    display: flex;
    flex-direction: column; /* 모바일 세로 */
    gap: 20px;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
}
.os-step-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 25px;
    width: 100%;
    max-width: 240px;
    text-align: center;
    position: relative;
    box-shadow: 0 4px 10px rgba(0,0,0,0.03);
    transition: all 0.3s;
}
.os-step-card.active { border-color: #2563eb; background-color: #eff6ff; }
.os-step-card.final { background-color: #1a2b4c; color: white; border-color: #1a2b4c; }

.os-step-num {
    font-size: 0.9rem;
    font-weight: 800;
    color: #cbd5e1;
    margin-bottom: 10px;
}
.os-step-card.final .os-step-num { color: rgba(255,255,255,0.3); }

.os-step-icon { font-size: 2.5rem; color: #1a2b4c; margin-bottom: 15px; }
.os-step-card.active .os-step-icon { color: #2563eb; }
.os-step-card.final .os-step-icon { color: #ffd700; }

.os-step-txt { font-size: 1rem; line-height: 1.3; }

.os-arrow {
    color: #cbd5e1;
    font-size: 1.5rem;
    transform: rotate(90deg); /* 모바일: 아래 화살표 */
}

/* 4. 타겟 섹션 */
.os-target-section {
    padding: 80px 0 100px;
    background-color: #f8f9fa;
}
.os-grid-8 {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 모바일 2열 */
    gap: 12px;
    margin-top: 40px;
}
.os-item-box {
    background: #fff;
    padding: 20px 15px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    transition: transform 0.2s;
}
.os-item-box:hover { transform: translateY(-5px); }
.icon-wrap {
    font-size: 2rem;
    color: #e65100;
    margin-bottom: 10px;
}
.os-item-box h4 {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 5px 0;
    color: #333;
}
.os-item-box span {
    font-size: 0.85rem;
    color: #666;
    line-height: 1.3;
    display: block;
}

/* CTA 버튼 */
.os-action-area { text-align: center; margin-top: 60px; }
.os-main-btn {
    display: inline-block;
    background-color: #e65100;
    color: #fff;
    padding: 20px 50px;
    font-size: 1.2rem;
    font-weight: 700;
    border-radius: 50px;
    text-decoration: none;
    box-shadow: 0 10px 20px rgba(230,81,0,0.2);
    transition: 0.3s;
}
.os-main-btn:hover { background-color: #d84a00; transform: scale(1.02); }

.pc-only { display: none; }

/* PC 반응형 (992px 이상) */
@media screen and (min-width: 992px) {
    .os-hero-title { font-size: 3rem; }
    .pc-only { display: block; }
    
    /* 정의 박스 PC */
    .os-def-box { padding: 50px 60px; }
    .os-def-content p { font-size: 1.15rem; line-height: 1.8; }
    
    /* 프로세스 가로 배치 */
    .os-process-flow { flex-direction: row; gap: 10px; }
    .os-arrow { transform: rotate(0deg); margin: 0 15px; } /* 오른쪽 화살표 */
    
    /* 타겟 4열 배치 */
    .os-grid-8 {
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
    }
    .os-item-box { padding: 30px 20px; }
}


/* [학점은행제 안내 페이지 스타일] */
.cb-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155;
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 */
.cb-banner {
    background: linear-gradient(135deg, #1e3a8a 0%, #172554 100%); /* 로얄 블루 계열 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(30, 58, 138, 0.2);
}
.cb-banner .badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,0.2);
}
.cb-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.cb-banner p {
    font-size: 18px;
    opacity: 0.9;
    margin: 0;
    font-weight: 300;
}

/* 2. 섹션 공통 */
.cb-section { margin-bottom: 80px; }
.cb-title {
    font-size: 24px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.cb-title::before {
    content: '';
    display: block;
    width: 5px;
    height: 24px;
    background: #1459d8;
    border-radius: 2px;
}

/* 3. 정의 박스 */
.cb-def-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 40px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    display: flex;
    gap: 30px;
    align-items: center;
}
.cb-def-icon {
    font-size: 60px;
    color: #1459d8;
    flex-shrink: 0;
}
.cb-def-content h4 {
    margin: 0 0 10px 0;
    font-size: 20px;
    font-weight: 700;
    color: #1e293b;
}
.cb-def-content p {
    margin: 0;
    font-size: 16px;
    color: #475569;
}

/* 4. 이용 대상 (그리드) */
.target-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.target-item {
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 25px 20px;
    text-align: center;
    transition: 0.3s;
}
.target-item:hover {
    background: #fff;
    border-color: #1459d8;
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
    transform: translateY(-5px);
}
.target-icon {
    width: 50px;
    height: 50px;
    background: #eff6ff;
    color: #1459d8;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    margin: 0 auto 15px;
}
.target-item p {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #334155;
    word-break: keep-all;
}

/* 5. 학위요건 (비교 카드) */
.degree-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}
.degree-card {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 20px;
    overflow: hidden;
}
.degree-head {
    padding: 20px;
    text-align: center;
    background: #f1f5f9;
    border-bottom: 1px solid #cbd5e1;
}
.degree-head h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
}
.degree-body {
    padding: 30px;
}
.credit-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.credit-list li {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #e2e8f0;
    font-size: 15px;
}
.credit-list li:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.credit-list span.label { color: #64748b; }
.credit-list span.val { font-weight: 700; color: #1459d8; }
.total-score {
    margin-top: 20px;
    text-align: center;
    background: #1459d8;
    color: #fff;
    padding: 10px;
    border-radius: 8px;
    font-weight: 700;
}

/* 6. 하단 포스터 (학위취득 절차) */
.process-poster {
    background: #0f172a; /* 짙은 배경 */
    border-radius: 24px;
    padding: 50px 30px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.poster-title {
    font-size: 30px;
    font-weight: 800;
    margin-bottom: 40px;
    color: #fff;
}
.poster-title span { color: #facc15; } /* 강조 노랑 */

.process-steps {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
}
.step-item {
    flex: 1;
    min-width: 140px;
    max-width: 180px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 16px;
    padding: 25px 15px;
    position: relative;
    backdrop-filter: blur(5px);
    transition: 0.3s;
}
.step-item:hover {
    background: #fff;
    transform: translateY(-5px);
}
.step-item:hover h4, .step-item:hover p { color: #0f172a; }
.step-item:hover .step-num { background: #1459d8; color: #fff; border-color: #1459d8; }

.step-num {
    width: 32px;
    height: 32px;
    border: 2px solid rgba(255,255,255,0.3);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    font-weight: 700;
    font-size: 14px;
    color: rgba(255,255,255,0.8);
    transition: 0.3s;
}
.step-item h4 {
    font-size: 17px;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: #fff;
}
.step-item p {
    font-size: 13px;
    margin: 0;
    color: rgba(255,255,255,0.7);
    line-height: 1.4;
}

/* 화살표 (Desktop only) */
.step-item:not(:last-child)::after {
    content: '\f054'; /* FontAwesome Chevron Right */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    right: -18px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255,255,255,0.2);
    font-size: 18px;
}

/* 반응형 */
@media (max-width: 768px) {
    .cb-banner h2 { font-size: 26px; }
    .cb-def-box { flex-direction: column; text-align: center; gap: 20px; }
    .target-grid { grid-template-columns: repeat(2, 1fr); }
    .degree-wrap { grid-template-columns: 1fr; }
    
    .process-steps { flex-direction: column; align-items: center; gap: 30px; }
    .step-item { width: 100%; max-width: 100%; }
    .step-item:not(:last-child)::after {
        content: '\f078'; /* 아래 화살표 */
        right: 50%;
        top: auto;
        bottom: -25px;
        transform: translateX(50%);
    }
}




/* [고용보험환급과정 페이지 스타일] */
.refund-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155;
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 */
.refund-banner {
    background: linear-gradient(135deg, #0f766e 0%, #115e59 100%); /* 틸(Teal) 계열 - 신뢰/성장 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(15, 118, 110, 0.2);
    position: relative;
    overflow: hidden;
}
/* 배경 패턴 효과 */
.refund-banner::after {
    content: '';
    position: absolute;
    bottom: -30px; left: -30px;
    width: 150px; height: 150px;
    border: 20px solid rgba(255,255,255,0.05);
    border-radius: 50%;
}
.refund-banner .badge {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,0.3);
}
.refund-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.refund-banner p {
    font-size: 18px;
    opacity: 0.9;
    margin: 0 0 30px 0;
    font-weight: 300;
}
/* 바로가기 버튼 */
.btn-link-go {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: #0f766e;
    padding: 14px 32px;
    border-radius: 100px;
    font-size: 16px;
    font-weight: 700;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    text-decoration: none;
}
.btn-link-go:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    background: #f0fdfa; /* 아주 연한 틸 배경 */
}

/* 2. 섹션 공통 */
.rf-section { margin-bottom: 80px; }
.rf-title {
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
}
.rf-title::after {
    content: '';
    display: block;
    width: 40px;
    height: 4px;
    background: #0f766e;
    margin: 10px auto 0;
    border-radius: 2px;
}

/* 3. 하단 포스터 (정보 박스) */
.poster-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 50px 40px;
    box-shadow: 0 10px 40px -10px rgba(0,0,0,0.05);
}

/* 3-1. 취지 (인트로) */
.intro-area {
    margin-bottom: 50px;
    padding-bottom: 40px;
    border-bottom: 1px dashed #cbd5e1;
}
.intro-head {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 20px;
    font-weight: 700;
    color: #0f766e;
    margin-bottom: 20px;
}
.intro-text {
    font-size: 16px;
    color: #475569;
    line-height: 1.8;
    word-break: keep-all;
}
.intro-text strong {
    color: #0f172a;
    font-weight: 700;
    background: linear-gradient(180deg, rgba(255,255,255,0) 60%, #ccfbf1 60%); /* 형광펜 효과 */
}

/* 3-2. 모집요강 그리드 (3단) */
.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.info-card {
    background: #f8fafc;
    border-radius: 16px;
    padding: 30px;
    border: 1px solid #f1f5f9;
    transition: 0.3s;
    height: 100%;
}
.info-card:hover {
    background: #fff;
    border-color: #0f766e;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05);
    transform: translateY(-5px);
}
.card-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 15px;
}
.card-head i {
    color: #0f766e;
    font-size: 22px;
}
.card-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.card-list li {
    font-size: 15px;
    color: #475569;
    margin-bottom: 12px;
    padding-left: 20px;
    position: relative;
    word-break: keep-all;
}
.card-list li:last-child { margin-bottom: 0; }
.card-list li::before {
    content: '\f00c'; /* FontAwesome Check */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 3px;
    font-size: 12px;
    color: #0f766e;
}
.card-list li strong {
    color: #0f172a;
    font-weight: 600;
}

/* 반응형 */
@media (max-width: 768px) {
    .refund-banner h2 { font-size: 28px; }
    .btn-link-go { width: 100%; justify-content: center; }
    .poster-box { padding: 30px 20px; }
    .info-grid { grid-template-columns: 1fr; gap: 20px; }
    .intro-text { font-size: 15px; }
}



/* [고용보험환급과정 & 회원특전 페이지 스타일] */
.refund-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155;
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 (메인 블루 톤 적용) */
.refund-banner {
    background: linear-gradient(135deg, #1e3a8a 0%, #172554 100%); /* 로얄 블루/네이비 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(30, 58, 138, 0.2);
    position: relative;
    overflow: hidden;
}
.refund-banner::after {
    content: '';
    position: absolute;
    bottom: -30px; left: -30px;
    width: 150px; height: 150px;
    border: 20px solid rgba(255,255,255,0.05);
    border-radius: 50%;
}
.refund-banner .badge {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,0.3);
}
.refund-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.refund-banner p {
    font-size: 18px;
    opacity: 0.9;
    margin: 0 0 30px 0;
    font-weight: 300;
}
/* 바로가기 버튼 (화이트 & 블루) */
.btn-link-go {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: #1459d8; /* 메인 블루 */
    padding: 14px 32px;
    border-radius: 100px;
    font-size: 16px;
    font-weight: 700;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    text-decoration: none;
}
.btn-link-go:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    background: #eff6ff;
}

/* 2. 섹션 공통 */
.rf-section { margin-bottom: 80px; }
.rf-title {
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
}
.rf-title::after {
    content: '';
    display: block;
    width: 40px;
    height: 4px;
    background: #1459d8;
    margin: 10px auto 0;
    border-radius: 2px;
}

/* 3. 중간 정보 박스 */
.poster-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 50px 40px;
    box-shadow: 0 10px 40px -10px rgba(0,0,0,0.05);
}
.intro-area {
    margin-bottom: 50px;
    padding-bottom: 40px;
    border-bottom: 1px dashed #cbd5e1;
}
.intro-head {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 20px;
    font-weight: 700;
    color: #1459d8;
    margin-bottom: 20px;
}
.intro-text {
    font-size: 16px;
    color: #475569;
    line-height: 1.8;
    word-break: keep-all;
}
.intro-text strong {
    color: #0f172a;
    font-weight: 700;
    background: linear-gradient(180deg, rgba(255,255,255,0) 60%, #bfdbfe 60%); /* 블루 형광펜 */
}

/* 그리드 시스템 */
.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.info-card {
    background: #f8fafc;
    border-radius: 16px;
    padding: 30px;
    border: 1px solid #f1f5f9;
    transition: 0.3s;
    height: 100%;
}
.info-card:hover {
    background: #fff;
    border-color: #1459d8;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05);
    transform: translateY(-5px);
}
.card-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 15px;
}
.card-head i { color: #1459d8; font-size: 22px; }
.card-list { list-style: none; margin: 0; padding: 0; }
.card-list li {
    font-size: 15px; color: #475569; margin-bottom: 12px; padding-left: 20px; position: relative; word-break: keep-all;
}
.card-list li:last-child { margin-bottom: 0; }
.card-list li::before {
    content: '\f00c'; font-family: 'Font Awesome 6 Free'; font-weight: 900;
    position: absolute; left: 0; top: 3px; font-size: 12px; color: #1459d8;
}
.card-list li strong { color: #0f172a; font-weight: 600; }

/* 4. [NEW] 회원 특전 포스터 스타일 */
.benefit-poster {
    background: #0f172a; /* 다크 네이비 배경 */
    border-radius: 24px;
    padding: 60px 40px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
    margin-top: 80px;
}
/* 포스터 장식 효과 */
.benefit-poster::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 6px;
    background: linear-gradient(90deg, #1459d8, #60a5fa, #1459d8);
}
.benefit-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 50px;
    color: #fff;
    display: inline-block;
    position: relative;
    padding: 0 20px;
}
.benefit-title i { color: #facc15; margin: 0 10px; font-size: 24px; vertical-align: middle; } /* 금색 아이콘 */

.benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.benefit-item {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 16px;
    padding: 30px 20px;
    transition: 0.3s;
    backdrop-filter: blur(10px);
}
.benefit-item:hover {
    background: rgba(255,255,255,0.15);
    transform: translateY(-5px);
    border-color: rgba(255,255,255,0.3);
}
.benefit-icon {
    width: 60px; height: 60px;
    background: linear-gradient(135deg, #facc15 0%, #ca8a04 100%); /* 골드 그라데이션 */
    color: #0f172a;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin: 0 auto 20px;
    box-shadow: 0 0 20px rgba(250, 204, 21, 0.3);
}
.benefit-txt {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    color: #f1f5f9;
    word-break: keep-all;
}
.benefit-txt strong {
    display: block;
    color: #facc15; /* 골드 텍스트 */
    font-size: 20px;
    margin-bottom: 8px;
    font-weight: 800;
}

/* 반응형 */
@media (max-width: 1024px) {
    .benefit-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .refund-banner h2 { font-size: 28px; }
    .btn-link-go { width: 100%; justify-content: center; }
    .poster-box { padding: 30px 20px; }
    .info-grid { grid-template-columns: 1fr; gap: 20px; }
    .benefit-poster { padding: 40px 20px; }
    .benefit-grid { grid-template-columns: 1fr; }
    .benefit-title { font-size: 26px; }
}




/* [기업체 산업안전교육 & 회원특전 페이지 스타일] */
.safety-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155;
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 */
.safety-banner {
    background: linear-gradient(135deg, #1e40af 0%, #0f172a 100%); /* 인디고/다크네이비 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(30, 64, 175, 0.2);
    position: relative;
    overflow: hidden;
}
.safety-banner::before {
    content: '';
    position: absolute;
    top: -50%; right: -10%;
    width: 300px; height: 300px;
    background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 70%);
    border-radius: 50%;
}
.safety-banner .badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,0.2);
}
.safety-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.safety-banner p {
    font-size: 18px;
    opacity: 0.9;
    margin: 0 0 30px 0;
    font-weight: 300;
}

/* 바로가기 버튼 */
.btn-link-alpha {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: #1e40af; /* 인디고 블루 */
    padding: 14px 32px;
    border-radius: 100px;
    font-size: 16px;
    font-weight: 700;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    text-decoration: none;
}
.btn-link-alpha:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    background: #f8fafc;
}

/* 2. 섹션 공통 */
.sf-section { margin-bottom: 80px; }
.sf-title {
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
}
.sf-title::after {
    content: '';
    display: block;
    width: 40px;
    height: 4px;
    background: #1459d8;
    margin: 10px auto 0;
    border-radius: 2px;
}

/* 3. 법정의무교육 소개 (카드 그리드) */
.law-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.law-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px;
    transition: 0.3s;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.law-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    border-color: #1459d8;
}
.law-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin-bottom: 20px;
}
/* 아이콘 배경색 테마 */
.th-blue { background: #eff6ff; color: #1d4ed8; }
.th-indigo { background: #e0e7ff; color: #4338ca; }
.th-teal { background: #ccfbf1; color: #0f766e; }
.th-orange { background: #ffedd5; color: #c2410c; }
.th-rose { background: #ffe4e6; color: #be123c; }

.law-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 10px 0;
}
.law-card p {
    font-size: 15px;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
    word-break: keep-all;
}

/* 4. 중대재해처벌법 강조 박스 */
.warning-box {
    background: #fff;
    border-left: 5px solid #ef4444; /* 경고 레드 */
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    margin-bottom: 50px;
    display: flex;
    align-items: center;
    gap: 20px;
}
.warn-icon {
    font-size: 40px;
    color: #ef4444;
    flex-shrink: 0;
}
.warn-text h4 {
    margin: 0 0 5px 0;
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
}
.warn-text p {
    margin: 0;
    font-size: 16px;
    color: #334155;
}

/* 5. [회원 특전 포스터 스타일] - 재사용성을 위해 클래스 유지 */
.benefit-poster {
    background: #0f172a; /* 다크 네이비 배경 */
    border-radius: 24px;
    padding: 60px 40px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
    margin-top: 80px;
}
.benefit-poster::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 6px;
    background: linear-gradient(90deg, #1459d8, #60a5fa, #1459d8);
}
.benefit-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 50px;
    color: #fff;
    display: inline-block;
    position: relative;
    padding: 0 20px;
}
.benefit-title i { color: #facc15; margin: 0 10px; font-size: 24px; vertical-align: middle; }

.benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.benefit-item {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 16px;
    padding: 30px 20px;
    transition: 0.3s;
    backdrop-filter: blur(10px);
}
.benefit-item:hover {
    background: rgba(255,255,255,0.15);
    transform: translateY(-5px);
    border-color: rgba(255,255,255,0.3);
}
.benefit-icon {
    width: 60px; height: 60px;
    background: linear-gradient(135deg, #facc15 0%, #ca8a04 100%); /* 골드 */
    color: #0f172a;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin: 0 auto 20px;
    box-shadow: 0 0 20px rgba(250, 204, 21, 0.3);
}
.benefit-txt {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    color: #f1f5f9;
    word-break: keep-all;
}
.benefit-txt strong {
    display: block;
    color: #facc15;
    font-size: 20px;
    margin-bottom: 8px;
    font-weight: 800;
}

/* 반응형 */
@media (max-width: 1024px) {
    .law-grid { grid-template-columns: repeat(2, 1fr); }
    .benefit-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .safety-banner h2 { font-size: 28px; }
    .btn-link-alpha { width: 100%; justify-content: center; }
    .law-grid { grid-template-columns: 1fr; }
    .warning-box { flex-direction: column; text-align: center; }
    .benefit-poster { padding: 40px 20px; }
    .benefit-grid { grid-template-columns: 1fr; }
}


/* [기업체 산업안전교육 & 회원특전 페이지 스타일] */
.safety-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155;
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 */
.safety-banner {
    background: linear-gradient(135deg, #1e40af 0%, #0f172a 100%); /* 인디고/다크네이비 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(30, 64, 175, 0.2);
    position: relative;
    overflow: hidden;
}
.safety-banner::before {
    content: '';
    position: absolute;
    top: -50%; right: -10%;
    width: 300px; height: 300px;
    background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 70%);
    border-radius: 50%;
}
.safety-banner .badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,0.2);
}
.safety-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.safety-banner p {
    font-size: 18px;
    opacity: 0.9;
    margin: 0 0 30px 0;
    font-weight: 300;
}

/* 바로가기 버튼 */
.btn-link-alpha {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: #1e40af; /* 인디고 블루 */
    padding: 14px 32px;
    border-radius: 100px;
    font-size: 16px;
    font-weight: 700;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    text-decoration: none;
}
.btn-link-alpha:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    background: #f8fafc;
}

/* 2. 섹션 공통 */
.sf-section { margin-bottom: 80px; }
.sf-title {
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
}
.sf-title::after {
    content: '';
    display: block;
    width: 40px;
    height: 4px;
    background: #1459d8;
    margin: 10px auto 0;
    border-radius: 2px;
}

/* 3. 법정의무교육 소개 (카드 그리드) */
.law-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.law-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px;
    transition: 0.3s;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.law-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    border-color: #1459d8;
}
.law-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin-bottom: 20px;
}
/* 아이콘 배경색 테마 (사이트 톤앤매너에 맞게 블루 계열 위주로 조정) */
.th-blue { background: #eff6ff; color: #1d4ed8; }
.th-indigo { background: #e0e7ff; color: #4338ca; }
.th-dark { background: #f1f5f9; color: #334155; }

.law-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 10px 0;
}
.law-card p {
    font-size: 15px;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
    word-break: keep-all;
}

/* 4. 중대재해처벌법 강조 박스 */
.warning-box {
    background: #fff;
    border-left: 5px solid #ef4444; /* 경고 레드 */
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    margin-bottom: 50px;
    display: flex;
    align-items: center;
    gap: 20px;
}
.warn-icon {
    font-size: 40px;
    color: #ef4444;
    flex-shrink: 0;
}
.warn-text h4 {
    margin: 0 0 5px 0;
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
}
.warn-text p {
    margin: 0;
    font-size: 16px;
    color: #334155;
}

/* 5. [회원 특전 포스터 스타일] */
.benefit-poster {
    background: #0f172a; /* 다크 네이비 배경 */
    border-radius: 24px;
    padding: 60px 40px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
    margin-top: 80px;
}
.benefit-poster::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 6px;
    background: linear-gradient(90deg, #1459d8, #60a5fa, #1459d8);
}
.benefit-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 50px;
    color: #fff;
    display: inline-block;
    position: relative;
    padding: 0 20px;
}
.benefit-title i { color: #facc15; margin: 0 10px; font-size: 24px; vertical-align: middle; }

.benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.benefit-item {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 16px;
    padding: 30px 20px;
    transition: 0.3s;
    backdrop-filter: blur(10px);
}
.benefit-item:hover {
    background: rgba(255,255,255,0.15);
    transform: translateY(-5px);
    border-color: rgba(255,255,255,0.3);
}
.benefit-icon {
    width: 60px; height: 60px;
    background: linear-gradient(135deg, #facc15 0%, #ca8a04 100%); /* 골드 */
    color: #0f172a;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin: 0 auto 20px;
    box-shadow: 0 0 20px rgba(250, 204, 21, 0.3);
}
.benefit-txt {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    color: #f1f5f9;
    word-break: keep-all;
}
.benefit-txt strong {
    display: block;
    color: #facc15;
    font-size: 20px;
    margin-bottom: 8px;
    font-weight: 800;
}

/* 반응형 */
@media (max-width: 1024px) {
    .law-grid { grid-template-columns: repeat(2, 1fr); }
    .benefit-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .safety-banner h2 { font-size: 28px; }
    .btn-link-alpha { width: 100%; justify-content: center; }
    .law-grid { grid-template-columns: 1fr; }
    .warning-box { flex-direction: column; text-align: center; }
    .benefit-poster { padding: 40px 20px; }
    .benefit-grid { grid-template-columns: 1fr; }
}

/* [민간자격증 과정 페이지 스타일] */
.cert-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
    color: #334155;
    line-height: 1.7;
    letter-spacing: -0.02em;
}

/* 1. 상단 배너 */
.cert-banner {
    background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); /* 밝은 로얄 블루 */
    color: #fff;
    padding: 60px 20px;
    text-align: center;
    border-radius: 20px;
    margin-bottom: 60px;
    box-shadow: 0 10px 30px rgba(37, 99, 235, 0.2);
    position: relative;
    overflow: hidden;
}
.cert-banner::after {
    content: '';
    position: absolute;
    top: -20px; left: -20px;
    width: 180px; height: 180px;
    border: 2px solid rgba(255,255,255,0.1);
    border-radius: 50%;
}
.cert-banner .badge {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    border: 1px solid rgba(255,255,255,0.3);
}
.cert-banner h2 {
    font-size: 36px;
    font-weight: 800;
    margin: 0 0 12px 0;
    line-height: 1.3;
}
.cert-banner p {
    font-size: 18px;
    opacity: 0.9;
    margin: 0;
    font-weight: 300;
}

/* 2. 과정 소개 박스 */
.cert-intro-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 40px;
    margin-bottom: 60px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    text-align: center;
}
.intro-title {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 16px;
}
.intro-title span { color: #1459d8; }
.intro-desc {
    font-size: 16px;
    color: #475569;
    max-width: 800px;
    margin: 0 auto;
    word-break: keep-all;
}

/* 3. 자격증 카테고리 그리드 */
.cate-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 80px;
}
.cate-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    transition: 0.3s;
    height: 100%;
}
.cate-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    border-color: #1459d8;
}
.cate-head {
    padding: 24px;
    color: #fff;
    text-align: center;
}
/* 헤더 색상 테마 */
.th-psy { background: linear-gradient(135deg, #8b5cf6, #6d28d9); } /* 심리: 보라 */
.th-child { background: linear-gradient(135deg, #10b981, #059669); } /* 아동: 그린 */
.th-pro { background: linear-gradient(135deg, #f59e0b, #d97706); } /* 실무: 오렌지 */

.cate-icon { font-size: 36px; margin-bottom: 10px; }
.cate-head h3 { font-size: 20px; font-weight: 700; margin: 0; }

.cate-body { padding: 24px; }
.course-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.course-list li {
    font-size: 15px;
    color: #334155;
    margin-bottom: 10px;
    padding-left: 20px;
    position: relative;
    border-bottom: 1px dashed #f1f5f9;
    padding-bottom: 10px;
}
.course-list li:last-child { border-bottom: none; margin-bottom: 0; }
.course-list li::before {
    content: '\f058'; /* Check Circle Icon */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900; /* Solid 스타일 */
    position: absolute;
    left: 0;
    top: 3px;
    color: #cbd5e1; /* 연한 회색 */
    font-size: 14px;
}
.cate-card:hover .course-list li::before { color: #1459d8; } /* 호버시 체크 활성화 */

/* 4. 자격 취득 절차 (가로 스텝) */
.step-wrap { margin-bottom: 80px; }
.step-title {
    font-size: 24px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 30px;
    text-align: center;
}
.step-list {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}
.step-box {
    flex: 1;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    position: relative;
}
.step-box strong {
    display: block;
    font-size: 18px;
    color: #1e293b;
    margin-bottom: 8px;
}
.step-box span {
    font-size: 14px;
    color: #64748b;
}
.step-num {
    width: 32px; height: 32px;
    background: #1459d8;
    color: #fff;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700;
    margin: 0 auto 15px;
}
/* 화살표 (PC) */
.step-box:not(:last-child)::after {
    content: '\f054';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: #cbd5e1;
    z-index: 1;
}

/* 5. 회원 특전 포스터 (재사용) */
.benefit-poster {
    background: #0f172a; /* 다크 네이비 */
    border-radius: 24px;
    padding: 60px 40px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.benefit-poster::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 6px;
    background: linear-gradient(90deg, #1459d8, #60a5fa, #1459d8);
}
.benefit-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 50px;
    color: #fff;
    display: inline-block;
    position: relative;
    padding: 0 20px;
}
.benefit-title i { color: #facc15; margin: 0 10px; font-size: 24px; vertical-align: middle; }

.benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.benefit-item {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 16px;
    padding: 30px 20px;
    transition: 0.3s;
    backdrop-filter: blur(10px);
}
.benefit-item:hover {
    background: rgba(255,255,255,0.15);
    transform: translateY(-5px);
    border-color: rgba(255,255,255,0.3);
}
.benefit-icon {
    width: 60px; height: 60px;
    background: linear-gradient(135deg, #facc15 0%, #ca8a04 100%); /* 골드 */
    color: #0f172a;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    margin: 0 auto 20px;
    box-shadow: 0 0 20px rgba(250, 204, 21, 0.3);
}
.benefit-txt {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    color: #f1f5f9;
    word-break: keep-all;
}
.benefit-txt strong {
    display: block;
    color: #facc15;
    font-size: 20px;
    margin-bottom: 8px;
    font-weight: 800;
}

/* 반응형 */
@media (max-width: 1024px) {
    .cate-grid { grid-template-columns: repeat(2, 1fr); }
    .benefit-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .cert-banner h2 { font-size: 28px; }
    .cate-grid { grid-template-columns: 1fr; }
    .step-list { flex-direction: column; gap: 40px; }
    .step-box:not(:last-child)::after {
        content: '\f078'; /* 아래 화살표 */
        right: 50%; top: auto; bottom: -30px;
        transform: translateX(50%);
    }
    .benefit-grid { grid-template-columns: 1fr; }
}