/* 광고 상품 신청·등록 대행 공용 — 사이트 테마 변수(라이트·다크)를 따른다 */
.hub-page{max-width:1080px;margin:28px auto 64px;padding:0 16px;color:var(--fontColor,#111827);box-sizing:border-box;}
.hub-page *{box-sizing:border-box;}

/* 머리: 서비스 전환 탭 + 제목 + 조용한 한 줄 */
.hub-switch{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:var(--btnBgColor,#f1f3f6);margin-bottom:18px;}
.hub-switch a{padding:7px 14px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--fontColor2,#4b5563);text-decoration:none;white-space:nowrap;}
.hub-switch a:hover{color:var(--fontColor,#111827);}
.hub-switch a.on{background:var(--contBg,#fff);color:var(--fontColor,#111827);box-shadow:0 1px 3px rgba(15,23,42,.1);}
.hub-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap;}
.hub-title-row h1{font-size:26px;font-weight:800;margin:0;line-height:1.3;}
.hub-title-row p{margin:6px 0 0;font-size:14.5px;color:var(--fontColor2,#6b7280);}
.hub-util{display:flex;gap:14px;font-size:13.5px;}
.hub-util a{color:var(--fontColor2,#4b5563);text-decoration:none;display:inline-flex;align-items:center;gap:5px;}
.hub-util a:hover{color:var(--mainColorBlue,#3DA5F4);}
.hub-util i{font-size:12px;opacity:.7;}
.hub-util b{color:var(--mainColorBlue,#3DA5F4);font-weight:700;}

.hub-card{background:var(--contBg,#fff);border:1px solid var(--borderColor,#e5e7eb);border-radius:14px;padding:22px;}
.hub-note{font-size:13px;color:var(--fontColor3,#9ca3af);line-height:1.6;margin:14px 0 0;}
.hub-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;border-radius:10px;background:var(--mainColorBlue,#3DA5F4);color:#fff !important;font-size:14px;font-weight:700;text-decoration:none;border:0;cursor:pointer;white-space:nowrap;}
.hub-btn:hover{filter:brightness(.95);}
.hub-btn[hidden]{display:none !important;}

/* ── 광고 상품 신청 ── */
.hub-strip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;border-radius:12px;background:var(--inputBg,#f8fafc);border:1px dashed var(--borderColor,#d7dde6);font-size:13.5px;margin-bottom:18px;}
.hub-strip .k{font-weight:700;color:var(--fontColor,#111827);}
.hub-strip .v{color:#dc2626;font-weight:700;}
.hub-strip .m{color:var(--fontColor3,#9ca3af);}
.hub-strip a{margin-left:auto;color:var(--fontColor2,#4b5563);text-decoration:none;font-weight:600;}
.hub-strip a:hover{color:var(--mainColorBlue,#3DA5F4);}

.hub-goods{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;}
.hub-good{display:flex;flex-direction:column;background:var(--contBg,#fff);border:1px solid var(--borderColor,#e5e7eb);border-radius:14px;padding:20px;transition:border-color .15s,box-shadow .15s;}
.hub-good:hover{border-color:var(--mainColorBlue,#3DA5F4);box-shadow:0 6px 20px rgba(15,23,42,.06);}
.hg-top{display:flex;align-items:center;gap:8px;}
.hg-top h2{font-size:17px;font-weight:800;margin:0;}
.hg-badge{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:rgba(61,165,244,.12);color:var(--mainColorBlue,#3DA5F4);}
.hg-desc{font-size:13.5px;color:var(--fontColor2,#4b5563);line-height:1.55;margin:8px 0 14px;min-height:42px;}
.hg-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 16px;}
.hg-stats div{background:var(--btnBgColor,#f3f5f8);border-radius:10px;padding:9px 12px;}
.hg-stats dt{font-size:11.5px;color:var(--fontColor3,#9ca3af);margin:0;}
.hg-stats dd{font-size:15px;font-weight:700;margin:2px 0 0;font-variant-numeric:tabular-nums;}
.hg-foot{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;}
.hg-price s{display:block;font-size:12px;color:var(--fontColor3,#9ca3af);}
.hg-price strong{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;}
.hg-price span{font-size:13px;color:var(--fontColor2,#6b7280);margin-left:1px;}
.hg-price em{display:inline-block;margin-top:4px;font-style:normal;font-size:11.5px;font-weight:600;color:#ea580c;}

/* 광고할 캠페인이 정해져 넘어온 경우 */
.ad-selected-campaign{background:var(--contBg,#fff);border:1px solid var(--mainColorBlue,#3DA5F4);border-radius:14px;padding:14px 16px;margin-bottom:18px;}
.ad-selected-campaign .asc-header{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--mainColorBlue,#3DA5F4);margin-bottom:10px;}
.ad-selected-campaign .asc-close{margin-left:auto;color:var(--fontColor3,#9ca3af);}
.ad-selected-campaign .asc-body{display:flex;gap:12px;align-items:center;}
.ad-selected-campaign .asc-thumb{width:52px;height:52px;border-radius:8px;overflow:hidden;flex:none;background:var(--inputBg,#f1f5f9);display:flex;align-items:center;justify-content:center;}
.ad-selected-campaign .asc-thumb img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.ad-selected-campaign .asc-placeholder{font-size:10px;color:var(--fontColor3,#9ca3af);}
.ad-selected-campaign .asc-meta{display:flex;gap:6px;font-size:12px;color:var(--fontColor3,#9ca3af);}
.ad-selected-campaign .asc-badge{font-weight:700;color:var(--fontColor2,#4b5563);}
.ad-selected-campaign .asc-title{font-size:15px;font-weight:700;margin-top:2px;}
.ad-selected-campaign .asc-period{font-size:12px;color:var(--fontColor3,#9ca3af);margin-top:2px;}

/* ── 등록 대행 ── */
.rg-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start;}
.rg-field{margin-bottom:18px;}
.rg-field label{display:block;font-size:14px;font-weight:700;margin-bottom:7px;}
.rg-req{margin-left:5px;font-size:11px;font-weight:700;color:#dc2626;}
.rg-field input,.rg-field textarea{width:100%;padding:12px 14px;border:1px solid var(--borderColor,#d1d5db);border-radius:10px;background:var(--inputBg,#fff);color:inherit;font-size:15px;}
.rg-field textarea{resize:vertical;line-height:1.6;}
.rg-field input:focus,.rg-field textarea:focus{outline:none;border-color:var(--mainColorBlue,#3DA5F4);box-shadow:0 0 0 3px rgba(61,165,244,.15);}
.rg-field .xl{padding:15px 16px;font-size:17px;font-weight:600;}
.rg-hint{margin:7px 0 0;font-size:12.5px;color:var(--fontColor3,#9ca3af);line-height:1.6;}
.rg-optional{margin:0 0 20px;border:1px solid var(--borderColor,#e5e7eb);border-radius:10px;}
.rg-optional summary{display:flex;align-items:center;gap:8px;padding:12px 14px;cursor:pointer;font-size:14px;color:var(--fontColor2,#4b5563);list-style:none;}
.rg-optional summary::-webkit-details-marker{display:none;}
.rg-optional summary i{margin-left:auto;font-size:11px;transition:transform .15s;}
.rg-optional[open] summary i{transform:rotate(180deg);}
.rg-optional .body{padding:4px 14px 2px;}
.rg-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.rg-submit{width:100%;padding:16px;font-size:16px;}
.rg-submit:disabled{opacity:.6;cursor:default;}
.rg-price{display:flex;align-items:baseline;gap:6px;margin-bottom:14px;}
.rg-price strong{font-size:28px;font-weight:800;color:var(--mainColorBlue,#3DA5F4);font-variant-numeric:tabular-nums;}
.rg-price span{font-size:13px;color:var(--fontColor2,#6b7280);}
.rg-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:13.5px;}
.rg-checks i{color:var(--mainColorBlue,#3DA5F4);width:16px;}
.rg-side{display:flex;flex-direction:column;gap:14px;}
.rg-stat h3{font-size:13px;font-weight:600;color:var(--fontColor2,#6b7280);margin:0 0 10px;}
.rg-stat dl{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0;text-align:center;}
.rg-stat dt{font-size:11.5px;color:var(--fontColor3,#9ca3af);}
.rg-stat dd{margin:2px 0 0;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;}
.rg-mail{font-size:12.5px;color:var(--fontColor3,#9ca3af);line-height:1.6;margin:0;}
.rg-mail a{color:var(--mainColorBlue,#3DA5F4);font-weight:600;}
.rg-guard{display:flex;gap:10px;font-size:14px;}
.rg-guard a{color:var(--mainColorBlue,#3DA5F4);font-weight:600;}

.hub-faq{margin-top:28px;border-top:1px solid var(--borderColor,#e5e7eb);}
.hub-faq h2{font-size:16px;font-weight:700;margin:22px 0 6px;}
.hub-faq details{border-bottom:1px solid var(--borderColor,#eef0f3);}
.hub-faq summary{display:flex;align-items:center;gap:8px;padding:14px 2px;cursor:pointer;font-size:14.5px;font-weight:600;list-style:none;}
.hub-faq summary::-webkit-details-marker{display:none;}
.hub-faq summary i{margin-left:auto;font-size:11px;color:var(--fontColor3,#9ca3af);transition:transform .15s;}
.hub-faq details[open] summary i{transform:rotate(180deg);}
.hub-faq p{margin:0 2px 14px;font-size:14px;color:var(--fontColor2,#6b7280);line-height:1.7;}
.hub-faq a{color:var(--mainColorBlue,#3DA5F4);font-weight:600;}

@media (max-width: 860px){
  .rg-layout{grid-template-columns:1fr;}
  .hub-title-row h1{font-size:22px;}
  .rg-grid{grid-template-columns:1fr;}
}

/* ── 광고 신청(apply.php): 왼쪽 입력 + 오른쪽 신청 목록 ── */
.ap-wrap{width:100% !important;max-width:none !important;padding:0 !important;margin:0 !important;}
.ap-layout{display:grid !important;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start;}
.ap-main{min-width:0;}
.ap-main .adapply-section{margin-top:0;}
.ap-side{position:relative;}
.ap-sticky{position:sticky;top:16px;display:flex;flex-direction:column;gap:12px;}
.ap-box{background:var(--contBg,#fff);border:1px solid var(--borderColor,#e5e7eb);border-radius:14px;padding:16px;}
.ap-box-head{font-size:14px;font-weight:700;margin-bottom:10px;color:var(--fontColor,#111827);}
.ap-box-head b{color:var(--mainColorBlue,#3DA5F4);}
.ap-cart{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto;}
.ap-cart li{position:relative;padding:9px 30px 9px 11px;border-radius:10px;background:var(--btnBgColor,#f3f5f8);}
.ap-cart .t{font-size:13px;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--fontColor2,#4b5563);}
.ap-cart .t b{color:var(--fontColor,#111827);margin-right:2px;}
.ap-cart .m{font-size:12px;color:var(--fontColor3,#9ca3af);margin-top:2px;font-variant-numeric:tabular-nums;}
.ap-del{position:absolute;top:6px;right:6px;width:22px;height:22px;border:0;border-radius:6px;background:transparent;color:var(--fontColor3,#9ca3af);font-size:16px;line-height:1;cursor:pointer;}
.ap-del:hover{background:var(--contBg,#fff);color:#dc2626;}
.ap-empty{margin:0;font-size:12.5px;color:var(--fontColor3,#9ca3af);}
.ap-now .summary-card{margin:0 0 12px;}
.ap-add{width:100%;padding:11px;border-radius:10px;border:1px solid var(--mainColorBlue,#3DA5F4);background:var(--contBg,#fff);color:var(--mainColorBlue,#3DA5F4);font-size:14px;font-weight:700;cursor:pointer;}
.ap-add:disabled{border-color:var(--borderColor,#d1d5db);color:var(--fontColor3,#9ca3af);cursor:default;}
.ap-added{margin:8px 0 0;font-size:12.5px;color:#16a34a;line-height:1.5;}
.ap-goods{display:flex;flex-wrap:wrap;gap:6px;}
.ap-good{padding:6px 11px;border-radius:999px;border:1px solid var(--borderColor,#d1d5db);font-size:13px;font-weight:600;color:var(--fontColor,#111827);text-decoration:none;}
.ap-good:hover{border-color:var(--mainColorBlue,#3DA5F4);color:var(--mainColorBlue,#3DA5F4);}
.ap-small{margin:8px 0 0;font-size:12px;color:var(--fontColor3,#9ca3af);line-height:1.5;}
.ap-side .adapply-section{margin:0;padding:0;border:0;}
.ap-side .apply-grid{display:block;}
.ap-side .lbl{display:none;}
.ap-side .help{font-size:12px;color:var(--fontColor3,#9ca3af);margin-top:6px;}
.ap-terms{margin-bottom:10px;}
.ap-terms summary{cursor:pointer;font-size:13px;color:var(--fontColor2,#4b5563);}
.ap-terms ul{margin:8px 0 0;padding-left:16px;font-size:12.5px;color:var(--fontColor3,#9ca3af);line-height:1.6;}
.ap-final .agree{display:flex;gap:6px;align-items:flex-start;font-size:13px;margin-bottom:10px;}
.ap-bulk,.ap-pay{width:100%;padding:13px;font-size:15px;}
.ap-bulk + .ap-pay{margin-top:8px;}
.ap-pay.is-sub{background:transparent;color:var(--fontColor2,#4b5563) !important;border:1px solid var(--borderColor,#d1d5db);font-size:13.5px;padding:10px;}
.ap-pay:disabled,.ap-bulk:disabled{opacity:.5;cursor:default;}
@media (max-width: 960px){
  .ap-layout{grid-template-columns:1fr;}
  .ap-sticky{position:static;}
}
/* 신청 목록 체크 · 확인창 */
.ap-head-sub{font-size:11.5px;font-weight:500;color:var(--fontColor3,#9ca3af);margin-left:4px;}
.ap-cart li{padding-left:36px;}
.ap-chk{position:absolute;left:10px;top:11px;margin:0;cursor:pointer;}
.ap-chk input{width:16px;height:16px;margin:0;cursor:pointer;accent-color:var(--mainColorBlue,#3DA5F4);}
/* 광고 상품 신청·신청서 화면은 1300px 로 넓게: 왼쪽 작성 칸에 여유, 장바구니는 오른쪽 끝 */
.hub-page.hub-wide{max-width:1300px;}
.hub-wide .ap-layout{grid-template-columns:minmax(0,1fr) 360px;gap:28px;}
.hub-wide .hub-goods{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));}
/* 장바구니에 담기가 기본 동작 */
.ap-add{background:var(--mainColorBlue,#3DA5F4);border-color:var(--mainColorBlue,#3DA5F4);color:#fff;padding:13px;font-size:15px;}
.ap-add:disabled{background:var(--btnBgColor,#eef1f5);color:var(--fontColor3,#9ca3af);}
.cp-sum{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;font-size:13.5px;color:var(--fontColor2,#4b5563);}
.cp-sum b{font-size:18px;font-weight:800;color:var(--fontColor,#111827);font-variant-numeric:tabular-nums;}
.cp-coupon{width:100%;margin-bottom:10px;}
.agree.need{color:#dc2626;}
@media (max-width: 960px){ .hub-wide .ap-layout{grid-template-columns:1fr;} }
/* 광고 상품 목록: 오른쪽 장바구니와 나란히 — 카드 대신 한 줄씩 비교하는 목록 */
.hub-goods.as-list{display:flex;flex-direction:column;gap:10px;}
.as-list .hub-good{display:grid;grid-template-columns:minmax(0,1fr) 230px 270px;grid-template-areas:"top stats foot" "desc stats foot";column-gap:22px;row-gap:2px;align-items:center;padding:16px 20px;}
.as-list .hg-top{grid-area:top;}
.as-list .hg-desc{grid-area:desc;margin:0;min-height:0;}
.as-list .hg-stats{grid-area:stats;margin:0;}
.as-list .hg-foot{grid-area:foot;margin:0;align-items:center;}
.as-list .hg-price{text-align:right;flex:1;}
.as-list .hg-price em{display:block;}
@media (max-width: 1100px){
  .as-list .hub-good{grid-template-columns:minmax(0,1fr) 250px;grid-template-areas:"top foot" "desc foot" "stats stats";row-gap:10px;}
}
@media (max-width: 600px){
  .as-list .hub-good{grid-template-columns:1fr;grid-template-areas:"top" "desc" "stats" "foot";}
  .as-list .hg-price{text-align:left;}
}
.ap-box[hidden],.ap-empty[hidden],.ap-added[hidden]{display:none !important;}
/* 신청 화면 오른쪽: 1 이 광고 → 2 더 담기 → 3 장바구니에서 신청 */
.ap-step{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--mainColorBlue,#3DA5F4);color:#fff;font-size:11.5px;font-weight:800;margin-right:7px;vertical-align:1px;}
.ap-now .cta-disabled-hint{margin:0 0 10px;}
.ap-final .ap-cart{margin-bottom:12px;}
.ap-wait{margin:0;font-size:12.5px;line-height:1.6;color:var(--fontColor3,#9ca3af);padding:10px 12px;border-radius:10px;background:var(--btnBgColor,#f3f5f8);}
.ap-wait a{display:inline-block;margin-top:4px;font-weight:600;color:var(--fontColor2,#4b5563);}
.ap-wait[hidden],#apCheckout[hidden]{display:none !important;}

/* ? 도움말 — 마우스를 올리거나 누르면 한 줄 설명 */
.ap-q{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;margin-left:4px;border-radius:50%;border:1px solid var(--borderColor,#d1d5db);background:transparent;color:var(--fontColor3,#9ca3af);font-size:10.5px;font-weight:800;line-height:1;cursor:help;vertical-align:1px;}
.ap-q:hover,.ap-q:focus{border-color:var(--mainColorBlue,#3DA5F4);color:var(--mainColorBlue,#3DA5F4);outline:none;}
.ap-q::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:max-content;max-width:240px;padding:8px 10px;border-radius:8px;background:#1f2937;color:#fff;font-size:12px;font-weight:500;line-height:1.5;text-align:left;white-space:normal;box-shadow:0 6px 18px rgba(0,0,0,.18);opacity:0;visibility:hidden;transition:opacity .15s;z-index:50;pointer-events:none;}
.ap-q:hover::after,.ap-q:focus::after{opacity:1;visibility:visible;}
.ap-side .ap-q::after{left:auto;right:-8px;transform:none;}

/* 상품 바꿔 끼우기(ajax) */
.hub-page.ap-loading .ap-main,.hub-page.ap-loading .ap-now{opacity:.4;pointer-events:none;transition:opacity .2s;}
.hub-page.ap-enter .ap-main,.hub-page.ap-enter .ap-now{animation:apIn .28s ease-out;}
@keyframes apIn{from{opacity:.3;transform:translateY(6px);}to{opacity:1;transform:none;}}
.ap-good.is-loading{pointer-events:none;color:var(--mainColorBlue,#3DA5F4);border-color:var(--mainColorBlue,#3DA5F4);}
.ap-good.is-loading::after{content:"";display:inline-block;width:11px;height:11px;margin-left:6px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-1px;animation:apSpin .6s linear infinite;}
@keyframes apSpin{to{transform:rotate(360deg);}}