/*! ALB PDF Viewer 1.6.2 */
.albpv{--albpv-bg:#eef1f4;--albpv-ink:#1c2430;--albpv-accent:#0b8f8a;--albpv-line:#d8dee6;
  margin:1.5em 0;min-width:0;max-width:100%}
/* 読み込み前のプレースホルダ。ビューアと同じ高さを確保して、
   後から中身が入ってもレイアウトが飛ばないようにする。
   これがないと、2つ目のビューアが最初から画面内に入ってしまい同時に読み込みが走る。 */
.albpv__fallback{display:grid;place-items:center;text-align:center;
  aspect-ratio:var(--albpv-ratio,16/9);padding:16px;margin:0;
  background:var(--albpv-bg);border:1px solid var(--albpv-line);border-radius:8px;
  font-size:14px;color:#5b6773}
.albpv__admin-notice{font-size:14px;color:#a4402a;border:1px dashed #a4402a;padding:8px 12px;border-radius:4px}

.albpv__viewer{display:flex;flex-direction:column;gap:8px;min-width:0;max-width:100%}

.albpv__stage{position:relative;width:100%;min-width:0;background:var(--albpv-bg);
  border:1px solid var(--albpv-line);border-radius:8px;overflow:hidden;
  aspect-ratio:var(--albpv-ratio,16/9);touch-action:pan-y;-webkit-user-select:none;user-select:none}
.albpv__frame{position:absolute;inset:0;display:grid;place-items:center}
.albpv__page{max-width:100%;max-height:100%;width:auto;height:auto;display:block}

.albpv__spinner{position:absolute;top:50%;left:50%;width:28px;height:28px;margin:-14px 0 0 -14px;
  border:3px solid rgba(28,36,48,.18);border-top-color:var(--albpv-accent);border-radius:50%;
  opacity:0;pointer-events:none;transition:opacity .15s;z-index:1}
.albpv__spinner.is-on{opacity:1;animation:albpv-spin .8s linear infinite}
@keyframes albpv-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.albpv__spinner.is-on{animation:none}}

/* スナックバー（自動送りの開始・停止の通知）。ステージ内なので全画面でも出る */
.albpv__snack{position:absolute;left:50%;bottom:14px;transform:translate(-50%,8px);
  max-width:calc(100% - 32px);padding:9px 16px;border-radius:20px;
  background:rgba(18,24,32,.88);color:#fff;font-size:13px;font-weight:700;line-height:1.4;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  opacity:0;pointer-events:none;z-index:3;
  transition:opacity .2s ease,transform .2s ease}
.albpv__snack.is-on{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){.albpv__snack{transition:none}}

.albpv__nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;
  border-radius:50%;background:rgba(255,255,255,.9);color:var(--albpv-ink);cursor:pointer;
  display:grid;place-items:center;padding:0;box-shadow:0 1px 6px rgba(0,0,0,.28);
  transition:background .15s;z-index:2}
.albpv__nav:hover{background:#fff}
.albpv__nav--prev{left:10px}
.albpv__nav--next{right:10px}
.albpv__nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.4;
  stroke-linecap:round;stroke-linejoin:round}

/* 操作バーはステージの外側。スライドの内容を隠さない */
.albpv__bar{display:flex;align-items:center;gap:6px;min-width:0}
.albpv__counter{font-size:13px;font-weight:700;color:var(--albpv-ink);
  font-variant-numeric:tabular-nums;margin-right:auto;white-space:nowrap}
.albpv__counter b{font-size:15px}
.albpv__tool{width:32px;height:32px;border:1px solid var(--albpv-line);border-radius:6px;
  background:#fff;color:var(--albpv-ink);cursor:pointer;display:grid;place-items:center;padding:0;
  transition:background .15s,border-color .15s}
