/* ===== 테마 오버레이: 전역 스타일(owm- 접두어) ===== */
/* Reset & Tokens */
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-size:0.9em;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Pretendard,Noto Sans KR,Helvetica,Arial;line-height:1.45;color:#0b1220;background:#fff}
img{max-width:100%;}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
.sr-only,.sound_only{position:absolute;left:-9999px;height:1px;width:1px;overflow:hidden}
:root{
  --max:1200px; --px:20px; --gap:16px; --radius:14px;
  --bg:#fff; --soft:#f7f8fb; --line:#e5e7eb; --line2:#eef0f3;
  --muted:#6b7280; --shadow:0 10px 26px rgba(15,23,42,.06);
  --g1:#6366f1; --g2:#06b6d4;
  --mobileGnbTop: 0px;
  --gap-page: 22px;     /* 본문/사이드 간격 */
  --aside-w: 320px;     /* PC 사이드 폭 */
  --sticky-top: 84px;   /* 사이드 스티키 상단 여백(헤더 높이 반영) */
  --owm-c1:#688CFF; --owm-c2:#9883EF; --owm-c3:#CE86B6;
}


/* 기본버튼 */
a.btn_admin, .btn_admin{text-align:right;}
.btn{display:inline-flex;align-items:center;justify-content:center;width:100%;height:38px;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.btn:hover{border-color:var(--g1);color:var(--g1)}
.chip{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:12px;color:#374151}
/* gradient primary */
.btn-primary{background:linear-gradient(90deg,var(--g1),var(--g2));border-color:transparent;color:#fff;box-shadow:var(--shadow)}
.btn-primary.white-hover:hover,
.btn-primary.white-hover:focus-visible {
  color:#ffffff !important;   /* 링크/버튼 공통 */
}
.btn-primary:hover{filter:brightness(.98)}
.btn-ghost{background:#fff;border:1px solid var(--line);color:#111}
.btn-group .btn{height:38px}

/* Utility */
.owm-container{max-width:var(--max);margin:0 auto;padding:0 var(--px)}
.owm-btn{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.owm-btn:hover{border-color:var(--g1);color:#var(--g1)}
.owm-chip{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:12px;color:#374151}

/* Header */
#nhd{position:sticky;top:0;z-index:991;background:rgba(255,255,255,.95);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line)}
#ntnb{background:#fff;border-bottom:1px solid var(--line);position:relative}
#ntnb::after{content:"";display:block;height:2px;background:linear-gradient(90deg,var(--g1),var(--g2));opacity:.35}
#ntnb .owm-inner{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:8px}
#nhd_define,#nhd_qnb{display:flex;gap:12px;align-items:center;margin:0;padding:0;list-style:none}
#nhd_define a,#nhd_qnb a{font-size:13px}
#nhd_define .active a{font-weight:800;background:linear-gradient(90deg,var(--g1),var(--g2));-webkit-background-clip:text;background-clip:text;color:transparent}

/* Brand line */
#nhd_wrapper{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"brand . acc" "search search search" "keys keys keys";gap:10px;padding:12px 5px;}
.owm-brand-left{grid-area:brand;display:flex;align-items:center;gap:8px}
.owm-menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--line);border-radius:10px;background:#fff}
.owm-menu-toggle svg{width:18px;height:18px}
#nlogo a{display:flex;align-items:center;gap:10px}
#nlogo .mark{width:32px;height:34px;}
#nlogo .owm-title{
  font-weight:800; line-height:1; letter-spacing:.2px;
  display:inline-block; -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
#nlogo .logo{max-width:80%;}
.owm-title--owm{
  background:linear-gradient(90deg,var(--owm-c1) 0%,var(--owm-c2) 45%,var(--owm-c3) 100%);
  text-shadow:0 0 1px rgba(104,140,255,.55),0 0 10px rgba(104,140,255,.25),0 0 24px rgba(206,134,182,.20);
  filter:drop-shadow(0 0 .5px rgba(0,0,0,.12));
}
.owm-title--owm-vivid{
  background:linear-gradient(90deg,#64A5FF 0%, #A78BFA 45%, #FF7CCB 100%);
  text-shadow:0 0 1px rgba(100,165,255,.6),0 0 12px rgba(100,165,255,.30),0 0 28px rgba(255,124,203,.22);
}
@media (max-width:767px){ #nlogo .owm-title{font-size:20px} }
@media (min-width:768px){ #nlogo .owm-title{font-size:26px} }

/* Account (mobile) */
.owm-acc-area{grid-area:acc;position:relative;display:flex;align-items:center;justify-content:flex-end}
.owm-acc-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.owm-acc-toggle svg{width:18px;height:18px}
.owm-acc-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:160px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);display:none;z-index:6000}
.owm-acc-menu a{display:block;padding:10px 12px;border-bottom:1px dashed var(--line2)}
.owm-acc-menu a:last-child{border-bottom:0}
.owm-acc-area.open .owm-acc-menu{display:block !important}
.owm-acc-menu .owm-badge{float:right;color:#2563eb;font-weight:700;opacity:.85}
@media (min-width:1024px){ .owm-acc-area{display:none} }


/* Search */
.owm-hd_sch_wr{grid-area:search;display:flex;flex-direction:column;gap:6px}
#nhd_sch{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:6px 8px;box-shadow:var(--shadow)}
#nhd_sch input[type="search"]{padding:3px;flex:1;border:0;outline:0;font-size:14px;line-height:20px;min-width:1px;background:transparent}
#nhd_sch button{width:36px;height:34px;border:0;background:transparent;border-left:1px solid var(--line);cursor:pointer}
.owm-btn-search{display:inline-flex;align-items:center;justify-content:center;width:36px;height:34px;padding:0;background:transparent;border:0;cursor:pointer;color:#111;line-height:0}
.owm-btn-search:focus-visible{outline:2px solid #4f46e5;outline-offset:2px;border-radius:6px}
#nhd_sch .owm-btn-search svg{display:block;width:20px;height:20px;overflow:visible}
#nhd_sch .owm-btn-search .icon--search{fill:none !important;stroke:currentColor !important;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
@media (prefers-color-scheme: dark){ .owm-btn-search{color:#e5e7eb} }
.owm-btn-search:hover{color:#111}

/* GNB */
/* ===== GNB 공통 ===== */
#ngnb{
  position:relative;
  z-index:992;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:#fff;
}
.owm-gnb_wrap{ padding:0; overflow:visible; }

/* 1뎁스 */
#ngnb_1dul{
  --gnb-gap:20px;
  display:flex; align-items:center; gap:var(--gnb-gap);
  list-style:none; margin:0 5px; padding:5px 0; overflow:visible;
}
#ngnb_1dul>li{ position:relative; }
#ngnb_1dul>li>.ngnb_1da{
  display:block; padding:8px 2px; font-weight:700;
  border-bottom:2px solid transparent; white-space:nowrap;
}
#ngnb_1dul>li:hover>.ngnb_1da{
  background:linear-gradient(90deg,var(--g1),var(--g2));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}


/* 2뎁스 기본 */
.ngnb_2dul{
  position:absolute; left:0; top:calc(100% + 8px); /* ← margin 대신 calc */
  /* margin-top:8px;  삭제 */
  display:none;
  background:#fff; border:1px solid var(--line);
  border-radius:12px; box-shadow:var(--shadow);
  min-width:220px; padding:8px; z-index:993;
}
.ngnb_2dul ul{list-style:none; margin:0; padding:6px;}
.ngnb_2dul a{display:block; padding:10px 12px; border-radius:8px; color:#1f2937;}
.ngnb_2dul a:hover{background:var(--soft);}

/* 🧯 PC 브릿지: li 아래로 10~14px 정도 클릭/호버 유지용 */
#ngnb_1dul>li::before{
  content:""; position:absolute; left:-16px; right:-16px; top:100%;
  height:24px; /* ← 14px → 24px 으로 확대 */
}
#ngnb_1dul>li::after{
  content:""; position:absolute;left:-16px; right:-16px;
  pointer-events:auto;
}
#ngnb_1dul>li.open>.ngnb_2dul{ display:block }

/* 🔧 (추가) 모바일 터치 방해 방지: 호버 브릿지 끄기 */
@media (max-width:767px){
  #ngnb_1dul>li::before{ display:none; }
}

#gnb_drop_bg{
  display: none !important;
  pointer-events: none !important;
  opacity: 0 !important;
  z-index: auto !important;
}

#owm_gnb_drop_bg{
  position:fixed; inset:0;
  background:rgba(15,23,42,.45);
  z-index:990;        /* 서브메뉴(3200)보다 낮게 */
  display:none;
  pointer-events:auto;
}
body.gnb-overlay--active #owm_gnb_drop_bg{
  display:block !important;
  pointer-events:auto !important;
}

/* PC: hover로만 노출 */
@media (max-width: 767px){
  #gnb_drop_bg{
    display: none !important;
    pointer-events: none !important;
  }
  .owm-popular-keys{max-height:30px;}
  #owm_gnb_drop_bg{
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.45);
    z-index: 990;
    display: none;
    pointer-events: auto;
  }
}
@media (min-width: 768px){
  #ngnb_1dul>li:hover .ngnb_2dul,
  #ngnb_1dul>li:focus-within .ngnb_2dul,
  #ngnb_1dul>li.open>.ngnb_2dul{ display:block; }
}

/* 모바일에서 JS가 붙이는 상태 */
.ngnb_2dul.mobile{
  display:block !important;
  position:fixed; left:0; right:0;
  top: var(--mobileGnbTop, 0px);
  margin-top:0; border-radius:0 0 12px 12px;
  max-height:60vh; overflow:auto;
  z-index:992;     /* ← 여기 3200으로 */
}

/* ===== 모바일(≤767px) 가로 스크롤 탭 + 페이드 ===== */
@media (max-width: 767px){
  /*전체적으로 폰트 크기 늘이기*/
  body{font-size: 0.95em; }
  /* 검색 입력도 16px 이상 유지 (iOS 줌 방지) */
  #nhd_sch input[type="search"],
  #nhd_sch input[type="text"] { font-size: 16px; }

  .owm-gnb_wrap{
    position:relative; overflow:hidden; background:#fff;
  }
  #ngnb_1dul{
    gap:14px; padding:0px 12px; margin:0;
    flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden;
    -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  #ngnb_1dul::-webkit-scrollbar{ display:none; }
  #ngnb_1dul > li{ flex:0 0 auto; scroll-snap-align:start; }
  #ngnb_1dul>li>.ngnb_1da{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px 12px;
    margin:4px 0;
    line-height:1.2;
    border-radius:12px;
    position:relative;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }
  /* 시각적 변화 없이 실제 탭 판정 범위를 더 키움(위/아래만 확장) */
  #ngnb_1dul>li>.ngnb_1da::before{
    content:"";
    position:absolute;
    left:0; right:0;
    top:-8px; bottom:-8px;
  }
  /* 좌/우 페이드 (JS가 변수 제어) */
  .owm-gnb_wrap::before,
  .owm-gnb_wrap::after{
    content:""; position:absolute; top:0; bottom:0; width:24px; z-index:20;
    pointer-events:none; opacity:0; transition:opacity .2s ease;
  }
  .owm-gnb_wrap::before{
    left:0;
    background:linear-gradient(90deg,#fff 0%, rgba(255,255,255,.9) 40%, rgba(255,255,255,0) 100%);
    opacity:var(--fade-left, 0);
  }
  .owm-gnb_wrap::after{
    right:0;
    background:linear-gradient(270deg,#fff 0%, rgba(255,255,255,.9) 40%, rgba(255,255,255,0) 100%);
    opacity:var(--fade-right, 0);
  }
}


/* Page */
#nwrapper{background:#fff;position:relative;z-index:9;}
#ncontainer_wr{
  display:grid;
  grid-template-columns: 1fr;     /* 모바일: 1열 */
  gap: var(--gap-page);
  padding: 18px 5px;              /* 기존 패딩 유지 */
}
@media (min-width:1024px){ #ncontainer_wr{grid-template-columns:1fr 320px} }

/* PC: 2열(본문 1fr + 사이드 고정 폭) */
@media (min-width: 1100px){
  #ncontainer_wr{
    grid-template-columns: minmax(0,1fr) var(--aside-w);
    align-items: start;
  }
}
@media (min-width:768px){
  #ncontainer_wr.no-aside{
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start;
  }
  #ncontainer_wr.no-aside > #naside{
    display: none !important;
  }
}
/* 모바일/태블릿에서도 혹시 남는 경우 방지(보수용) */
#ncontainer_wr.no-aside > #naside{ display: none !important; }

