/* =========================================================================
   jlab × 그누보드 통합 오버라이드
   basic 테마 default.css의 2단(고정폭 930/235) 레이아웃을 단일 반응형으로 교정.
   style.css 뒤에 로드되어 우선 적용된다.
   ========================================================================= */

/* 1) 최소폭(1200px) 해제 — 모바일/태블릿 반응형 확보 */
#hd, #wrapper, #ft, #container_wr { min-width: 0 !important; }

/* 2) 콘텐츠 컨테이너: float 2단 → 전체폭 단일 컬럼 (푸터가 옆으로 밀리는 문제 해결) */
#wrapper { width: auto; margin: 0; }
#container_wr { width: auto; margin: 0; padding: 0; }
#container.jlab-content {
    position: static;
    float: none;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    font-size: inherit;
    background: none;
    zoom: normal;
}
#container.jlab-content:after { display: table; clear: both; content: ""; }

/* 3) 그누보드 기본 컨테이너 제목 h2 숨김 (우리는 .page-hero로 제목 표시) */
#container.jlab-content > #container_title { display: none; }

/* 4) 회원 로그인 안내 메시지(관리자 접속 시)는 헤더 위 흐름에서 제외 */
#hd_login_msg { position: absolute; top: 0; right: 0; z-index: 200; font-size: 12px; padding: 4px 10px; }

/* 5) 브랜드 로고를 실제 CI 이미지로 교체 (텍스트 로고 → 이미지) */
.brand-logos .logo-semas { gap: 0; }
.brand-logos .logo-semas img { height: 26px; width: auto; display: block; }
.brand-logos .logo-main { gap: 0; }
.brand-logos .logo-main img { height: 30px; width: auto; display: block; }
.footer-brand .logo-main img { height: 34px; width: auto; display: block; }

/* 6) 그누보드 default.css의 'a.btn,.btn{font-size:1.4em; line-height:35px; height:35px; padding:0 10px}'가
      우리 버튼(대부분 <a class="btn">)을 덮어써 텍스트가 22.4px로 커지고 높이가 뭉개지는 문제.
      a.btn(특정성 0,1,1)이 .btn/.btn-lg(0,1,0)를 이기므로, 같은 특정성 규칙을 뒤에 로드해 원본 복구. */
a.btn, button.btn, .btn {
    height: auto;
    padding: 13px 26px;
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
}
a.btn.btn-lg, button.btn.btn-lg, .btn-lg { padding: 17px 36px; font-size: 17px; }
a.btn.btn-sm, button.btn.btn-sm, .btn-sm { padding: 10px 18px; font-size: 14px; }
a.btn.btn-block, button.btn.btn-block, .btn-block { width: 100%; }

/* =========================================================================
   7) 팝업레이어 (그누보드 기본 기능 · 관리자 > 환경설정 > 팝업레이어관리)
      - default.css의 '#hd_pop{width:1200px}'는 모바일에서 가로 넘침을 만들므로 해제
      - sticky 헤더(z-index:100)·플로팅버튼(90) 위로 올라오도록 z-index 상향
      - 모바일에서는 관리자가 지정한 px 좌표 대신 화면 하단 고정으로 전환
   ========================================================================= */
