.inner-section { padding: 56px 0 70px; }
.branch-lead { font-size: .95rem; color: #6b5b62; margin: 0 0 22px; }
.branch-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 40px; }
.branch-card { background: var(--wash); border: 1px solid #f2dfe8; border-radius: 14px; padding: 22px 20px 20px; position: relative; display: flex; flex-direction: column; transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease, background .2s ease; }
.branch-card:hover { background: #fff; border-color: var(--pink-light); box-shadow: 0 12px 26px rgba(176,53,121,.16); transform: translateY(-3px); }
.branch-card.branch-main { border-color: var(--pink-light); }
.branch-badge { position: absolute; top: 22px; right: 20px; background: var(--pink-pale); color: var(--pink-dark); font-size: .7rem; font-weight: 700; padding: 2px 9px; border-radius: 50px; }
.branch-card h3 { font-size: 1.12rem; font-weight: 800; color: #2a1f24; letter-spacing: -.02em; margin: 0 0 12px; word-break: keep-all; }
.branch-card.branch-main h3 { padding-right: 46px; }   /* 본사 배지 자리 확보 (배지 있는 카드만) */
.bc-tel { display: inline-flex; align-items: center; gap: 8px; font-size: 1.24rem; font-weight: 800; color: var(--pink); letter-spacing: -.01em; font-variant-numeric: tabular-nums; text-decoration: none; margin-bottom: 8px; align-self: flex-start; }
.bc-tel i { font-size: .82rem; color: #dda9be; }
.bc-tel:hover span { text-decoration: underline; text-underline-offset: 3px; }
.bc-addr { font-size: .85rem; line-height: 1.6; color: #857078; margin: 0 0 18px; }
.bc-map { display: inline-block; margin-left: 6px; color: var(--pink); font-weight: 700; text-decoration: none; white-space: nowrap; }
.bc-map:hover { text-decoration: underline; text-underline-offset: 3px; }
.bc-btns { display: flex; gap: 8px; margin-top: auto; }
.bc-btn { flex: 1; display: block; padding: 11px 8px; border-radius: 10px; background: #fff; border: 1.5px solid #e6b3c8; color: var(--pink-dark); font-size: .86rem; font-weight: 700; font-family: inherit; text-align: center; text-decoration: none; cursor: pointer; transition: all .2s; }
.bc-btn:hover { background: var(--pink); border-color: var(--pink); color: #fff; }
.bc-ghost { background: transparent; border-color: var(--border); color: var(--gray); }
.bc-ghost:hover { background: var(--pink-pale); border-color: var(--pink-light); color: var(--pink-dark); }
@media(max-width:1180px){ .branch-grid { grid-template-columns: repeat(3, 1fr); } }
@media(max-width:900px){ .branch-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:580px){
  .branch-grid { grid-template-columns: 1fr; gap: 10px; margin-bottom: 30px; }
  .branch-card { padding: 18px; }
  .branch-card h3 { font-size: 1.05rem; margin-bottom: 10px; }
  .bc-tel { font-size: 1.18rem; }
  .bc-addr { font-size: .83rem; margin-bottom: 14px; }
}

/* 지사 상세 */
.bd-top { display: grid; grid-template-columns: 220px 1fr; gap: 34px; align-items: start; margin-bottom: 42px; }
.bd-photo { text-align: center; }
.bd-photo img { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: var(--r-lg); display: block; }
.bd-photo-empty { width: 100%; aspect-ratio: 3/4; border-radius: var(--r-lg); background: var(--wash); border: 1px dashed var(--border-pink);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #cbb2bf; }
.bd-photo-empty i { font-size: 2.4rem; }
.bd-photo-empty span { font-size: .82rem; font-weight: 600; }
.bd-photo-cap { margin: 12px 0 0; font-size: .93rem; font-weight: 700; color: var(--title); letter-spacing: -.02em; }
.bd-greet h2, .bd-info h2, .bd-others h2 { font-size: 1.22rem; font-weight: 800; color: var(--dark); letter-spacing: -.025em; margin: 0 0 16px; }
.bd-greet p { font-size: .97rem; line-height: 1.95; color: var(--gray); margin: 0; max-width: 60ch; word-break: keep-all; }
.bd-sign { margin-top: 18px !important; font-weight: 700; color: var(--title); }

.bd-info { background: var(--wash); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 28px 30px; margin-bottom: 40px; }
.bd-dl { margin: 0 0 22px; }
.bd-row { display: grid; grid-template-columns: 92px 1fr; gap: 14px; padding: 11px 0; border-top: 1px solid var(--border); }
.bd-row:first-child { border-top: none; padding-top: 0; }
.bd-row dt { font-size: .88rem; font-weight: 700; color: var(--ink-3); }
.bd-row dd { margin: 0; font-size: .93rem; line-height: 1.65; color: var(--gray); word-break: keep-all; }
.bd-badge { background: var(--pink-pale); color: var(--pink-dark); font-size: .7rem; font-weight: 700; padding: 2px 9px; border-radius: 50px; margin-left: 4px; }
.bd-tel { font-size: 1.12rem; font-weight: 800; color: var(--pink); text-decoration: none; font-variant-numeric: tabular-nums; }
.bd-tel:hover { text-decoration: underline; text-underline-offset: 3px; }
.bd-acts { display: flex; gap: 10px; }
.bf-line { background: #fff; color: var(--pink-dark); border-color: #e6b3c8; }
.bf-line:hover { background: var(--pink); border-color: var(--pink); color: #fff; }

.bd-others { margin-bottom: 40px; }
.bd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bd-chip { display: inline-block; padding: 9px 16px; border-radius: var(--r-pill); background: #fff; border: 1px solid var(--border); color: var(--gray); font-size: .87rem; font-weight: 600; text-decoration: none; transition: all .2s; }
.bd-chip:hover { border-color: var(--pink-light); background: var(--pink-pale); color: var(--pink-dark); }
.bd-chip-all { border-color: var(--border-pink); color: var(--pink-dark); font-weight: 700; }
@media(max-width:820px){
  .bd-top { grid-template-columns: 1fr; gap: 22px; margin-bottom: 32px; }
  .bd-photo { max-width: 180px; }
  .bd-info { padding: 22px 20px; }
  .bd-row { grid-template-columns: 76px 1fr; gap: 10px; }
  .bd-acts { flex-direction: column; }
  .bd-acts .bf-btn { width: 100%; }
}

/* 하단 본사 안내 */
.branch-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px;
  background: #8f2f64; border-radius: var(--r-lg); padding: 28px 30px;
  box-shadow: 0 14px 32px rgba(143,47,100,.22); }
.branch-foot-txt { display: flex; flex-direction: column; gap: 5px; }
.branch-foot-txt strong { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; letter-spacing: -.02em; color: #fff; }
.branch-foot-txt span { font-size: .9rem; color: rgba(255,255,255,.85); }
.branch-foot-btns { display: flex; gap: 10px; flex-shrink: 0; }
.bf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 12px 20px; border-radius: 11px;
  font-size: .92rem; font-weight: 700; font-family: inherit; text-decoration: none; border: 1.5px solid transparent; cursor: pointer; white-space: nowrap; transition: all .2s; }
.bf-fill { background: #fff; color: #8f2f64; }
.bf-fill:hover { background: var(--pink-pale); }
.bf-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.65); }
.bf-ghost:hover { background: #fff; color: #8f2f64; border-color: #fff; }
@media(max-width:640px){
  .branch-foot { flex-direction: column; align-items: stretch; text-align: center; padding: 22px 20px; gap: 16px; }
  .branch-foot-btns { flex-direction: column; }
  .bf-btn { width: 100%; }
}

/* 지사 문의하기 모달 */
.branch-modal-box .hp-field { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); opacity: 0; pointer-events: none; }
.branch-modal-overlay { position: fixed; inset: 0; background: rgba(20,14,18,.55); z-index: 2000; display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility 0s linear .2s; }
.branch-modal-overlay.open { opacity: 1; visibility: visible; transition: opacity .22s ease, visibility 0s; }
.branch-modal-box { background: #fff; border-radius: 16px; width: 100%; max-width: 440px; max-height: 90vh; overflow-y: auto; overscroll-behavior: contain; padding: 32px; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.25); transform: translateY(16px) scale(.98); transition: transform .28s cubic-bezier(.2,.8,.3,1); }
.branch-modal-overlay.open .branch-modal-box { transform: none; }
@media (prefers-reduced-motion: reduce) { .branch-modal-overlay, .branch-modal-box { transition: none; } }
.branch-modal-box h3 { font-size: 1.15rem; font-weight: 700; color: var(--dark); margin-bottom: 20px; }
.branch-modal-box h3 span { color: var(--pink); }
.branch-modal-close { position: absolute; top: 16px; right: 16px; background: var(--wash); border: none; width: 32px; height: 32px; border-radius: 50%; color: var(--ink-3); cursor: pointer; transition: all .2s; }
.branch-modal-close:hover { background: var(--pink); color: #fff; }
.branch-modal-box .form-group { margin-bottom: 16px; }
.branch-modal-box label { display: block; font-size: .87rem; font-weight: 600; color: var(--gray); margin-bottom: 6px; }
.branch-modal-box .req { color: var(--pink); }
.branch-modal-box input, .branch-modal-box textarea { width: 100%; padding: 10px 14px; border: 1px solid var(--border); border-radius: 8px; font-size: .93rem; box-sizing: border-box; font-family: inherit; transition: border .2s; }
.branch-modal-box input:focus, .branch-modal-box textarea:focus { outline: none; border-color: var(--pink); }
/* 한 줄 칸은 높이를 고정해 브라우저마다 같게 (날짜 칸은 크롬·아이폰에서 저마다 높이가 달랐다) */
.branch-modal-box input:is([type="text"], [type="tel"], [type="date"]):not(.hp-field) { height: 40px; }
/* 아이폰 사파리는 날짜 칸을 자체 모양(회색 배경·가운데 정렬)으로 그리고, 비어 있으면 높이가 줄며
   폭이 창 밖으로 나가기도 한다 → 기본 모양을 걷어내고 다른 칸과 같은 폭·왼쪽 정렬로 */
.branch-modal-box input[type="date"] { -webkit-appearance: none; appearance: none; display: block; min-width: 0; max-width: 100%; background: #fff; text-align: left; }
.branch-modal-box input[type="date"]::-webkit-date-and-time-value { text-align: left; }
.branch-modal-box .bm-sub { font-weight: 400; color: var(--ink-3); }
.bm-choice { border: 0; padding: 0; margin: 0 0 16px; min-width: 0; }
.bm-choice legend { font-size: .87rem; font-weight: 600; color: var(--gray); margin-bottom: 6px; padding: 0; }
.bm-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.branch-modal-box .bm-pills label { position: relative; margin: 0; font-weight: 500; cursor: pointer; }
.branch-modal-box .bm-pills input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }
.bm-pills span { display: block; padding: 8px 14px; border: 1px solid var(--border); border-radius: var(--r-pill); font-size: .88rem; color: var(--gray); background: #fff; transition: border-color .15s, background .15s, color .15s; }
.bm-pills label:hover span { border-color: var(--pink-light); }
.bm-pills input:checked + span { border-color: var(--pink); background: var(--pink-pale); color: var(--pink-dark); font-weight: 700; }
.bm-pills input:focus-visible + span { outline: 2px solid var(--pink); outline-offset: 2px; }
.bm-agree { background: var(--wash); border-radius: 8px; padding: 12px 14px; margin-bottom: 14px; }
.branch-modal-box .bm-agree label { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; color: var(--dark); cursor: pointer; }
.branch-modal-box .bm-agree input { width: auto; padding: 0; margin: 0; flex: none; accent-color: var(--pink); }
.bm-agree p { font-size: .78rem; line-height: 1.6; color: var(--ink-3); margin: 0; word-break: keep-all; }
.bm-agree a { color: var(--pink); }
.branch-modal-msg { font-size: .85rem; color: #dc3545; margin-bottom: 10px; min-height: 1em; }
.branch-modal-submit { width: 100%; padding: 13px; background: var(--pink); color: #fff; border: none; border-radius: 8px; font-size: .95rem; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; transition: background .2s; }
.branch-modal-submit:hover { background: var(--pink-dark); }
.branch-modal-submit:disabled { background: #ddd; cursor: not-allowed; }
.branch-modal-success { text-align: center; padding: 20px 0; font-size: .95rem; color: var(--dark); line-height: 1.8; }
.branch-modal-success i { font-size: 2.6rem; color: #28a745; display: block; margin-bottom: 14px; }
