/* 홈 «기능소개» 탭 — PC : 오른쪽 가장자리 세로 탭 → 오른쪽 패널 · 폰 : 아래 단추 → 전체 화면 시트. 데이터 /features/index.json (tab.js) */
.fx-tab{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:1050;writing-mode:vertical-rl;letter-spacing:2px;
  background:#101012;color:#fff;font:700 14px/1 "Pretendard",-apple-system,"Malgun Gothic",sans-serif;padding:18px 11px;border-radius:12px 0 0 12px;
  box-shadow:-6px 8px 24px rgba(16,16,40,.22);cursor:pointer;border:0;display:flex;align-items:center;gap:8px}
.fx-tab:hover{background:#2638ff}
.fx-tab .fx-sp{color:#9aa4ff;writing-mode:horizontal-tb}
.fx-tab:hover .fx-sp{color:#fff}
.fx-ov{position:fixed;inset:0;z-index:1200;background:rgba(10,10,24,.42);opacity:0;visibility:hidden;transition:opacity .25s}
.fx-ov.on{opacity:1;visibility:visible}
.fx-pn{position:fixed;top:0;right:0;bottom:0;z-index:1201;width:min(1040px,94vw);background:#fff;display:flex;flex-direction:column;
  box-shadow:-20px 0 60px rgba(16,16,40,.25);transform:translateX(102%);transition:transform .35s cubic-bezier(.2,.85,.25,1);
  font-family:"Pretendard",-apple-system,"Malgun Gothic",sans-serif;color:#2c2e33}
.fx-pn.on{transform:none}
.fx-hd{display:flex;align-items:center;gap:8px;padding:16px 20px;border-bottom:1px solid #e6e6e2}
.fx-hd .fx-sp{color:#2638ff;font-size:17px}
.fx-hd b{font-size:17px;color:#101012;font-weight:800}
.fx-hd .fx-cnt{margin-left:auto;color:#a3a7b0;font-size:13px}
.fx-x{width:32px;height:32px;border-radius:50%;border:0;background:#f0f0ed;color:#101012;font-size:16px;cursor:pointer}
.fx-bd{flex:1;display:flex;min-height:0}
.fx-ls{width:300px;flex:none;background:#f7f7f5;border-right:1px solid #e6e6e2;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}
.fx-it{position:relative;display:flex;gap:12px;padding:14px 18px;border:0;border-bottom:1px solid #e6e6e2;background:none;text-align:left;font:inherit;color:inherit;cursor:pointer;width:100%}
.fx-it:hover{background:#efefeb}
.fx-th{width:64px;height:46px;flex:none;border-radius:6px;overflow:hidden;background:#e9e9e4;border:1px solid rgba(0,0,0,.06)}
.fx-th img{width:100%;height:100%;object-fit:cover;object-position:left top;display:block}
.fx-ill{width:100%;height:100%;display:grid;place-items:center;font-size:20px;color:#fff;background:linear-gradient(135deg,#2638ff,#7c3aed)}
.fx-tx{min-width:0;flex:1}
.fx-tt{font-weight:700;font-size:14px;margin:5px 0 3px;color:#101012;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}
.fx-dt{font-size:12px;color:#a3a7b0}
.fx-it.on{background:#101012}
.fx-it.on .fx-tt{color:#fff}
.fx-it.on .fx-dt{color:#8a8ea0}
.fx-it.on .fx-chip{background:rgba(255,255,255,.14);color:#dfe2ff}
.fx-it.on::after{content:"";position:absolute;right:0;top:50%;margin-top:-7px;border:7px solid transparent;border-right-color:#fff;border-left:0}
.fx-all{margin-top:auto;padding:14px 18px;color:#2638ff;font-weight:700;font-size:13px;border-top:1px solid #e6e6e2;text-decoration:none}
.fx-chip{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:4px}
.fx-chip.NEW{color:#2638ff;background:#eceeff}.fx-chip.IMPROVE{color:#0a8f5f;background:#e3f6ee}
.fx-chip.MAINT{color:#c0283a;background:#fdecee}.fx-chip.INFO{color:#6b6f78;background:#f0f0ed}
.fx-vw{flex:1;min-width:0;overflow-y:auto;padding:28px 32px 32px;background:linear-gradient(170deg,#f2f3ff 0%,#fff 40%)}
.fx-vw .fx-meta{display:flex;align-items:center;gap:6px;color:#a3a7b0;font-size:13px}
.fx-vw h3{font-size:clamp(22px,2.4vw,28px);line-height:1.3;color:#101012;letter-spacing:-.6px;margin:12px 0 10px;font-weight:800}
.fx-vw .fx-sum{font-size:16px;color:#6b6f78;line-height:1.7;margin:0 0 20px}
.fx-shot{display:block;border-radius:12px;overflow:hidden;border:1px solid #dcdff0;box-shadow:0 16px 40px rgba(16,16,40,.14);background:#fff}
.fx-shot img{display:block;width:100%}
.fx-shot .fx-ill{min-height:240px;font-size:60px}
.fx-more{display:inline-block;margin-top:20px;background:#101012;color:#fff;font-weight:700;font-size:14px;padding:11px 20px;border-radius:999px;text-decoration:none}
.fx-more:hover{background:#2638ff}
html.fx-lock,html.fx-lock body{overflow:hidden}

@media (max-width:760px){
  .fx-tab{top:auto;bottom:16px;right:16px;transform:none;writing-mode:horizontal-tb;letter-spacing:0;border-radius:999px;padding:13px 18px;font-size:14px;box-shadow:0 10px 28px rgba(16,16,40,.3)}
  .fx-pn{top:0;left:0;width:auto;transform:translateY(102%);box-shadow:none}
  .fx-pn.on{transform:none}
  .fx-bd{flex-direction:column}
  .fx-ls{width:auto;max-height:34vh;border-right:0;border-bottom:1px solid #e6e6e2}
  .fx-it.on::after{display:none}
  .fx-vw{padding:20px 16px 28px}
}
@media (prefers-reduced-motion:reduce){.fx-pn,.fx-ov{transition:none}}