/* 본문 영역이 캐러셀/카드 폭을 잘 수용하도록 */
#ncontainer{ min-width: 0; }
#ncontainer .owl-carousel{ width: 100%; }

/* shop.head.php에서 추가한 내부 div를 본문 인너로 활용(있을 때만) */
.ncontent_in{ display:block; }

/* 섹션 간격은 레이아웃 gap로 관리 → 중복 마진 최소화 */
.sct_wrap + .sct_wrap{ margin-top: 0; }

/* 사이드: 데스크톱에서 스티키 동작 */
@media (min-width: 1100px){
  #naside{
    position: sticky;
    top: var(--sticky-top);
    align-self: start;
    height: fit-content;
  }
}

/* =========================
   OWL CAROUSEL (히트상품)
   ========================= */
#idx_hit .owl-stage-outer{ padding: 4px 0 14px; }
#idx_hit .owl-nav{
  position: relative;
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
}
#idx_hit .owl-nav button{
  width: 36px; height: 36px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--shadow);
  line-height: 0;
}
#idx_hit .owl-nav .owl-prev{ margin-left: 6px; }
#idx_hit .owl-nav .owl-next{ margin-right: 6px; }
#idx_hit .owl-dots{ margin-top: 8px; }

/* =========================
   접근성/자잘한 보정
   ========================= */
