@charset "utf-8";
/* ============================================================================
   SUDA CUSTOM (2026-10-25): 상품 상세 "숙소 정보" 섹션 (호텔 상품만, extend/suda_hotel_info.lib.extend.php suda_hotel_info_render)
   왼쪽 제목 / 오른쪽 내용, 항목 사이 구분선. 768 이하는 제목이 내용 위로
   ============================================================================ */
.shi{ margin: 0; border-top: 1px solid var(--suda-gray-900, #222); }
.shi-row{ display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; padding: 40px 0; border-bottom: 1px solid #f1f1f1; }
.shi-row dt{ font-size: 17px; font-weight: 600; line-height: 1.5; color: var(--suda-gray-900, #222); }
.shi-row dd{ margin: 0; min-width: 0; }
.shi-text{ font-size: 15px; line-height: 1.75; color: var(--suda-gray-700, #444); overflow-wrap: anywhere; }

.shi-fac{ margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 20px; }
.shi-fac > li{ display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 12px; align-items: start; }
.shi-fac-name{ display: flex; align-items: center; gap: 8px; margin: 0; padding-top: 3px; font-size: 15px; font-weight: 600; color: var(--suda-gray-900, #222); }
.shi-ic{ width: 22px; height: 22px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; color: var(--suda-gray-700, #444); }
.shi-chips{ margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.shi-chips li{ padding: 4px 12px; border-radius: 4px; background: #f5f5f5; font-size: 15px; line-height: 1.5; color: #333; }

@media screen and (max-width:1024px){
    .shi-row{ grid-template-columns: 14.65vw minmax(0, 1fr); gap: 2.34vw; padding: 3.91vw 0; }
    .shi-row dt{ font-size: 1.66vw; }
    .shi-text{ font-size: 1.46vw; }
    .shi-fac{ gap: 1.95vw; }
    .shi-fac > li{ grid-template-columns: 18.55vw minmax(0, 1fr); gap: 1.17vw; }
    .shi-fac-name{ gap: 0.78vw; padding-top: 0.29vw; font-size: 1.46vw; }
    .shi-ic{ width: 2.15vw; height: 2.15vw; }
    .shi-chips{ gap: 0.78vw; }
    .shi-chips li{ padding: 0.39vw 1.17vw; border-radius: 0.39vw; font-size: 1.46vw; }
}
@media screen and (max-width:768px){
    .shi-row{ grid-template-columns: minmax(0, 1fr); gap: 2.08vw; padding: 4.17vw 0; }
    .shi-row dt{ font-size: 2.21vw; }
    .shi-text{ font-size: 1.95vw; }
    .shi-fac{ gap: 3.13vw; }
    .shi-fac > li{ grid-template-columns: minmax(0, 1fr); gap: 1.3vw; }
    .shi-fac-name{ gap: 1.04vw; padding-top: 0; font-size: 1.95vw; }
    .shi-ic{ width: 2.86vw; height: 2.86vw; }
    .shi-chips{ gap: 1.04vw; }
    .shi-chips li{ padding: 0.52vw 1.56vw; border-radius: 0.52vw; font-size: 1.82vw; }
}
@media screen and (max-width:480px){
    .shi-row{ gap: 2.5vw; padding: 5.83vw 0; }
    .shi-row dt{ font-size: 3.54vw; }
    .shi-text{ font-size: 3.13vw; }
    .shi-fac{ gap: 4.58vw; }
    .shi-fac > li{ gap: 2.08vw; }
    .shi-fac-name{ gap: 1.67vw; font-size: 3.13vw; }
    .shi-ic{ width: 4.58vw; height: 4.58vw; }
    .shi-chips{ gap: 1.67vw; }
    .shi-chips li{ padding: 0.83vw 2.5vw; border-radius: 0.83vw; font-size: 2.92vw; }
}