/* common */
section .sc-title { margin-bottom:  1rem; display: flex; align-items: center; justify-content: space-between;}
section .sc-title .mainTitle { font-size: 2rem; font-weight: 700; line-height: 1.4;}

.alertMessage { color: #999; font-size: 1.8rem; font-weight: 300; margin-top: 8rem; text-align: center;}
.btn-disabled { background-color: #ededed !important; color: #aaa !important;}
.btn-s1 { background-color: var(--brand-color); color: #fff;  border-radius: 0.8rem; display: block; padding: 1.6rem 2rem; width: 100%; font-size: 1.6rem; flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between;} 
.btn-s1 img { width: 2rem;}
.btn-s2 { display: block; width: 100%; margin-top: 2rem; padding: 1.6rem; background: #dfeaff; color: var(--brand-color); font-size: 1.8rem; font-weight: 600; border: none; border-radius: 0.8rem; cursor: pointer; letter-spacing: -0.03em; text-align: center; }
.bottom-button { margin-top: 4rem;}


/* home.php */
.homeWrap .home-banner { display: flex; align-items: center; justify-content: space-between; background-color: #f4f5f7; border-radius: 1.2rem; padding: 1.6rem 2rem; margin-bottom: 2.4rem; cursor: pointer; text-decoration: none; height: 6.5rem;}
.homeWrap .home-banner__text { font-size: 1.8rem; font-weight: 500; letter-spacing: -0.03em;}
.homeWrap .home-banner__text b { font-weight: 700;}
.homeWrap .home-banner__right { display: flex; align-items: center; gap: 0.8rem;}
.homeWrap .home-banner__icons { display: flex; gap: 0.4rem;}
.homeWrap .home-banner__icons span { display: flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 0.6rem; font-size: 1.6rem;}
.homeWrap .home-banner__icons span:nth-child(1) { background: #e8f4fd;}
.homeWrap .home-banner__icons span:nth-child(2) { background: #fff8e6;}
.homeWrap .home-banner__arrow { display: flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; color: #8a96a3;}
.homeWrap .home-banner__arrow svg { width: 1.6rem; height: 1.6rem;}
.homeWrap .home-icon-menu { display: flex; justify-content: space-around; align-items: flex-start; margin-bottom: 2.4rem; padding: 0 0.8rem;}
.homeWrap .home-icon-menu__item { display: flex; flex-direction: column; align-items: center; gap: 1rem; cursor: pointer; text-decoration: none; flex: 1;}
.homeWrap .home-icon-menu__icon { width: 3.6rem; height:3.6rem; display: flex; align-items: center; justify-content: center; font-size: 2.6rem;}
.homeWrap .home-icon-menu__label { font-size: 1.6rem; font-weight: 500; letter-spacing: -0.02em; text-align: center;}
.homeWrap .home-link-list { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 3.2rem;}
.homeWrap .home-link-list__item { display: flex; align-items: center; justify-content: space-between; background: #f4f5f7; border-radius: 1.2rem; padding: 1.6rem 2rem; cursor: pointer; text-decoration: none; height: 6.5rem;}
.homeWrap .home-link-list__left { display: flex; align-items: center; gap: 1.2rem;}
.homeWrap .home-link-list__icon { width: 3.6rem; height: 3.6rem; border-radius: 1rem; background: #f0f6ff; display: flex; align-items: center; justify-content: center; font-size: 2rem;}
.homeWrap .home-link-list__text { font-size: 1.8rem; font-weight: 500; letter-spacing: -0.03em;}
.homeWrap .home-link-list__text b { font-weight: 700;}
.homeWrap .home-link-list__arrow { display: flex; align-items: center; gap: 0.8rem;}
.homeWrap .home-divider { height: 0.8rem; background: #f2f5f8; margin: 0 -2rem 2.8rem;}
.homeWrap .home-tab { display: flex; border-bottom: 0.1rem solid #e8edf2; margin-bottom: 2rem;}
.homeWrap .home-tab__btn { padding: 1.2rem 1rem; font-size: 1.6rem; font-weight: 500; background: none; border: none; border-bottom: 0.2rem solid transparent; cursor: pointer; letter-spacing: -0.02em; transition: color 0.15s ease, border-color 0.15s ease; margin-bottom: -0.1rem;}
.homeWrap .home-tab__btn.is-active { border-bottom-color: var(--brand-color); font-weight: 700;}
.homeWrap .home-filter { display: flex; gap: 0.8rem; margin-bottom: 1.6rem;}
.homeWrap .home-filter__select { flex: 1; min-width: 0; appearance: none; -webkit-appearance: none; background: #fff url(../img/arrow-2.png) no-repeat right 1.2rem center; background-size: 1.6rem; border: 0.1rem solid #e8edf2; border-radius: 0.8rem; padding: 1.6rem 3.2rem 1.6rem 1.4rem; font-size: 1.4rem; color: #3a4a5c; cursor: pointer; letter-spacing: -0.02em; outline: none;}
.homeWrap .home-court-list { display: flex; flex-direction: column; gap: 0;}
.homeWrap .home-court-list__item { display: flex; align-items: center; justify-content: space-between; padding: 1.6rem 0; border-bottom: 0.1rem solid #f2f5f8;}
.homeWrap .home-court-list__item:last-child { border-bottom: none;}
.homeWrap .home-court-list__info  { flex: 1; min-width: 0;}
.homeWrap .home-court-list__name { font-size: 1.6rem; font-weight: 600; letter-spacing: -0.03em; margin-bottom: 0.4rem;}
.homeWrap .home-court-list__addr { font-size: 1.3rem; color: #999; letter-spacing: -0.02em; line-height: 1.3;}
.homeWrap .home-court-list__map { flex-shrink: 0; font-size: 1.2rem; font-weight: 400; color: var(--brand-color); background: #dfeaff; border: none; border-radius: 100px; padding: 0.6rem 1.2rem; cursor: pointer; letter-spacing: -0.02em; white-space: nowrap;}
.homeWrap .home-more-btn { display: block; width: 100%; margin-top: 2rem; padding: 1.6rem; background: #dfeaff; color: var(--brand-color); font-size: 1.8rem; font-weight: 600; border: none; border-radius: 0.8rem; cursor: pointer; letter-spacing: -0.03em; text-align: center; }




/* subpage */
.subpage-title { font-size: 1.8rem; font-weight: 700; margin-bottom: 2rem;}

.subpage-list { display: flex; flex-direction: column; gap: 1.8rem;}
.subpage-list .list-item { background-color: #f4f5f7; border-radius: 1rem; padding: 2.4rem 1.8rem;}
.subpage-list .list-item .item-title { font-size: 1.6rem; font-weight: 600;}
.subpage-list .list-item .item-desc { font-size: 1.4rem; color: #999; line-height: 1.4; margin-top: 1rem;}
.subpage-list .list-item .item-desc strong{ font-size: inherit; margin-bottom: 4px; display: inline-block; color: #444; line-height: 1.3;}

.pagination { display: flex; align-items: center; justify-content: center; gap: 0.4rem;}
.pagination__btn { display: flex; align-items: center; justify-content: center; width: 3.4rem; height: 3.4rem; border-radius: 50%; border: none; background: none; font-size: 1.4rem; font-weight: 500; color: #555; cursor: pointer; transition: background 0.15s ease, color 0.15s ease;}
.pagination__btn.is-active { background: var(--brand-color); color: #fff; font-weight: 700;}
.pagination__btn:disabled { color: #ccc; cursor: default;}
.pagination__arrow { display: flex; align-items: center; justify-content: center; width: 3.4rem; height: 3.4rem; border-radius: 50%; border: none; background: none; cursor: pointer; color: #888; transition: background 0.15s ease;}
.pagination__arrow img { width: 1rem;}

.contents_area { flex: 1; min-height: 0;}


/* sub.php */
.subWrap .info-desc { font-size: 1.6rem; font-weight: 400; line-height: 1.6; letter-spacing: -0.02em; margin-bottom: 2.4rem;}
.subWrap .info-card-list { display: flex; flex-direction: column; gap: 1.6rem; margin-bottom: 3.2rem;}
.subWrap .info-card { background: #f4f5f7; border-radius: 1.2rem; padding: 3rem 2rem 3rem 2rem;}
.subWrap .info-card__title { font-size: 1.7rem; font-weight: 700; letter-spacing: -0.03em; margin-bottom: 1.2rem;}
.subWrap .info-card__list { display: flex; flex-direction: column; gap: 0.6rem; padding: 0; margin: 0; list-style: none;}
.subWrap .info-card__list li { font-size: 1.5rem; font-weight: 400; line-height: 1.6; letter-spacing: -0.02em; padding-left: 1.2rem; position: relative;}
.subWrap .info-card__list li::before { content: '·'; position: absolute; left: 0; top: 0; color: #888; font-size: 1.6rem; line-height: 1.4;}
.subWrap .info-section { margin-bottom: 3.2rem;}
.subWrap .info-section__title { font-size: 1.8rem; font-weight: 700; letter-spacing: -0.03em; margin-bottom: 1.2rem; color: var(--brand-color);}
.subWrap .info-section__list { display: flex; flex-direction: column; gap: 0.8rem; padding: 0; margin: 0; list-style: none;}
.subWrap .info-section__list li { font-size: 1.6rem; font-weight: 400; color: #555; line-height: 1.4; letter-spacing: -0.02em; position: relative;}

/* sub2.php */
.sub2Wrap .s2-tab { display: flex; margin-bottom: 2.4rem; gap: 10px;}
.sub2Wrap .s2-tab__btn { flex: 1; padding: 1.3rem 0; font-size: 1.6rem; font-weight: 600; color: #666; background: #fff; border: none; cursor: pointer; letter-spacing: -0.03em; border-radius: 0.8rem; background: #f4f5f7;}
.sub2Wrap .s2-tab__btn.is-active { background: var(--brand-color); color: #fff;}
.sub2Wrap .s2-tab-panel { display: none;}
.sub2Wrap .s2-tab-panel.is-active { display: block;}
.sub2Wrap .s2-content p { font-size: 1.6rem; font-weight: 400; color: #555; line-height: 1.4; margin-bottom: 1.6rem;}
.sub2Wrap .s2-content p b { font-weight: 700; color: var(--brand-color);}
.sub2Wrap .s2-content .list-num { display: flex; flex-direction: column; gap: 0; margin-top: 2rem; padding: 0; list-style: none; counter-reset: step-counter; gap: 1.5rem;}
.sub2Wrap .s2-content .list-num li { display: flex; align-items: center; gap: 1rem; padding: 1.6rem; font-size: 1.4rem; font-weight: 400; letter-spacing: -0.025em; counter-increment: step-counter; border-radius: 0.8rem; background-color: #f4f5f7;}
.sub2Wrap .s2-content .list-num li:last-child { border-bottom: none;}
.sub2Wrap .s2-content .list-num li::before { content: counter(step-counter); flex-shrink: 0; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--brand-color); color: #fff; font-size: 1.35rem; font-weight: 700; display: flex; align-items: center; justify-content: center; letter-spacing: 0;}
.sub2Wrap .calc-wrap { margin-top: 2.4rem;}
.sub2Wrap .strong-title { font-size: 1.8rem; font-weight: 700; letter-spacing: -0.03em; margin-bottom: 1.2rem;}
.sub2Wrap .calc-card { background: #fff; border: 1px solid #e8edf2; border-radius: 1.2rem; padding: 4rem 2rem; margin-bottom: 1.2rem;}
.sub2Wrap .calc-card__subtitle { font-size: 1.6rem; font-weight: 700; color: var(--brand-color); letter-spacing: -0.03em; margin-bottom: 1.6rem; padding-bottom: 1.2rem; }
.sub2Wrap .calc-field { margin-bottom: 1.6rem;}
.sub2Wrap .calc-field:last-child { margin-bottom: 0;}
.sub2Wrap .calc-field__label { display: block; font-size: 1.5rem; font-weight: 400; color: #666; letter-spacing: -0.02em; margin-bottom: 0.8rem;}
.sub2Wrap .calc-field__row { display: flex; align-items: center; gap: 0.8rem;}
.sub2Wrap .calc-field__input { flex: 1; border: 1px solid #eee; padding: 1.2rem 1.4rem; font-size: 1.5rem; outline: none; -moz-appearance: textfield;}
.sub2Wrap .calc-field__input::-webkit-outer-spin-button, .sub2Wrap .calc-field__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;}
.sub2Wrap .calc-field__result { flex: 1;  padding: 1.2rem 1.4rem; font-size: 1.5rem; background: #f7f9fc; min-height: 4.6rem;}
.sub2Wrap .calc-field__unit { flex-shrink: 0; font-size: 1.6rem; font-weight: 500; color: #555;}
.sub2Wrap .s2-content p.calc-note { font-size: 1.5rem; font-weight: 400; color: #999; line-height: 1.4; margin-bottom: 1.6rem;}


/* sub3.php */
.sub3Wrap .s3-search { display: flex; align-items: center; gap: 1rem; border: 0.1rem solid #d0d8e4; border-radius: 0.8rem; padding: 1.2rem 1.6rem; margin-bottom: 1.6rem; background: #fff;}
.sub3Wrap .s3-search__input { flex: 1; border: none; outline: none; font-size: 1.5rem; color: #222; letter-spacing: -0.02em; background: transparent;}
.sub3Wrap .s3-search__input::placeholder { color: #bbb;}
.sub3Wrap .s3-search__icon { flex-shrink: 0; width: 2rem; height: 2rem; color: #888;}
.sub3Wrap .s3-initial { display: flex; align-items: center; gap: 0.4rem; overflow-x: auto; padding-bottom: 0.4rem; margin-bottom: 2rem; scrollbar-width: none;}
.sub3Wrap .s3-initial::-webkit-scrollbar { display: none;}
.sub3Wrap .s3-initial__btn { flex-shrink: 0; padding: 0.6rem 1rem; font-size: 1.3rem; font-weight: 500; color: #555; background: #fff; border: 0.1rem solid #e0e6ed; border-radius: 0.6rem; cursor: pointer; letter-spacing: -0.01em; transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease; white-space: nowrap;}
.sub3Wrap .s3-initial__btn.is-active { background: var(--brand-color); color: #fff; border-color: var(--brand-color);}
.sub3Wrap .s3-list { display: flex; flex-direction: column; gap: 1.6rem; margin-bottom: 3.2rem;}
.sub3Wrap .s3-list__item { display: block; width: 100%; padding: 1.6rem 2rem; background: #f5f7fa; border: none; border-radius: 0.8rem; font-size: 1.6rem; font-weight: 400; letter-spacing: -0.025em; text-align: center; cursor: pointer; text-decoration: none; transition: background 0.15s ease, color 0.15s ease;}
.sub3Wrap .s3-empty { text-align: center; font-size: 1.4rem; color: #aaa; padding: 4rem 0;}


/* sub3_detail.php */
.sub3DetailWrap .s3d-term { font-size: 1.6rem; font-weight: 500; text-align: center; padding: 1.8rem 2rem; background: #f4f5f7; border-radius: 1rem; margin-bottom: 2.4rem; letter-spacing: -0.03em;}
.sub3DetailWrap .s3d-content { font-size: 1.4rem; font-weight: 400; color: #444; line-height: 1.85; letter-spacing: -0.025em;}
.sub3DetailWrap .bottom-button { margin-top: 4rem;}

/* qna.php */
.qnaWrap .qna-filter { margin-bottom: 1.6rem;}
.qnaWrap .qna-filter__select { width: 100%; appearance: none; -webkit-appearance: none; background: #fff url(../img/arrow-2.png) no-repeat right 1.2rem center; background-size: 1.6rem; border: 0.1rem solid #e0e6ed; border-radius: 0.8rem; padding: 1.1rem 3.2rem 1.1rem 1.4rem; font-size: 1.4rem; color: #333; cursor: pointer; letter-spacing: -0.02em; outline: none;}
.qnaWrap .qna-filter__select option { font-size: 1.5rem;}
.qnaWrap .qna-list { display: flex; flex-direction: column; gap: 0; margin-bottom: 3.2rem;}
.qnaWrap .qna-item { padding: 1.8rem 0; border-bottom: 0.1rem solid #f0f3f7;}
.qnaWrap .qna-item:first-child { border-top: 0.1rem solid #f0f3f7;}
.qnaWrap .qna-item__badge { display: inline-block; font-size: 1.4rem; font-weight: 400; color: var(--brand-color); background: #eaf2fd; border-radius: 100px; padding: 0.6rem 1.6rem; margin-bottom: 1.2rem;}
.qnaWrap .qna-item__question { font-size: 1.6rem; font-weight: 500; color: #1a2e4a; line-height: 1.4; letter-spacing: -0.025em; margin-bottom: 1.4rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.qnaWrap .qna-item__link { display: flex; align-items: center; gap: 1rem; font-size: 1.4rem; font-weight: 400; color: #888; letter-spacing: -0.02em; text-decoration: none;}
.qnaWrap .qna-item__link img { width: 0.7rem;}
.qnaWrap .qna-empty { text-align: center; font-size: 1.4rem; color: #aaa; padding: 4rem 0;}


/* qna_detail.php */
.qnaDetailWrap .qnad-badge { display: inline-block; font-size: 1.4rem; font-weight: 400; color: var(--brand-color); background: #eaf2fd; border-radius: 100px; padding: 0.6rem 1.6rem; margin-bottom: 1.2rem;}
.qnaDetailWrap .qnad-question { font-size: 1.8rem; font-weight: 700; color: #1a2e4a; line-height: 1.55; letter-spacing: -0.03em; margin-bottom: 2.4rem; padding-bottom: 2rem; border-bottom: 0.1rem solid #edf0f5;}
.qnaDetailWrap .qnad-answer { font-size: 1.6rem; font-weight: 400; color: #444; line-height: 1.85; letter-spacing: -0.025em;}
.qnaDetailWrap .bottom-button { margin-top: 4rem;}


/* courts.php */
.courtsWrap .courts-tab { display: flex; border-bottom: 0.1rem solid #e8edf2; margin-bottom: 2rem;}
.courtsWrap .courts-tab__btn { padding: 1.2rem 1rem; font-size: 1.6rem; font-weight: 500; color: #888; background: none; border: none; border-bottom: 0.2rem solid transparent; cursor: pointer; letter-spacing: -0.02em; text-decoration: none; transition: color 0.15s ease, border-color 0.15s ease; margin-bottom: -0.1rem; display: inline-block;}
.courtsWrap .courts-tab__btn.is-active { color: var(--brand-color); border-bottom-color: var(--brand-color); font-weight: 700;}
.courtsWrap .courts-filter { display: flex; gap: 0.8rem; margin-bottom: 1.6rem;}
.courtsWrap .courts-filter__select { flex: 1; min-width: 0; appearance: none; -webkit-appearance: none; background: #fff url(../img/arrow-2.png) no-repeat right 1.2rem center; background-size: 1.6rem; border: 0.1rem solid #e8edf2; border-radius: 0.8rem; padding: 1.6rem 3.2rem 1.6rem 1.4rem; font-size: 1.4rem; color: #3a4a5c; cursor: pointer; letter-spacing: -0.02em;}
.courtsWrap .courts-list { display: flex; flex-direction: column; gap: 0; margin-bottom: 3.2rem;}
.courtsWrap .courts-list__item { display: flex; align-items: center; justify-content: space-between; padding: 1.6rem 0; border-bottom: 0.1rem solid #f2f5f8;}
.courtsWrap .courts-list__item:last-child { border-bottom: none;}
.courtsWrap .courts-list__info { flex: 1; min-width: 0;}
.courtsWrap .courts-list__name { font-size: 1.6rem; font-weight: 600; letter-spacing: -0.03em; margin-bottom: 0.4rem;}
.courtsWrap .courts-list__addr { font-size: 1.3rem; color: #999; letter-spacing: -0.02em; line-height: 1.4;}
.courtsWrap .courts-list__map { flex-shrink: 0; font-size: 1.2rem; font-weight: 400; color: var(--brand-color); background: #dfeaff; border: none; border-radius: 100px; padding: 0.6rem 1.2rem; cursor: pointer; letter-spacing: -0.02em; white-space: nowrap;}
.courtsWrap .courts-empty { text-align: center; font-size: 1.4rem; color: #aaa; padding: 4rem 0;}


/* agency_detail.php */
.agencyDetailWrap .agd-name { font-size: 1.6rem; font-weight: 500; text-align: center; padding: 1.8rem 2rem; background: #f4f5f7; border-radius: 1rem; margin-bottom: 2.4rem; letter-spacing: -0.03em;}
.agencyDetailWrap .agd-map-area { width: 100%; aspect-ratio: 4/3; background: #f2f5f8; border-radius: 1rem; margin-bottom: 2rem; display: flex; align-items: center; justify-content: center; overflow: hidden;}
.agencyDetailWrap .agd-map-placeholder { font-size: 1.4rem; color: #aaa;}
.agencyDetailWrap .agd-info-list { display: flex; flex-direction: column; gap: 0;}
.agencyDetailWrap .agd-info-item { padding: 1.6rem 0; border-bottom: 0.1rem solid #f0f3f7;}
.agencyDetailWrap .agd-info-item:last-child { border-bottom: none;}
.agencyDetailWrap .agd-info-item__label { display: inline-block; font-size: 1.4rem; font-weight: 400; color: var(--brand-color); background: #eaf2fd; border-radius: 100px; padding: 0.6rem 1.6rem; margin-bottom: 1.2rem;}
.agencyDetailWrap .agd-info-item__value { font-size: 1.6rem; font-weight: 400; color: #444; line-height: 1.75; letter-spacing: -0.025em;}
.agencyDetailWrap .bottom-button { margin-top: 4rem;}
.agencyDetailWrap .agd-map-area { width: 100%; aspect-ratio: 4/3; border-radius: 1rem; margin-bottom: 2rem; overflow: hidden;}
.agencyDetailWrap #naver-map { width: 100%; height: 100%;}