/* 情報ページと検索ページの紙面。個別問題の組版（.ph）は専用CSSを使う。 */
:root {
  color-scheme: light;
  --home-bg: #f5f5f5;
  --home-card: #fff;
  --home-ink: #242424;
  --home-muted: #686868;
  --home-line: #dedede;
  --home-line-strong: #aaa;
  --home-accent: #303030;
  --home-accent-dark: #111;
  --home-hover: #f3f3f3;
}

body:not(:has(.ph)) {
  margin: 0;
  padding: 18px clamp(16px, 4vw, 48px) 56px;
  background: #f5f5f5;
  color: #242424;
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic UI", Meiryo, sans-serif;
  font-size: 15px;
  line-height: 1.85;
  -webkit-text-size-adjust: 100%;
}

body:not(:has(.ph)) > .sp-header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px 24px;
  width: min(100%, 1180px);
  min-height: 64px;
  margin: 0 auto 28px;
  padding: 14px 20px;
  border: 1px solid #dedede;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 3px 6px #00000003, 0 10px 26px #00000008;
}

body:not(:has(.ph)) .sp-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-right: auto;
  color: #242424;
  font-size: 17px;
  font-weight: 700;
  text-decoration: none;
}

body:not(:has(.ph)) .sp-brand img { width: 28px; height: 28px; }
body:not(:has(.ph)) .sp-header nav { display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: 13px; }
body:not(:has(.ph)) .sp-header nav a { text-decoration: underline; text-underline-offset: 4px; }

body:not(:has(.ph)) > main {
  box-sizing: border-box;
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: clamp(24px, 4vw, 48px);
  border: 1px solid #dedede;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 3px 7px #00000003, 0 12px 28px #00000005;
}

body:not(:has(.ph)) h1 {
  margin: 0 0 20px;
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 700;
  line-height: 1.45;
}

body:not(:has(.ph)) main h2 {
  max-width: none;
  margin: 44px 0 16px;
  padding-top: 22px;
  border-top: 1px solid #dedede;
  font-size: 21px;
  line-height: 1.5;
}

body:not(:has(.ph)) .sp-stats {
  padding: 24px;
  border: 1px solid #dedede;
  border-radius: 6px;
  background: #f7f7f7;
}

