/* QujiraSEO サービス資料（Web版）共通スタイル。3プランのデッキで共有 */
:root{
  --ink:#101a2e; --soft:#4a5568; --mute:#7b8494;
  --primary:#2438c2; --blue:#066df3; --green:#0f9d6a;
  --bg:#f5f7fc; --line:#e1e7f5; --pale:#eef1fc;
  --jp:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  --en:"Manrope",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:#e7eaf2;font-family:var(--jp);color:var(--ink);-webkit-font-smoothing:antialiased}

/* ===== デッキ外枠 ===== */
.deck{max-width:1180px;margin:0 auto;padding:28px 16px 80px}
.bar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 4px 20px;flex-wrap:wrap;
}
.bar .brand{display:flex;align-items:center;gap:10px}
.bar .brand img{height:30px;width:auto;display:block}
.bar .acts{display:flex;gap:10px;flex-wrap:wrap}
.bar a.btn{
  font-size:13px;font-weight:700;text-decoration:none;border-radius:6px;
  padding:10px 18px;background:var(--primary);color:#fff;transition:opacity .2s;
}
.bar a.btn.ghost{background:#fff;color:var(--primary);border:1.5px solid var(--primary)}
.bar a.btn:hover{opacity:.86}

/* ===== スライド ===== */
.slide{
  position:relative;width:100%;aspect-ratio:16/9;background:#fff;
  border-radius:10px;overflow:hidden;margin-bottom:22px;
  box-shadow:0 6px 24px rgba(16,26,46,.10);
  container-type:inline-size;
}
.slide.alt{background:var(--bg)}
/* 全ての内部寸法をコンテナ幅基準(cqw)にして、どの画面幅でも比率が保たれるようにする */
.pad{position:absolute;inset:0;padding:5.2cqw 6.2cqw;display:flex;flex-direction:column;justify-content:center}
.pad>img{align-self:flex-start}
.eyebrow{font-family:var(--en);font-weight:800;font-size:1.15cqw;letter-spacing:.16em;color:var(--primary)}
h2.t{font-size:3.0cqw;font-weight:700;line-height:1.42;margin-top:.7cqw;letter-spacing:-.01em}
h2.big{font-size:3.5cqw;font-weight:700;line-height:1.4;letter-spacing:-.02em}
.lead{font-size:1.35cqw;color:var(--soft);line-height:1.85;margin-top:1.6cqw}
.hl{color:var(--primary)}
.hl-g{color:var(--green)}
.ill{position:absolute;right:5.4cqw;pointer-events:none}
.ill img{width:100%;height:auto;display:block}
.foot{position:absolute;left:6.2cqw;right:6.2cqw;bottom:2.6cqw;display:flex;justify-content:space-between;
  font-family:var(--en);font-weight:700;font-size:.95cqw;color:var(--mute)}

/* カード類 */
.cards{display:grid;gap:1.5cqw;margin-top:2.6cqw}
.c3{grid-template-columns:repeat(3,1fr)}
.c2{grid-template-columns:repeat(2,1fr)}
.c4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:.75cqw;padding:2.1cqw}
.slide:not(.alt) .card{background:var(--bg);border-color:transparent}
.card h3{font-size:1.55cqw;line-height:1.5;font-weight:700}
.card p{font-size:1.05cqw;color:var(--soft);line-height:1.7;margin-top:.8cqw}
.card .ic{height:6.5cqw;display:flex;align-items:center;justify-content:center;margin-bottom:1.2cqw}
.card .ic img{max-height:6.5cqw;max-width:70%;width:auto}

.rowlist{display:flex;flex-direction:column;gap:.9cqw;margin-top:2.4cqw}
.row{background:var(--bg);border-radius:.7cqw;padding:1.35cqw 1.9cqw;display:flex;gap:1.5cqw;align-items:flex-start}
.slide.alt .row{background:#fff;border:1px solid var(--line)}
.row .n{font-family:var(--en);font-weight:800;font-size:1.5cqw;color:var(--primary);flex:0 0 auto;line-height:1.5}
.row .tx h4{font-size:1.35cqw;font-weight:700}
.row .tx p{font-size:1.02cqw;color:var(--soft);line-height:1.65;margin-top:.35cqw}

.stats{display:flex;gap:1.4cqw;margin-top:2.4cqw}
.stat{background:var(--bg);border-radius:.7cqw;padding:1.5cqw 1.8cqw;min-width:11cqw}
.slide.alt .stat{background:#fff}
.stat .num{font-family:var(--en);font-weight:800;font-size:2.7cqw;color:var(--primary);line-height:1.1}
.stat .lb{font-size:1.0cqw;color:var(--mute);margin-top:.4cqw}

.metric{background:var(--bg);border-radius:.7cqw;padding:1.6cqw 2.1cqw;margin-top:2.2cqw;
  display:flex;align-items:center;gap:1.6cqw;flex-wrap:wrap}
.metric .bf{font-size:1.15cqw;color:var(--mute)}
.metric .ar{font-family:var(--en);font-weight:800;font-size:1.8cqw;color:var(--green)}
.metric .af{font-family:var(--en);font-weight:800;font-size:3.0cqw;color:var(--green);line-height:1}
.metric .un{font-size:1.15cqw;font-weight:700;color:var(--green)}

.tag{display:inline-block;background:var(--pale);color:var(--primary);border-radius:2cqw;
  padding:.5cqw 1.4cqw;font-size:1.0cqw;font-weight:700}
.tag.g{background:#e8f7f0;color:var(--green)}

table.cases{width:100%;border-collapse:collapse;margin-top:2.2cqw;font-size:1.08cqw}
table.cases td{padding:.82cqw 1.2cqw;border-bottom:1px solid var(--line)}
table.cases td:first-child{font-weight:700}
table.cases td:last-child{color:var(--green);font-weight:700;text-align:right}

.plan{background:#fff;border:1px solid var(--line);border-radius:.75cqw;overflow:hidden;
  display:flex;flex-direction:column}
.plan .top{height:.5cqw}
.plan .in{padding:1.9cqw;display:flex;flex-direction:column;flex:1}
.plan .en{font-family:var(--en);font-weight:800;font-size:.95cqw;letter-spacing:.1em}
.plan h3{font-size:1.6cqw;margin-top:.6cqw}
.plan .tg{font-size:1.02cqw;color:var(--soft);margin-top:.5cqw}
.plan .ic{height:6cqw;display:flex;align-items:center;justify-content:center;margin:1.2cqw 0}
.plan .ic img{max-height:6cqw;max-width:65%}
.plan .pr{margin-top:auto;background:var(--pale);color:var(--primary);border-radius:2cqw;
  text-align:center;padding:.75cqw;font-size:1.15cqw;font-weight:700}

.ph{border:1.5px dashed var(--line);background:#f8f9fd;border-radius:.6cqw;
  display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:.95cqw;color:var(--mute);line-height:1.6}

.cta-btn{display:inline-block;background:var(--primary);color:#fff;text-decoration:none;
  font-family:var(--en);font-weight:800;font-size:1.5cqw;border-radius:.6cqw;padding:1.15cqw 2.6cqw;
  margin-top:2.2cqw}
.cover-deco{position:absolute;border-radius:50%;background:#ecf0fb;z-index:0}

@media (max-width:640px){
  .deck{padding:16px 10px 50px}
  .slide{border-radius:7px;margin-bottom:14px}
}
@media print{
  body{background:#fff}
  .bar{display:none}
  .deck{max-width:none;padding:0}
  .slide{margin:0;border-radius:0;box-shadow:none;break-after:page}
}
