body {
            font-family: 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;
            background-color: #f0f8ff; /* 섬과 바다 느낌의 연한 하늘색 배경 */
            color: #333;
            line-height: 1.6;
            margin: 0;
            padding: 20px;
        }
        .container {
            max-width: 900px;
            margin: 0 auto;
            background: #ffffff;
            padding: 40px;
            border-radius: 20px;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
        }
        header {
            text-align: center;
            border-bottom: 3px dashed #bce0fd;
            padding-bottom: 20px;
            margin-bottom: 30px;
        }
        h1 {
            color: #ff6b9d;
            margin-bottom: 10px;
            font-size: 28px;
        }
        .subtitle {
            color: #5596e6;
            font-weight: bold;
            font-size: 16px;
        }
        h2 {
            color: #ff85a2;
            border-left: 5px solid #ff85a2;
            padding-left: 12px;
            margin-top: 40px;
        }
        .poster-box {
            text-align: center;
            margin: 25px 0;
        }
        .poster-box img {
            max-width: 100%;
            width: 450px;
            height: auto;
            border-radius: 15px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        }
        .story-box {
            background-color: #fff9fb;
            padding: 20px;
            border-radius: 12px;
            border: 1px solid #ffe5ec;
        }
        .character-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 20px;
            margin-top: 20px;
        }
        .character-card {
            background: #fdfdfd;
            border: 2px solid #eef6ff;
            padding: 20px;
            border-radius: 15px;
            text-align: center;
            transition: transform 0.2s;
        }
        .character-card:hover {
            transform: translateY(-5px);
            border-color: #bce0fd;
        }
        .character-card img {
            width: 130px;
            height: 130px;
            object-fit: cover;
            border-radius: 50%;
            background-color: #eee;
            margin-bottom: 10px;
            border: 3px solid #fff;
            box-shadow: 0 2px 6px rgba(0,0,0,0.1);
        }
        .character-card h3 {
            margin: 10px 0 5px 0;
            color: #444;
        }
        .badge {
            display: inline-block;
            padding: 3px 8px;
            font-size: 12px;
            border-radius: 12px;
            background-color: #e1f0ff;
            color: #2b7de9;
            margin-bottom: 10px;
        }
        /* 스포일러 및 쿠키 영상 박스 스타일 */
        .info-box {
            background-color: #f4f9ff;
            padding: 20px;
            border-radius: 12px;
            margin-top: 20px;
        }
        details {
            background-color: #fff0f5;
            padding: 15px;
            border-radius: 10px;
            margin-top: 10px;
            cursor: pointer;
            border: 1px solid #ffccd5;
        }
        summary {
            font-weight: bold;
            color: #d6336c;
        }
        details p {
            margin-top: 10px;
            color: #444;
            border-top: 1px dashed #ffccd5;
            padding-top: 10px;
        }
    
/* 영화 소개 페이지: 바다빛 하늘색과 벚꽃 핑크의 헤더 */
body{padding-top:0}
.movie-site-header{position:sticky;top:0;z-index:100;margin:0 -20px 24px;padding:0;text-align:left;border:0;border-bottom:1px solid #dcebf7;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);box-shadow:0 3px 15px #5992bc08}
.movie-header-inner{box-sizing:border-box;max-width:1380px;width:100%;min-height:88px;margin:auto;padding:15px 24px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.movie-header-brand{flex-shrink:0;display:flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;line-height:1.4}
.movie-header-brand>span:first-child{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:15px;background:linear-gradient(135deg,#eaf6ff,#fff0f5);font-size:24px}
.movie-header-brand strong{display:block;color:#d9658a;font-size:22px;font-weight:850;letter-spacing:-.7px}
.movie-header-brand small{display:block;color:#8aa9c0;font-size:9px;letter-spacing:1.2px;margin-top:4px}
.movie-site-nav{display:flex;align-items:center;gap:5px;min-width:0}
.movie-site-nav a{box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;min-height:44px;padding:10px 11px;border:1px solid transparent;border-radius:20px;background:none;color:#75899f;font-size:16px;font-weight:750;line-height:1.5;transition:background .18s,color .18s,border-color .18s}
.movie-site-nav a:hover,.movie-site-nav a:focus-visible{background:linear-gradient(110deg,#edf7ff,#fff3f7);border-color:#e1edf8;color:#d3638a}
.movie-menu-toggle{display:none;align-items:center;justify-content:center;gap:7px;min-height:43px;padding:8px 13px;border:1px solid #dbeaf7;border-radius:14px;background:#f1f8ff;color:#7391af;font:inherit;font-size:13px;font-weight:750;cursor:pointer;line-height:1.5}
.movie-menu-toggle>span:first-child{font-size:22px;line-height:1}
.movie-site-header a:focus-visible,.movie-menu-toggle:focus-visible{outline:3px solid #bcd9f2;outline-offset:3px}
@media(max-width:1279px){
 .movie-header-inner{min-height:76px;padding:12px 20px;flex-wrap:wrap;gap:10px}
 .movie-header-brand strong{font-size:19px}
 .movie-header-brand>span:first-child{width:39px;height:39px;font-size:22px;border-radius:13px}
 .movie-menu-toggle{display:inline-flex}
 .movie-site-nav{display:none;flex:0 0 100%;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px 0 3px;max-height:calc(100dvh - 110px);overflow-y:auto}
 .movie-site-nav.is-open{display:grid}
 .movie-site-nav a{min-width:0;white-space:normal;word-break:keep-all;text-align:center;font-size:14px;min-height:46px;padding:11px 7px;border:1px solid #e1edf8;border-radius:14px;background:#f5faff}
 .movie-site-nav a:nth-child(even){background:#fff6f9;border-color:#f7e3eb}
}
@media(max-width:360px){.movie-header-inner{padding:11px 14px}.movie-header-brand strong{font-size:17px}.movie-header-brand small{font-size:8px;letter-spacing:.9px}.movie-header-brand{gap:7px}.movie-menu-toggle{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.movie-site-nav a{transition:none}}


html{scroll-behavior:smooth}
#movie-story{scroll-margin-top:112px}
.movie-header-inner{max-width:1440px}
.movie-site-nav .movie-story-link{background:#edf7ff;border-color:#d6e9fa;color:#5889b0;font-weight:800}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}