@charset "UTF-8";

@import url("/design/common/css/Pretendard.css");
@import url("/design2026/common/css/A2Z.css");
@import url("/design/area2026/css/font/TtangsBudaeJjigae.css");
@import url("/design/common/css/SBAggro.css");
@import url("/design2025/common/css/SCDream.css");

:root {
  --p_color : #345df5;
  --text: #1f2937;
  --muted: #667085;
  --blue: #1d6cf2;
  --blue-dark: #0c3f95;
  --green: #10a66d;
  --orange: #ff7a3c;
  --pink: #ff4d8d;
  --pale: #F2F5FE;
  --line: #e5e5e5;
  --soft-blue: #edf6ff;
  --soft-mint: #d8fbf3;
  --soft-yellow: #fff3ca;
  --shadow: 0 14rem 34rem rgba(31, 52, 92, 0.08);
 }

* { box-sizing: border-box; word-break: keep-all; }

html { font-size: 1px; height: auto !important; overflow-y: auto !important; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body { min-width: 320rem; margin: 0; color: var(--text); font-family: "A2Z", "Pretendard", "Noto Sans KR", "Malgun Gothic", Arial, sans-serif; font-size: 16rem; line-height: 1.6; background: #fff; height: auto !important; max-height: none !important; overflow: visible !important; }

a { color: inherit; text-decoration: none; }

button,
input,
select { font: inherit; }

button { cursor: pointer; }

ul,
ol { margin: 0; padding: 0; list-style: none; }

.wrap { width: min(1600rem, calc(100% - 80rem)); margin: 0 auto; }

.sr-only { position: absolute; width: 1rem; height: 1rem; padding: 0; margin: -1rem; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.site-header { position: sticky; top: 0; z-index: 9; background: rgba(255, 255, 255, 0.96); border-bottom: 1px solid var(--line);}

.official-bar { background: #f0f4f8; border-bottom: 1rem solid var(--line); }
.official-bar__inner { min-height: 36rem; display: flex; align-items: center; justify-content: space-between; gap: 18rem; }
.official-bar p { margin: 0; color: #666666; font-family: "Pretendard", "Noto Sans KR", "Malgun Gothic", Arial, sans-serif; text-indent: -0.02rem; font-size: 14rem; display: flex; align-items: center; gap: 10rem; }
.official-bar p::before { content: ""; display: inline-block; width: 26rem; height: 18rem; background: url('/design/ko2026/img/layout/eg_logo.jpg') no-repeat 0 0 / cover; }

.official-bar ul,
.global-nav ul,
.footer-links ul { display: flex; align-items: center; flex-wrap: wrap; gap: 22rem; }

.official-bar a { color: #344054; font-weight: 700; }

.utility-bar { border-bottom: 1rem solid var(--line); }
.utility-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: 20rem; height: 36rem; }

.utility-bar nav ul { display: flex; align-items: center; gap: 20rem 12rem; }
.utility-bar nav a { display: block; color: #333333; font-size: 13rem; font-weight: 500; }
.utility-bar nav a.go-tour { color: #005DA4;}

.utility-bar .lang { position:relative; float:left; }
.utility-bar .lang > a { position:relative; display: flex; flex-wrap: wrap; align-items: center; height:40rem; font-size:14rem; padding:0 30rem 0 10rem; border-left:1px solid var(--line); border-right:1px solid var(--line); border-radius:5rem; }
.utility-bar .lang > a::before {content:''; display: block; width: 17rem; height: 17rem; margin-right: 5rem; background: url('/design/ko2026/img/layout/icon-lang.png') no-repeat 0 0/contain;}
.utility-bar .lang > a::after { content:''; position:absolute; right:10rem; top:45%; width:7rem; height:7rem; background:linear-gradient(45deg, #666 50%, transparent 50%); transform:translate(0, -50%) rotate(315deg); }
.utility-bar .lang > a.on { border:1px solid #345df5; border-bottom:0; border-radius:5rem 5rem 0 0; }
.utility-bar .lang > a.on+div { display:block; }
.utility-bar .lang div { display:none; position:absolute; z-index:1; left:0; top:35rem; width:100%; border:1px solid #345df5; border-top:0; border-radius:0 0 5rem 5rem; background:#fff; }
.utility-bar .lang div a { position:relative; display:block; padding:3rem 10rem; font-size:14rem; }
.utility-bar .lang div a::before { content:''; position:absolute; right:10rem; top:10rem; width:5rem; height:5rem; border-top:1px solid #666; border-right:1px solid #666; transform:rotate(45deg); }
.utility-bar .lang div a:hover { background:#f3f3f3; }

.header-main { min-height: 100rem;}
.header-main::after {content: ""; clear: both; display: block;}

.header-main .logo a.go_cityhall,
.footer-logo { margin: 0; text-indent: -99999rem; display: block; width: 140rem; height: 50rem; background: url('/design/ko2026/img/layout/logo.png') no-repeat 0 0/contain; line-height: 1; }
.header-main .logo {float: left; margin-top: 27.5rem; display: flex; flex-wrap: wrap; align-items: center; gap: 20rem;}
.header-main .logo a.go_main {color: #111; font-size: 22rem; font-weight: 600; line-height: 44rem;}

.header-actions { display: flex; gap: 30rem; float: right; margin-top: -64rem;}
.header-actions #search_open, .header-actions .sitemap { width: 23rem; height: 23rem; text-indent: -999999rem; border: 0; background: url('/design/ko2026/img/layout/icon-header.png') no-repeat 0 center/300%; position: relative; display: block; }
.header-actions #search_open {background-position-x: 0;}
.header-actions .sitemap {background-position-x: 100%;}

.pc_nav {margin: 0 auto; margin-right: 145rem; height: 100rem;}
.pc_nav .depth2_wrap,
.pc_nav .depth2_wrap::after { top:100rem; } /*펼침메뉴 위치*/
.pc_nav+.nav_bg { top:100rem; } /*검은배경 위치*/
.pc_nav .depth2_wrap .wrap { max-width:1600px; } /*펼침메뉴 가로사이즈*/

.pc_nav a[target="_blank"] span::after { width: 15rem; height: 15rem; background: url('/design/ko2026/img/layout/icon_blank.png') no-repeat 0 0; margin: 3rem 0 0 8rem;}
.pc_nav .depth1 { justify-content: center; align-items: center; gap: 20rem 30rem; height: 100%;}
.pc_nav .depth1 > li > a { font-size: 18rem; font-weight: 500;}
.pc_nav .depth1 > li > a[target="_blank"] {color: #005DA3;}
.pc_nav .depth1 > li > a[target="_blank"] span::after {display: none;}
.pc_nav.ver1 .depth2_wrap {box-shadow: 0 20px 25px 0 rgba(0, 0, 0, 0.03); border-bottom: 1px solid #E5E5E5;}
.pc_nav.ver1 dl {min-height: 315rem;}
.pc_nav.ver1 dl dt {font-size: 34rem; font-weight: 600; color: #292A2F; margin: 30rem 0 28rem;}
.pc_nav.ver1 dl dd {background: url('/design/ko2026/img/layout/depth2_pattern.png') repeat-y top left; height: calc(100% - 125rem); min-height: 120rem; text-indent: -999999rem; position: relative; opacity: 1;}
.pc_nav.ver1 dl dd::after {content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('/design/ko2026/img/layout/depth2_bg.png') no-repeat top left;}
.pc_nav.ver1 .depth2 {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 8rem; width: 100%; padding: 25rem 0 60rem;}
.pc_nav.ver1 .depth2 > li {border: none; align-items: center;}
.pc_nav.ver1 .depth2 > li > a { border-radius: 6rem; border: 1px solid #E6E8EB; background: #F5F6F8; display: flex; width: 220rem; height: 60rem; line-height: 1.3; padding: 12rem 20rem; align-items: center; gap: 10rem; color: #0A3691; font-size: 18rem; font-weight: 500; line-height: 1.3; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: auto; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; }
.pc_nav.ver1 .depth2 > li > a::after { display: none; }
.pc_nav.ver1 .depth2 > li > a[target="_blank"].on span::after {background: url('/design/ko2026/img/layout/icon_blank_w.png') no-repeat 0 0 !important;}
.pc_nav.ver1 .depth3 { padding: 10rem 5rem 10rem 38rem; }
.pc_nav.ver1 .depth3 a { font-size: 14rem; color: #666666; opacity: 1; }
.pc_nav.ver1 .depth3 a::before { width: 3rem; height: 3rem; background: #252525; }
.pc_nav.ver1 .depth3 a:hover { color: #125DF3; }
.pc_nav.ver1 .depth3 a:hover::before { background: #125DF3;}
.pc_nav.ver1+.nav_bg {background: none;}

#m_nav_open {display: none;}

#footer {padding-bottom:50rem; color: #333333; border-top: 1px solid var(--line);}
#footer .wrap {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; position: relative;}
#footer .wrap::after {content: '';display: block;clear: both;}
#footer .footer-top {border-bottom: 1px solid #ddd;}
#footer .family_site { flex:0 0 100%; }
#footer .family_site::after {content:''; display:table; clear:both;}
#footer .family_site li { position:relative; float:left; width:25%; }
#footer .family_site li:first-of-type { margin-left:0; }
#footer .family_site li > a { position: relative; display: block; border-right: 1px solid #ddd; line-height: 60rem; height: 60rem; padding: 0 20rem; font-size: 15rem;}
#footer .family_site > li:first-of-type > a {border-left: 1px solid #ddd;}
/* #footer .family_site li > a.on {background:#345df5; color:#fff; } */
#footer .family_site li > a::before { content:''; position:absolute; right:10rem; top:50%; width:40rem; height:40rem; background:url('/design/ko2026/img/layout/sitelink-arrow.png') no-repeat center; transform:translate(0, -50%); }
#footer .family_site li > a.go::before { background: url('/design/ko2026/img/layout/icon_blank.png') no-repeat center; }
#footer .family_site li > a.on::before { transform:translate(0, -50%) rotate(180deg); }
#footer .family_site div { visibility:hidden; position:absolute; left:0; bottom:40rem; width:100%; height:200rem; background:#fff; border:1px solid #345df5; border-radius:10rem; overflow-y:auto; z-index:10; padding:10rem 20rem; opacity:0; transition:0.5s; z-index:100; }
#footer .family_site li > a.on + div { visibility:visible; opacity:1; bottom:70rem; }
#footer .family_site div a { position:relative; display:block; padding:5rem 0 5rem 13rem; line-height:1.3; font-size: 15rem; }
#footer .family_site div a:hover {font-weight:700;}
#footer .family_site div a::before {content:''; position:absolute; left:0; top:13rem; width:4rem; height:4rem; background:#345df5; border-radius:50%; }
#footer .left_box {flex:0 0 calc(100% - 186rem);}
#footer .top {display: flex; flex-wrap: wrap; gap: 0 54rem; align-items: center; padding: 10rem 0; width: 100%;}
#footer .f_logo {display:block; width:140rem; height:50rem; background:url('/design/ko2026/img/layout/logo.png') no-repeat center/cover; text-indent:-99999rem; margin:20rem 0; }
#footer .link {margin:20rem 0;}
#footer .link a {display:inline-block; margin-right:30rem; font-weight: 500; font-size:15rem;}
#footer .link a strong {color:#345df5; text-decoration:underline; font-weight: 500;}
#footer .address p { font-size: 15rem; }
#footer .address p strong {margin-right:10rem; font-weight: 500; }
#footer .address a { display: inline-block; border-radius: 6rem; color: #293147; background: rgba(39, 91, 237, 0.10); padding: 12rem; line-height: 1; font-size: 13rem; margin-left: 10rem;}
#footer .copy { margin-top: 10rem; color: #333; font-size: 13rem; line-height: 27rem;}
#footer .mark_wrap { flex-shrink:0; display:flex; gap:30rem 4rem; }
#footer .mark_wrap a { display:block; font-size: 12rem; text-align: center; font-weight: 500;}
#footer .mark_wrap a img {height: 64rem; }
#footer .mark_wrap a p {margin-top: 4rem;}

@media all and (max-width:1600px){
  .header-main {display: flex; flex-wrap: wrap; justify-content: space-between;}
  .header-main .logo, .header-actions {float: none;}
  .header-main .logo {margin-top: 0; flex: 0 0 auto; width: max-content;}
  .header-main .logo a.go_cityhall { width: 118rem; height: 42rem; }
  .header-main .logo a.go_main {font-size: 20rem;}
  .header-actions {margin-top: 40rem; gap: 18rem;}
  .pc_nav {margin: 0;}
  .pc_nav .depth1 {gap: 16rem;}
}
@media all and (max-width:1340px) {
	.header-main { min-height: 74rem; display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
	.header-main::after { display: none; }
	.header-main .logo { float: none; margin: 0; }
	.pc_nav,
	.header-actions .sitemap.pc { display: none; }
	.header-actions { flex: 0 0 auto; width: auto; float: none; margin: 0; gap: 18rem; align-items: center; }
	#m_nav_open { display: block; }
	.m_nav { z-index: 30; }
	.m_nav,
	.m_nav + .nav_bg { display: none; }
}
@media all and (max-width:1200px) {
  html {font-size: 0.95px;}
}
@media (max-width: 1050px) {
  .header-actions #search_open, #m_nav_open { width: 22rem; height: 22rem; }
}
@media all and (max-width:1023px){
 #footer .family_site li { width: 48%; }
 #footer .family_site li:nth-of-type(2n+1) { margin-left: 0; }
}
@media (max-width:900px){
 .wrap { width: min(100% - 32rem, 1180rem); }
 body {padding-top: 66rem;}
 .site-header { position: fixed; width: 100%;}
 .official-bar__inner { min-height: 32rem; }
 .official-bar p { font-size: 12rem; }
 .utility-bar__inner { height: 34rem; }
 .utility-bar nav ul { gap: 8rem; }
 .utility-bar .lang > a { height: 34rem; font-size: 12rem; }
 .header-main { min-height: 74rem; display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
 .header-main::after { display: none; }
 .header-main .logo { float: none; margin: 0; }
 .header-main .logo a { width: 118rem; height: 42rem; }
 .pc_nav { display: none; }
 .header-actions { float: none; margin: 0; gap: 18rem; align-items: center; }
 .header-actions #search_open, .header-actions .sitemap { width: 22rem; height: 22rem; }
 .m_nav { z-index: 30; }
 .footer-top .wrap {margin: 0; width: 100%;}
 #footer .family_site {width: 100%;}
 #footer .family_site li { width: 50%; }
 #footer .family_site li:nth-of-type(1), #footer .family_site li:nth-of-type(2){ border-bottom: 1px solid #ddd; }
 #footer .family_site li:nth-of-type(2n) a {border-right: none;}
 #footer .family_site li:nth-of-type(2n+1) { margin-left: 0; }
 }
@media all and (max-width:768px){
  html {font-size: 0.9px;}
  #footer .left_box { flex: 0 0 100%; margin-bottom: 30rem; }
  #footer .link { width: 100%; }
  #footer .mark_wrap {position: absolute; top: 30rem; right: 0;}
  #footer .mark_wrap a.nf {display: none;}
  #footer .mark_wrap a img {height: 49px;}
}
@media (max-width:760px) {
 body { font-size: 15rem; }
 .header-main,.section-tabs { align-items: center; }
 .header-main { gap: 14rem; padding: 14rem 0; }
 }
 @media (max-width: 600px) {
   .utility-bar__inner { height: 32rem; }
   .utility-bar nav ul { gap: 6rem; }
   .utility-bar .lang { display: none; }
   .header-main { min-height: 62rem; padding: 8rem 0; }
   .header-main .logo a { width: 102rem; height: 36rem; }
   .header-actions { gap: 14rem; }
   #footer { padding-bottom: 30rem; }
   #footer .family_site li { width: 50%; }
   #footer .family_site li > a { font-size: 13rem; line-height: 48rem; height: 48rem; }
   #footer .family_site li > a::before { width: 28rem; height: 28rem; }
   #footer .top { gap: 0 20rem; }
   #footer .f_logo { margin: 16rem 0; }
   #footer .link { margin: 12rem 0;}
   #footer .link a { margin-right: 14rem; }
   #footer .address p { line-height: 1.7; }
   #footer .address a { padding: 8rem;}
   #footer .copy { line-height: 1.5; }
 }
 @media all and (max-width:480px){
  #footer .family_site li > a { padding: 0 10rem; }
  #footer .family_site li > a::before { right: 5rem; }
 }

/* =========================================================
   IE10 / IE11 호환 코드
   - 원본 스타일은 유지하고 IE에서만 보정합니다.
   - CSS 변수, min(), max-content, sticky, Flex gap, Grid를 대체합니다.
   ========================================================= */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* CSS 변수 fallback */
  body {color:#1f2937;}
  .official-bar, .utility-bar, #footer {border-color:#e5e5e5;}
  .utility-bar .lang > a {border-left-color:#e5e5e5; border-right-color:#e5e5e5;}

  /* min() fallback */
  .wrap {width:calc(100% - 80rem); max-width:1600rem;}

  /* sticky fallback: IE에서는 일반 문서 흐름으로 유지 */
  .site-header {position:relative;}

  /* max-content fallback */
  .header-main .logo {width:auto;}

  /* Flex gap fallback */
  .official-bar p::before {margin-right:10rem;}
  .official-bar ul > li + li, .global-nav ul > li + li, .footer-links ul > li + li {margin-left:22rem;}
  .utility-bar nav ul > li + li {margin-left:12rem;}
  .header-main .logo > * + * {margin-left:20rem;}
  .header-actions > * + * {margin-left:30rem;}
  .pc_nav .depth1 > li + li {margin-left:30rem;}
  #footer .top > * + * {margin-left:54rem;}
  #footer .mark_wrap > * + * {margin-left:4rem;}

  /* CSS Grid fallback : PC 2차 메뉴 */
  .pc_nav.ver1 .depth2 {display:flex; flex-wrap:wrap; margin:-4rem;}
  .pc_nav.ver1 .depth2 > li {width:calc(50% - 8rem); margin:4rem;}
  .pc_nav.ver1 .depth2 > li > a {text-decoration:underline;}
}
@media all and (-ms-high-contrast: none) and (max-width:1500px), (-ms-high-contrast: active) and (max-width:1500px) {
  .header-actions > * + * {margin-left:18rem;}
  .pc_nav .depth1 > li + li {margin-left:16rem;}
}
@media all and (-ms-high-contrast: none) and (max-width:1200px), (-ms-high-contrast: active) and (max-width:1200px) {
  .header-actions > * + * {margin-left:18rem;}
}
@media all and (-ms-high-contrast: none) and (max-width:900px), (-ms-high-contrast: active) and (max-width:900px) {
  .wrap {width:calc(100% - 32rem); max-width:1180rem;}
  .site-header {position:fixed;}
  .utility-bar nav ul > li + li {margin-left:8rem;}
  .header-actions > * + * {margin-left:18rem;}
}
@media all and (-ms-high-contrast: none) and (max-width:600px), (-ms-high-contrast: active) and (max-width:600px) {
  .utility-bar nav ul > li + li {margin-left:6rem;}
  .header-actions > * + * {margin-left:14rem;}
  #footer .top > * + * {margin-left:20rem;}
}