@charset "utf-8"; /* Default Layout */
#wrap { width: 100%; height: 100%; } 
body { scroll-behavior: smooth; } 
/* Chrome, Edge, Safari */
body#main::-webkit-scrollbar { display: none; } 
/* Firefox */
body#main { scrollbar-width: none; } 
/* IE, 구형 Edge */
body#main { -ms-overflow-style: none; } 
body.not_scroll { overflow-y: hidden; } 
@media (max-width: 767px){
 #main.not_scroll { overflow-y: auto; } 
 }

/********* 컨텐츠 넓이 *********/
.inner-padding { max-width: 1400px; width: 100%; margin: 0 auto; } 
@media only screen and (max-width: 1440px){
 .inner-padding { padding: 0 20px; max-width: unset; } 
 }
 @media only screen and (max-width: 1023px){
 .inner-padding { padding: 0 15px; } 
 }

 /* 메인(main.html) 한정 - section2~5 폭 1540, section1 은 1400 */
.section-wrap .section2 .inner-padding,
.section-wrap .section3 .inner-padding,
.section-wrap .section4 .inner-padding,
.section-wrap .section5 .inner-padding { max-width: 1540px; } 
/* s: seoul-gnb */
.seoul-gnb { position: relative; width: 100%; z-index: 50; } 
#seoul-gnb-plugin *:focus-visible { outline: 3px dotted #ff0000 !important; outline-offset: -3px !important; } 
#seoul-gnb-plugin { background: var(--main) !important; } 
#seoul-gnb-plugin .seoul-gnb-holder { max-width: 1400px !important; } 
#seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-icon-notice { display: none !important; } 
.seoul-util-wrap { display: flex; align-items: center; gap: 20px; } 
@media only screen and (max-width: 767px){
 #seoul-gnb-plugin .seoul-gnb-holder { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 0 20px !important; } 
 #seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-link { float: none !important; margin: 0 !important; } 
 #seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-menu { right: 10px; } 
 .seoul-gnb-flex .notice-txt { display: none; } 
 #seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-link { width: 70px !important; } 
 #seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-link a { width: 70px; } 
 #seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-link a { width: 70px !important; height: 18px !important; background-size: 200px 200px !important; background-position: -81.33px -110px !important; } 
 }
@media only screen and (max-width: 480px){
 #seoul-gnb-plugin .seoul-gnb-menu > dd > a { font-size: 11px !important; font-weight: 400; } 
 #seoul-gnb-plugin .seoul-gnb-menu > dd .seoul-gnb-icon-menu4 { font-size: 11px !important; font-weight: 400; } 
 }
/* e: seoul-gnb */

