@font-face {
    font-family: 'JalpulrineunHaruche';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.0/Jal_Haru.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}


   .cd_font{
    font-size:23px;
   }

   @media screen and (max-width:530px) {
       .cd_font{
    font-size:16px;
   }
  }

   .hero{ text-align:center; max-width:820px; margin:0 auto 28px; }
   .hero .headline{
     font-family: 'JalpulrineunHaruche';
      font-weight:900; font-size:28px; line-height:1.2; letter-spacing:-.4px;
      color:#0f172a;padding:30px 0 10px;
    }

    /* 반응형 */
    @media (max-width:700px){
      .hero .headline{ font-size:41px; }

    }
    @media (max-width:520px){
.hero .headline{ font-size:31px; }
    }

    .hero .headline .hl{
      display:inline-block; color:#0b4a8b;
      background:linear-gradient(transparent 66%, #cfe7ff 66% 100%);
      border-radius:2px; padding:0 .04em;
    }

  a {text-decoration: none;}
  #applianceHero{
    position: relative;
    /* isolation: isolate;  */
    --ink:#0b1220;                     
    --blue:#044b41;                    
          
                     
    width:100%;              
    color: var(--ink);
    max-width:1000px;
    height:100%;
    margin: 0 auto;
    text-align:center;
    overflow:hidden;
      
  }

  
  #applianceHero .bg{
    position:absolute;
    z-index:-1;
    max-width:1000px;
    height:100%;
    width:100%;

  }
  #applianceHero .bg img{
    width:100%;
    height:100%;
    object-fit:cover;
  }
  #applianceHero .container{
    position:relative;
    
    margin: 0;
    
  }
  #applianceHero .badge{
    display:block;
    padding: 15px 0;
    font-weight:700;
    font-size: 42px;
    color:#fff;
    width:100%;
    margin:0;
    background: var(--blue);

    box-shadow: 0 4px 16px rgba(47,106,230,.25);
  }
  #applianceHero h1{
    margin-top: 14px;
    font-weight: 900;
    line-height: 1.14;
    letter-spacing: -0.02em;
    font-size: 70px;
    /* text-shadow: -2px 0px white, 0px 2px white, 2px 0px white, 0px -2px white; */
  }
  #applianceHero h1 .em{
    display:block;
    margin-top: 4px;
    /* font-size: 60px; */
    color:#3d53fb;
  }

  #add-tip{
    background-color: #044b41;color:#fff;padding:14px;font-size:2rem;
  }

  /* blink 클래스가 있을 때만 효과 */
  .blink { animation: blink 2s infinite; }
  @keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
  }

  /* 세련된 CTA 버튼 + 20초마다 한 번 지나가는 Shimmer */
  #applianceHero .cta-btn{
    position: relative;
    display:inline-block;
    margin-top: 28px;
    padding: 16px 36px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.01em;
    color:#fff;
    text-decoration:none;
    background: linear-gradient(135deg, #2a51ff, #2f6ae6 60%, #8ea4ff);
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(47,106,230,.35), inset 0 1px 0 rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.18);
    backdrop-filter: saturate(120%);
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
    overflow: hidden;
  }
  #applianceHero .cta-btn:hover{
    transform: translateY(-3px);
    box-shadow: 0 14px 28px rgba(47,106,230,.45), inset 0 1px 0 rgba(255,255,255,.22);
    filter: brightness(1.05);
  }
  #applianceHero .cta-btn:active{
    transform: translateY(-1px) scale(.99);
  }
  #applianceHero .cta-btn:focus-visible{
    outline: 3px solid rgba(255,255,255,.7);
    outline-offset: 2px;
  }
  /* Shimmer 레이어: 20초 주기로 한 번만 스윕 */
  #applianceHero .cta-btn::before{
    content:"";
    position:absolute;
    top:-50%;
    left:-30%;
    width:60%;
    height:200%;
    background: linear-gradient(120deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.75) 50%,
      rgba(255,255,255,0) 100%);
    transform: translateX(-150%) rotate(18deg);
    opacity:0;
    pointer-events:none;
    mix-blend-mode: screen;
    /* 20초 동안 대기 → 마지막 구간에만 스윕 */
    animation: shimmerSweep 20s linear infinite;
  }
  @keyframes shimmerSweep{
    0%, 93% {
      transform: translateX(-150%) rotate(18deg);
      opacity:0;
    }
    94% { opacity:.0; }
    95% {
      opacity:.9;
      transform: translateX(-150%) rotate(18deg);
    }
    100% {
      opacity:0;
      transform: translateX(150%) rotate(18deg);
    }
  }

  @media (prefers-reduced-motion: reduce){
    .blink, #applianceHero .cta-btn::before { animation: none !important; }
    #applianceHero .cta-btn { transition: none; }
  }

  @media screen and (max-width:768px) {
    #applianceHero .badge{
      font-size:27px;
      /* width:200px; */
    }
    #applianceHero h1{ font-size: 55px; }
    #applianceHero h1 .em{
      /* font-size: 45px; */
      /* 모바일에서 깜빡임이 더 촘촘하게 */

    }
    #applianceHero .cta-btn{
      font-size:18px;
      padding:14px 28px;
      margin-top:20px;
      border-radius: 12px;
    }
  }

  /* 하단 이미지(사용 시 활성화) */
  #applianceHero .bottom-img{
    position:absolute; bottom:0; left:0; width:100%;
  }
  #applianceHero .bottom-img img{
    display:block; width:100%; height:auto;
  }

    /* #m-bg{display:none !important;}
    #m1-bg{display:none !important;} */

  @media screen and (max-width:930px) {
    /* #pc-bg{display:none !important; }
    #m-bg{display:block !important;}
    #m1-bg{display:none !important;}
  }
  @media screen and (max-width:530px) {
    #pc-bg{display:none !important;}
    #m-bg{display:none !important;}
    #m1-bg{display:block !important;} */

 #applianceHero .badge{
      font-size:26px;
      /* width:200px; */
    }
    #applianceHero h1{ font-size: 35px; }
    #applianceHero h1 .em{
      font-size: 45px;
      /* 모바일에서 깜빡임이 더 촘촘하게 */
   
    }
    #applianceHero .cta-btn{
      font-size:18px;
      padding:14px 28px;
      margin-top:20px;
      border-radius: 12px;
    }

      #add-tip{
   font-size:24px;
  }

  }

    @media screen and (max-width:530px) {


       #applianceHero .badge{
      font-size:19px;
      /* width:200px; */
    }
    #applianceHero h1{ font-size: 35px; }
    #applianceHero h1 .em{
      font-size: 45px;
      /* 모바일에서 깜빡임이 더 촘촘하게 */
   
    }
    #applianceHero .cta-btn{
      font-size:18px;
      padding:14px 28px;
      margin-top:20px;
      border-radius: 12px;
    }


      #add-tip{
   font-size:18px;
  }

    }



      /* ================= Scope: #lgStylerHero only ================= */
    #lgStylerHero{
      --ink:#ffffff;
      --muted:#e7eaee;
      --brand-red:#e60012;
      --brand-red-2:#ff2a3b;
      --brand-black:#0e1115;
      --glass:rgba(15,17,21,.70);
      --glass-line:rgba(255,255,255,.14);
      --shadow:0 10px 30px rgba(0,0,0,.35);
      --radius:16px;
      --max:1200px;
      --padX: clamp(16px, 4vw, 36px);
      --padY: clamp(16px, 5vw, 48px);

      /* ⏱ 타이밍 */
      --slide-duration: 3600ms; /* 확대(kenburns) 시간 */
      --fade-duration: 900ms;   /* 교차 페이드 시간 */
      --interval: 3800ms;       /* 다음 이미지로 바뀌는 간격(3~4초) */

      position:relative; color:var(--ink);
      font-family:Pretendard, "Noto Sans KR", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      margin:0 auto; max-width:var(--max); min-height:600px; overflow:hidden;
      border-radius:20px; background:var(--brand-black); isolation:isolate;

      /* 하단 로고 티커 영역 여백 확보 */
      padding-bottom:84px;
    }

    /* ::before 는 사용 안함 */
    #lgStylerHero::before{ content:""; display:none !important; }

    /* 은은한 하이라이트 오버레이 */
    #lgStylerHero::after{
      content:""; position:absolute; inset:0; z-index:-1;
      background:radial-gradient(60% 70% at 25% 55%, rgba(255,255,255,.22), rgba(0,0,0,0) 60%);
      pointer-events:none;
    }

    /* ====== 배경 슬라이드 ====== */
    #lgStylerHero .bg-deck{
      position:absolute; inset:0; z-index:-2; overflow:hidden;
    }
    #lgStylerHero .bg-slide{
      position:absolute; inset:0;
      background-size:cover; background-position:center;
      filter: brightness(var(--bg-brightness, 1));
      transform: scale(1);
      opacity:0;
      z-index:0;
      transition: opacity var(--fade-duration) ease;
      will-change: transform, opacity;
    }
    /* 들어오는 슬라이드: 페이드인 + 확대 시작(동시) */
    #lgStylerHero .bg-slide.active{
      z-index:2;
      opacity:1;
      animation: kenburns var(--slide-duration) ease-in-out forwards;
    }
    /* 나가는 슬라이드: '확대 상태' 유지한 채 페이드아웃만 */
    #lgStylerHero .bg-slide.leaving{
      z-index:1;
      opacity:0;
      /* transform 은 JS가 현재값을 고정시켜줌(축소로 복귀 금지) */
    }
    @keyframes kenburns{
      from{ transform: scale(1);   }
      to  { transform: scale(1.08);}
    }

    /* ===== 레이아웃 ===== */
    #lgStylerHero .inner{
      position:relative; display:grid;
      grid-template-rows: 1fr 1fr; grid-template-columns: 1fr 1fr;
      min-height:600px; padding: var(--padY) var(--padX);
    }

    /* 제목/카피(고정) */
    #lgStylerHero .copy{ grid-column:1 / 2; grid-row:1 / 2; align-self:center; justify-self:start; text-align:left;     line-height: 140%;
 }
    #lgStylerHero .eyebrow{
      display:inline-block; padding:8px 14px; border-radius:999px;
      background:linear-gradient(180deg, var(--brand-red) 0%, var(--brand-red-2) 100%);
      color:#fff; font-size:clamp(13px, 1.5vw, 16px); font-weight:800; letter-spacing:.2px;
      margin-bottom:12px;
    }
    #lgStylerHero .blink{ animation: blink 1.5s infinite; }
    @keyframes blink { 0%, 49%, 100% { opacity: 1; } 50%, 70% { opacity: 0; } }

    #lgStylerHero .title{
      line-height:140%; font-weight:900; font-size:50px;
      margin:0 0 14px 0; text-shadow:0 6px 18px rgba(0,0,0,.35);
    }
    @media screen and (max-width:530px) { #lgStylerHero .title{ font-size:43px; } }
    @media screen and (max-width:420px) { #lgStylerHero .title{ font-size:35px; } }

    /* 리스트(고정) */
    #lgStylerHero .feature-list{
      grid-row:2 / 3; 
      display:flex; flex-direction:column; gap:12px; width:min(420px, 92%);
    }
    #lgStylerHero .feature{
        font-family: 'JalpulrineunHaruche';
      position:relative; background:var(--glass);
      border:1px solid rgba(255,255,255,.14);
      border-radius:14px; padding:16px 22px; text-align:center;
      font-size:clamp(15px, 1.8vw, 18px); font-weight:800; letter-spacing:-.2px;
      box-shadow:var(--shadow);

    }
    #lgStylerHero .feature::before{
      content:""; position:absolute; left:10px; top:50%; transform:translateY(-50%);
      width:6px; height:70%; border-radius:6px; background:linear-gradient(180deg, var(--brand-red-2), var(--brand-red));
      box-shadow:0 0 0 1px rgba(255,255,255,.16) inset, 0 6px 16px rgba(230,0,18,.35);
    }

    /* 뱃지 */
    #lgStylerHero .badge{
      position:absolute; top:20px; right:20px; z-index:5;
      background:var(--brand-red);
      color:#fff; font-weight:900; font-size:clamp(14px, 2vw, 18px);
      padding:16px 20px; border-radius:50%; text-align:center; line-height:1.2;
      box-shadow:0 6px 16px rgba(0,0,0,.3);
    }

    /* 카운트 숫자 강조(선택사항) */
    #lgStylerHero .count{
      display:inline-block; min-width:1ch;
      text-shadow:0 4px 14px rgba(0,0,0,.35);
    }

    /* ===== 하단 브랜드 로고 티커 ===== */
    #lgStylerHero .brand-ticker{
      position:absolute; left:0; right:0; bottom:0; height:72px;
      z-index:3; /* 콘텐츠 위, 배경 위 */
      background:#ffffff67;
      border-top:1px solid rgba(255,255,255,.10);
      /* backdrop-filter: blur(2px); */
      display:flex; align-items:center; overflow:hidden;
      pointer-events:auto;
    }
    #lgStylerHero .brand-ticker .track{
      display:flex; align-items:center; gap:36px;
      padding-inline:24px;
      will-change: transform;
      animation: ticker-move 28s linear infinite;
      /* ✅ 어떤 상태에서도 멈추지 않도록 명시적으로 유지 */
      animation-play-state: running !important;
    }
    /* 좌→우 흐름 */
    @keyframes ticker-move{
      from { transform: translateX(-50%); }
      to   { transform: translateX(0%); }
    }
    /* ✅ hover/active/focus-within에도 절대 멈추지 않게 강제 */
    #lgStylerHero .brand-ticker:hover .track,
    #lgStylerHero .brand-ticker:active .track,
    #lgStylerHero .brand-ticker:focus-within .track{
      animation-play-state: running !important;
    }

    #lgStylerHero .brand-ticker img{
      height:34px; width:auto; opacity:.92; filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));
      object-fit:contain; user-select:none; -webkit-user-drag:none;
      pointer-events:none; /* 이미지 드래그/터치로 인한 hover 변동 방지 */
    }

    /* 반응형 */
    @media (max-width: 900px){
      #lgStylerHero .inner{ grid-template-columns:1fr; grid-template-rows:auto auto; text-align:center; }
      #lgStylerHero .copy{ grid-column:1; grid-row:1; justify-self:center; align-self:center; text-align:center; }
      #lgStylerHero .feature-list{ grid-column:1; grid-row:2; justify-self:center; align-self:center; width:min(520px, 95%); }
      #lgStylerHero .feature::before{ left:14px; }
      #lgStylerHero .badge{ top:10px; right:10px; font-size:14px; padding:12px 14px; }
      #lgStylerHero{ padding-bottom:76px; }
      #lgStylerHero .brand-ticker{ height:64px; }
      #lgStylerHero .brand-ticker img{ height:28px; }
      #lgStylerHero .brand-ticker .track{ gap:24px; }
    }
    @media (max-width: 530px){
      #lgStylerHero .badge{ top:10px; right:10px; font-size:11px; padding:12px 14px; }
    }

    /* 모션 최소화 환경 */
    @media (prefers-reduced-motion: reduce){
      #lgStylerHero .bg-slide{ transition:none; animation:none; transform:none; }
      #lgStylerHero .brand-ticker .track{ animation:none; transform:translateX(-25%); }
    }




      /* ================= Scope: #applianceGuideMenu only ================= */
    #applianceGuideMenu{
      --ink:#0b1220;
      --chip-bg-1:#767b85;
      --chip-bg-2:#6a6f78;
      --chip-ink:#ffffff;
      --thumb-shadow:0 1px 2px rgba(16,24,40,.06), 0 10px 26px rgba(16,24,40,.12);
      --chip-shadow:0 1px 1px rgba(255,255,255,.18) inset, 0 -1px 0 rgba(0,0,0,.06) inset, 0 2px 8px rgba(16,24,40,.10);
      --radius-img:20px;
      --gap:18px;
      --max: 470px;
      font-family: Pretendard, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      color:var(--ink);
      max-width: var(--max);
      margin:0 auto;
      padding: 18px 10px 26px;
    }

    /* ===== 제목 & 부제목 ===== */
    #applianceGuideMenu .head{
      text-align:center;
      margin:70px 0;
    }
    #applianceGuideMenu .head .title{
      font-size: 42px;
      font-weight: 800;
      color: var(--ink);
      margin: 0 0 6px 0;
    }
    #applianceGuideMenu .head .subtitle{
      font-size: 42px;
      font-weight: 800;
      color: #ff3936;
      background: linear-gradient(to top, #ffd6d6 40%, transparent 40%);
      display: inline-block;
      padding: 0 2px;
    }

    @media screen and (max-width:530px) {        
      #applianceGuideMenu .head .title{ font-size: 32px; }
      #applianceGuideMenu .head .subtitle{ font-size: 32px; }
    }

    /* 그리드 */
    #applianceGuideMenu .grid{
      display:grid;
      grid-template-columns: repeat(3, minmax(0,1fr));
      gap: var(--gap);
      align-items:start;
    }

    /* 타일 */
    #applianceGuideMenu .tile{
      text-decoration:none; color:inherit;
      display:flex; flex-direction:column; align-items:center;
      transition: transform .16s ease;
    }
    #applianceGuideMenu .tile:focus-visible{ outline:2px solid #94a3b8; outline-offset:4px; border-radius:16px; }

    /* 이미지 영역 */
    #applianceGuideMenu .thumb{
      position:relative;
      width:100%;
      aspect-ratio: 1/1;
      border-radius: var(--radius-img) var(--radius-img) 0 0;
      overflow:hidden;
      box-shadow: var(--thumb-shadow);
      /* background:#f2f3f5; */
    }
    #applianceGuideMenu .thumb img{
      width:100%; height:100%; object-fit:contain; display:block;
      transition: transform .25s ease;
    }

    /* 회사 로고(원형) */
    #applianceGuideMenu .brand-logo{
      position:absolute;
      top:10px; left:10px;
      width:32px; height:32px;
      border-radius:50%;
      background:#ffffff1e;
      display:flex; align-items:center; justify-content:center;
      box-shadow:0 2px 6px rgba(0,0,0,.2);
      overflow:hidden;
    }
    #applianceGuideMenu .brand-logo img{
      width:80%; height:80%;
      object-fit:contain; display:block;
    }
    #applianceGuideMenu .thumb img.contain{ object-fit:contain !important; }

    /* 배지 묶음 */
    #applianceGuideMenu .badge-stack{
      position:absolute;
      top:10px; right:10px;
      display:flex; flex-direction:column; gap:6px;
      align-items:flex-end;
    }
    #applianceGuideMenu .badge{
      padding:6px 10px;
      border-radius:999px;
      font-size:12px;
      font-weight:800;
      color:#fff;
      line-height:1;
      box-shadow:0 2px 6px rgba(0,0,0,.2);
      white-space:nowrap;
      backdrop-filter: saturate(120%);
    }

    @media screen and (max-width:540px) {
      #applianceGuideMenu .badge{ font-size:10px; }
    }
    @media screen and (max-width:440px) {
      #applianceGuideMenu .badge{ font-size:9px; }
    }
    @media screen and (max-width:400px) {
      #applianceGuideMenu .badge{ font-size:7.5px; }
    }

    #applianceGuideMenu .badge.urgent{ background:linear-gradient(135deg,#ff3b30,#ff2d55); animation: blink 1s step-start infinite; }
    @keyframes blink { 50% { opacity:0; } }
    #applianceGuideMenu .badge.best{ background:linear-gradient(135deg,#6a5af9,#4f46e5); }
    #applianceGuideMenu .badge.new{ background:linear-gradient(135deg,#00c48c,#02a66a); }
    #applianceGuideMenu .badge.limited{ background:linear-gradient(135deg,#f59e0b,#f97316); }

    /* 라벨 */
    #applianceGuideMenu .label{
      font-family: 'JalpulrineunHaruche';
      width:93.9%;
      min-height:38px;
      padding: 10px 12px;
      background: linear-gradient(180deg, #000000c8, var(--chip-bg-2));
      color: var(--chip-ink);
      font-size:12px;
      font-weight:600;
      letter-spacing:-.2px;
      line-height:1.2;
      text-align:center;
      display:flex; align-items:center; justify-content:center;
      box-shadow: var(--chip-shadow);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      border-radius: 0 0 var(--radius-img) var(--radius-img);
    }

    @media screen and (max-width:1300px){
      #applianceGuideMenu .label{ width:94%; min-height:38px; }
      #applianceGuideMenu .brand-logo{ width:38px; height:38px; }
    }
    @media screen and (max-width:1250px){
      #applianceGuideMenu .label{ width:93.7%; min-height:38px; }
      #applianceGuideMenu .brand-logo{ width:38px; height:38px; }
    }
    @media screen and (max-width:950px){
      #applianceGuideMenu .label{ width:89.4%; min-height:38px; }
      #applianceGuideMenu .brand-logo{ width:38px; height:38px; }
    }
    @media screen and (max-width:840px){
      #applianceGuideMenu .label{ width:89.7%; min-height:8px;font-size:9px; }
      #applianceGuideMenu .brand-logo{ width:38px; height:38px; }
    }
    @media screen and (max-width:540px){
      #applianceGuideMenu .label{ width:88.7%; min-height:8px;font-size:9px; }
      #applianceGuideMenu .brand-logo{ width:21px; height:21px; }
    }
    @media screen and (max-width:480px){
      #applianceGuideMenu .label{ width:87.7%; min-height:8px; }
      #applianceGuideMenu .brand-logo{ width:21px; height:21px; }
    }
    @media screen and (max-width:440px){
      #applianceGuideMenu .label{ width:87%; min-height:8px;font-size:8.5px; }
      #applianceGuideMenu .brand-logo{ width:21px; height:21px; }
    }
    @media screen and (max-width:380px){
      #applianceGuideMenu .label{ width:85.4%; min-height:8px; }
      #applianceGuideMenu .brand-logo{ width:34px; height:34px; top:8px; left:8px; }
      #applianceGuideMenu .brand-logo{ width:21px; height:21px; }
    }

    /* Hover 효과 */
    #applianceGuideMenu .tile:hover{ transform: translateY(-2px); }
    #applianceGuideMenu .tile:hover .thumb img{ transform: scale(1.02); }

    /* 넓은 화면에서 3열 */
    @media (min-width: 900px){
      #applianceGuideMenu{ max-width: 1200px; }
      #applianceGuideMenu .grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
    }

    /* ================= Scroll Reveal Animations (재진입 재실행) ================= */
    @media (prefers-reduced-motion: reduce) {
      #applianceGuideMenu .reveal { opacity:1 !important; transform:none !important; animation:none !important; }
    }
    #applianceGuideMenu .reveal{
      opacity:0;
      transform: translate3d(0,0,0);
      will-change: opacity, transform;
    }
    /* in 상태일 때 각 효과 실행 */
    #applianceGuideMenu .reveal.in.fadeIn      { animation: agm-fadeIn .8s cubic-bezier(.22,.61,.36,1) both; }
    #applianceGuideMenu .reveal.in.fadeInUp    { animation: agm-fadeInUp .8s cubic-bezier(.22,.61,.36,1) both; }
    #applianceGuideMenu .reveal.in.fadeInDown  { animation: agm-fadeInDown .8s cubic-bezier(.22,.61,.36,1) both; }
    #applianceGuideMenu .reveal.in.fadeInLeft  { animation: agm-fadeInLeft .8s cubic-bezier(.22,.61,.36,1) both; }
    #applianceGuideMenu .reveal.in.fadeInRight { animation: agm-fadeInRight .8s cubic-bezier(.22,.61,.36,1) both; }
    /* 스태거 지연 */
    #applianceGuideMenu .reveal.in{ animation-delay: calc(var(--i, 0) * 90ms); }

    @keyframes agm-fadeIn {
      from { opacity:0; transform: translate3d(0, 6px, 0) scale(0.995); filter: blur(1px); }
      to   { opacity:1; transform: none; filter: blur(0); }
    }
    @keyframes agm-fadeInUp {
      from { opacity:0; transform: translate3d(0, 18px, 0); }
      to   { opacity:1; transform: none; }
    }
    @keyframes agm-fadeInDown {
      from { opacity:0; transform: translate3d(0, -18px, 0); }
      to   { opacity:1; transform: none; }
    }
    @keyframes agm-fadeInLeft {
      from { opacity:0; transform: translate3d(-18px, 0, 0); }
      to   { opacity:1; transform: none; }
    }
    @keyframes agm-fadeInRight {
      from { opacity:0; transform: translate3d(18px, 0, 0); }
      to   { opacity:1; transform: none; }
    }


        /* ---------- Scope: #eventList only ---------- */
    #eventList{
      /* Light tone tokens — 이미지 톤앤매너(따뜻한 화이트 & 레드 포인트)로 조정 */
      --bg:#faf7f7;           /* 미세하게 따뜻한 배경 톤 */
      --panel:#ffffff;
      --line:#e9e1e1;         /* 차가운 회색 → 웜그레이 */
      --ink:#111827;
      --muted:#7b6f6f;        /* 약간 따뜻한 무채색 */
      --blue:#e53935;         /* 메인 포인트 → 레드 */
      --blue-2:#c62828;       /* 보조 포인트 → 딥레드 */
      --hl:#ffd6d6;           /* 밑줄 하이라이트 → 라이트 핑크 */
      --radius:12px;

      font-family: Pretendard, "Noto Sans KR", sans-serif;
      background: radial-gradient(80% 130% at 50% 0%, #fff 0%, var(--bg) 80%);
      padding:40px 20px;
      color:var(--ink);
      max-width:960px;
      margin:0 auto;
    }

    /* ===== 상단 헤더 (배너 레이아웃) ===== */
    #eventList .hero{
      text-align:center;
      max-width:760px;
      margin:0 auto 28px;
    }
    #eventList .hero .headline{
      font-size:60px;
      font-weight:900;
      letter-spacing:-.4px;
      line-height:1.2;
      color:var(--ink);
    }
    #eventList .hero .headline .hl{
      position:relative;
      display:inline-block;
      color:var(--blue-2); /* 포인트 컬러 → 딥레드 */
      /* 밑줄 하이라이트 */
      background: linear-gradient(transparent 65%, var(--hl) 65% 100%);
      padding:0 .06em;
      border-radius:2px;
    }


    @media screen and (max-width: 600px) {
        #eventList .hero .headline{
      font-size:40px;
  
    }
  

    }

    #eventList .hero .sub{
      margin-top:12px;
      font-size:17px;
      font-weight:800;
      color:var(--ink);
    }
    @media screen and (max-width: 530px) {
      #eventList .hero .sub{ font-size:12px; }
    }
    #eventList .hero .note{
      margin-top:8px;
      font-size:14px;
      color:var(--muted);
    }

    /* 포인트 3개 바 */
    #eventList .points{
      margin:26px auto 34px;
      background:#6d5c54;               /* 레드 바 */
      color:#fff;
      border-radius:10px;
      padding:22px 16px;
      box-shadow:0 6px 14px rgba(122, 101, 101, 0.18); /* 레드톤 그림자 */
    }
    #eventList .points .wrap{
      display:grid;
      grid-template-columns: repeat(3, 1fr);
      gap:0;
      max-width:860px;
      margin:0 auto;
      align-items:center;
      text-align:center;
    }
    #eventList .points .col{
      padding:8px 10px;
      display:flex;
      flex-direction:column;
      gap:6px;
    }
    #eventList .points .label{
      font-size:16px;
      color:#c8c3c0;        /* 라벨도 레드톤 라이트 */
      font-weight:600;
    }
    #eventList .points .value{
       font-family: 'JalpulrineunHaruche';
      font-size:24px;
      font-weight:900;
      letter-spacing:-.3px;
      line-height:1.2;
    }


    /* 세로 구분선 */
    #eventList .points .col:not(:last-child){
      position:relative;
    }
    #eventList .points .col:not(:last-child)::after{
      content:"";
      position:absolute; right:0; top:50%; transform:translateY(-50%);
      width:2px; height:42px;
      background:linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,.75), rgba(255,255,255,.3));
      border-radius:1px;
    }

    /* ===== 기존 카드 리스트 (밝은 톤 유지) ===== */
    #eventList .item{
      display:flex;
      justify-content:space-between;
      align-items:center;
      background:linear-gradient(180deg, var(--panel) 0%, #fbf5f5 100%); /* 웜화이트 그라데이션 */
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:20px;
      margin-bottom:14px;
      transition:background .45s ease, transform .35s ease, box-shadow .35s ease, border-color .35s ease;
      box-shadow:0 4px 12px rgba(0,0,0,.06);
    }
    #eventList .item:last-child{ margin-bottom:0; }

    #eventList .item .txt{
      font-size:24px;
      font-weight:700;
      line-height:1.45;
      color:var(--ink);
    }
    #eventList .item .txt strong{
      color:var(--blue-2);   /* 강조 → 딥레드 */
      font-size:26px;
      font-weight:900;
    }
    #eventList .item img{
      max-width:90px;
      height:auto;
      border-radius:8px;
      margin-left:16px;
      transition: transform .35s ease, filter .35s ease;
      border:1px solid var(--line);
      background:#fff;
    }

    /* 자동 강조(액티브) – 레드 포커스 */
    #eventList .item.active{
      background:
        linear-gradient(135deg, #fff 0%, #fff1f1 50%, #ffe0e0 75%, #ffc9c9 100%);
      border-color:#ffb3b3;
      transform:translateY(-2px);
      box-shadow:0 10px 22px rgba(198,40,40,.22); /* 레드 그림자 */
    }
    #eventList .item.active .txt{ color:#4c1a1a; }
    #eventList .item.active .txt strong{ color:var(--blue-2); text-shadow:0 0 8px rgba(198,40,40,.14); }
    #eventList .item.active img{ transform:scale(1.05); filter:saturate(1.06) brightness(1.03); }



    @media screen and (max-width:840px) {
      
         #eventList .points .value{
      font-size:19px;
     
    }
    }

     @media screen and (max-width:680px) {
      
         #eventList .points .value{
      font-size:16px;
     
    }
    }

    /* 반응형 */
    @media (max-width:640px){
      #eventList .points .value{font-size:17px;}
    }
