/* ============================================================
   お役立ち記事（記事ページ・一覧）。本文の見た目は entry.css
   AOI の記事ページと同じ並び: 左に本文、右に案内（PC）
   ============================================================ */

/* ---------- 記事ページの枠 ---------- */
.blog-single{background:#F5F6F8;}
.blog-single .breadcrumb{background:transparent;}
.blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start;max-width:1140px;padding-top:8px;padding-bottom:88px;}
.blog-article{padding:44px 48px 40px;background:#fff;border-radius:6px;box-shadow:0 10px 30px -24px rgba(15,28,63,.35);}

/* 見出し部分 */
.entry-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:13px;color:var(--sub);font-variant-numeric:tabular-nums;}
.entry-cat{display:inline-block;padding:2px 12px;border-radius:2px;background:#2B4C82;color:#fff;font-weight:700;font-size:12.5px;letter-spacing:.06em;}
a.entry-cat:hover{background:var(--navy-deep);}
.entry-title{margin-top:14px;font-family:var(--sans);font-weight:700;font-size:28px;line-height:1.55;letter-spacing:.03em;color:var(--navy-deep);}
.entry-eyecatch{margin:24px 0 0;}
.entry-eyecatch img{display:block;width:100%;height:auto;border-radius:6px;}

/* 共有ボタン */
.share{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:20px;}
.share a,.share button{
  display:flex;align-items:center;justify-content:center;min-height:40px;padding:0 6px;border:0;border-radius:4px;
  font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.04em;color:#fff;cursor:pointer;transition:opacity .2s;
}
.share a:hover,.share button:hover{opacity:.85;}
.share-x{background:#111;}
.share-fb{background:#1877F2;}
.share-line{background:#06C755;}
.share-copy{background:#fff;color:var(--navy) !important;box-shadow:inset 0 0 0 1px var(--line);}
.share-copy.is-done{background:var(--navy);color:#fff !important;}
.entry-body{margin-top:36px;}

/* 目次（本文中。開閉できる） */
.fita-toc{margin:2.4em 0 0;border:2px solid #2B4C82;border-radius:6px;background:#fff;}
.fita-toc summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;cursor:pointer;list-style:none;}
.fita-toc summary::-webkit-details-marker{display:none;}
.fita-toc-title{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:.1em;color:var(--navy-deep);}
.fita-toc-title::before{content:"";width:18px;height:14px;background:linear-gradient(#2B4C82,#2B4C82) 0 0/100% 2px no-repeat,linear-gradient(#2B4C82,#2B4C82) 0 6px/100% 2px no-repeat,linear-gradient(#2B4C82,#2B4C82) 0 12px/70% 2px no-repeat;}
.fita-toc-toggle{font-size:12.5px;color:var(--sub);}
.fita-toc-toggle::after{content:"開く ＋";}
.fita-toc[open] .fita-toc-toggle::after{content:"閉じる －";}
.fita-toc > ol{counter-reset:toc;margin:0;padding:4px 22px 18px;border-top:1px solid var(--line);list-style:none;}
.fita-toc > ol > li{counter-increment:toc;margin-top:10px;font-size:15px;line-height:1.7;}
.fita-toc > ol > li > a::before{content:counter(toc) ".";display:inline-block;min-width:1.6em;color:var(--ac-deep,#AD7C1C);font-weight:700;}
.fita-toc a{color:var(--navy-deep);text-decoration:none;}
.fita-toc a:hover{color:var(--navy-soft);text-decoration:underline;}
.fita-toc ol ol{margin:4px 0 0;padding-left:1.6em;list-style:none;}
.fita-toc ol ol li{margin-top:4px;font-size:14px;color:var(--sub);}
.fita-toc ol ol a{color:var(--sub);}
.fita-toc ol ol a::before{content:"-";margin-right:6px;color:#b4bfd2;}
.entry-body .fita-toc li::marker{content:none;}

/* 見出しへ飛んだとき、固定ヘッダーに隠れないように */
.entry-body [id^="h-"]{scroll-margin-top:calc(var(--header-h,66px) + 16px);}

/* 案内の箱（途中: LINE、最後: 無料相談） */
.fita-cta{margin:2.6em 0 0;padding:28px 24px;border-radius:8px;text-align:center;}
.fita-cta-pre{font-size:13px;font-weight:700;letter-spacing:.08em;}
.fita-cta-title{margin-top:4px;font-family:var(--sans);font-weight:700;font-size:21px;line-height:1.6;color:var(--navy-deep);}
.fita-cta-title em{font-style:normal;}
.fita-cta-text{margin-top:10px;font-size:14px;line-height:1.9;color:var(--ink);}
.fita-cta-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:280px;min-height:54px;margin-top:18px;padding:0 32px;border-radius:999px;
  font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:.08em;color:#fff !important;text-decoration:none !important;transition:opacity .2s;
}
.fita-cta-btn:hover{opacity:.88;}
.fita-cta-btn img{width:24px;height:24px;}
.fita-cta-line{background:#F1FBF5;border:2px solid #06C755;}
.fita-cta-line .fita-cta-pre,.fita-cta-line em{color:#05a046;}
.fita-cta-line .fita-cta-btn{background:#06C755;box-shadow:0 8px 18px -10px rgba(6,160,70,.8);}
.fita-cta-consult{background:#FAF8F2;border:2px solid var(--gold);}
.fita-cta-consult .fita-cta-pre,.fita-cta-consult em{color:var(--ac-deep,#AD7C1C);}
.fita-cta-consult .fita-cta-btn{background:var(--gold);box-shadow:0 8px 18px -10px rgba(160,115,30,.8);}
.blog-article > .fita-cta{margin-top:56px;}
.blog-article > .share{margin-top:28px;}

/* この記事を書いた人 */
.author-box{margin-top:40px;padding:24px 26px;border:1px solid var(--line);border-radius:6px;background:#FAFBFC;}
.author-label{font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:.08em;color:var(--navy-deep);}
.author-inner{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;margin-top:14px;}
.author-img{width:96px;height:96px;border-radius:50%;object-fit:cover;}
.author-img-team{display:flex;align-items:center;justify-content:center;background:#193765;color:#fff;font-family:var(--en);font-size:19px;letter-spacing:.18em;padding-left:.18em;}
.author-role{font-size:12.5px;color:var(--sub);}
.author-name{margin-top:2px;font-family:var(--sans);font-weight:700;font-size:17px;color:var(--navy-deep);}
.author-bio{margin-top:8px;font-size:14px;line-height:1.85;color:var(--ink);}
.author-link{display:inline-block;margin-top:8px;font-size:13.5px;color:var(--navy);text-decoration:underline;text-underline-offset:3px;}

/* あわせて読みたい */
.related{margin-top:48px;}
.related-title{margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid var(--navy);font-family:var(--sans);font-weight:700;font-size:19px;letter-spacing:.06em;color:var(--navy-deep);}
.related-grid{gap:24px 18px;}
.related-grid .art-card h3{font-size:14.5px;}
.entry-back{margin-top:40px;text-align:center;}
.entry-back a{font-size:14px;color:var(--navy);}
.entry-back a::before{content:"‹ ";}

/* ---------- 右の案内（PC）。スマホでは本文の下 ---------- */
.blog-side{display:flex;flex-direction:column;gap:16px;height:100%;}
.side-card{display:block;border-radius:6px;overflow:hidden;background:#fff;box-shadow:0 10px 30px -24px rgba(15,28,63,.35);}
.side-consult{padding:0 0 20px;text-align:center;}
.side-consult-head{padding:12px 16px;background:#2B4C82;color:#fff;font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:.1em;}
.side-consult-text{margin:14px 18px 0;font-size:13.5px;line-height:1.8;color:var(--ink);text-align:left;}
.side-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:14px 16px 0;padding:0;list-style:none;}
.side-points li{display:flex;flex-direction:column;justify-content:center;min-height:56px;padding:6px 2px;border-radius:4px;background:#F1F4F9;font-size:11px;line-height:1.4;color:var(--sub);}
.side-points b{font-size:13px;color:var(--navy-deep);}
.side-btn{display:block;margin:16px 16px 0;padding:13px 10px;border-radius:999px;background:var(--gold);color:#fff;font-family:var(--sans);font-weight:700;font-size:14.5px;letter-spacing:.06em;transition:opacity .2s;}
.side-btn:hover{opacity:.88;}
.side-line{display:flex;align-items:center;gap:12px;padding:16px 18px;background:#06C755;color:#fff;transition:opacity .2s;}
.side-line:hover{opacity:.9;}
.side-line img{width:40px;height:40px;flex:0 0 40px;}
.side-line span{display:flex;flex-direction:column;font-family:var(--sans);font-weight:700;font-size:18px;letter-spacing:.06em;line-height:1.4;}
.side-line small{font-size:11.5px;font-weight:500;letter-spacing:.02em;}
.side-rate{display:block;transition:opacity .2s;}
.side-rate:hover{opacity:.85;}
.side-rate img{display:block;width:100%;height:auto;border-radius:6px;}
/* あわせて読みたい（横） */
.side-related{padding:16px 18px 14px;}
.side-related ul{margin:0;padding:0;list-style:none;}
.side-related li + li{border-top:1px solid var(--line);}
.side-related a{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;color:var(--navy-deep);transition:opacity .2s;}
.side-related li:last-child a{padding-bottom:2px;}
.side-related a:hover{opacity:.75;}
.side-related-thumb{display:block;aspect-ratio:1200/630;border-radius:4px;overflow:hidden;background:#F1F4F9;}
.side-related-thumb img,.side-related-thumb .thumb-empty{display:block;width:100%;height:100%;object-fit:cover;}
.side-related-title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:12.5px;font-weight:700;line-height:1.55;}
.side-sticky{position:sticky;top:calc(var(--header-h,66px) + 16px);margin-top:4px;}
/* PC: 無料相談は上に固定、その下（LINE・合格率・関連記事）は流れ、目次は無料相談の下に固定 */
@media (min-width:1024px){
  /* 上の影（背景色）で、下から流れてくるカードが固定した無料相談の上の隙間に見えないようにする */
  .side-consult{position:sticky;top:calc(var(--header-h,66px) + 16px);z-index:2;box-shadow:0 -18px 0 0 #F5F6F8,0 10px 30px -24px rgba(15,28,63,.35);}
  .blog-side{--side-consult-h:300px;}
  .side-sticky{top:calc(var(--header-h,66px) + 32px + var(--side-consult-h));z-index:1;}
  .side-toc{max-height:calc(100vh - var(--header-h,66px) - var(--side-consult-h) - 64px);}
}
.side-toc{padding:16px 18px 18px;background:#fff;border-radius:6px;box-shadow:0 10px 30px -24px rgba(15,28,63,.35);max-height:calc(100vh - var(--header-h,66px) - 48px);overflow:auto;}
.side-title{padding-bottom:8px;border-bottom:1px solid var(--line);font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:.1em;color:var(--navy-deep);}
.side-toc ol{counter-reset:stoc;margin:0;padding:0;list-style:none;}
.side-toc > ol > li{counter-increment:stoc;margin-top:8px;font-size:13px;line-height:1.6;}
.side-toc > ol > li > a::before{content:counter(stoc) ". ";color:var(--ac-deep,#AD7C1C);font-weight:700;}
.side-toc a{color:var(--navy-deep);}
.side-toc a:hover,.side-toc a.is-current{color:var(--ac-deep,#AD7C1C);}
.side-toc ol ol{display:none;}

/* ---------- 一覧ページ ---------- */
.blog-list .page-hero-title{letter-spacing:.1em;}
/* カテゴリー（AOI と同じくアイコン付きの帯） */
.cat-nav{background:#2B4C82;}
.cat-nav ul{display:flex;justify-content:center;flex-wrap:wrap;margin:0;padding:18px 0;list-style:none;}
.cat-nav a{display:flex;flex-direction:column;align-items:center;gap:8px;width:136px;padding:6px 4px;color:#fff;font-family:var(--sans);font-weight:700;font-size:13.5px;letter-spacing:.04em;transition:color .2s;}
.cat-nav svg{width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.cat-nav a:hover,.cat-nav a[aria-current]{color:#F1D79A;}
.cat-nav a[aria-current] span{border-bottom:2px solid #F1D79A;}
.blog-list-sec{padding-top:56px;}
.blog-list-sec .sec-title{margin-bottom:36px;}
/* 日付を出さないので、タイトルの下に余白（カードの下端にくっつかないように） */
.blog-grid .art-card h3,.related-grid .art-card h3{padding-bottom:18px;}
.cat-desc{max-width:760px;margin:-20px auto 36px;text-align:center;font-size:14.5px;line-height:1.9;color:var(--sub);}
.related-grid .art-card .cat{margin-top:12px;}
.related-grid .art-card h3,.related-grid .art-card .cat,.related-grid .art-card .date{margin-left:14px;margin-right:14px;}
/* タブレットも横に 3 つ（AOI と同じ） */
@media (min-width:768px) and (max-width:1023px){
  .blog-grid,.related-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 16px;}
  .blog-grid .art-card h3,.related-grid .art-card h3{margin-left:14px;margin-right:14px;font-size:14.5px;}
  .blog-grid .art-card .cat{margin-left:14px;margin-right:14px;font-size:12px;}
}

/* ページ送り */
.blog-pager{margin-top:48px;}
.blog-pager .nav-links{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;}
.blog-pager .page-numbers{
  display:flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border:1px solid var(--line);border-radius:4px;
  font-family:var(--sans);font-size:14.5px;color:var(--navy);transition:background .2s,color .2s;
}
.blog-pager a.page-numbers:hover{background:#F1F4F9;}
.blog-pager .page-numbers.current{background:#2B4C82;border-color:#2B4C82;color:#fff;}
.blog-pager .page-numbers.dots{border:0;}

/* 一覧の下の案内 */
.blog-banners{padding-top:0;}
.blog-banner-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:900px;margin:0 auto;}
.blog-banner{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:110px;padding:16px;border-radius:8px;color:#fff;transition:opacity .2s;}
.blog-banner:hover{opacity:.9;}
.blog-banner-line{background:#06C755;}
.blog-banner-consult{background:var(--gold);}
.bb-pre{font-size:13px;font-weight:700;letter-spacing:.06em;}
.bb-main{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:23px;letter-spacing:.08em;}
.bb-main img{width:34px;height:34px;object-fit:contain;}

/* ---------- タブレット・スマホ ---------- */
@media (max-width:1023px){
  .blog-layout{grid-template-columns:1fr;gap:28px;}
  .blog-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;height:auto;}
  .side-consult{grid-row:span 2;}
  .side-sticky{display:none;}
  .side-related{display:none;}
  .blog-article{padding:36px 32px;}
  .cat-nav a{width:112px;}
}
@media (max-width:599px){
  /* スマホのヘッダーは透明で上に重なるので、その分だけ下げる */
  .blog-single{padding-top:60px;}
  .blog-list-sec .sec-title{margin-bottom:22px;}
  .blog-layout{padding-top:0;padding-bottom:56px;}
  /* スマホの一覧は、画像を左・タイトルを右にして多く見せる */
  .blog-grid,.related-grid{gap:10px;}
  .blog-grid .art-card,.related-grid .art-card{display:grid;grid-template-columns:128px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:12px;padding:10px;}
  .blog-grid .art-card .thumb,.related-grid .art-card .thumb{grid-row:1 / 4;align-self:start;margin:0;aspect-ratio:1200/630;border:0;border-radius:4px;}
  .blog-grid .art-card .cat,.related-grid .art-card .cat{margin:0 0 2px;font-size:11.5px;}
  .blog-grid .art-card h3,.related-grid .art-card h3{margin:0;padding-bottom:0;font-size:14px;line-height:1.55;}
  .blog-grid .art-card .date,.related-grid .art-card .date{margin:0;padding:4px 0 0;font-size:12.5px;}
  .art-card .thumb-empty::after{font-size:14px;}
  .blog-single .container.blog-layout{padding-left:0;padding-right:0;}
  .blog-article{padding:26px 18px 30px;border-radius:0;}
  .entry-title{font-size:21px;}
  .entry-eyecatch{margin:18px -18px 0;}
  .entry-eyecatch img{border-radius:0;}
  .share{grid-template-columns:repeat(2,minmax(0,1fr));}
  .entry-body{margin-top:26px;}
  .fita-toc summary{padding:11px 14px;}
  .fita-toc > ol{padding:2px 16px 14px;}
  .fita-toc > ol > li{font-size:14px;}
  .fita-cta{padding:22px 14px;}
  .fita-cta-title{font-size:17.5px;}
  .fita-cta-text{font-size:13px;}
  .fita-cta-btn{min-width:0;width:100%;font-size:15px;}
  .author-box{padding:20px 16px;}
  .author-inner{grid-template-columns:72px minmax(0,1fr);gap:14px;}
  .author-img{width:72px;height:72px;}
  .author-img-team{font-size:15px;}
  .blog-side{grid-template-columns:1fr;padding:0 16px;}
  .side-consult{grid-row:auto;}
  .cat-nav ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:12px 0;}
  .cat-nav a{width:auto;gap:6px;font-size:12px;}
  .cat-nav svg{width:32px;height:32px;}
  .blog-list-sec{padding-top:40px;}
  .blog-banner-row{grid-template-columns:1fr;gap:12px;}
  .blog-banner{min-height:88px;}
  .bb-main{font-size:20px;}
}