/* 전시장 — 파이널에서 «그대로» 가져온 것. 손으로 고치지 않는다.
   고칠 일이 생기면 덧씌움 파일을 따로 두고 여기는 건드리지 않는다 → [[ecostudio-template-freeze]]
   파이널 지문 7525e56945c567f2 */

  @font-face { font-family: SUIT; src: url('https://eco-s2dio.com/wp-content/mu-plugins/assets/brand/SUIT-Variable.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
  html, body { margin: 0; height: 100%; overflow: hidden; }
  body { background: #f5f5f0; color: #20211f; font-family: SUIT, Arial, sans-serif; letter-spacing: -0.015em; -webkit-font-smoothing: antialiased; }
  * { box-sizing: border-box; }
  a { color: #20211f; text-decoration: none; }
  a:hover { color: #2457e8; }
  button, input, select, textarea { font-family: SUIT, Arial, sans-serif; letter-spacing: -0.02em; }
  button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #2457e8; outline-offset: 2px; }
  ::selection { background: #2457e8; color: #fff; }
  [role="tablist"][aria-label="분류"] [role="tab"]:active { transform: scale(0.96); }
  [data-list] { scrollbar-width: thin; scrollbar-color: #d6d8cf transparent; }
  [data-list]::-webkit-scrollbar { width: 6px; } [data-list]::-webkit-scrollbar-thumb { background: #d6d8cf; border-radius: 3px; }
  [data-row] [data-view] { opacity: 0; transform: translateX(-4px); transition: opacity 0.2s, transform 0.2s; }
  [data-row][aria-current="true"] [data-view] { opacity: 1; transform: none; }
  [data-row] [data-sub] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  [data-screen] { transition: filter 0.3s; }
  [data-screen][data-morph="1"] { filter: blur(1.5px); }
  [data-row] [data-dash] { width: 0; transition: width 0.25s cubic-bezier(0.22,1,0.36,1); }
  [data-row]:hover [data-dash], [data-row][aria-current="true"] [data-dash] { width: 14px; }
  [data-row][aria-current="true"] [data-desc] { max-height: 40px; opacity: 1; margin-top: 6px; }
  [data-row] [data-desc] { max-height: 0; opacity: 0; overflow: hidden; margin-top: 0; transition: max-height 0.3s, opacity 0.3s, margin-top 0.3s; }
  [data-frame] { transition: width 0.72s cubic-bezier(0.34,1.2,0.44,1), height 0.72s cubic-bezier(0.34,1.2,0.44,1), border-radius 0.72s, padding 0.72s, transform 0.72s cubic-bezier(0.34,1.2,0.44,1); }
  [data-base] { transition: opacity 0.35s, transform 0.5s cubic-bezier(0.34,1.2,0.44,1); }
  [data-static] { transition: opacity 0.25s; }
  @keyframes introText { 0% { opacity: 0; transform: translateY(8px); } 18% { opacity: 1; transform: none; } 70% { opacity: 1; } 100% { opacity: 0; } }
  @keyframes introGrid { 0% { opacity: 0; transform: scale(1.4); } 35% { opacity: 0.6; } 100% { opacity: 0; transform: scale(1); } }
  @keyframes introOut { 0%, 78% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } }
  @keyframes railIn { 0%, 30% { opacity: 0; transform: translateX(-16px); } 60%, 100% { opacity: 1; transform: none; } }
  @keyframes stageIn { 0%, 45% { opacity: 0; transform: translateY(24px) scale(0.98); } 85%, 100% { opacity: 1; transform: none; } }
  @keyframes pulse { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
  @keyframes ring { 0% { box-shadow: 0 0 0 0 rgba(169,193,255,0.9); } 70% { box-shadow: 0 0 0 14px rgba(169,193,255,0); } 100% { box-shadow: 0 0 0 0 rgba(169,193,255,0); } }
  @keyframes nudgeIn { from { opacity: 0; transform: translateX(10px); } to { opacity: 1; transform: none; } }
  @keyframes bob { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(-5px); } }
  [data-nudge="1"] { animation: ring 1.6s ease-out infinite; }
  [data-nudge="1"] [data-arrow] { animation: bob 1.2s ease-in-out infinite; }
  [data-callout] { animation: nudgeIn 0.4s 0.3s cubic-bezier(0.22,1,0.36,1) both; }
  @keyframes hint { 0% { background: rgba(36,87,232,0); } 25% { background: rgba(36,87,232,0.14); } 100% { background: rgba(36,87,232,0); } }
  [data-hint="1"] { animation: hint 1.2s 1.6s ease both; border-radius: 4px; }
  @media (min-width: 960px) { [data-cmp] { grid-template-columns: 300px minmax(0, 1fr) !important; } }
  [data-intro="1"] { animation: introOut 1.4s ease both; pointer-events: none; }  [data-intro="1"] [data-intro-text] { animation: introText 1.1s ease both; }
  [data-intro="1"] [data-intro-grid] { animation: introGrid 1.2s 0.2s ease both; }
  [data-intro="0"] { display: none; }
  [data-first="1"] [data-rail] { animation: railIn 1.4s ease both; }
  [data-first="1"] [data-stage] { animation: stageIn 1.6s ease both; }
  [data-panel] { transition: transform 0.45s cubic-bezier(0.22,1,0.36,1), visibility 0s linear 0.45s, box-shadow 0.2s; }
  [data-panel][style*="visibility: visible"] { transition: transform 0.45s cubic-bezier(0.22,1,0.36,1), visibility 0s, box-shadow 0.2s; }
  @media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } [data-intro] { display: none !important; } }
  @media (max-width: 1023px) {
    [data-rail] { position: fixed !important; left: 0; right: 0; top: 64px; bottom: 0; z-index: 60; width: auto !important; border-right: 0 !important; transform: translateY(100%); transition: transform 0.4s cubic-bezier(0.22,1,0.36,1); }
    [data-rail][data-open="1"] { transform: none; }
    [data-mobilebar] { display: flex !important; }
    [data-toolleft] { display: none !important; }
    [data-tooltext] { display: none !important; }
    [data-dockbtns] { flex-wrap: wrap; width: 100%; }
    [data-dockbtns] > * { flex: 1 1 160px; }
    [data-glance] { display: none !important; }
    [data-docktags] { display: none !important; }
    [data-nav] { display: none !important; }
    [data-headlabel] { display: none !important; }
    [data-panel] { width: 100vw !important; }
    [data-edge] { display: none !important; }
  }


/* style-hover 33자리에서 옮긴 :hover 규칙 */
.dch1:hover{color: #2457e8 !important;}
.dch2:hover{background: #2457e8 !important;border-color: #2457e8 !important;color: #fff !important;}
.dch3:hover{{{ t.hover }} !important;}
.dch4:hover{background: #e8efff !important;}
.dch5:hover{border-color: #20211f !important;}
.dch6:hover{border-color: #d6d8cf !important;}
.dch7:hover{background: #2457e8 !important;border-color: #2457e8 !important;}
.dch8:hover{border-color: #20211f !important;color: #20211f !important;}
.dch9:hover{background: #2457e8 !important;color: #fff !important;}
.dch10:hover{background: #1745be !important;color: #fff !important;}
.dch11:hover{background: #1745be !important;}
.dch12:hover{background: #3a6cf0 !important;}
@media (prefers-reduced-motion: no-preference){.dch12:hover{transform: translateX(-2px) !important;}}
.dch13:hover{background: rgba(255,255,255,0.18) !important;}
@media (prefers-reduced-motion: no-preference){.dch13:hover{transform: translateX(-2px) !important;}}
.dch14:hover{background: rgba(255,255,255,0.24) !important;}
.dch15:hover{background: #3a6cf0 !important;}
.dch16:hover{background: rgba(255,255,255,0.18) !important;}
.dch17:hover{border-color: #2457e8 !important;color: #2457e8 !important;}
.dch18:hover{background: #20211f !important;color: #fff !important;}