/* 
    @media (max-width:580px){
    
      #eventList .points .value{font-size:15px;}
    }

    @media (max-width:540px){
    
      #eventList .points .value{font-size:13px;}
    } */

    @media (max-width:627px){
        #eventList .points .wrap{ grid-template-columns:1fr; gap:12px; }
      #eventList .points .col:not(:last-child)::after{ display:none; }
      #eventList .item .txt{ font-size:17px; }
      #eventList .item .txt strong{ font-size:17px; }
      #eventList .points .value{ font-size:23px;}
    }

    /* 깜박임(상단 배너 강조와 톤 맞춤) */
    #eventList .blink{
      animation: blink 1.5s infinite;
    }
    @keyframes blink{
      0%,49%,100%{ opacity:1; }
      50%,70%{ opacity:0; }
    }

    /* ===== 하이라이터(형광펜) 스크롤 애니메이션 ===== */
    #eventList .marker{
      position:relative;
      display:inline-block;
      padding:0 .08em;
      z-index:0;
    }
    /* 형광펜 브러시(초기에는 0, 보이면 좌→우로 쓸림) */
    #eventList .marker::before{
      content:"";
      position:absolute;
      left:-.12em; right:-.12em;
      top:58%;
      height:0.64em;
      border-radius:6px;
      transform-origin:left center;
      transform:scaleX(0) skewX(-10deg);
      z-index:-1;
      /* 형광펜 느낌의 그라데이션 + 약간의 질감 */
      background:
   linear-gradient(90deg, #fff59a36 0%, #ffe76573 50%, #ffd94aa6 100%);
      box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
      transition: transform 720ms cubic-bezier(.2,.8,.2,1);
    }
    /* on일 때 실제로 칠해짐 */
    #eventList .marker.on::before{
      transform:scaleX(1) skewX(-10deg);
    }
    /* 시각적 강조를 조금 더 */
    #eventList .marker.on{
      text-shadow:0 0 0 rgba(0,0,0,0); /* 텍스트 자체는 변형 X */
    }

    /* 접근성: 모션 최소화 설정 시 즉시 표시 */
    @media (prefers-reduced-motion: reduce){
      #eventList .marker::before{ transition:none; transform:scaleX(1) skewX(-10deg); }
    }


      /* ===== Scope: #whoCanPartner only ===== */
    #whoCanPartner{
      --ink:#0b1220;
      --sub:#475569;
      --brand:#0b4a8b;    /* 포인트 블루 */
      --brand-2:#184a7d;  /* 바 배경 블루 */
      --hl:#cfe7ff;       /* 하이라이트 밑줄 */
      --line:#e5e7eb;
      --card:#ffffff;
      --thumb-bg:#fff6e8;
      font-family: Pretendard, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, Apple SD Gothic Neo, sans-serif;
      color:var(--ink);
      max-width: 1000px;
      margin: 0 auto;
      padding: 36px 16px 56px;
    }

    /* ===== 상단 배너형 헤더 ===== */
    #whoCanPartner .hero{ text-align:center; max-width:820px; margin:0 auto 28px; }
    #whoCanPartner .hero .headline{
      font-weight:900; font-size:60px; line-height:1.2; letter-spacing:-.4px;
      color:#0f172a;padding:50px 0;
    }

    /* 반응형 */
    @media (max-width:700px){
      #whoCanPartner .hero .headline{ font-size:41px; }
    }
    @media (max-width:520px){
      #whoCanPartner .hero .headline{ font-size:31px; }
    }

    #whoCanPartner .hero .headline .hl{
      display:inline-block; color:#c62828;
      background:linear-gradient(transparent 66%, #ffc9dd 66% 100%);
      border-radius:2px; padding:0 .04em;
    }
    #whoCanPartner .hero .sub{
      margin-top:12px; font-size:22px; font-weight:800; color:#111827;
    }
    #whoCanPartner .hero .note{
      margin-top:8px; font-size:14px; color:#94a3b8;
    }

    /* 포인트 3분할 바 */
    #whoCanPartner .points{
      margin:26px auto 34px;
      background:var(--brand-2); color:#fff;
      border-radius:12px; padding:22px 16px;
      box-shadow:0 8px 18px rgba(24,74,125,.16);
      max-width:920px;
    }
    #whoCanPartner .points .wrap{
      display:grid; grid-template-columns:repeat(3,1fr); align-items:center; text-align:center;
    }
    #whoCanPartner .points .col{ padding:6px 10px; }
    #whoCanPartner .points .label{ font-size:16px; color:#cfe3fb; font-weight:600; }
    #whoCanPartner .points .value{ font-size:28px; font-weight:900; letter-spacing:-.3px; }
    #whoCanPartner .points .col:not(:last-child){ position:relative; }
    #whoCanPartner .points .col:not(:last-child)::after{
      content:""; position:absolute; right:0; top:50%; transform:translateY(-50%);
      width:2px; height:44px; border-radius:1px;
      background:linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,.65), rgba(255,255,255,.25));
    }

    /* 기존 타이틀/부제는 사용 안 함 */
    #whoCanPartner .head{ display:none; }

    /* ===== 카드 그리드 ===== */
    #whoCanPartner .grid{
      display:grid; grid-template-columns: 1fr 1fr; gap:18px;
    }
    @media (max-width:630px){ #whoCanPartner .grid{ grid-template-columns:1fr; } }

    #whoCanPartner .card{
      background:var(--card); border:1px solid var(--line); border-radius:18px;
      box-shadow:0 1px 0 rgba(16,24,40,.04), 0 1px 2px rgba(16,24,40,.06);
      overflow:hidden; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
      text-decoration:none; color:inherit; display:block;
    }
    #whoCanPartner .card:hover{ transform:translateY(-2px); border-color:#d9dee5; box-shadow:0 10px 24px rgba(16,24,40,.12); }

    #whoCanPartner .thumb{ position:relative; background:var(--thumb-bg); aspect-ratio:5/2; overflow:hidden; }
    #whoCanPartner .thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .45s ease, filter .35s ease; }
    #whoCanPartner .card:hover .thumb img{ transform:scale(1.03); filter:saturate(1.02); }

    #whoCanPartner .tag{
      position:absolute; bottom:16px; display:flex; align-items:center; gap:8px;
      background:#111827; color:#fff; padding:8px 10px; border-radius:10px;
      font-size:13px; line-height:1; font-weight:700; box-shadow:0 6px 16px rgba(0,0,0,.22); white-space:nowrap;
    }
    #whoCanPartner .tag i{ display:inline-block; font-style:normal; font-weight:800; font-size:12px; color:#111827; background:#ff8a00; padding:4px 8px; border-radius:6px; }
    #whoCanPartner .tag.left{ left:16px; } .right{ right:16px; }

    #whoCanPartner .info{ text-align:center; padding:14px 12px 18px; }
    #whoCanPartner .info .leading{ font-weight:900; font-size:22px; color:#6d5c54; margin-bottom:6px; }
    #whoCanPartner .info .desc{ font-size:17px; color:#1f2937; }

    /* FadeIn */
    #whoCanPartner .card.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.65,.25,1); }
    #whoCanPartner .card.reveal.show{ opacity:1; transform:none; }
    #whoCanPartner .grid .card.reveal:nth-child(2n){ transition-delay:.06s; }
    #whoCanPartner .grid .card.reveal:nth-child(3n){ transition-delay:.12s; }
    @media (prefers-reduced-motion:reduce){ #whoCanPartner .card.reveal{ opacity:1; transform:none; } }

    /* ===== 하단 “...” 인디케이터 ===== */
    #whoCanPartner .more-indicator{
      display:flex; align-items:center; justify-content:center;
      gap:12px; margin:18px 0 6px 0; padding:10px 0 2px;
      width:100%;
      /* 클릭 불필요: 시각적 힌트만 */
      pointer-events:none;
          flex-direction: column;
    }
    #whoCanPartner .more-indicator .dot{
      width:8px; height:8px; border-radius:50%;
      background:#111827;
      opacity:.9;                 /* 기본 점(가장 위) */
      transform:translateZ(0);
      animation: whoDots 2.4s ease-in-out infinite;
    }
    #whoCanPartner .more-indicator .dot:nth-child(2){ opacity:.55; animation-delay:.15s; }
    #whoCanPartner .more-indicator .dot:nth-child(3){ opacity:.28; animation-delay:.3s; }

    @keyframes whoDots{
      0%,100%{ transform:translateY(0); }
      50%{ transform:translateY(2px); }
    }
    @media (prefers-reduced-motion:reduce){
      #whoCanPartner .more-indicator .dot{ animation:none; }
    }

    /* 모바일에서도 항상 가운데 정렬 유지 (부모가 flex-center라 별도 처리 불필요) */
    

       /* ===== Scope: #mosaicGalleryLite only ===== */
    #mosaicGalleryLite{
      --gap: clamp(4px, 1.2vw, 10px);
      --row: 15.5em;
      --ink:#0f172a; --line:#e5e7eb; --brand:#0b4a8b; --muted:#6b7280;
      font-family: Pretendard, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      max-width: 1200px; margin: 0 auto; padding: 20px 10px 36px; color:var(--ink);
    }

    /* 제목 */
    #mosaicGalleryLite .title{
      text-align:center; font-weight:900; line-height:1.2; letter-spacing:-.3px;
      margin:0 auto 14px;
    }
    #mosaicGalleryLite .title .l1{ display:block; font-size:50px; color:#111827; padding:50px 0; }
    #mosaicGalleryLite .title .l2{
      display:inline-block; font-size:50px; color:var(--brand);
      background:linear-gradient(transparent 64%, #cfe7ff 64% 100%);
      border-radius:2px; padding:0 .06em;
    }

    /* 갤러리 그리드 */
    #mosaicGalleryLite .gallary_container{
      display:grid;
      gap:var(--gap);
      grid-template-columns: repeat(auto-fit, minmax(clamp(120px, 25%, 15em), 1fr));
      grid-auto-rows: var(--row);
      grid-auto-flow:dense;
    }

    /* 카드 */
    #mosaicGalleryLite .image_container{
      position:relative;
      border-radius:10px; overflow:hidden; border:1px solid var(--line);
      box-shadow: rgba(3, 8, 20, 0.06) 0 2px 6px, rgba(2, 8, 20, 0.06) 0 1px 3px;
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
      background:#fff; user-select:none; cursor:pointer;
    }
    #mosaicGalleryLite .image_container:hover{
      transform: translateY(-2px);
      border-color:#d9dee5;
      box-shadow:0 10px 22px rgba(0,0,0,.10);
    }
    #mosaicGalleryLite .image_container img{
      width:100%; height:100%; object-fit:cover; display:block;
      -webkit-user-drag:none; user-select:none; pointer-events:none;
    }

    /* 데스크톱 전용 스팬 */
    #mosaicGalleryLite .image-tall  { grid-row:    span 2 / auto; }
    #mosaicGalleryLite .image-wide  { grid-column: span 2 / auto; }

    /* 반응형: 행 높이 점진 축소 */
    @media (max-width: 1024px){ #mosaicGalleryLite{ --row: 14.5em; } }
    @media (max-width: 900px) { #mosaicGalleryLite{ --row: 13.5em; } }
    @media (max-width: 760px) { #mosaicGalleryLite{ --row: 12.5em; } }

    /* ===== 모바일(≤640px): 동일 크기 타일 & 빈틈 없음 ===== */
    @media (max-width: 640px){
      #mosaicGalleryLite .title .l1{ font-size:34px; padding:26px 0; }
      #mosaicGalleryLite .gallary_container{ grid-template-columns: repeat(2, 1fr); grid-auto-rows:1fr; }
      /* #mosaicGalleryLite .mid{display: none;} */
      #mosaicGalleryLite .image_container{ aspect-ratio:1 / 1; }
      /* 스팬 해제 */
      #mosaicGalleryLite .image_container.image-wide,
      #mosaicGalleryLite .image_container.image-tall,
      #mosaicGalleryLite .image_container.m-col-2,
      #mosaicGalleryLite .image_container.m-col-3,
      #mosaicGalleryLite .image_container.m-col-4,
      #mosaicGalleryLite .image_container.m-row-2{
        grid-column:auto !important; grid-row:auto !important;
      }
    }
    @media (max-width: 480px){ #mosaicGalleryLite .title .l1{ font-size:30px; } }

    /* ===== Lightbox ===== */
    #mosaicGalleryLite .lightbox{
      position:fixed; inset:0; background:rgba(0,0,0,.6);
      display:none; align-items:center; justify-content:center;
      z-index: 2147483647;
      padding: clamp(10px, 2vw, 24px);
      backdrop-filter: blur(2px);
    }
    #mosaicGalleryLite .lightbox.show{ display:flex; }

    #mosaicGalleryLite .lb-dialog{
      display:grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
      gap:18px; width:min(100%, 980px); background:#fff; color:var(--ink);
      border-radius:14px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.25);
      position:relative; z-index: 1;
    }
    #mosaicGalleryLite .lb-media{ position:relative; background:#000; overflow:hidden; touch-action: pan-y; }
    #mosaicGalleryLite .lb-img{
      width:100%; height:100%; max-height:min(78vh, 900px); object-fit:contain; display:block; background:#000;
    }
    #mosaicGalleryLite .lb-info{ padding:18px 18px 20px; overflow:auto; max-height:min(78vh, 900px); }
    #mosaicGalleryLite .lb-name{ font-weight:800; font-size:20px; margin-bottom:4px; }

    /* 별점 */
    #mosaicGalleryLite .lb-rating{ display:flex; align-items:center; gap:6px; margin-bottom:10px; }
    #mosaicGalleryLite .stars{ position:relative; display:inline-block; font-size:20px; line-height:1; }
    #mosaicGalleryLite .stars::before{ content:"★★★★★"; color:#e5e7eb; }
    #mosaicGalleryLite .stars::after{
      content:"★★★★★"; color:#f59e0b; position:absolute; inset:0 auto 0 0;
      width:var(--w, 0%); overflow:hidden; white-space:nowrap;
    }
    #mosaicGalleryLite .rating-num{ color:#6b7280; font-size:14px; }

    #mosaicGalleryLite .lb-review{ color:#111827; line-height:1.6; white-space:pre-wrap; }
    #mosaicGalleryLite .lb-muted{ color:var(--muted); font-size:12px; margin-top:10px; }

    /* 닫기/화살표 */
    #mosaicGalleryLite .lb-x{
      position:absolute; top:10px; right:10px; border:none; background:rgba(0,0,0,.5);
      color:#fff; width:36px; height:36px; border-radius:50%; cursor:pointer; font-size:18px;
      display:grid; place-items:center; z-index: 2;
    }
    #mosaicGalleryLite .lb-arrow{
      position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px;
      border:none; border-radius:50%; background:rgba(0,0,0,.45); color:#fff; cursor:pointer;
      display:grid; place-items:center; font-size:20px; z-index: 2;
    }
    #mosaicGalleryLite .lb-prev{ left:10px; } #mosaicGalleryLite .lb-next{ right:10px; }

    /* 모바일 고정 닫기 버튼 */
    #mosaicGalleryLite .lb-x-fixed{
      position: fixed; top: 10px; right: 10px; width: 42px; height: 42px;
      border: none; border-radius: 9999px; background: rgba(0,0,0,.6);
      color:#fff; font-size:20px; cursor:pointer; display: none;
      align-items:center; justify-content:center; z-index: 2147483647; -webkit-tap-highlight-color: transparent;
    }

    @media (min-width: 1043px){
    #mosaicGalleryLite .fin{
      display:none;
    }
  }
    @media (max-width: 720px){
      #mosaicGalleryLite .lb-dialog{ grid-template-columns: 1fr; width:min(100%, 640px); }
      #mosaicGalleryLite .lb-info{ max-height:unset; }
      #mosaicGalleryLite .lb-img{ max-height: 60vh; }
      /* 필요 시: #mosaicGalleryLite .lb-x-fixed{ display:flex; } */
    }

    /* ===== fadeInUp 리빌 ===== */
    @media (prefers-reduced-motion: reduce){
      #mosaicGalleryLite .mgl-reveal{ opacity:1 !important; transform:none !important; animation:none !important; }
    }
    #mosaicGalleryLite .mgl-reveal{ opacity:0; transform: translate3d(0, 18px, 0); will-change: opacity, transform; }
    #mosaicGalleryLite .mgl-reveal.in{
      animation: mgl-fadeInUp .8s cubic-bezier(.22,.61,.36,1) both;
      animation-delay: calc(var(--i, 0) * 80ms);
    }
    @keyframes mgl-fadeInUp{
      from{ opacity:0; transform: translate3d(0, 18px, 0); }
      to  { opacity:1; transform: none; }
    }



     /* ===== Scope: #reviewSection only ===== */
    #reviewSection{
      --ink:#0f172a;
      --sub:#475569;
      --brand:#c62828;
      --hl:#cfe7ff;
      --line:#e5e7eb;
      --card:#ffffff;
      font-family: Pretendard, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      max-width: 1200px;
      margin: 0 auto;
      padding: 40px 16px 64px;
    }

    #reviewSection .title{
      text-align:center;
      font-weight:900;
      line-height:1.2;
      letter-spacing:-.4px;
      margin: 0 auto 32px;
    }
    #reviewSection .title .l1{
      display:block;
      font-size:32px;
      color:#111827;
    }
    #reviewSection .title .l2{
      display:inline-block;
      font-size:34px;
      color:#c62828;
      background:linear-gradient(transparent 65%, #ffc9dd 65% 100%);
      border-radius:2px;
      padding:0 .06em;
    }

    #reviewSection .grid{
      display:grid;
      gap:20px;
      grid-template-columns: repeat(2, minmax(300px,1fr));
    }

    @media screen and (max-width:640px) {
        #reviewSection .grid{
      display:grid;
      gap:20px;
      grid-template-columns: repeat(1, minmax(300px,1fr));
    }
    }

    #reviewSection .card{
      background:var(--card);
      border:1px solid var(--line);
      border-radius:16px;
      box-shadow:0 1px 3px rgba(16,24,40,.06);
      overflow:hidden;
      display:flex;
      flex-direction:column;
      transition: all .25s ease;
    }
    #reviewSection .card:hover{ box-shadow:0 6px 20px rgba(0,0,0,.08); transform:translateY(-2px); }

    #reviewSection .thumb{
      width:100%;
      aspect-ratio: 12/8;
      background:#f9fafb;
      overflow:hidden;
    }
    #reviewSection .thumb img{
      width:100%; height:100%; object-fit:cover; display:block;
      transition: transform .45s ease;
    }
    #reviewSection .card:hover .thumb img{ transform:scale(1.05); }

    #reviewSection .content{ padding:20px; display:flex; flex-direction:column; gap:12px; }

    #reviewSection .label{ font-size:15px; font-weight:700; color:var(--ink); }
    #reviewSection .highlight{ color:#795548; font-weight:900; font-size:20px; font-family: 'JalpulrineunHaruche';; }
    #reviewSection .stars{ color:#fbbf24; font-size:18px; letter-spacing:2px; }

    #reviewSection .text{ font-size:18px; line-height:1.6; color:#374151; }
    #reviewSection .author .name{ font-weight:700; color:var(--ink); font-size:15px; }


       /* ================= Scope: #kakaoProofWall only ================= */
    #kakaoProofWall{
      --ink:#0f172a;           /* 본문색 */
      --sub:#475569;           /* 보조설명 */
      --brand:#2563eb;         /* 포인트 블루 */
      --brand-2:#c62828;       /* 블루 딥톤 */
      --hl:#cfe7ff;            /* 밑줄 하이라이트 */
      --panel:#ffffff;         /* 카드 배경 */
      --line:#e5e7eb;          /* 구분선 */
      --kakao:#fee500;         /* Kakao 배지 */
      --shadow:0 2px 10px rgba(16,24,40,.08), 0 24px 60px rgba(16,24,40,.10);
      --radius:18px;
      --max:1200px;
      font-family: Pretendard, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      color:var(--ink);
      max-width:var(--max);
      margin:0 auto;
      padding:40px 16px 70px;

      /* ▼ 모바일 스크롤 친화 설정 */
      touch-action: pan-y;
      -webkit-overflow-scrolling: touch;
    }

    /* ===== 레이아웃 ===== */
    #kakaoProofWall .grid{
      display:grid;
      grid-template-columns: 1fr 1fr; /* PC: 텍스트 / 중간 컬럼 / 오른쪽 컬럼 */
      gap:28px;
      align-items:center;
    }

    /* ===== 헤드 (PC는 좌측 고정, Mobile은 상단 가운데) ===== */
    #kakaoProofWall .head{ padding:10px 6px 0 6px; }
    #kakaoProofWall .eyebrow{ font-weight:700; font-size:18px; color:#94a3b8; letter-spacing:.2px; margin-bottom:4px; }
    #kakaoProofWall .title{
      font-weight:900; line-height:1.05; letter-spacing:-.6px;
      font-size:54px; color:var(--ink); margin:0 0 14px 0;
    }
    #kakaoProofWall .title .em{
      display:inline-block; position:relative; color:var(--brand-2);
    }
    #kakaoProofWall .title .em::after{
      content:""; position:absolute; left:0; right:0; bottom:6px; height:34px;
      background:linear-gradient(transparent 65%, #ffc9dd 65% 100%);
      border-radius:6px; z-index:-1;
    }
    #kakaoProofWall .desc{ color:var(--sub); font-size:16px; line-height:1.6; margin-top:10px; }

    /* ===== 컬럼 공통 (세로 자동 슬라이드) ===== */
    #kakaoProofWall .col{
      height:560px; overflow:hidden; border-radius:20px;
      /* ▼ 모바일 스크롤 충돌 방지 */
      touch-action: pan-y;
      -webkit-overflow-scrolling: touch;
    }
    #kakaoProofWall .rail{ height:100%; overflow:hidden; }
    #kakaoProofWall .track{
      display:flex; flex-direction:column; gap:16px;
      will-change: transform;
      transform: translateZ(0);           /* GPU 레이어 확보 */
      backface-visibility: hidden;
    }

    /* ===== 카드 ===== */
    #kakaoProofWall .card{
      background:var(--panel); border-radius:var(--radius); box-shadow:var(--shadow);
      overflow:hidden; border:1px solid var(--line);
      display:block; /* 이미지 높이만큼 카드 늘어남 */
    }
    /* 업로드 이미지 비율 제각각이어도 전부 보이도록 + 초기 높이 예약(즉시 애니메이션 가시화용) */
    #kakaoProofWall .card .thumb{
      width:100%;
      height:auto !important;
      aspect-ratio:auto !important;
      object-fit:contain !important;
      display:block;
      background:#fff;
      min-height: clamp(160px, 28vw, 240px); /* ★ 초기 공간 확보 → 모바일에서도 로드 직후부터 바로 움직임이 보임 */
    }
    /* 기존 비율 유틸(넣어둬도 object-fit:contain으로 잘리지 않음) */
    #kakaoProofWall .thumb{ background:linear-gradient(180deg, #f8fafc, #eef2f7); }
    #kakaoProofWall .thumb.tall{ }
    #kakaoProofWall .thumb.wide{ }

    #kakaoProofWall .cap{
      display:none; align-items:center; gap:10px; padding:12px 16px; border-top:1px solid var(--line);
      font-size:15px; color:var(--ink);
    }
    #kakaoProofWall .chip{
      flex:0 0 auto; display:inline-flex; align-items:center; gap:8px;
      background:var(--kakao); color:#111; font-weight:800; font-size:13px; padding:6px 10px; border-radius:999px; box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 1px 0 rgba(0,0,0,.06);
    }
    #kakaoProofWall .chip i{ display:inline-block; width:8px; height:8px; background:#111; border-radius:999px; opacity:.9; }

    /* ===== 방향별 애니메이션 ===== */
    @keyframes kpw-up {
      0%   { transform: translateY(0); }
      100% { transform: translateY(-50%); } /* 복제분까지 절반만 이동 */
    }
    @keyframes kpw-down {
      0%   { transform: translateY(-50%); }
      100% { transform: translateY(0); }
    }
    /* 속도는 컨텐츠 길이에 따라 자연스럽게 보이도록 다르게 지정 + 즉시 가시화(음수 delay) */
    #kakaoProofWall .col.is-up   .track{ animation: kpw-up 15s linear infinite;  animation-delay: var(--start-offset, -1.2s); animation-play-state: running !important; }
    #kakaoProofWall .col.is-down .track{ animation: kpw-down 17s linear infinite; animation-delay: var(--start-offset, -1.2s); animation-play-state: running !important; }

    /* ===== 모바일(첫번째 이미지 배치) ===== */
    @media (max-width: 980px){
      #kakaoProofWall{ padding:32px 14px 60px; }
      #kakaoProofWall .grid{ grid-template-columns: 1fr; gap:18px; }
      #kakaoProofWall .head{ text-align:center; }
      #kakaoProofWall .title{ font-size:28px; }
      #kakaoProofWall .title .em::after{ height:30px; bottom:4px; }
      #kakaoProofWall .desc{ font-size:14px; }

      /* 상단 타이틀 아래에 2열 컬럼이 나란히 (모바일 첫번째 이미지처럼) */
      #kakaoProofWall .columns{
        display:grid; grid-template-columns: 1fr 1fr; gap:16px;
      }
      #kakaoProofWall .col{ height:520px; }
    }

    /* ===== PC(두번째 이미지 배치) – 좌측 텍스트, 우측 2컬럼 ===== */
    @media (min-width: 981px){
      #kakaoProofWall .columns{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; }
    }

    /* ===== 모든 사진 간격 일정 처리(트랙 말단 포함) ===== */
    #kakaoProofWall .track{ --card-gap:16px; gap:var(--card-gap); }
    #kakaoProofWall .track::after{ content:""; display:block; height:var(--card-gap); flex:0 0 auto; }


   /* ---------- Scope: #eventList1 only ---------- */
    #eventList1{
      --bg:#f7f8fa;
      --panel:#ffffff;
      --line:#e2e6ec;
      --ink:#0b1220;
      --muted:#6b7280;
      --blue:#184a7d;     /* 메인 블루 */
      --blue-2:#0b4a8b;   /* 포인트 블루 */
      --sky:#cfe7ff;      /* 하이라이트 */
      --accent:#ff3b30;   /* 쿠폰/경고 */
      --kakao:#fee500;    /* 강조 배지 */
      --radius:14px;

      font-family: Pretendard, "Noto Sans KR", "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      background: radial-gradient(80% 130% at 50% 0%, #fff 0%, var(--bg) 80%);
      padding:40px 18px 56px;
      color:var(--ink);
      max-width:960px;
      margin:0 auto;
    }

    /* 상단 SNS 줄 */
    #eventList1 .sns{
      display:flex; gap:10px; align-items:center; justify-content:flex-start;
      margin:0 auto 12px; max-width:860px; flex-wrap:wrap;
    }
    #eventList1 .sns .chip{
      display:inline-flex; align-items:center; justify-content:center;
      width:36px; height:36px; border-radius:10px; color:#fff; font-weight:900; font-size:14px;
      box-shadow:0 4px 10px rgba(0,0,0,.08);
    }
    #eventList1 .sns .fb{ background:#1877F2; }
    #eventList1 .sns .yt{ background:#FF0033; }
    #eventList1 .sns .ig{ background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af,#515bd4); }
    #eventList1 .sns .blog{ background:#00C73C; }

    /* 상단 히어로 */
    #eventList1 .hero{ text-align:center; max-width:820px; margin:0 auto 18px; }
    #eventList1 .hero .sticker{
      display:inline-flex; align-items:center; gap:8px;
      background:#fff; border:1px solid var(--line); border-radius:999px; padding:10px 14px; 
      font-weight:900; color:#111827; box-shadow:0 8px 18px rgba(16,24,40,.08);
    }
    #eventList1 .hero .sticker i{ font-style:normal; font-size:16px; }
    #eventList1 .hero .headline{
      margin:14px 0 8px;
      font-size:42px; font-weight:1000; letter-spacing:-.4px; line-height:1.18; color:#0f172a;
    }
    #eventList1 .hero .headline .hl{
      display:inline-block; color:#c62828;
      background:linear-gradient(transparent 64%, #ffc9dd 64% 100%);
      border-radius:2px; padding:0 .06em;
      animation: eventList1-blink 2.2s infinite;
    }
    #eventList1 .hero .sub{
      font-size:18px; font-weight:800; color:#111827;
    }

    /* 쿠폰 배지 + 안내 바 */
    #eventList1 .announce{
      margin:16px auto 22px; max-width:860px;
      display:flex; gap:10px; align-items:center; justify-content:center; flex-wrap:wrap;
    }
    #eventList1 .coupon{
      background:var(--accent); color:#fff; font-weight:900; font-size:13px;
      border-radius:10px; padding:8px 12px; transform:rotate(-6deg);
      box-shadow:0 10px 20px rgba(255,59,48,.18);
    }
    #eventList1 .bar{
      flex:1 1 auto; min-width:260px;
      background:#0b1220; color:#fff; font-weight:900; border-radius:12px; padding:12px 14px;
      text-align:center; letter-spacing:-.2px;
    }
    #eventList1 .bar em{ color:#ffe08a; font-style:normal; }

    /* 핵심 포인트 바 */
    #eventList1 .points{
      margin:16px auto 26px; background:#6d5c54; color:#fff;
      border-radius:12px; padding:18px 12px; box-shadow:0 8px 18px rgba(24,74,125,.16);
      max-width:900px;
    }
    #eventList1 .points .wrap{
      display:grid; grid-template-columns:repeat(3,1fr); align-items:center; text-align:center;
    }
    #eventList1 .points .col{ padding:6px 8px; }
    #eventList1 .points .label{ font-size:14px; color:#c8c3c0; font-weight:700; }
    #eventList1 .points .value{ font-size:24px; font-weight:1000; letter-spacing:-.3px; }
    #eventList1 .points .col:not(:last-child){ position:relative; }
    #eventList1 .points .col:not(:last-child)::after{
      content:""; position:absolute; right:0; top:50%; transform:translateY(-50%);
      width:2px; height:40px; border-radius:1px;
      background:linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,.65), rgba(255,255,255,.25));
    }

    /* 진행 순서 */
    #eventList1 .flow{
      margin:8px auto 24px; max-width:900px;
      display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
    }
    #eventList1 .step{
      background:linear-gradient(180deg,#fff 0%, #f5f7fb 100%);
      border:1px solid var(--line); border-radius:var(--radius);
      padding:16px 12px; display:flex; flex-direction:column; align-items:center; gap:10px;
      text-align:center; box-shadow:0 4px 12px rgba(0,0,0,.06);
    }
    #eventList1 .step .ico{
      width:56px; height:56px; border-radius:50%;
      display:grid; place-items:center; font-size:22px; font-weight:900; color:#fff;
      background:linear-gradient(135deg, var(--blue-2), #2a73c6);
      box-shadow:0 10px 20px rgba(11,74,139,.18);
    }
    #eventList1 .step .tit{ font-weight:900; color:#0f172a; }
    #eventList1 .step .cap{ font-size:13px; color:#64748b; }

    /* 혜택 리스트(순차 강조) */
    #eventList1 .item{
      display:flex; align-items:center; justify-content:space-between; gap:14px;
      background:linear-gradient(180deg, var(--panel) 0%, #f5f7fb 100%);
      border:1px solid var(--line); border-radius:var(--radius);
      padding:18px; margin-bottom:12px;
      transition:background .4s ease, transform .3s ease, box-shadow .3s ease, border-color .3s ease;
      box-shadow:0 4px 12px rgba(0,0,0,.06);
    }
    #eventList1 .item:last-child{ margin-bottom:0; }
    #eventList1 .item .txt{ font-size:20px; font-weight:800; line-height:1.45; color:#0f172a; }
    #eventList1 .item .txt strong{ color:#c74242; font-size:22px; font-weight:1000; }
    #eventList1 .item .tag{
      background:#eaf3ff; color:#0b4a8b; font-weight:900; font-size:12px; border-radius:999px; padding:6px 10px;
    }
    @media screen and (max-width: 430px) {
      #eventList1 .item .tag{ display:none; }
    }

    #eventList1 .item.active{
      background: linear-gradient(135deg, #fff 0%, #fff1f1 50%, #ffe0e0 75%, #ffc9c9 100%);
      border-color:#ffc9c9; transform:translateY(-2px);
      box-shadow:0 12px 26px rgba(24,74,125,.18);
    }

    /* 하단 경고/안내 & 실시간 CTA */
    #eventList1 .notes{
      max-width:900px; margin:14px auto 12px; color:#334155; font-size:13px;
      background:#f8fafc; border:1px dashed #dbe2ea; border-radius:12px; padding:12px 14px;
    }
    #eventList1 .live{
      margin:10px auto 0; max-width:900px;
      background:linear-gradient(135deg, #dd3737, #c44343);
      color:#fff; border-radius:14px; padding:14px 16px; text-align:center; font-weight:1000;
      letter-spacing:-.2px; position:relative;
    }
    #eventList1 .live .dot{
      position:absolute; left:14px; top:50%; transform:translateY(-50%);
      width:10px; height:10px; border-radius:50%; background:#ff4d4f; box-shadow:0 0 0 0 rgba(255,77,79,.7);
      animation: eventList1-pulse 1.6s infinite;
    }

    /* ===== ▼ 핵심 3문장 하이라이트 블록 ===== */
    #eventList1 .value-props{
      max-width:900px; margin:10px auto 22px;
      background:
        radial-gradient(100% 160% at 0% 0%, #fff7f7 0%, transparent 42%),
        linear-gradient(180deg,#ffffff 0%, #fff1f1 100%);
      border:1px solid #ffd7d7;
      border-radius:16px;
      padding:18px 16px;
      box-shadow:0 10px 22px rgba(198,40,40,.10);
    }
    #eventList1 .value-props .title{
      display:flex; align-items:center; gap:10px;
      font-weight:1000; color:#b32626; letter-spacing:-.2px;
      margin:0 2px 12px;
    }
    #eventList1 .value-props .title .dot{
      width:10px; height:10px; border-radius:50%;
      background:#ff4d4f; box-shadow:0 0 0 0 rgba(255,77,79,.6);
      animation: eventList1-pulse 1.6s infinite;
    }
    #eventList1 .vp-list{
      display:grid; grid-template-columns:repeat(3,1fr); gap:10px;
    }
    #eventList1 .vp-item{
      display:flex; align-items:flex-start; gap:10px;
      background:#ffffffaa;
      border:1px solid #ffe3e3;
      border-radius:12px; padding:12px 12px;
      box-shadow:0 2px 8px rgba(255,59,48,.06) inset;
    }
    #eventList1 .vp-icon{
      flex:0 0 32px; width:32px; height:32px; border-radius:10px;
      display:grid; place-items:center; font-size:18px; color:#fff;
      background:linear-gradient(135deg,#d93434,#c62828);
      box-shadow:0 6px 14px rgba(198,40,40,.18);
    }
    #eventList1 .vp-text{
      font-size:15px; font-weight:900; color:#0f172a; line-height:1.35;
    }
    #eventList1 .vp-text .sub{
      display:block; font-weight:700; color:#7a1f1f; font-size:13px; margin-top:3px; opacity:.9;
    }
    @media (max-width:900px){
      #eventList1 .vp-list{ grid-template-columns:1fr; gap:8px; }
    }

    /* 반응형 */
    @media (max-width:760px){
      #eventList1 .hero .headline{ font-size:34px; }
      #eventList1 .flow{ grid-template-columns:1fr; }
      #eventList1 .points .wrap{ grid-template-columns:1fr; gap:10px; }
      #eventList1 .points .col:not(:last-child)::after{ display:none; }
      #eventList1 .item .txt{ font-size:17px; }
      #eventList1 .item .txt strong{ font-size:18px; }
    }

    /* 애니메이션 */
    @keyframes eventList1-blink{
      0%, 80%, 100% { filter:none; }
      40% { filter:drop-shadow(0 0 10px rgba(11,74,139,.28)); }
    }
    @keyframes eventList1-pulse{
      0%{ box-shadow:0 0 0 0 rgba(255,77,79,.6); }
      70%{ box-shadow:0 0 0 12px rgba(255,77,79,0); }
      100%{ box-shadow:0 0 0 0 rgba(255,77,79,0); }
    }

    /* ===== ▼ 멀티라인 대응 밑줄 하이라이트(형광펜) — 최신화 ▼
       ::before 대신 background + box-decoration-break을 사용.
       줄바꿈이 생겨도 각 줄에 하이라이트가 복제되어 폭에 맞게 채워집니다. */
    #eventList1 .marker{
       font-family: 'JalpulrineunHaruche';
      position:relative;
      display:inline;
      padding:0 .08em;
      border-radius:4px;
      /* 형광펜 질감 2겹 */
      background-image:
        linear-gradient(transparent calc(100% - 0.68em), rgba(255,233,95,.35) 0, rgba(255,215,70,.62) 100%),
        linear-gradient(transparent calc(100% - 0.68em), rgba(255,215,74,.66) 0  );
      background-repeat:no-repeat;
      /* 초기엔 0% → 보이면 100%로 확장 (각 줄 단위로 복제) */
      background-size:0% 100%, 0% 100%;
      transition: background-size 720ms cubic-bezier(.2,.8,.2,1);
      -webkit-box-decoration-break:clone;
      box-decoration-break:clone;
    }
    #eventList1 .marker.on{
      background-size:100% 100%, 100% 100%;
    }
    @media (prefers-reduced-motion: reduce){
      #eventList1 .marker{ transition:none; background-size:100% 100%, 100% 100%; }
    }



     /* ---------------- Scope: #applyListSection only ---------------- */
    #applyListSection{
      font-family: Pretendard, "Noto Sans KR", system-ui, -apple-system, Segoe UI, Roboto, Apple SD Gothic Neo, sans-serif;
      max-width: 760px;
      margin: 10px auto 0;
      border-radius: 16px;
      overflow: hidden;
      color:#fff;
      background:#0c4a8b;
      margin-bottom:30px;
      -webkit-overflow-scrolling: touch;
    }

    /* 안내 문구 */
    #applyListSection .info{
      font-family: 'JalpulrineunHaruche';
      text-align:center;
      padding:14px 10px 0;
      font-size:22px;
      font-weight:600;
      line-height:1.5;
    }
    #applyListSection .info .date{ display:block; margin-bottom:2px; }
    #applyListSection .info .count{ display:block; }
    #applyListSection .info .blink{
      display:block; margin-top:4px; color:#ff3333; font-weight:800; animation: blink 1s step-start infinite;
    }
    @keyframes blink { 50% { opacity:0; } }

    /* 상단 헤더 */
    #applyListSection .topbar{
      background:#0c4a8b;
      padding:16px 20px;
      position:relative; /* 기본 위치 */
      transition: transform .2s ease, box-shadow .2s ease, padding .2s ease;
      box-sizing: border-box;
    }
    /* 내부 컨테이너: PC에서 카운트다운과 버튼 간격을 max-width:1200px 기준으로 제어 */
    #applyListSection .topbar .tb-inner{
      display:flex; align-items:center; gap: clamp(8px, 2vw, 18px);
      justify-content:center;
      max-width:1200px; margin:0 auto; width:100%;
      font-weight:800;
      font-size: clamp(15px, 2.8vw, 20px);
    }

    /* fixed 모드: 화면 하단에 붙기(짤림 방지: safe-area 반영) */
    #applyListSection .topbar.is-fixed{
      position:fixed; left:0; right:0; bottom:0;
      margin:0; border-radius:12px 12px 0 0; z-index:9999;
      box-shadow:0 -10px 24px rgba(0,0,0,.18);
      padding:10px 12px calc(12px + env(safe-area-inset-bottom)); /* iOS 홈 인디케이터 위로 */
      animation: tb-slide-up .28s ease both;
      cursor:pointer; /* 하단 고정 시 상단바 어디를 눌러도 신청 이동 안내 */
    }
    /* 하단 고정일 때는 좌우로 여유 있게 배치 (1200px 컨테이너 안에서) */
    #applyListSection .topbar.is-fixed .tb-inner{
      justify-content:center;
    }
    @keyframes tb-slide-up{ from{ transform: translateY(30%); opacity:.01; } to{ transform: translateY(0); opacity:1; } }

    /* 오른쪽 '신청하기' 버튼 (기본 숨김, fixed일 때만 노출) */
    #applyListSection .apply-cta{
      display:none;
      background:#ff7a18; color:#fff; font-weight:900; border:none;
      border-radius:999px; padding:10px 16px; cursor:pointer; line-height:1; white-space:nowrap;
      box-shadow: 0 6px 16px rgba(255,122,24,.35);
      font-size: clamp(13px, 3.6vw, 16px);
      flex:0 0 auto;
    }
    #applyListSection .topbar.is-fixed .apply-cta{ display:inline-flex; }
    #applyListSection .apply-cta:focus-visible{ outline:2px solid #fff; outline-offset:2px; }

    #applyListSection .label{ flex:0 0 auto; }
    #applyListSection .digits{
      display:flex; align-items:center; gap:6px;
      flex: 0 1 auto; /* 너무 넓어지지 않도록 */
    }
    #applyListSection .d{
      background:#0d0d0d; padding:6px 8px; border-radius:6px;
      font-size: clamp(18px, 4.6vw, 22px); font-weight:900; line-height:1;
      min-width:22px; text-align:center;
    }
    #applyListSection .colon{ font-weight:900; opacity:.85 }
    #applyListSection .tail{ font-weight:700; opacity:.95; display:inline; }

    @media (max-width:640px){
      #applyListSection .topbar .tb-inner{ gap:10px; font-size:13px; }
      #applyListSection .tail{ display:block; margin-left:0; margin-top:6px; }
      #applyListSection .apply-cta{ padding:10px 14px; }
    }

    /* 리스트 박스 */
    #applyListSection .board{ background:#f4f4f4; color:#000; padding:6px 0 8px; position:relative; }
    #applyListSection .fadeTop,
    #applyListSection .fadeBottom{ position:absolute; left:0; right:0; height:28px; pointer-events:none; z-index:2; }

    /* 가시 영역 */
    #applyListSection .viewport{ height: 360px; overflow:hidden; position:relative; }

    /* 트랙 */
    #applyListSection .track{
      display:grid; grid-auto-rows:52px; will-change:transform;
      transform:translateY(0); transition:transform 600ms ease;
    }

    /* 행 */
    #applyListSection .row{
      display:grid; grid-template-columns:1.2fr .9fr 2.2fr auto;
      align-items:center; gap:10px; padding:0 18px;
      border-bottom:1px solid rgba(255,255,255);
      font-size:15px;
    }
    #applyListSection .row:last-child{ border-bottom:none; }
    #applyListSection .phone, #applyListSection .name{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    #applyListSection .name{ font-weight:700 }
    #applyListSection .prod{ opacity:.95; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    #applyListSection .btn{
      background:#ff7a18; color:#fff; font-weight:800; border-radius:999px; padding:8px 16px;
      display:inline-flex; align-items:center; justify-content:center; cursor:pointer; user-select:none; white-space:nowrap;
    }

    /* 반응형 */
    @media (max-width:640px){
      #applyListSection .row{ grid-template-columns: 1.2fr .8fr 1.6fr auto; gap:8px; padding:0 12px; }
      #applyListSection .viewport{ height: 320px; }
    }

    /* 관찰용 센티널(시각적으로는 보이지 않음) */
    #applyListSection .topbar-sentinel{ position:relative; height:1px; }

    
