/* ===== Main Page Design Variables & Animations ===== */
:root {
    /* LMS 스타일 색상 팔레트 (자연스러운 에메랄드/녹색) */
    --lms-primary: #059669;
    --lms-primary-light: #10B981;
    --lms-primary-dark: #047857;
    --lms-secondary: #0891B2;
    --lms-secondary-light: #06B6D4;
    --lms-accent: #F59E0B;
    --lms-accent-light: #FBBF24;
    --lms-success: #059669;
    --lms-success-light: #10B981;
    --lms-bg: #F8FAFC;
    --lms-card: #FFFFFF;
    --lms-text: #1E293B;
    --lms-text-muted: #64748B;
    --lms-border: #E2E8F0;
    --lms-border-light: #F1F5F9;

    /* 기존 색상 (하위 호환성) */
    --cdec-primary: #059669;
    --cdec-primary-light: #10B981;
    --cdec-primary-dark: #047857;
    --cdec-accent: #F59E0B;
    --cdec-accent-light: #FBBF24;
    --cdec-accent-dark: #D97706;
    --cdec-navy: #1E293B;
    --cdec-navy-light: #334155;
    --cdec-trust-blue: #0891B2;
    --cdec-bg-light: #F8FAFC;
    --cdec-bg-section: #F1F5F9;
    --cdec-border-subtle: rgba(30, 41, 59, 0.08);

    /* 그라디언트 (LMS 스타일 - 에메랄드 녹색) */
    --cdec-gradient-primary: linear-gradient(135deg, #059669 0%, #10B981 50%, #047857 100%);
    --cdec-gradient-accent: linear-gradient(135deg, #F59E0B 0%, #FBBF24 50%, #D97706 100%);
    --cdec-gradient-secondary: linear-gradient(135deg, #06B6D4 0%, #22D3EE 50%, #0891B2 100%);
    --cdec-gradient-card: #FFFFFF;
    --cdec-gradient-section: #F8FAFC;
    --cdec-gradient-section-alt: #FFFFFF;

    /* 그림자 (LMS 스타일 - 더 부드럽게) */
    --cdec-shadow-sm: 0 1px 3px rgba(30, 41, 59, 0.05), 0 1px 2px rgba(30, 41, 59, 0.1);
    --cdec-shadow-md: 0 4px 6px rgba(30, 41, 59, 0.05), 0 2px 4px rgba(30, 41, 59, 0.06);
    --cdec-shadow-lg: 0 10px 15px rgba(30, 41, 59, 0.1), 0 4px 6px rgba(30, 41, 59, 0.05);
    --cdec-shadow-xl: 0 20px 25px rgba(30, 41, 59, 0.1), 0 10px 10px rgba(30, 41, 59, 0.04);

    --cdec-transition: all 0.25s ease;
    --cdec-transition-fast: all 0.15s ease;
    --cdec-transition-slow: all 0.35s ease;
}

@keyframes mainFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes mainScaleIn {
    from {
        opacity: 0;
        transform: scale(0.96);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes mainShine {
    0% {
        background-position: -200% center;
    }

    100% {
        background-position: 200% center;
    }
}

@keyframes mainPulse {

    0%,
    100% {
        box-shadow: 0 4px 16px rgba(21, 120, 93, 0.12);
    }

    50% {
        box-shadow: 0 6px 20px rgba(21, 120, 93, 0.2);
    }
}

@keyframes slideInFromLeft {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInFromRight {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 스크롤 애니메이션용 클래스 */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.animate-on-scroll.visible {
    opacity: 1;
    transform: translateY(0);
}

/* 섹션 (헤더와 겹치지 않도록 상단 여백) */
section {
    width: 100%;
    padding: 14px 15px 0;
    box-sizing: border-box;
    background: var(--lms-bg);
}

.clearFix {
    content: "";
    display: table;
    clear: both;
}

/* 지역선택 cdec_m1 */
.cdec_m1 {
    max-width: 1080px;
    margin: 0 auto;
    border: 1px solid var(--lms-border);
    border-top: 3px solid var(--lms-primary);
    background: var(--lms-card);
    border-radius: 12px;
    box-shadow: var(--cdec-shadow-md);
    padding: 0px 5px 5px;
    margin-bottom: 20px;
    animation: mainFadeIn 0.4s ease;
    position: relative;
    overflow: hidden;
}

.cdec_m1::before {
    display: none;
}

/* 지역선택 제목 */
.area-title {
    color: #333;
    font-weight: 800;
    font-size: 24px;
    text-align: center;
    position: relative;
    padding: 15px 0 10px;
    margin-bottom: 0;
}

.area-title::after {
    content: "STEP 1";
    display: inline-block;
    position: absolute;
    top: 0;
    right: 20px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    background: var(--lms-primary);
    padding: 4px 10px;
    border-radius: 12px;
    letter-spacing: 0.5px;
}

@media screen and (max-width: 768px) {
    .area-title::after {
        display: none;
    }
}

.area-title span {
    color: var(--lms-primary);
    background: linear-gradient(135deg, var(--lms-primary) 0%, var(--lms-primary-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.area-title::before {
    content: "";
    display: inline-block;
    background-image: url(../img/area_title_logo.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 30px;
    background-size: 21px;
    vertical-align: middle;
}

/* 지역선택 박스들 */
.area_box_wrap {
    background: linear-gradient(135deg, #FFFFFF 0%, rgba(5, 150, 105, 0.02) 100%);
    border: 1px solid rgba(5, 150, 105, 0.15);
    border-radius: 12px;
    padding: 25px 30px 10px;
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.06);
    position: relative;
    overflow: hidden;
}

.area_box_wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--lms-primary) 0%, var(--lms-primary-light) 100%);
    border-radius: 12px 12px 0 0;
}

.area_b {
    padding: 0px 5px;
}

/* 지역버튼 */
.area_btn {
    display: block;
    width: 100%;
    height: 50px;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: var(--lms-text);
    line-height: 50px;
    background-color: var(--lms-card);
    border: 1px solid var(--lms-border);
    border-radius: 8px;
    transition: var(--cdec-transition);
    margin-bottom: 12px;
    box-shadow: var(--cdec-shadow-sm);
    position: relative;
    overflow: hidden;
}

.area_btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--lms-primary);
    transition: left 0.3s ease;
    z-index: 0;
}

.area_btn span {
    position: relative;
    z-index: 1;
    pointer-events: none;
}

.area_btn:hover {
    color: #fff;
    border-color: var(--lms-primary);
    transform: translateY(-2px);
    box-shadow: var(--cdec-shadow-lg);
}

.area_btn:hover::before {
    left: 0;
}

.area_btn:active {
    transform: translateY(0) scale(0.98);
}

/* 뒤로가기 버튼 */
.b_m1 {
    background: 0;
    font-size: 20px;
    font-weight: 900;
    transition: var(--cdec-transition-fast);
    color: #000;
    border: 0;
    margin-top: 5px;
    padding: 8px 15px;
    border-radius: 8px;
    cursor: pointer;
}

.b_m1:hover {
    color: var(--lms-primary);
    background: rgba(5, 150, 105, 0.06);
}

.b_m1:active {
    transform: scale(0.95);
}

/* 이수확인 cdec_m2 */
.cdec_m2 {
    max-width: 1080px;
    margin: 0 auto;
    background: var(--lms-card);
    margin-bottom: 20px;
    padding: 20px 25px;
    border: 1px solid var(--lms-border);
    border-top: 3px solid var(--lms-accent);
    border-radius: 12px;
    box-shadow: var(--cdec-shadow-md);
    animation: mainFadeIn 0.4s ease 0.05s both;
    position: relative;
    overflow: visible;
}

.cdec_m2::before {
    display: none;
}

.com_btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin: 0 auto;
}

/* m2이미지 */
.com_img {
    width: 140px;
    transition: var(--cdec-transition);
    flex-shrink: 0;
}

.cdec_m2:hover .com_img {
    transform: scale(1.02);
}

/* m2텍스트 */
.com_title_wrap {
    padding-top: 0;
    padding-left: 0;
    flex: 1;
    min-width: 0;
}

.com_title {
    font-size: 30px;
    font-weight: 900;
    color: #333;
    margin-bottom: 5px;
    letter-spacing: -1px;
}

.com_txt {
    font-size: 16px;
    margin-bottom: 0;
    font-weight: 700;
    color: #555;
    letter-spacing: -1px;
}

.com_title span {
    color: var(--lms-accent);
    background: linear-gradient(135deg, var(--lms-accent) 0%, var(--lms-accent-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    position: relative;
    display: inline-block;
}

.com_title span::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--lms-accent);
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.cdec_m2:hover .com_title span::after {
    transform: scaleX(1);
}

/* m2버튼 */
.m2_btn_wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-end;
    width: auto;
    margin-top: 0;
    padding-top: 0;
    flex-shrink: 0;
}

.m2_btn_wrap>button {
    border-radius: 50px;
    font-size: 15px;
    font-weight: 900;
    transition: var(--cdec-transition);
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 50px;
    width: 100%;
    max-width: 350px;
    padding: 0 20px 0 24px;
    gap: 12px;
}

.m2_btn1 {
    background: var(--lms-accent);
    border: 0;
    color: #fff;
    box-shadow: 0 4px 14px rgba(245, 158, 11, 0.35);
}

.m2_btn1:hover {
    background: var(--lms-accent-light);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(245, 158, 11, 0.45);
}

.m2_btn1:active {
    transform: translateY(0) scale(0.98);
}

.m2_btn_wrap>button p {
    height: 50px;
    line-height: 50px;
    margin-bottom: 0;
    margin-left: 0;
    flex: 1;
    min-width: 0;
    text-align: left;
    padding-right: 8px;
}

.m2_btn_wrap>button span {
    flex-shrink: 0;
    transition: var(--cdec-transition-fast);
}

.m2_btn_wrap>button:hover span {
    transform: translateX(3px);
}

.m2_btn2 {
    color: var(--lms-accent);
    border: 2px solid var(--lms-accent);
    background-color: var(--lms-card);
    max-width: 350px;
}

.m2_btn2:hover {
    background: rgba(245, 158, 11, 0.08);
    color: var(--lms-accent-light);
    border-color: var(--lms-accent-light);
    transform: translateY(-2px);
    box-shadow: var(--cdec-shadow-sm);
}

.m2_btn2:active {
    transform: translateY(0) scale(0.98);
}

/* 자주하는 질문 버튼 cdec_m3 */
.cdec_m3 {
    max-width: 1080px;
    margin: 0 auto;
    margin-top: 15px;
    margin-bottom: 20px;
    animation: mainFadeIn 0.4s ease 0.1s both;
}

.q_box_wrap {
    padding: 0px 10px;
}

.q_box {
    background: var(--lms-card);
    box-shadow: var(--cdec-shadow-md);
    border: 1px solid var(--lms-border);
    border-radius: 12px;
    width: 100%;
    height: 120px;
    min-height: 120px;
    margin: 0 auto;
    margin-bottom: 10px;
    cursor: pointer;
    transition: var(--cdec-transition);
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.q_box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--lms-primary);
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.q_box:hover {
    transform: translateY(-4px);
    box-shadow: var(--cdec-shadow-lg);
    border-color: var(--lms-primary);
}

.q_box:hover::before {
    transform: scaleX(1);
}

.q_box:active {
    transform: translateY(-2px) scale(0.98);
}

/* 자주하는 질문 이미지 */
.q_img {
    transform: scale(0.9);
    transition: var(--cdec-transition);
    margin-bottom: 8px;
    width: auto;
    height: auto;
    max-width: 50px;
    max-height: 50px;
}

.q_box:hover .q_img {
    transform: scale(1.05);
}

.q_box_wrap:nth-of-type(1) .q_img {
    width: 35px;
    margin-left: 0;
    margin-top: 0;
}

.q_box_wrap:nth-of-type(2) .q_img {
    width: 55px;
    margin-left: 0;
    margin-top: 0;
}

.q_box_wrap:nth-of-type(3) .q_img {
    width: 58px;
    margin-left: 0;
    margin-top: 0;
}

.q_box_wrap:nth-of-type(4) .q_img {
    width: 50px;
    margin-left: 0;
    margin-top: 0;
}

.q_box_wrap:nth-of-type(5) .q_img {
    width: 48px;
    margin-left: 0;
    margin-top: 0;
}

.q_box_wrap:nth-of-type(6) .q_img {
    width: 52px;
    margin-left: 0;
    margin-top: 0;
}

.q_img_txt {
    font-weight: 700;
    text-align: center;
    margin-bottom: 0;
    color: #333;
    font-size: 14px;
    letter-spacing: -0.5px;
    transition: var(--cdec-transition-fast);
    line-height: 1.4;
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.q_box_wrap:hover .q_img_txt {
    color: var(--lms-primary);
    font-weight: 800;
}

/* 자주하는 질문 & 공지사항 cdec_m4 */
.cdec_m4 {
    max-width: 1080px;
    margin: 0 auto;
    margin-bottom: 20px;
    animation: mainFadeIn 0.4s ease 0.15s both;
}

.cdec_m4 .row {
    display: flex;
    align-items: stretch;
}

.que,
.ann {
    padding: 0;
    display: flex;
    flex-direction: column;
}

.que_body,
.ann_body {
    border: 1px solid var(--lms-border);
    border-top: 3px solid var(--lms-primary);
    background: var(--lms-card);
    box-shadow: var(--cdec-shadow-md);
    border-radius: 12px;
    margin-right: 10px;
    transition: var(--cdec-transition);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
}

.que_body::before,
.ann_body::before {
    display: none;
}

.que_body:hover,
.ann_body:hover {
    box-shadow: var(--cdec-shadow-lg);
    transform: translateY(-2px);
}

.que_title,
.ann__title {
    font-size: 20px;
    font-weight: 900;
    color: #333;
}

/* 자주하는 질문 */
.que_wrap {
    background: none;
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
}

.que_b_top {
    height: 35px;
    position: relative;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--lms-border-light);
    margin-bottom: 15px;
    flex-shrink: 0;
}

.que_txt {
    flex: 1;
    min-height: 121px;
    display: flex;
    flex-direction: column;
}

.que_title::before {
    content: "";
    display: inline-block;
    background-image: url(../img/question_icon.png);
    background-size: 24px;
    background-repeat: no-repeat;
    width: 28px;
    height: 30px;
    vertical-align: middle;
    transition: var(--cdec-transition-fast);
}

.que_body:hover .que_title::before {
    transform: scale(1.05);
}

/* 더보기 버튼 */
.more_view {
    position: absolute;
    top: 3px;
    right: 0;
    font-size: 15px;
    font-weight: 700;
    border: none;
    background: none;
    transition: var(--cdec-transition-fast);
    color: #555;
    letter-spacing: -1px;
}

.more_view:hover {
    color: var(--lms-primary);
    transform: translateX(3px);
}

.more_view:active {
    transform: translateX(3px) scale(0.95);
}

.que_txt1 {
    font-size: 15px;
    padding: 8px 12px 8px 28px;
    margin-bottom: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: var(--cdec-transition-fast);
    color: #3d3d3d;
    border-radius: 6px;
    position: relative;
    border-left: 3px solid transparent;
    min-height: 40px;
    display: flex;
    align-items: center;
    line-height: 1.4;
}

.que_txt1:hover {
    color: var(--lms-primary);
    background: rgba(5, 150, 105, 0.06);
    border-left-color: var(--lms-primary);
    padding-left: 25px;
}

.que_txt1::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    background: var(--lms-primary);
    border-radius: 50%;
    vertical-align: middle;
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.2s ease;
}

.que_txt1:hover::before {
    transform: translateY(-50%) scale(1.3);
}

/* 공지사항 */
.ann_wrap {
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
}

.ann_body {
    margin-right: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.ann__title {
    font-size: 20px;
    font-weight: 900;
    color: var(--lms-text);
    flex-shrink: 0;
    margin-bottom: 15px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--lms-border-light);
    letter-spacing: -0.5px;
}

.ann__title::before {
    content: "";
    display: inline-block;
    background-image: url(../img/ann_icon.png);
    background-repeat: no-repeat;
    background-size: 24px;
    width: 28px;
    height: 30px;
    vertical-align: middle;
    transition: var(--cdec-transition-fast);
}

.ann_body:hover .ann__title::before {
    transform: scale(1.05);
}

/* ===== 공지사항 텍스트 영역 (notice_in DB HTML) - 텍스트 전용 ===== */
.ann_txt {
    height: 121px;
    min-height: 121px;
    overflow-x: auto;
    overflow-y: auto;
    flex: 1;
    font-size: 15px;
    line-height: 1.7;
    letter-spacing: -0.3px;
    color: var(--lms-text);
    padding: 0 4px;
    -webkit-overflow-scrolling: touch;
}

.ann_txt table {
    max-width: 100%;
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    margin: 8px 0;
}

.ann_txt table th,
.ann_txt table td {
    padding: 6px 10px;
    border: 1px solid var(--lms-border);
}

.ann_txt table th {
    background: var(--lms-border-light);
    font-weight: 700;
}

.ann_txt::-webkit-scrollbar {
    width: 8px;
}

.ann_txt::-webkit-scrollbar-thumb {
    background: var(--lms-primary);
    border-radius: 4px;
}

.ann_txt::-webkit-scrollbar-track {
    background-color: var(--lms-border-light);
    border-radius: 4px;
}

.ann_txt .ann_date {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--lms-text-muted);
    letter-spacing: 0.2px;
    margin-top: 12px;
    margin-bottom: 2px;
}

.ann_txt .ann_date:first-child {
    margin-top: 0;
}

.ann_txt p,
.ann_txt>div {
    margin: 0 0 6px 0;
    padding: 0;
    color: var(--lms-text);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.65;
    letter-spacing: -0.3px;
}

.ann_txt p:last-child,
.ann_txt>div:last-child {
    margin-bottom: 0;
}

.ann_txt p.ann_txt1,
.ann_txt .ann_txt1 {
    font-size: 15px;
    font-weight: 700;
    color: var(--lms-text);
    margin-bottom: 4px;
}

.ann_txt p.ann_txt2,
.ann_txt .ann_txt2 {
    font-size: 15px;
    font-weight: 500;
    color: var(--lms-text-muted);
}

.ann_txt p.ann_txt3,
.ann_txt .ann_txt3 {
    font-size: 15px;
    font-weight: 700;
    color: var(--lms-primary);
}

.ann_txt a {
    color: var(--lms-primary);
    font-weight: 600;
    text-decoration: underline;
}

.ann_txt a:hover {
    color: var(--lms-primary-dark);
}

.ann_txt b,
.ann_txt strong {
    font-weight: 700;
    color: var(--lms-text);
}

.ann_txt ul,
.ann_txt ol {
    margin: 6px 0 6px 18px;
    padding-left: 0;
}

.ann_txt li {
    margin-bottom: 2px;
    line-height: 1.6;
}

.ann_txt [style*="0000ff"],
.ann_txt [style*="color: blue"],
.ann_txt [style*="color:blue"],
.ann_txt font[color="blue"],
.ann_txt .ann_highlight {
    color: var(--lms-primary) !important;
    font-weight: 700 !important;
}

/* 공지사항 빈 상태 */
.ann_txt .ann_empty {
    color: var(--lms-text-muted);
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    padding: 24px 14px;
    margin: 0;
}

/* 슬라이드 cdec_m5 */
.cdec_m5 {
    max-width: 1150px;
    margin: 0 auto;
    position: relative;
    margin-bottom: 10px;
    animation: mainFadeIn 0.4s ease 0.2s both;
}

.silde_banner {
    max-width: 1080px;
    margin: 0 auto;
    margin-bottom: 10px;
}

/* 슬라이드 이미지 */
.swiper {
    width: 100%;
    height: 100%;
    position: static;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-wrapper {
    width: 100%;
}

.slide_img {
    width: 100%;
    height: 100%;
    border-radius: 14px;
    box-shadow: var(--cdec-shadow-md);
    transition: var(--cdec-transition);
}

.slide_img:hover {
    box-shadow: var(--cdec-shadow-lg);
}

.swiper-button-next,
.swiper-button-prev {
    background: var(--lms-primary);
    opacity: 0.9;
    padding: 15px 8px;
    border-radius: 12px;
    color: rgb(255, 255, 255) !important;
    top: 50%;
    transform: translateY(-50%);
    transition: var(--cdec-transition);
    box-shadow: var(--cdec-shadow-sm);
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background: var(--lms-primary-light);
    opacity: 1;
    box-shadow: var(--cdec-shadow-md);
}

.swiper-button-prev:after,
.swiper-button-next:after {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
}

.swiper-button-next {
    right: 0px;
}

.swiper-button-prev {
    left: 0;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: 0.5;
}

/* 페이지네이션 버튼 없앰 (PC) */
.swiper-pagination {
    display: none;
}

/* 하단버튼 cdec_m6 */
.cdec_m6 {
    max-width: 1080px;
    margin: 0 auto;
    margin-bottom: 20px;
    animation: mainFadeIn 0.4s ease 0.25s both;
}

.m_btn_box {
    padding: 0 5px;
    margin-bottom: 12px;
}

.m_btn {
    border: 2px solid var(--lms-primary);
    background: var(--lms-card);
    padding: 8px 20px;
    font-size: 17px;
    color: var(--lms-text);
    border-radius: 12px;
    width: 100%;
    min-height: 65px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 700;
    margin: 0 auto;
    transition: var(--cdec-transition);
    box-shadow: var(--cdec-shadow-sm);
    position: relative;
    overflow: hidden;
}

.m_btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--lms-primary);
    transition: left 0.3s ease;
    z-index: 0;
}

.m_btn>* {
    position: relative;
    z-index: 1;
}

.m_btn span {
    flex: 1;
    text-align: left;
    line-height: 1.4;
}

.m_btn:hover {
    color: #fff;
    border-color: var(--lms-primary);
    font-weight: 900;
    box-shadow: var(--cdec-shadow-md);
    transform: translateY(-2px);
}

.m_btn:hover::before {
    left: 0;
}

.m_btn:active {
    transform: translateY(0) scale(0.98);
}

/* 민방위복 */
.uniform_btn {
    border-color: var(--lms-secondary);
}

/* 민방위복 호버시 */
.uniform_btn:hover {
    color: #fff;
    border-color: var(--lms-secondary);
}

.uniform_btn::before {
    background: var(--lms-secondary);
}

/* 민방위복 사진 크기 */
.m6_btn_img {
    width: 38px;
    height: 38px;
    margin-right: 12px;
    transform: scale(0.95);
    transition: var(--cdec-transition-fast);
    flex-shrink: 0;
}

.m_btn:hover .m6_btn_img {
    transform: scale(1.05);
}

@media screen and (max-width:1290px) {
    /* .cdec_m5{
        width: 1050px;
    }
    .silde_banner{
        max-width: 1000px;
    } */
}

@media screen and (max-width:1200px) {

    /* 이수확인 내용 */
    .com_title_wrap {
        left: 50px;
    }

    /* 이수확인 이미지 */
    .com_img {
        right: 50px;
    }

    .m_btn {
        font-size: 16px;
    }
}

@media screen and (max-width:992px) {

    /* 지역선택 cdec_m1 */
    .cdec_m1 {
        max-width: 720px;
    }

    /* 이수확인 cdec_m2 */
    .cdec_m2 {
        max-width: 720px;
        /* border: 1px solid red; */
        position: relative;
        padding: 20px;
    }

    .com_btn {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    /* m2이미지 */
    .com_img {
        width: 120px;
        align-self: center;
    }

    /* m2텍스트 */
    .com_title_wrap {
        padding-left: 0;
        padding-top: 0;
        width: 100%;
        text-align: center;
    }

    /* m2버튼 */
    .m2_btn_wrap {
        margin-left: 0;
        margin-top: 15px;
        width: 100%;
        padding-top: 0;
        align-items: stretch;
    }

    .m2_btn_wrap>button {
        height: 45px;
        max-width: 100%;
    }

    /* 자주하는 질문 버튼 cdec_m3 */
    .cdec_m3 {
        max-width: 720px;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .q_box_wrap {
        padding: 0px 8px;
        margin-bottom: 15px;
    }

    .q_box {
        height: 105px;
        min-height: 105px;
        padding: 12px;
    }

    .q_img {
        max-width: 40px;
        max-height: 40px;
        margin-bottom: 6px;
    }

    .q_img_txt {
        font-size: 13px;
        min-height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 자주하는 질문 & 공지사항 cdec_m4 */
    .cdec_m4 {
        max-width: 720px;
    }

    .que_body {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .ann_txt {
        height: auto;
        min-height: auto;
    }

    .que_txt {
        min-height: auto;
    }

    /* 슬라이드 cdec_m5 */
    .cdec_m5 {
        max-width: 720px;
    }

    /* prev & next 버튼 없앰*/
    .swiper-button-next,
    .swiper-button-prev {
        display: none;
    }

    .swiper-button-next::after,
    .swiper-button-prev::after {
        display: none;
    }

    /* 페이지네이션 버튼  */
    .swiper-pagination {
        display: block;
    }

    .swiper-pagination-bullet {
        width: 10px;
        height: 10px;
        background: rgba(5, 150, 105, 0.3);
        transition: var(--cdec-transition-fast);
    }

    .swiper-pagination-bullet-active {
        background: var(--lms-primary);
        transform: scale(1.2);
    }

    /* 하단버튼 cdec_m6 */
    .cdec_m6 {
        max-width: 720px;
    }

    .m_btn {
        margin-bottom: 10px;
        font-size: 19px;
    }
}

@media screen and (max-width:768px) {

    /* 지역선택 cdec_m1 */
    .cdec_m1 {
        padding: 0px 5px 0px;
        margin-bottom: 10px;
    }

    .area-title {
        font-size: 24px;
    }

    .area-title::before {
        background-size: 22px;
        width: 24px;
        height: 26px;
    }

    /* 지역버튼 */
    .area_btn {
        height: 50px;
        line-height: 50px;
    }

    /* 뒤로가기 버튼 */
    .b_m1 {
        font-size: 18px;
    }

    /* 이수확인 cdec_m2 */
    /* m2이미지 */
    .com_img {
        display: none;
    }

    /* m2텍스트 */
    .com_title {
        font-size: 25px;
        margin: 0 auto;
        text-align: center;
    }

    .com_title::before {
        content: "";
        display: inline-block;
        background-image: url(../img/m2_mobile_title_b.png);
        background-size: 23px;
        background-repeat: no-repeat;
        width: 25px;
        height: 30px;
        vertical-align: middle;
    }

    .com_txt {
        text-align: center;
        margin-top: 3px;
    }

    .m2_btn_wrap {
        padding-top: 0;
        align-items: stretch;
        width: 100%;
    }

    /* 자주하는 질문 버튼 cdec_m3 */
    .cdec_m3 {
        margin-bottom: 0px;
    }

    .que_body {
        margin-bottom: 10px;
    }

    .q_box_wrap {
        padding: 0px 8px;
        margin-bottom: 15px;
    }

    .q_box {
        height: 100px;
        min-height: 100px;
        padding: 10px;
    }

    .q_img {
        max-width: 35px;
        max-height: 35px;
        margin-bottom: 5px;
    }

    .q_img_txt {
        font-size: 12px;
        min-height: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 자주하는 질문 & 공지사항 cdec_m4 */
    .cdec_m4 {
        margin-bottom: 10px;
    }

    /* 하단버튼 cdec_m6 */
    .m_btn_box {
        margin-bottom: 10px;
    }

    .m_btn {
        font-size: 15px;
        padding: 8px 15px;
        letter-spacing: -1px;
        min-height: 55px;
    }

    .m6_btn_img {
        width: 30px;
        height: 30px;
        margin-right: 8px;
    }
}

@media screen and (max-width:620px) {

    /* 지역선택 cdec_m1 */
    .area_box_wrap {
        padding: 10px 20px;
    }

    /* 지역버튼 */
    .area_b {
        padding: 0px 3px;
    }

    .area_btn {
        margin-bottom: 6px;
    }
}

@media screen and (max-width:575px) {

    /* 이수확인 cdec_m2 */
    .cdec_m2 {
        padding: 10px;
        margin-top: 15px;
    }

    /* m2텍스트 */
    .com_title {
        font-size: 23px;
    }

    .com_title::before {
        background-size: 21px;
        height: 27px;
        width: 23px;
    }

    .com_txt {
        font-size: 14px;
    }

    /* m2버튼 */
    .m2_btn_wrap {
        display: flex;
        flex-direction: column;
        height: auto;
        width: 100%;
        align-items: stretch;
    }

    .m2_btn_wrap>button {
        width: 100%;
        max-width: 100%;
        margin: 0;
        margin-bottom: 10px;
    }

    /* cdec_m6 하단버튼 */
    .m_btn {
        font-size: 20px;
    }
}

@media screen and (max-width:462px) {

    /* 지역선택 cdec_m1 */
    .area-body {
        padding: 10px 5px;
    }

    .area-title {
        font-size: 21px;
    }

    .area-title::before {
        background-size: 18px;
        width: 20px;
        height: 22px;
    }

    .area_btn {
        font-size: 17px;
        height: 40px;
        line-height: 40px;
    }

    /* 뒤로가기 버튼 */
    .b_m1 {
        font-size: 15px;
        margin-top: 5px;
    }

    /* 자주하는 질문 버튼 cdec_m3 */
    .q_box_wrap {
        padding: 0px 4px;
        margin-bottom: 10px;
    }

    .q_box {
        height: 90px;
        min-height: 90px;
        padding: 8px;
    }

    .q_box_wrap:nth-of-type(1) .q_img {
        width: 30px;
        margin-left: 0;
        margin-top: 0;
    }

    .q_box_wrap:nth-of-type(2) .q_img {
        width: 40px;
        margin-left: 0;
        margin-top: 0;
    }

    .q_box_wrap:nth-of-type(3) .q_img {
        width: 42px;
        margin-left: 0;
        margin-top: 0;
    }

    .q_box_wrap:nth-of-type(4) .q_img {
        width: 38px;
        margin-left: 0;
        margin-top: 0;
    }

    .q_box_wrap:nth-of-type(5) .q_img {
        width: 36px;
        margin-left: 0;
        margin-top: 0;
    }

    .q_box_wrap:nth-of-type(6) .q_img {
        width: 38px;
        margin-left: 0;
        margin-top: 0;
    }

    .q_img_txt {
        font-size: 11px;
        line-height: 1.3;
        min-height: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 자주하는 질문 & 공지사항 cdec_m4 */
    .que_title,
    .ann__title {
        font-size: 18px;
    }

    /* 자주하는 질문 */
    .que_b_top {
        height: 36px;
    }

    .que_title::before {
        background-size: 25px;
        width: 29px;
        height: 28px;
    }

    /* 더보기 버튼 */
    .more_view {
        font-size: 14px;
    }

    .que_txt1 {
        font-size: 14px;
        color: #202020;
        padding-left: 24px;
        min-height: 38px;
        display: flex;
        align-items: center;
    }

    /* 공지사항 */
    .ann__title {
        margin-bottom: 0;
    }

    .ann__title::before {
        background-size: 25px;
        margin-right: 0px;
    }

    .ann_txt p,
    .ann_txt>div {
        font-size: 14px;
    }

    .ann_txt1 {
        font-size: 14px;
    }

    p.ann_txt2,
    p.ann_txt3 {
        font-size: 14px;
    }

    .swiper-button-prev,
    .swiper-button-next {
        padding: 3px;
    }

    /* 슬라이드 cdec_m5 */
    /* 페이지네이션 버튼 */
    .swiper-pagination-bullet {
        width: 8px;
        height: 8px;
        background: rgba(5, 150, 105, 0.3);
    }

    .swiper-pagination-bullet-active {
        background: var(--lms-primary);
    }

    /* 하단버튼 cdec_m6 */
    .m_btn_box {
        margin-bottom: 8px;
    }

    .m_btn {
        min-height: 50px;
        font-size: 14px;
        padding: 6px 12px;
    }

    .m6_btn_img {
        width: 28px;
        height: 28px;
        margin-right: 6px;
    }

    .m_btn span {
        font-size: 13px;
    }
}

@media screen and (max-width:368px) {

    /* 지역선택 cdec_m1 */
    .area-title {
        letter-spacing: -1px;
        font-size: 20px;
    }

    /* 이수확인 cdec_m2 */
    /* m2텍스트 */
    .com_title {
        font-size: 20px;
        letter-spacing: -1px;
    }

    .com_title::before {
        background-size: 18px;
        height: 20px;
        width: 20px;
    }

    /* m2버튼 */
    .m2_btn_wrap>button {
        width: 90%;
    }

    .m2_btn_wrap>button p {
        margin-left: 0;
    }

    .m2_btn_wrap>button>span {
        display: none;
    }

    /* 자주하는 질문 버튼 cdec_m3 */
    .q_box_wrap {
        padding: 0px 2px;
        margin-bottom: 8px;
    }

    .q_box {
        height: 85px;
        min-height: 85px;
        padding: 6px;
    }

    .q_img {
        max-width: 30px;
        max-height: 30px;
        margin-bottom: 4px;
    }

    .q_img_txt {
        font-size: 10px;
        letter-spacing: -1px;
        line-height: 1.2;
        min-height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 자주하는 질문 & 공지사항 cdec_m4 */
    .que_body,
    .ann_body {
        padding: 10px 15px;
    }

    .que_title,
    .ann__title {
        font-size: 16px;
    }

    /* 자주하는 질문 */
    .que_title::before {
        background-size: 21px;
        width: 24px;
    }

    .que_txt1 {
        padding-left: 24px;
        margin-bottom: 1px;
        min-height: 36px;
        display: flex;
        align-items: center;
    }

    /* 더보기 버튼 */
    .more_view {
        font-size: 13px;
    }

    /* 공지사항 */
    .ann__title::before {
        background-size: 21px;
        width: 24px;
    }

    .ann_txt p,
    .ann_txt>div {
        font-size: 14px;
    }

    .ann_txt1 {
        font-size: 14px;
    }

    p.ann_txt2,
    p.ann_txt3 {
        font-size: 14px;
    }
}

/* 로그인 CDEC-LOGIN-03 */
/* 섹션박스1(로그인, 자주하는질문, 공지사항) */
.sec_box1 {
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    align-items: stretch;
}

.sec_box1>.col-lg-6 {
    display: flex;
    flex-direction: column;
}

/* 로그인 */
.log {
    border: 1px solid var(--lms-border);
    border-top: 3px solid var(--lms-primary);
    background: var(--lms-card);
    box-shadow: var(--cdec-shadow-md);
    padding: 25px 25px 25px;
    border-radius: 12px;
    animation: mainFadeIn 0.4s ease 0.1s both;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.log_wrap {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.log_title {
    color: var(--lms-text);
    font-weight: 900;
    font-size: 24px;
    text-align: center;
    margin-bottom: 20px;
    letter-spacing: -0.5px;
}

.pwd_info_box {
    display: flex;
    align-items: end;
    justify-content: end;
}

.pwd_info_tap {
    color: white
}

.help-pwd-bold {
    font-weight: bold;
}

.log_box_wrap {
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    border-radius: 10px;
    padding: 25px;
    margin-top: 15px;
    flex-shrink: 0;
}

.log_box {
    margin-bottom: 20px;
}

.log_box:last-of-type {
    margin-bottom: 0;
}

.log_box_title {
    font-size: 15px;
    font-weight: 700;
    color: var(--lms-text);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.log_box_in {
    height: 45px;
    border: 1px solid var(--lms-border);
    border-radius: 8px;
    width: 100%;
    outline: none;
    padding: 0 15px;
    font-size: 15px;
    color: var(--lms-text);
    background: var(--lms-card);
    transition: var(--cdec-transition-fast);
    box-sizing: border-box;
}

.log_box_in:focus {
    border-color: var(--lms-primary);
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.1);
    background: #fff;
}

.log_box_in::placeholder {
    color: var(--lms-text-muted);
    font-weight: 400;
    font-size: 14px;
    letter-spacing: -0.3px;
}

.newpas_v1 {
    text-align: center
}

.newpas_v2 {
    text-align: center
}

/* 대원 로그인 버튼 */
.log_btn {
    background: linear-gradient(135deg, var(--lms-primary) 0%, var(--lms-primary-light) 100%);
    color: #fff;
    border: 0;
    margin: 25px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 50px;
    border-radius: 10px;
    transition: var(--cdec-transition);
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 4px 14px rgba(5, 150, 105, 0.35);
    cursor: pointer;
    flex-shrink: 0;
}

.log_btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(5, 150, 105, 0.45);
}

.log_btn:active {
    transform: translateY(0) scale(0.98);
}

.log_btn span:last-child {
    font-size: 18px;
    font-weight: 900;
    transition: transform var(--cdec-transition-fast);
}

.log_btn:hover span:last-child {
    transform: translateX(4px);
}

/* 공지사항, 자주하는질문 (로그인 페이지) */
.sec_box1_2 {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding-left: 15px;
}

.sec_box1_2 .ann_wrap,
.sec_box1_2 .que_wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.sec_box1_2 .ann_body {
    margin-bottom: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.sec_box1_2 .ann_txt {
    height: 200px;
    min-height: 200px;
    flex: 1;
    overflow-y: auto;
}

/* 자주하는질문 */
.sec_box1_2 .que_body {
    margin-right: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.sec_box1_2 .que_txt {
    flex: 1;
    min-height: 200px;
}

/* 개인정보 수집, 이용 동의 */
.agree {
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid var(--lms-border-light);
}

.agree_box {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.agree_box:last-child {
    margin-bottom: 0;
}

.agree_box input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--lms-primary);
    flex-shrink: 0;
}

.agree_box label {
    font-size: 14px;
    font-weight: 600;
    color: var(--lms-text);
    letter-spacing: -0.3px;
    cursor: pointer;
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}

.agree_box b {
    color: var(--lms-primary);
    font-weight: 800;
}

/* 전체 동의 강조 */
.agree_box_all {
    background: rgba(5, 150, 105, 0.06);
    border: 2px solid var(--lms-primary);
    border-radius: 8px;
    padding: 12px 15px;
    margin-bottom: 15px;
}

.agree_box_all input[type="checkbox"] {
    width: 20px;
    height: 20px;
}

.agree_box_all label {
    font-size: 15px;
    font-weight: 700;
    color: var(--lms-text);
}

/* 전문보기 버튼 */
.agree_btn {
    color: var(--lms-primary);
    background: transparent;
    display: inline-flex;
    align-items: center;
    border-radius: 6px;
    font-size: 12px;
    padding: 4px 10px;
    height: 24px;
    line-height: 1;
    margin-left: auto;
    font-weight: 600;
    transition: var(--cdec-transition-fast);
    border: 1px solid var(--lms-primary);
    cursor: pointer;
    flex-shrink: 0;
}

.agree_btn:hover {
    background: rgba(5, 150, 105, 0.08);
    border-color: var(--lms-primary-light);
    color: var(--lms-primary-light);
    transform: translateX(2px);
}

/* 섹션박스2(자주하는질문 버튼) */
.sec_box2 {
    max-width: 1080px;
    margin: 0 auto;
    margin-top: 15px;
    margin-bottom: 15px;
}

/* 섹션박스4(하단 버튼) */
.sec_box4 {
    max-width: 1080px;
    margin: 0 auto;
}

@media screen and (max-width:992px) {

    /* 섹션박스1(로그인, 자주하는질문, 공지사항) */
    .log_box_wrap {
        padding: 20px;
    }

    .sec_box1 {
        max-width: 720px;
    }

    .log {
        margin-bottom: 10px;
    }

    .sec_box1_2 {
        padding-left: 0;
        gap: 10px;
    }

    .sec_box1_2 .ann_txt {
        height: auto;
        min-height: auto;
    }

    .sec_box1_2 .que_txt {
        min-height: auto;
    }

    /* 섹션박스4(하단 버튼) */
    .sec_box4 {
        max-width: 720px;
    }
}

@media screen and (max-width:768px) {

    /* 로그인 */
    .log_box_title {
        font-size: 15px;
    }
}

@media screen and (max-width:462px) {

    /* 섹션박스1(로그인, 자주하는질문, 공지사항) */
    /* 로그인 */
    .log {
        padding: 20px 15px;
    }

    .log_title {
        font-size: 18px;
        letter-spacing: -0.5px;
        margin-bottom: 15px;
    }

    .log_box_wrap {
        padding: 20px 15px;
        margin-bottom: 0px;
    }

    .log_box_title {
        font-size: 14px;
        margin-bottom: 6px;
    }

    .log_box_in {
        height: 42px;
        font-size: 14px;
        padding: 0 12px;
    }

    .log_btn {
        height: 48px;
        font-size: 15px;
        margin-top: 20px;
    }

    /* 개인정보 수집, 이용 동의 */
    .agree {
        margin-top: 20px;
        padding-top: 15px;
    }

    .agree_box_all {
        padding: 10px 12px;
    }

    .agree_box {
        margin-bottom: 10px;
    }

    .agree_btn {
        font-size: 11px;
        padding: 3px 8px;
        height: 22px;
    }
}

@media screen and (max-width:368px) {

    /* 섹션박스1(로그인, 자주하는질문, 공지사항) */
    /* 로그인 */
    .log {
        padding: 15px 12px;
    }

    .log_title {
        font-size: 17px;
    }

    .log_box_wrap {
        padding: 15px 12px;
    }

    .log_box_in {
        padding: 0 10px;
        height: 40px;
        font-size: 14px;
    }

    .log_box_in::placeholder {
        font-size: 13px;
    }

    .log_btn {
        height: 45px;
        font-size: 14px;
    }

    /* 개인정보 수집, 이용 동의 */
    .agree_box label {
        font-size: 12px;
    }

    .agree_btn {
        padding: 2px 6px;
        font-size: 10px;
        height: 20px;
    }
}

/* 로그인본인인증 CDEC-LOGIN-04 */
/* 본인인증 진행 */
.aut_txt {
    margin-bottom: 0;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -1px;
    color: #555;
    margin-bottom: 10px;
}

/* 인증수단 선택 */
.atu_box_wrap {
    height: 170px;
    padding: 10px;
    display: flex;
}

.atu_box {
    width: 25%;
    padding-top: 40px;
    background-color: #fff;
}

.aut_img_wrap {
    width: 55px;
    height: 55px;
    border: 1px solid rgb(228, 228, 228);
    border-radius: 5px;
    margin: 0 auto;
    background-repeat: no-repeat;
    cursor: pointer;
    background-color: #fff;
}

/* 네이버 */
.atu_box:nth-child(1) .aut_img_wrap {
    background-image: url(../img/naver_logo.jpg);
    background-size: contain;
}

/* 카카오 */
.atu_box:nth-child(2) .aut_img_wrap {
    background-image: url(../img/Kakao_logo.jpg);
    background-size: 40px;
    background-position: 7px;
}

/* 휴대폰 */
.atu_box:nth-child(3) .aut_img_wrap {
    background-image: url(../img/cellphone_logo.png);
    background-size: 40px;
    background-position: 7px;
}

/* 카드 */
.atu_box:nth-child(4) .aut_img_wrap {
    background-image: url(../img/card_logo.png);
    background-size: 40px;
    background-position: 7px;
}

/* 아이핀 */
.atu_box:nth-child(5) .aut_img_wrap {
    background-image: url(../img/i-pin_logo.png);
    background-size: 40px;
    background-position: 7px;
}

.atu_title {
    font-size: 14px;
    color: #000;
    text-align: center;
}

.n_aut {
    margin-bottom: 0;
    color: #ff3434;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    margin-top: 15px;
}

@media screen and (max-width:1102px) {
    .atu_box_wrap {
        height: 150px;
    }

    .atu_box {
        padding-top: 30px;
    }
}

@media screen and (max-width:500px) {
    .aut_txt {
        font-size: 14px;
        line-height: 18px;
    }

    /* 인증수단 선택 */
    .atu_box_wrap {
        height: 100px;
        padding: 0;
    }

    .atu_box {
        padding-top: 20px;
    }

    .aut_img_wrap {
        width: 40px;
        height: 40px;
    }

    /* 카카오 */
    .atu_box:nth-child(2) .aut_img_wrap {
        background-image: url(../img/Kakao_logo.jpg);
        background-size: 32px;
        background-position: 4px;
    }

    /* 휴대폰 */
    .atu_box:nth-child(3) .aut_img_wrap {
        background-image: url(../img/cellphone_logo.png);
        background-size: 32px;
        background-position: 4px;
    }

    /* 카드 */
    .atu_box:nth-child(4) .aut_img_wrap {
        background-image: url(../img/card_logo.png);
        background-size: 32px;
        background-position: 4px;
    }

    /* 아이핀 */
    .atu_box:nth-child(5) .aut_img_wrap {
        background-image: url(../img/i-pin_logo.png);
        background-size: 32px;
        background-position: 4px;
    }

    .atu_title {
        font-size: 13px;
        text-align: center;
    }

    .n_aut {
        font-size: 13px;
    }
}

@media screen and (max-width:368px) {
    .aut_txt {
        font-size: 12px;
        line-height: 15px;
    }

    /* 인증수단 선택 */
    .atu_box_wrap {
        height: 80px;
        padding: 0;
    }

    .atu_box {
        padding-top: 15px;
    }

    .aut_img_wrap {
        width: 35px;
        height: 35px;
    }

    /* 카카오 */
    .atu_box:nth-child(2) .aut_img_wrap {
        background-image: url(../img/Kakao_logo.jpg);
        background-size: 25px;
    }

    /* 휴대폰 */
    .atu_box:nth-child(3) .aut_img_wrap {
        background-image: url(../img/cellphone_logo.png);
        background-size: 25px;
    }

    /* 카드 */
    .atu_box:nth-child(4) .aut_img_wrap {
        background-image: url(../img/card_logo.png);
        background-size: 25px;
    }

    /* 아이핀 */
    .atu_box:nth-child(5) .aut_img_wrap {
        background-image: url(../img/i-pin_logo.png);
        background-size: 25px;
    }

    .atu_title {
        font-size: 12px;
        font-weight: 700;
        letter-spacing: -1px;
    }

    .n_aut {
        font-size: 12px;
        letter-spacing: -1px;
        margin-top: 10px;
    }
}

/* 타지역 이동 CDEC-LOGIN-05 */
.log5_box_wrap {
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    padding: 155px 20px 165px;
    margin-top: 10px;
}

.di_txt {
    text-align: center;
    font-size: 25px;
    font-weight: 900;
    color: #555;
    line-height: 33px;
}

.di_txt span {
    color: #15785d;
}

.di_btn {
    border: 0;
    margin: 0 auto;
    display: block;
    background-color: #15785d;
    color: #fff;
    font-size: 17px;
    font-weight: 500;
    width: 190px;
    height: 40px;
    border-radius: 5px;
    transition: all 0.1s;
}

.di_btn:hover {
    background-color: #238d70;
}

@media screen and (max-width:992px) {
    .log5_box_wrap {
        padding: 40px 20px;
    }

    .di_txt {
        font-size: 23px;
        line-height: 30px;
    }

    .di_btn {
        font-size: 15px;
        width: 180px;
    }
}

@media screen and (max-width:768px) {
    .log5_box_wrap {
        padding: 30px 20px;
    }

    .di_txt {
        font-size: 20px;
        line-height: 26px;
    }

    .di_btn {
        font-size: 14px;
        width: 170px;
        height: 35px;
    }
}

@media screen and (max-width:462px) {
    .log5_box_wrap {
        padding: 20px;
    }

    .di_txt {
        font-size: 17px;
        line-height: 22px;
    }

    .di_btn {
        font-size: 14px;
        width: 170px;
        height: 35px;
    }
}

@media screen and (max-width:396px) {
    .di_txt {
        font-size: 15px;
        line-height: 20px;
    }

    .di_btn {
        letter-spacing: -1px;
        width: 150px;
    }
}

/* 해당 교육 일정 접속 CDEC-LOGIN-06 - 기대감 디자인 */
.log6_box_wrap {
    background: linear-gradient(165deg, rgba(5, 150, 105, 0.08) 0%, rgba(16, 185, 129, 0.05) 35%, rgba(248, 250, 252, 1) 100%);
    border: 1px solid rgba(5, 150, 105, 0.18);
    border-radius: 16px;
    padding: 40px 24px 48px;
    margin-top: 10px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(5, 150, 105, 0.08);
}

.log6_box_wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--lms-primary) 0%, var(--lms-primary-light) 100%);
    border-radius: 16px 16px 0 0;
}

/* 배경 장식 - 부드러운 원형 포인트 */
.log6_box_wrap::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(5, 150, 105, 0.12) 0%, transparent 70%);
    top: -40px;
    right: -40px;
    pointer-events: none;
}

.log6_box_wrap .log6_visual~.log6_txt,
.log6_box_wrap .log6_visual~.log6_sub {
    position: relative;
    z-index: 1;
}

.log6_box_wrap .edu_da {
    position: relative;
    z-index: 1;
}

/* 기대감 시각 영역 - 일러스트 + 반짝임 */
.log6_visual {
    text-align: center;
    margin-bottom: 20px;
    position: relative;
    z-index: 1;
}

.log6_visual_inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.log6_icon_cal {
    width: 72px;
    height: 72px;
    color: var(--lms-primary);
    animation: log6IconFloat 4s ease-in-out infinite;
}

@keyframes log6IconFloat {

    0%,
    100% {
        transform: translateY(0);
        opacity: 0.9;
    }

    50% {
        transform: translateY(-6px);
        opacity: 1;
    }
}

.log6_sparkle {
    position: absolute;
    font-size: 14px;
    color: var(--lms-primary);
    opacity: 0.7;
    animation: log6Sparkle 2.5s ease-in-out infinite;
}

.log6_sparkle_1 {
    top: -4px;
    right: -8px;
    animation-delay: 0s;
}

.log6_sparkle_2 {
    bottom: 0;
    left: -12px;
    animation-delay: 0.8s;
}

.log6_sparkle_3 {
    bottom: -8px;
    right: 4px;
    animation-delay: 1.4s;
}

@keyframes log6Sparkle {

    0%,
    100% {
        transform: scale(1);
        opacity: 0.6;
    }

    50% {
        transform: scale(1.2);
        opacity: 1;
    }
}

.log6_sub_icon {
    display: inline-block;
    margin-right: 4px;
    animation: log6SubIcon 2s ease-in-out infinite;
}

@keyframes log6SubIcon {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.15);
    }
}

.log6_txt {
    font-size: 18px;
    text-align: center;
    font-weight: 900;
    color: var(--lms-text);
    letter-spacing: -0.5px;
    margin-bottom: 12px;
}

.log6_txt span {
    color: var(--lms-primary);
    position: relative;
}

.log6_sub {
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: var(--lms-text-muted);
    letter-spacing: -0.3px;
    margin-bottom: 24px;
}

.log6_txt_mobile {
    display: none;
}

/* 해당 교육 일정 - 기대감 카드 */
.edu_da {
    background: var(--lms-card);
    border: 2px solid rgba(5, 150, 105, 0.2);
    border-radius: 12px;
    padding: 24px 20px;
    width: 90%;
    margin: 0 auto;
    text-align: center;
    position: relative;
    box-shadow: 0 4px 16px rgba(5, 150, 105, 0.1);
    animation: eduCardGlow 3s ease-in-out infinite;
}

@keyframes eduCardGlow {

    0%,
    100% {
        box-shadow: 0 4px 16px rgba(5, 150, 105, 0.1);
        border-color: rgba(5, 150, 105, 0.2);
    }

    50% {
        box-shadow: 0 6px 24px rgba(5, 150, 105, 0.16);
        border-color: rgba(5, 150, 105, 0.35);
    }
}

.edu_date {
    font-size: 28px;
    color: var(--lms-primary);
    font-weight: 900;
    letter-spacing: -1px;
}

.edu_da_txt {
    font-size: 18px;
    color: var(--lms-text);
    font-weight: 700;
    margin-bottom: 0;
}

/* endEdu 전용: 공지/FAQ 없이 해당 교육 일정 카드만 넓게 강조 */
.sec_box1_endedu .log6_outer {
    width: 100%;
    max-width: 100%;
}

.sec_box1_endedu .log6_box_wrap {
    padding: 48px 32px 64px;
    max-width: 720px;
    margin: 0 auto;
}

.sec_box1_endedu .log6_visual {
    margin-bottom: 24px;
}

.sec_box1_endedu .log6_icon_cal {
    width: 80px;
    height: 80px;
}

.sec_box1_endedu .log6_sparkle {
    font-size: 16px;
}

.sec_box1_endedu .log6_txt {
    font-size: 20px;
}

.sec_box1_endedu .log6_sub {
    font-size: 16px;
    margin-bottom: 28px;
}

.sec_box1_endedu .edu_da {
    width: 92%;
    max-width: 480px;
    padding: 28px 24px;
}

@media screen and (max-width:992px) {
    .log6_box_wrap {
        padding: 32px 20px 40px;
    }

    .sec_box1_endedu .log6_box_wrap {
        padding: 40px 24px 48px;
    }

    .sec_box1_endedu .log6_icon_cal {
        width: 64px;
        height: 64px;
    }

    .log6_sub {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .sec_box1_endedu .log6_txt {
        font-size: 18px;
    }

    .sec_box1_endedu .log6_sub {
        font-size: 15px;
        margin-bottom: 24px;
    }

    .edu_da {
        width: 85%;
    }

    .sec_box1_endedu .edu_da {
        width: 92%;
        max-width: none;
    }
}

@media screen and (max-width:768px) {
    .log6_box_wrap {
        padding: 28px 20px 36px;
    }

    .sec_box1_endedu .log6_box_wrap {
        padding: 36px 20px 44px;
    }

    .log6_visual {
        margin-bottom: 16px;
    }

    .log6_icon_cal {
        width: 60px;
        height: 60px;
    }

    .log6_sparkle {
        font-size: 12px;
    }

    .log6_txt {
        font-size: 16px;
    }

    .log6_sub {
        font-size: 14px;
    }

    .edu_da_txt {
        font-size: 16px;
    }

    .edu_date {
        font-size: 24px;
    }

    .edu_da {
        width: 90%;
        padding: 20px 16px;
    }

    .sec_box1_endedu .edu_da {
        width: 94%;
    }
}

@media screen and (max-width:510px) {
    .edu_da {
        width: 100%;
    }
}

@media screen and (max-width:462px) {
    .log6_box_wrap {
        padding: 20px 14px 28px;
    }

    .sec_box1_endedu .log6_box_wrap {
        padding: 28px 16px 36px;
    }

    .log6_visual {
        margin-bottom: 14px;
    }

    .log6_icon_cal {
        width: 56px;
        height: 56px;
    }

    .log6_txt {
        font-size: 17px;
    }

    .log6_sub {
        font-size: 13px;
        margin-bottom: 18px;
    }

    .log6_txt_mobile {
        display: block;
    }

    .log6_txt_pc {
        display: none;
    }

    .edu_da {
        padding: 18px 14px;
    }

    .edu_date {
        font-size: 22px;
        margin-bottom: 5px;
    }

    .edu_da_txt {
        font-size: 15px;
    }
}

@media screen and (max-width:368px) {
    .log6_txt {
        font-size: 14px;
        line-height: 18px;
        margin-bottom: 7px;
    }

    .log6_sub {
        font-size: 12px;
    }

    .edu_date {
        font-size: 18px;
    }

    .edu_da_txt {
        font-size: 13px;
    }
}

/* 주소정보선택 CDEC-LOGIN-07 */
.log7_box_wrap {
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    padding: 88px 20px 90px;
    margin-top: 10px;
}

.log7_txt {
    text-align: center;
    font-size: 17px;
    font-weight: 700;
    color: #000000;
    margin-bottom: 10px;
}

.address_wrap {
    background-color: #fff;
    border: 1px solid #e3e3e3;
    padding: 15px;
    margin-bottom: 20px;
}

.address_box {
    margin-bottom: 15px;
}

.address_box:last-child {
    margin-bottom: 0;
}

/*  체크박스 스타일 */
.address_wrap [type="radio"] {
    vertical-align: top;
    appearance: none;
    border: 1px solid rgb(144, 144, 144);
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin-top: 14px;
}

.address_wrap [type="radio"]:checked {
    background-color: #15785d;
    border: 0;
    width: 10px;
    height: 10px;
}

.address_wrap [type="radio"]:hover {
    box-shadow: 0 0 5px rgb(101, 101, 101);
    cursor: pointer;
}

.address_wrap [type="radio"]:disabled {
    background-color: lightgray;
    box-shadow: none;
    opacity: 0.7;
    cursor: not-allowed;
}

.address_box label {
    cursor: pointer;
}

.address_wrap p {
    margin-bottom: 0;
    font-size: 15px;
    font-weight: 700;
    color: #555;
    margin-left: 5px;
}

@media screen and (max-width:992px) {
    .log7_box_wrap {
        padding: 20px;
    }
}

@media screen and (max-width:500px) {
    .log7_txt {
        font-size: 16px;
    }

    .address_wrap [type="radio"] {
        margin-top: 10px;
    }

    .address_wrap p {
        font-size: 13px;
        line-height: 15px;
    }
}

@media screen and (max-width:462px) {
    .address_box label {
        width: 90%;
    }
}

/* 비밀번호 설정 CDEC-PWD-01 */
/* 비밀번호 입력 */
.pw1_box_wrap {
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    padding: 20px;
    margin-top: 10px;
}

.pw4_txt_mobile {
    display: none;
}

.pw1_txt {
    margin-bottom: 0;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: var(--lms-text);
    margin-bottom: 20px;
    line-height: 1.5;
    letter-spacing: -0.3px;
}

.pw1_wrap {
    margin-top: 82px;
    margin-bottom: 82px;
}

@media screen and (max-width:992px) {
    .pw1_wrap {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .pw1_txt {
        font-size: 17px;
    }
}

@media screen and (max-width:462px) {
    .pw1_txt {
        font-size: 16px;
        letter-spacing: -0.5px;
    }
}

/* 비밀번호 입력 CDEC-PWD-02 - 디자인 개선 */
.pw2_box_wrap {
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    border-radius: 12px;
    padding: 28px 24px 24px;
    margin-top: 8px;
    box-shadow: var(--cdec-shadow-sm);
}

.pw2_box_wrap .pw1_txt {
    margin-bottom: 20px;
    font-size: 16px;
    color: var(--lms-text-muted);
}

.pw2_box_wrap .log_box {
    margin-bottom: 20px;
}

.pw2_box_wrap .log_btn {
    margin-top: 8px;
}

/* 비번 재발급 */
.n_pw2 {
    background: rgba(5, 150, 105, 0.08);
    border: 1px solid rgba(5, 150, 105, 0.2);
    padding: 18px 20px;
    border-radius: 12px;
    margin-top: 24px;
}

.n_pw2_txt {
    margin-bottom: 12px;
    text-align: center;
    font-size: 14px;
    color: var(--lms-text);
    font-weight: 600;
    line-height: 1.5;
}

.pw1_txt_mobile {
    display: none;
}

.n_pw2_btn {
    border: 2px solid var(--lms-primary);
    height: 44px;
    min-width: 200px;
    border-radius: 12px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--lms-primary);
    font-size: 14px;
    font-weight: 700;
    background: #fff;
    cursor: pointer;
    transition: var(--cdec-transition-fast);
}

.n_pw2_btn p {
    margin-bottom: 0;
}

.n_pw2_btn span {
    font-size: 14px;
    transition: transform var(--cdec-transition-fast);
}

.n_pw2_btn:hover {
    background: var(--lms-primary);
    color: #fff;
}

.n_pw2_btn:hover span {
    transform: translateX(3px);
}

@media screen and (max-width:992px) {
    .pw2_box_wrap {
        padding: 24px 20px 20px;
    }

    .n_pw2 {
        margin-top: 20px;
    }
}

@media screen and (max-width:462px) {
    .pw2_box_wrap {
        padding: 20px 16px;
    }

    .pw2_box_wrap .pw1_txt {
        font-size: 15px;
        margin-bottom: 16px;
    }

    .n_pw2_txt {
        font-size: 13px;
    }

    .pw1_txt_pc {
        display: none;
    }

    .pw1_txt_mobile {
        display: block;
    }

    .n_pw2_btn {
        font-size: 13px;
        min-width: 180px;
        height: 42px;
    }
}

@media screen and (max-width:368px) {
    .n_pw2_btn {
        min-width: 100%;
    }
}

/* 비밀번호 인증 실패 CDEC-PWD-03 - 디자인 개선 */
.pw3_box_wrap {
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    border-radius: 12px;
    padding: 32px 24px 24px;
    margin-top: 8px;
    box-shadow: var(--cdec-shadow-sm);
}

.pw3_box_wrap .pw1_txt {
    margin-bottom: 20px;
    color: var(--lms-text);
}

.n_pw3 {
    margin-top: 24px;
}

@media screen and (max-width:992px) {
    .pw3_box_wrap {
        padding: 28px 20px 20px;
    }

    .n_pw3 {
        margin-top: 20px;
    }
}

/* 비밀번호 재발급(간편인증) CDEC-PWD-05 - 디자인 개선 */
.pw5_title_txt {
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    color: var(--lms-text-muted);
    margin-top: 0;
    margin-bottom: 16px;
}

.pw5_box_wrap {
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    border-radius: 12px;
    padding: 24px;
    margin-top: 8px;
    box-shadow: var(--cdec-shadow-sm);
}

.pw5_box_wrap .log_btn {
    margin-top: 8px;
}

.pw5_box {
    margin-bottom: 18px;
}

.pw5_box:last-of-type {
    margin-bottom: 0;
}

.pw6_box {
    margin: 24px 0;
}

.pw5n_b {
    display: flex;
    gap: 12px;
}

.pw5_box1 {
    flex: 1;
    min-width: 0;
}

.pw5_box1:nth-child(1) {
    margin-right: 0;
}

.pw5_box2 {
    display: flex;
    gap: 10px;
    align-items: stretch;
}

.pw5_box2 .pw5_box_in {
    flex: 1;
    min-width: 0;
    margin-right: 0;
}

.pw5_box2 .chk_btn {
    display: none;
}

.pw5_box2 .comp_btn {
    display: none;
}

.sh_btn {
    flex-shrink: 0;
    min-width: 90px;
    height: 45px;
    border: 0;
    border-radius: 10px;
    background: var(--lms-primary);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: var(--cdec-transition-fast);
}

.sh_btn:hover {
    background: var(--lms-primary-light);
    transform: translateY(-1px);
}

.sh_btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.pw5_box_title {
    font-size: 15px;
    font-weight: 700;
    color: var(--lms-text);
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

.pw5_box_in {
    height: 45px;
    border: 1px solid var(--lms-border);
    border-radius: 10px;
    width: 100%;
    outline: none;
    padding: 0 14px;
    font-size: 15px;
    color: var(--lms-text);
    background: var(--lms-card);
    box-sizing: border-box;
    transition: border-color var(--cdec-transition-fast), box-shadow var(--cdec-transition-fast);
}

.pw5_box_in:focus {
    border-color: var(--lms-primary);
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.1);
}

.pw5_box_in::placeholder {
    color: var(--lms-text-muted);
    font-weight: 500;
    font-size: 14px;
}

.pw5_txt_wrap {
    background: rgba(5, 150, 105, 0.08);
    border: 1px solid rgba(5, 150, 105, 0.15);
    padding: 16px 18px;
    margin-bottom: 20px;
    margin-top: 20px;
    border-radius: 12px;
}

.pw5_txt {
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--lms-text);
    font-weight: 600;
    line-height: 1.6;
}

.pw5_txt:last-child {
    margin-bottom: 0;
}

.pw5_txt::before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    background: var(--lms-primary);
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 8px;
}

.ann_pw5_txt {
    height: 120px;
}

@media screen and (max-width:992px) {
    .pw5_box_wrap {
        padding: 20px;
    }

    .pw5_box {
        margin-bottom: 16px;
    }

    .pw6_box {
        margin: 20px 0;
    }

    .pw5n_b {
        display: block;
        gap: 0;
    }

    .pw5_box2 .pw5_box_in {
        flex: 1;
    }

    .sh_btn {
        min-width: 80px;
    }
}

@media screen and (max-width:768px) {
    .pw5_box_title {
        font-size: 14px;
    }

    .pw5_box2 {
        flex-wrap: wrap;
    }

    .pw5_box2 .pw5_box_in {
        width: 100%;
    }

    .sh_btn {
        min-width: 70px;
        height: 42px;
        font-size: 14px;
    }
}

@media screen and (max-width:462px) {
    .pw5_box_wrap {
        padding: 18px 16px;
    }

    .pw5_box_in {
        height: 44px;
        padding: 0 12px;
        font-size: 14px;
    }

    .pw5_box_in::placeholder {
        font-size: 13px;
    }

    .pw5_txt_wrap {
        padding: 14px 16px;
    }

    .pw5_txt {
        font-size: 13px;
    }
}

@media screen and (max-width:368px) {
    .pw5_title_txt {
        font-size: 13px;
    }

    .pw5_box_in {
        padding: 0 10px;
    }

    .pw5_box2 {
        gap: 8px;
    }

    .sh_btn {
        min-width: 64px;
        height: 40px;
        font-size: 13px;
    }
}

/* 비밀번호 재발급(새 비밀번호 설정) CDEC-PWD-07 - 디자인 개선 */
.pw7_box_wrap {
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    border-radius: 12px;
    padding: 24px;
    margin-top: 8px;
    box-shadow: var(--cdec-shadow-sm);
}

.pw7_box_wrap .pw1_txt {
    margin-bottom: 24px;
    color: var(--lms-text);
}

.pw7_txt_wrap {
    margin-bottom: 24px;
}

@media screen and (max-width:992px) {
    .pw7_box_wrap {
        padding: 20px;
    }

    .pw7_box_wrap .pw1_txt {
        margin-bottom: 20px;
    }

    .pw7_txt_wrap {
        margin-bottom: 20px;
    }
}

/* 이수확인 CDEC-ESU-01 */
.esu_box_wrap {
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    padding: 36px 20px;
    margin-top: 10px;
}

/* 시도/시군구 */
.esu_box {
    display: flex;
    margin-bottom: 10px;
}

.esu_box_sel_wrap {
    width: 50%;
    margin-right: 10px;
}

.esu_box_sel_wrap:last-child {
    margin-right: 0;
}

.esu_box_title {
    font-size: 17px;
    font-weight: 600;
    color: #555;
    margin-bottom: 3px;
}

.esu_box_sel {
    height: 35px;
    border: 1px solid #dfdfdf;
    border-radius: 5px;
    width: 100%;
    outline: none;
    padding-left: 5px;
    font-size: 15px;
    font-weight: 700;
    color: #828282;
}

/* 이수확인 버튼 */
.esu_btn {
    background-color: var(--lms-primary);
    color: #fff;
    border: 0;
    margin: 0 auto;
    display: block;
    width: 110px;
    height: 35px;
    border-radius: 5px;
    transition: all 0.1s;
    font-size: 15px;
    font-weight: 500;
    margin-top: 35px;
    box-shadow: var(--cdec-shadow-sm);
}

.esu_btn:hover {
    background-color: var(--lms-primary-light);
    box-shadow: var(--cdec-shadow-md);
}

@media screen and (max-width:992px) {
    .esu_box_wrap {
        padding: 20px;
    }

    /* 이수확인 버튼 */
    .esu_btn {
        margin-top: 0px;
    }
}

@media screen and (max-width:768px) {
    .esu_box_sel {
        font-size: 14px;
    }

    .esu_box_title {
        font-size: 15px;
    }
}

@media screen and (max-width:368px) {
    .esu_box {
        display: block;
        margin-bottom: 0;
    }

    .esu_box_sel_wrap {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
}

/* 이수확인 비밀번호 입력 CDEC-ESU-02 */
.esu2_box_wrap {
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    padding: 141px 20px 140px;
    margin-top: 10px;
}

.log_box_in2 {
    height: 35px;
    border: 1px solid #dfdfdf;
    border-radius: 5px;
    width: 100%;
    outline: none;
    padding-left: 10px;
    margin-bottom: 15px;
}

@media screen and (max-width:992px) {
    .esu2_box_wrap {
        padding: 20px;
    }
}

/* 이수증 출력 CDEC-ESU-03  */
.esu3_box_wrap {
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    padding: 92px 20px 107px;
    margin-top: 10px;
}

.esu3_box {
    padding: 20px;
    margin-top: 15px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #e3e3e3;
}

.esu3_txt {
    margin-bottom: 20px;
    font-size: 15px;
    font-weight: 700;
    color: #555;
}

.esu3_txt span {
    color: #15785d;
    font-weight: 900;

}

.esu3_txt:last-child {
    margin-bottom: 0;
}

@media screen and (max-width:992px) {
    .esu3_box_wrap {
        padding: 20px;
    }

    .esu3_txt {
        margin-bottom: 10px;
    }
}

@media screen and (max-width:462px) {
    .esu3_txt {
        font-size: 14px;
    }
}

@media screen and (max-width:368px) {
    .esu3_box {
        margin-top: 10px;
    }

    .esu3_txt {
        font-size: 13px;
        letter-spacing: -1px;
    }
}

/* 교육시청 초기화면 CDEC-EDU-01 - LMS 레이아웃/디자인 */
.edu1 {
    width: 100%;
    margin-bottom: 10px;
}

.edu1_wrap {
    max-width: 1080px;
    margin: 0 auto;
    background-color: var(--lms-card);
    padding: 0;
    border-radius: 16px;
    box-shadow: var(--cdec-shadow-lg);
    border: 1px solid var(--lms-border);
    overflow: hidden;
}

/* 히어로 영역 */
.edu1_hero {
    background: linear-gradient(135deg, var(--lms-primary) 0%, var(--lms-primary-light) 50%, var(--lms-primary-dark) 100%);
    padding: 32px 40px 36px;
    text-align: center;
}

.edu1_hero_label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.9);
    margin: 0 0 8px 0;
    text-transform: uppercase;
}

.edu1_title {
    font-size: 26px;
    text-align: center;
    font-weight: 800;
    color: #fff;
    line-height: 1.4;
    letter-spacing: -0.5px;
    margin: 0;
}

.edu1_title_mobile {
    display: none;
}

.edu1_title span {
    color: rgba(255, 255, 255, 0.95);
    font-weight: 800;
}

.edu1_title b {
    color: #fff;
    font-weight: 900;
    display: block;
    margin-top: 4px;
    font-size: 28px;
}

/* 진행 단계 - 카드형 */
.edu_bar_wrap {
    width: 100%;
    list-style: none;
    padding: 24px 20px 28px;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 12px;
}

.edu_bar {
    flex: 1;
    min-width: 0;
    text-align: center;
    position: relative;
    background: var(--lms-bg);
    border: 2px solid var(--lms-border-light);
    border-radius: 12px;
    padding: 20px 8px 16px;
    transition: var(--cdec-transition-fast);
}

.edu_bar_or {
    font-size: 11px;
    text-align: center;
    font-weight: 800;
    color: var(--lms-text-muted);
    margin-bottom: 10px;
    letter-spacing: 0.3px;
    position: relative;
    z-index: 1;
}

.edu_bar_txt {
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    color: var(--lms-text-muted);
    margin: 0;
    position: relative;
    z-index: 1;
}

.bg_circle {
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin: 0 auto 12px;
    background-color: var(--lms-border);
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edu_progress li.active .bg_circle {
    background: #4F46E5;
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.35);
}

.edu_progress li.active {
    background: rgba(79, 70, 229, 0.06);
    border-color: #6366F1;
}

.in_circle {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.edu_progress li.active .in_circle {
    background: rgba(255, 255, 255, 0.5);
}

.edu_progress li.active .edu_bar_or,
.edu_progress li.active .edu_bar_txt {
    color: #4F46E5;
}

/* LMS 스텝: 진행 중인 스텝 (인디고 톤, 에메랄드 과다 완화) */
.edu_bar_wrap.lms-stepper .edu_bar {
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}

.edu_bar_wrap.lms-stepper .edu_bar.active {
    background: linear-gradient(145deg, #4338CA 0%, #4F46E5 40%, #6366F1 100%);
    border-color: transparent;
    box-shadow: 0 8px 24px rgba(79, 70, 229, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
    transform: translateY(-4px) scale(1.02);
    animation: lmsStepGlow 2.5s ease-in-out infinite;
}

@keyframes lmsStepGlow {

    0%,
    100% {
        box-shadow: 0 8px 24px rgba(79, 70, 229, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
    }

    50% {
        box-shadow: 0 12px 32px rgba(79, 70, 229, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.25) inset;
    }
}

.edu_bar_wrap.lms-stepper .edu_bar.active .edu_bar_or,
.edu_bar_wrap.lms-stepper .edu_bar.active .edu_bar_txt {
    color: #fff;
    font-weight: 800;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.edu_bar_wrap.lms-stepper .edu_bar.active .bg_circle {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.edu_bar_wrap.lms-stepper .edu_bar.active .in_circle {
    background: #6366F1;
}

.edu_bar_wrap.lms-stepper .edu_bar:not(.active) {
    background: #fff;
    border-color: var(--lms-border-light);
    opacity: 0.92;
}

/* 하단 액션(카운터·버튼·안내) */
.edu1_actions {
    padding: 0 40px 32px;
}

/* 순서(단계 카운터) */
.edu1_actions .corm,
.edu1_actions .corm_end {
    border-radius: 12px;
    padding: 12px 24px;
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    width: auto;
    min-width: 120px;
    margin: 0 auto;
    display: inline-block;
    box-sizing: border-box;
}

.corm_co {
    color: var(--lms-text);
    font-size: 18px;
    font-weight: 800;
    text-align: center;
    letter-spacing: -0.5px;
    line-height: 1.4;
    margin: 0;
}

.corm_co span {
    color: var(--lms-primary);
}

.edu_btn_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
    max-width: 100%;
}

.edu_w_btn {
    min-width: 140px;
    height: 48px;
    font-size: 16px;
    font-weight: 700;
    border: 0;
    background-color: var(--lms-primary);
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: #fff;
    transition: var(--cdec-transition);
    box-shadow: var(--cdec-shadow-sm);
    cursor: pointer;
}

.edu_w_btn:hover {
    background-color: var(--lms-primary-light);
    box-shadow: var(--cdec-shadow-md);
    transform: translateY(-2px);
}

.edu_w_btn_primary {
    min-width: 180px;
    height: 52px;
    font-size: 17px;
    box-shadow: 0 4px 14px rgba(5, 150, 105, 0.35);
}

.edu_w_btn_primary:hover {
    box-shadow: 0 6px 20px rgba(5, 150, 105, 0.4);
}

.edu_w_btn:not(.edu_w_btn_primary) {
    background-color: transparent;
    color: var(--lms-primary);
    border: 2px solid var(--lms-primary);
}

.edu_w_btn:not(.edu_w_btn_primary):hover {
    background-color: rgba(5, 150, 105, 0.08);
}

.edu1_txt {
    text-align: center;
    margin-top: 16px;
    font-size: 15px;
    color: var(--lms-text-muted);
    font-weight: 600;
    margin-bottom: 0;
}

@media screen and (max-width:992px) {
    .edu1_wrap {
        max-width: 720px;
    }

    .edu1_hero {
        padding: 28px 30px 30px;
    }

    .edu1_title {
        font-size: 24px;
    }

    .edu1_title b {
        font-size: 26px;
    }

    .edu1_actions {
        padding: 0 30px 28px;
    }

    .edu_bar_wrap {
        padding: 20px 16px 24px;
    }

    .edu_bar_or {
        font-size: 11px;
    }

    .edu_bar_txt {
        font-size: 13px;
    }

    .edu_btn_wrap {
        margin-top: 20px;
        gap: 10px;
    }

    .edu_w_btn {
        min-width: 130px;
        height: 46px;
        font-size: 15px;
    }

    .edu_w_btn_primary {
        min-width: 160px;
        height: 50px;
        font-size: 16px;
    }
}

@media screen and (max-width:768px) {
    .edu1_hero {
        padding: 24px 20px 28px;
    }

    .edu1_title {
        font-size: 22px;
        line-height: 1.4;
    }

    .edu1_title b {
        font-size: 24px;
    }

    .edu1_actions {
        padding: 0 20px 24px;
    }

    .edu_bar_wrap {
        padding: 16px 12px 20px;
        gap: 8px;
    }

    .edu_bar {
        padding: 14px 6px 12px;
    }

    .bg_circle {
        width: 32px;
        height: 32px;
        margin-bottom: 10px;
    }

    .in_circle {
        width: 14px;
        height: 14px;
    }

    .edu1_actions .corm,
    .edu1_actions .corm_end {
        padding: 10px 20px;
    }

    .corm_co {
        font-size: 16px;
    }

    .edu_btn_wrap {
        margin-top: 18px;
    }

    .edu_w_btn {
        min-width: 120px;
        height: 44px;
        font-size: 15px;
    }

    .edu_w_btn_primary {
        min-width: 140px;
        height: 48px;
        font-size: 16px;
    }

    .edu1_txt {
        font-size: 14px;
        margin-top: 12px;
    }
}

@media screen and (max-width:632px) {
    .edu1_hero {
        padding: 20px 16px 24px;
    }

    .edu1_title {
        font-size: 20px;
    }

    .edu1_title b {
        font-size: 22px;
    }

    .edu1_actions {
        padding: 0 16px 20px;
    }

    .edu_bar_wrap {
        padding: 12px 8px 16px;
        gap: 6px;
    }

    .edu_bar {
        padding: 12px 4px 10px;
    }

    .edu_bar_or {
        font-size: 10px;
    }

    .edu_bar_txt {
        font-size: 12px;
    }

    .bg_circle {
        width: 28px;
        height: 28px;
        margin-bottom: 8px;
    }

    .in_circle {
        width: 12px;
        height: 12px;
    }

    .edu1_txt {
        font-size: 14px;
    }

    .edu_btn_wrap {
        max-width: 100%;
    }
}

@media screen and (max-width:582px) {
    .edu1_title {
        font-size: 19px;
        letter-spacing: -0.5px;
    }
}

@media screen and (max-width:542px) {
    .edu1_title_mobile {
        display: block;
    }

    .edu1_title_pc {
        display: none;
    }

    .edu_bar_or {
        font-size: 10px;
    }

    .edu_bar_txt {
        font-size: 12px;
    }

    .bg_circle {
        width: 24px;
        height: 24px;
        margin-bottom: 6px;
    }

    .in_circle {
        width: 10px;
        height: 10px;
    }

    .corm,
    .corm_end {
        padding: 8px 16px;
    }

    .corm_co {
        font-size: 15px;
    }

    .edu_btn_wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 16px;
        gap: 10px;
    }

    .edu_w_btn {
        width: 100%;
        max-width: 280px;
        font-size: 15px;
        margin-bottom: 0;
    }

    .edu1_txt {
        font-size: 14px;
        margin-top: 12px;
    }
}

@media screen and (max-width:462px) {
    .edu1_title {
        font-size: 18px;
        line-height: 26px;
    }

    .edu_bar_or {
        font-size: 10px;
    }

    .edu_bar_txt {
        font-size: 12px;
    }

    .bg_circle {
        width: 22px;
        height: 22px;
        margin-bottom: 6px;
    }

    .in_circle {
        width: 10px;
        height: 10px;
    }

    .corm,
    .corm_end {
        padding: 8px 14px;
    }

    .corm_co {
        font-size: 15px;
    }

    .edu_w_btn {
        max-width: 260px;
    }
}

@media screen and (max-width:368px) {
    .edu1_title {
        font-size: 17px;
        line-height: 1.35;
    }

    .corm_co {
        font-size: 14px;
    }
}

/* ===== LMS EDU 고도화 - 전문 시스템 스타일 ===== */
.lms-edu-body {
    background: linear-gradient(180deg, #F1F5F9 0%, #F8FAFC 24%, #FFFFFF 100%);
    min-height: 100vh;
}

.lms-edu-section {
    padding-top: 24px;
}

.lms-dashboard {
    animation: lmsDashboardIn 0.5s ease;
}

@keyframes lmsDashboardIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.lms-dashboard-card {
    box-shadow: 0 4px 24px rgba(30, 41, 59, 0.08), 0 0 0 1px rgba(5, 150, 105, 0.06);
    border-radius: 20px;
    overflow: hidden;
}

/* 히어로 - LMS 그라디언트 + 패턴 */
.edu1_hero.lms-hero {
    position: relative;
    padding: 40px 48px 44px;
    background: linear-gradient(145deg, #047857 0%, #059669 28%, #10B981 60%, #059669 100%);
    overflow: hidden;
}

.lms-hero-pattern {
    position: absolute;
    inset: 0;
    opacity: 0.06;
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h40v40H0z' fill='none'/%3E%3Cpath d='M20 0v40M0 20h40' stroke='%23fff' stroke-width='.5'/%3E%3C/svg%3E");
    pointer-events: none;
}

.edu1_hero_label.lms-hero-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 12px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 9999px;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.lms-hero-greeting {
    display: block;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.4px;
    line-height: 1.5;
}

.edu1_title .lms-hero-meta {
    display: block;
    font-size: 18px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    margin-top: 4px;
}

.edu1_title .lms-hero-heading {
    display: block;
    margin-top: 14px;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -0.5px;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

/* 스텝퍼 (연결선 없음) */
.lms-stepper-wrap {
    padding: 28px 24px 32px;
    position: relative;
}

.edu_bar_wrap.lms-stepper {
    position: relative;
    padding: 0 8px;
}

.edu_bar_wrap.lms-stepper .edu_bar {
    position: relative;
    z-index: 1;
}

.lms-actions {
    padding: 0 48px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

.lms-progress-stat {
    margin-bottom: 20px;
    width: 100%;
    max-width: 320px;
    display: flex;
    justify-content: center;
}

.lms-progress-stat.corm {
    margin: 0 0 20px 0;
    padding: 10px 20px;
    border-radius: 12px;
    background: var(--lms-bg);
    border: 1px solid var(--lms-border-light);
    min-width: 0;
    width: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.lms-progress-stat .corm_co {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.3px;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: center;
}

.lms-progress-stat .corm_co span,
.lms-progress-stat .corm_co .corm_highlight {
    font-size: 18px;
    font-weight: 800;
    color: var(--lms-primary);
}

.lms-actions .edu_btn_wrap {
    margin-top: 0;
}

.corm_highlight {
    color: var(--lms-primary) !important;
    font-weight: 800;
}

.edu_w_btn.lms-cta {
    min-width: 200px;
    height: 54px;
    font-size: 17px;
    font-weight: 800;
    border-radius: 14px;
    box-shadow: 0 6px 20px rgba(5, 150, 105, 0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.edu_w_btn.lms-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 28px rgba(5, 150, 105, 0.4);
}

.lms-cta-icon {
    margin-right: 8px;
    font-size: 14px;
    opacity: 0.95;
}

.edu1_txt.lms-duration {
    font-size: 15px;
    color: var(--lms-text-muted);
    margin-top: 18px;
}

.lms-actions-complete .edu_btn_wrap {
    margin-top: 8px;
}

.lms-complete-btns {
    gap: 14px;
}

.edu_w_btn.lms-cta-outline {
    border: 2px solid var(--lms-border);
    color: var(--lms-text);
    background: #fff;
}

.edu_w_btn.lms-cta-outline:hover {
    background: var(--lms-bg);
    border-color: var(--lms-primary);
    color: var(--lms-primary);
}

@media screen and (max-width:768px) {
    .edu1_hero.lms-hero {
        padding: 28px 24px 32px;
    }

    .edu1_title .lms-hero-heading {
        font-size: 24px;
        margin-top: 10px;
    }

    .lms-hero-greeting {
        font-size: 19px;
    }

    .lms-actions {
        padding: 0 24px 32px;
    }

    .lms-progress-stat {
        margin-bottom: 16px;
    }

    .lms-progress-stat.corm {
        padding: 8px 16px;
    }

    .lms-progress-stat .corm_co {
        font-size: 14px;
    }

    .lms-progress-stat .corm_co span,
    .lms-progress-stat .corm_co .corm_highlight {
        font-size: 16px;
    }

    .edu_bar_wrap.lms-stepper .edu_bar.active {
        transform: translateY(-2px) scale(1.01);
    }
}

@media screen and (max-width:542px) {
    .edu1_title .lms-hero-heading {
        font-size: 22px;
    }

    .lms-progress-stat {
        margin-bottom: 14px;
    }

    .lms-progress-stat.corm {
        padding: 8px 14px;
    }

    .lms-progress-stat .corm_co {
        font-size: 13px;
    }

    .lms-progress-stat .corm_co span,
    .lms-progress-stat .corm_co .corm_highlight {
        font-size: 15px;
    }
}

@media screen and (max-width:375px) {
    .edu1_title .lms-hero-heading {
        font-size: 19px;
    }

    .lms-hero-greeting {
        font-size: 16px;
        line-height: 1.3;
    }

    .edu1_title .lms-hero-meta {
        font-size: 14px;
    }

    .edu1_hero.lms-hero {
        padding: 20px 16px 24px;
    }

    .lms-progress-stat {
        margin-bottom: 12px;
    }

    .lms-progress-stat.corm {
        padding: 6px 12px;
    }

    .lms-progress-stat .corm_co {
        font-size: 12px;
    }

    .lms-progress-stat .corm_co span,
    .lms-progress-stat .corm_co .corm_highlight {
        font-size: 14px;
    }
}

/* 교육 영상시청 CDEC-EDU-02 */
.grid-container {
    max-width: 1080px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1.5fr 1fr;
    gap: 10px;
    margin: 0 auto;
    margin-bottom: 10px;
}

/* 영상(좌 2열) + 목차(우 1열) / 공지(하단 좌 2열) 레이아웃 (B) */
.grid-container.lms-player-grid {
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1.5fr 1fr;
    gap: 16px;
}

.lms-player-grid .edu_video_wrap {
    grid-column: 1 / 3;
    grid-row: 1 / 2;
    max-width: 720px;
    min-width: 0;
}

.lms-player-grid .edu_index_wrap {
    grid-column: 3;
    grid-row: 1 / 3;
}

.lms-player-grid .edu_ann_wrap {
    grid-column: 1 / 3;
    grid-row: 2;
}

/* 교육 영상시청  */
.edu_video_wrap {
    grid-column: 1/3;
    grid-row: 1/2;
    box-shadow: var(--cdec-shadow-md);
    background-color: var(--lms-card);
    padding: 15px 15px;
    border-radius: 12px;
    max-width: 720px;
    height: auto;
    border: 1px solid var(--lms-border);
}

/* 1280x720(16:9) 영상 비율 맞춤 - 레터박스/필러박스 방지 */
.edu_video_wrap_16x9 {
    display: flex;
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
}

.edu_video_wrap_16x9 .video-js {
    flex: 1;
    min-height: 0;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0;
    overflow: visible;
}

.edu_vidio {
    width: 100%;
    max-width: 100%;
    height: auto;
}

/* 목차 */
.edu_index_wrap {
    grid-column: 3;
    grid-row: 1/3;
    box-shadow: var(--cdec-shadow-md);
    background-color: var(--lms-card);
    border: 1px solid var(--lms-border);
    padding: 15px;
    border-radius: 12px;
}

.edu_index_title {
    font-size: 25px;
    font-weight: 900;
    color: #222;
    text-align: center;
}

.edu_index_title::before {
    content: "";
    display: inline-block;
    background-image: url(../img/edu_ann_icon.png);
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    width: 28px;
    height: 35px;
}

.video_in_wrap {
    height: 559px;
    overflow-x: hidden;
    border: 1px solid var(--lms-border);
    border-radius: 8px;
}

.lms-player-grid .video_in_wrap {
    height: 520px;
}

.video_in_wrap::-webkit-scrollbar {
    width: 12px;
}

.video_in_wrap::-webkit-scrollbar-thumb {
    background-color: var(--lms-primary);
    border-radius: 6px;
}

.video_in_wrap::-webkit-scrollbar-track {
    background-color: var(--lms-bg);
    border-radius: 6px;
}

.video_in {
    padding-left: 0;
    margin-bottom: 0;
}

.video_in_txt {
    background-color: var(--lms-bg);
    color: var(--lms-text);
    font-weight: 700;
    font-size: 17px;
    padding: 10px;
    border-bottom: 1px solid var(--lms-border-light);
    transition: all 0.1s;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
}

.video_in_txt span {
    margin-left: auto;
}

.video_in_txt:hover,
.video_in_txt.on {
    background-color: var(--lms-primary);
    color: #fff;
}

/* 공지사항 */
.edu_ann_wrap {
    box-shadow: var(--cdec-shadow-md);
    background-color: var(--lms-card);
    border: 1px solid var(--lms-border);
    padding: 10px 10px;
    border-radius: 12px;
    grid-column: 1/3;
}

.lms-player-grid .edu_ann_wrap {
    grid-column: 1 / 3;
}

.edu_ann_title {
    font-size: 25px;
    font-weight: 900;
    color: #222;
    text-align: center;
}

.edu_ann_txt {
    border-top: 2px solid #dddddd;
    padding: 0px 10px;
}

.edu_ann_txt p {
    margin-bottom: 5px;
    font-size: 15px;
    font-weight: 700;
    color: #555;
    letter-spacing: -1px;
}

.edu_ann_txt p::before {
    display: inline-block;
    width: 5px;
    height: 5px;
    background-color: var(--lms-primary);
    vertical-align: middle;
    border-radius: 50%;
    margin-right: 5px;
}

.edu_ann_title::before {
    content: "";
    display: inline-block;
    background-image: url(../img/edu_index_icon.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 30px;
    height: 30px;
    vertical-align: -5px;
    margin-right: 2px;
}

@media screen and (max-width:1024px) {

    /* 목차 */
    .video_in_txt {
        font-size: 16px;
    }
}

@media screen and (max-width:992px) {
    .grid-container {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        max-width: 720px;
        gap: 10px 0px;
    }

    .grid-container.lms-player-grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .lms-player-grid .edu_video_wrap,
    .lms-player-grid .edu_index_wrap,
    .lms-player-grid .edu_ann_wrap {
        grid-column: 1;
        grid-row: auto;
        min-width: 0;
    }

    /* 모바일: 영상 카드 높이 고정 (세로 짧을 때도 영상 보이도록) */
    .edu_video_wrap {
        height: 240px !important;
        min-height: 240px;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .edu_video_wrap_16x9,
    .lms-player-page .edu_video_wrap_16x9 {
        height: auto !important;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .lms-player-page .edu_video_wrap {
        height: 240px !important;
        min-height: 240px;
    }

    .edu_video_wrap .video-js {
        width: 100% !important;
        height: 100% !important;
        flex: 1;
        min-height: 0;
    }

    .edu_video_wrap .edu_vidio,
    .edu_video_wrap .video-js video,
    .edu_video_wrap .video-js .vjs-tech {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* 교육 영상시청 */
    .edu_vidio {
        grid-row: auto;
        grid-column: 1 / 2;
        width: 100%;
        height: auto;
    }

    /* 목차 */
    .edu_index_wrap {
        grid-column: 1 / 2;
        grid-row: auto;
    }

    .video_in_wrap {
        height: 180px;
    }

    .video_in_txt {
        font-size: 17px;
    }

    /* 공지사항 */
    .edu_ann_wrap {
        grid-column: 1 / 2;
        grid-row: auto;
        max-width: 720px;
        padding: 10px 10px;
    }

    /* 섹션박스4(하단 버튼) */
    .sec_box4_evi {
        display: none;
    }
}

@media screen and (max-width:768px) {

    /* 교육 영상시청 - 모바일에서도 영상 보이도록 고정 높이 */
    .edu_video_wrap {
        padding: 10px 10px 5px;
        height: 220px !important;
        min-height: 220px;
    }

    .edu_video_wrap_16x9,
    .lms-player-page .edu_video_wrap_16x9 {
        height: auto !important;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .lms-player-page .edu_video_wrap {
        height: 220px !important;
        min-height: 220px;
    }

    .edu_video_wrap .video-js,
    .edu_video_wrap .edu_vidio {
        min-height: 0;
    }

    /* 목차 */
    .edu_index_wrap {
        padding: 10px 10px 10px;
    }

    .edu_index_title {
        font-size: 22px;
        margin-bottom: 5px;
    }

    .edu_index_title::before {
        width: 25px;
        height: 30px;
    }

    .video_in_wrap {
        height: 170px;
    }

    .video_in_txt {
        font-size: 15px;
    }

    /* 공지사항 */
    .edu_ann_wrap {
        padding: 10px 10px;
    }

    .edu_ann_title {
        font-size: 22px;
        margin-bottom: 5px;
    }

    .edu_ann_title::before {
        width: 25px;
        height: 25px;
    }

    .edu_ann_txt p {
        font-size: 13px;
    }
}

/* 모바일 가로(랜드스케이프): 영상이 잘리지 않도록 뷰포트 안에 맞춤 */
@media screen and (orientation: landscape) and (max-height: 500px) {
    .lms-player-section {
        padding-left: 12px;
        padding-right: 12px;
    }

    .lms-player-grid {
        padding: 0 8px;
        max-width: 100%;
    }

    .lms-player-page .edu_video_wrap {
        padding: 8px;
        max-width: 100%;
        min-width: 0;
    }

    .lms-player-page .edu_video_wrap.edu_video_wrap_16x9 {
        max-width: 100%;
        min-width: 0;
    }

    .lms-player-page .edu_video_wrap.edu_video_wrap_16x9 .video-js {
        min-width: 0;
    }
}

@media screen and (max-width:462px) {

    /* 영상 영역 고정 높이 (작은 화면에서도 영상 보이도록) */
    .edu_video_wrap,
    .lms-player-page .edu_video_wrap {
        height: 200px !important;
        min-height: 200px;
    }

    .edu_video_wrap_16x9,
    .lms-player-page .edu_video_wrap_16x9 {
        height: auto !important;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    /* 목차 */
    .edu_index_title {
        font-size: 19px;
    }

    .edu_index_title::before {
        width: 21px;
        height: 27px;
    }

    .video_in_txt {
        font-size: 14px;
    }

    /* 공지사항 */
    .edu_ann_title {
        font-size: 19px;
    }

    .edu_ann_title::before {
        width: 22px;
        height: 22px;
    }
}

/* ===== LMS 플레이어 페이지 고도화 (CDEC-EDU-02) ===== */
.lms-player-section {
    padding-top: 24px;
    padding-bottom: 24px;
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
    box-sizing: border-box;
}

.lms-player-grid {
    max-width: 1100px;
    width: 100%;
    margin: 0 auto 24px;
    gap: 16px;
    padding: 0 16px;
    box-sizing: border-box;
}

.lms-player-page .edu_video_wrap {
    border-radius: 16px;
    padding: 16px;
    border: 1px solid var(--lms-border);
    box-shadow: 0 4px 20px rgba(30, 41, 59, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.02);
    position: relative;
    overflow: hidden;
}

.lms-player-page .edu_video_wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--lms-primary) 0%, var(--lms-primary-light) 100%);
    border-radius: 16px 16px 0 0;
    z-index: 1;
}

.lms-player-page .edu_video_wrap .video-js {
    border-radius: 12px;
    overflow: hidden;
}

.lms-player-page .edu_video_wrap.edu_video_wrap_16x9 {
    border-radius: 0;
    aspect-ratio: 16 / 9;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    min-height: 0;
    min-width: 0;
    display: flex;
}

.lms-player-page .edu_video_wrap.edu_video_wrap_16x9::before {
    border-radius: 0;
}

.lms-player-page .edu_video_wrap.edu_video_wrap_16x9 .video-js {
    flex: 1;
    min-height: 0;
    border-radius: 0;
    overflow: visible;
}

.lms-player-page .edu_video_wrap.edu_video_wrap_16x9 .video-js video,
.lms-player-page .edu_video_wrap.edu_video_wrap_16x9 .video-js .vjs-tech,
.lms-player-page .edu_video_wrap.edu_video_wrap_16x9 .edu_vidio {
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
}

.lms-player-page .edu_video_wrap .video-js video,
.lms-player-page .edu_video_wrap .video-js .vjs-tech,
.lms-player-page .edu_video_wrap .edu_vidio {
    width: 100% !important;
    height: 100% !important;
}

.lms-player-page .edu_index_wrap {
    border-radius: 16px;
    padding: 0;
    border: 1px solid var(--lms-border);
    box-shadow: 0 4px 20px rgba(30, 41, 59, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.02);
    overflow: hidden;
    background: var(--lms-card);
}

.lms-player-page .edu_index_title {
    font-size: 18px;
    font-weight: 800;
    color: var(--lms-text);
    letter-spacing: -0.4px;
    padding: 16px 16px 14px;
    margin: 0;
    text-align: left;
    border-bottom: 2px solid var(--lms-border-light);
    background: linear-gradient(180deg, var(--lms-bg) 0%, var(--lms-card) 100%);
}

.lms-player-page .edu_index_title::before {
    display: none;
}

.lms-player-page .edu_index_wrap .video_in_wrap {
    height: 520px;
    border: none;
    border-radius: 0;
    background: var(--lms-card);
}

.lms-player-page .video_in_txt {
    padding: 12px 16px;
    font-size: 15px;
    font-weight: 600;
    border-bottom: 1px solid var(--lms-border-light);
    transition: background 0.2s ease, color 0.2s ease;
}

.lms-player-page .video_in_txt:hover {
    background: rgba(5, 150, 105, 0.06);
    color: var(--lms-primary);
}

.lms-player-page .video_in_txt.on {
    background: linear-gradient(90deg, rgba(5, 150, 105, 0.12) 0%, rgba(5, 150, 105, 0.06) 100%);
    color: var(--lms-primary);
    border-left: 3px solid var(--lms-primary);
    font-weight: 700;
}

.lms-player-page .video_in_txt span {
    font-size: 13px;
    font-weight: 600;
    color: var(--lms-text-muted);
}

.lms-player-page .video_in_txt.on span {
    color: var(--lms-primary);
}

.lms-player-page .edu_ann_wrap {
    border-radius: 16px;
    padding: 0;
    border: 1px solid var(--lms-border);
    box-shadow: 0 4px 20px rgba(30, 41, 59, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.02);
    overflow: hidden;
}

.lms-player-page .edu_ann_title {
    font-size: 18px;
    font-weight: 800;
    color: var(--lms-text);
    letter-spacing: -0.4px;
    padding: 16px 16px 14px;
    margin: 0;
    text-align: left;
    border-bottom: 2px solid var(--lms-border-light);
    background: linear-gradient(180deg, var(--lms-bg) 0%, var(--lms-card) 100%);
}

.lms-player-page .edu_ann_title::before {
    display: none;
}

.lms-player-page .edu_ann_txt {
    border-top: none;
    padding: 16px 20px 20px;
}

.lms-player-page .edu_ann_txt p {
    font-size: 14px;
    font-weight: 500;
    color: var(--lms-text);
    line-height: 1.6;
    margin-bottom: 8px;
}

.lms-player-page .edu_ann_txt p:last-child {
    margin-bottom: 0;
}

.lms-player-page .edu_ann_txt p::before {
    background-color: var(--lms-primary);
}

@media screen and (max-width:992px) {
    .lms-player-grid {
        padding: 0 12px;
        gap: 14px;
    }

    .lms-player-page .edu_index_wrap .video_in_wrap {
        height: 200px;
    }
}

@media screen and (max-width:768px) {
    .lms-player-section {
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .lms-player-grid {
        padding: 0 12px;
        margin-bottom: 16px;
        gap: 12px;
    }

    .lms-player-page .edu_video_wrap {
        padding: 12px;
        height: auto !important;
    }

    .lms-player-page .edu_index_title,
    .lms-player-page .edu_ann_title {
        padding: 14px 14px 12px;
        font-size: 17px;
    }

    .lms-player-page .edu_index_wrap .video_in_wrap {
        height: 180px;
    }

    .lms-player-page .video_in_txt {
        padding: 10px 14px;
        font-size: 14px;
    }

    .lms-player-page .edu_ann_txt {
        padding: 14px 16px 16px;
    }

    .lms-player-page .edu_ann_txt p {
        font-size: 13px;
    }
}

@media screen and (max-width:462px) {

    .lms-player-page .edu_index_title,
    .lms-player-page .edu_ann_title {
        font-size: 16px;
        padding: 12px 12px 10px;
    }

    .lms-player-page .video_in_txt {
        padding: 10px 12px;
        font-size: 13px;
    }

    .lms-player-page .video_in_txt span {
        font-size: 12px;
    }
}

/* 플레이어 페이지 내 다음/평가 팝업 LMS 스타일 */
.lms-player-page .nextPopup,
.lms-player-page .nextEvalPopup {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
}

.lms-player-page .nextPopup>.title,
.lms-player-page .nextEvalPopup>.title {
    background: linear-gradient(135deg, var(--lms-primary) 0%, var(--lms-primary-light) 100%);
    border-radius: 16px 16px 0 0;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    letter-spacing: -0.3px;
}

.lms-player-page .nextPopup>.content,
.lms-player-page .nextEvalPopup>.content {
    padding: 24px;
    font-size: 15px;
    color: var(--lms-text);
    line-height: 1.6;
}

.lms-player-page .nextPopup>.cmd,
.lms-player-page .nextEvalPopup>.cmd {
    padding: 16px 24px 20px;
}

.lms-player-page .nextPopup>.cmd .button,
.lms-player-page .nextEvalPopup>.cmd .button {
    border-radius: 12px;
    padding: 12px 24px;
    background: var(--lms-primary);
    color: #fff;
    border: none;
    font-weight: 700;
    transition: background 0.2s ease, transform 0.2s ease;
}

.lms-player-page .nextPopup>.cmd .button:hover,
.lms-player-page .nextEvalPopup>.cmd .button:hover {
    background: var(--lms-primary-light);
    color: #fff;
    transform: translateY(-1px);
}

/* 평가문제풀이 CDEC-EDU-03 */
.swiper-container {
    overflow: hidden;
    width: 100%;
}

.edu3_wrap {
    width: 100%;
    max-width: 1080px;
    margin: 10px auto;
    background-color: var(--lms-card);
    padding: 25px 40px 10px;
    border-radius: 12px;
    box-shadow: var(--cdec-shadow-md);
    border: 1px solid var(--lms-border);
}

.edu3_title {
    font-size: 30px;
    text-align: center;
    font-weight: 900;
    color: #333;
    line-height: 40px;
}

/* 평가 내용 */
.edu3_txt_wrap {
    background-color: var(--lms-bg);
    padding: 20px;
    border-radius: 8px;
    text-align: left;
    border: 1px solid var(--lms-border-light);
}

.edu3_txt_wrap p {
    margin-bottom: 2px;
    font-size: 15px;
    font-weight: 700;
    color: #333;
    letter-spacing: -1px;
}

.edu3_txt_wrap p:last-child {
    margin-bottom: 0;
    color: var(--lms-primary);
    background: rgba(5, 150, 105, 0.1);
    padding: 10px 14px;
    border-radius: 8px;
    border-left: 4px solid var(--lms-primary);
    font-weight: 700;
    letter-spacing: -0.3px;
}

.edu3_txt_wrap p span {
    color: var(--lms-primary);
    font-weight: 700;
}

/* 문제 */
.edu3_qu {
    margin-top: 30px;
    text-align: left;
}

.edu3_qu_top {
    position: relative;
    height: 35px;
    width: 100%;
    border-bottom: 2px solid var(--lms-border);
}

.edu3_qu_top h5 {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    letter-spacing: -1px;
}

.edu3_qu_top p {
    margin-bottom: 0;
    position: absolute;
    top: 5px;
    right: 0;
    color: #555;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -1px;
}

.edu3_qu_middle {
    padding: 30px 40px;
}

.edu3_qu_middle p {
    font-size: 17px;
    font-weight: 700;
    color: #333;
    margin-bottom: 15px;
    cursor: pointer;
    transition: all 0.1s;
}

.edu3_qu_middle p:last-child {
    margin-bottom: 0;
}

.edu3_qu_middle p:hover,
.edu3_qu_middle p.on {
    color: var(--lms-accent);
}

.edu3_qu_middle input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    border: none;
}

/* 이전문제 버튼*/
.edu2_btn {
    float: left;
    color: var(--lms-accent);
    font-weight: 900;
    border: 2px solid var(--lms-accent);
    background-color: var(--lms-card);
    padding: 4px 12px;
    border-radius: 50px;
    transition: all 0.2s;
    font-size: 17px;
}

.edu2_btn:hover {
    background-color: rgba(245, 158, 11, 0.1);
}

/* 다음문제 버튼*/
.edu3_btn {
    float: right;
    color: var(--lms-accent);
    font-weight: 900;
    border: 2px solid var(--lms-accent);
    background-color: var(--lms-card);
    padding: 4px 12px;
    border-radius: 50px;
    transition: all 0.2s;
    font-size: 17px;
}

.edu3_btn:hover {
    background-color: rgba(245, 158, 11, 0.1);
}

/* 제출하기 버튼*/
.edu4_btn {
    float: right;
    color: var(--lms-primary);
    font-weight: 900;
    border: 2px solid var(--lms-primary);
    background-color: var(--lms-card);
    padding: 4px 12px;
    border-radius: 50px;
    transition: all 0.2s;
    font-size: 17px;
}

.edu4_btn:hover {
    background-color: rgba(5, 150, 105, 0.1);
}

/* 평가 네비: float 대신 flex — .edu3_corm이 버튼 위에 겹쳐 제출 클릭이 막히는 현상 방지 */
.edu3_qu_actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    margin-top: 8px;
    position: relative;
    z-index: 2;
}

.edu3_qu_actions--end {
    justify-content: flex-end;
}

.edu3_qu_actions .edu2_btn,
.edu3_qu_actions .edu3_btn,
.edu3_qu_actions .edu4_btn {
    float: none;
}

/* 페이지 */
.edu3_corm {
    clear: both;
    position: relative;
    z-index: 0;
}

.edu3_corm_co {
    text-align: center;
    margin-top: 52px;
    font-size: 16px;
    font-weight: 500;
    color: #000000;
}

@media screen and (max-width:992px) {
    .edu3_wrap {
        max-width: 720px;
        padding: 15px 40px;
    }

    .edu3_title {
        font-size: 25px;
    }

    /* 평가 내용 */
    .edu3_txt_wrap {
        padding: 15px;
    }

    .edu3_txt_wrap p {
        font-size: 14px;
    }

    /* 문제 */
    .edu3_qu {
        margin-top: 20px;
    }

    /* 문제 */
    .edu3_qu_top {
        height: 50px;
    }

    .edu3_qu_top h5 {
        font-size: 16px;
    }

    .edu3_qu_top p {
        top: 25px;
        font-size: 14px;
        text-align: center;
    }

    .edu3_qu_middle {
        padding: 25px 15px;
    }

    .edu3_qu_middle p {
        font-size: 16px;
        margin-bottom: 10px;
    }

    /* 이전문제 */
    .edu2_btn {
        font-size: 16px;
    }

    /* 다음문제 */
    .edu3_btn {
        font-size: 16px;
    }

    /* 제출하기 */
    .edu4_btn {
        font-size: 16px;
    }

    .edu3_corm_co {
        font-size: 15px;
    }
}

@media screen and (max-width:768px) {
    .edu3_wrap {
        padding: 10px 20px;
    }

    .edu3_title {
        font-size: 22px;
        margin-bottom: 0;
    }

    /* 문제 */
    .edu3_qu_top {
        height: 45px;
    }

    .edu3_qu_top h5 {
        font-size: 15px;
    }

    .edu3_qu_top p {
        top: 20px;
        font-size: 13px;
        text-align: center;
    }

    .edu3_qu_middle {
        padding: 20px 15px;
    }

    /* 이전문제 */
    .edu2_btn {
        font-size: 15px;
        border: 1px solid #f48120;
        font-weight: 700;
    }

    /* 다음문제 */
    .edu3_btn {
        font-size: 15px;
        border: 1px solid var(--lms-accent);
        font-weight: 700;
    }

    /* 제출하기 */
    .edu4_btn {
        font-size: 15px;
        border: 1px solid var(--lms-primary);
        font-weight: 700;
    }

    /* 페이지 */
    .edu3_corm_co {
        margin-top: 40px;
        font-size: 15px;
    }
}

@media screen and (max-width:500px) {

    /* 문제 */
    .edu3_qu_top {
        height: 52px;
    }

    .edu3_qu_top h5 {
        text-align: center;
        font-weight: 900;
        color: #555;
    }

    .edu3_qu_top p {
        top: 24px;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }
}

@media screen and (max-width:462px) {
    .edu3_wrap {
        padding: 5px 20px;
    }

    .edu3_title {
        font-size: 20px;
    }

    .edu3_txt_wrap {
        padding: 10px;
    }

    .edu3_txt_wrap p {
        font-size: 13px;
        margin-bottom: 1px;
    }

    /* 문제 */
    .edu3_qu_top {
        height: 50px;
    }

    .edu3_qu_top h5 {
        font-size: 13px;
    }

    .edu3_qu_top p {
        top: 29px;
        font-size: 12px;
        text-align: center;
    }

    .edu3_qu_middle p {
        font-size: 13px;
        margin-bottom: 4px;
    }

    /* 이전문제 */
    .edu2_btn {
        padding: 2px 10px;
        font-size: 14px;
        letter-spacing: -1px;
    }

    /* 다음문제 */
    .edu3_btn {
        padding: 2px 10px;
        font-size: 14px;
        letter-spacing: -1px;
    }

    /* 제출하기 */
    .edu4_btn {
        padding: 2px 10px;
        font-size: 14px;
        letter-spacing: -1px;
    }

    /* 페이지 */
    .edu3_corm_co {
        margin-bottom: 5px;
        font-size: 14px;
    }
}

@media screen and (max-width:368px) {
    .edu3_wrap {
        padding: 5px 10px;
    }

    .edu3_title {
        font-size: 17px;
    }

    /* 문제 */
    .edu3_qu_top {
        height: 50px;
    }

    .edu3_qu_top h5 {
        font-size: 13px;
    }

    .edu3_qu_top p {
        text-align: center;
        top: 29px;
        font-size: 12px;
    }

    .edu3_qu_middle {
        padding: 20px 10px;
    }

    /* 이전문제 */
    .edu2_btn {
        padding: 2px 10px;
        font-size: 13px;
        letter-spacing: -1px;
    }

    /* 다음문제 */
    .edu3_btn {
        padding: 2px 10px;
        font-size: 13px;
        letter-spacing: -1px;
    }

    /* 제출하기 */
    .edu4_btn {
        padding: 2px 10px;
        font-size: 13px;
        letter-spacing: -1px;
    }

    /* 페이지 */
    .edu3_corm_co {
        margin-bottom: 10px;
    }
}

/* 설문조사 CDEC-EDU-05 */
.edu5_wrap {
    max-width: 1080px;
    margin: 0 auto;
    background-color: #fff;
    padding: 25px 40px;
    border-radius: 10px;
    box-shadow: 0 0 10px #d1d1d1;
}

/* 설문조사 내용 */
.edu5_txt_wrap {
    background-color: var(--lms-bg);
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    border: 1px solid var(--lms-border-light);
}

.edu5_txt_wrap p {
    margin-bottom: 2px;
    font-size: 15px;
    font-weight: 700;
    color: #333;
    letter-spacing: -1px;
}

.edu5_txt_wrap p:last-child {
    margin-bottom: 0;
}

/* 설문조사 질문 */
.edu5_qu {
    margin-bottom: 40px;
}

.edu5_qu_title {
    font-size: 19px;
    font-weight: 900;
    color: #000000;
    margin-bottom: 15px;
}

.edu5_qu_wrap p,
.qu_wrap_txt {
    margin-bottom: 0px;
    font-size: 17px;
    font-weight: 700;
    color: #000;
    margin-bottom: 5px;
}

.qu_b_wrap {
    display: table;
}

.qu_wrap_txt span {
    color: #ff0000;
}

.edu5_qu_b_txt {
    font-size: 15px;
    font-weight: 700;
    color: #555;
    display: flex;
    align-items: center;
    gap: 5px;
    float: left;
    margin-right: 20px;
}

.edu5_qu_b_txt label:hover,
.edu5_qu_b_txt.on {
    color: #f48120;
}

/*  체크박스 스타일 */
.edu5_qu_b_txt [type="radio"] {
    vertical-align: middle;
    appearance: none;
    border: 1px solid rgb(144, 144, 144);
    border-radius: 50%;
    width: 10px;
    height: 10px;
}

.edu5_qu_b_txt [type="radio"]:checked {
    background-color: #f48120;
    border: 0;
    width: 10px;
    height: 10px;
}

.edu5_qu_b_txt [type="radio"]:hover {
    box-shadow: 0 0 5px rgb(255, 169, 32);
    cursor: pointer;
}

.edu5_qu_b_txt [type="radio"]:disabled {
    background-color: lightgray;
    box-shadow: none;
    opacity: 0.7;
    cursor: not-allowed;
}

.edu5_qu_b_txt label {
    cursor: pointer;
}

.edu5_qu_wrap_txt {
    font-size: 19px;
    font-weight: 800;
    color: #222;
}

.edu5_qu_in {
    width: 100%;
    height: 35px;
    border: 1px solid #c5c5c5;
    border-radius: 0px;
    outline: none;
    padding-left: 10px;
    background-color: #f4f4f4;
}

textarea.edu5_qu_in:disabled {
    background-color: #f0f0f0;
    border: 1px solid #cccccc;
    cursor: not-allowed;
}

/* 기타 작성 */
.l_in_txt {
    width: 160px;
    height: 25px;
    border: 1px solid #c5c5c5;
    border-radius: 0px;
    outline: none;
    padding-left: 5px;
    background-color: #f4f4f4;
}

/* 하단 버튼 */
.edu5_btn_wrap {
    width: 100%;
    display: flex;
    justify-content: center;
}

.edu5_btn_wrap button {
    border-radius: 5px;
    width: 50%;
    border: 0;
    height: 45px;
    font-size: 20px;
    color: #fff;
    font-weight: 700;
    padding: 0;
    transition: all 0.2s;
}

.edu5_btn1 {
    background-color: var(--lms-accent);
    margin-right: 10px;
}

.edu5_btn1:hover {
    background-color: var(--lms-accent-light);
}

.edu5_btn2 {
    background-color: var(--lms-primary);
}

.edu5_btn2:hover {
    background-color: var(--lms-primary-light);
}

@media screen and (max-width:992px) {
    .edu5_wrap {
        max-width: 720px;
        padding: 15px 40px;
    }

    .edu5_txt_wrap {
        padding: 15px;
    }

    .edu5_txt_wrap p {
        font-size: 14px;
    }

    /* 하단 버튼 */
    .edu5_btn_wrap {
        display: block;
    }

    .edu5_btn_wrap button {
        width: 100%;
    }

    .edu5_btn1 {
        margin-right: 0;
        margin-bottom: 10px;
    }
}

@media screen and (max-width:768px) {
    .edu5_txt_wrap {
        margin-bottom: 15px;
    }

    .edu5_wrap {
        padding: 10px 20px 15px;
    }

    .edu5_qu {
        margin-bottom: 40px;
    }

    .edu5_qu_title {
        font-size: 16px;
    }

    .edu5_qu_wrap p,
    .qu_wrap_txt {
        font-size: 15px;
        margin-bottom: 7px;
    }

    .edu5_qu_b_txt {
        font-size: 15px;
        margin-bottom: 0px;
    }

    .edu5_qu_wrap_txt {
        font-size: 15px;
    }
}

@media screen and (max-width:500px) {
    .edu5_txt_wrap {
        margin-bottom: 10px;
    }

    .edu5_qu {
        margin-bottom: 30px;
    }

    .edu5_qu_title {
        margin-bottom: 5px;
    }

    .edu5_qu_b_txt {
        float: none;
    }

    .edu5_qu_wrap {
        margin-bottom: 15px;
    }
}

@media screen and (max-width:462px) {
    .edu5_wrap {
        padding: 10px 20px 15px;
    }

    .edu5_txt_wrap {
        padding: 10px;
    }

    .edu5_txt_wrap p {
        font-size: 13px;
        margin-bottom: 1px;
    }

    .edu5_qu_title {
        font-size: 14px;
    }

    .edu5_qu_wrap p,
    .qu_wrap_txt {
        font-size: 13px;
    }

    .edu5_qu_b_txt {
        font-size: 13px;
    }

    /* 하단 버튼 */
    .edu5_btn_wrap button {
        font-size: 18px;
    }

    .edu5_btn_wrap button {
        height: 40px;
    }
}