@charset "utf-8";

body.syou-sub-page.syou-location-page #container.syou-sub {
    padding: 0;
}

body.syou-sub-page.syou-location-page .syou-sub__body:has(.syou-location) {
    padding: 0;
    background: #f3f3f3;
}

.syou-location {
    --loc-ink: #1a1a1a;
    --loc-sub: #555;
    --loc-line: #e8e8e8;
    --loc-accent: #a61b3b;
    --loc-gold: #b8956b;
    --loc-card: #fff;
    /* 좌측 패널 메뉴(.pc-sidebar__menu a)와 동일 */
    --loc-menu-text: var(--syou-frame-text, 1.8rem);
    --loc-sub-text: var(--syou-frame-caption, 1.6rem);
    --loc-detail-text: var(--syou-frame-caption, 1.6rem);
    --loc-tel-text: 2.2rem;
    color: var(--loc-ink);
    font-weight: 400;
    padding: 0 0 32px;
}

/* 클리닉명 · 주소 */
.syou-location__intro {
    margin: 0;
    padding: 22px var(--syou-frame-pad-x, 16px) 20px;
    background: var(--loc-card);
    text-align: center;
}

.syou-location__clinic-name {
    margin: 0 0 8px;
    font-size: var(--loc-menu-text);
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.02em;
}

.syou-location__intro .syou-location__address {
    margin: 0;
    font-size: var(--loc-detail-text);
    font-weight: 400;
    line-height: 1.55;
    color: var(--loc-sub);
}

/* 진료시간 */
.syou-location__section {
    margin: 0;
    padding: 20px var(--syou-frame-pad-x, 16px) 22px;
    background: var(--loc-card);
    border-top: 1px solid var(--loc-line);
}

/* 진료시간: 시계 SVG · 제목 텍스트 동일 높이 */
.syou-location__section--hours {
    --syou-loc-icon-col: 36px;
}

.syou-location__hours-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
}

.syou-location__hours-head-icon {
    flex: 0 0 var(--syou-loc-icon-col);
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    color: var(--loc-ink, #333);
    line-height: 0;
}

.syou-location__hours-head-title {
    margin: 0;
    font-size: var(--loc-menu-text);
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.02em;
}

.syou-location__hours-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 20px;
    margin: 0;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
    align-items: start;
}

.syou-location__hours-item {
    margin: 0;
    padding: 0;
}

.syou-location__hours-item dt,
.syou-location__hours-item dd {
    margin-left: 0;
}

.syou-location__hours-label {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0 0 4px;
    padding: 0;
    font-size: var(--loc-menu-text);
    font-weight: 400;
    line-height: 1.4;
    color: var(--loc-ink, #111);
}

.syou-location__hours-check {
    flex: 0 0 12px;
    width: 12px;
    height: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #111;
    line-height: 0;
}

.syou-location__hours-check .syou-location__svg--check {
    display: block;
    width: 12px !important;
    height: 12px !important;
    max-width: 12px;
    max-height: 12px;
}

.syou-location__hours-label-text {
    flex: 0 1 auto;
    min-width: 0;
}

.syou-location__hours-item dd {
    margin: 0;
    padding: 0 0 0 17px;
    font-size: var(--loc-sub-text);
    font-weight: 400;
    line-height: 1.45;
    color: var(--loc-sub);
}

/* 지도 · 맵 버튼 — 섹션/본문 좌우 패딩 상쇄 후 프레임 끝까지 */
html.syou-root body.syou-layout .mobile-frame__inner .syou-sec--location {
    padding-left: 0;
    padding-right: 0;
}

@media (max-width: 740px) {
    html.syou-root body.syou-layout.is-pc-shell:not(.syou-proportional-scale) .mobile-frame__inner .syou-sec--location {
        padding-left: 0;
        padding-right: 0;
    }
}

/* 지도 · 맵 버튼 — 프레임 좌우 끝까지 */
.syou-location__map,
.syou-location__map-links {
    margin: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.syou-location .root_daum_roughmap,
.syou-location .root_daum_roughmap_landing {
    margin: 0;
    padding: 0;
    width: 100% !important;
    max-width: none;
}

.syou-location .root_daum_roughmap .wrap_map,
.syou-location .root_daum_roughmap .map,
.syou-location__map iframe {
    display: block;
    margin: 0;
    padding: 0;
    width: 100% !important;
    max-width: none;
    border: 0;
}

.syou-location .syou-content__map {
    margin: 0;
    border-radius: 0;
    overflow: hidden;
    background: #e8e8e8;
}

.syou-location .root_daum_roughmap,
.syou-location .syou-kakao-map,
.syou-location .syou-location__map-frame {
    width: 100% !important;
    display: block;
    border: 0;
}

.syou-location .syou-kakao-map,
.syou-location .syou-location__map-frame {
    min-height: 280px;
    background: #e8e8e8;
}

.syou-location__map-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 280px;
    margin: 0;
    padding: 24px 16px;
    box-sizing: border-box;
    background: #e8e8e8;
    color: #666;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
}

.syou-location__map-links {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0;
    width: 100%;
}

.syou-location__map-btn {
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    line-height: 0;
    text-decoration: none;
    box-sizing: border-box;
    background: #fff;
    overflow: hidden;
}

.syou-location__map-btn--naver {
    border-right: 1px solid var(--loc-line, #e8e8e8);
}

.syou-location__map-btn--kakao {
    background: #fff;
}

.syou-location__map-btn-img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: top;
    object-fit: cover;
}

.syou-location__map-btn-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 8px;
    font-size: var(--syou-frame-meta, 1.4rem);
    font-weight: 400;
    line-height: 1.35;
    color: #333;
}

