@charset "UTF-8";
/* box-sizingとtext-size-adjustとimgの基本スタイルはreset.cssで定義するため重複を避ける */
body {
  margin: var(--space-0);
  background: var(--semantic-background-base);
  color: var(--semantic-text-primary);
  font-family: var(--font-family-jp);
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  text-rendering: optimizeLegibility;
}

/* 全画像とSVGの選択操作を共通で無効化する */
img,
svg,
object[type="image/svg+xml"] {
  -webkit-user-select: none;
  user-select: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
figcaption,
ol,
ul,
menu,
dl,
dd {
  padding: var(--space-0);
  margin: var(--space-0);
}

/* 図版説明は上揃えを基本とし、Grid内の余剰高さも上側へ寄せる */
:where(figure:has(> figcaption)) {
  align-content: start;
}

figcaption {
  align-self: start;
  align-content: start;
}

ol,
ul,
menu {
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
}

/* リンクとボタンの色状態は共通モーションで連続的に切り替える */
@media (prefers-reduced-motion: no-preference) {
  :where(a, button) {
    transition: color var(--motion-duration) var(--motion-easing), background-color var(--motion-duration) var(--motion-easing), border-color var(--motion-duration) var(--motion-easing), box-shadow var(--motion-duration) var(--motion-easing);
  }
}
button,
input,
select,
textarea {
  padding: var(--space-0);
  border: var(--space-0);
  margin: var(--space-0);
  background: transparent;
  color: inherit;
  font: inherit;
}

button {
  cursor: pointer;
}

:focus-visible {
  outline: var(--layout-focus-width) solid var(--semantic-border-focus);
  outline-offset: var(--layout-focus-offset);
}

/* 規定のButtonコンポーネントだけは自身のFocus状態で示し 外周リングを重ねない */
.c-button:focus-visible {
  outline: none;
}

[hidden] {
  display: none;
}

@media (forced-colors: active) {
  :focus-visible {
    outline-color: Highlight;
  }
}
svg {
  display: block;
  max-inline-size: var(--ratio-full);
}

/* SVGアンカーはOS固有outlineを出さず 各SVGの規定フォーカス表示だけを使用する */
svg a:focus-visible {
  outline: none;
}

/* ページ全体ではoverflowを制限しない クリップは必要なコンポーネント自身で行う */
/* サイト共通の基本配置 内容が短い場合もFooter終端を画面下端へ揃える */
body:has(> main):has(> .l-footer) {
  display: flex;
  flex-direction: column;
  min-block-size: 100dvh;
}
body:has(> main):has(> .l-footer) > .l-header,
body:has(> main):has(> .l-footer) > main,
body:has(> main):has(> .l-footer) > .l-footer {
  flex-shrink: 0;
}
body:has(> main):has(> .l-footer) > .l-footer {
  margin-block-start: auto;
}

/* ページ左右余白は各子要素へ持たせず既存の親コンテナへこのクラスを付けて全幅域で一括管理する */
.l-content-container {
  padding-inline: var(--layout-page-gutter);
}

/* Headerと本文の間隔はMainで管理し、TOPだけページ側のトークンで上書きする */
.l-main.l-content-container,
.l-main.p-top {
  padding-block-start: var(--component-header-bottom);
}

@media (max-width: 767px) {
  /* SVGやカルーセルなど意図的な全幅要素だけ親コンテナのガターを相殺する */
  .l-content-container__full-bleed {
    inline-size: calc(var(--ratio-full) + var(--layout-page-gutter) * 2);
    margin-inline: calc(var(--layout-page-gutter) * -1);
  }
}
@media (min-width: 768px) {
  .l-content-container {
    padding-inline: max(var(--space-24), (100% - var(--grid-desktop-width)) / 2);
  }
}
.l-main[data-main-layout=full-width] {
  padding-block-start: var(--component-header-bottom);
}

.l-content-columns {
  display: grid;
  grid-template-columns: minmax(var(--space-0), 1fr);
  column-gap: var(--layout-grid-gap);
  row-gap: var(--layout-section-padding-heading-3);
  align-items: start;
}
.l-content-columns[data-dividers=between] {
  row-gap: var(--space-0);
}
.l-content-columns[data-section-spacing=heading-2] {
  row-gap: var(--layout-section-padding-heading-2);
}
.l-content-columns > * {
  min-inline-size: var(--space-0);
}

.l-divided-stack {
  border-block-start: var(--space-1) solid var(--semantic-border-tertiary);
}
.l-divided-stack > * {
  margin-block: var(--space-0);
  padding-block: var(--layout-section-padding-inner-small);
  box-shadow: inset var(--space-0) calc(var(--space-1) * -1) var(--space-0) var(--semantic-border-tertiary);
}

.l-content-columns[data-dividers=between] > .l-divided-stack {
  border-block-start: var(--space-0);
}

@media (max-width: 767px) {
  .l-content-columns[data-dividers=between] > .l-divided-stack:last-child > :last-child {
    box-shadow: none;
  }
  .l-content-columns > .l-divided-stack + .l-divided-stack {
    border-block-start: var(--space-0);
  }
}
@media (min-width: 768px) {
  .l-content-columns[data-dividers=between] > .l-divided-stack > :last-child {
    box-shadow: none;
  }
  .l-content-columns {
    grid-template-columns: repeat(2, minmax(var(--space-0), 1fr));
  }
  .l-content-columns:has(> .c-carousel--fraction) {
    grid-template-columns: calc(var(--layout-grid-column-width) * 5 + var(--layout-grid-gutter) * 4) minmax(var(--space-0), 1fr);
  }
}
/* ヘッダーのレイアウト ファイル先頭に置くと共有モジュール再利用時にコメントが重複出力されるためuseの後に置く */
.l-header {
  position: sticky;
  inset-block-start: var(--space-0);
  /* 退避先は自身の高さ分だけ上へ送る */
}
.l-header[data-scroll-direction=down] {
  translate: var(--space-0) calc(var(--ratio-full) * -1);
}
@media (prefers-reduced-motion: no-preference) {
  .l-header {
    transition: translate var(--motion-duration) var(--motion-easing);
  }
}
.l-header {
  z-index: var(--layout-header-layer);
  inset-block-start: var(--runtime-information-notice-block-size, var(--space-0));
  block-size: var(--space-64);
  background: var(--semantic-background-base);
  /* Informationと同時に退避するため、Header自身の高さにNoticeの実高を加えた位置まで送る */
}
.l-header[data-scroll-direction=down] {
  translate: var(--space-0) calc(var(--ratio-full) * -1 - var(--runtime-information-notice-block-size, var(--space-0)));
}
@media (min-width: 1024px) {
  .l-header {
    block-size: auto;
    padding-block-end: var(--space-0);
  }
}

.l-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  block-size: var(--space-64);
  padding-block: var(--space-12);
  padding-inline: var(--layout-header-padding-inline-start) var(--layout-header-padding-inline-end);
}
@media (min-width: 1024px) {
  .l-header__bar {
    block-size: var(--space-100);
    padding-block: var(--space-24);
    padding-inline: var(--layout-header-padding-inline-start) var(--layout-header-padding-inline-end);
  }
}

/* Figma master annotations | M-IDs: M-019 | nodeIDs: 7065:12137 | ownerIDs: 7065:12134
ロゴの上下バランス取るため、擬似的に囲みを入れた上で余白追加してます
*/
.l-header__logo {
  flex: none;
  /* SPは図案の上端をバーの内側余白から4px下げる */
  padding-block-start: var(--space-4);
}
.l-header__logo a {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-header__logo a::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-header__logo a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-header__logo a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-header__logo a:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-header__logo a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.l-header__logo a {
  display: block;
  inline-size: calc(var(--space-100) + var(--space-4));
  block-size: var(--space-36);
  background: url("../images/common/logo-lucua.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .l-header__logo {
    padding-block-start: var(--space-0);
  }
  .l-header__logo a {
    inline-size: calc(var(--space-128) + var(--space-12) - var(--space-2));
    block-size: var(--space-48);
  }
}

.l-header__subnav {
  display: none;
}
@media (min-width: 1024px) {
  .l-header__subnav {
    display: block;
    margin-inline-start: auto;
  }
  .l-header__subnav ul {
    display: flex;
    gap: var(--space-24);
  }
  .l-header__subnav a {
    font-size: var(--font-size-14);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
    position: relative;
    -webkit-tap-highlight-color: transparent;
  }
  .l-header__subnav a::after {
    position: absolute;
    content: "";
    inset: var(--space-0);
    border: var(--space-0) solid transparent;
    border-radius: var(--layout-focus-radius);
    background: transparent;
    pointer-events: none;
  }
}
@media (min-width: 1024px) and (max-width: 767px) {
  .l-header__subnav a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
@media (min-width: 1024px) {
  .l-header__subnav a:is(:focus-visible, [data-state=focus]) {
    outline: none;
  }
  .l-header__subnav a:is(:focus-visible, [data-state=focus])::after {
    inset: calc(var(--layout-focus-outer-size) * -1);
    border: var(--layout-focus-width) solid var(--semantic-border-focus);
    background: transparent;
  }
}
@media (min-width: 1024px) and (forced-colors: active) {
  .l-header__subnav a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
  .l-header__subnav a {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (min-width: 1024px) and (hover: hover) {
  .l-header__subnav a:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-primary-hover);
  }
}
@media (min-width: 1024px) {
  .l-header__subnav a:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
    color: var(--semantic-text-primary-hover);
  }
  .l-header__subnav a:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
    color: var(--semantic-text-primary-pressed);
  }
}

/* Figma master annotations | M-IDs: M-002, M-003 | nodeIDs: 7065:10394, 7065:10405 | ownerIDs: 7065:10381
Dropdownのfont-sizeについて
標準はLabel/Medium/Regular/Desktop
だが、
Header内のLanguage選択のみイレギュラーでLabel/Small/Regular/Desktopを適用
*/
.l-header__tools {
  display: flex;
  align-items: center;
  gap: var(--space-16);
}
@media (min-width: 1024px) {
  .l-header__tools {
    gap: var(--space-12);
    margin-inline-start: var(--space-32);
    /* ヘッダーのDropdownはフォントサイズだけを現行の固有値に保つ */
  }
  .l-header__tools .c-dropdown-trigger {
    font-size: var(--font-size-14);
  }
}

.l-header__search {
  display: none;
}
@media (min-width: 1024px) {
  .l-header__search {
    display: list-item;
  }
}

@media (min-width: 1024px) {
  .l-header__menu {
    display: none;
  }
}

/* ヘッダーの切替は1024pxのためコンテンツ基準で広がる寸法をここで戻す メニューボタンは自身の寸法を持つため対象から外す */
@media (max-width: 1023px) {
  /* Header/MobileはLanguageのラベルとシェブロンを表示せず地球儀アイコンだけにする */
  .l-header__tools .c-dropdown-trigger[data-icon=language] {
    justify-content: center;
    gap: var(--space-0);
    inline-size: var(--space-40);
    min-inline-size: var(--space-40);
    block-size: var(--space-40);
    padding: var(--space-8);
    vertical-align: top;
    font-size: var(--space-0);
    line-height: var(--space-0);
    letter-spacing: var(--space-0);
  }
  .l-header__tools .c-dropdown-trigger[data-icon=language]::after {
    content: none;
  }
  .l-header .c-icon-button:not([data-icon=menu]) {
    inline-size: var(--space-32);
    block-size: var(--space-32);
    padding: var(--space-4);
  }
}
.l-globalnav {
  inset: calc(var(--space-64) + var(--runtime-information-notice-block-size, var(--space-0))) var(--space-0) auto;
  z-index: var(--layout-popover-layer);
  inline-size: var(--ratio-full);
  max-block-size: calc(var(--viewport-block-size) - var(--space-64) - var(--runtime-information-notice-block-size, var(--space-0)));
  padding: var(--space-24) var(--space-20) var(--space-48);
  border: var(--space-0);
  margin: var(--space-0);
  overflow: auto;
  background: var(--semantic-background-base);
}
@media (min-width: 1024px) {
  .l-globalnav {
    position: static;
    display: block;
    block-size: var(--space-52);
    max-block-size: none;
    padding: var(--space-0);
    overflow: visible;
  }
}
@media (prefers-reduced-motion: no-preference) {
  @starting-style {
    .l-globalnav:popover-open {
      translate: var(--space-0) var(--motion-menu-start-offset);
    }
  }
}

/* SPメニューの検索欄はPCで横並びのグローバルナビへ切り替わるため非表示にする */
.l-globalnav > .c-searchbar {
  margin-inline: auto;
  margin-block-end: var(--space-32);
}
@media (min-width: 1024px) {
  .l-globalnav > .c-searchbar {
    display: none;
  }
}

/* SPメニューの主要リンクはPCで横並びのグローバルナビへ切り替わるため非表示にする */
.l-globalnav > .l-globalnav__grid {
  margin-block-end: var(--space-48);
}
@media (min-width: 1024px) {
  .l-globalnav > .l-globalnav__grid {
    display: none;
  }
}

/* 主要導線の3列グリッド 列間の罫線は各項目の左側に引く */
.l-globalnav__grid {
  display: grid;
  grid-template-columns: repeat(3, calc(var(--space-100) - var(--space-2)));
  justify-content: center;
  gap: var(--space-24);
  inline-size: var(--ratio-full);
}
.l-globalnav__grid > li:not(:nth-child(3n+1)) {
  position: relative;
}
.l-globalnav__grid > li:not(:nth-child(3n+1))::before {
  position: absolute;
  content: "";
  inset-block: var(--space-0);
  inset-inline-start: calc(var(--space-12) * -1);
  inline-size: var(--space-1);
  background: var(--semantic-border-tertiary);
}

/* アイコンとラベルの2段組 ラベルは2行分の高さを常に確保して行数の違いで高さを変えない */
.l-globalnav__griditem {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: grid;
  grid-template-rows: var(--space-40) var(--space-28);
  align-items: center;
  justify-items: center;
  gap: var(--space-8);
  text-align: center;
  color: var(--component-navigation-overlay-text);
}
.l-globalnav__griditem::before {
  content: "";
  inline-size: var(--space-40);
  block-size: var(--space-40);
  background: no-repeat center/contain;
}
.l-globalnav__griditem {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-globalnav__griditem::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-globalnav__griditem:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-globalnav__griditem:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-globalnav__griditem:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-globalnav__griditem:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .l-globalnav__griditem {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.l-globalnav__griditem:hover, .l-globalnav__griditem:focus-visible {
  color: var(--semantic-text-link);
}

/* 項目ごとのアイコン 素材名は項目名と対応させ個別に規則を書かない */
.l-globalnav__griditem--shop::before {
  background-image: url("../images/common/icon-shop.svg");
}

.l-globalnav__griditem--restaurant::before {
  background-image: url("../images/common/icon-restaurant.svg");
}

.l-globalnav__griditem--floor::before {
  background-image: url("../images/common/icon-floor.svg");
}

.l-globalnav__griditem--topics::before {
  background-image: url("../images/common/icon-topics.svg");
}

.l-globalnav__griditem--feature::before {
  background-image: url("../images/common/icon-feature.svg");
}

.l-globalnav__griditem--shopnews::before {
  background-image: url("../images/common/icon-shopnews.svg");
}

.l-globalnav__griditem--access::before {
  background-image: url("../images/common/icon-access.svg");
}

.l-globalnav__griditem--opening-hours::before {
  background-image: url("../images/common/icon-opening-hours.svg");
}

.l-globalnav__griditem--service::before {
  background-image: url("../images/common/icon-service.svg");
}

.l-globalnav__parking {
  grid-column: 1/-1;
  justify-self: center;
}

/* 副次リンク アコーディオンの見出しも同じ行の見た目にそろえる */
.l-globalnav__sublist {
  display: grid;
  row-gap: var(--space-0);
  inline-size: var(--ratio-full);
}
.l-globalnav__sublist > li {
  display: grid;
  align-items: center;
  min-block-size: var(--space-32);
}
@media (min-width: 1024px) {
  .l-globalnav__sublist {
    display: none;
  }
}

.l-globalnav__list {
  /* SPはパネル側の主要導線と副次リンクが役割を担うため横並びのナビは持たない */
  display: none;
}
@media (min-width: 1024px) {
  .l-globalnav__list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-0);
    inline-size: min(var(--ratio-full) - var(--space-48), var(--grid-desktop-width));
    block-size: var(--ratio-full);
    margin-inline: auto;
  }
  .l-globalnav__list > li {
    /* 文字幅より縮めないことで隣の項目と重ならない */
    flex: none;
  }
}

.l-globalnav__link {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-globalnav__link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-globalnav__link:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-globalnav__link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-globalnav__link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-globalnav__link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.l-globalnav__link {
  display: flex;
  align-items: center;
  min-block-size: var(--space-40);
  padding: var(--space-16) var(--space-32);
  /* 要素内のテキストは折り返さない */
  white-space: nowrap;
  /* 画面が狭いほど内側余白を詰めて折り返しと重なりを起こさない コンテンツ幅を確保できる幅では規定の32px */
}
@media (min-width: 1024px) {
  .l-globalnav__link {
    padding-inline: clamp(var(--space-12), var(--space-32) - (var(--grid-desktop-width) - min(var(--viewport-inline-size) - var(--space-64), var(--grid-desktop-width))) / 12, var(--space-32));
  }
}

/* PCメニューのドロップダウンはホバーとフォーカスで表示し背景の被覆とスクロール固定は行わない */
.l-globalnav__dropdown {
  display: none;
}
@media (min-width: 1024px) {
  .l-globalnav__dropdown {
    position: absolute;
    inset-block-start: calc(var(--ratio-full) + var(--space-4));
    inset-inline-start: var(--ratio-half);
    translate: -50% 0;
    /* 包含ブロックが呼び出し元と異なる場合のみアンカーを指定し同じ配置に揃える */
    display: flex;
    visibility: hidden;
    opacity: var(--motion-menu-start-opacity);
  }
}

@media (min-width: 1024px) {
  .l-globalnav__list > li {
    position: relative;
    /* ドロップダウンとの間の隙間を跨ぐ間もホバーを切らさない 見た目は持たない */
  }
  .l-globalnav__list > li::after {
    position: absolute;
    content: "";
    inset-block-start: var(--ratio-full);
    inset-inline: var(--space-0);
    block-size: var(--space-4);
  }
  .l-globalnav__list > li {
    /* ホバー中とドロップダウン内フォーカス中に表示する */
  }
  .l-globalnav__list > li:hover > .l-globalnav__dropdown, .l-globalnav__list > li:focus-within > .l-globalnav__dropdown {
    visibility: visible;
    opacity: 1;
    translate: -50% var(--space-0);
  }
  .l-globalnav__list > li {
    /* ホバー時のアクセント下線 */
  }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
  .l-globalnav__list > li:hover > .l-globalnav__dropdown, .l-globalnav__list > li:focus-within > .l-globalnav__dropdown {
    transition: opacity var(--motion-menu-duration) var(--motion-menu-easing), translate var(--motion-menu-duration) var(--motion-menu-easing);
  }
}
@media (min-width: 1024px) {
  .l-globalnav__list > li:is(:hover, :focus-within) > .l-globalnav__dropdown[data-panel-selected] {
    visibility: hidden;
    transition: none;
  }
  .l-globalnav__list > li:hover > .l-globalnav__link, .l-globalnav__list > li:focus-within > .l-globalnav__link {
    box-shadow: var(--shadow-nav-underline);
  }
}
@media (min-width: 1024px) {
  /* 現在地ページも同じ下線で示す */
  .l-globalnav__link[aria-current=page] {
    box-shadow: var(--shadow-nav-underline);
  }
}
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
  .l-globalnav__dropdown {
    translate: -50% var(--motion-menu-start-offset);
  }
}
/* PCヘッダーの検索パネル 検索ボタンのpopoverで開閉しヘッダーバー直下に全幅で表示する */
@media (prefers-reduced-motion: no-preference) {
  @starting-style {
    .l-header__searchpanel:popover-open {
      translate: var(--space-0) var(--motion-menu-start-offset);
    }
  }
}
.l-header__searchpanel {
  inset: calc(var(--space-100) + var(--runtime-information-notice-block-size, var(--space-0))) var(--space-0) auto;
  z-index: var(--layout-popover-layer);
  inline-size: var(--ratio-full);
  padding: var(--space-32) var(--space-0);
  border: var(--space-0);
  margin: var(--space-0);
  background: var(--semantic-background-base);
}

