/* yearp_new.html 専用。ヘッダー・フッターは共通style.cssを利用。 */
body.yearp-page .yearp-hero { min-height:420px; padding:94px 32px 36px; background-image:url('../img/keyvisual/keyvisual_yearp.jpg.png'); background-size:cover; background-position:center right; }
.yearp-page .yearp-hero::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,20,34,1) 0%,rgba(7,20,34,.99) 40%,rgba(7,20,34,.65) 65%,rgba(7,20,34,.12) 100%); }
.yearp-page .yearp-hero h1 { color:#fff; font-size:clamp(27px,3vw,40px); line-height:1.5; margin-bottom:14px; max-width:700px; }
.yearp-page .yearp-hero h1 .accent { color:#7dd4f0; }
.yearp-page .yearp-hero .ct-hero-sub { color:#e0ebf2; font-size:15px; margin-bottom:18px; }
.yearp-page .yearp-hero .ct-eyebrow,.yearp-page .yearp-hero .ct-breadcrumb a { color:#abdff0; }
.yearp-page .yearp-hero .ct-breadcrumb { margin-bottom:18px; color:#b6c9d7; }
.yearp-page .yearp-hero .ct-hero-tags { margin-bottom:0; }
.yearp-page .yearp-hero .ct-hero-tags span { color:#c4eaf7; }
.yearp-page .yearp-intro { max-width:1200px; margin:auto; padding:30px 32px 0; }
.yearp-page .yearp-kicker { color:#267995; font:600 11px/1.5 'Inter',sans-serif; letter-spacing:.15em; }
.yearp-page .yearp-intro h2 { font-size:24px; color:#183747; margin:4px 0 8px; }
.yearp-page .yearp-intro p:not(.yearp-kicker) { color:#526875; font-size:14px; line-height:1.8; }
.yearp-page .yearp-nav { display:flex; flex-wrap:wrap; gap:9px; margin-top:18px; }
.yearp-page .yearp-nav a { border:1px solid #c2dce7; border-radius:7px; padding:8px 15px; background:#fff; color:#246c89; font-size:13px; font-weight:500; }
.yearp-page .yearp-nav a:hover { background:#e3f2f8; border-color:#4eb3d8; }
.yearp-page .ct-main { padding:24px 32px 44px; }
.yearp-page .yearp-note { border-left:3px solid #86c4da; background:#eaf4f8; padding:11px 15px; font-size:12px; color:#4d6574; margin-bottom:26px; }
.yearp-page .yearp-series { padding:0; margin-bottom:28px; scroll-margin-top:90px; position:relative; }
.yearp-page .yearp-series:last-child { margin-bottom:0; }
.yearp-page .yearp-legacy-anchor { position:absolute; top:0; scroll-margin-top:90px; }
.yearp-page .ct-section-header { margin-bottom:16px; gap:12px; padding-bottom:12px; }
.yearp-page .ct-section-en { color:#287b9e; font:500 10px/1.6 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.1em; margin-bottom:4px; }
.yearp-page .ct-section-title { font-size:22px; color:#183747; display:flex; flex-wrap:wrap; align-items:center; gap:12px; line-height:1.5; }
.yearp-page .yearp-size { padding:2px 8px; background:#e6f2f7; color:#287b9e; font-size:12px; border-radius:4px; }
.yearp-page .yearp-series-info { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:18px; }
.yearp-page .yearp-specs { display:flex; flex-wrap:wrap; gap:10px 24px; align-items:center; }
.yearp-page .yearp-specs>div { display:flex; align-items:baseline; gap:8px; }
.yearp-page .yearp-specs dt { font-size:11px; color:#607380; }
.yearp-page .yearp-specs dd { color:#233f50; font-size:13px; margin:0; }
.yearp-page .yearp-specs strong { font:700 23px/1.4 'Inter',sans-serif; color:#236d8c; }
.yearp-page .yearp-specs dd>span { font-size:11px; }
.yearp-page .yearp-actions { flex:0 0 180px; }
.yearp-page .yearp-actions .ct-card-btn { width:100%; padding:10px 12px; font-size:12px; margin:0; }
.yearp-page .yearp-actions .ct-card-btn-detail { margin-bottom:8px; }
.yearp-page .yearp-actions button { color:#526875; background:#eaf0f4; border:1px solid #ccd9e2; opacity:1; cursor:default; box-shadow:none; transform:none; }
.yearp-page .yearp-grid { list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; padding:0; margin:0; }
.yearp-page .yearp-grid li { min-width:0; }
.yearp-page .yearp-preview { display:block; border:1px solid #d6e4ec; border-radius:10px; overflow:hidden; background:#fff; box-shadow:0 3px 12px rgba(24,55,71,.04); }
.yearp-page .yearp-image { aspect-ratio:515 / 728; background:#f5f8fa; padding:10px; display:flex; justify-content:center; align-items:center; }
.yearp-page .yearp-image img { display:block; width:100%; height:100%; object-fit:contain; }
.yearp-page .yearp-bonus { display:inline-flex; align-items:center; gap:14px; background:#fff; border:1px solid #d6e4ec; border-radius:8px; padding:12px 18px; margin-top:16px; }
.yearp-page .yearp-bonus img { width:65px; height:92px; object-fit:contain; }
.yearp-page .yearp-bonus strong,.yearp-page .yearp-bonus span>span { display:block; color:#284c61; font-size:13px; }
.yearp-page .yearp-bonus span>span { color:#47758c; font-size:12px; margin-top:6px; }
.yearp-page .yearp-video { display:flex; align-items:center; gap:8px; color:#286f8d; font-size:13px; margin-top:14px; width:fit-content; }
.yearp-page .yearp-video:hover { text-decoration:underline; }
.yearp-page a:focus-visible { outline:3px solid #287b9e; outline-offset:3px; }
@media(max-width:1024px) { .yearp-page .yearp-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .yearp-page .yearp-specs { gap:8px 16px; } }
@media(max-width:768px) {
  body.yearp-page .yearp-hero { min-height:0; padding:88px 18px 28px !important; }
  .yearp-page .yearp-hero::before { background:linear-gradient(90deg,rgba(7,20,34,.99),rgba(7,20,34,.9)); }
  .yearp-page .yearp-hero h1 { font-size:clamp(24px,5.5vw,34px); }
  .yearp-page .yearp-hero .ct-hero-sub { font-size:14px; }
  .yearp-page .yearp-hero .ct-breadcrumb { font-size:10px; gap:6px; }
  .yearp-page .yearp-intro { padding:24px 18px 0; }
  .yearp-page .yearp-intro h2 { font-size:21px; }
  .yearp-page .yearp-intro p:not(.yearp-kicker) { font-size:13px; }
  .yearp-page .yearp-nav { gap:7px; margin-top:14px; }
  .yearp-page .yearp-nav a { padding:8px 11px; font-size:12px; }
  .yearp-page .ct-main { padding:20px 18px 32px; }
  .yearp-page .ct-section-title { font-size:18px; gap:7px; }
  .yearp-page .ct-section-badge { padding:3px 8px; font-size:10px; }
  .yearp-page .yearp-series { margin-bottom:24px; }
  .yearp-page .yearp-series-info { flex-direction:column; align-items:stretch; gap:12px; }
  .yearp-page .yearp-specs { gap:6px 18px; }
  .yearp-page .yearp-specs strong { font-size:21px; }
  .yearp-page .yearp-actions { flex:auto; max-width:220px; }
  .yearp-page .yearp-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .yearp-page .yearp-image { padding:6px; }
}
@media(prefers-reduced-motion:reduce) { .yearp-page .yearp-preview { transition:none; } }