/** Shopify CDN: Minification failed

Line 620:0 Expected "}" to go with "{"

**/
/* ================================
   Right Drawer — full height & design kept
   対象を details.right-drawer に限定（他のUIへ波及しない）
   ================================ */

/* Dawnの summary::before オーバーレイは無効化（このドロワーだけ） */
header-drawer details.right-drawer > summary::before { display: none !important; }

/* ドロワー本体：右固定 / 画面高さいっぱい / 右からスライド */
header-drawer details.right-drawer .menu-drawer{
  position: fixed;
  top: 0; right: 0; bottom: 0; left: auto; /* 明示 */
  width: min(88vw, 420px);
  height: 100vh;                /* ← 高さを明示 */
  background: rgb(var(--color-background, 255 255 255));
  color: rgb(var(--color-foreground, 0 0 0));
  transform: translateX(100%);  /* 初期は画面外（右） */
  visibility: hidden;
  transition: transform .35s ease, visibility .35s ease;
  z-index: 2001;
  display: flex;                /* 内側を縦レイアウト */
  flex-direction: column;
  overflow: hidden;             /* 内側だけスクロールさせる */
}

/* open で表示（.js 依存なし） */
header-drawer details.right-drawer[open] .menu-drawer{
  transform: translateX(0);
  visibility: visible;
}

/* 内側レイアウト（上は固定、下はスクロール） */
header-drawer details.right-drawer .menu-drawer__inner-container{
  min-height: 100%;
  display: flex; flex-direction: column;
}
header-drawer details.right-drawer .menu-drawer__topbar{
  position: sticky; top: 0; z-index: 1;
  display: flex; align-items: center; justify-content: space-between; gap: 1.2rem;
  height: 64px;                 /* 見栄え用の固定高 */
  padding: 0 20px 0 40px;
  background: inherit;
}
header-drawer details.right-drawer .menu-drawer__topbar a{
  text-decoration: none;
  font-size: 1.6rem; font-weight: 600;
  color: rgb(var(--color-foreground, 0 0 0));
}

/* 55px の×ボタン（テキストは不要） */
header-drawer details.right-drawer .menu-close{
  position: relative;
  width: 55px; height: 55px;
  background: transparent; border: 0; cursor: pointer;
  color: rgb(var(--color-foreground, 0 0 0));
  font-size: 0; line-height: 0; /* 文字は隠す */
}
header-drawer details.right-drawer .menu-close::before,
header-drawer details.right-drawer .menu-close::after{
  content:""; position:absolute; left:50%; top:50%;
  width: 45px; height: 2px; background: currentColor;
  transform-origin: center;
  background: #00448E !important;
}
header-drawer details.right-drawer .menu-close::before{ transform: translate(-50%,-50%) rotate(45deg); }
header-drawer details.right-drawer .menu-close::after { transform: translate(-50%,-50%) rotate(-45deg); }

/* メニュー領域：中だけスクロール */
header-drawer details.right-drawer .menu-drawer__navigation-container{
  flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch;
}
header-drawer details.right-drawer .menu-drawer__navigation{ padding: 20px 0 32px; }

/* リストの見栄え（既存トークンを尊重） */
header-drawer details.right-drawer .menu-drawer__menu{ list-style:none; margin:0; padding:0; }
header-drawer details.right-drawer .menu-drawer__menu-item{
  position: relative;
  display:block;
  padding: 1.1rem 44px;
  font-size: 1.8rem;
  color: inherit; text-decoration: none;
}
header-drawer details.right-drawer .menu-drawer__menu-item:hover,
header-drawer details.right-drawer .menu-drawer__menu-item:focus{
  background: rgba(0,0,0,.04);
}

/* サブメニュー（Dawn準拠） */
header-drawer details.right-drawer .menu-drawer__submenu{
  position:absolute; inset:0; background: inherit;
  transform: translateX(100%); visibility: hidden;
  transition: transform .35s ease, visibility .35s ease;
}
header-drawer details.right-drawer details[open].menu-opening > .menu-drawer__submenu,
header-drawer details.right-drawer details[open] > .menu-drawer__submenu{
  transform: translateX(0); visibility: visible;
}

