@charset "utf-8";
/* ONAIR 스토어 (온에어 (OnAir) 방송국 테마 v1.0.0) — 영카트 기본 상품 스킨이 그대로 읽히도록 밝은 지면 위에 올린다 */
.oa-shop { margin-top: 4px; }
.oa-shopbar { display: flex; align-items: center; gap: 18px; padding: 14px 0 18px; }
.oa-shopbar__title { margin: 0; flex-shrink: 0; font-family: var(--oa-display); font-size: 22px; }
.oa-shopbar__title a { text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.oa-shopbar__search { flex: 1; display: flex; max-width: 440px; margin-left: auto; border: 1px solid var(--oa-line-2); border-radius: 999px; overflow: hidden; background: var(--oa-bg-2); }
.oa-shopbar__search input { flex: 1; min-width: 0; height: 42px; padding: 0 18px; border: 0; background: transparent; color: #fff; font: inherit; }
.oa-shopbar__search input::placeholder { color: var(--oa-mute); }
.oa-shopbar__search button { padding: 0 18px; border: 0; background: var(--oa-yellow); color: #000; font-weight: 800; cursor: pointer; }
.oa-shopbar__util { display: flex; gap: 14px; font-size: 14px; white-space: nowrap; }
.oa-shopbar__util a { text-decoration: none; color: var(--oa-sub); }
.oa-shopbar__util a:hover { color: #fff; }
.oa-shopbar__util b { display: inline-block; min-width: 20px; padding: 0 5px; border-radius: 10px; background: var(--oa-red); color: #fff; font-size: 12px; text-align: center; }
.oa-shopcat { display: flex; gap: 8px; margin-bottom: 18px; overflow-x: auto; scrollbar-width: none; }
.oa-shopcat::-webkit-scrollbar { display: none; }
.oa-shopcat a { flex-shrink: 0; padding: 8px 16px; border: 1px solid var(--oa-line-2); border-radius: 999px; font-size: 14px; font-weight: 700; text-decoration: none; color: var(--oa-sub); }
.oa-shopcat a:hover { color: #fff; border-color: rgba(255,255,255,.35); }
.oa-shopcat a.is-on { background: #fff; border-color: #fff; color: #000; }

.oa-paper { background: var(--oa-paper); color: var(--oa-paper-text); border-radius: var(--oa-radius); padding: 32px; min-height: 320px; }
.oa-paper a { color: inherit; }

.oa-paper__title { margin: 0 0 22px; font-family: var(--oa-display); font-weight: 400; font-size: 28px; color: var(--oa-paper-text); }
.oa-paper .oa-placeholder { background: #f4f5f8; border-color: #d7dae2; color: #4b5060; }
.oa-paper .oa-placeholder b { color: #000; }
.oa-sec-head--paper h2 { color: var(--oa-paper-text); float: none; margin: 0; line-height: 1.3; }
.oa-sec-head--paper::after { display: none !important; }
.oa-shopsec > header.oa-sec-head { padding: 0 0 16px; }
.oa-paper .oa-more { color: #6b7080; }
.oa-paper .oa-more:hover { color: var(--oa-red); }
.oa-shopsec { margin: 0 0 44px; }
.oa-shopsec:last-child { margin-bottom: 0; }
.oa-shopsec__eng { display: inline-block; margin-right: 6px; padding: 2px 8px; border-radius: 4px; background: #0b0d12; color: var(--oa-yellow); font-size: 13px; letter-spacing: .08em; vertical-align: 4px; }
.oa-shopmain #sbn_idx { margin-bottom: 36px; border-radius: 12px; overflow: hidden; }

/* 분류 위치 표시(원래 화면 위쪽 절대 위치)를 지면 안으로 */
.oa-paper #sct_location { position: static !important; float: none !important; display: block !important; width: auto !important; margin: 0 0 16px !important; }

/* 영카트 기본 목록 스킨 다듬기 */
.oa-paper .sct_wrap > header h2 { font-size: inherit; }
.oa-paper .sct { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; margin: 0; padding: 0; list-style: none; }
.oa-paper .sct::after { display: none; }
.oa-paper .sct > li { float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; clear: none !important; }
.oa-paper .sct_img { border-radius: 10px; overflow: hidden; background: #f1f2f5; }
.oa-paper .sct_img img { width: 100%; height: auto; display: block; transition: transform .3s; }
.oa-paper .sct > li:hover .sct_img img { transform: scale(1.04); }
.oa-paper .sct_txt a { font-weight: 700; text-decoration: none; }
.oa-paper .sct_cost { color: var(--oa-paper-text); font-weight: 800; }
.oa-paper .sct_dict { color: #9aa0ad; }
.oa-paper .sct_basic { color: #6b7080; }

/* 버튼 계열(주문·장바구니) 강조색 */
.oa-paper .btn_submit, .oa-paper #sit_btn_buy, .oa-paper .sit_btn_buy, .oa-paper .btn01.btn_submit { background: var(--oa-red) !important; border-color: var(--oa-red) !important; color: #fff !important; }
.oa-paper #sit_btn_cart, .oa-paper .sit_btn_cart { background: #0b0d12 !important; border-color: #0b0d12 !important; color: #fff !important; }

@media (max-width: 1100px) { .oa-paper .sct { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 960px) {
  .oa-shopbar { flex-wrap: wrap; }
  .oa-shopbar__search { order: 3; flex-basis: 100%; max-width: none; }
  .oa-shopbar__util { margin-left: auto; }
}
@media (max-width: 640px) {
  .oa-paper { padding: 20px 14px; border-radius: 10px; }
  .oa-paper .sct { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
  .oa-shopbar__title { font-size: 19px; }
  .oa-shopbar__util { gap: 10px; font-size: 13px; }
  .oa-paper__title { font-size: 23px; }
  .oa-paper table { display: block; max-width: 100%; overflow-x: auto; }
}

/* 영카트 PC 상품 화면을 좁은 화면에서도 읽히게 (반응형 한 벌 운영) */
@media (max-width: 960px) {
  .oa-paper #sit_ov_wrap, .oa-paper #sit_pvi, .oa-paper #sit_pvi_big, .oa-paper #sit_ov, .oa-paper #sit_title, .oa-paper #sit_desc,
  .oa-paper #sit_info, .oa-paper #sit_tab, .oa-paper #sit_buy, .oa-paper #sit_rel, .oa-paper .sit_admin, .oa-paper #sit_siblings,
  .oa-paper #sod_bsk, .oa-paper #sod_frm, .oa-paper #sod_fin, .oa-paper #sod_ws, .oa-paper #sod_v, .oa-paper #smb_my, .oa-paper #sct, .oa-paper #sct_hhtml, .oa-paper #sct_thtml {
    float: none !important; width: auto !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
  .oa-paper #sit_pvi_big img, .oa-paper #sit_inf_explan img { width: 100% !important; height: auto !important; }
  .oa-paper #sit_pvi_thumb { display: flex; flex-wrap: wrap; gap: 6px; float: none !important; position: static !important; margin: 10px 0 !important; }
  .oa-paper #sit_pvi_thumb li { float: none !important; }
  .oa-paper #sit_ov_wrap > * { clear: both; }
  .oa-paper #sit_buy { display: none !important; }
  .oa-paper #sit_info { width: 100% !important; }
  .oa-paper #sit_title { font-size: 21px !important; line-height: 1.35 !important; }
  .oa-paper .tbl_head01, .oa-paper .tbl_wrap, .oa-paper .tbl_frm01 { overflow-x: auto; max-width: 100%; }
  .oa-paper .sit_ov_tbl, .oa-paper #sit_opt_info { width: 100% !important; }
  .oa-paper #sit_star_sns, .oa-paper #sit_ov_btn { float: none !important; }
}
