/*
Theme Name: Full Stride Guide
Theme URI: https://fullstride.gcxxblog.com/
Author: GCXX
Description: Full Stride専用の検証型攻略データベーステーマ
Version: 1.0.1
Text Domain: fullstride-guide
*/

:root {
  --ink: #102236;
  --muted: #526272;
  --paper: #ffffff;
  --wash: #eef5f7;
  --line: #c8d6dd;
  --navy: #071d33;
  --navy-2: #0d3150;
  --cyan: #08a8c4;
  --cyan-dark: #087b91;
  --gold: #f2b51d;
  --grass: #2f8a57;
  --danger: #a33b31;
  --shadow: 0 8px 24px rgba(7, 29, 51, .1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: #e8eef1;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Yu Gothic", sans-serif;
  font-size: 16px;
  line-height: 1.75;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
a { color: #006b9a; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: #00496b; }
img, iframe, video { display: block; max-width: 100%; }
iframe { width: 100%; border: 0; }
button, input { font: inherit; }
.site-shell { min-height: 100vh; background: var(--paper); }
.wrap { width: min(1240px, calc(100% - 40px)); margin: 0 auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; }

.site-header { position: relative; z-index: 20; color: #fff; background: var(--navy); border-bottom: 4px solid var(--gold); }
.site-header__main { min-height: 72px; display: flex; align-items: center; gap: 20px; }
.site-brand { flex: 0 1 255px; margin-right: auto; color: #fff; text-decoration: none; }
.site-brand__name { display: block; font-size: 1.16rem; font-weight: 900; line-height: 1.3; }
.site-brand__sub { display: block; margin-top: 2px; color: #c9e0eb; font-size: .7rem; line-height: 1.4; }
.desktop-nav { display: flex; align-items: stretch; gap: 2px; }
.desktop-nav a { display: grid; place-items: center; min-height: 44px; padding: 8px 10px; color: #fff; font-size: .84rem; font-weight: 800; line-height: 1.3; text-align: center; text-decoration: none; }
.desktop-nav a:hover, .desktop-nav .current-menu-item a { color: #fff; background: rgba(8, 168, 196, .22); }
.header-search { display: flex; width: min(290px, 24vw); }
.header-search input { min-width: 0; flex: 1; border: 1px solid #9eb3bf; border-right: 0; padding: 9px 10px; color: var(--ink); background: #fff; }
.header-search button { flex: 0 0 auto; border: 0; padding: 0 13px; color: var(--navy); background: var(--gold); font-weight: 900; cursor: pointer; }
.menu-toggle { display: none; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.42); color: #fff; background: transparent; font-size: 1.4rem; cursor: pointer; }
.mobile-panel[hidden] { display: none; }
.mobile-panel { padding: 0 0 15px; }
.mobile-panel nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.18); }
.mobile-panel nav a { min-width: 0; border-right: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); padding: 10px 8px; color: #fff; font-size: .88rem; font-weight: 800; text-align: center; text-decoration: none; }
.mobile-panel .header-search { width: 100%; margin-top: 12px; }

.hero { color: #fff; background: var(--navy); }
.hero__visual { position: relative; display: grid; place-items: center; margin: 0; background: #061727; }
.hero__visual img { width: 100%; height: auto; max-height: min(660px, 52vw); object-fit: contain; margin-inline: auto; background: #061727; }
.hero__visual figcaption { position: absolute; right: 10px; bottom: 7px; padding: 3px 7px; color: #fff; background: rgba(2, 15, 27, .82); font-size: .68rem; line-height: 1.45; }
.hero__content { border-top: 1px solid rgba(255,255,255,.16); background: linear-gradient(90deg, var(--navy), var(--navy-2)); }
.hero__inner { min-height: 188px; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .6fr); align-items: center; gap: 38px; padding-block: 28px 40px; }
.hero__eyebrow { margin: 0 0 6px; color: #67d7e7; font-weight: 900; font-size: .78rem; }
.hero h1 { margin: 0; font-size: 3rem; line-height: 1.16; }
.hero__lead { max-width: 760px; margin: 14px 0 0; color: #e8f4f7; }
.hero__status { border-left: 4px solid var(--gold); padding: 14px 16px; background: rgba(255,255,255,.08); }
.hero__status strong { display: block; margin-bottom: 4px; }
.hero__status p { margin: 0; color: #dceaf0; font-size: .87rem; }

.quick-search { position: relative; margin-top: -22px; }
.quick-search__inner { display: grid; grid-template-columns: 1fr auto; border: 1px solid var(--line); box-shadow: var(--shadow); }
.quick-search input { min-width: 0; border: 0; padding: 15px 17px; background: #fff; }
.quick-search button { border: 0; padding: 0 27px; color: #fff; background: var(--cyan-dark); font-weight: 900; cursor: pointer; }

.home-section { padding: 40px 0; border-bottom: 1px solid var(--line); }
.home-section--wash { background: var(--wash); }
.home-section--quick { padding-top: 44px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.section-heading h2 { margin: 0; padding-left: 13px; border-left: 5px solid var(--cyan); font-size: 1.4rem; line-height: 1.35; }
.section-heading p { margin: 0; color: var(--muted); font-size: .88rem; }
.quick-guide-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.quick-guide-grid a { position: relative; min-height: 82px; display: grid; grid-template-columns: 38px 1fr; grid-template-rows: auto auto; align-content: center; column-gap: 10px; border: 1px solid var(--line); border-bottom: 3px solid var(--cyan); padding: 11px 13px; color: var(--ink); background: #fff; text-decoration: none; }
.quick-guide-grid a:hover { border-color: var(--cyan); box-shadow: var(--shadow); }
.quick-guide-grid span { grid-row: 1 / 3; align-self: center; color: var(--cyan-dark); font-size: 1.25rem; font-weight: 900; }
.quick-guide-grid strong { line-height: 1.35; }
.quick-guide-grid small { color: var(--muted); font-size: .74rem; line-height: 1.4; }

.guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.guide-link { min-height: 112px; display: grid; grid-template-columns: 62px 1fr; grid-template-rows: auto auto; align-content: center; column-gap: 12px; border: 1px solid var(--line); border-left: 4px solid var(--grass); padding: 14px; color: var(--ink); background: #fff; text-decoration: none; }
.guide-link:hover { border-color: var(--cyan-dark); box-shadow: var(--shadow); }
.guide-link__mark { grid-row: 1 / 3; align-self: center; color: var(--cyan-dark) !important; font-size: .67rem !important; font-weight: 900; text-align: center; }
.guide-link strong { line-height: 1.35; }
.guide-link > span:last-child { margin-top: 4px; color: var(--muted); font-size: .78rem; line-height: 1.45; }

.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.post-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.post-card__media { display: block; background: #dbe6eb; }
.post-card__media--empty { aspect-ratio: 16 / 9; background: linear-gradient(135deg, var(--navy-2), var(--cyan-dark)); }
.post-card__thumb { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.post-card__body { padding: 15px; }
.post-card__meta { display: flex; flex-wrap: wrap; gap: 7px; color: var(--muted); font-size: .73rem; }
.post-card h3 { margin: 7px 0; font-size: 1.02rem; line-height: 1.45; }
.post-card h3 a { color: var(--ink); text-decoration: none; }
.post-card p { margin: 0; color: var(--muted); font-size: .87rem; }

.verification { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.verification__item { border: 1px solid var(--line); border-top: 3px solid var(--grass); padding: 13px 14px; background: #fff; }
.verification__item strong { display: block; }
.verification__item p { margin: 5px 0 0; color: var(--muted); font-size: .83rem; }

.breadcrumbs { width: min(1240px, calc(100% - 40px)); margin: 0 auto; padding-top: 16px; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 5px; margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: .78rem; }
.breadcrumbs li:not(:last-child)::after { content: "/"; margin-left: 5px; color: #93a2aa; }
.breadcrumbs [aria-current="page"] { color: var(--muted); }
.content-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; padding-block: 26px 56px; }
.article-header { margin-bottom: 24px; }
.article-header h1 { margin: 7px 0 10px; font-size: 2.2rem; line-height: 1.35; }
.article-meta { color: var(--muted); font-size: .8rem; }
.entry-content { min-width: 0; }
.entry-content h2 { margin: 40px 0 17px; padding: 9px 13px; border-left: 5px solid var(--cyan); background: var(--wash); font-size: 1.36rem; line-height: 1.4; }
.entry-content h3 { margin: 29px 0 12px; padding-bottom: 7px; border-bottom: 2px solid var(--line); font-size: 1.14rem; }
.entry-content h4 { margin: 24px 0 9px; font-size: 1rem; }
.entry-content p, .entry-content li { max-width: 78ch; }
.entry-content figure { max-width: 100%; }
.entry-content img { height: auto; }
.entry-content .wp-block-table, .fullstride-table-scroll { max-width: 100%; margin: 22px 0; overflow-x: auto; }
.entry-content table { width: 100%; border: 1px solid var(--line); border-collapse: collapse; background: #fff; }
.entry-content th, .entry-content td { border: 1px solid var(--line); padding: 10px; text-align: left; vertical-align: top; }
.entry-content thead th, .entry-content th { color: var(--navy); background: #e7f1f4; }
.entry-content tbody tr:nth-child(even) { background: #f8fafb; }
.entry-content blockquote { margin: 22px 0; border-left: 4px solid var(--gold); padding: 13px 18px; background: #fff6d9; }
.entry-content .wp-block-embed, .entry-content .wp-block-embed__wrapper, .video-embed, .fullstride-video { width: 100%; max-width: 100%; }
.entry-content .wp-block-embed__wrapper, .video-embed, .fullstride-video { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: #071d33; }
.entry-content .wp-block-embed__wrapper iframe, .entry-content iframe[src*="youtube"], .entry-content iframe[src*="youtu.be"], .video-embed iframe, .fullstride-video iframe { width: 100%; height: 100%; aspect-ratio: 16 / 9; }
.source-note { margin: 24px 0; border: 1px solid var(--line); padding: 14px; background: var(--wash); font-size: .88rem; }
.article-figure, .fullstride-figure { margin: 24px 0; }
.article-figure img, .fullstride-figure img { width: 100%; border: 1px solid var(--line); }
.article-figure figcaption, .fullstride-figure figcaption { margin-top: 6px; color: var(--muted); font-size: .76rem; line-height: 1.55; }
.procedure-steps, .fullstride-steps { margin: 18px 0; padding: 0; list-style: none; counter-reset: procedure; }
.procedure-steps > li, .fullstride-steps > li { position: relative; margin: 0; border: 1px solid var(--line); border-bottom: 0; padding: 13px 14px 13px 56px; background: #fff; }
.procedure-steps > li:last-child, .fullstride-steps > li:last-child { border-bottom: 1px solid var(--line); }
.procedure-steps > li::before, .fullstride-steps > li::before { counter-increment: procedure; content: counter(procedure); position: absolute; left: 14px; top: 12px; display: grid; place-items: center; width: 27px; height: 27px; color: #fff; background: var(--cyan-dark); font-weight: 900; }
.article-toc, .fullstride-toc { margin: 24px 0; border: 1px solid var(--line); border-top: 4px solid var(--cyan); padding: 16px 18px; background: #fff; }
.article-toc strong, .fullstride-toc strong { display: block; margin-bottom: 8px; }
.article-toc ol, .fullstride-toc ol { margin: 0; padding-left: 1.5em; }
.article-toc li, .fullstride-toc li { margin: 4px 0; }
.key-point, .fullstride-note, .fullstride-tip { margin: 22px 0; border-left: 4px solid var(--gold); padding: 14px 16px; background: #fff6d9; }
.key-point p, .fullstride-note p, .fullstride-tip p { margin: 0; }
.fullstride-lead { margin: 0 0 20px; font-size: 1.06rem; font-weight: 700; }
.fullstride-checklist { margin: 18px 0; border: 1px solid var(--line); padding: 12px 16px 12px 38px; background: var(--wash); }
.fullstride-checklist li { margin: 5px 0; }
.fullstride-sources { border: 1px solid var(--line); padding: 13px 16px 13px 36px; background: var(--wash); }
.fullstride-updated { color: var(--muted); font-size: .8rem; text-align: right; }
.article-ad { clear: both; margin: 38px 0 12px; border-top: 1px solid var(--line); padding-top: 16px; text-align: center; }
.article-ad--chapter { margin-block: 42px; border-block: 1px solid var(--line); padding-block: 16px; }
.article-ad > span { display: block; margin-bottom: 8px; color: var(--muted); font-size: .7rem; }
.article-ad .adsbygoogle { min-height: 120px; }
.article-ad:has(.adsbygoogle[data-ad-status="unfilled"]) { display: none; }
.related-posts { margin-top: 44px; padding-top: 6px; border-top: 1px solid var(--line); }
.related-posts__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.related-post { min-width: 0; display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 11px; align-items: center; border: 1px solid var(--line); padding: 9px; color: var(--ink); text-decoration: none; }
.related-post--no-thumb { grid-template-columns: 1fr; }
.related-post__thumb { width: 96px; aspect-ratio: 16 / 9; object-fit: cover; }
.sidebar-box { margin-bottom: 17px; border: 1px solid var(--line); background: #fff; }
.sidebar-box h2 { margin: 0; padding: 10px 12px; color: #fff; background: var(--navy-2); font-size: .93rem; }
.sidebar-box ul { margin: 0; padding: 8px 13px 12px 29px; }
.sidebar-box li { margin: 5px 0; }
.archive-title { margin: 0 0 22px; font-size: 1.75rem; }
.pagination { margin-top: 27px; }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 6px; }
.pagination a, .pagination span { border: 1px solid var(--line); padding: 7px 11px; text-decoration: none; }

.site-footer { color: #e6f0f4; background: var(--navy); }
.footer-main { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 28px; padding-block: 32px; }
.site-footer h2 { margin: 0 0 9px; color: #fff; font-size: .98rem; }
.site-footer p, .site-footer li { color: #c8d9e2; font-size: .82rem; }
.site-footer ul { margin: 0; padding-left: 18px; }
.site-footer a { color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); padding: 13px 12px; text-align: center; font-size: .72rem; }

@media (max-width: 1120px) {
  .site-header > .site-header__main > .header-search { display: none; }
  .desktop-nav a { padding-inline: 8px; }
}

@media (max-width: 900px) {
  .desktop-nav, .site-header > .site-header__main > .header-search { display: none; }
  .menu-toggle { display: inline-grid; place-items: center; }
  .mobile-panel .header-search { display: flex; }
  .hero__inner { grid-template-columns: 1fr; min-height: 0; gap: 21px; }
  .hero h1 { font-size: 2.35rem; }
  .article-header h1 { font-size: 1.85rem; }
  .quick-guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content-layout { grid-template-columns: 1fr; }
  .sidebar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
}

@media (max-width: 600px) {
  body { font-size: 15px; }
  .wrap, .breadcrumbs { width: min(100% - 24px, 1240px); }
  .site-header__main { min-height: 62px; gap: 10px; }
  .site-brand { min-width: 0; }
  .site-brand__name { font-size: 1rem; }
  .site-brand__sub { display: none; }
  .hero__visual img { max-height: none; }
  .hero__visual figcaption { position: static; width: 100%; padding: 4px 12px; text-align: right; background: #061727; font-size: .6rem; }
  .hero__inner { padding-block: 24px 39px; }
  .hero h1 { font-size: 1.85rem; }
  .hero__lead { margin-top: 10px; font-size: .89rem; }
  .hero__status { padding: 12px; }
  .quick-search { margin-top: -18px; }
  .quick-search input { padding: 13px 11px; }
  .quick-search button { padding-inline: 16px; }
  .home-section { padding: 31px 0; }
  .home-section--quick { padding-top: 37px; }
  .section-heading { align-items: start; flex-direction: column; gap: 5px; }
  .section-heading h2 { font-size: 1.2rem; }
  .quick-guide-grid { gap: 7px; }
  .quick-guide-grid a { min-height: 74px; grid-template-columns: 30px 1fr; gap: 7px; padding: 9px; }
  .quick-guide-grid span { font-size: 1rem; }
  .quick-guide-grid small { font-size: .68rem; }
  .guide-grid { gap: 7px; }
  .guide-link { min-height: 98px; grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 2px; padding: 10px; }
  .guide-link__mark { grid-row: auto; text-align: left; }
  .guide-link > span:last-child { font-size: .71rem; }
  .post-grid, .verification, .sidebar { grid-template-columns: 1fr; }
  .post-card { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  .post-card__media, .post-card__media--empty { min-height: 126px; height: 100%; aspect-ratio: auto; }
  .post-card__thumb { height: 100%; min-height: 126px; aspect-ratio: auto; }
  .post-card__body { padding: 11px; }
  .post-card h3 { font-size: .92rem; }
  .post-card p { display: none; }
  .breadcrumbs { padding-top: 12px; }
  .content-layout { padding-block: 21px 39px; }
  .article-header h1 { font-size: 1.5rem; }
  .entry-content h2 { margin-top: 31px; font-size: 1.17rem; }
  .entry-content .wp-block-table, .fullstride-table-scroll { -webkit-overflow-scrolling: touch; }
  .entry-content table { min-width: 560px; }
  .entry-content table.compact-table { min-width: 0; table-layout: fixed; white-space: normal; }
  .entry-content table.compact-table th:first-child, .entry-content table.compact-table td:first-child { width: 34%; }
  .entry-content th, .entry-content td { padding: 8px; }
  .entry-content .has-stack-table { overflow: visible; }
  .entry-content table.fullstride-table--stack {
    display: block;
    min-width: 0;
    border: 0;
    background: transparent;
  }
  .entry-content .fullstride-table--stack thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .entry-content .fullstride-table--stack tbody {
    display: grid;
    gap: 12px;
  }
  .entry-content .fullstride-table--stack tbody tr {
    display: block;
    overflow: hidden;
    border: 1px solid var(--line);
    background: #fff;
  }
  .entry-content .fullstride-table--stack tbody th {
    display: block;
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--line);
    padding: 9px 10px;
    color: #fff;
    background: var(--navy);
  }
  .entry-content .fullstride-table--stack tbody td {
    display: grid;
    grid-template-columns: minmax(88px, 34%) minmax(0, 1fr);
    gap: 10px;
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--line);
    padding: 9px 10px;
  }
  .entry-content .fullstride-table--stack tbody td:last-child { border-bottom: 0; }
  .entry-content .fullstride-table--stack tbody td::before {
    content: attr(data-label);
    color: var(--navy);
    font-weight: 700;
  }
  .related-posts__grid { grid-template-columns: 1fr; }
  .related-post { grid-template-columns: 84px minmax(0, 1fr); }
  .related-post__thumb { width: 84px; }
  .footer-main { grid-template-columns: 1fr; gap: 17px; padding-block: 27px; }
}