/* オーバーレイ（兄弟 .menu-overlay を使う） */
header-drawer .menu-overlay{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.65);
  z-index: 1 !important;             
  opacity: 0; visibility: hidden;
  transition: opacity .35s ease, visibility .35s ease;
}
header-drawer details.right-drawer[open] ~ .menu-overlay{
  opacity: 1; visibility: visible;
}

/* 開いている間は背面スクロール停止 */
html:has(#Details-menu-drawer-container.right-drawer[open]){ overflow: hidden; }

/* ヘッダーのハンバーガーに影響を出さない */
.header__icon--menu{ position: initial; }

/* デスクトップ幅の最適化 */
@media (min-width: 990px){
  header-drawer details.right-drawer .menu-drawer{
    width: min(40vw, 520px); max-width: 520px;
  }
}

/* 画面全体オーバーレイ（ヘッダー外にあるので transform の影響を受けない） */
.drawer-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 2000;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .35s ease, visibility .35s ease;
}
/* ドロワー open 中だけ表示 */
html.menu-open .drawer-overlay{
  opacity: 1; visibility: visible; pointer-events: auto;
}

/* ドロワー本体はオーバーレイより前面に */
header-drawer details.right-drawer .menu-drawer{
  position: fixed; top:0; right:0; bottom:0; left:auto;
  width: min(88vw, 420px); height: 100vh;
  background: rgb(var(--color-background));
  transform: translateX(100%); visibility: hidden;
  transition: transform .35s ease, visibility .35s ease;
  z-index: 2001;
}
header-drawer details.right-drawer[open] .menu-drawer{
  transform: translateX(0); visibility: visible;
}

/* Dawn の summary::before を無効化（このドロワーだけ） */
header-drawer details.right-drawer > summary::before { display: none !important; }

/* デフォは非表示 */
html::before{
  content:"";
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:100;      /* 最前面に */
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .35s ease, visibility .35s ease;
}

/* メニューopen中だけ有効化（ヘッダーのサイズは完全無視） */
html.menu-open::before{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* open中、ヘッダーが transform を付けてても問題が出ないように保険 */
html.menu-open .section-header,
html.menu-open .shopify-section-header-sticky,
html.menu-open .shopify-section-header-sticky.animate{
  transform:none !important;
}

/***** Right Drawer をアコーディオン化 *****/

/* 1) サマリー行のレイアウト（左右にテキストと矢印） */
header-drawer details.right-drawer summary.menu-drawer__menu-item{
  display:flex; align-items:center; gap:.8rem;
}
header-drawer details.right-drawer summary.menu-drawer__menu-item .svg-wrapper{
  /* 2つ出ているアイコンのうち、右端の1つだけ使う */
  margin-left:auto;
}
header-drawer details.right-drawer summary.menu-drawer__menu-item .svg-wrapper:nth-of-type(1){
  display:none; /* ← icon-arrow を隠す */
}

/* open 時は矢印を回転 */
header-drawer details.right-drawer[open] > summary .svg-wrapper:nth-of-type(2),
header-drawer details.right-drawer details[open] > summary .svg-wrapper:nth-of-type(2){
  transform: rotate(180deg);
  transition: transform .25s ease;
}

/* 2) サブメニューは“縦に開く”。絶対配置＆横スライドは無効化 */
header-drawer details.right-drawer .menu-drawer__submenu{
  position: static !important;   /* ← absolute をやめる */
  inset: auto !important;
  background: inherit;
  transform: none !important;
  visibility: visible !important;
  overflow: hidden;
  max-height: 0;                  /* アコーディオンの閉状態 */
  transition: max-height .3s ease;
  padding: 0;                     /* 開いた時だけ内側余白を付ける */
  border: 0;
}

/* 開いたら高さを出す（中身に合わせて十分大きく） */
header-drawer details.right-drawer details[open] > .menu-drawer__submenu{
  max-height: 80vh;               /* 必要に応じて調整 */
  padding-top: .25rem;
}

/* 3) ネストの中身は通常フローで並ぶので幅崩れしない */
header-drawer details.right-drawer .menu-drawer__inner-submenu{
  height: auto; overflow: visible;
}

/* 4) サブ項目の見た目（任意） */
header-drawer details.right-drawer .menu-drawer__submenu .menu-drawer__menu{
  padding: .25rem 0 0;
}
header-drawer details.right-drawer .menu-drawer__submenu .menu-drawer__menu-item{
  padding-left: 3.2rem; /* 親より少しインデント */
}

/* 5) Dawnの“サブを右にスライドさせる”クラスを殺す */
header-drawer details.right-drawer .menu-drawer__navigation .submenu-open{
  visibility: visible !important;
}

/* ========== Right Drawer / Accordion（重複なしの決定版） ========== */

/* 1) 戻るボタンは不要 */
header-drawer details.right-drawer .menu-drawer__close-button{
  display: none !important;
}

/* 2) summary 行：左の「→」は消す。caret だけ使う */
header-drawer details.right-drawer summary.menu-drawer__menu-item{
  position: relative;
  display: flex; align-items: center; width: 100%;
  padding-right: 3.5rem; /* 右アイコン用スペース */
}
header-drawer details.right-drawer summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(1){
  display: none !important; /* icon-arrow.svg を隠す */
}
header-drawer details.right-drawer summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2){
  position: absolute; right: 1.6rem; top: 50%; transform: translateY(-50%);
  transition: transform .2s cubic-bezier(.2,.9,.2,1);
}
header-drawer details.right-drawer details[open] > summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2){
  transform: translateY(-50%) rotate(180deg);
}