/* 副次リンクの各行 */
.l-globalnav__sublist > li > a {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding-block: var(--space-4);
  color: var(--semantic-text-primary);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-globalnav__sublist > li > a::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-globalnav__sublist > li > a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-globalnav__sublist > li > a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-globalnav__sublist > li > a:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-globalnav__sublist > li > a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .l-globalnav__sublist > li > a {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.l-globalnav__sublist > li > a:hover, .l-globalnav__sublist > li > a:focus-visible {
  color: var(--semantic-text-link);
}

/* 副次リンクは通常リンクとAccordion内の全項目で同じ高さと色状態を共有する */
.l-globalnav__sublist > li > a,
.l-globalnav__sublist .c-accordion__summary,
.l-globalnav__sublist .c-accordion__list > li > a {
  block-size: var(--space-44);
}
.l-globalnav__sublist > li > a:active,
.l-globalnav__sublist .c-accordion__summary:active,
.l-globalnav__sublist .c-accordion__list > li > a:active {
  color: var(--semantic-text-link);
}
@media (hover: none) {
  .l-globalnav__sublist > li > a:hover:not(:active),
  .l-globalnav__sublist .c-accordion__summary:hover:not(:active),
  .l-globalnav__sublist .c-accordion__list > li > a:hover:not(:active) {
    color: var(--semantic-text-primary);
  }
}

.l-globalnav__sublist a:visited:not(:hover, :focus-visible, :active) {
  color: var(--semantic-text-primary);
}

.l-header[data-navigation-type=international] .l-header__search, .l-header[data-navigation-type=international] .l-header__searchpanel, .l-header[data-navigation-type=international] .l-globalnav > .c-searchbar {
  display: none;
}
@media (max-width: 1023px) {
  .l-header[data-navigation-type=international] .l-globalnav {
    padding-inline: var(--layout-page-gutter);
  }
  .l-header[data-navigation-type=international] .l-globalnav__grid {
    grid-template-columns: repeat(3, minmax(var(--space-0), 1fr));
  }
  .l-header[data-navigation-type=international] .l-globalnav > .l-globalnav__grid {
    margin-block-end: var(--space-32);
  }
  .l-header[data-navigation-type=international] .l-globalnav__sublist > li > a {
    block-size: var(--space-48);
  }
}

/* 矢印アイコンの共通描画とモーション */
.l-footer {
  padding-block-start: var(--component-footer-top);
  color: var(--semantic-text-inverse-primary);
}

/* PAGE TOPの固定色矢印は外部SVGで描画する */
/* Figma master annotations | M-IDs: M-017, M-027 | nodeIDs: 7065:11049, 7065:11783 | ownerIDs: 7065:11047, 7065:11781
Hover：
text,iconの色変更に加え、iconが上に移動するアニメーションを付与
（※8/31記載：既に実装済みのアニメーションで問題なし）
*/
.l-footer__pagetop {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-footer__pagetop::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-footer__pagetop:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-footer__pagetop:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-footer__pagetop:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-footer__pagetop:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.l-footer__pagetop {
  display: grid;
  inline-size: var(--ratio-full);
  place-content: center;
  justify-items: center;
  gap: var(--space-4);
  block-size: calc(var(--space-56) - var(--space-2));
  background: var(--semantic-background-section);
  color: var(--semantic-text-primary);
}
.l-footer__pagetop::before {
  content: "";
  display: inline-block;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-arrow-up.svg") no-repeat center/contain;
  transition: translate var(--motion-duration) var(--motion-easing);
}
@media (prefers-reduced-motion: reduce) {
  .l-footer__pagetop::before {
    transition: none;
  }
}
.l-footer__pagetop:hover {
  color: var(--semantic-text-link);
}
.l-footer__pagetop:is(:hover, :focus-visible)::before {
  translate: var(--space-0) calc(var(--space-4) * -1);
}
@media (prefers-reduced-motion: reduce) {
  .l-footer__pagetop:is(:hover, :focus-visible)::before {
    translate: none;
  }
}
@media (min-width: 768px) {
  .l-footer__pagetop {
    font-size: var(--font-size-14);
    block-size: var(--space-68);
  }
}

.l-footer__primary {
  display: grid;
  gap: var(--space-48);
  padding-block: var(--space-64) var(--space-24);
  padding-inline: var(--layout-page-gutter);
  background: var(--semantic-background-inverse-base);
}
@media (min-width: 768px) {
  .l-footer__primary {
    /* 列幅は上限だけを定めビューポートが狭い幅では縮む 固定幅だとグリッド合計1256pxが横に溢れる */
    grid-template-columns: repeat(3, minmax(var(--space-0), var(--layout-desktop-column-width)));
    justify-content: center;
    gap: var(--space-40);
    padding-block: var(--space-64) var(--space-32);
    padding-inline: var(--space-32);
  }
}

.l-footer__logo a {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-footer__logo a::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-footer__logo a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-footer__logo a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-footer__logo a:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-footer__logo a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.l-footer__logo a {
  display: block;
  inline-size: calc(var(--space-128) + var(--space-12));
  block-size: var(--space-48);
  background: url("../images/common/logo-lucua-inverse.svg") no-repeat left center/contain;
}
@media (min-width: 768px) {
  .l-footer__logo a {
    inline-size: calc(var(--space-128) + var(--space-48));
    block-size: var(--space-60);
  }
}

.l-footer__address {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: grid;
  gap: var(--space-8);
  margin-block-start: var(--space-24);
  font-style: normal;
}
@media (min-width: 768px) {
  .l-footer__address {
    margin-block-start: var(--space-32);
  }
}

.l-footer__nav {
  display: grid;
  gap: var(--space-32);
}
.l-footer__nav ul {
  display: grid;
  align-content: start;
  gap: var(--space-12);
}
.l-footer__nav a {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-footer__nav a::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-footer__nav a:is(:active, [data-state=pressed])::before {
    background: var(--semantic-tap-highlight);
  }
}
.l-footer__nav a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-footer__nav a:is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-footer__nav a:is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
.l-footer__nav a {
  display: inline-flex;
  align-items: center;
  padding-block: var(--space-4);
}
.l-footer__nav {
  /* 外部リンクアイコンは背景で描画する */
}
.l-footer__nav a[target=_blank]::after {
  content: "";
  flex: none;
  inline-size: var(--space-16);
  block-size: var(--space-16);
  margin-inline-start: var(--space-4);
  background: url("../images/common/icon-blanklink-inverse.svg") no-repeat center/contain;
}
.l-footer__nav .l-footer__legal {
  gap: var(--space-8);
}
.l-footer__nav .l-footer__legal a {
  font-size: var(--font-size-14);
}
@media (min-width: 768px) {
  .l-footer__nav {
    grid-column: 2/-1;
    grid-template-columns: repeat(2, minmax(var(--space-0), var(--layout-desktop-column-width)));
    gap: var(--space-40);
  }
  .l-footer__nav .l-footer__legal {
    gap: var(--space-12);
  }
}

.l-footer__copyright {
  font-size: var(--font-size-11);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-caption);
  margin-block-start: var(--space-16);
  text-align: center;
}
.l-footer__copyright small {
  font-size: inherit;
}
@media (min-width: 768px) {
  .l-footer__copyright {
    grid-column: 1/-1;
    margin-block-start: var(--space-24);
    font-size: var(--font-size-12);
    line-height: var(--line-height-narrow);
    text-align: end;
  }
}

.l-footer[data-footer-type=simple] .l-footer__copyright {
  margin-block-start: var(--space-0);
}
.l-footer[data-footer-type=simple] .l-footer__logo a {
  block-size: calc(var(--space-48) + var(--space-1));
}
@media (min-width: 768px) {
  .l-footer[data-footer-type=simple] {
    --component-footer-top: var(--space-120);
  }
  .l-footer[data-footer-type=simple] .l-footer__primary {
    grid-template-columns: minmax(var(--space-0), var(--grid-desktop-width));
    gap: var(--space-64);
  }
  .l-footer[data-footer-type=simple] .l-footer__identity {
    max-inline-size: var(--layout-desktop-column-width);
  }
  .l-footer[data-footer-type=simple] .l-footer__logo a {
    block-size: calc(var(--space-60) + var(--space-1));
  }
}

/* ボトムナビの浮遊パネル */
.l-bottomnav {
  position: fixed;
  inset-block-end: var(--space-0);
  inset-inline: var(--space-0);
  z-index: var(--layout-bottomnav-layer);
}
.l-bottomnav[data-bottomnav=off] {
  display: none;
}
.l-bottomnav {
  /* ナビ自体をビューポートより小さい可変幅にして横スクロールを発生させない アイコンと文字は縮小しない */
  inline-size: min(var(--space-256) + var(--space-100) + var(--space-8) + var(--space-2), var(--ratio-full) - var(--space-24));
  margin-inline: auto;
  /* TED指定のsafe-area回避によりiPhoneではホームインジケーター分だけ全体が持ち上がる */
  padding-block-end: env(safe-area-inset-bottom, 0px);
}
@media (min-width: 768px) {
  .l-bottomnav {
    display: none;
  }
}

/* 白い浮遊パネルはsafe-areaのない端末でも下端に密着しないよう下マージンを確保 横幅は親の可変幅に追従する */
.l-bottomnav__list {
  display: flex;
  align-items: stretch;
  padding-inline: var(--space-8);
  border-radius: var(--layout-panel-radius);
  margin-block-end: var(--space-16);
  background: var(--semantic-background-base);
  box-shadow: var(--shadow-floating);
}
.l-bottomnav__list li {
  display: flex;
  flex: 1 1 0;
  min-inline-size: var(--space-0);
}

/* アイコン24pxとラベル28px枠の2段グリッドで1行ラベルは28px枠内で天地中央になる */
.l-bottomnav__link {
  font-size: var(--font-size-11);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-caption);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.l-bottomnav__link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .l-bottomnav__link:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.l-bottomnav__link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.l-bottomnav__link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .l-bottomnav__link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.l-bottomnav__link {
  display: grid;
  grid-template-rows: var(--space-24) minmax(var(--space-28), auto);
  gap: var(--space-2);
  align-items: center;
  justify-items: center;
  inline-size: var(--ratio-full);
  padding: var(--space-8) var(--space-8) var(--space-4);
  color: var(--semantic-text-primary);
  text-align: center;
  overflow-wrap: anywhere;
}

/* アイコンは背景で描画しモディファイアが対象を決める */
.l-bottomnav__icon {
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: no-repeat center/contain;
}

.l-bottomnav__icon--shop {
  background-image: url("../images/common/icon-shop.svg");
}

.l-bottomnav__icon--restaurant {
  background-image: url("../images/common/icon-restaurant.svg");
}

.l-bottomnav__icon--floor {
  background-image: url("../images/common/icon-floor.svg");
}

.l-bottomnav__icon--service {
  background-image: url("../images/common/icon-service.svg");
}

/* 固定ナビとsafe-areaの背面を暗色で塗りつぶしiOS Safariのオーバースクロール背景も同色になる */
@media (max-width: 767px) {
  .l-footer__primary {
    padding-block-end: calc(var(--space-24) + var(--space-64) + var(--space-2) + var(--space-16) + env(safe-area-inset-bottom, 0px));
  }
}
.l-content-width {
  inline-size: var(--ratio-full);
  margin-inline: auto;
}
.l-content-width[data-content-width=narrow] {
  max-inline-size: var(--layout-content-narrow-width);
}
.l-content-width[data-content-width=column] {
  max-inline-size: var(--layout-desktop-column-width);
}

.l-content-flow {
  display: grid;
  grid-template-columns: minmax(var(--space-0), 1fr);
  gap: var(--space-24);
}
.l-content-flow[data-content-gap=large] {
  gap: var(--layout-section-padding-inner-large);
}
.l-content-flow[data-content-gap=links] {
  gap: var(--space-8);
}
.l-content-flow[data-content-gap=social] {
  gap: var(--space-12);
}

.l-inline-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
}

:is(.l-content-width, .l-content-flow, .l-inline-list)[hidden],
.l-content-flow > [hidden] {
  display: none;
}

.l-content-flow[data-content-gap=small] {
  gap: var(--layout-section-padding-inner-small);
}
.l-content-flow[data-content-gap=caption] {
  gap: var(--component-button-caption-gap);
}
.l-content-flow[data-content-gap=heading] {
  gap: var(--component-title-title-gap);
}
.l-content-flow[data-content-align=center] {
  justify-items: center;
}
.l-content-flow[data-content-align=center] > .c-heading {
  inline-size: var(--ratio-full);
}

.c-accordion {
  display: grid;
  padding-block: var(--space-0);
  interpolate-size: allow-keywords;
}
.c-accordion::details-content {
  overflow: clip;
  block-size: var(--space-0);
}
.c-accordion[open]::details-content {
  block-size: auto;
}
@media (prefers-reduced-motion: no-preference) {
  .c-accordion::details-content {
    transition: block-size var(--motion-duration) var(--motion-easing), content-visibility var(--motion-duration) var(--motion-easing) allow-discrete;
  }
}

/* 見出し 既定のマーカーは使わず右端の記号で開閉を示す */
.c-accordion--navigation > .c-accordion__summary {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding-block: var(--space-4);
  color: var(--semantic-text-primary);
}
@media (prefers-reduced-motion: no-preference) {
  .c-accordion--navigation > .c-accordion__summary {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-accordion--navigation > .c-accordion__summary:hover, .c-accordion--navigation > .c-accordion__summary:focus-visible {
  color: var(--semantic-text-link);
}
.c-accordion--navigation > .c-accordion__summary {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-accordion--navigation > .c-accordion__summary::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-accordion--navigation > .c-accordion__summary:is(:active, [data-state=pressed])::before {
    background: var(--semantic-tap-highlight);
  }
}
.c-accordion--navigation > .c-accordion__summary:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-accordion--navigation > .c-accordion__summary:is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-accordion--navigation > .c-accordion__summary:is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
.c-accordion--navigation > .c-accordion__summary {
  /* 上下の余白は器が持つため行では持たない */
  padding-block: var(--space-0);
  cursor: pointer;
  list-style: none;
}
.c-accordion--navigation > .c-accordion__summary::-webkit-details-marker {
  display: none;
}
.c-accordion--navigation > .c-accordion__summary::after {
  content: "";
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  margin-inline-start: auto;
  background: url("../images/common/icon-plus.svg") no-repeat center/contain;
}

/* 開いている間は文字色をPrimaryに保ち 記号を横棒だけにする */
.c-accordion--navigation[open] > .c-accordion__summary {
  color: var(--semantic-text-primary);
}

.c-accordion--navigation[open] > .c-accordion__summary:active {
  color: var(--semantic-text-link);
}

.c-accordion--navigation[open] > .c-accordion__summary::after {
  background-image: url("../images/common/icon-minus.svg");
}

/* 下位項目 見出しより内側へ寄せ行間は上位の一覧より詰める */
.c-accordion__list {
  display: grid;
  row-gap: var(--space-0);
  inline-size: calc(var(--space-256) + var(--space-60) + var(--space-2));
  margin-block-start: var(--space-16);
  margin-inline-start: auto;
}
.c-accordion__list > li > a {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding-block: var(--space-4);
  color: var(--semantic-text-primary);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-accordion__list > li > a::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-accordion__list > li > a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-accordion__list > li > a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-accordion__list > li > a:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-accordion__list > li > a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-accordion__list > li > a {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-accordion__list > li > a:hover, .c-accordion__list > li > a:focus-visible {
  color: var(--semantic-text-link);
}

/* Figma master annotations | M-IDs: M-053, M-063 | nodeIDs: 7077:10274, 7095:9395 | ownerIDs: 7077:10274, 7095:9395
9/29 update
inside stroke = included->excludedへ変更
heightが固定値になっていたため、hugへ修正
*/
.c-accordion:has(> .c-accordion__body) {
  border-block-end: var(--space-1) solid var(--semantic-border-secondary);
}
.c-accordion:has(> .c-accordion__body)::details-content {
  overflow-x: visible;
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-accordion:has(> .c-accordion__body) > .c-accordion__summary:is(:active, [data-state=pressed])::before {
    background: var(--semantic-tap-highlight);
  }
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary:is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-accordion:has(> .c-accordion__body) > .c-accordion__summary:is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-accordion:has(> .c-accordion__body) > .c-accordion__summary {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-accordion:has(> .c-accordion__body) > .c-accordion__summary:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-primary-hover);
  }
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-primary-hover);
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-primary-pressed);
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  min-block-size: calc(var(--space-56) + var(--space-1));
  padding-block: var(--space-16);
  color: var(--semantic-text-primary);
  cursor: pointer;
  list-style: none;
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary::-webkit-details-marker {
  display: none;
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary > h3 {
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
  margin: var(--space-0);
}
.c-accordion:has(> .c-accordion__body) > .c-accordion__summary::after {
  content: "";
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  margin-inline-start: auto;
  background: url("../images/common/icon-plus.svg") no-repeat center/contain;
}
.c-accordion:has(> .c-accordion__body)[open] > .c-accordion__summary {
  min-block-size: var(--space-56);
  font-weight: var(--font-weight-bold);
}
.c-accordion:has(> .c-accordion__body)[open] > .c-accordion__summary::after {
  background-image: url("../images/common/icon-minus.svg");
}

.c-accordion__body {
  padding-block: var(--space-12) var(--space-48);
}

/* 列数と列間隔は配置先で設定し共通スタイルでは同一行のアンカーボタンの高さを統一する */
.c-anchor-button-list {
  display: grid;
  align-items: stretch;
}

.c-anchor-button-list > li {
  display: flex;
  align-items: stretch;
  min-inline-size: var(--space-0);
}

.c-anchor-button {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
@media (prefers-reduced-motion: no-preference) {
  .c-anchor-button {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-anchor-button:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-primary-hover);
  }
}
.c-anchor-button:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-primary-hover);
}
.c-anchor-button:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-primary-pressed);
}
.c-anchor-button {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-anchor-button::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-anchor-button:is(:active, [data-state=pressed])::before {
    background: var(--semantic-tap-highlight);
  }
}
.c-anchor-button:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-anchor-button:is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-anchor-button:is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
.c-anchor-button {
  --anchor-button-icon-color: var(--semantic-icon-accent);
  display: grid;
  grid-template-columns: minmax(var(--space-0), 1fr) auto;
  align-items: center;
  gap: var(--space-8);
  inline-size: var(--ratio-full);
  min-block-size: calc(var(--space-56) + var(--space-1));
  padding-block: var(--space-16);
  border-block-end: var(--space-1) solid var(--semantic-border-secondary);
  color: var(--semantic-text-primary);
  text-align: center;
}
.c-anchor-button::after {
  content: "";
  transform: rotate(90deg);
  display: inline-block;
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background-color: var(--anchor-button-icon-color);
  /* 色をトークンで塗るためマスク描画にする 外部SVG参照はfile://でCORSに阻まれるためデータURIで埋め込む */
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M11.5 4.5L19 12L11.5 19.5' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M4 12L19 12' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center/contain;
}
@media (forced-colors: active) {
  .c-anchor-button::after {
    background-color: LinkText;
  }
}
.c-anchor-button::after {
  transition: translate var(--motion-duration) var(--motion-easing);
}
@media (prefers-reduced-motion: reduce) {
  .c-anchor-button::after {
    transition: none;
  }
}
.c-anchor-button:has(> br.mobile-break) {
  display: block;
  align-content: center;
  padding-inline-end: calc(var(--space-24) + var(--space-8));
}
.c-anchor-button:has(> br.mobile-break)::after {
  position: absolute;
  inset-block: var(--space-0);
  inset-inline-end: var(--space-0);
  margin-block: auto;
}
.c-anchor-button:not(:disabled):is(:focus-visible, :active, [data-state=hover], [data-state=pressed], [data-state=focus])::after {
  translate: var(--space-0) var(--space-4);
}
@media (prefers-reduced-motion: reduce) {
  .c-anchor-button:not(:disabled):is(:focus-visible, :active, [data-state=hover], [data-state=pressed], [data-state=focus])::after {
    translate: none;
  }
}
@media (hover: hover) {
  .c-anchor-button:not(:disabled):hover::after {
    translate: var(--space-0) var(--space-4);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-anchor-button:not(:disabled):hover::after {
    translate: none;
  }
}
@media (min-width: 768px) {
  .c-anchor-button {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
}

.c-badge {
  font-size: var(--font-size-11);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-caption);
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  min-inline-size: calc(var(--space-20) + var(--space-2));
  min-block-size: calc(var(--space-20) + var(--space-2));
  padding: var(--space-4);
  border-radius: var(--radius-999);
  color: var(--semantic-text-inverse-primary);
  white-space: nowrap;
  background: var(--semantic-border-accent);
}
.c-badge[data-type=dot] {
  inline-size: var(--space-8);
  block-size: var(--space-8);
  min-inline-size: var(--space-0);
  min-block-size: var(--space-0);
  padding: var(--space-0);
  border-radius: var(--layout-circle-radius);
}
@media (min-width: 768px) {
  .c-badge {
    font-size: var(--font-size-12);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
}

/* ボタンコンポーネント 全角4pxのradiusと右下の切り欠きを共通仕様とする */
.c-button {
  font-size: var(--button-font-size);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  position: relative;
  display: block;
  align-content: center;
  inline-size: 100%;
  block-size: var(--button-block-size);
  padding: var(--button-padding);
  overflow: hidden;
  background: var(--button-surface-enabled);
  color: var(--button-text-color);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* 右下の切り欠き量 */
  --button-notch: var(--space-12);
  /* 操作時の状態と固定表示用のdata-stateを同じ状態定義へ接続する */
}
.c-button:is(:hover, :focus-visible, [data-state=hover], [data-state=focus]) {
  background: var(--button-surface-hover);
}
.c-button:is(:active, [data-state=pressed]) {
  background: var(--button-surface-pressed);
}

/* Hierarchy=Primary */
.c-button[data-hierarchy=primary] {
  --button-surface-enabled: var(--semantic-surface-primary);
  --button-surface-hover: var(--semantic-surface-primary-hover);
  --button-surface-pressed: var(--semantic-surface-primary-pressed);
  --button-text-color: var(--semantic-text-inverse-primary);
  --button-icon-color: var(--semantic-icon-inverse-primary);
}

/* 幅制約候補の参照元 Figma Component node 1322:7734 正式化前のため宣言はコメントアウトする */
/* Figma共通ButtonのSize=Regular */
.c-button[data-size=regular] {
  border-radius: var(--layout-panel-radius);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--button-notch)), calc(100% - var(--button-notch)) 100%, 0 100%);
  /* shape()対応環境では外周4角に加えて切り欠き斜辺の接続2角も指定radiusで丸める */
}
@supports (clip-path: shape(from 0 0, line to 100% 0, close)) {
  .c-button[data-size=regular] {
    clip-path: shape(from var(--layout-panel-radius) 0, line to calc(100% - var(--layout-panel-radius)) 0, curve to 100% var(--layout-panel-radius) with 100% 0, line to 100% calc(100% - var(--button-notch) - calc(var(--layout-panel-radius) * 0.4142135624)), curve to calc(100% - calc(var(--layout-panel-radius) * 0.4142135624)) calc(100% - var(--button-notch) + calc(var(--layout-panel-radius) * 0.4142135624)) with 100% calc(100% - var(--button-notch)), line to calc(100% - var(--button-notch) + calc(var(--layout-panel-radius) * 0.4142135624)) calc(100% - calc(var(--layout-panel-radius) * 0.4142135624)), curve to calc(100% - var(--button-notch) - calc(var(--layout-panel-radius) * 0.4142135624)) 100% with calc(100% - var(--button-notch)) 100%, line to var(--layout-panel-radius) 100%, curve to 0 calc(100% - var(--layout-panel-radius)) with 0 100%, line to 0 var(--layout-panel-radius), curve to var(--layout-panel-radius) 0 with 0 0, close);
  }
}
.c-button[data-size=regular] {
  --button-font-size: var(--font-size-16);
  --button-gap: var(--space-8);
  --button-block-size: var(--space-56);
  --button-icon-inset-inline-end: var(--space-12);
  --button-padding: var(--space-16) calc(var(--button-icon-inset-inline-end) + var(--space-24) + var(--button-gap));
  /* Figmaコンポーネントページからの未正式候補 Mobile Regularは制約未設定で作例幅348px */
  /* min-inline-size: auto; */
  /* max-inline-size: var(--grid-mobile-width); */
}
@media (min-width: 768px) {
  .c-button[data-size=regular] {
    --button-font-size: var(--font-size-18);
    --button-gap: var(--space-12);
    --button-block-size: var(--space-64);
    --button-icon-inset-inline-end: var(--space-16);
    --button-padding: var(--space-20) calc(var(--button-icon-inset-inline-end) + var(--space-24) + var(--button-gap));
    /* Figmaコンポーネントページからの未正式候補 Desktop Regularは制約未設定で作例幅392px */
    /* min-inline-size: auto; */
    /* max-inline-size: var(--layout-desktop-column-width); */
  }
}

/* Figma共通ButtonのSize=Small */
.c-button[data-size=small] {
  --button-font-size: var(--font-size-14);
  --button-gap: var(--space-8);
  --button-block-size: var(--space-44);
  --button-padding: var(--space-12);
  /* Figmaコンポーネントページの未正式値 Mobile SmallはminWidth 96px / maxWidth 228px */
  /* min-inline-size: var(--space-96); */
  /* max-inline-size: calc(var(--space-256) - var(--space-28)); */
  border-radius: var(--layout-panel-radius);
  clip-path: none;
}
.c-button[data-size=small]:focus-visible {
  outline: none;
}
@media (min-width: 768px) {
  .c-button[data-size=small] {
    --button-font-size: var(--font-size-16);
    --button-gap: var(--space-8);
    --button-block-size: var(--space-48);
    /* Figmaコンポーネントページの未正式候補 Desktop SmallはminWidth 128px / 2grid 284px / 3grid 392px */
    /* min-inline-size: var(--space-128); */
    /* max-inline-size: var(--layout-desktop-column-width); */
  }
}

/* Hierarchy=Secondary */
.c-button[data-hierarchy=secondary] {
  --button-surface-enabled: var(--semantic-surface-tertiary);
  --button-surface-hover: var(--semantic-surface-tertiary-hover);
  --button-surface-pressed: var(--semantic-surface-tertiary-pressed);
  --button-text-color: var(--semantic-text-primary);
  --button-icon-color: var(--semantic-icon-accent);
  z-index: var(--button-layer-base);
  border: var(--space-0);
  background: var(--semantic-border-primary);
  color: var(--semantic-text-primary);
  isolation: isolate;
  /* 切り欠きに沿う枠線を外形と内面の2層で描く */
}
.c-button[data-hierarchy=secondary]::before {
  border-radius: calc(var(--layout-panel-radius) - var(--space-1));
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--button-notch)), calc(100% - var(--button-notch)) 100%, 0 100%);
  /* shape()対応環境では外周4角に加えて切り欠き斜辺の接続2角も指定radiusで丸める */
}
@supports (clip-path: shape(from 0 0, line to 100% 0, close)) {
  .c-button[data-hierarchy=secondary]::before {
    clip-path: shape(from calc(var(--layout-panel-radius) - var(--space-1)) 0, line to calc(100% - calc(var(--layout-panel-radius) - var(--space-1))) 0, curve to 100% calc(var(--layout-panel-radius) - var(--space-1)) with 100% 0, line to 100% calc(100% - var(--button-notch) - calc(calc(var(--layout-panel-radius) - var(--space-1)) * 0.4142135624)), curve to calc(100% - calc(calc(var(--layout-panel-radius) - var(--space-1)) * 0.4142135624)) calc(100% - var(--button-notch) + calc(calc(var(--layout-panel-radius) - var(--space-1)) * 0.4142135624)) with 100% calc(100% - var(--button-notch)), line to calc(100% - var(--button-notch) + calc(calc(var(--layout-panel-radius) - var(--space-1)) * 0.4142135624)) calc(100% - calc(calc(var(--layout-panel-radius) - var(--space-1)) * 0.4142135624)), curve to calc(100% - var(--button-notch) - calc(calc(var(--layout-panel-radius) - var(--space-1)) * 0.4142135624)) 100% with calc(100% - var(--button-notch)) 100%, line to calc(var(--layout-panel-radius) - var(--space-1)) 100%, curve to 0 calc(100% - calc(var(--layout-panel-radius) - var(--space-1))) with 0 100%, line to 0 calc(var(--layout-panel-radius) - var(--space-1)), curve to calc(var(--layout-panel-radius) - var(--space-1)) 0 with 0 0, close);
  }
}
.c-button[data-hierarchy=secondary]::before {
  position: absolute;
  content: "";
  inset: var(--space-1);
  z-index: var(--button-layer-underlay);
  background: var(--button-surface-enabled);
}
@media (prefers-reduced-motion: no-preference) {
  .c-button[data-hierarchy=secondary]::before {
    transition: background-color var(--motion-duration) var(--motion-easing);
  }
}
.c-button[data-hierarchy=secondary]:is(:hover, :focus-visible, [data-state=hover], [data-state=focus]) {
  background: var(--semantic-border-primary);
}
.c-button[data-hierarchy=secondary]:is(:hover, :focus-visible, [data-state=hover], [data-state=focus])::before {
  background: var(--button-surface-hover);
}
.c-button[data-hierarchy=secondary]:is(:active, [data-state=pressed]) {
  background: var(--semantic-border-primary);
}
.c-button[data-hierarchy=secondary]:is(:active, [data-state=pressed])::before {
  background: var(--button-surface-pressed);
}
.c-button[data-hierarchy=secondary]:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  background: var(--semantic-border-disabled);
}
.c-button[data-hierarchy=secondary]:is(:disabled, [aria-disabled=true], [data-state=disabled])::before {
  background: var(--semantic-surface-disabled-weak);
}

/* Size=Regularだけに共通矢印を表示しSmallには生成しない */
.c-button[data-size=regular]::after {
  position: absolute;
  content: "";
  inset-block-start: calc(var(--ratio-half) - var(--space-12));
  inset-inline-end: var(--button-icon-inset-inline-end);
  display: inline-block;
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background-color: var(--button-icon-color);
  /* 色をトークンで塗るためマスク描画にする 外部SVG参照はfile://でCORSに阻まれるためデータURIで埋め込む */
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M11.5 4.5L19 12L11.5 19.5' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M4 12L19 12' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center/contain;
}
@media (forced-colors: active) {
  .c-button[data-size=regular]::after {
    background-color: LinkText;
  }
}
.c-button[data-size=regular]::after {
  transition: translate var(--motion-duration) var(--motion-easing);
}
@media (prefers-reduced-motion: reduce) {
  .c-button[data-size=regular]::after {
    transition: none;
  }
}

.c-button[data-size=regular]:is(:hover, :focus-visible, [data-state=hover], [data-state=focus])::after {
  translate: var(--space-4) var(--space-0);
}
@media (prefers-reduced-motion: reduce) {
  .c-button[data-size=regular]:is(:hover, :focus-visible, [data-state=hover], [data-state=focus])::after {
    translate: none;
  }
}

/* Size=SmallのSecondaryは共通Button仕様の1px枠線と面色で状態を表す */
.c-button[data-size=small][data-hierarchy=secondary] {
  border: var(--space-1) solid var(--semantic-border-primary);
  background: var(--button-surface-enabled);
  isolation: auto;
}
.c-button[data-size=small][data-hierarchy=secondary]::before {
  display: none;
}
.c-button[data-size=small][data-hierarchy=secondary]:is(:hover, :focus-visible, [data-state=hover], [data-state=focus]) {
  background: var(--button-surface-hover);
}
.c-button[data-size=small][data-hierarchy=secondary]:is(:active, [data-state=pressed]) {
  background: var(--button-surface-pressed);
}
.c-button[data-size=small][data-hierarchy=secondary]:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  background: var(--semantic-surface-disabled-weak);
  color: var(--semantic-text-disabled);
  pointer-events: none;
  border-color: var(--semantic-border-disabled);
}

/* Hierarchyより後にDisabled共通色を確定し、後段のHierarchy色による上書きを防ぐ */
.c-button:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  --button-icon-color: var(--semantic-icon-disabled);
  background: var(--semantic-surface-disabled-strong);
  color: var(--semantic-text-disabled);
  pointer-events: none;
}

/* タッチ端末の疑似hover残留を無効化し、明示した状態と実押下中だけ状態色を維持する */
@media (hover: none) {
  .c-button:hover:not(:active):not(:focus-visible):not([data-state]) {
    background: var(--button-surface-enabled);
  }
  .c-button[data-hierarchy=secondary]:hover:not(:active):not(:focus-visible):not([data-state]) {
    background: var(--semantic-border-primary);
  }
  .c-button[data-hierarchy=secondary]:hover:not(:active):not(:focus-visible):not([data-state])::before {
    background: var(--button-surface-enabled);
  }
  .c-button[data-size=small][data-hierarchy=secondary]:hover:not(:active):not(:focus-visible):not([data-state]) {
    background: var(--button-surface-enabled);
  }
}
/* ラベルを持たないIconButtonはdata-iconを状態源にし、外形・状態・アイコン色を共通化する */
.c-icon-button {
  --icon-button-size: var(--space-32);
  --icon-button-padding: var(--space-4);
  --icon-button-icon-size: var(--space-24);
  --icon-button-icon-color: var(--semantic-icon-primary);
  --icon-button-icon-mask: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 行内に置くと既定のベースライン揃えで下に文字の下端分の余白が生まれるため上端で揃える */
  vertical-align: top;
  inline-size: var(--icon-button-size);
  block-size: var(--icon-button-size);
  padding: var(--icon-button-padding);
  border: var(--space-0);
  border-radius: var(--layout-panel-radius);
  appearance: none;
  background-color: transparent;
  color: var(--icon-button-icon-color);
}
.c-icon-button::before {
  content: "";
  flex: none;
  inline-size: var(--icon-button-icon-size);
  block-size: var(--icon-button-icon-size);
  background-color: var(--icon-button-icon-color);
  -webkit-mask: var(--icon-button-icon-mask) no-repeat center/contain;
  mask: var(--icon-button-icon-mask) no-repeat center/contain;
}
.c-icon-button:is(:hover, [data-state=hover]) {
  background-color: var(--semantic-surface-tertiary-hover);
}
.c-icon-button:is(:active, [data-state=active], [data-state=pressed]) {
  background-color: var(--semantic-surface-tertiary-pressed);
}
.c-icon-button {
  /* 内側2pxで描き、Focus時にも外寸と周辺レイアウトを変えない */
}
.c-icon-button:is(:focus-visible, [data-state=focus]) {
  outline: none;
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-2) var(--semantic-border-accent);
}
.c-icon-button:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  --icon-button-icon-color: var(--semantic-icon-disabled);
  background-color: transparent;
  box-shadow: none;
  color: var(--semantic-icon-disabled);
  pointer-events: none;
}
@media (min-width: 768px) {
  .c-icon-button {
    --icon-button-size: var(--space-40);
    --icon-button-padding: var(--space-8);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-icon-button {
    transition: background-color var(--motion-icon-duration) var(--motion-icon-easing), box-shadow var(--motion-icon-duration) var(--motion-icon-easing), color var(--motion-icon-duration) var(--motion-icon-easing);
  }
}

.c-icon-button[data-icon=prev] {
  --icon-button-icon-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15 4L7 12L15 20' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E");
}

.c-icon-button[data-icon=next] {
  --icon-button-icon-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 4L17 12L9 20' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E");
}

/* オートプレイの動作 / 停止 停止中（aria-pressed=true）は再生アイコン */
.c-icon-button[data-icon=toggle] {
  --icon-button-icon-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8.25 3V21M15.75 3V21' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E");
}
.c-icon-button[data-icon=toggle][aria-pressed=true] {
  --icon-button-icon-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.4697 12L5.75 19.7168V4.28223L19.4697 12Z' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E");
}

.c-icon-button[data-icon=search] {
  --icon-button-icon-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='10' cy='10' r='7.25' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M16.5 16.5L22 22' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E");
}

.c-icon-button[data-icon=close] {
  --icon-button-icon-mask: var(--component-icon-close-mask);
}

/* 検索表示トリガーは同じIconButton内で検索と閉じるをクロスフェードする */
.c-icon-button[data-icon=search][aria-expanded]::before, .c-icon-button[data-icon=search][aria-expanded]::after {
  position: absolute;
  inset-block-start: var(--ratio-half);
  inset-inline-start: var(--ratio-half);
  inline-size: var(--icon-button-icon-size);
  block-size: var(--icon-button-icon-size);
  translate: calc(var(--ratio-half) * -1) calc(var(--ratio-half) * -1);
}
.c-icon-button[data-icon=search][aria-expanded]::after {
  content: "";
  opacity: 0;
  background-color: var(--icon-button-icon-color);
  -webkit-mask: var(--component-icon-close-mask) no-repeat center/contain;
  mask: var(--component-icon-close-mask) no-repeat center/contain;
}
.c-icon-button[data-icon=search][aria-expanded][aria-expanded=true]::before {
  opacity: 0;
}
.c-icon-button[data-icon=search][aria-expanded][aria-expanded=true]::after {
  opacity: 1;
}
@media (prefers-reduced-motion: no-preference) {
  .c-icon-button[data-icon=search][aria-expanded]::before, .c-icon-button[data-icon=search][aria-expanded]::after {
    transition: opacity var(--motion-icon-duration) var(--motion-icon-easing);
  }
}

/* SPのハンバーガーボタン 右上を切り欠いた面はマスクで抜き色はトークンで決める 背景画像は遷移できないため開と閉のアイコンを2層に分けてクロスフェードする */
.c-icon-button[data-icon=menu] {
  --icon-button-size: var(--space-40);
  --icon-button-padding: var(--space-0);
  position: relative;
  border-radius: var(--space-0);
  background: var(--semantic-surface-primary);
  color: var(--semantic-icon-inverse-primary);
  /* 右上を斜めに切り欠き残る3隅を丸める面 外部ファイルを参照せず40pxの実寸で描く */
  clip-path: path("M31.1716 0C31.702 0 32.2107 0.210714 32.5858 0.585786L39.4142 7.41421C39.7893 7.78929 40 8.29799 40 8.82843V38C40 39.1046 39.1046 40 38 40H2C0.895431 40 0 39.1046 0 38V2C0 0.895431 0.895431 0 2 0H31.1716Z");
}
.c-icon-button[data-icon=menu]:hover, .c-icon-button[data-icon=menu]:focus-visible {
  background: var(--semantic-surface-primary-hover);
}
.c-icon-button[data-icon=menu]::before, .c-icon-button[data-icon=menu]::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  translate: none;
  background: no-repeat center/var(--space-32) var(--space-32);
  -webkit-mask: none;
  mask: none;
}
.c-icon-button[data-icon=menu]::before {
  background-image: url("../images/common/icon-menu-inverse.svg");
}
.c-icon-button[data-icon=menu] {
  /* 閉じるアイコンは重ねて配置しメニュー表示中だけ不透明にする */
}
.c-icon-button[data-icon=menu]::after {
  background-image: url("../images/common/icon-menu-close-inverse.svg");
  opacity: 0;
}
.c-icon-button[data-icon=menu][aria-expanded=true]::before {
  opacity: 0;
}
.c-icon-button[data-icon=menu][aria-expanded=true]::after {
  opacity: 1;
}
@media (prefers-reduced-motion: no-preference) {
  .c-icon-button[data-icon=menu]::before, .c-icon-button[data-icon=menu]::after {
    transition: opacity var(--motion-icon-duration) var(--motion-icon-easing);
  }
}

