:root { color-scheme: light; background: #f3eee5; color: #252b28; font-family: "Microsoft YaHei", "Noto Sans SC", sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; background: #f3eee5; }
.p10-brand { padding: 18px 5vw 14px; background: #1f3731; color: #fff8e9; font-size: 22px; letter-spacing: .12em; }
.p10-brand a { color: inherit; text-decoration: none; }
.p10-navigation { display: flex; flex-wrap: wrap; gap: 7px 18px; padding: 12px 5vw; background: #e6ddca; border-bottom: 1px solid #bcb29c; }
.p10-navigation a { color: #28443b; text-decoration: none; font-size: 13px; }
main { max-width: 1280px; margin: auto; padding: 34px 5vw 70px; }
main > h1 { margin: 0 0 22px; color: #173c34; font: 500 clamp(28px,4vw,50px)/1.2 serif; }
.p10-hero { display: grid; grid-template-columns: minmax(0,1fr) 230px; gap: 30px; align-items: center; padding: 32px; background: #fffaf0; border-left: 8px solid #b34d37; box-shadow: 0 18px 42px #35301a12; }
.p10-hero h2 { margin: 0 0 13px; color: #b34d37; font-size: 16px; }
.p10-hero p { margin: 0; line-height: 2; }
.p10-stamps { display: flex; flex-wrap: wrap; gap: 9px; }
.p10-stamp { width: 86px; margin: 0; padding: 8px; background: #f4ead4; text-align: center; border-radius: 40px 40px 10px 10px; }
.p10-stamp img { display: block; width: 44px; height: 44px; object-fit: contain; margin: auto; }
.p10-stamp figcaption { margin-top: 5px; color: #6b756c; font-size: 10px; }
.p10-spread { display: grid; grid-template-columns: minmax(0,1fr) 205px; gap: 30px; margin-top: 42px; }
.p10-flow { min-width: 0; }
.p10-margin { position: sticky; top: 18px; align-self: start; padding: 22px 17px; background: #e8e0d1; color: #46534b; line-height: 1.9; }
.p10-margin h2 { color: #23453a; font: 21px serif; }
.p10-margin hr { border: 0; border-top: 1px solid #aaa18f; margin: 18px 0; }
.p10-zone { margin: 0 0 36px; padding: 25px; background: #fffaf0; border: 1px solid #e0d8c8; }
.p10-zone h2 { margin: 0 0 18px; color: #1c493c; font: 26px/1.3 serif; }
.p10-feature { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; align-items: start; }
.p10-note, .p10-voice { padding: 18px; background: #f4eedf; border-radius: 2px 18px 2px 18px; line-height: 1.9; }
.p10-note h3, .p10-voice h3, .p10-report h3 { margin: 0 0 10px; color: #8d3e31; font-size: 18px; }
.p10-note p, .p10-voice p, .p10-report p { margin: 0; line-height: 1.95; }
.p10-reports { display: grid; gap: 12px; }
.p10-report { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 15px; padding: 16px 0; border-bottom: 1px solid #d8cfbd; }
.p10-report time { display: block; margin-bottom: 7px; color: #8a8274; font: 12px Georgia,serif; }
.p10-news-mark { width: 44px; height: 44px; object-fit: contain; }
.p10-voices { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.p10-voice small { display: block; margin-top: 12px; color: #6f756e; }
.p10-faq-list { display: grid; gap: 9px; }
.p10-question { padding: 15px 18px; border-left: 3px solid #b34d37; background: #f4eedf; }
.p10-question summary { cursor: pointer; font-weight: 600; color: #23453a; }
.p10-answer { line-height: 1.95; }
.p10-inner { max-width: 1020px; margin: auto; padding: 28px; background: #fffaf0; }
.p10-inner header { margin-bottom: 25px; border-bottom: 1px solid #d4c9b6; padding-bottom: 17px; }
.p10-inner header p { margin: 0 0 8px; color: #b34d37; }
.p10-inner h1 { margin: 0; color: #214438; font: 36px/1.25 serif; }
.p10-about-grid, .p10-ledger, .p10-app-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 0 0 25px; }
.p10-online-grid { display: grid; grid-template-columns: 130px 1fr; gap: 25px; margin-bottom: 25px; }
.p10-online-grid .p10-note + .p10-note { margin-top: 15px; }
.p10-vertical { display: grid; place-items: center; min-height: 250px; background: #1f3731; color: #fff3dd; font: 24px/1.7 serif; text-align: center; }
.p10-footer { padding: 30px 5vw; background: #1f3731; color: #f4ead4; }
.p10-footer a { color: inherit; margin-right: 18px; }
@media (max-width: 800px) {
  main { padding: 20px 4vw 45px; }
  .p10-hero, .p10-spread, .p10-online-grid { grid-template-columns: 1fr; }
  .p10-margin { position: static; }
  .p10-about-grid, .p10-ledger, .p10-app-grid { grid-template-columns: 1fr; }
  .p10-voices { grid-template-columns: 1fr; }
}