/* Responsive fixes for the static copy of www.memofit.co.kr (loaded after the theme CSS on every page).
   The Rhymix server sent phones a separate list markup for the notice board (table → card list) by user agent;
   a static site serves one HTML to every device, so the same layout is done here with media queries. */

/* Notice board list (notice list page and the list under each notice post): stacked rows on phones. */
@media (max-width: 575.98px) {
  .table-divider thead { display: none; }
  .table-divider,
  .table-divider tbody { display: block; width: 100%; }
  .table-divider tr {
    display: flex; flex-wrap: wrap; align-items: center;
    padding: 12px 16px; border-bottom: 1px solid #e9ecef;
  }
  .table-divider td { display: block; padding: 0 !important; border: 0 !important; width: auto !important; }
  .table-divider td.no { display: none; }
  .table-divider td.title { flex: 0 0 100%; margin-bottom: 4px; text-align: left; }
  .table-divider td.title > a { padding-left: 0 !important; }
  .table-divider td.title h5 { font-size: 15px; font-weight: 500; margin: 0; white-space: normal; }
  .table-divider td.author,
  .table-divider td.time,
  .table-divider td.readNum { font-size: 12px; color: #868e96; margin-right: 8px; }
  .table-divider td.author a { font-weight: 700; }
  .table-divider td.readNum::before { content: "조회 "; }
}

/* Long words without spaces (e.g. "2022강원뉴시니어라이프산업박람회") wrap instead of pushing the page sideways. */
h1, h2, h3, h4, h5, h6, .xe_content[class*="document_"] { overflow-wrap: anywhere; }

/* Post bodies written in the editor (div.document_N.xe_content — not the home widgets, which also sit in .xe_content): wide tables scroll inside the post instead of the page,
   and media never exceeds the column. */
.xe_content[class*="document_"] table { max-width: 100%; }
@media (max-width: 767.98px) {
  .xe_content[class*="document_"] table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
.xe_content[class*="document_"] img,
.xe_content[class*="document_"] video { max-width: 100%; height: auto; }
.xe_content[class*="document_"] iframe { max-width: 100%; }