/* 枠線だけのボタン 外部リンクを開く導線に使う 面のあるボタンとは別種のため切り欠きを持たない */
.c-button-outline {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: inline-flex;
  align-items: center;
  justify-content: var(--alignment-justify-space-between);
  gap: var(--space-0);
  inline-size: calc(var(--space-256) - var(--space-28));
  min-inline-size: var(--space-96);
  min-block-size: var(--space-44);
  padding: var(--space-12);
  border-radius: var(--layout-panel-radius);
  /* 枠線は内側へ描き高さを内容と内側余白だけで決める */
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-primary);
  background: transparent;
  color: var(--semantic-text-primary);
}
.c-button-outline:hover {
  background: var(--semantic-surface-tertiary-hover);
}
.c-button-outline::before, .c-button-outline::after {
  content: "";
  flex: none;
}
.c-button-outline::before {
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-parking.svg") no-repeat center/var(--space-20) var(--space-20);
}
.c-button-outline {
  /* 別タブで開くことを示す */
}
.c-button-outline::after {
  inline-size: var(--space-16);
  block-size: var(--space-16);
  background: url("../images/common/icon-blanklink.svg") no-repeat center/contain;
}

.c-choice {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  align-items: flex-start;
  gap: var(--component-checkbox-gap);
  min-block-size: var(--space-24);
  cursor: pointer;
}
.c-choice:has(.c-choice__input:disabled) {
  cursor: not-allowed;
}

@media (min-width: 768px) {
  .c-choice {
    font-size: var(--font-size-16);
  }
}
.c-choice__input {
  position: relative;
  flex: none;
  inline-size: calc(var(--space-24) - var(--space-2));
  block-size: calc(var(--space-24) - var(--space-2));
  margin: var(--space-1);
  border: var(--space-1) solid var(--semantic-border-secondary);
  border-radius: var(--layout-panel-radius);
  appearance: none;
  cursor: pointer;
}
.c-choice__input::after {
  position: absolute;
  content: "";
  inline-size: calc(var(--space-8) + var(--space-4));
  block-size: calc(var(--space-4) + var(--space-2));
  inset-block-start: calc(var(--ratio-half) - var(--space-1));
  inset-inline-start: var(--ratio-half);
  border: solid var(--semantic-icon-accent);
  border-width: var(--space-0) var(--space-0) var(--space-2) var(--space-2);
  opacity: 0;
  translate: -50% -50%;
  rotate: -45deg;
}
.c-choice__input:checked::after {
  opacity: 1;
}
@media (prefers-reduced-motion: no-preference) {
  .c-choice__input::after {
    transition: opacity var(--motion-icon-duration) var(--motion-icon-easing);
  }
}
.c-choice__input:disabled {
  border-color: var(--semantic-border-disabled);
  background-color: var(--semantic-surface-disabled-weak);
  cursor: not-allowed;
}
.c-choice__input:disabled:checked::after {
  border-color: var(--semantic-icon-disabled);
}

.c-dialog {
  display: none;
  flex-direction: column;
  inline-size: var(--component-modal-inline-size-mobile);
  min-inline-size: var(--component-modal-min-inline-size-mobile);
  max-inline-size: none;
  min-block-size: var(--component-modal-min-block-size-mobile);
  max-block-size: var(--component-modal-max-block-size-mobile);
  padding: var(--space-24);
  border: var(--space-0);
  border-radius: calc(var(--layout-panel-radius) * 2);
  margin: auto;
  /* 外周と直下formは寸法と配置だけを担い 本文だけを唯一のスクロール領域にする */
  overflow: hidden;
  background: var(--semantic-background-base);
  color: var(--semantic-text-primary);
  opacity: var(--motion-menu-start-opacity);
  translate: var(--space-0);
}

/* 初期フォーカス先となる外枠にはリングを表示しない */
.c-dialog:focus {
  outline: none;
}

.c-dialog[open] {
  display: flex;
  opacity: 1;
}

.c-dialog > form {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-block-size: var(--space-0);
}

@media (prefers-reduced-motion: no-preference) {
  .c-dialog {
    transition: opacity var(--motion-menu-duration) var(--motion-menu-easing), translate var(--motion-menu-duration) var(--motion-menu-easing), display var(--motion-menu-duration) var(--motion-menu-easing) allow-discrete, overlay var(--motion-menu-duration) var(--motion-menu-easing) allow-discrete;
  }
  @starting-style {
    .c-dialog[open] {
      opacity: var(--motion-menu-start-opacity);
      translate: var(--space-0) var(--space-8);
    }
  }
}
.c-dialog__header {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-16);
  padding-block-end: var(--space-24);
}

.c-dialog__title {
  --heading-margin-block-end: var(--space-0);
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}

.c-dialog__close {
  --icon-button-size: var(--space-40);
  --icon-button-padding: var(--space-8);
  --icon-button-icon-size: var(--space-24);
  flex: none;
}

.c-dialog__body {
  position: relative;
  flex: 1 1 auto;
  min-block-size: var(--space-0);
  padding-block-end: var(--space-0);
  overflow-y: auto;
  overscroll-behavior-block: contain;
  scrollbar-gutter: stable;
}

.c-dialog__choices {
  display: grid;
  gap: var(--space-16);
  padding: var(--space-0);
  border: var(--space-0);
  margin: var(--space-0);
}

/* Fieldsetがスクロール本文を兼ねる場合はFocusリングの外周をクリップせず 末尾の規定余白も維持する */
.c-dialog__body.c-dialog__choices {
  padding-block-start: var(--layout-focus-outer-size);
  padding-inline: var(--layout-focus-outer-size);
  padding-block-end: var(--space-0);
  margin-block-start: calc(var(--layout-focus-outer-size) * -1);
  margin-inline: calc(var(--layout-focus-outer-size) * -1);
}

.c-dialog__actions {
  display: flex;
  flex: none;
  justify-content: center;
  gap: var(--space-12);
  padding-block-start: var(--space-16);
}
.c-dialog__actions > .c-button {
  flex: 1 1 var(--space-96);
  min-inline-size: var(--space-96);
  max-inline-size: calc(var(--space-256) - var(--space-28));
}

/* Defaultは規定最小高の余剰だけを操作部前へ送り、操作部自体の高さは伸ばさない */
.c-dialog[data-type=default] .c-dialog__body {
  display: flex;
  flex-direction: column;
  padding-block-end: var(--space-0);
}

.c-dialog[data-type=default] .c-dialog__actions {
  flex: none;
  margin-block-start: max(var(--space-32), var(--component-modal-default-action-gap-mobile));
  padding-block-start: var(--space-0);
}

.c-dialog[data-type=floating-button] {
  padding-block-end: calc(var(--space-44) + var(--space-16) * 2);
}
.c-dialog[data-type=floating-button] .c-dialog__body {
  padding-block-end: var(--space-24);
}
.c-dialog[data-type=floating-button] .c-dialog__actions {
  position: absolute;
  inset: auto var(--space-0) var(--space-0);
  padding: var(--space-16) var(--component-modal-floating-footer-inline-padding-mobile);
  background: var(--semantic-background-base);
}
@media (prefers-reduced-motion: no-preference) {
  .c-dialog[data-type=floating-button] .c-dialog__actions {
    transition: box-shadow var(--motion-duration) var(--motion-easing);
  }
}
.c-dialog[data-type=floating-button][data-body-overflow=true][data-body-scroll-end=false] .c-dialog__actions {
  box-shadow: var(--shadow-modal-floating-footer);
}

@media (min-width: 768px) {
  .c-dialog {
    inline-size: clamp(var(--component-modal-min-inline-size-desktop), var(--component-modal-inline-size-desktop), var(--component-modal-max-inline-size-desktop));
    min-inline-size: var(--component-modal-min-inline-size-desktop);
    max-inline-size: var(--component-modal-max-inline-size-desktop);
    min-block-size: var(--component-modal-min-block-size-desktop);
    max-block-size: var(--component-modal-max-block-size-desktop);
    padding: var(--space-32) var(--space-48);
  }
  .c-dialog__header {
    padding-block-end: var(--space-32);
  }
  .c-dialog__title {
    font-size: var(--font-size-20);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
  .c-dialog__choices {
    grid-template-columns: repeat(2, minmax(var(--space-0), 1fr));
    gap: var(--space-16) var(--space-24);
  }
  .c-dialog__actions {
    gap: var(--space-16);
    padding-block-start: var(--space-0);
  }
  .c-dialog__actions > .c-button {
    flex: 0 0 calc(var(--space-128) + var(--space-48));
    min-inline-size: calc(var(--space-128) + var(--space-48));
    max-inline-size: calc(var(--space-128) + var(--space-48));
  }
  .c-dialog[data-type=default] .c-dialog__actions {
    margin-block-start: max(var(--space-32), var(--component-modal-default-action-gap-desktop));
  }
  .c-dialog[data-type=floating-button] {
    padding-block-end: var(--space-80);
  }
  .c-dialog[data-type=floating-button] .c-dialog__body {
    padding-block-end: var(--space-32);
  }
  .c-dialog[data-type=floating-button] .c-dialog__actions {
    padding: var(--space-16) var(--space-48);
  }
}
/* Figma master annotations | M-IDs: M-004 | nodeIDs: 7065:10314 | ownerIDs: 7065:10314
Iconは表示/非表示可
*/
/* Figma master annotations | M-IDs: M-005 | nodeIDs: 7065:10314 | ownerIDs: 7065:10314
Smallのfont-size
標準：Label/Medium/Regular/Desktop
Header内のLanguage選択のみ：Label/Small/Regular/Desktop
*/
/* Figma master annotations | M-IDs: M-008, M-009 | nodeIDs: 7065:10317, 7065:10318 | ownerIDs: 7065:10314
Smallはデフォルト値を持つため、Placeholderなし
*/
.c-dropdown-trigger {
  --dropdown-trigger-padding-inline: var(--space-8);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  inline-size: max-content;
  max-inline-size: var(--ratio-full);
  min-inline-size: var(--component-dropdown-trigger-small-min-inline-size);
  block-size: var(--component-dropdown-trigger-small-block-size);
  padding-block: var(--space-8);
  padding-inline: var(--dropdown-trigger-padding-inline) calc(var(--dropdown-trigger-padding-inline) + var(--space-24));
  overflow: hidden;
  border: var(--space-0);
  border-radius: var(--layout-panel-radius);
  color: var(--semantic-text-primary);
  background: transparent;
  appearance: none;
  text-align: start;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.c-dropdown-trigger::before, .c-dropdown-trigger::after {
  position: absolute;
  inset-block-start: var(--ratio-half);
  display: block;
  background-color: var(--semantic-icon-primary);
  translate: var(--space-0) calc(var(--ratio-half) * -1);
}
.c-dropdown-trigger {
  /* アイコン無しでは疑似要素自体を生成せず、24pxの空き領域を残さない */
}
.c-dropdown-trigger::before {
  content: none;
}
.c-dropdown-trigger {
  /* 呼び出し元がアイコン有りを指定した時だけ先頭アイコンの領域を確保する */
}
.c-dropdown-trigger[data-has-icon=true] {
  padding-inline-start: calc(var(--dropdown-trigger-padding-inline) + var(--space-32));
}
.c-dropdown-trigger[data-has-icon=true]::before {
  content: "";
  inset-inline-start: var(--dropdown-trigger-padding-inline);
  inline-size: var(--space-24);
  block-size: var(--space-24);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
.c-dropdown-trigger[data-icon=language]::before {
  -webkit-mask-image: var(--component-dropdown-icon-language-mask);
  mask-image: var(--component-dropdown-icon-language-mask);
}
.c-dropdown-trigger {
  /* Dropdown Trigger共通の右シェブロン */
}
.c-dropdown-trigger::after {
  content: "";
  inset-inline-end: var(--dropdown-trigger-padding-inline);
  inline-size: var(--space-16);
  block-size: var(--space-16);
  -webkit-mask: var(--component-dropdown-icon-chevron-mask) no-repeat center/contain;
  mask: var(--component-dropdown-icon-chevron-mask) no-repeat center/contain;
  rotate: 90deg;
}
.c-dropdown-trigger:is(:hover, [data-state=hover]) {
  background-color: var(--semantic-surface-tertiary-hover);
}
.c-dropdown-trigger {
  /* Figma master annotations | M-IDs: M-007 | nodeIDs: 7065:10328 | ownerIDs: 7065:10314
  アイコン180度回転（Rotate）
  */
}
.c-dropdown-trigger:is(:active, [data-state=pressed]) {
  background-color: transparent;
}
.c-dropdown-trigger:is(:active, [data-state=pressed])::after {
  rotate: 270deg;
}
.c-dropdown-trigger:is([aria-expanded=true], [data-state=active]) {
  background-color: transparent;
  box-shadow: none;
}
.c-dropdown-trigger:is([aria-expanded=true], [data-state=active])::after {
  rotate: 270deg;
}
.c-dropdown-trigger:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  background-color: transparent;
  box-shadow: none;
  cursor: not-allowed;
  pointer-events: none;
}
.c-dropdown-trigger:is(:disabled, [aria-disabled=true], [data-state=disabled])::before, .c-dropdown-trigger:is(:disabled, [aria-disabled=true], [data-state=disabled])::after {
  background-color: var(--semantic-icon-disabled);
}
.c-dropdown-trigger[data-size=regular] {
  --dropdown-trigger-padding-inline: var(--space-12);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  inline-size: var(--component-dropdown-trigger-regular-inline-size);
  block-size: var(--component-dropdown-trigger-regular-block-size);
  padding-block: var(--space-12);
  border: var(--space-0);
  color: var(--semantic-text-tertiary);
  background-color: transparent;
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-secondary);
}
.c-dropdown-trigger[data-size=regular]:is(:hover, [data-state=hover]) {
  background-color: var(--semantic-surface-tertiary-hover);
}
.c-dropdown-trigger[data-size=regular]:is(:active, [data-state=pressed]) {
  color: var(--semantic-text-primary);
  background-color: transparent;
}
.c-dropdown-trigger[data-size=regular]:is([aria-expanded=true], [data-state=active]) {
  color: var(--semantic-text-tertiary);
  background-color: transparent;
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-secondary);
}
.c-dropdown-trigger[data-size=regular]:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  background-color: var(--semantic-surface-disabled-weak);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-disabled);
}
.c-dropdown-trigger:is(:focus-visible, [data-state=focus]) {
  outline: none;
  border-color: var(--semantic-border-accent);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-2) var(--semantic-border-accent);
}
@media (min-width: 1024px) {
  .c-dropdown-trigger {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
    min-inline-size: calc(var(--space-96) + var(--space-2));
  }
  .c-dropdown-trigger[data-size=regular] {
    --dropdown-trigger-padding-inline: var(--space-16);
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
    block-size: var(--space-56);
    padding-block: var(--space-16);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-dropdown-trigger {
    transition: color var(--motion-icon-duration) var(--motion-icon-easing), background-color var(--motion-icon-duration) var(--motion-icon-easing), border-color var(--motion-icon-duration) var(--motion-icon-easing), box-shadow var(--motion-icon-duration) var(--motion-icon-easing);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-dropdown-trigger::before, .c-dropdown-trigger::after {
    transition: background-color var(--motion-icon-duration) var(--motion-icon-easing), rotate var(--motion-icon-duration) var(--motion-icon-easing);
  }
}

/* ドロップダウンをトリガー直下へ配置し外枠を透明にして内側のシートに背景と枠を設定する */
.c-dropdown {
  /* popovertargetが確立する暗黙アンカーを使い、ページ内の別Dropdown Triggerとは共有しない */
  position: absolute;
  inset-block-start: calc(var(--ratio-full) + var(--space-8));
  inset-inline-start: var(--ratio-half);
  translate: -50% 0;
  /* 包含ブロックが呼び出し元と異なる場合のみアンカーを指定し同じ配置に揃える */
}
@supports (anchor-name: --a) {
  .c-dropdown {
    position-anchor: auto;
    inset: calc(anchor(bottom) + var(--space-8)) auto auto anchor(center);
    /* popoverのUA既定marginがautoのままだと中心がずれる */
    margin: var(--space-0);
  }
}
@media (prefers-reduced-motion: no-preference) {
  @starting-style {
    .c-dropdown:popover-open {
      translate: -50% var(--motion-menu-start-offset);
    }
  }
}
.c-dropdown {
  z-index: var(--layout-popover-layer);
  inline-size: max-content;
  padding: var(--space-0);
  overflow: visible;
  border: var(--space-0);
  background: transparent;
  /* Anchor Positioning非対応環境でもJSが測定した対応Triggerの直下だけを使用する */
}
@supports not (anchor-name: --a) {
  .c-dropdown {
    position: fixed;
    inset: var(--dropdown-fallback-block-start, var(--space-0)) auto auto var(--dropdown-fallback-inline-center, var(--ratio-half));
    margin: var(--space-0);
  }
}
.c-dropdown {
  /* PC版Languageは現行ヘッダートリガー幅へ追従させる min / maxはFigma確定後に有効化する */
}
@media (min-width: 1024px) {
  @supports (anchor-name: --a) {
    .c-dropdown {
      inline-size: anchor-size(inline);
    }
  }
}

.c-dropdown-sheet {
  padding: var(--space-8) var(--space-0);
  border: var(--space-0);
  border-radius: var(--layout-panel-radius);
  background: var(--semantic-background-base);
  box-shadow: var(--shadow-level-1);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: hidden;
  /* Figma確定後にPC / SP別の最小幅と最大幅を有効化する */
  /* min-inline-size: var(--component-dropdown-sheet-min-inline-size-mobile); */
  /* max-inline-size: var(--component-dropdown-sheet-max-inline-size-mobile); */
}
.c-dropdown-sheet > li {
  inline-size: var(--ratio-full);
}
.c-dropdown-sheet > li > :is(a, button) {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  align-items: center;
  min-block-size: var(--space-44);
  padding: var(--space-12) var(--space-16);
  border-radius: var(--layout-focus-radius);
  white-space: nowrap;
}
@media (prefers-reduced-motion: no-preference) {
  .c-dropdown-sheet > li > :is(a, button) {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-dropdown-sheet > li > :is(a, button):hover, .c-dropdown-sheet > li > :is(a, button):focus-visible {
  color: var(--semantic-text-link);
}
.c-dropdown-sheet > li > :is(a, button) {
  /* Dropdown Sheet内だけはパネルのoverflowで欠けないようFocus Ringを内側へ描く */
}
.c-dropdown-sheet > li > :is(a, button):focus-visible {
  outline: none;
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--layout-focus-width) var(--semantic-border-focus);
}
@media (forced-colors: active) {
  .c-dropdown-sheet > li > :is(a, button):focus-visible {
    outline: var(--layout-focus-width) solid Highlight;
    outline-offset: calc(var(--layout-focus-width) * -1);
    box-shadow: none;
  }
}
.c-dropdown-sheet > li > :is(a, button) {
  inline-size: var(--ratio-full);
}
@media (min-width: 1024px) {
  .c-dropdown-sheet {
    /* min-inline-size: var(--component-dropdown-sheet-min-inline-size-desktop); */
    /* max-inline-size: var(--component-dropdown-sheet-max-inline-size-desktop); */
  }
}

.c-filter-trigger-group {
  display: grid;
  grid-template-columns: repeat(2, minmax(var(--space-0), 1fr));
  gap: var(--space-12);
  padding: var(--space-0);
  border: var(--space-0);
  margin: var(--space-0);
}

.c-filter-trigger {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-filter-trigger::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-filter-trigger:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-filter-trigger:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-filter-trigger:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-filter-trigger:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.c-filter-trigger {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-8);
  min-inline-size: var(--space-0);
  block-size: var(--space-44);
  padding: var(--space-8) var(--space-12);
  border: var(--space-1) solid var(--semantic-border-primary);
  border-radius: var(--layout-panel-radius);
  background: transparent;
  color: var(--semantic-text-primary);
  text-align: center;
}
.c-filter-trigger:is(:hover, [data-state=hover]) {
  background: var(--semantic-surface-tertiary-hover);
}
.c-filter-trigger:is(:active, [data-state=pressed]) {
  background: var(--semantic-surface-tertiary-pressed);
}
.c-filter-trigger:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  background: var(--semantic-surface-disabled-weak);
  color: var(--semantic-text-disabled);
  pointer-events: none;
  border-color: var(--semantic-border-disabled);
}
.c-filter-trigger:is(:disabled, [aria-disabled=true], [data-state=disabled])::after {
  border-width: var(--space-0);
  background: transparent;
}
.c-filter-trigger {
  /* 適用済み条件ではラベル位置を動かさず左端の24px領域へ規定チェックを表示する */
}
.c-filter-trigger[data-active=true]::before {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: var(--space-12);
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-check.svg") no-repeat center/contain;
  translate: var(--space-0) -50%;
}
@media (prefers-reduced-motion: no-preference) {
  .c-filter-trigger {
    transition: background-color var(--motion-duration) var(--motion-easing), border-color var(--motion-duration) var(--motion-easing), color var(--motion-duration) var(--motion-easing);
  }
}

.c-filter-dialog__content,
.c-filter-dialog__section,
.c-filter-dialog__category-groups,
.c-filter-dialog__category-group,
.c-filter-dialog__facility-groups,
.c-filter-dialog__facility-group,
.c-filter-dialog__options {
  display: grid;
}

.c-filter-dialog__content {
  gap: var(--space-24);
}

.c-filter-dialog__section {
  gap: var(--space-12);
  padding: var(--space-0);
  border: var(--space-0);
  margin: var(--space-0);
}

.c-filter-dialog__legend {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  padding: var(--space-0);
  margin-block-end: var(--space-12);
}

.c-filter-dialog__category-groups,
.c-filter-dialog__facility-groups {
  gap: var(--space-24);
}

.c-filter-dialog__category-group,
.c-filter-dialog__facility-group {
  gap: var(--space-16);
  padding: var(--space-0);
  border: var(--space-0);
  margin: var(--space-0);
}

.c-filter-dialog__options {
  gap: var(--space-16);
}

.c-filter-dialog__options[data-level=child] {
  padding-inline-start: var(--space-32);
}

.c-filter-dialog__initials {
  display: grid;
  grid-template-columns: repeat(auto-fit, var(--space-40));
  gap: var(--space-12);
}

.c-filter-dialog__initial {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-flat);
  position: relative;
  display: grid;
  place-items: center;
  inline-size: var(--space-40);
  block-size: var(--space-40);
  border-radius: var(--layout-panel-radius);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-secondary);
  cursor: pointer;
}
.c-filter-dialog__initial:has(input:checked) {
  background: var(--semantic-surface-primary);
  color: var(--semantic-text-inverse-primary);
  box-shadow: none;
}
.c-filter-dialog__initial:has(input:focus-visible) {
  outline: var(--layout-focus-width) solid var(--semantic-border-focus);
  outline-offset: var(--layout-focus-offset);
}
.c-filter-dialog__initial input {
  position: absolute;
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  opacity: 0;
  cursor: inherit;
}
@media (prefers-reduced-motion: no-preference) {
  .c-filter-dialog__initial {
    transition: background-color var(--motion-duration) var(--motion-easing), color var(--motion-duration) var(--motion-easing), box-shadow var(--motion-duration) var(--motion-easing);
  }
}

@media (min-width: 768px) {
  .c-filter-trigger-group {
    grid-template-columns: repeat(4, minmax(var(--space-0), 1fr));
    gap: var(--space-16) var(--space-24);
  }
  .c-filter-trigger {
    font-size: var(--font-size-16);
    block-size: var(--space-48);
    padding: var(--space-12) var(--space-16);
  }
  .c-filter-dialog__content {
    gap: var(--space-32);
  }
  .c-filter-dialog__category-groups,
  .c-filter-dialog__facility-groups {
    gap: var(--space-32);
  }
  .c-filter-dialog__options[data-layout=columns] {
    grid-template-columns: repeat(2, minmax(var(--space-0), 1fr));
    column-gap: var(--space-16);
  }
  .c-filter-dialog__initials {
    gap: var(--space-16);
  }
}
.c-floor-map {
  position: relative;
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  margin: var(--space-0);
  padding: var(--space-0);
}

.c-floor-map__image {
  display: block;
  inline-size: var(--ratio-full);
  block-size: auto;
}

.c-floor-map__pin {
  position: absolute;
  display: none;
  inline-size: var(--space-40);
  block-size: var(--space-56);
  max-inline-size: none;
  translate: -50% calc(-100% - var(--space-8));
  pointer-events: none;
  z-index: var(--layout-image-overlay-layer);
}
@media (prefers-reduced-motion: no-preference) {
  .c-floor-map__pin {
    transition: left var(--motion-duration) var(--motion-easing), top var(--motion-duration) var(--motion-easing);
  }
}

@media (max-width: 767px) {
  .c-floor-map__pin {
    inline-size: calc(var(--space-32) + var(--space-2));
    block-size: var(--space-48);
  }
}
.c-floor-map[data-map-loaded][data-position] > .c-floor-map__pin {
  display: block;
  left: var(--floor-map-x);
  top: var(--floor-map-y);
}

.c-floor-map[data-pin-placement=area] > .c-floor-map__pin {
  translate: -50% -100%;
}

.c-breadcrumb ol {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  gap: var(--space-8);
  padding-block: var(--space-12) var(--space-16);
  color: var(--semantic-text-tertiary);
}

.c-breadcrumb li + li::before {
  content: "/";
  margin-inline-end: var(--space-8);
  color: var(--semantic-text-tertiary);
}

