@charset "utf-8";
/* ============================================================
   프로젝트 전용 스타일 (퍼블리싱과 다르게 가져가는 것만)

   style.css / screen1400.css 는 퍼블리싱이 올 때마다 통째로 덮어쓰므로
   거기에 규칙을 넣으면 다음 동기화에서 사라진다. 이 파일은 동기화 대상이
   아니라서 안전하다. head.jsp 에서 style.css 다음에 로드한다.
   (screen1400.css 는 이 파일보다 뒤에 로드되므로, 모바일 규칙을 눌러야 할
    때는 아래처럼 !important 를 쓴다.)
   ============================================================ */

/* ---------- 기록물 설명보기 레이어(.rec_modal) ----------
   퍼블리싱은 예시 한 건을 표에 박아 두었고, 실제 값은 sub.js 가 엑셀에서
   온 데이터(window.REC_INFO)로 갈아 끼운다. 기록물마다 비어 있는 항목이
   달라서(사진은 관리번호가, 문서는 소장처가 없다) 없는 줄은 감춰야 한다.

   지우지 않고 감추는 이유 : 모바일(screen1400.css)에서 이 표는
   tbody 가 grid, tr 이 display:contents 이고 각 칸의 자리를 tr:nth-child
   와 :nth-child 로 잡는다. 칸을 실제로 빼면 그 순서가 통째로 어긋난다. */
.rec_modal .record_info [hidden] {
  display: none !important;
}
/* 엑셀 설명에는 문단 줄바꿈이 들어 있다. 그대로 보이게 한다. */
.rec_modal .m_desc {
  white-space: pre-line;
}
.rec_modal .m_desc[hidden] {
  display: none !important;
}

/* 설명보기 레이어의 기록물 이미지.
   퍼블리싱 레이어에는 이미지 자리가 없지만, 설명을 읽을 때 어떤 기록물인지
   같이 보이는 편이 낫다. 이미지가 없는 기록물에서는 sub.js 가 감춘다. */
.rec_modal .m_pic {
  display: flex;
  align-items: center;
  justify-content: center;
  max-height: 320px;
  padding: 16px;
  background: #fbfaff;
  overflow: hidden;
}
.rec_modal .m_pic img {
  max-width: 100%;
  max-height: 288px;
  object-fit: contain;
}
.rec_modal .m_pic[hidden] {
  display: none !important;
}

/* ---------- 종목 상세 팝업(.sport_modal)의 관리정보 ----------
   퍼블리싱은 관리번호 / 건번호 / 생산년도 세 칸 고정인데, 가운데 칸에는
   라벨이 '건번호'인 채로 생산기관 값이 들어가 있었다. sub.js 가 종목별
   실제 값으로 다시 만들면서 라벨도 맞춘다. 그때 칸 수가 세 개가 아닐 수
   있어(값이 없는 항목은 빼므로) 폭 규칙에 여유를 둔다. */
.sport_modal .m_meta .m_pair:first-child:last-child {
  width: auto;
  flex: 1 1 auto;
}
.sport_modal .m_meta[hidden],
.sport_modal .m_desc[hidden] {
  display: none !important;
}
/* 관리번호가 여러 건(쉼표로 이어진 목록)이면 한 줄을 넘긴다.
   데스크톱은 한 줄 고정 높이라 넘치는 만큼 말줄임 처리하고 전체는 title 로. */
@media screen and (min-width: 1401px) {
  .sport_modal .m_meta .m_pair {
    min-width: 0;
  }
  .sport_modal .m_pair .m_v {
    display: block;
    min-width: 0;
    line-height: 46px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* ---------- 기록물 이미지 : 사진 직접 클릭 확대 끄기 ----------
   퍼블리싱 style.css 는 사진에 cursor:zoom-in 을 주고 sub.js 가 클릭으로
   확대 레이어를 연다. 기록물 열람은 이미지 위 아이콘 버튼(원문/설명/영상)으로만
   안내하기로 해서 둘 다 껐다.
   부착을 막는 쪽은 tools/olympic88/merge_js.py 의 IMG_CLICK_ZOOM 훅이고,
   여기는 돋보기 커서를 지운다. 되살릴 때는 둘을 같이 되돌릴 것. */
.subpage .img_box img.doc.zoomable,
.subpage .img_pair.joined {
  cursor: default;
}

/* ---------- 아직 영상이 없어 임시로 가려 둔 도구 버튼 ----------
   .tools button 은 display:flex 라 브라우저 기본 [hidden] 을 덮어쓴다.
   screen1400.css 가 이 파일보다 뒤에 로드되고 거기도 display:flex 를 주므로
   !important 로 눌러야 모바일에서도 감춰진다.
   어느 건을 가릴지는 동영상 eventid 엑셀의 '임시로 동영상보기 버튼 숨김'
   열에서 오고, tools/olympic88/eventid.py 가 hidden 속성을 붙인다. */
.tools button[hidden],
.record_btns button[hidden] {
  display: none !important;
}
