@charset "utf-8";
/*==================================================
	2026AW ラインアップページ用 追加スタイル
	読み込み先：/product/leather_jac/ ほか 2026AW ラインアップ各ページ
	※このファイルは該当ページでのみ読み込むこと。
	  style.css / style_sp.css に書くと #Product の詳細度で
	  /product/（カテゴリーTOP）の .product_list.category_list まで
	  巻き込んで崩れるため、必ずページ単位の読み込みで運用する。
	※ページを追加する場合は、そのページの </head> 直前に
	  <link href="/css/lineup_2026aw.css?0911" media="all" rel="stylesheet">
	  を追記するだけでよい（このファイルの編集は不要）。
==================================================*/
/* 商品一覧（.product_list）共通
------------------------------------------------------------ */
/* 商品画像の見た目を統一。
   元画像はすべて 3:4 だが、商品の写り込み量が 60〜99% とバラバラなため、
   そのまま等幅で並べるとウェアの大きさが商品ごとに変わってしまう。
   イラレ原稿は 1 点ずつ配置倍率を変えて見た目の大きさを揃えているので、
   その倍率を img の style="--s:○○%" として持たせ、枠は 3:4 に固定する。 */
#Product .product_list > li a .img_wrap {
  position: relative;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
#Product .product_list > li a .img_wrap img {
  width: var(--s, 100%);
  height: auto;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

/* 本番写真未入稿のダミー画像ラベル
   ※撮影データ入稿後、img の差し替えと同時に span.dummy_label を削除する */
#Product .product_list > li a .img_wrap .dummy_label {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #e81f78;
  color: #fff;
  font-size: 16px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding: 8px 22px 9px;
  white-space: nowrap;
  z-index: 2;
}
@media (max-width: 899px) {
  #Product .product_list > li a .img_wrap .dummy_label {
    font-size: 13px;
    padding: 6px 16px 7px;
  }
}

/* カテゴリーバナー（ST-X / ROMAN BLACK / SMART.）
   ※2026AW改訂版の原稿ではバナーが無くなったため、
     /product/leather_jac/index.php 側は現在コメントアウト中。
     復活させる場合に備えてスタイルは残しています。 */
#Product .category_bnr_list {
  max-width: 1000px;
  margin: 0 auto 60px;
  padding: 0;
  list-style: none;
}
#Product .category_bnr_list > li {
  margin: 0;
}
#Product .category_bnr_list > li + li {
  margin-top: 30px;
}
#Product .category_bnr_list > li a {
  display: block;
}
#Product .category_bnr_list > li a img {
  width: 100%;
  height: auto;
  display: block;
}
@media (max-width: 899px) {
  #Product .category_bnr_list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto 40px;
  }
  #Product .category_bnr_list > li {
    width: calc((100% - 11px) / 2);
  }
  #Product .category_bnr_list > li + li {
    margin-top: 0;
    margin-left: 11px;
  }
  #Product .category_bnr_list > li:nth-child(2n+1) {
    margin-left: 0;
  }
  #Product .category_bnr_list > li:nth-child(n+3) {
    margin-top: 15px;
  }
}