/* aim 使い方ガイド：blog.css の上に、章立て用の差分だけを足す */

/* 目次（章の一覧） */
.lp .guide-list{list-style:none;margin:0 auto;padding:0;max-width:720px;display:flex;flex-direction:column;gap:14px}
.lp .guide-card{
  display:flex;align-items:center;gap:18px;padding:20px 22px;
  background:#fff;border:1px solid var(--blue-line);border-radius:18px;
  box-shadow:var(--shadow-card);text-decoration:none;color:inherit;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.lp .guide-card:hover{transform:translateY(-2px);border-color:var(--blue);box-shadow:0 16px 36px -16px rgba(31,107,255,.3)}
.lp .guide-card-num{
  flex:0 0 40px;height:40px;border-radius:12px;display:grid;place-items:center;
  background:var(--blue-soft);color:var(--blue);font-family:"DM Sans";font-weight:700;font-size:17px;
}
.lp .guide-card-body{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.lp .guide-card-title{font-size:17px;font-weight:700;color:var(--ink);line-height:1.45}
.lp .guide-card-desc{font-size:13px;color:var(--ink-3);line-height:1.7}
.lp .guide-card-arrow{flex:0 0 auto;font-size:24px;color:var(--ink-3)}

.lp .guide-contact{text-align:center;margin-top:48px;font-size:14px;color:var(--ink-3)}
.lp .guide-contact a{color:var(--blue);font-weight:600;margin-left:6px}

/* 章ページ */
.lp .guide-article-lead{font-size:15px;line-height:1.8;color:var(--ink-3);margin-top:12px}

/* 本文前の目次はスマホ・タブレットだけ（PC はサイドカラムに常時出ている） */
.lp .guide-inline-toc{
  display:none;background:var(--blue-soft);border-radius:14px;padding:16px 20px;margin-bottom:28px;
}
.lp .guide-inline-toc ol{margin:0;padding-left:1.3em;font-size:14px;line-height:1.9}
.lp .guide-inline-toc a{color:var(--ink-2);text-decoration:none}

/* 「操作の手順」は番号付きリストで書くので、番号を見やすくする。
   LP 側のリセットでリスト記号が消えるため、本文内だけ戻す */
.lp .guide-content ol > li{list-style:decimal}
.lp .guide-content ul > li{list-style:disc}
.lp .guide-content li::marker{color:var(--blue);font-weight:700}

/* 補足（> で書く）を「ヒント」として目立たせる */
.lp .guide-content blockquote{font-size:15px}

/* 見出しは「aim の使い方」。ブログ目次の大文字化（AIM）を打ち消す */
.lp .guide-chapters .blog-toc-title{text-transform:none;letter-spacing:.02em}

/* 現在の章を強調 */
.lp .guide-chapters li.is-current a{background:var(--blue-soft);color:var(--blue);font-weight:700}

/* 前へ / 次へ */
.lp .guide-pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:48px}
.lp .guide-pager-link{
  display:flex;flex-direction:column;gap:6px;padding:16px 18px;
  border:1px solid var(--blue-line);border-radius:14px;text-decoration:none;
  transition:border-color .15s ease, background .15s ease;
}
.lp .guide-pager-link:hover{border-color:var(--blue);background:var(--blue-soft)}
.lp .guide-pager-link.is-next{text-align:right;grid-column:2}
.lp .guide-pager-label{font-size:12px;color:var(--ink-3);font-weight:600}
.lp .guide-pager-title{font-size:14px;color:var(--ink);font-weight:700;line-height:1.5}

@media (max-width:960px){
  .lp .guide-inline-toc{display:block}
  .lp .guide-side-toc{display:none}
}

@media (max-width:720px){
  .lp .guide-card{padding:16px;gap:14px}
  .lp .guide-card-num{flex-basis:34px;height:34px;font-size:15px}
  .lp .guide-pager{grid-template-columns:1fr}
  .lp .guide-pager-link.is-next{grid-column:1}
  /* 比較表は折り返して収め、それでも収まらないときだけ表の中を横スクロールにする */
  .lp .guide-content table{display:block;overflow-x:auto;font-size:13px}
  .lp .guide-content th,.lp .guide-content td{min-width:5.5em;padding:10px}
}