.c-breadcrumb a {
  color: var(--semantic-text-primary);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-breadcrumb a::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-breadcrumb a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-breadcrumb a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-breadcrumb a:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-breadcrumb a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.c-breadcrumb a {
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-underline-position: from-font;
}
@media (prefers-reduced-motion: no-preference) {
  .c-breadcrumb a {
    transition: text-decoration-color var(--motion-duration) var(--motion-easing);
  }
}
.c-breadcrumb a:hover, .c-breadcrumb a:focus-visible {
  text-decoration-color: currentcolor;
}

@media (min-width: 768px) {
  .c-breadcrumb ol {
    font-size: var(--font-size-14);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
}
@media (max-width: 767px) {
  .c-breadcrumb li {
    flex: 0 0 auto;
  }
  .c-breadcrumb li:last-child {
    flex: 0 1 auto;
    min-inline-size: var(--space-0);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
}
.c-card > a {
  display: grid;
  align-content: start;
  gap: var(--space-12);
  block-size: var(--ratio-full);
}

.c-card,
.c-card > a,
.c-card__body {
  min-inline-size: var(--space-0);
}

.c-card {
  overflow-wrap: anywhere;
}

.c-card__body {
  display: grid;
  align-content: start;
  gap: var(--space-8);
}

.c-card__category {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  color: var(--semantic-text-link);
  margin-block-end: calc(var(--space-4) * -1);
}

.c-card__labels {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-8);
  min-block-size: calc(var(--font-size-12) * var(--line-height-narrow));
  margin-block-end: calc(var(--space-4) * -1);
}
.c-card__labels .c-card__category {
  margin-block-end: var(--space-0);
}
@media (min-width: 768px) {
  .c-card__labels {
    gap: var(--space-12);
  }
}

.c-card__forecast {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: inline-flex;
  align-items: center;
  gap: var(--space-8);
  color: var(--primitive-berry-red-600);
}
.c-card__forecast::before {
  inline-size: var(--space-1);
  block-size: 1em;
  background-color: var(--semantic-text-secondary);
  content: "";
}
@media (min-width: 768px) {
  .c-card__forecast {
    gap: var(--space-12);
    font-size: var(--font-size-14);
  }
}

.c-card__floor,
.c-card__meta {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  color: var(--semantic-text-secondary);
}

.c-card__title {
  --heading-margin-block-end: var(--space-0);
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.c-card--recommend > a {
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  gap: var(--space-12);
}
.c-card--recommend .c-card__image {
  inline-size: var(--ratio-full);
  aspect-ratio: var(--card-recommend-image-aspect-ratio);
  block-size: auto;
}
.c-card--recommend .c-card__image img {
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}

.c-card-list--recommend {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  align-content: flex-start;
  justify-content: flex-start;
  gap: var(--space-16) var(--space-12);
}
.c-card-list--recommend > * {
  flex: 0 1 calc((var(--ratio-full) - var(--space-12) * (var(--card-recommend-max-columns) - 1)) / var(--card-recommend-max-columns));
  max-inline-size: none;
  min-inline-size: var(--space-0);
}
@media (max-width: 767px) {
  .c-card-list--recommend {
    max-inline-size: none;
  }
  .c-card-list--recommend > * {
    max-inline-size: none;
  }
}
.c-card-list--recommend {
  min-block-size: calc(var(--space-256) * 2 + var(--space-68));
}
.c-card-list--recommend .c-card > a {
  grid-template-columns: minmax(var(--space-0), 23fr) minmax(var(--space-0), 33fr);
}
.c-card-list--recommend > .c-card:nth-child(n+6) {
  display: none;
}
@media (min-width: 768px) {
  .c-card-list--recommend {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: flex-start;
    justify-content: flex-start;
    gap: var(--space-32) var(--layout-grid-gutter);
    inline-size: var(--ratio-full);
    max-inline-size: calc(var(--card-recommend-max-inline-size) * var(--card-recommend-max-columns) + var(--layout-grid-gutter) * (var(--card-recommend-max-columns) - 1));
    margin-inline: auto;
  }
  .c-card-list--recommend > * {
    flex: 0 1 calc((var(--ratio-full) - var(--layout-grid-gutter) * (var(--card-recommend-max-columns) - 1)) / var(--card-recommend-max-columns));
    max-inline-size: var(--card-recommend-max-inline-size);
    min-inline-size: var(--space-0);
  }
  .c-card-list--recommend {
    min-block-size: calc(var(--space-256) * 3 + var(--space-56));
  }
  .c-card-list--recommend .c-card > a {
    display: grid;
    grid-template-columns: none;
  }
  .c-card-list--recommend .c-card__category,
  .c-card-list--recommend .c-card__meta {
    font-size: var(--font-size-14);
  }
  .c-card-list--recommend > .c-card:nth-child(n+6) {
    display: block;
  }
}

.c-card--shopnews > a {
  inline-size: var(--card-shopnews-max-inline-size);
  gap: var(--space-12);
}
.c-card--shopnews .c-card__image,
.c-card--shopnews .c-card__image img {
  inline-size: var(--card-shopnews-max-inline-size);
  block-size: calc(var(--space-256) - var(--space-12));
}
.c-card--shopnews .c-card__title {
  --heading-margin-block-end: var(--space-4);
  font-size: var(--font-size-14);
}
@media (min-width: 768px) {
  .c-card--shopnews > a {
    inline-size: var(--card-shopnews-max-inline-size);
    gap: var(--space-16);
  }
  .c-card--shopnews .c-card__image,
  .c-card--shopnews .c-card__image img {
    inline-size: var(--card-shopnews-max-inline-size);
    block-size: calc(var(--space-256) * 2 - var(--space-16) + var(--space-8));
  }
}
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  .c-card--shopnews > a .c-card__title {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (min-width: 768px) and (hover: hover) {
  .c-card--shopnews > a:hover .c-card__title {
    color: var(--semantic-text-primary-hover);
  }
}
@media (min-width: 768px) {
  .c-card--shopnews > a[data-state=hover] .c-card__title {
    color: var(--semantic-text-primary-hover);
  }
  .c-card--shopnews > a:is(:active, [data-state=pressed]) .c-card__title {
    color: var(--semantic-text-primary-pressed);
  }
  .c-card--shopnews .c-card__title {
    font-size: var(--font-size-16);
  }
}

/* Figma I6374:5909;5466:50983
タイトルはSPで3行まで（それ以上は...で省略）
現行サイトで表示している説明文は削除。タイトルのみとする。
Figma I6374:6210;2394:16723
タイトルはPCで2行まで（それ以上は...で省略）
現行サイトで表示している説明文は削除。タイトルのみとする。
*/
.c-card--promotion > a {
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  gap: var(--space-8);
}
.c-card--promotion .c-card__image {
  inline-size: var(--ratio-full);
  aspect-ratio: var(--card-promotion-image-aspect-ratio);
  block-size: auto;
}
.c-card--promotion .c-card__image img {
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}
.c-card--promotion .c-card__image {
  --layout-image-border-width: var(--space-0);
}
.c-card--promotion .c-card__title {
  font-size: var(--font-size-12);
  line-height: var(--line-height-narrow);
  -webkit-line-clamp: 3;
}
@media (min-width: 768px) {
  .c-card--promotion > a {
    gap: var(--space-16);
  }
}
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  .c-card--promotion > a .c-card__title {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (min-width: 768px) and (hover: hover) {
  .c-card--promotion > a:hover .c-card__title {
    color: var(--semantic-text-primary-hover);
  }
}
@media (min-width: 768px) {
  .c-card--promotion > a[data-state=hover] .c-card__title {
    color: var(--semantic-text-primary-hover);
  }
  .c-card--promotion > a:is(:active, [data-state=pressed]) .c-card__title {
    color: var(--semantic-text-primary-pressed);
  }
  .c-card--promotion .c-card__title {
    font-size: var(--font-size-14);
    -webkit-line-clamp: 2;
  }
}

.c-card-list--promotion {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  align-content: flex-start;
  justify-content: center;
  gap: var(--space-32) var(--space-12);
  inline-size: var(--ratio-full);
  max-inline-size: calc(var(--card-promotion-max-inline-size) * var(--card-promotion-max-columns) + var(--space-12) * (var(--card-promotion-max-columns) - 1));
  margin-inline: auto;
}
.c-card-list--promotion > * {
  flex: 0 1 calc((var(--ratio-full) - var(--space-12) * (var(--card-promotion-max-columns) - 1)) / var(--card-promotion-max-columns));
  max-inline-size: var(--card-promotion-max-inline-size);
  min-inline-size: var(--space-0);
}
@media (max-width: 767px) {
  .c-card-list--promotion {
    max-inline-size: none;
  }
  .c-card-list--promotion > * {
    max-inline-size: none;
  }
}
.c-card-list--promotion {
  justify-content: flex-start;
  min-block-size: calc(var(--space-256) * 3 - var(--space-16) + var(--space-8) + var(--space-2));
}
@media (min-width: 768px) {
  .c-card-list--promotion {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: flex-start;
    justify-content: center;
    gap: var(--space-48) var(--layout-grid-gutter);
    inline-size: var(--ratio-full);
    max-inline-size: calc(var(--card-promotion-max-inline-size) * var(--card-promotion-max-columns) + var(--layout-grid-gutter) * (var(--card-promotion-max-columns) - 1));
    margin-inline: auto;
  }
  .c-card-list--promotion > * {
    flex: 0 1 calc((var(--ratio-full) - var(--layout-grid-gutter) * (var(--card-promotion-max-columns) - 1)) / var(--card-promotion-max-columns));
    max-inline-size: var(--card-promotion-max-inline-size);
    min-inline-size: var(--space-0);
  }
  .c-card-list--promotion {
    justify-content: flex-start;
    min-block-size: calc(var(--space-256) * 2 + var(--space-56) - var(--space-2) + var(--space-4));
  }
}

.c-card--shopnews-feed > a {
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  gap: var(--space-12);
}
.c-card--shopnews-feed .c-card__image {
  inline-size: var(--ratio-full);
  aspect-ratio: var(--card-shopnews-feed-image-aspect-ratio);
  block-size: auto;
}
.c-card--shopnews-feed .c-card__image img {
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}
@media (prefers-reduced-motion: no-preference) {
  .c-card--shopnews-feed > a .c-card__title {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-card--shopnews-feed > a:hover .c-card__title, .c-card--shopnews-feed > a:focus-visible .c-card__title {
  color: var(--semantic-text-link);
}
.c-card--shopnews-feed > a:is([data-state=hover], [data-state=focus]) .c-card__title {
  color: var(--semantic-text-link);
}
.c-card--shopnews-feed > a:is(:active, [data-state=pressed]) .c-card__title {
  color: var(--semantic-text-primary-pressed);
}
.c-card--shopnews-feed .c-card__title {
  font-size: var(--font-size-14);
}
.c-card--shopnews-feed .c-card__summary {
  display: grid;
  gap: var(--space-4);
}
.c-card--shopnews-feed .c-card__text {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}
@media (min-width: 768px) {
  .c-card--shopnews-feed > a {
    gap: var(--space-16);
  }
  .c-card--shopnews-feed .c-card__body {
    gap: var(--space-12);
  }
  .c-card--shopnews-feed .c-card__summary {
    gap: var(--space-8);
  }
  .c-card--shopnews-feed .c-card__title {
    font-size: var(--font-size-16);
  }
  .c-card--shopnews-feed .c-card__meta {
    font-size: var(--font-size-14);
  }
}

:is(.c-card--shopnews, .c-card--shopnews-feed)[data-size=compact] > a {
  inline-size: calc(var(--space-128) + var(--space-8) + var(--space-2));
}
:is(.c-card--shopnews, .c-card--shopnews-feed)[data-size=compact] .c-card__image {
  inline-size: var(--ratio-full);
  block-size: auto;
  aspect-ratio: 9/16;
}
:is(.c-card--shopnews, .c-card--shopnews-feed)[data-size=compact] .c-card__image picture,
:is(.c-card--shopnews, .c-card--shopnews-feed)[data-size=compact] .c-card__image img {
  display: block;
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}
@media (min-width: 768px) {
  :is(.c-card--shopnews, .c-card--shopnews-feed)[data-size=compact] > a {
    inline-size: calc(var(--space-128) + var(--space-48));
  }
}

.c-card--shopnews-feed[data-size=compact] .c-card__image {
  aspect-ratio: var(--card-shopnews-feed-image-aspect-ratio);
}
.c-card--shopnews-feed[data-size=compact] .c-card__text {
  -webkit-line-clamp: 3;
}
.c-card--shopnews-feed[data-size=compact] .c-card__title {
  -webkit-line-clamp: 2;
}
@media (min-width: 768px) {
  .c-card--shopnews-feed[data-size=compact] .c-card__title {
    -webkit-line-clamp: 3;
  }
}
.c-card--shopnews-feed[data-size=compact] :is(.c-card__title, .c-card__text) {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (min-width: 768px) {
  .c-card--shopnews[data-size=compact] .c-card__floor, .c-card--shopnews[data-size=compact] .c-card__meta {
    font-size: var(--font-size-14);
  }
}

.c-carousel-control {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-12);
  padding-block-start: var(--layout-section-padding-inner-small);
  margin: var(--space-0);
}

.c-carousel-control__buttons {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex: none;
}

.c-carousel-control__count {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: grid;
  place-items: center;
  min-inline-size: var(--space-40);
  font-variant-numeric: tabular-nums;
}

.c-carousel-control__progress {
  inline-size: calc(var(--space-256) - var(--space-24));
  block-size: var(--space-4);
  border: var(--space-0);
  appearance: none;
  /* 現在フィーチャー中のスライドの滞留時間経過率を要素背景のグラデーションで描画する */
  background: linear-gradient(to right, var(--semantic-text-primary) var(--carousel-progress-ratio), transparent var(--carousel-progress-ratio)) var(--semantic-border-tertiary);
}
.c-carousel-control__progress::-webkit-progress-bar, .c-carousel-control__progress::-webkit-progress-value {
  background: transparent;
}
.c-carousel-control__progress::-moz-progress-bar {
  background: transparent;
}

/* FVの塗りが伸びるプログレスに対し こちらは一定幅のつまみが移動するスクロールバー型のトラック */
.c-carousel-control__scrollbar {
  /* 幅は操作ボタンを除いた親の空き幅へ追従する */
  --carousel-thumb-inline-size: var(--ratio-full);
  --carousel-thumb-inline-start: var(--space-0);
  position: relative;
  flex: 1 1 auto;
  min-inline-size: var(--space-0);
  inline-size: auto;
  block-size: var(--space-12);
  border: var(--space-1) solid var(--semantic-border-secondary);
  border-radius: calc(var(--space-12) / 2);
  background: var(--semantic-background-base);
}

/* つまみの幅と位置は表示領域と実コンテンツの比率からJSが書き込む。WebKitが合成レイヤーの移動を追従しないため`translate`は使わない */
.c-carousel-control__scrollbar::before {
  position: absolute;
  content: "";
  inset-block-start: var(--space-0);
  inset-inline-start: var(--carousel-thumb-inline-start);
  inline-size: var(--carousel-thumb-inline-size);
  block-size: var(--carousel-thumb-block-size);
  border-radius: calc(var(--carousel-thumb-block-size) / 2);
  background: var(--semantic-surface-indicator);
}

/* 操作を受けるrange入力 トラックへ重ねて見た目は持たない */
.c-carousel-control__range {
  position: absolute;
  inset-inline: var(--space-0);
  inset-block-start: calc(var(--space-12) / -2);
  inline-size: var(--ratio-full);
  block-size: var(--space-24);
  margin: var(--space-0);
  padding: var(--space-0);
  border: var(--space-0);
  border-radius: var(--layout-focus-radius);
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  touch-action: none;
}
.c-carousel-control__range::-webkit-slider-runnable-track {
  block-size: var(--ratio-full);
}
.c-carousel-control__range::-webkit-slider-thumb {
  inline-size: var(--carousel-thumb-inline-size);
  block-size: var(--carousel-thumb-block-size);
  border: var(--space-0);
  background: transparent;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}
.c-carousel-control__range::-moz-range-track {
  block-size: var(--ratio-full);
}
.c-carousel-control__range::-moz-range-thumb {
  inline-size: var(--carousel-thumb-inline-size);
  block-size: var(--carousel-thumb-block-size);
  border: var(--space-0);
  background: transparent;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
}

.c-carousel-control--indicator {
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  padding-inline: var(--space-0);
}
@media (max-width: 767px) {
  .c-carousel-control--indicator {
    min-block-size: calc(var(--space-32) + var(--space-24));
  }
  .c-carousel-control--indicator .c-carousel-control__buttons > li:has([data-carousel-prev], [data-carousel-next]) {
    display: none;
  }
  .c-carousel-control--indicator .c-carousel-control__buttons:not(:has(> li:not([hidden]) > button:not([hidden]):not([data-carousel-prev], [data-carousel-next]))) {
    display: none;
  }
}
@media (min-width: 768px) {
  .c-carousel-control--indicator {
    gap: var(--space-24);
  }
}

.c-carousel-control__scrollbar {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-carousel-control__scrollbar::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
.c-carousel-control__scrollbar:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-carousel-control__scrollbar:is(:focus-visible, [data-state=focus])::after {
  inset: calc(calc(var(--space-2) + var(--space-1)) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-carousel-control__scrollbar:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.c-carousel-control__scrollbar:has(.c-carousel-control__range:focus-visible)::after, .c-carousel-control__scrollbar[data-state=focus]::after {
  inset: calc((var(--space-2) + var(--space-1)) * -1);
  border: var(--space-2) solid var(--semantic-border-accent);
  border-radius: var(--space-256);
}
@media (max-width: 767px) {
  .c-carousel-control__scrollbar {
    --carousel-thumb-block-size: var(--space-12);
  }
  .c-carousel-control__scrollbar::before {
    inset-block-start: calc(var(--space-1) * -1);
  }
}

.c-carousel-control__range:focus-visible {
  outline: none;
}

.c-carousel-control--fraction {
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-16);
  padding-block-start: var(--space-12);
}
.c-carousel-control--fraction .c-carousel-control__buttons {
  justify-content: center;
  gap: var(--space-8);
}
.c-carousel-control--fraction .c-carousel-control__count {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  min-inline-size: var(--space-48);
}
@media (min-width: 768px) {
  .c-carousel-control--fraction {
    gap: var(--space-24);
    padding-block-start: var(--space-16);
  }
  .c-carousel-control--fraction .c-carousel-control__count {
    min-inline-size: calc(var(--space-64) + var(--space-4));
    font-size: var(--font-size-16);
  }
}

.c-carousel-control__thumbnails {
  --carousel-thumbnail-columns: 4;
  --carousel-thumbnail-aspect-ratio: 4 / 5;
  --carousel-thumbnail-opacity: 0.6;
  inline-size: var(--ratio-full);
  overflow: clip;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((var(--ratio-full) - var(--space-12) * (var(--carousel-thumbnail-columns) - 1)) / var(--carousel-thumbnail-columns));
  gap: var(--space-12);
  padding: var(--space-0);
  margin: var(--space-0);
  list-style: none;
}
.c-carousel-control__thumbnails[hidden] {
  display: none;
}
.c-carousel-control__thumbnails > li {
  min-inline-size: var(--space-0);
  translate: calc((var(--ratio-full) + var(--space-12)) * var(--carousel-thumbnail-first, 0) * -1) var(--space-0);
}
@media (min-width: 768px) {
  .c-carousel-control__thumbnails {
    --carousel-thumbnail-columns: 5;
  }
}

.c-carousel--fraction[data-carousel-ready=true]:not([data-resizing=true]) .c-carousel-control__thumbnails > li {
  transition: translate var(--motion-duration) var(--motion-easing);
}

.c-carousel-control__thumbnail {
  position: relative;
  background: var(--semantic-background-base);
}
.c-carousel-control__thumbnail > picture {
  display: contents;
}
.c-carousel-control__thumbnail > img,
.c-carousel-control__thumbnail > picture > img {
  display: block;
  max-inline-size: var(--ratio-full);
  max-block-size: var(--ratio-full);
  object-fit: contain;
  object-position: center;
  background: var(--semantic-background-base);
  position: absolute;
  inset: var(--space-0);
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}
.c-carousel-control__thumbnail::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  z-index: var(--layout-image-overlay-layer);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--layout-image-border-width) var(--semantic-border-tertiary);
  mix-blend-mode: darken;
  pointer-events: none;
}
@media (forced-colors: active) {
  .c-carousel-control__thumbnail::before {
    border: var(--layout-image-border-width) solid CanvasText;
    box-shadow: none;
    mix-blend-mode: normal;
  }
}
.c-carousel-control__thumbnail {
  isolation: isolate;
  display: block;
  inline-size: var(--ratio-full);
  aspect-ratio: var(--carousel-thumbnail-aspect-ratio);
  padding: var(--space-0);
  border: var(--space-0);
  appearance: none;
  cursor: pointer;
}
.c-carousel-control__thumbnail img {
  display: block;
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  opacity: var(--carousel-thumbnail-opacity);
  transition: opacity var(--motion-duration) var(--motion-easing);
}
.c-carousel-control__thumbnail::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-2) solid transparent;
  z-index: var(--layout-image-overlay-layer);
  pointer-events: none;
  transition: border-color var(--motion-duration) var(--motion-easing);
}
.c-carousel-control__thumbnail:is([aria-current=true], :focus-visible, [data-state=focus-active]) {
  outline: none;
}
.c-carousel-control__thumbnail:is([aria-current=true], :focus-visible, [data-state=focus-active])::after {
  border-color: var(--semantic-border-accent);
}
.c-carousel-control__thumbnail:is([aria-current=true], :focus-visible, [data-state=focus-active]) img {
  opacity: 1;
}
.c-carousel-control__thumbnail[aria-disabled=true] {
  cursor: default;
}

[data-carousel-thumbnails=off] .c-carousel-control__thumbnails {
  display: none;
}

.c-carousel {
  position: relative;
  min-inline-size: var(--space-0);
}

.c-carousel__viewport {
  scroll-behavior: smooth;
  overflow: clip;
  overflow-clip-margin: var(--layout-focus-outer-size);
  overscroll-behavior-inline: contain;
  touch-action: pan-y;
}

.c-carousel__track {
  display: flex;
  align-items: flex-start;
  gap: var(--space-12);
  inline-size: max-content;
  translate: var(--carousel-offset, var(--space-0)) var(--space-0);
}

/* PCのFVだけで使用する常設の縮小列はSPでは生成済みでも描画しない */
.c-carousel__side-track {
  display: none;
}

.c-carousel__slide {
  flex: none;
}

.c-carousel--shopnews .c-carousel__track {
  align-items: stretch;
}
.c-carousel--shopnews .c-carousel__slide {
  display: flex;
}

/* SPは画像幅がビューポート幅に追従し高さが縦横比で決まるため 高さを固定せず内包する画像にリキッドで合わせる */
.c-carousel__main-window {
  display: contents;
}

.c-carousel--fv {
  --viewport-inline-size: 100cqw;
  container-type: inline-size;
}
.c-carousel--fv .c-carousel__viewport {
  /* 絶対配置の縮小列をこのクリップ領域の内側へ固定し、横長トラックをページ幅へ伝播させない */
  position: relative;
  inline-size: var(--viewport-inline-size);
  /* 下限だけを定めこれを下回る幅でも高さを保つ */
  min-block-size: calc(var(--space-256) - var(--space-16));
}
.c-carousel--fv .c-carousel__track {
  gap: var(--space-0);
}
.c-carousel--fv .c-carousel__slide,
.c-carousel--fv .c-image-frame--fv {
  inline-size: var(--viewport-inline-size);
  aspect-ratio: var(--carousel-fv-aspect-ratio);
}
.c-carousel--fv .c-image-frame--fv,
.c-carousel--fv .c-image-frame--fv img {
  block-size: var(--ratio-full);
}
.c-carousel--fv .c-image-frame--fv img {
  inline-size: var(--ratio-full);
}
.c-carousel--fv .c-carousel__slide > .c-media-link:focus-visible::after {
  inset: var(--space-0);
}
.c-carousel--fv .c-carousel-control {
  padding-block-start: var(--space-0);
  block-size: var(--space-56);
  margin-block: var(--space-0);
}
.c-carousel--fv {
  /* コンテンツ境界以上FV境界未満は画像を等倍で頭打ちにし左右の余白から前後のスライドを見せる */
}
@media (min-width: 768px) and (max-width: 1279px) {
  .c-carousel--fv .c-carousel__track {
    gap: var(--space-40);
  }
  .c-carousel--fv .c-carousel__slide,
  .c-carousel--fv .c-image-frame--fv {
    inline-size: min(var(--carousel-fv-image-inline-size), var(--viewport-inline-size) - (var(--space-40) + var(--space-32)) * 2);
  }
}
.c-carousel--fv {
  /* 横並び構成はFV境界以上でのみ適用する */
}
@media (min-width: 1280px) {
  .c-carousel--fv {
    /* カルーセル本体の高さ セクション全体の高さと混同しない */
    block-size: var(--carousel-fv-block-size);
  }
  .c-carousel--fv .c-carousel__viewport {
    inline-size: var(--viewport-inline-size);
    block-size: var(--carousel-fv-block-size);
  }
  .c-carousel--fv .c-carousel__track {
    position: relative;
    z-index: var(--layout-image-overlay-layer);
    gap: var(--space-0);
  }
  .c-carousel--fv {
    /* メイン列は全項目を常時716pxで横隣接させ 幅の切替と一時画像生成を行わない */
  }
  .c-carousel--fv .c-carousel__track > .c-carousel__slide,
  .c-carousel--fv .c-carousel__track > .c-carousel__slide .c-image-frame--fv {
    inline-size: var(--carousel-fv-image-inline-size);
    aspect-ratio: var(--carousel-fv-aspect-ratio);
  }
  .c-carousel--fv .c-carousel__main-window {
    position: absolute;
    display: block;
    inset-block-start: var(--space-0);
    inset-inline-start: calc((var(--viewport-inline-size) - var(--layout-content-width)) / 2);
    inline-size: var(--carousel-fv-image-inline-size);
    block-size: var(--carousel-fv-block-size);
    overflow: clip;
    z-index: var(--layout-image-overlay-layer);
  }
  .c-carousel--fv {
    /* 縮小列はメイン列の背面で392pxの画像を40px間隔のまま横送りする */
  }
  .c-carousel--fv .c-carousel__side-track {
    position: absolute;
    display: flex;
    visibility: hidden;
    align-items: flex-start;
    gap: var(--space-40);
    inset-block-start: var(--space-0);
    inset-inline-start: var(--space-0);
    z-index: var(--space-0);
    inline-size: max-content;
    margin: var(--space-0);
    padding: var(--space-0);
    translate: var(--carousel-side-offset, var(--space-0)) var(--space-0);
  }
  .c-carousel--fv[data-carousel-ready=true] .c-carousel__side-track {
    visibility: visible;
  }
  .c-carousel--fv .c-carousel__side-track > .c-carousel__slide,
  .c-carousel--fv .c-carousel__side-track > .c-carousel__slide .c-image-frame--fv {
    flex: none;
    inline-size: var(--layout-desktop-column-width);
    aspect-ratio: var(--carousel-fv-aspect-ratio);
  }
  .c-carousel--fv {
    /* 現在位置はメイン画像と同幅の透明なプレースホルダーにして左右の縮小列位置を維持する */
  }
  .c-carousel--fv .c-carousel__side-track > .c-carousel__slide[data-carousel-side-current=true] {
    visibility: hidden;
    inline-size: var(--carousel-fv-image-inline-size);
  }
  .c-carousel--fv .c-carousel-control {
    position: absolute;
    inset-inline: var(--layout-fv-side-start) var(--layout-fv-inset);
    inline-size: auto;
    inset-block-start: var(--carousel-fv-footer-offset);
    z-index: var(--layout-image-overlay-layer);
    block-size: var(--space-40);
    padding-inline: var(--space-0);
    margin: var(--space-0);
  }
  .c-carousel--fv .c-carousel-control__progress {
    inline-size: var(--layout-desktop-small-column-width);
  }
}

.c-carousel--fv[data-carousel-autoplay=off] .c-carousel-control__progress {
  inline-size: calc(var(--space-256) - var(--space-24) + var(--space-32) + var(--space-4));
  min-inline-size: var(--space-0);
}
@media (min-width: 768px) {
  .c-carousel--fv[data-carousel-autoplay=off] .c-carousel-control__progress {
    inline-size: calc(var(--space-256) - var(--space-24) + var(--space-40) + var(--space-4));
  }
}
@media (min-width: 1280px) {
  .c-carousel--fv[data-carousel-autoplay=off] .c-carousel-control__progress {
    inline-size: calc(var(--layout-desktop-small-column-width) + var(--space-40) + var(--space-4));
  }
}

.c-carousel--shopnews .c-carousel__viewport {
  inline-size: calc(var(--ratio-full) + var(--layout-page-gutter));
  min-block-size: calc(var(--carousel-shopnews-mobile-min-block-size) + var(--layout-focus-outer-size));
  padding-block-start: var(--layout-focus-outer-size);
  margin-block-start: calc(var(--layout-focus-outer-size) * -1);
}
.c-carousel--shopnews {
  /* SPは両側の画面端まで表示し、スクロール終端には共通ページガター分の余白を残す。 */
}
@media (max-width: 767px) {
  .c-carousel--shopnews .c-carousel__viewport {
    inline-size: calc(var(--ratio-full) + var(--layout-page-gutter) * 2);
    padding-inline: var(--layout-page-gutter);
    margin-inline-start: calc(var(--layout-page-gutter) * -1);
    overflow-clip-margin: var(--space-0);
  }
}
@media (min-width: 768px) {
  .c-carousel--shopnews {
    margin-block-start: var(--space-24);
  }
  .c-carousel--shopnews .c-carousel__viewport {
    inline-size: var(--ratio-full);
    min-block-size: calc(var(--carousel-shopnews-desktop-min-block-size) + var(--layout-focus-outer-size));
  }
  .c-carousel--shopnews .c-carousel__track {
    gap: var(--space-40);
  }
}

/* カルーセルは明示停止ボタンを持つため端末設定にかかわらず規定イージングを適用する */
.c-carousel[data-carousel-ready=true][data-carousel-motion=discrete]:not([data-dragging=true],
:has(.c-carousel-control__range:active)) .c-carousel-control__scrollbar::before {
  transition: inset-inline-start var(--motion-progress-duration) var(--motion-progress-easing);
}

.c-carousel[data-carousel-ready=true]:not([data-carousel-motion=continuous], [data-resizing=true], [data-dragging=true]) :is(.c-carousel__track, .c-carousel__side-track) {
  transition: translate var(--motion-duration) var(--motion-easing);
}

/* TOPヒーローのメイン列は規定の時間とイージングだけで横へ移動する */
.c-carousel--fv[data-carousel-ready=true]:not([data-carousel-motion=continuous],
[data-resizing=true],
[data-dragging=true]) .c-carousel__track {
  transition: translate var(--motion-duration) var(--motion-easing);
}

.c-carousel--fraction {
  --carousel-image-aspect-ratio: 4 / 5;
  inline-size: var(--ratio-full);
}
@media (min-width: 768px) {
  .c-carousel--fraction {
    inline-size: min(var(--ratio-full), var(--grid-desktop-width));
  }
}
.c-carousel--fraction .c-carousel__viewport {
  block-size: var(--carousel-active-block-size, auto);
  overflow-clip-margin: var(--space-0);
}
.c-carousel--fraction .c-carousel__track {
  position: relative;
  inline-size: var(--ratio-full);
  gap: var(--space-0);
}
.c-carousel--fraction .c-carousel__slide {
  flex: 0 0 var(--ratio-full);
  min-inline-size: var(--space-0);
}

.c-carousel--fraction[data-carousel-image-ratio="1040:693"] {
  --carousel-image-aspect-ratio: 1040 / 693;
}

.c-carousel--fraction:has(.c-carousel__track > [data-carousel-slide]:only-child) .c-carousel__viewport {
  touch-action: auto;
}

.c-carousel--fraction[data-carousel-ready=true]:not([data-resizing=true]) .c-carousel__viewport {
  transition: block-size var(--motion-duration) var(--motion-easing);
}

.c-carousel--fraction .c-carousel__figure::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  z-index: var(--layout-image-overlay-layer);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--layout-image-border-width) var(--semantic-border-tertiary);
  mix-blend-mode: darken;
  pointer-events: none;
}
@media (forced-colors: active) {
  .c-carousel--fraction .c-carousel__figure::before {
    border: var(--layout-image-border-width) solid CanvasText;
    box-shadow: none;
    mix-blend-mode: normal;
  }
}
.c-carousel--fraction .c-carousel__figure {
  position: relative;
  isolation: isolate;
  display: flow-root;
  margin: var(--space-0);
}
.c-carousel--fraction .c-carousel__figure::before {
  inset-block-end: auto;
  aspect-ratio: var(--carousel-image-aspect-ratio);
}
.c-carousel--fraction .c-carousel__figure.c-image-frame {
  background: transparent;
  overflow: visible;
}
.c-carousel--fraction .c-carousel__figure.c-image-frame::after {
  content: none;
}
.c-carousel--fraction .c-carousel__figure > picture {
  display: contents;
}
.c-carousel--fraction .c-carousel__figure > img,
.c-carousel--fraction .c-carousel__figure > picture > img {
  display: block;
  max-inline-size: var(--ratio-full);
  max-block-size: var(--ratio-full);
  object-fit: contain;
  object-position: center;
  background: var(--semantic-background-base);
  inline-size: var(--ratio-full);
  block-size: auto;
  aspect-ratio: var(--carousel-image-aspect-ratio);
}

.c-carousel__caption {
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  max-inline-size: var(--ratio-full);
  min-block-size: var(--carousel-caption-block-size, var(--space-0));
  margin-block-start: var(--space-12);
  color: var(--semantic-text-secondary);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-default);
  letter-spacing: var(--letter-spacing-default);
  white-space: normal;
  overflow-wrap: anywhere;
}
@media (min-width: 768px) {
  .c-carousel__caption {
    margin-block-start: var(--space-16);
  }
}
.c-carousel__caption:is([hidden], [data-carousel-caption=off], :empty) {
  display: none;
}

[data-carousel-captions=off] .c-carousel__caption,
.c-carousel-control--fraction[hidden] {
  display: none;
}

.c-carousel--shopnews[data-size=compact] {
  margin-block-start: var(--space-0);
}
.c-carousel--shopnews[data-size=compact] .c-carousel__viewport {
  min-block-size: var(--space-0);
}

.c-chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--component-chip-gap);
  overflow: visible;
  padding: var(--layout-focus-outer-size) var(--layout-focus-outer-size) var(--space-24);
  margin-block-start: calc(var(--layout-focus-outer-size) * -1);
  margin-inline: calc(var(--layout-focus-outer-size) * -1);
  scrollbar-width: none;
}
.c-chip-group::-webkit-scrollbar {
  display: none;
}
.c-chip-group > li {
  flex: none;
  inline-size: max-content;
  max-inline-size: none;
}
.c-chip-group--scrollable {
  flex-wrap: nowrap;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding-block-start: calc(var(--layout-focus-outer-size) * 2 + var(--space-2));
  padding-inline: calc(var(--layout-focus-outer-size) * 2 + var(--space-2));
  margin-block-start: calc((var(--layout-focus-outer-size) * 2 + var(--space-2)) * -1);
  margin-inline: calc((var(--layout-focus-outer-size) * 2 + var(--space-2)) * -1);
}
.c-chip-group {
  /* Selectable Chip群はPCで折返し、SPで1行横スクロールする */
}
.c-chip-group--selectable {
  padding-block-end: var(--layout-focus-outer-size);
  margin-block-end: calc(var(--layout-focus-outer-size) * -1);
}
@media (max-width: 767px) {
  .c-chip-group--selectable {
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding-block-start: calc(var(--layout-focus-outer-size) * 2 + var(--space-2));
    padding-inline: calc(var(--layout-focus-outer-size) * 2 + var(--space-2));
    margin-block-start: calc((var(--layout-focus-outer-size) * 2 + var(--space-2)) * -1);
    margin-inline: calc((var(--layout-focus-outer-size) * 2 + var(--space-2)) * -1);
    padding-block-end: calc(var(--layout-focus-outer-size) * 2 + var(--space-2));
    margin-block-end: calc((var(--layout-focus-outer-size) * 2 + var(--space-2)) * -1);
  }
}

