@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap");
body {
  font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic,
    "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo,
    "MS Pゴシック", "MS PGothic", sans-serif;
}
a {
  transition: 0.3s;   
}
a:hover {
  opacity: 0.7;
}

.u-text--head {
  color: #333433 !important;
  font-size: 24px !important;
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
  font-weight: bold;
}
.u-color--head {
  color: #333433 !important;
}
.u-text--subhead {
  color: #333433 !important;
  font-size: 17px !important;
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
  font-weight: bold;
}
.u-text--body {
  color: #333433 !important;
  font-size: 13px !important;
}
.u-text--strong {
  color: #333433 !important;
  font-size: 13px !important;
}
.u-text--link {
  color: #584C9D !important;
  font-size: 13px !important;
}
.u-text--head--overlay {
  color: #333433 !important;
  font-size: 24px !important;
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
  font-weight: bold;
}
.u-text--subhead--overlay {
  color: #333433 !important;
  font-size: 17px !important;
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
  font-weight: bold;
}
.u-text--body--overlay {
  color: #333433 !important;
  font-size: 13px !important;
}
.u-text--color--overlay {
  color: #333433 !important;
}
.u-color__btn--bg {
  background: linear-gradient(180deg, #584C9D -55%, #C86DD7 130%);
}
.u-color__btn--bg--overlay {
  background: linear-gradient(180deg, #584C9D -55%, #C86DD7 130%);
}
.u-color__btn {
  color: #584C9D !important;
}
.u-text--btn {
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: bold !important;
  border-radius: 8px;
}
.u-text--btn--overlay {
  color: #ffffff !important;
  font-size: 13px !important;
}
.u-color__btn--text {
  color: #ffffff !important;
}
.u-color__btn--text--bg {
  background: #212121 !important;
}
.u-text--input {
  color: #333433 !important;
  font-size: 13px !important;
}
.u-text--input::placeholder {
  color: #666666 !important;
}
.u-color--input {
  color: #666666 !important;
}
.u-color__input--bg {
  background: #ffffff !important;
}
.u-color__border--input {
  border-color: #DCDCDC !important;
}
.u-color__bg--base {
  background: #ffffff !important;
}
.u-color__bg--main {
  background: #ffffff !important;
}
.u-color__border--border {
  border-color: #DCDCDC !important;
}
.u-color__border--main {
  border-color: #DCDCDC !important;
}
.u-font--head {
  font-size: 24px !important;
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
  font-weight: bold;
}
.u-font--subhead {
  font-size: 17px !important;
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
  font-weight: bold;
}
.u-font--body {
  font-size: 13px !important;
}
.u-font--bold {
  font-weight: bold;
}

.c-breadcrumbs {
  background: #F8F8F8;
  box-shadow: 0px 2px 2px 0px #0000001A;
}

.c-product_item__actions .c-product_item__form--favorite {
  display: inline-block;
}
.c-product_item__actions .c-product_item__form--cart {
  display: inline-block;
}

/*================ Fonts ================*/

/*================ Headings ================*/
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-family: Hiragino Sans, BIZ UDPGothic Alphabet, BIZ UDGothic, Meiryo,
    sans-serif;
}

/*================ Variables ================*/
:root {
  --color-text-head: #333433;
  --color-text-body: #333433;
  --color-text-overlay: #333433;
  --color-text-link: #584C9D;
  --color-btn-bg: #584C9D;
  --color-btn-text: #212121;
  --color-input-text: #424242;
  --color-input-border: #474747;
  --color-page-bg: #ffffff;
  --color-page-border: #DCDCDC;

  --font-size-text-head: 24px;
  --font-size-text-subhead: 17px;
  --font-size-text-body: 13px;
  --font-size-text-link: 13px;
}

.c-steps_to_order--theme {
  --theme-color: var(--color-btn-bg) !important;
  --text-color: var(--color-btn-text) !important;
}

.p-movie--theme {
  --theme-color: var(--color-btn-bg);
}