/* 전체 폼을 감싸는 최상위 컨테이너 */
.form-box {
	width: 100%;
	max-width: 720px; /* 폼의 최대 너비 (반응형) */
	margin: 0 auto;
	font-family: 'Noto Sans KR', sans-serif;
	color: #333;
  }
  
  /* form-box의 id="#fm-box"가 달려있지만, 동일한 요소이므로 중복설정 가능 */
  #fm-box {
	/* 추가 스타일이 필요하면 여기에 작성 */
  }
  
  /* 내부 영역 (.inner) */
  .form-box .inner {
	/* 테두리나 배경색이 필요하면 여기에 */
	padding: 20px 10px;
	text-align: center; /* 가운데 정렬 */
	box-sizing: border-box;
  }
  
  /* 상단의 알림 박스 (타이머, etc.) 가 들어있는 div
	 style="..."로 inline 스타일이 이미 있으므로, 보강할 것만 작성 */
  .form-box .inner > div[style*="border:1.5px solid #000"] {
	/* 필요 시 여백, 폰트 조정 가능 */
	margin: 0 auto 20px auto; 
	border-radius: 4px;
  }
  
  /* 폼 상단 제목 (h1.form-top-title) */
  .form-top-title {
	font-size: 1.4rem;
	font-weight: 700;
	margin: 0.6em 0;
	line-height: 1.4;
	text-align: center;
  }
  .form-top-title[style*="color:red"] {
	color: red; 
	font-weight: 600; 
	margin-bottom: 1em;
  }
  
  /* 실제 폼 감싸는 박스 */
  .form-box-inner {
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	/* 배경, 테두리 필요 시:
	background: #fff;
	border: 5px solid #f8f8f8; 
	*/
	padding: 10px;
	box-sizing: border-box;
	text-align: left; /* 테이블 정렬을 위해 */
  }
  
  /* <form> 자체를 꾸밀 필요가 있으면 여기에 */
  #form_e11 {
	width: 100%;
	margin: 0 auto;
  }

  #form_e12 {
	width: 100%;
	margin: 0 auto;
  }
  
  /* 테이블 바깥 래퍼 */
  .form-box-tb-out {
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
  }
  
  /* 실제 입력 테이블 */
  .form-box-tb {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px; 
	color: #333;
	line-height: 1.4;
  }
  .form-box-tb tr {
	border-bottom: 1px solid #ddd;
  }
  .form-box-tb tr:last-child {
	border-bottom: none; /* 마지막 줄은 테두리 제거 */
  }
  .form-box-tb th,
  .form-box-tb td {
    font-size:18px;
	padding: 10px 8px;
	vertical-align: middle;
	text-align: left;
  }
  .form-box-tb th {
	width: 30%; /* 적절히 조정 */
	font-weight: 600;
	background: #f9f9f9; /* 헤더 느낌 줄 때 */
	box-sizing: border-box;
  }
  .form-box-tb td {
	width: 70%; 
	box-sizing: border-box;
  }
  
  /* input, select, textarea 공통 스타일 */
  .form-control {
	width: 100%;
	height: 38px;
	padding: 6px 8px;
	box-sizing: border-box;
	border: 1px solid #ccc;
	font-size: 17px;
	color: #333;
	font-family: inherit;
	border-radius: 4px;
  }
  .form-control:focus {
	outline: none;
	border-color: #999;
  }
  
  /* textarea.form-control : 높이를 별도 지정 */
  .form-control[style*="min-height:100px"] {
	height: auto;
	min-height: 100px;
	resize: none; /* 필요 시 조정 */
	line-height: 1.5;
  }
  
  /* submit 버튼 */
  .submit-btn {
	display: inline-block;
	width: 100%;
	height: 48px;
	font-size: 16px;
	font-weight: 600;
	background: #164a7f; /* 주황색 */
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	margin: 1em 0 0 0;
	transition: background 0.3s;
  }
  .submit-btn:hover:enabled {
	background: #e96500;
  }
  .submit-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
  }
  
  /* 개인정보보호정책 동의 영역 */
  .form-agree-box {
	margin-top: 10px;
	font-size: 14px;
	color: #333;
  }
  .form-info-agree {
	margin: 0;
	padding: 0;
	line-height: 1.4;
  }
  .form-info-agree input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin-right: 4px;
	vertical-align: middle;
  }
  .form-info-agree label {
	font-size: 13px; 
	color: #000;
	font-weight: 500;
  }
  .privacyBtn {
	color: #000;
	font-weight: 400; 
	font-size: 13px; 
	margin-left: 3px; 
	cursor: pointer;
  }
  
  /* (선택) 미디어쿼리로 반응형 조정 */
  @media screen and (max-width: 480px) {
	.form-top-title {
	  font-size: 1.2rem;
	}
	.form-box-tb th,
	.form-box-tb td {
	  font-size: 15px; 
	  padding: 8px 6px;
	}
	.submit-btn {
	  font-size: 15px;
	}
  }
  
    /* 기존 스타일 그대로 두고 아래 추가 */

  /* 1) 화면이 340px 이하일 때 글자가 잘리지 않게 처리 */
  @media screen and (max-width: 340px) {
    .timer {
      display: block;      /* 강제로 줄바꿈 */
      font-size: 13px;     /* 글자 조금 축소 */
      line-height: 1.4;    /* 줄 간격 확보 */
      word-break: keep-all;/* 단어 단위 줄바꿈 */
      white-space: normal; /* 줄바꿈 허용 */
    }
  }

  /* 2) 화면이 430px 이하일 때 countdown2 앞뒤에 공백 확보 */
  @media screen and (max-width: 430px) {
    #countdown2::before {
      content: " ";  /* 앞에 공백 추가 */
    }
    #countdown2::after {
      content: " ";  /* 뒤에 공백 추가 */
    }
  }


    
    /* 개인정보처리방침 CSS */
    #list_form .privacyBtn { cursor: pointer; color:#000;font-weight: 200; font-size: 13px; margin-top: -10px}
    #list_form .privacyBtn:hover {color:#284E80;font-weight: 300; font-size: 13px; margin-top: -10px}
    
    #list_form #privacy {  position: fixed; width: 100%; height: 100%; left: 0; bottom: 0; z-index: 80; background-color: rgba(0, 0, 0, 0.6); visibility: hidden;     transform: translate(0, -50%);
    }
    #list_form #privacy > #privacyContent { position: absolute; width: 60%; height: 500px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); margin-left:20%;  top: 50%; margin-top: -250px;  }
    #list_form #privacyContent > div { width: 100%; float: left; }
    
    #list_form #privacyContent > .titWrap { height: 45px; line-height: 45px; background-color: #F8F8F8; padding: 0 15px; color: #000; position: relative; display: flex; align-items: center; justify-content: space-between;}
    
    #list_form #privacyContent > .titWrap > .closeBtn { cursor: pointer;}
    
    #list_form #privacyContent > .titWrap > span { width: calc(100% - 35px); float: left; font-size: 15px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    #list_form #privacyContent > .titWrap > i { font-size: 21px; position: absolute; cursor: pointer; right: 15px; top: 50%; margin-top: -15px !important; }
    
    #list_form #privacyContent > .conWrap { height: calc(100% - 45px); padding: 15px; background-color: #FFF; color: #000; overflow-y: auto; font-size: 13px; letter-spacing: -0.5px; }
    
    #list_form input[type="number"]::-webkit-outer-spin-button,
    #list_form input[type="number"]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }
    
    #list_form #privacy.blur {
      top: 50%;
      visibility: visible;
      opacity: 1;
      transition: 0.5s;
    }
    
    
    /* Form 양식 문구 */
    #list_form .form-title {
        text-align: center;
        color: #000000;
    }
    
    /* Count down CSS */
    #list_form .countdown {
        margin-bottom: 1rem;
        color: #48b1dc;
        font-size: 20px;
    }
    
    
    /* Input form CSS */
    #list_form .form-group {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }
    
    #list_form .form-group input {
        border: 0;
        padding: 6px 8px;
        width: 100%;
        border: solid 1px #dddddd;
        font-weight: 200;
    }
    
    #list_form .form-row2 {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap:0.5rem;
      color: #000;
    }
    
    
    #list_form .contents {
      padding: 60px 0;
    }
    #list_form .contents span {
      color: #3684d2;
      font-weight: 600;
      position: relative;
      bottom: 3px;
    }
    
    
    
    #list_form .sec00 {
      text-align: center;
      padding-top: 80px;
    }
    #list_form .sec00 p {
      font-size: 20px;
      font-weight: 600;
      margin-bottom: 10px;
    }

	#list_form .wrap1 { width:100%;}
	#list_form .wrap1 .contents { position:sticky; top:0; left:50%; margin-left:-720px;width:100%;text-align:center; }
    
    #list_form .box_02 {border-top: 2px solid #333;}
    #list_form .box_02_1{padding:0px;}
    #list_form .box_02_2{margin-top:30px;}
    #list_form .box_02 .tg{border-spacing:0;width:100%;margin: 0 auto;background: #fff;}
    #list_form .box_02 .tr_list{background:#172c3f;color:#fff;}
    #list_form .box_02 .tg td{font-size:12px;font-weight:500;padding:7px 5px;overflow:hidden;word-break:normal;border-bottom: 1px solid #bdbdbd;letter-spacing:-0.75px;}
    #list_form .box_02 .tg th{font-size:15px;font-weight:500;padding:5px;overflow:hidden;word-break:normal;letter-spacing:-0.5px;}
    #list_form .box_02 .tg .tg-0pky{text-align:center;vertical-align:top;}
    
    #list_form .box_02 .tg .tg-0lax{
      text-align:left;
      vertical-align:top;
      width:70px;
      padding-left:10px;
    }
    
    @media screen and (max-width:535px) {
      #list_form .box_02 .tg .tg-0lax{
        
          width:140px;
         
      }
      
    }
    
    #list_form .box_02 .tg .tg-02ax{text-align:center;vertical-align:top;width:180px;}
    #list_form .box_02 .tg .tg-03ax{text-align:right;vertical-align:top;width:80px;padding-right:10px;}
    #list_form .box_02 .tg .tg-04ax{text-align:center;vertical-align:top;width:70px;}
    #list_form .box_02 .submit_01{color:#616161;font-weight: 600;}
    #list_form .box_02 .submit_02{color:#005bac;font-weight: 600;}
    #list_form .box_02 .submit_03{color:#FF1744;font-weight: 600;}
    
    #list_form .box_02 .tg .db01{width:100px;}
    #list_form .box_02 .tg .db02{width:100px;}
    #list_form .box_02 .tg .db03{width:100px;}
    #list_form .box_02 .tg .db04{width:100px;}
    #list_form .box_02 .tg .db05{width:160px;}
    #list_form .box_02 .tg .db06{width:70px;}
    #list_form .box_02 .tg .db07{width:70px;}
    /*1*/