/* 学習塾 伸進：教材専用ページのスタイル */
:root {
  --ink:#172b3c;
  --muted:#000001;
  --blue:#2d5274;
  --deep:#294865;
  --pale:#edf2f6;
  --paper:#fffefc;
  --cream:#faf6eb;
  --yellow:#fbe28c;
  --line:#dce2e6;
  --social:#3c5031;
  --social-pale:#f1f3eb;
  --radius:18px;
  --max:1120px
  
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:100px
}
body {
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  font-size:16px;
  line-height:1.9;
  overflow-wrap:anywhere
}
a {
  color:inherit;
  text-underline-offset:5px
}
button,input {
  font:inherit
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible {
  outline:3px solid #af6700;
  outline-offset:5px
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  font-weight:700;
  line-height:1.5
}
button:disabled {
  cursor:default
}
[hidden] {
  display:none!important
}
.wrap {
  width:min(var(--max),calc(100% - 64px));
  margin-inline:auto
}
.skip-link {
  position:absolute;
  left:16px;
  top:-100px;
  z-index:100;
  background:white;
  padding:10px 20px
}
.skip-link:focus {
  top:12px
}
.site-header {
  background:var(--paper);
  border-bottom:1px solid var(--line)
}
.header-inner {
  min-height:86px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.brand {
  text-decoration:none;
  line-height:1.3;
  flex-shrink:0
}
.brand-main {
  display:block;
  letter-spacing:.12em;
  font-size:19px;
  font-weight:800
}
.brand-sub {
  display:block;
  font-size:15px;
  letter-spacing:.09em;
  margin-top:5px;
  color:var(--muted)
}
.header-links {
  display:flex;
  gap:24px;
  align-items:center;
  font-size:13px
}
.header-links a {
  text-decoration:none
}
.header-links a:hover {
  text-decoration:underline
}
.header-links .header-contact {
  padding:9px 17px;
  border:1px solid var(--blue);
  border-radius:6px;
  color:var(--blue)
}
.breadcrumb {
  padding-top:23px;
  color:var(--muted);
  font-size:15px;
  display:flex;
  gap:12px;
  flex-wrap:wrap
}
.breadcrumb span[aria-hidden] {
  color:#a1acb4
}
.hero {
  padding:47px 0 66px;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:70px;
  align-items:center
}
.eyebrow {
  font-size:15px;
  font-weight:700;
  letter-spacing:.12em;
  color:var(--blue);
  display:flex;
  align-items:center;
  gap:9px
}
.eyebrow:before {
  content:"";
  display:block;
  width:23px;
  height:2px;
  background:var(--blue)
}
.hero h1 {
  font-size:clamp(32px,3.5vw,48px);
  line-height:1.55;
  letter-spacing:.02em;
  margin:18px 0 20px
}
.highlight {
  background:linear-gradient(transparent 71%,var(--yellow) 71%,var(--yellow) 92%,transparent 92%);
  padding-bottom:4px
}
.hero-lead {
  font-size:15px;
  line-height:2.1;
  max-width:520px
}
.hero-origin {
  font-size:13px;
  color:var(--muted);
  margin-top:13px
}
.actions {
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:27px
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:13px 22px;
  border:1px solid var(--blue);
  border-radius:7px;
  text-decoration:none;
  line-height:1.6;
  font-size:14px;
  font-weight:700;
  transition:background .15s,color .15s
}
.btn.primary {
  background:var(--blue);
  color:white
}
.btn.primary:hover {
  background:var(--deep)
}
.btn.secondary:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.btn.yellow {
  background:var(--yellow);
  border-color:var(--yellow);
  color:var(--ink)
}
.btn.yellow:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.text-link {
  font-size:16px;
  text-decoration:none;
  border-bottom:1px solid #aab5bd;
  padding-block:5px
}
.text-link:hover {
  color:var(--blue);
  border-color:var(--blue)
}
.arrow {
  font-size:18px;
  font-weight:400
}
.hero-visual {
  position:relative;
  padding:24px 14px 22px 25px
}
.paper-backing {
  position:absolute;
  inset:13px 1px 10px 39px;
  background:var(--yellow);
  border-radius:7px;
  transform:rotate(5deg)
}
.sample-sheet {
  position:relative;
  transform:rotate(-2deg);
  background:#fff;
  border:1px solid #d5dce1;
  border-radius:7px;
  box-shadow:0 15px 38px #24394b13;
  padding:29px 29px 24px
}
.sample-label {
  display:flex;
  justify-content:space-between;
  gap:12px;
  border-bottom:2px solid var(--blue);
  padding-bottom:12px;
  font-size:15px;
  color:var(--blue);
  letter-spacing:.05em
}
.sample-sheet h2 {
  font-size:20px;
  margin-top:15px
}
.sample-sub {
  font-size:11px;
  color:var(--muted);
  margin-top:4px
}
.sample-steps {
  margin-top:19px
}
.sample-step {
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px 0;
  border-bottom:1px solid #e7ebee
}
.sample-number {
  background:var(--pale);
  border-radius:50%;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  color:var(--blue);
  font-size:13px;
  font-weight:700;
  flex-shrink:0
}
.sample-step strong {
  font-size:15px;
  display:block
}
.sample-step small {
  font-size:15px;
  color:var(--muted);
  display:block;
  line-height:1.7
}
.sample-foot {
  font-size:17px;
  text-align:right;
  color:var(--muted);
  margin-top:17px
}
.visual-caption {
  position:relative;
  text-align:center;
  font-size:11px;
  color:var(--muted);
  margin-top:18px
}
.math-strip {
  background:var(--blue);
  color:white
}
.math-strip-inner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;
  padding-block:23px
}
.math-strip-title {
  font-size:16px;
  font-weight:700
}
.math-strip-description {
  font-size:18px;
  color:#fff;
  margin-top:2px
}
.math-strip a {
  color:white;
  text-decoration:none;
  border-bottom:1px solid #a5b6c5;
  padding-block:4px;
  font-size:13px;
  flex-shrink:0
}
.math-strip a:hover {
  border-bottom-color:white
}
.section {
  padding-block:68px
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px
}
.section-kicker {
  font-size:11px;
  font-weight:700;
  color:var(--blue);
  letter-spacing:.16em;
  margin-bottom:9px
}
.section-heading h2,.section-title {
  font-size:28px;
  letter-spacing:.03em
}
.section-description {
  font-size:14px;
  color:var(--muted);
  margin-top:12px;
  max-width:690px
}
.category-nav {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
  margin-top:31px
}
.category-link {
  text-decoration:none;
  border:1px solid var(--line);
  padding:20px 19px 17px;
  border-radius:11px;
  background:white;
  transition:border-color .15s,background .15s
}
.category-link:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.category-link.social:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.category-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--blue);
  font-size:11px;
  margin-bottom:11px;
  letter-spacing:.03em
}
.category-link.social .category-top {
  color:var(--social)
}
.category-name {
  font-size:16px;
  font-weight:700;
  line-height:1.65;
  display:block
}
.category-note {
  font-size:15px;
  color:var(--muted);
  display:block;
  margin-top:9px
}
.notice {
  font-size:12px;
  color:var(--muted);
  margin-top:19px;
  padding-left:13px;
  border-left:3px solid var(--yellow);
  line-height:1.8
}
.catalog-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:35px 0 0;
  padding-bottom:22px;
  border-bottom:1px solid var(--line)
}
.filters {
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
.filter {
  border:1px solid var(--line);
  background:white;
  padding:6px 18px;
  border-radius:30px;
  color:var(--muted);
  font-size:12px;
  min-height:38px
}
.filter[aria-pressed="true"] {
  background:var(--blue);
  border-color:var(--blue);
  color:white
}
.filter:hover {
  border-color:var(--blue)
}
.filter-status {
  font-size:11px;
  color:var(--muted)
}
.material-section {
  padding-block:35px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:25px
}
.material-head {
  display:grid;
  grid-template-columns:47px 1fr;
  gap:17px;
  align-items:start
}
.material-number {
  font-size:28px;
  color:var(--blue);
  font-family:Georgia,serif;
  line-height:1.5
}
.material-title-row {
  display:flex;
  gap:14px;
  align-items:center;
  flex-wrap:wrap
}
.subject-label {
  font-size:10px;
  line-height:1.5;
  background:var(--pale);
  color:var(--blue);
  padding:4px 9px;
  border-radius:4px;
  letter-spacing:.04em
}
.social-section .subject-label {
  background:var(--social-pale);
  color:#4f5f45
}
.material-section h3 {
  font-size:21px
}
.material-lead {
  font-size:18px;
  line-height:1.95;
  margin-top:12px;
  max-width:820px
}
.material-content {
  margin-left:64px;
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:35px;
  margin-top:18px
}
.topic-list {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  padding:0;
  margin:0;
  list-style:none
}
.topic-list li {
  font-size:11px;
  border:1px solid var(--line);
  padding:4px 10px;
  border-radius:4px;
  color:var(--muted)
}
.files {
  margin-top:18px
}
.files-empty {
  font-size:12px;
  color:var(--muted);
  padding:15px 0 6px;
  line-height:1.8
}
.empty-label {
  display:inline-block;
  font-size:10px;
  border:1px solid #d6dce0;
  border-radius:4px;
  padding:2px 8px;
  margin-right:9px;
  vertical-align:1px;
  color:var(--ink)
}
.teaching-note {
  padding:17px 20px;
  background:var(--cream);
  border-radius:9px;
  align-self:start
}
.teaching-note h4 {
  font-size:12px;
  margin:0 0 5px;
  line-height:1.7
}
.teaching-note p {
  font-size:12px;
  color:var(--muted);
  line-height:1.95
}
.worksheet {
  padding:16px 0;
  border-top:1px solid var(--line)
}
.worksheet:first-child {
  border-top:0
}
.worksheet h4 {
  font-size:14px;
  line-height:1.7;
  margin:0 0 6px
}
.worksheet p {
  font-size:12px;
  color:var(--muted);
  margin-bottom:10px
}
.download-links {
  display:flex;
  flex-wrap:wrap;
  gap:9px
}
.download-link {
  font-size:12px;
  text-decoration:none;
  border:1px solid var(--blue);
  color:var(--blue);
  padding:7px 12px;
  border-radius:5px;
  min-height:38px;
  display:inline-flex;
  align-items:center
}
.download-link:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.file-kind {
  font-size:10px;
  margin-left:8px;
  color:var(--muted)
}
.howto {
  background:var(--pale)
}
.howto-top {
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:center
}
.howto-top .section-description {
  max-width:490px
}
.howto-steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
  margin-top:34px
}
.howto-step {
  padding-top:22px;
  border-top:1px solid #c4d0da
}
.howto-no {
  font-size:11px;
  color:var(--blue);
  letter-spacing:.06em
}
.howto-step h3 {
  font-size:17px;
  margin-top:7px
}
.howto-step p {
  font-size:13px;
  color:var(--muted);
  margin-top:10px;
  line-height:2
}
.howto-tip {
  font-size:16px;
  border-top:1px solid #c4d0da;
  padding-top:21px;
  margin-top:30px;
  color:#40586a
}
.related-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:27px
}
.related-item {
  display:block;
  border:1px solid var(--line);
  border-radius:12px;
  padding:25px;
  text-decoration:none;
  background:white
}
.related-item:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.related-item .small {
  font-size:11px;
  color:var(--muted)
}
.related-item strong {
  display:block;
  font-size:18px;
  margin-top:5px;
  line-height:1.7
}
.related-item p {
  font-size:12px;
  margin-top:10px;
  color:var(--muted)
}
.related-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:18px;
  color:var(--blue);
  font-size:18px
}
.classroom {
  background:var(--cream);
  padding-block:65px
}
.classroom-inner {
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:70px;
  align-items:center
}
.local-label {
  font-size:11px;
  color:var(--blue);
  letter-spacing:.06em;
  margin-bottom:10px
}
.classroom h2 {
  font-size:27px;
  line-height:1.65
}
.classroom p {
  font-size:14px;
  margin-top:17px;
  line-height:2
}
.classroom-info {
  background:#fffefcbf;
  border:1px solid #e3dcc9;
  padding:27px;
  border-radius:12px
}
.classroom-name {
  font-size:22px;
  font-weight:700;
  line-height:1.6
}
.classroom-info p {
  font-size:12px;
  margin-top:9px;
  color:var(--muted)
}
.classroom-info .btn {
  width:100%;
  margin-top:21px
}
.classroom-info .text-link {
  display:block;
  text-align:center;
  margin-top:13px;
  border:0
}
.classroom-info .address {
  font-size:11px;
  margin-top:18px
}
.faq {
  max-width:840px;
  margin-inline:auto
}
.faq-list {
  margin-top:25px
}
.faq details {
  border-top:1px solid var(--line)
}
.faq details:last-child {
  border-bottom:1px solid var(--line)
}
.faq summary {
  cursor:pointer;
  list-style:none;
  padding:19px 29px 19px 0;
  position:relative;
  font-size:14px;
  font-weight:700;
  line-height:1.9
}
.faq summary::-webkit-details-marker {
  display:none
}
.faq summary:after {
  content:"＋";
  position:absolute;
  right:0;
  top:19px;
  color:var(--blue);
  font-size:16px
}
.faq details[open] summary:after {
  content:"−"
}
.faq details p {
  font-size:13px;
  color:var(--muted);
  padding:0 25px 22px 0;
  line-height:2
}
.site-footer {
  border-top:1px solid var(--line);
  padding:33px 0 25px
}
.footer-inner {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:30px
}
.footer-links {
  display:flex;
  gap:22px;
  flex-wrap:wrap;
  font-size:11px;
  color:var(--muted)
}
.copyright {
  font-size:10px;
  color:var(--muted);
  margin-top:23px
}
.return-top {
  font-size:11px;
  white-space:nowrap
}
.no-script {
  font-size:12px;
  padding:12px;
  border:1px solid var(--line);
  margin-top:20px
}
@media(min-width:1500px) {
  .hero {
    padding-block:66px 85px
  }
}
@media(max-width:900px) {
  .hero {
    gap:30px;
    grid-template-columns:1.1fr .9fr
  }
  .hero h1 {
    font-size:35px
  }
  .hero-visual {
    padding-left:5px
  }
  .sample-sheet {
    padding:24px 22px
  }
  .category-nav {
    grid-template-columns:repeat(2,1fr)
  }
  .material-content {
    grid-template-columns:1fr;
    gap:18px
  }
  .teaching-note {
    padding:14px 18px
  }
  .classroom-inner {
    gap:30px
  }
  .header-links {
    gap:15px
  }
}
@media(max-width:640px) {
  html {
    scroll-padding-top:20px
  }
  .wrap {
    width:calc(100% - 36px)
  }
  .header-inner {
    min-height:77px;
    gap:12px
  }
  .brand-main {
    font-size:14px;
    letter-spacing:.08em
  }
  .brand-sub {
    font-size:9px
  }
  .header-links {
    gap:8px;
    font-size:11px
  }
  .header-links .header-home {
    display:none
  }
  .header-links .header-contact {
    padding:7px 10px
  }
  .breadcrumb {
    font-size:10px;
    padding-top:17px;
    gap:8px
  }
  .hero {
    padding:29px 0 35px;
    display:block
  }
  .eyebrow {
    font-size:10px
  }
  .hero h1 {
    font-size:clamp(22px,7.2vw,30px);
    margin-top:15px;
    margin-bottom:17px;
    line-height:1.55
  }
  .hero-lead {
    font-size:13px;
    line-height:2.05
  }
  .hero-origin {
    font-size:11px
  }
  .actions {
    gap:16px;
    margin-top:20px
  }
  .btn {
    font-size:13px;
    padding:12px 17px
  }
  .hero-visual {
    width:290px;
    max-width:94%;
    margin:28px auto 0;
    padding:11px 8px 13px 12px
  }
  .sample-sheet {
    padding:20px 22px 18px
  }
  .sample-sheet h2 {
    font-size:17px
  }
  .sample-step {
    padding:9px 0
  }
  .sample-steps {
    margin-top:13px
  }
  .sample-step strong {
    font-size:12px
  }
  .sample-step small {
    font-size:10px
  }
  .visual-caption {
    font-size:10px;
    margin-top:15px
  }
  .math-strip-inner {
    padding-block:19px;
    display:block
  }
  .math-strip-title {
    font-size:14px
  }
  .math-strip-description {
    font-size:11px;
    line-height:1.85
  }
  .math-strip a {
    display:inline-block;
    margin-top:10px;
    font-size:12px
  }
  .section {
    padding-block:44px
  }
  .section-heading {
    display:block
  }
  .section-heading h2,.section-title {
    font-size:23px
  }
  .section-kicker {
    font-size:10px
  }
  .section-description {
    font-size:13px;
    line-height:1.95;
    margin-top:10px
  }
  .category-nav {
    gap:10px;
    margin-top:23px
  }
  .category-link {
    padding:15px 13px
  }
  .category-name {
    font-size:14px
  }
  .category-top {
    font-size:10px;
    margin-bottom:8px
  }
  .category-note {
    font-size:10px;
    margin-top:7px
  }
  .notice {
    font-size:11px;
    margin-top:16px
  }
  .catalog-toolbar {
    margin-top:27px;
    gap:10px;
    align-items:flex-start
  }
  .filter {
    font-size:11px;
    padding:6px 15px
  }
  .filter-status {
    font-size:10px;
    padding-top:7px;
    white-space:nowrap
  }
  .material-section {
    padding-block:27px;
    scroll-margin-top:20px
  }
  .material-head {
    grid-template-columns:31px 1fr;
    gap:10px
  }
  .material-number {
    font-size:24px
  }
  .material-title-row {
    gap:8px
  }
  .material-section h3 {
    font-size:18px
  }
  .material-lead {
    font-size:13px;
    margin-top:10px
  }
  .material-content {
    margin-left:41px;
    gap:14px;
    margin-top:14px
  }
  .topic-list {
    gap:6px
  }
  .topic-list li {
    font-size:10px;
    padding:3px 7px
  }
  .files-empty {
    font-size:11px;
    padding-top:12px
  }
  .empty-label {
    font-size:9px;
    margin-right:6px
  }
  .teaching-note {
    padding:13px 15px
  }
  .teaching-note h4,.teaching-note p {
    font-size:11px
  }
  .howto-top {
    display:block
  }
  .howto-steps {
    grid-template-columns:1fr;
    gap:20px;
    margin-top:24px
  }
  .howto-step {
    padding-top:16px
  }
  .howto-step h3 {
    font-size:16px
  }
  .howto-step p {
    font-size:12px;
    margin-top:7px
  }
  .howto-tip {
    font-size:11px;
    line-height:1.95;
    margin-top:24px;
    padding-top:18px
  }
  .related-grid {
    grid-template-columns:1fr;
    gap:13px;
    margin-top:22px
  }
  .related-item {
    padding:20px
  }
  .related-item strong {
    font-size:17px
  }
  .classroom {
    padding-block:43px
  }
  .classroom-inner {
    grid-template-columns:1fr;
    gap:25px
  }
  .classroom h2 {
    font-size:23px
  }
  .classroom p {
    font-size:13px;
    margin-top:13px
  }
  .classroom-info {
    padding:23px
  }
  .classroom-info p {
    font-size:12px
  }
  .classroom-name {
    font-size:21px
  }
  .classroom-info .address {
    font-size:11px
  }
  .faq summary {
    font-size:13px;
    padding-block:16px
  }
  .faq details p {
    font-size:12px;
    padding-bottom:18px
  }
  .footer-inner {
    display:block
  }
  .footer-links {
    gap:15px;
    line-height:2
  }
  .return-top {
    display:inline-block;
    margin-top:20px
  }
  .copyright {
    font-size:9px;
    line-height:1.9
  }
  .site-footer {
    padding-top:27px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  * {
    transition:none!important
  }
}
@media print {
  body {
    font-size:11pt;
    color:#000;
    background:#fff
  }
  .site-header,.breadcrumb,.hero-visual,.actions,.category-nav,.catalog-toolbar,.math-strip,.related-section,.classroom,.site-footer,.download-links {
    display:none
  }
  .wrap {
    width:100%;
    max-width:none
  }
  .section {
    padding-block:20px
  }
  .hero {
    display:block;
    padding:20px 0
  }
  .hero h1 {
    font-size:25pt
  }
  .howto {
    background:white
  }
  .material-section {
    break-inside:avoid;
    padding-block:20px
  }
  .material-content {
    grid-template-columns:1fr
  }
  .teaching-note {
    border:1px solid #ccc;
    background:white
  }
  .howto-steps {
    gap:20px
  }
  .highlight {
    background:none
  }
  a {
    color:#000
  }
  .faq details p {
    display:block
  }
  .faq summary:after {
    display:none
  }
}
/* ②〜⑨：各分類に問題・答えの５セット */
/* 教材タイトルを押すと、PDFボタンの一覧を開閉します。 */
#materials .material-section {
  padding-block: 0;
}
.material-accordion > .material-toggle {
  display: grid;
  grid-template-columns: 47px minmax(0, 1fr) 87px;
  align-items: center;
  gap: 17px;
  padding: 25px 12px 25px 0;
  cursor: pointer;
  list-style: none;
  border-radius: 8px;
}
.material-toggle::-webkit-details-marker {
  display: none;
}
.material-toggle::marker {
  content: "";
}
.material-toggle:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.social-section .material-toggle:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.material-accordion[open] > .material-toggle {
  border-bottom: 1px solid var(--line);
}
.accordion-state {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  color: var(--blue);
  font-size: 11px;
  line-height: 1.5;
}
.accordion-label-close {
  display: none;
}
.material-accordion[open] .accordion-label-open {
  display: none;
}
.material-accordion[open] .accordion-label-close {
  display: inline;
}
.accordion-mark {
  position: relative;
  width: 27px;
  height: 27px;
  border: 1px solid #b7c6d2;
  border-radius: 50%;
  flex-shrink: 0;
}
.accordion-mark::before,
.accordion-mark::after {
  content: "";
  position: absolute;
  background: var(--blue);
  left: 8px;
  top: 12px;
  width: 9px;
  height: 1px;
}
.accordion-mark::after {
  transform: rotate(90deg);
}
.material-accordion[open] .accordion-mark::after {
  display: none;
}
.material-panel {
  padding-top: 19px;
  padding-bottom: 28px;
  scroll-margin-top: 110px;
}
.material-panel > .material-lead {
  margin-left: 64px;
  margin-top: 0;
  max-width: none;
}
@media (max-width: 640px) {
  .material-accordion > .material-toggle {
    grid-template-columns: 29px minmax(0, 1fr) 29px;
    gap: 10px;
    padding: 20px 3px 20px 0;
  }
  .material-toggle .material-title-row {
    display: block;
  }
  .material-toggle .subject-label {
    display: inline-block;
    margin-bottom: 7px;
  }
  .material-toggle h3 {
    font-size: 17px;
    line-height: 1.7;
  }
  .accordion-label-open,
  .material-accordion[open] .accordion-label-close {
    display: none;
  }
  .material-panel {
    padding-top: 17px;
    padding-bottom: 23px;
    scroll-margin-top: 140px;
  }
  .material-panel > .material-lead {
    margin-left: 41px;
  }
}
.worksheet-sets {
  display: grid;
  gap: 11px;
  margin-top: 17px;
}
.worksheet-set {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: white;
}
.worksheet-set h4 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.7;
}
.worksheet-pdf-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-height: 30px;
  padding: 9px 10px;
  border: 1px solid var(--blue);
  border-radius: 6px;
  color: var(--blue);
  background: var(--pale);
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
}
.worksheet-pdf-button.answer-button {
  color: #4f5f45;
  border-color: var(--social);
  background: var(--social-pale);
}
.worksheet-pdf-button[href]:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.worksheet-pdf-button.answer-button[href]:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.worksheet-pdf-status {
  font-size: 11px;
  font-weight: 500;
}
.worksheet-pdf-button[aria-disabled="true"] {
  color: #2b4052;
  border-color: #cdd7df;
  background: #f5f7f9;
  cursor: default;
}
@media (max-width: 640px) {
  .worksheet-set {
    grid-template-columns: 64px minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    padding: 11px 10px;
  }
  .worksheet-set h4 {
    font-size: 11px;
  }
  .worksheet-pdf-button {
    font-size: 13px;
    min-height: 61px;
    padding: 8px 5px;
  }
  .worksheet-pdf-status {
    font-size: 10px;
  }
}
@media print {
  .worksheet-set {
    break-inside: avoid;
  }
}
/* 都立入試英語：１年度につき１つのPDFボタン */
.exam-content {
  grid-template-columns: 1fr;
  gap: 20px;
}
.exam-guide {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.exam-guide p {
  font-size: 13px;
  line-height: 1.95;
}
.exam-guide strong {
  font-size: 15px;
}
.pdf-label {
  color: var(--blue);
  border: 1px solid var(--line);
  font-size: 11px;
  padding: 5px 10px;
  border-radius: 5px;
  white-space: nowrap;
}
.exam-pending {
  padding-top: 10px;
}
.year-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}
.year-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 60px;
  padding: 15px 10px;
  border: 1px solid var(--blue);
  background: white;
  border-radius: 9px;
  text-decoration: none;
  color: var(--blue);
  line-height: 1.65;
}
.year-button[href]:hover {
  background: #FFF9DB;
  border-color: #D9B84F;
}
.year-main {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
}
.year-era {
  font-size: 11px;
}
.year-file {
  display: inline-block;
  font-size: 10px;
  margin-top: 3px;
  padding: 1px 8px;
  border-radius: 4px;
  background: var(--pale);
}
.year-button[aria-disabled="true"] {
  color: #2b4052;
  border-color: #cdd7df;
  background: #f5f7f9;
  cursor: default;
}
.year-button[aria-disabled="true"] .year-file {
  color: #2b4052;
  background: #e8edf1;
}
@media (max-width: 900px) {
  .year-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .exam-guide {
    display: block;
  }
  .exam-guide p {
    font-size: 12px;
  }
  .exam-guide strong {
    font-size: 14px;
  }
  .pdf-label {
    display: inline-block;
    margin-top: 10px;
    font-size: 10px;
  }
  .year-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 14px;
  }
  .year-button {
    min-height: 107px;
    padding: 13px 7px;
  }
  .year-main {
    font-size: 16px;
  }
  .year-era {
    font-size: 10px;
  }
  .year-file {
    font-size: 9px;
  }
}
@media print {
  .year-grid {
    grid-template-columns: repeat(5, 1fr);
  }
  .year-button {
    min-height: 85px;
    break-inside: avoid;
  }
}

