/* ============================================================
 * ckeditor5-content-styles.css
 * CKEditor 5 v41.2.1 (adpr.cau.ac.kr 관리자 에디터 번들에서 추출)
 *
 * 용도 : 에디터로 작성한 본문을 "사용자 페이지"에서 동일하게 보여주기 위한 스타일.
 *        에디터 번들(ckeditor.js) 안에 style-loader 로 내장되어 있어
 *        에디터가 로드되는 관리자 화면에서만 적용되던 CSS 를 파일로 분리한 것.
 *
 * 적용 : 본문을 출력하는 컨테이너에 class="ck-content" 를 부여한다.
 *        예) <div class="ck-content"><?=$row['content']?></div>
 *        (컨테이너에 클래스를 못 넣는 경우, 이 파일의 .ck-content 를
 *         해당 컨테이너 선택자로 일괄 치환해서 사용해도 된다)
 *
 * 주의 : h2/h3/h4 의 크기·굵기는 CKEditor 가 정의하지 않는다(브라우저/사이트 기본값).
 *        사이트 reset.css 가 heading·ul/ol·blockquote 를 죽여 놓았다면
 *        사이트 CSS 쪽에서 .ck-content 범위에 한해 복원해야 한다.
 * ============================================================ */

:root{
	--ck-color-image-caption-background: #f7f7f7;
	--ck-color-image-caption-text: #333;
	--ck-color-selector-caption-background: #f7f7f7;
	--ck-color-selector-caption-text: #333;
	--ck-highlight-marker-blue: #72ccfd;
	--ck-highlight-marker-green: #62f962;
	--ck-highlight-marker-pink: #fc7899;
	--ck-highlight-marker-yellow: #fdfd77;
	--ck-highlight-pen-green: #128a00;
	--ck-highlight-pen-red: #e71313;
	--ck-image-style-spacing: 1.5em;
	--ck-inline-image-style-spacing: calc(var(--ck-image-style-spacing)/2);
}

.ck-content code {background-color:hsla(0,0%,78%,.3);border-radius:2px;padding:.15em}
.ck-content blockquote {border-left:5px solid #ccc;font-style:italic;margin-left:0;margin-right:0;overflow:hidden;padding-left:1.5em;padding-right:1.5em}
.ck-content[dir=rtl] blockquote {border-left:0;border-right:5px solid #ccc}
.ck-content .text-tiny {font-size:.7em}
.ck-content .text-small {font-size:.85em}
.ck-content .text-big {font-size:1.4em}
.ck-content .text-huge {font-size:1.8em}
.ck-content .marker-yellow {background-color:var(--ck-highlight-marker-yellow)}
.ck-content .marker-green {background-color:var(--ck-highlight-marker-green)}
.ck-content .marker-pink {background-color:var(--ck-highlight-marker-pink)}
.ck-content .marker-blue {background-color:var(--ck-highlight-marker-blue)}
.ck-content .pen-red {background-color:transparent;color:var(--ck-highlight-pen-red)}
.ck-content .pen-green {background-color:transparent;color:var(--ck-highlight-pen-green)}
.ck-content hr {background:#dedede;border:0;height:4px;margin:15px 0}
.ck-content .image {clear:both;display:table;margin:.9em auto;min-width:50px;text-align:center}
.ck-content .image img {display:block;height:auto;margin:0 auto;max-width:100%;min-width:100%}
.ck-content .image-inline {align-items:flex-start;display:inline-flex;max-width:100%}
.ck-content .image-inline picture {display:flex}
.ck-content .image-inline img,.ck-content .image-inline picture {flex-grow:1;flex-shrink:1;max-width:100%}
.ck-content .image>figcaption {background-color:var(--ck-color-image-caption-background);caption-side:bottom;color:var(--ck-color-image-caption-text);display:table-caption;font-size:.75em;outline-offset:-1px;padding:.6em;word-break:break-word}
.ck-content img.image_resized {height:auto}
.ck-content .image.image_resized {box-sizing:border-box;display:block;max-width:100%}
.ck-content .image.image_resized img {width:100%}
.ck-content .image.image_resized>figcaption {display:block}
.ck-content .image-style-block-align-left,.ck-content .image-style-block-align-right {max-width:calc(100% - var(--ck-image-style-spacing))}
.ck-content .image-style-align-left,.ck-content .image-style-align-right {clear:none}
.ck-content .image-style-side {float:right;margin-left:var(--ck-image-style-spacing);max-width:50%}
.ck-content .image-style-align-left {float:left;margin-right:var(--ck-image-style-spacing)}
.ck-content .image-style-align-center {margin-left:auto;margin-right:auto}
.ck-content .image-style-align-right {float:right;margin-left:var(--ck-image-style-spacing)}
.ck-content .image-style-block-align-right {margin-left:auto;margin-right:0}
.ck-content .image-style-block-align-left {margin-left:0;margin-right:auto}
.ck-content p+.image-style-align-left,.ck-content p+.image-style-align-right,.ck-content p+.image-style-side {margin-top:0}
.ck-content .image-inline.image-style-align-left,.ck-content .image-inline.image-style-align-right {margin-bottom:var(--ck-inline-image-style-spacing);margin-top:var(--ck-inline-image-style-spacing)}
.ck-content .image-inline.image-style-align-left {margin-right:var(--ck-inline-image-style-spacing)}
.ck-content .image-inline.image-style-align-right {margin-left:var(--ck-inline-image-style-spacing)}
.ck-content ol {list-style-type:decimal}
.ck-content ol ol {list-style-type:lower-latin}
.ck-content ol ol ol {list-style-type:lower-roman}
.ck-content ol ol ol ol {list-style-type:upper-latin}
.ck-content ol ol ol ol ol {list-style-type:upper-roman}
.ck-content ul {list-style-type:disc}
.ck-content ul ul {list-style-type:circle}
.ck-content ul ul ul,.ck-content ul ul ul ul {list-style-type:square}
.ck-content .media {clear:both;display:block;margin:.9em 0;min-width:15em}
.ck-content .table {display:table;margin:.9em auto}
.ck-content .table table {border:1px double #b3b3b3;border-collapse:collapse;border-spacing:0;height:100%;width:100%}
.ck-content .table table td,.ck-content .table table th {border:1px solid #bfbfbf;min-width:2em;padding:.4em}
.ck-content .table table th {background:rgba(0,0,0,.05);font-weight:700}
.ck-content[dir=rtl] .table th {text-align:right}
.ck-content[dir=ltr] .table th {text-align:left}
.ck-content .table>figcaption {background-color:var(--ck-color-selector-caption-background);caption-side:top;color:var(--ck-color-selector-caption-text);display:table-caption;font-size:.75em;outline-offset:-1px;padding:.6em;text-align:center;word-break:break-word}
.ck-content .table .ck-table-resized {table-layout:fixed}
.ck-content .table table {overflow:hidden}
.ck-content .table td,.ck-content .table th {overflow-wrap:break-word;position:relative}
