/* [AI-GENERATED] 작성일: 2026-08-20 00:00 | 수정일: 2026-08-20 00:00

   CKEditor 로 쓴 본문을 '조회 화면'에서 편집 화면과 같게 그리기 위한 최소 규칙.

   왜 필요한가
     사용자 조회 화면들은 본문을 .ck-content 로 감싸기만 하고 CKEditor 스타일시트는 로드하지
     않는다(관리자 조회는 editor_include.jsp 를 include 해서 로드한다). 그래서 편집기에서 준
     이미지 정렬(figure.image-style-*)이 조회에서는 전부 무시돼, 가운데 정렬한 이미지가
     왼쪽에 붙고 폭도 원본 width 속성 그대로 나갔다(2026-08-20 공고 상세에서 실측).

   왜 ckeditor5.css 를 그냥 링크하지 않는가
     그 파일은 편집기 UI(.ck-*) 규칙까지 240KB 를 싣고, 짝인 ckeditor-custom.css 의
     `.ck-content * {font-size:16px; line-height:2}` 가 조회 화면 본문 타이포를 통째로 덮는다.
     조회에 필요한 건 이미지 배치뿐이라 그 부분만 옮긴다.

   규칙은 ckeditor5.css 의 .ck-content 이미지 규칙 원본 그대로이며, CSS 변수만 그 파일의
   기본값(1.5em / 1.5em)으로 풀어 썼다 - 변수는 ckeditor5.css 안에서 선언되므로 여기서는 비어 있다.
*/

.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 > figcaption {
  caption-side: bottom;
  display: table-caption;
  font-size: .75em;
  overflow-wrap: anywhere;
  padding: .6em;
  word-break: normal;
}

/* 문단을 끊고 배치(block) — 편집기 툴바의 왼쪽/가운데/오른쪽 정렬 */
.ck-content .image-style-align-center {
  margin-left: auto;
  margin-right: auto;
}
.ck-content .image.image-style-block-align-left {
  margin-left: 0;
  margin-right: auto;
}
.ck-content .image.image-style-block-align-right {
  margin-left: auto;
  margin-right: 0;
  max-width: calc(100% - 1.5em);
}

/* 글이 옆으로 흐르는 배치(wrap). 툴바에는 없지만 예전에 저장된 본문이 쓰고 있어 남긴다 */
.ck-content .image-style-align-left {
  float: left;
  margin-right: 1.5em;
}
.ck-content .image-style-align-right {
  float: right;
  margin-left: 1.5em;
}
.ck-content .image.image-style-side {
  float: right;
  margin-left: 1.5em;
  max-width: 50%;
}

/* 편집기에서 크기를 조절한 이미지(figure 에 width 인라인) */
.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;
}
