/* Flat announcement and personal notification lists. */
.notices-page { background: #f7f7f7; }
.notices-page .linkhub-page { width: 100%; padding: 0; }
.notice-page-inner { max-width: 600px; margin: 0 auto; min-height: 75vh; padding-bottom: 80px; background: #f7f7f7; }
.notice-tabs { display: flex; background: #fff; }
.notice-tabs button { flex: 1; min-height: 52px; border: 0; border-bottom: 2px solid transparent; background: none; font: inherit; font-size: 16px; font-weight: 700; color: #a8afb8; cursor: pointer; }
.notice-tabs button[aria-selected="true"] { color: #171717; border-bottom-color: #171717; }
.notice-tabs button:focus-visible, .notice-item-header:focus-visible { outline: 2px solid var(--fig-blue, #3867f4); outline-offset: -3px; }
.notice-item { border: 0; border-bottom: 1px solid #dedede; border-radius: 0; background: transparent; }
.notice-item-header { display: flex; align-items: center; gap: 18px; padding: 24px; cursor: pointer; list-style: none; }
.notice-item-header::-webkit-details-marker { display: none; }
.notice-item-main { flex: 1; min-width: 0; }
.notice-item-title { display: block; color: #191919; font-size: 15px; font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; }
.notice-item-date { display: block; margin-top: 4px; color: #707070; font-size: 14px; line-height: 1.4; }
.notice-item-arrow { width: 10px; height: 10px; flex: 0 0 10px; border-right: 2px solid #707070; border-bottom: 2px solid #707070; transform: rotate(45deg); margin: -5px 6px 0 0; }
.notice-item[open] .notice-item-arrow { transform: rotate(225deg); margin-top: 5px; }
.notice-item-body { padding: 0 24px 24px; font-size: 14px; line-height: 1.7; color: #444; white-space: pre-wrap; overflow-wrap: anywhere; }
.notice-item-body--html { white-space: normal; }
.notice-item-body img { max-width: 100%; height: auto; }
.notice-item-thumb { display: block; margin-bottom: 16px; }
.notice-item-body a, .notice-empty a { color: var(--fig-blue, #3867f4); }
.notice-empty { margin: 0; padding: 64px 24px; text-align: center; color: #707070; font-size: 14px; }
.notice-empty button { font: inherit; margin: 12px; padding: 10px 16px; cursor: pointer; }
@media (max-width: 767px) {
  /* 헤더는 다른 페이지와 똑같이 둔다.
     예전엔 여기서 브랜드·페이지 제목·header-actions(보유 캐시/티켓·햄버거)를
     display:none !important 로 전부 지우고 뒤로가기 화살표만 남겼는데, 그러면
     이 페이지만 상단 네비가 통째로 사라져 화살표 하나만 떠 있는 화면이 된다.
     게다가 .linkhub-header-wrap 을 static 으로 바꾸면서 fixed 헤더를 전제로 깔린
     body padding-top 은 그대로라, 맨 위에 100px 짜리 회색 유령 여백까지 생겼다.
     뒤로가기 노출은 공통 CSS가 이미 모바일에서 처리한다(page_back 이 있을 때). */
  .notices-page .linkhub-back { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: #111; }
}