#ncontainer_title:focus{
  position: static;
  height: auto; width: auto;
  clip: auto; clip-path: none;
  margin: 8px 0;
}

.owm-card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
.owm-section{margin:8px 0 22px}

/* Latest cards */
.owm-latest_top_wr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (min-width:900px){ .owm-latest_top_wr{grid-template-columns:repeat(4,1fr)} }
.owm-latest-card .thumb{height:110px;background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(6,182,212,.12));border-bottom:1px solid var(--line)}
.owm-latest-card .body{padding:12px}
.owm-latest-card h3{margin:0 0 6px;font-size:15px}
.owm-latest-card a:hover{color:#4f46e5}

/* Gallery */
.owm-gallery-wrap{padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--soft)}
.owm-gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:720px){ .owm-gallery-grid{grid-template-columns:repeat(4,1fr)} }
.owm-gallery-item{aspect-ratio:4/3;border-radius:12px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(6,182,212,.08))}

/* Boards */
.owm-boards-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:900px){ .owm-boards-grid{grid-template-columns:repeat(3,1fr)} }
.owm-bo-card header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line)}
.owm-bo-card header h3{margin:0;font-size:15px}
.owm-bo-card header a{font-size:13px;color:#6366f1}
.owm-bo-card ul{list-style:none;margin:0;padding:10px 12px}
.owm-bo-card li{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line2)}
.owm-bo-card li:last-child{border-bottom:0}
.owm-dot{width:8px;height:8px;border-radius:50%;background:linear-gradient(180deg,var(--g1),var(--g2));opacity:.6}
.owm-meta{margin:5px;font-size:12px;color:#6b7280}

/* Aside */
#naside{
  display:flex;
  flex-direction:column;
  row-gap:8px;
  min-height:100%;
}
#naside > *{ margin:0 !important; }
#naside .owm-fill{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
}
#naside .owm-fill .owm-pointbox__list{ margin-bottom:0; }

