@charset "utf-8";
/* @latest 2026.03.04 OSY */
/* @latest 2026.03.06 SSJ */
/* @latest 2026.03.10 OSY */
/* @latest 2026.04.08 SSJ */


/* flex */
.map-selector-wrap .flex { display:flex !important; flex-wrap:wrap; }
.map-selector-wrap .inline-flex { display:inline-flex !important; flex-wrap:wrap; }
.map-selector-wrap .flex_row { flex-direction:row !important; }
.map-selector-wrap .flex_column { flex-direction:column !important; }
.map-selector-wrap .justify_center { justify-content:center !important; }
.map-selector-wrap .justify_between { justify-content:space-between !important; }
.map-selector-wrap .align_stretch { align-items:stretch !important; }
.map-selector-wrap .align_start { align-items:flex-start !important; }
.map-selector-wrap .align_end { align-items:flex-end !important; }
.map-selector-wrap .align_center { align-items:center !important; }



/***** 서브페이지 배경, 제목 *****/
.subCon:has(.map-selector-wrap)::before { content: ''; }

@media (min-width:991px) {
    .subCon:has(.map-selector-wrap) > div { background: transparent; padding: 0; box-shadow: none; border-radius: 0; }
    .subCon:has(.map-selector-wrap.mxwd1300) > div { background:#fff; padding: 30px; border-radius: 20px; box-shadow: 0 1px 6px 0 rgba(32, 33, 36, .1); }
}



/***** 지도 모듈 *****/
.map-selector-wrap { position: relative; display: flex; justify-content: center; font-family: 'esamanru', 'Noto Sans KR', sans-serif; font-size: 10px; width: 100%; height: 100%; box-sizing: border-box; }
.map-selector-wrap * { font-family: 'esamanru', 'Noto Sans KR', sans-serif; box-sizing: border-box; }
.map-selector-wrap .panel-wrap { position: relative; display: flex; gap: 50px; width: 100%; height: 100vh; margin-left: auto; margin-right: auto; }
.map-selector-wrap .panel-wrap .box { display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; }



/***** [왼쪽] 경기도 전체 지도 *****/
.map-selector-wrap .panel-wrap .left-panel { min-width: 300px; }
.map-selector-wrap .panel-wrap .left-panel.box { background-color: transparent; box-shadow: none; }
.map-selector-wrap .gg-map { flex: 1; display: flex; align-items: center; justify-content: center; }

/* 지도 그림자 필터 */
#regio-layer { filter: url(#map-shadow) !important; }

/* 지도 구역(Path) */
.map-selector-wrap .map-1dpt .cls-2 { fill: #ffffff; stroke: #cacbcc; stroke-width: 1px; cursor: pointer; transition: 0.3s; }
.map-selector-wrap .map-1dpt .cls-2:hover { fill: #f1f5f9; }
.map-selector-wrap .map-1dpt .cls-2:not(.active):focus { outline: none !important; fill: #cee7eb; stroke: #000 !important; stroke-width: 3px !important; }
.map-selector-wrap .map-1dpt .cls-2.active { fill: url(#active_grad); stroke: #fff; filter: drop-shadow(0px 8px 12px rgba(0,0,0,0.5)); transition: all 0.3s ease; }
.map-selector-wrap .map-1dpt .cls-2.active:focus { outline: none !important; stroke: #000 !important; stroke-width: 3px !important; }

/* 텍스트 라벨 (그라데이션 방지) */
.map-selector-wrap .map-1dpt .map-label { font-size: 2.2em; fill: #4a4f66; font-weight: 400; pointer-events: none; user-select: none; transition: 0.2s; }
.map-selector-wrap .map-1dpt .map-label.active { fill: #fff; }

/* 기타 레이어 */
.map-selector-wrap .map-1dpt .cls-1 { fill: #d7e1f1; transition: 0.3s; }
.map-selector-wrap .map-1dpt .cls-4 { fill: none; stroke: #cacbcc; stroke-width: 1px; pointer-events: none; }
.map-selector-wrap .map-1dpt #seoul, .map-selector-wrap .map-1dpt #seoul-2 { display: none; }

/* 키보드 접근성 전용 지역 안내 툴팁 */
.map-selector-wrap .map-announcer { display: none; position: absolute; z-index: 100; padding: 15px 20px; background: #fff; border: 1px solid #000; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.15); white-space: nowrap;  outline: none; }
.map-selector-wrap .map-announcer:focus { box-shadow: 0 0 0 3px rgba(29, 60, 140, 0.4); }

.map-selector-wrap .map-announcer .announcer-inner { font-size: 14px; color: #333; font-weight: 100; line-height: 1.5; text-align: center; }
.map-selector-wrap .map-announcer .region-name { font-size: 16px; font-weight: 400; color: #1d3c8c; margin-right: 2px; }
.map-selector-wrap .map-announcer .school-count { font-size: 16px; font-weight: 400; color: #2d6cd5; margin-right: 2px; }

.map-selector-wrap .map-announcer .announcer-btns { display: flex; justify-content: center; gap: 8px; margin-top: 12px; }
.map-selector-wrap .map-announcer .announcer-btns :is(a, button) { padding: 8px 12px; font-size: 11px; font-weight: 100; border-radius: 5px; cursor: pointer; }
.map-selector-wrap .map-announcer .announcer-btns :is(a, button):focus { outline: 2px solid #000; outline-offset: 2px; }
.map-selector-wrap .map-announcer .btn-close-announcer { background: #f1f5f9; border: 1px solid #cbd5e1; color: #475569; }
.map-selector-wrap .map-announcer .btn-move-announcer { background: #394251; color: #fff; }



/***** [오른쪽] 상세 학교 지도 박스 *****/
.map-selector-wrap .panel-wrap .right-panel { flex: 1; position: relative; width: auto; padding: 30px; border-radius: 20px; background-color: #000; border: 1px solid #ffffff80; }
.map-selector-wrap .panel-wrap .right-panel::before { position: absolute; inset: 0; content: ''; width: 100%; height: 100%; background: url('/images/portal/hag/map_box_bg_01.jpg') center no-repeat; background-size: cover; opacity: .2; }
.map-selector-wrap #zoom-map-container { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 100%; height: calc(100% - 40px); margin-top: 40px; border-radius: 12px; overflow: hidden; }
.map-selector-wrap #marker-overlay { position: absolute; inset: 0; z-index: 10; pointer-events: none; }
#zoom-map { display: block; width: 100%; max-width: 100%; height: 100%; max-height: 100%; object-fit: contain; overflow: visible !important; }

/* 지도 배경색 변경 */
.map-selector-wrap #zoom-map-container path, 
.map-selector-wrap #zoom-map-container polygon { fill: #cee7eb; filter: drop-shadow(0 10px 20px rgba(0,0,0,0.28)); transition: fill 0.3s; }


/* 학교 핀 */
.map-selector-wrap .marker-node { cursor: pointer; pointer-events: auto; cursor: pointer; filter: none !important; -webkit-filter: none !important; }
.map-selector-wrap .marker-node * { pointer-events: none; filter: none !important; -webkit-filter: none !important; }
.map-selector-wrap .marker-node .marker-path { transform: scale(1.2); transition: transform 0.2s ease-out; transform-origin: 50px 40px; } 
.map-selector-wrap .marker-node .marker-circle { transform-origin: 0px -55px; transform: scale(1); transition: transform 0.2s ease-out; transform-origin: 50px 40px; fill: transparent; }
.map-selector-wrap .marker-node .marker-label { font-size: var(--marker-fs, 12px); font-weight: 400; fill: #4a4f66; paint-order: stroke fill; stroke: #fff; stroke-width: var(--marker-stroke, 10px); stroke-linejoin: round; dominant-baseline: middle; pointer-events: auto; transition: 0.2s; }

    /* 선택 */
    .map-selector-wrap .marker-node:hover .marker-circle { fill: #ffffffB3; }
    .map-selector-wrap .marker-node:hover .marker-label { stroke-width: 20px; }
    .map-selector-wrap .marker-node.active .marker-path { transform: scale(1.5); }
    .map-selector-wrap .marker-node.active .marker-circle { fill: #fff; transform: scale(1.5); }
    .map-selector-wrap .marker-node.active .marker-label { stroke-width: 50px; }

    /* 포커스 */
    .map-selector-wrap .marker-node:focus { outline: none !important; }
    .map-selector-wrap .marker-node:focus .marker-path {  transform: scale(1.5); }
    .map-selector-wrap .marker-node:focus .marker-circle { fill: #fff; transform: scale(1.5); stroke: #000; stroke-width: 4px; }
    .map-selector-wrap .marker-node:focus .marker-label { stroke-width: 50px; fill: #000; }


/* 범례 스타일 */
.map-selector-wrap .panel-wrap .map-legend { position: absolute; top: 30px; left: 30px; display: inline-flex; gap: 30px; justify-content: start; align-items: center; }
.map-selector-wrap .panel-wrap .map-legend .legend-item { display: inline-flex; gap: 8px; justify-content: center; align-items: center; }
.map-selector-wrap .panel-wrap .map-legend .legend-item .dot { width: 16px; height: 16px; border-radius: 8px; }
.map-selector-wrap .panel-wrap .map-legend .legend-item .label { font-size: 13px; font-weight: 100; color: #fff; }

    /* 남녀공학 */
    .map-selector-wrap .map-legend .legend-item.coed .dot,
    .map-selector-wrap .marker-node.coed .marker-path { fill: #4cd3a2 !important; } 

    /* 여자학교 */
    .map-selector-wrap .map-legend .legend-item.female .dot,
    .map-selector-wrap .marker-node.female .marker-path { fill: #e56bb3 !important; }

    /* 남자학교 */
    .map-selector-wrap .map-legend .legend-item.male .dot,
    .map-selector-wrap .marker-node.male .marker-path { fill: #4da3ff !important; } 


/* 학교 선택 드롭다운 스타일 */
.map-selector-wrap .school-select-wrap { position: absolute; top: 30px; right: 30px; z-index: 10; width: 220px; }

    /* 버튼 디자인 */
    .map-selector-wrap .dropdown-btn { width: 100%; padding: 12px 40px 12px 15px; font-size: 15px; font-weight: 400; color: #333; text-align: left; background-color: #fff; border: 1px solid #ccc; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.15); cursor: pointer; position: relative; transition: border-color 0.2s; outline: none; }
    .map-selector-wrap .dropdown-btn::after { content: '\f107'; font-family: 'FontAwesome'; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); transition: transform 0.3s; color: #666; font-size: 18px; }

    /* 열렸을 때 버튼 */
    .map-selector-wrap .custom-dropdown.open .dropdown-btn { border-radius: 8px 8px 0 0; }
    .map-selector-wrap .custom-dropdown.open .dropdown-btn::after { transform: translateY(-50%) rotate(180deg); }

    /* 리스트 */
    .map-selector-wrap .dropdown-list { display: none; position: absolute; top: 100%; left: 0; width: 100%; max-height: 250px; margin: 0; padding: 0; background: #fff; border: 1px solid #3683bd; border-top: none; border-radius: 0 0 8px 8px; box-shadow: 0 10px 15px rgba(0,0,0,0.1); overflow-y: auto; list-style: none !important; }
    .map-selector-wrap .custom-dropdown.open .dropdown-list { display: block; animation: fadeDown 0.2s ease-out; }
    .map-selector-wrap .dropdown-list li { padding: 12px 15px; font-size: 14.5px; color: #555; cursor: pointer; transition: all 0.2s; border-bottom: 1px solid #f1f1f1; list-style: none !important; }
    .map-selector-wrap .dropdown-list li:last-child { border-bottom: none; }
    .map-selector-wrap .dropdown-list li:hover,
    .map-selector-wrap .dropdown-list li:focus { background: #f1f5f9; color: #1d3c8c; outline: none; }

    /* 스크롤바 커스텀 */
    .map-selector-wrap .dropdown-list::-webkit-scrollbar { width: 6px; }
    .map-selector-wrap .dropdown-list::-webkit-scrollbar-thumb { background: #bbb; border-radius: 4px; }
    .map-selector-wrap .dropdown-list::-webkit-scrollbar-track { background: transparent; }

    @keyframes fadeDown { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }

    @media (max-width: 799px) {
        .map-selector-wrap .school-select-wrap { top: 75px; left: 15px; right: 15px; width: auto; }
        .map-selector-wrap .dropdown-btn { font-size: 14px; padding: 10px 30px 10px 10px; }
    }



/***** 레이어 팝업 *****/
.map-selector-wrap .info-popup { position: absolute; top: 0; left: 0; z-index: 1000 !important; display: none; min-width: 250px; width: auto; max-width: 80%; padding: 20px; pointer-events: auto; background-color: #fff; border: 1px solid #333; border-radius: 15px; box-shadow: 0 10px 20px rgba(0,0,0,0.15); }

.map-selector-wrap .info-popup .pop-head { display: flex; gap: 15px; justify-content: space-between; align-items: center; padding-bottom: 10px; border-bottom: 1px solid #000; }
.map-selector-wrap .info-popup .pop-head .pop-name { font-size: 22px; font-weight: 100; color: #212121; }
.map-selector-wrap .info-popup .pop-head .btn-close { position: absolute; top: -12px; right: -12px; display: inline-flex; width: 44px; height: 44px; justify-content: center; align-items: center; background-color: #fff; border-radius: 50%; box-shadow: 0 5px 5px rgba(0,0,0,0.15); }
.map-selector-wrap .info-popup .pop-head .btn-close::before { 
    content: ''; width: 24px; height: 24px; background-color: #788395; cursor: pointer; transition: all 0.2s; -webkit-mask-size: contain; mask-size: contain;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' width='24px'%3E%3Cpath d='m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z'/%3E%3C/svg%3E") no-repeat center; 
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'%3E%3Cpath d='m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z'/%3E%3C/svg%3E") no-repeat center; 
    
}
.map-selector-wrap .info-popup .pop-head .btn-close:hover::before { background-color: #4a4f66; transform: rotate(90deg); }

.map-selector-wrap .info-popup .pop-cont { padding-top: 15px; }
.map-selector-wrap .info-popup .pop-cont .info-list { display: flex; flex-wrap: wrap; width: 100%; gap: 2px 0; }
.map-selector-wrap .info-popup .pop-cont .info-list :is(dt, dd) { font-size: 17px; font-weight: 100; line-height: 1.5; }
.map-selector-wrap .info-popup .pop-cont .info-list dt { flex: 0 0 90px; position: relative; display: inline-flex; align-items: center; gap: 4px; padding-left: 10px; color: #454545b3; }
.map-selector-wrap .info-popup .pop-cont .info-list dt::before { position: absolute; top: 10px; left: 0; content: ''; width: 4px; height: 4px; background-color: currentColor; border-radius: 50%; }
.map-selector-wrap .info-popup .pop-cont .info-list dt::after { content: ':'; }
.map-selector-wrap .info-popup .pop-cont .info-list dd { flex: 1; min-width: calc(100% - 90px); color: #454545; }

.map-selector-wrap .info-popup .pop-cont .pop-btns { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.map-selector-wrap .info-popup .pop-cont .pop-btns :is(a, button) { flex: 1; padding: 12px 0; font-size: 14px; font-weight: 100; color: #fff; text-align: center; background: #394251; border-radius: 8px; cursor: pointer; text-decoration: none; transition: background 0.3s; }
.map-selector-wrap .info-popup .pop-cont .pop-btns :is(a, button):hover { background: #232a35; }
.map-selector-wrap .info-popup .pop-cont .pop-btns :is(a, button):focus { outline: none !important; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000 !important; }
.map-selector-wrap .info-popup .pop-cont .track-group { display: flex; gap: 10px; align-items: center; width: 100%; }
.map-selector-wrap .info-popup .pop-cont .track-label { flex: 0 0 70px; position: relative; display: inline-flex; align-items: center; gap: 4px; padding-left: 10px; color: #454545b3; font-size: 17px; font-weight: 100; line-height: 1.5; }
.map-selector-wrap .info-popup .pop-cont .track-label::before { position: absolute; top: 10px; left: 0; content: ''; width: 4px; height: 4px; background-color: currentColor; border-radius: 50%; }


@media (max-width: 1499px) {
    
}
@media (min-width: 1300px) {
    .map-selector-wrap .panel-wrap .left-panel { max-width: 500px; }
    .map-selector-wrap .panel-wrap .right-panel { min-width: 860px; }
}
@media (max-width: 1299px) { 
    .map-selector-wrap { padding: 20px; }
    .map-selector-wrap .panel-wrap { gap: 30px; }
    .map-selector-wrap .panel-wrap .left-panel { max-width: 300px; }
    .map-selector-wrap .panel-wrap .right-panel { min-width: 600px; }
    
}
@media (min-width: 991px) {
    .map-selector-wrap .panel-wrap .left-panel { flex: 1; min-width: auto; }
}
@media (max-width: 990px) {
    .map-selector-wrap { padding: 15px; }
    .map-selector-wrap .panel-wrap { flex-direction: column; gap: 20px; height: auto; }
    .map-selector-wrap .panel-wrap .box { border-radius: 12px; }
    .map-selector-wrap .panel-wrap .left-panel { max-width: 100%; height: 44px; padding: 0; }
    .map-selector-wrap .panel-wrap .left-panel .gg-map { display: none; }
    .map-selector-wrap .panel-wrap .right-panel { min-width: auto; max-height: 80vh; }
    .map-selector-wrap #zoom-map-container { height: calc(100% - 110px); margin-top: 110px; }


    /***** 왼쪽 지도 드롭다운 메뉴로 변형 *****/
    .map-selector-wrap .panel-wrap .left-panel .tab-menu-mobile { position: absolute; min-width: 200px; width: 50%; z-index: 100; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); }    
    .tab-menu-mobile .tab-item-mobile { position: relative; cursor: pointer; display: none; width: 100%; padding: 12px 20px; font-size: 16px; font-weight: 100; color: #4a4f66; text-align: left; background: #fff; border-style: solid; border-color: #ddd; }
    .tab-menu-mobile .tab-item-mobile:not(:nth-of-type(1)) { border-width: 1px 0 0; }

    /* 선택된 항목만 노출 */
    .tab-item-mobile.active { display: block; border-width: 1px !important; border-radius: 12px; }
    .tab-item-mobile.active::after { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); content: '\f107'; font-family: 'FontAwesome'; transition: transform 0.3s; }
    .tab-menu-mobile.open .tab-item-mobile.active { border-radius: 12px 0 0 0 !important; }
    .tab-menu-mobile.open .tab-item-mobile.active::after { transform: translateY(-50%) rotate(180deg); }

    /* 펼쳐지는 리스트 박스 */
    .tab-menu-mobile.open .tab-item-mobile { display: block; }

    /* 열렸을 때의 전체 리스트 정렬 */
    .tab-menu-mobile.open { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; max-height: 220px; background: #fff; border-radius: 5px; box-shadow: 0 10px 30px rgba(0,0,0,0.15); overflow-y: auto; }
    .tab-menu-mobile.open .tab-item-mobile.active { order: -1; background: #f1f5f9; border-bottom: 1px solid #eee; border-radius: 5px 0 0 0; }
    .tab-item-mobile:not(.active):hover { font-weight: 400; color: #000; background: #f8fafc; }

    .tab-menu-mobile.open::-webkit-scrollbar { width: 10px; }
    .tab-menu-mobile.open::-webkit-scrollbar-thumb { background: #3683bd; border-radius: 10px; background-clip: padding-box;  border: 2px solid transparent; }


    /***** 레이어 팝업 *****/
    .map-selector-wrap .info-popup { min-width: 200px; }
    .map-selector-wrap .info-popup .pop-head .pop-name { font-size: 18px; }
    .map-selector-wrap .info-popup .pop-head .btn-close { width: 32px; height: 32px; }
    .map-selector-wrap .info-popup .pop-head .btn-close::before { width: 12px; height: 12px; }

    .map-selector-wrap .info-popup .pop-cont { padding-top: 12px; }
    .map-selector-wrap .info-popup .pop-cont .info-list :is(dt, dd) { font-size: 14px; }
    .map-selector-wrap .info-popup .pop-cont .info-list dt { flex: 0 0 80px; }
    .map-selector-wrap .info-popup .pop-cont .info-list dt::before { top: 8px; width: 3px; height: 3px; }
    .map-selector-wrap .info-popup .pop-cont .info-list dd { min-width: calc(100% - 80px); }

    .map-selector-wrap .info-popup .pop-cont .pop-btns { margin-top: 15px; }
    .map-selector-wrap .info-popup .pop-cont .pop-btns :is(a, button) { padding: 12px 15px; font-size: 12px; }

    .map-selector-wrap .info-popup .pop-cont .track-label { flex: 0 0 70px; font-size: 14px; }
    .map-selector-wrap .info-popup .pop-cont .track-label::before { top: 8px; width: 3px; height: 3px; }
}
@media (max-width: 799px) {
    .map-selector-wrap .panel-wrap { gap: 15px; }

    
    /***** 레이어 팝업 *****/
    .map-selector-wrap .info-popup { top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; padding: 15px; }
    .map-selector-wrap .info-popup .pop-head { padding-bottom: 5px; }
    .map-selector-wrap .info-popup .pop-head .pop-name { font-size: 16px; }
    .map-selector-wrap .info-popup .pop-head .btn-close { width: 28px; height: 28px; }
    .map-selector-wrap .info-popup .pop-head .btn-close::before { width: 10px; height: 10px; }
    
    .map-selector-wrap .info-popup .pop-cont { padding-top: 10px; }
    .map-selector-wrap .info-popup .pop-cont .info-list :is(dt, dd) { font-size: 12px; }
    .map-selector-wrap .info-popup .pop-cont .info-list dt { flex: 0 0 70px; padding-left: 7px; }
    .map-selector-wrap .info-popup .pop-cont .info-list dt::before { top: 7px; }
    .map-selector-wrap .info-popup .pop-cont .info-list dd { min-width: calc(100% - 70px); }

    .map-selector-wrap .info-popup .pop-cont .pop-btns { gap: 5px; margin-top: 12px; }
    .map-selector-wrap .info-popup .pop-cont .pop-btns :is(a, button) { padding: 10px 12px; font-size: 11px; }
}
@media (max-width: 699px) {
    .map-selector-wrap .marker-node .marker-label { --marker-fs: 38px !important; --marker-stroke: 10px !important; dominant-baseline: hanging; translate: 0 0px; transform: translateY(-80px) !important; dominant-baseline: hanging !important; }
    .map-selector-wrap .marker-node .marker-path { transform: scale(0.5) !important; transform-origin: 50px 40px; }
    .map-selector-wrap .marker-node .marker-circle { transform: scale(.5); }
    .map-selector-wrap .marker-node.active .marker-path,
    .map-selector-wrap .marker-node:focus .marker-path { transform: scale(.6); }
    .map-selector-wrap .marker-node.active .marker-circle,
    .map-selector-wrap .marker-node:focus .marker-circle { transform: scale(.6); }
}





/* map + editor module */
.subCon:has(.mxwd1300) {background: none;padding-top: 0;}
.subCon:has(.mxwd1300)::before {display: none;}

.map-selector-wrap.mxwd1300 {margin: 0 auto;padding: 0;border: none;}
.map-selector-wrap.mxwd1300 .panel-wrap {align-items: flex-start;gap: 20px;flex-wrap: wrap;margin-bottom: 30px;height: auto;}
.map-selector-wrap.mxwd1300 .panel-wrap .left-panel {background: #f8f8f8;width: 600px;max-width: 600px;flex: auto;padding: 30px;box-sizing: border-box;transition: width 0.5s, max-width 0.5s;}
.map-selector-wrap.mxwd1300 .panel-wrap .right-panel {background: #fff;flex: auto;min-width: auto;}
.map-selector-wrap.mxwd1300 .panel-wrap .right-panel:before {display:none;}
.map-selector-wrap.mxwd1300 .gg-map {flex-wrap: wrap;}
.map-selector-wrap.mxwd1300 .gg-map>div { width: 100%; display: flex; gap: 10px; padding-top: 20px; justify-content: flex-end;}
.map-selector-wrap.mxwd1300 .gg-map>div a { font-size: 15px; color: #494f66; padding: 10px; background: #ffffff; border: 1px solid #cccdcf; box-shadow: 3px 5px 1px #788395; border-radius: 8px;}


.map-selector-wrap .editor-area {padding: 0 20px; font-size: 16px; font-weight: 300;}

.map-selector-wrap .map_list {width: 100%; padding-left: 0; flex-wrap: wrap; display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; padding-bottom: 50px;}
.map-selector-wrap .map_list li {border: 1px solid #ddd;border-radius: 12px;list-style: none !important; transition:border-color 0.5s;}
.map-selector-wrap .map_list li a {font-family: 'esamanru', 'Noto Sans KR', sans-serif; width: 100%; height: 100%; display: block; padding: 18px 20px; text-align: left; color: #8f8f8f; font-weight: 100 !important; box-sizing: border-box; font-size: 17.5px; line-height: 120%; transition:color 0.5s;}
.map-selector-wrap .map_list li.active {border-color:transparent;}
.map-selector-wrap .map_list li.active a {font-weight:600; color:#fff;}
.map-selector-wrap .map_list li:not(.active):hover {border-color: #a1a1a1;}
.map-selector-wrap .map_list li:not(.active):hover a {font-weight: 500 !important;color: #333;}

    @media (min-width:991px) {
        .map-selector-wrap.mxwd1300 .panel-wrap .right-panel {flex:1;}
    }
    @media (min-width:991px) and (max-width:1299px){
        .map-selector-wrap.mxwd1300 .panel-wrap .left-panel  {padding: 20px; width: 400px; max-width: 400px;}
        .map-selector-wrap.mxwd1300 .panel-wrap .right-panel {padding: 20px;max-width: calc(100% - 420px);}
        .map-selector-wrap.mxwd1300 .gg-map>div a {font-size: 13px; padding: 7px; font-weight: 300; box-shadow: 2px 3px 1px #788395;}
    }
    @media (max-width: 990px) {
        .map-selector-wrap.mxwd1300 .panel-wrap .left-panel {width: 100%;max-width: 100%;position: relative;overflow: visible;}
        .map-selector-wrap.mxwd1300 .panel-wrap .right-panel {width:100%;padding: 20px 10px 0;max-height: none;}

        .map-selector-wrap.mxwd1300 .map_list {display:none !important;}

        .map-selector-wrap.mxwd1300 .panel-wrap .left-panel .tab-menu-mobile {left: 20px; top: 30px;}
        .map-selector-wrap.mxwd1300 .panel-wrap .left-panel .tab-item-mobile.active {border:none;}
    }

.map-selector-wrap.theme-blue .map-1dpt .cls-2.active    {fill:#387fbf;}
.map-selector-wrap.theme-green .map-1dpt .cls-2.active   {fill:#2f792f;}
.map-selector-wrap.theme-grey .map-1dpt .cls-2.active    {fill:#686868;}
.map-selector-wrap.theme-black .map-1dpt .cls-2.active   {fill:#252525;}
.map-selector-wrap.theme-orange .map-1dpt .cls-2.active  {fill:#f18e38;}
.map-selector-wrap.theme-yellow .map-1dpt .cls-2.active  {fill:#e6a910;}
.map-selector-wrap.theme-purple .map-1dpt .cls-2.active  {fill:#735c9d;}

.map-selector-wrap.theme-blue .gg-map>div a.active    {background:#387fbf; color:#fff; border-color:transparent;}
.map-selector-wrap.theme-green .gg-map>div a.active   {background:#2f792f; color:#fff; border-color:transparent;}
.map-selector-wrap.theme-grey .gg-map>div a.active    {background:#686868; color:#fff; border-color:transparent;}
.map-selector-wrap.theme-black .gg-map>div a.active   {background:#252525; color:#fff; border-color:transparent;}
.map-selector-wrap.theme-orange .gg-map>div a.active  {background:#f18e38; color:#fff; border-color:transparent;}
.map-selector-wrap.theme-yellow .gg-map>div a.active  {background:#e6a910; color:#fff; border-color:transparent;}
.map-selector-wrap.theme-purple .gg-map>div a.active  {background:#735c9d; color:#fff; border-color:transparent;}

.map-selector-wrap.theme-blue .map_list li.active   {background:linear-gradient(135deg, #2d6cd5 0%, #2f8fe0 50%, #22afe7 100%);}
.map-selector-wrap.theme-green .map_list li.active  {background:linear-gradient(135deg, #257825 0%, #699f69 100%);}
.map-selector-wrap.theme-grey .map_list li.active   {background:linear-gradient(135deg, #d2d1d1 0%, #e4e4e4 100%);}  .map-selector-wrap.theme-grey .map_list li.active a {color:#333;}
.map-selector-wrap.theme-black .map_list li.active  {background:linear-gradient(135deg, #252525 0%, #5d5d5d 100%);}
.map-selector-wrap.theme-orange .map_list li.active {background:linear-gradient(135deg, #dd7921 0%, #e6944d 100%);}
.map-selector-wrap.theme-yellow .map_list li.active {background:linear-gradient(135deg, #d49b0b 0%, #eaad16 100%);}
.map-selector-wrap.theme-purple .map_list li.active {background:linear-gradient(135deg, #735c9d 0%, #8f79b6 100%);}

.map-selector-wrap.theme-blue .panel-wrap .left-panel   {background: linear-gradient(135deg, #f8f8f8 0%, #ebf3f9 50%, #eaf2f8 100%);}
.map-selector-wrap.theme-green .panel-wrap .left-panel  {background: linear-gradient(135deg, #f8f8f8 0%, #ebf5f9 50%, #dee8e0 100%);}
.map-selector-wrap.theme-grey .panel-wrap .left-panel   {background:linear-gradient(135deg, #f8f8f8 0%, #ebf5f9 50%, #e4e4e4 100%);}
.map-selector-wrap.theme-black .panel-wrap .left-panel  {background: linear-gradient(135deg, #f8f8f8 0%, #ebf0f2 50%, #e1e1e1 100%);}
.map-selector-wrap.theme-orange .panel-wrap .left-panel {background: linear-gradient(135deg, #f8f8f8 0%, #f9ebeb 50%, #feefe2 100%);}
.map-selector-wrap.theme-yellow .panel-wrap .left-panel {background: linear-gradient(135deg, #f8f8f8 0%, #f9eeeb 50%, #fff8e6 100%);}
.map-selector-wrap.theme-purple .panel-wrap .left-panel {background:linear-gradient(135deg, #f8f8f8 0%, #ebf5f9 50%, #e6e2ee 100%);}











/* 특수교육원 모듈 (검색바 등 추가) */
.subCon:has(.sei_srchmap) > div {box-shadow:none !important;  max-width: 1600px;}
.search-area.right-panel {/* height:100%; */justify-content: center;padding: 30px 0 !important;}

.sei_srchmap {}
.sei_srchmap .guideTip { font-size: 18px; font-weight: 300; line-height: 150%; color: #555; padding: 30px; border: 2px dashed #ececec; border-radius: 15px; display: flex; margin-bottom: 20px;}
.sei_srchmap .guideTip .lefticon:before { content: "!"; width: 17px; height: 17px; display: inline-block; background: #387fbf; text-align: center; line-height: 17px; font-size: 10px; color: #fff; border-radius: 100%; vertical-align: middle; margin: -5px 10px 0 0;}

.sei_srchmap .srchbox {background: #f0f4fa;padding: 30px;border-radius: 15px;display: flex;flex-direction: column;align-items: end;}
.sei_srchmap .srchbox .srchTit { color: #00469c; font-size: 31px; padding-bottom: 20px; width: 100%; text-align: left;}
.sei_srchmap .srchbox .srch-btn { background: #00469c; color: #fff; font-size: 16px; padding: 15px 20px; border-radius: 3px; letter-spacing: 1px; min-width: 150px;}
.sei_srchmap .srchbox .srch-btn:before {content:"\f002";font-family:'FontAwesome';font-weight: 200;margin-right: 6px;}
.sei_srchmap .srchbox>ul {padding-left: 0; width: 100%;}
.sei_srchmap .srchbox>ul>li { list-style: none; padding-bottom: 20px; display: flex;}
.sei_srchmap .srchbox>ul>li label {position: relative;width: 200px;display: inline-block;text-indent: 0;left: auto;font-size: 17px;overflow: visible;line-height: 40px;font-weight: 300;}
.sei_srchmap .srchbox>ul>li label:before {content:"";width: 3px;height: 3px;display: inline-block;background: #333;vertical-align: middle;margin-right: 8px;}
.sei_srchmap .srchbox>ul>li>div {width: calc(100% - 200px);}
.sei_srchmap .srchbox>ul>li>div input[type="text"] {width: 100%;height: 50px;padding-left: 20px !important;font-weight: 300;color: #333;}
.sei_srchmap .srchbox>ul>li>div select {background: #fff;height: 50px;padding: 0 20px !important;min-width: 30%;margin: 0;font-weight: 300;color: #333;}
.sei_srchmap .srchbox>ul>li>div select option {font-weight:300 !important;}
.sei_srchmap .srchbox>ul>li>div .nextbar { width: 15px; height: 15px; display: inline-block; border: 2px solid #00469c; transform: rotate(45deg); border-width: 2px 2px 0 0; vertical-align: middle; margin: 0 10px 0 4px;}


.srchList-Wrap {width:100%;}
.srchList-Wrap>ul {padding-left: 0 !important;}
.srchList-Wrap>ul>li {list-style: none !important;padding-bottom: 30px;margin-bottom: 30px;/* border-bottom: 1px solid #ddd; */background: #f9fafb;padding: 30px;border-radius: 20px;}
.srchList-Wrap .boxTop {display: flex; justify-content: space-between;}
.srchList-Wrap .boxTop .boxNm { display: flex; flex-wrap: wrap; flex-grow: 1; align-items: center;}
.srchList-Wrap .boxTop .boxNm .category { display: flex; gap: 5px; order: 2;}
.srchList-Wrap .boxTop .boxNm .category div {font-size: 15px;font-weight: 300;padding: 8px 10px 5px;background: #ddd;border-radius: 5px;/* color: #fff; */}
    .srchList-Wrap .boxTop .boxNm .category.color01>div:first-child   {background: green; color: #fff;}
    .srchList-Wrap .boxTop .boxNm .category.color01>div:nth-child(2)  {background: #c1e6c1; color: #017201;}
    .srchList-Wrap .boxTop .boxNm .category.color02>div:first-child   {background: #00a4cc;  color: #fff;}
    .srchList-Wrap .boxTop .boxNm .category.color02>div:nth-child(2)  {background: #a4d8e4; color: #026186;}
    .srchList-Wrap .boxTop .boxNm .category.color03>div:first-child   {background: #f58e22; color: #fff;}
    .srchList-Wrap .boxTop .boxNm .category.color03>div:nth-child(2)  {background: #f3d49d; color: #914e13;}

.srchList-Wrap .boxTop .boxNm .nm {font-size: 26px;line-height: 150%;display: flex;order: 1;position: relative;padding-left: 20px;margin-right: 30px;}
.srchList-Wrap .boxTop .boxNm .nm:before {content:"";width: 13px;height: 13px;display: inline-block;vertical-align: middle;border: 3px solid transparent;margin-right: 6px;border-radius: 10px;background: linear-gradient(#fff, #fff) padding-box, linear-gradient(45deg, #2d6cd5, #22afe7) border-box;box-sizing: border-box;position: absolute;left: -5px;top: 13px;}
.srchList-Wrap .boxTop .boxNm .keyword {width: 100%;display: flex;align-items: center;gap: 10px;font-size: 15px;font-weight: 300;padding: 6px 20px;order: 3;}
.srchList-Wrap .boxTop .boxNm .keyword span {color: #757575;margin-right: 5px;/* display: none; */background: #ececec;padding: 5px;border-radius: 3px;vertical-align: middle;}
.srchList-Wrap .boxTop .boxNm .keyword div {font-weight: 300;}
.srchList-Wrap .boxTop .boxNm .keyword div .kywrdsrch {font-size: 15px; font-weight: 300;}
.srchList-Wrap .boxTop .boxNm .keyword div:before {content:"#";}
.srchList-Wrap .boxTop .boxNm .keyword div:hover {border-bottom:1px solid #333;}
.srchList-Wrap .boxTop .boxLink {display: flex;gap: 10px;align-items: self-end;padding-bottom: 10px;flex-shrink: 0;}
.srchList-Wrap .boxTop .boxLink a {font-size: 17px;font-weight: 300;padding: 15px 20px;background: #ececec;border-radius: 5px;word-break: keep-all;word-wrap: break-word;}
.srchList-Wrap .boxTop .boxLink a.page {}
.srchList-Wrap .boxTop .boxLink a.page:before {content:"\f08e";font-family:'FontAwesome';vertical-align: middle;margin-right: 5px;font-size: 13px;}
.srchList-Wrap .boxTop .boxLink a.map  {}
.srchList-Wrap .boxTop .boxLink a.map:before {content:"\f041";font-family:'FontAwesome';vertical-align: middle;margin-right: 5px;margin-top: -4px;display: inline-block;}
.srchList-Wrap .boxTop .boxLink a:hover {background:#333; color:#fff;}
.srchList-Wrap .boxTop .boxLink a:empty {display:none;}

.srchList-Wrap .boxCo {width: 100%; padding: 10px; box-sizing: border-box;}
.srchList-Wrap .boxCo table {border-top: 1px solid #ececec;}
.srchList-Wrap .boxCo table th {font-size: 15px;padding: 13px 5px 13px 15px;font-weight: 500;font-family: var(--pointFont);border-bottom: 1px solid #ececec;font-weight: 300;background: #fff;border-right: 1px solid #c9d7db;word-break: keep-all;word-wrap: break-word;text-align: left;}
.srchList-Wrap .boxCo table td {font-size: 15px;border-bottom: 1px solid #ececec;padding: 10px 25px;color: #3b3b3b;font-family: 'Noto Sans';word-break: keep-all;line-height: 150%;background: #fff;}
.srchList-Wrap .boxCo table td+ th {border-left: 1px solid #ececec;}

    @media (min-width: 991px) {
        .srchList-Wrap {padding-top:30px;}
        .sei_srchmap .srchbox>ul>li.pcnone {display:none;}
        .search-area.right-panel {width: calc(100% - 620px) !important;}
    }
    @media (min-width:991px) and (max-width:1299px){
        .search-area.right-panel {padding:0 !important;}
        .sei_srchmap .srchbox .srchTit {font-size:22px;}
        .sei_srchmap .srchbox>ul>li {flex-direction:column;}
        .sei_srchmap .srchbox>ul>li>div {width:100%;}
    }
    @media (max-width: 990px) {
        .map-selector-wrap.mxwd1300 .panel-wrap:has(.sei_srchmap) {justify-content: flex-start; gap: 0;}
        .sei_srchmap {display: flex; flex-direction: column;}
        .sei_srchmap .guideTip {order: 2; margin-top: 10px; border: none; padding: 0 10px; margin: 10px 0 40px;}
        .sei_srchmap .guideTip .kkInfo {padding-top:5px;}
        .sei_srchmap .guideTip .kkInfo .moreInfobtn {font-size:15px;}
        .search-area.right-panel {padding: 0 !important;}
        .sei_srchmap .srchbox {padding:15px;order: 1;}
        .sei_srchmap .guideTip>div>.lefticon {display:none;}

        .sei_srchmap .srchbox .srchTit {font-size:20px;}
        .sei_srchmap .srchbox>ul>li {padding-bottom:5px;}
        .sei_srchmap .srchbox>ul>li label {width: 100px;font-size: 15px;}
        .sei_srchmap .srchbox>ul>li>div {width: calc(100% - 100px);display: flex;align-items: center;}
        .sei_srchmap .srchbox .srch-btn {width:100%;}
        .sei_srchmap .srchbox>ul>li.pcnone {height: 50px;}
        .sei_srchmap .srchbox>ul>li>div select,
        .sei_srchmap .srchbox>ul>li>div input[type="text"] {height: 45px;display: flex;flex-grow: 1;box-sizing: border-box;}
        .sei_srchmap .srchbox>ul>li>div .nextbar {margin: 0; width: 10px; height: 10px; margin: 0 12px 0 6px;}

        .srchList-Wrap>ul>li {padding:15px;}
        .srchList-Wrap .boxTop {flex-direction:column;}
        .srchList-Wrap .boxTop .boxNm {flex-direction:column;align-items: flex-start;}
        .srchList-Wrap .boxTop .boxNm .nm {font-size:18px;margin-right: 0;width: 100%;padding-left: 15px;}
        .srchList-Wrap .boxTop .boxNm .nm:before {top: 6px;}
        .srchList-Wrap .boxTop .boxNm .category {width:100%;padding-left: 15px;padding-top: 6px;padding: 6px 15px 10px;}
        .srchList-Wrap .boxTop .boxNm .category div {font-size:13px;font-family: 'Noto Sanse';padding: 4px 7px;font-weight: 400;}
        .srchList-Wrap .boxTop .boxNm .keyword {padding-left: 15px;font-size: 13px;padding-top: 0;font-family: 'Noto Sans';font-weight: 400;}
        .srchList-Wrap .boxTop .boxLink {padding-left: 14px;gap: 5px;padding-bottom: 0;}
        .srchList-Wrap .boxTop .boxLink a {padding: 9px 10px; font-size: 14px;font-family: 'Noto Sans'; font-weight: 400;}
        .srchList-Wrap .boxCo table colgroup {display:none;}
        .srchList-Wrap .boxCo table tr {display:flex; flex-wrap:wrap;}
        .srchList-Wrap .boxCo table th {width: 120px;box-sizing: border-box;border-left: none !important;font-size: 14px;text-align: left;padding: 10px 9px;line-height: 150%;}
        .srchList-Wrap .boxCo table td {width: calc(100% - 120px);box-sizing: border-box;font-size: 14px;padding: 8px 10px;}


        .map-selector-wrap .panel-wrap:has(.sei_srchmap) .left-panel {background: transparent;padding:0;height: auto;}
        .map-selector-wrap .panel-wrap:has(.sei_srchmap) .left-panel .tab-menu-mobile {box-shadow: none; left: 116px; width: calc(100% - 130px);}
        .map-selector-wrap .panel-wrap:has(.sei_srchmap) .left-panel .tab-menu-mobile {top: 217px !important;}
        .map-selector-wrap .panel-wrap:has(.sei_srchmap) .left-panel .tab-item-mobile.active {}
    }


.popBTNbox {display:flex;gap: 4%;margin-bottom: 30px;}
.popBTNbox .guideBTN {display:flex;background: #d5dce4;width: 48%;padding: 20px;border-radius: 15px;justify-content: left;align-items: center;letter-spacing: 2px;font-size: 28px;color: #333;transition: all 0.3s;position: relative;overflow: hidden;padding-left: 210px;box-sizing: border-box;flex-shrink: 0;flex-grow: 1;}
.popBTNbox .guideBTN div {text-align: left;z-index: 1;}
.popBTNbox .guideBTN div b {font-size: 1.1em;}
.popBTNbox .guideBTN:before {content:"\f002";font-family:'FontAwesome';font-size: 125px;color: #e4e7ea;transition: all 0.3s;z-index: 1;position: absolute;left: 81px;}
.popBTNbox .guideBTN:after {content:"\f02d";font-family:'FontAwesome';font-size: 191px;position: absolute;left: -13px;bottom: -19px;/* opacity: 0.05; */color: #fff;}
.popBTNbox .guideBTN:hover {background: #00469c;color: #fff;}
.popBTNbox .guideBTN:hover:before {color: #fff;color: #7edef6;}
.popBTNbox .infoBTNbox {display:flex;width: 48%;flex-wrap:wrap;padding: 30px 20px;border-radius: 15px;justify-content: center;align-items: center;font-size: 23px;color: #333;background: #f8f8f8;gap: 20px;position: relative;overflow: hidden;z-index: 0;box-sizing: border-box;flex-shrink: 0;flex-grow: 1;}
.popBTNbox .infoBTNbox .btntit {width:100%;text-align: center;line-height: 140%;letter-spacing: 1px;font-size: 26px;}
.popBTNbox .infoBTNbox .btntit b {font-size: 1.1em;}
.popBTNbox .infoBTNbox .btntit:before {content:"\f1ad";font-family:'FontAwesome';position: absolute;left: 0;bottom: 0;font-size: 170px;z-index: -1;opacity: 0.05;line-height: normal;}
.popBTNbox .infoBTNbox .infoBTN {color:#fff;display: flex;flex: 1;align-items: center;justify-content: center;font-size: 18px;font-weight: 300;padding: 20px 5px;border-radius: 10px;background: #fff;border: 2px solid #ddd;transition: all 0.3s;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(1) {border-color: green;color: green;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(2) {border-color: #00a4cc;color: #00a4cc;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(3) {border-color: #f58e22;color: #f58e22;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(1):hover {background: green;color: #fff;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(2):hover {background: #00a4cc;color: #fff;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(3):hover {background: #f58e22;color: #fff;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(1):before {content:"\f19d";font-family:'FontAwesome'; margin-right: 5px;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(2):before {content:"\f0b1";font-family:'FontAwesome'; margin-right: 5px;}
.popBTNbox .infoBTNbox .infoBTN:nth-of-type(3):before {content:"\f015";font-family:'FontAwesome'; margin-right: 5px;}

    @media (min-width:991px) and (max-width:1499px){
        .popBTNbox .guideBTN {padding-left: 20px;justify-content: center;font-size: 24px;}
        .popBTNbox .guideBTN div {text-align:center;}
        .popBTNbox .infoBTNbox .btntit {font-size:22px;}
    }
    @media (max-width: 990px) {
        .popBTNbox .guideBTN {padding-left: 20px;justify-content: center;font-size: 22px;}
        .popBTNbox .guideBTN:after {font-size: 130px;}
        .popBTNbox .guideBTN:before {font-size: 80px;left: 50px;}
        .popBTNbox .guideBTN div {text-align:center;}
        .popBTNbox .infoBTNbox {padding:20px 15px 15px;gap: 10px;}
        .popBTNbox .infoBTNbox .btntit {font-size: 17px;}
        .popBTNbox .infoBTNbox .infoBTN {padding: 7px 5px;font-size: 15px;}
    }

/* 진로맵 가이드 팝업 */
.jinromap_popup01Wrap {display:flex;flex-direction:column;gap: 20px;}
.jinromap_popup01Wrap [class *="stepbox0"] {width:100%;padding:30px;background: #f8f8f8;border-radius: 20px;box-sizing:border-box;display: flex;gap: 30px;align-items: flex-start;position: relative;}
.jinromap_popup01Wrap [class *="stepbox0"] .leftboxx {padding: 30px 15px;width: 20%;text-align:center;border-radius:20px;word-break: keep-all;flex-direction: column;display: flex;gap: 10px;color: #fff;}
.jinromap_popup01Wrap [class *="stepbox0"]:not(:last-child):after {content:"";width: 20px;height: 20px;display: inline-block;border: 2px solid #333;border-width: 0 2px 2px 0;transform: rotate(45deg);box-sizing: border-box;position: absolute;left: 13%;bottom: -14px;z-index: 1;}
    .jinromap_popup01Wrap .stepbox01 .leftboxx {background: #4174b3;}
    .jinromap_popup01Wrap .stepbox02 .leftboxx {background: #325075;}
    .jinromap_popup01Wrap .stepbox03 .leftboxx {background: #0c2039;}
.jinromap_popup01Wrap [class *="stepbox0"] .leftboxx .stpNo  {font-size: 15px;font-weight: 600;letter-spacing: 2px;}
.jinromap_popup01Wrap [class *="stepbox0"] .leftboxx .stpTxt {font-size: 20px;font-family: 'esamanru';font-weight: 300;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx {width:80%;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx .topguide {padding: 5px 0px 15px 25px;font-size: 18px;font-family: 'esamanru';color: #00469c;word-break: keep-all;word-wrap: break-word;position: relative;text-align: left;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx .topguide:before {content: "!";background: #00469c;color: #fff;width: 17px;height: 17px;display: inline-block;text-align: center;font-size: 11px;line-height: 17px;border-radius: 100%;box-sizing: border-box;vertical-align: middle;font-weight: 200;font-family: unset;position: absolute;left: 0;top: 6px;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx ul {padding-left:0 !important;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx ul li {list-style:none !important;font-size: 15px;font-family: 'Noto Sanse KR';color: #333;word-break: keep-all;word-wrap: break-word;position: relative;padding-left: 10px; padding-bottom:5px;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx ul li:before {content:"";width: 3px;height: 3px;display: inline-block;background: #333;border-radius: 100%;position: absolute;left: 0;top: 12px;}
.jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx ul li b {font-weight:500;/* font-family: 'Noto Sanse KR'; */font-family: 'esamanru';margin-right: 6px;}

    @media (max-width: 799px) {
        .jinromap_popup01Wrap [class *="stepbox0"] {flex-direction: column;gap: 15px;}
        .jinromap_popup01Wrap [class *="stepbox0"] .leftboxx {width:100%;padding: 15px 10px;flex-direction: row;justify-content: center;align-items: center;}
        .jinromap_popup01Wrap [class *="stepbox0"] .leftboxx .stpTxt {font-size:18px;}
        .jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx {width:100%;}
        .jinromap_popup01Wrap [class *="stepbox0"] .rgtboxx .topguide {font-size:15px;}
        .jinromap_popup01Wrap [class *="stepbox0"]:not(:last-child):after {left:48%;}
    }


/* 기관유형 안내 팝업 */
.jinromap_popup02Wrap {}
.jinromap_popup02Wrap [class *="wordbox0"] {}
.jinromap_popup02Wrap [class *="wordbox0"] .deftnboxx {padding: 20px; border-radius: 15px; display: flex; align-items: center; gap:7px;}
    .jinromap_popup02Wrap .wordbox01 .deftnboxx {background: green;color: #fff;}
    .jinromap_popup02Wrap .wordbox02 .deftnboxx {background: #00a4cc;color: #fff;}
    .jinromap_popup02Wrap .wordbox03 .deftnboxx {background: #f58e22;color: #fff;}
    .jinromap_popup02Wrap .wordbox01 .deftnboxx:before {content:"\f19d";font-family:'FontAwesome'; font-size:26px;}
    .jinromap_popup02Wrap .wordbox02 .deftnboxx:before {content:"\f0b1";font-family:'FontAwesome'; font-size:26px;}
    .jinromap_popup02Wrap .wordbox03 .deftnboxx:before {content:"\f015";font-family:'FontAwesome'; font-size:26px;}
.jinromap_popup02Wrap [class *="wordbox0"] .deftnboxx .wordNm {font-family: 'esamanru'; font-size: 25px; font-weight: 300; margin-right:10px;}
.jinromap_popup02Wrap [class *="wordbox0"] .deftnboxx .wordTxt {font-size: 17px;font-family: 'esamanru';font-weight: 300;}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx {padding: 20px 10px;}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx ul {}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx ul li {font-size: 15px;word-break: keep-all;word-wrap: break-word;font-family: 'Noto Sans KR';display: flex;align-items: flex-start;gap: 10px;justify-content: space-between;padding-bottom: 10px;}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx ul li:first-child {font-family: 'esamanru'; font-weight: 300;     padding-bottom: 15px; border-bottom: 1px dashed #ddd; margin-bottom: 20px;}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx ul li:first-child b {background: #f1f1f1;color: #333;font-size: 14px;width: auto !important;}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx ul li:first-child div {font-family: 'esamanru';font-size: 16px;line-height: 150%;padding-top: 2px; display: flex; flex-direction: column; flex-grow: 1;}
.jinromap_popup02Wrap [class *="wordbox0"] .coboxx ul li b {/* background: #ddd; */padding: 5px;border-radius: 5px;font-family: 'esamanru';font-weight: 300;flex-shrink: 0;}
    .jinromap_popup02Wrap .wordbox01 ul li b {background: #c1e6c1; color: #017201;}
    .jinromap_popup02Wrap .wordbox02 ul li b {background: #a4d8e4; color: #026186;}
    .jinromap_popup02Wrap .wordbox03 ul li b {background: #f3d49d; color: #914e13;}
    .jinromap_popup02Wrap .wordbox01 ul li:not(:first-child) div {width:calc(100% - 110px);}
    .jinromap_popup02Wrap .wordbox02 ul li:not(:first-child) div {width:calc(100% - 110px);}
    .jinromap_popup02Wrap .wordbox03 ul li:not(:first-child) div {width:calc(100% - 120px);}

    @media (min-width:991px) {
        .pcEnter {display:block;}
    }
    @media (max-width:990px) {
        .jinromap_popup02Wrap [class *="wordbox0"] .deftnboxx .wordNm {font-size:20px;}
    }