@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');

/* ===== 셀러찾기 레이아웃 ===== */
:root{
  --sf-ink:#16233b; --sf-brand:#2f4ed8; --sf-brand-d:#2540c4;
  --sf-bg:#f3f4f7; --sf-card:#fff; --sf-line:#e7e9ef; --sf-line2:#eef0f4;
  --sf-text:#1c2230; --sf-text2:#5a6172; --sf-muted:#9298a8; --sf-hot:#ff5a5f;
}
body{
  font-family:"Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif !important;
  background:var(--sf-bg) !important; color:var(--sf-text); letter-spacing:-.2px; margin:0;
}
.sf-wrap{max-width:1160px;margin:0 auto;padding:0 16px}
.sf-head a, .sf-gnb a, .sf-side a, .sf-foot a{text-decoration:none}

/* 유틸바 */
.sf-ubar{background:var(--sf-ink);color:#c8cfe0;font-size:12px}
.sf-ubar .sf-wrap{display:flex;align-items:center;justify-content:space-between;height:36px}
.sf-auth{display:flex;gap:8px;align-items:center}
.sf-auth a{color:#c8cfe0}
.sf-login,.sf-me b{color:#fff}
.sf-login{background:var(--sf-brand);padding:4px 11px;border-radius:6px;font-weight:600;color:#fff !important}
.sf-lo{color:#97a0b8 !important;text-decoration:underline !important;font-size:11px}
.sf-me b{color:#7fd3ff}

/* 헤더 */
.sf-head{background:var(--sf-card);border-bottom:1px solid var(--sf-line)}
.sf-head .sf-wrap{display:flex;align-items:center;gap:22px;height:76px}
.sf-logo{display:flex;align-items:center;gap:9px;flex:none;color:var(--sf-ink) !important}
.sf-mk{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--sf-brand),#5b7cff);display:flex;align-items:center;justify-content:center;color:#fff}
.sf-mk svg{width:20px;height:20px}
.sf-tx{font-size:23px;font-weight:800;letter-spacing:-1px}
.sf-tx b{color:var(--sf-brand)}
.sf-sub{font-size:11px;color:var(--sf-muted);padding-top:8px}
.sf-search{flex:1;display:flex;max-width:460px;margin:0 auto}
.sf-search input[name=search_keyword]{flex:1;border:2px solid var(--sf-brand);border-right:none;border-radius:10px 0 0 10px;padding:0 14px;height:42px;outline:none;min-width:0;font-size:14px}
.sf-search button{background:var(--sf-brand);color:#fff;border:none;border-radius:0 10px 10px 0;padding:0 18px;font-weight:700;height:42px;cursor:pointer}
.sf-search button:hover{background:var(--sf-brand-d)}
.sf-write{flex:none;background:var(--sf-ink);color:#fff !important;font-weight:700;padding:0 18px;height:42px;border-radius:10px;display:flex;align-items:center}

/* GNB */
.sf-gnb{background:var(--sf-card);border-bottom:1px solid var(--sf-line);position:sticky;top:0;z-index:40}
.sf-gnb .sf-wrap{display:flex;gap:2px;overflow-x:auto}
.sf-gnb a{flex:none;padding:13px 15px;font-weight:700;font-size:15px;color:var(--sf-text2) !important;border-bottom:3px solid transparent;white-space:nowrap}
.sf-gnb a:hover{color:var(--sf-ink) !important;border-bottom-color:var(--sf-brand)}
.sf-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:1px}

/* 본문 그리드 */
.sf-main{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;margin:18px auto 40px;align-items:start}
.sf-content{min-width:0;width:100%;max-width:100%;box-sizing:border-box;background:var(--sf-card);border:1px solid var(--sf-line);border-radius:14px;padding:6px 20px 20px}
.sf-main-home{grid-template-columns:minmax(0,1fr)}
.sf-content-home{padding:0;background:transparent;border:0}

/* 라이믹스 기본 게시판 요소 톤 맞춤(가벼운 오버라이드) */
.sf-content a{color:var(--sf-text)}
.sf-content a:hover{color:var(--sf-brand)}
.sf-content .board_list thead th, .sf-content table thead th{background:#fafbfc}

/* 사이드 */
.sf-side{min-width:0;width:100%;max-width:100%;box-sizing:border-box}
.sf-card{background:var(--sf-card);border:1px solid var(--sf-line);border-radius:14px;overflow:hidden}
.sf-card+.sf-card{margin-top:14px}
.sf-card-h{padding:14px 18px;border-bottom:1px solid var(--sf-line2)}
.sf-card-h h2{font-size:15px;font-weight:800;margin:0}
.sf-sbox{padding:16px}
.sf-st{font-size:14px;font-weight:800;margin-bottom:8px}
.sf-desc{font-size:12.5px;color:var(--sf-text2);line-height:1.6;margin:0 0 12px}
.sf-btn{display:inline-flex;align-items:center;gap:6px;background:var(--sf-brand);color:#fff !important;font-weight:700;font-size:13px;padding:9px 14px;border-radius:9px;justify-content:center}
.sf-btn:hover{background:var(--sf-brand-d)}
.sf-btn.ghost{background:#fff;color:var(--sf-text2) !important;border:1px solid var(--sf-line)}
.sf-btn.ghost:hover{color:var(--sf-brand) !important;border-color:var(--sf-brand)}
.sf-prof{display:flex;align-items:center;gap:11px}
.sf-av{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--sf-brand),#5b7cff);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:17px}
.sf-prof .pn{font-weight:800;font-size:15px}
.sf-prof .pg{font-size:11.5px;color:var(--sf-muted)}
.sf-feed-card{max-width:100%}
.sf-feed-item{display:block;min-width:0;max-width:100%;overflow:hidden;padding:11px 14px;border-top:1px solid var(--sf-line2);color:var(--sf-text) !important}
.sf-card-h+.sf-feed-item{border-top:0}
.sf-feed-item:hover{background:#f8f9fc;color:var(--sf-brand) !important}
.sf-feed-item strong,.sf-feed-item span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-feed-item strong{font-size:13px;font-weight:700}
.sf-feed-item span{margin-top:4px;color:var(--sf-muted);font-size:11px}
.sf-feed-empty{margin:0;padding:22px 14px;color:var(--sf-muted);font-size:12px;text-align:center}

/* 푸터 */
.sf-foot{background:var(--sf-ink);color:#8d97ad;margin-top:10px}
.sf-foot .sf-wrap{padding:26px 16px 30px}
.sf-flinks{display:flex;gap:16px;font-size:12.5px;margin-bottom:12px;flex-wrap:wrap}
.sf-flinks a{color:#c1c9d9 !important;font-weight:600}
.sf-flinks a:hover{color:#fff !important}
.sf-copy{font-size:12px;line-height:1.8}

/* FAB */
.sf-fab{display:none;position:fixed;right:18px;bottom:22px;width:54px;height:54px;border-radius:50%;background:var(--sf-brand);color:#fff !important;font-size:22px;box-shadow:0 8px 22px rgba(47,78,216,.4);z-index:60;align-items:center;justify-content:center}

/* 반응형 */
@media (max-width:960px){
  .sf-search{max-width:none}
}
@media (max-width:760px){
  .sf-head .sf-wrap{height:auto;flex-wrap:wrap;gap:10px;padding-top:12px;padding-bottom:12px}
  .sf-sub{display:none}
  .sf-write{display:none}
  .sf-search{order:3;flex-basis:100%}
  .sf-fab{display:flex}
}

/* ===== v2: 중국다이렉트 업데이트 ===== */
/* 로고 이미지 */
.sf-logoimg{height:48px;width:auto;display:block}

/* 유틸바 로그인/회원가입 버튼 정렬 */
.sf-auth{display:flex;align-items:center;gap:8px}
.sf-join{border:1px solid rgba(255,255,255,.35);padding:4px 11px;border-radius:6px;color:#fff !important;font-weight:600}
.sf-join:hover,.sf-login:hover{opacity:.9}

/* 회원 팝업메뉴에서 '회원정보 보기' 숨김 */
#popup_menu_area a[href*="MemberInfo"],
.popup_menu_area a[href*="MemberInfo"],
#popup_menu_area a[href*="dispMemberInfo"]{display:none !important}

/* 모바일 보강 */
@media (max-width:760px){
  .sf-logoimg{height:38px}
  .sf-ubar .sf-stat{font-size:11px}
  .sf-content{padding:4px 12px 16px}
}


/* ===== v2.2: 정렬 수정 ===== */
/* 크롬 영역 box-sizing (본문 모듈 영역은 제외) */
.sf-ubar,.sf-ubar *,.sf-head,.sf-head *,.sf-gnb,.sf-gnb *,
.sf-side,.sf-side *,.sf-foot,.sf-foot *{box-sizing:border-box}

/* 상단 검색창: 입력칸/버튼 높이 일치 */
.sf-search input[name=search_keyword],.sf-search button{height:44px}

/* 유틸바 로그인/회원가입: 같은 크기의 알약 버튼으로 통일 */
.sf-login,.sf-join{display:inline-flex;align-items:center;height:25px;padding:0 12px !important;border-radius:6px;font-size:12px;line-height:1;white-space:nowrap}
.sf-login{background:var(--sf-brand);color:#fff !important;border:1px solid var(--sf-brand)}
.sf-join{background:transparent;color:#fff !important;border:1px solid rgba(255,255,255,.4)}

/* 모바일 전체 폭 + 게시판 메뉴: 3개 + 2개, 6칸 그리드 */
@media (max-width:720px){
  body,
  .sf-wrap,
  .sf-main,
  .sf-content,
  .sf-side{
    min-width:0;
    max-width:100%;
    box-sizing:border-box;
  }
  .sf-side{order:2}
  .sf-main{
    width:100%;
    grid-template-columns:minmax(0,1fr);
    margin:12px auto 28px;
    padding:0 12px;
  }
  .sf-content{
    width:100%;
    padding:4px 12px 16px;
  }
  .sf-content-home{padding:0}
  .sf-content > *,
  .sf-content form,
  .sf-content table{
    min-width:0;
    max-width:100%;
    box-sizing:border-box;
  }
  .sf-content table{width:100%}
  .sf-content img,
  .sf-content video,
  .sf-content iframe{
    max-width:100%;
  }
  .sf-content img,
  .sf-content video{height:auto}
  .sf-content input,
  .sf-content select,
  .sf-content textarea,
  .sf-content button{
    max-width:100%;
    box-sizing:border-box;
  }
  .sf-gnb{
    width:100%;
    max-width:100%;
    overflow:visible;
  }
  body .sf-gnb > .sf-wrap{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr));
    grid-auto-flow:row;
    width:100%;
    max-width:100%;
    gap:4px;
    padding:4px 12px;
    overflow:visible !important;
  }
  body .sf-gnb > .sf-wrap > a{
    display:flex !important;
    align-items:center;
    justify-content:center;
    flex:0 1 auto !important;
    min-width:0 !important;
    width:100%;
    max-width:100%;
    min-height:44px;
    padding:6px 4px;
    font-size:13px;
    line-height:1.25;
    text-align:center;
    white-space:normal !important;
    word-break:keep-all;
  }
  body .sf-gnb > .sf-wrap > a:nth-child(-n+3){grid-column:span 2}
  body .sf-gnb > .sf-wrap > a:nth-child(n+4){grid-column:span 3}

  .sf-content .cd-reaction-buttons{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px;
    width:100%;
  }
  .sf-content .cd-reaction-buttons > .cd-reaction{
    width:100% !important;
    min-width:0 !important;
    min-height:44px;
  }
  .sf-content .cd-reaction-buttons > .cd-reaction:last-child:nth-child(odd){
    grid-column:1/-1;
  }
  .sf-content .cd-stat-boost-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .sf-content .cd-stat-boost-grid > :last-child:nth-child(odd){
    grid-column:1/-1;
  }
}