.owm-widget{padding:12px}
.owm-widget h4{margin:0 0 8px;font-size:14px}
.owm-login-box input{width:100%;height:38px;border:1px solid var(--line);border-radius:10px;padding:0 10px;margin-bottom:3px}
.owm-login-box .owm-btn{width:100%}
.owm-poll ul{list-style:none;margin:0;padding:0}
.owm-poll li{display:flex;align-items:center;gap:8px;padding:6px 0}

/* ===== 포인트 랭킹(사이드바 미니) ===== */
.owm-pointbox{padding:12px;border:1px dashed var(--line2,#edf0f3);border-radius:12px;background:#fff;margin-top:12px}
.owm-pointbox__hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.owm-pointbox__hd h4{margin:0;font-size:14px}
.owm-pointbox__more{font-size:12px}

.owm-pointbox__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:6px}
.owm-pointbox__item{display:grid;grid-template-columns:24px 28px 1fr auto;align-items:center;gap:8px;padding:6px 8px;border-radius:10px}
.owm-pointbox__item:hover{background:#f8fafc}
.owm-pointbox__no{width:24px;height:24px;display:inline-grid;place-items:center;border-radius:6px;background:#eff3ff;color:#3b82f6;font-weight:700;font-size:12px}
.owm-pointbox__avatar img{width:28px;height:28px;border-radius:50%;border:1px solid #e5e7eb;display:block}
.owm-pointbox__nick{font-size:13px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.owm-pointbox__point{font-size:13px;color:#2563eb}

/*기타모음*/
.win_btn{margin-top:10px;}
.fregister_agree input[type="checkbox"] + label span{top:15px !important;}

@media (min-width:480px){
  .owm-pointbox__list{grid-template-columns:1fr 1fr}
}
@media (min-width:768px){
  .owm-pointbox__list{grid-template-columns:1fr}
}

/* Footer */
#nft{border-top:1px solid var(--line);margin-top:20px}
#nft_wr{display:grid;grid-template-columns:1fr;gap:16px;padding:18px 5px;}
@media (min-width:980px){ #nft_wr{grid-template-columns:1fr 1fr 1fr 1.2fr} }
#nft_company .nft_info{font-size:13px;color:#4b5563;line-height:1.7;border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff}
#nft_copy{border-top:1px solid var(--line);text-align:center;font-size:13px;color:#6b7280;padding:14px 0}
#nft_link a{display:inline-block;margin:6px 10px 6px 0;color:#374151}
#nft_link a:hover{color:#6366f1}

/* Top button */
#top_btn{
  position:fixed;right:18px;bottom:18px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;
  color:#4f46e5; /* 폴백 색상 */
}
#top_btn svg{width:16px;height:16px}
/* 🔧 (수정) 그라디언트가 없을 때를 위한 폴백 컬러 */
#top_btn svg path{ fill: url(#gradIcon) currentColor; }

/* Focus ring */
:focus-visible{outline:2px solid rgba(99,102,241,.55);outline-offset:2px}