/* 서브 콘텐츠 공용*/
.sub_section{width:100%;padding:30px 0;background:#fff}
.sub_section .inner_sub{max-width:1400px;margin:10px auto;padding:0px;box-sizing:border-box}
.sub_title{text-align:center;font-size:32px;font-weight:700;color:#111;margin-bottom:30px}
.sub_page_title{border:0px #f50 solid;padding:90px 0 10px; text-align:center;position:relative} 
.sub_page_title h3{font-size:32px;font-weight:700;color:#111;letter-spacing:-0.02em;display:inline-block;position:relative;padding-bottom:15px} 
.sub_page_title h3::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:60px;height:3px;background:#004097;border-radius:3px}
@media (max-width:1024px){
.sub_section .inner_sub{padding:0 30px;margin:30px auto} 
.sub_title{font-size:28px} 
.sub_page_title h3{font-size:28px}
} 

@media (max-width:768px){
.sub_section{padding:20px 0} 
.sub_section .inner_sub{padding:0 20px;margin:10px auto} 
.sub_title{font-size:24px;margin-bottom:20px} 
.sub_page_title h3{font-size:24px;margin-bottom:40px} 
.sub_page_title{padding:60px 0 10px} 
.sub_page_title h3::after{width:40px;height:2px}
}

/*서브비쥬얼*/
/*서브비쥬얼*/
.sub_visual{border:0;width:100%;height:400px;background-size:cover;background-position:center center;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;margin-top:148px;overflow:hidden}
.sub_visual::before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:inherit;background-size:cover;background-position:center;transform:scale(1.12);animation:subVisualZoom 1.8s ease-out forwards;z-index:0}
.sub_visual::after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.4);z-index:1}
.sub_visual .sub_text{position:relative;z-index:2;color:#fff;opacity:0;animation:subTextFadeUp .9s ease-out forwards;animation-delay:.4s}
.sub_visual .sub_text h2{font-size:48px;font-weight:800;margin-bottom:10px}
.sub_visual .sub_text p{font-size:18px;opacity:.9}

@keyframes subVisualZoom{0%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes subTextFadeUp{0%{opacity:0;transform:translateY(24px)}100%{opacity:1;transform:translateY(0)}}



/* ✅ 카테고리별 배경이미지 */
.sub_about{background-image:url('../img/sub_visual_about.jpg')}
.sub_business{background-image:url('../img/sub_visual_business.jpg')}
.sub_product{background-image:url('../img/sub_visual_product.jpg')}
.sub_support{background-image:url('../img/sub_visual_support.jpg')}
.sub_community{background-image:url('../img/sub_visual_community.jpg')}

/* 디바이스별 배경이미지 다르게 쓸경우 주석 삭제
@media (max-width:1024px){
.sub_about{background-image:url('../img/sub_visual_about_tablet.jpg')} 
.sub_business{background-image:url('../img/sub_visual_business_tablet.jpg')} 
.sub_product{background-image:url('../img/sub_visual_product_tablet.jpg')} 
.sub_support{background-image:url('../img/sub_visual_support_tablet.jpg')} 
.sub_community{background-image:url('../img/sub_visual_community_tablet.jpg')}
}

@media (max-width:768px){
.sub_about{background-image:url('../img/sub_visual_about_m.jpg')} 
.sub_business{background-image:url('../img/sub_visual_business_m.jpg')} 
.sub_product{background-image:url('../img/sub_visual_product_m.jpg')} 
.sub_support{background-image:url('../img/sub_visual_support_m.jpg')} 
.sub_community{background-image:url('../img/sub_visual_community_m.jpg')}
}
/*  */

@media(max-width:1200px){
.sub_visual{margin-top:136px;}
}

@media(max-width:1024px){
.sub_visual{margin-top:100px;height:300px}
.sub_visual .sub_text h2{font-size:36px}
.sub_visual .sub_text p{font-size:16px}
}
@media(max-width:768px){
.sub_visual{margin-top:100px;height:240px}
.sub_visual .sub_text h2{font-size:28px}
.sub_visual .sub_text p{font-size:15px}
}


/*서브브래드크럼*/
.sub_breadcrumb{width:100%;background:#fafafa;border-bottom:1px solid #eee}
.sub_breadcrumb {width: 100%; background: #fafafa; border-bottom: 1px solid #eee; overflow-x: auto;}
.sub_breadcrumb .inner {max-width: 1400px; margin: 0 auto; padding: 12px 0px; font-size: 14px; color: #777; display: flex; align-items: center;  gap: 8px;  white-space: nowrap; /*justify-content:flex-end;  오른쪽 끝으로*/}
.sub_breadcrumb a,
.sub_breadcrumb span{white-space:nowrap} 
.sub_breadcrumb a:hover{color:#0a84ff}
.sub_breadcrumb .current{font-size:14px;color:#004097;font-weight:600}
@media(max-width:1024px){
.sub_breadcrumb .inner{max-width:100%;padding:12px 20px;font-size:13px;gap:6px}
}

@media(max-width:768px){
.sub_breadcrumb{overflow-x:auto}
.sub_breadcrumb .inner{padding:10px 16px;font-size:12px;gap:4px}
.sub_breadcrumb a,.sub_breadcrumb span{flex-shrink:0}
}

@media(max-width:480px){
.sub_breadcrumb .inner{padding:8px 12px;font-size:11px;gap:3px}
.sub_breadcrumb .current{font-size:11px}
}



/* 서브 네비 기본 */
/* ===============================
   서브 탭 네비게이션 (PC 기본)
================================ */
.sub_nav{width:100%;background:#fff;border-bottom:1px solid #e5e5e5}
.sub_nav ul{max-width:1400px;margin:0 auto;display:flex}
.sub_nav ul li{position:relative}
.sub_nav ul li a{display:block;padding:18px 28px;font-size:17px;font-weight:500;color:#555;border-left:1px solid #e3e3e3;transition:.25s}
.sub_nav ul li:last-child a{border-right:1px solid #e3e3e3}

/* 박스형 활성 / hover */
/* 기본 */
.sub_nav ul li a{background:#fff;color:#555}

/* hover : 흐린색 */
.sub_nav ul li a:hover{background:#dae5f7;color:#004097}

/* active : 진한색 */
.sub_nav ul li.active a{background:#1b4288;color:#fff;font-weight:600}


/* 토글 버튼 (PC 숨김) */
.subnav-toggle{display:none}

/* 성과관리데이터 페이지 관련 */
.flex-center {display:flex;align-items:center;justify-content:center;}

.data__introduction_title {margin-bottom:0.75rem;color:#002060;font-size:2.5rem;font-weight:bold;text-align:center;}
.data__introduction_subtitle {margin-bottom:3rem;color:#002060;font-size:1.5rem;text-align:center;}
.data__introduction_wrapper {display:flex;gap:3rem;margin-bottom:10rem;}
.data__introduction_left {flex:2;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;height:27.5rem;}
.data__introduction_description {font-size:1.25rem;line-height:1.5;}
.data__introduction_circle_wrapper {display:flex;gap:2rem;justify-content:center;}
.data__introduction_circle {width:11rem;aspect-ratio:1/1;background-color:#002060;border-radius:9999px;text-align:center;color:white;font-size:1.75rem;font-weight:bold;border:0.375rem solid #D9D9D9;}
.data__introduction_right {flex:1.5;display:flex;align-items:center;}
.data__introduction_img--jb {width:100%;}

.focus-section.data__introduction_section {padding:7.5rem 0;background: url(../img/focus_data_bg.jpg) center / cover no-repeat fixed;}
.focus-section.data__introduction_section .focus-header {margin-bottom:4rem;}
.focus-section.data__introduction_section .focus-content {gap:2rem;}
.focus-section.data__introduction_section .focus-box {flex-direction:column;padding:1.5rem 2rem;border:6px solid #00B0F0;font-size:1.125rem;font-weight:400;}
.focus-section.data__introduction_section .focus-box .focus-title {font-size:1.5rem;font-weight:bold;margin-bottom:0.5rem;}

.general-section {padding: 70px 0;}
.general-section a {width:30rem;padding:1.25rem 0;background:#F2F2F2;border:1px solid black;border-radius:0.5rem;text-align:center;font-size:1.25rem;font-weight:500;cursor:pointer;transition: 0.2s ease all;}
.general-section a:hover {background: #002060;color: #fff;}

/* 데이터 분석 (Power BI) 페이지 */
.data__area_title {width:fit-content;background:black;border-radius:9999px;font-size:1.75rem;color:white;padding:0.5rem 3.5rem;text-align:center;}
.data__area_wrapper {padding:1rem 5rem 3rem;}
.data__area_wrapper .data__area_description {font-size:1.25rem;line-height:1.5;}

.intro-section.line-involved {padding:2.5rem 0 5rem;border-bottom:2px solid #DAE3F3;}
.general-section.power-bi {display:flex;justify-content:center;padding:2.5rem 5rem;}
.general-section .power-bi-view {aspect-ratio:1.6/1}
.general-section .power-bi-view-draft {display:flex;flex-direction:column;gap:1rem;width:100%;aspect-ratio:1.6/1;margin:1rem 0;border:1px solid #DAE3F3;border-radius:0.5rem;}
.power-bi-view-draft p {font-size:1.5rem;}
.power-bi-view-draft svg {width:5rem;}

.data__metadata_container {display:flex;flex-direction:column;gap:1rem;padding: 1rem 5rem;}
.data__metadata_container .data__metadata_title {font-size:1.5rem;font-weight:600;}
.data__metadata_wrapper {display:flex;align-items:center;}
.data__metadata_wrapper .data__metadata_subtitle {font-size:1.25rem;font-weight:600;}
.data__metadata_wrapper .data__metadata_desc {font-size:1.125rem;}
.data__metadata_set {flex:1;display:flex;flex-direction:column;gap:0.5rem;}
.data__metadata_box {display:flex;flex-direction:column;gap:0.25rem;}
.data__metadata {}
.data__metadata .data__metadata_name {font-weight:600;}
.data__metadata .data__metadata_value {}
.data__img_wrapper {flex:1;position:relative;}
.data__metadata_img--jb {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:25rem;}

@media(max-width:1024px){
    .data__introduction_title {font-size:2.25rem;}
    .data__introduction_subtitle {font-size:1.25rem;}
    .data__introduction_left {flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;height:20rem;}
    .data__introduction_description {font-size:1.125rem;}
    .data__introduction_circle_wrapper {gap:1.5rem;}
    .data__introduction_circle {width:8.5rem;font-size:1.25rem;}
    .data__introduction_right {flex:1;align-items:center;}

    .general-section a {width:22.5rem;padding:1.25rem 0;font-size:1.25rem;}

    /* 데이터 분석 (Power BI) 페이지 */
    .data__area_title {font-size:1.5rem;padding:0.375rem 2.5rem;}
    .data__area_wrapper {padding:1rem 2rem 1rem;}
    .data__area_wrapper .data__area_description {font-size:1.125rem;line-height:1.5;}

    .intro-section.line-involved {padding:2.5rem 0 2.5rem;}
    .general-section.power-bi {padding:0 2rem;}

    .data__metadata_container {padding: 1rem 2rem;}
    .data__img_wrapper {flex:1;position:relative;}
    .data__metadata_img--jb {width:20rem;}
}

@media(max-width:768px) {
    .data__introduction_wrapper {flex-direction:column;}
    .data__introduction_title {font-size:1.75rem;}
    .data__introduction_subtitle {font-size:1rem;}
    .data__introduction_circle_wrapper {gap:1rem;}
    .data__introduction_circle {font-size:1rem;}

    .intro-section.line-involved {padding:1rem 0 2rem;}
    .general-section.power-bi {padding:1rem 1rem;}

    .data__area_title {font-size:1.25rem;padding:0.375rem 2.5rem;}
    .data__area_wrapper {padding:1rem 0.5rem 2rem;}
    .data__area_wrapper .data__area_description {font-size:1rem;line-height:1.5;}

    .data__metadata_container {padding:1rem 0.5rem 2rem;}
    .data__metadata_container .data__metadata_title {font-size:1.375rem;font-weight:600;}
    .data__metadata_wrapper {flex-direction:column;align-items:flex-start;gap:1.5rem;padding:0.5rem 0 0;}
    .data__img_wrapper {align-self:center;}
    .data__metadata_img--jb {position:static;width:100%;height:15rem;transform:none;}

    .general-section a {width:20rem;padding:1rem 0;font-size:1.125rem;}
}

/* ===============================
   태블릿
================================ */
@media(max-width:1024px){
.sub_nav ul{padding:0 20px}
.sub_nav ul li a{font-size:16px;padding:16px 22px}
}

/* ===============================
   모바일 : 펼침 메뉴
================================ */
@media(max-width:768px){
.subnav-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px 18px;font-size:16px;font-weight:600;color:#1b4288;background:#fff;border:0;border-bottom:1px solid #eee;cursor:pointer}
.sub_nav ul{display:flex;flex-direction:column;max-width:100%;overflow:hidden;max-height:0;opacity:0;transform:translateY(-6px);transition:max-height .35s ease,opacity .25s ease,transform .25s ease}
.sub_nav.open ul{max-height:600px;opacity:1;transform:translateY(0)}
.sub_nav ul li a{border:0;border-bottom:1px solid #eee;padding:14px 18px;font-size:15px;background:#fff;color:#333;transition:background .25s ease,color .25s ease}
.sub_nav ul li.active a{background:#f2f7ff;color:#1b4288}
.sub_nav ul li:last-child a{border-right:0; border-bottom:0}
}


/* ===============================
   모바일 소형
================================ */
@media(max-width:480px){
.subnav-toggle{font-size:15px;padding:14px 16px}
.sub_nav ul li a{font-size:14px;padding:12px 16px}
}




/*서브타이틀 아래 서브 카피*/
.sub_copy .fw400 {font-size:22px; font-weight:400; text-align:center; line-height:1.4;}
@media (max-width:1200px){.sub_copy .fw400{font-size:20px;}}
@media (max-width:992px){.sub_copy .fw400{font-size:18px;}}
@media (max-width:768px){.sub_copy .fw400{font-size:16px;line-height:1.3;}}
@media (max-width:480px){.sub_copy .fw400{font-size:15px;line-height:1.2;}}

/* =========================
인사말
========================= */
.greeting-section{width:100%;padding:40px 0;}
.greeting-inner{width:1400px;margin:0 auto}

.greeting-header{text-align:center;margin-bottom:60px}
.greeting-header h2{font-size:60px;font-weight:800;color:#1b4288;margin:0 0 14px;line-height:1.2}
.greeting-header .eng{font-size:36px;color:#6e87b3;margin:0;font-weight:500}

.greeting-content{display:flex;gap:80px;align-items:flex-start}

.greeting-photo{flex:0 0 355px}
.greeting-photo img{width:100%;border-radius:28px;display:block}

.greeting-text{flex:1;font-size:18px;color:#333}
.greeting-text p{font-size:18px; ;line-height:1.6; margin:0 0 22px}
.greeting-text .highlight{color:#1b57c2;font-weight:600}
.greeting-text strong{font-weight:700}
.greeting-text .signature{margin-top:40px;font-size:20px}

@media(max-width:1024px){
.greeting-inner{width:100%;padding:0 30px}
.greeting-header h2{font-size:48px}
.greeting-header .eng{font-size:28px}
.greeting-content{gap:50px}
.greeting-photo{flex:0 0 300px}
.greeting-text p{font-size:17px}
}
@media(max-width:768px){
.greeting-header{margin-bottom:40px}
.greeting-header h2{font-size:36px}
.greeting-header .eng{font-size:22px}

.greeting-content{flex-direction:column;gap:30px}
.greeting-photo{flex:none;width:100%;max-width:320px;margin:0 auto}
.greeting-text{font-size:16px}
.greeting-text p{font-size:16px;line-height:1.6}
.greeting-text .signature{font-size:18px;margin-top:30px}
}
@media(max-width:480px){
.greeting-inner{padding:0 20px}
.greeting-header h2{font-size:28px;line-height:1.3}
.greeting-header .eng{font-size:18px}

.greeting-text p{font-size:15px;line-height:1.6}
.greeting-text .signature{font-size:16px}
}

/* =========================
사업소개
========================= */
.intro-section{width:100%;padding:40px 0}
.intro-inner{width:1400px;margin:0 auto}
.intro-header{text-align:center;margin-bottom:80px}
.intro-header h2{font-size:60px;font-weight:800;color:#1b4288;margin:0 0 14px}
.intro-header .sub{font-size:36px;color:#333;margin:0;font-weight:600}
.intro-content{display:flex;justify-content:space-between;gap:120px}
.intro-item{flex:1;text-align:center}
.circle{width:360px;height:360px;margin:0 auto 40px;background:#d9e1db;border-radius:50%;display:flex;align-items:center;justify-content:center}
.circle-inner{width:320px;height:320px;background:#02983b;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;font-size:26px;font-weight:700;line-height:1.4;padding:20px}
.intro-text{font-size:20px;line-height:1.6;color:#333}
.intro-text strong{font-weight:700}

/*  중점추진분야 */
.focus-section{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;padding:70px 0;background:url('../img/focus_bg.jpg') center/cover no-repeat; background-attachment:fixed; overflow:hidden;}
.focus-section:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.25);z-index:0;}
.focus-inner{position:relative;z-index:1;width:1400px;margin:0 auto;text-align:center;}
.focus-header h2{font-size:40px;font-weight:800;color:#fff;margin:0 0 10px}
.focus-pill{display:inline-block;padding:10px 40px;border-radius:40px;background:#02983b;font-size:22px;font-weight:700;color:#fff;margin-bottom:50px}
.focus-content{display:flex;justify-content:space-between;gap:60px}
.focus-box{flex:1;background:#fff;color:#333;padding:30px 40px;border-radius:28px;border:6px solid #02983b;font-size:22px;font-weight:600;line-height:1.6;box-shadow:0 20px 60px rgba(0,0,0,.25);transition:transform .35s ease,box-shadow .35s ease;display:flex;align-items:center;justify-content:center;text-align:center;}
.focus-box:hover{transform:translateY(-12px);box-shadow:0 30px 80px rgba(0,0,0,.35);}

/* =========================
   Tablet (1024px 이하)
========================= */
@media(max-width:1024px){

.intro-inner,
.focus-inner{width:100%;padding:0 30px}

.intro-header h2{font-size:48px}
.intro-header .sub{font-size:28px}

.intro-content{gap:60px}
.circle{width:300px;height:300px}
.circle-inner{width:260px;height:260px;font-size:22px}

.intro-text{font-size:18px}

.focus-header h2{font-size:34px}
.focus-pill{font-size:20px;padding:10px 30px}

.focus-content{gap:40px}
.focus-box{font-size:20px;padding:25px 30px}
}


/* =========================
   Mobile (768px 이하)
========================= */
@media(max-width:768px){

.intro-header{margin-bottom:50px}
.intro-header h2{font-size:36px}
.intro-header .sub{font-size:22px}

.intro-content{flex-direction:column;gap:60px}
.intro-item{text-align:center}

.circle{width:260px;height:260px}
.circle-inner{width:220px;height:220px;font-size:20px}

.intro-text{font-size:17px;line-height:1.6}

.focus-section{padding:60px 0}
.focus-content{flex-direction:column;gap:30px}
.focus-box{font-size:18px;min-height:160px}

.focus-pill{font-size:18px}
}


/* =========================
   Small Mobile (480px 이하)
========================= */
@media(max-width:480px){

.intro-inner,
.focus-inner{padding:0 20px}

.intro-header h2{font-size:28px}
.intro-header .sub{font-size:18px}

.circle{width:220px;height:220px}
.circle-inner{width:190px;height:190px;font-size:18px;padding:15px}

.intro-text{font-size:15px}

.focus-header h2{font-size:26px}
.focus-pill{font-size:16px;padding:8px 22px}

.focus-box{font-size:16px;padding:20px 20px;border-width:4px}
}

/* =========================
   조직도
========================= */
.org-section{width:100%;padding:40px 0}
.org-inner{width:1400px;margin:0 auto}

.org-header{text-align:center;margin-bottom:80px}
.org-header h2{font-size:60px;font-weight:800;color:#1b4288;margin:0 0 18px;line-height:1.2}
.org-header .sub{font-size:26px;font-weight:600;color:#333;line-height:1.5;margin:0}

.org-map{text-align:center}
.org-map img{max-width:100%;height:auto;display:block;margin:0 auto}

@media(max-width:1024px){
.org-inner{width:100%;padding:0 30px}
.org-header h2{font-size:46px}
.org-header .sub{font-size:22px}
}

@media(max-width:768px){
.org-header{margin-bottom:50px}
.org-header h2{font-size:34px}
.org-header .sub{font-size:18px}
}

@media(max-width:480px){
.org-inner{padding:0 20px}
.org-header h2{font-size:26px}
.org-header .sub{font-size:16px}
}






/* =========================
  오시는 길 섹션
========================= */
.location-section{width:100%;padding:40px 0;background:#fff}
.location-inner{width:1400px;margin:0 auto;text-align:center}

.location-title{font-size:60px;font-weight:800;color:#1b4288;line-height:1.25;margin:0 0 24px}
.location-desc{font-size:26px;font-weight:600;color:#333;line-height:1.6;margin:0}
/* =========================
   Tablet (1024px 이하)
========================= */
@media(max-width:1024px){
.location-inner{width:100%;padding:0 30px}
.location-title{font-size:48px}
.location-desc{font-size:22px}
}


/* =========================
   Mobile (768px 이하)
========================= */
@media(max-width:768px){
.location-section{padding:30px 0}
.location-title{font-size:34px;line-height:1.3}
.location-desc{font-size:18px;line-height:1.6}
}


/* =========================
   Small Mobile (480px 이하)
========================= */
@media(max-width:480px){
.location-inner{padding:0 20px}
.location-title{font-size:26px}
.location-desc{font-size:16px}
}



/* 지도 */
.map-wrap{width:100%;height:400px;overflow:hidden}
.map-wrap .root_daum_roughmap{width:100%!important;height:400px!important}
/* 오시는 방법 */
.direction-section{width:100%;padding:60px 0}
.direction-inner{width:1400px;margin:0 auto}

/* 상단 */
.direction-header{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:0px solid #004097}
.direction-header .org{font-size:20px;font-weight:600;color:#004097}
.direction-header .addr{font-size:16px;color:#333;display:flex;gap:16px;flex-wrap:wrap}

/* 테이블 */
.direction-table{margin-top:20px;border-top:2px solid #004097}
.dt-row{display:flex;border-bottom:1px solid #dcdcdc}
.dt-row.head{background:#eef3f9;font-weight:700}

.dt-col{padding:18px 20px;line-height:1.6}
.dt-col.type{width:200px;font-size:16px; color:#004097;font-weight:600;border-right:1px solid #e0e0e0}
.dt-col.desc{flex:1;color:#333;font-size:15px}

.dt-col.desc .time{color:#555;font-size:15px}

/* 반응형 */
@media(max-width:1024px){
.direction-inner{width:100%;padding:0 24px}
.direction-header{flex-direction:column;align-items:flex-start;gap:10px}
.dt-row{flex-direction:column}
.dt-col.type{width:100%;border-right:0;border-bottom:1px solid #e0e0e0}
}