.albpv__tool:hover{background:#f2f5f7;border-color:#b9c3cd}
.albpv__tool svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.albpv__tool svg.albpv-fill{fill:currentColor;stroke:none}

/* 自動再生はアイコンだけだとページ送りボタンと見分けがつかないので、文字を出す */
.albpv__play{width:auto;min-width:0;display:inline-flex;align-items:center;gap:7px;
  padding:0 12px;font:inherit;font-size:13px;font-weight:700;line-height:1;white-space:nowrap}
.albpv__play svg{width:13px;height:13px}
.albpv__play.is-playing{background:#eef6f5;border-color:#9ecfcb}
.albpv__play-label{display:inline-block}

.albpv__track{height:3px;background:var(--albpv-line);border-radius:2px;overflow:hidden}
.albpv__track span{display:block;height:100%;width:0;background:var(--albpv-accent);
  transition:width .2s linear}

/* サムネイル帯は絶対配置。親グリッドの幅計算に関与させない */
.albpv__rail{position:relative;height:66px;min-width:0}
.albpv__thumbs{position:absolute;inset:0;display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;
  padding:2px 0 8px;scrollbar-width:thin}
.albpv__thumb{flex:0 0 auto;width:88px;padding:0;border:2px solid transparent;border-radius:4px;
  background:none;cursor:pointer;line-height:0;opacity:.55;
  transition:opacity .15s,border-color .15s}
.albpv__thumb canvas{width:100%;height:auto;display:block;border-radius:2px;
  background:#fff;box-shadow:0 0 0 1px var(--albpv-line) inset}
.albpv__thumb:hover{opacity:.85}
.albpv__thumb.is-current{opacity:1;border-color:var(--albpv-accent)}

.albpv__foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font-size:12px;
  color:#666;margin:6px 0 0}
.albpv__foot .albpv-keys{flex:0 1 auto}

/* ダウンロードボタン。
   テーマ側の `section#article.article main div.article__content a` が
   色・太さ・下線を id 込みの高い詳細度で指定してくるため、そこだけ !important で上書きする。 */
.albpv__dl{margin-left:auto;display:inline-flex;align-items:center;gap:9px;
  padding:13px 22px;border-radius:8px;border:0;
  background:var(--albpv-accent);box-shadow:0 1px 3px rgba(0,0,0,.18);
  font-size:15px;line-height:1.2;
  color:#fff!important;font-weight:700!important;text-decoration:none!important;
  transition:background .15s,box-shadow .15s,transform .05s}
.albpv__dl:hover{background:#0a7d78;box-shadow:0 2px 8px rgba(0,0,0,.24)}
.albpv__dl:active{transform:translateY(1px)}
.albpv__dl svg{width:19px;height:19px;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.albpv__dl small{font-size:13px;font-weight:400;opacity:.85}

.albpv :focus-visible{outline:2px solid var(--albpv-accent);outline-offset:2px}

/* ===== プレゼンテーションモード =====
   Zoomで画面共有しながら説明するための表示。
   ・全画面APIは使わない。ブラウザのウィンドウ内で最大化するだけ。
     共有中にタブを切り替えたりチャットを見たりできるようにするため。
   ・サムネイルは左。横長の画面で下に置くと縦の予算を約190px奪われ、
     スライドの実寸が面積で2割ほど小さくなる。
   入り方は ?present=<添付ID> か、ビューアにフォーカスして P キー。 */
html.albpv-present-open{overflow:hidden}
/* ログイン中はWordPressの管理バー(z-index:99999)が画面上端にかぶる。
   商談中に見せるものではないので、プレゼン中だけ隠す。 */
html.albpv-present-open #wpadminbar{display:none}
html.albpv-present-open.albpv-present-open{margin-top:0!important}
.albpv.is-present{position:fixed;inset:0;z-index:99999;margin:0;max-width:none;
  background:#0d1219;padding:12px;box-sizing:border-box}
.albpv.is-present .albpv__viewer{height:100%;gap:0;display:grid;
  grid-template-columns:158px 1fr;
  grid-template-rows:1fr 3px auto;
  grid-template-areas:"rail stage" "rail track" "rail bar";
  column-gap:12px}

.albpv.is-present .albpv__rail{grid-area:rail;height:auto;min-height:0}
.albpv.is-present .albpv__thumbs{flex-direction:column;gap:8px;
  overflow-x:hidden;overflow-y:auto;padding:0 6px 0 0;
  scrollbar-color:#3a4654 transparent}
.albpv.is-present .albpv__thumb{width:100%;opacity:.5}
.albpv.is-present .albpv__thumb:hover{opacity:.85}
.albpv.is-present .albpv__thumb.is-current{opacity:1}

.albpv.is-present .albpv__stage{grid-area:stage;aspect-ratio:auto;height:auto;min-height:0;
  border-color:#2a3440;background:#111820}
.albpv.is-present .albpv__track{grid-area:track;align-self:center;margin-top:6px}
.albpv.is-present .albpv__bar{grid-area:bar;padding-top:10px}
.albpv.is-present .albpv__counter{color:#fff}
.albpv.is-present .albpv__foot{display:none}
/* プレゼン中は全画面ボタンを出さない。すでにウィンドウいっぱいで、
   全画面用のレイアウト規則とぶつかるため */
.albpv.is-present .albpv__fs{display:none}

.albpv__exit{display:none}
.albpv.is-present .albpv__exit{width:auto;display:inline-flex;align-items:center;gap:7px;
  padding:0 12px;font:inherit;font-size:13px;font-weight:700;line-height:1;white-space:nowrap}
.albpv.is-present .albpv__exit svg{width:13px;height:13px}

@media screen and (max-width:700px){
  .albpv.is-present .albpv__viewer{grid-template-columns:104px 1fr;column-gap:8px}
  .albpv.is-present{padding:8px}
}

/* 全画面 */
.albpv__viewer:fullscreen{background:#0d1219;padding:14px 16px;gap:8px;
  width:100%;height:100%;box-sizing:border-box}
/* 幅ではなく「残りの高さ」でステージを決める。
   aspect-ratio を外し、中のcanvasが max-width/max-height で収まるようにする。
   こうしないと横幅いっぱいに広がってスライドの下が画面外に出る。 */
.albpv__viewer:fullscreen .albpv__stage{flex:1 1 auto;min-height:0;height:auto;
  aspect-ratio:auto;border-color:#2a3440;background:#111820}
.albpv__viewer:fullscreen .albpv__counter{color:#fff}
.albpv__viewer:fullscreen .albpv__foot{color:#9aa7b4;margin:0}
.albpv__viewer:fullscreen .albpv__rail{height:78px;flex:0 0 auto}
.albpv__viewer:fullscreen .albpv__thumb{width:104px}
.albpv__viewer:fullscreen .albpv__track,
.albpv__viewer:fullscreen .albpv__bar{flex:0 0 auto}
/* 全画面ではダウンロードボタンを出さない（見る場面なので邪魔になる） */
.albpv__viewer:fullscreen .albpv__dl{display:none}

@media screen and (max-width:600px){
  .albpv__nav{width:34px;height:34px}
  .albpv__nav--prev{left:6px}
  .albpv__nav--next{right:6px}
  .albpv__rail{height:52px}
  .albpv__thumb{width:66px}
  .albpv__foot .albpv-keys{display:none}
  .albpv__play{padding:0 9px;gap:5px;font-size:12px}
  /* スマホでは押しやすいよう横幅いっぱいに */
  .albpv__dl{margin-left:0;width:100%;justify-content:center;padding:15px 20px;font-size:16px}
}