.cases-main { color: #102d43;background: #f8f7f3;font-family: var(--font-sans, "Pretendard Variable", Pretendard, system-ui, sans-serif);font-size: 16px;line-height: 1.8;word-break: keep-all; }
.cases-main *, .cases-document-dialog * { box-sizing: border-box; }
.cases-main .inner { width: 100%;max-width: 1184px;margin: 0 auto;padding: 0 32px; }
.cases-main button, .cases-main input { font: inherit; }
.cases-main a { text-decoration: none; }
.cases-main .cases-library { padding-top: 64px;padding-bottom: 72px; }
.cases-main .cases-tools { display: flex;flex-wrap: wrap;align-items: flex-end;justify-content: space-between;gap: 20px;padding: 22px;border: 1px solid #ddd8cf;border-radius: 12px;background: #fff; }
.cases-main .cases-filter { display: flex;flex-wrap: wrap;gap: 8px; }
.cases-main .cases-filter-button { display: inline-flex;align-items: center;gap: 9px;min-height: 44px;padding: 9px 14px;border: 1px solid #d6d9df;border-radius: 8px;color: #344653;background: #fff;font-size: 14px;font-weight: 700;cursor: pointer; }
.cases-main .cases-filter-button > span { color: #60717d;font-size: 12px; }
.cases-main .cases-filter-button:hover { background: #f2f4f7; }
.cases-main .cases-filter-button.is-selected { border-color: #102d43;color: #fff;background: #102d43; }
.cases-main .cases-filter-button.is-selected > span { color: #ead0a1; }
.cases-main .cases-result-count { margin: 18px 0 0;color: #60717d;font-size: 14px; }
.cases-main .cases-section { padding: 38px 0 0;border: 0; }
.cases-main .case-list { display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 18px; }
.cases-main .case-item { min-width: 0;overflow: hidden;border: 1px solid #dcd8d0;border-radius: 12px;background: #fff;transition: border-color .2s; }
.cases-main .case-item:hover { border-color: #bda16e; }
.cases-main .case-item.open { grid-column: 1 / -1;border-color: #bda16e; }
.cases-main .case-q { display: flex;align-items: flex-start;justify-content: space-between;gap: 16px;width: 100%;margin: 0;padding: 26px 26px 16px;border: 0;color: #102d43;background: transparent;text-align: left;cursor: pointer; }
.cases-main .case-q-title { color: #102d43;font-size: 22px;font-weight: 800;line-height: 1.6;letter-spacing: -.035em;overflow-wrap: anywhere; }
.cases-main .case-preview { padding: 0 26px 24px; }
.cases-main .case-preview-summary { display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;margin: 0 0 18px;color: #344653;font-size: 16px;line-height: 1.85; }
.cases-main .case-article-link { display: inline-flex;align-items: center;justify-content: space-between;gap: 16px;min-height: 44px;color: #805e25;font-size: 14px;font-weight: 800; }
.cases-main .case-a { padding: 24px 26px 26px;border-top: 1px solid #e9e5dd; }
body.js-enhanced .cases-main .case-item:not(.open) .case-a { display: none; }
.cases-main .case-preview { display: block; }
.cases-main .case-body { display: grid;grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);align-items: start;gap: 32px; }
.cases-main .case-body:not(:has(.case-doc)) { grid-template-columns: minmax(0, 1fr); }
.cases-main .case-text { min-width: 0;color: #344653;font-size: 16px;line-height: 1.9;overflow-wrap: anywhere; }
.cases-main .case-specs { display: grid;gap: 16px;margin: 0;padding: 22px;border-left: 3px solid #b18b4b;border-radius: 0 8px 8px 0;background: #f6f4ef;list-style: none; }
.cases-main .case-specs li { display: grid;grid-template-columns: 72px minmax(0, 1fr);gap: 12px;margin: 0;font-size: 17px;line-height: 1.9; }
.cases-main .case-specs strong { color: #102d43;font-weight: 800; }
.cases-main .case-note { margin: 20px 0 0;padding: 18px 20px;border-radius: 8px;color: #60717d;background: #f6f8fa;font-size: 15px;line-height: 1.9; }
.cases-main .case-inline-content { margin-top: 24px;overflow-x: auto; }
.cases-main .case-inline-content img, .cases-main .case-inline-content video, .cases-main .case-inline-content iframe { max-width: 100%; }
.cases-main .case-inline-content img { height: auto; }
.cases-main .case-inline-content a { color: #805e25;text-decoration: underline; }
.cases-main .case-doc { min-width: 0;margin: 0;padding: 18px;border: 1px solid #e3e6eb;border-radius: 10px;background: #f5f7fa; }
.cases-main .case-document-link { display: flex;flex-direction: column;align-items: stretch;gap: 12px;color: #2464a0; }
.cases-main .case-doc img { display: block;width: 100%;max-width: 100%;max-height: 360px;height: auto;object-fit: contain;background: #fff;cursor: zoom-in; }
.cases-main .case-document-action { display: flex;align-items: center;justify-content: center;gap: 12px;min-height: 44px;border: 1px solid #b9c5d4;border-radius: 6px;background: #fff;color: #2464a0;font-size: 14px;font-weight: 800; }
.cases-main .case-doc figcaption { margin-top: 10px;color: #60717d;font-size: 13px;line-height: 1.8;overflow-wrap: anywhere; }
.cases-main .cases-empty { margin: 28px 0;padding: 44px 24px;border: 1px dashed #b9b2a5;border-radius: 12px;background: #fff;text-align: center; }
.cases-main .cases-empty h3 { margin: 0 0 10px;color: #102d43;font-size: 22px; }
.cases-main .cases-empty p { margin: 0 0 18px;color: #344653;font-size: 16px; }
.cases-main .cases-empty button { min-height: 44px;padding: 10px 20px;border: 1px solid #a7b5c8;border-radius: 6px;color: #2464a0;background: #f4f6f9;font-weight: 700;cursor: pointer; }
.cases-document-dialog { width: min(1040px, calc(100% - 32px));max-width: none;max-height: 92vh;max-height: 92dvh;margin: auto;padding: 0;overflow: hidden;border: 1px solid #d3dae4;border-radius: 12px;color: #102d43;background: #fff;box-shadow: 0 20px 100px #0006;font-family: var(--font-sans, system-ui, sans-serif); }
.cases-document-dialog::backdrop { background: #102d43b8; }
.cases-document-toolbar { display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 8px 16px;padding: 12px 18px;border-bottom: 1px solid #dbe1e9;background: #fff; }
.cases-document-toolbar h2 { flex: 1 1 260px;min-width: 0;margin: 0;color: #102d43;font-size: 16px;font-weight: 800;line-height: 1.7;overflow-wrap: anywhere; }
.cases-document-toolbar > div { display: flex;flex-wrap: wrap;align-items: center;gap: 8px; }
.cases-document-toolbar button, .cases-document-toolbar a { display: inline-flex;align-items: center;min-height: 44px;padding: 10px 12px;border: 1px solid #b7c2d1;border-radius: 6px;color: #2464a0;background: #f7f8fa;text-decoration: none;font: inherit;font-size: 14px;font-weight: 700;cursor: pointer; }
.cases-document-stage { max-height: calc(92vh - 120px);max-height: calc(92dvh - 120px);overflow: auto;padding: 24px;background: #eef4fa;overscroll-behavior: contain; }
.cases-document-stage img { display: block;width: 100%;max-width: 850px;height: auto;margin: 0 auto;background: #fff; }
.cases-document-stage.is-zoomed img { width: 1400px;min-width: 1400px;max-width: none;margin: 0; }
@media (max-width: 900px) {
.cases-main .cases-tools { align-items: stretch; }
.cases-main .case-body { grid-template-columns: 1fr;gap: 24px; }
}
@media (max-width: 640px) {
.cases-main .inner { padding-left: 18px;padding-right: 18px; }
.cases-main .cases-library { padding-top: 38px;padding-bottom: 40px; }
.cases-main .cases-tools { padding: 16px;gap: 18px; }
.cases-main .cases-filter { gap: 8px; }
.cases-main .cases-filter-button { padding: 8px 11px;font-size: 13px; }
.cases-main .cases-section { padding-top: 30px; }
.cases-main .case-list { grid-template-columns: minmax(0, 1fr);gap: 14px; }
.cases-main .case-q { padding: 22px 20px 16px;gap: 12px; }
.cases-main .case-q-title { font-size: 20px;line-height: 1.65; }
.cases-main .case-preview { padding: 0 20px 20px; }
.cases-main .case-a { padding: 20px; }
.cases-main .case-specs { padding: 18px 16px; }
.cases-main .case-specs li { grid-template-columns: minmax(0, 1fr);gap: 4px; }
.cases-main .case-doc { padding: 14px; }
.cases-main .case-doc img { max-height: 280px; }
.cases-document-dialog { width: calc(100% - 16px); }
.cases-document-toolbar { padding: 10px 12px; }
.cases-document-toolbar h2 { flex-basis: 100%;font-size: 15px; }
.cases-document-toolbar > div { gap: 6px; }
.cases-document-toolbar button, .cases-document-toolbar a { padding: 9px 10px;font-size: 13px; }
.cases-document-stage { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
.cases-main .case-item { transition: none; }
}