/* SPのページコンテナ内では横スクロール領域だけを左右の画面端まで広げる
   Chipの初期左位置とスクロール終端の右ガターは同じページ余白で維持する */
@media (max-width: 767px) {
  .l-content-container .c-chip-group:is(.c-chip-group--scrollable, .c-chip-group--selectable) {
    padding-inline: var(--layout-page-gutter);
    margin-inline: calc(var(--layout-page-gutter) * -1);
  }
}
.c-chip {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  gap: var(--component-chip-gap);
  inline-size: max-content;
  max-inline-size: none;
  min-inline-size: var(--component-chip-min-inline-size-mobile);
  block-size: calc(var(--space-32) + var(--space-1));
  padding: var(--space-8) var(--space-12);
  border: var(--space-0);
  border-radius: var(--layout-panel-radius);
  background: var(--semantic-surface-tertiary);
  color: var(--semantic-text-primary);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-secondary);
  white-space: nowrap;
}
.c-chip[data-state=hover] {
  background: var(--semantic-surface-tertiary-hover);
}
@media (hover: hover) {
  .c-chip:hover {
    background: var(--semantic-surface-tertiary-hover);
  }
}
.c-chip {
  /* Defaultの解除ボタンありはmodifierを状態源とし、なしではClose領域を生成しない */
}
.c-chip[data-type=default].c-chip--removable::after {
  content: "";
  flex: none;
  inline-size: var(--space-16);
  block-size: var(--space-16);
  background: url("../images/common/icon-close.svg") no-repeat center/contain;
}
.c-chip {
  /* Selectableは通常操作ではaria-pressed、tab文脈ではaria-selectedを状態源とする */
}
.c-chip[data-type=selectable]:is([aria-pressed=true], [aria-selected=true]):not(:disabled, [aria-disabled=true], [data-state=disabled]) {
  background: var(--semantic-surface-primary);
  color: var(--semantic-text-inverse-primary);
  box-shadow: none;
}
.c-chip[data-type=selectable]:is([aria-pressed=true], [aria-selected=true]):not(:disabled, [aria-disabled=true], [data-state=disabled])[data-state=hover] {
  background: var(--semantic-surface-primary-hover);
}
@media (hover: hover) {
  .c-chip[data-type=selectable]:is([aria-pressed=true], [aria-selected=true]):not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    background: var(--semantic-surface-primary-hover);
  }
}
.c-chip:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  background: var(--semantic-surface-disabled-weak);
  color: var(--semantic-text-disabled);
  pointer-events: none;
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-disabled);
}
.c-chip:is(:disabled, [aria-disabled=true], [data-state=disabled]).c-chip--removable::after {
  background: var(--semantic-icon-disabled);
  mask: url("../images/common/icon-close.svg") no-repeat center/contain;
}
@media (min-width: 768px) {
  .c-chip {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
    min-inline-size: var(--component-chip-min-inline-size-desktop);
    block-size: calc(var(--space-36) - var(--space-1));
  }
}

/* Figma Headingのレベル別下余白 個別要件は同じCustom Propertyだけを上書きする */
h1 {
  margin-block-end: var(--heading-margin-block-end, var(--component-heading-1-margin-block-end));
}

h2 {
  margin-block-end: var(--heading-margin-block-end, var(--component-heading-2-margin-block-end));
}

h3 {
  margin-block-end: var(--heading-margin-block-end, var(--component-heading-3-margin-block-end));
}

h4 {
  margin-block-end: var(--heading-margin-block-end, var(--component-heading-4-margin-block-end));
}

h5 {
  margin-block-end: var(--heading-margin-block-end, var(--component-heading-5-margin-block-end));
}

h6 {
  margin-block-end: var(--heading-margin-block-end, var(--component-heading-6-margin-block-end));
}

.c-heading {
  display: grid;
  gap: var(--space-8);
}
.c-heading h2 {
  font-size: var(--font-size-24);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}

/* 見出しと操作要素を同じheaderへ置く構成ではh2自身の下余白を持たせず親のgap / marginで配置する */
.c-heading[data-layout=with-action] {
  --heading-margin-block-end: var(--space-0);
}

.c-heading[data-heading-spacing=none] {
  --heading-margin-block-end: var(--space-0);
}

/* Figma master annotations | M-IDs: M-028 | nodeIDs: 7065:10685 | ownerIDs: 7065:10685
■最小サイズ
ルクア・イーレ・サウス縦ロゴ
横幅15mm→96dpiで57px
（72dpiで 42.5px）
イーレ・サウス横ロゴ
最小サイズ：横幅25mm
→96dpiで94.5px
（72dpiで 70.87px）
■並列で使用する際
原則各ブランドロゴの「LUCUA」部分のサイズを一致させる
*/
.c-heading[data-brand] {
  margin-block-end: var(--space-16);
}
.c-heading[data-brand]::before {
  content: "";
  display: block;
  block-size: var(--space-24);
  background: no-repeat left center/contain;
}
.c-heading[data-brand][data-brand=lucua]::before {
  inline-size: calc(var(--space-100) - var(--space-1));
  background-image: url("../images/common/logo-lucua-desktop.svg");
}
.c-heading[data-brand][data-brand=lucua-1100]::before {
  inline-size: calc(var(--space-100) + var(--space-64));
  background-image: url("../images/common/logo-lucua1100-desktop.svg");
}
.c-heading[data-brand][data-brand=lucua-and-1100]::before {
  inline-size: calc(var(--space-100) - var(--space-1) + var(--space-16) + var(--space-100) + var(--space-64));
  background-image: url("../images/common/logo-lucua-desktop.svg"), url("../images/common/logo-lucua1100-desktop.svg");
  background-position: left center, right center;
  background-size: calc(var(--space-100) - var(--space-1)) var(--space-24), calc(var(--space-100) + var(--space-64)) var(--space-24);
}
.c-heading[data-brand][data-brand=lucua-south]::before {
  inline-size: calc(var(--space-128) + var(--space-48) + var(--space-1));
  background-image: url("../images/common/logo-lucua-south-desktop.svg");
}

.c-heading--article {
  --heading-margin-block-end: var(--space-24);
}

.c-heading__article-date {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  align-items: baseline;
  color: var(--semantic-text-secondary);
}

.c-heading--center {
  text-align: center;
}

/* 下層ページ内のH2/H3見出し */
.c-heading--section:is(h2),
.c-heading--section h2 {
  font-size: var(--font-size-24);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  --heading-margin-block-end: var(--component-heading-section-margin-block-end);
}

.c-heading--subsection:is(h2, h3),
.c-heading--subsection :is(h2, h3) {
  font-size: var(--font-size-20);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  --heading-margin-block-end: var(--component-heading-3-margin-block-end);
}

/* 操作要素を伴う小見出しの下余白を0にして要素間の間隔を親のレイアウトで設定する */
.c-heading.c-heading--subsection[data-layout=with-action],
.c-heading.c-heading--subsection[data-layout=with-action] > :is(h2, h3) {
  --heading-margin-block-end: var(--space-0);
}

/* Figma Heading / Desktop Size=H5とTitle / Mobile Title */
.c-heading--level-4 {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}

/* 下層ページのH1見出し */
.c-heading--page:is(h1),
.c-heading--page h1,
.c-heading--shop {
  font-size: var(--font-size-28);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}

@media (min-width: 768px) {
  .c-heading--page[data-heading-spacing-desktop=heading-1] {
    --heading-margin-block-end: var(--layout-section-padding-heading-1);
  }
  .c-heading h2 {
    font-size: var(--font-size-36);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
  .c-heading--page:is(h1),
  .c-heading--page h1,
  .c-heading--shop {
    font-size: var(--font-size-44);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
  .c-heading--section:is(h2),
  .c-heading--section h2 {
    font-size: var(--font-size-36);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
  .c-heading--subsection:is(h2, h3),
  .c-heading--subsection :is(h2, h3) {
    font-size: var(--font-size-24);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
  .c-heading--level-4 {
    font-size: var(--font-size-18);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
}
.c-heading--shop {
  grid-template-columns: auto minmax(var(--space-0), 1fr);
  align-items: center;
  gap: var(--space-16);
  margin-block-end: var(--component-heading-1-margin-block-end);
}
.c-heading--shop[data-multiline] {
  align-items: start;
}
@media (min-width: 768px) {
  .c-heading--shop {
    gap: var(--space-24);
  }
}

.c-heading__shop-logo {
  display: block;
  max-inline-size: var(--ratio-full);
  max-block-size: var(--ratio-full);
  object-fit: contain;
  object-position: center;
  background: var(--semantic-background-base);
  inline-size: calc(var(--space-80) - var(--space-2));
  block-size: auto;
  aspect-ratio: 1;
  border: var(--space-1) solid var(--semantic-border-tertiary);
}
@media (min-width: 768px) {
  .c-heading__shop-logo {
    inline-size: var(--space-96);
  }
}

.c-heading__shop-title {
  font-weight: inherit;
  min-inline-size: var(--space-0);
  overflow-wrap: anywhere;
}

/* 画像枠コンポーネント 角丸と縦横比の共通化 */
.c-image-frame {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--semantic-background-base);
}
.c-image-frame img {
  object-fit: cover;
}
.c-image-frame::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  z-index: var(--layout-image-overlay-layer);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--layout-image-border-width) var(--semantic-border-tertiary);
  mix-blend-mode: darken;
  pointer-events: none;
}
@media (forced-colors: active) {
  .c-image-frame::after {
    border: var(--layout-image-border-width) solid CanvasText;
    box-shadow: none;
    mix-blend-mode: normal;
  }
}

.c-card__image,
.c-shop-card__image,
.c-image-frame--fv,
.c-shop-summary__logo,
.c-floating-popup__image,
.p-topics-article__image,
.p-about-hero__visual {
  position: relative;
  background: var(--semantic-background-base);
}
.c-card__image > picture,
.c-shop-card__image > picture,
.c-image-frame--fv > picture,
.c-shop-summary__logo > picture,
.c-floating-popup__image > picture,
.p-topics-article__image > picture,
.p-about-hero__visual > picture {
  display: contents;
}
.c-card__image > img,
.c-card__image > picture > img,
.c-shop-card__image > img,
.c-shop-card__image > picture > img,
.c-image-frame--fv > img,
.c-image-frame--fv > picture > img,
.c-shop-summary__logo > img,
.c-shop-summary__logo > picture > img,
.c-floating-popup__image > img,
.c-floating-popup__image > picture > img,
.p-topics-article__image > img,
.p-topics-article__image > picture > img,
.p-about-hero__visual > img,
.p-about-hero__visual > picture > img {
  display: block;
  max-inline-size: var(--ratio-full);
  max-block-size: var(--ratio-full);
  object-fit: contain;
  object-position: center;
  background: var(--semantic-background-base);
  position: absolute;
  inset: var(--space-0);
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}

.c-image-frame[data-image-frame=none]::after {
  content: none;
}

.c-image-frame[data-image-size=icon] {
  inline-size: var(--space-72);
  block-size: var(--space-72);
}
.c-image-frame[data-image-size=icon] img {
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  object-fit: contain;
}
@media (min-width: 768px) {
  .c-image-frame[data-image-size=icon] {
    inline-size: calc(var(--space-100) + var(--space-8));
    block-size: calc(var(--space-100) + var(--space-8));
  }
}

.c-image-frame[data-image-type=map] {
  inline-size: var(--ratio-full);
  max-inline-size: calc(var(--space-256) * 3 + var(--space-56));
  aspect-ratio: 824/547;
}
.c-image-frame[data-image-type=map] iframe {
  display: block;
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  border: var(--space-0);
}

.c-input-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-8);
  inline-size: 100%;
  max-inline-size: calc(var(--space-256) * 2 + var(--space-96));
  min-inline-size: var(--space-0);
}
.c-input-form[data-state=focus] .c-input-form__control,
.c-input-form .c-input-form__control:focus {
  border-color: var(--semantic-border-accent);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-accent);
  outline: none;
}
@media (forced-colors: active) {
  .c-input-form[data-state=focus] .c-input-form__control,
  .c-input-form .c-input-form__control:focus {
    outline: var(--space-2) solid Highlight;
    outline-offset: calc(var(--space-2) * -1);
  }
}
.c-input-form[data-state=error] .c-input-form__control,
.c-input-form .c-input-form__control[aria-invalid=true] {
  border-color: var(--semantic-border-state-error);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-state-error);
  background: var(--semantic-surface-state-error);
}
.c-input-form[data-state=disabled] .c-input-form__control,
.c-input-form .c-input-form__control:disabled {
  border: var(--space-1) solid var(--semantic-border-disabled);
  box-shadow: none;
  background: var(--semantic-surface-disabled-weak);
  color: var(--semantic-text-disabled);
}
.c-input-form[data-state=disabled] .c-input-form__control::placeholder,
.c-input-form .c-input-form__control:disabled::placeholder {
  color: var(--semantic-text-disabled);
}
.c-input-form .c-input-form__header {
  display: grid;
  gap: var(--space-4);
  min-inline-size: var(--space-0);
}
.c-input-form .c-input-form__label-row {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  min-inline-size: var(--space-0);
  margin: var(--space-0);
}
.c-input-form .c-input-form__label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-8);
  margin: var(--space-0);
  color: var(--semantic-text-primary);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
@media (min-width: 768px) {
  .c-input-form .c-input-form__label {
    font-size: var(--font-size-16);
  }
}
.c-input-form .c-input-form__help,
.c-input-form .c-input-form__error {
  margin: var(--space-0);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}
.c-input-form .c-input-form__help {
  color: var(--semantic-text-secondary);
}
.c-input-form .c-input-form__error {
  color: var(--semantic-text-state-error);
}
.c-input-form .c-input-form__body {
  display: grid;
  gap: var(--space-4);
  min-inline-size: var(--space-0);
}
.c-input-form .c-input-form__control {
  box-sizing: border-box;
  display: block;
  inline-size: 100%;
  min-inline-size: var(--space-0);
  border: var(--space-1) solid var(--semantic-border-secondary);
  border-radius: var(--layout-panel-radius);
  background: var(--semantic-surface-tertiary);
  color: var(--semantic-text-primary);
  font-family: var(--font-family-jp);
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-default);
  letter-spacing: var(--letter-spacing-default);
}
.c-input-form .c-input-form__control::placeholder {
  color: var(--semantic-text-tertiary);
  opacity: 1;
}
.c-input-form .c-input-form__control {
  block-size: var(--space-48);
  padding: var(--space-0) calc(var(--space-12) - var(--space-1));
}
.c-input-form .c-input-form__zip-row {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  min-inline-size: var(--space-0);
  margin: var(--space-0);
}
.c-input-form .c-input-form__zip-row .c-input-form__control {
  flex: 0 1 calc((100% - var(--layout-grid-gap)) / 2);
  inline-size: calc((100% - var(--layout-grid-gap)) / 2);
}
.c-input-form .c-input-form__zip-row .c-button {
  flex: none;
  inline-size: calc(var(--space-96) + var(--space-12));
}
.c-input-form[data-state=disabled] .c-input-form__label, .c-input-form[data-state=disabled] .c-input-form__help {
  color: var(--semantic-text-disabled);
}
.c-input-form[data-state=error] {
  row-gap: var(--space-8);
}
.c-input-form[data-type=latin] .c-input-form__control, .c-input-form[data-type=zip-code] .c-input-form__control {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
}
@media (min-width: 768px) {
  .c-input-form .c-input-form__control {
    block-size: var(--space-56);
    padding-inline: calc(var(--space-16) - var(--space-1));
  }
  .c-input-form .c-input-form__zip-row {
    gap: var(--space-16);
    max-inline-size: calc(var(--space-256) + var(--space-128) + var(--space-8));
  }
  .c-input-form .c-input-form__zip-row .c-input-form__control {
    flex: 0 1 calc(var(--space-256) - var(--space-8));
    inline-size: calc(var(--space-256) - var(--space-8));
  }
  .c-input-form .c-input-form__zip-row .c-button {
    inline-size: var(--space-128);
  }
  .c-input-form[data-state=error][data-type=default], .c-input-form[data-state=error][data-type=latin] {
    row-gap: calc(var(--space-8) + var(--space-2));
  }
  .c-input-form .c-input-form__body {
    gap: var(--space-8);
  }
}

/* Figma master annotations | M-IDs: M-070 | nodeIDs: 7065:13051 | ownerIDs: 7065:13051
gap0でNestedパーツを積み上げ
first-child , last-child等の個別設定なし
*/
.c-information-list {
  display: grid;
  gap: var(--space-0);
  inline-size: var(--ratio-full);
  word-break: break-word;
}
.c-information-list > li {
  inline-size: var(--ratio-full);
  box-shadow: inset var(--space-0) calc(var(--space-1) * -1) var(--space-0) var(--semantic-border-tertiary);
}
.c-information-list a {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-information-list a::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-information-list a:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-information-list a:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-information-list a:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-information-list a:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-information-list a p {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-information-list a:hover p {
    color: var(--semantic-text-primary-hover);
  }
}
.c-information-list a:focus-visible p {
  color: var(--semantic-text-primary-hover);
}
.c-information-list a:is([data-state=hover], [data-state=focus]) p {
  color: var(--semantic-text-primary-hover);
}
.c-information-list a:is(:active, [data-state=pressed]) p {
  color: var(--semantic-text-primary-pressed);
}
.c-information-list a {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: var(--space-8);
  inline-size: var(--ratio-full);
  padding-block: var(--space-16);
}
.c-information-list time,
.c-information-list p {
  inline-size: var(--ratio-full);
}
.c-information-list time {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  color: var(--semantic-text-secondary);
}
.c-information-list p {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  color: var(--semantic-text-primary);
}
@media (min-width: 768px) {
  .c-information-list a {
    padding-block: var(--space-24);
  }
  .c-information-list time {
    font-size: var(--font-size-16);
  }
  .c-information-list p {
    font-size: var(--font-size-18);
  }
}

.c-notice {
  overflow-wrap: anywhere;
}

/* Emergencyの表示状態を上位ラッパーへ集約し複数項目を縦に積む */
[data-notice-group=emergency] {
  display: grid;
  align-content: start;
  gap: var(--space-16);
}

/* Informationはヘッダーと同じ固定領域内で全幅表示する */
.c-notice[data-type=information] {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-12);
  min-block-size: var(--space-56);
  padding-block: var(--space-12);
  padding-inline: var(--layout-header-padding-inline-start) var(--layout-header-padding-inline-end);
  color: var(--semantic-text-inverse-primary);
  background: var(--semantic-background-inverse-base);
}
@media (prefers-reduced-motion: no-preference) {
  .c-notice[data-type=information] {
    transition: height var(--motion-duration) var(--motion-easing), min-block-size var(--motion-duration) var(--motion-easing), padding-block-start var(--motion-duration) var(--motion-easing), padding-block-end var(--motion-duration) var(--motion-easing);
  }
}
.c-notice[data-type=information] {
  /* 非表示完了までは内容を保持し高さと上下paddingを0まで畳む */
}
.c-notice[data-type=information][data-notice-exit] {
  overflow: clip;
  pointer-events: none;
  min-block-size: var(--space-0);
  padding-block: var(--space-0);
}
.c-notice[data-type=information] {
  /* 実ページではHeader直前の独立スロットとしてHeaderと同じスクロール退避規定を使う */
}
body > .c-notice[data-type=information] {
  position: sticky;
  inset-block-start: var(--space-0);
  /* 退避先は自身の高さ分だけ上へ送る */
}
body > .c-notice[data-type=information][data-scroll-direction=down] {
  translate: var(--space-0) calc(var(--ratio-full) * -1);
}
@media (prefers-reduced-motion: no-preference) {
  body > .c-notice[data-type=information] {
    transition: translate var(--motion-duration) var(--motion-easing);
  }
}
body > .c-notice[data-type=information] {
  z-index: var(--layout-header-layer);
  /* scroll-awayのtranslateと非表示モーションを同じ規定時間へ統合する */
}
@media (prefers-reduced-motion: no-preference) {
  body > .c-notice[data-type=information] {
    transition: translate var(--motion-duration) var(--motion-easing), height var(--motion-duration) var(--motion-easing), min-block-size var(--motion-duration) var(--motion-easing), padding-block-start var(--motion-duration) var(--motion-easing), padding-block-end var(--motion-duration) var(--motion-easing);
  }
}

.c-notice[data-type=information] .c-notice__message {
  display: flex;
  flex: 1 1 auto;
  align-items: flex-start;
  gap: var(--space-8);
  min-inline-size: var(--space-0);
  line-height: var(--space-24);
  /* 固定色の反転SVGを既存基準どおり外部背景で使用する */
}
.c-notice[data-type=information] .c-notice__message::before {
  flex: none;
  content: "";
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-attention-inverse.svg") no-repeat center/contain;
}
.c-notice[data-type=information] {
  /* Closeは32pxのIconButtonを維持しHover面だけを発生させない */
}
.c-notice[data-type=information] .c-icon-button {
  --icon-button-size: var(--space-32);
  --icon-button-padding: var(--space-4);
  --icon-button-icon-size: var(--space-24);
  --icon-button-icon-color: var(--semantic-icon-inverse-primary);
  flex: none;
  align-self: center;
}
.c-notice[data-type=information] .c-icon-button:is(:hover, [data-state=hover]) {
  background-color: transparent;
}
@media (min-width: 1024px) {
  .c-notice[data-type=information] {
    padding-inline-start: var(--layout-page-gutter);
  }
  .c-notice[data-type=information] .c-notice__message {
    justify-content: center;
    max-inline-size: var(--grid-desktop-width);
    gap: var(--space-12);
  }
}

/* Emergencyはページフロー内の共通コンテンツ幅で表示し内容量に応じて高くなる */
.c-notice[data-type=emergency] {
  inline-size: calc(var(--ratio-full) - var(--layout-page-gutter) * 2);
  margin-inline: auto;
}
@media (min-width: 768px) {
  .c-notice[data-type=emergency] {
    inline-size: min(var(--ratio-full) - var(--space-48), var(--grid-desktop-width));
  }
}
.c-notice[data-type=emergency] {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-16);
  border: var(--space-0);
  color: var(--semantic-text-primary);
  background: var(--semantic-background-base);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-primary);
}
.c-notice[data-type=emergency] .c-notice__title {
  --heading-margin-block-end: var(--space-0);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}
.c-notice[data-type=emergency] .c-notice__message {
  inline-size: var(--ratio-full);
}
@media (min-width: 768px) {
  .c-notice[data-type=emergency] {
    padding-inline: var(--space-24);
  }
  .c-notice[data-type=emergency] .c-notice__title {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-default);
  }
}

/* type別のdisplayより後で外部管理のoffとARIA非表示を同じ非表示結果へ確定する */
.c-notice[data-type=information]:is([data-notice=off], [aria-hidden=true]),
[data-notice-group=emergency]:is([data-notice=off], [aria-hidden=true]) {
  display: none;
}

.c-note-shop-information {
  display: grid;
  gap: var(--space-16);
  inline-size: var(--ratio-full);
  padding: var(--space-24) var(--space-24) var(--space-32);
  border: var(--space-1) solid var(--semantic-border-primary);
  color: var(--semantic-text-primary);
}

.c-note-shop-information__title {
  font-size: var(--font-size-20);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  margin: var(--space-0);
}

.c-note-shop-information__body {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
}

@media (min-width: 768px) {
  .c-note-shop-information {
    gap: var(--space-24);
    padding: var(--space-32) var(--space-40) var(--space-48);
  }
  .c-note-shop-information__title {
    font-size: var(--font-size-24);
  }
}
/* 画像リンクの選択とドラッグの抑止 クリックとフォーカスと遷移は維持する */
.c-media-link {
  -webkit-user-select: none;
  user-select: none;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-media-link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-media-link:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-media-link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-media-link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-media-link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}

/* ポップオーバー表示時の透明度と位置を補間し開始値と時間とイージングをトークンで設定する */
@media (prefers-reduced-motion: no-preference) {
  [popover]:popover-open {
    transition: opacity var(--motion-menu-duration) var(--motion-menu-easing), translate var(--motion-menu-duration) var(--motion-menu-easing);
    /* 表示直後の開始値 ここから遷移する 位置の開始値は動かす対象だけが持つ */
  }
  @starting-style {
    [popover]:popover-open {
      opacity: var(--motion-menu-start-opacity);
    }
  }
}
@keyframes panel-selection-exit {
  to {
    opacity: 0;
  }
}
[data-panel-select-close] {
  pointer-events: none;
  transition: none;
}

@media (prefers-reduced-motion: no-preference) {
  [data-panel-select-close] {
    animation: panel-selection-exit var(--motion-menu-duration) var(--motion-menu-easing) forwards;
  }
}
.c-dropdown:not(:popover-open) {
  transition: none;
}

/* モーダルとダイアログのバックドロップ ヘッダーを含むページ全体を覆う */
dialog::backdrop {
  position: fixed;
  content: "";
  inset: var(--space-0);
  z-index: var(--layout-overlay-layer);
  background: var(--semantic-background-backdrop);
  -webkit-backdrop-filter: blur(var(--effect-overlay-blur));
  backdrop-filter: blur(var(--effect-overlay-blur));
  opacity: var(--motion-start-opacity);
}

dialog[open]::backdrop {
  opacity: 1;
}

/* SPハンバーガーメニューのバックドロップ ヘッダー下端から開始しmainとfooterとボトムナビを覆う ドロップダウンでは表示しない */
@media (max-width: 1023px) {
  body:has(.l-globalnav:popover-open)::before {
    position: fixed;
    content: "";
    inset: var(--space-0);
    z-index: var(--layout-overlay-layer);
    background: var(--semantic-background-backdrop);
    -webkit-backdrop-filter: blur(var(--effect-overlay-blur));
    backdrop-filter: blur(var(--effect-overlay-blur));
    inset-block-start: calc(var(--space-64) + var(--runtime-information-notice-block-size, var(--space-0)));
  }
}
/* PCの検索パネル表示中のバックドロップ ヘッダーバー下端から開始しグローバルナビとmainとfooterを覆う */
@media (min-width: 1024px) {
  body:has(.l-header__searchpanel:popover-open)::before {
    position: fixed;
    content: "";
    inset: var(--space-0);
    z-index: var(--layout-overlay-layer);
    background: var(--semantic-background-backdrop);
    -webkit-backdrop-filter: blur(var(--effect-overlay-blur));
    backdrop-filter: blur(var(--effect-overlay-blur));
    inset-block-start: calc(var(--space-100) + var(--runtime-information-notice-block-size, var(--space-0)));
  }
}
/* バックドロップの表示も規定のモーショントークンに従いフェードインする */
@media (prefers-reduced-motion: no-preference) {
  dialog::backdrop {
    transition: opacity var(--motion-menu-duration) var(--motion-menu-easing), display var(--motion-menu-duration) var(--motion-menu-easing) allow-discrete, overlay var(--motion-menu-duration) var(--motion-menu-easing) allow-discrete;
  }
  @starting-style {
    dialog[open]::backdrop {
      opacity: var(--motion-start-opacity);
    }
  }
}
@media (prefers-reduced-motion: no-preference) and (max-width: 1023px) {
  body:has(.l-globalnav:popover-open)::before {
    transition: opacity var(--motion-menu-duration) var(--motion-menu-easing);
    /* 表示開始の透明度はメニュー類と同じ基準トークンを使う */
  }
  @starting-style {
    body:has(.l-globalnav:popover-open)::before {
      opacity: var(--motion-start-opacity);
    }
  }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 1024px) {
  body:has(.l-header__searchpanel:popover-open)::before {
    transition: opacity var(--motion-menu-duration) var(--motion-menu-easing);
    /* 表示開始の透明度はメニュー類と同じ基準トークンを使う */
  }
  @starting-style {
    body:has(.l-header__searchpanel:popover-open)::before {
      opacity: var(--motion-start-opacity);
    }
  }
}
/* バックドロップ表示中は下層コンテンツの上下スクロールをロックする ドロップダウンは対象外 */
body:has(dialog[open]) {
  overflow: hidden;
}

body:has(dialog[open]) > :is(header, main, footer, nav) {
  -webkit-user-select: none;
  user-select: none;
}

@media (max-width: 1023px) {
  body:has(.l-globalnav:popover-open) {
    overflow: hidden;
  }
  body:has(.l-globalnav:popover-open) > :is(main, footer, nav) {
    -webkit-user-select: none;
    user-select: none;
  }
}
@media (min-width: 1024px) {
  body:has(.l-header__searchpanel:popover-open) {
    overflow: hidden;
  }
  body:has(.l-header__searchpanel:popover-open) > :is(main, footer, nav),
  body:has(.l-header__searchpanel:popover-open) .l-globalnav {
    -webkit-user-select: none;
    user-select: none;
  }
}
/* Figma master annotations | M-IDs: M-043, M-048, M-058 | nodeIDs: 7065:11749, 7065:11752, 7070:9130 | ownerIDs: 7065:11746, 7070:9127
9/17update
EnteredのボーダーカラーをPrimaryからSecondaryに変更
*/
.c-searchbar {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  inline-size: var(--searchbar-inline-size);
  max-inline-size: var(--searchbar-max-inline-size);
  block-size: var(--searchbar-block-size);
  padding: var(--searchbar-padding);
  border: var(--space-1) solid var(--semantic-border-secondary);
  border-radius: var(--layout-panel-radius);
  margin-inline: var(--searchbar-margin-inline);
  background: var(--semantic-surface-tertiary);
  /* FigmaのFocus状態は外周リングを追加せず既存ボーダーをAccentの2pxへ切り替える */
}
.c-searchbar:is(:has(.c-searchbar__input:focus), [data-state=focus]) {
  border-color: var(--semantic-border-accent);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-accent);
}