/* 네이버·카카오맵 버튼 ↔ 진료시간 사이 주소 */
.syou-location__map-address {
    margin: 0;
    padding: 18px var(--syou-frame-pad-x, 16px) 20px;
    background: var(--loc-card);
    border-top: 1px solid var(--loc-line);
}

.syou-location__map-address .syou-location__address {
    --syou-loc-address-icon: 32px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 10px;
    margin: 0;
    min-height: var(--syou-loc-address-icon);
    font-weight: 400;
    letter-spacing: -0.02em;
    color: var(--loc-sub);
    text-align: left;
    overflow: hidden;
}

.syou-location__address-icon {
    display: block;
    flex: 0 0 var(--syou-loc-address-icon, 32px);
    width: var(--syou-loc-address-icon, 32px);
    height: var(--syou-loc-address-icon, 32px);
    margin: 0;
    object-fit: contain;
    object-position: center;
}

.syou-location__map-address .syou-location__address-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    height: var(--syou-loc-address-icon, 32px);
    font-size: calc(var(--loc-detail-text, 1.6rem) - 1px);
    line-height: 1.2;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.syou-location__map-address .syou-location__address-text::-webkit-scrollbar {
    display: none;
}

.syou-location__contact {
    padding: 18px var(--syou-frame-pad-x, 16px);
    background: var(--loc-card);
    border-top: 1px solid var(--loc-line);
    text-align: center;
}

.syou-location__tel {
    margin: 0;
    font-size: var(--loc-tel-text);
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -0.02em;
}

.syou-location__tel a {
    color: var(--loc-ink);
    text-decoration: none;
}

/* 오시는길 헤더 */
.syou-location__hero {
    margin: 0;
    padding: 24px var(--syou-frame-pad-x, 16px) 16px;
    background: var(--loc-card);
    border-top: 8px solid #f3f3f3;
    text-align: center;
}

.syou-location__eyebrow {
    margin: 0 0 8px;
    font-size: var(--syou-frame-meta, 1.4rem);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.08em;
    color: var(--loc-accent);
    text-transform: uppercase;
}

.syou-location__title {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.04em;
}

.syou-location__hero-address {
    margin: 0;
    font-size: var(--syou-frame-caption, 1.6rem);
    font-weight: 400;
    line-height: 1.55;
    color: var(--loc-sub);
}

/* 교통 안내 (SVG 아이콘) */
.syou-location__access {
    margin: 0;
    padding: 0;
    list-style: none;
    background: var(--loc-card);
}

.syou-location__access-item {
    --syou-loc-access-icon: var(--syou-loc-icon-col, 36px);
    display: grid;
    grid-template-columns: var(--syou-loc-access-icon) 1fr;
    column-gap: 10px;
    row-gap: 8px;
    padding: 18px var(--syou-frame-pad-x, 16px);
    border-top: 1px solid var(--loc-line);
}

