/* [2026-09-26] 무료 플랜 광고 — 책 아래 배너 줄(.co-ads)·우측 상단 자사 탭(.co-promo). 마크업은 partials/co_ads.php.
   company_a·b 공통(색은 각 스킨의 --co-* 변수). 광고가 없는 페이지에는 이 파일 자체가 로드되지 않는다. */

/* 우측 상단 "이북 바나나" 탭 — 레퍼런스(web.eco7.net/007-guide) "견적문의 바로가기" 탭 형태. 로고가 남색이라
   다크 테마에서도 흰 바탕을 유지한다. */
.onebuild-flipbook-container .co-promo { position:absolute; top:0; right:clamp(16px,3.2vw,52px); z-index:40; display:inline-flex; align-items:center; gap:8px; height:36px; padding:0 12px 0 10px; border:1px solid rgba(15,35,70,.12); border-top:0; border-radius:0 0 10px 10px; background:#fff; color:#0f2346; box-shadow:0 6px 16px rgba(15,35,70,.14); font-size:13px; font-weight:700; letter-spacing:-.01em; line-height:1; text-decoration:none; white-space:nowrap; transition:box-shadow .18s ease; }
.onebuild-flipbook-container .co-promo img { display:block; width:auto; height:22px; }
.onebuild-flipbook-container .co-promo svg { flex:none; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.onebuild-flipbook-container .co-promo:hover { box-shadow:0 8px 22px rgba(15,35,70,.24); }
.onebuild-flipbook-container .co-promo:focus-visible { outline:3px solid var(--co-focus, #1E6FD9); outline-offset:2px; }
/* 탭이 책 윗부분을 가리지 않게 윗 여백을 탭 높이만큼 확보 */
.onebuild-flipbook-container.co-has-promo:not(.co-ads-off) .co-shell { padding-top:max(clamp(22px,3.2vw,52px), 48px); }

/* 책 아래 배너 줄. 줄 높이는 화면 높이로만 정해 고정한다 — 배너 크기가 책 크기를 따라 바뀌어도 줄 높이가 변하지 않아야
   StPageFlip이 무대 크기를 다시 재는 순환이 생기지 않는다(§8-9·§8-12와 같은 원리). 배너 폭은 company-ads.js가 책 실제 폭에 맞춘다. */
.onebuild-flipbook-container .co-ads { min-width:0; }
.onebuild-flipbook-container .co-ads-row { display:flex; justify-content:center; align-items:center; gap:12px; width:100%; height:100%; max-width:var(--co-book-w, 100%); margin:0 auto; overflow:hidden; }
.onebuild-flipbook-container .co-ad { position:relative; display:block; flex:0 1 auto; width:var(--co-ad-w, calc((100% - 12px) / var(--co-ad-n, 1))); height:var(--co-ad-h, auto); aspect-ratio:4 / 1; border-radius:8px; overflow:hidden; box-shadow:0 6px 16px var(--co-book-shadow, rgba(0,0,0,.18)); }
.onebuild-flipbook-container .co-ad img { display:block; width:100%; height:100%; object-fit:cover; }
.onebuild-flipbook-container .co-ad-label { position:absolute; top:6px; right:6px; padding:2px 6px; border-radius:4px; background:rgba(0,0,0,.55); color:#fff; font-size:10.5px; font-weight:700; line-height:1.3; pointer-events:none; }
.onebuild-flipbook-container .co-ad:focus-visible { outline:3px solid var(--co-focus, #1E6FD9); outline-offset:2px; }

/* 데스크톱(세로 여유 있음): 그리드에 광고 줄 행을 추가 — 무대 아래에 광고 줄.
   [2026-09-26 #40] 패널이 이제 책 틀 안으로 들어가 co-shell의 독립 그리드 칸이 아니게 됐다(engine-turn.js) —
   co-shell은 1칸(company_a.css)이라 stage/ads도 grid-column:1 하나뿐이다.
   책 크기는 engine-turn.js가 무대(co-stage)의 실제 clientHeight를 기준으로 직접 계산하므로(getAutoZoomBook),
   광고 줄이 무대 높이를 줄여도 그 다음 relayout()에서 자동 반영된다 — 별도 container-query 폭 제한이 필요 없다. */
@media (min-width:768px) and (min-height:641px) {
  .onebuild-flipbook-container.co-has-ads:not(.co-ads-off) .co-shell { grid-template-rows:minmax(0,1fr) clamp(48px,11vh,110px); row-gap:clamp(10px,1.6vh,18px); }
  .onebuild-flipbook-container.co-has-ads:not(.co-ads-off) .co-stage { grid-column:1; grid-row:1; }
  .onebuild-flipbook-container.co-has-ads:not(.co-ads-off) .co-ads { grid-column:1; grid-row:2; height:100%; }
}

/* 극단적으로 짧은 가로(가로로 돌린 폰, §8-9·§8-10 구간): 책만으로도 공간이 모자라 배너는 숨기고 탭만 작게 */
@media (min-width:768px) and (max-height:640px) {
  .onebuild-flipbook-container .co-ads { display:none; }
  .onebuild-flipbook-container .co-promo { height:28px; font-size:12px; }
  .onebuild-flipbook-container .co-promo img { height:17px; }
  .onebuild-flipbook-container.co-has-promo:not(.co-ads-off) .co-shell { padding-top:34px; }
}

/* 모바일 세로: 책 바로 아래(패널보다 위)에 책과 같은 폭으로 배너를 위아래로 쌓는다(한 줄 두 개면 글자가 안 읽힘) */
@media (max-width:767px) {
  .onebuild-flipbook-container .co-ads { order:-1; flex:0 0 auto; width:90vw; max-width:420px; }
  .onebuild-flipbook-container .co-ads-row { flex-direction:column; gap:10px; max-width:none; height:auto; overflow:visible; }
  .onebuild-flipbook-container .co-ad { width:100%; height:auto; }
  .onebuild-flipbook-container.co-has-promo:not(.co-ads-off) .co-shell { padding-top:50px; }
  .onebuild-flipbook-container .co-promo { right:5vw; }
}

/* iframe(관리자 미리보기·외부 임베드) 안에서는 광고·탭을 끈다 — partials/co_ads.php의 인라인 스크립트가 클래스를 붙인다 */
.onebuild-flipbook-container.co-ads-off .co-ads, .onebuild-flipbook-container.co-ads-off .co-promo { display:none !important; }