/* Figma Size=Large PC専用 高さ64px */
/* Figma master annotations | M-IDs: M-039 | nodeIDs: 7065:11746 | ownerIDs: 7065:11746
Small：コンテンツエリア内に使用
Large：Headerのサイト内検索専用
Suggest機能はSmallのみ
*/
.c-searchbar--large {
  --searchbar-inline-size: min(var(--layout-panel-max-inline-size), calc(var(--ratio-full) - var(--space-64)));
  --searchbar-max-inline-size: none;
  --searchbar-block-size: var(--space-64);
  --searchbar-padding: var(--space-16) var(--space-24);
  --searchbar-margin-inline: auto;
  --searchbar-input-font-size: var(--font-size-18);
  --searchbar-submit-size: var(--space-32);
}
.c-searchbar--large:is(:has(.c-searchbar__input:not(:placeholder-shown)), [data-state=entered]) {
  --searchbar-input-font-size: var(--font-size-16);
}

.c-searchbar__input {
  font-size: var(--searchbar-input-font-size);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  flex: 1 1 auto;
  min-inline-size: var(--space-0);
  padding: var(--space-0);
  border: var(--space-0);
  appearance: none;
  background: transparent;
  color: var(--semantic-text-primary);
}
.c-searchbar__input::placeholder {
  color: var(--semantic-text-tertiary);
}
.c-searchbar__input {
  /* 入力欄自体にはフォーカスリングを出さない 外側の検索バーの枠が入力位置を示す */
}
.c-searchbar__input:focus-visible {
  outline: none;
}
.c-searchbar__input::-webkit-search-cancel-button {
  appearance: none;
}

/* Input Search内ではIconButtonの外寸を各アイコン寸法へ縮小し、標準の内側余白を持たせない */
/* Figma master annotations | M-IDs: M-040, M-054 | nodeIDs: I7065:11754;2236:14701, I7070:9132;2236:14701 | ownerIDs: 7065:11746, 7070:9127
Icon-Buttonについて
Componentに内包しているため、padding: 0の固有指定
※Input-Search内の他Icon-Buttonも同様


hoverアクションはキャンセル
*/
.c-searchbar__clear,
.c-searchbar__submit {
  --icon-button-size: var(--icon-button-icon-size);
  --icon-button-padding: var(--space-0);
  flex: none;
  /* Input SearchではIconButton共通のhover面色を使用しない */
}
.c-searchbar__clear:is(:hover, [data-state=hover]),
.c-searchbar__submit:is(:hover, [data-state=hover]) {
  background-color: transparent;
}

/* 入力内容を消去する共通ボタンの寸法はPCとSPで24pxを維持する */
/* Figma master annotations | M-IDs: M-041, M-056 | nodeIDs: 7065:11757, 7070:9135 | ownerIDs: 7065:11746, 7070:9127
入力内容をクリア（ボタン）
hoverアクションはキャンセル
*/
/* Figma master annotations | M-IDs: M-044, M-059 | nodeIDs: 7065:11763, 7070:9141 | ownerIDs: 7065:11746, 7070:9127
入力内容をクリア（ボタン）
*/
/* Figma master annotations | M-IDs: M-046, M-049 | nodeIDs: 7065:11769, 7065:11774 | ownerIDs: 7065:11746
入力内容をクリア
*/
.c-searchbar__clear {
  --icon-button-icon-size: var(--space-24);
}
.c-searchbar__clear::before {
  background: url("../images/common/icon-close.svg") no-repeat center/contain;
  -webkit-mask: none;
  mask: none;
}
.c-searchbar__clear[hidden] {
  display: none;
}

/* 検索実行ボタンはIconButtonの形状を維持し、規定のアクセント色だけを文脈側で指定する */
/* Figma master annotations | M-IDs: M-042, M-047 | nodeIDs: 7065:11758, 7065:11770 | ownerIDs: 7065:11746
検索実行ボタン
Enterでも稼働
*/
/* Figma master annotations | M-IDs: M-057 | nodeIDs: 7070:9136 | ownerIDs: 7070:9127
検索実行ボタン
Enterでも稼働（端末のキーボードアイコンも変化している）
*/
.c-searchbar__submit {
  --icon-button-icon-size: var(--searchbar-submit-size);
  --icon-button-icon-color: var(--semantic-icon-accent);
}
.c-searchbar__submit::before {
  background: url("../images/common/icon-search-accent.svg") no-repeat center/contain;
  -webkit-mask: none;
  mask: none;
}

/* Figma Size=Regular SPは48px PCは56px */
.c-searchbar--regular {
  --searchbar-inline-size: var(--ratio-full);
  --searchbar-max-inline-size: var(--grid-mobile-width);
  --searchbar-block-size: var(--space-48);
  --searchbar-padding: var(--space-12);
  --searchbar-margin-inline: var(--space-0);
  --searchbar-input-font-size: var(--font-size-16);
  --searchbar-submit-size: var(--space-24);
}
@media (min-width: 768px) {
  .c-searchbar--regular {
    --searchbar-inline-size: min(var(--layout-panel-max-inline-size), calc(var(--ratio-full) - var(--space-64)));
    --searchbar-max-inline-size: none;
    --searchbar-block-size: var(--space-56);
    --searchbar-padding: var(--space-16);
    --searchbar-margin-inline: auto;
    --searchbar-input-font-size: var(--font-size-18);
  }
}

/* Figma master annotations | M-IDs: M-045, M-055 | nodeIDs: 7065:11751, 7070:9129 | ownerIDs: 7065:11746, 7070:9127
Suggest項目を押下時、即時検索
キーボード操作時はEnterでも稼働
*/
.c-searchbar-group {
  position: relative;
  display: grid;
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
}
.c-searchbar-group > .c-searchbar--regular {
  --searchbar-inline-size: var(--ratio-full);
  --searchbar-max-inline-size: none;
  --searchbar-margin-inline: var(--space-0);
}
.c-searchbar-group > .c-search-suggest {
  position: absolute;
  inset-block-start: calc(var(--ratio-full) + var(--space-4));
  inset-inline: var(--space-0);
  z-index: var(--layout-sticky-navigation-layer);
  inline-size: auto;
  max-inline-size: none;
}
.c-searchbar-group > .c-search-suggest[hidden] {
  display: none;
}

.c-search-suggest {
  inline-size: var(--ratio-full);
  max-inline-size: var(--layout-content-narrow-width);
  padding-block: var(--space-4);
  border-radius: var(--layout-panel-radius);
  background: var(--semantic-background-base);
  box-shadow: var(--shadow-level-1);
}
.c-search-suggest[data-suggest-resizing] {
  overflow: clip;
}
@media (min-width: 768px) {
  .c-search-suggest {
    padding-block: var(--space-8);
  }
}

.c-search-suggest__list {
  display: grid;
  padding-block: var(--space-8);
  list-style: none;
}
.c-search-suggest__list[hidden] {
  display: none;
}
@media (min-width: 768px) {
  .c-search-suggest__list {
    padding-block: var(--space-0);
  }
}

.c-search-suggest__item {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  inline-size: var(--ratio-full);
  min-block-size: var(--space-44);
  padding: var(--space-12) var(--space-16);
  border: var(--space-0);
  border-radius: var(--layout-focus-radius);
  appearance: none;
  background: transparent;
  color: var(--semantic-text-primary);
  text-align: start;
  overflow-wrap: anywhere;
}
.c-search-suggest__item::after {
  content: "";
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  margin-inline-start: auto;
  background: url("../images/common/icon-suggest.svg") no-repeat center/contain;
}
.c-search-suggest__item:is(:hover, [data-state=hover]) {
  background: var(--semantic-surface-tertiary-hover);
  color: var(--semantic-text-link);
}
.c-search-suggest__item:is(:focus-visible, [data-state=focus]) {
  outline: none;
  background: var(--semantic-surface-tertiary);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--layout-focus-width) var(--semantic-border-accent);
  color: var(--semantic-text-link);
}
.c-search-suggest__item:is(:active, [data-state=pressed]) {
  background: var(--semantic-surface-tertiary-pressed);
  box-shadow: none;
  color: var(--semantic-text-link-pressed-visited);
}
@media (min-width: 768px) {
  .c-search-suggest__item {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-search-suggest__item {
    transition: background-color var(--motion-duration) var(--motion-easing), box-shadow var(--motion-duration) var(--motion-easing), color var(--motion-duration) var(--motion-easing);
  }
}

.c-search-suggest__empty {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  margin: var(--space-0);
  padding: var(--space-12) var(--space-16);
  color: var(--semantic-text-secondary);
}
.c-search-suggest__empty[hidden] {
  display: none;
}

[data-section-spacing] {
  padding-block-end: var(--section-padding-block-end);
}

h1.c-heading[data-section-spacing] {
  margin-block-end: var(--space-0);
}

[data-section-spacing=heading-1] {
  --section-padding-block-end: var(--layout-section-padding-heading-1);
}

[data-section-spacing=heading-2] {
  --section-padding-block-end: var(--layout-section-padding-heading-2);
}

[data-section-spacing=heading-3] {
  --section-padding-block-end: var(--layout-section-padding-heading-3);
}

[data-section-spacing=heading-4] {
  --section-padding-block-end: var(--layout-section-padding-heading-4);
}

[data-section-spacing=heading-5] {
  --section-padding-block-end: var(--layout-section-padding-heading-5);
}

[data-section-spacing=heading-6] {
  --section-padding-block-end: var(--layout-section-padding-heading-6);
}

[data-section-spacing=inner-large] {
  --section-padding-block-end: var(--layout-section-padding-inner-large);
}

[data-section-spacing=inner-small] {
  --section-padding-block-end: var(--layout-section-padding-inner-small);
}

main > section:last-child[data-section-spacing] {
  padding-block-end: var(--space-0);
}

@media (max-width: 767px) {
  [data-section-spacing=heading-3]:has(+ [data-page-end-action]) {
    --section-padding-block-end: var(--layout-section-padding-heading-2);
  }
}
[data-page-end-action],
[data-page-end-action] > .c-button {
  margin-block: var(--space-0);
}

.c-shop-list:not(.c-shop-list--rows) {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  align-content: flex-start;
  justify-content: center;
  gap: var(--space-32) var(--space-12);
  inline-size: var(--ratio-full);
  max-inline-size: calc(var(--card-shop-list-max-inline-size) * var(--card-shop-list-max-columns) + var(--space-12) * (var(--card-shop-list-max-columns) - 1));
  margin-inline: auto;
}
.c-shop-list:not(.c-shop-list--rows) > * {
  flex: 0 1 calc((var(--ratio-full) - var(--space-12) * (var(--card-shop-list-max-columns) - 1)) / var(--card-shop-list-max-columns));
  max-inline-size: var(--card-shop-list-max-inline-size);
  min-inline-size: var(--space-0);
}
@media (max-width: 767px) {
  .c-shop-list:not(.c-shop-list--rows) {
    max-inline-size: none;
  }
  .c-shop-list:not(.c-shop-list--rows) > * {
    max-inline-size: none;
  }
}
@media (min-width: 768px) {
  .c-shop-list:not(.c-shop-list--rows) {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: flex-start;
    justify-content: center;
    gap: var(--space-48) var(--layout-grid-gutter);
    inline-size: var(--ratio-full);
    max-inline-size: calc(var(--card-shop-list-max-inline-size) * var(--card-shop-list-max-columns) + var(--layout-grid-gutter) * (var(--card-shop-list-max-columns) - 1));
    margin-inline: auto;
  }
  .c-shop-list:not(.c-shop-list--rows) > * {
    flex: 0 1 calc((var(--ratio-full) - var(--layout-grid-gutter) * (var(--card-shop-list-max-columns) - 1)) / var(--card-shop-list-max-columns));
    max-inline-size: var(--card-shop-list-max-inline-size);
    min-inline-size: var(--space-0);
  }
}

.c-shop-list__item[hidden] {
  display: none;
}

@media (prefers-reduced-motion: no-preference) {
  [data-list-expanding] {
    overflow: clip;
    transition: block-size var(--motion-duration) var(--motion-easing);
  }
  [data-list-item-enter] {
    animation: shop-card-enter var(--motion-duration) var(--motion-easing);
  }
}
@keyframes shop-card-enter {
  from {
    opacity: var(--motion-start-opacity);
    translate: var(--space-0) var(--space-8);
  }
  to {
    opacity: 1;
    translate: var(--space-0);
  }
}
.c-shop-list--rows {
  display: block;
}

.c-shop-list__row {
  box-shadow: inset var(--space-0) calc(var(--space-1) * -1) var(--space-0) var(--semantic-border-tertiary);
}

.c-shop-row {
  display: flex;
  align-items: flex-start;
  gap: var(--space-16);
  padding-block: var(--space-12);
  color: var(--semantic-text-primary);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-shop-row::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-shop-row:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-shop-row:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-shop-row:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-shop-row:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-shop-row .c-shop-row__name {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-shop-row:hover .c-shop-row__name {
    color: var(--semantic-text-primary-hover);
  }
}
.c-shop-row:focus-visible .c-shop-row__name {
  color: var(--semantic-text-primary-hover);
}
.c-shop-row:is([data-state=hover], [data-state=focus]) .c-shop-row__name {
  color: var(--semantic-text-primary-hover);
}
.c-shop-row:is(:active, [data-state=pressed]) .c-shop-row__name {
  color: var(--semantic-text-primary-pressed);
}
@media (hover: hover) {
  .c-shop-row:hover .c-shop-row__name {
    text-decoration-line: none;
  }
}
.c-shop-row:is(:focus-visible, :active, [data-state=hover], [data-state=focus], [data-state=pressed]) .c-shop-row__name {
  text-decoration-line: none;
}
@media (min-width: 768px) {
  .c-shop-row {
    gap: var(--space-12);
  }
}

.c-shop-row__image {
  display: block;
  flex: none;
  inline-size: var(--space-48);
  block-size: var(--space-48);
  margin-inline-start: var(--space-1);
  outline: var(--space-1) solid var(--semantic-border-tertiary);
  outline-offset: calc(var(--space-1) * -2);
  object-fit: contain;
  pointer-events: none;
}

.c-shop-row[data-shop-logo=off] .c-shop-row__image {
  display: none;
}

.c-shop-row:has(> .c-shop-row__subtext) {
  column-gap: var(--space-0);
}
.c-shop-row:has(> .c-shop-row__subtext) > .c-shop-row__image {
  margin-inline-start: var(--space-0);
  margin-inline-end: var(--space-16);
}
.c-shop-row:has(> .c-shop-row__subtext) > .c-shop-row__text {
  margin-inline-end: var(--space-12);
}
.c-shop-row:has(> .c-shop-row__subtext) > .c-shop-row__subtext {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  flex: none;
  inline-size: calc(var(--space-128) + var(--space-8) + var(--space-2));
  margin: var(--space-0);
  color: var(--semantic-text-secondary);
}
@media (min-width: 768px) {
  .c-shop-row:has(> .c-shop-row__subtext) > .c-shop-row__image {
    margin-inline-start: var(--space-1);
    margin-inline-end: var(--space-12);
  }
  .c-shop-row:has(> .c-shop-row__subtext) > .c-shop-row__text {
    margin-inline-end: var(--space-16);
  }
  .c-shop-row:has(> .c-shop-row__subtext) > .c-shop-row__subtext {
    flex: 1;
    inline-size: auto;
    min-inline-size: var(--space-0);
  }
}

.c-shop-row__text {
  display: grid;
  flex: 1;
  gap: var(--space-4);
  min-inline-size: var(--space-0);
  margin: var(--space-0);
}

.c-shop-row__name {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  text-decoration: underline;
  text-underline-position: from-font;
}

.c-shop-row__category,
.c-shop-row__note {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
  color: var(--semantic-text-secondary);
}

.c-shop-row__note {
  margin-block-start: var(--space-4);
}
@media (min-width: 768px) {
  .c-shop-row__note {
    margin-block-start: var(--space-12);
  }
}

.c-shop-card__link {
  display: block;
  block-size: var(--ratio-full);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-shop-card__link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-shop-card__link:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-shop-card__link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-shop-card__link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-shop-card__link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-shop-card__link .c-shop-card__name {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-shop-card__link:hover .c-shop-card__name, .c-shop-card__link:focus-visible .c-shop-card__name {
  color: var(--semantic-text-link);
}

.c-shop-card__figure {
  display: grid;
  gap: var(--space-12);
}

.c-shop-card__image {
  aspect-ratio: var(--ratio-square);
}
.c-shop-card__image img {
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  object-fit: contain;
  pointer-events: none;
}

.c-shop-card__caption {
  display: grid;
  gap: var(--space-8);
}

.c-shop-card__location {
  font-size: var(--font-size-11);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  color: var(--semantic-text-secondary);
}

.c-shop-card__name {
  --heading-margin-block-end: var(--space-0);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.c-shop-card__category {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: -webkit-box;
  overflow: hidden;
  color: var(--semantic-text-tertiary);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  .c-shop-card__link .c-shop-card__name {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (min-width: 768px) and (hover: hover) {
  .c-shop-card__link:hover .c-shop-card__name {
    color: var(--semantic-text-primary-hover);
  }
}
@media (min-width: 768px) {
  .c-shop-card__link[data-state=hover] .c-shop-card__name {
    color: var(--semantic-text-primary-hover);
  }
  .c-shop-card__link:is(:active, [data-state=pressed]) .c-shop-card__name {
    color: var(--semantic-text-primary-pressed);
  }
  .c-shop-card__figure {
    gap: var(--space-16);
  }
  .c-shop-card__name {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-default);
  }
  .c-shop-card__location {
    font-size: var(--font-size-12);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
    color: var(--semantic-text-tertiary);
  }
}
.c-shop-summary {
  display: flex;
  align-items: center;
  gap: var(--space-16);
  padding-block-end: var(--space-32);
}

.c-shop-summary__logo {
  flex: none;
  inline-size: calc(var(--space-80) - var(--space-2));
  aspect-ratio: var(--ratio-square);
}

.c-shop-summary__text {
  align-self: center;
  display: grid;
  gap: var(--space-4);
  min-inline-size: var(--space-0);
  overflow-wrap: anywhere;
}

.c-shop-summary__floor {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  color: var(--semantic-text-secondary);
}

.c-shop-summary__title {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
}

@media (min-width: 768px) {
  .c-shop-summary {
    gap: var(--space-24);
    padding-block-end: var(--space-48);
  }
  .c-shop-summary__logo {
    inline-size: var(--space-96);
  }
  .c-shop-summary__text {
    gap: var(--space-8);
  }
  .c-shop-summary__floor {
    font-size: var(--font-size-16);
  }
  .c-shop-summary__title {
    font-size: var(--font-size-18);
  }
}
.c-sns-list {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
  justify-content: center;
  gap: var(--space-32) var(--space-12);
  inline-size: var(--ratio-full);
  max-inline-size: calc(var(--card-sns-panel-max-inline-size) * var(--card-sns-panel-max-columns) + var(--space-12) * (var(--card-sns-panel-max-columns) - 1));
  margin-inline: auto;
}
.c-sns-list > * {
  flex: 0 1 calc((var(--ratio-full) - var(--space-12) * (var(--card-sns-panel-max-columns) - 1)) / var(--card-sns-panel-max-columns));
  max-inline-size: var(--card-sns-panel-max-inline-size);
  min-inline-size: var(--space-0);
}
@media (max-width: 767px) {
  .c-sns-list {
    max-inline-size: none;
  }
  .c-sns-list > * {
    max-inline-size: none;
  }
}
@media (min-width: 768px) {
  .c-sns-list {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    justify-content: center;
    gap: var(--space-40) var(--layout-grid-gutter);
    inline-size: var(--ratio-full);
    max-inline-size: calc(var(--card-sns-panel-max-inline-size) * var(--card-sns-panel-max-columns) + var(--layout-grid-gutter) * (var(--card-sns-panel-max-columns) - 1));
    margin-inline: auto;
  }
  .c-sns-list > * {
    flex: 0 1 calc((var(--ratio-full) - var(--layout-grid-gutter) * (var(--card-sns-panel-max-columns) - 1)) / var(--card-sns-panel-max-columns));
    max-inline-size: var(--card-sns-panel-max-inline-size);
    min-inline-size: var(--space-0);
  }
}

.c-sns-panel {
  display: grid;
  justify-items: center;
  gap: var(--space-8);
  inline-size: var(--ratio-full);
  min-inline-size: var(--space-0);
  text-align: center;
  overflow-wrap: anywhere;
}
@media (prefers-reduced-motion: no-preference) {
  .c-sns-panel .c-sns-panel__account strong {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-sns-panel:hover .c-sns-panel__account strong {
    color: var(--semantic-text-link);
  }
}
.c-sns-panel:focus-visible .c-sns-panel__account strong {
  color: var(--semantic-text-link);
}
.c-sns-panel:is([data-state=hover], [data-state=focus]) .c-sns-panel__account strong {
  color: var(--semantic-text-link);
}
.c-sns-panel:is(:active, [data-state=pressed]) .c-sns-panel__account strong {
  color: var(--semantic-text-primary-pressed);
}
@media (min-width: 768px) {
  .c-sns-panel {
    gap: var(--space-16);
  }
}

.c-sns-panel__text {
  display: grid;
  align-self: start;
  gap: var(--space-8);
  block-size: max-content;
  margin: var(--space-0);
}
.c-sns-panel__text dt {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
@media (min-width: 768px) {
  .c-sns-panel__text {
    gap: var(--space-12);
  }
  .c-sns-panel__text dt {
    font-size: var(--font-size-14);
  }
}

.c-sns-panel__account {
  display: grid;
  gap: var(--space-8);
  margin: var(--space-0);
}
.c-sns-panel__account strong {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
.c-sns-panel__account small {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  color: var(--semantic-text-secondary);
}
@media (min-width: 768px) {
  .c-sns-panel__account strong {
    font-size: var(--font-size-16);
  }
  .c-sns-panel__account small {
    font-size: var(--font-size-14);
    line-height: var(--line-height-default);
  }
}

.c-sns-panel__image,
.c-sns-panel__image img {
  inline-size: min(var(--ratio-full), var(--space-80) - var(--space-2));
  aspect-ratio: var(--ratio-square);
  block-size: auto;
  border-radius: var(--layout-circle-radius);
  object-fit: cover;
}
@media (min-width: 768px) {
  .c-sns-panel__image,
  .c-sns-panel__image img {
    inline-size: min(var(--ratio-full), var(--space-128) + var(--space-12));
  }
}

.c-sns-panel__image img {
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
}

.c-social-link {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  overflow-wrap: anywhere;
  text-decoration-line: underline;
  text-underline-position: from-font;
  min-inline-size: var(--space-0);
  max-inline-size: var(--ratio-full);
  display: inline-flex;
  align-items: center;
  gap: var(--space-12);
  color: var(--semantic-text-link);
}
.c-social-link:not([aria-disabled=true], [data-state=disabled]) {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-social-link:not([aria-disabled=true], [data-state=disabled])::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-social-link:not([aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-social-link:not([aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-social-link:not([aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-social-link:not([aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-social-link:not([aria-disabled=true], [data-state=disabled]) {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-social-link:not([aria-disabled=true], [data-state=disabled]):not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-link-hover);
  }
}
.c-social-link:not([aria-disabled=true], [data-state=disabled]):not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-link-hover);
}
.c-social-link:not([aria-disabled=true], [data-state=disabled]):not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-link-pressed-visited);
}
@media (hover: hover) {
  .c-social-link:not([aria-disabled=true], [data-state=disabled]):hover, .c-social-link:not([aria-disabled=true], [data-state=disabled]):hover .c-social-link__label {
    text-decoration-line: none;
  }
}
.c-social-link:not([aria-disabled=true], [data-state=disabled]):is(:focus-visible, :active, [data-state=hover], [data-state=focus], [data-state=pressed]), .c-social-link:not([aria-disabled=true], [data-state=disabled]):is(:focus-visible, :active, [data-state=hover], [data-state=focus], [data-state=pressed]) .c-social-link__label {
  text-decoration-line: none;
}
.c-social-link:is([aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  cursor: default;
  text-decoration-line: none;
}
.c-social-link:is([aria-disabled=true], [data-state=disabled]) .c-social-link__label {
  text-decoration-line: none;
}

.c-social-link__logo {
  display: block;
  flex: none;
  inline-size: var(--space-32);
  block-size: var(--space-32);
  object-fit: contain;
  pointer-events: none;
}

.c-social-link__label {
  min-inline-size: var(--space-0);
  overflow-wrap: anywhere;
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  text-decoration-line: underline;
  text-underline-position: from-font;
}

.c-social-share {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-32);
  inline-size: var(--ratio-full);
}
@media (min-width: 768px) {
  .c-social-share {
    gap: var(--space-24);
  }
}

.c-social-share__label {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  flex: none;
  margin: var(--space-0);
  color: var(--semantic-text-primary);
}
@media (min-width: 768px) {
  .c-social-share__label {
    font-size: var(--font-size-16);
  }
}

.c-social-share__list {
  display: flex;
  align-items: center;
  gap: var(--space-24);
}
@media (min-width: 768px) {
  .c-social-share__list {
    gap: var(--space-16);
  }
}

.c-social-share__link {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-social-share__link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
.c-social-share__link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-social-share__link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(calc(var(--layout-focus-width) + var(--space-4)) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-social-share__link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
.c-social-share__link {
  display: block;
  inline-size: var(--space-40);
  block-size: var(--space-40);
}
.c-social-share__link::before {
  display: block;
  content: "";
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}
.c-social-share__link[data-icon=facebook]::before {
  background-image: url("../images/common/logo-sns-facebook.svg");
}
.c-social-share__link[data-icon=x]::before {
  background-image: url("../images/common/logo-sns-x.svg");
}
.c-social-share__link[data-icon=line]::before {
  background-image: url("../images/common/logo-sns-line.svg");
}
@media (min-width: 768px) {
  .c-social-share__link {
    inline-size: var(--space-32);
    block-size: var(--space-32);
  }
}

.c-text-area {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-8);
  inline-size: 100%;
  max-inline-size: none;
  min-inline-size: var(--space-0);
}
.c-text-area[data-state=focus] .c-text-area__control,
.c-text-area .c-text-area__control:focus {
  border-color: var(--semantic-border-accent);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-accent);
  outline: none;
}
@media (forced-colors: active) {
  .c-text-area[data-state=focus] .c-text-area__control,
  .c-text-area .c-text-area__control:focus {
    outline: var(--space-2) solid Highlight;
    outline-offset: calc(var(--space-2) * -1);
  }
}
.c-text-area[data-state=error] .c-text-area__control,
.c-text-area .c-text-area__control[aria-invalid=true] {
  border-color: var(--semantic-border-state-error);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-state-error);
  background: var(--semantic-surface-state-error);
}
.c-text-area[data-state=disabled] .c-text-area__control,
.c-text-area .c-text-area__control:disabled {
  border: var(--space-1) solid var(--semantic-border-disabled);
  box-shadow: none;
  background: var(--semantic-surface-disabled-weak);
  color: var(--semantic-text-disabled);
}
.c-text-area[data-state=disabled] .c-text-area__control::placeholder,
.c-text-area .c-text-area__control:disabled::placeholder {
  color: var(--semantic-text-disabled);
}
.c-text-area .c-text-area__header {
  display: grid;
  gap: var(--space-4);
  min-inline-size: var(--space-0);
}
.c-text-area .c-text-area__label-row {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  min-inline-size: var(--space-0);
  margin: var(--space-0);
}
.c-text-area .c-text-area__label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-8);
  margin: var(--space-0);
  color: var(--semantic-text-primary);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
@media (min-width: 768px) {
  .c-text-area .c-text-area__label {
    font-size: var(--font-size-16);
  }
}
.c-text-area .c-text-area__help,
.c-text-area .c-text-area__counter,
.c-text-area .c-text-area__error {
  margin: var(--space-0);
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}
.c-text-area .c-text-area__help,
.c-text-area .c-text-area__counter {
  color: var(--semantic-text-secondary);
}
.c-text-area .c-text-area__error {
  color: var(--semantic-text-state-error);
}
.c-text-area .c-text-area__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-8);
  min-inline-size: var(--space-0);
}
.c-text-area .c-text-area__control {
  box-sizing: border-box;
  display: block;
  inline-size: 100%;
  min-inline-size: var(--space-0);
  border: var(--space-1) solid var(--semantic-border-secondary);
  border-radius: var(--layout-panel-radius);
  background: var(--semantic-surface-tertiary);
  color: var(--semantic-text-primary);
  font-family: var(--font-family-jp);
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-default);
  letter-spacing: var(--letter-spacing-default);
}
.c-text-area .c-text-area__control::placeholder {
  color: var(--semantic-text-tertiary);
  opacity: 1;
}
.c-text-area .c-text-area__control {
  block-size: calc(var(--space-128) - var(--space-2));
  min-block-size: calc(var(--space-128) - var(--space-2));
  padding: calc(var(--space-16) - var(--space-1));
  min-inline-size: 100%;
  max-inline-size: 100%;
  resize: vertical;
}
.c-text-area[data-state=focus] .c-text-area__control,
.c-text-area .c-text-area__control:focus, .c-text-area[data-state=error] .c-text-area__control, .c-text-area[data-state=disabled] .c-text-area__control {
  padding: calc(var(--space-12) - var(--space-1));
}
.c-text-area[data-state=error] .c-text-area__error {
  margin-block-start: calc(var(--space-4) * -1);
}
.c-text-area[data-state=disabled] .c-text-area__label, .c-text-area[data-state=disabled] .c-text-area__help, .c-text-area[data-state=disabled] .c-text-area__counter {
  color: var(--semantic-text-disabled);
}
@media (min-width: 768px) {
  .c-text-area .c-text-area__control {
    block-size: calc(var(--space-128) + var(--space-24));
    min-block-size: calc(var(--space-128) + var(--space-24));
  }
  .c-text-area[data-state=focus] .c-text-area__control,
  .c-text-area .c-text-area__control:focus, .c-text-area[data-state=error] .c-text-area__control, .c-text-area[data-state=disabled] .c-text-area__control {
    padding: calc(var(--space-16) - var(--space-1));
  }
  .c-text-area[data-state=error] .c-text-area__error {
    margin-block-start: var(--space-0);
  }
}

.c-text-list {
  display: grid;
  grid-template-columns: calc(var(--space-100) * 2) minmax(var(--space-0), 1fr);
  gap: var(--space-12) var(--space-16);
}
.c-text-list dt,
.c-text-list dd {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
@media (min-width: 768px) {
  .c-text-list {
    grid-template-columns: calc(var(--space-100) * 2 + var(--space-12)) minmax(var(--space-0), 1fr);
    gap: var(--space-8) var(--space-16);
  }
  .c-text-list dt,
  .c-text-list dd {
    font-size: var(--font-size-14);
  }
}

:is(ol, ul).c-text-list:not(.c-text-list--caption, .c-text-list--legend) {
  grid-template-columns: minmax(var(--space-0), 1fr);
  gap: var(--component-title-subtitle-gap);
  list-style-position: outside;
}
:is(ol, ul).c-text-list:not(.c-text-list--caption, .c-text-list--legend) > li {
  display: list-item;
  margin-inline-start: var(--space-24);
  padding-inline-start: var(--space-4);
}
:is(ol, ul).c-text-list:not(.c-text-list--caption, .c-text-list--legend) > li > :is(p, ol, ul):not(:first-child) {
  margin-block-start: var(--component-title-subtitle-gap);
}

ol.c-text-list:not(.c-text-list--caption, .c-text-list--legend) {
  list-style-type: decimal;
}

ul.c-text-list:not(.c-text-list--caption, .c-text-list--legend) {
  list-style-type: disc;
}

.c-text-list--opening dt,
.c-text-list--opening dd {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}
.c-text-list--opening dd {
  text-align: end;
}
@media (min-width: 768px) {
  .c-text-list--opening dt,
  .c-text-list--opening dd {
    font-size: var(--font-size-16);
  }
}

.c-text-list--definitions {
  grid-template-columns: minmax(var(--space-0), 1fr);
  gap: var(--space-8);
}
.c-text-list--definitions > dt {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}
.c-text-list--definitions > dt:not(:first-child) {
  margin-block-start: calc(var(--layout-section-padding-inner-small) - var(--space-8));
}
.c-text-list--definitions > dd {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
}
.c-text-list--definitions > dd > p + :is(p, .c-text-list--caption) {
  margin-block-start: var(--space-12);
}
.c-text-list--definitions > dd > ul + :is(p, .c-text-list--caption) {
  margin-block-start: var(--space-16);
}
@media (min-width: 768px) {
  .c-text-list--definitions > dt {
    font-size: var(--font-size-16);
  }
}

.c-text-list--caption {
  grid-template-columns: minmax(var(--space-0), 1fr);
  gap: var(--space-8);
}
.c-text-list--caption > li {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: list-item;
  margin-inline-start: var(--space-16);
  padding-inline-start: var(--space-4);
  list-style-type: "※";
  list-style-position: outside;
  color: var(--semantic-text-secondary);
}

.c-text-list--legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-8) var(--layout-grid-gap);
  padding: var(--space-0);
  list-style: none;
}
.c-text-list--legend > li {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  align-items: center;
  gap: var(--space-8);
}
@media (min-width: 768px) {
  .c-text-list--legend {
    display: flex;
    flex-wrap: wrap;
    row-gap: var(--space-40);
  }
}

.c-text-list--opening[data-list-layout=spread] {
  grid-template-columns: minmax(var(--space-0), 1fr) auto;
  gap: var(--space-12);
}

.c-text-list--caption[data-text-align=center] {
  justify-items: center;
}
.c-text-list--caption[data-text-align=center] > li {
  display: block;
  margin-inline-start: var(--space-0);
  padding-inline-start: var(--space-0);
  text-align: center;
}
.c-text-list--caption[data-text-align=center] > li::before {
  content: "※";
  margin-inline-end: var(--space-4);
}

.c-textlink-button {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-textlink-button::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-textlink-button:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-textlink-button:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-textlink-button:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-textlink-button:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-textlink-button {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-textlink-button:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-primary-hover);
  }
}
.c-textlink-button:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-primary-hover);
}
.c-textlink-button:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-primary-pressed);
}
.c-textlink-button {
  display: inline-flex;
  align-items: center;
  gap: var(--space-4);
  min-block-size: var(--space-24);
  color: var(--semantic-text-primary);
}
.c-textlink-button:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  pointer-events: none;
}
.c-textlink-button:is(:disabled, [aria-disabled=true], [data-state=disabled])::after {
  border-width: var(--space-0);
  background: transparent;
}

