@charset "UTF-8";
main{display:flex; flex-direction: column; justify-content: start}
header{width:100%; height:76px; background:url("../images/header-bg.png")center center repeat-x; background-size:cover; display:flex; align-items: center; justify-content: center;}
header h1{}
header h1 a{font-size:0px; display:flex; align-items: center; gap:0px 4px;}
header h1 a::Before,header h1 a::after{content:""; display:block; }
header h1 a::Before{width:42px; height:29px; background:url("../images/header_logo.png")center center no-repeat; background-size:100%;}
header h1 a::after{width:120px; height:28.3px; background:url("../images/header_logo2.png")center center no-repeat; background-size:100%;}
.sc1{display:flex; flex-direction:column; align-items: center; justify-content: end; width:100%; height:auto; aspect-ratio: 1920/970; background:url("../images/main_visu.png")center center no-repeat; background-size:100%;}
.sc1 h2,.sc1 p{font-size:0px;}
.sc1 ul{gap:0px 10px; margin-bottom:36px; width:950px; display:flex; align-items: stretch;}
.sc1 ul li{flex:1;}
.sc1 ul li a{display:flex; flex-direction: column; align-items: center; justify-content: center; text-align:center; padding:28px 0px; border:3px solid transparent; transition-duration:0.2s; background:rgba(255,255,255,0.8); border-radius:30px; height:100%; font-size:16px; font-weight:500; color:#111; font-family:"GmarketSans"; line-height:110%;}
.sc1 ul li a span{font-size:16px; font-weight:500; color:#111; font-family:"GmarketSans"; }
.sc1 ul li a::Before{content:""; display:block; width:66px; height:66px; border-radius:50%; margin-bottom:20px; transition-duration:0.2s;}
.sc1 ul li a:hover{border:3px solid #334069; background:#fff;}
.sc1 ul li a:focus-visible{border:3px solid #334069; background:#fff; outline:3px solid #111; outline-offset:2px;}
/* 2026-09-03 전통시장 삭제로 7→6개, 2026-09-09 추석맞이 행사(sc7) 삭제로 6→5개.
   `.contentSc.sc6`·`.contentSc.sc7` 규칙은 복원 대비해 남겨 둔다(현재 미사용).
   아이콘은 섹션 기준(c_6=추석맞이 행사 / c_7=긴급상황 연락처)이라 순번을 한 칸 당김 */
.sc1 ul li:nth-of-type(1) a::Before{background:url("../images/c_1.svg")center center no-repeat #464646;}
.sc1 ul li:nth-of-type(2) a::Before{background:url("../images/c_2.svg")center center no-repeat #464646;}
.sc1 ul li:nth-of-type(3) a::Before{background:url("../images/c_3.svg")center center no-repeat #464646;}
.sc1 ul li:nth-of-type(4) a::Before{background:url("../images/c_4.svg")center center no-repeat #464646;}
.sc1 ul li:nth-of-type(5) a::Before{background:url("../images/c_7.svg")center center no-repeat #464646;}

.sc1 ul li:nth-of-type(1) a:hover::Before{background:url("../images/c_1.svg")center center no-repeat #334069;}
.sc1 ul li:nth-of-type(2) a:hover::Before{background:url("../images/c_2.svg")center center no-repeat #334069;}
.sc1 ul li:nth-of-type(3) a:hover::Before{background:url("../images/c_3.svg")center center no-repeat #334069;}
.sc1 ul li:nth-of-type(4) a:hover::Before{background:url("../images/c_4.svg")center center no-repeat #334069;}
.sc1 ul li:nth-of-type(5) a:hover::Before{background:url("../images/c_7.svg")center center no-repeat #334069;}
.contentSc{display:flex; justify-content: center; padding:60px 0px;}
.contentSc.sc2{background:#FFEFF3;}
.contentSc.sc3{background:#ECECFF;}
.contentSc.sc4{background:#F8EFEA;}
.contentSc.sc5{background:#E3F3F8;}
.contentSc.sc6{background:#F8FCEF;}
.contentSc.sc7{background:#F3EEF9;}
.contentSc.sc8{background:#FDEFE8;}
.contentSc article{width:950px; padding:20px 0px;}
.contentSc article::Before{content:""; display:block; width:80px; height:80px; border-radius:50%; margin:0 auto; margin-bottom:24px;}
.contentSc.sc2 article::Before{background:url("../images/c_1.svg")center center no-repeat #B71B44;}
.contentSc.sc3 article::Before{background:url("../images/c_2.svg")center center no-repeat #42447D;}
.contentSc.sc4 article::Before{background:url("../images/c_3.svg")center center no-repeat #A74205;}
.contentSc.sc5 article::Before{background:url("../images/c_4.svg")center center no-repeat #28758E;}
.contentSc.sc6 article::Before{background:url("../images/c_5.svg")center center no-repeat #5D7133;}
.contentSc.sc7 article::Before{background:url("../images/c_6.svg")center center no-repeat #6B4C9A;}
.contentSc.sc8 article::Before{background:url("../images/c_7.svg")center center no-repeat #AD4D17;}
.contentSc article h3{font-family:"GmarketSansbold"; font-size:36px;text-align:center;}
.contentSc article h3 i{font-family:inherit;}
.contentSc.sc2 article h3 i{color:#B71B44;}
.contentSc.sc3 article h3 i{color:#42447D;}
.contentSc.sc4 article h3 i{color:#A74205;}
.contentSc.sc5 article h3 i{color:#28758E;}
.contentSc.sc6 article h3 i{color:#5D7133;}
.contentSc.sc7 article h3 i{color:#6B4C9A;}
.contentSc.sc8 article h3 i{color:#AD4D17;}
.contentSc article > strong{margin-bottom:20px; display:flex; align-items: center; gap:0px 8px; font-size:20px; font-weight:500; color:#111;}
.contentSc article > strong i{font-weight:700;}
.contentSc article > strong u{text-decoration: underline; text-underline-position: under; color:#111; font-weight:700;}
.contentSc article > strong::before{content:""; display:block; width:15px; height:15px; border-radius:50%;}
.contentSc table{width:100%; margin-bottom:20px;}
.contentSc table tr th,
.contentSc table tr td{text-align:center; border-bottom:1px solid #ccc;  vertical-align: middle;}
.contentSc table tr td:not(:nth-last-of-type(1)),
.contentSc table tr th:not(:nth-last-of-type(1)){border-right:1px solid #ccc;}
.contentSc table tr th{padding:13px 0px; font-size:16px; font-weight:700; background:rgba(255,255,255,0.4);}
.contentSc table tr td{min-height:65px; padding:12px 0px; background:#fff; font-size:16px; font-weight:400; color:#555; line-height:130%;}
.contentSc em{display:flex; align-items: start; font-size:18px; color:#555; font-weight:400; line-height:150%; gap:0px 4px; margin-bottom:16px;}
.contentSc em:not(:nth-of-type(1)){margin-top:-12px;}
.contentSc em::Before{content:""; display:block; position:relative; top:4px; width:16px; height:16px; background:url("../images/exp_icon.svg")center center no-repeat; background-size:100%;}
.contentSc article > ul{padding-left:20px; margin-top:8px; margin-bottom:20px;}
/* ul 에만 상하 여백이 없어 다음 요소가 0px 로 붙던 문제 — table(margin-bottom:20px) 과 같은 리듬으로 맞춤 */
.contentSc article > em + strong{margin-top:32px;}
/* ※주석(em) 뒤에 새 소제목이 올 때의 간격을 sc3 과 동일한 32px 로 통일 */
.contentSc article > ul li{font-size:18px; font-weight:400; color:#555; line-height:150%; display:flex; align-items: start; flex-wrap:wrap; gap:0px 5px;}
.contentSc article > ul li div{color:inherit; font-weight:inherit; font-size:inherit;}
.contentSc article > ul > li::Before{content:"- "; margin-right:3px;}
.contentSc article > ul > li > ul{padding-left:12px; width: 100%;}
.contentSc article > ul > li > ul li::before{content:"· ";  margin-right:3px;}
.contentSc article > ul li strong{color:#111;}
.contentSc .link{color:#1259C4; display:inline-flex; align-items: center; gap:0px 2px;}
.contentSc .link.arrow::After{content:""; display:block; width:14px; height:14px; background:url("../images/link-icon.svg")center center no-repeat; background-size:100%;}
/*SC2*/
.contentSc.sc2 p{font-size:20px; font-weight: 500; text-align:center; line-height:150%; margin-top:40px;}
.contentSc.sc2 p b{font-weight:900; font-size:24px;}
.contentSc.sc2 p b.red{color:#B71B44;}
.contentSc > article > strong:nth-of-type(1){margin-top:40px;}

/*SC3*/
.contentSc.sc3 table th{color:#42447d; border-top:2px solid #42447D;}
.contentSc.sc3 article > strong i{color:#42447d;}
.contentSc.sc3 article > strong::before{border:4px solid #42447D;}
.contentSc.sc3 em{margin-bottom:32px;}
.contentSc.sc3 p{font-size:20px; font-weight:500; margin-top:20px;}
.contentSc.sc3 ol{display:flex; justify-content: center; align-items: center; gap:0px 20px; margin-top:32px;}
.contentSc.sc3 ol li a{display:block; padding:16px 40px; border-radius:3px; background:#42447d; color:#fff; font-size:18px; font-weight:500;}

/*SC4*/
.contentSc.sc4 p{font-size:20px; font-weight: 500; text-align:center; line-height:150%; margin-top:40px;}
.contentSc.sc4 table th{color:#A74205;}
.contentSc.sc4 table{border-top:2px solid #A74205;}
.contentSc.sc4 article > strong i{color:#A74205;}
.contentSc.sc4 article > strong::before{border:4px solid #A74205;}
.contentSc.sc4 article > strong i{color:#A74205;}
.contentSc.sc4 article table td b{font-weight:700; color:#A74205;}
.contentSc.sc4 article span{font-size:18px; }

/*SC5*/
.contentSc.sc5 table th{color:#28758E;}
.contentSc.sc5 table{border-top:2px solid #28758E;}
.contentSc.sc5 article > strong i{color:#28758E;}
.contentSc.sc5 article > strong::before{border:4px solid #28758E;}
.contentSc.sc5 p{font-size:18px; padding-left:20px; font-weight:400; line-height:150%; color:#111; }
.contentSc.sc5 p b{font-weight:700;}
.contentSc.sc5 strong{margin-bottom:8px;}
.contentSc.sc5 table{margin-top:20px;}
.contentSc.sc5 p.last{margin-top:20px; font-size:20px; font-weight:500; padding-left:0px;}
/* 2026-09-03 — 본문 링크를 버튼으로 변경(레드마인 #3661). sc3 버튼과 같은 규격, 색만 sc5 */
.contentSc.sc5 ol{display:flex; justify-content: center; align-items: center; gap:0px 20px; margin-top:32px; margin-bottom:32px;}
.contentSc.sc5 ol li a{display:block; padding:16px 40px; border-radius:3px; background:#28758E; color:#fff; font-size:18px; font-weight:500;}

/*sc6*/
.contentSc.sc6 table th{color:#5D7133;}
.contentSc.sc6 table{border-top:2px solid #5D7133; margin-top:40px;}

.contentSc.sc6 article > strong i{color:#5D7133;}
.contentSc.sc6 article > strong::before{border:4px solid #5D7133;}
.contentSc.sc6 p.expTex{font-size:18px; padding-left:20px; font-weight:400; line-height:150%; color:#111;}
.contentSc.sc6 p.last{margin-top:20px; font-size:20px; font-weight:500;}

/*sc7*/
.contentSc.sc7 p{font-size:20px; font-weight:500; text-align:center; line-height:150%; margin-top:40px;}
.contentSc.sc7 table th{color:#6B4C9A;}
.contentSc.sc7 table{border-top:2px solid #6B4C9A; margin-top:40px;}

/*sc8*/
.contentSc.sc8 p{font-size:20px; font-weight:500; text-align:center; line-height:150%; margin-top:40px;}
.contentSc.sc8 table th{color:#AD4D17;}
.contentSc.sc8 table{border-top:2px solid #AD4D17; margin-top:40px;}
.contentSc.sc8 table td b{font-weight:700; font-size:18px; color:#AD4D17;}

/*키보드 초점 표시*/
.contentSc a:focus-visible{outline:3px solid #111; outline-offset:2px;}
header h1 a:focus-visible{outline:3px solid #fff; outline-offset:2px;}

/*footer*/
footer{font-size:0px; width:100%; aspect-ratio: 1920/416; background:url("../images/c_footer.png")center center no-repeat; background-size:100%;}
.pcHidden{display:none;}
@media screen and (max-width:970px){
    .mHidden{display:none;}
    .pcHidden{display:block;}
    header{height:36px;}
    header h1 a{transform:scale(0.5);}
    .sc1{aspect-ratio: 375/600;  background:url("../images/main_visu_m.png")center center no-repeat; background-size:100%;}
    .sc1 ul{width:100%; margin-bottom:16px; padding:0px 16px; flex-wrap:wrap; justify-content:center; gap:8px;}
    .sc1 ul li{flex:0 0 calc(25% - 6px);}
    .sc1 ul li a{padding:14px 2px; justify-content: start; font-size:13px; border-radius:20px;}
    .sc1 ul li a::Before{width:40px; height:40px; margin-bottom:12px;}
    .sc1 ul li:nth-of-type(1) a::Before{background:url("../images/c_1.svg")center center no-repeat #464646; background-size:50%;}
    .sc1 ul li:nth-of-type(2) a::Before{background:url("../images/c_2.svg")center center no-repeat #464646; background-size:50%;}
    .sc1 ul li:nth-of-type(3) a::Before{background:url("../images/c_3.svg")center center no-repeat #464646; background-size:50%;}
    .sc1 ul li:nth-of-type(4) a::Before{background:url("../images/c_4.svg")center center no-repeat #464646; background-size:50%;}
    .sc1 ul li:nth-of-type(5) a::Before{background:url("../images/c_7.svg")center center no-repeat #464646; background-size:50%;}
    .sc1 ul li:nth-of-type(1) a:hover::Before{background:url("../images/c_1.svg")center center no-repeat #334069; background-size:50%;}
    .sc1 ul li:nth-of-type(2) a:hover::Before{background:url("../images/c_2.svg")center center no-repeat #334069; background-size:50%;}
    .sc1 ul li:nth-of-type(3) a:hover::Before{background:url("../images/c_3.svg")center center no-repeat #334069; background-size:50%;}
    .sc1 ul li:nth-of-type(4) a:hover::Before{background:url("../images/c_4.svg")center center no-repeat #334069; background-size:50%;}
    .sc1 ul li:nth-of-type(5) a:hover::Before{background:url("../images/c_7.svg")center center no-repeat #334069; background-size:50%;}
    .contentSc article::Before{width:50px; height:50px; margin-bottom:18px;}
    .contentSc.sc2 article::Before{background:url("../images/c_1.svg")center center no-repeat #B71B44; background-size:50%;}
    .contentSc.sc3 article::Before{background:url("../images/c_2.svg")center center no-repeat #42447D; background-size:50%;}
    .contentSc.sc4 article::Before{background:url("../images/c_3.svg")center center no-repeat #A74205; background-size:50%;}
    .contentSc.sc5 article::Before{background:url("../images/c_4.svg")center center no-repeat #28758E; background-size:50%;}
    .contentSc.sc6 article::Before{background:url("../images/c_5.svg")center center no-repeat #5D7133; background-size:50%;}
    .contentSc.sc7 article::Before{background:url("../images/c_6.svg")center center no-repeat #6B4C9A; background-size:50%;}
    .contentSc.sc8 article::Before{background:url("../images/c_7.svg")center center no-repeat #AD4D17; background-size:50%;}
    .contentSc article h3{font-size:24px; line-height:120%;}
    .contentSc.sc2 p{margin-top:20px;}
    .contentSc article{width:100%; padding:0px 4.3vw;}
    .contentSc{padding:32px 0px;}
    .contentSc > article > strong:nth-of-type(1){margin-top:28px;}
    .contentSc article > strong{font-size:15px; gap:0px 4px; margin-bottom:14px;}
    .contentSc table tr th{font-size:13px; padding:12px 0px;}
    .contentSc table tr td{padding:12px 0px; min-height:40px; font-size:12px;}
    .contentSc table{margin-bottom:12px;}
    .contentSc em{font-size:14px;}
    .contentSc.sc3 em{margin-bottom:20px;}
    .contentSc article > em + strong{margin-top:20px;}   /* 모바일은 리듬(12~20px)에 맞춰 축소 */
    .contentSc article > ul li{font-size:14px;}
    .contentSc.sc3 p{font-size:15px; margin-top:12px;}
    .contentSc.sc3 ol{flex-direction: column; gap:12px 0px;}
    .contentSc.sc3 ol li a{padding:14px 20px; font-size:14px;}
    .contentSc.sc4 p{font-size:15px; margin-top:18px;}
    .contentSc > article > strong:nth-of-type(1){margin-top:20px;}
    .contentSc.sc4 article span{font-size:15px;}
    .contentSc.sc5 p{font-size:14px;}
    .contentSc.sc5 p{margin-bottom:8px;}
    .contentSc.sc5 em{flex-wrap:wrap;}
    .contentSc.sc5 em span:nth-of-type(2){margin-left:16px;}
    .contentSc.sc5 p.last{font-size:15px; margin-top:12px;}
    .contentSc.sc5 ol{flex-direction: column; gap:12px 0px; margin-top:20px; margin-bottom:20px;}
    .contentSc.sc5 ol li a{padding:14px 20px; font-size:14px; text-align:center;}
    .contentSc.sc6 table{margin-top:22px;}
    .contentSc.sc6 p.expTex{font-size:14px; margin-bottom:8px;}
    .contentSc.sc6 p.last{font-size:15px; margin-top:12px;}
    .contentSc.sc7 p{font-size:15px; margin-top:18px;}
    .contentSc.sc7 table{margin-top:22px;}
    .contentSc.sc8 p{font-size:15px; margin-top:18px;}
    .contentSc.sc8 table{margin-top:22px;}
    .contentSc.sc8 table td b{font-size:14px;}
    footer{background:url("../images/c_foot_m.png")center center no-repeat; background-size:100%; width:100%; aspect-ratio: 375/200;}
}

/* ============================================================
   2026-09-09 — 상단 바로가기 고정 + 맨 위로(TOP) 버튼
   요청 = 중구청 고미설 주무관 / 선례 = 2024판 jg4u_2409 (menuFixed·scrollToTop)
   ※ 모바일 재정의가 앞서 나오므로 반드시 파일 맨 끝에 둔다.
   ============================================================ */
.sc1 .quickNav{width:100%; display:flex; justify-content:center;}
.quickNav.isFixed{position:fixed; top:0px; left:0px; z-index:100; padding:12px 0px; background:#EDE7F4; box-shadow:0px 2px 12px rgba(17,17,17,0.14);}
.quickNav.isFixed ul{width:950px; margin-bottom:0px;}
.quickNav.isFixed ul li a{height:52px; padding:0px; border-radius:14px; background:#fff; font-size:16px; line-height:120%;}
.quickNav.isFixed ul li a::Before{display:none;}
/* 앵커 이동·키보드 초점 이동으로 스크롤될 때 고정 바에 가리지 않게 도착 지점을 내린다.
   값 = 고정 바 높이(12+52+12=76px) + 여백 16px. 바 높이를 고치면 이 값도 같이 고친다. */
html{scroll-padding-top:92px;}

.topBtn{position:fixed; right:24px; bottom:24px; z-index:100; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px 0px; width:56px; height:56px; padding:0px; border:0px; border-radius:50%; background:#334069; color:#fff; font-family:"GmarketSans"; font-size:12px; font-weight:500; line-height:100%; cursor:pointer; box-shadow:0px 4px 14px rgba(17,17,17,0.25); opacity:0; visibility:hidden; transition-duration:0.2s;}
.topBtn::Before{content:""; display:block; width:9px; height:9px; margin-top:4px; border-left:2px solid #fff; border-top:2px solid #fff; transform:rotate(45deg);}
.topBtn.isOn{opacity:1; visibility:visible;}
.topBtn:hover{background:#1F2947;}
.topBtn:focus-visible{outline:3px solid #111; outline-offset:2px;}
.blind{position:absolute; width:1px; height:1px; margin:-1px; padding:0px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0px;}

@media screen and (max-width:970px){
    .quickNav.isFixed{padding:8px 0px;}
    .quickNav.isFixed ul{width:100%; padding:0px 10px; gap:6px; margin-bottom:0px;}
    .quickNav.isFixed ul li{flex:0 0 calc(33.333% - 4px);}
    .quickNav.isFixed ul li a{height:42px; padding:0px; justify-content:center; border-radius:10px; font-size:12px; line-height:115%;}
    .topBtn{right:14px; bottom:14px; width:46px; height:46px; font-size:11px;}
    html{scroll-padding-top:118px;}   /* 모바일 고정 바 = 8+42+6+42+8 = 106px + 여백 12px */
}