@charset "utf-8";
/*
 * Claytive 特設（#543）で、本番 apex の style0708.css に未反映な指定を上書きする。
 * 正は代理店テスト環境 https://shotsu.co.jp/test/agatsuma.co.jp/special/sanrio/claytive/ 。
 * 本番の style0708.css の後に読み込むこと（ソース順で勝たせている）。
 *
 * - #reason の背景 wave（wavebg_pc4.png / center top / cover）
 * - #reason の下パディング（本番 13.02% -> テスト環境 22.02%）
 * - SP の .arrange-list 上マージン
 *
 * wavebg_pc4.png は本番旧サーバーに無いので、このファイルと同じ特設ディレクトリから読む。
 * texture_noise / wavebg_sp は従来どおり旧サーバー配信。
 */

/*
 * 本番の style0708.css は #reason の padding-bottom が 13.02% のまま。
 * 代理店テスト環境では 22.02% に変更されているため、ここで下方向のみ上書きする。
 */
#reason {
  padding-bottom: 22.02%;
}

#reason {
  background-image: url("../img/wavebg_pc4.png"),
    linear-gradient(0deg, rgba(255, 255, 255, 0) 40%, #fff8a0 50%),
    url("https://agatsuma.co.jp/special/sanrio/claytive/img/texture_noise.jpg"),
    linear-gradient(#64d7fa, #64d7fa);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat, repeat, repeat, repeat;
  background-blend-mode: normal, normal, soft-light, normal;
}

@media all and (min-width: 1121px) and (max-width: 1600px) {
  #reason {
    background-image: url("../img/wavebg_pc4.png"),
      linear-gradient(0deg, rgba(255, 255, 255, 0) 40%, #fff8a0 50%),
      url("https://agatsuma.co.jp/special/sanrio/claytive/img/texture_noise.jpg"),
      linear-gradient(#64d7fa, #64d7fa);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat, repeat, repeat, repeat;
    background-blend-mode: normal, normal, soft-light, normal;
  }
}

@media all and (min-width: 750px) and (max-width: 1120px) {
  #reason {
    background-image: url("../img/wavebg_pc4.png"),
      linear-gradient(0deg, rgba(255, 255, 255, 0) 40%, #fff8a0 50%),
      url("https://agatsuma.co.jp/special/sanrio/claytive/img/texture_noise.jpg"),
      linear-gradient(#64d7fa, #64d7fa);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat, repeat, repeat, repeat;
    background-blend-mode: normal, normal, soft-light, normal;
  }
}

@media screen and (max-width: 749px) {
  #reason {
    background-image: url("https://agatsuma.co.jp/special/sanrio/claytive/img/wavebg_sp.png"),
      linear-gradient(0deg, rgba(255, 255, 255, 0) 40%, #fff8a0 50%),
      url("https://agatsuma.co.jp/special/sanrio/claytive/img/texture_noise.jpg"),
      linear-gradient(#64d7fa, #64d7fa);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat, repeat, repeat, repeat;
    background-blend-mode: normal, normal, soft-light, normal;
  }
}

/* arrange スライダーの上マージン。本番 style0708.css は margin: 0 auto 30px */
@media screen and (max-width: 749px) {
  #reason .arrange-list {
    margin: 100px auto 30px;
  }
}