/* 3) サブメニュー：横スライドを殺して縦アコーディオンに */
:root{ --acc-max: 80vh; } /* 必要なら上限を調整 */

header-drawer details.right-drawer .menu-drawer__submenu{
  /* 横スライド系の打ち消し */
  position: static !important; inset: auto !important;
  background: transparent; transform: none !important; visibility: visible !important;
  padding: 0; margin: 0;

  /* アコーディオン（外側）：高さで押し広げる */
  max-height: 0; overflow: hidden;
  transition: max-height .26s cubic-bezier(.2,.9,.2,1);
  will-change: max-height;
}

/* アコーディオン（内側）：効いてる感のスケール＆フェード */
header-drawer details.right-drawer .menu-drawer__inner-submenu{
  transform-origin: top;
  transform: scaleY(.94);
  opacity: 0;
  transition:
    transform .22s cubic-bezier(.2,.9,.2,1),
    opacity   .18s linear;
  will-change: transform, opacity;
}

/* open 時 */
header-drawer details.right-drawer details[open] > .menu-drawer__submenu{
  max-height: var(--acc-max);
}
header-drawer details.right-drawer details[open] > .menu-drawer__submenu > .menu-drawer__inner-submenu{
  transform: scaleY(1);
  opacity: 1;
}

/* 4) サブメニュー内リンクの見た目 */
header-drawer details.right-drawer .menu-drawer__submenu a{
  display: block; text-decoration: none; padding: 1.1rem 44px;
}
header-drawer details.right-drawer .menu-drawer__submenu a:hover{
  background: rgba(0,0,0,.04);
}

/* 省エネ設定 */
@media (prefers-reduced-motion: reduce){
  header-drawer details.right-drawer .menu-drawer__submenu,
  header-drawer details.right-drawer .menu-drawer__inner-submenu{
    transition: none !important;
  }
}

/* 外側（max-height） */
header-drawer details.right-drawer .menu-drawer__submenu{
  transition: max-height .45s cubic-bezier(.25,1,.25,1); /* ← 少し長く */
}

/* 内側（scale + fade） */
header-drawer details.right-drawer .menu-drawer__inner-submenu{
  transition:
    transform .42s cubic-bezier(.25,1,.25,1),
    opacity   .35s ease;
}

/* caret 回転も合わせてゆるく */
header-drawer details.right-drawer summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2){
  transition: transform .35s cubic-bezier(.25,1,.25,1);
}