/* ９分類の一覧と、読みやすい濃さの文字 */
.category-nav {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.category-name { color: var(--ink); }
.category-note, .notice, .files-empty { color: var(--muted); }
.material-title-row { min-width: 0; }
.material-panel { scroll-margin-top: 170px; }
.worksheet-content { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.worksheet-pdf-button, .worksheet-pdf-button[aria-disabled="true"] { color: #243d52; }
.worksheet-pdf-button.answer-button { color: #31462b; }
.worksheet-pdf-status { color: #2b4052; }
.category-link.science:hover, .science-section .material-toggle:hover { background: #FFF9DB;  border-color: #D9B84F; }
.category-link.science .category-top { color: #244a58; }
.science-section .subject-label { color: #244a58; background: #eaf2f4; }
@media (max-width: 900px) {
  .category-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .category-name { font-size: 14px; }
  .category-note { font-size: 12px; }
  .notice, .files-empty { font-size: 13px; }
  .worksheet-set { grid-template-columns: 70px minmax(0, 1fr) minmax(0, 1fr); }
  .worksheet-set h4 { font-size: 12px; }
  .worksheet-pdf-status { font-size: 10px; }
  .material-panel > .material-lead, .material-content { margin-left: 0; }
}


/* 地理：「記号で答える／記述する」ボタン専用の見た目
   その他の問題・答えボタンには影響しません。 */
.worksheet-set--question-types {
  grid-template-columns: 180px repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 15px 18px;
}
.worksheet-set--question-types h4 {
  font-size: 16px;
  line-height: 1.65;
}
.worksheet-set--question-types .worksheet-pdf-button {
  min-height: 100px;
  padding: 15px 12px;
  gap: 8px;
}
.worksheet-set--question-types .worksheet-pdf-title {
  display: block;
  font-size: clamp(8px, 2vw, 12px);
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: .01em;
  text-align: center;
}
.worksheet-set--question-types .worksheet-pdf-status {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  padding: 2px 10px;
  border-radius: 999px;
  background: #e5ebf1;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
  text-align: center;
}
@media (max-width: 900px) and (min-width: 641px) {
  .worksheet-set--question-types {
    grid-template-columns: 140px repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
  }
  .worksheet-set--question-types .worksheet-pdf-title {
    font-size: clamp(8px, 2.3vw, 12px);
  }
}
@media (max-width: 640px) {
  /* スマホでは教材名を上段に、ボタンを下段に並べる */
  .worksheet-set--question-types {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
  }
  .worksheet-set--question-types h4 {
    grid-column: 1 / -1;
    font-size: 14px;
    line-height: 1.6;
  }
  .worksheet-set--question-types .worksheet-pdf-button {
    min-height: 94px;
    padding: 12px 7px;
    gap: 7px;
  }
  .worksheet-set--question-types .worksheet-pdf-title {
    font-size: clamp(8px, 4vw, 12px);
  }
  .worksheet-set--question-types .worksheet-pdf-status {
    font-size: 10px;
    padding: 2px 7px;
  }
}
@media (min-width: 641px) {
  .worksheet-set--question-types {
    grid-template-columns: 2fr 1fr 1fr;
  }
}