/* 遷移用リンクの配置は直上の意味構造で制御する。追加誘導は右寄せ。 */
.c-textlink-navigation {
  display: flex;
  justify-content: flex-end;
}
.c-textlink-navigation[data-align=start] {
  justify-content: flex-start;
}
.c-textlink-navigation[hidden] {
  display: none;
}

.c-textlink-button:not([data-variant=functional], [data-variant=text])::before {
  content: "";
  order: 1;
  display: inline-block;
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background-color: var(--semantic-icon-accent);
  /* 色をトークンで塗るためマスク描画にする 外部SVG参照はfile://でCORSに阻まれるためデータURIで埋め込む */
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M11.5 4.5L19 12L11.5 19.5' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M4 12L19 12' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center/contain;
}
@media (forced-colors: active) {
  .c-textlink-button:not([data-variant=functional], [data-variant=text])::before {
    background-color: LinkText;
  }
}
.c-textlink-button:not([data-variant=functional], [data-variant=text])::before {
  transition: translate var(--motion-duration) var(--motion-easing);
}
@media (prefers-reduced-motion: reduce) {
  .c-textlink-button:not([data-variant=functional], [data-variant=text])::before {
    transition: none;
  }
}
@media (hover: hover) {
  .c-textlink-button:not([data-variant=functional], [data-variant=text]):not(:disabled, [aria-disabled=true], [data-state=disabled]):hover::before {
    translate: var(--space-4) var(--space-0);
  }
}
@media (hover: hover) and (prefers-reduced-motion: reduce) {
  .c-textlink-button:not([data-variant=functional], [data-variant=text]):not(:disabled, [aria-disabled=true], [data-state=disabled]):hover::before {
    translate: none;
  }
}
.c-textlink-button:not([data-variant=functional], [data-variant=text]):not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus])::before {
  translate: var(--space-4) var(--space-0);
}
@media (prefers-reduced-motion: reduce) {
  .c-textlink-button:not([data-variant=functional], [data-variant=text]):not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus])::before {
    translate: none;
  }
}
.c-textlink-button:not([data-variant=functional], [data-variant=text]) > .c-textlink-button__label {
  font-weight: inherit;
}
.c-textlink-button:not([data-variant=functional], [data-variant=text]) > .c-textlink-button__label::before {
  position: absolute;
  content: "";
  inset-inline: var(--space-0);
  inset-block-start: var(--ratio-half);
  block-size: max(var(--ratio-full), var(--space-40));
  translate: var(--space-0) calc(var(--ratio-half) * -1);
}
.c-textlink-button:not([data-variant=functional], [data-variant=text]):is(:disabled, [aria-disabled=true], [data-state=disabled])::before {
  background-color: var(--semantic-icon-disabled);
}

@media (prefers-reduced-motion: no-preference) {
  .c-textlink-button[data-variant=text] {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-textlink-button[data-variant=text]:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-link-hover);
  }
}
.c-textlink-button[data-variant=text]:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-link-hover);
}
.c-textlink-button[data-variant=text]:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-link-pressed-visited);
}
.c-textlink-button[data-variant=text] {
  color: var(--semantic-text-link);
  text-decoration: underline;
  text-underline-position: from-font;
}
@media (hover: hover) {
  .c-textlink-button[data-variant=text]:hover {
    text-decoration: none;
  }
}
.c-textlink-button[data-variant=text]:is(:active, :focus-visible, :disabled, [aria-disabled=true], [data-state=hover], [data-state=pressed], [data-state=focus], [data-state=disabled]) {
  text-decoration: none;
}
.c-textlink-button[data-variant=text]:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  pointer-events: none;
}
.c-textlink-button[data-variant=text] {
  font-weight: var(--font-weight-regular);
}

/* Figma master annotations | M-IDs: M-071, M-072 | nodeIDs: 7070:9229, 7070:9417 | ownerIDs: 7070:9229, 7070:9417
作成中
*/
.c-textlink-list {
  display: grid;
  gap: var(--space-0);
  padding: var(--space-0);
  margin: var(--space-0);
  list-style: none;
}
.c-textlink-list > li > :is(a, p) {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: block;
  padding-block: var(--space-12);
  margin: var(--space-0);
}

.c-textlink-list > li > .c-textlink-list {
  padding-block-start: var(--space-4);
  padding-block-end: var(--space-8);
  margin-inline-start: var(--space-24);
}
.c-textlink-list > li > .c-textlink-list > li > :is(a, p) {
  font-weight: var(--font-weight-regular);
  padding-block: var(--space-8);
}
@media (min-width: 768px) {
  .c-textlink-list > li > .c-textlink-list {
    margin-inline-start: var(--space-32);
  }
}

.l-divided-stack > .c-textlink-list {
  padding-block: var(--space-12);
}
.l-divided-stack > .c-textlink-list:first-child {
  padding-block-start: var(--space-0);
}
.l-divided-stack > .c-textlink-list:last-child {
  padding-block-end: var(--space-0);
}

@media (max-width: 767px) {
  .l-content-columns > .l-divided-stack:first-child > .c-textlink-list:last-child {
    padding-block-end: var(--space-12);
  }
  .l-content-columns > .l-divided-stack:last-child > .c-textlink-list:first-child {
    padding-block-start: var(--space-12);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-textlink-basic {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-textlink-basic:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-link);
  }
}
.c-textlink-basic:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-link);
}
.c-textlink-basic:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-link-pressed-visited);
}
.c-textlink-basic {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-textlink-basic::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-textlink-basic:is(:active, [data-state=pressed])::before {
    background: var(--semantic-tap-highlight);
  }
}
.c-textlink-basic:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-textlink-basic:is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-textlink-basic:is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
.c-textlink-basic {
  color: var(--semantic-text-primary);
  text-decoration: none;
}
.c-textlink-basic[target=_blank]::after {
  content: "";
  display: inline-block;
  inline-size: var(--space-16);
  block-size: var(--space-16);
  margin-inline-start: var(--space-4);
  margin-inline-end: var(--space-4);
  background: url("../images/common/icon-blanklink.svg") no-repeat center/contain;
  vertical-align: text-bottom;
}

.c-textlink:not([data-phone-href], [href^="tel:"]) {
  overflow-wrap: anywhere;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-textlink:not([data-phone-href], [href^="tel:"])::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-textlink:not([data-phone-href], [href^="tel:"]):is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-textlink:not([data-phone-href], [href^="tel:"]):is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-textlink:not([data-phone-href], [href^="tel:"]):is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-textlink:not([data-phone-href], [href^="tel:"]):is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-textlink:not([data-phone-href], [href^="tel:"]) {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-textlink:not([data-phone-href], [href^="tel:"]):not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-link-hover);
  }
}
.c-textlink:not([data-phone-href], [href^="tel:"]):not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-link-hover);
}
.c-textlink:not([data-phone-href], [href^="tel:"]):not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-link-pressed-visited);
}
.c-textlink:not([data-phone-href], [href^="tel:"]) {
  color: var(--semantic-text-link);
  text-decoration: underline;
  text-underline-position: from-font;
}
@media (hover: hover) {
  .c-textlink:not([data-phone-href], [href^="tel:"]):hover {
    text-decoration: none;
  }
}
.c-textlink:not([data-phone-href], [href^="tel:"]):is(:active, :focus-visible, :disabled, [aria-disabled=true], [data-state=hover], [data-state=pressed], [data-state=focus], [data-state=disabled]) {
  text-decoration: none;
}
.c-textlink:not([data-phone-href], [href^="tel:"]):is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  pointer-events: none;
}

.c-textlink-button[data-variant=functional] {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  justify-content: flex-start;
}
.c-textlink-button[data-variant=functional]::before {
  content: "";
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background-color: var(--semantic-icon-primary);
  mask: url("data:image/svg+xml,%3Csvg%20preserveAspectRatio%3D%22none%22%20overflow%3D%22visible%22%20style%3D%22display%3A%20block%3B%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20id%3D%22Icon%22%3E%0A%3Cpath%20id%3D%22Vector%22%20d%3D%22M4.5%2015H19.5%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%3Cpath%20id%3D%22Vector_2%22%20d%3D%22M4.5%209H19.5%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%3Ccircle%20id%3D%22Ellipse%22%20cx%3D%2215%22%20cy%3D%229%22%20r%3D%221.5%22%20fill%3D%22black%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%3Ccircle%20id%3D%22Ellipse_2%22%20cx%3D%229%22%20cy%3D%2215%22%20r%3D%221.5%22%20fill%3D%22black%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A") no-repeat center/contain;
  mask-mode: luminance;
}
.c-textlink-button[data-variant=functional][data-icon=close]::before {
  mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Cpath%20d%3D%22M20.5303%204.53027L4.53027%2020.5303L3.46973%2019.4697L19.4697%203.46973L20.5303%204.53027Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M20.5303%2019.4697L19.4697%2020.5303L3.46973%204.53027L4.53027%203.46973L20.5303%2019.4697Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.c-textlink-button[data-variant=functional]:is(:disabled, [aria-disabled=true], [data-state=disabled])::before {
  background-color: var(--semantic-icon-disabled);
}
@media (min-width: 768px) {
  .c-textlink-button[data-variant=functional] {
    font-size: var(--font-size-16);
  }
  .c-textlink-button[data-variant=functional]:is([data-state=active], [aria-expanded=true]):not(:disabled, [aria-disabled=true], [data-state=disabled], :active, [data-state=pressed]) {
    color: var(--semantic-text-primary-hover);
  }
  .c-textlink-button[data-variant=functional]:is(:disabled, [aria-disabled=true], [data-state=disabled])::before {
    background-color: var(--semantic-border-tertiary);
  }
}

.c-textlink-external {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-textlink-external::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-textlink-external:is(:active, [data-state=pressed])::before {
    background: var(--semantic-tap-highlight);
  }
}
.c-textlink-external:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-textlink-external:is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-textlink-external:is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-textlink-external {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-textlink-external:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-link-hover);
  }
}
.c-textlink-external:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-link-hover);
}
.c-textlink-external:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-link-pressed-visited);
}
.c-textlink-external {
  color: var(--semantic-text-link);
  text-decoration: underline;
  text-underline-position: from-font;
}
@media (hover: hover) {
  .c-textlink-external:hover {
    text-decoration: none;
  }
}
.c-textlink-external:is(:active, :focus-visible, :disabled, [aria-disabled=true], [data-state=hover], [data-state=pressed], [data-state=focus], [data-state=disabled]) {
  text-decoration: none;
}
.c-textlink-external:is(:disabled, [aria-disabled=true], [data-state=disabled]) {
  color: var(--semantic-text-disabled);
  pointer-events: none;
}
.c-textlink-external::after {
  content: "";
  display: inline-block;
  inline-size: var(--space-16);
  block-size: var(--space-16);
  margin-inline-start: var(--space-4);
  margin-inline-end: var(--space-4);
  background: url("../images/common/icon-blanklink.svg") no-repeat center/contain;
  vertical-align: text-bottom;
}

.c-textlink-navigation[data-size=regular] {
  min-block-size: var(--space-40);
  align-items: center;
}

.c-tab-navigation {
  inline-size: var(--ratio-full);
}

.c-tab-navigation__list {
  display: flex;
  inline-size: var(--ratio-full);
}

.c-tab-navigation__item {
  min-inline-size: var(--space-0);
}

/* Tab移動後にフォーカスされるPanelも、共通の4px Focus Ringで現在位置を示す */
[role=tabpanel][tabindex] {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
[role=tabpanel][tabindex]::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  [role=tabpanel][tabindex]:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
[role=tabpanel][tabindex]:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
[role=tabpanel][tabindex]:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  [role=tabpanel][tabindex]:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}

