.text-orange {color:#ff6600;}
.text-blue {color:var(--color02);}
.text-red    { color: #e6002d; } 
.text-pink   { color: #d6006e; } 
.text-purple { color: #6f2c91; }
.text-green  { color: #007934; } 
.text-mint   { color: #008485; } 
.text-navy   { color: #1f3763; } 

.custom-tbl td.text-orange,
.custom-tbl td.text-blue,
.custom-tbl td.text-red,
.custom-tbl td.text-pink,
.custom-tbl td.text-purple,
.custom-tbl td.text-green,
.custom-tbl td.text-mint,
.custom-tbl td.text-navy,
.custom-tbl td.text-black { font-weight: 400; }

.max694 {max-width:694px; width:100%;}
.max800 {max-width:800px; width:100%; display:block; margin:50px auto;}
.max1200 {max-width:1200px; width:100%; margin:0 auto;}

.sub {width:100%; overflow-x:hidden;}
.sub-visual-wrap {
    position:relative;
    z-index:5;
}
.subVisualCenter {
    position:absolute;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
    z-index:3;
}
.subVisualCenter01 {
    z-index:1;
}
.subVisualDeco {
    position:absolute;
    bottom:140px;
    left:50%;
    transform:translateX(-50%);
    z-index:2;
}
.subVisualBg {
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    z-index:-1;
}
/* --- 1. Depth 1 --- */
.depth1-zone {
    width: 100%;
    background-color: #333; /* 기본 배경(비활성색) */
}
.d1-list {
    display: flex;
    width: 100%;
   
}
.d1-list li {
    flex:1;
    height: 50px;     
}
.d1-list li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 20px;
    font-weight:400;
    color:#fff; 
    background-color: #333; 
}
/* 활성화 상태 */
.d1-list li.active a {
    background-color: #004ea2; /* 파란색 배경 */
    color: #fff;
    font-weight:500;
}
.d1-list li:hover a,
.d1-list li.active:hover a {
    background-color:var(--hover);
}
/* --- 2. Depth 2 --- */
.depth2-zone {
    width: 100%;
    border-bottom: 1px solid #e5e5e5;
    background: #fff;
}
.d2-list {
    display: flex;
    justify-content: center;
    gap:50px; 
    align-items: center;
}
.d2-list li a {
    font-size: 17px;
    font-weight: 300;
    color: #000;
    height: 50px;
    line-height: 50px;
    display: block;
    position: relative;
}
/* 활성화 상태 */
.d2-list li.on a {
    font-weight: 500; 
    border-bottom:3px solid var(--color02);
}

/* --- 3. 비주얼 영역 (Visual Zone) --- */
.visual-zone {
    position: relative;
    width: 100%;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: space-between; 
    align-items: center;

    background-image: url('../../_images/sub/sub_visual_pattern.png');
    background-repeat: repeat;
    background-size: 24px 24px;
    background-position: 0 0; /* 필요하면 12px 12px 이런 식 */    
}
/* 3-1. Depth 3 (Breadcrumb) */
.depth3-zone {
    width: 100%;
    margin-top: 20px;
    position: relative;
    z-index: 10;
}
.breadcrumb {
    display: flex;
    justify-content: center;
    align-items: center;
}
.breadcrumb li {
    display: flex;
    flex-direction:row;
    align-items: center;
    position:relative;
}
.breadcrumb li:not(:last-child) {
    margin-right:30px;
}
.breadcrumb li:not(:last-child)::after {
    content:'';
    width:6px;
    height:12px;
    background-image:url('../../_images/sub/sub_visual_arrow.png');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    right:-20px;
}
.breadcrumb li.home img {
    width:15px;
}
.breadcrumb li a .on {
    display:none;
}
.breadcrumb li a:hover .off {
    display:none;
}
.breadcrumb li a:hover .on {
    display:block;
}
.breadcrumb li a {
    font-size:14px;
    font-weight: 300;
    color: #666;
}
.breadcrumb li.current a {
    font-weight: 500;
    color: #000;
}
.breadcrumb li a:hover {
    font-weight:500;
    color:var(--hover) !important;
}
.breadcrumb .arrow {
    font-size: 10px;
    color: #ccc;
    margin: 0 5px;
}
/* --- 4. Depth 4 (하단 둥근 탭) --- */
.depth4-zone {
    position: absolute;
    z-index: 10;
    width:100%;
    bottom:-30px;
    display: flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;    
}
.d4-list {
    display: flex;
    flex-direction:row;
    align-items:center;
    width:fit-content;
    height: 100%;
    gap:10px;
    background-color:#fff;
    border: 1px solid #D4D4D4;
    box-sizing:border-box;
    border-radius: 100px;
    padding: 6px;     
}
.d4-list li {

}
.d4-list li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 100px; 
    padding:14px 30px;
    font-size: 18px;
    font-weight: 300;
    color: #666;
    transition: all 0.3s;
}
.d4-list li a:hover {
    color:#000;
}
/* 활성화 상태 */
.d4-list li.active a {
    background-color: #004ea2; /* 파란색 배경 */
    color: #fff;
    font-weight: 500;
}
.d4-list li.active a:hover {
    background-color:var(--hover);
}
.sub-contents .inner {
    width:100%;
    max-width:1400px;
}
/* 1. 페이지 타이틀 */
.page-tit {
    padding-top:70px;    
    font-weight: 500;
    font-size: 30px;
    line-height:1.3;
    text-align: center;
    color: #000;
}
.page-tit .miniText{
    font-size:0.7em;
    font-weight:300;
    padding-top:5px;
}
.page-tit b {
    display:inline-block;
    color:#004ea2;
}
/* 2. 상단 요약 박스 */
.summary-box-wrap {
    display: flex;
    gap: 40px;
    justify-content: center;
    margin-bottom: 80px;
    flex-wrap: wrap; /* 모바일 대응 */
}

.summ-item {
    position: relative;
    width: 600px;
    background-color: #f3fbff; /* 임의 배경색 (시안 느낌) */
    border-radius: 20px;
    padding: 50px 45px 30px 45px;
    text-align: center;
}

.summ-item .badge {
    position: absolute;
    top: -22px; /* 박스 위로 걸치게 */
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color:#0E2D66; 
    color: #fff;
    border-radius: 80px;
    font-weight: 500;
    font-size: 18px;
    cursor:pointer;
}

.summ-item .badge.type-navy {
    background-color: #003C6B; /* 급여 뱃지 색상 */
}

.summ-item .txt {
    font-weight: 400;
    font-size: 20px;
    margin-bottom:15px;
    line-height:1.3;
    word-break: keep-all;
    color:#000000;    
}

.summ-item .sub-txt {
    font-size: 17px; 
    font-weight: 300;
    color:#000000;
    line-height:1.3;
    word-break:keep-all;
}

/* 별표(*) 처리 */
.asterisk::before {
    content: '* ';
    color: #666;
}

/* 3. 섹션 공통 */
.section-tit {
    display: flex;
    align-items: center;
    font-weight: 700;
    font-size:20px; /* H3 적정 사이즈 */
    color: #000;
    margin-bottom:20px;
}
/* 파란 동그라미 (h3 옆) */
.section-tit::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    background-color: #189EFF;
    border-radius: 50%;
    margin-right:7px;
}
.section-txt {
    font-size:18px;
    font-weight:400;
    color:#333;
    word-break:keep-all;
    line-height:1.3;
}
.intro-txt {
    margin-bottom:15px;
}
.intro-txt p {
    font-size: 18px;
    font-weight:400;
    line-height: 1.3;
}
.blue { color: #0047A3 !important; }

/* 4. 정보 리스트 (좌측 제목 - 우측 내용) */
.section-wrap {
    margin-bottom:80px;
}
.info-list {
    border-top: 1px solid #e2e2e2;
}
.info-list > li {
    display: flex;
    flex-direction:row;
    border-bottom: 1px solid #e2e2e2;
}

.info-list .label {
    width:175px;
    flex-shrink: 0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:20px 0;
}
.info-list .label h4 {
    font-weight: 500;
    font-size: 20px;
    color:#000;
    line-height:1;
    line-height:1.3;
    position:relative;
    padding-left:30px;
    word-break:keep-all;
}
.info-list .label h4::before {
    content:'';
    width:5px;
    height:5px;
    border-radius:50%;
    background-color:#000;
    margin:0 15px;
    position:absolute;
    top:10px;
    left:0;
}
.info-list .cont {
    width:calc(100% - 175px);
    padding:20px 20px 20px 35px;
    border-left: 1px solid #e2e2e2; /* 세로 구분선 */
    box-sizing:border-box;
    position:relative;
    display:flex;
    flex-direction: column;
    justify-content:center;
}
.info-list .cont p {
    font-weight: 300;
    font-size: 18px;
    line-height: 1.4;
    word-break:keep-all;
}
.info-list .cont p strong {
    display:inline;
}
.info-list .cont p.link-txt {
    margin-bottom:5px;
}
.info-list .cont p.blue {padding-top:2px;}
.info-list .cont a {display:inline; word-break: break-all; white-space: normal; color:#000;}
.info-list .cont .custom-tbl td a:hover {color:#0047A3; }
.info-list .cont::before {

}
.info-list .dot-list {
    margin:5px 0 0 10px;
}
/* 예시 텍스트 */
.ex-txt {
    color: #0047A3;
}

/* 점 리스트 */
.dot-list li {
    position: relative;
    padding-left: 15px;
    margin-bottom:3px;
}
.dot-list li::before {
    content: '·';
    position: absolute;
    left: 0;
    font-weight: bold;
}

/* 숫자/원 리스트 */
.num-circle-list >li {
    margin:3px 0 5px 0;
}

/* 5. 테이블 */
.tbl-scroll {
    width:100%;
    overflow-x: auto;
}
.custom-tbl {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}
.custom-tbl th, .custom-tbl td {
    border: 1px solid #e2e2e2;
    padding: 10px;
    vertical-align: middle;
    font-weight: 300;
    text-align:left;
}
.custom-tbl th, .custom-tbl td,
.info-list .cont .custom-tbl .dot-list p {
    font-size:16px;
}
.info-list .cont .custom-tbl .dot-list {
    margin:0;
}
.textCenter .dot-list {
    text-align:left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    
}
.custom-tbl thead th,
.custom-tbl tbody .sub-tit {
    background-color: #f5f5f5;
    font-size:18px;
    font-weight: 500;
    color: #000;
    line-height:1.3;
    text-align:center;
    word-break:keep-all;
}
.custom-tbl tbody .sub-tit {
    text-align:left;
}
.custom-tbl tbody .center {
    text-align:center;
}
.custom-tbl .textCenter td {
    text-align:center;
}
.custom-tbl td {
    line-height:1.3;
    word-break:keep-all;
}
.custom-tbl td dt,
.custom-tbl td dd {
    font-size:16px;
    font-weight:300;
    color:#333;   
}
.custom-tbl td dt {
    font-weight:400;
    color:#000;
}
.custom-tbl .arr {
    font-size:3em;
    color:#ccc;
    text-align:center;
}
.custom-tbl .sub-th {
    background-color: #fff;
    font-weight: 500;
    min-width:170px;
    font-size:18px;
    font-weight:500;
    color:#000;
    line-height:1.3;
    padding:0 12px;
}
.textCenter th, .textCenter td, .textCenter tbody .sub-tit {
    text-align:center;
}
/* 6. 신청하러 가기 버튼 */
.btn-apply {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap:20px;
    background-color: #0047A3;
    color: #fff;
    padding: 12px 25px;
    font-weight: 700;
    font-size: 20px;
    border-radius: 5px;
    line-height:1.3;
    transition: background-color 0.3s; 
    width:fit-content;
    word-break:keep-all;
}
.info-list .cont a.btn-apply {
    color:#fff;
}
.btn-apply:hover {
    background-color:var(--hover);
}
.btn-apply img {
    width:24px;
}
/* 7. 상세 리스트 (① 제목 내용) */
.detail-list li {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}
.detail-list .num {
    font-weight: bold;
    color: #0047A3;
    flex-shrink: 0;
}
.detail-list p {
    font-size: 18px;
    line-height: 1.6;
}
.detail-list strong {
    color: #000;
    font-weight: 500;
    display: block;
    margin-bottom: 5px;
}

/* 8. 문의 배너 */
.inquiry-banner {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #333;
    border-radius: 100px;
    padding:15px 40px;
    margin: 0 auto 80px;
    color: #fff;
    width:fit-content;
}
.inquiry-banner:hover {
    background-color:var(--hover);
}
.inq-tit {
    border-radius: 50px;
    font-weight: 700;
    font-size: 20px;
    color: #fff;    
    display: flex;
    align-items: center;
    gap:15px;
    min-width:75px;
}
.inq-tit img {
    width:25px;
}
.inq-txt {
    font-size: 18px;
    font-weight: 300;
    color:#fff;
    margin-left:60px;
    position:relative;
}
.inq-txt br {display:none;}
.inq-txt::before {
    content:'';
    display:block;
    width:1px;
    height:25px;
    background-color:#fff;
    opacity:0.5;
    position:absolute;
    left:-30px;
    top:50%;
    transform:translateY(-50%);
}
/* 9. Q&A 섹션 */
.qna-section {
    background-color: #F3FBFF; /* 배경색 */
    padding:80px 0;
}

.qna-list li {
    background-color: #fff;
    margin-bottom:7px;
    border-radius: 10px;
    overflow: hidden;
}

/* 질문 (헤더) */
.qna-list .question {
    display: flex;
    align-items: center;
    background-color: #003c6b; /* 평소 색상 */
    padding: 20px;
    cursor: pointer;
    transition: background-color 0.3s;
}

/* 활성화(클릭)시 질문 배경색 변경 (필요시) */
.qna-list li.active .question {
    background-color: #002a4d; 
}

.qna-list .q-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: #0092CD;
    color: #fff;
    border-radius: 50%;

    font-weight: 600;
    font-size: 22px;
    margin-right: 20px;
    flex-shrink: 0;
}

.qna-list .q-txt {
    word-break:keep-all;
    font-weight: 400;
    font-size: 18px;
    color: #fff;
    line-height: 1.4;
}

/* 답변 (내용) */
.qna-list .answer {
    display: none; /* 기본 숨김 */
    padding: 30px 20px;
    border-top: 1px solid #eee;
}

/* 활성화 시 보임 */
.qna-list li.active .answer {
    display: block;
}

.ans-inner {
    display: flex;
    align-items: flex-start;
}

.qna-list .a-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: #003C6B;
    color: #fff;
    border-radius: 50%;

    font-weight: 600;
    font-size: 22px;
    margin-right: 20px;
    flex-shrink: 0;
}

.qna-list .a-txt {
    
    font-weight: 300;
    font-size: 18px;
    color: #333;
    line-height: 1.6;
    margin-top: 5px;
}
/* 상단 중앙 버튼 영역 */
.btn-center-area {
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    text-align: center;
    margin-bottom: 60px;
}
.btn-center-area-right {
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
}
.btn-center-area-right .btn-apply {
    background-color:#333;
}
.btn-center-area-right .btn-apply:hover {
    background-color:var(--hover);
}
.btn-apply-big {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0047A3;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    padding: 15px 40px;
    border-radius: 5px;
    gap: 10px;
    transition: background 0.3s;
}
.btn-apply-big:hover { background-color: #00367c; }

.info-list .cont .tit {
    font-weight: 500; 
    font-size: 18px;
    line-height: 1.4;
    color: #000;
}
.info-list .descBox {
    background-color: #fff;
    border: 1px solid #B9B9B9;
    box-sizing:border-box;
    border-radius:8px;
    padding:10px 12px;
}
.info-list .descBox > li:not(:last-child) {
    margin-bottom: 20px;
}
.info-list .descBox02 > li:not(:last-child) {
    margin-bottom:5px;
}
.info-list .descBox .tit,
.info-list .descBox li p,
.info-list .descBox .blue-txt {
    font-size: 16px;
    color: #000;    
    line-height:1.3;
}
.info-list .descBox .tit {
    display: block;
    font-weight:400;
}
.info-list .descBox li p {
    font-weight:300; 
    position: relative;
    line-height:1.5;
}
.info-list .descBox .blue-txt {
    font-weight: 300; 
    color: #0047A3;
}
@media screen and (max-width:1480px) {
    .page-tit br {display:none;}
    .section-txt br {display:none;}
    .sub-contents .inner {width:calc(100% - 40px); max-width:100%;}
}
@media screen and (max-width:1380px) {
    .d2-list {gap:25px;}
    .d2-list li a {font-size:14px; letter-spacing:-1px;}
    .d1-list li a {font-size:18px; word-break:keep-all; text-align:center; padding:0 5px; box-sizing:border-box;}
}
@media screen and (max-width:1200px) {
    .qna-section {padding:45px 0;}
    .page-tit {font-size:24px;}
    .sub-visual-wrap {border-bottom:1px solid #E2E2E2;}
    .visual-zone {height:250px;}
    .subVisualCenter {max-height:calc(100% - 20px); max-width:initial;}
    .subVisualCenter01 {height:calc(100% - 40px);}
    .depth1-zone, .d2-list, .depth3-zone {display:none;}

    .sub-visual-wrap .tabBtnMo {width:calc(100% - 40px); margin:0 auto;}
    .sub-visual-wrap .select-trigger {background-color:#0047A3;}
    .subVisualBg {display:none;}

    .summary-box-wrap {width:100%; flex-direction:column; justify-content:center;}
    .summ-item {width:100%; max-width:480px; margin:0 auto; padding:45px 40px 30px 40px;}
    .summ-item .btn-apply {margin-top:20px !important; width:100%;}

    .info-list > li {flex-direction:column;}
    .info-list .cont {border-left:none; padding:10px 0 20px 30px; width:100%;}
    .info-list .label {padding:20px 0 0 0; width:100%;}
    .info-list .label br {display:none;}

    .tbl-scroll {width:calc(100% + 20px); overflow-x:auto; padding-bottom:25px;}
    .custom-tbl {width:1080px;}
    .tbl-scroll::-webkit-scrollbar {
        height: 8px; 
        background-color: #f5f5f5; 
    }
    .tbl-scroll::-webkit-scrollbar-thumb {
        background-color: #333;  
        border-radius: 10px;     
    }
    .tbl-scroll::-webkit-scrollbar-track {
        background-color: #e2e2e2;
        border-radius: 10px;      
    }    

    .ans-inner {align-items:center;}
    .qna-list .answer {padding:20px;}

    .btn-center-area-right {justify-content:center;}
}
@media screen and (max-width:720px) {
    .visual-zone {height:200px;}

    .page-tit {font-size:18px; padding-top:50px; }
    .page-tit.mb70 {margin-bottom:40px !important;}

    .page-tit br {display:none;}

    .inquiry-banner {flex-direction:column; justify-content:flex-start; align-items:flex-start; gap:15px; border-radius:10px; padding:20px 20px; width:100%;}
    .inq-tit {width:100%; min-width:100%;}
    .inq-txt {margin-left:0; line-height:1.5;}
    .inq-txt::before {display:none;}
    .inq-txt br {display:block;}    

    .section-wrap {margin-bottom:40px;}

    .qna-list .q-txt,
    .qna-list .a-txt {font-size:16px;}    

    .summary-box-wrap {margin-bottom:60px;}

    .btn-apply {gap:10px;}
    .btn-apply {font-size:16px;}
    .btn-apply img {width:18px;}
    .custom-tbl thead th, .custom-tbl tbody .sub-tit {font-size:16px;}
}
@media screen and (max-width:480px) {
    .page-tit {font-size:17px;}
    .summ-item {padding:50px 30px 30px 30px;}
    .summ-item .txt {font-size:18px;}
    .summ-item .sub-txt {font-size:15px;}

    .section-tit::before {width:10px; height:10px;}
    .section-tit {font-size:19px;}

    .info-list .label {padding:15px 0 0 0;}
    .info-list .label h4 {font-size:18px; padding-left:25px;}
    .info-list .label h4::before {top:8px; width:3px; height:3px; margin:0 10px;}
    .info-list .cont {padding:5px 0 15px 25px;}
    .info-list .cont p,
    .intro-txt p {font-size:16px;}

    .custom-tbl {width:720px;}

    .custom-tbl thead th, .custom-tbl .sub-th {font-size:16px;}
    .custom-tbl th, .custom-tbl td {font-size:15px;}

    .inq-txt {font-size:16px;}
}

/* 일생활균형 우수기업 사례 */
.companyHistory {margin-top:40px;}
.tabContents .tab-panel {
    display: none;
}
.tabContents .tab-panel.active {
    display: block;
}
.tab-zone {width:100%;}
.tab-zone .tabBtn {margin:0 auto 50px auto !important; align-items:center; justify-content:center; flex-wrap:wrap;}
.tab-zone .tabBtn li {
    width:fit-content !important;
}
.tab-zone .tabBtn li a {
    max-width:270px;
    width: 100%;
    height: 60px;
    border: 1px solid rgb(191, 191, 191);
    border-radius: 10px;
    background-color: #fff;
    font-size:19px;
    font-weight:400;
    color: rgb(29, 29, 29);
    line-height: 1.2;
    text-align: center;
    transition: all 0.2s;
    letter-spacing: -0.6px;
}
.tab-zone .tabBtn li:hover a{
    background-color:var(--color02);
    color:#fff;
}
.case-list, .case-list li {width:100%;}
.case-list >li {border-radius:20px; overflow:hidden; border:1px solid #f3f3f4; box-sizing:border-box; box-shadow:3px 3px 10px rgba(0,0,0,0.1);}
.case-list >li:not(:last-child) {margin-bottom:40px;}
.company-header {width:100%; display:flex; flex-direction:row; align-items:center; background: #f3f3f4; padding:10px 20px; box-sizing:border-box;}
.company-header .logo img {max-width:fit-content; height:50px;}
.company-body {padding:30px 20px; box-sizing:border-box; }
.company-body .tit {margin:20px 0; font-size:20px; font-weight:400; color:#000;}
.company-body .tit:first-child {margin-top:0;}
.company-body .dot-list {margin-bottom:30px;}
.company-body .dot-list p {font-size:15px; font-weight:300; color:#000;}

/* 100인의 아빠단 */
.program-step-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 30px;
}

.step-box {
    border: 1px solid #dae1e7;
    border-radius: 8px;
    overflow: hidden;
    background-color: #fff;
}

.step-head {
    background-color: #f3f7fb;
    border-bottom: 1px solid #dae1e7;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.step-num {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    background-color: #005eb8;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    border-radius: 50%;
    flex-shrink: 0;
}

.step-tit {
    font-size: 18px;
    color: #1a1a1a;
    font-weight: 700;
    line-height: 1.3;
}

.step-body {
    padding: 20px;
    background-color: #fff;
}

.step-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.step-list li {
    background-color: #fff;
    border: 1px solid #e1e7f0;
    border-radius: 6px;
    padding:20px 15px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
    transition: all 0.2s ease;
}

.step-list li:hover {
    border-color: #005eb8;
    box-shadow: 0 4px 8px rgba(0, 94, 184, 0.1);
}

.step-list dl {
    margin: 0;
}

.step-list dt {
    color: #005eb8;
    font-weight: 700;
    font-size:17px;
    margin-bottom: 8px;
    line-height: 1.4;
    word-break: keep-all;
}

.step-list dd {
    margin: 0;
    color: #555;
    font-size: 16px;
    line-height: 1.5;
    word-break: keep-all;
}

.step-list.single-col li {
    width: 100%;
    text-align: center;
    background-color: #f8fbff;
    border-color: #dae1e7;
}

@media screen and (max-width: 768px) {
    .step-head {
        padding: 12px 15px;
    }

    .step-tit {
        font-size: 16px;
    }

    .step-body {
        padding: 15px;
    }

    .step-list {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .step-list li {
        padding: 12px;
    }

    .step-list dt {
        font-size: 15px;
    }

    .step-list dd {
        font-size: 13px;
    }
}

.apply-info-wrap {
    display: flex;
    gap: 30px;
    margin-bottom: 30px; /* 버튼과의 간격 */
    flex-wrap: wrap; /* 모바일 줄바꿈 대비 */
}

.info-section {
    flex: 1;
    background-color:#f6f6f6;
    padding:30px 35px;
    border-top:2px solid var(--color02);
}
.info-tit {
    font-size:22px;
    color: #1a1a1a;
    font-weight: 700;
    margin-bottom: 20px;
    text-align: center;
    position: relative;
}
.process-list {
    display: flex;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
}

.process-list li {
    flex: 1;
    position: relative;
    text-align: center;
}
.process-list li:not(:last-child) {
    margin-right:30px;
}
.process-list li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -30px; 
    width: 25px;
    height: 25px;
    background: url("../../_images/sub/arrow_icon02_blue_right.png") no-repeat center / contain;
    top:50%;
    transform: translateY(-50%);
    z-index: 1;
}
.process-list .step-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content:center;
    padding:20px 0;
}
.process-list .step-box .num {
    display: flex;
    justify-content: center;
    align-items: center;
    justify-content:center;    
    width: 60px;
    height: 60px;
    background-color: #005eb8; /* 블루 톤 */
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    border-radius: 50%;
    box-shadow: 0 4px 8px rgba(0, 94, 184, 0.2);
}

.process-list .step-box .txt {
    font-size: 17px;
    color: #000;
    font-weight: 400;
    line-height: 1.3;
    word-break: keep-all;
    margin:20px 0;
}

.process-list .step-box .agent {
    font-size: 13px;
    color: #000;
    background-color: #f3f7fb; /* 연한 블루 배경 */
    padding: 4px 10px;
    border-radius: 4px;
}

/* --- 문의 영역 스타일 --- */
.inquiry-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.inquiry-list > li {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ccc;
}
.inquiry-list > li:not(:last-child) {
    margin-bottom: 20px;
    padding-bottom: 20px;
}
.inquiry-list > li:last-child {
    border-bottom: none;
}

.org-name {
    width: 170px;
    font-size: 17px;
    color: #000; 
    font-weight:500;
}

.org-name.align-top {
    align-self: flex-start;
    margin-top: 5px;
}

.tel-num {
    font-size: 16px;
    color: #000;
    font-weight:300;
    margin: 0;
}

.tel-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tel-list li:not(:last-child) {
    margin-bottom:10px;
}
.tel-list li p,
.tel-list li a {
    display:flex;
    flex-direction:row;
    align-items:center;
}
.tel-num,
.tel-list li p,
.tel-list li a {
    font-size:16px;
    font-weight:400;
    color:#000;
}
.tel-list li:last-child {
    margin-bottom: 0;
}
.tel-list .loc {
    display: inline-block;
    width: 100px;
    margin-right:10px;
    padding:5px 0;
    border-radius:20px;
    text-align:center;
    background-color:#333;
    font-size:16px;
    font-weight:400;
    color: #fff;
}

/* --- 모바일 반응형 --- */
@media screen and (max-width:1200px) {
    .apply-info-wrap {
        max-width:720px;
        margin:0 auto;
        flex-direction: column; 
        gap: 20px;
    }
    .info-section {
        min-width: auto;
    }
    .process-list {
        margin:0 auto;
        flex-direction: column;
        gap: 30px;
    }
    .process-list li:not(:last-child) {margin:0;}
    .process-list li:not(:last-child)::after {
        top: auto;
        bottom: -28px;
        right: 50%;
        transform: rotate(90deg);
        left: 50%;
        margin-left: -12.5px;
    }
    .process-list .step-box .num {
        width: 50px;
        height: 50px;
        font-size: 20px;
    }
    .inquiry-list > li {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    .org-name {
        width: auto;
        margin-top: 0;
    }
    .tel-num, .tel-list li {
        font-size: 16px;
        padding-left: 10px; 
    }
}
@media screen and (max-width:720px) {
    .info-section {padding:25px 20px;}
    .info-tit {font-size:20px;}
}


.consulting-tree-wrap {
    display: flex;
    align-items: center;
    gap: 30px;
    padding: 20px 0;
    position: relative;
    max-width: 100%;
}
.tree-start-col {
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.start-box {
    width: 140px;
    height: 140px;
    background-color: #005eb8;
    color: #fff;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-weight: 700;
    font-size: 20px;
    box-shadow: 0 4px 10px rgba(0, 94, 184, 0.2);
    position: relative;
    z-index:2;
}

.tree-tracks-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
    padding-left:20px;
}

.tree-tracks-col::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: calc(100% - 100px);
    border-left: 2px solid #ccc;
    border-top: 2px solid #ccc;
    border-bottom: 2px solid #ccc;
    border-top-left-radius:5px;
    border-bottom-left-radius:5px;
}

.tree-tracks-col::after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-60%, -50%);
    width: 65px;
    height: 2px;
    background-color: #ccc;
}

.track-item {
    background: #fff;
    border: 1px solid #dae1e7;
    border-radius: 8px;
    padding: 20px;
    position: relative;
    z-index:3;
    display: flex;
    align-items: center;
}

.track-item::before {
    /* content: '';
    position: absolute;
    left: -32px;
    top: 50%;
    width: 32px;
    height: 2px;
    background-color: #ccc; */
}

.track-flow {
    display: flex;
    align-items: center;
    justify-content:space-between;
    width: 100%;
}

.track-item.complex {
    display: flex;
    align-items: center;
}

.branch-container {
    display: flex;
    flex-direction: column;
    gap: 15px;
    flex: 1;
}

.branch-row {
    display: flex;
    align-items: center;
}

.step-group {
    display: flex;
    align-items: center;
    background-color: #fff8e1;
    padding: 5px;
    border-radius: 6px;
    border: 1px dashed #ffe0b2;
}

.merge-point {
    display: flex;
    align-items: center;
    margin-left: 20px;
}

.step-badge {
    padding: 14px 16px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 130px;
    min-height: 60px;
    word-break: keep-all;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    position:relative;
}
.arrow-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../../_images/sub/arrow_icon02_grey_right.png") no-repeat center / contain;
    margin: 0 10px;
    flex-shrink: 0;
    opacity:0.8;
}
.step-badge .arrow-icon {
    position:absolute;
    left:-50px;
}
.plus-symbol {
    font-size: 18px;
    font-weight: 900;
    color: #555;
    margin: 0 8px;
}

.step-badge.teal { background-color: #00897b; color: #fff; }
.step-badge.green { background-color: #a5d6a7; color: #222; border: 1px solid #81c784; }
.step-badge.orange { background-color: #ffcc80; color: #222; border: 1px solid #ffb74d; }
.step-badge.yellow { background-color: #fff59d; color: #222; border: 1px solid #fff176; }
.step-badge.blue-gray { background-color: #546e7a; color: #fff; }
.step-badge.purple { background-color: #673ab7; color: #fff; }

@media screen and (max-width: 1200px) {
    .consulting-tree-wrap {
        flex-direction: column;
        gap: 0;
        padding: 0;
        max-width:720px;
        width:100%;
        margin:60px auto 0 auto;
    }

    .tree-start-col {
        width: 100%;
        margin-bottom: 20px;
    }
    
    .start-box {
        width: 100%;
        height: 60px;
    }

    .tree-tracks-col {
        width: 100%;
        padding-left: 0;
        gap: 15px;
    }

    .tree-tracks-col::before,
    .tree-tracks-col::after,
    .track-item::before {
        display: none;
    }

    .track-item {
        flex-direction: column;
        padding: 20px;
    }

    .track-flow {
        flex-direction: column;
        gap:30px;
    }

    .track-item.complex {
        flex-direction: column;
    }

    .branch-container {
        width: 100%;
    }

    .branch-row {
        flex-direction: column;
        margin-bottom: 20px;
        width: 100%;
        border-bottom: 1px dashed #eee;
        padding-bottom: 20px;
    }

    .branch-row:last-child {
        margin-bottom: 0;
        border-bottom: none;
        padding-bottom: 0;
    }

    .step-group {
        flex-direction: column;
        width: 100%;
        padding: 10px;
        gap: 10px;
    }

    .merge-point {
        margin-left: 0;
        margin-top: 20px;
        flex-direction: column;
        gap: 10px;
    }

    .arrow-icon {
        transform: rotate(90deg);
        margin: 5px 0;
    }

    .step-badge {
        width: 100%;
        max-width: none;
        min-width: auto;
        min-height: auto;
        padding: 15px;
    }
    .step-badge .arrow-icon {
        left:50%;
        margin-left:-10px;
        bottom:51px;
        transform:rotate(90deg);
    }
    .step-badge.yellow .arrow-icon {
        bottom:47px;
    }
}

/* 근무 혁신 10대 실천 */
.work_innovation_10_wrap {
    width: 100%;
    max-width: 100%;
    margin:80px auto 160px auto;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:80px;
}
.work_innovation_10_wrap .innovation_group {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.work_innovation_10_wrap .group_title {
    display: inline-block;
    padding: 15px 20px;
    min-width:380px;
    border-radius: 80px;
    background: #0E2D66;
    color: #FFF;
    text-align: center;
    font-size:28px;
    font-weight:600;
    margin-bottom:80px;
    z-index: 10;
}
.work_innovation_10_wrap .card_container {
    width: 100%;
    position: relative;
}
.work_innovation_10_wrap .card_list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items:stretch;
    gap: 25px;
}
.work_innovation_10_wrap .item_card {
    display: flex;
    flex-direction: column;
    width: fit-content;
    flex:1;
    padding:60px 25px;
    background: #F3FBFF;
    border-radius: 20px;
    text-align: center;
    position:relative;
}
.work_innovation_10_wrap .num {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    height: 70px;
    background: #0047A3;
    border-radius: 50%;
    color: #FFF;
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 20px;
    position:absolute;
    top:-35px;
    left:50%;
    transform:translateX(-50%);
}
.work_innovation_10_wrap .card_title {
    color: #003C6B;
    font-size: 30px;
    font-weight: 500;
    line-height: 140%;
    margin-bottom: 20px;
    text-align:center;
    word-break: keep-all;
}
.work_innovation_10_wrap .card_desc {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.work_innovation_10_wrap .card_desc li {
    position: relative;
    padding-left: 10px;
    text-align: left;
    display: flex;
}
.work_innovation_10_wrap .card_desc li::before {
    content: "·";
    position: absolute;
    left: 0;
    top: 0;
    color: #333;
    font-size: 20px;
    font-weight: 800;
    line-height: 140%;
}
.work_innovation_10_wrap .card_desc li.type02 {
    margin-top:20px;
}
.work_innovation_10_wrap .card_desc li.type02::before {
    content: "*";    
}
.work_innovation_10_wrap .card_desc li p {
    color: #333;
    font-size: 20px;
    font-weight: 500;
    line-height: 140%;
    word-break: keep-all;
    margin: 0;
    padding-left:10px;
}

.video-container {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    margin:120px 0;
}
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 10; /* 영상보다 위에 위치 */
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
}
.video-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#player {
    width: 100%;
    height: 100%;
}
.innovation_group02 .group_title,
.innovation_group02 .num  {background: #5F67AF;}
.innovation_group02 .item_card {background: #F8F5FF;}
.innovation_group02 .card_title {color:#5F67AF;}
.innovation_group03 .group_title,
.innovation_group03 .num  {background: #6DB946;}
.innovation_group03 .item_card {background: #F5FFF0;}
.innovation_group03 .card_title {color:#2D8400;}

@media screen and (max-width:1400px) {
    .work_innovation_10_wrap .group_title {font-size:20px; min-width:300px;}
    .work_innovation_10_wrap .num {width:60px; height:60px; top:-30px; font-size:24px;}
    .work_innovation_10_wrap .item_card {padding:50px 20px;}
    .work_innovation_10_wrap .card_title {font-size:22px;}
    .work_innovation_10_wrap .card_desc li::before,
    .work_innovation_10_wrap .card_desc li p {font-size:17px;}    
}
@media screen and (max-width:1200px) {
    .video-container {margin:60px 0;}
    .work_innovation_10_wrap {gap:60px;}    
    .work_innovation_10_wrap .card_list {flex-wrap:wrap; gap:10px;}
    .work_innovation_10_wrap .card_list li {flex:initial;}
    .work_innovation_10_wrap .group_title {font-size:19px; min-width:280px;}
    .work_innovation_10_wrap .num {width:35px; height:35px; top:-17.5px; font-size:19px;}
    .work_innovation_10_wrap .item_card {padding:30px 20px; width:calc(50% - 5px);}
    .work_innovation_10_wrap .card_title {font-size:20px;}
    .work_innovation_10_wrap .card_desc li::before,
    .work_innovation_10_wrap .card_desc li p {font-size:16px;}    
    .work_innovation_10_wrap .card_desc li p {padding-left:0;}
    .work_innovation_10_wrap .card_list li:nth-child(3),
    .work_innovation_10_wrap .card_list li:nth-child(4) {
        margin-top:15px;
    }
}
@media screen and (max-width:480px) {
    .work_innovation_10_wrap .card_list {gap:30px;}
    .work_innovation_10_wrap .card_list li {width:100%; max-width:380px;}
    .work_innovation_10_wrap .card_list li:nth-child(3),
    .work_innovation_10_wrap .card_list li:nth-child(4) {
        margin-top:0;
    }    
    .work_innovation_10_wrap .group_title {margin-bottom:40px; padding:10px 20px; min-width:250px; font-size:18px;}
    .work_innovation_10_wrap .card_title {font-size:19px; margin-bottom:15px;}
    .work_innovation_10_wrap .card_desc li::before, .work_innovation_10_wrap .card_desc li p {font-size:15px;}
}

/* bi */
.pr_wrap {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.pr_wrap .logo_box {
    width: 100%;
    border-radius: 20px;
    padding:180px 20px 80px 20px;
    border: 1px solid #E2E2E2;
    background: #FFF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position:relative;
}
.pr_wrap .logo_box .logo_list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 110px;
    margin-bottom: 110px;
}
.pr_wrap .logo_box .logo_list li img {
    max-width: 150px;
    display: block;
}
.pr_wrap .logo_box .logo_desc p {
    color:#333;
    text-align: center;
    font-size:20px;
    font-weight:500;
    line-height:1.5;
    word-break: keep-all;
}
.pr_wrap .btn_download {
    position:absolute;
    bottom:-32.5px;
    display: inline-flex;
    min-width: 200px;
    padding: 20px 50px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 50px;
    background: #0E2D66;
    color: #FFF;
    font-size: 20px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.3s;
}
.pr_wrap .btn_download:hover {
    background: var(--hover, #0056b3);
}
.pr_wrap .color_list {
    display: flex;
    justify-content: center;
    gap: 70px;
    margin:150px 0;
    width:100%;
}
.pr_wrap .color_list li {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.pr_wrap .color_list li .circle {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    margin-bottom:10px;
}
.pr_wrap .color_list li .circle.blue {
    background-color: #1DA8E0;
}
.pr_wrap .color_list li .circle.green {
    background-color: #8BC53F;
}
.pr_wrap .color_list li .circle.purple {
    background-color: #7B6CB0;
}
.pr_wrap .color_list li .circle.pink {
    background-color: #F17CAB;
}
.pr_wrap .color_list li .tit {
    color: #000;
    font-size: 20px;
    font-weight: 500;
    margin-bottom:25px;
}
.pr_wrap .color_list li .desc {
    color: #666;
    font-size: 18px;
    font-weight: 300;
    line-height: 140%;
    word-break: keep-all;
}
@media screen and (max-width:1400px) {
    .pr_wrap .logo_box {padding:100px 20px 120px 20px;}
    .pr_wrap .logo_box .logo_list {margin-bottom:80px;}
    .pr_wrap .logo_box .logo_list li img {max-width:120px;}
    .pr_wrap .color_list {gap:40px;}
}
@media screen and (max-width:1200px) {
    .pr_wrap .logo_box .logo_list {gap:60px;}
}
@media screen and (max-width:980px) {
    .pr_wrap .logo_box {padding:80px 20px 100px 20px;}
    .pr_wrap .logo_box .logo_list {width:fit-content; display: grid; grid-template-columns: repeat(2, 1fr); gap:50px;}     
    .pr_wrap .logo_box .logo_list li {text-align:center;}     
    .pr_wrap .logo_box .logo_list li img {display:block; margin:0 auto;}
    .pr_wrap .color_list {flex-wrap:wrap; gap:0; position:relative;}
    .pr_wrap .color_list li {width:50%; position:relative; padding:0 10px;}
    .pr_wrap .color_list li .desc br {display:none;}
    .pr_wrap .color_list li:nth-child(1),
    .pr_wrap .color_list li:nth-child(2) {
        margin-bottom:20px;
    }
    .pr_wrap .btn_download {font-size:18px; min-width:160px; padding:15px 35px; bottom:-25.5px;}
    .pr_wrap .color_list {margin:100px 0;}
}
@media screen and (max-width:720px) {
    .pr_wrap .logo_box .logo_desc p {font-size:17px;}
    .pr_wrap .logo_box {padding:50px 20px 70px 20px;}
    .pr_wrap .logo_box .logo_list {margin-bottom:50px;}
    .pr_wrap .color_list li .circle {width:60px; height:60px;}
    .pr_wrap .color_list li .tit {font-size:19px; margin-bottom:20px;}
    .pr_wrap .color_list li .desc {font-size:16px;}
}
@media screen and (max-width:480px) {
    .pr_wrap .color_list {margin:80px 0;}
    .pr_wrap .logo_box .logo_list li img {max-width:80px;}
    .pr_wrap .logo_box .logo_list {gap:40px;}
    .pr_wrap .logo_box .logo_desc p {font-size:16px;}
    .pr_wrap .logo_box {padding:40px 10px 60px 10px;}
    .pr_wrap .logo_box .logo_list {margin-bottom:40px;}
    .pr_wrap .color_list li .circle {width:50px; height:50px;}
    .pr_wrap .color_list li .tit {font-size:18px; margin-bottom:20px;}
    .pr_wrap .color_list li .desc {font-size:15px;}
    .pr_wrap .btn_download {font-size:16px; min-width:fit-content; padding:13px 30px; bottom:-23.5px;}
    .tab-zone .tabBtn {justify-content:flex-start;}
    .tab-zone .tabBtn li a {font-size:16px; padding:10px 20px; height:50px;}
    .tab-zone .tabBtn li {width:calc(50% - 5px) !important;}
}