#hd_pop {
    position: relative;
    z-index: 500;
    width: 100%;
    max-width: 1040px;   /* .container 와 동일 기준 → 좌표(left/top)가 콘텐츠 기준으로 잡힘 */
    min-width: 0;
    margin: 0 auto;
    height: 0;
    pointer-events: none;   /* 빈 영역이 클릭을 가로채지 않도록 */
}
.hd_pops {
    position: absolute;
    z-index: 500;
    pointer-events: auto;
    max-width: calc(100vw - 24px);
    border: 0;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 18px 44px rgba(20, 34, 78, .28);
}
.hd_pops_con { max-width: 100%; }
.hd_pops_con img { max-width: 100%; height: auto; }
.hd_pops_footer { background: var(--navy-900); }
.hd_pops_footer button {
    padding: 11px 14px;
    font-family: inherit;
    font-size: 13px;
    line-height: 1;
    color: rgba(255, 255, 255, .88);
    cursor: pointer;
}
.hd_pops_footer .hd_pops_reject { background: transparent; }
.hd_pops_footer .hd_pops_reject strong { color: #fff; }
.hd_pops_footer .hd_pops_close { background: rgba(255, 255, 255, .14); color: #fff; }

/* 팝업 본문용 유틸 클래스.
   그누보드는 팝업 내용을 HTMLPurifier로 걸러 display·border-radius 같은 인라인 style을
   제거하므로, 관리자에서 아래 클래스만 붙이면 사이트 디자인이 적용되도록 준비해 둔다. */
.hd_pops_con .pop-body { padding: 26px 24px; }
.hd_pops_con .pop-badge { display: inline-block; padding: 5px 12px; border-radius: 999px; background: var(--coral); color: #fff; font-size: 12px; font-weight: 700; }
.hd_pops_con .pop-title { margin: 14px 0 8px; font-family: 'Jua', sans-serif; font-weight: 400; font-size: 24px; line-height: 1.35; color: var(--navy-900); }
.hd_pops_con .pop-text { margin: 0 0 18px; font-size: 14px; line-height: 1.7; color: var(--gray-600); }
.hd_pops_con .pop-text b { color: var(--brand); }
.hd_pops_con .pop-list { margin: 0 0 20px; padding: 16px 18px; list-style: none; background: var(--sky-50); border-radius: 10px; font-size: 13.5px; line-height: 2; color: var(--gray-700); }
.hd_pops_con .pop-list b { display: inline-block; width: 66px; color: var(--navy-900); }
.hd_pops_con .pop-btn { display: block; padding: 14px; border-radius: 10px; background: var(--brand); color: #fff; font-size: 15px; font-weight: 700; text-align: center; }
.hd_pops_con .pop-btn:hover { background: var(--brand-600); }
.hd_pops_con .pop-btn-outline { display: block; padding: 13px; border: 1.5px solid var(--brand-200); border-radius: 10px; background: #fff; color: var(--brand); font-size: 15px; font-weight: 700; text-align: center; }
.hd_pops_con .pop-btn-outline:hover { border-color: var(--brand); background: var(--sky-50); }
/* 확정 전 임시 데이터 표기 (게시판 데모 안내와 동일한 톤) */
.hd_pops_con .pop-note { margin: 12px 0 0; font-size: 12px; line-height: 1.6; color: var(--gray-400); }

/* 관리자의 '접속기기' 설정(PC / 모바일 / PC와 모바일)을 화면 폭으로 판정.
   단일 반응형이라 서버측 기기 판별이 불가능하므로 CSS로 가른다. (theme/jlab/newwin.inc.php 참고) */
@media (max-width: 768px) { .hd_pops[data-device="pc"] { display: none !important; } }
@media (min-width: 769px) { .hd_pops[data-device="mobile"] { display: none !important; } }

/* 모바일: 관리자가 지정한 px 좌표 대신 화면 하단 고정 + 여러 개면 세로로 쌓기 */
@media (max-width: 768px) {
    #hd_pop {
        position: fixed;
        left: 12px;
        right: 12px;
        bottom: 12px;
        width: auto;
        max-width: none;
        height: auto;
        max-height: 86vh;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
        overflow-y: auto;
    }
    .hd_pops {
        position: static !important;
        width: auto !important;
        max-width: none;
    }
    .hd_pops_con {
        width: auto !important;
        height: auto !important;
        max-height: 56vh;
        overflow-y: auto;
    }
    /* 노출기간이 겹쳐 팝업이 2개 이상 동시에 뜨는 경우:
       본문을 더 낮게 잡아 각 팝업의 닫기 버튼이 화면 안에 들어오도록 한다.
       (:first-of-type:nth-last-of-type(n+2) = 형제 div가 2개 이상일 때만 매칭) */
    .hd_pops:first-of-type:nth-last-of-type(n+2) .hd_pops_con,
    .hd_pops:first-of-type:nth-last-of-type(n+2) ~ .hd_pops .hd_pops_con { max-height: 30vh; }
}