@charset "UTF-8";
/*
kisake a_001 Parts Stylesheet
Last Updated: 2026-04-28
Author: TakakoTaniguchi
URL: https://kisekae.space/
Create: https://www.taniweb.jp/
*/

body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='200'%3E%3Ctext x='50%25' y='50%25' text-anchor='middle' dominant-baseline='middle' transform='rotate(-30 150 100)' font-size='36' font-weight='900' fill='rgba(0,0,0,0.07)' font-family='sans-serif'%3ESAMPLE%3C/text%3E%3C/svg%3E");
  background-repeat: repeat;
  pointer-events: none;
  z-index: 9999;
}

/* ===========================
       色書体
    =========================== */
:root {
  --color-surface: #f8f8ea; /* カード背景 */
  --color-border: #e0ddd8; /* 区切り線 */
  --color-accent: #131e5a; /* アクセントカラー */
  --color-navhover: #7589d2; /* gnavhover */
  --color-text-secondary: #666660; /* サブテキスト */
  --color-text-date: #999993; /* 日付テキスト */
  --color-price: #3a2a1e; /* 価格テキスト */
  --color-text-h2: #474449; /* 価格テキスト */
  --color-text-h2w: white; /* 価格テキスト */

  /* バッジカラー（差し替え用） */
  --badge-recommend-bg: #c8400a; /* おすすめ！ */
  --badge-recommend-text: #ffffff;
  --badge-season-bg: #2e7d52; /* 季節限定！ */
  --badge-season-text: #ffffff;
  --badge-new-bg: #c9731c; /* NEW */
  --badge-new-text: #ffffff;
  --badge-soldout-bg: #aaa49c; /* 売り切れ */
  --badge-soldout-text: #ffffff;

  /* 書体 */
  --heading-font: "Hubballi", sans-serif;
  --title-font: "M PLUS Rounded 1c", sans-serif;

  --radius-card: 6px;
  --radius-thumb: 4px;
  --thumb-w: 200px; /* PC サムネイル幅 */
  --thumb-h: 130px; /* PC サムネイル高さ */
  --thumb-h-sp: 200px; /* SP サムネイル高さ */

  --transition-base: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.07);
  --shadow-card-hover: 0 6px 24px rgba(0, 0, 0, 0.12);

  --font-sans: "DM Sans", "Noto Sans JP", sans-serif;
  --font-jp: "Noto Sans JP", sans-serif;

  --thumb-size: 90px; /* サムネイルサイズ（正方形） */
  --radius-badge: 2px;
  --transition-base: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===========================
       使用書体　以下参考に記載
    =========================== */

.hubballi-regular {
  font-family: "Hubballi", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.m-plus-rounded-1c-regular {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* ===========================
       書体
    =========================== */

h2.title_standard {
  font-family: var(--heading-font);
  color: var(--color-accent);
  text-align: center;
  font-size: 48px; /* IE8以下とAndroid4.3以下用フォールバック */
  font-size: calc(3rem + (1vw - 0.64rem) * 0.7143);
  line-height: 1.3;
  margin-bottom: 48px;
}

h2.title_standard span {
  font-family: var(--title-font);
  display: block;
  color: var(--color-accent);
  text-align: center;
  font-size: 0.5rem; /* IE8以下とAndroid4.3以下用フォールバック */
  font-size: calc(1rem + (1vw - 0.64rem) * 0.7143);
  line-height: 1.3;
}

h2.title_standard_white {
  font-family: var(--heading-font);
  color: var(--color-text-h2w);
  text-align: center;
  font-size: 48px; /* IE8以下とAndroid4.3以下用フォールバック */
  font-size: calc(3rem + (1vw - 0.64rem) * 0.7143);
  line-height: 1.3;
  margin-bottom: 48px;
}

h2.title_standard_white span {
  font-family: var(--title-font);
  display: block;
  color: var(--color-text-h2w);
  text-align: center;
  font-size: 0.5rem; /* IE8以下とAndroid4.3以下用フォールバック */
  font-size: calc(1rem + (1vw - 0.64rem) * 0.7143);
  line-height: 1.3;
}

/* ===========================
       文字色
    =========================== */

.white_txt {
  color: var(--color-text-h2w);
}

.design a {
  font-size: small;
  color: var(--color-text-h2w);
}