@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream1.otf') format('opentype'); font-weight:100; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream2.otf') format('opentype'); font-weight:200; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream3.otf') format('opentype'); font-weight:300; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream4.otf') format('opentype'); font-weight:400; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream5.otf') format('opentype'); font-weight:500; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream6.otf') format('opentype'); font-weight:600; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream7.otf') format('opentype'); font-weight:700; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream8.otf') format('opentype'); font-weight:800; }
@font-face { font-family:'S-CoreDream'; src:url('../fonts/SCDream9.otf') format('opentype'); font-weight:900; }

:root{
    /* ✅ 세로(vh) 기준 스케일링 */

    /* 포스터 폭: 세로 높이에 비례해서 결정 (A4 느낌) */
    --paper-w: clamp(280px, 42vh, 460px);

    /* 타이포: 세로 높이에만 반응 */
    --t-xs: clamp(10px, 1.6vh, 12px);
    --t-sm: clamp(11px, 1.85vh, 13px);
    --t-md: clamp(13px, 2.1vh, 15px);

    /* 간격: 세로 높이에만 반응 */
    --gap-1: clamp(10px, 2.0vh, 16px);
    --gap-2: clamp(18px, 3.0vh, 28px);
    --gap-3: clamp(28px, 4.6vh, 42px);

    /* 상단바 높이도 세로 기준 */
    --topbar-h: clamp(34px, 5.0vh, 46px);
}

/*html, body{
    min-height: 510px;
}

body{
    margin:0;
    background:#fff;
    display:flex;
    justify-content:center;
    align-items:flex-start;
    padding-top: calc(var(--topbar-h) + var(--gap-2)); !* 상단바 + 여유 *!
    font-family:'S-CoreDream', serif;
    overflow-y: auto;
}*/
html, body { height:100%; }
/* =====================
   HEADER (GLOBAL)
===================== */
.cb-header { width:100%; background:#fff; border-bottom:1px solid #eee; font-family: 'S-CoreDream', sans-serif;}
.cb-header-inner { max-width:1200px; margin:0 auto; padding:22px 24px; display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.cb-nav { display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.cb-nav a { color:#111; text-decoration:none; font-size:15px; letter-spacing:.1px; }
.cb-nav a:hover { text-decoration:underline; }
.cb-right { display:flex; align-items:center; gap:14px; }
.cb-search { display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid #e6e6e6; background:#f6f6f6; border-radius:3px; min-width:260px; }
.cb-search input { border:0; outline:0; background:transparent; width:100%; font-size:13px; }
.cb-icon-btn { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border:0; background:transparent; cursor:pointer; border-radius:6px; }
.cb-icon-btn:hover { background:#f2f2f2; }
.cb-icon { width:18px; height:18px; display:block; }

body{
    margin:0;
    background:#fff;
    display:flex;
    justify-content:center;
    font-family:'S-CoreDream', sans-serif;
    overflow-x:hidden;
}
/* =====================
   SPLASH ONLY
===================== */
.splash-page{
    min-height: 510px;
    display:flex;
    justify-content:center;
    align-items:flex-start;
    padding-top: calc(var(--topbar-h) + var(--gap-2));
    overflow-y:auto;
}

/* 무대 */
.poster-stage{
    width:100%;
    display:flex;
    justify-content:center;
}

/* 하얀 종이 */
.poster-paper{
    width: var(--paper-w);
    background:#fff;
    text-align:center;
}

/* 상단 문구 */
.poster-top{
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: var(--topbar-h);
    background: #ededed;
    color: #666;
    font-size: var(--t-xs);
    letter-spacing: .18em;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    font-weight: 300;
    cursor:pointer;
}

.poster-top:hover{
    color:#000;
}

/* 로고 */
.poster-title{ margin-bottom: var(--gap-3); }

.title-img{
    display:block;
    margin:0 auto;
    width: min(70%, 320px);  /* 너무 커지지 않게 상한 */
    height:auto;
}

/* 영상 영역 */
.poster-media{
    width: 100%;
    aspect-ratio: 3 / 4;     /* 포스터 사진 프레임 비율 유지 */
    margin-bottom: var(--gap-3);
    display:flex;
    align-items:center;
    justify-content:center;
}

.poster-media video{
    width: 100%;
    height: 100%;
    object-fit: contain;      /* 원본 유지하면서 프레임에 맞춤 */
    background: transparent;
    display:block;
}

/* 하단 */
.poster-bottom{
    font-size: var(--t-xs);
    letter-spacing:.15em;
    color:#999;
    cursor:pointer;
}

.poster-bottom:hover{
    color:#000;
}

/* 소리 버튼 */
.sound-btn{
    position:absolute;
    bottom:30px;
    right:30px;

    width:48px;
    height:48px;
    border-radius:50%;
    background:#CCCCCC;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    font-size:20px;
    cursor:pointer;

    transition:.2s;
    box-shadow:0 6px 18px rgba(0,0,0,.25);
}

.sound-btn:hover{
    background:#444;
    transform:translateY(-2px);
}

/* 엔터 버튼 */
#enterCultureBalloon{
    position:absolute;
    top:20px;
    left:20px;
    width:35px;
    height:35px;
    background:red;
    border-radius:6px;
    cursor:pointer;
    box-shadow:0 0 8px rgba(0,0,0,.3);
    z-index: 2000;
}
