@charset "utf-8";

/*____________________________________________________________________________

locondoweb2 用 CSS変数

____________________________________________________________________________*/

:root {
  /* メインカラー */
  --main-color: #333;

  /* テキスト */
  --text: #333;
  --text-light: #666;
  --text-lighter: #999;

  /* 返品交換メッセージ「不可」強調色 (ITCRE-54) */
  --returnable-ng: #ED143D;

  --sale-color: #FF0030;

  /* Background */
  --bg: #ddd;
  --bg-light: #f0f0f0;

  /* フォントサイズ */
  --font-xs: 11px;
  --font-s: 14px;
  --font-m: 16px;
  --font-l: 18px;

  /* レイアウト */
  --header-height: 60px;

  /* 商品ユニットのアイコンの行と、割引とクーポンの札の行の上下の間（左右は 0）。
     アイコンの行は catalogList_template.css、札の行は campaignGroup.css が読む */
  --label-gap: 2px;

  @media screen and (max-width: 768px) {
    /* フォントサイズ */
    --font-xs: 11px;
    --font-s: 14px;
    --font-m: 16px;
    --font-l: 18px;
  }

}

.site_fashionwalker{
  --main-color: #01C3CF;
}
.site_magaseek{
  --main-color: #8bc34a;
}
.site_brandeli{
  --main-color: #0073c6;
}
.site_reebok{
  --main-color: #244496;
}
.site_descente,
.site_descentefes{
  --sale-color: #C62831;
}
.site_duvetica,
.site_fascinate,
.site_steady{
  --ratio: 2 / 3;
  --ratio-inverse: 3 / 2;
}
.site_brandeli,
.site_fashionwalker,
.site_fineoutlet,
.site_mango,
.site_waja{
  --ratio: 5 / 7;
  --ratio-inverse: 7 / 5;
}
.site_descente,
.site_descentefes,
.site_docomo,
.site_durban,
.site_kuipo,
.site_lapine,
.site_magaseek,
.site_orobianco,
.site_underarmour{
  --ratio: 5 / 6;
  --ratio-inverse: 6 / 5;
}
.site_harleydavidson{
  --ratio: 8 / 7;
  --ratio-inverse: 7 / 8;
}

/* 返品交換メッセージ「不可」強調色 (ITCRE-54)
   jade 管轄サイトのみで使う。未定義サイトは :root の既定 (#ED143D)。
   旧 .returnable-text のサイト別全体着色（content-product-koichi.css）から移設 */
.site_reebok{
  --returnable-ng: #E41D18;
}
.site_bluesc{
  --returnable-ng: #d00;
}
.site_descente {
  --sale-color: #C62831;
}
.site_lapine {
  --sale-color: #DF321B;
}
.site_magaseek {
  --sale-color: var(--color-accent-red);
}
.site_bluesc,
.site_raboki {
  --sale-color: #DD0000;
}
.site_durban {
  --sale-color: #B81A1B;
}
.site_fascinate {
  --sale-color: #E1244A;
}
.site_harleydavidson {
  --sale-color: #AD4C0B;
}
.site_mej {
  --sale-color: #DD0000;
}
.site_orobianco {
  --sale-color: #B81A1B;
}
.site_starcrea {
  --sale-color: #CB232E;
}

/* 商品ユニットのブランド名を出すサイト（otsuka は SP だけ） */
.site_brandeli,
.site_danyu,
.site_descente,
.site_descentefes,
.site_durban,
.site_fascinate,
.site_fashionwalker,
.site_fineoutlet,
.site_harmony,
.site_kuipo,
.site_lapine,
.site_magaseek,
.site_mej,
.site_modaclea,
.site_raboki,
.site_royal,
.site_samantha,
.site_stt,
.site_sws,
.site_uf,
.site_unbillion,
.site_waja {
  --brand-display: block;
}
@media (max-width: 769px) {
  .site_otsuka {
    --brand-display: block;
  }
}
/* 商品ユニットの文字を中央揃えにするサイト（PC） */
.site_abe,
.site_danyu,
.site_duvetica,
.site_evol,
.site_fineoutlet,
.site_ido,
.site_jayjay,
.site_mango,
.site_mej,
.site_modaclea,
.site_oasys,
.site_otsuka,
.site_raboki,
.site_uf,
.site_unbillion {
  --text-align: center;
}