/* ▼ 右端の caret の初期配置（位置を中央基準に固定） */
header-drawer details.right-drawer summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2){
  position: absolute;
  right: 1.6rem;
  top: 60%;
  transform: translateY(-100%);          /* 中央基準 */
  transform-origin: 50% 50%;            /* 回転/反転の基準を中央に固定 */
  transition: transform .22s ease;
  
}

/* ▼ “開いた時” は上下だけ反転（回転ではなく縦反転） */
header-drawer details.right-drawer details[open] > summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2){
  transform: translateY(-50%) scaleY(-1);   /* 位置そのまま、上下だけ反転 */
}

/* 念のため SVG 自体の基準も中央に */
header-drawer details.right-drawer summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2) svg{
  display:block;
  width: 14px; height: 14px;              /* 好みで */
  transform-origin: 50% 50%;
  vertical-align: middle;
}



/* 親メニューの文字 （例：Product） */
header-drawer details.right-drawer summary.menu-drawer__menu-item {
  font-size: 32px !important;
  font-family: "PosteramaText-Bold";

  letter-spacing: 0.01em;
}
/* 子メニュー（展開されたリスト内のリンク） */
header-drawer details.right-drawer .menu-drawer__submenu .menu-drawer__menu-item {
  font-size: 14px !important;
  font-weight: 500;
  padding: 1.1rem 80px; /* ← ここで左のインデント調整可 */
}

header-drawer
  .menu-drawer__navigation > .menu-drawer__menu > li > a.menu-drawer__menu-item {
  display: block;
  font-size: 32px !important;
 font-family: "PosteramaText-Bold";

  letter-spacing: 0.01em;
}

@media (max-width: 749px) {
  header-drawer details.right-drawer .menu-drawer {
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 0 !important; /* 角丸がある場合は消す */
  }
}

@media (max-width: 749px) {
  /* 旧ログインアイコンごと削除 */
  .menu-drawer__footer,
  .menu-drawer__footer *,
  .menu-drawer__account,
  .menu-drawer__account-icon {
    display: none !important;
  }
}

@media (max-width: 749px) {

  /* アコーディオントップ（Product のところ） */
  summary.menu-drawer__menu-item {
    font-size: 20px !important;
    font-weight: 600 !important;
    padding: 18px 20px !important;
  }

  /* アコーディオン内の子リンク */
  .menu-drawer__submenu .menu-drawer__menu-item,
  .menu-drawer__submenu a {
    font-size: 16px !important;
    font-weight: 400 !important;
    padding: 10px 32px !important;
  }

  /* その他の単独メニュー（Journal / Shop / About） */
  .menu-drawer__menu > .menu-drawer__menu-item:not(summary) {
    font-size: 20px !important;
    font-weight: 600 !important;
    padding: 18px 20px !important;
  }
}

@media (max-width: 749px) {

  /* × のクリック領域 */
  .menu-drawer__close-button,
  .menu-close {
    width: 25px !important;
    height: 25px !important;
    position: relative;
  }

  /* × の2本線（太さ・長さ・角度） */
  .menu-drawer__close-button::before,
  .menu-drawer__close-button::after,
  .menu-close::before,
  .menu-close::after {
    content: "" !important;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 25px;       /* ← ここで「線の長さ」を変える（今 = 28px）*/
    height: 2px;       /* ← ここで「線の太さ」を変える */
    background: currentColor;
    transform-origin: center;
  }

  /* 45° と -45° で綺麗な × */
  .menu-drawer__close-button::before,
  .menu-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }
  .menu-drawer__close-button::after,
  .menu-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
}

