@charset "UTF-8";
/*
 * レスポンシブユーティリティ
 */
.d-none {
  display: none !important;
}
.d-inline {
  display: inline !important;
}
.d-inline-block {
  display: inline-block !important;
}
.d-block {
  display: block !important;
}
.d-table {
  display: table !important;
}
.d-table-row {
  display: table-row !important;
}
.d-table-cell {
  display: table-cell !important;
}
.d-flex {
  display: flex !important;
}
.d-inline-flex {
  display: inline-flex !important;
}
.d-grid {
  display: grid !important;
}
@media (min-width: 768px) {
  /*
   * レスポンシブユーティリティ
   */
  .d-md-none {
    display: none !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-block {
    display: block !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-row {
    display: table-row !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
  .d-md-flex {
    display: flex !important;
  }
  .d-md-inline-flex {
    display: inline-flex !important;
  }
  .d-md-grid {
    display: grid !important;
  }
}
@media (min-width: 1200px) {
  /*
   * レスポンシブユーティリティ
   */
  .d-xl-none {
    display: none !important;
  }
  .d-xl-inline {
    display: inline !important;
  }
  .d-xl-inline-block {
    display: inline-block !important;
  }
  .d-xl-block {
    display: block !important;
  }
  .d-xl-table {
    display: table !important;
  }
  .d-xl-table-row {
    display: table-row !important;
  }
  .d-xl-table-cell {
    display: table-cell !important;
  }
  .d-xl-flex {
    display: flex !important;
  }
  .d-xl-inline-flex {
    display: inline-flex !important;
  }
  .d-grid {
    display: grid !important;
  }
}
/* ヘッダー */
#Header {
  position: sticky;
  top: 0;
  z-index: var(--zindex-header);
  height: var(--height-header);
  background: var(--color-brand-bg);
}
#Header img {
  width: 100%;
  height: auto;
}
#Header details summary::marker, #Header details summary::-webkit-details-marker {
  display: none;
}
.header__wrapper {
  position: relative;
}
.header__wrapper svg {
  width: 100%;
  height: auto;
}
.header__main-content {
  position: relative;
  z-index: var(--zindex-header);
  background: var(--color-brand-bg);
}
/* ヘッダーの内側（幅を指定するための汎用クラス） */
@media (min-width: 768px) {
  .header__inner {
    --padding-horizontal: 0rem;
    width: calc(var(--container-static) + var(--padding-horizontal) * 2);
    margin: auto;
    padding: 0 var(--padding-horizontal);
  }
}
/* 検索キーワード 入力ボックス */
.header__search-box-wrapper {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 2rem;
  gap: 1rem;
  padding: 1rem 1.2rem;
  border: solid 1px #9B9B9B;
  border-radius: 0.6rem;
  transition: box-shadow var(--transition-default);
}
@media (hover: none) {
  .header__search-box-wrapper {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .header__search-box-wrapper:active {
    border-color: var(--color-brand-main1);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active), (-moz-touch-enabled: 0), (hover: hover) {
  .header__search-box-wrapper:hover {
    border-color: var(--color-brand-main1);
  }
}
.header__search-box-wrapper:focus-within {
  box-shadow: var(--elevation-4);
}
.header__search-box-wrapper > input {
  background: transparent;
  border: none;
  font-size: 1.3rem;
  font: -webkit-control;
}
/* リンクボタン */
.header__link-button {
  --padding-vertical: 1.2rem;
  --padding-horizontal: 1.4rem;
  display: grid;
  align-items: center;
  gap: 0.65rem;
  grid-template-columns: 1.6rem auto;
  padding: var(--padding-vertical) var(--padding-horizontal);
  border: solid 1px var(--color-brand-main1);
  border-radius: 0.4rem;
  font-size: 1.3rem;
  font-weight: var(--fw-medium);
  line-height: 1;
}
.header__link-button > svg {
  width: 100%;
}
@media (hover: none) {
  .header__link-button--user {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .header__link-button--user:active {
    opacity: var(--opacity-hover);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active), (-moz-touch-enabled: 0), (hover: hover) {
  .header__link-button--user:hover {
    opacity: var(--opacity-hover);
  }
}
.header__link-button--cart svg path {
  transition: fill var(--transition-default);
}
@media (hover: none) {
  .header__link-button--cart {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .header__link-button--cart:active svg path {
    fill: var(--color-brand-main1);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active), (-moz-touch-enabled: 0), (hover: hover) {
  .header__link-button--cart:hover svg path {
    fill: var(--color-brand-main1);
  }
}
.cart-button-icon__wrapper {
  position: relative;
}
.cart-button-icon--indicator {
  position: absolute;
  top: -25%;
  right: -25%;
  width: 50%;
  aspect-ratio: 1;
  background: #FCA024;
  border-radius: 50%;
}
/* ヘッダー上部エリア */
@media (max-width: 767px) {
  /* ヘッダー上部エリア */
}
@media (min-width: 768px) {
  /* ヘッダー上部エリア */
}
@media (max-width: 767px) {
  .header__main-content {
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16);
  }
}
.header__main-content-inner {
  display: grid;
  align-items: center;
}
@media (max-width: 767px) {
  .header__main-content-inner {
    grid-template-columns: 56% 1fr;
  }
}
@media (min-width: 768px) {
  .header__main-content-inner {
    gap: 2rem;
    grid-template-columns: 38% 1fr;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media (max-width: 767px) {
  .header__main-content-container--left {
    padding: 0 1.7rem 0.6rem;
    background: #fff;
  }
}
.header__main-content-container--right {
  display: grid;
}
@media (max-width: 767px) {
  .header__main-content-container--right {
    grid-template-columns: repeat(3, 1fr);
    height: 100%;
  }
  .header__main-content-container--right > * {
    position: relative;
    display: grid;
    place-content: center;
    padding: 1.6rem;
    background: var(--color-brand-main1);
    border: none;
    border-left: solid 1px #fff;
  }
  .header__main-content-container--right > *[aria-expanded=true] svg {
    display: none;
  }
  .header__main-content-container--right > *[aria-expanded=true] > svg[data-img-name=close] {
    display: block;
  }
  .header__main-content-container--right > *[aria-expanded=false] svg {
    display: block;
  }
  .header__main-content-container--right > *[aria-expanded=false] > svg[data-img-name=close] {
    display: none;
  }
}
@media (min-width: 768px) {
  .header__main-content-container--right {
    align-items: center;
    grid-template-columns: 1fr auto auto;
    gap: 1rem;
  }
  .header__main-content-container--right > div[id*=UpdatePanel] {
    display: none;
  }
}
/* ヘッダー メインメニュー */
@media (max-width: 767px) {
  /* ヘッダー メインメニュー */
}
@media (min-width: 768px) {
  /* ヘッダー メインメニュー */
}
.header__navigation-content--main-menu {
  --icon-arrow: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228.384%22%20height%3D%2214.768%22%20viewBox%3D%220%200%208.384%2014.768%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_2001%22%20data-name%3D%22%E3%83%91%E3%82%B9%202001%22%20d%3D%22M318.536%2C184.406a1%2C1%2C0%2C0%2C1-.707-1.707l5.677-5.677-5.677-5.677a1%2C1%2C0%2C0%2C1%2C1.414-1.414l6.384%2C6.384a1%2C1%2C0%2C0%2C1%2C0%2C1.414l-6.384%2C6.384A1%2C1%2C0%2C0%2C1%2C318.536%2C184.406Z%22%20transform%3D%22translate(-317.536%20-169.638)%22%20fill%3D%22%23332828%22%2F%3E%3C%2Fsvg%3E");
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu {
    height: calc(100vh - var(--height-header, 60px));
    height: calc(100dvh - var(--height-header, 60px));
    padding: 2rem 1.5rem;
    background: var(--color-brand-bg);
    overflow-y: auto;
    overscroll-behavior: contain;
    translate: 0 -100%;
    transition: translate var(--transition-default);
  }
  .header__navigation-content--main-menu.isActive {
    translate: 0 0;
  }
  .header__navigation-content--main-menu .header__link-button {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto 2rem;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu {
    position: relative;
    display: block !important;
    background: var(--color-brand-main1);
  }
}
.header__navigation-content--main-menu .header__navigation-content-inner {
  display: grid;
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .header__navigation-content-inner {
    gap: 1rem;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .header__navigation-content-inner {
    grid-template-columns: repeat(5, 1fr);
  }
}
.header__navigation-content--main-menu .main-menu-item {
  position: relative;
  display: grid;
  place-items: center;
  font-weight: var(--fw-bold);
}
.header__navigation-content--main-menu .main-menu-item > * {
  font-size: inherit;
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item {
    grid-template-columns: 1fr 0.8rem;
    gap: 0.5rem;
    justify-items: flex-start;
    padding: 1.6rem 2rem;
    border-radius: 0.6rem;
    background: url(/Contents/ImagesPkg/Header/texture.jpg);
    background-position: center;
    font-size: 1.8rem;
    line-height: 1.5;
  }
  .header__navigation-content--main-menu .main-menu-item::after {
    content: "";
    width: 0.8rem;
    aspect-ratio: 8.3/14.7;
    background-image: var(--icon-arrow);
    background-repeat: no-repeat;
    background-size: contain;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .main-menu-item {
    padding: 1.3rem 0;
    color: #fff;
    font-size: 1.6rem;
    line-height: 1;
  }
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item__accordion {
    background: url(/Contents/ImagesPkg/Header/texture.jpg);
    border-radius: 0.6rem;
  }
  .header__navigation-content--main-menu .main-menu-item__accordion .main-menu-item::after {
    transform: rotate(0.25turn);
    transition: transform var(--transition-default);
  }
  .header__navigation-content--main-menu .main-menu-item__accordion[open] .main-menu-item::after {
    transform: rotate(0.75turn);
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .main-menu-item__accordion .main-menu-item__accordion-contents {
    z-index: -1;
    transition: translate var(--transition-default);
    translate: 0 -100%;
  }
  .header__navigation-content--main-menu .main-menu-item__accordion.isActive .main-menu-item__accordion-contents {
    translate: 0 0;
  }
  .header__navigation-content--main-menu .main-menu-item__accordion.isActive .main-menu-item__bg {
    opacity: 1;
  }
  .header__navigation-content--main-menu .main-menu-item__accordion.isActive summary.main-menu-item::after {
    opacity: 1;
  }
}
.header__navigation-content--main-menu .main-menu-item__accordion-contents-inner {
  display: grid;
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-contents-inner {
    gap: 1.5rem;
    padding: 2rem;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-contents {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: var(--color-brand-bg);
    overflow: hidden;
  }
  .header__navigation-content--main-menu .main-menu-item__accordion-contents-inner {
    gap: 4%;
    grid-template-columns: repeat(5, auto);
    padding: 3rem var(--padding-horizontal) 4rem;
  }
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content {
    padding: 2rem;
    background: var(--color-brand-bg);
    border-radius: 0.6rem;
  }
}
.header__navigation-content--main-menu .main-menu-item__accordion-content-text--title {
  display: grid;
  align-items: center;
  gap: 1rem;
  grid-template-columns: 6rem auto;
  margin-bottom: 1.4rem;
  padding-bottom: 1.4rem;
  border-bottom: solid 1px var(--color-brand-font-main);
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--title {
    font-size: 1.8rem;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--title {
    font-size: 1.6rem;
  }
}
.header__navigation-content--main-menu .main-menu-item__accordion-content-text--link {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 0.8rem;
  gap: 0.5rem;
  font-weight: var(--fw-medium);
  line-height: 1.4;
}
.header__navigation-content--main-menu .main-menu-item__accordion-content-text--link::after {
  content: "";
  width: 0.8rem;
  aspect-ratio: 8/14;
  background-image: var(--icon-arrow);
  background-size: contain;
  background-repeat: no-repeat;
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--link {
    font-size: 1.8rem;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--link {
    font-size: 1.4rem;
  }
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--link::after {
    opacity: 0;
    translate: -40% 0;
    transition: opacity var(--transition-default), translate var(--transition-default);
  }
}
@media (min-width: 768px) and (hover: none) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--link {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--link:active::after {
    opacity: 1;
    translate: 0 0;
  }
}
@media (min-width: 768px) and (-ms-high-contrast: none), (min-width: 768px) and (-ms-high-contrast: active), (min-width: 768px) and (-moz-touch-enabled: 0), (min-width: 768px) and (hover: hover) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-text--link:hover::after {
    opacity: 1;
    translate: 0 0;
  }
}
.header__navigation-content--main-menu .main-menu-item__accordion-content-list {
  display: grid;
}
@media (max-width: 767px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-list {
    gap: 1.7rem;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu .main-menu-item__accordion-content-list {
    gap: 1rem;
  }
}
.header__navigation-content--main-menu .main-menu-item__bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: opacity var(--transition-default);
  pointer-events: none;
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu a.main-menu-item {
    grid-template-columns: 1fr auto 1fr;
  }
  .header__navigation-content--main-menu a.main-menu-item::before, .header__navigation-content--main-menu a.main-menu-item::after {
    content: "";
    opacity: 0;
    translate: -40% 0;
    transition: opacity var(--transition-default), translate var(--transition-default);
  }
  .header__navigation-content--main-menu a.main-menu-item::after {
    width: 0.8rem;
    aspect-ratio: 8/13;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%227.563%22%20height%3D%2213.127%22%20viewBox%3D%220%200%207.563%2013.127%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_784%22%20data-name%3D%22%E3%83%91%E3%82%B9%20784%22%20d%3D%22M-16504.941-16847.771a1%2C1%2C0%2C0%2C1-.707-.293%2C1%2C1%2C0%2C0%2C1%2C0-1.414l4.855-4.855-4.855-4.857a1%2C1%2C0%2C0%2C1%2C0-1.414%2C1%2C1%2C0%2C0%2C1%2C1.414%2C0l5.563%2C5.564a1%2C1%2C0%2C0%2C1%2C0%2C1.414l-5.562%2C5.563A1%2C1%2C0%2C0%2C1-16504.941-16847.771Z%22%20transform%3D%22translate(16505.941%2016860.898)%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-size: contain;
  }
}
@media (min-width: 768px) and (hover: none) {
  .header__navigation-content--main-menu a.main-menu-item {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .header__navigation-content--main-menu a.main-menu-item:active::after {
    opacity: 1;
    translate: 0 0;
  }
}
@media (min-width: 768px) and (-ms-high-contrast: none), (min-width: 768px) and (-ms-high-contrast: active), (min-width: 768px) and (-moz-touch-enabled: 0), (min-width: 768px) and (hover: hover) {
  .header__navigation-content--main-menu a.main-menu-item:hover::after {
    opacity: 1;
    translate: 0 0;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu summary.main-menu-item {
    cursor: pointer;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .header__navigation-content--main-menu summary.main-menu-item {
    pointer-events: none;
  }
}
@media (min-width: 768px) and (min-width: 768px) and (hover: none) {
  .header__navigation-content--main-menu summary.main-menu-item {
    pointer-events: auto;
  }
}
@media (min-width: 768px) {
  .header__navigation-content--main-menu summary.main-menu-item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 2px;
    background: #FFEF34;
    opacity: 0;
    transition: opacity var(--transition-default);
    pointer-events: none;
  }
}
.header__navigation-content--main-menu .m-link__container {
  margin-top: 5rem;
}
.header__navigation-content--search-window {
  position: absolute;
  top: var(--height-header, 60px);
  left: 0;
  width: 100%;
}
.header__navigation-content--search-window .header__search-box-outer {
  position: relative;
  z-index: 2;
  padding: 2rem 1.5rem;
  background: var(--color-brand-bg);
  translate: 0 -100%;
  transition: translate var(--transition-default);
}
.header__navigation-content--search-window.isActive .header__search-box-outer {
  translate: 0 0;
}
.header__navigation-content--search-window .header__search-box-wrapper {
  background: var(--color-brand-bg);
  border-radius: 2.5rem;
  font-size: 16px;
}
.header__navigation-content--search-window-bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  transition: opacity var(--transition-default);
}
.header__navigation-content--search-window.isActive .header__navigation-content--search-window-bg {
  opacity: 1;
}
#FooterElement {
  padding: 4rem;
  background: url(/Contents/ImagesPkg/Header/texture.jpg), var(--color-brand-main1);
  background-blend-mode: multiply;
  background-size: cover;
  color: #fff;
}
#FooterElement path {
  fill: #fff;
}
#FooterElement path#play {
  fill: var(--color-brand-main1);
}
#FooterElement svg {
  width: 100%;
  height: auto;
}
.footer__inner {
  text-align: center;
}
.footer__inner .m-link__container {
  justify-content: center;
  font-size: 1rem;
  letter-spacing: 0;
}
@media (min-width: 768px) {
  .footer__inner .sns-link__list {
    justify-content: center;
  }
}
@media (hover: none) {
  .footer__inner .sns-link__list-item {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .footer__inner .sns-link__list-item:active path {
    fill: #d6d6d6 !important;
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active), (-moz-touch-enabled: 0), (hover: hover) {
  .footer__inner .sns-link__list-item:hover path {
    fill: #d6d6d6 !important;
  }
}
@media (min-width: 768px) {
  .footer__inner .static-page-link__list {
    display: flex !important;
  }
  .footer__inner .static-page-link__list > li:not(:last-of-type) {
    position: relative;
  }
  .footer__inner .static-page-link__list > li:not(:last-of-type)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    height: 100%;
    margin: auto;
    background: #fff;
  }
}
@media (hover: none) {
  .footer__inner .static-page-link__list-item {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .footer__inner .static-page-link__list-item:active {
    color: #d6d6d6;
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active), (-moz-touch-enabled: 0), (hover: hover) {
  .footer__inner .static-page-link__list-item:hover {
    color: #d6d6d6;
  }
}
@media (min-width: 768px) {
  .footer__inner .static-page-link__list-item {
    line-height: 1 !important;
  }
  .footer__inner .static-page-link__list-item > a {
    padding: 0 2rem;
  }
}
.footer__text--copyright {
  display: inline-block;
  margin-top: 4rem;
  text-align: center;
}
/* ===============================================
  * Utility *
=============================================== */
/* ===============================================
  * ヘッダー *
=============================================== */
/* ===============================================
  * フッター *
=============================================== */
/* ===============================================
  * 共通 *
=============================================== */
.m-link__container {
  display: grid;
  gap: 2rem;
}
.m-link__container .sns-link__list {
  display: grid;
  grid-template-columns: repeat(4, 3.6rem);
  gap: 1.4rem;
}
.m-link__container .static-page-link__list {
  display: grid;
}
.m-link__container .static-page-link__list-item {
  font-size: 1.4rem;
  line-height: 2.1;
}