.syou-location__access-icon {
    grid-column: 1;
    grid-row: 1;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    align-self: center;
    width: var(--syou-loc-access-icon);
    overflow: visible;
    color: var(--loc-ink, #333);
    line-height: 0;
}

.syou-location__access-icon .syou-location__svg,
.syou-location__access-icon .syou-location__access-icon-img {
    display: block;
    width: var(--syou-loc-access-icon);
    height: var(--syou-loc-access-icon);
    flex-shrink: 0;
}

.syou-location__access-icon .syou-location__access-icon-img {
    box-sizing: border-box;
    padding: 2px;
    object-fit: contain;
    object-position: center;
}

/* bus-50.png 기준 시각 크기 — 지하철 원본이 작아 동일하게 맞춤 */
.syou-location__access-icon .syou-location__access-icon-img--subway {
    width: 50px;
    height: 50px;
    padding: 0;
}

.syou-location__access-icon .syou-location__access-icon-img--bus {
    width: 42.5px;
    height: 42.5px;
    padding: 0;
}

.syou-location__hours-head-icon .syou-location__svg {
    display: block;
    width: var(--syou-loc-icon-col, 36px);
    height: var(--syou-loc-icon-col, 36px);
    flex-shrink: 0;
}

.syou-location__access-title {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    align-self: center;
    font-size: var(--loc-menu-text);
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.02em;
}

.syou-location__access-detail {
    grid-column: 1 / -1;
    grid-row: 2;
    min-width: 0;
    padding-left: 0;
    margin-left: 0;
}

.syou-location__access-text {
    margin: 0;
    font-size: var(--loc-sub-text);
    font-weight: 400;
    line-height: 1.55;
    color: var(--loc-sub);
}

.syou-location__access-subtitle {
    margin: 0 0 10px;
    font-size: var(--loc-menu-text);
    font-weight: 400;
    line-height: 1.4;
    color: var(--loc-gold);
}

.syou-location__access-lines {
    margin: 0;
    padding: 0;
    list-style: none;
}

.syou-location__access-lines li {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    font-size: var(--loc-sub-text);
    font-weight: 400;
    line-height: 1.55;
    color: var(--loc-sub);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.syou-location__access-lines li::-webkit-scrollbar {
    display: none;
}

.syou-location__access-check {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 12px;
    height: 1.55em;
    margin-top: 0.05em;
}

.syou-location__access-check .syou-location__svg--check {
    display: block;
    width: 12px;
    height: 12px;
}

.syou-location__access-line-text {
    flex: 0 0 auto;
    min-width: min-content;
    white-space: nowrap;
}

.syou-location__access-lines li + li {
    margin-top: 6px;
}

.syou-location__access-lines strong {
    font-size: var(--loc-sub-text);
    font-weight: 400;
    color: var(--loc-ink);
}

/* 주차 안내 — 텍스트 영역 좌우 확장(폰트 변경 없음), 잘림 방지 */
.syou-location__access-item--parking .syou-location__access-detail {
    margin-left: -3px;
    margin-right: -1px;
    width: calc(100% + 4px);
    overflow: visible;
}

.syou-location__access-item--parking .syou-location__access-lines,
.syou-location__access-item--parking .syou-location__access-lines li {
    overflow: visible;
}

.syou-location__access-transit {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.syou-location__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: var(--syou-frame-meta, 1.4rem);
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    letter-spacing: -0.02em;
}

.syou-location__badge--line5 {
    background: #8b4cb8;
}

.syou-location__badge--bus {
    font-weight: 400;
}

.syou-location__badge--bus.syou-location__badge--gan {
    background: #3d6d9a;
}

.syou-location__badge--bus.syou-location__badge--ilban {
    background: #5cb85c;
}

.syou-location__badge--bus.syou-location__badge--jik {
    background: #c0392b;
}

.syou-location__badge--bus.syou-location__badge--jiseon {
    background: #27ae60;
}

.syou-location__badge--bus.syou-location__badge--maeul {
    background: #7cb342;
}

.syou-location__bus-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.syou-location__bus-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: var(--loc-sub-text);
    font-weight: 400;
    line-height: 1.5;
    color: var(--loc-sub);
}

.syou-location__bus-item + .syou-location__bus-item {
    margin-top: 8px;
}

.syou-location__bus-numbers {
    flex: 1 1 auto;
    min-width: 0;
}