@media (max-width: 749px) {
  /* クリック領域 */
  header-drawer details.right-drawer .menu-close {
    position: absolute !important;
    top: 16px;
    right: 16px;
    width: 40px !important;   /* ← 全体のサイズ */
    height: 35px !important;
    padding: 0;
    margin: 0;
    background-color: #fff !important;
  }

  /* × の2本線を描く */
  header-drawer details.right-drawer .menu-close::before,
  header-drawer details.right-drawer .menu-close::after {
    content: "" !important;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 26px !important;   /* ← 線の長さ（ここ調整すればOK） */
    height: 2.4px !important; /* ← 線の太さ（ブランド感なら 2.4〜3px） */
    background: currentColor !important;
    transform-origin: center;
  }


}

/* === SP Drawer 内の文字・行間・アイコン整え === */
@media (max-width: 749px) {

  /* 親メニュー（PRODUCTS など） */
  .menu-drawer__menu-item,
  summary.menu-drawer__menu-item {
    font-size: 14px !important;
    font-weight: 600;
    padding: 12px 18px !important;
    display: flex;
    align-items: center;
    justify-content: space-between; /* ← コレで左右バランス取る */
  }

  /* サブメニュー項目（Tシャツ / ショーツ など） */
  .menu-drawer__submenu .menu-drawer__menu-item,
  .menu-drawer__submenu a {
    font-size: 13px !important;
    padding: 10px 26px !important;
    line-height: 1.35;
  }

  /* 矢印アイコン（caret）の中心回転 */
  summary.menu-drawer__menu-item .svg-wrapper:nth-of-type(2) {
    transition: transform .25s ease;
    transform-origin: center center !important; /* ← パタパタ回転防止 */
  }
  summary.menu-drawer__menu-item[aria-expanded="true"] .svg-wrapper:nth-of-type(2),
  details[open] > summary.menu-drawer__menu-item .svg-wrapper:nth-of-type(2) {
    transform: rotate(180deg);
  }

  /* 開閉アニメの滑らかさ改善（パッと出る対策） */
  .menu-drawer__submenu {
    transition: max-height .35s cubic-bezier(.25, .9, .25, 1), opacity .25s ease;
    opacity: 0;
  }
  details[open] > .menu-drawer__submenu {
    opacity: 1;
  }

  header-drawer details.right-drawer .menu-drawer__topbar{
  position: sticky; top: 0; z-index: 1;
  display: flex; align-items: center; justify-content: flex-start; gap: 1.2rem;
  height: 64px;                 /* 見栄え用の固定高 */
  padding: 0 20px 0 15px;
  background: inherit;


}



/* ===============================
 Drawerメニュー全体（青 #00448E 固定）
 =============================== */

header-drawer details.right-drawer,
header-drawer details.right-drawer * {
color: #00448E !important;
fill: #00448E !important;
stroke: #00448E !important;
}

/* リンク・サマリー共通：文字色を親色に追従 */
header-drawer details.right-drawer a,
header-drawer details.right-drawer summary {
color: currentColor !important;
}

/* 矢印アイコン（caret）も追従 */
header-drawer details.right-drawer summary svg,
header-drawer details.right-drawer summary svg * {
fill: currentColor !important;
stroke: currentColor !important;
}

/* hover・focus時も白に戻らず、軽い反応だけ */
header-drawer details.right-drawer .menu-drawer__menu-item:hover,
header-drawer details.right-drawer .menu-drawer__menu-item:focus {
opacity: 0.8;
}

/* ===============================
 SPハンバーガー（閉じて白／開いたら青）
 =============================== */
@media (max-width: 989px) {
/* 閉じてる時は白 */
summary.header__icon--menu[aria-expanded="false"] {
  color: #fff !important;
}

/* 開いたら青 */
summary.header__icon--menu[aria-expanded="true"] {
  color: #00448E !important;
}

/* SVG or 疑似要素も追従 */
summary.header__icon--menu svg,
summary.header__icon--menu svg * {
  fill: currentColor !important;
  stroke: currentColor !important;
}
.header__icon--menu::before,
.header__icon--menu::after {
  background: currentColor !important;
}
}

/* ===============================
 Productなどアコーディオンの矢印（青固定）
 =============================== */
header-drawer details.right-drawer summary.menu-drawer__menu-item > .svg-wrapper:nth-of-type(2) svg path {
stroke: #00448E !important;
fill: #00448E !important;
}