/* board.css: 영역별 규칙 · 한 규칙 한 줄 · 영역 사이 빈 줄 두 개 */ .medis-board { max-width: 1200px; margin: 0px auto; padding: 48px 24px 80px; } .medis-board .board-heading { margin-bottom: 40px; } .medis-board .board-heading h1 { margin: 0px 0px 12px; font-size: clamp(26px, 4vw, 40px); } .medis-board .board-search-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 24px; } .medis-board .board-search { width: min(100%, 520px); } .medis-board .board-search select { flex: 0 0 120px; width: 120px; } .medis-board .board-search-input { display: flex; flex: 1 1 0%; min-width: 0px; gap: 6px; } .medis-board .board-search-input input { width: 100%; min-width: 0px; } .medis-board .board-search-input button { display: grid; place-items: center; } .medis-board .board-detail-heading { padding-bottom: 20px; border-bottom: 1px solid rgb(226, 231, 238); } .medis-board .board-post-title { overflow-wrap: anywhere; } .medis-board .board-detail-actions { display: grid; grid-template-columns: minmax(0px, 1fr) auto minmax(0px, 1fr); gap: 20px; align-items: center; margin-top: 28px; } .medis-board .board-neighbor { display: flex; flex-direction: column; gap: 6px; min-width: 0px; } .medis-board .board-neighbor-next { text-align: right; } .medis-board .board-neighbor-title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .medis-board :is(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--accent, #176dad); outline-offset: 3px; } @media (max-width: 640px) { .medis-board { padding: 32px 16px 56px; } .medis-board .board-search select { flex-basis: 100px; width: 100px; } .medis-board .board-detail-actions { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); } .medis-board .board-back { grid-area: 2 / 1 / auto / -1; justify-self: center; } } .board-page { --accent: #1EA9DC; } .board-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; } .board-toolbar > p { margin: 0px; font-size: 14px; color: rgb(105, 120, 140); } .board-toolbar > p strong { color: rgb(23, 43, 70); font-weight: 650; } .board-search { display: flex; gap: 8px; width: min(100%, 360px); } .board-search input { min-width: 0px; flex: 1 1 0%; } .board-search button { flex-shrink: 0; } .board-categories { display: flex; flex-wrap: wrap; gap: 8px; margin: 0px 0px 24px; } .board-categories a { padding: 10px 18px; min-height: 42px; box-sizing: border-box; border: 1px solid rgb(226, 231, 238); border-radius: 8px; color: rgb(100, 115, 138); text-decoration: none; font-size: 14px; } .board-categories a[aria-current] { background: rgb(30, 169, 220); border-color: rgb(30, 169, 220); color: rgb(255, 255, 255); font-weight: 600; } .medis-board-list { border-top: 2px solid rgb(36, 55, 75); } .medis-board-list a { display: flex; align-items: center; gap: 18px; padding: 24px 16px; border-bottom: 1px solid rgb(230, 235, 240); text-decoration: none; color: rgb(23, 43, 70); transition: background 0.15s; } .medis-board-list a:hover { background: rgb(247, 250, 252); } .medis-board-list a:focus-visible, .medis-board-gallery a:focus-visible, .medis-board-faq summary:focus-visible { outline: rgb(30, 169, 220) solid 2px; outline-offset: 3px; } .medis-board-list a > span { min-width: 56px; font-size: 12px; color: rgb(98, 116, 138); } .medis-board-list strong { flex: 1 1 0%; min-width: 0px; font-size: 16px; font-weight: 500; overflow-wrap: anywhere; } .medis-board-list small { color: rgb(30, 169, 220); font-size: 10px; font-weight: 700; } .medis-board-list time, .medis-board-gallery time { font-size: 13px; color: rgb(121, 135, 154); font-variant-numeric: tabular-nums; } .medis-board-gallery { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 28px 24px; } .medis-board-gallery a { display: flex; flex-direction: column; min-width: 0px; border: 1px solid rgb(230, 235, 240); border-radius: 16px; overflow: hidden; background: rgb(255, 255, 255); color: rgb(23, 43, 70); text-decoration: none; } .medis-board-gallery img, .board-image-empty { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: rgb(242, 245, 248); } .board-image-empty { display: grid; place-items: center; color: rgb(176, 189, 202); font-size: 13px; letter-spacing: 0.12em; } .medis-board-gallery strong { padding: 22px 22px 12px; font-size: 17px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; } .medis-board-gallery time { padding: 0px 22px 22px; margin-top: auto; } .medis-board-gallery a:hover { border-color: rgb(30, 169, 220); } .medis-board-faq { border-top: 2px solid rgb(36, 55, 75); } .medis-board-faq details { border-bottom: 1px solid rgb(230, 235, 240); } .medis-board-faq summary { display: flex; align-items: center; gap: 18px; cursor: pointer; list-style: none; padding: 24px 16px; font-size: 16px; font-weight: 550; } .medis-board-faq summary::-webkit-details-marker { display: none; } .medis-board-faq summary::before { content: "Q"; color: rgb(30, 169, 220); font-size: 19px; font-weight: 650; } .medis-board-faq summary::after { content: "+"; margin-left: auto; color: rgb(117, 134, 155); font-size: 24px; font-weight: 400; } .medis-board-faq details[open] summary::after { content: "−"; } .medis-board-faq .prose { padding: 24px 52px; background: rgb(246, 248, 250); margin: 0px; line-height: 1.9; font-size: 15px; } .board-bottom { align-items: center; justify-content: center; flex-wrap: wrap; gap: 20px; margin-top: 32px; } .board-page .pagination { display: flex; justify-content: center; gap: 6px; margin: 0px; flex-wrap: wrap; } .board-page .pagination a { min-width: 42px; min-height: 42px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 8px; color: rgb(100, 115, 138); text-decoration: none; } .board-page .pagination a[aria-current] { color: rgb(255, 255, 255); background: rgb(30, 169, 220); } .board-empty { padding: 72px 24px; text-align: center; background: rgb(247, 249, 251); border-radius: 12px; color: rgb(108, 124, 144); } .board-empty strong { display: block; font-size: 16px; font-weight: 500; } .board-empty a { display: inline-block; margin-top: 20px; color: rgb(23, 43, 70); } .board-detail { border-top: 1px solid rgb(226, 231, 238); border-bottom: 1px solid rgb(226, 231, 238); margin-bottom: 28px; } .board-meta { padding: 20px 0px; font-size: 14px; color: rgb(121, 135, 154); border-bottom: 1px solid rgb(238, 241, 245); } .board-detail .prose { padding: 24px 0px 48px; line-height: 1.9; overflow-wrap: anywhere; } .board-detail .prose img { max-width: 100%; height: auto; border-radius: 10px; } .board-detail .prose a, .medis-board-faq .prose a { color: rgb(20, 118, 151); text-underline-offset: 4px; } .board-detail .prose table, .medis-board-faq .prose table { display: block; max-width: 100%; overflow-x: auto; } .board-actions { display: flex; justify-content: flex-end; gap: 10px; } @media (max-width: 800px) { .medis-board-gallery { grid-template-columns: repeat(2, minmax(0px, 1fr)); } } @media (max-width: 560px) { .board-toolbar { align-items: stretch; } .board-search { width: 100%; } .medis-board-list a { flex-wrap: wrap; gap: 8px 12px; padding: 20px 4px; } .medis-board-list strong { flex-basis: calc(100% - 80px); } .medis-board-list time { margin-left: auto; } .medis-board-gallery { grid-template-columns: 1fr; } .medis-board-faq summary { padding: 20px 4px; } .medis-board-faq .prose { padding: 20px; } } .board-bottom { display: grid; grid-template-columns: 1fr auto 1fr; } .board-bottom > .pagination { grid-column: 2; } .board-bottom > .button { grid-column: 3; justify-self: end; margin-left: 0px; } @media (max-width: 560px) { .board-bottom { grid-template-columns: 1fr auto; } .board-bottom > .pagination { grid-column: 1; justify-content: flex-start; } .board-bottom > .button { grid-column: 2; } } .sun-editor, .prose { --se-caret-color: #333; --se-drag-caret-color: #4592ff; --se-placeholder-color: #bbb; --se-edit-font-color: #333; --se-edit-font-pre: #666; --se-edit-font-quote: #999; --se-edit-background-color: #fff; --se-edit-background-pre: #f9f9f9; --se-edit-border-light: #e1e1e1; --se-edit-border-dark: #b1b1b1; --se-edit-border-dark-n1: #c1c1c1; --se-edit-border-dark-n2: #d1d1d1; --se-edit-border-table: #cecece; --se-edit-anchor: #0056b3; --se-edit-anchor-on-back: #e8f7ff; --se-edit-anchor-on-font: #0093ff; --se-edit-hr-color: #333; --se-edit-hr-on-back: #c7deff; --se-edit-active: #4592ff; --se-edit-hover: #e0f4ff; --se-edit-outline: #9e9e9e; --se-main-out-color: #dadada; --se-main-color: #18181b; --se-main-color-lighter: #4c4c4d; --se-main-background-color: #fff; --se-code-view-color: #24292f; --se-main-font-color: #333; --se-code-view-background-color: #fff; --se-code-view-line-color: #57606a; --se-code-view-line-background-color: #f6f8fa; --se-markdown-view-color: #24292f; --se-markdown-view-background-color: #fff; --se-markdown-view-line-color: #57606a; --se-markdown-view-line-background-color: #f6f8fa; --se-main-divider-color: #e1e1e1; --se-main-border-color: #d1d1d1; --se-main-outline-color: #b1b1b1; --se-main-shadow-color: #ececec; --se-statusbar-font-color: #666; --se-overlay-background-color: #000; --se-find-match-color: #ffd50066; --se-find-current-color: #ff9632b3; --se-find-no-match-color: #ff50501f; --se-hover-color: #000; --se-hover-dark-color: #ccc; --se-hover-dark2-color: #bfbfbf; --se-hover-dark3-color: #b0b0b0; --se-hover-light-color: #e1e1e1; --se-hover-light2-color: #e6e6e6; --se-hover-light3-color: #d9d9d9; --se-active-color: #5cd2e6; --se-active-hover-color: #2964b7; --se-active-dark-color: #80bdff; --se-active-dark2-color: #407dd1; --se-active-dark3-color: #4592ff; --se-active-dark4-color: #3f9dff; --se-active-dark5-color: #1275ff; --se-active-light-color: #e6f2ff; --se-active-light2-color: #eaf3ff; --se-active-light3-color: #d0e3ff; --se-active-light4-color: #dbeaff; --se-active-light5-color: #c4ddff; --se-active-light6-color: #b7ccf2; --se-shadow-layer-color: #00000040; --se-shadow-layer: 0 1px 2px #0000000f,0 8px 24px #0000001f; --se-shadow-controller: 0 1px 2px #0000000f,0 4px 14px #0000001f; --se-drag-over-color: #f0c20a; --se-block-handle-color: var(--se-main-color-lighter); --se-block-handle-btn-hover-bg: #37352f14; --se-block-handle-btn-active-bg: #37352f24; --se-block-hover-bg: #37352f0a; --se-block-hover-outline: #37352f0a; --se-block-drag-indicator-color: var(--se-active-dark3-color); --se-select-menu-hover-bg: #eef3f9; --se-select-menu-active-bg: #dde7f3; --se-modal-background-color: #fff; --se-modal-color: #333; --se-modal-border-color: #e5e5e5; --se-modal-anchor-color: #004cff; --se-modal-preview-color: #666; --se-modal-file-input-background-color: #f9f9f9; --se-modal-input-disabled-color: #999; --se-modal-input-disabled-background-color: #f3f3f3; --se-dropdown-font-color: #555; --se-controller-border-color: #999; --se-controller-background-color: #fff; --se-controller-color: #333; --se-shadow-controller-color: #0003; --se-input-btn-border-color: #ccc; --se-input-btn-disabled-color: #bdbdbd; --se-table-picker-color: #f5f5f5; --se-table-picker-border-color: #ddd; --se-table-picker-highlight-color: #cce0ff; --se-table-picker-highlight-border-color: #90b5e2; --se-success-color: green; --se-success-dark-color: #628562; --se-success-dark2-color: #419c41; --se-success-dark3-color: #006c00; --se-success-light-color: #dff4e6; --se-success-light2-color: #d5f3e0; --se-success-light3-color: #c1f4d3; --se-success-light4-color: #769c76; --se-success-light5-color: #89b589; --se-error-color: #b94a48; --se-error-dark-color: #e1a6a2; --se-error-dark2-color: #db8d8c; --se-error-dark3-color: #d17872; --se-error-light-color: #f5d0c8; --se-error-light2-color: #eed3d7; --se-error-light3-color: #f2dede; --se-error-light4-color: #f7deda; --se-error-light5-color: #f8e3e1; --se-doc-background: #f2f5fa; --se-doc-info-page-font-color: #f5f5f5; --se-doc-info-page-background-color: #b1b1b1; --se-doc-info-font-color: #4c4c4c; --se-doc-info-active-color: #4a32ff; --se-loading-color: #07d; --se-show-blocks-color: #3f9dff; --se-show-blocks-li-color: #d539ff; --se-show-blocks-pre-color: #34c38f; --se-show-blocks-component-color: #f4b124; --se-edit-inner-padding: 1.5em; --se-edit-inner-padding-doc-type: 2.5rem; --se-edit-scroll-margin: 3em; --se-border-radius: 6px; --se-border-radius-lg: 8px; --se-min-height: 65px; --se-scroll-padding: 2em; --se-modal-input-width: 70px; --se-input-btn-size: 32px; --se-icon-size: 18px; --se-icon-size-command-menu: 16px; --se-block-handle-area-width: 52px; --se-block-handle-btn-size: 24px; --se-block-handle-btn-icon-size: 18px; --se-block-handle-gap: 1px; --se-block-drag-indicator-height: 2px; --se-doc-min-padding: 1rem; --se-doc-max-padding: 1.5rem; --se-doc-padding-factor: 0.5; --se-doc-info-width: 18%; --se-doc-info-min-width: 16ch; --se-doc-info-inner-padding: 2ch; --se-doc-info-inner-line-padding: 0.5ch; --se-doc-info-page-width: 16px; --se-doc-info-inner-line-indent-h1: 0em; --se-doc-info-inner-line-indent-h2: 0.4em; --se-doc-info-inner-line-indent-h3: 0.8em; --se-doc-info-inner-line-indent-h4: 1.2em; --se-doc-info-inner-line-indent-h5: 1.6em; --se-doc-info-inner-line-indent-h6: 2em; --se-edit-font-size: 16px; --se-edit-line-height: 1.5em; --se-main-font-family: Helvetica Neue; --se-content-font-family: Helvetica Neue; --se-main-font-size: 14px; --se-markdown-font-family: ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace; --se-codeview-font-family: ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace; --se-btn-font-size: 14px; --se-statusbar-font-size: 12px; --se-modal-title-font-size: 15px; --se-modal-input-font-size: 14px; --se-browser-title-font-size: 16px; --se-controller-font-size: 14px; --se-doc-info-font-size: 14px; --se-doc-info-inner-line-weight-h1: 700; --se-doc-info-inner-line-weight-h2: 500; --se-doc-info-inner-line-weight-h3: 400; --se-doc-info-inner-line-weight-h4: 300; --se-doc-info-inner-line-weight-h5: 300; --se-doc-info-inner-line-weight-h6: 300; } .prose { background-color: var(--se-edit-background-color); box-sizing: border-box; color: var(--se-edit-font-color); font-family: var(--se-content-font-family); font-size: var(--se-edit-font-size); word-break: normal; margin: 0px; padding: var(--se-edit-inner-padding); } .prose * { box-sizing: border-box; color: inherit; font-family: inherit; font-size: inherit; line-height: var(--se-edit-line-height); } .prose.se-document-page-mirror-a4, .prose.se-type-document-editable-a4 { padding: var(--se-edit-inner-padding-doc-type); width: 21cm !important; } .prose.se-rtl, .prose.se-rtl * { direction: rtl; } .prose .se-component > figure { direction: ltr; } .prose .se-component > figure > * { margin: 0px; } .prose .se-component > figure > blockquote { margin: 0px; min-height: 100px; position: relative; } .prose .se-component > figure > blockquote::before { animation: 1s linear 0s infinite normal none running spin; border-width: 3px; border-style: solid; border-color: rgb(52, 152, 219) rgb(243, 243, 243) rgb(243, 243, 243); border-image: none; border-radius: 50%; content: ""; display: block; height: 30px; left: 50%; position: absolute; top: 50%; width: 30px; } @-webkit-keyframes spin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(1turn); } } @keyframes spin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(1turn); } } .prose audio, .prose figcaption, .prose figure, .prose iframe, .prose img, .prose td, .prose th, .prose video { position: relative; } .prose span { display: inline; margin: 0px; padding: 0px; vertical-align: initial; } .prose span.se-math { display: inline-block; } .prose span.se-math * { direction: ltr; } .prose span > .MathJax { margin: 0.5em 0px !important; } .prose a { color: var(--se-edit-anchor); text-decoration: none; white-space: nowrap; } .prose span[style~="color:"] a { color: inherit; } .prose a:focus, .prose a:hover { color: var(--se-edit-anchor-on-font); cursor: pointer; text-decoration: underline; } .prose a.on { background-color: var(--se-edit-anchor-on-back); color: var(--se-edit-anchor-on-font); } .prose a[data-se-anchor] { background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48cGF0aCBkPSJNMTQuMTY4IDE1IDEwIDEzLjE4NCA1LjgzMiAxNVY0LjE2OGg4LjMzNm0wLTEuNjY4SDUuODMyYy0uOTE4IDAtMS42NjQuNzQ2LTEuNjY0IDEuNjY4VjE3LjVMMTAgMTVsNS44MzIgMi41VjQuMTY4YzAtLjkyNi0uNzUtMS42NjgtMS42NjQtMS42NjhtMCAwIiBzdHlsZT0ic3Ryb2tlOm5vbmU7ZmlsbC1ydWxlOm5vbnplcm87ZmlsbDojMDAwO2ZpbGwtb3BhY2l0eToxIi8+PC9zdmc+") no-repeat; cursor: default; display: inline-block; height: 20px; padding: 0px 10px; vertical-align: bottom; width: 20px; } .prose pre { background-color: var(--se-edit-background-pre); border: 1px solid var(--se-edit-border-light); border-radius: 2px; color: var(--se-edit-font-pre); display: block; font-family: monospace; line-height: 1.45; margin: 0px 0px 10px; padding: 8px; overflow-wrap: break-word; overflow: visible; white-space: pre-wrap !important; } .prose ol { list-style-type: decimal; } .prose ol, .prose ul { display: block; list-style-position: inside; margin-block: 1em; margin-inline: 0px; padding-inline-start: 40px; } .prose ul { list-style-type: disc; } .prose li { display: list-item; margin-bottom: 5px; text-align: -webkit-match-parent; } .prose ol ol, .prose ol ul, .prose ul ol, .prose ul ul { margin: 0px; } .prose ol ol, .prose ul ol { list-style-type: lower-alpha; } .prose ol ol ol, .prose ul ol ol, .prose ul ul ol { list-style-type: upper-roman; } .prose ol ul, .prose ul ul { list-style-type: circle; } .prose ol ol ul, .prose ol ul ul, .prose ul ul ul { list-style-type: square; } .prose sub, .prose sup { font-size: 75%; line-height: 0; } .prose sub { vertical-align: sub; } .prose sup { vertical-align: super; } .prose p { display: block; margin: 0px 0px 10px; } .prose div { display: block; margin: 0px; padding: 0px; } .prose blockquote { color: var(--se-edit-font-quote); display: block; font-family: inherit; font-size: inherit; margin-block: 1em; margin-inline: 0px; border-color: var(--se-edit-border-dark); border-style: solid; border-width: 0px 0px 0px 5px; padding: 0px 5px 0px 20px; } .prose blockquote blockquote { border-color: var(--se-edit-border-dark-n1); } .prose blockquote blockquote blockquote { border-color: var(--se-edit-border-dark-n2); } .prose blockquote blockquote blockquote blockquote { border-color: var(--se-edit-border-light); } .prose.se-rtl blockquote { border-left-width: 0px; border-right-width: 5px; padding-left: 5px; padding-right: 20px; } .prose h1 { display: block; font-size: 2em; margin-block: 0.67em; margin-inline: 0px; font-weight: 700; } .prose h2 { display: block; font-size: 1.5em; margin-block: 0.83em; margin-inline: 0px; font-weight: 700; } .prose h3 { display: block; font-size: 1.17em; margin-block: 1em; margin-inline: 0px; font-weight: 700; } .prose h4 { display: block; font-size: 1em; margin-block: 1.33em; margin-inline: 0px; font-weight: 700; } .prose h5 { display: block; font-size: 0.83em; margin-block: 1.67em; margin-inline: 0px; font-weight: 700; } .prose h6 { display: block; font-size: 0.67em; margin-block: 2.33em; margin-inline: 0px; font-weight: 700; } .prose hr { border-color: var(--se-edit-hr-color); border-image: initial; border-width: 1px 0px 0px; display: flex; height: 20px; margin-bottom: 0px; margin-top: 20px; } .prose hr.__se__solid { border-style: solid none none; } .prose hr.__se__dotted { border-style: dotted none none; } .prose hr.__se__dashed { border-style: dashed none none; } .prose hr.on { border-color: var(--se-edit-active); box-shadow: 0 0 0 .1rem var(--se-edit-hr-on-back); } .prose table { background-color: var(--se-edit-background-color); border-collapse: collapse; border-color: var(--se-edit-border-table); border-spacing: 0px; border-style: solid; border-width: 1px; display: table; margin: 0px; max-width: 100%; width: 100%; table-layout: auto !important; } .prose.se-rtl table { background-color: var(--se-edit-background-color); margin: 0px 0px 10px auto; } .prose table caption { background-color: var(--se-edit-background-pre); border: 1px solid var(--se-edit-border-table); caption-side: top; margin: 0px; outline: none; padding: 0.5em; text-align: unset; } .prose table caption.se-table-caption-top { border-bottom: 0px; caption-side: top; } .prose table caption.se-table-caption-bottom { border-top: 0px; caption-side: bottom; } .prose table thead { border-bottom: 2px solid var(--se-edit-font-color); } .prose table tr { box-sizing: border-box; position: relative; } .prose table th { background-color: rgb(243, 243, 243); } .prose table td, .prose table th { background-clip: padding-box; background-color: inherit; border-color: var(--se-edit-border-table); border-style: solid; border-width: 1px; min-width: 2em; padding: 0.4em; position: relative; vertical-align: middle; } .prose table.se-table-layout-fixed { table-layout: fixed !important; } .prose.se-disabled * { user-select: none; } .prose .se-component:not(.se-input-component), .prose hr { -webkit-user-modify: read-only; user-select: all; } .prose figure figcaption { -webkit-user-modify: read-write; user-select: text; } .prose .se-component { background-color: inherit; display: flex; margin: 0px 0px 10px; padding: 1px; } .prose .se-component.se-file-figure > figure { outline: rgb(187, 187, 187) solid 1px; padding: 1em; } .prose .se-component.se-file-figure > figure > a[data-se-file-download] { color: var(--se-edit-font-color); margin: 0px 4px; } .prose .se-component.se-file-figure > figure > a::before { content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTIwIDE4SDRWOGgxNm0wLTJoLThsLTItMkg0Yy0xLjExIDAtMiAuODktMiAydjEyYTIgMiAwIDAgMCAyIDJoMTZhMiAyIDAgMCAwIDItMlY4YTIgMiAwIDAgMC0yLTIiLz48L3N2Zz4="); display: inline-block; height: auto; vertical-align: middle; width: 1.5em; } .prose .__se__float-left { float: left; margin-right: 4px; } .prose .__se__float-right { float: right; margin-left: 4px; } .prose .__se__float-none { float: none; } .prose audio, .prose iframe, .prose img, .prose video { cursor: default; display: block; height: auto; margin: 0px; max-width: 100%; padding: 0px; width: auto; } .prose .se-image-container, .prose .se-video-container { height: auto; max-width: 100%; width: auto; } .prose figure { display: block; margin: 0px; min-width: 20px; outline: none; padding: 0px; } .prose .se-component figure { padding: 0px; } .prose .se-flex-component { margin: 0px 0px 10px; max-width: 100%; min-width: auto; width: 100%; } .prose figure.se-flex-component { width: max-content; } .prose .se-inline-component { display: inline-block; margin: 0px; max-width: 100%; min-width: min-content; padding: 0px; width: auto; } .prose figure.se-scroll-figure-x { overflow-x: auto; padding: 0px 1px; } .prose figure.se-scroll-figure-y { overflow-y: auto; padding: 1px 0px; } .prose figure.se-scroll-figure-xy { overflow: auto; padding: 1px; } .prose .__se__float-center figure, .prose .__se__float-left figure, .prose .__se__float-right figure { margin: auto !important; } .prose figure figcaption { background-color: var(--se-edit-background-pre); margin: 0px; outline: none; padding: 1em 0.5em; } .prose figure figcaption p { line-height: 2; margin: 0px; } .prose .se-image-container a img { margin: 1px; outline: 1px solid var(--se-edit-active); padding: 1px; } .prose .se-video-container iframe, .prose .se-video-container video { border: 0px; height: 100%; left: 0px; outline: 1px solid var(--se-edit-outline); position: absolute; top: 0px; width: 100%; } .prose .se-video-container figure { left: 0px; max-width: 100%; width: 100%; } .prose audio { height: 54px; width: 300px; } .prose .se-page-break { visibility: hidden; break-before: page; margin: 0px; padding: 0px; } .sun-editor .__se__p-bordered, .prose .__se__p-bordered { border-bottom: 1px solid rgb(177, 177, 177); border-top: 1px solid rgb(177, 177, 177); padding: 4px 0px; } .sun-editor .__se__p-spaced, .prose .__se__p-spaced { letter-spacing: 1px; } .sun-editor .__se__p-neon, .prose .__se__p-neon { animation: 1.5s ease 0s infinite alternate none running neonFlicker; background: rgb(0, 0, 0); border: 2px solid rgb(255, 255, 255); border-radius: 6px; color: rgb(255, 255, 255); font-style: italic; font-weight: 200; padding: 6px 4px; text-transform: uppercase; } @-webkit-keyframes neonFlicker { 0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% { box-shadow: rgb(255, 255, 255) 0px 0px 0.5px, rgb(255, 255, 255) 0px 0px 0.5px inset, rgb(0, 136, 255) 0px 0px 2px, rgb(0, 136, 255) 0px 0px 2px inset, rgb(0, 136, 255) 0px 0px 4px, rgb(0, 136, 255) 0px 0px 4px inset; text-shadow: rgb(255, 255, 255) -0.2rem -0.2rem 1rem, rgb(255, 255, 255) 0.2rem 0.2rem 1rem, rgb(255, 68, 0) 0px 0px 2px, rgb(255, 68, 0) 0px 0px 4px, rgb(255, 68, 0) 0px 0px 6px, rgb(255, 68, 0) 0px 0px 8px, rgb(255, 68, 0) 0px 0px 10px; } 20%, 24%, 55% { box-shadow: none; text-shadow: none; } } @keyframes neonFlicker { 0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% { box-shadow: rgb(255, 255, 255) 0px 0px 0.5px, rgb(255, 255, 255) 0px 0px 0.5px inset, rgb(0, 136, 255) 0px 0px 2px, rgb(0, 136, 255) 0px 0px 2px inset, rgb(0, 136, 255) 0px 0px 4px, rgb(0, 136, 255) 0px 0px 4px inset; text-shadow: rgb(255, 255, 255) -0.2rem -0.2rem 1rem, rgb(255, 255, 255) 0.2rem 0.2rem 1rem, rgb(255, 68, 0) 0px 0px 2px, rgb(255, 68, 0) 0px 0px 4px, rgb(255, 68, 0) 0px 0px 6px, rgb(255, 68, 0) 0px 0px 8px, rgb(255, 68, 0) 0px 0px 10px; } 20%, 24%, 55% { box-shadow: none; text-shadow: none; } } .sun-editor .__se__t-shadow, .prose .__se__t-shadow { text-shadow: rgb(255, 255, 255) -0.2rem -0.2rem 1rem, rgb(255, 255, 255) 0.2rem 0.2rem 1rem, rgb(153, 153, 153) 0px 0px 0.2rem, rgb(136, 136, 136) 0px 0px 0.4rem, rgb(119, 119, 119) 0px 0px 0.6rem, rgb(102, 102, 102) 0px 0px 0.8rem, rgb(85, 85, 85) 0px 0px 1rem; } .sun-editor .__se__t-code, .prose .__se__t-code { background-color: rgba(27, 31, 35, 0.05); border-radius: 6px; color: rgb(102, 102, 102); font-family: monospace; padding: 0.2em 0.4em; } .prose img.medis-image-rounded, .sun-editor-editable img.medis-image-rounded { border-radius: 16px; } .prose img.medis-image-border, .sun-editor-editable img.medis-image-border { border: 1px solid rgb(212, 220, 232); padding: 6px; background: rgb(255, 255, 255); } .prose .se-component img { max-width: 100%; margin: 0px !important; } .prose .se-component figure { max-width: 100%; } .prose { overflow-wrap: anywhere; } /* 장비소개 · 공개 목록과 서브 슬라이드 공통 카드 */ .equipment-card { min-width:0; color:#956c51; } .equipment-card .equipment-photo { position:relative; aspect-ratio:560 / 600; overflow:hidden; background:#eee8df; } .equipment-card .equipment-photo > img { display:block; width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.25,1,.5,1); } .equipment-card .equipment-placeholder { display:grid; width:100%; height:100%; place-items:center; color:#956c51; } .equipment-card .equipment-overlay { position:absolute; inset:0; overflow-y:auto; padding:52px 48px 76px; box-sizing:border-box; background:rgba(113,77,54,.9); color:#f8f4f0; opacity:0; visibility:hidden; transition:opacity .5s,visibility .5s; } .equipment-card .equipment-overlay h3 { margin:0 0 18px; font-family:'Noto Serif KR',serif; font-size:26px; font-weight:600; line-height:1.4; letter-spacing:0; } .equipment-card .equipment-overlay p { margin:0; font-size:17px; font-weight:400; line-height:1.7; letter-spacing:0; word-break:keep-all; } .equipment-card .equipment-tags { display:flex; flex-wrap:wrap; gap:8px; padding:0; margin:24px 0 0; list-style:none; } .equipment-card .equipment-tags li { padding:4px 8px; border-radius:8px; background:#f8f4f0; color:#956c51; font-size:15px; font-weight:400; line-height:1.4; letter-spacing:0; overflow-wrap:anywhere; } .equipment-card .equipment-name { margin:24px 0 16px; font-family:'CormorantGaramond',serif; font-size:45px; font-weight:400; line-height:1.1; letter-spacing:0; overflow-wrap:anywhere; } .equipment-card .equipment-excerpt { margin:0; font-size:17px; font-weight:400; line-height:1.65; letter-spacing:0; word-break:keep-all; } .equipment-card.is-open .equipment-overlay { opacity:1; visibility:visible; } /* 장비 사진 터치 및 설명 닫기 */ .equipment-card .equipment-toggle { position:absolute; inset:0; z-index:2; width:100%; height:100%; padding:0; border:0; background:transparent; cursor:pointer; } .equipment-card .equipment-toggle::after { content:'+'; position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:#fff; color:#956c51; font-size:26px; } .equipment-card.is-open .equipment-toggle { inset:auto 12px 12px auto; width:40px; height:40px; } .equipment-card.is-open .equipment-toggle::after { content:'×'; right:0; bottom:0; } .equipment-card .equipment-toggle:focus-visible { outline:2px solid #956c51; outline-offset:3px; } @media (hover:hover) and (pointer:fine) { .equipment-card .equipment-photo:hover .equipment-overlay { opacity:1; visibility:visible; } .equipment-card .equipment-photo:hover > img { transform:scale(1.035); } } .equipmentpage { padding:0 0 130px; background:#f8f4f0; color:#956c51; } .equipmentpage .equipment-tabs { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; width:fit-content; max-width:90%; box-sizing:border-box; padding:18px; margin:0 auto 80px; background:#fff; border-radius:8px; } .equipmentpage .equipment-tabs a { display:block; padding:7px 16px; border-radius:5px; color:#956c51; font-size:16px; font-weight:400; line-height:1.4; text-decoration:none; } .equipmentpage .equipment-tabs a[aria-current='page'] { background:#f8f4f0; } .equipmentpage .equipment-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:100px 28px; width:90%; max-width:1740px; margin:0 auto; } .equipmentpage .equipment-empty { text-align:center; padding:64px 20px; } .equipmentpage .equipment-pages { display:flex; justify-content:center; gap:12px; margin-top:72px; } .equipmentpage .equipment-pages a { display:grid; place-items:center; width:40px; height:40px; border-radius:50%; color:#956c51; text-decoration:none; } .equipmentpage .equipment-pages a[aria-current='page'] { background:#956c51; color:#fff; } @media (max-width:1100px) { .equipmentpage .equipment-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:64px 24px; } .equipment-card .equipment-overlay { padding:28px 24px 68px; } .equipment-card .equipment-name { font-size:36px; } } @media (max-width:640px) { .equipmentpage { padding:0 0 72px; } .equipmentpage .equipment-tabs { padding:12px; margin-bottom:40px; gap:6px; } .equipmentpage .equipment-tabs a { padding:8px 10px; font-size:14px; } .equipmentpage .equipment-grid { grid-template-columns:minmax(0,1fr); width:calc(100% - 40px); gap:48px; } .equipment-card .equipment-overlay h3 { font-size:22px; } .equipment-card .equipment-overlay p, .equipment-card .equipment-excerpt { font-size:15px; } .equipment-card .equipment-tags li { font-size:13px; } .equipment-card .equipment-name { margin-top:20px; font-size:34px; } } @media (prefers-reduced-motion:reduce) { .equipment-card .equipment-overlay, .equipment-card .equipment-photo > img { transition:none; } } /* /www/css/board.css 맨 아래에 추가 · 장비소개 탭 */ .equipmentpage .equipment-tabs { display:flex; flex-wrap:nowrap; align-items:center; justify-content:flex-start; gap:0; width:max-content; max-width:90%; padding:18px 36px; margin:0 auto 80px; box-sizing:border-box; overflow-x:auto; background:#fff; border-radius:8px; scrollbar-width:thin; } .equipmentpage .equipment-tabs a { position:relative; flex:0 0 auto; display:block; padding:8px 24px; border:0; border-radius:5px; color:#956c51; font-size:16px; line-height:1.4; letter-spacing:0; font-weight:400; text-decoration:none; white-space:nowrap; } .equipmentpage .equipment-tabs a::before, .equipmentpage .equipment-tabs a::after { content:none; } .equipmentpage .equipment-tabs a:not([aria-current='page']) + a:not([aria-current='page'])::before { content:''; position:absolute; left:0; top:50%; width:1px; height:22px; background:#dedad6; transform:translateY(-50%); pointer-events:none; } .equipmentpage .equipment-tabs a[aria-current='page'] { background:#f8f4f0; } .equipmentpage .equipment-tabs a:focus-visible { outline:2px solid #956c51; outline-offset:-2px; } @media (max-width:640px) { .equipmentpage .equipment-tabs { max-width:calc(100% - 40px); padding:12px 16px; margin-bottom:40px; } .equipmentpage .equipment-tabs a { padding:8px 16px; font-size:14px; } .equipmentpage .equipment-tabs a:not([aria-current='page']) + a:not([aria-current='page'])::before { height:18px; } } /* /www/css/board.css 맨 아래에 추가 · 의료진 칼럼 탭 */ .columnpage .tabs { display:flex; flex-wrap:nowrap; align-items:center; justify-content:flex-start; gap:0; width:max-content; max-width:90%; padding:18px 36px; margin:0 auto 80px; box-sizing:border-box; overflow-x:auto; background:#fff; border-radius:8px; scrollbar-width:thin; } .columnpage .tabs a { position:relative; flex:0 0 auto; display:block; padding:8px 24px; border:0; border-radius:5px; color:#956c51; font-size:16px; line-height:1.4; letter-spacing:0; font-weight:400; text-decoration:none; white-space:nowrap; } .columnpage .tabs a::before, .columnpage .tabs a::after { content:none; } .columnpage .tabs a:not([aria-current='page']) + a:not([aria-current='page'])::before { content:''; position:absolute; left:0; top:50%; width:1px; height:22px; background:#dedad6; transform:translateY(-50%); pointer-events:none; } .columnpage .tabs a[aria-current='page'] { background:#f8f4f0; } .columnpage .tabs a:focus-visible { outline:2px solid #956c51; outline-offset:-2px; } @media (max-width:640px) { .columnpage .tabs { width:calc(100% - 40px); max-width:none; flex-wrap:wrap; gap:6px; padding:0; margin-bottom:20px; background:transparent; border-radius:0; overflow:visible; } .columnpage .tabs a { padding:8px 10px; border:1px solid #ddd0c5; border-radius:0; background:#fff; font-size:13px; } .columnpage .tabs a[aria-current="page"] { background:#956c51; color:#fff; border-color:#956c51; } .columnpage .tabs a:not([aria-current='page']) + a:not([aria-current='page'])::before { content:none; } } /* 공지사항 · 후기 · 언론보도 (게시판 1 / 3 / 4 전용) */ .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) { width:100%; max-width:none; margin:0; box-sizing:border-box; font-family:'Pretendard','Noto Sans KR',sans-serif; padding:0 0 90px; background:#f8f4f0; color:#85776f; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading { width:100%; max-width:none; margin:0; padding:142px 24px 88px; border:0; background:transparent; text-align:center; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading .english { margin:0 0 12px; color:#956c51; font-family:'Noto Serif KR',serif; font-size:70px; line-height:1.2; letter-spacing:0; font-weight:600; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading h1 { margin:0 0 12px; color:#956c51; font-family:'Noto Serif KR',serif; font-size:25px; line-height:1.4; letter-spacing:0; font-weight:600; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading .description { margin:0; color:#956c51; font-size:17px; line-height:28px; letter-spacing:0; font-weight:400; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-content { font-family:inherit; width:90%; max-width:1740px; margin:0 auto; padding:0; background:transparent; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]).board-screen-list .board-search-row, .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]).board-screen-list .board-categories { display:none; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .jeunex-board-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:50px; row-gap:50px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .jeunex-board-card { min-width:0; margin:0; border:0; border-radius:22px; background:#fff; overflow:hidden; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-link { display:flex; flex-direction:column; height:100%; padding:20px 22px 24px; box-sizing:border-box; color:#85776f; text-decoration:none; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-photo { width:100%; aspect-ratio:350 / 226; overflow:hidden; border-radius:5px; background:#f8f4f0; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-photo img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s ease; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-title { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; margin:18px 6px 8px; color:inherit; font-size:17px; line-height:27px; letter-spacing:-.025em; font-weight:600; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-summary { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; margin:0 6px 18px; color:inherit; font-size:17px; line-height:27px; letter-spacing:-.025em; font-weight:400; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-bottom { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:auto; padding:16px 6px 0; border-top:1px solid #ddd; color:#a2a2a2; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-bottom time { font-size:14px; line-height:23px; letter-spacing:0; font-weight:500; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-more { display:flex; align-items:center; gap:20px; font-size:13px; line-height:23px; letter-spacing:0; font-weight:400; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-plus { display:grid; place-items:center; flex:none; width:23px; height:23px; border-radius:50%; background:#956c51; color:#fff; font-size:16px; line-height:1; letter-spacing:0; font-weight:400; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .is-review { row-gap:100px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .is-review .card-link { min-height:320px; padding:48px 28px 24px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .is-review .card-summary { -webkit-line-clamp:5; margin:0 6px 28px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-author { margin:0 6px 18px; color:inherit; font-size:15px; line-height:24px; letter-spacing:0; font-weight:400; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-list-bottom { display:block; margin:0; padding:0; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-pagination { display:flex; align-items:center; justify-content:center; gap:8px; margin:120px 0 0; padding:0; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-pagination a, .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-pagination > span { display:grid; place-items:center; width:40px; height:40px; min-width:0; padding:0; border:0; border-radius:50%; background:transparent; color:#403d39; font-size:17px; line-height:1; letter-spacing:0; font-weight:500; text-decoration:none; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-pagination a[aria-current='page'] { background:#403d39; color:#fff; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-pagination > span { opacity:.35; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-link:focus-visible { outline:2px solid #956c51; outline-offset:-4px; } @media (hover:hover) and (pointer:fine) { .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-link:hover .card-photo img { transform:scale(1.035); } } @media (max-width:1100px) { .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .jeunex-board-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; } } @media (max-width:640px) { .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) { padding-bottom:60px; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading { padding:110px 20px 44px; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading .english { font-family:'CormorantGaramond',serif; font-size:52px; font-weight:400; line-height:1; letter-spacing:0; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading h1 { font-size:22px; } :is(.medis-board, .columnpage, .equipmentpage) .jeunex-board-heading .description { font-size:14px; line-height:1.55; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-content { width:calc(100% - 40px); } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .jeunex-board-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 12px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-link { padding:18px 20px 22px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-title { font-size:14px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-summary { font-size:14px; line-height:1.55; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .jeunex-board-card { border-radius:16px;} .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .is-review .card-link { min-height:0; padding:22px 16px; } .medis-board[data-board-id="3"] .is-review { row-gap:16px; } .medis-board[data-board-id="3"] .is-review .card-summary { margin:0 0 10px; } .medis-board[data-board-id="3"] .is-review .card-author { margin:0 0 10px; } .medis-board[data-board-id="3"] .is-review .card-bottom { padding:8px 0 0; gap:0; } .medis-board[data-board-id="3"] .is-review .card-more { display:none; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .board-pagination { margin-top:24px; gap:4px; } .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-more { display:none; } } @media (prefers-reduced-motion:reduce) { .medis-board:is([data-board-id="1"],[data-board-id="3"],[data-board-id="4"]) .card-photo img { transition:none; } } /* 게시판 상세 공통 — 공지사항 · 칼럼 · 후기 · 언론보도 */ .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) { width:100%; max-width:none; margin:0; padding:0 0 120px; background:#f8f4f0; color:#514943; font-family:'Pretendard','Noto Sans KR',sans-serif; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-content { width:calc(100% - 80px); max-width:1440px; margin:0 auto; padding:0; background:transparent; font-family:inherit; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail { margin:0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail-heading { margin:0; padding:0 0 30px; border:0; border-bottom:1px solid #cfc4ba; background:transparent; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-post-title { margin:0 0 18px; padding:0; color:#403a35; font-family:inherit; font-size:34px; line-height:1.45; letter-spacing:-.035em; font-weight:600; word-break:keep-all; overflow-wrap:anywhere; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin:0; padding:0; border:0; color:#94877d; font-size:14px; line-height:24px; letter-spacing:0; font-weight:400; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose { display:flow-root; width:100%; max-width:960px; min-height:240px; box-sizing:border-box; margin:0 auto; padding:64px 0 80px; border:0; background:transparent; color:#514943; font-family:inherit; font-size:17px; line-height:1.9; letter-spacing:-.02em; font-weight:400; overflow-wrap:anywhere; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose p { margin:0 0 24px; line-height:1.9; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose > :last-child { margin-bottom:0; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose img { max-width:100%; height:auto; margin:0 auto; border-radius:0; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose a { color:#956c51; text-decoration:underline; text-underline-offset:4px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail-actions { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:32px; margin:0; padding:44px 0 0; border:0; border-top:1px solid #cfc4ba; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-back { grid-column:2; grid-row:1; display:flex; align-items:center; justify-content:center; min-width:126px; min-height:56px; box-sizing:border-box; margin:0; padding:14px 28px; border:0; border-radius:30px; background:#403a35; color:#fff; font-family:inherit; font-size:16px; line-height:24px; letter-spacing:-.02em; font-weight:600; text-decoration:none; box-shadow:none; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor { grid-column:1; grid-row:1; display:grid; grid-template-columns:40px minmax(0,1fr); align-items:center; gap:4px 12px; min-width:0; color:#75665b; font-size:15px; line-height:24px; letter-spacing:-.02em; font-weight:400; text-decoration:none; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-arrow { grid-column:1; grid-row:1 / span 2; display:grid; place-items:center; width:40px; height:40px; border:1px solid #cfc4ba; border-radius:50%; color:#956c51; font-size:20px; line-height:1; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-label { grid-column:2; color:#956c51; font-weight:500; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-title { grid-column:2; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#94877d; font-size:14px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-next { grid-column:3; grid-template-columns:minmax(0,1fr) 40px; text-align:right; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-next .board-neighbor-arrow { grid-column:2; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-next .board-neighbor-label, .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-next .board-neighbor-title { grid-column:1; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-empty { visibility:hidden; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail-actions a:focus-visible { outline:2px solid #956c51; outline-offset:5px; } @media (hover:hover) and (pointer:fine) { .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-back:hover { background:#956c51; color:#fff; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor:hover .board-neighbor-arrow { background:#956c51; border-color:#956c51; color:#fff; } } @media (max-width:600px) { .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) { padding-bottom:72px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-content { width:calc(100% - 40px); } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail-heading { padding-bottom:24px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-post-title { margin-bottom:14px; font-size:24px; line-height:1.5; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-meta { font-size:13px; line-height:22px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose { min-height:200px; padding:32px 0 48px; font-size:16px; line-height:1.85; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail .prose p { margin-bottom:20px; line-height:1.85; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-detail-actions { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:12px; padding-top:28px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-back { min-width:100px; min-height:48px; padding:12px 20px; font-size:14px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor { display:flex; flex-direction:column; align-items:flex-start; gap:6px; font-size:13px; line-height:20px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-next { align-items:flex-end; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-arrow { width:32px; height:32px; font-size:18px; } .medis-board.board-screen-view:is([data-board-id="1"],[data-board-id="2"],[data-board-id="3"],[data-board-id="4"]) .board-neighbor-title { display:none; } } .medis-board.board-screen-list .board-search-row.board-review-write-row { display:flex; justify-content:center; margin:24px 0 0; } .medis-board .board-review-write-row .board-search { display:none; } .medis-board .board-review-write-row .board-write-link { display:inline-flex; align-items:center; justify-content:center; min-width:112px; min-height:44px; padding:10px 24px; border:1px solid #956c51; border-radius:6px; background:#956c51; color:#fff; font-size:14px; line-height:22px; font-weight:500; text-decoration:none; } .medis-board .board-review-write-row .board-write-link:hover { background:#805a42; border-color:#805a42; } /* 회원 글쓰기 */ .medis-board.board-screen-write .board-content { width:calc(100% - 48px); max-width:1080px; margin:0 auto; padding:0; background:transparent; } .board-write { display:block; margin:0; padding:0; color:#54483f; --accent:#956c51; } .board-write .board-write-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px 20px; margin:0 0 24px; text-align:left; } .board-write .board-write-eyebrow { margin:0 0 10px; color:#956c51; font-size:13px; font-weight:500; line-height:1.6; letter-spacing:.08em; } .board-write .board-write-heading h2 { margin:0 0 14px; color:#956c51; font-size:24px; font-weight:500; line-height:1.4; letter-spacing:-.04em; } .board-write .board-write-heading > p:last-child { margin:0; color:#83796f; font-size:15px; line-height:1.7; } .board-write .board-write-notice { padding:24px 28px; border:1px solid #e8dfd6; border-radius:8px; background:#eee8e1; } .board-write .board-write-notice strong { display:block; margin-bottom:6px; color:#74533e; font-size:15px; font-weight:600; line-height:1.6; } .board-write .board-write-notice p { margin:0; color:#7f7267; font-size:14px; line-height:1.7; } .board-write .board-write-privacy { margin-top:24px; } .board-write .board-write-privacy h3 { margin:0 0 10px; color:#655043; font-size:15px; font-weight:600; line-height:1.6; } .board-write .board-write-policy { max-height:200px; overflow-y:auto; overscroll-behavior:contain; padding:18px 20px; border:1px solid #ded5cc; border-radius:4px; background:#fff; color:#7f7267; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; line-height:1.8; } .board-write .board-write-required { margin:24px 0 10px; text-align:right; font-size:12px; color:#887d73; } .board-write .board-write-required span, .board-write .board-write-row label span { color:#956c51; } .board-write .board-write-fields { border-top:1px solid #d7cec6; } .board-write .board-write-row { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:10px; padding:20px 0; border-bottom:1px solid #ded5cc; } .board-write .board-write-row > label, .board-write .board-write-label { margin:0; color:#655043; font-size:15px; font-weight:600; line-height:1.6; } .board-write .board-write-row input, .board-write .board-write-row textarea { display:block; width:100%; min-width:0; padding:14px 16px; border:1px solid #ded5cc; border-radius:4px; background:#fff; color:#443b35; font-family:inherit; font-size:16px; font-weight:400; line-height:1.7; box-shadow:none; } .board-write .board-write-row input::placeholder, .board-write .board-write-row textarea::placeholder { color:#a49b92; } .board-write .board-write-author { display:flex; flex-wrap:wrap; align-items:center; gap:12px; } .board-write .board-write-author strong { font-size:15px; font-weight:500; } .board-write .board-write-author span { color:#91867b; font-size:13px; } .board-write .board-write-body { align-items:start; } .board-write .board-write-body > label { padding-top:0; } .board-write .board-write-row textarea { min-height:300px; resize:vertical; } .board-write .board-write-hint { margin:8px 0 0; color:#91867b; font-size:12px; line-height:1.6; } .board-write .board-write-actions { display:flex; justify-content:center; gap:12px; margin-top:32px; } .board-write .board-write-actions a, .board-write .board-write-actions button { display:inline-flex; justify-content:center; align-items:center; min-width:140px; min-height:50px; padding:12px 28px; border:1px solid #956c51; border-radius:4px; background:transparent; color:#956c51; font-size:15px; font-weight:500; line-height:24px; text-decoration:none; } .board-write .board-write-actions button { background:#956c51; color:#fff; } .board-write .board-write-actions button:hover { background:#805a42; } @media (max-width:640px) { .medis-board.board-screen-write .board-content { width:calc(100% - 40px); } .board-write .board-write-heading { margin-bottom:24px; } .board-write .board-write-heading h2 { font-size:28px; } .board-write .board-write-heading > p:last-child { font-size:13px; } .board-write .board-write-notice { padding:18px; } .board-write .board-write-notice p { font-size:13px; } .board-write .board-write-row { grid-template-columns:minmax(0,1fr); gap:10px; padding:18px 0; } .board-write .board-write-body > label { padding:0; } .board-write .board-write-row textarea { min-height:260px; } .board-write .board-write-actions { margin-top:24px; gap:10px; } .board-write .board-write-actions a, .board-write .board-write-actions button { flex:1; min-width:0; } } /* 비회원 게시판 이용 안내 */ .board-access { min-height:50vh; display:grid; place-items:center; padding:48px 20px; } .board-access-dialog { width:min(440px,calc(100% - 40px)); padding:36px 28px 28px; border:0; border-radius:12px; background:#faf7f3; color:#655043; text-align:center; box-shadow:0 16px 60px #0002; } .board-access-dialog::backdrop { background:rgba(20,18,16,.5); } .board-access-dialog h1 { margin:0 0 14px; color:#956c51; font-size:24px; font-weight:500; line-height:1.4; } .board-access-dialog p { margin:0; font-size:15px; line-height:1.8; } .board-access-actions { display:flex; justify-content:center; gap:10px; margin-top:26px; } .board-access-actions a { display:flex; align-items:center; justify-content:center; flex:1; min-height:46px; padding:10px; border:1px solid #956c51; border-radius:4px; color:#956c51; text-decoration:none; font-size:14px; } .board-access-actions a:focus { outline:none; box-shadow:none; } .board-access-actions a[data-member-open] { background:#956c51; color:#fff; } /* 글쓰기 입력·에디터·첨부 */ .board-write .board-write-contact { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; } .board-write input[readonly] { background:#f0ece7; color:#81776e; } .board-write .board-write-error { padding:14px 16px; margin:0 0 20px; border:1px solid #d9a99c; border-radius:4px; color:#963d2e; background:#fff6f2; font-size:14px; } .board-write .board-editor-wrap { min-width:0; } .board-write .sun-editor { max-width:100%; border-color:#ded5cc; border-radius:4px; overflow:hidden; } .board-write .sun-editor .se-toolbar { background:#faf9f7; outline:none; } .board-write .sun-editor button { color:#655043; } .board-write .board-upload input { border:0; padding:0; background:transparent; font-size:14px; } .board-write .board-upload input::file-selector-button { padding:10px 16px; margin-right:12px; border:1px solid #d7cec6; border-radius:4px; background:#fff; color:#655043; cursor:pointer; } .board-write .board-file-list { margin:12px 0 0; padding:0; list-style:none; } .board-write .board-file-list li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid #e8e1da; font-size:13px; } .board-write .board-file-list span { overflow-wrap:anywhere; } .board-write .board-file-list button { flex-shrink:0; padding:6px 12px; border:1px solid #956c51; border-radius:3px; background:#956c51; color:#fff; font-size:13px; box-shadow:none; } .board-write .board-file-list button:hover { background:#805a42; border-color:#805a42; color:#fff; } .board-write .board-write-agree { display:flex; align-items:center; gap:10px; margin-top:14px; color:#655043; font-size:13px; line-height:1.6; } .board-write .board-write-agree input { width:18px; height:18px; accent-color:#956c51; } .board-write .board-write-agree strong { font-weight:500; color:#956c51; } .board-attachments { padding:24px 0; border-top:1px solid #ded5cc; } .board-attachments h3 { font-size:15px; margin:0 0 12px; } .board-attachments li { padding:8px 0; overflow-wrap:anywhere; } .board-attachments a { color:#655043; font-size:14px; } .board-attachments small { margin-left:8px; color:#91867b; } @media (max-width:640px) { .board-write .board-write-contact { grid-template-columns:minmax(0,1fr); gap:0; } .board-write .board-write-heading h2 { font-size:22px; } .board-write .board-write-heading > p:last-child { font-size:13px; } .board-write .board-write-policy { max-height:160px; padding:14px; } }