/* 27차 미리보기(2026-11-01 · ko-ver2) — 치아 이식술: 재식술 모양(r21 · r23~r27 공용 CSS)에 이식술에만 필요한 것. 생성 batch-1101f/r27_tp.py */

/* ‘여러분 몸속에는…’ 띠: 가운데 원 = 띠의 사랑니 사진(치아가 원 가운데), 제목 아래 출처 한 줄 */
.r27tp-band .r20-band__orb img { object-position: 87% 50%; }
.r27tp-band__src { margin: 12px 0 0; text-align: center; font-size: 13px; color: rgba(255,255,255,.6); }

/* 과정: 제목 아래 일정 한 줄 · 6단계(사진 없음) 숫자 칸 */
.r27tp-tl { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 14px; margin: 18px 0 0; }
.r27tp-tl__i { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 14px; border: 1px solid #e3d8c4; font-size: 14px; }
.r27tp-tl__i b { font-weight: 700; color: #1b1916; }
.r27tp-tl__i small { font-size: 13px; color: #a9843e; }
.r27tp-tl__ar { color: #a9843e; }
.r27tp-tile { flex: none; order: 1; display: grid; place-content: center; gap: 6px; aspect-ratio: 5 / 4; border: 1px solid rgba(214,176,104,.28); background: #24201a; text-align: center; transition: opacity .4s; }
.r27tp-tile b { font-size: clamp(40px, 3vw + 12px, 56px); line-height: 1; font-weight: 300; color: #e2c27f; }
.r27tp-tile span { font-size: 14px; color: rgba(255,255,255,.75); }
@media (hover: hover) and (min-width: 768px) {
  .r26-pa .r25-pc:hover > .r27tp-tile, .r26-pa .r25-pc:focus > .r27tp-tile, .r26-pa .r25-pc:focus-within > .r27tp-tile { opacity: .12; }
}

/* 이식 가능 여부: 카드 5개 한 줄(1280px 이상) · 3칸(768~1279px, 둘째 줄 가운데) · 1칸(모바일) */
.r27tp-ck__grid { display: flex; flex-wrap: wrap; justify-content: center; }
.r27tp-ck__grid > li { flex: 0 0 calc((100% - 4 * 14px) / 5); }
.r27tp-ck__p { margin: 0; font-size: 14.5px; line-height: 1.7; color: #5f5a52; word-break: keep-all; }
@media (max-width: 1279px) { .r27tp-ck__grid > li { flex-basis: calc((100% - 2 * 14px) / 3); } }
@media (max-width: 767px) {
  .r27tp-ck__grid { gap: 10px; }
  .r27tp-ck__grid > li { flex-basis: 100%; }
  .r27tp-ck__p { font-size: 14px; }
}
