:root { --yellow:#ffd83d; --red:#ef4850; --blue:#3978d4; --teal:#25a18e; --purple:#8d67c8; --ink:#34445b; --muted:#6d7a8d; --paper:#fff; --cream:#fff9e7; --line:#dfe5ed; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#f4f7fb; font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif; }
a { color:inherit; }
.skip-link { position:fixed; top:-80px; left:8px; z-index:20; padding:8px; background:#fff; }.skip-link:focus { top:8px; }
.site-header { background:linear-gradient(90deg,var(--yellow),#ffea86); border-bottom:4px solid var(--red); }
.header-inner { max-width:1280px; min-height:82px; margin:auto; padding:12px 24px; display:flex; align-items:center; gap:22px; }
.logo { flex:0 0 auto; color:var(--ink); text-decoration:none; font-size:3.2rem; font-weight:950; letter-spacing:-.08em; line-height:1; }.logo span { color:var(--red); }
.header-inner > p { margin:0; font-size:1rem; font-weight:800; }
.year-nav { margin-left:auto; display:flex; align-items:center; gap:5px; font-size:.75rem; }.year-link { padding:6px 10px; color:#fff; background:var(--blue); border-radius:6px; text-decoration:none; }.year-link.active { background:var(--red); }
main { max-width:1280px; margin:auto; background:#fff; }

.catalog-lead { padding:22px 28px; display:grid; grid-template-columns:1fr 1.25fr; gap:24px; align-items:center; background:var(--cream); border-bottom:6px solid var(--yellow); }
.issue { display:inline-block; margin:0 0 6px; padding:4px 9px; color:#fff; background:var(--red); border-radius:4px; font-size:.75rem; font-weight:900; }
.catalog-lead h1 { margin:0; white-space:nowrap; font-size:clamp(1.8rem,4vw,3.25rem); line-height:1.12; letter-spacing:-.04em; }.catalog-lead h1 span { color:var(--red); }.catalog-lead > div > p:last-child { margin:7px 0 0; color:var(--muted); font-size:.88rem; }
.department-nav { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.department-nav a { min-height:94px; padding:14px; display:grid; grid-template-columns:1fr auto; align-content:center; color:#fff; background:var(--blue); border-radius:10px; text-decoration:none; box-shadow:0 4px 0 #24589e; }.department-nav a:nth-child(2) { background:var(--teal); box-shadow-color:#187262; }.department-nav a:nth-child(3) { background:var(--purple); box-shadow-color:#684a98; }
.department-nav small { grid-column:1/-1; font-size:.66rem; opacity:.85; }.department-nav b { font-size:1.2rem; }.department-nav span { font-size:1.5rem; }

.maker-zone { padding:24px 28px 28px; background:linear-gradient(135deg,#fff2aa,#ffe16b); border-bottom:1px solid #e9c94d; }
.maker-zone > header,.flyer-heading { display:flex; align-items:baseline; gap:12px; margin-bottom:13px; }
.maker-zone > header p,.flyer-heading p { margin:0; padding:4px 8px; color:#fff; background:var(--red); border-radius:4px; font-size:.72rem; font-weight:900; }.maker-zone h2,.flyer-heading h2 { margin:0; font-size:1.65rem; }.maker-zone > header span,.flyer-heading span { color:var(--muted); font-size:.78rem; }
.maker-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.maker-card { overflow:hidden; background:#fff; border:2px solid #fff; border-radius:10px; box-shadow:0 4px 12px rgba(72,62,20,.12); }.maker-card a { height:100%; padding:11px; display:grid; grid-template-columns:82px 1fr; gap:5px 10px; text-decoration:none; }
.maker-card strong { grid-column:1/-1; color:var(--blue); font-size:1rem; letter-spacing:.04em; }.maker-card img { grid-row:2/6; width:82px; height:82px; object-fit:contain; background:#fff; }.maker-card h3 { margin:0; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:.8rem; line-height:1.35; }.maker-card p { margin:0; color:var(--red); font-size:.7rem; font-weight:800; }.maker-card b { font-size:.85rem; }.maker-card span { color:var(--blue); font-size:.68rem; font-weight:800; }

.catalog-sections { padding:22px 28px 10px; }
.flyer-section { margin-bottom:28px; scroll-margin-top:10px; }.flyer-section.kitchen { --section:var(--red); }.flyer-section.cleaning { --section:var(--blue); }.flyer-section.fun { --section:var(--purple); }.flyer-section.living { --section:var(--teal); }
.flyer-heading { padding:10px 12px; background:#f5f8fc; border-left:8px solid var(--section); border-radius:5px; }.flyer-heading p { background:var(--section); }.flyer-heading h2 { color:var(--section); }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.product-card { position:relative; overflow:hidden; background:#fff; border:1px solid var(--line); border-top:5px solid var(--section); border-radius:9px; box-shadow:0 4px 12px rgba(54,68,88,.08); }
.product-link { height:100%; display:grid; grid-template-columns:125px minmax(0,1fr); color:inherit; text-decoration:none; }.product-link:focus-visible { outline:4px solid var(--blue); outline-offset:-4px; }
.rank { position:absolute; top:7px; left:7px; z-index:2; padding:3px 7px; color:#fff; background:var(--section); border-radius:4px; font-size:.62rem; font-weight:900; }
.product-visual { min-height:265px; padding:10px; display:grid; place-content:center; position:relative; background:#fff8d7; border-right:1px solid var(--line); }.product-visual img { width:105px; height:105px; object-fit:contain; }.product-visual > span { font-size:4rem; }.product-visual b { position:absolute; right:5px; bottom:7px; left:5px; padding:5px 2px; color:#fff; background:var(--blue); border-radius:4px; text-align:center; font-size:.63rem; }
.product-copy { min-width:0; padding:11px 9px; display:flex; flex-direction:column; }.category { align-self:flex-start; margin:0; padding:2px 6px; color:#fff; background:var(--teal); border-radius:999px; font-size:.58rem; }.product-copy h3 { margin:5px 0; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow-wrap:anywhere; font-size:.88rem; line-height:1.35; }.catch { margin:2px 0 5px; color:var(--red); font-size:.72rem; font-weight:900; }.description { margin:0 0 4px; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:var(--muted); font-size:.65rem; line-height:1.45; }.shop { margin:2px 0; overflow:hidden; color:var(--muted); font-size:.58rem; white-space:nowrap; text-overflow:ellipsis; }.tags { display:flex; flex-wrap:wrap; gap:3px; list-style:none; margin:5px 0; padding:0; }.tags li { padding:1px 4px; color:#5f6d80; background:#eef2f7; border-radius:3px; font-size:.54rem; }.numbers { display:flex; gap:3px; margin-top:auto; }.numbers span { flex:1; padding:4px; color:#fff; background:var(--blue); border-radius:4px; text-align:center; font-size:.55rem; }.numbers strong { color:#fff6a9; font-size:.78rem; }.buy-row { margin-top:5px; display:flex; gap:4px; }.price { min-width:65px; display:grid; place-content:center; color:var(--red); border:1px solid #f1adb0; border-radius:4px; font-size:.58rem; text-align:center; }.buy-button { flex:1; min-height:34px; display:grid; place-content:center; padding:5px; color:#fff; background:var(--red); border-radius:4px; font-size:.63rem; font-weight:900; text-align:center; }
.notice-box { margin:0 28px 26px; padding:15px 18px; background:#eef6ff; border-left:5px solid var(--blue); border-radius:6px; }.notice-box h2 { margin:0 0 4px; font-size:1rem; }.notice-box p { margin:0; font-size:.75rem; line-height:1.6; }.notice-box small { display:block; margin-top:5px; color:var(--muted); }
footer { padding:25px 15px; color:#fff; background:var(--blue); text-align:center; }.footer-logo { color:var(--yellow); font-size:1.8rem; font-weight:900; }.footer-logo small { color:#fff; font-size:.6rem; } footer p { margin:4px; } footer nav { display:flex; justify-content:center; gap:18px; margin:12px; font-size:.75rem; } footer > small { display:block; margin-top:7px; }

@media (max-width:900px) { .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.maker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:680px) {
  .header-inner { min-height:66px; padding:9px 12px; gap:10px; }.logo { font-size:2.6rem; }.header-inner > p { font-size:.68rem; }.year-nav span { display:none; }.year-link { padding:4px 7px; }
  .catalog-lead { padding:15px 12px; grid-template-columns:1fr; gap:12px; }.catalog-lead h1 { font-size:1.9rem; }.department-nav { gap:6px; }.department-nav a { min-height:74px; padding:9px; }.department-nav b { font-size:.82rem; }
  .maker-zone,.catalog-sections { padding:16px 12px; }.maker-zone > header,.flyer-heading { align-items:flex-start; flex-wrap:wrap; gap:5px 8px; }.maker-zone > header span,.flyer-heading span { flex-basis:100%; }.maker-grid { grid-template-columns:1fr 1fr; gap:7px; }.maker-card a { grid-template-columns:58px 1fr; padding:8px; }.maker-card img { width:58px; height:58px; }
  .product-grid { grid-template-columns:1fr; gap:10px; }.flyer-section { margin-bottom:22px; }.product-link { grid-template-columns:112px minmax(0,1fr); }.product-visual { min-height:245px; }.product-visual img { width:94px; height:94px; }.notice-box { margin:0 12px 18px; }
}