/* s: t-head */
.t-head { position: relative; width: 100%; background: #fff; border-top: 1px solid var(--bd-color); border-bottom: 1px solid var(--bd-color); z-index: 100; } 
.t-head-flex { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 10px 0; } 
.t-head .inner-padding .language { display: flex; align-items: center; gap: 50px; } 
.t-head .inner-padding .language .lang-list { background: #fff; } 
.sm-util-wrap { display: flex; align-items: center; } 
.sm-util-wrap li { position: relative; padding: 0 20px; } 
.sm-util-wrap li::after { content: ""; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 14px; background: #1d1d1d; } 
.sm-util-wrap li:last-child { padding-right: 0; } 
.sm-util-wrap li:last-child::after { display: none; } 
.sm-util-wrap li a:hover { text-decoration: underline; } 

@media only screen and (max-width: 1023px){
 .t-head .inner-padding .language { gap: 3rem; } 
 }
@media only screen and (max-width: 767px){
 .t-head { display: none; } 
 }
/* e: t-head */

/* s: topmenu */
.toparea .topmenu { z-index: 50; display: flex; display: -webkit-flex; justify-content: right; position: fixed; left: 0; width: 100%; background-color: rgba(255, 255, 255, .9); backdrop-filter: blur(25px); } 
.topmenu-flex { display: flex; align-items: center; height: 100%; } 

.toparea .topmenu h1 a { display: block; width: 123px; height: 45px; background: url(../img/layout/logo.svg) no-repeat center; background-size: contain; }
.toparea .topmenu h1 a img { width: 100%; height: 100%; object-fit: contain; } 
.toparea .topmenu .gnb { margin: 0 auto; display: flex; display: -webkit-flex; gap: 64px; justify-content: center; width: 922px; } 
.toparea .topmenu .gnb > li { text-align: left; cursor: pointer; transition: all 0.3s; } 

.toparea .topmenu .gnb > li > a { position: relative; display: block; height: 90px; font-size: 1.9rem; font-weight: 700; text-align: center; transition: all 0.3s; display: flex; flex-direction: column; justify-content: center; width: 100%; color: var(--txt-gray); line-height: 110%;} 
.toparea .topmenu .gnb > li > a:hover { text-decoration: underline; color: #1d1d1d; } 
.toparea .topmenu .gnb > li > a:hover span::before { content: ""; position: absolute; top: 3px; left: -10px; width: 6px; height: 6px; border-radius: 20px; background: #E23F63; } 

.toparea .topmenu.active { box-shadow: none; background: #fff; height: auto; } 

.topmenu .menu_list { display: none; margin-top: 0px; height: auto; text-align: left; position: absolute; top: 90px; left: 50%; transform: translateX(-50%); width: 100vw; padding: 10px 0 60px 0; background: #fff; box-shadow: 0px 2px 0px 0px #00000008; } 
.topmenu .menu_list .inner-padding { display: flex; flex-direction: row; width: 100%; align-items: stretch; } 
.topmenu .menu_list .left_title { position: relative; display: flex; align-items: end; width: 340px; height: 230px; color: #fff; line-height: 19px; border-radius: 2rem; margin-right: 40px; padding: 3rem; overflow: hidden; } 
.topmenu .menu_list .left_title.sub-vi01 { background: url(../img/layout/sub-vi01-sm.png) no-repeat right center / cover; } 
.topmenu .menu_list .left_title.sub-vi02 { background: url(../img/layout/sub-vi02-sm.png) no-repeat right center / cover; } 
.topmenu .menu_list .left_title.sub-vi03 { background: url(../img/layout/sub-vi03-sm.png) no-repeat right center / cover; } 
.topmenu .menu_list .left_title.sub-vi04 { background: url(../img/layout/sub-vi04-sm.png) no-repeat center center / cover; } 
.topmenu .menu_list .left_title.sub-vi05 { background: url(../img/layout/sub-vi05-sm.png) no-repeat center center / cover; } 
.topmenu .menu_list .left_title h1 { font-size: 2.6rem; font-weight: 700; position: relative; line-height: 1; z-index: 1; } 
.topmenu .menu_list .right_menu { display: flex; flex-wrap: wrap; gap: 0 24px; justify-content: flex-start; flex: 1; max-width: 1219px; } 
.topmenu .menu_list .sub_menu { width: calc(25% - 25px); border-left: 1px solid var(--bd-color); padding: 1rem 0 1rem 2.5rem;} 
.topmenu .menu_list .sub_menu h2 { position: relative; width: 100%; font-size: 2rem; line-height: 110%; } 
.topmenu .menu_list .sub_menu h2::before { content: ""; position: absolute; top: 50%; left: -2.6rem; transform: translateY(-50%); width: 3px; height: 22px; background: var(--main-light); border-radius: 100px; z-index: 1; } 

.topmenu .menu_list .sub_menu.link h2 { display: flex; align-items: center; justify-content: center; gap: 10px; } 
.topmenu .menu_list .sub_menu.link h2::after { content: ""; width: 12px; height: 12px; background: url(../images/icon__blink__bk.png) no-repeat center / contain; display: block; transform: translateY(-4px); } 
.topmenu .menu_list .sub_menu.on.link h2::after { background: url(../images/icon__blink__wh.png) no-repeat center / contain; } 
.topmenu .menu_list .sub_menu ul li { margin-top: 1rem; } 
.topmenu .menu_list .sub_menu ul li a { display: block; line-height: 24px; color: var(--txt-gray); font-weight: 500; word-break: keep-all; line-height: 110%;} 
.topmenu .menu_list .sub_menu ul li a:hover,
.topmenu .menu_list .sub_menu ul li.on a { text-decoration: underline; text-underline-position: under; color: var(--main) !important; } 
.topmenu .menu_list .sub_menu ul li a:hover::before,
.topmenu .menu_list .sub_menu ul li.on a::before { background: var(--main); } 

/* 스크롤 시 toparea sticky — seoul-gnb / t-head 숨기고 topmenu 만 상단 고정 */
.toparea.sticky .seoul-gnb,.toparea.sticky .t-head { display: none; } 
.toparea.sticky .topmenu { top: 0; } 

@media only screen and (max-width:1200px){
 .topmenu-flex { justify-content: space-between; } 
 }
@media only screen and (max-width:767px){
 .toparea .topmenu h1 a { width: 87px; height: 32px; }
 }

/* s: top_btn_wr */
.top_btn_wr { display: flex; align-items: center; gap: 15px; } 
.top_btn_wr button { width: 32px; height: 32px; transition: all 0.3s; } 
.toparea .topmenu .btn_allgnb { background: url(../img/layout/icon-menu.svg) no-repeat center / contain; } 
.toparea .topmenu .btn_search { background: url(../img/layout/icon-search.svg) no-repeat center / contain; } 
.toparea .topmenu .top_btn_wr .btn_close { display: none; background: none; } 
.toparea .topmenu .top_btn_wr .btn_close .icon::before { transform: rotate(45deg); } 
.toparea .topmenu .top_btn_wr .btn_close .icon::after { transform: rotate(-45deg); } 

@media only screen and (max-width:1200px){
 .top_btn_wr button { width: 24px; height: 24px; } 
 }
/* e: top_btn_wr */

/* e: topmenu */
.toparea .allmenu-category { display: none; width: 100%; min-height: 100vh; position: fixed; top: 0; left: 0; z-index: 200; background: #fff url(../img/layout/stm-bg.svg) no-repeat left center / contain; } 
.toparea .allmenu-category .menu_box { max-width: 1400px; padding: 22.5px 0 0; margin: 0 auto; position: relative; } 
.menu-box-top { display: flex; justify-content: space-between; margin-bottom: 30px; align-items: center; } 
.toparea .allmenu-category .logo { width: 123px; height: 45px; }
.toparea .allmenu-category .btn_close { width: 32px; height: 32px; } 
.toparea .allmenu-category .btn_close .icon { width: 32px; height: 32px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cpath stroke='%231d1d1d' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M24 8 8 24M8 8l16 16'/%3E%3C/svg%3E")no-repeat center center / contain; } 
.toparea .allmenu-category .btn_close .icon::after,
.toparea .allmenu-category .btn_close .icon::before { width: 36px; } 
.toparea .allmenu-category .all_gnb { max-height: calc(100vh - 250px); overflow-y: auto; } 
.toparea .allmenu-category .all_gnb::-webkit-scrollbar { width: 6px; } 
.toparea .allmenu-category .all_gnb::-webkit-scrollbar-thumb { width: 6px; height: 160px; background-color: #223958; border-radius: 10px; background-clip: padding-box; border: 2px solid transparent; } 
.toparea .allmenu-category .all_gnb::-webkit-scrollbar-track { background-color: var(--bd-color); border-radius: 10px; } 
.toparea .allmenu-category .all_gnb > li { display: flex; border-top: 1px solid #e5e5e5; gap: 50px; padding: 2rem 0; } 
.toparea .allmenu-category .all_gnb > li > a { height: fit-content; width: 138px; font-size: 2rem; font-weight: 700; flex-shrink: 0; color: #1d1d1d; padding-left: 3rem; background: url(../img/layout/stm-tit-bf.png) no-repeat left center / 21px; } 
.toparea .allmenu-category .all_gnb > li:first-child { border-top: 0; } 
.toparea .allmenu-category .all_gnb > li:first-child > a { border-top: 0; } 
.toparea .allmenu-category .menu_list { display: flex; gap: 20px 15px; flex-wrap: wrap; flex: 1; } 
.toparea .allmenu-category .menu_list > li { width: calc(25% - 15px); border-left: 1px solid var(--bd-color); padding: 1rem 0 1rem 2.5rem; } 
.toparea .allmenu-category .menu_list a { font-weight: 400; display: flex; align-items: center; gap: 10px; color: var(--main); font-weight: 600; font-size: 1.9rem; line-height: 1.2; } 
.toparea .allmenu-category .menu_list > li > a { position: relative; color: var(--main); } 
.toparea .allmenu-category .menu_list > li > a::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: -2.5rem; width: 3px; height: 100%; border-radius: 100px; background: var(--main-light); } 

.toparea .allmenu-category .menu_list_s { margin-top: 1.5rem; } 
.toparea .allmenu-category .menu_list_s a { line-height: 24px; color: var(--txt-gray); display: flex; align-items: center; gap: 9px; word-break: keep-all; font-weight: 500; font-size: 1.6rem; } 
.toparea .allmenu-category .menu_list_s li + li { margin-top: .8rem; } 
.toparea .allmenu-category .menu_list_s a:hover,
.toparea .allmenu-category .menu_list_s a.on { text-decoration: underline; text-underline-position: under; color: var(--main); } 
.toparea .dim { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 11; } 

/* total_search_wr */
.toparea .total_search_wr { display: none; position: fixed; top: 0; left: 0; width: 100%; background: #fff; z-index: 49; padding: 40px 0; padding-top: 40px; border-bottom: 1px solid var(--bd-color); padding-top: 180px; } 
.toparea .total_search_wr .inner { max-width: 1920px; padding: 22px 74px 45px; margin: 0 auto; } 
.toparea .total_search_wr .total_search_bx { padding: 3rem 0; } 
.toparea .total_search_wr .total_search_bx .inner-padding { display: flex; align-items: center; gap: 24px; } 
.total_search_bx .search_bx { display: flex; gap: 2.4rem; align-items: center; width: 100%; padding-left: 44px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cpath stroke='%231e9def' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m28 28-5.8-5.8m3.133-7.533c0 5.89-4.775 10.666-10.666 10.666S4 20.558 4 14.667 8.776 4 14.667 4c5.89 0 10.666 4.776 10.666 10.667'/%3E%3C/svg%3E") no-repeat left center / 44px; } 
.total_search_bx input[type="text"] { flex: 1; height: 52px; border: none; font-size: 3.5rem; position: relative; padding: 0 23px; background: transparent; background: #fff; } 
.total_search_bx input[type="text"]::placeholder { color: #56595E; font-size: 3.5rem; font-weight: 600; } 

.keyword-box { padding-top: 3rem; border-top: 1px solid var(--main); } 
.keyword-box .inner-padding ul { display: flex; gap: 1.5rem; align-items: center; } 
.keyword-box .inner-padding ul li a { padding: 1rem 2rem; border-radius: 8px; border: 1px solid var(--main-light); color: var(--main); font-size: 1.9rem; font-weight: 600; background: var(--bg-light); } 

@media only screen and (max-width: 1023px){
 .toparea .total_search_wr .total_search_bx { padding: 2rem 0; } 
 .total_search_bx .search_bx { gap: 1.5rem; } 
 .toparea .total_search_wr .total_search_bx .inner-padding { gap: 1.5rem; } 
 .total_search_bx input[type="text"] { width: 100%; flex: unset; font-size: 2rem; } 

 .toparea .allmenu-category .menu_list > li { width: calc(33.3% - 15px); } 
 }
 @media only screen and (max-width: 767px){
 .toparea .total_search_wr { padding: 7rem 0 2rem 0; } 
 .toparea .total_search_wr .total_search_bx { padding: 1.5rem 0; } 
 .toparea .total_search_wr .total_search_bx .inner-padding { gap: .5rem; } 
 .total_search_bx .search_bx { padding-left: 24px; background-size: 24px; } 
 .total_search_bx input[type="text"] { font-size: 15px; padding: 0 1rem; } 
 .total_search_bx input[type="text"]::placeholder { font-size: 15px; } 
 .keyword-box { padding-top: 1.6rem; } 
 .keyword-box .inner-padding ul { flex-wrap: wrap; gap: .8rem; } 
 .keyword-box .inner-padding ul li a { font-size: 15px; } 
 }
/*에러페이지*/
.error { position: fixed; width: 100%; height: 100%; display: flex; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-flow: column; align-items: center; justify-content: center; } 
.error h1 { margin-bottom: 30px; width: 140px; } 
.error h1 img { width: 100%; display: block; } 
.error .error_box { padding: 40px 50px 60px; width: 800px; text-align: center; word-break: keep-all; box-shadow: 0 12px 12px -12px #ccc; border-radius: 15px; border: 1px solid #ddd; } 
.error .error_box .txt1 { padding: 145px 0 15px; font-size: 26px; font-weight: 500; background: #fff url("../images/icon_error_warning.png") no-repeat center 0; } 
.error .error_box .txt2 { font-size: 16px; line-height: 24px; color: #666; } 
.error .error_box .button_box { margin-top: 60px; } 
.error .error_box .button_box button { width: 200px; height: 55px; background-color: #39a7c2; color: #fff; border-radius: 8px; } 
.error .error_box .button_box button.btn_prev img { margin: -4px 10px 0 0; } 
.error .error_box .button_box button.btn_home img { margin: -4px 0 0 8px; } 



/* 푸터 */
.footer { width: 100%; background: #ecedf0; } 
.footer .inner { max-width: 1920px; padding: 27px 60px 40px; display: flex; gap: 40px; color: #666; font-size: 15px; font-weight: 400; line-height: 22px; } 
.footer .logo_bottom { width: 127px; height: 50px; margin-top: 12px; } 
.footer .inner .privacy { font-size: 17px; color: #222; font-weight: 600; margin-bottom: 15px; display: block; } 
.footer .copyright { margin-top: 10px; } 

@media screen and (max-width: 1640px){
 .menu_depth_3 li a { font-size: 14px; } 
 }
@media screen and (max-width: 1366px){
 .toparea .topmenu h1 { left: 20px; } 
 }

@media (max-width: 1200px){
 .toparea .topmenu { height: 70px; } 
 .toparea .topmenu .gnb { display: none; } 

 .toparea .topmenu .btn_allgnb { display: block; z-index: 210; } 
 .toparea .dim { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.4); z-index: 2; } 
 .toparea .allmenu-category { z-index: 10000; position: fixed; top: 0; transform: translateX(0); width: 100%; height: 100% !important; 
 animation: allmenu 1s 1; } 
 .toparea .allmenu-category.active { display: flex !important; display: -webkit-flex !important; justify-content: right; animation: allmenu2 1s 1; } 

 @keyframes allmenu { 
 0% { right: 0; } 
 99% { right: -100vw; } 
 100% { display: none; } 
 }
 @keyframes allmenu2 { 
 0% { right: -100vw; } 
 1% { display: block; } 
 100% { right: 0; } 
 } 
 }
@media screen and (max-width: 1024px) { /*에러페이지*/
 .error h1 { margin-bottom: 20px; } 
 .error h1 img { width: auto; height: 33px; } 
 .error .error_box { margin: 0 15px; padding: 50px 30px 40px; width: calc(100% - 30px); box-shadow: 0 8px 8px -8px #ccc; border-radius: 8px; } 
 .error .error_box .txt1 { padding: 110px 0 15px; font-size: 15px; background-size: 70px auto; } 
 .error .error_box .txt2 { font-size: 14px; line-height: 20px; } 
 .error .error_box .button_box { margin-top: 30px; } 
 .error .error_box .button_box button { width: 100%; height: 45px; font-size: 15px; border-radius: 5px; } 
 .error .error_box .button_box button img { display: none; } 
 }
@media screen and (max-width: 767px){
 .toparea .top_bar { display: none; } 

 /* s: 모바일 gnb */

 .menu_box .setting_wr { width: calc(100% - 14.4444vw); top: 4.8611vw; right: 7.2222vw; } 
 .menu_box .setting_wr .set_font { font-size: 3.8889vw; display: none; } 
 .menu_box .setting_wr .set_font [class^="btn"] { width: 6.9444vw; height: 6.9444vw; } 
 .menu_box .setting_wr .header_calc { flex-shrink: 0; height: 6.9444vw; line-height: 6.9444vw; font-size: 3.3333vw; padding: 0 2.7778vw; margin-left: auto; } 
 .setting_wr .header_calc::before { width: 2.7778vw; height: 2.7778vw; } 

 /* e: 모바일용 gnb */

 /* 푸터 */
 .footer .inner { padding: 14.5833vw 5.5556vw; font-size: 4.4444vw; line-height: 1.2; position: relative; } 
 .footer .logo_bottom { width: 29.1667vw; height: 11.25vw; position: absolute; top: 6.6667vw; right: 5.5556vw; } 
 .footer .inner .privacy { font-size: 4.4444vw; margin-bottom: 6.6667vw; } 
 .footer .copyright { margin-top: 6.3889vw; font-size: 3.3333vw; } 

 .toparea .dim { position: fixed; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.4); top: 0; left: 0; display: none; } 
 .toparea .allmenu-category { width: 100vw; left: initial; right: 0; background: #fff; } 
 .toparea .allmenu-category .logo { display: none; } 
 .toparea .allmenu-category .menu_box { padding: 0; width: 100%; } 
 .menu-box-top { display: flex; gap: 10px; background: var(--main); padding: 2rem 2rem 0 2rem; text-align: right; margin-bottom: unset; align-items: flex-start; } 
 .menu-box-top .mo_only { text-align: left; } 
 .menu-box-top .mo_only .select2-container--default { width: fit-content !important; } 
 .menu-box-top .mo_only > .language { display: flex; gap: 5px 18px; flex-wrap: wrap; margin-bottom: 8px; } 
 .menu-box-top .mo_only > .language > li > a { color: #fff; font-size: 15px; } 
 .mo-login-wrap { display: flex; background: var(--main); } 
 .mo-login-wrap li { width: 50%; } 
 .toparea .allmenu-category .btn_close .icon { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M24 8 8 24M8 8l16 16'/%3E%3C/svg%3E")no-repeat center center / contain; } 
 .mo-login-wrap li a { width: 100%; height: 100%; color: #fff; font-size: clamp(1.6rem, 3vw, 1.8rem); text-align: center; padding: 1.6rem; } 
 .toparea .allmenu-category .btn_close_wr { position: relative; background: #223958; height: 15.4167vw; } 
 .toparea .allmenu-category .btn_close { width: 32px; height: 32px; } 
 .toparea .allmenu-category .all_gnb { position: relative; width: 100%; height: calc(100vh - 15.4167vw); max-height: initial; background: var(--bg-light); } 
 .toparea .allmenu-category .all_gnb::before { content: ""; width: 33.3333vw; height: 100%; background: url(../images/mo_gnb_bg.jpg) no-repeat center bottom / cover; position: fixed; top: 15.4167vw; left: 0; height: calc(100vh - 15.4167vw); } 
 .toparea .allmenu-category .all_gnb > li { border: none; padding: unset; } 
 .toparea .allmenu-category .all_gnb > li > a { position: relative; width: 33.3333vw; height: fit-content; line-height: unset; padding: 1.6rem; font-size:clamp(1.6rem, 3vw, 1.8rem); border: none; color: #1d1d1d; background: unset; } 
 .toparea .allmenu-category .all_gnb > li > a.on { background: #fff; color: var(--main); } 
 .toparea .allmenu-category .menu_list { display: none; position: absolute; top: 0; left: 33.3333vw; width: calc(100% - 33.3333vw); padding: 1.6rem; } 
 .toparea .allmenu-category .menu_list.active { display: block; background: #fff; height: 100%; } 
 .toparea .allmenu-category .menu_list > li { width: 100%; border-left: none; padding: unset; } 
 .toparea .allmenu-category .menu_list > li:first-child { margin-top: 0; } 
 .toparea .allmenu-category .menu_list > li > a { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: clamp(1.6rem, 3vw, 1.8rem); color: #1d1d1d; padding: 1.8rem; } 
 .toparea .allmenu-category .menu_list > li > a.arr { background: url(../img/layout/stm-arr.svg) no-repeat right center / 16px; } 
 .toparea .allmenu-category .menu_list > li > a.on { border-color: #223958; background: #223958; color: #fff; } 
 .toparea .allmenu-category .menu_list > li > a::before { display: none; } 
 .toparea .allmenu-category .menu_list_s { display: none; padding: 1.5rem; background: var(--light-gray); border-radius: 12px; margin-top: unset; } 
 .toparea .allmenu-category .menu_list_s li { width: 100%; } 
 .toparea .allmenu-category .menu_list_s a { color: #1d1d1d; padding-left: 1rem; word-break: break-all; } 
 .toparea .allmenu-category .menu_list_s a::before { content: ""; position: absolute; top: 10px; left: 0; width: 4px; height: 4px; background: #1d1d1d; border-radius: 100px; } 
 .toparea .allmenu-category .menu_list_s a:hover, .toparea .allmenu-category .menu_list_s a.on { text-decoration: none; } 
 }
 
.bottomarea { position: relative; background: #292E35; padding: 60px 0; color: rgba(238, 247, 254, 0.6); font-weight: 300; } 
.bottomarea :focus-visible { outline-color: #fff; } 
.bottomarea .bottom_info_list { display: flex; align-items: center; margin-bottom: 4rem; } 
.bottomarea .bottom_info_list > ul { display: flex; align-items: center; width: 100%; gap: 40px; } 
.bottomarea .bottom_info_list > ul > li { flex: 1; max-width: 260px; }
.bottomarea .bottom_info_list > ul > li > a { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 57px; font-weight: 600; font-size: 2rem; color: #fff; } 
.bottomarea .bottom_info_list > ul > li > a::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: -20px; width: 1px; height: 24px; background: #818892; } 
.bottomarea .bottom_info_list > ul > li:first-child > a:before { display: none; } 
.bottomarea .bottom_info_list > ul > li > a > i { display: block; width: 24px; height: 24px; flex-shrink: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='18 15 12 9 6 15'/%3E%3C/svg%3E") no-repeat center center / 24px; transition: transform 0.3s ease, background-color 0.2s ease; } 
.bottomarea .bottom_info_list > ul > li > a.on { color: var(--main-light); } 
.bottomarea .bottom_info_list > ul > li > a.on > i { transform: rotate(180deg); } 

.list_toggle { display: none; position: absolute; bottom: 100%; left: 0; width: 100%; height: fit-content; background: #4A5159; z-index: 0; font-size: 1.9rem; padding: 30px 0; z-index: 1; } 
.list_toggle ul { display: flex; align-items: center; gap: 20px; color: #fff; font-weight: 500; flex-wrap: wrap; } 
.list_toggle ul li { position: relative; flex: 1 1 20%; max-width: 20%; } 
.list_toggle ul li::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 13px; background: #ccc; } 
.list_toggle ul li:nth-child(4n)::after {display: none;}
.list_toggle ul li:last-child::after { display: none; } 
.list_toggle ul li a { display: block; color: #fff; word-break: keep-all; padding-right: 20px;} 
.list_toggle ul li a:hover,
.list_toggle ul li a:focus { text-decoration: underline; text-underline-offset: 4px; } 

.bottomarea .f-flex { display: flex; flex-wrap: wrap; align-items: stretch; word-break: keep-all; } 

.bottomarea .address_box { display: flex; flex-direction: column; gap: 1.5rem; width: 50%; } 
.bottomarea .address_box .f-logo { display: block; width: 211px; height: 58px; background: url(../img/layout/logo-wh.png) no-repeat center center / contain; } 

.f-rg-box { display: flex; flex-direction: column; justify-content: space-between; align-items: end; width: 50%; } 
.f-rg-box .f-nav { display: flex; gap: 1.5rem; flex-wrap: wrap; width: 100%; justify-content: end; } 
.f-rg-box .f-nav li a { padding: 8px 16px; border-radius: 4px; border: 1px solid #818892; background: rgba(255, 255, 255, 0.00); } 

/* 푸터 오류신고 버튼 여백 */
.f-rg-box .btn-bace1 { margin: 16px 0 24px; }

.copyright { margin-top: 25px; border-top: 1px solid #56595E; } 


.mo_only { display: none; } 
.pc_only { display: block; } 
@media (max-width: 1440px){
 .bottomarea { padding: 3rem 0; } 
 .bottomarea .bottom_info_list { margin-bottom: 3.0208vw; } 
 }
@media (max-width: 1023px){
 .bottomarea .bottom_info_list a { font-size: clamp(1.6rem, 3vw, 17px); font-weight: 400; } 
 .bottomarea .bottom_info_list .select_box { margin-left: auto; } 
 .bottomarea .bottom_info_list > ul { gap: 10px 24px; flex-wrap: wrap; } 
 .bottomarea .bottom_info_list > ul > li { flex: 1 1 33.3%; } 
 .bottomarea .bottom_info_list > ul > li > a { font-size: clamp(1.6rem, 3vw, 17px); min-height: unset; padding: 12px 0; } 
 .bottomarea .bottom_info_list > ul > li > a::before { display: none; } 


 .bottomarea .f-flex { flex-wrap: wrap; gap: 15px; } 
 .bottomarea .address_box { width: 100%; } 
 .bottomarea .address_box .f-logo { width: 150px; } 
 .f-rg-box { width: 100%; align-items: baseline; gap: 16px; } 
 .f-rg-box .f-nav { justify-content: flex-start; gap: 6px; } 
 .wa_logo img { width: 56px; } 
 }
@media (max-width: 767px){
 .mo_only { display: block; } 
 .pc_only { display: none; } 

 .f-rg-box .f-nav li a { padding: 8px; } 
 .bottomarea { padding-top: 0; } 
 .bottomarea .bottom_info_list > ul { position: relative; gap: unset; padding: 1.5rem 0; } 
 .bottomarea .bottom_info_list > ul::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100vw; height: 1px; background: var(--txt-gray); } 
 .bottomarea .bottom_info_list > ul > li { width: 50%; flex: unset; } 
 .bottomarea .bottom_info_list > ul > li > a { justify-content: center; } 
 .bottomarea .bottom_info_list > ul > li > a > i { display: none; } 
 .bottomarea .bottom_info_list > ul > li > a.on { color: #fff; background: #4A5159; border-radius: 10px; } 
 .list_toggle { left: -15px; width: 100vw; padding: 16px; } 
 .list_toggle .inner-padding { padding: unset; } 
 .list_toggle ul { flex-wrap: wrap; gap: unset; } 
 .list_toggle ul li { flex: unset; max-width: unset; width: 50%; } 
 .list_toggle ul li a { padding: 10px; text-align: left; } 
 .list_toggle ul li::after { display: none; } 
 }


 /* select2 — border 제거 */
 .select2-container--default .select2-selection--single { border: none; background: transparent; } 
 .select2-container--default.select2-container--focus .select2-selection--single { border: none; outline: none; } 
 /* select2 — 키보드 탭 포커스 표시 */
 .select2-container--default .select2-selection--single:focus-visible { outline: 2px dotted #ff0000; outline-offset: -3px; } 
 .select2-dropdown { min-width: 130px; width: 150px; border: none; background: #FFF; box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.10); margin-top: 8px; border-radius: 10px !important; overflow: hidden; } 
 .lang-list + .select2-container--default .select2-selection--single .select2-selection__rendered { color: #1d1d1d; font-weight: 700; } 
 .lang-list01 + .select2-container--default .select2-selection--single .select2-selection__rendered { color: #fff; font-weight: 700; } 
 .lang-list + .select2-container .select2-selection--single .select2-selection__rendered, .lang-list01 + .select2-container .select2-selection--single .select2-selection__rendered { padding-left: 22px; padding-right: 28px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' viewBox='0 0 18 18'%3E%3Cpath fill='%231d1d1d' d='M9 .937a8.064 8.064 0 1 1-.002 16.127A8.064 8.064 0 0 1 9 .937M6.57 9.562q.034 1.115.212 2.216c.145.879.357 1.664.618 2.316.262.656.56 1.137.856 1.444.294.305.547.4.743.4s.449-.095.744-.4c.296-.308.593-.788.855-1.444.26-.652.472-1.437.617-2.315v-.001c.117-.705.188-1.453.212-2.216zm-4.485 0a6.94 6.94 0 0 0 2.007 4.344 6.94 6.94 0 0 0 2.811 1.706 6.6 6.6 0 0 1-.434-.829l-.114-.271c-.297-.742-.527-1.608-.683-2.55v-.002a18 18 0 0 1-.227-2.398zm10.468 0c-.025.822-.101 1.632-.228 2.399a13 13 0 0 1-.575 2.267l-.108.284a7 7 0 0 1-.55 1.1q.285-.089.561-.202a6.94 6.94 0 0 0 3.755-3.755 7 7 0 0 0 .503-2.093zm-5.65-7.175a6.94 6.94 0 0 0-2.81 1.707 6.94 6.94 0 0 0-2.008 4.343h3.36c.024-.821.1-1.632.227-2.4.156-.94.386-1.808.683-2.55l.114-.27q.198-.451.434-.83M9 2.062c-.195 0-.448.095-.744.4h-.001c-.296.307-.593.788-.854 1.443-.261.652-.473 1.438-.618 2.317a17 17 0 0 0-.211 2.215h4.856a17 17 0 0 0-.212-2.215V6.22c-.145-.879-.356-1.664-.617-2.315v-.001c-.262-.655-.56-1.136-.857-1.444-.294-.304-.547-.399-.742-.399m2.092.324q.308.491.551 1.102l.108.283c.246.676.44 1.442.575 2.267.127.767.204 1.578.227 2.4h3.36a6.94 6.94 0 0 0-4.82-6.052'/%3E%3C/svg%3E") no-repeat left center / 16px; } 
 .select2-language-results { z-index: 60; } 
 
 /* select2 — 화살표 SVG 교체 (10x6, 기존 border 삼각형 초기화) */
 .select2-container--default .select2-selection--single .select2-selection__arrow b { border: 0; width: 10px; height: 6px; margin: -3px 0 0 -5px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' viewBox='0 0 10 6'%3E%3Cpath fill='%231d1d1d' fill-rule='evenodd' d='M9.834.128a.5.5 0 0 1 .038.706l-4.5 5a.5.5 0 0 1-.743 0l-4.5-5A.5.5 0 0 1 .871.166L5 4.753 9.128.166a.5.5 0 0 1 .706-.038' clip-rule='evenodd'/%3E%3C/svg%3E") no-repeat center center / 10px 6px; } 
 .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { transform: rotate(180deg); } 
 .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #1d1d1d; } 
 /* 스크롤 영역 */
 #select2-language-results .select2-results__options { scrollbar-width: thin; overscroll-behavior: contain; scrollbar-color: #d9d9d9 transparent; overflow: hidden; overflow-y: hidden; max-height: 240px !important; } 
 .select2-results__options > li { padding: 10px 16px; } 
 /* 스크롤바 */
 .select2-results__options::-webkit-scrollbar { width: 4px; } 
 /* 위/아래 버튼 제거 */
 .select2-results__options::-webkit-scrollbar-button { display: none !important; width: 0; height: 0; } 
 /* 배경 */
 .select2-results__options::-webkit-scrollbar-track { background: transparent; } 
 /* 막대 */
 .select2-results__options::-webkit-scrollbar-thumb { background: #d9d9d9; border-radius: 999px; } 
 .select2-container--open { position: relative; z-index: 10000; } 
 
 .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { color: var(--main); background: #fff; font-weight: 700; } 
 /* select2 드롭다운 옵션 포커스(화살표 이동) 표시 */
 .select2-container--default .select2-results__option--highlighted { outline: 3px dotted #ff0000; outline-offset: -3px; } 
 .select2-container--default .select2-results__option--selected { background: var(--bg-light); } 
 @media only screen and (max-width: 767px){
 .lang-list + .select2-container .select2-selection--single .select2-selection__rendered, .lang-list01 + .select2-container .select2-selection--single .select2-selection__rendered { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' viewBox='0 0 18 18'%3E%3Cpath fill='%23fff' d='M9 .937a8.064 8.064 0 1 1-.002 16.127A8.064 8.064 0 0 1 9 .937M6.57 9.562q.034 1.115.212 2.216c.145.879.357 1.664.618 2.316.262.656.56 1.137.856 1.444.294.305.547.4.743.4s.449-.095.744-.4c.296-.308.593-.788.855-1.444.26-.652.472-1.437.617-2.315v-.001c.117-.705.188-1.453.212-2.216zm-4.485 0a6.94 6.94 0 0 0 2.007 4.344 6.94 6.94 0 0 0 2.811 1.706 6.6 6.6 0 0 1-.434-.829l-.114-.271c-.297-.742-.527-1.608-.683-2.55v-.002a18 18 0 0 1-.227-2.398zm10.468 0c-.025.822-.101 1.632-.228 2.399a13 13 0 0 1-.575 2.267l-.108.284a7 7 0 0 1-.55 1.1q.285-.089.561-.202a6.94 6.94 0 0 0 3.755-3.755 7 7 0 0 0 .503-2.093zm-5.65-7.175a6.94 6.94 0 0 0-2.81 1.707 6.94 6.94 0 0 0-2.008 4.343h3.36c.024-.821.1-1.632.227-2.4.156-.94.386-1.808.683-2.55l.114-.27q.198-.451.434-.83M9 2.062c-.195 0-.448.095-.744.4h-.001c-.296.307-.593.788-.854 1.443-.261.652-.473 1.438-.618 2.317a17 17 0 0 0-.211 2.215h4.856a17 17 0 0 0-.212-2.215V6.22c-.145-.879-.356-1.664-.617-2.315v-.001c-.262-.655-.56-1.136-.857-1.444-.294-.304-.547-.399-.742-.399m2.092.324q.308.491.551 1.102l.108.283c.246.676.44 1.442.575 2.267.127.767.204 1.578.227 2.4h3.36a6.94 6.94 0 0 0-4.82-6.052'/%3E%3C/svg%3E") no-repeat left center / 16px; } 
 .select2-container--default .select2-selection--single .select2-selection__arrow b { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' viewBox='0 0 10 6'%3E%3Cpath fill='%23Fff' fill-rule='evenodd' d='M9.834.128a.5.5 0 0 1 .038.706l-4.5 5a.5.5 0 0 1-.743 0l-4.5-5A.5.5 0 0 1 .871.166L5 4.753 9.128.166a.5.5 0 0 1 .706-.038' clip-rule='evenodd'/%3E%3C/svg%3E") no-repeat center center / 10px 6px; } 
 .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #fff; } 
 }

 /* 메인컨테이너 */
.section1 .inner-padding { max-width: unset; padding: 0 50px; } 
 .main_visual { position: relative; width: 100%; height: 780px; border-radius: 40px; overflow: hidden; margin-top: 90px; } 
.main_visual .main_img { position: absolute; inset: 0; } 
.main_visual .main_img img { width: 100%; height: 100%; object-fit: cover; } 
.main_visual .main_img .banner { position: absolute; inset: 0; opacity: 0; transition: opacity 0.6s ease; } 
.main_visual .main_img .banner.on { opacity: 1; } 
.main_visual .main_img .dim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.4), rgba(0,0,0,0.1)); } 
.main_visual .visual_inner { position: absolute; top: 190px; left: 50%; transform: translateX(-50%); z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 58px; width: 100%; padding: 0 20px; } 
.main_visual .main_txt.center { text-align: center; }
.main_visual .main_txt.center h2 { margin-bottom: 4px; color: #fff; font-size: clamp(28px,4vw,66px); font-weight: 700; line-height: 1.3; letter-spacing: -1.32px; text-shadow: 0 0 5px rgba(0,0,0,0.2); }
.main_visual .main_txt.center h3 { color: #fff; font-size: clamp(18px,2.5vw,34px); font-weight: 500; line-height: 1.5; letter-spacing: -0.68px; text-shadow: 0 0 5px rgba(0,0,0,0.2); }
.visual_search { position: relative; width: 566px; max-width: 90%; height: 64px; } 
.visual_search input { width: 100%; height: 100%; padding: 0 30px; border: 2.5px solid rgba(255,255,255,0.25); border-radius: 100px; background: rgba(255,255,255,0.12); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); box-shadow: 0 2px 30px rgba(0,0,0,0.06); color: #fff; font-size: 19px; font-weight: 700; } 
.visual_search input::placeholder { color: #fff; opacity: 1; }
/* 검색 인풋 상태별(기본/호버/포커스) 스타일 */
.visual_search input { transition: background 0.2s, border-color 0.2s, color 0.2s; }
.visual_search input:hover { background: rgba(255, 255, 255, 0.3); }
.visual_search input:focus { background: #fff; border-color: var(--main); color: #1d1d1d; }
.visual_search input:focus-visible { outline: none; } /* 접근성 초점 표시는 흰 배경 전환 + 파란 테두리가 담당 */
.visual_search input:focus::placeholder { opacity: 0; }
.visual_search:focus-within .btn_search { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%230072CA' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.5' y1='16.5' x2='21' y2='21'/%3E%3C/svg%3E"); }
.visual_search .btn_search { position: absolute; top: 50%; right: 24px; transform: translateY(-50%); width: 34px; height: 34px; border: 0; cursor: pointer; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.5' y1='16.5' x2='21' y2='21'/%3E%3C/svg%3E") no-repeat center / 28px; } 
.visual_quick_wr { position: relative; z-index: 2; width: 100%; max-width: 1420px; margin: -172px auto 0; padding: 0 50px; } 
.visual_cate { padding: 8px; background: #fff; border-radius: 20px; box-shadow: 0 2px 20px rgba(0,0,0,0.06); } 
.visual_cate ul { display: flex; } 
.visual_cate li { flex: 1; } 
.visual_cate li a { display: flex; align-items: center; justify-content: center; height: 64px; padding: 0 16px; border-radius: 16px; font-size: clamp(1.6rem,2vw,17px); font-weight: 700; color: #818892; text-align: center; word-break: keep-all; transition: all 0.2s; } 
.visual_cate li.on a, .visual_cate li a:hover { background: #0072ca; color: #fff; } 

.visual_quick { margin-top: 8px; padding: 16px 40px; background: linear-gradient(to bottom, rgba(255,255,255,0.6), #fff); border: 1px solid #fff; border-radius: 32px; box-shadow: 0 -10px 60px rgba(0,41,76,0.06); backdrop-filter: blur(40px); } 
.visual_quick .quick_panel { display: none; } 
.visual_quick .quick_panel.on { display: flex; justify-content: center; } 
.visual_quick li { flex: 0 0 25%; } 
.visual_quick li a { display: flex; align-items: center; justify-content: center; gap: 16px; width: 100%; height: 100%; padding: 20px 0; } 
.visual_quick li .ico { position: relative; flex-shrink: 0; width: 70px; height: 70px; background-repeat: no-repeat; background-position: center; background-size: contain; } 
.visual_quick li a:hover .ico::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: -15px; width: 8px; height: 8px; border-radius: 10px; background: #17BE65; } 
.visual_quick li em { font-style: normal; font-size: 16px; font-weight: 500; color: var(--txt-gray); word-break: keep-all; } 
.visual_quick li.on em { color: #0e2b5e; font-weight: 800; } 
.visual_quick li a:hover em { font-weight: 600; color: var(--sub-color); } 

/* 분야 퀵링크 아이콘 (패널-항목 매핑) */
.visual_quick .quick_panel[data-panel="1"] li:nth-child(1) .ico { background-image: url(../img/main/quick1-1.svg); } 
.visual_quick .quick_panel[data-panel="1"] li:nth-child(2) .ico { background-image: url(../img/main/quick1-2.svg); } 
.visual_quick .quick_panel[data-panel="1"] li:nth-child(3) .ico { background-image: url(../img/main/quick1-3.svg); } 
.visual_quick .quick_panel[data-panel="1"] li:nth-child(4) .ico { background-image: url(../img/main/quick1-4.svg); } 
.visual_quick .quick_panel[data-panel="2"] li:nth-child(1) .ico { background-image: url(../img/main/quick2-1.svg); } 
.visual_quick .quick_panel[data-panel="2"] li:nth-child(2) .ico { background-image: url(../img/main/quick2-2.svg); } 
.visual_quick .quick_panel[data-panel="2"] li:nth-child(3) .ico { background-image: url(../img/main/quick2-3.svg); }
.visual_quick .quick_panel[data-panel="2"] li:nth-child(4) .ico { background-image: url(../img/main/quick2-4.svg); }
.visual_quick .quick_panel[data-panel="3"] li:nth-child(1) .ico { background-image: url(../img/main/quick3-1.svg); } 
.visual_quick .quick_panel[data-panel="3"] li:nth-child(2) .ico { background-image: url(../img/main/quick3-2.svg); } 
.visual_quick .quick_panel[data-panel="3"] li:nth-child(3) .ico { background-image: url(../img/main/quick3-3.svg); } 
.visual_quick .quick_panel[data-panel="3"] li:nth-child(4) .ico { background-image: url(../img/main/quick3-4.svg); } 
.visual_quick .quick_panel[data-panel="4"] li:nth-child(1) .ico { background-image: url(../img/main/quick4-1.svg); } 
.visual_quick .quick_panel[data-panel="4"] li:nth-child(2) .ico { background-image: url(../img/main/quick4-2.svg); } 
.visual_quick .quick_panel[data-panel="4"] li:nth-child(3) .ico { background-image: url(../img/main/quick4-3.svg); } 
.visual_quick .quick_panel[data-panel="5"] li:nth-child(1) .ico { background-image: url(../img/main/quick5-1.svg); } 
.visual_quick .quick_panel[data-panel="5"] li:nth-child(2) .ico { background-image: url(../img/main/quick5-2.svg); } 
.visual_quick .quick_panel[data-panel="5"] li:nth-child(3) .ico { background-image: url(../img/main/quick5-3.svg); } 
.visual_quick .quick_panel[data-panel="5"] li:nth-child(4) .ico { background-image: url(../img/main/quick5-4.svg); } 
.visual_quick .quick_panel[data-panel="6"] li:nth-child(1) .ico { background-image: url(../img/main/quick6-1.svg); } 
.visual_quick .quick_panel[data-panel="6"] li:nth-child(2) .ico { background-image: url(../img/main/quick6-2.svg); } 
.visual_quick .quick_panel[data-panel="6"] li:nth-child(3) .ico { background-image: url(../img/main/quick6-3.svg); } 
.visual_quick .quick_panel[data-panel="7"] li:nth-child(1) .ico { background-image: url(../img/main/quick7-1.svg); } 
.visual_quick .quick_panel[data-panel="7"] li:nth-child(2) .ico { background-image: url(../img/main/quick7-2.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(1) .ico { background-image: url(../img/main/quick8-1.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(2) .ico { background-image: url(../img/main/quick8-2.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(3) .ico { background-image: url(../img/main/quick8-3.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(4) .ico { background-image: url(../img/main/quick8-4.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(5) .ico { background-image: url(../img/main/quick8-5.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(6) .ico { background-image: url(../img/main/quick8-6.svg); } 
.visual_quick .quick_panel[data-panel="8"] li:nth-child(7) .ico { background-image: url(../img/main/quick8-7.svg); } 

/* quick_panel 내부 가로 스크롤 + 커스텀 스크롤바 */
@media only screen and (min-width: 1024px){
 .visual_quick .quick_panel.on { justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; } 
 .visual_quick .quick_panel.on > li:first-child { margin-left: auto; } 
 .visual_quick .quick_panel.on > li:last-child { margin-right: auto; } 
 .visual_quick .quick_panel { scrollbar-width: thin; scrollbar-color: #D9D9D9 transparent; } 
 .visual_quick .quick_panel::-webkit-scrollbar { height: 8px; } 
 .visual_quick .quick_panel::-webkit-scrollbar-track { background: transparent; } 
 .visual_quick .quick_panel::-webkit-scrollbar-thumb { background-color: #D9D9D9; border-radius: 50px; } 
 .visual_quick .quick_panel::-webkit-scrollbar-button { display: none; width: 0; height: 0; } 
 }

@media only screen and (max-width: 1023px){
 .section1 .inner-padding { padding: 0 20px; } 
 .main_visual { height: 60vh; margin-top: 70px; border-radius: 24px; } 
 .main_visual .visual_inner { top: 80px; } 
 .visual_quick { padding: 20px 25px; } 
 .visual_quick_wr { padding: 0 20px; margin: -150px auto 0; } 
 .visual_quick li { flex: 1; } 
 .visual_quick li a { flex-direction: column; padding: unset; } 
 .visual_quick li .ico { width: 40px; height: 40px; } 
 .visual_quick li em { text-align: center; } 
 .visual_quick .quick_panel.on { gap: 10px 20px; flex-wrap: wrap; } 
 }
 @media only screen and (max-width: 767px){
 .section1 .inner-padding { padding: 0 12px; } 
 .main_visual { margin-top: 71px; height: 460px; } 
 .main_visual .visual_inner { gap: 24px; } 
 .visual_quick_wr { margin: -120px 0 auto 0; } 
 .visual_search { max-width: 100%; height: 45px; } 
 .visual_cate { padding: 5px; } 
 .visual_cate ul { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 16px; } 
.visual_cate li { flex: 0 0 120px; } 
.visual_cate li a { height: 52px; white-space: nowrap; } 
 }
/* ===== section2 맞춤형 정보 ===== */
.custom-info { display: flex; flex-direction: column; align-items: center; gap: 60px; padding: 140px 0 100px; } 
/* ===== 공통 섹션 타이틀 (소제목+점 / 강조 타이틀) — 색만 --head-dot / --head-accent 로 조절 ===== */
.ci-head, .ep-head, .fac-head { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; word-break: keep-all; } 
.ci-label, .ep-label, .fac-label { display: inline-flex; align-items: center; gap: 10px; font-size: clamp(18px, 1.6vw, 24px); font-weight: 700; color: #1d1d1d; } 
.ci-label::before, .ep-label::before, .fac-label::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--head-dot, #008638); margin-top: -10px; } 
.ci-title, .ep-title, .fac-title { font-size: clamp(23px, 3vw, 50px); font-weight: 700; line-height: 1.4; color: #1d1d1d; } 
.ci-title b, .ep-title b, .fac-title b { color: var(--head-accent, #008638); font-weight: 700; } 
.custom-info { --head-dot: #008638; --head-accent: #008638; } 
.custom-info .ci-cards { display: flex; gap: 16px; width: 100%; align-items: stretch; } 
.custom-info .ci-card { flex: 1; min-width: 0; border-radius: 30px; background: #f6f6f7; overflow: hidden; transition: background .3s; } 
.custom-info .ci-card.on,
.custom-info .ci-card:hover { background: #0e2b5e; } 
.custom-info .ci-card a { display: flex; flex-direction: column; height: 100%; min-height: 296px; padding: 0; border-radius: 30px; outline-offset: -3px; } 
.custom-info .ci-card .ci-img { flex: 1; min-height: 184px; margin: 0; border-radius: 30px; transition: margin .3s, border-radius .3s; } 
.custom-info .ci-card.on .ci-img,
.custom-info .ci-card:hover .ci-img { margin: 16px 16px 0; border-radius: 20px; } 
.custom-info .ci-card .ci-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 30px 30px; } 
.custom-info .ci-card .ci-bottom strong { font-size: clamp(18px, 1.8vw, 24px); font-weight: 500; color: #1d1d1d; word-break: keep-all; transition: color .3s; }
.custom-info .ci-card.on .ci-bottom strong,
.custom-info .ci-card:hover .ci-bottom strong { color: #fff; } 
.custom-info .ci-card .ci-arr { flex-shrink: 0; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #fff; transition: background-color .3s; } 
.custom-info .ci-card .ci-arr::after { content: ""; width: 20px; height: 20px; transition: transform .3s; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%231d1d1d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; } 
.custom-info .ci-card.on .ci-arr,
.custom-info .ci-card:hover .ci-arr { background-color: #17be65; } 
.custom-info .ci-card.on .ci-arr::after,
.custom-info .ci-card:hover .ci-arr::after { transform: rotate(-45deg); } 
@media (max-width: 767px){
 .ci-label::before, .ep-label::before, .fac-label::before { width: 7px; height: 7px; margin-top: -10px; } 
 }
/* custom-info 모바일(2열) 레이아웃 - 767 -> 1023 부터 적용. 6번째 안내 카드(mo_only)는 이 구간에서만 노출 */
@media (max-width: 1023px){
 .custom-info { gap: 32px; padding: 50px 0 0 0; } 
.custom-info .ci-cards { flex-wrap: wrap; gap: 15px; } 
.custom-info .ci-card { flex: 1 1 calc(50% - 12px); border-radius: 14px; } 
.custom-info .ci-card a { min-height: 0; } 
.custom-info .ci-card .ci-img { flex: 0 0 108px; min-height: 108px; height: 108px; border-radius: 14px; } 
.custom-info .ci-card:hover .ci-img { margin: 0; border-radius: 14px; } 
.custom-info .ci-card .ci-bottom { padding: 6px 10px 14px 14px; gap: 8px; } 
.custom-info .ci-card .ci-bottom strong { flex: 1; min-width: 0; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.custom-info .ci-card .ci-arr { width: 26px; height: 26px; } 
.custom-info .ci-card .ci-arr::after { width: 12px; height: 12px; } 
.custom-info .ci-card.mo_only { display: block; } 
.custom-info .ci-card-info { background: #eff7ff; } 
.custom-info .ci-card-info .ci-info-inner { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; height: 100%; min-height: 144px; padding: 14px 10px 14px 14px; } 
.custom-info .ci-card-info .ci-info-img { width: 51px; height: 52px; background: url(../img/main/sec2-06.svg) no-repeat center / contain; } 
.custom-info .ci-card-info .ci-info-txt { font-weight: 500; line-height: 1.4; color: #1d1d1d; word-break: keep-all; } 
 }
/* 카드 이미지 (유학생/외국인근로자/결혼이민자/동포) */
.custom-info .ci-img1 { background: url(../img/main/sec2-01.png)no-repeat center / cover; } 
.custom-info .ci-img2 { background: url(../img/main/sec2-02.png)no-repeat center / cover; } 
.custom-info .ci-img3 { background: url(../img/main/sec2-03.png)no-repeat center / cover; } 
.custom-info .ci-img4 { background: url(../img/main/sec2-04.png)no-repeat center / cover; } 
.custom-info .ci-img5 { background: url(../img/main/sec2-05.png)no-repeat center / cover; } 
/* ===== section3 (소식/미디어) ===== */
.section3 { position: relative; padding: 0 0 120px; overflow: hidden; } 
.section3::after { content: ""; position: absolute; top: 100px; left: 0; width: 100%; height: 100%; background: #f1f6fc; z-index: -100; } 
/* ---- 상단 notice ---- */
.notice-flex { margin-bottom: 120px; } 
.section-wrap .notice-flex .inner-padding { max-width: 1730px; margin: unset; display: flex; align-items: end; gap: 60px; padding-right: 20px; } 
.notice-flex .lf-tit { position: relative; display: flex; justify-content: end; align-items: flex-end; max-width: 810px; width: 100%; min-height: 682px; padding: 0 80px 64px 60px; border-radius: 0 60px 60px 0; overflow: hidden; background: url(../img/main/sec03-top-lf-bg.png) no-repeat right center / cover; } 
.notice-flex .lf-tit strong { color: #fff; font-size: clamp(26px, 3.2vw, 50px); font-weight: 700; line-height: 1.4; text-shadow: 0 0 8px rgba(0,0,0,0.6); word-break: keep-all; } 
.notice-flex .rg-cont { flex: 1; min-width: 0; display: flex; flex-direction: column; padding-bottom: 40px; } 

/* 탭 */
.notice-flex .tab-btn { display: flex; align-items: center; gap: 24px; margin-bottom: 28px; } 
.notice-flex .tab-btn a { position: relative; display: inline-flex; align-items: center; gap: 8px; font-size: clamp(16px, 1.6vw, 26px); font-weight: 700; color: #757575; transition: color 0.2s; } 
.notice-flex .tab-btn a.on { color: var(--main); } 
.notice-flex .tab-btn a.on::before { content: ""; width: 10px; height: 10px; border-radius: 100px; background: var(--main); margin-top: -15px; } 

/* 탭 콘텐츠 */
.notice-flex .tab-cont { display: none; } 
.notice-flex .tab-cont.on { display: block; } 
.notice-flex .tab-cont .swiper { position: relative; width: 100%; overflow: hidden; padding: 10px; margin: -10px; } 
.notice-flex .tab-cont .swiper::after { content: ""; position: absolute; top: 0; right: 0; width: 25px; height: 100%; background: linear-gradient(270deg, #F1F6FC 0%, rgba(241, 246, 252, 0.00) 121.29%); z-index: 1; } 
.notice-flex .tab-cont .swiper-slide { width: 300px; height: auto; } 
.notice-flex .tab-cont .swiper-slide > a { position: relative; display: flex; flex-direction: column; gap: 14px; height: 284px; padding: 24px; border-radius: 30px; background: #fff; transition: box-shadow 0.3s; } 
.notice-flex .tab-cont .swiper-slide > a:hover { box-shadow: 0 0 10px rgba(0, 41, 76, 0.057); } 
.notice-flex .tab-cont .swiper-slide > a:hover > p { text-decoration: underline; } 
.notice-cate { align-self: flex-start; padding: 8px 18px; border-radius: 50px; font-size: 16px; font-weight: 700; color: #fff; background: #0072ca; } 
.notice-cate.cate02 { background: #008638; } 
.notice-cate.cate03 { background: #e23f63; } 
.notice-flex .tab-cont .txt-over2 { flex: 1; font-size: clamp(17px, 1.3vw, 22px); font-weight: 600; line-height: 1.5; color: #1d1d1d; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } 
.notice-flex .tab-cont .notice-date { font-size: 17px; color: #757575; } 
.notice-flex .tab-cont .swiper-slide .arr { position: absolute; right: 0; bottom: 0; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 50%; box-shadow: 0 0 0 12px #f1f6fc; background-color: #fff; transition: background-color .3s ease; z-index: -1; } 
.notice-flex .tab-cont .swiper-slide .arr i { flex-shrink: 0; width: 40%; height: 40%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%2356595e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; transition: transform .3s ease, background-color .3s ease; } 
.notice-flex .tab-cont .swiper-slide > a:focus-visible { outline-offset: 3px; } 
.notice-flex .tab-cont .swiper-slide > a:hover .arr { background-color: #0072ca; } 
.notice-flex .tab-cont .swiper-slide > a:hover .arr i { transform: rotate(-45deg); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; } 
.notice-flex .tab-cont .swiper-slide .arr::before, .notice-flex .tab-cont .swiper-slide .arr::after { content: ""; position: absolute; width: 30px; height: 30px; background: url(../img/main/sec2-anchor-bg.svg) no-repeat center / contain; } 
.notice-flex .tab-cont .swiper-slide .arr::before { right: 0; bottom: calc(100% + 10px); } 
.notice-flex .tab-cont .swiper-slide .arr::after { right: 71px; bottom: 0; } 
.notice-flex .tab-cont .swiper-slide > a::before, .notice-flex .tab-cont .swiper-slide > a::after { content: ""; position: absolute; width: 30px; height: 30px; background: url(../img/main/sec2-anchor-bg.svg) no-repeat center / contain; } 
.notice-flex .tab-cont .swiper-slide > a::before { right: 0; bottom: 40px; transform: rotateX(180deg); } 
.notice-flex .tab-cont .swiper-slide > a::after { right: 41px; bottom: 0; transform: rotateY(180deg); } 
.notice-flex .more-btn { align-self: flex-start; margin-top: 28px; display: inline-flex; align-items: center; gap: 8px; padding: 13px 24px; border: 1px solid #ccd1d8; border-radius: 50px; font-size: 18px; font-weight: 500; color: var(--txt-gray); transition: all .3s ease; } 
.notice-flex .more-btn i { width: 18px; height: 18px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22' fill='none'%3E%3Cpath d='M4.33786 10.0828L15.4498 10.0828L10.9864 5.6194C10.6284 5.26142 10.6284 4.68115 10.9864 4.32317C11.3444 3.96519 11.9246 3.96519 12.2826 4.32317L18.3108 10.3513L18.3734 10.4212C18.6671 10.7812 18.6464 11.3119 18.3108 11.6476L12.2826 17.6757C11.9246 18.0337 11.3444 18.0337 10.9864 17.6757C10.6284 17.3177 10.6284 16.7375 10.9864 16.3795L15.4498 11.9161L4.33786 11.9161C3.8316 11.9161 3.42119 11.5057 3.42119 10.9994C3.42119 10.4932 3.8316 10.0828 4.33786 10.0828Z' fill='%2356595E'/%3E%3C/svg%3E") no-repeat center / contain; } 
.notice-flex .more-btn:hover { color: var(--main); border: 1px solid var(--main); } 
.notice-flex .more-btn:hover i { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22' fill='none'%3E%3Cpath d='M4.33786 10.0828L15.4498 10.0828L10.9864 5.6194C10.6284 5.26142 10.6284 4.68115 10.9864 4.32317C11.3444 3.96519 11.9246 3.96519 12.2826 4.32317L18.3108 10.3513L18.3734 10.4212C18.6671 10.7812 18.6464 11.3119 18.3108 11.6476L12.2826 17.6757C11.9246 18.0337 11.3444 18.0337 10.9864 17.6757C10.6284 17.3177 10.6284 16.7375 10.9864 16.3795L15.4498 11.9161L4.33786 11.9161C3.8316 11.9161 3.42119 11.5057 3.42119 10.9994C3.42119 10.4932 3.8316 10.0828 4.33786 10.0828Z' fill='%230072ca'/%3E%3C/svg%3E") no-repeat center / contain; } 
@media only screen and (max-width: 1440px) { 
 .notice-flex .rg-cont { padding-bottom: 0; } 
 .notice-flex .inner-padding { padding: 0 20px 0 0; gap: 40px; } 
 .notice-flex .lf-tit { max-width: 600px; min-height: 560px; } 
 .notice-flex .tab-cont .swiper-slide > a { height: 240px; } 
 }
@media only screen and (max-width: 1023px){
 .section3 { padding: 50px 0 80px 0; } 
/* notice-flex 반응형(스택형) - 1023 이하 적용 */
.notice-flex { margin-bottom: 40px; } 
.notice-flex .inner-padding { flex-direction: column; align-items: stretch; gap: 24px; padding: 0 16px; } 
.notice-flex .lf-tit { position: relative; left: -20px; max-width: none; width: 100%; min-height: 250px; justify-content: flex-start; align-items: flex-end; padding: 0 20px 24px; border-radius: 0 20px 20px 0; background: url(../img/main/sec03-top-lf-bg-mo.png) no-repeat left center / contain; } 
.notice-flex .lf-tit strong { font-size: 20px; line-height: 1.4; } 
.section-wrap .notice-flex .inner-padding { gap: 30px; } 
.notice-flex .rg-cont { padding-bottom: 0; } 
.notice-flex .tab-btn { gap: 16px; margin-bottom: 20px; flex-wrap: wrap;} 
.notice-flex .tab-btn a { font-size: 16px; } 
.notice-flex .tab-btn a.on::before { width: 6px; height: 6px; margin-top: -12px; } 
.notice-flex .tab-cont .swiper-slide { width: 217px; } 
.notice-flex .tab-cont .swiper-slide > a { height: 206px; gap: 12px; padding: 18px; border-radius: 22px; } 
.notice-cate { padding: 6px 14px; font-size: 15px; } 
.notice-flex .tab-cont .txt-over2 { font-size: 16px; } 
.notice-flex .tab-cont .notice-date { font-size: 14px; } 
.notice-flex .tab-cont .swiper-slide .arr { width: 34px; height: 34px; border-radius: 50%; box-shadow: 0 0 0 7px #f1f6fc; background-size: 34px; } 
.notice-flex .tab-cont .swiper-slide > a::before, .notice-flex .tab-cont .swiper-slide > a::after { width: 17px; height: 17px; } 
.notice-flex .tab-cont .swiper-slide .arr::before, .notice-flex .tab-cont .swiper-slide .arr::after { width: 17px; height: 17px; } 
.notice-flex .tab-cont .swiper-slide .arr::before { bottom: calc(100% + 6px); } 
.notice-flex .tab-cont .swiper-slide .arr::after { right: calc(100% + 6px); } 
.notice-flex .more-btn { margin-top: 20px; padding: 8px 18px; font-size: 14px; } 
.notice-flex .more-btn i { width: 16px; height: 16px; } 
.notice-flex .rg-cont { width: 100%; } 
.notice-flex .tab-cont .swiper-slide > a::before {bottom: 24px;}
.notice-flex .tab-cont .swiper-slide > a::after {right: 24px;}
 }
@media only screen and (max-width: 767px){
 .section3 { padding: 50px 0 50px 0; } 
 }
/* ---- 하단 media ---- */
.media .inner-padding { display: flex; gap: 24px; align-items: stretch; } 
.media .seoul-life, .media .news-letter { flex: 0 0 376px; min-width: 0; display: flex; flex-direction: column; gap: 16px; } 
.media .media-card { display: block; padding: 3px; } 
.media .media-gall { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 16px; } 
.media .tit-top { display: flex; align-items: center; justify-content: space-between; height: 40px; } 
.media .tit-top h2 { display: inline-flex; align-items: center; gap: 10px; font-size: clamp(20px, 1.8vw, 28px); font-weight: 700; color: #1d1d1d; } 
.media .tit-top h2::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #1e9def; } 
.media .media-gall .swiper-control { flex: 1; display: flex; align-items: center; justify-content: flex-end; gap: 24px; } 
.media .media-gall .swiper-control .control-btns { display: flex; align-items: center; gap: 8px; } 
.media .media-gall .swiper-control .fraction { width: fit-content; font-size: 17px; color: #bdc2c9; } 
.media .media-gall .swiper-control .fraction .swiper-pagination-current { color: #1d1d1d; } 
.media .media-gall .control-btns > div { width: 40px; height: 40px; border: 1px solid #ccd1d8; border-radius: 50%; cursor: pointer; background-repeat: no-repeat; background-position: center; transition: all 0.2s; } 
.media .media-gall .control-btns > div:hover { border-color: #0072ca; } 
.media .media-gall .swiper-prev { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%2356595e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E"); background-size: 20px; } 
.media .media-gall .swiper-next { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%2356595e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E"); background-size: 20px; } 
.media .media-gall .swiper-stop { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%2356595e'%3E%3Cpath d='M7 5h3v14H7zM14 5h3v14h-3z'/%3E%3C/svg%3E"); background-size: 16px; } 
.media .media-gall .swiper-play { display: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%2356595e'%3E%3Cpath d='M7 5l12 7-12 7z'/%3E%3C/svg%3E"); background-size: 16px; } 
.media .media-gall .swiper { width: 100%;; overflow: hidden; } 
.media .media-gall .swiper-slide a { display: block; padding: 3px; } 
.media .img-wrap { position: relative; border-radius: 30px; overflow: hidden; } 
.media .img-wrap img { display: block; width: 100%; height: 500px; object-fit: cover; } 
.media .img-wrap .arr { position: absolute; right: 19px; bottom: 19px; width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.2); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: background-color .3s ease; } 
.media .img-wrap .arr::after { content: ""; width: 25px; height: 25px; transition: transform .3s ease; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; } 
.media a:hover .arr { background-color: #0072ca; } 
.media a:hover .arr::after { transform: rotate(-45deg); } 
.media .txt-over1 { display: block; margin-top: 16px; font-size: clamp(18px, 1.4vw, 22px); font-weight: 500; color: #1d1d1d; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: normal; } 
@media only screen and (max-width: 1300px){
 .media .inner-padding { gap: 20px; } 
.media .seoul-life, .media .news-letter { flex: 0 0 300px; } 
.media .img-wrap img { height: 420px; } 
 }
@media only screen and (max-width: 1023px){
 .media .inner-padding { gap: 16px; } 
.media .seoul-life, .media .news-letter { flex: 0 0 240px; gap: 12px; } 
.media .img-wrap img { height: 340px; } 
.media .tit-top h2 { font-size: clamp(18px, 2vw, 24px); } 
.media .txt-over1 { font-size: clamp(16px, 1.6vw, 20px); } 
 }
@media only screen and (max-width: 870px){
 .media .inner-padding { flex-wrap: wrap; gap: 25px 12px; } 
.media .seoul-life, .media .news-letter { flex: 1 1 calc(50% - 6px); gap: 8px; } 
.media .media-gall { flex: 1 1 100%; gap: 12px; } 
.media .img-wrap { border-radius: 20px; } 
.media .img-wrap .arr { width: 40px; height: 40px; right: 12px; bottom: 12px; } 
.media .img-wrap .arr::after { width: 18px; height: 18px; } 
.media .tit-top h2::before { width: 6px; height: 6px; } 
.media .txt-over1 { margin-top: 8px; } 
.media .media-gall .swiper-control { gap: 12px; } 
.media .media-gall .control-btns > div { width: 32px; height: 32px; background-size: 16px; } 
.media .media-gall .swiper-control .fraction { font-size: 14px; } 
 }
@media only screen and (max-width: 870px){
 .media .seoul-life .img-wrap, .media .news-letter .img-wrap { aspect-ratio: 376 / 500; } 
.media .seoul-life .img-wrap img, .media .news-letter .img-wrap img { height: 100%; } 
.media .media-gall .img-wrap img { height: clamp(160px, 42vw, 340px); } 
 }

/* 미디어 카드 이미지 호버 확대 */
.media a .img-wrap img { transition: all 0.3s; }
.media a:hover .img-wrap img,
.media a:focus-visible .img-wrap img { transform: scale(1.05); }
/* ===== section4 (교육 프로그램) ===== */
.section4 { background: #fff; padding: 120px 0; overflow: hidden; } 
.edu-program { --head-dot: var(--main); --head-accent: var(--main); } 
.edu-program .ep-head { margin-bottom: 60px; } 

/* 스와이퍼 / 카드 */
.program-swiper { width: 100%; overflow: hidden; } 
.program-swiper .swiper-wrapper { padding: 6px 0; } 
.program-swiper .swiper-slide { width: 360px; height: auto; } 
.ep-card { position: relative; display: flex; flex-direction: column; gap: 24px; height: 100%; min-height: 486px; padding: 40px; border-radius: 30px; background: var(--light-gray); transition: background .3s; } 
.ep-card:hover { background: var(--bg-light); } 
.ep-card:focus-visible { outline-offset: 3px; } 
.ep-card .ep-cate { font-size: clamp(15px,2.5vw, 19px); font-weight: 700; line-height: 1.5; color: var(--main); } 
.ep-card .ep-name { font-size: clamp(17px, 2.5vw, 28px); font-weight: 700; line-height: 1.5; color: #1d1d1d; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } 
.ep-card:hover .ep-name { text-decoration: underline; text-underline-offset: 3px; } 
.ep-card .ep-info { display: flex; flex-direction: column; gap: 20px; } 
.ep-card .ep-info dt { font-size: clamp(16px,2.5vw, 19px); font-weight: 700; line-height: 1.5; color: #1d1d1d; } 
.ep-card .ep-info dd { margin-top: 4px; font-size: clamp(16px,2.5vw, 19px); font-weight: 400; line-height: 1.5; color: var(--txt-gray); } 
.ep-card:hover .ep-info dd { color: #1d1d1d; } 
.ep-card .ep-arr { position: absolute; right: 0; bottom: 0; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 50%; box-shadow: 0 0 0 12px #fff; background-color: #f6f6f7; transition: background-color .3s ease; z-index: -1; } 
.ep-card .ep-arr i { flex-shrink: 0; width: 40%; height: 40%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%2356595e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; transition: transform .3s ease, background-color .3s ease; } 
.ep-card:hover .ep-arr { background-color: #0072ca; } 
.ep-card:hover .ep-arr i { transform: rotate(-45deg); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; } 
/* 화살표 버튼 노치 둥근 모서리(가상요소 fillet) */
.ep-card .ep-arr::before, .ep-card .ep-arr::after { content: ""; position: absolute; width: 30px; height: 30px; background: url(../img/main/anchor-bg.svg) no-repeat center / contain; } 
.ep-card .ep-arr::before { right: 0; bottom: calc(100% + 10px); } 
.ep-card .ep-arr::after { right: calc(100% + 10px); bottom: 0; } 
.ep-card::before, .ep-card::after { content: ""; position: absolute; width: 30px; height: 30px; background: url(../img/main/anchor-bg.svg) no-repeat center / contain; } 
.ep-card::before { right: 0; bottom: 40px; transform: rotateX(180deg); } 
.ep-card::after { right: 42px; bottom: 0; transform: rotateY(180deg); } 

/* 하단 컨트롤 */
.edu-program .ep-control { display: flex; align-items: center; gap: 32px; margin-top: 40px; } 
.edu-program .ep-nav { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } 
.edu-program .ep-nav button { width: 54px; height: 54px; border: 1px solid #ccd1d8; border-radius: 50%; cursor: pointer; background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: 24px; transition: border-color .2s, opacity .2s; } 
.edu-program .ep-nav button:hover { border-color: var(--main); } 
.edu-program .ep-nav button.swiper-button-disabled { opacity: .4; cursor: default; border-color: #ccd1d8; } 
.edu-program .ep-prev { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23818892' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E"); } 
.edu-program .ep-next { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23818892' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E"); } 
.edu-program .ep-control .program-progress { position: relative; flex: 1 1 auto; width: auto; height: 6px; margin: 0; background: var(--light-gray); border-radius: 40px; overflow: hidden; } 
.edu-program .ep-control .program-progress .swiper-pagination-progressbar-fill { background: var(--bd-dark); border-radius: 40px; } 
.edu-program .ep-more { flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; padding: 14px 24px; border: 1px solid #ccd1d8; border-radius: 50px; font-size: 19px; font-weight: 500; color: #818892; background: #fff; transition: border-color .2s, color .2s; } 
.edu-program .ep-more:hover { border-color: var(--main); color: var(--main); } 
.edu-program .ep-more i { width: 22px; height: 22px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23818892' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; } 

@media (max-width: 1023px){
 .section4 { padding: 50px 0 0 0; } 
.edu-program .ep-head { margin-bottom: 32px; } 
.program-swiper .swiper-slide { width: 280px; } 
.ep-card { min-height: 420px; padding: 3rem; gap: 12px; padding: 24px; border-radius: 17px; } 
.edu-program .ep-control { gap: 16px; flex-wrap: wrap; margin-top: 28px; } 
.edu-program .ep-more { width: 100%; justify-content: center; } 
.ep-card .ep-arr { width: 34px; height: 34px; background-size: 34px; border-radius: 50%; } 
.ep-card .ep-arr::before, .ep-card .ep-arr::after { width: 20px; height: 20px; } 
.ep-card .ep-arr::before { bottom: 46px; } 
.ep-card::before, .ep-card::after { width: 20px; height: 20px; } 
.ep-card::before { bottom: 26px; } 
.ep-card::after { right: 26px; } 
 }
@media (max-width: 767px){
 .program-swiper .swiper-slide { width: 270px; } 
 .ep-card { padding: 2.4rem; min-height: 315px; padding-bottom: 3rem; } 
 .ep-card .ep-info { gap: 12px; } 
 .edu-program .ep-control { flex-wrap: nowrap; justify-content: space-between; gap: 12px; align-items: center; margin-top: 24px; } 
 .edu-program .ep-control .program-progress { display: none; } 
 .edu-program .ep-more { order: -1; width: auto; padding: 8px 14px; gap: 6px; font-size: 15px; } 
 .edu-program .ep-more i { width: 18px; height: 18px; } 
 .edu-program .ep-nav button { width: 32px; height: 32px; background-size: 16px; } 
 }
/* ===== section5 (외국인지원시설) ===== */
.section5 { position: relative; padding: 120px 0 60px; margin-bottom: 100px; overflow: hidden; border-radius: 0 0 140px 140px; background: linear-gradient(180deg, #FFF 11.52%, #F6F6F7 20.3%); } 
.facility { --head-dot: #17be65; --head-accent: #008638; } 
.facility .fac-head { margin-bottom: 48px; } 

/* 탭 (스와이퍼) */
.facility .fac-tab { display: flex; align-items: center; gap: 8px; margin-bottom: 40px; } 
.facility .fac-cate { flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; height: 66px; padding: 0 20px 0 24px; border: 1.5px solid #0e2b5e; border-radius: 100px; background: #fff; font-size: clamp(17px, 1.3vw, 22px); font-weight: 600; color: #0e2b5e; cursor: pointer; white-space: nowrap; } 
.facility .fac-cate .cate-arr { width: 24px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%230e2b5e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat center / contain; } 
.facility .fac-divider { flex-shrink: 0; width: 1px; height: 51px; background: #e0e3e8; margin: 0 8px; } 
.facility .fac-cate-wrap { position: relative; flex-shrink: 0; } 
.facility .fac-cate .cate-arr { transition: transform .2s; } 
.facility .fac-cate-wrap.open .cate-arr { transform: rotate(180deg); } 
.facility .fac-cate-list { position: absolute; top: calc(100% + 8px); left: 0; z-index: 20; min-width: 100%; width: max-content; max-width: 360px; padding: 8px; list-style: none; background: #fff; border: 1px solid #e0e3e8; border-radius: 16px; box-shadow: 0 8px 24px rgba(0,0,0,0.1); display: none; } 
.facility .fac-cate-wrap.open .fac-cate-list { display: block; } 
.facility .fac-cate-list li button { display: block; width: 100%; text-align: left; padding: 12px 16px; border-radius: 10px; font-size: 17px; font-weight: 500; color: #56595e; cursor: pointer; transition: background .15s, color .15s; } 
.facility .fac-cate-list li button:hover { background: var(--bg-light); color: #0e2b5e; } 
.facility .fac-cate-list li button.on { background: #0e2b5e; color: #fff; } 
.facility .fac-swipers { flex: 1; min-width: 0; } 
.facility .fac-tab.cat-single .fac-divider, .facility .fac-tab.cat-single .fac-swipers { display: none; } 
.facility .fac-swiper { overflow: hidden; display: none; } 
.facility .fac-swiper.on { display: block; } 
.facility .fac-cont { display: none; } 
.facility .fac-cont.on { display: block; } 
.facility .fac-swiper .swiper-slide { width: auto; } 
.facility .fac-tab-btn { display: inline-flex; align-items: center; justify-content: center; padding: 20px 24px; border: 1px solid #bdc2c9; border-radius: 60px; background: #fff; font-size: 17px; font-weight: 500; color: #56595e; white-space: nowrap; cursor: pointer; transition: all .2s; } 
.facility .fac-tab-btn:hover { border-color: #0e2b5e; color: #0e2b5e; } 
.facility .fac-tab-btn.on { background: #0e2b5e; border-color: #0e2b5e; color: #fff; font-weight: 700; } 
.facility .fac-panel { display: none; } 
.facility .fac-panel.on { display: block; } 

/* 지도 + 정보 */
.facility .fac-body { display: flex; gap: 40px; align-items: flex-start; margin-bottom: 80px; } 
.facility .fac-left { flex: 1; min-width: 0; } 
.facility .fac-intro { margin-bottom: 16px; } 
.facility .fac-intro-top { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; } 
.facility a.fac-go:hover { transform: translate(2px, -2px); } 
.facility .fac-cname { font-size: clamp(20px, 1.7vw, 24px); font-weight: 700; color: #1d1d1d; } 
.facility .fac-go { flex-shrink: 0; cursor: pointer; width: 40px; height: 40px; border-radius: 50%; background: #008638 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") no-repeat center / 16px; transition: transform .2s; } 
/* fac-desc 2줄 높이 고정 - 지도 위치 유지 */
.facility .fac-desc { font-size: 17px; line-height: 1.5; color: #1d1d1d; letter-spacing: -0.34px; min-height: 3em; }
.facility .fac-map { position: relative; left: 100px; margin-top: 16px; display: flex; align-items: center; justify-content: center; } 
.facility .fac-map img { display: block; width: 100%; max-width: 785px; height: auto; } 
/* 지역명 라벨(fac-region) - .fac-map 기준 absolute */
.facility .fac-map .fac-region { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; font-size: clamp(13px, 1vw, 16px); font-weight: 700; line-height: 1.2; color: #1d1d1d; white-space: nowrap; background: #fff; padding: 6px 20px; border-radius: 100px; border: 2px solid #008638; pointer-events: none; } 
.facility .fac-map .region-gangnam { left: 70%; top: 76%; } 
.facility .fac-map .region-geumcheon { left: 33%; top: 88%; } 
.facility .fac-map .region-seocho { left: 61%; top: 83%; } 
.facility .fac-map .region-seongbuk { left: 60%; top: 37%; } 
.facility .fac-map .region-mapo { left: 34%; top: 52%; } 
.facility .fac-map .region-yongsan { left: 52%; top: 61%; } 
.facility .fac-map .region-eunpyeong { left: 40%; top: 29%; } 
.facility .fac-map .region-jongno { left: 50%; top: 39%; } 
.facility .fac-map .region-seongdong { left: 66%; top: 54%; } 
.facility .fac-map .region-gangdong { left: 87%; top: 54%; }
.facility .fac-map .region-yangcheon { left: 22%; top: 65%; } 
.facility .fac-map .region-yeongdeungpo { left: 34%; top: 66%; } 
.facility .fac-map .region-seodaemun { left: 41%; top: 44%; } 

/* 비활성(회색) 지역 라벨 */
.facility .fac-map .fac-region.off { color: #757575; border-color: #BDC2C9; }

.facility .fac-info { position: relative; flex-shrink: 0; width: 600px; display: flex; flex-direction: column; gap: 16px; padding: 24px; border-radius: 30px; background: rgba(255, 255, 255, 0.20); box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.08); backdrop-filter: blur(10px); } 
.facility .fac-row { display: flex; align-items: center; gap: 4px; padding: 12px 24px; border-radius: 16px; background: #fff; } 
.facility .fac-key { position: relative; flex-shrink: 0; width: 200px; padding-left: 20px; font-size: 19px; font-weight: 700; line-height: 1.5; color: #1d1d1d; } 
.facility .fac-key::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: #17be65; } 
.facility .fac-val { font-size: 19px; line-height: 1.5; color: #56595e; } 
.facility .fac-row-time { flex-direction: column; align-items: stretch; gap: 16px; } 
.facility .fac-time-top { display: flex; align-items: center; gap: 4px; } 
.facility .fac-days { display: flex; flex-direction: column; gap: 8px; padding-left: 18px; } 
.facility .fac-days li { display: flex; align-items: center; gap: 8px; } 
.facility .d-name { flex-shrink: 0; width: 100px; font-size: 17px; line-height: 1.5; color: #1d1d1d; } 
.facility .d-time { flex: 0 0 130px; min-width: 0; font-size: 17px; line-height: 1.5; color: #1d1d1d; } 
.facility .d-flags { flex: 1; display: flex; align-items: center; gap: 10px; } 
.facility .d-flags i { width: 25px; height: 25px; border-radius: 60px; border: 1px solid #e0e3e8; background: #e0e3e8; } 
.facility .d-flags i.on { background: rgba(234,234,234,0.2); } 
.facility .d-flags img { width: 25px; height: 25px; border-radius: 60px; border: 1px solid #e0e3e8; background: #fff; object-fit: cover; } 

@media only screen and (max-width: 1023px){
 .facility .fac-map { left: unset; } 
 .facility .fac-body { flex-direction: column; margin-bottom: 50px; } 
 .facility .fac-info { width: 100%; } 
 
 .facility .fac-svc-list .swiper-pagination { position: static; display: block; margin-top: 10px; } 
 }
 @media (max-width: 767px){
 .section5 { padding: 50px 0; margin-bottom: 50px; border-radius: 50px; } 
 .facility .fac-head { margin-bottom: 28px; } 
 .facility .fac-tab { flex-direction: column; margin-bottom: 24px; } 
 .facility .fac-swipers { width: 100%; } 
 .facility .fac-cate-wrap { width: 100%; } 
 .facility .fac-cate { width: 100%; height: 46px; font-size: 16px; justify-content: space-between; } 
 .facility .fac-divider { display: none; } 
 .facility .fac-map { left: unset; } 
 .facility .fac-info { padding: 1.5rem; } 
 .facility .fac-key { font-size: 16px; } 
 .facility .fac-val { font-size: 16px; } 
 .facility .d-flags i { width: 20px; height: 20px; } 
 .facility .svc-card.svc-img .svc-label { left: 10px; right: 10px; bottom: 10px; } 
 .facility .fac-row { flex-direction: column; align-items: baseline; padding: 12px 14px; } 
 .facility .fac-days { padding-left: unset; } 
 .facility .fac-days li { flex-wrap: wrap; } 
 .facility .fac-tab-btn { padding: 12px 14px; font-size: 15px; } 
 .facility .fac-time-top { flex-direction: column; align-items: baseline;} 
 .facility .fac-go { width: 28px; height: 28px; } 
 }
/* 주요 서비스 */
.facility .fac-svc-tit { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px; font-size: clamp(22px, 1.8vw, 28px); font-weight: 700; color: #1d1d1d; } 
.facility .fac-svc-tit::before { content: ""; width: 8px; height: 8px; border-radius: 100px; background: #17be65; } 
.facility .fac-svc-list { position: relative; } 
.facility .fac-svc-list .swiper-pagination-bullet { width: 12px; height: 12px; background: transparent; opacity: 1; transition: width .2s, background .2s; border: 1px solid var(--txt-gray); border-radius: 40px; } 
.facility .fac-svc-list .swiper-pagination-bullet-active { background: var(--main); border: 1px solid var(--main); } 

@media (min-width: 1023px){
 .facility .fac-svc-list .swiper-wrapper { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; align-items: stretch; } 
 }
.facility .fac-svc-list li { min-width: 0; } 
.facility .svc-card { position: relative; min-width: 0; height: 200px; border-radius: 20px; overflow: hidden; } 
.facility .svc-card.svc-text { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 13px; padding: 24px 40px; background: #0e2b5e; } 
.facility .svc-card.svc-text p { font-size: 17px; font-weight: 500; line-height: 1.5; color: #fff; text-align: center; letter-spacing: -0.34px; } 
.facility .svc-card.svc-img > a { display: block; position: relative; width: 100%; height: 100%; border-radius: 20px; } 
.facility .svc-card.svc-img > a:focus-visible { outline-offset: -3px; } 
.facility .svc-card.svc-img img { width: 100%; height: 100%; object-fit: cover; } 
.facility .svc-card.svc-img .svc-label { position: absolute; left: 20px; right: 20px; bottom: 20px; display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-radius: 20px; background: rgba(0,0,0,0.1); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px); } 
.facility .svc-card.svc-img .svc-label p { flex: 1; min-width: 0; font-size: 17px; font-weight: 500; color: #fff; } 
.facility .svc-arr { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; } 
.facility .svc-card.svc-text .svc-arr { position: absolute; right: 24px; bottom: 24px; background: #17be65 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") no-repeat center / 16px; } 
.facility .svc-card.svc-img .svc-arr { background: rgba(255,255,255,0.15) url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.985725 7.99727L15.0149 7.99727M9.75395 2.73633L15.0149 7.99727L9.75395 13.2582' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat center center / 16px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } 
.facility .svc-card .svc-hover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 40px 30px; background: #0e2b5e; opacity: 0; transition: opacity .3s ease; pointer-events: none; } 
.facility .svc-card.svc-img > a:hover .svc-hover { opacity: 1; } 
.facility .svc-desc { font-size: 17px; font-weight: 500; line-height: 1.5; letter-spacing: -0.34px; color: #fff; text-align: center; } 
.facility .svc-arr-g { position: absolute; right: 20px; bottom: 20px; flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #17be65; } 
.facility .svc-arr-g i { width: 16px; height: 16px; background: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.985725 7.99727L15.0149 7.99727M9.75395 2.73633L15.0149 7.99727L9.75395 13.2582' stroke='%230E2B5E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat center center / 16px; } 
.facility .svc-card.svc-img > a:hover .svc-arr-g i { transform: rotate(-45deg); } 

/* ===== 챗봇 + top 플로팅 버튼 ===== */
.fab-group { position: fixed; right: 40px; bottom: 40px; z-index: 130; display: flex; flex-direction: column; gap: 10px; align-items: baseline; } 
.fab { } 
.fab-chat { position: relative; flex-shrink: 0; width: 66px; padding: 0; border: 0; cursor: pointer; } 
.fab-chat .fab-img { max-width: none; pointer-events: none; } 
.fab-chat .img-chat { width: 66px; filter: drop-shadow(0 4px 10px rgba(15, 175, 242, 0.20)); } 
.fab-chat .img-close { width: 56px; filter: drop-shadow(0 4px 10px rgba(15, 175, 242, 0.20)); display: none; } 
.fab-top { display: none; width: 56px; height: 56px; background: #fff; border: 1px solid #e0e3e8; box-shadow: 0 4px 5px rgba(0, 0, 0, 0.05); border-radius: 100px; } 
.fab-top .ic-top { display: block; width: 24px; height: 24px; margin: 16px auto; background: url(../img/layout/top-btn.svg) no-repeat center / contain; } 
.fab-top.show { display: block; } 
.fab-group.chat-open .fab-chat .img-chat { display: none; } 
.fab-group.chat-open .fab-chat .img-close { display: block; } 
.fab-group.chat-open .fab-top { display: none; } 

/* 챗봇 창 */
.chat-window { position: absolute; right: 0; bottom: calc(100% + 12px); display: none; flex-direction: column; width: 360px; max-width: calc(100vw - 32px); height: min(640px, 78vh); overflow: hidden; border-radius: 30px; background: linear-gradient(to bottom, #eff7ff 0%, #eff6ef 80%, #fff 100%); box-shadow: 0 0 5px rgba(0, 0, 0, 0.05), 0 4px 16px rgba(0, 0, 0, 0.1); } 
.chat-window.open { display: flex; } 
.chat-head { flex-shrink: 0; display: flex; justify-content: space-between; gap: 12px; padding: 16px 20px; } 
.chat-head .ch-title strong { display: block; font-size: 19px; font-weight: 700; line-height: 1.5; color: #1c2025; } 
.chat-head .ch-title p { margin-top: 4px; font-size: 13px; font-weight: 500; line-height: 1.5; color: #1c2025; } 
.chat-head .ch-actions { flex-shrink: 0; display: flex; align-items: center; gap: 16px; padding-top: 4px; } 
.ch-ico { width: 22px; height: 22px; padding: 0; border: 0; cursor: pointer; background-color: transparent; background-repeat: no-repeat; background-position: center; background-size: contain; } 
.ch-ico.ic-refresh { background: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.0654 2.60157C18.2726 2.60061 18.456 2.67285 18.6006 2.81935C18.7438 2.96453 18.8154 3.14649 18.8154 3.35157V8.667C18.8154 8.96876 18.711 9.23135 18.502 9.44142C18.2924 9.65188 18.0292 9.75563 17.7266 9.75489L12.4111 9.75587C12.2051 9.75584 12.0227 9.68382 11.8779 9.53907C11.733 9.39413 11.6612 9.21134 11.6611 9.00489C11.6611 8.79842 11.7336 8.6161 11.8789 8.47169C12.0238 8.32787 12.2056 8.2559 12.4111 8.25587H16.5898C16.0482 7.32871 15.3233 6.5858 14.4102 6.02638C13.4049 5.41041 12.2979 5.10162 11.085 5.10157C9.30409 5.10157 7.79617 5.72241 6.55078 6.96778C5.30539 8.21318 4.68457 9.72108 4.68457 11.502C4.68461 13.2826 5.30562 14.7899 6.55078 16.0352C7.79618 17.2806 9.30408 17.9014 11.085 17.9014C12.3568 17.9013 13.5179 17.5575 14.5732 16.8692C15.6304 16.1793 16.4129 15.2658 16.9229 14.125C17.0048 13.9373 17.1415 13.7982 17.3291 13.7197L17.4688 13.6748C17.61 13.6432 17.7544 13.6518 17.8975 13.7002C18.1109 13.7688 18.2603 13.916 18.3311 14.1289C18.3966 14.3264 18.39 14.5258 18.3086 14.7158L18.3076 14.7178C17.6811 16.1354 16.7165 17.2719 15.418 18.1231C14.1183 18.9748 12.6722 19.4006 11.085 19.4014C8.88372 19.4014 7.01108 18.6365 5.48047 17.1074C3.95082 15.5776 3.18457 13.7053 3.18457 11.5049C3.18462 9.30449 3.95085 7.43261 5.48047 5.90138C7.01034 4.37002 8.88291 3.60232 11.085 3.60157C12.4256 3.60161 13.683 3.92046 14.8535 4.55763C15.8333 5.09134 16.6538 5.80334 17.3154 6.69044V3.35157C17.3155 3.14512 17.3878 2.96275 17.5332 2.81837C17.678 2.67467 17.8598 2.60256 18.0654 2.60157Z' fill='black'/%3E%3C/svg%3E%0A")no-repeat center center / contain; } 
.ch-ico.ic-x { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c2025' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E"); } 
.chat-body { flex: 1 1 auto; overflow-y: auto; padding: 0 16px 8px; } 
.chat-date { padding: 8px 0; font-size: 13px; line-height: 1.5; color: #56595e; text-align: center; } 
.chat-msg { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; } 
.chat-msg.bot { align-items: flex-start; } 
.chat-msg.me { align-items: flex-end; } 
.chat-msg .msg-avatar { width: 24px; height: 24px; background: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.1071 5.44724C9.7051 3.69724 12.1231 3.64424 12.8321 5.28824L12.8921 5.44824L13.6991 7.80824C13.884 8.34947 14.1829 8.84475 14.5755 9.26066C14.9682 9.67658 15.4454 10.0035 15.9751 10.2192L16.1921 10.3002L18.5521 11.1062C20.3021 11.7042 20.3551 14.1222 18.7121 14.8312L18.5521 14.8912L16.1921 15.6982C15.6507 15.8831 15.1552 16.1819 14.7391 16.5745C14.323 16.9671 13.996 17.4444 13.7801 17.9742L13.6991 18.1902L12.8931 20.5512C12.2951 22.3012 9.8771 22.3542 9.1691 20.7112L9.1071 20.5512L8.3011 18.1912C8.11628 17.6498 7.81748 17.1544 7.42485 16.7383C7.03222 16.3222 6.5549 15.9951 6.0251 15.7792L5.8091 15.6982L3.4491 14.8922C1.6981 14.2942 1.6451 11.8762 3.2891 11.1682L3.4491 11.1062L5.8091 10.3002C6.35034 10.1153 6.84562 9.81644 7.26153 9.42381C7.67744 9.03119 8.00432 8.55393 8.2201 8.02424L8.3011 7.80824L9.1071 5.44724Z' fill='%230072CA'/%3E%3Cpath d='M19.5305 2.15147C19.3717 2.05248 19.1884 2 19.0013 2C18.7926 1.99987 18.589 2.06509 18.4192 2.1865C18.2493 2.30791 18.1217 2.47943 18.0543 2.677L17.7043 3.704L16.6783 4.054L16.5603 4.102C16.3825 4.18906 16.2345 4.32696 16.1351 4.49821C16.0357 4.66947 15.9894 4.86638 16.002 5.06398C16.0147 5.26158 16.0857 5.45099 16.2061 5.60819C16.3265 5.76539 16.4908 5.88331 16.6783 5.947L17.7053 6.297L18.0553 7.323L18.1033 7.44C18.1903 7.61787 18.3281 7.76591 18.4993 7.86538C18.6705 7.96484 18.8674 8.01125 19.065 7.99872C19.2626 7.98619 19.452 7.91529 19.6092 7.79499C19.7665 7.6747 19.8845 7.51043 19.9483 7.323L20.2983 6.296L21.3243 5.946L21.4423 5.898C21.6202 5.81094 21.7681 5.67304 21.8675 5.50179C21.9669 5.33053 22.0132 5.13362 22.0006 4.93602C21.988 4.73842 21.9169 4.54902 21.7965 4.39182C21.6762 4.23462 21.5118 4.1167 21.3243 4.053L20.2973 3.703L19.9473 2.677L19.8993 2.56C19.817 2.392 19.6892 2.25047 19.5305 2.15147Z' fill='%2317BE65'/%3E%3C/svg%3E%0A") no-repeat center / contain; } 
.msg-bubble { max-width: 286px; padding: 12px 14px; font-size: 13px; line-height: 1.5; color: #1d1d1d; word-break: break-word; } 
.chat-msg.bot .msg-bubble { background: #fff; border-radius: 0 16px 16px 16px; } 
.chat-msg.me .msg-bubble { max-width: 264px; background: #d4e5f6; border-radius: 16px 16px 1px 16px; } 
.chat-input { flex-shrink: 0; padding: 20px 16px 16px; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 60%); } 
.chat-input .chat-faq { display: none; flex-wrap: wrap; gap: 10px 7px; margin-bottom: 20px; list-style: none; padding: 0; } 
.chat-input .chat-faq a { display: block; padding: 8px 14px; border-radius: 40px; background: #eff7ff; color: #004caf; font-size: 14px; line-height: 1.5; white-space: nowrap; transition: background-color .15s; } 
.chat-input .chat-faq a:hover { font-weight: 700; } 
.chat-input.on { background: #fff; border-radius: 16px 16px 0 0; } 
.chat-input.on .chat-faq { display: flex; } 
.ci-box { display: flex; align-items: center; gap: 8px; padding: 7px 8px 7px 20px; border: 1px solid #0072ca; border-radius: 74px; background: #fff; } 
.ci-box input { flex: 1 1 auto; min-width: 0; height: 30px; border: 0; outline: 0; background: transparent; font-size: 14px; color: #1d1d1d; } 
.ci-box input:focus { outline: 3px dotted rgb(255, 0, 0); } 
.ci-box input::placeholder { color: #818892; } 
.ci-send { flex-shrink: 0; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; background: #0072ca url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='19' x2='12' y2='6'/%3E%3Cpolyline points='5 13 12 6 19 13'/%3E%3C/svg%3E") no-repeat center / 14px; } 

/* 답변 생성 중(타이핑) 표시 + 로딩 스피너 회전 */
.msg-bubble.msg-typing { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; } 
.msg-typing .typing-text { font-size: 13px; line-height: 1.5; color: #000; } 
.typing-spinner { display: block; width: 24px; height: 24px; background: url(../img/layout/chatbot-loading.svg) no-repeat center / contain; animation: chatLoadingSpin 0.8s steps(8, end) infinite; } 
@keyframes chatLoadingSpin { to { transform: rotate(360deg); } 
 }
@media (prefers-reduced-motion: reduce){
 .typing-spinner { animation: none; } 
 }
@media only screen and (max-width: 767px){
 .fab-group { right: 16px; bottom: 16px; } 
 /* 767px 이하: 챗봇 창을 화면에 꽉 차게(전체화면) + 둥근 모서리 제거 */
 .chat-window { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; border-radius: 0; z-index: 200; } 
 /* 전체화면일 땐 헤더의 닫기(X)로 닫으므로 플로팅 챗봇 버튼은 숨김 */
 .fab-group.chat-open .fab-chat { display: none; } 
 }

/* 팝업 반응형 스타일 추가 */
.popupAreaMain { position: fixed; max-width: 600px; top: 10%; left: 5%; z-index: 99; border: 1px solid var(--bd-color); } 
.popupAreaMain .popup_inner .button_box { display: flex; justify-content: space-between; align-items: center; padding: 5px 20px; background: #ffffffa4; backdrop-filter: blur(40px); } 
 @media (max-width: 768px){
 .popupAreaMain { width: 90vw; height: auto; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
 .popupAreaMain .popup_inner .img_box img { width: 100%; } 
 }

.section6 a img {width: 100%; height: 100%;}

/* facility 가족센터 - 정보 미표출(no-info) 패널: 소개 좌측 + 지도 우측 */
.facility .fac-body.no-info .fac-left { display: flex; gap: 40px; align-items: flex-start; }
.facility .fac-body.no-info .fac-intro { flex: 0 1 600px; min-width: 0; margin-bottom: 0; }
.facility .fac-body.no-info .fac-map { flex: 1; max-width: 785px; margin-left: auto; left: 0; margin-top: 0; justify-content: flex-end; }
@media only screen and (max-width: 1023px){
 .facility .fac-body.no-info .fac-left { flex-direction: column; }
 .facility .fac-body.no-info .fac-intro { flex: none; width: 100%; }
 .facility .fac-body.no-info .fac-map { width: 100%; justify-content: center; }
}
/* facility 가족센터 지역 라벨 */
.facility .fac-map .region-jung { left: 55.2%; top: 51.9%; }
.facility .fac-map .region-dongjak { left: 44%; top: 72.5%; }
.facility .fac-map .region-gwanak { left: 44%; top: 85.1%; }
.facility .fac-map .region-songpa { left: 83.6%; top: 71%; }
.facility .fac-map .region-gwangjin { left: 77.5%; top: 56.8%; }
.facility .fac-map .region-jungnang { left: 78.1%; top: 38.2%; }
.facility .fac-map .region-dongdaemun { left: 68.4%; top: 43.6%; }
.facility .fac-map .region-gangbuk { left: 58.6%; top: 21%; }
.facility .fac-map .region-dobong { left: 64.3%; top: 12.7%; }
.facility .fac-map .region-nowon { left: 75%; top: 18.2%; }
.facility .fac-map .region-gangseo { left: 15.6%; top: 51%; }
.facility .fac-map .region-guro { left: 21.8%; top: 75.5%; }
/* 자치구 가족센터 지도 전용 라벨 보정 */
.facility .fac-map.fac-map-all .region-mapo { left: 36.2%; top: 52.7%; }
.facility .fac-map.fac-map-all .region-seocho { left: 64.3%; }
.facility .fac-map.fac-map-all .region-gangdong { left: 91.8%; }
.facility .fac-map.fac-map-all .region-yangcheon { left: 20.1%; }
.facility .fac-map.fac-map-all .region-seongbuk { left: 60.5%; top: 36.6%; }
.facility .fac-map.fac-map-all .region-eunpyeong { left: 40.4%; top: 28.5%; }
.facility .fac-map.fac-map-all .region-geumcheon { left: 33.4%; top: 87.8%; }
.facility .fac-map.fac-map-all .region-seongdong { left: 66.5%; top: 54.6%; }
.facility .fac-map.fac-map-all .region-yongsan { left: 51.4%; top: 61%; }
.facility .fac-map.fac-map-all .region-gangnam { left: 70.2%; top: 75%; }
.facility .fac-map.fac-map-all .region-yeongdeungpo { left: 33.8%; top: 66.6%; }
.facility .fac-map.fac-map-all .region-seodaemun { left: 40.8%; top: 44.5%; }
.facility .fac-map.fac-map-all .region-jongno { left: 50%; top: 39%; }