@charset "UTF-8";
/* 商品詳細ページ 素材／サイズ／価格／レビュー タブUI */
.detailTab{margin-bottom:80px}
.detailTabNav{display:flex;flex-wrap:wrap;gap:6px;border-bottom:3px solid #666666;margin-bottom:40px;padding:0}
.detailTabNav li{flex:1 1 0;min-width:90px;text-align:center;padding:18px 10px;font-size:2.2rem;font-weight:700;color:#999;background:#eee;border-radius:10px 10px 0 0;cursor:pointer;transition:color .2s,background .2s;user-select:none;list-style:none}
.detailTabNav li:hover{color:#666666}
.detailTabNav li.active{color:#fff;background:#666666}
.detailTabPanel{display:none}
.detailTabPanel.active{display:block}
/* 非表示パネル内のテーブルも横スクロール可能にする */
.detailTabPanel .js-scrollable{overflow-x:auto}
.detailTab .tabNote{font-size:1.6rem;color:#555;margin-bottom:20px}
/* レビュー画像ギャラリー */
.reviewImages{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px;padding:0;list-style:none}
.reviewImages li{width:calc((100% - 48px) / 4)}
.reviewImages li a{display:block}
.reviewImages li img{width:100%;height:auto;border:1px solid #ddd;cursor:zoom-in}
@media (max-width:767px){
  .reviewImages{gap:10px}
  .reviewImages li{width:calc((100% - 10px) / 2)}
}
@media (max-width:991px){
  .detailTabNav li{font-size:1.8rem;padding:14px 8px}
  .detailTab .tabNote{font-size:1.5rem}
}
@media (max-width:767px){
  .detailTab{margin-bottom:40px}
  .detailTabNav{margin-bottom:20px;gap:4px}
  .detailTabNav li{font-size:1.4rem;padding:10px 4px;min-width:0;border-radius:6px 6px 0 0}
  .detailTab .tabNote{font-size:1.3rem}
}