body:not(:has(.ph)) .sp-company { max-width: 48em; }
body:not(:has(.ph)) .sp-faq { padding: 16px 0; }
body:not(:has(.ph)) .sp-faq + .sp-faq { border-top: 1px solid #e9e9e9; }
body:not(:has(.ph)) .sp-faq h3 { color: #242424; font-size: 15px; letter-spacing: 0; }
body:not(:has(.ph)) a:not(.sp-cta) { color: inherit; text-underline-offset: 4px; }
body:not(:has(.ph)) a:not(.sp-cta):hover { text-decoration-color: #242424; }
:focus-visible { outline: none; box-shadow: none; }
a:focus-visible { text-decoration: underline; text-decoration-thickness: 2px; }
button:focus-visible { background-color: #ededed; }

.legal-page * { box-sizing: border-box; }
.legal-page > main { max-width: 960px; }
.legal-page main > p, .legal-page main > ul { max-width: 48em; }
.legal-page p, .legal-page li, .legal-page dd { color: #484848; }
.legal-page .updated { margin: 0 0 32px; color: #686868; font-size: 13px; }
.legal-page .note { color: #686868; font-size: 13px; }
.legal-page a { text-decoration: underline; }
.legal-page dl { display: grid; grid-template-columns: minmax(150px, .34fr) minmax(0, 1fr); margin: 24px 0; border: 1px solid #dedede; border-radius: 6px; overflow: hidden; }
.legal-page dt, .legal-page dd { margin: 0; padding: 18px; border-bottom: 1px solid #dedede; }
.legal-page dt { background: #f7f7f7; font-weight: 600; }
.legal-page dd { background: #fff; }
.legal-page dt:last-of-type, .legal-page dd:last-of-type { border-bottom: 0; }
.legal-page .nav { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 40px; padding-top: 24px; border-top: 1px solid #dedede; font-size: 13px; }

@media (max-width: 600px) {
  body:not(:has(.ph)) { padding: 12px 12px 32px; }
  body:not(:has(.ph)) > .sp-header { gap: 14px; margin-bottom: 16px; padding: 14px 16px; }
  body:not(:has(.ph)) .sp-header nav { gap: 10px 16px; font-size: 12px; }
  body:not(:has(.ph)) > main { padding: 24px 20px; }
  body:not(:has(.ph)) main h2 { margin-top: 32px; font-size: 19px; }
  body:not(:has(.ph)) .sp-stats { padding: 18px 16px; gap: 18px; }
  .legal-page dl { grid-template-columns: 1fr; }
  .legal-page dt { border-bottom: 0; padding: 14px 16px 4px; }
  .legal-page dd { padding: 6px 16px 16px; }
}

@media print {
  body:not(:has(.ph)) { padding: 0; background: #fff; }
  body:not(:has(.ph)) > main { width: 100%; padding: 0; border: 0; box-shadow: none; }
  body:not(:has(.ph)) > .sp-header { display: none; }
}

/* 過去問10年の棚。ホームの「旧帝大 数学過去問10年」と同じ表紙の並びで、大学ハブ・年度ページ・過去問一覧に置く */
.sp-books { display: grid; gap: 20px; margin: 36px 0 8px; padding: 24px 26px 26px; border: 1px solid #dedede; border-radius: 12px; background: #fff; }
.sp-books-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; color: #242424; text-decoration: none; }
body main .sp-books .sp-books-head h2 { max-width: none; margin: 0; padding: 0; border: 0; font-size: 21px; font-weight: 600; line-height: 1.45; text-decoration: underline; text-decoration-color: #aaa; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.sp-books-meta { display: flex; align-items: center; gap: 14px; color: #686868; font-size: 12px; line-height: 1.7; white-space: nowrap; }
.sp-books-meta svg { position: relative; top: 1px; flex: none; }
.sp-books-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 132px)); gap: 22px 26px; margin: 0; padding: 0; list-style: none; }
.sp-books-shelf.sp-books-series { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.sp-books-shelf li { margin: 0; }
.sp-books-shelf a { display: grid; gap: 4px; color: #242424; font-size: 13px; line-height: 1.6; text-decoration: none; }
.sp-books-shelf img { display: block; width: 100%; height: auto; aspect-ratio: 300 / 424; margin-bottom: 6px; box-shadow: 3px 5px 10px #24242424; transition: box-shadow .16s ease; }
.sp-books-shelf span { text-decoration: underline; text-decoration-color: #aaa; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.sp-books-shelf small { color: #686868; font-size: 12px; }
.sp-books-head:hover h2, .sp-books-head:focus-visible h2, .sp-books-shelf a:hover span, .sp-books-shelf a:focus-visible span { text-decoration-color: #242424; }
.sp-books-shelf a:hover img, .sp-books-shelf a:focus-visible img { box-shadow: 5px 8px 16px #24242440; }
@media (max-width: 760px) {
  .sp-books { gap: 16px; padding: 20px 0 22px; }
  .sp-books-head { flex-direction: column; align-items: stretch; gap: 4px; padding: 0 20px; }
  .sp-books-meta { justify-content: space-between; }
  .sp-books-shelf { gap: 16px; padding: 0 20px 4px; }
}
/* 7冊が並ばない幅では、棚を横に送る（ホームと同じ） */
@media (max-width: 600px) {
  .sp-books-shelf.sp-books-series { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 82px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 20px; scrollbar-width: none; }
  .sp-books-shelf.sp-books-series::-webkit-scrollbar { display: none; }
  .sp-books-shelf.sp-books-series li { scroll-snap-align: start; }
  .sp-books-shelf:not(.sp-books-series) { grid-template-columns: 1fr; gap: 14px; }
  .sp-books-shelf:not(.sp-books-series) a { grid-template-columns: 58px minmax(0, 1fr); align-items: center; column-gap: 16px; row-gap: 0; font-size: 14px; }
  .sp-books-shelf:not(.sp-books-series) img { grid-row: 1 / 3; margin: 0; }
  .sp-books-shelf:not(.sp-books-series) span { align-self: end; }
  .sp-books-shelf:not(.sp-books-series) small { align-self: start; }
  .sp-books-series a { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .sp-books-shelf img { transition: none; } }