.c-tab-navigation__link {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--ratio-full);
  block-size: var(--ratio-full);
  color: var(--semantic-text-tertiary);
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-tab-navigation__link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-tab-navigation__link:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-tab-navigation__link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-tab-navigation__link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-tab-navigation__link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-tab-navigation__link {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-tab-navigation__link:hover, .c-tab-navigation__link:focus-visible {
  color: var(--semantic-text-link);
}

.c-tab-navigation[data-type=boxed] .c-tab-navigation__list {
  gap: var(--space-4);
  background: linear-gradient(var(--semantic-border-primary), var(--semantic-border-primary)) no-repeat bottom/var(--ratio-full) var(--space-1);
}
.c-tab-navigation[data-type=boxed] .c-tab-navigation__item {
  flex: 1;
  block-size: calc(var(--space-48) + var(--space-1));
}
.c-tab-navigation[data-type=boxed] .c-tab-navigation__link {
  padding: var(--space-16) var(--space-8);
  /* 非選択タブの下辺は各タブ自身の1px線として表示する */
  border: var(--space-1) solid transparent;
  border-block-end-color: var(--semantic-border-primary);
  border-radius: var(--layout-panel-radius) var(--layout-panel-radius) var(--space-0) var(--space-0);
  background-color: #e9e8e8;
  color: var(--semantic-text-secondary);
}
.c-tab-navigation[data-type=boxed] :is([aria-current=page], [aria-selected=true]) {
  border-block-start-color: var(--semantic-border-primary);
  border-inline-color: var(--semantic-border-primary);
  border-block-end-color: transparent;
  background-color: var(--semantic-background-base);
  color: var(--semantic-text-primary);
}

@media (prefers-reduced-motion: no-preference) {
  .c-tab-navigation:is([data-type=boxed],
  [data-type=default],
  [data-type=logo],
  [data-type=left-aligned],
  [data-type=date]) .c-tab-navigation__link {
    transition: color var(--motion-duration) var(--motion-easing), background-color var(--motion-duration) var(--motion-easing), border-color var(--motion-duration) var(--motion-easing), box-shadow var(--motion-duration) var(--motion-easing);
  }
}

.c-tab-navigation[data-type=default] .c-tab-navigation__link {
  box-shadow: inset var(--space-0) calc(var(--space-1) * -1) var(--space-0) var(--semantic-border-secondary);
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__list {
  background: linear-gradient(var(--semantic-border-secondary), var(--semantic-border-secondary)) no-repeat bottom/var(--ratio-full) var(--space-1);
}

.c-tab-navigation:is([data-type=default],
[data-type=logo],
[data-type=left-aligned]) :is([aria-current=page], [aria-selected=true]) {
  box-shadow: inset var(--space-0) calc(var(--layout-nav-underline-width) * -1) var(--space-0) var(--semantic-border-accent);
}

.c-tab-navigation[data-type=default] .c-tab-navigation__item {
  flex: 1;
  min-block-size: calc(var(--space-56) + var(--space-1));
}
.c-tab-navigation[data-type=default] .c-tab-navigation__link {
  padding: var(--space-24) var(--space-8) var(--space-16);
}
.c-tab-navigation[data-type=default] :is([aria-current=page], [aria-selected=true]) {
  color: var(--semantic-text-primary);
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__item {
  flex: 1;
  min-block-size: calc(var(--space-72) - var(--space-2));
}
.c-tab-navigation[data-type=logo] .c-tab-navigation__link {
  padding: var(--space-24) var(--space-8) var(--space-16);
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand]::before {
  content: "";
  display: block;
  inline-size: var(--space-100);
  block-size: calc(var(--space-32) - var(--space-2));
  background: no-repeat center/contain;
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua]::before {
  inline-size: calc(var(--space-64) + var(--space-2));
  background-image: url("../images/common/logo-lucua-mobile.svg");
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua-1100]::before {
  inline-size: calc(var(--space-64) + var(--space-2));
  background-image: url("../images/common/logo-lucua1100-mobile.svg");
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua-and-1100]::before {
  inline-size: calc(var(--space-128) + var(--space-32) - var(--space-2));
  background-image: url("../images/common/logo-lucua-mobile.svg"), url("../images/common/logo-lucua1100-mobile.svg");
  background-repeat: no-repeat;
  background-position: left calc(var(--space-4) + var(--space-1)) center, right calc(var(--space-4) + var(--space-1)) center;
  background-size: calc(var(--space-64) + var(--space-2)) var(--space-16), calc(var(--space-64) + var(--space-2)) calc(var(--space-32) - var(--space-2));
}

.c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua-south]::before {
  inline-size: calc(var(--space-64) + var(--space-2));
  background-image: url("../images/common/logo-lucua-south-mobile.svg");
}

.c-tab-navigation[data-type=left-aligned] {
  overflow-x: auto;
  background: linear-gradient(var(--semantic-border-secondary), var(--semantic-border-secondary)) no-repeat bottom/var(--ratio-full) var(--space-1);
  scrollbar-width: none;
}
.c-tab-navigation[data-type=left-aligned]::-webkit-scrollbar {
  display: none;
}
.c-tab-navigation[data-type=left-aligned] .c-tab-navigation__list {
  inline-size: max-content;
  padding-inline-end: var(--layout-page-gutter);
}
.c-tab-navigation[data-type=left-aligned] .c-tab-navigation__item {
  min-inline-size: var(--space-56);
  min-block-size: calc(var(--space-56) + var(--space-1));
}
.c-tab-navigation[data-type=left-aligned] .c-tab-navigation__link {
  padding: var(--space-24) var(--space-8) var(--space-16);
}
.c-tab-navigation[data-type=left-aligned] :is([aria-current=page], [aria-selected=true]) {
  color: var(--semantic-text-primary);
}

.c-tab-navigation[data-type=date] {
  overflow-x: auto;
  margin-block: calc((var(--layout-focus-outer-size) + var(--layout-focus-width) + var(--space-1)) * -1);
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}
.c-tab-navigation[data-type=date]::-webkit-scrollbar {
  display: none;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__list {
  gap: var(--space-8);
  inline-size: max-content;
  padding: calc(var(--layout-focus-outer-size) + var(--layout-focus-width) + var(--space-1));
}
.c-tab-navigation[data-type=date] .c-tab-navigation__item {
  flex: 0 0 calc(var(--space-80) - var(--space-4));
  inline-size: calc(var(--space-80) - var(--space-4));
  min-inline-size: calc(var(--space-80) - var(--space-4));
  block-size: calc(var(--space-80) - var(--space-4));
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link {
  flex-direction: column;
  gap: var(--space-2);
  inline-size: calc(var(--space-80) - var(--space-4));
  block-size: calc(var(--space-80) - var(--space-4));
  padding-inline: var(--space-12);
  scroll-margin-inline: calc(var(--layout-focus-outer-size) + var(--layout-focus-width) + var(--space-1));
  border-radius: var(--radius-999);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-secondary);
  color: var(--semantic-text-primary);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link::after {
  border-radius: var(--radius-999);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date {
  position: relative;
  display: block;
  inline-size: var(--ratio-full);
  block-size: calc(var(--space-32) + var(--space-4) + var(--font-size-12) * var(--line-height-narrow));
  padding-block-start: calc(var(--space-32) + var(--space-4));
  color: inherit;
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  font-style: normal;
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  text-align: center;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date::before,
.c-tab-navigation[data-type=date] .c-tab-navigation__date::after {
  position: absolute;
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-flat);
  white-space: nowrap;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date::after {
  inset-block-start: calc(var(--space-12) + var(--layout-nav-underline-width));
  inset-inline-start: calc(var(--space-24) + var(--space-2));
  content: attr(data-day);
  inline-size: calc(var(--space-24) + var(--space-2));
  font-size: var(--font-size-20);
  text-align: start;
  transform: none;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date::before {
  inset-block-start: var(--space-2);
  inset-inline-start: var(--space-0);
  content: attr(data-month);
  inline-size: calc(var(--space-20) - var(--space-2));
  font-size: var(--font-size-14);
  text-align: end;
  transform: none;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date-slash {
  position: absolute;
  inset-block-start: var(--space-16);
  inset-inline-start: calc(var(--space-8) - var(--space-1) / 2);
  display: block;
  inline-size: var(--space-32);
  block-size: var(--space-1);
  background-color: currentcolor;
  transform: rotate(-45deg);
  transform-origin: center;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__weekday {
  display: block;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date[data-day-type=saturday] .c-tab-navigation__weekday {
  color: var(--primitive-blue-500);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__date:is([data-day-type=sunday],
[data-day-type=holiday]) .c-tab-navigation__weekday {
  color: var(--primitive-red-500);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link:not([aria-current=page],
[aria-selected=true]):is(:hover, [data-state=hover]) {
  background-color: var(--semantic-surface-tertiary-hover);
  color: var(--semantic-text-primary);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link:not([aria-current=page],
[aria-selected=true]):is(:active, [data-state=pressed]) {
  box-shadow: none;
  background-color: var(--semantic-surface-primary);
  color: var(--semantic-text-inverse-primary);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link:is(:active, [data-state=pressed])::after {
  background: transparent;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link:is(:active,
[data-state=pressed]) .c-tab-navigation__weekday {
  color: inherit;
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link:is([aria-current=page], [aria-selected=true]) {
  box-shadow: none;
  background-color: var(--semantic-surface-primary);
  color: var(--semantic-text-inverse-primary);
}
.c-tab-navigation[data-type=date] .c-tab-navigation__link:is([aria-current=page],
[aria-selected=true]) .c-tab-navigation__weekday {
  color: inherit;
}

/* SPのページコンテナ内ではDate Tabを画面端まで広げ、両終端へページガターを確保する */
@media (max-width: 767px) {
  .l-content-container .c-tab-navigation[data-type=date] {
    inline-size: calc(var(--ratio-full) + var(--layout-page-gutter) * 2);
    margin-inline: calc(var(--layout-page-gutter) * -1);
  }
  .l-content-container .c-tab-navigation[data-type=date] .c-tab-navigation__list {
    padding-inline: calc(var(--layout-page-gutter) + var(--space-1) / 2);
  }
}
@media (min-width: 768px) {
  .c-tab-navigation__link {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
  }
  .c-tab-navigation[data-type=boxed] .c-tab-navigation__list {
    gap: var(--space-8);
  }
  .c-tab-navigation[data-type=boxed] .c-tab-navigation__item {
    block-size: calc(var(--space-64) + var(--space-4) - var(--space-1));
  }
  .c-tab-navigation[data-type=boxed] .c-tab-navigation__link {
    padding: var(--space-24) var(--space-12);
  }
  .c-tab-navigation[data-type=default] .c-tab-navigation__item {
    min-block-size: calc(var(--space-56) + var(--layout-nav-underline-width));
  }
  .c-tab-navigation[data-type=default] .c-tab-navigation__link {
    padding-inline: var(--space-12);
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__item {
    min-block-size: var(--space-64);
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__link {
    padding: var(--space-24) var(--space-12) var(--space-16);
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand]::before {
    block-size: var(--space-24);
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua]::before {
    inline-size: var(--space-100);
    background-image: url("../images/common/logo-lucua-desktop.svg");
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua-1100]::before {
    inline-size: calc(var(--space-100) + var(--space-64));
    background-image: url("../images/common/logo-lucua1100-desktop.svg");
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua-and-1100]::before {
    inline-size: calc(var(--space-100) * 2 + var(--space-64) + var(--space-32) - var(--space-1));
    background-image: url("../images/common/logo-lucua-desktop.svg"), url("../images/common/logo-lucua1100-desktop.svg");
    background-position: left center, right center;
    background-size: calc(var(--space-100) - var(--space-1)) var(--space-24), calc(var(--space-100) + var(--space-64)) var(--space-24);
  }
  .c-tab-navigation[data-type=logo] .c-tab-navigation__link[data-brand=lucua-south]::before {
    inline-size: calc(var(--space-128) + var(--space-48));
    background-image: url("../images/common/logo-lucua-south-desktop.svg");
  }
  .c-tab-navigation[data-type=left-aligned] {
    overflow: visible;
  }
  .c-tab-navigation[data-type=left-aligned] .c-tab-navigation__list {
    padding-inline-end: var(--space-0);
  }
  .c-tab-navigation[data-type=left-aligned] .c-tab-navigation__item {
    min-inline-size: var(--space-64);
    min-block-size: calc(var(--space-56) + var(--layout-nav-underline-width));
  }
  .c-tab-navigation[data-type=left-aligned] .c-tab-navigation__link {
    padding: var(--space-24) var(--space-12) var(--space-16);
  }
  .c-tab-navigation[data-type=date] {
    overflow: visible;
    margin-block: var(--space-0);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__list {
    justify-content: center;
    gap: var(--space-24);
    inline-size: var(--ratio-full);
    padding: var(--space-0);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__item {
    flex-basis: calc(var(--space-100) + var(--space-2));
    inline-size: calc(var(--space-100) + var(--space-2));
    min-inline-size: calc(var(--space-100) + var(--space-2));
    block-size: calc(var(--space-100) + var(--space-2));
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__link {
    gap: var(--space-4);
    inline-size: calc(var(--space-100) + var(--space-2));
    block-size: calc(var(--space-100) + var(--space-2));
    padding-inline: var(--space-16);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__date {
    block-size: calc(var(--space-44) + var(--space-4) + var(--font-size-14) * var(--line-height-narrow));
    padding-block-start: calc(var(--space-44) + var(--space-4));
    font-size: var(--font-size-14);
    line-height: var(--line-height-narrow);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__date::before {
    inset-block-start: calc(var(--space-1) / 2);
    inset-inline-start: var(--space-0);
    inline-size: calc(var(--space-24) + var(--space-2));
    font-size: var(--font-size-16);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__date::after {
    inset-block-start: calc(var(--space-16) + var(--space-1) / 2);
    inset-inline-start: calc(var(--space-32) + var(--layout-nav-underline-width));
    inline-size: calc(var(--space-36) - var(--space-1));
    font-size: var(--font-size-28);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__date-slash {
    inset-block-start: calc(var(--space-16) + var(--space-1) + var(--space-1) / 2);
    inset-inline-start: calc(var(--space-12) + var(--space-1) + var(--space-1) / 2);
    inline-size: calc(var(--space-40) - var(--space-2));
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__link:is([aria-current=page], [aria-selected=true]) {
    padding-inline: var(--space-0);
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__link:is([aria-current=page], [aria-selected=true]) .c-tab-navigation__date::before {
    inset-block-start: var(--space-0);
    inset-inline-start: var(--space-12);
    inline-size: calc(var(--space-28) + var(--space-2));
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__link:is([aria-current=page], [aria-selected=true]) .c-tab-navigation__date::after {
    inset-block-start: var(--space-16);
    inset-inline-start: calc(var(--space-48) + var(--layout-nav-underline-width));
    inline-size: calc(var(--space-48) - var(--space-2));
  }
  .c-tab-navigation[data-type=date] .c-tab-navigation__link:is([aria-current=page], [aria-selected=true]) .c-tab-navigation__date-slash {
    inset-block-start: calc(var(--space-16) + var(--space-1) + var(--space-1) / 2);
    inset-inline-start: calc(var(--space-28) + var(--space-1) + var(--space-1) / 2);
  }
}
.c-tag {
  font-size: var(--font-size-11);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-caption);
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  gap: var(--space-8);
  min-inline-size: calc(var(--space-40) + var(--space-1));
  padding: var(--space-4) var(--space-8);
  border: var(--space-0);
  color: var(--semantic-text-accent);
  background: transparent;
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-accent);
  text-align: center;
  white-space: nowrap;
}
.c-tag[data-hierarchy=secondary] {
  color: var(--semantic-text-primary);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-primary);
}
.c-tag[data-hierarchy=tertiary] {
  color: var(--semantic-text-inverse-primary);
  background: var(--semantic-surface-secondary);
  box-shadow: none;
}
@media (min-width: 768px) {
  .c-tag {
    font-size: var(--font-size-12);
    line-height: var(--line-height-narrow);
    min-inline-size: calc(var(--space-40) + var(--space-2) + var(--space-1));
  }
}
@media (forced-colors: active) {
  .c-tag {
    outline: var(--space-1) solid CanvasText;
    outline-offset: calc(var(--space-1) * -1);
  }
}

:where(input:not([type]),
input[type=text],
input[type=email],
input[type=password],
input[type=tel],
input[type=url],
input[type=number],
textarea):not(.c-searchbar__input) {
  border: var(--space-1) solid var(--semantic-border-secondary);
  border-radius: var(--layout-panel-radius);
  background: var(--semantic-surface-tertiary);
}
:where(input:not([type]),
input[type=text],
input[type=email],
input[type=password],
input[type=tel],
input[type=url],
input[type=number],
textarea):not(.c-searchbar__input):focus {
  border-color: var(--semantic-border-accent);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-accent);
  outline: none;
}

@keyframes calendar-view-enter {
  from {
    opacity: var(--motion-menu-start-opacity);
    translate: var(--space-0) var(--space-8);
  }
  to {
    opacity: 1;
    translate: var(--space-0);
  }
}
.c-calendar-root {
  position: relative;
}

/* Functional Buttonの寸法・Focusを再利用し、用途固有のCalendarアイコンだけを差し替える */
.c-calendar__trigger[data-variant=functional]::before {
  mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Cpath%20d%3D%22M5.25%204.75H18.75C19.5784%204.75%2020.25%205.42157%2020.25%206.25V19.25H3.75V6.25C3.75%205.42157%204.42157%204.75%205.25%204.75Z%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3.75%209.25H20.25%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8%202.75V6.75M16%202.75V6.75%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M7.5%2012.75H9.5M11%2012.75H13M14.5%2012.75H16.5M7.5%2016.25H9.5M11%2016.25H13M14.5%2016.25H16.5%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%2F%3E%0A%3C%2Fsvg%3E%0A");
}

.c-calendar {
  box-sizing: border-box;
  inline-size: var(--grid-mobile-width);
  padding: var(--space-24);
  border: var(--space-0);
  border-radius: var(--space-8);
  margin: var(--space-0);
  background: var(--semantic-background-base);
  color: var(--semantic-text-primary);
}

.c-calendar__header {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-16);
  padding-block-end: var(--space-16);
}

.c-calendar__month-label {
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  flex: 1 1 auto;
  margin: var(--space-0);
}

.c-calendar__header-actions,
.c-calendar__navigation {
  display: flex;
  flex: none;
  align-items: center;
}

.c-calendar__header-actions {
  gap: var(--space-16);
}

.c-calendar__navigation {
  gap: var(--space-12);
}

.c-calendar__body {
  --calendar-column-gap: calc(
    (
      (var(--space-256) + var(--space-44)) -
      (var(--space-40) * 7)
    ) / 6
  );
  flex: none;
  table-layout: fixed;
  inline-size: calc(var(--space-256) + var(--space-44));
  min-block-size: var(--space-0);
  padding: var(--space-0);
  border-collapse: collapse;
  border-spacing: var(--space-0);
  overflow: visible;
}

.c-calendar__weekday,
.c-calendar__cell {
  inline-size: calc(var(--space-40) + var(--calendar-column-gap));
  padding: var(--space-0) var(--calendar-column-gap) var(--space-0) var(--space-0);
  text-align: center;
  vertical-align: top;
}

.c-calendar__weekday:last-child,
.c-calendar__cell:last-child {
  inline-size: var(--space-40);
  padding-inline-end: var(--space-0);
}

.c-calendar__weekday {
  padding-block-end: var(--space-8);
}

.c-calendar__weekday,
.c-calendar__day {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
}

.c-calendar__weekday abbr,
.c-calendar__day {
  display: grid;
  place-items: center;
  inline-size: var(--space-40);
  block-size: var(--space-40);
}

.c-calendar__weekday abbr {
  color: inherit;
  text-decoration: none;
}

.c-calendar__weekday {
  color: var(--semantic-text-secondary);
}
.c-calendar__weekday:first-child {
  color: var(--primitive-red-500);
}
.c-calendar__weekday:last-child {
  color: var(--primitive-blue-500);
}

.c-calendar__cell {
  padding-block-end: var(--space-4);
}

.c-calendar__dates .c-calendar__week:first-child .c-calendar__cell {
  padding-block-start: var(--space-8);
}

.c-calendar__dates .c-calendar__week:last-child .c-calendar__cell {
  padding-block-end: var(--space-0);
}

.c-calendar__day:not(:disabled, [data-state=disabled]) {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-calendar__day:not(:disabled, [data-state=disabled])::before {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
.c-calendar__day:not(:disabled, [data-state=disabled]):is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-calendar__day:not(:disabled, [data-state=disabled]):is(:focus-visible, [data-state=focus])::before {
  inset: calc(var(--space-0) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-calendar__day:not(:disabled, [data-state=disabled]):is(:focus-visible, [data-state=focus])::before {
    border-color: Highlight;
  }
}
.c-calendar__day:not(:disabled, [data-state=disabled])::before {
  border-radius: var(--layout-circle-radius);
}
@media (hover: hover) {
  .c-calendar__day:not(:disabled, [data-state=disabled]):hover {
    background: var(--semantic-surface-tertiary-hover);
  }
}
.c-calendar__day:not(:disabled, [data-state=disabled])[data-state=hover] {
  background: var(--semantic-surface-tertiary-hover);
}
.c-calendar__day {
  padding: var(--space-0);
  border: var(--space-0);
  border-radius: var(--layout-circle-radius);
  background: transparent;
  color: var(--semantic-text-primary);
}

.c-calendar:not([open], :popover-open) {
  transition: none;
}

@media (prefers-reduced-motion: no-preference) {
  .c-calendar__day {
    transition: color var(--motion-duration) var(--motion-easing), background-color var(--motion-duration) var(--motion-easing), box-shadow var(--motion-duration) var(--motion-easing);
  }
  .c-calendar[data-calendar-motion=view] :is(.c-calendar__month-label, .c-calendar__body) {
    animation: calendar-view-enter var(--motion-duration) var(--motion-easing);
  }
}
.c-calendar__day[aria-current=date] {
  color: var(--semantic-text-accent);
  box-shadow: inset var(--space-0) var(--space-0) var(--space-0) var(--space-1) var(--semantic-border-accent);
}

.c-calendar__cell[aria-selected=true] .c-calendar__day {
  background: var(--semantic-surface-primary);
  color: var(--semantic-text-inverse-primary);
  box-shadow: none;
}

.c-calendar__day:is(:disabled, [data-outside-month=true], [data-state=disabled]),
.c-calendar__cell .c-calendar__day:is(:disabled, [data-outside-month=true], [data-state=disabled]) {
  background: transparent;
  color: var(--semantic-text-disabled);
  box-shadow: none;
  cursor: default;
}

/* SPは既存Modalを使い、Figmaの348×412と8px backdrop blurへ限定して上書きする */
.c-calendar[data-calendar-panel=mobile] {
  display: none;
  min-inline-size: var(--space-0);
  max-inline-size: calc(100vi - var(--space-20) * 2);
  block-size: calc(var(--space-256) + var(--space-128) + var(--space-28));
  min-block-size: calc(var(--space-256) + var(--space-128) + var(--space-28));
  max-block-size: calc(var(--space-256) + var(--space-128) + var(--space-28));
  margin: auto;
}

.c-calendar[data-calendar-panel=mobile][open] {
  display: flex;
}

.c-calendar[data-calendar-panel=mobile] .c-dialog__close {
  --icon-button-size: var(--space-32);
  --icon-button-padding: var(--space-4);
}

.c-calendar[data-calendar-panel=mobile]::backdrop {
  background: var(--semantic-background-backdrop);
  -webkit-backdrop-filter: blur(var(--space-8));
  backdrop-filter: blur(var(--space-8));
}

/* PC用DropdownはSPでは常に非表示にし、誤操作でpopover-openになっても描画しない */
.c-calendar[data-calendar-panel=desktop] {
  display: none;
  opacity: var(--motion-menu-start-opacity);
}

@media (min-width: 768px) {
  .c-calendar[data-calendar-panel=mobile],
  .c-calendar[data-calendar-panel=mobile][open] {
    display: none;
  }
  .c-calendar[data-calendar-panel=desktop] {
    position-anchor: auto;
    inset: calc(anchor(bottom) + var(--space-8)) auto auto calc(anchor(right) - var(--grid-mobile-width));
    inline-size: var(--grid-mobile-width);
    block-size: calc(var(--space-256) + var(--space-128) + var(--space-44));
    padding: var(--space-24);
    box-shadow: var(--space-0) var(--space-4) var(--space-16) rgba(0, 0, 0, 0.2);
  }
  .c-calendar[data-calendar-panel=desktop]:popover-open {
    display: flex;
    flex-direction: column;
    opacity: 1;
    translate: var(--space-0);
  }
}
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  @starting-style {
    .c-calendar[data-calendar-panel=desktop]:popover-open {
      opacity: var(--motion-menu-start-opacity);
      translate: var(--space-0) var(--motion-menu-start-offset);
    }
  }
}
@media (min-width: 768px) {
  .c-calendar[data-calendar-panel=desktop] .c-calendar__header {
    gap: var(--space-12);
    padding-block-end: var(--space-24);
  }
  .c-calendar[data-calendar-panel=desktop] .c-calendar__navigation {
    gap: var(--space-4);
  }
}
@media (min-width: 768px) {
  /* Anchor Positioning非対応環境ではJSが算出したTrigger右端と下端へ固定する */
  @supports not (anchor-name: --a) {
    .c-calendar[data-calendar-panel=desktop] {
      position: fixed;
      inset: var(--calendar-fallback-block-start, var(--space-0)) var(--calendar-fallback-inline-end, var(--space-8)) auto auto;
    }
  }
}
.c-table {
  --table-heading-width: calc(var(--space-80) + var(--space-8) + var(--space-2));
  --table-trailing-width: var(--space-120);
  inline-size: var(--ratio-full);
  margin: var(--space-0);
  border-collapse: collapse;
}
.c-table[data-heading-width=wide] {
  --table-heading-width: var(--space-120);
}
.c-table[data-heading-width=medium] {
  --table-heading-width: var(--space-96);
}
.c-table[data-heading-width=compact] {
  --table-heading-width: var(--space-60);
}
.c-table[data-layout=fixed] {
  table-layout: fixed;
}
.c-table[data-trailing-width="175"] {
  --table-trailing-width: var(--space-120);
}
.c-table[data-trailing-width="175"] > :is(thead, tbody, tfoot) > tr > :last-child {
  inline-size: var(--table-trailing-width);
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td),
.c-table > :is(dt, dd),
.c-table .c-table__th,
.c-table .c-table__td {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  min-inline-size: var(--space-0);
  padding: var(--space-16) var(--space-8);
  margin: var(--space-0);
  border: var(--space-0);
  box-shadow: inset var(--space-0) calc(var(--space-1) * -1) var(--space-0) var(--semantic-border-tertiary);
  color: var(--semantic-text-primary);
  text-align: start;
  vertical-align: top;
  align-content: start;
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td) > p,
.c-table > :is(dt, dd) > p,
.c-table .c-table__th > p,
.c-table .c-table__td > p {
  margin: var(--space-0);
}
.c-table {
  /* Figma master annotations | M-IDs: M-029 | nodeIDs: 7065:11539 | ownerIDs: 7065:11539
  9/9update
  Th-Defaultの以下を修正済み
  文字スタイルを変更Label/Medium(16px 120%)→Body/Strong(16px 150%)
  テキスト位置のズレを解消するためにテキストに付与していたpadding-top:2pxを削除
  */
  /* Figma master annotations | M-IDs: M-031 | nodeIDs: 7065:12623 | ownerIDs: 7065:12623
  9/9update
  Th-Defaultの以下を修正済み
  文字スタイルを変更Label/Medium(14px 120%)→Body/Strong(16px 150%)
  テキスト位置のズレを解消するためにテキストに付与していたpadding-top:4pxを削除
  */
}
.c-table > :is(thead, tbody, tfoot) > tr > th,
.c-table > dt,
.c-table .c-table__th {
  font-weight: var(--font-weight-bold);
  color: var(--semantic-text-secondary);
}
.c-table > :is(thead, tbody, tfoot) > tr > :first-child,
.c-table > dt {
  padding-inline-start: var(--space-0);
}
.c-table > :is(thead, tbody, tfoot) > tr > :last-child,
.c-table > dd {
  padding-inline-end: var(--space-0);
}
.c-table > :is(tbody, tfoot) > tr > th[scope=row]:first-child {
  inline-size: var(--table-heading-width);
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td):not([data-property=slot]) {
  height: var(--space-56);
}
.c-table a:not(.c-button, .c-textlink-button, .c-media-link) {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-table a:not(.c-button, .c-textlink-button, .c-media-link)::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-table a:not(.c-button, .c-textlink-button, .c-media-link):is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-table a:not(.c-button, .c-textlink-button, .c-media-link):is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-table a:not(.c-button, .c-textlink-button, .c-media-link):is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-table a:not(.c-button, .c-textlink-button, .c-media-link):is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}

dl.c-table {
  display: grid;
  grid-template-columns: var(--table-heading-width) minmax(var(--space-0), 1fr);
}

/* Figma master annotations | M-IDs: M-030, M-032 | nodeIDs: 7065:11539, 7065:12623 | ownerIDs: 7065:11539, 7065:12623
9/15update
Th-Slot, Td-Slotの以下を修正済み
Slotのレイアウトをverticalに変更
Gapを8pxに変更
*/
.c-table__content {
  display: grid;
  align-content: start;
  gap: var(--space-8);
}
.c-table__content > * {
  margin: var(--space-0);
}

.c-table__line {
  display: block;
}

.c-table--grouped,
.c-table__group,
.c-table__rows {
  display: grid;
  gap: var(--space-0);
}

.c-table__rows {
  padding: var(--space-0);
  margin: var(--space-0);
  list-style: none;
}

.c-table__row {
  display: grid;
  grid-template-columns: minmax(var(--space-0), 1fr) var(--table-trailing-width);
}

.c-table :where(.c-table__group) > .c-table__th {
  padding-inline: var(--space-0);
}

.c-table :where(.c-table__row) > .c-table__td:first-child {
  padding-inline-start: var(--space-0);
}

.c-table :where(.c-table__row) > .c-table__td:last-child {
  padding-inline-end: var(--space-0);
}

@media (min-width: 768px) {
  .c-table {
    --table-heading-width: calc(var(--space-100) + var(--space-8));
    --table-trailing-width: var(--layout-desktop-column-width);
  }
  .c-table[data-trailing-width="175"] {
    --table-trailing-width: calc(var(--space-128) + var(--space-48) - var(--space-1));
  }
  .c-table[data-heading-width=wide] {
    --table-heading-width: calc(var(--space-100) * 2 + var(--space-16));
  }
  .c-table[data-heading-width=medium], .c-table[data-heading-width=compact] {
    --table-heading-width: calc(var(--space-100) + var(--space-8));
  }
  .c-table__group {
    grid-template-columns: var(--table-heading-width) minmax(var(--space-0), 1fr);
  }
  .c-table :where(.c-table__group) > .c-table__th {
    padding-inline-end: var(--space-8);
  }
  .c-table :where(.c-table__row) > .c-table__td:first-child {
    padding-inline-start: var(--space-8);
  }
}
.c-table[data-heading-width] > thead > tr > th:first-child {
  inline-size: var(--table-heading-width);
}

.c-table__emphasis {
  color: var(--semantic-text-link);
}

@media (min-width: 768px) {
  .c-table[data-row-layout=aligned] > tbody > tr:last-child > :is(th, td) {
    height: calc(var(--space-80) + var(--space-1));
  }
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td)[data-align=single],
.c-table > :is(dt, dd)[data-align=single],
.c-table .c-table__th[data-align=single],
.c-table .c-table__td[data-align=single] {
  padding-inline: var(--space-0);
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td)[data-align=first],
.c-table > :is(dt, dd)[data-align=first],
.c-table .c-table__th[data-align=first],
.c-table .c-table__td[data-align=first] {
  padding-inline: var(--space-0) var(--space-8);
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td)[data-align=middle],
.c-table > :is(dt, dd)[data-align=middle],
.c-table .c-table__th[data-align=middle],
.c-table .c-table__td[data-align=middle] {
  padding-inline: var(--space-8);
}
.c-table > :is(thead, tbody, tfoot) > tr > :is(th, td)[data-align=end],
.c-table > :is(dt, dd)[data-align=end],
.c-table .c-table__th[data-align=end],
.c-table .c-table__td[data-align=end] {
  padding-inline: var(--space-8) var(--space-0);
}

.c-search-results {
  list-style: none;
}

.c-search-results__item {
  border-block-end: var(--space-1) solid var(--semantic-border-tertiary);
}

.c-search-result {
  display: flex;
  align-items: flex-start;
  gap: var(--space-12);
  padding-block: var(--space-16);
  color: var(--semantic-text-primary);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-search-result::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-search-result:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-search-result:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-search-result:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-search-result:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-search-result [data-result-title] {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
.c-search-result:is(:hover, :focus-visible, [data-state=hover], [data-state=focus]) [data-result-title] {
  color: var(--semantic-text-primary-hover);
}
.c-search-result:is(:active, [data-state=pressed]) [data-result-title] {
  color: var(--semantic-text-primary-pressed);
}
.c-search-result:is(:hover, :active, :focus-visible, [data-state=hover], [data-state=pressed], [data-state=focus]) .c-search-result__url {
  text-decoration-line: underline;
}

.c-search-result__image {
  flex: none;
  inline-size: calc(var(--space-100) + var(--space-8));
  block-size: auto;
  pointer-events: none;
}

.c-search-result__text {
  display: grid;
  gap: var(--space-12);
  flex: 1;
  min-inline-size: var(--space-0);
}

.c-search-result__heading {
  display: grid;
  gap: var(--space-4);
}

.c-search-result__title {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  --heading-margin-block-end: var(--space-0);
  overflow-wrap: anywhere;
}

.c-search-result__title mark {
  background: transparent;
  color: var(--semantic-text-link);
}

.c-search-result__pdf {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  margin-inline-start: var(--space-4);
  white-space: nowrap;
  color: var(--semantic-text-primary);
}
.c-search-result__pdf img {
  display: inline-block;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  vertical-align: middle;
  pointer-events: none;
}

.c-search-result[data-pdf=off] .c-search-result__pdf {
  display: none;
}

.c-search-result__url {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  color: var(--semantic-text-secondary);
  overflow-wrap: anywhere;
}

.c-search-result__excerpt {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  overflow-wrap: anywhere;
}

.c-search-result-header {
  color: var(--semantic-text-secondary);
}
.c-search-result-header b, .c-search-result-header strong {
  color: var(--semantic-text-primary);
}
.c-search-result-header {
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  min-block-size: calc(var(--space-24) + var(--space-12));
  padding-block-end: var(--space-12);
}
.c-search-result-header b {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
}
.c-search-result-header strong {
  margin-inline: var(--space-4);
  font-size: var(--font-size-16);
  font-weight: 700;
  line-height: var(--line-height-default);
}

@media (min-width: 768px) {
  .c-search-results__item:has(> .c-search-result:is(:focus-visible, [data-state=focus])) {
    border-block-end-color: transparent;
  }
  .c-search-result {
    gap: var(--space-40);
    padding-block: var(--space-24);
  }
  .c-search-result__image {
    inline-size: calc(var(--space-128) + var(--space-48));
  }
  .c-search-result__text {
    gap: var(--space-16);
  }
  .c-search-result__heading {
    gap: var(--space-8);
  }
  .c-search-result__title {
    font-size: var(--font-size-16);
  }
  .c-search-result__pdf {
    font-size: var(--font-size-14);
    margin-inline-start: var(--space-8);
  }
  .c-search-result__url {
    font-size: var(--font-size-14);
  }
  .c-search-result-header {
    font-size: var(--font-size-14);
    min-block-size: calc(var(--space-48) + var(--space-1));
    padding-block-end: var(--space-16);
  }
  .c-search-result-header b {
    font-size: var(--font-size-16);
  }
  .c-search-result-header strong {
    font-size: var(--font-size-18);
  }
}
.c-title-group {
  display: grid;
  gap: var(--component-title-subtitle-gap);
}

.c-title-subtitle {
  font-size: var(--font-size-14);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  margin: var(--space-0);
}

@media (min-width: 768px) {
  .c-title-subtitle {
    font-size: var(--font-size-16);
  }
}
.c-title[data-icon=faq-q] {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  align-items: start;
  gap: var(--space-8);
  padding-block-end: var(--space-12);
  margin-block-end: var(--space-24);
  box-shadow: inset var(--space-0) calc(var(--space-1) * -1) var(--space-0) var(--semantic-border-tertiary);
}
.c-title[data-icon=faq-q]::before {
  content: "";
  flex: 0 0 var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-faq-q.svg?v=accent-20261003") center/contain no-repeat;
}
@media (min-width: 768px) {
  .c-title[data-icon=faq-q] {
    font-size: var(--font-size-18);
    padding-block-end: var(--space-16);
  }
}

.c-title[data-icon=opening-hours] {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  margin-block: var(--space-0);
  padding-block-end: var(--component-title-title-gap);
}
.c-title[data-icon=opening-hours]::before {
  content: "";
  flex: none;
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-opening-hours.svg") center/contain no-repeat;
}
@media (min-width: 768px) {
  .c-title[data-icon=opening-hours] {
    font-size: var(--font-size-18);
  }
  .c-title[data-icon=opening-hours]::before {
    inline-size: var(--space-32);
    block-size: var(--space-32);
  }
}

.c-body-copy {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
}

.c-body-copy > strong {
  font-weight: var(--font-weight-bold);
}

.c-body-copy__caption {
  font-size: var(--font-size-14);
  letter-spacing: var(--letter-spacing-default);
  color: var(--semantic-text-secondary);
}

.c-body-copy[data-icon=faq-a] {
  display: grid;
  gap: var(--space-8);
}
.c-body-copy[data-icon=faq-a]::before {
  content: "";
  inline-size: var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-faq-a.svg?v=accent-20261003") center/contain no-repeat;
}

.c-faq-list {
  margin: var(--space-0);
  padding: var(--space-0);
  list-style: none;
}

.c-faq-list__link {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-default);
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.c-faq-list__link::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  .c-faq-list__link:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
.c-faq-list__link:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
.c-faq-list__link:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  .c-faq-list__link:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .c-faq-list__link {
    transition: color var(--motion-duration) var(--motion-easing);
  }
}
@media (hover: hover) {
  .c-faq-list__link:not(:disabled, [aria-disabled=true], [data-state=disabled]):hover {
    color: var(--semantic-text-accent);
  }
}
.c-faq-list__link:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:focus-visible, [data-state=hover], [data-state=focus]) {
  color: var(--semantic-text-accent);
}
.c-faq-list__link:not(:disabled, [aria-disabled=true], [data-state=disabled]):is(:active, [data-state=pressed]) {
  color: var(--semantic-text-primary-pressed);
}
.c-faq-list__link {
  display: flex;
  align-items: start;
  gap: var(--space-8);
  padding-block: var(--space-12);
  color: var(--semantic-text-primary);
}
.c-faq-list__link::before {
  content: "";
  flex: 0 0 var(--space-24);
  block-size: var(--space-24);
  background: url("../images/common/icon-faq-q.svg?v=accent-20261003") center/contain no-repeat;
}
@media (max-width: 767px) {
  .c-faq-list__link:is(:hover, :active, :focus-visible, [data-state=hover], [data-state=pressed], [data-state=focus]) {
    text-decoration: underline;
  }
}

.c-section {
  display: grid;
  gap: var(--component-heading-3-margin-block-end);
  padding: var(--space-24) var(--space-24) var(--space-32);
  background-color: var(--semantic-background-section);
}
.c-section > .c-heading {
  --heading-margin-block-end: var(--space-0);
}
@media (min-width: 768px) {
  .c-section {
    padding: var(--space-32) var(--space-40) var(--space-48);
  }
}

[data-content-spacing=section] {
  margin-block-start: var(--layout-section-padding-heading-2);
}

.c-section[data-section-layout=full-width] {
  gap: var(--layout-section-padding-inner-large);
  padding-block: var(--space-64);
  padding-inline: var(--space-24);
}
.c-section[data-section-layout=full-width] > .c-heading {
  margin-block-end: var(--space-0);
}
@media (min-width: 768px) {
  .c-section[data-section-layout=full-width] {
    padding-block: var(--space-80);
  }
}

/* 汎用ユーティリティークラス */
/* SP幅だけで改行し、タブレット・PC幅では改行しない */
br.mobile-break {
  display: none;
}
@media (max-width: 767px) {
  br.mobile-break {
    display: inline;
  }
}

/* タブレット・PC幅だけで改行し、SP幅では改行しない */
br.desktop-break {
  display: inline;
}
@media (max-width: 767px) {
  br.desktop-break {
    display: none;
  }
}

.u-visually-hidden {
  position: absolute;
  overflow: hidden;
  clip-path: inset(var(--ratio-half));
  inline-size: var(--space-1);
  block-size: var(--space-1);
  margin: calc(var(--space-1) * -1);
  white-space: nowrap;
}

a:is([data-phone-href], [href^="tel:"]) {
  color: var(--semantic-text-secondary);
}
a:is([data-phone-href], [href^="tel:"]):is(:hover, :focus, :focus-visible, :active, :visited, [data-state]) {
  color: var(--semantic-text-secondary);
}
@media (min-width: 768px) {
  a:is([data-phone-href], [href^="tel:"]), a:is([data-phone-href], [href^="tel:"]):is(:hover, :focus, :focus-visible, :active, :visited, [data-state]) {
    color: var(--semantic-text-secondary);
  }
}
@media (max-width: 767px) {
  a:is([data-phone-href], [href^="tel:"])[href^="tel:"] {
    color: var(--semantic-text-link);
    text-decoration: underline;
  }
}

a[data-phone-href] {
  text-decoration: none;
  font-weight: var(--font-weight-regular);
  white-space: nowrap;
  cursor: auto;
}
a[data-phone-href][href] {
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
a[data-phone-href][href]::after {
  position: absolute;
  content: "";
  inset: var(--space-0);
  border: var(--space-0) solid transparent;
  border-radius: var(--layout-focus-radius);
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  a[data-phone-href][href]:is(:active, [data-state=pressed])::after {
    background: var(--semantic-tap-highlight);
  }
}
a[data-phone-href][href]:is(:focus-visible, [data-state=focus]) {
  outline: none;
}
a[data-phone-href][href]:is(:focus-visible, [data-state=focus])::after {
  inset: calc(var(--layout-focus-outer-size) * -1);
  border: var(--layout-focus-width) solid var(--semantic-border-focus);
  background: transparent;
}
@media (forced-colors: active) {
  a[data-phone-href][href]:is(:focus-visible, [data-state=focus])::after {
    border-color: Highlight;
  }
}
a[data-phone-href][href] {
  cursor: pointer;
}

/* 共通UIの透明度をモーショントークンで補間し終了後の非表示または削除をcommon.jsで実行する */
[data-component-exit] {
  opacity: 0;
  pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  [data-component-exit] {
    transition: opacity var(--motion-icon-duration) var(--motion-icon-easing);
  }
}

/* PCのクリック時はタップ表示を無効にしてSPのタップ時だけ表示する */
:is(a, area, button, summary, label, input, select, textarea) {
  -webkit-tap-highlight-color: transparent;
}

@media (max-width: 767px) {
  :is(a, area, button, summary, label, input, select, textarea) {
    -webkit-tap-highlight-color: var(--semantic-tap-highlight);
  }
}
:is(button, .c-button, .c-button-outline, .c-textlink-button, .c-filter-trigger, .c-chip, .c-badge, .c-calendar, .c-calendar__month-label, .c-calendar__weekday, .c-calendar__day) {
  -webkit-user-select: none;
  user-select: none;
}