.icon-btn{width: 44px;height: 44px;display: grid;place-items: center;border-radius: var(--r);color: var(--ink-900);}.icon-btn:hover{background: var(--bg-2);}.btn{display: inline-flex;align-items: center;justify-content: center;gap: 6px;padding: 13px 18px;min-height: 44px;border-radius: var(--r);font-size: 14px;font-weight: 600;letter-spacing: -0.02em;text-decoration: none;}.btn:hover{text-decoration: none;}.btn--primary{background: var(--navy-900);color: #fff;font-weight: 700;box-shadow: var(--sh-1);}.btn--primary:hover{background: var(--navy-800);}.btn--line{background: #fff;border: 1px solid var(--navy-900);color: var(--navy-900);}.btn--line:hover{background: var(--navy-50);}.btn--block{width: 100%;}.dept-grid{display: flex;flex-wrap: wrap;gap: 7px;padding-bottom: 16px;}.dept-grid > li{flex: 1 1 calc((100% - 14px) / 3);min-width: calc((100% - 14px) / 3);list-style: none;}.dept-grid:has(> li:nth-child(1):last-child) > li{flex-basis: 100%;}.dept-grid:has(> li:nth-child(2):last-child) > li,.dept-grid:has(> li:nth-child(4):last-child) > li{flex-basis: calc((100% - 7px) / 2);min-width: calc((100% - 7px) / 2);}.dept-tile{display: flex;flex-direction: column;align-items: center;gap: 8px;padding: 14px 4px 12px;background: #fff;border: 1px solid var(--line);border-radius: var(--r);color: var(--ink-800);transition: border-color .18s ease,transform .18s ease,box-shadow .18s ease;}.dept-tile:hover{background: var(--bg-2);text-decoration: none;border-color: var(--navy-200);transform: translateY(-1px);box-shadow: var(--sh-1);}.dept-tile__icon{width: 28px;height: 28px;display: grid;place-items: center;color: var(--navy-700);}.dept-tile__name{font-size: 12px;font-weight: 600;letter-spacing: -0.025em;}.dept-tile__name{line-height: 1.35;text-align: center;word-break: keep-all;overflow-wrap: anywhere;text-wrap: balance;min-height: 2.7em;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.dept-tile--more{background: var(--bg-2);border-style: dashed;color: var(--ink-700);}.dept-tile--more:hover{background: #fff;border-style: solid;}.dept-tile--more .dept-tile__icon{color: var(--navy-700);}.dept-tile--more .dept-tile__name{color: var(--ink-700);}.symptom-chips{display: flex;flex-wrap: wrap;gap: 6px;padding-bottom: 18px;}.chip{display: inline-flex;align-items: center;padding: 10px 14px;border: 1px solid var(--line);background: #fff;border-radius: 999px;font-size: 13px;color: var(--ink-800);font-weight: 500;min-height: 44px;}.chip:hover{background: var(--bg-2);}.chip--on{background: var(--navy-900);border-color: var(--navy-900);color: #fff;}.doc-scroll{display: grid;grid-template-columns: 1fr;gap: 12px;padding: 0 0 18px;}.sec--doctor .doc-card{padding: 16px 14px;}.sec--doctor .doc-card__photo{width: 80px;height: 80px;margin: 0 auto 14px;font-size: 24px;}.sec--doctor .doc-card__name{font-size: 16px;text-align: center;}.sec--doctor .doc-card__role{font-size: 13px;text-align: center;}.sec--doctor .doc-card__tags{justify-content: center;max-height: 86px;}.sec--doctor.is-single .doc-scroll,.sec--doctor.is-few .doc-scroll{grid-template-columns: 1fr;padding: 0 0 4px;}.sec--doctor.is-single .doc-card{width: 100%;padding: 28px 20px;text-align: center;}.sec--doctor.is-single .doc-card__link{width: 100%;}.sec--doctor.is-single .doc-card__photo{width: 120px;height: 120px;margin: 0 auto 16px;font-size: 32px;}.sec--doctor.is-single .doc-card__name{font-size: 18px;}.sec--doctor.is-single .doc-card__role{font-size: 14px;margin-top: 4px;}.sec--doctor.is-single .doc-card__tags{justify-content: center;max-height: none;}.sec--doctor.is-many .doc-card{padding: 20px 16px;}.sec--doctor.is-many .doc-card__photo{width: 96px;height: 96px;margin: 0 auto 14px;}.sec--doctor.is-many .doc-card__name{font-size: 16px;}.sec--doctor.is-many .doc-card__role{font-size: 13px;margin-top: 4px;}.sec--doctor-archive .doc-card{padding: 20px 16px;text-align: center;}.sec--doctor-archive .doc-card__photo{width: 96px;height: 96px;margin: 0 auto 14px;}.sec--doctor-archive .doc-card__name{font-size: 16px;text-align: center;}.sec--doctor-archive .doc-card__role{font-size: 13px;text-align: center;margin-top: 4px;}.sec--doctor-archive .doc-card__tags{justify-content: center;}.doc-card{background: #fff;border: 1px solid var(--line);border-radius: var(--r-lg);padding: 14px;height: 100%;display: flex;flex-direction: column;transition: border-color .18s ease,transform .18s ease,box-shadow .18s ease;}.doc-card:hover{border-color: var(--navy-200);transform: translateY(-1px);box-shadow: var(--sh-1);}.doc-card__link{display: flex;flex-direction: column;flex: 1;color: inherit;}.doc-card__link:hover{text-decoration: none;}.doc-card__photo{width: 56px;height: 56px;margin-bottom: 12px;border-radius: 50%;background: var(--navy-50);border: 1px solid var(--navy-100);overflow: hidden;display: grid;place-items: center;color: var(--navy-700);font-weight: 700;font-size: 17px;}.doc-card__photo img{width: 100%;height: 100%;object-fit: cover;object-position: top;}.sec--doctor[data-doc-photo-ratio="3-4"] .doc-card__photo,.sec--doctor[data-doc-photo-ratio="4-5"] .doc-card__photo,.sec--doctor-archive[data-doc-photo-ratio="3-4"] .doc-card__photo,.sec--doctor-archive[data-doc-photo-ratio="4-5"] .doc-card__photo{width: 100% !important;height: auto !important;max-width: none !important;margin: 0 auto 14px;border-radius: 12px;}.sec--doctor[data-doc-photo-ratio="3-4"] .doc-card__photo,.sec--doctor-archive[data-doc-photo-ratio="3-4"] .doc-card__photo{aspect-ratio: 3 / 4;}.sec--doctor[data-doc-photo-ratio="4-5"] .doc-card__photo,.sec--doctor-archive[data-doc-photo-ratio="4-5"] .doc-card__photo{aspect-ratio: 4 / 5;}.sec--doctor.is-single[data-doc-photo-ratio="3-4"] .doc-card__photo,.sec--doctor.is-single[data-doc-photo-ratio="4-5"] .doc-card__photo{max-width: 360px !important;}.sec--doctor[data-doc-photo-ratio="auto"] .doc-card__photo,.sec--doctor-archive[data-doc-photo-ratio="auto"] .doc-card__photo{width: 100% !important;height: auto !important;max-width: 220px !important;aspect-ratio: auto !important;margin: 0 auto 14px;border-radius: 12px;background: #f5f6f8;overflow: hidden;}.sec--doctor[data-doc-photo-ratio="auto"] .doc-card__photo img,.sec--doctor-archive[data-doc-photo-ratio="auto"] .doc-card__photo img{width: 100%;height: auto;object-fit: contain;object-position: center top;display: block;}.sec--doctor.is-single[data-doc-photo-ratio="auto"] .doc-card__photo{max-width: 360px !important;}.sec--doctor.is-many[data-doc-photo-ratio="auto"] .doc-card__photo{max-width: 200px !important;}.sec--doctor .doc-card__photo img,.sec--doctor-archive .doc-card__photo img{object-position: center top;}.doc-card__name{font-size: 15px;font-weight: 700;letter-spacing: -0.02em;}.doc-card__role{font-size: 12px;color: var(--ink-500);margin-top: 3px;line-height: 1.4;min-height: 1.4em;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;}.doc-card__tags{display: flex;flex-wrap: wrap;gap: 4px;margin-top: auto;padding-top: 12px;max-height: 60px;overflow: hidden;align-content: flex-start;}.doc-card__tag{padding: 3px 7px;background: var(--navy-50);border-radius: 3px;font-size: 11px;line-height: 16px;color: var(--navy-700);font-weight: 600;max-width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}.column-list{display: flex;flex-direction: column;}.column-list__item{border-bottom: 1px solid var(--line-2);}.column-list__item:last-child{border-bottom: 0;}.column-list__link{display: flex;gap: 12px;padding: 14px 0;color: inherit;}.column-list__link:hover{text-decoration: none;}.column-list__thumb{width: 84px;height: 84px;flex-shrink: 0;background: var(--navy-50);border-radius: var(--r);overflow: hidden;position: relative;}.column-list__thumb img{width: 100%;height: 100%;object-fit: cover;}.column-list__body{flex: 1;min-width: 0;display: flex;flex-direction: column;gap: 4px;}.column-list__cat{font-size: 11px;color: var(--navy-700);font-weight: 600;}.column-list__title{font-size: 14px;font-weight: 600;letter-spacing: -0.025em;line-height: 1.4;color: var(--ink-900);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.column-list__meta{font-size: 11px;color: var(--ink-500);margin-top: auto;display: flex;gap: 8px;}.faq-list{border-top: 1px solid var(--line);margin-top: 4px;}.faq-item{border-bottom: 1px solid var(--line);}.faq-item__q{display: flex;align-items: flex-start;gap: 12px;padding: 16px 4px;width: 100%;text-align: left;font-size: 14px;font-weight: 600;color: var(--ink-900);letter-spacing: -0.02em;min-height: 44px;transition: color .16s ease;}.faq-item__q:hover{color: var(--navy-800);}.faq-item__mark{width: 22px;height: 22px;flex-shrink: 0;border-radius: var(--r-xs);background: var(--navy-900);color: #fff;display: grid;place-items: center;font-size: 12px;font-weight: 700;}.faq-item__qtext{flex: 1;line-height: 1.5;padding-top: 2px;}.faq-item__chev{flex-shrink: 0;margin-top: 4px;color: var(--ink-400);transition: transform .2s;}.faq-item[aria-expanded="true"] .faq-item__chev,.faq-item.is-open .faq-item__chev,.faq-item__q[aria-expanded="true"] .faq-item__chev{transform: rotate(180deg);}.faq-item__a{padding: 0 4px 18px 38px;font-size: 14px;color: var(--ink-700);line-height: 1.7;}.faq-item__a[hidden]{display: none;}.map-card{border: 1px solid var(--line);border-radius: var(--r-lg);overflow: hidden;margin-bottom: 18px;box-shadow: var(--sh-1);}.map-card__img{height: 180px;background: var(--bg-3);}.map-card__img img{width: 100%;height: 100%;object-fit: cover;}.map-card__info{padding: 14px 16px 16px;background: #fff;}.map-card__addr{display: flex;flex-direction: column;gap: 2px;margin-bottom: 12px;font-style: normal;}.map-card__addr strong{font-size: 14px;font-weight: 700;letter-spacing: -0.025em;display: inline-flex;align-items: center;gap: 6px;flex-wrap: wrap;}.map-card__addr span{font-size: 12px;color: var(--ink-500);}.map-card__postcode{font-size: 12px;font-weight: 500;color: var(--ink-500);}.map-card__postcode:empty{display: none;}.map-card__search-btn{display: inline-flex;align-items: center;justify-content: center;min-height: 36px;margin-top: 8px;padding: 8px 14px;border: 1px dashed var(--navy-700,#0A2540);border-radius: var(--r-md,8px);background: #fff;color: var(--navy-700,#0A2540);font: 600 13px/1 -apple-system,BlinkMacSystemFont,'Pretendard',system-ui,sans-serif;letter-spacing: -0.02em;cursor: pointer;}.map-card__search-btn:hover{background: var(--navy-50,#EEF3FA);}.map-card__search-btn svg{margin-right: 6px;}.map-card__meta{display: flex;flex-direction: column;gap: 7px;padding-top: 12px;border-top: 1px solid var(--line-2);}.map-card__meta div{font-size: 12px;color: var(--ink-700);display: flex;gap: 10px;}.map-card__meta dt{color: var(--ink-500);font-weight: 500;width: 44px;flex-shrink: 0;}@media (min-width: 1200px){.map-card__img{height: 260px;}}.map-dirs{display: grid;grid-template-columns: repeat(3,1fr);gap: 8px;margin: 10px 0 2px;}.map-dirs__btn{display: inline-flex;align-items: center;justify-content: center;min-height: 48px;padding: 8px;border-radius: 14px;background: #fff;text-decoration: none;transition: background .15s ease,box-shadow .15s ease;}.map-dirs__btn:hover{text-decoration: none;}.map-dirs__btn:focus-visible{outline: 2px solid var(--navy-900,#0A2540);outline-offset: 2px;}.map-dirs__icon{display: inline-flex;align-items: center;justify-content: center;width: 24px;height: 24px;flex-shrink: 0;}.map-dirs__icon svg{width: 100%;height: 100%;display: block;}.map-dirs__btn--naver:hover{background: #f1fbf6;}.map-dirs__btn--kakao:hover{background: #fffbe0;}.map-dirs__btn--google:hover{background: #f4f8ff;}.map-dirs__hint{margin-top: 8px;font-size: 11px;color: var(--ink-500);line-height: 1.5;}@media (min-width: 768px){.map-dirs__btn{min-height: 52px;border-radius: 16px;}.map-dirs__icon{width: 26px;height: 26px;}}.map-card__img--iframe{padding: 0;}.map-card__img iframe{width: 100%;height: 100%;border: 0;display: block;}.map-card__img--kakao{padding: 0;position: relative;}.sabana-kakao-map,.sabana-kakao-roadview{position: absolute;inset: 0;width: 100%;height: 100%;}.sabana-kakao-map[hidden],.sabana-kakao-roadview[hidden]{display: none;} /* [feat @yuri 2026-07-29] 카카오 SDK 실패 폴백 — 약도 이미지. 고정 높이 캔버스 박스를 풀고 이미지 비율대로. */ .sabana-kakao-fallback{width: 100%;} .sabana-kakao-fallback img{width: 100%;height: auto;display: block;object-fit: contain;} .map-card__img--kakao.is-fallback{height: auto;} .sabana-kakao-fallback[hidden]{display: none;}.kakao-map-typecontrol{position: absolute;top: 10px;right: 10px;z-index: 2;display: inline-flex;background: #fff;border-radius: 6px;box-shadow: 0 1px 3px rgba(0,0,0,0.18);overflow: hidden;}.kakao-map-typecontrol__btn{appearance: none;border: 0;background: #fff;color: var(--ink-700,#34495e);font: 600 12px/1 -apple-system,BlinkMacSystemFont,'Pretendard',system-ui,sans-serif;letter-spacing: -0.02em;padding: 8px 12px;cursor: pointer;min-height: 32px;}.kakao-map-typecontrol__btn + .kakao-map-typecontrol__btn{border-left: 1px solid var(--line,#e5e7eb);}.kakao-map-typecontrol__btn.is-active{background: var(--navy-700,#0A2540);color: #fff;} /* [fix @yuri 2026-07-29] display:inline-flex 가 UA [hidden] 스타일을 이겨 SDK 초기화 전에도 토글이 보이던 버그. */ .kakao-map-typecontrol[hidden]{display: none;}.hours-card{border: 1px solid var(--line);border-radius: var(--r-lg);background: #fff;padding: 14px 14px 16px;margin-bottom: 18px;box-shadow: var(--sh-1);}.hours-today{display: flex;align-items: center;gap: 8px;width: 100%;padding: 12px 14px;border: 0;border-radius: 10px;background: var(--navy-50,#EEF3FA);color: var(--ink-900,#0A2540);font-size: 14px;font-family: inherit;line-height: 1.3;text-align: left;cursor: pointer;-webkit-appearance: none;appearance: none;}.hours-today:focus-visible{outline: 2px solid var(--navy-700,#0A2540);outline-offset: 2px;}.hours-today__chevron{flex: 0 0 auto;width: 12px;height: 12px;margin-left: 4px;border-right: 2px solid currentColor;border-bottom: 2px solid currentColor;transform: translateY(-2px) rotate(45deg);transition: transform .18s ease;opacity: .7;}.hours-today[aria-expanded="true"] .hours-today__chevron{transform: translateY(2px) rotate(-135deg);}.hours-card__off-summary{margin: 8px 4px 0;padding: 0;font-size: 12.5px;line-height: 1.5;color: var(--ink-700);letter-spacing: -0.01em;display: flex;gap: 6px;align-items: baseline;flex-wrap: wrap;}.hours-card__off-summary-label{flex: 0 0 auto;font-weight: 700;color: #B42318;}.hours-card__off-summary-text{color: var(--ink-700);}.hours-card[data-expanded="true"] .hours-card__off-summary{display: none;}.hours-card__details[hidden]{display: none;}.hours-today__dot{flex: 0 0 auto;width: 8px;height: 8px;border-radius: 50%;background: #10B981;box-shadow: 0 0 0 3px rgba(16,185,129,.18);}.hours-today__status{font-weight: 700;letter-spacing: -0.01em;}.hours-today__time{margin-left: auto;font-weight: 700;font-variant-numeric: tabular-nums;letter-spacing: -0.01em;color: var(--navy-700,#0A2540);}.hours-today[data-state="closed"]{background: #FBEAEA;color: #6B1A14;}.hours-today[data-state="closed"] .hours-today__dot{background: #B42318;box-shadow: 0 0 0 3px rgba(180,35,24,.15);}.hours-today[data-state="closed"] .hours-today__time{color: #6B1A14;}.hours-today[data-state="undefined"]{background: var(--bg,#F7F9FC);color: var(--ink-700);}.hours-today[data-state="undefined"] .hours-today__dot{background: var(--ink-500);box-shadow: none;}.hours-summary{margin: 10px 2px 12px;font-size: 13px;line-height: 1.5;color: var(--ink-700);letter-spacing: -0.01em;word-break: keep-all;}.hours-mini{list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(7,1fr);gap: 4px;}.hours-mini__cell{display: flex;flex-direction: column;align-items: center;gap: 4px;padding: 8px 2px 9px;background: var(--bg,#F7F9FC);border: 1px solid transparent;border-radius: 8px;min-height: 56px;text-align: center;}.hours-mini__day{font-size: 11px;font-weight: 700;color: var(--ink-500);letter-spacing: -0.01em;}.hours-mini__val{font-size: 10px;font-weight: 600;line-height: 1.25;color: var(--ink-900,#0A2540);font-variant-numeric: tabular-nums;letter-spacing: -0.02em;white-space: normal;word-break: break-all;}.hours-mini__cell.is-today{background: var(--navy-700,#0A2540);border-color: var(--navy-700,#0A2540);box-shadow: 0 2px 8px rgba(10,37,64,.18);}.hours-mini__cell.is-today .hours-mini__day{color: #C7D2E0;}.hours-mini__cell.is-today .hours-mini__val{color: #fff;}.hours-mini__cell.is-closed{background: #FBEAEA;border-color: #F5D2D0;}.hours-mini__cell.is-closed .hours-mini__val{color: #B42318;}.hours-mini__cell.is-closed.is-today{background: #B42318;border-color: #B42318;}.hours-mini__cell.is-closed.is-today .hours-mini__val,.hours-mini__cell.is-closed.is-today .hours-mini__day{color: #fff;}.hours-mini__cell.is-empty .hours-mini__val{color: var(--ink-500);}.hours-meta{margin-top: 14px;padding-top: 12px;border-top: 1px solid var(--line-2);display: flex;flex-direction: column;gap: 8px;}.hours-meta div{display: flex;gap: 12px;font-size: 13px;color: var(--ink-700);}.hours-meta dt{color: var(--ink-500);font-weight: 500;min-width: 64px;flex-shrink: 0;}.hours-meta dd{margin: 0;}@media (min-width: 768px){.hours-card{padding: 18px 22px 20px;max-width: 720px;margin-inline: auto;}.hours-today{padding: 14px 18px;font-size: 15px;}.hours-summary{font-size: 14px;margin-top: 12px;}.hours-mini{gap: 6px;}.hours-mini__cell{padding: 10px 4px 12px;min-height: 64px;}.hours-mini__day{font-size: 12px;}.hours-mini__val{font-size: 12px;}}.hours-tabs{display: inline-flex;gap: 2px;padding: 4px;margin: 0 auto 14px;background: var(--bg,#F7F9FC);border: 1px solid var(--line);border-radius: 999px;max-width: 100%;}.hours-tabs__btn{-webkit-appearance: none;appearance: none;border: 0;background: transparent;color: var(--ink-700);font-family: inherit;font-size: 13px;font-weight: 600;letter-spacing: -0.01em;padding: 8px 18px;border-radius: 999px;cursor: pointer;transition: background .15s ease,color .15s ease;min-width: 80px;}.hours-tabs__btn:hover{color: var(--ink-900);}.hours-tabs__btn:focus-visible{outline: 2px solid var(--navy-700,#0A2540);outline-offset: 2px;}.hours-tabs__btn.is-active,.hours-tabs__btn[aria-selected="true"]{background: #fff;color: var(--navy-700,#0A2540);box-shadow: 0 1px 3px rgba(10,37,64,0.10);}@media (min-width: 768px){.hours-tabs__btn{font-size: 14px;padding: 9px 22px;min-width: 96px;}}[data-hours-panel]{margin: 0 auto;}[data-hours-panel][hidden]{display: none;}.hours-cards-4{display: grid;grid-template-columns: repeat(2,1fr);gap: 8px;margin: 18px 0 10px;max-width: 960px;margin-inline: auto;}.hours-card4{border: 1px solid var(--line);border-radius: var(--r-lg);background: #fff;padding: 12px 14px 10px;display: flex;flex-direction: column;gap: 6px;min-height: 116px;}.hours-card4.is-today{border-color: var(--navy-700,#0A2540);box-shadow: 0 0 0 2px rgba(10,37,64,0.06);}.hours-card4.is-closed{background: #FAFBFC;}.hours-card4__head{display: flex;justify-content: space-between;align-items: baseline;gap: 8px;}.hours-card4__tag{font-size: 11px;font-weight: 700;color: var(--ink-500);letter-spacing: 0.06em;text-transform: uppercase;font-variant-numeric: tabular-nums;}.hours-card4__label{font-size: 13px;font-weight: 700;color: var(--ink-900);display: inline-flex;align-items: baseline;gap: 6px;}.hours-card4__today{font-size: 10px;font-weight: 700;font-style: normal;color: #fff;background: var(--navy-700,#0A2540);border-radius: 999px;padding: 1px 6px;letter-spacing: 0;}.hours-card4__time{margin: 2px 0 0;display: flex;align-items: baseline;gap: 6px;font-variant-numeric: tabular-nums;letter-spacing: -0.02em;min-height: 26px;}.hours-card4__time-start,.hours-card4__time-end{font-size: 20px;font-weight: 700;color: var(--ink-900);}.hours-card4__time-dash{font-size: 16px;color: var(--ink-500);font-weight: 400;}.hours-card4__off{font-size: 18px;font-weight: 700;color: var(--ink-700);}.hours-card4__off--muted{color: var(--ink-500);font-weight: 500;}.hours-card4.is-closed .hours-card4__off{color: var(--ink-500);}.hours-card4__timeline{position: relative;height: 24px;margin: 2px 0 0;}.hours-card4__bar{position: absolute;top: 7px;height: 3px;background: var(--navy-700,#0A2540);border-radius: 2px;}.hours-card4.is-today .hours-card4__bar{background: #10B981;}.hours-card4__tick{position: absolute;bottom: 0;font-size: 10px;color: var(--ink-500);font-variant-numeric: tabular-nums;letter-spacing: 0;}.hours-card4__tick--0{left: 0;}.hours-card4__tick--6{left: 25%;transform: translateX(-50%);}.hours-card4__tick--12{left: 50%;transform: translateX(-50%);}.hours-card4__tick--18{left: 75%;transform: translateX(-50%);}.hours-card4__tick--24{right: 0;}.hours-card4__sub{margin: 0;font-size: 11.5px;color: var(--ink-500);line-height: 1.4;letter-spacing: -0.01em;}.hours-foot{display: flex;flex-wrap: wrap;align-items: baseline;gap: 6px 16px;margin: 10px auto 18px;max-width: 880px;padding: 0 4px;font-size: 13px;color: var(--ink-700);line-height: 1.6;}.hours-foot__item{display: inline-flex;align-items: baseline;gap: 6px;}.hours-foot__k{font-weight: 700;color: var(--ink-500);font-size: 12px;letter-spacing: -0.01em;}.hours-foot__v{color: var(--ink-900);font-variant-numeric: tabular-nums;font-weight: 600;}.hours-foot__sub{color: var(--ink-500);font-size: 12.5px;}.hours-foot__chip{margin-left: 2px;padding: 1px 7px;background: var(--navy-50,#EEF3FA);color: var(--navy-700,#0A2540);border-radius: 999px;font-size: 11px;font-weight: 700;letter-spacing: 0;}.hours-foot__item--holiday[data-soon="1"] .hours-foot__chip{background: #FBEAEA;color: #B42318;}.hours-edit{margin: 8px auto 18px;max-width: 880px;padding: 10px 14px;background: #FFFBEB;border: 1px dashed #FBBF24;border-radius: 10px;font-size: 13px;}.hours-edit > summary{cursor: pointer;font-weight: 700;color: #92400E;letter-spacing: -0.01em;}.hours-edit__grid{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 6px 16px;margin: 10px 0 0;}.hours-edit__row{display: flex;gap: 8px;min-width: 0;}.hours-edit__row dt{color: var(--ink-500);flex: 0 0 56px;}.hours-edit__row dd{margin: 0;min-width: 0;word-break: break-all;}.hours-edit__row--full{grid-column: 1 / -1;}.hours-cal{border: 1px solid var(--line);border-radius: var(--r-lg);background: #fff;padding: 14px 12px 18px;box-shadow: var(--sh-1);margin-bottom: 18px;}.hours-cal__head{display: flex;align-items: center;justify-content: space-between;gap: 6px;margin-bottom: 8px;}.hours-cal__title{margin: 0;font-size: 15px;font-weight: 700;color: var(--ink-900,#0A2540);letter-spacing: -0.01em;}.hours-cal__nav{appearance: none;-webkit-appearance: none;width: 36px;height: 36px;border: 1px solid var(--line);background: #fff;border-radius: 8px;font: 600 18px/1 inherit;color: var(--ink-700);cursor: pointer;display: inline-flex;align-items: center;justify-content: center;}.hours-cal__nav:hover:not(:disabled){border-color: var(--navy-200,#B5C7DE);color: var(--navy-700,#0A2540);}.hours-cal__nav:disabled{opacity: .35;cursor: not-allowed;}.hours-cal__legend{display: flex;gap: 12px;font-size: 11px;color: var(--ink-700);padding: 4px 2px 8px;}.hours-cal__legend span{display: inline-flex;align-items: center;gap: 4px;}.hours-cal__legend .hours-cal__mark{position: static;}.hours-cal__grid{width: 100%;border-collapse: collapse;table-layout: fixed;}.hours-cal__dow{font-size: 11px;font-weight: 600;color: var(--ink-700);padding: 6px 0 8px;text-align: center;letter-spacing: -0.01em;}.hours-cal__dow.is-sun{color: #B42318;}.hours-cal__dow.is-sat{color: var(--navy-700,#0A2540);}.hours-cal__cell{padding: 1px;vertical-align: top;text-align: center;}.hours-cal__cell.is-other{background: transparent;}.hours-cal__d-muted{display: inline-block;padding: 8px 0;font-size: 12px;color: var(--ink-700,#334155);font-variant-numeric: tabular-nums;}.hours-cal__btn{appearance: none;-webkit-appearance: none;background: var(--bg,#F7F9FC);border: 1px solid transparent;border-radius: 8px;width: 100%;padding: 6px 2px 7px;display: flex;flex-direction: column;align-items: center;justify-content: flex-start;gap: 2px;min-height: 44px;cursor: pointer;font: inherit;color: var(--ink-900,#0A2540);position: relative;}.hours-cal__btn:hover{border-color: var(--navy-200,#B5C7DE);}.hours-cal__btn:focus-visible{outline: 2px solid var(--navy-700,#0A2540);outline-offset: 2px;}.hours-cal__d{font-size: 13px;font-weight: 600;line-height: 1.1;font-variant-numeric: tabular-nums;}.hours-cal__cell.is-sun .hours-cal__d{color: #7F1D1D;}.hours-cal__cell.is-sat .hours-cal__d{color: var(--navy-700,#0A2540);}.hours-cal__cell.is-past .hours-cal__btn{background: #F1F5F9;}.hours-cal__mark{display: inline-block;width: 5px;height: 5px;border-radius: 50%;}.hours-cal__mark--open{background: #10B981;}.hours-cal__mark--off{background: #B42318;}.hours-cal__count{font-size: 10px;font-weight: 600;color: var(--navy-700,#0A2540);font-variant-numeric: tabular-nums;line-height: 1.1;}.hours-cal__cell.is-today .hours-cal__btn{background: var(--navy-50,#EEF3FA);border-color: var(--navy-200,#B5C7DE);}.hours-cal__cell.is-today .hours-cal__d{color: var(--navy-700,#0A2540);font-weight: 700;}.hours-cal__cell.is-selected .hours-cal__btn{background: var(--navy-700,#0A2540);border-color: var(--navy-700,#0A2540);box-shadow: 0 2px 8px rgba(10,37,64,.2);}.hours-cal__cell.is-selected .hours-cal__d,.hours-cal__cell.is-selected .hours-cal__count{color: #fff;}.hours-cal__cell.is-selected .hours-cal__mark--open{background: #34D399;}.hours-cal__cell.is-selected .hours-cal__mark--off{background: #FCA5A5;}.hours-cal__cell.is-holiday .hours-cal__btn{background: #FBEAEA;border-color: #F5D2D0;}.hours-cal__cell.is-holiday .hours-cal__d{color: #7F1D1D;}.hours-cal__cell.is-holiday.is-selected .hours-cal__btn{background: #B42318;border-color: #B42318;}.hours-cal__cell.is-holiday.is-selected .hours-cal__d{color: #fff;}.hours-cal__cell.is-holiday-partial .hours-cal__btn{background: #FFF6F5;border-color: #F5D2D0;}.hours-cal__cell.is-holiday-partial .hours-cal__d{color: #7F1D1D;}.hours-cal__cell.is-holiday-partial .hours-cal__count{color: var(--ink-700);}.hours-cal__cell.is-holiday-partial.is-selected .hours-cal__btn{background: #B42318;border-color: #B42318;}.hours-cal__cell.is-holiday-partial.is-selected .hours-cal__d,.hours-cal__cell.is-holiday-partial.is-selected .hours-cal__count{color: #fff;}.hours-cal__panel{margin-top: 14px;}.hours-cal__panel-date{font-size: 14px;font-weight: 700;color: var(--ink-900,#0A2540);margin: 0 0 10px;}.hours-cal__panel-empty{font-size: 14px;color: var(--ink-500);background: var(--bg,#F7F9FC);padding: 14px;border-radius: 10px;margin: 0;}.hours-cal__panel-notice{font-size: 14px;font-weight: 600;color: #B42318;background: #FFF6F5;padding: 12px 14px;border-radius: 10px;margin: 0 0 10px;}.hours-cal__panel-note{display: block;font-size: 13px;color: var(--ink-700);margin-top: 4px;}.hours-cal__docs{list-style: none;margin: 0;padding: 0;display: flex;flex-direction: column;gap: 8px;}.hours-doc{background: var(--bg,#F7F9FC);border-radius: 10px;}.hours-doc__link{display: flex;align-items: center;gap: 12px;padding: 10px 12px;color: inherit;text-decoration: none;min-height: 56px;}.hours-doc__link:hover{background: #EEF2F8;border-radius: 10px;}.hours-doc__photo{flex: 0 0 auto;width: 44px;height: 44px;border-radius: 50%;overflow: hidden;background: var(--navy-50,#EEF3FA);display: inline-flex;align-items: center;justify-content: center;}.hours-doc__photo img{width: 100%;height: 100%;object-fit: cover;display: block;}.hours-doc__photo-fallback{font-weight: 700;color: var(--navy-700,#0A2540);font-size: 16px;}.hours-doc__body{display: flex;flex-direction: column;gap: 2px;min-width: 0;}.hours-doc__name{font-size: 14px;font-weight: 700;color: var(--ink-900,#0A2540);}.hours-doc__pos{font-style: normal;font-size: 12px;color: var(--ink-500);font-weight: 500;margin-left: 4px;}.hours-doc__slots{font-size: 13px;font-variant-numeric: tabular-nums;color: var(--ink-700);}.hours-doc__note{font-size: 12px;color: var(--ink-500);}.hours-card__head{margin-bottom: 10px;}.hours-card__title{margin: 0;font-size: 14px;font-weight: 700;color: var(--ink-700);letter-spacing: -0.01em;}.hours-days{margin: 12px 0 0;padding: 0;display: flex;flex-direction: column;}.hours-days__row{display: flex;align-items: baseline;gap: 12px;padding: 10px 4px;border-bottom: 1px solid var(--line-2);}.hours-days__row:last-child{border-bottom: 0;}.hours-days__day{flex: 0 0 auto;min-width: 36px;font-weight: 700;color: var(--ink-900,#0A2540);font-size: 14px;letter-spacing: -0.01em;display: inline-flex;align-items: center;gap: 6px;}.hours-days__row.is-sun .hours-days__day{color: #B42318;}.hours-days__row.is-sat .hours-days__day{color: var(--navy-700,#0A2540);}.hours-days__chip{display: inline-block;font-size: 10px;font-weight: 700;padding: 2px 6px;border-radius: 999px;background: var(--navy-700,#0A2540);color: #fff;letter-spacing: -0.01em;}.hours-days__val{margin: 0;flex: 1;display: flex;align-items: baseline;justify-content: flex-end;flex-wrap: wrap;gap: 4px 10px;font-variant-numeric: tabular-nums;color: var(--ink-700);text-align: right;}.hours-days__time{font-size: 14px;font-weight: 600;color: var(--ink-900,#0A2540);letter-spacing: -0.01em;}.hours-days__row.is-today .hours-days__time{color: var(--navy-700,#0A2540);}.hours-days__row.is-closed .hours-days__time{color: #B42318;}.hours-days__row.is-empty .hours-days__time{color: var(--ink-500);}.hours-days__sub{font-size: 12px;color: var(--ink-500);font-weight: 500;}.hours-next-holiday{display: flex;align-items: center;gap: 8px;margin: 12px 0 0;padding: 10px 14px;background: var(--bg,#F7F9FC);border-radius: 10px;font-size: 13px;color: var(--ink-700);flex-wrap: wrap;}.hours-next-holiday__dot{flex: 0 0 auto;width: 6px;height: 6px;border-radius: 50%;background: var(--ink-500);}.hours-next-holiday[data-soon="1"]{background: #FBEAEA;color: #6B1A14;}.hours-next-holiday[data-soon="1"] .hours-next-holiday__dot{background: #B42318;box-shadow: 0 0 0 3px rgba(180,35,24,.15);}.hours-next-holiday__label{color: var(--ink-500);font-weight: 600;}.hours-next-holiday[data-soon="1"] .hours-next-holiday__label{color: #B42318;}.hours-next-holiday__date{font-weight: 700;color: var(--ink-900,#0A2540);font-variant-numeric: tabular-nums;}.hours-next-holiday[data-soon="1"] .hours-next-holiday__date{color: #B42318;}.hours-next-holiday__note{color: inherit;}.hours-next-holiday__suffix{margin-left: auto;font-size: 11px;font-weight: 700;padding: 2px 8px;border-radius: 999px;background: rgba(255,255,255,.6);color: #6B1A14;}.hours-next-holiday[data-soon="0"] .hours-next-holiday__suffix{display: none;}.hours-holidays{margin-top: 14px;padding-top: 12px;border-top: 1px solid var(--line-2);}.hours-holidays__title{margin: 0 0 8px;font-size: 13px;font-weight: 700;color: var(--ink-700);letter-spacing: -0.01em;}.hours-holidays__list{list-style: none;margin: 0;padding: 0;display: flex;flex-direction: column;gap: 6px;}.hours-holidays__item{display: flex;align-items: baseline;gap: 10px;padding: 8px 10px;background: var(--bg,#F7F9FC);border-radius: 8px;font-size: 13px;color: var(--ink-700);line-height: 1.4;}.hours-holidays__date{flex: 0 0 auto;font-weight: 700;color: var(--ink-900,#0A2540);font-variant-numeric: tabular-nums;letter-spacing: -0.01em;min-width: 64px;}.hours-holidays__dow{font-style: normal;font-weight: 500;color: var(--ink-500);margin-left: 2px;}.hours-holidays__note{flex: 1;color: var(--ink-700);}.hours-holidays__tag{flex: 0 0 auto;font-size: 11px;font-weight: 700;padding: 2px 8px;border-radius: 999px;background: #FBEAEA;color: #B42318;letter-spacing: -0.01em;}.hours-doctors{border: 1px solid var(--line);border-radius: var(--r-lg);background: #fff;padding: 14px 14px 16px;margin-bottom: 18px;box-shadow: var(--sh-1);}.hours-doctors__head{margin-bottom: 10px;}.hours-doctors__title{margin: 0;font-size: 14px;font-weight: 700;color: var(--ink-700);letter-spacing: -0.01em;}.hours-doctors__scroll{overflow-x: auto;-webkit-overflow-scrolling: touch;margin: 0 -4px;}.hours-doctors__table{width: 100%;min-width: 580px;border-collapse: separate;border-spacing: 0;table-layout: fixed;}.hours-doctors__table th,.hours-doctors__table td{padding: 8px 4px;text-align: center;font-size: 11px;border-bottom: 1px solid var(--line-2);}.hours-doctors__th{font-weight: 700;color: var(--ink-500);background: var(--bg,#F7F9FC);font-size: 12px;}.hours-doctors__th.is-sun{color: #B42318;}.hours-doctors__th.is-sat{color: var(--navy-700,#0A2540);}.hours-doctors__th-doc{width: 18%;background: var(--bg,#F7F9FC);}.hours-doctors__doc{text-align: left;padding-left: 10px;padding-right: 6px;font-weight: 700;}.hours-doctors__doc-link{display: inline-flex;align-items: center;gap: 8px;color: var(--ink-900,#0A2540);text-decoration: none;min-height: 36px;}.hours-doctors__doc-link:hover{color: var(--navy-700,#0A2540);}.hours-doctors__doc-photo{flex: 0 0 40px;width: 40px;height: 40px;aspect-ratio: 1 / 1;border-radius: 50%;overflow: hidden;background: var(--navy-50,#EEF3FA);display: block;line-height: 0;}.hours-doctors__doc-photo img{width: 40px;height: 40px;max-width: none;object-fit: cover;object-position: center 20%;display: block;}.hours-doctors__doc-name{display: inline-flex;flex-direction: column;gap: 1px;font-size: 13px;font-weight: 700;line-height: 1.2;text-align: left;}.hours-doctors__doc-pos{font-style: normal;font-size: 10px;font-weight: 500;color: var(--ink-500);}.hours-doctors__td{color: var(--ink-900,#0A2540);font-variant-numeric: tabular-nums;font-weight: 600;}.hours-doctors__td.is-sun{background: rgba(180,35,24,.03);}.hours-doctors__td.is-sat{background: rgba(10,37,64,.03);}.hours-doctors__td.is-off{color: var(--ink-500);}.hours-doctors__slot{display: block;line-height: 1.35;white-space: nowrap;}.hours-doctors__off{color: var(--ink-500);}.hours-doctors__slot-note{display: inline-block;margin-top: 4px;font-size: 10px;font-weight: 600;padding: 2px 6px;background: var(--navy-50,#EEF3FA);color: var(--navy-700,#0A2540);line-height: 1.3;white-space: nowrap;}.sec--doctor-schedule .doc-schedule-table th.is-sun{color: #B42318;}.sec--doctor-schedule .doc-schedule-table th.is-sat{color: var(--navy-700,#0A2540);}.sec--doctor-schedule .doc-schedule-table__note-row td{background: var(--bg,#F7F9FC);padding: 4px 4px 10px;}.sec--doctor-schedule .doc-schedule-table__note{display: inline-block;font-size: 11px;font-weight: 600;padding: 2px 6px;border-radius: 4px;background: #fff;color: var(--navy-700,#0A2540);border: 1px solid var(--navy-100,#DDE7F2);}@media (min-width: 768px){.hours-doctors{padding: 18px 22px 22px;max-width: 720px;margin-inline: auto;}.hours-doctors__table{min-width: 0;}.hours-doctors__table th,.hours-doctors__table td{font-size: 13px;padding: 10px 6px;}.hours-doctors__doc-name{font-size: 14px;}.hours-days__day{font-size: 15px;}.hours-days__time{font-size: 15px;}}@media (min-width: 768px){.hours-cal{padding: 20px 22px 22px;max-width: 720px;margin-inline: auto;}.hours-cal__title{font-size: 17px;}.hours-cal__dow{font-size: 12px;padding: 8px 0 10px;}.hours-cal__btn{padding: 8px 4px 9px;min-height: 60px;}.hours-cal__d{font-size: 14px;}.hours-cal__count{font-size: 11px;}}.sec--doctor-schedule .doc-schedule-table{width: 100%;border-collapse: separate;border-spacing: 0;margin: 14px 0 0;font-size: 13px;table-layout: fixed;}.sec--doctor-schedule .doc-schedule-table th,.sec--doctor-schedule .doc-schedule-table td{padding: 10px 4px;text-align: center;border-bottom: 1px solid var(--line-2);}.sec--doctor-schedule .doc-schedule-table th{font-weight: 600;color: var(--ink-500);background: var(--bg,#F7F9FC);}.sec--doctor-schedule .doc-schedule-table td.is-off{color: var(--ink-500);}.sec--doctor-schedule .doc-schedule-table__slot{display: block;font-variant-numeric: tabular-nums;color: var(--ink-900,#0A2540);font-weight: 600;line-height: 1.5;}.sec--doctor-schedule .doc-schedule-table__off{color: var(--ink-500);}.doc-schedule-exceptions__title{margin: 18px 0 8px;font-size: 14px;font-weight: 700;color: var(--ink-900,#0A2540);}.doc-schedule-exceptions{list-style: none;margin: 0;padding: 0;display: flex;flex-direction: column;gap: 6px;}.doc-schedule-exceptions__item{display: flex;flex-wrap: wrap;align-items: baseline;gap: 8px;padding: 10px 0;border-bottom: 1px solid var(--line);font-size: 13px;}.doc-schedule-exceptions__item:last-child{border-bottom: 0;}.doc-schedule-exceptions__date{font-weight: 700;color: var(--ink-900,#0A2540);font-variant-numeric: tabular-nums;}.doc-schedule-exceptions__status{color: var(--ink-700);font-weight: 600;}.doc-schedule-exceptions__item.is-off .doc-schedule-exceptions__status,.doc-schedule-exceptions__item.is-clinic_off .doc-schedule-exceptions__status{color: #B42318;}.doc-schedule-exceptions__item.is-custom .doc-schedule-exceptions__status{color: var(--navy-700,#0A2540);}.doc-schedule-exceptions__note{color: var(--ink-500);font-size: 12px;}.cta-block{background: var(--navy-50);border: 1px solid var(--navy-100);border-radius: var(--r-lg);padding: 22px 18px;margin: 4px 0 18px;width: 100%;max-width: 980px;margin-inline: auto;box-shadow: var(--sh-1);}.cta-block__title{font-size: 18px;font-weight: 700;letter-spacing: -0.025em;}.cta-block__sub{font-size: 13px;color: var(--ink-700);margin-top: 6px;line-height: 1.6;}.cta-block__actions{display: flex;flex-direction: column;gap: 8px;margin-top: 14px;}.empty{padding: 40px 16px;text-align: center;color: var(--ink-500);font-size: 13px;}.search-form-wrap{margin: 0 auto 24px;max-width: 620px;}.search-form-wrap .search-help__title{margin: 0 0 10px;font-size: 14px;font-weight: 600;color: var(--ink-700);}.sabana-searchform{display: flex;gap: 6px;align-items: stretch;border: 1px solid var(--line);border-radius: var(--r);background: #fff;padding: 4px;box-shadow: var(--sh-1);}.sabana-searchform__input{flex: 1 1 auto;min-width: 0;height: 44px;padding: 0 12px;border: 0;background: transparent;font-size: 16px;color: var(--ink-900);letter-spacing: -0.012em;}.sabana-searchform__input:focus{outline: 0;}.sabana-searchform:focus-within{outline: 2px solid var(--navy-700);outline-offset: 2px;}.sabana-searchform__input::placeholder{color: var(--ink-400);}.sabana-searchform__submit{display: inline-flex;align-items: center;gap: 6px;height: 44px;padding: 0 16px;background: var(--navy-900);color: #fff;border: 0;border-radius: var(--r-sm);font-size: 14px;font-weight: 700;cursor: pointer;}.sabana-searchform__submit:hover{background: var(--navy-800);}.search-help{margin: 8px auto 28px;max-width: 720px;}.search-help__title{margin: 0 0 12px;font-size: 15px;font-weight: 700;color: var(--ink-900);letter-spacing: -0.02em;text-align: center;}.search-help__list{list-style: none;margin: 0;padding: 0;display: flex;flex-wrap: wrap;gap: 8px;justify-content: center;}.search-help__link{display: inline-block;padding: 8px 14px;border: 1px solid var(--line);border-radius: 99px;background: var(--bg-2);color: var(--ink-800);font-size: 13px;font-weight: 600;}.search-help__link:hover{background: var(--navy-50);border-color: var(--navy-200);text-decoration: none;}.search-recent{margin-top: 28px;}.search-recent__title{margin: 0 0 14px;font-size: 15px;font-weight: 700;color: var(--ink-900);letter-spacing: -0.02em;}.empty--404{padding: 48px 16px 24px;}.sec--404__code{font-size: 48px;font-weight: 800;letter-spacing: -0.03em;color: var(--navy-900);margin: 0 0 8px;}.sec--404__msg{margin: 0 0 4px;font-size: 16px;color: var(--ink-900);font-weight: 600;}.sec--404__sub{margin: 0 0 18px;font-size: 13px;color: var(--ink-500);}.sec--404__actions{display: flex;justify-content: center;gap: 8px;}@media (min-width: 768px){.sec--404__code{font-size: 64px;}.sec--404__msg{font-size: 18px;}}.archive-head{padding: 4px 0 20px;}.archive-head__title{font-size: 22px;font-weight: 700;letter-spacing: -0.03em;}.archive-head__desc{font-size: 13px;color: var(--ink-700);margin-top: 8px;line-height: 1.6;}.post-tags{max-width: var(--container);margin: 0 auto;padding: 0 18px 24px;font-size: 12px;color: var(--ink-500);}.post-tags__label{font-weight: 600;margin-right: 6px;color: var(--ink-700);}.post-tags a{display: inline-block;padding: 3px 8px;margin: 0 4px 4px 0;background: var(--bg-2);border-radius: var(--r-xs);color: var(--ink-700);}.doc-grid{display: grid;grid-template-columns: 1fr;gap: 12px;padding: 18px 0;}.treatment-grid{display: grid;grid-template-columns: 1fr;gap: 10px;padding: 18px 0;}.treatment-card{display: block;padding: 16px;background: #fff;border: 1px solid var(--line);border-radius: var(--r-lg);color: inherit;}.treatment-card:hover{background: var(--bg-2);text-decoration: none;}.treatment-card__icon{display: inline-grid;place-items: center;width: 32px;height: 32px;background: var(--navy-50);border-radius: var(--r);color: var(--navy-700);margin-bottom: 10px;}.treatment-card__name{font-size: 15px;font-weight: 700;letter-spacing: -0.02em;}.treatment-card__summary{font-size: 13px;color: var(--ink-700);margin-top: 6px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.treatment-card__meta{font-size: 11px;color: var(--ink-500);margin-top: 8px;}.doc-chips{display: flex;flex-wrap: wrap;gap: 6px;margin-top: 12px;}.doc-chips__item{padding: 4px 10px;background: var(--navy-50);color: var(--navy-700);font-size: 12px;font-weight: 600;border-radius: 99px;}.doc-chips__item a{color: inherit;}.doc-widoks-badge{margin-top: 12px;font-size: 13px;line-height: 1.4;}.doc-widoks-badge__link{display: inline-flex;align-items: center;gap: 6px;padding: 6px 12px;border-radius: 999px;background: var(--navy-50);color: var(--navy-700);font-weight: 600;text-decoration: none;transition: background-color 0.15s;}.doc-widoks-badge__link:hover{background: var(--navy-100,#DBE3EE);}.doc-widoks-badge__sep{opacity: 0.5;}.doc-widoks-badge__count{font-weight: 700;}.sec--doctor-widoks .sec__head{margin-bottom: 16px;}.sec--doctor-widoks .sec__sub{margin-top: 4px;font-size: 13px;color: var(--ink-600,#475569);}.widoks-list{display: flex;flex-direction: column;gap: 10px;margin: 0;padding: 0;list-style: none;}.widoks-list__item{margin: 0;}.widoks-list__link{display: flex;flex-direction: column;gap: 6px;padding: 14px 16px;background: #FFFFFF;border: 1px solid var(--ink-200,#E2E8F0);border-radius: 8px;color: inherit;text-decoration: none;transition: border-color 0.15s,background-color 0.15s;min-height: 44px;}.widoks-list__link:hover,.widoks-list__link:focus-visible{border-color: var(--navy-300,#94A3B8);background: #F8FAFC;}.widoks-list__head{display: flex;align-items: baseline;gap: 8px;flex-wrap: wrap;}.widoks-list__chip{flex: 0 0 auto;padding: 2px 8px;border-radius: 4px;font-size: 11px;font-weight: 700;letter-spacing: 0.02em;background: var(--navy-50);color: var(--navy-700);}.widoks-list__chip--health{background: var(--ink-100,#F1F5F9);color: var(--ink-700,#334155);}.widoks-list__title{font-size: 15px;font-weight: 600;color: var(--ink-900,#0F172A);line-height: 1.45;}.widoks-list__excerpt{font-size: 13px;color: var(--ink-600,#475569);line-height: 1.55;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.widoks-list__date{font-size: 12px;color: var(--ink-500,#64748B);}.widoks-list__more{margin-top: 14px;text-align: right;}.widoks-list__more-link{display: inline-block;font-size: 14px;font-weight: 600;color: var(--navy-700);text-decoration: none;padding: 8px 4px;min-height: 32px;}.widoks-list__more-link:hover{text-decoration: underline;}@media (min-width: 768px){.widoks-list__link{padding: 16px 20px;}.widoks-list__title{font-size: 16px;}}.bio-list{display: flex;flex-direction: column;gap: 8px;padding: 12px 0 8px;}.bio-list__item{position: relative;padding-left: 14px;font-size: 14px;color: var(--ink-800);line-height: 1.6;}.bio-list__item::before{content: "";position: absolute;left: 2px;top: 11px;width: 4px;height: 4px;border-radius: 50%;background: var(--navy-700);}.treatment-meta{display: grid;grid-template-columns: 1fr;gap: 0;margin: 18px auto 24px;border-top: 1px solid var(--line);border-bottom: 1px solid var(--line);}.treatment-meta__row{display: grid;grid-template-columns: 100px 1fr;padding: 10px 0;border-bottom: 1px solid var(--line-2);font-size: 14px;}.treatment-meta__row:last-child{border-bottom: 0;}.treatment-meta__row dt{color: var(--ink-500);font-weight: 600;}.treatment-meta__row dd{color: var(--ink-900);margin: 0;}.relation-list{display: flex;flex-wrap: wrap;gap: 6px;padding: 6px 0 4px;}.relation-list__item a{display: inline-block;padding: 6px 12px;background: #fff;border: 1px solid var(--line);border-radius: var(--r);font-size: 13px;font-weight: 600;color: var(--navy-700);}.relation-list__item a:hover{background: var(--navy-50);text-decoration: none;border-color: var(--navy-100);}.archive-empty{padding: 32px 16px;text-align: center;color: var(--ink-500);font-size: 14px;}.site-user{position: relative;}.site-user__btn{display: inline-flex;align-items: center;gap: 6px;padding: 6px 10px;height: 34px;border: 1px solid var(--line,#E6E8EC);border-radius: 99px;background: #fff;color: var(--navy-900,#0A2540);font-size: 12px;font-weight: 700;letter-spacing: -0.02em;cursor: pointer;list-style: none;}.site-user__btn::-webkit-details-marker{display: none;}.site-user__btn::marker{content: '';}.site-user__name{max-width: 72px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}@media (min-width: 481px){.site-user__name{max-width: 96px;}}.site-user[open] .site-user__btn{background: var(--navy-900,#0A2540);color: #fff;border-color: var(--navy-900,#0A2540);}.site-user__menu{position: absolute;top: calc(100% + 6px);right: 0;min-width: 180px;background: #fff;border: 1px solid var(--line,#E6E8EC);border-radius: 8px;box-shadow: 0 8px 24px rgba(15,23,42,.12);padding: 6px 0;z-index: 50;}.site-header .site-user__item{display: block;padding: 10px 14px;color: var(--ink-700,#334155);text-decoration: none;font-size: 13px;font-weight: 600;letter-spacing: -0.02em;}.site-header .site-user__item:hover{background: var(--bg-2,#F7F9FC);color: var(--navy-900,#0A2540);}.site-header .site-user__item--logout{color: #B91C2C;border-top: 1px solid var(--line,#E6E8EC);margin-top: 2px;}.site-header .site-user__item--logout:hover{background: #FBEDEF;color: #B91C2C;}.site-header .site-user__cta,.site-header .site-user__login{display: inline-flex;align-items: center;height: 34px;padding: 0 12px;border-radius: 8px;font: 600 13px/1 var(--font-sans,-apple-system,BlinkMacSystemFont,'Pretendard',system-ui,sans-serif);letter-spacing: -0.01em;text-decoration: none;white-space: nowrap;}.site-header .site-user__cta{background: var(--navy-900,#0A2540);color: #fff;border: 1px solid var(--navy-900,#0A2540);}.site-header .site-user__cta:hover{background: #102E55;border-color: #102E55;}.site-header .site-user__login{background: transparent;color: var(--ink-700,#334155);border: 1px solid var(--line,#E6E8EC);}.site-header .site-user__login:hover{background: var(--bg-2,#F7F9FC);}.site-header .site-user__cta{padding: 0 10px;}.site-header .site-user__login{display: none;}@media (min-width: 481px){.site-header .site-user__cta{padding: 0 12px;}.site-header .site-user__login{display: inline-flex;}}.col-card{background: #fff;border: 1px solid var(--line);border-radius: var(--r-lg);overflow: hidden;transition: border-color .18s ease,transform .18s ease,box-shadow .18s ease;}.col-card:hover{border-color: var(--navy-200);transform: translateY(-1px);box-shadow: var(--sh-1);}.col-card__link{display: block;color: inherit;text-decoration: none;}.col-card__link:hover{text-decoration: none;}.col-card__thumb{aspect-ratio: 16 / 9;background: var(--navy-50);overflow: hidden;margin: 0;}.col-card__thumb img{width: 100%;height: 100%;object-fit: cover;display: block;}.col-card__thumb--placeholder{display: grid;place-items: center;color: var(--navy-200);}.col-card__body{padding: 12px 14px 14px;}.col-card__cat{display: inline-block;font-size: 12px;font-weight: 600;color: var(--navy-700);background: var(--navy-50);padding: 2px 8px;border-radius: 999px;margin-bottom: 8px;letter-spacing: -0.01em;}.col-card__title{font-size: 16px;font-weight: 700;line-height: 1.45;letter-spacing: -0.02em;color: var(--navy-900);margin: 0 0 8px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.col-card__meta{display: flex;gap: 8px;flex-wrap: wrap;font-size: 13px;color: var(--navy-600);}.col-card__author{font-weight: 600;}.col-card__date::before{content: "·";margin-right: 6px;color: var(--navy-200);}.col-card__meta > :first-child.col-card__date::before{content: none;}@media (min-width: 1200px){.col-card__title{font-size: 17px;}}.col-grid{display: grid;grid-template-columns: 1fr;gap: 16px;list-style: none;margin: 0;padding: 0;}.col-card{background: #fff;border: 1px solid var(--line);border-radius: var(--r);overflow: hidden;}.col-card__link{display: block;color: inherit;}.col-card__link:hover{text-decoration: none;}.col-card__media{position: relative;aspect-ratio: 16 / 9;background: var(--navy-50);overflow: hidden;}.col-card__media img{width: 100%;height: 100%;object-fit: cover;display: block;}.col-card__body{padding: 12px 14px 14px;display: flex;flex-direction: column;gap: 6px;}.col-card__cat{font-size: 11px;font-weight: 700;color: var(--navy-700);letter-spacing: 0.01em;text-transform: uppercase;}.col-card__title{font-size: 15px;font-weight: 700;letter-spacing: -0.025em;line-height: 1.4;color: var(--ink-900);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.col-card__meta{font-size: 11.5px;color: var(--ink-500);display: flex;align-items: center;gap: 6px;margin-top: 2px;}.col-card__sep{color: var(--ink-500);}.notice-table{display: flex;flex-direction: column;border-top: 1px solid var(--line);}.notice-row{border-bottom: 1px solid var(--line-2);}.notice-row__link{display: grid;grid-template-columns: auto 1fr;grid-template-rows: auto auto;column-gap: 10px;row-gap: 2px;padding: 14px 0;color: inherit;min-height: 44px;}.notice-row__link:hover{text-decoration: none;}.notice-row__type{grid-row: 1;grid-column: 1;display: inline-flex;align-items: center;gap: 4px;height: 22px;padding: 0 8px;border-radius: 4px;background: var(--bg-2,#F7F9FC);border: 1px solid var(--line);color: var(--ink-700);font-size: 11px;font-weight: 700;letter-spacing: -0.01em;white-space: nowrap;}.notice-row__type--important{background: #FFF7E6;border-color: #FFD480;color: #9A6700;}.notice-row__type--urgent{background: #FEEDED;border-color: #F4B7B7;color: #B91C2C;}.notice-row__type--closure{background: #EEF2FF;border-color: #C7D2FE;color: #3730A3;}.notice-row__pin{color: currentColor;}.notice-row__title{grid-row: 1;grid-column: 2;font-size: 14px;font-weight: 600;letter-spacing: -0.02em;color: var(--ink-900);overflow: hidden;text-overflow: ellipsis;white-space: nowrap;min-width: 0;}.notice-row__date{grid-row: 2;grid-column: 2;font-size: 11.5px;color: var(--ink-500);}.notice-row--pinned .notice-row__title{font-weight: 700;}.notice-row--pinned{background: linear-gradient(90deg,transparent,transparent);}.event-grid{display: grid;grid-template-columns: 1fr;gap: 16px;}.event-card{background: #fff;border: 1px solid var(--line);border-radius: var(--r);overflow: hidden;}.event-card__link{display: block;color: inherit;}.event-card__link:hover{text-decoration: none;}.event-card__media{position: relative;aspect-ratio: 16 / 9;background: var(--navy-50);overflow: hidden;}.event-card__media img{width: 100%;height: 100%;object-fit: cover;display: block;}.event-card__media-fallback{position: absolute;inset: 0;display: flex;align-items: center;justify-content: center;font-size: 28px;font-weight: 700;color: var(--navy-700);}.event-card--ended .event-card__media img{filter: grayscale(1);opacity: 0.7;}.event-card__status{position: absolute;top: 10px;left: 10px;display: inline-flex;align-items: center;height: 22px;padding: 0 8px;border-radius: 4px;background: #fff;color: var(--ink-900);font-size: 11px;font-weight: 700;letter-spacing: -0.01em;border: 1px solid var(--line);}.event-card__status--ongoing{background: #E6F4EA;border-color: #98C9A3;color: #166534;}.event-card__status--upcoming{background: var(--navy-50);border-color: var(--navy-100,#C7D2FE);color: var(--navy-800,#102E55);}.event-card__status--ended{background: var(--bg-2,#F7F9FC);color: var(--ink-500);}.event-card__dday{position: absolute;top: 10px;right: 10px;display: inline-flex;align-items: center;height: 22px;padding: 0 8px;border-radius: 4px;background: var(--navy-900);color: #fff;font-size: 11px;font-weight: 700;letter-spacing: -0.01em;}.event-card__body{padding: 12px 14px 14px;display: flex;flex-direction: column;gap: 6px;}.event-card__title{font-size: 15px;font-weight: 700;letter-spacing: -0.025em;line-height: 1.4;color: var(--ink-900);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.event-card__summary{font-size: 13px;line-height: 1.55;color: var(--ink-700);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.event-card__meta{display: flex;flex-direction: column;gap: 2px;margin: 4px 0 0;font-size: 12px;color: var(--ink-700);}.event-card__meta-row{display: flex;gap: 8px;}.event-card__meta dt{color: var(--ink-500);flex-shrink: 0;width: 32px;}.event-card__meta dd{margin: 0;}.share-box{margin: 28px auto 0;padding: 18px var(--gutter,16px) 0;max-width: var(--content-medium,720px);border-top: 1px solid var(--ink-200,#e5e5e5);display: flex;flex-direction: column;gap: 10px;position: relative;}.share-box__primary{display: grid;grid-template-columns: 1fr 1fr;gap: 8px;}.share-box__action{display: inline-flex;align-items: center;justify-content: center;gap: 8px;min-height: 44px;padding: 10px 14px;font-size: 13px;font-weight: 600;line-height: 1.4;color: var(--ink-700,#444);background: #fff;border: 1px solid var(--line,#e5e7eb);border-radius: 10px;cursor: pointer;transition: color .15s ease,border-color .15s ease,background-color .15s ease;}.share-box__action svg{width: 16px;height: 16px;display: block;flex: 0 0 auto;}.share-box__action:hover,.share-box__action:focus-visible{color: var(--ink-900,#111);border-color: var(--ink-400,#9ca3af);background: var(--navy-50,#f2f5fa);}.share-box__action:focus-visible{outline: 2px solid var(--navy-700,#0A2540);outline-offset: 2px;}.share-box__action.is-copied{color: var(--navy-700,#0A2540);border-color: var(--navy-700,#0A2540);background: var(--navy-50,#f2f5fa);}.share-box__action--primary{color: #fff;background: var(--navy-700,#0A2540);border-color: var(--navy-700,#0A2540);}.share-box__action--primary:hover,.share-box__action--primary:focus-visible{color: #fff;background: var(--navy-800,#102E55);border-color: var(--navy-800,#102E55);}.share-box__fallback{margin-top: 2px;}.share-box__fallback[hidden]{display: none;}.share-box__fallback-summary{display: inline-block;padding: 6px 0;font-size: 12px;font-weight: 500;color: var(--ink-500,#6b7280);cursor: pointer;list-style: none;user-select: none;}.share-box__fallback-summary::-webkit-details-marker{display: none;}.share-box__fallback-summary::marker{content: '';}.share-box__fallback-summary::after{content: '▾';display: inline-block;margin-left: 4px;font-size: 10px;transition: transform .15s ease;}.share-box__fallback[open] .share-box__fallback-summary::after{transform: rotate(180deg);}.share-box__fallback-summary:hover,.share-box__fallback-summary:focus-visible{color: var(--ink-800,#1f2937);text-decoration: underline;text-underline-offset: 3px;}.share-box__list{display: flex;flex-wrap: wrap;gap: 8px;margin: 8px 0 0;padding: 0;list-style: none;}.share-box__item{margin: 0;}.share-box__btn{display: inline-flex;align-items: center;justify-content: center;width: 40px;height: 40px;padding: 0;color: var(--ink-700,#444);background: transparent;border: 0;border-radius: 10px;text-decoration: none;cursor: pointer;transition: color .15s ease,background-color .15s ease,transform .15s ease;}.share-box__btn svg{width: 22px;height: 22px;display: block;}.share-box__btn:hover,.share-box__btn:focus-visible{background: var(--navy-50,#f2f5fa);transform: translateY(-1px);text-decoration: none;}.share-box__btn:focus-visible{outline: 2px solid var(--navy-700,#0A2540);outline-offset: 2px;}.share-box__btn--kakao:hover,.share-box__btn--kakao:focus-visible{color: #181600;background: #fee500;}.share-box__btn--naver:hover,.share-box__btn--naver:focus-visible{color: #03c75a;}.share-box__btn--x:hover,.share-box__btn--x:focus-visible{color: #000;}.share-box__btn--facebook:hover,.share-box__btn--facebook:focus-visible{color: #1877f2;}.share-box__toast{position: fixed;left: 50%;bottom: calc(20px + env(safe-area-inset-bottom,0px));transform: translateX(-50%);z-index: 100;max-width: calc(100% - 32px);padding: 10px 16px;font-size: 13px;font-weight: 600;line-height: 1.4;color: #fff;background: rgba(10,37,64,0.92);border: 0;border-radius: 999px;box-shadow: 0 6px 18px rgba(15,23,42,0.25);pointer-events: none;animation: sabana-toast-in 180ms ease-out;}.share-box__toast[hidden]{display: none;}@keyframes sabana-toast-in{from{opacity: 0;transform: translate(-50%,6px);}to{opacity: 1;transform: translate(-50%,0);}}.sec--archive-siblings{padding-bottom: 18px;}.sibling-nav{list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: repeat(2,1fr);gap: 8px;}.sibling-nav__item{display: block;}.sibling-nav__link{display: flex;align-items: center;gap: 10px;min-height: 56px;padding: 12px 14px;background: var(--surface,#fff);border: 1px solid var(--line);border-radius: 6px;color: var(--ink-800);text-decoration: none;font-size: 14px;font-weight: 600;letter-spacing: -0.01em;transition: border-color .15s ease,background .15s ease;}.sibling-nav__link:hover,.sibling-nav__link:focus-visible{border-color: var(--navy-300,var(--navy-100));background: var(--navy-50);}.sibling-nav__icon{display: inline-flex;align-items: center;justify-content: center;width: 28px;height: 28px;color: var(--navy-700);flex-shrink: 0;}.sibling-nav__label{flex: 1;min-width: 0;}.sibling-nav__count{flex-shrink: 0;min-width: 28px;padding: 2px 8px;background: var(--bg-2);color: var(--ink-500);border-radius: 999px;font-size: 12px;font-weight: 600;text-align: center;} .dept-grid--summary{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:10px;list-style:none;margin:0;padding:0;}.dept-grid--summary .dept-tile{flex-direction:column;align-items:flex-start;text-align:left;padding:14px 16px;min-height:auto;gap:8px;}.dept-grid--summary .dept-tile__icon{margin:0;}.dept-grid--summary .dept-tile__name{font-weight:600;font-size:15px;color:var(--ink-900,#0F172A);}.dept-tile__summary{font-size:12.5px;line-height:1.55;color:var(--ink-600,#475569);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:keep-all;}@media (min-width:640px){.dept-grid--summary{grid-template-columns:repeat(2,minmax(0,1fr));}}@media (min-width:1024px){.dept-grid--summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}} /* [feat @yuri 2026-07-06] 아카이브 카드 그리드 태블릿/데스크톱 반응형 — 기존 1컬럼 고정을 2·3컬럼으로 확장 (treatment/doctor/column/event) */ @media (min-width:768px){.treatment-grid,.doc-grid,.col-grid,.event-grid{grid-template-columns:repeat(2,minmax(0,1fr));}} @media (min-width:1024px){.treatment-grid,.doc-grid,.col-grid,.event-grid{grid-template-columns:repeat(3,minmax(0,1fr));}} /* [feat @yuri 2026-07-06] sibling-nav(다른 정보 살펴보기) 모바일 무너짐 방지 — 모바일 전 구간 1열 full-width, 태블릿(>=768)부터 2열. 좁은 폭에서 카드(아이콘+라벨+카운트 배지) flex 행이 눌려 깨지던 문제(320px 카드 ~140px). 8종 아카이브(의료진/진료과목/증상/질환/칼럼/공지/이벤트/장비) 공통 컴포넌트라 일괄 적용. */ .sibling-nav{grid-template-columns:repeat(1,minmax(0,1fr));} @media (min-width:768px){.sibling-nav{grid-template-columns:repeat(2,minmax(0,1fr));}} /* [feat @yuri 2026-07-06] 아카이브 카드 높이 균일화 — 텍스트 길이 무관 동일 높이 (그리드 stretch + 카드 height:100%). doctor는 이미 height:100%. */ .treatment-card{height:100%;display:flex;flex-direction:column;} .col-card,.event-card{height:100%;} .col-card__link,.event-card__link{height:100%;display:flex;flex-direction:column;} .col-card__body,.event-card__body{flex:1 1 auto;} /* [feat @yuri 2026-07-06] 진료시간(hours) 폭 = 섹션 꽉 채움 (태블릿+데스크톱) — 캘린더·의료진표(max-width:720)·푸터(880)가 다른 섹션보다 좁게 떠 폭이 혼자 달랐음. >=768에서 max-width 해제(none) → `.sec__inner`(태블릿 섹션폭 / single 1000 / 홈 섹션폭) 전체를 채워 다른 섹션과 동일 폭. (모바일 <768은 원래 프레임 꽉 채움.) */ @media (min-width:768px){.hours-cal,.hours-doctors,.hours-foot{max-width:none;}} /* [perf @yuri 2026-08-03] .quick-cta v1-row(3열 띠) 규칙 전부 sections/quick-cta.css 로 이동 — 홈 above-the-fold 인데 components.css 가 async 라 무스타일 세로 스택(428px)→CSS 도착 시 79px 로 붕괴하며 CLS 0.26 유발(songdo 실측). quick-cta.css 는 홈에서 wp_head 인라인(pre-paint). */ /* [feat @yuri 2026-07-07] Tier2 목록 넓은화면 — 칼럼 리스트(검색·index·404·일반아카이브) 2열(≥768) + 공지 행 badge|title|date 1행(≥768). 둘 다 .sec__inner(태블릿900/데스크톱1200)를 채워 1컬럼 통짜 늘어짐 제거. 실폰(<768)은 기존 1열/2행 유지. */ @media (min-width:768px){.column-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;}.notice-row__link{grid-template-columns:auto 1fr auto;grid-template-rows:auto;align-items:center;column-gap:14px;}.notice-row__title{grid-row:1;grid-column:2;}.notice-row__date{grid-row:1;grid-column:3;white-space:nowrap;text-align:right;}} /* [feat @yuri 2026-07-07] 검색/아카이브 헤더 리디자인 + 검색폼 폭=결과폭 (사용자: 검색창 너비 작음·헤더 텍스트 디자인 개선). .archive-head 는 search+archive.php 공용, 검색폼 폭확장은 body.search 스코프(404는 620 유지). */ .archive-head{padding:6px 0 16px;margin-bottom:20px;border-bottom:1px solid var(--line);} .archive-head__title{font-size:24px;font-weight:800;letter-spacing:-0.03em;line-height:1.3;color:var(--ink-900);word-break:keep-all;} .archive-head__q{color:var(--navy-700);} .archive-head__desc{margin-top:10px;font-size:13.5px;color:var(--ink-500);line-height:1.6;} .archive-head__desc strong{color:var(--navy-800);font-weight:700;font-variant-numeric:tabular-nums;} @media (min-width:768px){.archive-head__title{font-size:28px;}} body.search .search-form-wrap{max-width:none;} /* [feat @yuri 2026-07-07] 검색폼 320px 무너짐 방어 — 입력창 flex-basis 0(내용폭 기여 제거)로 좁은폭에서 확실히 축소, 버튼은 flex-shrink 0 으로 아이콘+"검색" 온전히 유지(축소로 내용 넘침 방지). */ .sabana-searchform__input{flex:1 1 0;} .sabana-searchform__submit{flex-shrink:0;} /* [feat @yuri 2026-07-07] 공유·주소복사(.share-box) 폭 = single 본문 폭. 미정의 var(--content-medium)→720 고정이라 Tier1로 넓어진 본문(데스크톱 1000)보다 좁게 갇혀 어긋남(사용자: 칼럼 상세 PC). 본문(.article)과 동일 폭공식(모바일 container-md / 태블릿 container-lg / 데스크톱 1000)으로 통일, 가로패딩 제거해 텍스트와 정렬. share.php 쓰는 single 7종(칼럼/의료진/진료/이벤트/공지/질환/증상) 공용. */ body.single .share-box{width:min(100% - (var(--gutter) * 2),var(--container-md));max-width:none;margin-inline:auto;padding-left:0;padding-right:0;} @media (min-width:768px) and (max-width:1023.98px){body.single .share-box{width:min(100% - (var(--gutter) * 2),var(--container-lg));}} @media (min-width:1024px){body.single .share-box{width:min(100% - 48px,var(--container-lg));}} /* [feat @yuri 2026-07-07] 공유/주소복사 위 구분선 2줄→1줄 — .share-box 는 자체 상단선(--ink-200)이 있는데 바로 위 섹션(.sec)의 하단선(--line-2)까지 겹쳐 2줄이던 것(의료진·칼럼 등 상세). share-box 바로 앞 섹션의 하단선 제거 → share-box 자기 상단선 1줄만. (quick-cta 와 동일 처방.) */ body.single .sec:has(+ .share-box),body.single .sec:has(+ script + .share-box){border-bottom:0;} /* [feat @yuri 2026-07-07] 아카이브 카드 그리드(doctor/treatment) 마지막 줄 빈칸 채움 타일 — 장비 격자와 동일 로고 흑백 워터마크/병원명. is-fill-t=태블릿2열·is-fill-d=데스크톱3열 부족분에만 표시(모바일 1열은 없음). 그리드 stretch 로 카드 높이에 맞춰짐. */ .card-grid-filler{display:none;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-2,#F7F9FC);position:relative;overflow:hidden;min-height:120px;} .card-grid-filler::before{content:"";position:absolute;inset:0;background-image:var(--card-logo,none);background-repeat:no-repeat;background-position:center;background-size:44%;filter:grayscale(1);opacity:0.14;} .card-grid-filler-name{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:14px;text-align:center;font-size:clamp(13px,2vw,16px);font-weight:700;line-height:1.35;letter-spacing:-0.02em;color:var(--ink-300,#CBD5E1);word-break:keep-all;overflow:hidden;} .card-grid-filler.is-fill-m{display:block;} @media (min-width:768px){.card-grid-filler.is-fill-m{display:none;}.card-grid-filler.is-fill-t{display:block;}} @media (min-width:1024px){.card-grid-filler.is-fill-t{display:none;}.card-grid-filler.is-fill-d{display:block;}} /* [feat @yuri 2026-07-07] "다른 정보 살펴보기"(sibling-nav) — 항목 수(최대4)만큼 열을 맞춰 한 줄 꽉 채움(빈칸 여백 제거). 모바일 1열, ≥768 은 항목 수 열. */ @media (min-width:768px){.sibling-nav[data-count="1"]{grid-template-columns:minmax(0,320px);}.sibling-nav[data-count="2"]{grid-template-columns:repeat(2,minmax(0,1fr));}.sibling-nav[data-count="3"]{grid-template-columns:repeat(3,minmax(0,1fr));}.sibling-nav[data-count="4"]{grid-template-columns:repeat(4,minmax(0,1fr));}} /* [feat @yuri 2026-07-08] 적은-아이템 캐러셀(treatment v2/column v1-magazine/equipment v2) 채움 그리드 — 슬라이드 ≤3 이면 PHP 가 data-sabana-swiper 를 빼고 컨테이너에 .is-fillgrid, 트랙(ul)에 .slot-fillgrid 부여. Swiper 미초기화 → .swiper-wrapper flex 를 grid(1/2/3열)로 덮고, 남는 칸은 .card-grid-filler(로고 워터마크) 로 채움. 필러 개수는 sabana_grid_fillers 가 태블릿2열/데스크톱3열 부족분(is-fill-t/d)으로 계산 → 전 구간 행 꽉 참. */ .is-fillgrid{overflow:visible;} .is-fillgrid .slot-fillgrid{display:grid;grid-template-columns:1fr;gap:16px;align-items:stretch;} .is-fillgrid .swiper-slide{width:auto;max-width:none;height:auto;margin:0;flex-shrink:1;} /* [feat @yuri 2026-07-08] 채움 그리드 미세조정 — 카드가 필러 높이만큼 늘 때 내용 세로 센터(진료과목 dept-tile 상단 붙음 교정) + 필러 로고 잘림 방지(폭기준 44% → contain+여백). */ .is-fillgrid .dept-tile{justify-content:center;align-items:center;text-align:center;} .is-fillgrid .card-grid-filler::before{background-size:contain;background-origin:content-box;padding:16px;} @media (min-width:768px){.is-fillgrid .slot-fillgrid{grid-template-columns:repeat(2,minmax(0,1fr));}} @media (min-width:1024px){.is-fillgrid .slot-fillgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}} /* [feat @yuri 2026-07-08] 상세/아카이브/About 섹션 구분선을 콘텐츠 폭에 맞춤 — .sec 전폭 border-bottom 제거 + .sec__inner(콘텐츠 폭 centered)에 재부여. 홈(full-bleed 리듬)은 스코프 밖, CTA(중앙 카드형)는 구분선 없이 마무리. */ body.single .sec,body.post-type-archive .sec,body.page-template-template-about .sec{border-bottom:0;} body.single .sec:not(.sec--cta) > .sec__inner,body.post-type-archive .sec:not(.sec--cta) > .sec__inner,body.page-template-template-about .sec:not(.sec--cta) > .sec__inner{border-bottom:1px solid var(--line-2);padding-bottom:20px;} /* [feat @yuri 2026-07-09] 진료과목/이벤트 상세 시술정보 dl(.treatment-meta) — 태블릿·데스크톱(≥768)에서 세로 스택→가로 스펙 스트립(라벨 위·값 아래, 세로 구분선). 넓은 폭(content-medium 데스크톱 1000px)에서 시술시간/회복/마취 3항목이 우측 빈 여백 없이 균등 충전. 항목 수(1~3) 가변은 grid-auto-flow:column 자동. 모바일(<768)은 기존 라벨|값 행 유지. */ @media (min-width:768px){.treatment-meta{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr;}.treatment-meta__row{grid-template-columns:1fr;gap:4px;padding:14px 20px;border-bottom:0;border-left:1px solid var(--line-2);}.treatment-meta__row:first-child{border-left:0;}.treatment-meta__row dt{font-size:12.5px;}.treatment-meta__row dd{font-size:15px;font-weight:600;line-height:1.4;}} /* [feat @yuri 2026-07-08] single hero thumb height cap - widened content(1200) made featured image over-tall; cap + cover. */ /* [fix @yuri 2026-07-09] 대표이미지 크롭·업스케일 폐기 — 이전 cover + base width:100% 조합이 작은 원본 (예: 301×263 일러스트)을 1200 컨테이너로 늘려 화질을 깨뜨렸다. width:auto + max-width:100% + max-height 로 전환: ① 큰 이미지는 폭/높이(440) 안에서 비율 유지 축소(무크롭) ② 작은 이미지는 원본 해상도 그대로(업스케일 없음) ③ 항상 중앙 정렬. 의료진 초상은 :not(.single-doctor)로 제외 → 아래 별도 규칙 유지. */ body.single:not(.single-doctor) .post-thumb img,body.single:not(.single-doctor) .post-thumb>img{width:auto;max-width:100%;height:auto;max-height:440px;object-fit:contain;margin-inline:auto;} /* [fix @yuri 2026-07-09] 의료진 상세 프로필 사진 위아래 잘림 해제 — 위 공통 히어로 캡(max-height:440 + cover)은 가로형 대표이미지(칼럼/진료과목)용이라, 세로 긴 의료진 초상 사진의 위아래를 잘라냈다. 의료진은 크롭 없이 원본 비율 그대로 표시(소스도 무크롭 sabana-doctor 로 교체됨). 프레임 폭(≤280·중앙)은 유지 → 모든 디바이스에서 초상 사진이 자연스럽게 세로로 온전히 보인다. */ body.single-doctor .post-thumb img,body.single-doctor .post-thumb>img{max-height:none;object-fit:contain;} /* [fix @yuri 2026-07-10] 진료과목 요약 카드(dept-grid--summary) 높이 균일화 — 그리드 셀(li)을 flex 로 만들고 타일을 셀 높이만큼 stretch. 요약 텍스트 길이가 달라도 같은 행 카드 높이 동일. (기존: 타일이 li(그리드 셀)를 안 채워 내용 높이대로 제각각.) */ .dept-grid--summary>li{display:flex;} .dept-grid--summary>li>.dept-tile{flex:1 1 auto;} /* [feat @yuri 2026-07-13] 진료 강점(치료 시스템) 카드 — center_features 필드('제목 | 설명' 줄 단위). 모바일 1열 → ≥768 2열. 체크 마크 + 제목 + 설명. */ .feature-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:12px;} .feature-card{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-lg);} .feature-card__mark{flex:0 0 auto;width:32px;height:32px;border-radius:var(--r);background:var(--navy-50);color:var(--navy-700);display:grid;place-items:center;} .feature-card__mark svg{display:block;} .feature-card__body{min-width:0;} .feature-card__title{margin:0;font-size:16px;font-weight:700;line-height:1.4;color:var(--ink-900);} .feature-card__desc{margin:4px 0 0;font-size:14px;line-height:1.6;color:var(--ink-500);} @media (min-width:768px){.feature-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}} /* ═══ [feat @yuri 2026-07-13] 본문 리치 렌더(.art-*) — article-enhance.php 와 세트 ═══ 질환/진료과목 상세의 the_content 패턴을 컴포넌트로 렌더. 모바일 우선, min-width 확장. */ /* ── 본문 타이포 (entry-content 공통 — 기존 스타일 부재 영역) ── */ .entry-content { font-size: 16px; line-height: 1.75; color: #1E293B; } .entry-content h2 { margin: 2.2em 0 0.8em; padding-bottom: 10px; border-bottom: 2px solid #E2E8F0; font-size: 21px; line-height: 1.35; color: var(--navy-900,#0A2540); } .entry-content h2:first-child { margin-top: 0; } .entry-content h3 { margin: 1.8em 0 0.6em; font-size: 17px; color: var(--navy-700,#1B3F6E); } .entry-content p { margin: 0.9em 0; } .entry-content li strong, .entry-content p strong { color: var(--navy-900,#0A2540); } /* [feat @yuri 2026-07-13] :not(.art-cards) 추가 — 제목+설명 카드 ul 은 도트 불릿 제외 */ /* [fix @yuri 2026-08-03] :not(.art-keys__list) 추가 — 키워드 카드 ul 은 도트 불릿 제외 */ .entry-content ul:not(.art-checks):not(.art-cards):not(.art-keys__list) { list-style: none; margin: 0.9em 0; padding: 0; } .entry-content ul:not(.art-checks):not(.art-cards):not(.art-keys__list) > li { position: relative; margin: 7px 0; padding-left: 18px; } .entry-content ul:not(.art-checks):not(.art-cards):not(.art-keys__list) > li::before { content: ""; position: absolute; left: 2px; top: 0.66em; width: 6px; height: 6px; border-radius: 50%; background: var(--navy-700,#1B3F6E); } /* [feat @yuri 2026-08-06] 자료 다운로드 목록(.art-files) — downloads 블록 전용. 한 줄 = 서식 하나. 왼쪽에 이름, 오른쪽에 형식별 버튼(워드/HWP/PDF)이 줄바꿈되며 붙는다. 모바일 우선: 좁으면 이름 아래로 버튼이 내려가고, 640px↑ 부터 한 줄에 나란히. */ .entry-content .art-files { list-style: none; margin: 1.1em 0; padding: 0; display: flex; flex-direction: column; gap: 8px; } .entry-content .art-files > li::before { display: none; } .art-file { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 14px; background: #fff; border: 1px solid #E2E8F0; border-radius: 12px; } .art-file__name { font-weight: 600; color: var(--ink-900,#0F172A); font-size: 15px; letter-spacing: -0.01em; margin-right: auto; } .art-file__links { display: flex; flex-wrap: wrap; gap: 6px; } .art-file__link { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px; border: 1px solid var(--navy-100,#DDE4EE); border-radius: 999px; background: var(--navy-50,#F0F4FA); color: var(--navy-700,#1B3F6E); font-size: 13px; font-weight: 600; text-decoration: none; transition: background-color .18s ease, border-color .18s ease; } .art-file__link:hover { background: var(--navy-100,#DDE4EE); border-color: var(--navy-700,#1B3F6E); text-decoration: none; } .art-file__link:focus-visible { outline: 2px solid var(--navy-700,#1B3F6E); outline-offset: 2px; } .art-file__size { font-weight: 500; font-size: 12px; color: var(--ink-500,#64748B); } @media (min-width: 640px) { .art-file { padding: 14px 16px; } .art-file__name { font-size: 16px; } } @media (prefers-reduced-motion: reduce) { .art-file__link { transition: none; } } /* [fix @yuri 2026-08-06] 본문
    번호 복원 — base.css 의 ol{list-style:none} 리셋 탓에 본문 순서 목록이 마커 없이 렌더되고 있었다(본사 약관 조항, hanaent 진료 절차 등 5개 페이지 실측). 그 결과 운영자가 번호를 본문에 직접 적게 되고("1. …"), ul 도트와 겹쳐 이중 마커가 됐다. 여기서 번호를 되살려
      이 제 역할을 하게 한다. ul 쪽 도트 규칙과 좌측 여백을 맞춘다. */ .entry-content ol { list-style: decimal; margin: 0.9em 0; padding-left: 1.45em; } .entry-content ol > li { margin: 7px 0; padding-left: 2px; } .entry-content ol > li::marker { color: var(--navy-700,#1B3F6E); font-weight: 600; } .entry-content > figure:not(.post-thumb) { margin: 1.2em 0; } .entry-content > figure:not(.post-thumb) img { border-radius: 12px; } @media (min-width: 1024px) { .entry-content h2 { font-size: 24px; } .entry-content h3 { font-size: 18px; } } /* ── 요약 답변 박스 (첫 문단) ── */ .entry-content .art-lead { margin: 0 0 1.6em; padding: 16px 18px; background: #F5F8FC; border-radius: 10px; font-size: 17px; line-height: 1.7; color: #0F172A; } /* ── 표: 공통 래퍼(가로 스크롤) + 유형별 ── .art-table div 자체가 스크롤 컨테이너이므로 내부 table 은 정상 table 레이아웃으로 되돌린다. (layout.css 의 `.article table{display:block}` 반응형 폴백이 여기선 폭 붕괴를 유발 → specificity 로 override) */ .art-table { margin: 1.2em 0; overflow-x: auto; border: 1px solid #E2E8F0; border-radius: 12px; background: #fff; } .entry-content .art-table table { display: table; width: 100%; max-width: none; border-collapse: collapse; font-size: 15px; } .art-table th, .art-table td { padding: 12px 14px; text-align: left; vertical-align: top; line-height: 1.6; } /* 분류/비교 표 (thead 있음) */ .art-table--data table { min-width: 520px; } .art-table--data thead th { background: var(--navy-900,#0A2540); color: #fff; font-weight: 600; white-space: nowrap; } .art-table--data tbody td { border-top: 1px solid #EEF2F7; } .art-table--data tbody tr:nth-child(even) td { background: #F8FAFC; } /* 정보 표 (수술 안내 등 — th|td 행) */ .art-table--spec tbody th { width: 108px; background: #F5F8FC; color: var(--navy-700,#1B3F6E); font-weight: 600; white-space: nowrap; border-top: 1px solid #EEF2F7; } .art-table--spec tbody td { border-top: 1px solid #EEF2F7; } .art-table--spec tbody tr:first-child th, .art-table--spec tbody tr:first-child td { border-top: 0; } /* ── 이미지 그리드 (연속 figure) ── */ /* [feat @yuri 2026-07-13] 이미지 높이 고정(aspect-ratio:1/1), figcaption 높이 일정(min-height), 카드 전체 높이 통일 */ .art-figs { display: grid; gap: 14px; grid-template-columns: 1fr; margin: 1.2em 0; } .art-figs figure { margin: 0; border: 1px solid #E2E8F0; border-radius: 12px; overflow: hidden; background: #fff; display: flex; flex-direction: column; } .art-figs figure img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; } /* [fix @yuri 2026-07-29] 단일 이미지 블록(열 변형 없는 .art-figs = figs_cols()==0, 1장) — 정사각 강제가 가로 사진을 크롭+확대해 화질이 깨지던 것(송도 특장점: 640px 원본이 ~1000px 정사각으로 확대·좌우 잘림). 그리드(--2/--3)의 카드 높이 통일용 정사각은 유지, 1장짜리만 원본 비율 + 원본 폭 이하 + 중앙 정렬. */ .art-figs:not(.art-figs--2):not(.art-figs--3) { justify-items: center; } .art-figs:not(.art-figs--2):not(.art-figs--3) figure { max-width: 100%; } .art-figs:not(.art-figs--2):not(.art-figs--3) figure img { width: auto; max-width: 100%; aspect-ratio: auto; } /* [feat @yuri 2026-07-13] flex-direction:column — 리치 캡션(제목
      설명)이 flex 아이템으로 갈라져 가로 2컬럼처럼 깨지던 것 수정. 세로 중앙정렬은 justify-content 로 유지. */ .art-figs figcaption { padding: 10px 12px; border-top: 1px solid #EEF2F7; font-size: 13px; color: #64748B; min-height: 60px; flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } .art-figs figcaption strong { color: #1E293B; } @media (min-width: 640px) { .art-figs--2 { grid-template-columns: repeat(2, 1fr); } .art-figs--3 { grid-template-columns: repeat(3, 1fr); } } /* ── 번호 스텝 카드 (ol) ── */ /* [feat @yuri 2026-07-13] .art-steps > li: display flex + align-items center 로 텍스트와 숫자 동그라미 수직 정렬 */ .entry-content .art-steps { list-style: none; counter-reset: artstep; display: grid; gap: 10px; grid-template-columns: 1fr; margin: 1em 0; padding: 0; } .entry-content .art-steps > li { counter-increment: artstep; position: relative; margin: 0; padding: 14px 16px 14px 52px; background: #fff; border: 1px solid #E2E8F0; border-radius: 12px; } .entry-content .art-steps > li::before { content: counter(artstep); position: absolute; left: 14px; top: 12px; width: 26px; height: 26px; border-radius: 50%; background: var(--navy-900,#0A2540); color: #fff; font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; line-height: 1; } @media (min-width: 768px) { .entry-content .art-steps { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } } /* ── 체크 카드 (특징/시스템/강점 리스트) ── */ .entry-content .art-checks { list-style: none; display: grid; gap: 10px; grid-template-columns: 1fr; margin: 1em 0; padding: 0; } .entry-content .art-checks > li { position: relative; margin: 0; padding: 14px 16px 14px 48px; background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 12px; line-height: 1.6; } .entry-content .art-checks > li::before { content: "\2713"; position: absolute; left: 14px; top: 13px; width: 22px; height: 22px; border-radius: 50%; background: #E8F0F9; color: var(--navy-700,#1B3F6E); font-size: 13px; font-weight: 700; line-height: 22px; text-align: center; } @media (min-width: 768px) { .entry-content .art-checks { grid-template-columns: repeat(2, 1fr); } } /* [feat @yuri 2026-07-13] .art-video — 본문 영상 임베드 16:9 반응형 래퍼. 에디터에서 유튜브 URL 한 줄 붙여넣기 → WP 자동 임베드 → article-enhance 가 래핑. */ .entry-content .art-video { position: relative; aspect-ratio: 16 / 9; margin: 1.2em 0; border-radius: 12px; overflow: hidden; background: var(--navy-900,#0A2540); } .entry-content .art-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } @media (min-width: 768px) { .entry-content .art-video { margin: 1.6em 0; } } /* [feat @yuri 2026-07-13] .art-cards — 제목+설명 카드 그리드. 모든 항목이 "제목
      설명" 구조인 ul 을 article-enhance 가 승격. 모바일 1열 → 640 2열 → 1024 3열 (마지막 줄 빈 칸은 sb-grid-fill 브랜드 카드). */ .entry-content .art-cards { list-style: none; display: grid; gap: 12px; grid-template-columns: 1fr; margin: 1em 0; padding: 0; } .entry-content .art-cards > li { margin: 0; padding: 16px; background: #fff; border: 1px solid #E2E8F0; border-radius: 12px; font-size: 14px; line-height: 1.65; color: #475569; } .entry-content .art-cards > li::before { content: none; } .entry-content .art-cards > li > strong:first-child { display: block; margin: 0 0 8px; padding: 0 0 8px; border-bottom: 1px solid #EEF2F7; font-size: 15px; line-height: 1.45; color: var(--navy-900,#0A2540); } @media (min-width: 640px) { .entry-content .art-cards { grid-template-columns: repeat(2, 1fr); } } @media (min-width: 1024px) { .entry-content .art-cards { grid-template-columns: repeat(3, 1fr); } } /* [feat @yuri 2026-07-14] .art-faq — 본문 FAQ 블록(네이티브 details 아코디언 · JS 불필요 · 캐시 안전). 화면 노출 Q/A 가 그대로 FAQPage 스키마로도 나감(가짜 마크업 없음). */ .entry-content .art-faq { margin: 1.4em 0; display: flex; flex-direction: column; gap: 8px; } .entry-content .art-faq__item { border: 1px solid #E2E8F0; border-radius: 12px; background: #fff; overflow: hidden; } .entry-content .art-faq__item[open] { border-color: #CBD5E1; } .entry-content .art-faq__q { list-style: none; cursor: pointer; position: relative; padding: 14px 44px 14px 16px; font-size: 16px; font-weight: 600; line-height: 1.5; color: var(--navy-900,#0A2540); } .entry-content .art-faq__q::-webkit-details-marker { display: none; } .entry-content .art-faq__q::after { content: ''; position: absolute; right: 18px; top: 50%; width: 9px; height: 9px; border-right: 2px solid #94A3B8; border-bottom: 2px solid #94A3B8; transform: translateY(-70%) rotate(45deg); transition: transform .15s; } .entry-content .art-faq__item[open] .art-faq__q::after { transform: translateY(-30%) rotate(-135deg); } .entry-content .art-faq__a { padding: 0 16px 16px; } .entry-content .art-faq__a p { margin: 0 0 .6em; font-size: 15px; line-height: 1.7; color: #334155; } .entry-content .art-faq__a p:last-child { margin-bottom: 0; } /* [feat @yuri 2026-07-13] .sb-grid-fill — 카드 그리드 마지막 줄 빈 칸 placeholder. main.js initGridFillers 가 컬럼 수 기준 부족분만큼 삽입(로고 워터마크 또는 병원명). 모바일 1열에서는 JS 가 아예 넣지 않음. */ /* [fix @yuri 2026-07-21] 필러가 행 높이를 만들면 안 된다. 기존: min-height:96px + 흐름 안의 로고(, 최대 44px + 패딩) 가 행의 최소 높이를 96px 로 밀어올려 체크리스트처럼 한 줄짜리 카드(약 56px) 행만 유독 커 보였다(.art-checks/.art-steps/.art-cards 다수 페이지). 수정: ① min-height 해제 → 행 높이는 실제 카드가 결정(필러는 항상 실제 카드가 1개 이상 있는 행에만 들어감) ② 로고/병원명을 absolute 로 띄워 intrinsic 높이 기여를 0 으로 만들고 overflow:hidden 으로 넘침 차단 (about.css 의 .about-values/.about-creds/.about-related 개별 min-height:0 패치가 하던 일을 기본값으로 승격) */ .sb-grid-fill { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; align-self: stretch; min-height: 0; border: 1px dashed #E2E8F0; border-radius: 12px; background: #F8FAFC; } .sb-grid-fill img, .sb-grid-fill .sb-grid-fill__name { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .sb-grid-fill img { max-width: 50%; max-height: 44px; width: auto; height: auto; opacity: 0.35; filter: grayscale(1); } .sb-grid-fill .sb-grid-fill__name { max-width: 80%; font-size: 14px; font-weight: 600; color: #CBD5E1; letter-spacing: 0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 리스트형 그리드에 삽입된 필러(li)의 마커·번호·체크 배지 무효화 + 카드 패딩 상속 차단 */ .entry-content ul:not(.art-checks) > li.sb-grid-fill::before, .entry-content .art-checks > li.sb-grid-fill::before, .entry-content .art-steps > li.sb-grid-fill::before, .entry-content .art-cards > li.sb-grid-fill::before, .feature-cards > li.sb-grid-fill::before { content: none; } .entry-content .art-checks > li.sb-grid-fill, .entry-content .art-steps > li.sb-grid-fill, .entry-content ul:not(.art-checks) > li.sb-grid-fill, .entry-content .art-cards > li.sb-grid-fill, .feature-cards > li.sb-grid-fill { /* [fix @yuri 2026-07-21] 내용(로고/병원명)이 absolute 라 패딩은 행 최소 높이만 키운다 → 0 */ padding: 0; background: #F8FAFC; border: 1px dashed #E2E8F0; box-shadow: none; } /* [feat @yuri 2026-07-13] .art-figs 의 placeholder: 그리드 행 높이에 맞춰 늘어남(이미지+캡션 카드와 동일 높이) */ .art-figs .sb-grid-fill { align-self: stretch; min-height: 0; } /* [fix @yuri 2026-07-13] CLS — post-thumb 의 width:auto 는 로드 전 박스가 접혀 로드 시 본문이 밀림(CLS 0.7 실측). 컨테이너 폭 이상 이미지(post-thumb--fill, 템플릿에서 원본 폭 ≥700px 일 때 부여)는 width:100% 로 로드 전 높이 예약(width/height 속성 기반 aspect-ratio). 작은 이미지는 width:auto 유지(업스케일 방지). */ body.single:not(.single-doctor) .post-thumb--fill img, body.single:not(.single-doctor) .post-thumb--fill > img { width: 100%; } /* [feat @yuri 2026-07-14] 의료진 주간 진료표 모바일(<600) 잘림 방지 — 7열 균등(table-layout:fixed) + 시간대(시작/종료)를 세로로 쪼개 셀 폭 절약(09:00-13:00 → 09:00/13:00). 데스크톱(>=600)은 하이픈 포함 한 줄 복원. 마크업: single-doctor.php slot 의 __t/__sep. 모바일 우선(min-width 확장). */ .doc-schedule-table{table-layout:fixed;} .doc-schedule-table th,.doc-schedule-table td{padding-left:3px;padding-right:3px;} .doc-schedule-table__t{display:block;line-height:1.35;} .doc-schedule-table__sep{display:none;} @media (min-width:600px){ .doc-schedule-table{table-layout:auto;} .doc-schedule-table th,.doc-schedule-table td{padding-left:8px;padding-right:8px;} .doc-schedule-table__t{display:inline;} .doc-schedule-table__sep{display:inline;} } /* [feat @yuri 2026-07-14] 본문 유튜브 임베드 반응형 — 게시판 이관 칼럼은 WP 기본 oembed(500px 고정 iframe)라 모바일 우측 넘침. entry-content 내 유튜브 iframe 을 16:9 반응형으로. (테마 .art-video 는 이미 반응형이라 무관.) */ .entry-content iframe[src*="youtube"],.entry-content iframe[src*="youtu.be"]{display:block;width:100%;max-width:100%;aspect-ratio:16/9;height:auto;margin:16px 0;border:0;} /* [fix @yuri 2026-07-13] 콘텐츠 단독 이미지·페이지 히어로 중앙 정렬 — 원본이 컨테이너보다 좁으면 좌측 붙고 우측 여백이 크게 남던 것(하나 이야기 PC 지적). 전폭 이미지는 영향 없음. */ .entry-content > figure:not(.post-thumb) img { margin-inline: auto; } .page-thumb img { margin-inline: auto; } /* [fix @yuri 2026-07-13] .art-figs 캡션 — display:flex(세로 중앙정렬용)가 "제목
      설명" 구조를 가로 2단으로 갈라 제목이 단어 중간에서 꺾이던 것(하나 이야기 '특별함' 카드 붕괴) → column 스택으로 제목/설명 세로 배치 + 제목 블록·네이비 강조. 한 줄 캡션은 종전과 동일하게 보임. */ .art-figs figcaption { flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; } .art-figs figcaption strong { display: block; color: var(--navy-900,#0A2540); } /* [feat @yuri 2026-07-13] FAQ 상세 답변 속 임베드 영상 반응형 — faq 는 .art-video 변환 대상이 아니라 직접 처리. */ .single-faq .entry-content iframe{display:block;width:100%;max-width:720px;aspect-ratio:16/9;height:auto;border:0;border-radius:10px;background:#000;} /* [feat @yuri 2026-07-30] 오시는 길 교통 안내 시각화 (template-parts/map-transit.php) — map-card__meta 평문 dl 대체. 노선/버스 뱃지 색은 노선 고유색(데이터)이라 PHP inline style, 그 외 색은 전부 테마 변수. 모바일 1열 → 768px+ 라벨 좌열 그리드·정류장 카드 가로 배치. */ .map-transit{display:flex;flex-direction:column;gap:14px;margin:0;padding-top:14px;border-top:1px solid var(--line-2);} .map-transit__row{display:flex;flex-direction:column;gap:7px;} .map-transit dt{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--ink-500);} .map-transit dt svg{width:15px;height:15px;flex-shrink:0;color:var(--navy-700,#0A2540);} .map-transit dd{margin:0;font-size:13px;color:var(--ink-700);line-height:1.6;} .map-transit__line{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;} .transit-badge{display:inline-flex;align-items:center;justify-content:center;min-height:22px;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:-0.01em;line-height:1;} .map-transit__stops{display:flex;flex-direction:column;gap:8px;} .map-transit__stop{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--bg-3,#f7f8fa);} .map-transit__stop-name{font-size:12px;font-weight:600;color:var(--ink-700);} .map-transit__routes{display:flex;flex-wrap:wrap;align-items:center;gap:5px;} .bus-pill{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:22px;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700;line-height:1;} .map-transit__routes-note{font-size:12px;color:var(--ink-500);} @media (min-width:768px){ .map-transit__row{display:grid;grid-template-columns:76px 1fr;gap:10px;align-items:start;} .map-transit dt{padding-top:3px;} .map-transit__stops{flex-direction:row;flex-wrap:wrap;gap:10px;} .map-transit__stop{flex:1 1 260px;} } /* [feat @yuri 2026-07-30] 카카오 지도 '약도' 토글 뷰 — is-fallback(SDK 실패)과 동일하게 높이 해제. */ .map-card__img--kakao.is-sketch{height:auto;} /* [fix @yuri 2026-07-30] 제목만 있는 .art-cards 카드 — 제목 밑 구분선이 빈 공간 위에 떠 보임(songdo 내시경 '강점' 4카드). 구분선은 "제목+설명" 카드용. 설명 있는 카드는
      요소가 있어 strong 이 :only-child 가 아니므로 종전 유지. */ .entry-content .art-cards > li > strong:only-child{margin-bottom:0;padding-bottom:0;border-bottom:0;} /* [feat @yuri 2026-07-30] 상세 페이지 상단 배너(_sabana_hero_image) — 원본 서브비주얼(1920×650) 와이드 출력. sabana-hero(4:5 크롭) 대신 원본 비율 풀폭. width/height 속성 기반 비율 예약으로 CLS 방지. */ .post-thumb--banner img{width:100%;height:auto;display:block;} /* [perf @yuri 2026-08-03] quick-cta 폴백 svg·칸수 가변 규칙도 sections/quick-cta.css 로 이동(위 참조). */ /* ── [feat @yuri 2026-08-03] 본문 강조 섹션 디자인 세트 ── 키워드 카드(.art-keys) · 배지형 소제목(.art-h-badge) · 강조 박스(.art-box) · 원형 배지 카드(.art-cards--circle). 색은 브랜드 변수만 사용(빌더 색 변경 연동) — 리터럴은 폴백 전용. 모바일 최우선(min-width 만). [chg @yuri 2026-08-03] 육각형(.art-hexes/clip-path 지그재그) → 균등 사각 카드로 교체. 지그재그·클리핑은 글자 길이에 따라 여백이 들쭉날쭉해 보였다. 그리드 stretch 로 높이를 통일한다. */ /* 키워드 카드 인트로 — 균등 그리드, 카드 높이 자동 통일(행 stretch) */ .entry-content .art-keys { margin: 1.2em 0 1.8em; } .art-keys__head { text-align: center; margin: 0 0 16px; } .entry-content .art-keys__eyebrow { margin: 0 0 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.3em; text-indent: 0.3em; /* letter-spacing 마지막 글자 뒤 여백 보정 — 가운데 정렬 유지 */ text-transform: uppercase; color: var(--navy-700,#1B3F6E); opacity: 0.75; } .entry-content h2.art-keys__title { margin: 0; padding: 0; border-bottom: none; font-size: 22px; text-align: center; } .entry-content ul.art-keys__list { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; } .entry-content ul.art-keys__list > li { margin: 0; padding: 0; } .art-key { display: flex; align-items: center; justify-content: center; height: 100%; min-height: 66px; padding: 14px 12px; border: 1px solid var(--navy-200,#B5C7DE); border-radius: 12px; background: #fff; } .art-key > span { font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--navy-900,#0A2540); text-align: center; word-break: keep-all; } @media (min-width: 640px) { /* 4개면 4열, 6개면 6열 — 항목 수에 맞춰 한 줄로 균등 분배 */ .entry-content ul.art-keys__list { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; } .art-key { min-height: 76px; } .art-key > span { font-size: 16px; } .entry-content h2.art-keys__title { font-size: 26px; } } /* 배지형 소제목 = 섹션 시작 표시 (h2 기본 밑줄 제거). [chg @yuri 2026-08-03] "섹션 구분이 안 된다"는 지적 반영 — ① h2 가 전폭 얇은 구분선을 그리고 알약(span)이 그 선 위에 얹혀 경계를 만든다. ② 섹션 사이는 넓히고(margin-top 3.2em) 섹션 안쪽은 붙인다(아래 인접 규칙) — 근접성으로 묶어 읽히게. */ .entry-content .art-h-badge { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; margin: 3.2em 0 0.9em; padding: 0; border: none; background: none; line-height: 1.4; text-align: center; } .entry-content .art-h-badge::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: #E2E8F0; } .entry-content .art-h-badge > span { position: relative; z-index: 1; /* 좁은 화면에서 긴 문장형 제목이 알약 밖으로 나가지 않도록 — 컨테이너 폭을 넘지 않고 줄바꿈. */ max-width: 100%; padding: 9px 20px; border: 2px solid var(--navy-700,#1B3F6E); border-radius: 999px; background: #fff; font-size: 17px; color: var(--navy-900,#0A2540); word-break: keep-all; } .entry-content .art-h-badge:first-child { margin-top: 0.4em; } @media (min-width: 768px) { .entry-content .art-h-badge { margin-top: 3.6em; } .entry-content .art-h-badge > span { padding: 9px 28px; font-size: 19px; } } /* 강조 박스 — 연한 파랑 배경 리드 문단 */ .entry-content .art-box { margin: 0.9em 0 1.2em; padding: 18px 20px; border-radius: 12px; background: var(--navy-50,#EEF3FA); text-align: center; font-size: 15px; line-height: 1.75; } .entry-content .art-box > p { margin: 0 0 0.6em; } .entry-content .art-box > p:last-child { margin-bottom: 0; } @media (min-width: 768px) { .entry-content .art-box { padding: 22px 28px; } } /* 섹션 안쪽 묶기 — 배지 바로 다음 요소는 배지에 붙이고, 섹션 안 h3 는 위 여백을 줄인다. (섹션 사이 3.2em vs 섹션 안 0.4~1em 대비로 그룹이 눈에 잡히게) */ .entry-content .art-h-badge + .art-box, .entry-content .art-h-badge + p { margin-top: 0; } .entry-content .art-box + h3, .entry-content .art-box + .art-cards { margin-top: 1.1em; } /* [fix @yuri 2026-08-03] 원형 목록 제목 — 섹션 안 다른 요소(배지 소제목·강조박스·원형 목록)가 모두 가운데인데 이 h3 만 왼쪽이라 어긋나 보였다(사용자 지적). 렌더가 원형일 때만 이 클래스를 붙인다(기본 목록은 무영향). */ .entry-content .art-list-title { margin-bottom: 0.9em; text-align: center; } /* [feat @yuri 2026-08-03] 직접 HTML 블록 가운데 정렬(variant=center) — 가운데 정렬 섹션 안에서 축을 맞춘다. 블록 자체에 정렬 규칙이 없어 혼자 왼쪽으로 남던 문제(예: 건강검진센터 '검진 항목표 보기' 안내+버튼). */ .entry-content .art-rich-center { text-align: center; } /* ── 원형 배지 목록 — 본문 안 "목록"의 표준 형태(cards·checklist 공용) ── [chg @yuri 2026-08-03] 원 안에 제목을 넣던 구조 폐기. 두 번 실패한 이력: ① 설명을 원 안에 넣음 → 글자 수만큼 원이 늘어나 항목마다 크기가 달라짐 ② 제목을 원 안에 넣음 → 제목이 길면 안 들어가고, 넣으려고 '추천 1' 같은 껍데기 라벨을 만들게 됨 (원 안엔 의미 없는 번호가 크게, 정작 중요한 문장은 아래 작게 → 정보 위계 역전) 결론: **원 안은 순번(고정 크기 정원), 내용은 원 아래 읽을 수 있는 크기**로 고정. 덕분에 제목만 있든·문장만 있든·제목+긴설명이든 같은 컴포넌트 하나로 처리된다(사이트 전체 통일). 밀도만 내용 길이에 맞춰 c4/c3/c2 로 갈린다(sabana_circle_cols_class). */ /* grid 대신 flex — 3개처럼 열수와 안 떨어지는 개수일 때 grid 는 왼쪽으로 쏠린다(빈 열이 오른쪽에 남음). flex + justify-content:center 면 개수와 무관하게 항상 가운데 정렬되고 로고 필러도 안 붙는다. */ .entry-content .art-cards--circle { display: flex; flex-wrap: wrap; justify-content: center; /* 세로 간격은 원이 카드 위로 걸치는 만큼(약 28px) 확보 */ gap: 44px 16px; /* 첫 줄 원이 위 요소를 침범하지 않게 */ margin-top: 2.6em; } /* [feat @yuri 2026-08-03] 항목마다 카드 경계 — 번호만 있고 선이 없어 항목 간 구분이 애매했다(사용자 지적). 원이 카드 위 테두리에 걸치는 형태로, 경계는 분명해지고 번호는 계속 도드라진다. 같은 줄 카드는 flex 기본 stretch 로 높이가 자동으로 맞는다(글자 수가 달라도 아래 끝이 가지런). */ .entry-content .art-cards--circle > li { position: relative; display: block; flex: 0 0 auto; /* [fix @yuri 2026-08-03] 칸별 max-width 제거 — 최대폭을 걸어두면 목록만 본문 기준 너비보다 좁게 모여 강조박스·표 같은 이웃 블록과 좌우 끝이 안 맞았다(사용자 지적). 이제 열 너비 합이 본문 폭을 채운다. */ width: 100%; margin: 0; padding: 40px 18px 22px; border: 1px solid #E2E8F0; border-radius: 14px; background: #F8FAFC; text-align: center; font-size: 15px; line-height: 1.65; color: #334155; word-break: keep-all; } /* 항목 제목(있을 때) — 원 아래 본문 첫 줄 */ .entry-content .art-cards--circle > li > b { display: block; margin: 0 0 4px; color: var(--navy-900,#0A2540); font-weight: 700; } /* 제목만 있고 설명이 없는 항목은 아래 여백을 줄여 카드가 허전해 보이지 않게 */ .entry-content .art-cards--circle > li > b:last-child { margin-bottom: 0; } /* 순번 원 — 항상 같은 크기의 정원. 카드 위 테두리에 절반쯤 걸치도록 띄운다. */ .entry-content .art-cards--circle > li > strong:first-child { position: absolute; top: -27px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; margin: 0; padding: 0; border: 4px solid #fff; /* 카드 테두리와 겹칠 때 원이 또렷하게 끊겨 보이도록 */ border-bottom: 4px solid #fff; border-radius: 50%; background: var(--navy-700,#1B3F6E); color: #fff; font-size: 17px; font-weight: 700; line-height: 1; text-align: center; word-break: normal; box-sizing: border-box; } /* 밀도 — 항목 글자수 기준(짧은 키워드는 촘촘히, 문장은 넓게). 모바일은 항상 1열. */ /* 모바일 — 기본 1열, 짧은 항목(c4)만 2열(한 단어짜리가 세로로 길게 늘어지는 것 방지) */ .entry-content .art-cards--circle-c4 > li { width: calc(50% - 8px); } /* 열 너비 합 = 본문 폭. 예: c4 는 4×(25% - 12px) + 3×16px gap = 100% */ @media (min-width: 640px) { .entry-content .art-cards--circle-c1 > li { width: 100%; } .entry-content .art-cards--circle-c2 > li { width: calc(50% - 8px); } .entry-content .art-cards--circle-c3 > li { width: calc(33.333% - 11px); } .entry-content .art-cards--circle-c4 > li { width: calc(25% - 12px); } .entry-content .art-cards--circle > li > strong:first-child { width: 60px; height: 60px; top: -30px; font-size: 18px; } .entry-content .art-cards--circle > li { padding-top: 44px; } .entry-content .art-cards--circle { gap: 48px 16px; } } /* ── 카드형 '균등 배치' 변형(.art-cards--even) — 운영자가 고를 때만 적용되는 opt-in ── ★기본 .art-cards 에는 절대 규칙을 추가하지 않는다★: 전 사이트(하나이비인후과·플란틴 등) 공용이라 기본을 건드리면 병원 사이트 레이아웃이 통째로 함께 움직인다(2026-08-03 사용자 지시로 여기로 격리). 열수는 렌더가 붙이는 art-cards--cols-N(sabana_figs_cols: 1개=1열 / 2·4개=2열 / 3·5개↑=3열). 목적 = 마지막 줄에 로고 필러(.sb-grid-fill)가 남아 빈칸처럼 보이는 것 줄이기. */ @media (min-width: 640px) { .entry-content ul.art-cards--even.art-cards--cols-0 { grid-template-columns: minmax(0, 1fr); } } @media (min-width: 1024px) { .entry-content ul.art-cards--even.art-cards--cols-0 { grid-template-columns: minmax(0, 1fr); } .entry-content ul.art-cards--even.art-cards--cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* (설명 없는 카드의 제목 밑줄 제거는 이미 플랫폼 기본 — 2026-07-30 규칙, 중복 정의 안 함) */ /* [fix @yuri 2026-08-03] 제목 바로 뒤의
      만 제거 — 제목 이 블록이라 그 뒤
      이 빈 줄을 하나 더 만든다. 설명 안쪽 줄바꿈(nl2br)은 그대로 살려야 하므로 인접 형제(+ br)로만 좁힌다. even·circle 변형 전용. */ .entry-content .art-cards--even > li > strong:first-child + br, .entry-content .art-cards--circle > li > strong:first-child + br { display: none; } /* [feat @yuri 2026-08-03] 의료정보 신뢰 정보(E-E-A-T) — 작성·감수·검토일·참고문헌 박스. singles(treatment/disease/symptom/healthinfo) 본문 하단. 색은 전부 토큰(리터럴 금지). */ /* [fix @yuri 2026-09-02] 폭을 본문(.article)과 동일 공식으로 — 기존 `max-width: var(--content-medium,1100px)` 는 ① `--content-medium` 토큰이 어디에도 정의돼 있지 않아 항상 폴백 1100px 로 떨어지고 ② single 폭 통일 규칙(layout.css `body.single .breadcrumb,…`)의 셀렉터 목록에서 med-trust 만 빠져 있어 데스크톱에서 본문 1193 vs 신뢰박스 1100 으로 어긋났다(사용자 제보). 데스크톱·태블릿은 layout.css 에 med-trust 를 합류시켜 해결했고, 이 기본 규칙은 모바일(<768) 담당 — .article 기본과 같은 공식. */ .med-trust{margin: 28px auto 0;width: min(100% - (var(--gutter) * 2),var(--container-md));max-width: none;padding: 16px;background: var(--bg-2);border: 1px solid var(--line-2);border-radius: var(--r);} .med-trust__grid{margin: 0;padding: 0;display: grid;grid-template-columns: 1fr;gap: 0;} .med-trust__row{display: grid;grid-template-columns: 88px 1fr;gap: 10px;align-items: baseline;padding: 6px 0;} .med-trust__row dt{font-size: 12px;color: var(--ink-500);font-weight: 600;letter-spacing: -0.01em;} .med-trust__row dd{margin: 0;font-size: 13.5px;color: var(--ink-800);word-break: keep-all;} .med-trust__refs{margin-top: 10px;padding-top: 10px;border-top: 1px solid var(--line-2);} .med-trust__refs-title{margin: 0 0 6px;font-size: 12.5px;font-weight: 700;color: var(--ink-700);} .med-trust__refs-list{list-style: none;margin: 0;padding: 0;display: grid;gap: 4px;} .med-trust__refs-list li{font-size: 13px;color: var(--ink-700);line-height: 1.55;word-break: keep-all;overflow-wrap: anywhere;} .med-trust__refs-list a{color: var(--navy-700);text-decoration: underline;text-underline-offset: 2px;} @media (min-width: 768px){ .med-trust{padding: 18px 22px;} .med-trust__grid{grid-template-columns: repeat(2,minmax(0,1fr));column-gap: 24px;} .med-trust__row{grid-template-columns: 96px 1fr;} }