/* EasyNative 배너 슬라이더 · 팝업 — easyclass-design (파스텔 카드 · 오렌지는 행동 단추·진행 막대에만 · 머리글과 같은 폭)
 * 색은 테마 토큰(--c-*)을 따른다 → 관리자 › 설정 › 화면 테마를 바꾸면 함께 바뀐다.
 * 넘김 방식(data-fx): slide(옆으로) · fade(스르륵) · track(한 화면 여러 장) · stack(카드 덱) · bento(모자이크) — promo.js */

.enb,.enp{
  --enb-bg:var(--c-bg,#EDEDF5);--enb-card:var(--c-card,#fff);--enb-ink:var(--c-text,#1C1C28);--enb-mut:var(--c-muted,#9AA0AC);
  --enb-ac:var(--c-accent,#F97316);--enb-acs:var(--c-accent-soft,#FEEBDC);--enb-sh:0 8px 24px rgba(28,28,40,.06);
  --enb-font:var(--en-font,'Pretendard Variable','Pretendard',-apple-system,'Malgun Gothic',sans-serif);
}
.enb{--enb-h:420px;--enb-gap:20px;--enb-per:1;position:relative;padding:28px 0 12px;font-family:var(--enb-font);color:var(--enb-ink);word-break:keep-all;-webkit-font-smoothing:antialiased}
.enb *,.enb *::before,.enb *::after,.enp *,.enp *::before,.enp *::after{box-sizing:border-box}
.enb--h-s{--enb-h:340px}.enb--h-l{--enb-h:520px}
/* [hero_banner] 를 페이지 본문(.en-prose) 안에 넣어도 여백·링크색·그림 모서리가 바뀌지 않게 */
.enb.enb :is(h2,p){margin:0}.enb.enb .enb__sub{margin-top:12px}.enb.enb .enb__eyebrow{margin-bottom:10px}
.enb.enb img{border-radius:0;max-width:none}
.enb.enb .enb__title{line-height:1.25}
.enb__wrap{position:relative;width:min(var(--w,1240px),calc(100% - 48px));margin:0 auto}
.enb__viewport{position:relative;overflow:hidden;border-radius:24px;touch-action:pan-y}
.enb__track{position:relative}
.enb__slide{position:relative;margin:0}
.enb__media{position:relative;overflow:hidden;background:var(--enb-tone)}
.enb__media picture,.enb__media img{display:block;width:100%;height:100%}
.enb__media img{object-fit:cover;user-select:none;-webkit-user-drag:none}
.enb__body{position:relative;z-index:2;min-width:0}
.enb__eyebrow{margin:0 0 10px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--enb-mut)}
.enb__title{margin:0;font-size:32px;font-weight:800;line-height:1.25;letter-spacing:-.025em;color:var(--enb-ink)}
.enb__sub{margin:12px 0 0;font-size:15px;line-height:1.65;color:var(--enb-mut)}
.enb__cta{position:relative;z-index:3;display:inline-flex;align-items:center;gap:8px;margin-top:22px;min-height:48px;padding:12px 24px;border-radius:9999px;background:var(--enb-ac);color:#fff!important;font-size:15px;font-weight:700;text-decoration:none;box-shadow:0 8px 18px color-mix(in srgb,var(--enb-ac) 35%,transparent);transition:transform .15s ease,box-shadow .15s ease}
.enb__cta:hover{transform:translateY(-1px);box-shadow:0 10px 22px color-mix(in srgb,var(--enb-ac) 42%,transparent)}
.enb__cta svg{transition:transform .15s ease}.enb__cta:hover svg{transform:translateX(3px)}
.enb__cta:focus-visible,.enb__btn:focus-visible,.enb__dot:focus-visible,.enb__pick:focus-visible{outline:3px solid color-mix(in srgb,var(--enb-ac) 45%,transparent);outline-offset:2px}
.enb__hit{position:absolute;inset:0;z-index:1}
.enb-tone-purple{--enb-tone:var(--pastel-purple,#E4D6F7)}.enb-tone-blue{--enb-tone:var(--pastel-blue,#D9E8F5)}.enb-tone-mint{--enb-tone:var(--pastel-mint,#D8F3E3)}
.enb-tone-yellow{--enb-tone:var(--pastel-yellow,#FCF0D4)}.enb-tone-pink{--enb-tone:var(--pastel-pink,#F9D2DA)}.enb-tone-white{--enb-tone:#fff}

/* 단추 줄: 01 / 03 · 점 · (진행) · 멈춤 · 이전 · 다음 */
.enb__ui{display:flex;align-items:center;gap:14px;margin-top:16px;min-height:40px}
.enb__count{font-size:13px;font-weight:600;color:var(--enb-mut);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.enb__count b{color:var(--enb-ink)}
.enb__dots{display:flex;align-items:center;gap:6px}
.enb__dot{width:8px;height:8px;padding:0;border:0;border-radius:9999px;background:color-mix(in srgb,var(--enb-ink) 18%,transparent);cursor:pointer;transition:width .3s ease,background-color .3s ease}
.enb__dot.is-on{width:24px;background:var(--enb-ink)}
.enb__grow{flex:1}
.enb__btn{display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:var(--enb-card);color:var(--enb-ink);box-shadow:var(--enb-sh);cursor:pointer;transition:transform .15s ease,background-color .15s ease}
.enb__btn:hover{transform:translateY(-1px)}
.enb__btn:disabled{opacity:.4;cursor:default;transform:none}
.enb__play .i-play{display:none}.enb.is-paused .enb__play .i-play{display:block}.enb.is-paused .enb__play .i-pause{display:none}
.enb__progress{position:relative;display:block;width:72px;height:3px;border-radius:9999px;background:color-mix(in srgb,var(--enb-ink) 12%,transparent);overflow:hidden;order:-1}
.enb__progress i{display:block;height:100%;width:0;border-radius:inherit;background:var(--enb-ac)}
.enb.is-run .enb__progress i{animation:enb-fill var(--enb-ms) linear forwards}
.enb.is-paused .enb__progress i,.enb.is-paused .enb__pick.is-on .enb__bar i{animation-play-state:paused}
.enb.is-single .enb__ui{display:none}
@keyframes enb-fill{from{width:0}to{width:100%}}
@keyframes enb-up{from{opacity:0;transform:translateY(14px)}}
@keyframes enb-in{from{opacity:0;transform:scale(.98)}}

/* 글이 차례로 떠오름(한 장씩 크게 보이는 템플릿) */
.enb:not(.enb--cards) .enb__slide.is-on .enb__body > *{animation:enb-up .65s cubic-bezier(.2,.8,.2,1) both}
.enb:not(.enb--cards) .enb__slide.is-on .enb__body > :nth-child(2){animation-delay:.07s}
.enb:not(.enb--cards) .enb__slide.is-on .enb__body > :nth-child(3){animation-delay:.14s}
.enb:not(.enb--cards) .enb__slide.is-on .enb__body > :nth-child(4){animation-delay:.21s}

/* ── 넘김 방식 ── */
.enb--fx-slide .enb__track,.enb--fx-track .enb__track{display:flex;transition:transform .65s cubic-bezier(.22,.8,.2,1);will-change:transform}
.enb--fx-slide .enb__slide{flex:0 0 100%}
.enb--fx-track .enb__track{gap:var(--enb-gap)}
.enb--fx-track .enb__slide{flex:0 0 calc((100% - (var(--enb-per) - 1) * var(--enb-gap)) / var(--enb-per))}
.enb--fx-fade .enb__track{display:grid}
.enb--fx-fade .enb__slide{grid-area:1 / 1;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s linear .8s}
.enb--fx-fade .enb__slide.is-on{opacity:1;visibility:visible;transition:opacity .8s ease}
.enb.is-drag .enb__track{transition:none}

/* ① 스플릿 카드 */
.enb--split .enb__viewport{background:var(--enb-card);box-shadow:var(--enb-sh)}
.enb--split .enb__slide{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"body media";gap:32px;align-items:center;min-height:var(--enb-h);padding:28px;background:var(--enb-card)}
.enb--split .enb__media{grid-area:media;height:calc(var(--enb-h) - 56px);border-radius:18px}
.enb--split .enb__body{grid-area:body;padding:8px 0 8px 28px}

/* ② 풀 커버 + 글래스 (켄번즈) */
.enb--cover .enb__viewport{background:var(--enb-card);box-shadow:var(--enb-sh)}
.enb--cover .enb__slide{min-height:var(--enb-h)}
.enb--cover .enb__media{position:absolute;inset:0}
.enb--cover .enb__media img{transform:scale(1);transition:transform calc(var(--enb-ms) + 1.5s) linear}
.enb--cover .enb__slide.is-on .enb__media img{transform:scale(1.07)}
.enb--cover .enb__body,.enb--peek .enb__body,.enb--tabs .enb__body,.enb--thumbs .enb__body,.enb--bento .enb__body{position:absolute;padding:28px 30px;border-radius:22px;background:color-mix(in srgb,var(--enb-card) 92%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(28,28,40,.14)}
.enb--cover .enb__body{left:32px;bottom:32px;width:min(480px,calc(100% - 64px))}
.enb--cover .enb__ui{position:absolute;right:24px;bottom:24px;z-index:5;margin:0;padding:6px 6px 6px 16px;border-radius:9999px;background:color-mix(in srgb,var(--enb-card) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.enb--cover .enb__ui .enb__btn{box-shadow:none;background:transparent}

/* ③ 가운데 스테이트먼트 */
.enb--center .enb__viewport{border-radius:0}
.enb--center .enb__slide{display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center}
.enb--center .enb__body{order:-1;max-width:760px;padding:4px 16px 0}
.enb--center .enb__title{font-size:36px}
.enb--center .enb__media{width:100%;height:calc(var(--enb-h) * .8);border-radius:24px;box-shadow:var(--enb-sh)}
.enb--center .enb__ui{justify-content:center}
.enb--center .enb__grow{display:none}

/* ④ 멀티 카드 (한 화면 1~3장) */
.enb--cards .enb__viewport{border-radius:0;padding:4px 2px 26px;margin:-4px -2px -26px}
.enb--cards .enb__slide{display:flex;flex-direction:column;border-radius:22px;background:var(--enb-card);box-shadow:var(--enb-sh);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}
.enb--cards .enb__slide:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(28,28,40,.1)}
.enb--cards .enb__media{height:calc(var(--enb-h) * .62)}
.enb--cards .enb__body{flex:1;padding:20px 22px 22px}
.enb--cards .enb__title{font-size:22px}
.enb--cards .enb__sub{font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.enb--cards .enb__cta{margin-top:14px;min-height:0;padding:0;background:none;color:var(--enb-ink)!important;box-shadow:none;font-size:14px}
.enb--cards.per-1 .enb__slide{flex-direction:row}
.enb--cards.per-1 .enb__media{flex:0 0 58%;height:var(--enb-h)}
.enb--cards.per-1 .enb__body{align-self:center;padding:32px 36px}
.enb--cards.per-1 .enb__title{font-size:30px}

/* ⑤ 피크 캐러셀 */
.enb--peek{--enb-gap:18px;--enb-sw:74%}
.enb--peek.per-2{--enb-sw:47%}.enb--peek.per-3{--enb-sw:32%}
.enb--peek .enb__viewport{border-radius:0}
.enb--peek .enb__slide{flex:0 0 var(--enb-sw);height:var(--enb-h);border-radius:24px;overflow:hidden;opacity:.5;transform:scale(.93);transition:transform .65s cubic-bezier(.22,.8,.2,1),opacity .65s ease}
.enb--peek .enb__slide.is-vis{opacity:1;transform:none}
.enb--peek .enb__media{position:absolute;inset:0}
.enb--peek .enb__body{left:24px;bottom:24px;width:min(440px,calc(100% - 48px));padding:22px 24px}
.enb--peek .enb__slide:not(.is-vis) .enb__body{opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}
.enb--peek .enb__title{font-size:26px}
.enb--peek.per-3 .enb__title{font-size:20px}
.enb--peek.per-3 .enb__sub,.enb--peek.per-3 .enb__eyebrow{display:none}
.enb--peek .enb__ui{justify-content:center}.enb--peek .enb__grow{display:none}

/* ⑥ 진행 바 탭 */
.enb--tabs .enb__viewport{background:var(--enb-card);box-shadow:var(--enb-sh)}
.enb--tabs .enb__slide{min-height:var(--enb-h)}
.enb--tabs .enb__media{position:absolute;inset:0}
.enb--tabs .enb__body{right:32px;top:50%;transform:translateY(-50%);width:min(420px,42%)}
.enb--tabs .enb__slide.is-on .enb__body{transform:translateY(-50%)}
.enb__list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:12px;margin-top:14px}
.enb__pick{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:18px 18px 14px;border:0;border-radius:16px;background:var(--enb-card);color:var(--enb-mut);font:inherit;text-align:left;cursor:pointer;box-shadow:var(--enb-sh);transition:color .2s ease,transform .2s ease}
.enb__pick:hover{color:var(--enb-ink)}
.enb__pick.is-on{color:var(--enb-ink)}
.enb__pick-t{display:flex;flex-direction:column;min-width:0}
.enb__pick small{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--enb-mut)}
.enb__pick b{font-size:14px;font-weight:700;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.enb__bar{position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--enb-bg);overflow:hidden}
.enb__bar i{display:block;height:100%;width:0;background:var(--enb-ac)}
.enb__pick.is-on .enb__bar i{width:100%}
.enb.is-auto .enb__pick.is-on .enb__bar i{width:0;animation:enb-fill var(--enb-ms) linear forwards}
.enb--tabs .enb__ui,.enb--thumbs .enb__ui{position:absolute;top:18px;left:18px;z-index:5;margin:0;padding:5px;border-radius:9999px;background:color-mix(in srgb,var(--enb-card) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);gap:4px}
.enb--tabs .enb__ui .enb__btn,.enb--thumbs .enb__ui .enb__btn{width:34px;height:34px;box-shadow:none;background:transparent}
.enb--tabs .enb__count,.enb--tabs .enb__progress,.enb--thumbs .enb__count,.enb--thumbs .enb__progress,.enb--tabs .enb__grow,.enb--thumbs .enb__grow{display:none}

/* ⑦ 썸네일 목록 */
.enb--thumbs .enb__wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:stretch}
.enb--thumbs .enb__viewport{background:var(--enb-card);box-shadow:var(--enb-sh)}
.enb--thumbs .enb__slide{min-height:var(--enb-h)}
.enb--thumbs .enb__media{position:absolute;inset:0}
.enb--thumbs .enb__body{left:28px;bottom:28px;width:min(440px,calc(100% - 56px))}
.enb--thumbs .enb__list{grid-auto-flow:row;grid-auto-rows:1fr;margin:0;max-height:var(--enb-h)}
.enb--thumbs .enb__pick{flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;padding:10px 14px 10px 10px}
.enb--thumbs .enb__pick img{flex:none;width:76px;height:100%;max-height:62px;min-height:48px;border-radius:12px;object-fit:cover;opacity:.75;transition:opacity .2s ease}
.enb--thumbs .enb__pick.is-on{box-shadow:0 0 0 2px var(--enb-ink),var(--enb-sh)}
.enb--thumbs .enb__pick.is-on img{opacity:1}

/* ⑧ 카드 덱 */
.enb--stack .enb__viewport{overflow:visible;border-radius:0}
.enb--stack .enb__track{display:grid;padding-bottom:40px}
.enb--stack .enb__slide{grid-area:1 / 1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-areas:"body media";gap:28px;align-items:center;min-height:var(--enb-h);padding:28px;border-radius:26px;background:var(--enb-card);box-shadow:0 14px 36px rgba(28,28,40,.1);transform-origin:50% 100%;transition:transform .75s cubic-bezier(.22,.8,.2,1),opacity .75s ease}
.enb--stack .enb__media{grid-area:media;height:calc(var(--enb-h) - 56px);border-radius:18px}
.enb--stack .enb__body{grid-area:body;padding:8px 0 8px 28px}
.enb--stack .enb__slide[data-pos="0"]{z-index:4}
.enb--stack .enb__slide[data-pos="1"]{z-index:3;transform:translateY(20px) scale(.955);opacity:.92;background:color-mix(in srgb,var(--enb-card) 82%,var(--enb-bg))}
.enb--stack .enb__slide[data-pos="2"]{z-index:2;transform:translateY(40px) scale(.91);opacity:.75;background:color-mix(in srgb,var(--enb-card) 65%,var(--enb-bg))}
.enb--stack .enb__slide[data-pos="far"]{z-index:1;transform:translateY(40px) scale(.91);opacity:0}
.enb--stack .enb__slide[data-pos="out"]{z-index:5;transform:translateX(-108%) rotate(-5deg);opacity:0}
.enb--stack .enb__slide:not([data-pos="0"]) :is(.enb__body,.enb__media){visibility:hidden}

/* ⑨ 벤토 모자이크 */
.enb--bento .enb__viewport{overflow:visible;border-radius:0}
.enb--bento .enb__track{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:16px;height:var(--enb-h)}
.enb--bento .enb__slide{display:none;border-radius:24px;overflow:hidden;box-shadow:var(--enb-sh);animation:enb-in .6s ease both}
.enb--bento .enb__media{position:absolute;inset:0}
.enb--bento .enb__slide[data-pos="0"]{display:block;grid-column:1;grid-row:1 / 3}
.enb--bento .enb__slide[data-pos="1"]{display:block;grid-column:2;grid-row:1;cursor:pointer}
.enb--bento .enb__slide[data-pos="2"]{display:block;grid-column:2;grid-row:2;cursor:pointer}
.enb--bento.has-2 .enb__slide[data-pos="1"]{grid-row:1 / 3}
.enb--bento.is-single .enb__track{grid-template-columns:minmax(0,1fr)}
.enb--bento .enb__slide[data-pos="0"] .enb__body{left:28px;bottom:28px;width:min(460px,calc(100% - 56px))}
.enb--bento .enb__slide:not([data-pos="0"]) .enb__body{left:14px;right:14px;bottom:14px;padding:12px 16px;border-radius:14px}
.enb--bento .enb__slide:not([data-pos="0"]) :is(.enb__eyebrow,.enb__sub,.enb__cta){display:none}
.enb--bento .enb__slide:not([data-pos="0"]) .enb__title{font-size:15px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.enb--bento .enb__slide:not([data-pos="0"]) .enb__title br{display:none}
.enb--bento .enb__slide:not([data-pos="0"]) .enb__hit{display:none}
.enb--bento .enb__slide:not([data-pos="0"]):hover .enb__media img{transform:scale(1.04)}
.enb--bento .enb__media img{transition:transform .5s ease}

/* ⑩ 미니멀 타이포 */
.enb--minimal .enb__viewport{border-radius:0}
.enb--minimal .enb__slide{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"body media";align-items:center;gap:40px;min-height:var(--enb-h);padding:8px}
.enb--minimal .enb__slide::before{content:"";position:absolute;right:6%;top:50%;width:min(44%,calc(var(--enb-h) * .92));aspect-ratio:1;border-radius:50%;background:var(--enb-tone);opacity:.75;transform:translateY(-50%)}
.enb--minimal .enb__media{grid-area:media;justify-self:center;width:min(100%,calc(var(--enb-h) * .78));height:calc(var(--enb-h) - 24px);border-radius:999px 999px 28px 28px;box-shadow:0 18px 44px rgba(28,28,40,.14)}
.enb--minimal .enb__body{grid-area:body;padding-left:12px}
.enb--minimal .enb__title{font-size:42px;line-height:1.16;letter-spacing:-.035em}
.enb--minimal .enb__sub{font-size:16px;max-width:520px}

/* ── 반응형 ── */
@media (max-width:900px){
  .enb{--enb-h:360px}
  .enb--h-l{--enb-h:420px}.enb--h-s{--enb-h:300px}
  .enb__title{font-size:26px}
  .enb--center .enb__title,.enb--minimal .enb__title{font-size:30px}
  .enb--split .enb__slide,.enb--stack .enb__slide,.enb--minimal .enb__slide{grid-template-columns:minmax(0,1fr);grid-template-areas:"media" "body";gap:20px;padding:18px}
  .enb--split .enb__media,.enb--stack .enb__media{height:calc(var(--enb-h) * .62)}
  .enb--split .enb__body,.enb--stack .enb__body{padding:0 8px 8px}
  .enb--minimal .enb__slide::before{display:none}
  .enb--minimal .enb__media{width:min(100%,320px);height:300px}
  .enb--thumbs .enb__wrap{grid-template-columns:minmax(0,1fr)}
  .enb--thumbs .enb__list{grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);grid-auto-rows:auto;max-height:none;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none}
  .enb--thumbs .enb__list::-webkit-scrollbar{display:none}
  .enb--tabs .enb__body{right:20px;width:min(380px,calc(100% - 40px))}
  .enb--bento .enb__track{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:var(--enb-h) 150px;height:auto}
  .enb--bento .enb__slide[data-pos="0"]{grid-column:1 / 3;grid-row:1}
  .enb--bento .enb__slide[data-pos="1"],.enb--bento.has-2 .enb__slide[data-pos="1"]{grid-column:1;grid-row:2}
  .enb--bento .enb__slide[data-pos="2"]{grid-column:2;grid-row:2}
  .enb--cards.per-1 .enb__slide{flex-direction:column}
  .enb--cards.per-1 .enb__media{flex:none;height:calc(var(--enb-h) * .62)}
  .enb--cards.per-1 .enb__body{padding:20px 22px}
}
@media (max-width:640px){
  .enb{padding-top:16px;--enb-gap:12px}
  .enb__wrap{width:calc(100% - 32px)}
  .enb__title,.enb--cards .enb__title,.enb--cards.per-1 .enb__title,.enb--peek .enb__title{font-size:22px}
  .enb--center .enb__title,.enb--minimal .enb__title{font-size:26px}
  .enb__sub{font-size:14px}
  .enb__cta{min-height:44px;padding:11px 20px;font-size:14px;margin-top:16px}
  .enb--peek,.enb--peek.per-2,.enb--peek.per-3{--enb-sw:86%}
  /* 글이 얹히는 템플릿: 그림 위 → 그 아래 겹친 글 카드 */
  .enb:is(.enb--cover,.enb--tabs,.enb--thumbs,.enb--peek,.enb--bento) .enb__slide{display:flex;flex-direction:column;min-height:0;height:auto}
  .enb:is(.enb--cover,.enb--tabs,.enb--thumbs,.enb--peek) .enb__media{position:relative;inset:auto;aspect-ratio:4 / 3;height:auto}
  .enb:is(.enb--cover,.enb--tabs,.enb--thumbs,.enb--peek) .enb__body,.enb--bento .enb__slide[data-pos="0"] .enb__body{position:relative;left:auto;right:auto;top:auto;bottom:auto;transform:none!important;width:auto;margin:-36px 12px 12px;padding:20px}
  .enb:is(.enb--cover,.enb--tabs,.enb--thumbs) .enb__viewport{border-radius:22px}
  .enb--peek .enb__slide{height:auto;background:var(--enb-card)}
  .enb--cover .enb__ui,.enb--tabs .enb__ui,.enb--thumbs .enb__ui{position:static;margin-top:12px;padding:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .enb--cover .enb__ui .enb__btn{background:var(--enb-card);box-shadow:var(--enb-sh)}
  .enb--tabs .enb__list{grid-auto-flow:column;grid-auto-columns:minmax(160px,1fr);overflow-x:auto;scrollbar-width:none;padding:2px 2px 6px}
  .enb--tabs .enb__list::-webkit-scrollbar{display:none}
  .enb--bento .enb__track{grid-template-columns:minmax(0,1fr);grid-template-rows:auto}
  .enb--bento .enb__slide[data-pos="0"]{grid-column:1;grid-row:1}
  .enb--bento .enb__slide[data-pos="0"] .enb__media{position:relative;aspect-ratio:4 / 3;height:auto}
  .enb--bento .enb__slide[data-pos="1"],.enb--bento .enb__slide[data-pos="2"]{display:none}
  .enb--bento .enb__slide[data-pos="0"]{background:transparent;box-shadow:none;overflow:visible}
  .enb--bento .enb__slide[data-pos="0"] .enb__media{border-radius:22px}
  .enb--stack .enb__track{padding-bottom:22px}
  .enb__btn{width:36px;height:36px}
  .enb__count{display:none}
}
@media (prefers-reduced-motion:reduce){
  .enb *,.enb *::before,.enb *::after{animation:none!important;transition:none!important}
}

/* ═══════════ 프로 템플릿 10종 — GDWEB BEST 수상작 메인 배너 분석 ═══════════ */
.enb__pick-n{display:none}
@keyframes enb-vfill{from{height:0}to{height:100%}}
@keyframes enb-rise{from{opacity:0;transform:translateY(38%);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(-20% 0 -20% 0)}}
/* 그림 위 흰 글 — 공통 */
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot,.enb--accordion) .enb__media{position:absolute;inset:0}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot,.enb--accordion) .enb__media::after{content:"";position:absolute;inset:0;pointer-events:none}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot,.enb--accordion) :is(.enb__title){color:#fff}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot,.enb--accordion) .enb__eyebrow{color:rgba(255,255,255,.72)}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot,.enb--accordion) .enb__sub{color:rgba(255,255,255,.84)}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--rail,.enb--inset) .enb__cta{background:#fff;color:var(--enb-ink)!important;box-shadow:0 10px 24px rgba(0,0,0,.18)}
/* 그림 위 단추 줄 — 반투명 */
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__ui{position:absolute;z-index:6;margin:0;padding:5px 5px 5px 14px;border-radius:9999px;background:rgba(18,18,26,.38);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);gap:8px}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__ui .enb__btn{width:34px;height:34px;background:rgba(255,255,255,.14);color:#fff;box-shadow:none}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__count{color:rgba(255,255,255,.7)}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__count b{color:#fff}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__progress{background:rgba(255,255,255,.22)}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__dot{background:rgba(255,255,255,.4)}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__dot.is-on{background:#fff}
.enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__grow{display:none}
/* 천천히 다가오는 그림 */
.enb:is(.enb--cinema,.enb--inset,.enb--story,.enb--spot,.enb--rail) .enb__media img{transform:scale(1.06);transition:transform calc(var(--enb-ms) + 2.5s) cubic-bezier(.2,.6,.2,1)}
.enb:is(.enb--cinema,.enb--inset,.enb--story,.enb--spot,.enb--rail) .enb__slide.is-on .enb__media img{transform:scale(1)}

/* ⑪ 시네마 (SLL · 모트라스 · CJ) — 어두운 영상미 · 왼쪽 아래 큰 글 · 오른쪽 세로 번호 + 진행선 */
.enb--cinema .enb__viewport{border-radius:24px;background:#0f1016}
.enb--cinema .enb__slide{min-height:calc(var(--enb-h) * 1.2)}
.enb--cinema .enb__media::after{background:linear-gradient(90deg,rgba(8,8,14,.74),rgba(8,8,14,.28) 58%,rgba(8,8,14,.08)),linear-gradient(0deg,rgba(8,8,14,.6),transparent 50%)}
.enb--cinema .enb__body{position:absolute;left:56px;bottom:56px;width:min(640px,calc(100% - 200px))}
.enb--cinema .enb__title{font-size:clamp(30px,3.6vw,54px);letter-spacing:-.035em;line-height:1.16}
.enb--cinema .enb__list{position:absolute;right:30px;top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column;gap:4px;margin:0}
.enb--cinema .enb__pick{flex-direction:row;align-items:center;padding:8px 0 8px 18px;border-radius:0;background:none;box-shadow:none;color:rgba(255,255,255,.42)}
.enb--cinema .enb__pick:hover,.enb--cinema .enb__pick.is-on{color:#fff}
.enb--cinema .enb__pick-n{display:block;font-style:normal;font-size:13px;font-weight:800;letter-spacing:.08em;font-variant-numeric:tabular-nums}
.enb--cinema .enb__pick-t{display:none}
.enb--cinema .enb__bar{left:0;right:auto;top:6px;bottom:6px;width:2px;height:auto;border-radius:2px;background:rgba(255,255,255,.2)}
.enb--cinema .enb__bar i{width:100%;height:0;background:#fff}
.enb--cinema .enb__pick.is-on .enb__bar i,.enb--cinema .enb__pick.is-done .enb__bar i{height:100%}
.enb.enb--cinema.is-auto .enb__pick.is-on .enb__bar i{width:100%;height:0;animation:enb-vfill var(--enb-ms) linear forwards}
.enb--cinema .enb__ui{right:24px;bottom:24px}
.enb--cinema .enb__progress{display:none}

/* ⑫ 타이포 임팩트 (1784 · 하스코리아 · 이트라이브) — 거대한 제목이 한 줄씩 떠오름 */
.enb--typo .enb__viewport{border-radius:24px;background:var(--enb-ink)}
.enb--typo .enb__slide{display:flex;align-items:flex-end;min-height:calc(var(--enb-h) * 1.15)}
.enb--typo .enb__media img{opacity:.6;filter:saturate(1.1)}
.enb--typo .enb__media::after{background:linear-gradient(0deg,rgba(12,12,18,.85),rgba(12,12,18,.15) 70%)}
.enb--typo .enb__body{width:100%;padding:44px 52px 48px}
.enb--typo .enb__eyebrow{display:inline-block;padding:6px 12px;border-radius:999px;background:var(--enb-ac);color:#fff!important;letter-spacing:.12em}
.enb.enb--typo .enb__title{margin-top:6px;font-size:clamp(44px,7.4vw,118px);font-weight:900;line-height:.98;letter-spacing:-.05em}
.enb--typo .enb__slide.is-on .enb__body > .enb__title{animation:enb-rise .95s cubic-bezier(.2,.8,.2,1) .05s both}
.enb--typo .enb__sub{max-width:560px;font-size:16px}
.enb--typo .enb__ui{right:24px;top:24px}

/* ⑬ 스토리 (크림 · 토스) — 위쪽 칸 나뉜 진행 막대 · 화면을 눌러 넘김 */
.enb--story .enb__viewport{border-radius:24px;background:#111;cursor:pointer}
.enb--story .enb__hit{display:none}   /* 화면 전체는 «넘기기» 자리 — 링크는 «자세히 보기» 단추로 */
.enb--story .enb__slide{min-height:calc(var(--enb-h) * 1.1)}
.enb--story .enb__media::after{background:linear-gradient(0deg,rgba(10,10,16,.7),transparent 55%),linear-gradient(180deg,rgba(10,10,16,.4),transparent 22%)}
.enb--story .enb__body{position:absolute;left:40px;bottom:38px;width:min(640px,calc(100% - 80px))}
.enb--story .enb__title{font-size:clamp(28px,3.2vw,44px)}
.enb--story .enb__list{position:absolute;left:20px;right:20px;top:14px;z-index:5;display:flex;gap:6px;margin:0}
.enb--story .enb__pick{flex:1;min-width:0;height:22px;padding:0;border-radius:0;background:none;box-shadow:none}
.enb--story .enb__pick :is(.enb__pick-t,.enb__pick-n){display:none}
.enb--story .enb__bar{left:0;right:0;top:9px;height:3px;border-radius:3px;background:rgba(255,255,255,.32)}
.enb--story .enb__bar i{background:#fff}
.enb--story .enb__pick.is-done .enb__bar i{width:100%}
.enb--story .enb__ui{right:18px;top:44px;padding:4px}
.enb--story .enb__ui :is(.enb__count,.enb__progress,[data-enb-prev],[data-enb-next]){display:none}

/* ⑭ 하단 독 (파라다이스시티 · 레스케이프) — 그림 아래 띠에 모든 배너가 번호·제목 칸으로 */
.enb--dock .enb__viewport{border-radius:24px 24px 0 0;background:#111}
.enb--dock .enb__slide{min-height:var(--enb-h)}
.enb--dock .enb__media::after{background:linear-gradient(90deg,rgba(8,8,14,.66),rgba(8,8,14,.12) 62%)}
.enb--dock .enb__body{position:absolute;left:52px;top:50%;transform:translateY(-50%);width:min(560px,calc(100% - 104px))}
.enb--dock .enb__title{font-size:clamp(28px,3.2vw,46px)}
.enb--dock .enb__list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;margin:0;border-radius:0 0 24px 24px;overflow:hidden;background:#15161d}
.enb--dock .enb__pick{flex-direction:row;align-items:center;gap:14px;padding:20px 22px 18px;border-radius:0;background:none;box-shadow:inset 1px 0 0 rgba(255,255,255,.07);color:rgba(255,255,255,.5)}
.enb--dock .enb__pick:first-child{box-shadow:none}
.enb--dock .enb__pick:hover{color:#fff}
.enb--dock .enb__pick.is-on{color:#fff;background:rgba(255,255,255,.06)}
.enb--dock .enb__pick-n{display:block;flex:none;font-style:normal;font-size:22px;font-weight:800;color:rgba(255,255,255,.3);font-variant-numeric:tabular-nums}
.enb--dock .enb__pick.is-on .enb__pick-n{color:var(--enb-ac)}
.enb--dock .enb__pick small{color:rgba(255,255,255,.42)}
.enb--dock .enb__bar{left:0;right:0;top:0;height:3px;border-radius:0;background:transparent}
.enb--dock .enb__ui{right:22px;top:22px}
.enb--dock .enb__ui .enb__progress{display:none}

/* ⑮ 썸네일 레일 (NC소프트) — 큰 그림 위 오른쪽 세로 썸네일 */
.enb--rail .enb__viewport{border-radius:24px;background:#111}
.enb--rail .enb__slide{min-height:calc(var(--enb-h) * 1.12)}
.enb--rail .enb__media::after{background:linear-gradient(90deg,rgba(8,8,14,.6),rgba(8,8,14,.08) 60%),linear-gradient(0deg,rgba(8,8,14,.4),transparent 40%)}
.enb--rail .enb__body{position:absolute;left:48px;bottom:48px;width:min(560px,calc(100% - 220px))}
.enb--rail .enb__title{font-size:clamp(28px,3.2vw,46px)}
.enb--rail .enb__list{position:absolute;right:22px;top:22px;bottom:22px;z-index:5;display:flex;flex-direction:column;justify-content:center;gap:10px;width:108px;margin:0;overflow-y:auto;scrollbar-width:none}
.enb--rail .enb__list::-webkit-scrollbar{display:none}
.enb--rail .enb__pick{flex:none;display:block;padding:0;aspect-ratio:16 / 10;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.1);box-shadow:none;opacity:.55;transition:opacity .25s ease,transform .25s ease,box-shadow .25s ease}
.enb--rail .enb__pick:hover{opacity:.85}
.enb--rail .enb__pick img{display:block;width:100%;height:100%;object-fit:cover}
.enb--rail .enb__pick :is(.enb__pick-t,.enb__pick-n){display:none}
.enb--rail .enb__pick.is-on{opacity:1;transform:translateX(-6px);box-shadow:0 0 0 2px #fff,0 10px 24px rgba(0,0,0,.35)}
.enb--rail .enb__bar{left:0;right:0;top:auto;bottom:0;height:3px;border-radius:0;background:rgba(0,0,0,.35)}
.enb--rail .enb__bar i{background:#fff}
.enb--rail .enb__ui{right:146px;bottom:22px}
.enb--rail .enb__ui .enb__progress{display:none}

/* ⑯ 인셋 와이드 (토스) — 둥근 큰 카드 · 아래쪽에 꽉 차는 큰 제목 */
.enb--inset .enb__viewport{border-radius:34px;background:#111}
.enb--inset .enb__slide{min-height:calc(var(--enb-h) * 1.18)}
.enb--inset .enb__media::after{background:linear-gradient(0deg,rgba(8,8,14,.78),rgba(8,8,14,.1) 58%)}
.enb--inset .enb__body{position:absolute;left:0;right:0;bottom:0;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 40px;padding:0 46px 40px}
.enb--inset .enb__eyebrow,.enb--inset .enb__title{flex:1 1 100%}
.enb.enb--inset .enb__title{font-size:clamp(38px,5.8vw,88px);font-weight:900;line-height:1.02;letter-spacing:-.045em}
.enb--inset .enb__title br{display:none}
.enb--inset .enb__sub{flex:1 1 360px;max-width:560px;margin:8px 0 0!important}
.enb--inset .enb__cta{margin:0}
.enb--inset .enb__ui{right:24px;top:24px}

/* ⑰ 스포트라이트 (소이정) — 큰 배너 + «다음 배너» 미리보기 카드 */
.enb--spot .enb__viewport{border-radius:24px;background:#111}
.enb--spot .enb__slide{min-height:calc(var(--enb-h) * 1.12)}
.enb--spot .enb__media::after{background:linear-gradient(90deg,rgba(8,8,14,.66),rgba(8,8,14,.1) 60%)}
.enb--spot .enb__body{position:absolute;left:52px;top:50%;transform:translateY(-50%);width:min(560px,calc(100% - 460px))}
.enb--spot .enb__title{font-size:clamp(28px,3.4vw,48px)}
.enb--spot .enb__cta{background:var(--enb-ac)}
.enb__spot{position:absolute;right:24px;bottom:24px;z-index:6;display:flex;align-items:center;gap:12px;width:min(360px,calc(100% - 48px));padding:10px 10px 10px 10px;border:0;border-radius:22px;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 18px 40px rgba(0,0,0,.25);color:var(--enb-ink);font:inherit;text-align:left;cursor:pointer;transition:transform .2s ease}
.enb__spot:hover{transform:translateY(-2px)}
.enb__spot-img{flex:none;width:92px;height:68px;border-radius:15px;overflow:hidden;background:var(--enb-bg)}
.enb__spot-img img{display:block;width:100%;height:100%;object-fit:cover;animation:enb-in .5s ease}
.enb__spot-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.enb__spot-t small{font-size:10.5px;font-weight:700;letter-spacing:.1em;color:var(--enb-mut)}
.enb__spot-t small b{color:var(--enb-ink)}
.enb__spot-t > b{font-size:14px;font-weight:700;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.enb__spot-go{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--enb-ink);color:#fff}
.enb--spot.is-single .enb__spot{display:none}
.enb--spot .enb__ui{left:24px;bottom:24px}
.enb--spot .enb__ui [data-enb-next]{display:none}

/* ⑱ 아코디언 패널 — 고른 패널이 넓게 펼쳐짐 */
.enb--accordion .enb__viewport{overflow:visible;border-radius:0}
.enb--accordion .enb__track{display:flex;gap:12px;height:calc(var(--enb-h) * 1.05)}
.enb--accordion .enb__slide{position:relative;flex:1 1 0;min-width:0;border-radius:24px;overflow:hidden;background:#111;box-shadow:var(--enb-sh);cursor:pointer;transition:flex-grow .75s cubic-bezier(.22,.8,.2,1)}
.enb--accordion .enb__slide.is-on{flex-grow:5.2;cursor:default}
.enb--accordion .enb__media::after{background:linear-gradient(0deg,rgba(8,8,14,.72),rgba(8,8,14,.08) 60%)}
/* 접힌 패널 = 책등(spine): 위 번호 + 가는 선 · 아래에서 위로 읽는 눕힌 제목(+ 작은 머리말) · 아래 유리 «+» 단추 */
.enb--accordion .enb__track{counter-reset:enba}
.enb--accordion .enb__slide{counter-increment:enba}
.enb--accordion .enb__slide:not(.is-on) .enb__media::after{background:linear-gradient(180deg,rgba(10,10,18,.62),rgba(10,10,18,.28) 34%,rgba(10,10,18,.38) 58%,rgba(10,10,18,.86)),linear-gradient(0deg,color-mix(in srgb,var(--enb-tone) 38%,transparent),transparent 55%)}
.enb--accordion .enb__media img{transition:transform .9s ease,filter .6s ease}
.enb--accordion .enb__slide:not(.is-on) .enb__media img{filter:saturate(.55) brightness(.92)}
.enb--accordion .enb__slide:not(.is-on):hover .enb__media img{transform:scale(1.06);filter:saturate(1) brightness(1)}
.enb--accordion .enb__body{position:absolute;left:34px;bottom:32px;width:min(500px,calc(100% - 68px))}
.enb--accordion .enb__slide.is-on .enb__title{font-size:clamp(26px,2.8vw,40px)}
.enb--accordion .enb__slide::before,.enb--accordion .enb__slide::after{position:absolute;left:50%;z-index:3;pointer-events:none;transition:opacity .35s ease,transform .45s cubic-bezier(.22,.8,.2,1),background-color .3s,color .3s}
.enb--accordion .enb__slide::before{content:counter(enba,decimal-leading-zero);top:26px;transform:translateX(-50%);padding-bottom:40px;font-size:13px;font-weight:800;letter-spacing:.14em;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.88);
  background:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,0)) center bottom/1px 28px no-repeat}
.enb--accordion .enb__slide::after{content:"+";bottom:24px;width:40px;height:40px;margin-left:-20px;display:grid;place-items:center;border-radius:50%;font-size:22px;font-weight:300;line-height:1;color:#fff;
  background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.38);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.enb--accordion .enb__slide:not(.is-on):hover::after{background:#fff;color:#16161f;transform:rotate(90deg)}
.enb--accordion .enb__slide.is-on::before,.enb--accordion .enb__slide.is-on::after{opacity:0;transform:translateX(-50%) translateY(-6px)}
.enb--accordion .enb__slide.is-on::after{transform:scale(.6)}
.enb--accordion .enb__slide:not(.is-on) .enb__body{left:50%;bottom:86px;width:auto;display:flex;flex-direction:column;gap:10px;align-items:flex-start;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);animation:enb-spine .6s cubic-bezier(.22,.8,.2,1) both}
@keyframes enb-spine{from{opacity:0;transform:translateX(-50%) rotate(180deg) translateY(-14px)}}
.enb--accordion .enb__slide:not(.is-on) :is(.enb__sub,.enb__cta){display:none}
.enb--accordion .enb__slide:not(.is-on) :is(.enb__eyebrow,.enb__title){margin:0;text-orientation:sideways;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-height:calc(var(--enb-h) * 1.05 - 178px)}
.enb--accordion .enb__slide:not(.is-on) .enb__eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:color-mix(in srgb,var(--enb-tone) 70%,#fff);opacity:.9}
.enb--accordion .enb__slide:not(.is-on) .enb__title{font-size:clamp(16px,1.25vw,19px);font-weight:800;letter-spacing:-.01em;line-height:1.15;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.enb--accordion .enb__slide:not(.is-on) .enb__title br{display:none}
.enb--accordion .enb__slide:not(.is-on) .enb__hit{display:none}

/* ⑲ 카드 부채 (팀이보플) — 기울어진 카드 부채 · 가운데 카드가 앞으로 */
.enb--fan{overflow-x:clip}
.enb--fan .enb__viewport{overflow:visible;border-radius:0}
.enb--fan .enb__track{position:relative;height:calc(var(--enb-h) * 1.05);margin:6px 0 10px}
.enb--fan .enb__slide{--cw:min(560px,56%);position:absolute;top:0;left:50%;width:var(--cw);height:100%;margin-left:calc(var(--cw) / -2);border-radius:26px;overflow:hidden;background:var(--enb-tone);box-shadow:0 24px 54px rgba(28,28,40,.2);transform-origin:50% 130%;transition:transform .85s cubic-bezier(.22,.8,.2,1),opacity .85s ease,filter .85s ease}
.enb--fan .enb__media{position:absolute;inset:0}
.enb--fan .enb__body{position:absolute;left:20px;right:20px;bottom:20px;padding:22px 24px;border-radius:20px;background:color-mix(in srgb,var(--enb-card) 93%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.enb--fan .enb__slide[data-pos="0"]{z-index:5}
.enb--fan .enb__slide[data-pos="1"]{z-index:4;transform:translateX(64%) rotate(7deg) scale(.88);filter:brightness(.9);cursor:pointer}
.enb--fan .enb__slide[data-pos="-1"]{z-index:4;transform:translateX(-64%) rotate(-7deg) scale(.88);filter:brightness(.9);cursor:pointer}
.enb--fan .enb__slide[data-pos="2"]{z-index:3;transform:translateX(116%) rotate(13deg) scale(.76);opacity:.75;filter:brightness(.85);cursor:pointer}
.enb--fan .enb__slide[data-pos="-2"]{z-index:3;transform:translateX(-116%) rotate(-13deg) scale(.76);opacity:.75;filter:brightness(.85);cursor:pointer}
.enb--fan .enb__slide[data-pos="far"]{z-index:1;transform:scale(.7);opacity:0}
.enb--fan .enb__slide:not([data-pos="0"]) :is(.enb__body,.enb__hit){display:none}
.enb--fan .enb__ui{justify-content:center}
.enb--fan .enb__grow{display:none}

/* ⑳ 컬러 패널 (독도재단) — 그림 옆 배너 색 패널 · 큰 번호 */
.enb--panel .enb__viewport{border-radius:24px;background:var(--enb-card);box-shadow:var(--enb-sh)}
.enb--panel .enb__track{counter-reset:enbp}
.enb--panel .enb__slide{counter-increment:enbp;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);grid-template-areas:"media body";min-height:var(--enb-h)}
.enb--panel .enb__media{grid-area:media;min-height:var(--enb-h)}
.enb--panel .enb__body{grid-area:body;display:flex;flex-direction:column;justify-content:center;padding:48px 46px;background:var(--enb-tone)}
.enb--panel .enb__body::before{content:counter(enbp,decimal-leading-zero);position:absolute;top:26px;right:32px;font-size:76px;font-weight:900;line-height:1;letter-spacing:-.04em;color:var(--enb-ink);opacity:.12}
.enb--panel .enb__body::after{content:"";position:absolute;left:0;top:48px;bottom:48px;width:4px;border-radius:0 4px 4px 0;background:var(--enb-ink);opacity:.85}
.enb--panel .enb__eyebrow{color:color-mix(in srgb,var(--enb-ink) 60%,transparent)}
.enb--panel .enb__sub{color:color-mix(in srgb,var(--enb-ink) 70%,transparent)}
.enb--panel .enb__cta{align-self:flex-start;background:var(--enb-ink);box-shadow:none}

/* 프로 템플릿 — 좁은 화면 */
@media (max-width:900px){
  .enb--cinema .enb__body,.enb--rail .enb__body,.enb--spot .enb__body,.enb--dock .enb__body{left:28px;width:calc(100% - 56px)}
  .enb--rail .enb__body{width:calc(100% - 180px)}
  .enb--spot .enb__body{top:auto;bottom:120px;transform:none}
  .enb--dock .enb__list{grid-auto-flow:column;grid-auto-columns:minmax(180px,1fr);overflow-x:auto;scrollbar-width:none}
  .enb--dock .enb__list::-webkit-scrollbar{display:none}
  .enb--accordion .enb__track{flex-direction:column;height:auto}
  .enb--accordion .enb__slide{flex:none;height:64px;transition:height .6s cubic-bezier(.22,.8,.2,1)}
  .enb--accordion .enb__slide.is-on{height:calc(var(--enb-h) * .95)}
  .enb--accordion .enb__slide:not(.is-on) .enb__body{left:62px;bottom:50%;writing-mode:horizontal-tb;flex-direction:column;gap:2px;transform:translateY(50%);animation:none}
  .enb--accordion .enb__slide:not(.is-on) :is(.enb__eyebrow,.enb__title){text-orientation:mixed;max-height:none;max-width:calc(100vw - 170px)}
  .enb--accordion .enb__slide:not(.is-on) .enb__title{font-size:15px}
  .enb--accordion .enb__slide:not(.is-on) .enb__eyebrow{font-size:9.5px}
  .enb--accordion .enb__slide::before{top:50%;left:22px;padding:0 0 0 0;background:none;transform:translateY(-50%)}
  .enb--accordion .enb__slide::after{bottom:auto;top:50%;left:auto;right:14px;margin:-17px 0 0;width:34px;height:34px;font-size:19px}
  .enb--accordion .enb__slide.is-on::before{transform:translateY(-50%)}
  .enb--fan .enb__slide{--cw:min(460px,72%)}
  .enb--fan .enb__slide[data-pos="1"]{transform:translateX(58%) rotate(7deg) scale(.86)}
  .enb--fan .enb__slide[data-pos="-1"]{transform:translateX(-58%) rotate(-7deg) scale(.86)}
  .enb--fan .enb__slide:is([data-pos="2"],[data-pos="-2"]){opacity:0}
  .enb--panel .enb__slide{grid-template-columns:minmax(0,1fr);grid-template-areas:"media" "body"}
  .enb--panel .enb__media{min-height:0;height:calc(var(--enb-h) * .62)}
  .enb--panel .enb__body{padding:30px 26px 28px}
  .enb--panel .enb__body::after{top:30px;bottom:30px}
}
@media (max-width:640px){
  .enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--rail,.enb--inset,.enb--spot) .enb__slide{min-height:calc(var(--enb-h) * 1.2)}
  .enb--cinema .enb__body,.enb--story .enb__body,.enb--rail .enb__body,.enb--spot .enb__body,.enb--dock .enb__body{left:20px;right:20px;width:auto;bottom:24px}
  .enb--dock .enb__body{top:auto;transform:none}
  .enb--spot .enb__body{bottom:104px}
  .enb--cinema .enb__body{bottom:72px}
  .enb--cinema .enb__list,.enb--rail .enb__list{display:none}
  .enb--rail .enb__ui{right:16px}
  .enb:is(.enb--cinema,.enb--rail,.enb--spot,.enb--dock,.enb--story) .enb__title{font-size:26px}
  .enb--typo .enb__body,.enb--inset .enb__body{padding:0 22px 26px}
  .enb--typo .enb__body{padding-top:26px}
  .enb.enb--typo .enb__title{font-size:clamp(38px,12vw,56px)}
  .enb.enb--inset .enb__title{font-size:clamp(32px,10vw,48px)}
  .enb--inset .enb__viewport{border-radius:24px}
  .enb:is(.enb--cinema,.enb--typo,.enb--story,.enb--dock,.enb--rail,.enb--inset,.enb--spot) .enb__ui{top:auto;bottom:16px;right:16px;left:auto}
  .enb--story .enb__ui{top:40px;bottom:auto}
  .enb--spot .enb__ui{left:16px;right:auto}
  .enb__spot{right:16px;bottom:16px;width:auto;max-width:calc(100% - 140px);padding:6px}
  .enb__spot-img,.enb__spot-t{display:none}
  .enb__spot-go{width:40px;height:40px}
  .enb--dock .enb__pick{padding:14px 16px}
  .enb--dock .enb__pick-n{font-size:17px}
  .enb--fan .enb__slide{--cw:80%}
  .enb--fan .enb__slide:is([data-pos="1"],[data-pos="-1"]){opacity:.5}
  .enb--fan .enb__body{left:12px;right:12px;bottom:12px;padding:16px 18px}
  .enb--accordion .enb__body{left:20px;bottom:22px;width:calc(100% - 40px)}
}

/* ═══════════ 팝업 ═══════════ */
.enp{position:fixed;z-index:1200;font-family:var(--enb-font);color:var(--enb-ink)}
.enp[hidden]{display:none!important}
.enp__box{position:relative;width:var(--enp-w,420px);max-width:calc(100vw - 32px);border-radius:22px;overflow:hidden;background:var(--enb-card);box-shadow:0 24px 60px rgba(28,28,40,.28);animation:enp-pop .32s cubic-bezier(.2,.8,.2,1);outline:none}
.enp__view{position:relative;overflow:hidden;background:#f6f6fa}
.enp__track{display:flex;transition:transform .45s cubic-bezier(.22,.8,.2,1)}
.enp__item{flex:0 0 100%;margin:0;min-width:0}
.enp__item a{display:block}
.enp__item img{display:block;width:100%;height:auto;max-height:calc(100vh - 170px);object-fit:contain}
.enp__arrow{position:absolute;top:50%;z-index:2;display:grid;place-items:center;width:36px;height:36px;margin-top:-18px;padding:0;border:0;border-radius:50%;background:color-mix(in srgb,var(--enb-card) 88%,transparent);color:var(--enb-ink);box-shadow:var(--enb-sh);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.enp__arrow.prev{left:10px}.enp__arrow.next{right:10px}
.enp__count{position:absolute;top:12px;right:12px;z-index:2;padding:3px 10px;border-radius:9999px;background:color-mix(in srgb,var(--enb-card) 88%,transparent);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.enp__dots{position:absolute;left:0;right:0;bottom:12px;z-index:2;display:flex;justify-content:center;gap:6px;pointer-events:none}
.enp__dots i{width:7px;height:7px;border-radius:9999px;background:rgba(255,255,255,.65);box-shadow:0 0 0 1px rgba(28,28,40,.12);transition:width .3s ease,background-color .3s ease}
.enp__dots i.is-on{width:20px;background:#fff}
.enp__bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 8px 8px 10px;background:var(--enb-card)}
.enp__bar button{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 12px;border:0;border-radius:12px;background:none;font:600 13px/1.4 var(--enb-font);color:var(--enb-mut);cursor:pointer}
.enp__bar button:hover{background:var(--enb-bg);color:var(--enb-ink)}
.enp__bar [data-enp-close]{color:var(--enb-ink)}
.enp__bar button:focus-visible,.enp__arrow:focus-visible{outline:3px solid color-mix(in srgb,var(--enb-ac) 45%,transparent);outline-offset:1px}
/* 가운데 모달 */
.enp--modal{inset:0;display:grid;place-items:center;padding:24px}
.enp--modal.has-dim{background:rgba(28,28,40,.42);animation:enp-fade .25s ease}
/* 나란히 레이어 */
.enp--layer{top:calc(var(--enp-top,96px) + 16px);left:24px;right:24px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:16px;pointer-events:none}
.enp--layer .enp__box{pointer-events:auto}
/* 오른쪽 아래 카드 */
.enp--corner{right:24px;bottom:24px}
.enp--corner .enp__box{width:min(var(--enp-w,420px),360px)}
@keyframes enp-pop{from{opacity:0;transform:translateY(16px) scale(.98)}}
@keyframes enp-fade{from{opacity:0}}
@keyframes enp-sheet{from{transform:translateY(100%)}}
/* 휴대폰: 아래에서 올라오는 시트 */
@media (max-width:640px){
  .enp.is-sheet{inset:0;display:flex;align-items:flex-end;padding:0;background:rgba(28,28,40,.42);animation:enp-fade .25s ease}
  .enp.is-sheet .enp__box{width:100%;max-width:none;border-radius:24px 24px 0 0;animation:enp-sheet .35s cubic-bezier(.2,.8,.2,1);padding-bottom:env(safe-area-inset-bottom)}
  .enp.is-sheet .enp__item img{max-height:62vh}
}
@media (prefers-reduced-motion:reduce){
  .enp *,.enp{animation:none!important;transition:none!important}
}

/* 와이드 모드 (관리자 › 배너 › 와이드) — 본문 폭(--w)을 넘어 화면 끝까지. 세로 스크롤바 폭은 promo.js 가 --enb-sbw 로 알려 줌 */
.enb--wide{--enb-vw:calc(100vw - var(--enb-sbw,0px));--enb-in:max(24px,calc((var(--enb-vw) - var(--w,1240px)) / 2));width:var(--enb-vw);max-width:none;margin-left:calc(50% - var(--enb-vw) / 2);margin-right:0}
body:has(.enb--wide){overflow-x:clip}
.enb--wide .enb__wrap{width:100%}
/* 카드형(멀티 카드 · 썸네일 · 카드 덱 · 벤토): 양옆 여백만 남기고 넓게 */
.enb--wide-gutter .enb__wrap{width:calc(100% - 48px)}
/* 이미지형: 모서리 없이 꽉 차게, 글 · 단추는 본문 줄에 맞춤 */
.enb--wide-bleed{padding-top:0}
.enb--wide-bleed .enb__viewport{border-radius:0}
.enb--wide-bleed .enb__ui,.enb--wide-bleed .enb__list{padding-inline:var(--enb-in)}
.enb--wide.enb--split .enb__slide{padding:32px var(--enb-in)}
.enb--wide.enb--split .enb__body{padding-left:0}
.enb--wide.enb--cover .enb__body{left:var(--enb-in)}
.enb--wide.enb--cover .enb__ui{right:var(--enb-in);padding:6px 6px 6px 16px}
.enb--wide.enb--center .enb__media{border-radius:0;box-shadow:none}
.enb--wide.enb--center .enb__body{padding-inline:24px}
.enb--wide.enb--tabs .enb__body{right:var(--enb-in)}
.enb--wide.enb--tabs .enb__ui{left:var(--enb-in);padding:5px}
.enb--wide.enb--minimal .enb__slide{padding-inline:var(--enb-in)}
/* 와이드: 배너 그림(1600×700, 16:7)이 잘리거나 늘어나지 않게 — 높이를 그림 비율로, 가운데 카드는 본문 폭까지만 (PC · 태블릿) */
@media (min-width:641px){
  .enb--wide.enb--peek{padding-top:28px;--enb-sw:min(74%,var(--w,1240px))}
  .enb--wide.enb--peek.per-2{--enb-sw:min(47%,760px)}
  .enb--wide.enb--peek.per-3{--enb-sw:min(32%,520px)}
  .enb--wide.enb--peek .enb__slide{height:auto;aspect-ratio:16 / 7;min-height:var(--enb-h)}
  .enb--wide.enb--cover .enb__slide,.enb--wide.enb--tabs .enb__slide{min-height:clamp(var(--enb-h),calc(var(--enb-vw) * 7 / 16),720px)}
  .enb--wide.enb--center .enb__media{height:clamp(calc(var(--enb-h) * .8),calc(var(--enb-vw) * 7 / 16),640px)}
}
@media (max-width:640px){
  .enb--wide{--enb-in:16px}
  .enb--wide-gutter .enb__wrap{width:calc(100% - 32px)}
  .enb--wide-bleed .enb__ui,.enb--wide-bleed .enb__list{padding-inline:16px}
}
