/* ================================================================
   custom.css — 사용자 페이지 추가 스타일
   경로: /css/custom.css
   역할: atlas.css / board.css / elements.css 으로 처리되지 않는
         페이지별 전용 스타일을 기재한다.
================================================================ */

/* ------------------------------------------------------------------------------------------------
   메인 랜딩 페이지 (index.php)
   — 독스아일랜드 논현 (소형견 전담 유치원 · 호텔) 리뉴얼 디자인
   — .homePage 클래스 내에서만 적용되어 타 페이지와 충돌 없음
-------------------------------------------------------------------------------------------------*/

/* 기본 리셋 (홈 페이지 영역) */
.homePage { --accent: #FFB74D; font-family: 'Jua', 'Noto Sans KR', -apple-system, sans-serif; color: #4A3728; background: #FFFBF4; font-size: 16px; line-height: 1.6; display: block; }
.homePage *, .homePage *::before, .homePage *::after { box-sizing: border-box; margin: 0; padding: 0; }
.homePage a { text-decoration: none; color: inherit; }
.homePage ul { list-style: none; }
.homePage img { max-width: 100%; display: block; }

/* ── 공통 레이아웃 ── */
.homeContainer { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.homeSection { padding: 100px 0; }

/* ── 헤더 ── */
#siteHeader { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,0.08); transition: background 0.3s; }
#siteHeader .headerInner { display: flex; align-items: center; justify-content: space-between; max-width: 1180px; margin: 0 auto; padding: 0 20px; height: 68px; }

/* ── 로고 ── */
.siteLogo { display: flex; align-items: center; gap: 8px; font-size: 1.5rem; font-weight: 800; color: #e07b54; }
.siteLogo img { max-height: 44px; width: auto; }

/* ── GNB ── */
.gnbList { display: flex; align-items: center; gap: 32px; list-style: none; padding: 0; margin: 0; }

.gnbList > li > a { font-size: 0.95rem; font-weight: 600; color: #444; padding: 6px 0; position: relative; transition: color 0.2s; }
.gnbList > li > a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: #e07b54; transition: width 0.3s; }

.gnbList > li > a:hover { color: #e07b54; }
.gnbList > li > a:hover::after { width: 100%; }

.gnbCta { background: #e07b54 !important; color: #fff !important; padding: 8px 20px !important; border-radius: 50px; font-size: 0.88rem !important; }

.gnbCta::after { display: none !important; }
.gnbCta:hover { background: #c9643e !important; }

/* ── 햄버거 버튼 ── */
.btnHamburger { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 36px; height: 36px; background: none; border: none; cursor: pointer; padding: 4px; }
.btnHamburger span { display: block; width: 100%; height: 2px; background: #333; border-radius: 2px; transition: all 0.3s; }
.btnHamburger.isOpen span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.btnHamburger.isOpen span:nth-child(2) { opacity: 0; }
.btnHamburger.isOpen span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── 모바일 드로어 ── */
.mobileMenu { display: none; flex-direction: column; position: fixed; top: 68px; left: 0; width: 100%; background: #fff; box-shadow: 0 4px 16px rgba(0,0,0,0.12); z-index: 999; padding: 12px 0; border-top: 1px solid #f0f0f0; list-style: none; }
.mobileMenu.isOpen { display: flex; }
.mobileMenu li a { display: block; padding: 14px 24px; font-size: 1rem; font-weight: 600; color: #444; border-bottom: 1px solid #f8f8f8; transition: background 0.2s, color 0.2s; }
.mobileMenu li a:hover { background: #fff5f1; color: #e07b54; }

/* 헤더 높이만큼 여백 */
.homePage { padding-top: 68px; }

/* ── 히어로 섹션 (배경 슬라이드쇼) ── */
.heroSection { position: relative; height: calc(100vh - 68px); min-height: 520px; overflow: hidden; display: flex; align-items: center; }
.heroSlideList { position: absolute; inset: 0; }
.heroSlide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.2s ease; }
.heroSlide.isActive { opacity: 1; }
.heroOverlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(62,44,30,0.72) 0%, rgba(62,44,30,0.45) 45%, rgba(62,44,30,0.15) 75%); }
.heroContent { position: relative; z-index: 2; max-width: 720px; }
.heroBadge { display: inline-block; background: rgba(255,255,255,0.16); backdrop-filter: blur(4px); color: #FFF6E9; font-size: 1.12rem; font-weight: 700; padding: 6px 18px; border-radius: 999px; margin-bottom: 20px; }
.heroTitle { font-size: 4.2rem; line-height: 1.3; color: #fff; margin-bottom: 24px; text-shadow: 0 2px 20px rgba(0,0,0,0.25); }
.heroDesc { font-size: 1.47rem; line-height: 1.8; color: #F5EADA; max-width: 480px; margin-bottom: 36px; }
.heroBtnGroup { display: flex; gap: 14px; flex-wrap: wrap; }

.btnPrimary { display: inline-flex; align-items: center; gap: 8px; background: var(--accent); color: #fff; font-size: 1.33rem; font-weight: 700; padding: 16px 32px; border-radius: 999px; border: 2px solid var(--accent); transition: filter 0.2s, transform 0.15s; }
.btnPrimary:hover { filter: brightness(1.06); transform: translateY(-2px); }
.btnOutline { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.92); color: #4A3728; font-size: 1.33rem; font-weight: 700; padding: 16px 32px; border-radius: 999px; border: 2px solid rgba(255,255,255,0.92); transition: all 0.2s; }
.btnOutline:hover { background: #fff; transform: translateY(-2px); }

.heroDotList { position: absolute; left: 0; right: 0; bottom: 28px; z-index: 2; display: flex; justify-content: center; gap: 8px; }
.heroDot { width: 8px; height: 8px; border-radius: 999px; border: none; background: rgba(255,255,255,0.75); cursor: pointer; padding: 0; transition: all 0.3s ease; }
.heroDot.isActive { width: 26px; background: var(--accent); }

/* ── 섹션 공통 제목 ── */
.sectionTitle { text-align: center; max-width: 640px; margin: 0 auto 50px; }
.sectionEyebrow { display: block; font-family: 'Jua', sans-serif; color: var(--accent); font-size: 1.05rem; margin-bottom: 10px; }
.sectionTitle h2 { font-size: 2.8rem; margin-bottom: 16px; color: #3E2C1E; }
.sectionTitle p { font-size: 1.12rem; color: #6B5744; line-height: 1.8; }
.sectionCtaWrap { text-align: center; margin-top: 32px; }

/* ── 소개 / 철학 카드 ── */
.aboutSection { background: #FFFBF4; }
.philosophyGrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px; max-width: 1000px; margin: 0 auto; }
.philosophyCard { background: #fff; border-radius: 24px; padding: 32px 26px; text-align: center; box-shadow: 0 10px 30px -18px rgba(74,55,40,0.25); }
.philosophyIcon { width: 56px; height: 56px; border-radius: 50%; background: #FFF1DB; display: flex; align-items: center; justify-content: center; margin: 0 auto 18px; font-size: 1.8rem; }
.philosophyCard h3 { font-size: 1.3rem; margin-bottom: 10px; color: #3E2C1E; }
.philosophyCard p { font-size: 1.05rem; color: #6B5744; line-height: 1.7; }

/* ── 유치원 요금 (프로그램) ── */
.programsSection { background: #FFF6E9; }
.programsMeta { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-bottom: 28px; }
.metaChip { display: flex; align-items: center; gap: 10px; background: #fff; border-radius: 14px; padding: 10px 18px; font-size: 1.05rem; color: #4A3728; }
.metaChipLabel { background: var(--accent); color: #fff; font-size: 0.9rem; padding: 5px 14px; border-radius: 999px; }
.pricingTableWrap { background: #fff; border-radius: 24px; padding: 32px; overflow-x: auto; box-shadow: 0 10px 30px -18px rgba(74,55,40,0.25); max-width: 920px; margin: 0 auto; }

/* 유치원 요금표 (div + flex 기반) */
.pricingTable { display: flex; min-width: 480px; }
.pricingMain { flex: 1; display: flex; flex-direction: column; }
.pricingRow { display: flex; border-bottom: 1px solid #F5EEE0; }
.pricingRow:last-child { border-bottom: none; }
.pricingHeadRow { border-bottom: 2px solid #F0E4D3; }
.pricingCell { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; padding: 16px 10px; font-size: 1.05rem; color: #5C4A38; }
.pricingHeadRow .pricingCell { font-size: 1rem; color: #8A7862; }
.planCol { flex: 1.4; justify-content: flex-start; text-align: left; }
.pricingPlan { font-family: 'Jua', sans-serif; font-size: 1.1rem; color: #3E2C1E; }
.pricingBenefitCol { width: 160px; flex-shrink: 0; display: flex; flex-direction: column; border-left: 1px solid #F0E4D3; }
.pricingBenefitHead { display: flex; align-items: center; justify-content: center; text-align: center; padding: 16px 10px; font-size: 1rem; color: #8A7862; border-bottom: 2px solid #F0E4D3; }
.pricingBenefitBody { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; padding: 10px; font-size: 1rem; color: var(--accent); }

/* 호텔 요금표 (div + flex 기반) */
.hotelTable { display: flex; flex-direction: column; min-width: 420px; overflow-x: auto; }
.hotelRow { display: flex; }
.hotelHeadRow { border-bottom: 2px solid #F0E4D3; }
.hotelCell { flex: 1; text-align: center; padding: 14px 10px; }
.hotelHeadRow .hotelCell { font-size: 1rem; color: #8A7862; }
.hotelRow:last-child .hotelCell { font-family: 'Jua', sans-serif; font-size: 1.3rem; color: var(--accent); padding: 18px 10px; }
.pickupFeeWrap { max-width: 920px; margin: 32px auto 0; text-align: center; }
.pickupFeeTitle { font-size: 1.28rem; color: #3E2C1E; margin-bottom: 16px; }
.pickupFeeList { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.pickupFeeItem { background: #fff; border-radius: 14px; padding: 14px 22px; font-size: 1.05rem; color: #4A3728; }
.pickupFeeItem span { color: #8A7862; }

/* ── 호텔 요금 ── */
.hotelSection { background: #FFF6E9; }
.hotelCard { max-width: 920px; margin: 0 auto 28px; background: #fff; border-radius: 24px; padding: 32px; box-shadow: 0 10px 30px -18px rgba(74,55,40,0.25); }
.hotelCardHeader { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.hotelCardHeader h3 { font-size: 1.28rem; color: #3E2C1E; }
.hotelBadge { background: #FFF1DB; color: #4A3728; font-size: 1rem; padding: 6px 16px; border-radius: 999px; }
.hotelNote { font-size: 0.95rem; color: #8A7862; margin-top: 16px; }

/* ── 일과표 ── */
.scheduleList { max-width: 680px; margin: 0 auto; display: flex; flex-direction: column; }
.scheduleItem { display: flex; gap: 22px; padding: 20px 0; border-bottom: 1px dashed #EADFCB; }
.scheduleTime { font-family: 'Jua', sans-serif; color: var(--accent); font-size: 1.2rem; width: 78px; flex-shrink: 0; }
.scheduleBody strong { display: block; font-size: 1.18rem; color: #3E2C1E; margin-bottom: 4px; }
.scheduleBody p { font-size: 1rem; color: #8A7862; line-height: 1.6; }

/* ── 시설 갤러리 ── */
.gallerySection { background: #FFF6E9; }
.galleryGrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; max-width: 1080px; margin: 0 auto; }
.galleryItem { aspect-ratio: 4/3; border-radius: 20px; background: repeating-linear-gradient(120deg, #FFF1DB, #FFF1DB 10px, #fff 10px, #fff 20px); display: flex; align-items: center; justify-content: center; }
.galleryLabel { font-size: 0.95rem; color: #6B5744; background: #fffbf4dd; padding: 8px 14px; border-radius: 8px; text-align: center; }

/* ── 고객 후기 ── */
.reviewSection { background: #FFFBF4; }
.reviewGrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 24px; max-width: 1080px; margin: 0 auto; }
.reviewCard { background: #FFF6E9; border-radius: 22px; padding: 28px 24px; box-shadow: none; }
.reviewStars { color: var(--accent); font-size: 1.4rem; letter-spacing: 2px; margin-bottom: 12px; }
.reviewCard p { font-size: 1.26rem; color: #5C4A38; line-height: 1.75; margin-bottom: 16px; }
.reviewAuthor { display: flex; align-items: center; gap: 12px; }
.reviewAvatar { width: 38px; height: 38px; border-radius: 50%; background: #FFF1DB; display: flex; align-items: center; justify-content: center; font-family: 'Jua', sans-serif; font-size: 1rem; color: #4A3728; flex-shrink: 0; }
.reviewAuthor strong { font-size: 1.23rem; font-weight: 700; color: #3E2C1E; display: block; }
.reviewAuthor small  { font-size: 1.09rem; color: #8A7862; display: block; }

/* ── 오시는 길 ── */
.locationSection { background: #FFF6E9; }
.locationInner { display: flex; gap: 40px; flex-wrap: wrap; align-items: center; }
.locationMap { flex: 1 1 320px; min-width: 260px; aspect-ratio: 4/3; border-radius: 24px; background: repeating-linear-gradient(45deg, #FFF1DB, #FFF1DB 14px, #fff 14px, #fff 28px); display: flex; align-items: center; justify-content: center; }
.locationInfo { flex: 1 1 320px; min-width: 260px; }
.locationInfo h2 { font-size: 2rem; margin-bottom: 20px; color: #3E2C1E; }
.locationList li { font-size: 1.12rem; color: #5C4A38; line-height: 1.7; margin-bottom: 14px; }
.locationList strong { color: #3E2C1E; }

/* ── 상담 신청 ── */
.contactSection { background: #FFFBF4; }
.contactForm { max-width: 560px; margin: 0 auto; background: #fff; border-radius: 26px; padding: 40px; box-shadow: 0 20px 50px -30px rgba(74,55,40,0.35); display: flex; flex-direction: column; gap: 18px; }
.contactFieldRow { display: flex; gap: 14px; flex-wrap: wrap; }
.contactInput, .contactSelect, .contactTextarea { flex: 1 1 200px; padding: 14px 16px; border-radius: 14px; border: 1px solid #EADFCB; font-size: 1.05rem; font-family: inherit; color: #4A3728; background: #fff; }
.contactTextarea { flex: 1 1 100%; resize: vertical; }
.contactSubmitBtn { width: 100%; border: none; }
.contactSuccessBox { max-width: 560px; margin: 0 auto; background: #fff; border-radius: 26px; padding: 60px 40px; text-align: center; box-shadow: 0 20px 50px -30px rgba(74,55,40,0.35); }
.contactSuccessIcon { font-size: 2.5rem; margin-bottom: 16px; }
.contactSuccessBox h3 { font-size: 1.4rem; margin-bottom: 10px; color: #3E2C1E; }
.contactSuccessBox p { color: #6B5744; font-size: 1.05rem; line-height: 1.7; }

/* ── FAQ ── */
.faqSection { background: #FFF6E9; }
.faqList { max-width: 680px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }
.faqItem { background: #fff; border-radius: 18px; overflow: hidden; }
.faqHeader { padding: 20px 24px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap: 16px; font-size: 1.08rem; color: #3E2C1E; }
.faqArrow { font-size: 1.3rem; color: var(--accent); flex-shrink: 0; }
.faqBody { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.faqBody p { padding: 0 24px 22px; font-size: 1rem; color: #6B5744; line-height: 1.75; }

/* ── 푸터 ── */
#siteFooter { background: #3E2C1E; color: #EADFCB; padding: 48px 20px 0; }
.footerInner { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; flex-wrap: wrap; padding-bottom: 32px; }
.footerLogo { display: flex; align-items: center; gap: 8px; font-size: 1.96rem; font-weight: 800; color: #fff; margin-bottom: 12px; }
.footerLogo img { max-height: 36px; width: auto; }
.footerInfo p { font-size: 1.19rem; line-height: 2; color: #C9B8A3; }
.footerNav { display: flex; gap: 20px; flex-wrap: wrap; padding-top: 4px; }
.footerNav a { font-size: 1.23rem; color: #C9B8A3; transition: color 0.2s; }
.footerNav a:hover { color: #fff; }
.footerCopy { text-align: center; padding: 20px 0; border-top: 1px solid rgba(255,255,255,0.1); font-size: 1.15rem; color: #A8927C; }

/* ── 맨 위로 버튼 ── */
.btnScrollTop { position: fixed; right: 24px; bottom: 24px; z-index: 60; width: 52px; height: 52px; border-radius: 50%; border: none; background: var(--accent); color: #fff; font-size: 20px; cursor: pointer; box-shadow: 0 10px 24px -8px rgba(74,55,40,0.5); opacity: 0; pointer-events: none; transform: translateY(10px); transition: all 0.3s ease; }
.btnScrollTop.isVisible { opacity: 1; pointer-events: auto; transform: translateY(0); }

/* ── 반응형 ── */
@media (max-width: 900px) {
    .heroTitle { font-size: 3.08rem; }
}

@media (max-width: 768px) {
    .gnbList { display: none; }
    .btnHamburger { display: flex; }
    .homeSection { padding: 56px 0; }
}

@media (max-width: 600px) {
    .heroTitle { font-size: 2.1rem; }
    .sectionTitle h2 { font-size: 2.1rem; }
    .scheduleItem { gap: 14px; }
}

/* ── index.php 전체 폰트 30% 확대 (기존 값 × 1.3) ── */
/* 헤더는 .homePage 바깥에 있으므로 body.pageHome 으로 적용 */
.pageHome .siteLogo                  { font-size: 1.95rem; font-family: 'Jua', sans-serif; }
.pageHome .gnbList > li > a          { font-size: 1.235rem; font-family: 'Jua', sans-serif; }
.pageHome .gnbCta                    { font-size: 1.144rem !important; font-family: 'Jua', sans-serif; }
.pageHome .mobileMenu li a           { font-size: 1.3rem; font-family: 'Jua', sans-serif; }
.homePage .heroBadge                 { font-size: 1.456rem; }
.homePage .heroTitle                 { font-size: 5.46rem; }
.homePage .heroDesc                  { font-size: 1.911rem; }
.homePage .btnPrimary                { font-size: 1.729rem; }
.homePage .btnOutline                { font-size: 1.729rem; }
.homePage .sectionEyebrow            { font-size: 1.365rem; }
.homePage .sectionTitle h2           { font-size: 3.64rem; }
.homePage .sectionTitle p            { font-size: 1.456rem; }
.homePage .philosophyIcon            { font-size: 2.34rem; }
.homePage .philosophyCard h3         { font-size: 1.69rem; }
.homePage .philosophyCard p          { font-size: 1.365rem; }
.homePage .metaChip                  { font-size: 1.365rem; }
.homePage .metaChipLabel             { font-size: 1.17rem; }
.homePage .pricingHeadRow .pricingCell,
.homePage .hotelHeadRow .hotelCell   { font-size: 1.3rem; }
.homePage .pricingCell               { font-size: 1.365rem; }
.homePage .pricingPlan               { font-size: 1.43rem; }
.homePage .pricingBenefitHead        { font-size: 1.3rem; }
.homePage .pricingBenefitBody        { font-size: 1.3rem; }
.homePage .hotelRow:last-child .hotelCell { font-size: 1.69rem; }
.homePage .pickupFeeTitle            { font-size: 1.664rem; }
.homePage .pickupFeeItem             { font-size: 1.365rem; }
.homePage .hotelCardHeader h3        { font-size: 1.664rem; }
.homePage .hotelBadge                { font-size: 1.3rem; }
.homePage .hotelNote                 { font-size: 1.235rem; }
.homePage .scheduleTime              { font-size: 1.56rem; }
.homePage .scheduleBody strong       { font-size: 1.534rem; }
.homePage .scheduleBody p            { font-size: 1.3rem; }
.homePage .galleryLabel              { font-size: 1.235rem; }
.homePage .reviewStars               { font-size: 1.82rem; }
.homePage .reviewCard p              { font-size: 1.638rem; }
.homePage .reviewAvatar              { font-size: 1.3rem; }
.homePage .reviewAuthor strong       { font-size: 1.599rem; }
.homePage .reviewAuthor small        { font-size: 1.417rem; }
.homePage .locationInfo h2           { font-size: 2.6rem; }
.homePage .locationList li           { font-size: 1.456rem; }
.homePage .contactInput,
.homePage .contactSelect,
.homePage .contactTextarea           { font-size: 1.365rem; }
.homePage .contactSuccessIcon        { font-size: 3.25rem; }
.homePage .contactSuccessBox h3      { font-size: 1.82rem; }
.homePage .contactSuccessBox p       { font-size: 1.365rem; }
.homePage .faqHeader                 { font-size: 1.404rem; }
.homePage .faqArrow                  { font-size: 1.69rem; }
.homePage .faqBody p                 { font-size: 1.3rem; }
.homePage .footerLogo                { font-size: 2.548rem; }
.homePage .footerInfo p              { font-size: 1.547rem; }
.homePage .footerNav a               { font-size: 1.599rem; }
.homePage .footerCopy                { font-size: 1.495rem; }

@media (max-width: 900px) {
    .homePage .heroTitle              { font-size: 4.004rem; }
}
@media (max-width: 600px) {
    .homePage .heroTitle              { font-size: 2.73rem; }
    .homePage .sectionTitle h2        { font-size: 2.73rem; }
}

/* ------------------------------------------------------------------------------------------------
   반려견 등록 페이지 (welcomeReg.php)
-------------------------------------------------------------------------------------------------*/

.welcomeReg { background: #f4f4f4; color:#222; }

/* ── 카카오 주소 검색 UI ── */
.addrWrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

/* 1행: 우편번호(30%) + 기본주소(70%) */
.addrRow1 {
    display: flex;
    gap: 8px;
    align-items: center;
}

.addrZipGroup {
    flex: 0 0 30%;
    display: flex;
    gap: 4px;
    align-items: center;
    min-width: 0;
}

.addrZipGroup .regInput {
    flex: 1;
    min-width: 0;
}

.addrBase {
    flex: 1;
}

/* 2행: 상세주소 100% */
.addrDetail {
    width: 100%;
}

.btnAddrSearch {
    white-space: nowrap;
    background: #e07b54;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 1.2rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.2s;
    flex-shrink: 0;
}

.btnAddrSearch:hover { background: #c9643e; }

/* readonly 기본주소 필드 */
#address[readonly] {
    color: #555;
    background: transparent;
    cursor: default;
}

.regWrap { width: 100%; max-width: 680px; margin: 0 auto; background: #fff; border-radius: 12px; box-shadow: 0 4px 24px rgba(0,0,0,0.10); overflow: hidden; }

/* ── 헤더 ── */
.regHeader { display: flex; align-items: center; justify-content: space-between; padding: 20px 28px 16px; border-bottom: 2px solid #222; }
.regHeaderTitle { font-size: 2.0rem; font-weight: 900; letter-spacing: -0.5px; color: #111; }
.regHeaderLogo { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.regHeaderLogo img { width: 60px; height: 60px; object-fit: contain; }
.regHeaderLogoText { font-size: 0.7rem; font-weight: 700; color: #888; text-align: center; }

/* ================================================================
   div 기반 테이블 레이아웃
   .formTable > .formRow > .formCell > (.formLabel + .formField)
================================================================ */
.formTable { border-top: 1px solid #d0d0d0; }

.formRow { display: flex; justify-content: center; align-items: stretch; flex-flow:row; border-bottom: 1px solid #d0d0d0; width:100%; }
.formRow:last-child { border-bottom: none; }

.formCell { display: flex; flex: 1 1 auto; min-width: 0; }

.formCell + .formCell { border-left: 1px solid #d0d0d0; }

.formCell.type { width: 65%; }
.formCell.tel  { width: 35%; }


.formLabel { width: 85px; min-width: 85px; background: #f7f7f7; font-size: 1.3rem; font-weight: 700; color: #333; text-align: center; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; padding: 8px 6px; border-right: 1px solid #d0d0d0; flex-shrink: 0; line-height: 1.4; word-break: keep-all; }
/* small은 width:100%로 강제 줄바꿈, reqMark는 같은 행에 인라인 유지 */
.formLabel small { width: 100%; text-align: center; font-size: 1.0rem; font-weight: 400; color: #999; margin-top: 0; }
.reqMark { color: #e53935; font-weight: 700; margin-left: 2px; }

.formField { flex: 1; padding: 10px 12px; display: flex; align-items: center; min-width: 0; }

/* 견종/성별·체중/중성화 행 높이 통일 및 너비 비율 */
.formRow.midRow { min-height: 52px; max-height: 52px; overflow: visible; }
.formRow.midRow .formField { padding: 6px 12px; }
.formCell.cellWide   { width: 55%; }
.formCell.cellNarrow { width: 45%; }
.formCell.cellHalf   { width: 50%; }

.formField.fieldTop { align-items: flex-start; }




/* ── 입력 요소 공통 ── */
.regInput, .regSelect, .regTextarea { width: 100%; border: none; border-bottom: 1px solid #bbb; padding: 4px 2px; font-size: 1.2rem; font-family: inherit; color: #222; background: transparent; outline: none; transition: border-color 0.2s; }
.regInput:focus, .regSelect:focus, .regSelect:focus { border-bottom-color: #e07b54; }
.regTextarea { resize: none; height: 60px; border: 1px solid #ccc; border-radius: 6px; padding: 8px 10px; background: #fafafa; font-size: 1.2rem; line-height: 1.6; }
.regTextarea:focus { border-color: #e07b54; outline: none; }

/* ── 이름 행 (반려인 / 반려동물 나란히) ── */
.nameRow { display: flex; gap: 0; width: 100%; }
.nameItem { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nameItem + .nameItem { border-left: 1px solid #e8e8e8; padding-left: 12px; }
.nameItemLabel { font-size: 0.72rem; color: #aaa; margin-bottom: 2px; }

/* ── 견종 검색 드롭다운 ── */
.breedWrap { display: flex; align-items: center; gap: 8px; width: 100%; }
.breedSearchBox { flex: 1; position: relative; min-width: 0; }
.breedList { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #fff; border: 1px solid #d0d0d0; border-radius: 6px; max-height: 180px; overflow-y: auto; z-index: 200; list-style: none; padding: 4px 0; margin: 0; display: none; box-shadow: 0 4px 12px rgba(0,0,0,0.12); }
.breedList li { padding: 8px 12px; font-size: 0.88rem; cursor: pointer; color: #333; }
.breedList li:hover { background: #fff5f1; color: #e07b54; }
.breedDirectLabel { display: flex; align-items: center; gap: 4px; font-size: 0.85rem; white-space: nowrap; cursor: pointer; color: #555; flex-shrink: 0; }
.breedDirectLabel input[type="checkbox"] { accent-color: #e07b54; width: 14px; height: 14px; cursor: pointer; }
.breedDirectText { flex: 1; min-width: 0; }

/* ── 체중 단위 ── */
.unitWrap { display: flex; align-items: center; gap: 6px; width: 100%; }
.unitWrap .regInput { flex: 1; }
.unitLabel { font-size: 0.9rem; color: #666; white-space: nowrap; }

/* ── 생년월일 ── */
.birthWrap { display: flex; align-items: center; gap: 2px; flex-wrap: nowrap; width: 100%; }
.birthSelect { width: auto; flex: 1; min-width: 38px; max-width: 50px; padding: 4px 1px; }
.birthSep { font-size: 1.3rem; color: #555; white-space: nowrap; }
.birthAge { font-size: 1.3rem; font-weight: 700; color: #e07b54; white-space: nowrap; margin-left: 6px; }

/* ── 라디오 · 체크박스 그룹 ── */
.radioGroup, .checkGroup { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
.radioGroup label, .checkGroup label { display: flex; align-items: center; gap: 6px; font-size: 1.2rem; cursor: pointer; white-space: nowrap; }
.radioGroup input[type="radio"], .checkGroup input[type="checkbox"] { accent-color: #e07b54; width: 16px; height: 16px; cursor: pointer; flex-shrink: 0; }

/* ── 성별 기호 색상 ── */
.genderMale   { color: #2980b9; font-weight: 600; }
.genderFemale { color: #e05c8a; font-weight: 600; }
.genderMale   input[type="radio"] { accent-color: #2980b9; }
.genderFemale input[type="radio"] { accent-color: #e05c8a; }

/* 기타 텍스트 인라인 입력 */
.etcInput { border: none; border-bottom: 1px solid #bbb; width: 200px; font-size: 1.2rem; padding: 7px 4px; outline: none; font-family: inherit; transition: border-color 0.2s; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.etcInput:focus { border-bottom-color: #e07b54; }

/* ── 알림사항 ── */
.noticeSection { border-top: 2px solid #222; padding: 20px 28px; }
.noticeTitle { font-size: 1.6rem; font-weight: 800; margin-bottom: 14px; color: #111; }
.noticeSubTitle { font-size: 1.4rem; font-weight: 700; color: #444; margin: 14px 0 6px; }
.noticeList { list-style: none; padding: 0; margin: 0; }
.noticeList li { font-size: 1.2rem; color: #555; line-height: 1.75; padding-left: 16px; position: relative; margin-bottom: 4px; }

.noticeList li::before { content: attr(data-num)'.'; position: absolute; left: 0; color: #999; }

.agreeRow { display: flex; align-items: center; gap: 8px; margin-top: 18px; }
.agreeRow input[type="checkbox"] { width: 17px; height: 17px; accent-color: #e07b54; cursor: pointer; flex-shrink: 0; }
.agreeRow label { font-size: 1.2rem; font-weight: 700; color: #333; cursor: pointer; }

/* ── 개인정보 수집 동의 ── */
.privacySection { border-top: 1px solid #ddd; padding: 0 28px; }

.privacyHeader { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; cursor: pointer; user-select: none; }
.privacyHeader:hover .privacyTitle { color: #e07b54; }
.privacyTitle { font-size: 1.4rem; font-weight: 700; color: #333; }
.privacyArrow { font-size: 1.0rem; color: #aaa; transition: transform 0.2s; }

.privacyBody { max-height: 0; overflow: hidden; opacity: 0; transition: max-height 0.35s ease, opacity 0.25s ease; }
.privacyContent { background: #fafafa; border: 1px solid #e8e8e8; border-radius: 6px; padding: 16px; margin-bottom: 12px; font-size: 1.1rem; color: #555; line-height: 1.8; }
.privacyContent p { margin-bottom: 8px; }
.privacyContent p:last-child { margin-bottom: 0; }
.privacySubTitle { font-weight: 700; color: #333; margin-top: 12px !important; }
.privacyIndent { padding-left: 12px; }

.privacySection .agreeRow { padding-bottom: 16px; }

/* ── 서명 영역 ── */
.signSection { display: flex; align-items: flex-end;  justify-content: space-between; padding: 20px 28px 24px; border-top: 1px solid #ddd; flex-wrap: wrap; gap: 16px; }
.signBlock { display: flex; align-items: center; gap: 8px; font-size: 1.2rem; color: #333; }
.signLine { border-bottom: 1px solid #444; width: 100px; padding-bottom: 2px; font-size: 1.2rem; color: #bbb; text-align: center; }

/* 서명 클릭 트리거 (signLine 기본 스타일 덮어쓰기) */
.signLine.signTrigger {
    border-bottom: none;
    border: 1px dashed #aaa;
    border-radius: 4px;
    width: auto;
    min-width: 100px;
    min-height: 34px;
    padding: 4px 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fafafa;
}
.signLine.signTrigger:hover { background: #f0f0f0; }
.signPlaceholder { font-size: 1.1rem; color: #bbb; white-space: nowrap; }
.signPreviewImg  { max-height: 28px; max-width: 140px; display: block; }

/* ── 서명 모달 ── */
.signModal {
    display: none;
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    background: rgba(0,0,0,0.55);
    z-index: 2000;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.signModalInner {
    background: #fff;
    border-radius: 10px;
    padding: 24px 20px 20px;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.2);
}
.signModalTitle {
    font-size: 1.6rem;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 14px;
}
.signCanvas {
    display: block;
    width: 100%;
    height: 180px;
    border: 1.5px solid #ccc;
    border-radius: 6px;
    cursor: crosshair;
    touch-action: none;
    background: #fff;
}
.signModalBtns {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}
.signModalBtns button {
    padding: 8px 18px;
    border-radius: 6px;
    border: 1px solid #ccc;
    background: #f5f5f5;
    color: #333;
    cursor: pointer;
    font-size: 1.3rem;
    font-weight: 600;
    font-family: inherit;
}
.btnSignConfirm { background: #e07b54 !important; color: #fff !important; border-color: #e07b54 !important; }

.signDateWrap { display: flex; align-items: center; gap: 4px; font-size: 1.2rem; flex-wrap: wrap; }
.signDateInput { border: none; width: 44px; text-align: center; font-size: 1.2rem; font-family: inherit; outline: none; padding: 2px 0; }
.signYearInput { width: 52px; }

/* ── 브랜드 하단 ── */
.brandFooter { text-align: center; padding: 16px 0 24px; font-size: 2.2rem; font-weight: 900; letter-spacing: 3px; color: #222; border-top: 1px solid #eee; }

/* ── 제출 버튼 ── */
.submitSection { padding: 0 28px 32px; text-align: center; }
.btnSubmit { display: inline-block; background: #e07b54; color: #fff; font-size: 1rem; font-weight: 700; padding: 14px 60px; border-radius: 50px; border: none; cursor: pointer; transition: background 0.2s, transform 0.15s; font-family: inherit; }
.btnSubmit:hover { background: #c9643e; transform: translateY(-2px); }

@media screen and (max-width:768px) {

/* 모바일: 셀 세로 쌓기 허용 */
.formRow.firstLine { flex-flow:row wrap; }

/* 방문유형/연락처 각각 한 줄 전체 차지 */
.formCell.type { width: 100%; }
.formCell.tel  { width: 100%; }

/* 세로 쌓일 때 좌측 보더 대신 상단 보더로 구분 */
.formCell.tel { border-left: none; border-top: 1px solid #d0d0d0; }

/* 주소: 우편번호+검색(60%) → 기본주소(100%) → 상세주소(100%) */
.addrRow1 { flex-wrap: wrap; }
.addrZipGroup { flex: 0 0 60%; }
.addrBase { flex: 0 0 100%; }

.addrZipGroup { flex: 0 0 50%; }
.addrBase { flex: 0 0 100%; }

/* 견종/성별·체중/중성화: 세로 쌓기 허용 */
.formRow.midRow { flex-flow: row wrap; max-height: none; }
.formCell.cellWide   { width: 100%; }
.formCell.cellNarrow { width: 100%; border-left: none; border-top: 1px solid #d0d0d0; }
.formCell.cellHalf   { width: 100%; border-left: none; border-top: 1px solid #d0d0d0; }


/* ── welcomeReg 폰트 20% 확대 ── */
.welcomeReg .regHeaderTitle         { font-size: 2.4rem; }
.welcomeReg .formLabel              { font-size: 1.2rem; }
.welcomeReg .formLabel small        { font-size: 1.0rem; }
.welcomeReg .regInput,
.welcomeReg .regSelect              { font-size: 1.68rem; }
.welcomeReg .regTextarea            { font-size: 1.2rem; }
.welcomeReg .radioGroup label,
.welcomeReg .checkGroup label       { font-size: 1.4rem; }
.welcomeReg .nameItemLabel          { font-size: 0.86rem; }
.welcomeReg .unitLabel              { font-size: 1.08rem; }
.welcomeReg .birthSep               { font-size: 1.35rem; }
.welcomeReg .birthAge               { font-size: 1.35rem; }
.welcomeReg .etcInput               { font-size: 1.2rem; }
.welcomeReg .breedDirectLabel       { font-size: 1.02rem; }
.welcomeReg .breedList li           { font-size: 1.27rem; }
.welcomeReg .noticeTitle            { font-size: 1.92rem; }
.welcomeReg .noticeSubTitle         { font-size: 1.68rem; }
.welcomeReg .noticeList li          { font-size: 1.44rem; }
.welcomeReg .agreeRow label         { font-size: 1.44rem; }
.welcomeReg .signDateWrap,
.welcomeReg .signBlock,
.welcomeReg .signDateInput          { font-size: 1.44rem; }
.welcomeReg .brandFooter            { font-size: 2.64rem; }

/* 모바일: 셀이 100% 너비가 되므로 라벨 여유 확보 */
.welcomeReg .formLabel { width: 88px; min-width: 88px; font-size: 1.5rem; }
.welcomeReg .formLabel small { font-size: 1.2rem; }

}