/* ギア研究所のページ（/gear/）だけで読む（v0.1.18。元：デザイン/ギア研究所ページ案_2026-10-21/page.css） */
/* ギア研究所の専用ページ（/gear/ の案。2026-10-21 夜）。色・字体はトップの style.css の変数を使う */
.gp-pr{font-size:13px;color:#fff;opacity:.92;margin:8px 0 0}
.gp-pr .sg-rank__pr{vertical-align:1px}
.gp-shop .sec-hd{margin-bottom:12px}
.gp-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:20px;align-items:start}
.gp-nav{position:sticky;top:76px;border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--white)}
.gp-nav__hd{font-size:12px;font-weight:900;color:var(--gray);margin:8px 4px 4px}
.gp-nav__hd:first-child{margin-top:0}
.gp-nav__g{display:flex;flex-direction:column;gap:2px}
.gp-nav [role="tab"]{font:inherit;font-size:14px;font-weight:700;text-align:left;padding:9px 12px;min-height:40px;border:0;border-radius:8px;background:transparent;color:var(--text);cursor:pointer}
.gp-nav [role="tab"]:hover{background:var(--turf-pale)}
.gp-nav [role="tab"][aria-selected="true"]{background:var(--turf-dark);color:#fff}
.gp-nav [role="tab"]:focus-visible{outline:3px solid var(--sand);outline-offset:1px}
html:not(.gp-js) .gp-nav{display:none}
html:not(.gp-js) .gp-layout{grid-template-columns:minmax(0,1fr)}
html:not(.gp-js) .gp-panel[hidden]{display:block}
.gp-panel{min-width:0;margin:0 0 24px}
.gp-phd{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;border-bottom:2px solid var(--turf);padding-bottom:6px;margin-bottom:10px}
.gp-phd h3{font-size:20px;font-weight:900;color:var(--turf-dark);margin:0}
.gp-phd h3 .sg-rank__pr{margin-left:8px;vertical-align:3px}
.gp-phd p{font-size:12px;color:var(--gray);margin:0}
.gp-filter{border:1px solid var(--line);border-radius:10px;padding:10px 14px 12px;background:var(--white);margin:10px 0 14px}
.gp-filter__hd{font-size:12px;color:var(--gray);margin:0}
.gp-frow{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px;align-items:start;padding:6px 0;border-bottom:1px dashed var(--line)}
.gp-frow:last-child{border-bottom:0}
.gp-frow .gx-lb{margin:8px 0 0}
.gp-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.gp-prod{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--white);min-width:0}
.gp-prod:hover{border-color:var(--turf);box-shadow:0 6px 16px rgba(15,81,50,.08)}
.gp-prod__no{position:absolute;top:8px;left:8px;width:28px;height:28px;border-radius:50%;background:var(--turf-dark);color:#fff;font-weight:900;font-size:13px;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums;z-index:1}
.gp-prod:nth-child(-n+3) .gp-prod__no{background:var(--sand);color:var(--text)}
.gp-prod__img{display:block;aspect-ratio:1/1;margin:0 0 8px}
.gp-prod__img img{width:100%;height:100%;object-fit:contain;display:block}
.gp-prod__nm{font-size:13px;font-weight:700;line-height:1.5;color:var(--text);text-decoration:none;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:4.5em}
.gp-prod__nm:hover{color:var(--turf-dark);text-decoration:underline}
.gp-prod__shop{display:block;font-size:11px;color:var(--gray);margin:4px 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gp-prod .sg-rank__price{font-size:17px;font-weight:900;margin-top:auto}
.gp-prod .sg-rank__price small{font-size:12px;color:var(--text);margin-left:1px}
.gp-prod .sg-rank__price small.sg-item__when{display:block;font-size:10px;font-weight:400;color:var(--gray);margin:0}
.gp-prod .sg-item__btn{display:block;text-align:center;font-size:13px;padding:8px 6px;margin-top:6px}
.gp-more .gx-band:first-of-type{margin-top:0}
@media (max-width:1100px){.gp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){.gp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){
  .gp-layout{grid-template-columns:minmax(0,1fr)}
  .gp-nav{position:sticky;top:56px;z-index:5;display:flex;gap:6px;overflow-x:auto;padding:8px;border-radius:0;border-left:0;border-right:0;margin:0 -16px}
  .gp-nav__hd{display:none}
  .gp-nav__g{flex-direction:row;gap:6px}
  .gp-nav [role="tab"]{flex:0 0 auto;border:1px solid var(--turf-dark);border-radius:999px;color:var(--turf-dark);min-height:44px;padding:8px 14px}
  .gp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .gp-frow{grid-template-columns:minmax(0,1fr);gap:2px}
  .gp-frow .gx-lb{margin:4px 0 2px}
}
@media (max-width:480px){.gp-filter .gx-chips a{min-height:44px}}
/* チェック係の直し（10/21 夜）：メーカー名の行・スマホの字と押す所・止まる位置（スマホのヘッダーは高さ 99px） */
.gp-prod__mk{display:inline-block;align-self:flex-start;font-size:12px;font-weight:900;color:var(--turf-dark);background:var(--turf-pale);border-radius:3px;padding:1px 6px;margin:0 0 4px}
.gp-prod__shop{font-size:12px}
.gp-phd p,.gp-filter__hd{font-size:13px;color:var(--text)}
.gp-prod .sg-rank__price small.sg-item__when{font-size:11px}
@media (max-width:760px){
  .gp-nav{top:99px;box-shadow:inset -18px 0 12px -12px rgba(15,81,50,.25)}
  .gx-chips{gap:8px}
  .gx-chips a{min-height:44px}
  .gp-prod__nm{font-size:14px}
  .gp-prod .sg-rank__price small.sg-item__when{font-size:12px}
  .gp-prod .sg-item__btn{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:14px}
}
.gp-prod .sg-rank__price small.sg-item__when{font-size:12px}
/* サイトの上での絞り込み（10/21 夜）：絞り込みは上、商品の格子は下 */
.gp-panel .gf-stat{margin-top:2px}
.gp-panel .gf-out{min-height:200px}
@media (max-width:760px){.gp-nav__g{flex:0 0 auto}}