/* 검색 4종 전용 작업면. 결과 데이터·공통 헤더·실손 studio에는 적용하지 않는다. */ @media screen { body.insurance-service-minimal.search-service-studio-page { background: #fff !important; } body.insurance-service-minimal.search-service-studio-page.search-studio-dialog-open, body.insurance-service-minimal.search-service-studio-page.hospital-location-permission-open { overflow: hidden !important; overscroll-behavior: contain; } body.insurance-service-minimal.search-service-studio-page #searchServiceStudio { box-sizing: border-box; width: 100% !important; max-width: none !important; margin: 70px 0 0 !important; padding: 4px 24px 48px !important; background: #fff !important; } #searchServiceStudio .search-studio-shell { width: 100%; max-width: 1200px; margin: 0 auto; } #searchServiceStudio .search-studio-tabs { display: flex; gap: 28px; min-height: 44px; border-bottom: 1px solid #e4e7eb; } #searchServiceStudio .search-studio-tabs a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 4px; border-bottom: 3px solid transparent; color: #747c88; font-size: 14px; font-weight: 600; text-decoration: none; } #searchServiceStudio .search-studio-tabs a[aria-current="page"] { border-bottom-color: #ffda30; color: #222934; font-weight: 750; } #searchServiceStudio .search-studio-intro { display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding: 14px 0 6px; } #searchServiceStudio .search-studio-intro h1 { margin: 0; color: #242b35; font-size: 23px; font-weight: 760; line-height: 1.4; letter-spacing: -0.05em; } #searchServiceStudio .search-studio-intro p { display: none; margin: 0; color: #727c8a; font-size: 14px; line-height: 1.7; } #searchServiceStudio .search-studio-mobile-art { display: block; order: -1; flex: 0 0 54px; width: 54px; height: 54px; object-fit: contain; } #searchServiceStudio .search-studio-family-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; grid-template-rows: min-content 1fr; align-items: start; gap: 12px 24px; } #searchServiceStudio .search-studio-workbench { grid-column: 1; grid-row: 1; display: block; width: 100%; max-width: 600px; min-width: 0; } #searchServiceStudio .search-studio-family-layout > .search-studio-results { grid-column: 1; grid-row: 2; margin-top: 0 !important; } #searchServiceStudio .search-studio-conditions { min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; } #searchServiceStudio .search-studio-conditions > summary { display: none; grid-template-columns: minmax(0, 1fr) 30px; align-items: center; column-gap: 14px; min-height: 44px; color: #303744; font-size: 16px; font-weight: 700; line-height: 1.5; list-style: none; cursor: pointer; } #searchServiceStudio .search-studio-conditions > summary::-webkit-details-marker { display: none; } #searchServiceStudio [data-studio-context] { grid-column: 1; color: #758091; font-size: 12px; font-weight: 500; line-height: 1.7; overflow-wrap: anywhere; } #searchServiceStudio [data-studio-context]:empty { display: none; } #searchServiceStudio .search-studio-summary-icon { grid-column: 2; grid-row: 1 / span 2; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #f5f6f8; color: #7d8695; font-size: 12px; } #searchServiceStudio .search-studio-conditions[open] .search-studio-summary-icon { transform: rotate(180deg); } #searchServiceStudio .search-studio-conditions:not([open]) > :not(summary), #searchServiceStudio .hospital-advanced-search:not([open]) > :not(summary) { display: none !important; } #searchServiceStudio .search-sidebar { display: block !important; position: static !important; width: 100% !important; min-width: 0 !important; min-height: 0 !important; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; } #searchServiceStudio .search-form-container { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } #searchServiceStudio .search-form { display: grid !important; grid-template-columns: minmax(0, 1fr) 138px !important; align-items: end; gap: 14px !important; margin: 0 !important; padding: 0 !important; } #searchServiceStudio .search-form .form-group { min-width: 0; margin: 0 !important; padding: 0 !important; } #searchServiceStudio .search-form .form-group > label { display: block !important; margin: 0 0 8px !important; color: #626d7c !important; font-size: 12px !important; font-weight: 650 !important; line-height: 1.5 !important; } #searchServiceStudio .search-form .form-control, #searchServiceStudio .hospital-region-trigger { box-sizing: border-box !important; width: 100% !important; height: 46px !important; min-height: 46px !important; padding: 10px 12px !important; border: 1px solid #d9dfe7 !important; border-radius: 8px !important; background: #fff !important; color: #303846 !important; font-family: inherit !important; font-size: 16px !important; box-shadow: none !important; -webkit-appearance: none; appearance: none; } #searchServiceStudio .search-form input.form-control:focus, #searchServiceStudio .search-form textarea.form-control:focus { border-color: #d9dfe7 !important; outline: none !important; box-shadow: none !important; } #searchServiceStudio .search-form select.form-control { padding-right: 28px !important; -webkit-appearance: auto; appearance: auto; } #searchServiceStudio .search-form .form-control:disabled, #searchServiceStudio .hospital-region-trigger:disabled { background: #f5f6f8 !important; color: #939ba7 !important; } #searchServiceStudio .search-form .form-hint { margin: 7px 0 0 !important; padding: 0 !important; background: transparent !important; color: #8b94a1 !important; font-size: 11px !important; line-height: 1.55 !important; } #searchServiceStudio .search-btn-primary { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important; width: 100% !important; min-height: 46px !important; height: auto !important; margin: 0 !important; padding: 12px 16px !important; border: 1px solid #ffda30 !important; border-radius: 8px !important; background: #ffda30 !important; color: #282d35 !important; font-size: 14px !important; font-weight: 750 !important; box-shadow: none !important; transform: none !important; -webkit-appearance: none; appearance: none; } #searchServiceStudio .search-btn-primary:disabled { border-color: #e7eaf0 !important; background: #eceff3 !important; color: #7a8492 !important; } #searchServiceStudio[data-studio-service="surgery"] .search-form > .form-group:nth-child(2) { grid-column: 1 / -1; grid-row: 2; } #searchServiceStudio[data-studio-service="surgery"] .search-form > button { grid-column: 2; grid-row: 1; } #searchServiceStudio .search-filters-badge { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 7px !important; margin: 0 !important; } #searchServiceStudio .filter-badge { position: relative; display: flex !important; align-items: center !important; justify-content: center !important; min-width: 0 !important; min-height: 46px !important; margin: 0 !important; padding: 9px 6px !important; border: 1px solid #dfe4eb !important; border-radius: 8px !important; background: #fff !important; color: #727d8d !important; font-size: 13px !important; box-shadow: none !important; transform: none !important; } #searchServiceStudio .filter-badge.active { border-color: #e8c72e !important; background: #fff9dc !important; color: #30343c !important; font-weight: 700 !important; } #searchServiceStudio .filter-badge input { display: block !important; position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; opacity: 0 !important; clip: rect(0, 0, 0, 0); clip-path: inset(50%); } #searchServiceStudio[data-studio-service="nonpayment"] .search-form { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #searchServiceStudio[data-studio-service="nonpayment"] .search-form > button { grid-column: 1 / -1; } #searchServiceStudio[data-studio-service="hospital"] .search-form { display: block !important; } #searchServiceStudio .hospital-primary-search { display: grid !important; grid-template-columns: minmax(160px, 0.7fr) minmax(180px, 1fr) 130px !important; align-items: end !important; gap: 12px !important; } #searchServiceStudio .hospital-advanced-search { display: block !important; margin: 20px 0 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; } #searchServiceStudio .hospital-advanced-search > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; color: #566479; font-size: 13px; font-weight: 650; cursor: pointer; } #searchServiceStudio .hospital-advanced-search > summary small { color: #8d97a5; font-size: 11px; font-weight: 500; } #searchServiceStudio .hospital-advanced-heading { display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px !important; margin-bottom: 14px; } #searchServiceStudio .hospital-advanced-heading > div { display: none !important; } #searchServiceStudio .hospital-advanced-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; } #searchServiceStudio .hospital-pc-location-tools { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin: 0 !important; } #searchServiceStudio .hospital-pc-location-tools button { min-height: 44px !important; min-width: 44px !important; padding: 8px 12px !important; border: 1px solid #dfe4eb !important; border-radius: 7px !important; background: #fff !important; color: #586981 !important; font-size: 12px !important; } #searchServiceStudio .hospital-region-option { min-height: 44px; } #searchServiceStudio .search-studio-art { text-align: center; } #searchServiceStudio .search-studio-art img { display: block; width: 250px; max-width: 100%; height: auto; aspect-ratio: 1; margin: 0 auto; object-fit: contain; } #searchServiceStudio .search-studio-art p { margin: 4px 0 0; color: #738096; font-size: 13px; line-height: 1.6; } #searchServiceStudio .search-studio-note { margin: 10px 0 0; color: #8b95a4; font-size: 12px; line-height: 1.75; } /* 검색 후에는 입력을 접고 실제 결과가 이어지는 한 문서 흐름을 유지한다. */ #searchServiceStudio.search-studio-has-feedback .search-studio-workbench { display: block; } #searchServiceStudio.search-studio-has-feedback .search-studio-art { display: none; } #searchServiceStudio.search-studio-has-feedback .search-studio-conditions { padding: 0; border-radius: 0; background: transparent; } #searchServiceStudio.search-studio-has-feedback .search-studio-conditions > summary { display: grid; font-size: 14px; } #searchServiceStudio.search-studio-has-feedback .search-studio-conditions[open] .search-form-container { margin-top: 8px !important; } #searchServiceStudio:not(.search-studio-has-feedback) .search-studio-results { display: none !important; } #searchServiceStudio .search-studio-results { display: block !important; position: static !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: auto !important; max-height: none !important; margin: 24px 0 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; } #searchServiceStudio[data-studio-service="disease"] .search-studio-results, #searchServiceStudio[data-studio-service="surgery"] .search-studio-results, #searchServiceStudio[data-studio-service="nonpayment"] .search-studio-results { box-sizing: border-box; padding: var(--studio-result-padding, 18px) !important; border-radius: 16px !important; background: #f3f5f8 !important; } #searchServiceStudio .insu-info-disease-results-wrap, #searchServiceStudio .insu-info-surgery-results-wrap, #searchServiceStudio .insu-info-hospital-search-results-wrap, #searchServiceStudio .insu-info-hospital-info-results-wrap { display: block !important; position: static !important; inset: auto !important; width: 100% !important; min-width: 0 !important; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; overflow: visible !important; opacity: 1 !important; transform: none !important; } #searchServiceStudio .search-placeholder { display: none !important; } #searchServiceStudio .surgery-results-mobile-header, #searchServiceStudio .surgery-results-mobile-header .insu-link-mobile-header-inner { display: block !important; position: static !important; width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } #searchServiceStudio .search-studio-results .insu-info-mobile-back-btn, #searchServiceStudio .search-studio-results .insu-info-disease-results-back, #searchServiceStudio .search-studio-results .insu-link-mobile-fchome { display: none !important; } #searchServiceStudio .results-header { display: grid !important; grid-template-columns: minmax(0, 1fr) 44px !important; grid-template-areas: "title refresh" "summary refresh" !important; align-items: center !important; gap: 8px 14px !important; min-height: 64px !important; margin: 0 0 20px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; overflow: visible !important; } #searchServiceStudio .results-title-section { grid-area: title; display: flex !important; flex-wrap: wrap; align-items: baseline !important; gap: 8px 14px !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } #searchServiceStudio .results-title-section h3 { margin: 0 !important; color: #303846 !important; font-size: 21px !important; font-weight: 750 !important; line-height: 1.5 !important; } #searchServiceStudio .results-summary { grid-area: summary; display: flex !important; flex-wrap: wrap; gap: 7px 12px !important; flex: 0 0 auto !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #718096 !important; font-size: 13px !important; line-height: 1.6 !important; white-space: normal !important; overflow: visible !important; } #searchServiceStudio .result-count, #searchServiceStudio .search-info, #searchServiceStudio .source-badge { min-width: 0 !important; margin: 0 !important; color: #758194 !important; font-size: 12px !important; line-height: 1.65 !important; white-space: normal !important; overflow: visible !important; } #searchServiceStudio .insu-info-results-refresh { grid-area: refresh; display: inline-flex !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; width: 44px !important; min-width: 44px !important; height: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; border: 1px solid #e0e5ec !important; border-radius: 8px !important; background: #fff !important; color: #758091 !important; } #searchServiceStudio .results-content, #searchServiceStudio #searchResultsContainer > .results-content { display: block !important; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; overflow: visible !important; } #searchServiceStudio[data-studio-service="disease"] .search-studio-results .results-content, #searchServiceStudio[data-studio-service="surgery"] .search-studio-results .results-content, #searchServiceStudio[data-studio-service="nonpayment"] .search-studio-results .results-content { background: transparent !important; } #searchServiceStudio #results .result-items, #searchServiceStudio #searchResultsContainer .results-grid, #searchServiceStudio #resultsList { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; } #searchServiceStudio #results .result-item, #searchServiceStudio #searchResultsContainer .result-card, #searchServiceStudio #resultsList .hospital-select-card, #searchServiceStudio #resultsList .nonpayment-result-card, #searchServiceStudio #resultsList .hospital-result-card { box-sizing: border-box !important; min-width: 0 !important; margin: 0 !important; padding: 22px !important; border: 1px solid #e0e5ec !important; border-radius: 14px !important; background: #fff !important; box-shadow: none !important; opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; } #searchServiceStudio #results .result-item::before, #searchServiceStudio #resultsList .hospital-result-card::before { display: none !important; } #searchServiceStudio #results .disease-code-section { display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px !important; margin: 0 0 14px !important; } #searchServiceStudio #results .disease-code { display: inline-flex !important; align-items: center; min-height: 30px !important; padding: 4px 10px !important; border: 0 !important; border-radius: 5px !important; background: #edf2f7 !important; color: #304866 !important; font-size: 14px !important; font-weight: 750 !important; } #searchServiceStudio #results .badge-group { display: flex; flex-wrap: wrap; gap: 5px; } #searchServiceStudio #results .badge-group > span, #searchServiceStudio #resultsList .hospital-select-meta .meta-badge, #searchServiceStudio #resultsList .hospital-meta .meta-badge { padding: 4px 7px !important; border: 0 !important; border-radius: 5px !important; background: #f4f6f8 !important; color: #748092 !important; font-size: 11px !important; line-height: 1.5 !important; } #searchServiceStudio #results .disease-name, #searchServiceStudio #searchResultsContainer .surgery-name, #searchServiceStudio #resultsList .hospital-name { margin: 0 0 8px !important; color: #2d3644 !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.6 !important; overflow-wrap: anywhere; } #searchServiceStudio #results .disease-eng-name { margin: 0 !important; color: #8490a0 !important; font-size: 12px !important; font-style: normal !important; line-height: 1.65 !important; overflow-wrap: anywhere; } #searchServiceStudio #results .disease-actions { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 7px !important; margin: 18px 0 0 !important; } #searchServiceStudio #results .btn-stats { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important; min-width: 0 !important; min-height: 44px !important; margin: 0 !important; padding: 8px 5px !important; border: 1px solid #e0e5ec !important; border-radius: 7px !important; background: #fff !important; color: #576a84 !important; font-size: 12px !important; line-height: 1.5 !important; box-shadow: none !important; transform: none !important; } #searchServiceStudio #results .btn-stats .btn-text { display: inline !important; } #searchServiceStudio #searchResultsContainer .n-level-card { grid-column: 1 / -1; } #searchServiceStudio #searchResultsContainer .standard-types { display: flex !important; flex-wrap: wrap; gap: 7px !important; margin: 12px 0 !important; } #searchServiceStudio #searchResultsContainer .type-badge { padding: 6px 9px !important; border: 0 !important; border-radius: 6px !important; background: #f0f3f8 !important; color: #526782 !important; font-size: 12px !important; line-height: 1.6 !important; white-space: normal !important; } #searchServiceStudio #searchResultsContainer .surgery-description { margin: 0 !important; color: #788497 !important; font-size: 14px !important; line-height: 1.85 !important; } #searchServiceStudio #searchResultsContainer .surgery-description-wrapper { border-top: 0 !important; } #searchServiceStudio #searchResultsContainer .n-level-company-section, #searchServiceStudio #searchResultsContainer .n-level-company-header, #searchServiceStudio #searchResultsContainer .n-level-disease-section { border: 0 !important; box-shadow: none !important; } #searchServiceStudio .search-studio-empty { padding: 24px; border: 1px solid #e0e5ec; border-radius: 14px; background: #fafbfc; color: #748297; font-size: 14px; line-height: 1.75; } #searchServiceStudio .search-studio-empty strong { display: block; margin-bottom: 6px; color: #53637a; font-size: 16px; } #searchServiceStudio .search-studio-empty p { margin: 0; } #searchServiceStudio #searchResultsContainer .insurance-section { margin-top: 10px !important; padding: 0 !important; border: 0 !important; } #searchServiceStudio #searchResultsContainer .description-more-btn, #searchServiceStudio #searchResultsContainer .insurance-toggle { min-height: 44px !important; padding: 8px !important; color: #536d91 !important; } #searchServiceStudio #resultsList .filter-guide-message, #searchServiceStudio #resultsList .breadcrumb-nav, #searchServiceStudio #resultsList .no-results-message, #searchServiceStudio .no-results { grid-column: 1 / -1 !important; margin: 0 !important; padding: 14px 0 !important; border: 0 !important; background: transparent !important; color: #758295 !important; line-height: 1.7 !important; } #searchServiceStudio #resultsList .breadcrumb-nav a { display: inline-flex; align-items: center; min-height: 44px; } #searchServiceStudio #resultsList .hospital-select-card { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 14px !important; text-align: left !important; font: inherit; cursor: pointer; } #searchServiceStudio #resultsList .hospital-select-name { display: block !important; margin: 0 0 10px !important; color: #354152 !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.6 !important; } #searchServiceStudio #resultsList .hospital-select-meta { display: flex !important; flex-wrap: wrap; gap: 6px; } #searchServiceStudio #resultsList .hospital-select-arrow { display: flex !important; align-items: center; justify-content: flex-end; gap: 8px; margin-top: auto; color: #76869c !important; font-size: 12px !important; } #searchServiceStudio #resultsList .hospital-addr { display: block; margin-top: 10px; color: #7d8a9d; font-size: 12px; line-height: 1.7; } #searchServiceStudio #resultsList .nonpayment-result-card { display: block !important; } #searchServiceStudio #resultsList .nonpayment-info { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; } #searchServiceStudio #resultsList .nonpayment-item-name { display: block !important; margin: 0 0 20px !important; color: #3a4658 !important; font-size: 16px !important; font-weight: 650 !important; line-height: 1.65 !important; } #searchServiceStudio #resultsList .price-row { display: grid !important; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important; align-items: end; gap: 12px !important; margin: 0 !important; padding: 0 !important; } #searchServiceStudio #resultsList .price-box { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } #searchServiceStudio #resultsList .price-label { margin-bottom: 6px !important; color: #8590a0 !important; font-size: 11px !important; } #searchServiceStudio #resultsList .price-value { color: #344258 !important; font-size: 23px !important; font-weight: 750 !important; line-height: 1.4 !important; font-variant-numeric: tabular-nums; } #searchServiceStudio #resultsList .price-divider { padding-bottom: 4px !important; color: #a2aab6 !important; } #searchServiceStudio #resultsList .apply-date { margin: 18px 0 0 !important; padding: 0 !important; color: #8b96a7 !important; font-size: 11px !important; } #searchServiceStudio #resultsList .hospital-result-card .card-header { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } #searchServiceStudio #resultsList .hospital-meta { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; } #searchServiceStudio #resultsList .hospital-details { margin: 16px 0 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; } #searchServiceStudio #resultsList .detail-row { display: flex !important; align-items: flex-start; gap: 8px !important; margin: 0 !important; padding: 6px 0 !important; border: 0 !important; } #searchServiceStudio #resultsList .detail-content { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 7px; min-width: 0; } #searchServiceStudio #resultsList .detail-label { margin: 0 !important; color: #8793a4 !important; font-size: 11px !important; line-height: 1.8 !important; } #searchServiceStudio #resultsList .detail-value { color: #546377 !important; font-size: 13px !important; line-height: 1.75 !important; overflow-wrap: anywhere; } #searchServiceStudio #resultsList .hospital-extra-info { margin: 10px 0 0 !important; padding: 0 !important; border: 0 !important; } #searchServiceStudio #resultsList .hospital-extra-info > summary { min-height: 44px; padding: 10px 0; color: #6d7f98; font-size: 12px; cursor: pointer; } #searchServiceStudio #resultsList .card-actions { display: flex !important; flex-wrap: wrap; gap: 7px !important; margin: 16px 0 0 !important; padding: 0 !important; border: 0 !important; } #searchServiceStudio #resultsList .action-btn { display: inline-flex !important; flex: 1 1 auto !important; align-items: center !important; justify-content: center !important; gap: 5px; min-height: 44px !important; padding: 9px 11px !important; border: 1px solid #dfe5ee !important; border-radius: 7px !important; background: #fff !important; color: #5b7292 !important; font-size: 12px !important; line-height: 1.6 !important; white-space: normal !important; box-shadow: none !important; } #searchServiceStudio .pagination-wrapper, #searchServiceStudio .pagination-container, #searchServiceStudio .load-more-container { margin: 22px 0 0 !important; padding: 0 !important; border: 0 !important; } #searchServiceStudio .page-btn, #searchServiceStudio .pagination button, #searchServiceStudio .load-more-btn { min-width: 44px !important; min-height: 44px !important; } #searchServiceStudio .pagination { flex-wrap: wrap; } #searchServiceStudio a:focus-visible, #searchServiceStudio button:focus-visible, #searchServiceStudio .search-studio-help-panel:focus-visible, #searchServiceStudio summary:focus-visible, #searchServiceStudio .filter-badge:focus-within { outline: 2px solid #475569 !important; outline-offset: 3px !important; } body.search-service-studio-page .search-studio-legacy-dom, body.search-service-studio-page .mobile-search-interface, body.search-service-studio-page .mobile-search-results, body.search-service-studio-page .mobile-search-overlay, body.search-service-studio-page .mobile-search-bottom-sheet, body.search-service-studio-page .mobile-floating-buttons, body.search-service-studio-page .mobile-search-trigger { display: none !important; } body.search-service-studio-page .description-modal-close, body.search-service-studio-page .close-modal { box-sizing: border-box; flex: 0 0 44px; width: 44px !important; min-width: 44px; height: 44px !important; min-height: 44px; padding: 0; } body.search-service-studio-page .description-modal-close:focus-visible, body.search-service-studio-page .close-modal:focus-visible { outline: 2px solid #475569; outline-offset: 3px; } } @media screen and (max-width: 1024px) { html:not([data-is-tablet-mode="desktop"]) body.insurance-service-minimal.search-service-studio-page #searchServiceStudio { margin: 0 !important; padding: var(--mobile-primary-header-height, 110px) 16px calc(32px + env(safe-area-inset-bottom, 0px)) !important; } #searchServiceStudio .search-studio-tabs { gap: 0; } #searchServiceStudio .search-studio-tabs a { flex: 1 1 20%; min-width: 0; min-height: 44px; padding: 0 2px; font-size: 12px; white-space: nowrap; } #searchServiceStudio .search-studio-intro { gap: 10px; padding: 14px 0 6px; } #searchServiceStudio .search-studio-intro h1 { font-size: 22px; } #searchServiceStudio .search-studio-intro p { font-size: 13px; } #searchServiceStudio .search-studio-mobile-art { display: block; order: -1; flex: 0 0 54px; width: 54px; height: 54px; object-fit: contain; } #searchServiceStudio .search-studio-workbench { display: block; } #searchServiceStudio .search-studio-art { display: none; } #searchServiceStudio .search-studio-conditions { padding: 0; } #searchServiceStudio .hospital-primary-search { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #searchServiceStudio .hospital-primary-search > button { grid-column: 1 / -1; } #searchServiceStudio .hospital-pc-location-tools .hospital-saved-location, #searchServiceStudio .hospital-nearby-label-pc { display: none !important; } #searchServiceStudio .hospital-nearby-label-mobile { display: inline !important; } } @media screen and (max-width: 600px) { #searchServiceStudio[data-studio-service="hospital"] .hospital-primary-search { grid-template-columns: minmax(0, 1fr) 90px !important; gap: 12px 8px !important; } #searchServiceStudio[data-studio-service="hospital"] .hospital-primary-search > .form-group:first-child { grid-column: 1 / -1; grid-row: 1; } #searchServiceStudio[data-studio-service="hospital"] .hospital-primary-search > .form-group:nth-child(2) { grid-column: 1; grid-row: 2; } #searchServiceStudio[data-studio-service="hospital"] .hospital-primary-search > button { grid-column: 2; grid-row: 2; } #searchServiceStudio .search-studio-intro h1 { font-size: 22px; } #searchServiceStudio .search-studio-intro p { font-size: 12px; } #searchServiceStudio .search-studio-conditions { padding-inline: 0; } #searchServiceStudio[data-studio-service="surgery"] .search-form, #searchServiceStudio[data-studio-service="nonpayment"] .search-form { grid-template-columns: minmax(0, 1fr) 90px !important; gap: 12px 8px !important; } #searchServiceStudio[data-studio-service="surgery"] .search-form > .form-group:first-child, #searchServiceStudio[data-studio-service="nonpayment"] .search-form > .form-group:first-child { grid-column: 1; grid-row: 1; } #searchServiceStudio[data-studio-service="nonpayment"] .search-form > .form-group:nth-child(2) { grid-column: 1 / -1; grid-row: 2; } #searchServiceStudio[data-studio-service="surgery"] .search-form > button, #searchServiceStudio[data-studio-service="nonpayment"] .search-form > button { grid-column: 2; grid-row: 1; } #searchServiceStudio[data-studio-service="nonpayment"] .search-form > .form-group:first-child .form-hint { display: none !important; } #searchServiceStudio[data-studio-service="surgery"] .search-form .search-btn-primary, #searchServiceStudio[data-studio-service="nonpayment"] .search-form .search-btn-primary, #searchServiceStudio[data-studio-service="hospital"] .search-form .search-btn-primary { box-sizing: border-box !important; height: 46px !important; min-height: 46px !important; padding: 8px 3px !important; gap: 0 !important; font-size: 13px !important; line-height: 1.5 !important; white-space: nowrap !important; } #searchServiceStudio[data-studio-service="surgery"] .search-form .search-btn-primary i, #searchServiceStudio[data-studio-service="nonpayment"] .search-form .search-btn-primary i, #searchServiceStudio[data-studio-service="hospital"] .search-form .search-btn-primary i { display: none !important; } #searchServiceStudio #results .result-items, #searchServiceStudio #searchResultsContainer .results-grid, #searchServiceStudio #resultsList { grid-template-columns: minmax(0, 1fr) !important; } #searchServiceStudio #results .result-item, #searchServiceStudio #searchResultsContainer .result-card, #searchServiceStudio #resultsList .hospital-select-card, #searchServiceStudio #resultsList .nonpayment-result-card, #searchServiceStudio #resultsList .hospital-result-card { padding: 20px !important; } #searchServiceStudio #results .btn-stats i { display: none !important; } #searchServiceStudio #results .disease-name, #searchServiceStudio #searchResultsContainer .surgery-name, #searchServiceStudio #resultsList .hospital-name { font-size: 17px !important; } #searchServiceStudio #resultsList .price-value { font-size: 21px !important; } #searchServiceStudio .results-title-section h3 { font-size: 19px !important; } #searchServiceStudio .hospital-advanced-grid { grid-template-columns: minmax(0, 1fr) !important; } } @media screen { html[data-is-tablet-mode="mobile"] body.insurance-service-minimal.search-service-studio-page #searchServiceStudio { margin: 0 !important; padding: var(--mobile-primary-header-height, 110px) 16px calc(32px + env(safe-area-inset-bottom, 0px)) !important; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-workbench { display: block; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-art { display: none; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-mobile-art { display: block; order: -1; flex: 0 0 54px; width: 54px; height: 54px; object-fit: contain; } html[data-is-tablet-mode="desktop"] body.insurance-service-minimal.search-service-studio-page #searchServiceStudio { margin: 70px 0 0 !important; padding: 4px 24px 48px !important; } } @media screen { #searchServiceStudio .search-studio-guide { grid-column: 2; grid-row: 1 / span 2; align-self: start; min-width: 0; } #searchServiceStudio .search-studio-guide-disclosure { margin: 0; padding: 0; border: 0; background: transparent; } #searchServiceStudio .search-studio-guide-disclosure > summary { display: none; } #searchServiceStudio .search-studio-guide-disclosure:not([open]) > :not(summary) { display: none !important; } #searchServiceStudio .search-studio-phone { box-sizing: border-box; width: 100%; padding: 18px 14px 14px; border: 6px solid #424a56; border-radius: 32px; background: #f8fafc; color: #303946; } #searchServiceStudio .search-studio-phone-speaker { display: block; width: 36px; height: 4px; margin: 0 auto 17px; border-radius: 4px; background: #69717c; } #searchServiceStudio .search-studio-phone h2 { margin: 0 0 8px; color: #303946; font-size: 17px; font-weight: 750; line-height: 1.5; letter-spacing: -0.04em; } #searchServiceStudio .search-studio-guide-lead { margin: 0 0 14px; color: #6b7687; font-size: 12px; line-height: 1.6; } #searchServiceStudio .search-studio-guide-queries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; } #searchServiceStudio .search-studio-guide-queries button { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 3px; box-sizing: border-box; min-width: 0; min-height: 54px; margin: 0; padding: 8px; border: 1px solid #e3e7ec; border-radius: 9px; background: #fff; color: #374151; font-family: inherit; font-size: 12px; font-weight: 650; line-height: 1.5; text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none; } #searchServiceStudio .search-studio-guide-queries button small { color: #8a7540; font-size: 11px; font-weight: 600; } #searchServiceStudio .search-studio-guide-queries button:hover { border-color: #e0c13a; background: #fffbed; } #searchServiceStudio .search-studio-guide-source { display: flex; align-items: center; gap: 4px; min-height: 44px; margin-top: 7px; color: #758093; font-size: 10px; line-height: 1.6; text-decoration: underline; text-underline-offset: 2px; } #searchServiceStudio .search-studio-guide-steps { list-style: none; counter-reset: guide-step; margin: 18px 0 0; padding: 0; } #searchServiceStudio .search-studio-guide-steps li { display: grid; grid-template-columns: 27px minmax(0, 1fr); gap: 9px; counter-increment: guide-step; margin: 0; padding: 13px 0; } #searchServiceStudio .search-studio-guide-steps li::before { content: counter(guide-step); display: flex; align-items: center; justify-content: center; width: 27px; height: 27px; border-radius: 50%; background: #fff0a4; color: #776529; font-size: 12px; font-weight: 700; } #searchServiceStudio .search-studio-guide-steps strong { color: #424d5c; font-size: 13px; font-weight: 700; line-height: 1.7; } #searchServiceStudio .search-studio-guide-steps p { margin: 4px 0 0; color: #758093; font-size: 12px; line-height: 1.7; } /* 세 검색의 탭형 도움말. 기존 병원·지도 안내는 별도 접힘을 유지한다. */ #searchServiceStudio .search-studio-guide-tabs { --guide-phone-min-height: 570px; --guide-phone-padding: 18px 12px 20px; --guide-phone-border: 6px solid #424a56; --guide-phone-radius: 32px; --guide-phone-background: #f8fafc; --guide-chrome-display: block; --guide-tile-height: 54px; --guide-tile-columns: 14px minmax(0, 1fr); --guide-code-column: 2; --guide-code-row: 2; --guide-panel-bottom: 18px; } #searchServiceStudio .search-studio-guide-tabs [hidden] { display: none !important; } #searchServiceStudio .search-studio-guide-tabs .search-studio-phone { display: flex; flex-direction: column; min-height: var(--guide-phone-min-height); padding: var(--guide-phone-padding); border: var(--guide-phone-border); border-radius: var(--guide-phone-radius); background: var(--guide-phone-background); overflow: visible; } #searchServiceStudio .search-studio-guide-tabs .search-studio-phone::after { content: ""; display: var(--guide-chrome-display); flex: 0 0 4px; width: 76px; height: 4px; margin: auto auto 0; border-radius: 4px; background: #69717c; } #searchServiceStudio .search-studio-guide-tabs .search-studio-phone-speaker, #searchServiceStudio .search-studio-guide-tabs .search-studio-phone h2, #searchServiceStudio .search-studio-guide-tabs .search-studio-guide-lead { display: var(--guide-chrome-display); } #searchServiceStudio .search-studio-help-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; padding: 3px; border: 1px solid #e3e7ec; border-radius: 10px; background: #edf0f4; } #searchServiceStudio .search-studio-help-tabs [role="tab"] { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 0; min-height: 44px; margin: 0; padding: 5px 2px; border: 0; border-radius: 7px; background: transparent; color: #677386; font-family: inherit; font-size: 11px; font-weight: 650; line-height: 1.5; white-space: nowrap; cursor: pointer; -webkit-appearance: none; appearance: none; } #searchServiceStudio .search-studio-help-tabs [role="tab"][aria-selected="true"] { background: #fff; color: #303946; box-shadow: inset 0 -3px #ffda30; font-weight: 750; } #searchServiceStudio .search-studio-help-panel { min-width: 0; margin: 12px 0 var(--guide-panel-bottom); } #searchServiceStudio .search-studio-help-panel h3 { margin: 3px 0 12px; color: #424d5c; font-size: 13px; font-weight: 750; line-height: 1.6; } #searchServiceStudio .search-studio-guide-tabs .search-studio-guide-queries { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; } #searchServiceStudio .search-studio-guide-tabs .search-studio-guide-queries button { display: grid; grid-template-columns: var(--guide-tile-columns); align-content: center; align-items: center; justify-content: normal; column-gap: 6px; row-gap: 1px; min-height: var(--guide-tile-height); padding: 8px; border-color: #dfe5ec; border-radius: 9px; color: #374151; font-size: 12px; } #searchServiceStudio .search-studio-guide-tabs .search-studio-guide-queries button i { grid-column: 1; grid-row: 1; color: #6c7f99; font-size: 11px; } #searchServiceStudio .search-studio-guide-tabs .search-studio-guide-queries button span { grid-column: 2; grid-row: 1; min-width: 0; overflow-wrap: anywhere; } #searchServiceStudio .search-studio-guide-tabs .search-studio-guide-queries button small { grid-column: var(--guide-code-column); grid-row: var(--guide-code-row); color: #7b8798; font-size: 10px; } #searchServiceStudio .search-studio-quick-toggle { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; margin: 0; padding: 8px 2px; border: 0; background: transparent; color: #55657b; font-family: inherit; font-size: 12px; font-weight: 650; line-height: 1.6; text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none; } #searchServiceStudio .search-studio-quick-toggle[aria-expanded="true"] { margin-bottom: 8px; } } @media screen and (max-width: 1024px) { html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio { --studio-result-padding: 12px; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-family-layout { display: flex; flex-direction: column; gap: 12px; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-workbench { max-width: 600px; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide { width: 100%; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; color: #657080; font-size: 13px; font-weight: 650; line-height: 1.6; list-style: none; cursor: pointer; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-disclosure > summary::-webkit-details-marker { display: none; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-phone { padding: 8px 0 4px; border: 0; border-radius: 0; background: transparent; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-phone-speaker, html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-phone h2, html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-lead { display: none; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-queries { grid-template-columns: repeat(4, minmax(0, 1fr)); } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-queries button { font-size: 12px; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-steps { margin: 0; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-family-layout > .search-studio-results { margin-top: 0 !important; } html:not([data-is-tablet-mode="desktop"]) #searchServiceStudio .search-studio-guide-tabs { --guide-phone-min-height: 0; --guide-phone-padding: 0; --guide-phone-border: 0; --guide-phone-radius: 0; --guide-phone-background: transparent; --guide-chrome-display: none; --guide-tile-height: 44px; --guide-tile-columns: 14px minmax(0, 1fr) auto; --guide-code-column: 3; --guide-code-row: 1; --guide-panel-bottom: 0; } } @media screen { html[data-is-tablet-mode="mobile"] #searchServiceStudio { --studio-result-padding: 12px; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-family-layout { display: flex; flex-direction: column; gap: 12px; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-workbench { max-width: 600px; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide { width: 100%; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; color: #657080; font-size: 13px; font-weight: 650; line-height: 1.6; list-style: none; cursor: pointer; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide-disclosure > summary::-webkit-details-marker { display: none; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-phone { padding: 8px 0 4px; border: 0; border-radius: 0; background: transparent; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-phone-speaker, html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-phone h2, html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide-lead { display: none; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide-queries { grid-template-columns: repeat(4, minmax(0, 1fr)); } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide-steps { margin: 0; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-family-layout > .search-studio-results { margin-top: 0 !important; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-intro h1 { font-size: 22px; } html[data-is-tablet-mode="mobile"] #searchServiceStudio .search-studio-guide-tabs { --guide-phone-min-height: 0; --guide-phone-padding: 0; --guide-phone-border: 0; --guide-phone-radius: 0; --guide-phone-background: transparent; --guide-chrome-display: none; --guide-tile-height: 44px; --guide-tile-columns: 14px minmax(0, 1fr) auto; --guide-code-column: 3; --guide-code-row: 1; --guide-panel-bottom: 0; } } @media screen and (max-width: 600px) { #searchServiceStudio .search-studio-guide-queries { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #searchServiceStudio .search-studio-guide-queries button { min-height: 44px; flex-direction: row; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; } } /* 실제 검색·비교에 필요한 정보. 병원·지도 화면에는 적용하지 않는다. */ @media screen { #searchServiceStudio .search-studio-guide-utility .search-studio-guide-caption { margin: 12px 0 0; color: #657080; font-size: 12px; line-height: 1.7; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-more { margin: 10px 0 0; padding: 0; border: 0; background: transparent; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-more > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; color: #4e5a6c; font-size: 12px; font-weight: 700; line-height: 1.6; list-style: none; cursor: pointer; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-more > summary::-webkit-details-marker { display: none; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-more[open] > summary > span { transform: rotate(180deg); } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-more:not([open]) > :not(summary) { display: none !important; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-checks { margin: 2px 0 4px; padding: 0 0 0 16px; color: #657080; font-size: 12px; line-height: 1.75; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-checks li + li { margin-top: 7px; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-links { display: flex; flex-direction: column; margin-top: 5px; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-links a { display: flex; align-items: center; gap: 4px; min-height: 44px; color: #657080; font-size: 11px; line-height: 1.6; text-decoration: underline; text-underline-offset: 2px; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-example-source a { font-size: 10px; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-facts { margin: 6px 0 0; padding: 0; list-style: none; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-facts li { margin: 0; padding: 10px 0; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-facts strong { color: #465264; font-size: 13px; font-weight: 700; line-height: 1.6; } #searchServiceStudio .search-studio-guide-utility .search-studio-guide-facts p { margin: 5px 0 0; color: #657080; font-size: 12px; line-height: 1.7; } }