/* ============================================================
   場七 / Banana
   構造・設計原理は hagiso.com の解析仕様書に基づく。
   幾何ルールのみ独自：「7」基準（7 / 21 / 49px）の対角2隅。
   （名前の「七」、7月7日始動、住所 57-1 に由来）
   ============================================================ */

/* ---------- reset (destyle 相当の最小版) ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body,div,span,h1,h2,h3,h4,h5,p,a,img,ul,ol,li,dl,dt,dd,
figure,figcaption,section,article,nav,header,footer,main,blockquote{
  margin:0; padding:0; border:0; font:inherit; vertical-align:baseline;
}
ul,ol{list-style:none}
button{background:none; border:0; padding:0; font:inherit; color:inherit; cursor:pointer}
a{text-decoration:none; color:inherit}
img,svg,iframe{display:block; max-width:100%}
blockquote{quotes:none}

:root{
  /* --- neutral --- */
  --ink:#121212;
  --charcoal:#434145;
  --gray-696:#969696;
  --gray-c1c:#c1c1c1;
  --gray-dcd:#dcdcdc;
  --gray-eae:#eaeaea;
  --off-white:#f9f9f9;
  --white:#ffffff;

  /* --- accent : 操作できるものだけに使う --- */
  --banana:#f0a500;
  --banana-ink:#171204;      /* 黄の上にのせる文字 */

  /* --- 幾何ルール「7」--- */
  --r-sm:7px;
  --r-md:21px;               /* 7 × 3 */
  --r-lg:49px;               /* 7 × 7 */

  --sans:"Zen Kaku Gothic New", -apple-system, "Hiragino Sans", "Yu Gothic", sans-serif;
  --label:"Space Grotesk", "Zen Kaku Gothic New", sans-serif;
  --ease:cubic-bezier(0.22, 1, 0.36, 1);

  --sidebar:clamp(190px, 12.5%, 240px);
  color-scheme: light;
}

html{
  scroll-behavior:smooth; scroll-padding-top:28px;
  overflow-x:hidden; -webkit-text-size-adjust:100%;
}
body{
  background:var(--white); color:var(--ink);
  font-family:var(--sans); font-size:0.9375rem; line-height:1.867;
  letter-spacing:.025em;
  font-feature-settings:"palt" 1;
  overflow-x:hidden;
}
/* 初期チラつき防止：window load で .preload を外す */
body.preload *{transition:none !important; animation:none !important}

h1,h2,h3,h4,h5{line-height:1}
strong{font-weight:700}
.muted{color:var(--gray-696); font-size:.86em}

.skip{position:absolute; left:-9999px}
.skip:focus{left:12px; top:12px; z-index:9999; background:var(--ink); color:#fff; padding:10px 16px}

/* placeholder（写真が入るまでの仮表示） */
.ph{
  font-family:var(--label); font-size:0.6875rem; letter-spacing:.06em;
  color:var(--gray-696); text-align:center; line-height:1.5;
}

/* ============================================================
   LOADING（初回のみ）
   ============================================================ */
.loading{
  position:fixed; inset:0; z-index:99;
  display:flex; align-items:center; justify-content:center;
  background:var(--charcoal);
}
.loading.is-hidden{display:none}
.loading-logo{width:150px; height:auto}
.loading-logo .lp{fill:none; stroke:#fff; stroke-width:.7px}


/* カーテン：3枚を「重ねて」置く。横に並べると、右端のパネルが動いた
   瞬間に右側だけ先にサイトが露出してしまうため（実際に起きた不具合）。 */
.body-bg{position:fixed; inset:0; z-index:98; pointer-events:none}
.body-bg span{position:absolute; inset:0; display:block; will-change:transform}
.body-bg span:nth-child(1){background:rgba(0,0,0,.9)}
.body-bg span:nth-child(2){background:var(--ink)}
.body-bg span:nth-child(3){background:var(--charcoal)}  /* 最前面＝ローディングと同色 */
.body-bg.is-done{display:none}

.card_thumbnail.has-img .ph{display:none}

/* ============================================================
   HEADER
   ============================================================ */
.header{position:fixed; z-index:10}
.header-logo{display:flex; align-items:center; gap:10px}
.logo-mark{width:76px; height:auto; overflow:visible}
.logo-mark .lp{fill:none; stroke:currentColor; stroke-width:1.1px}
.header-logo_en{
  font-family:var(--label); font-size:0.625rem; letter-spacing:.28em;
  font-weight:700; opacity:.8;
}

.menu-item{display:block}
.menu-item span{
  font-family:var(--label); font-size:0.875rem; font-weight:700; letter-spacing:.04em;
  display:block;
}
.menu-item i{
  font-style:normal; font-size:0.625rem; letter-spacing:.08em;
  opacity:.5; display:block; margin-top:1px;
}
.menu-item.is-current{color:var(--banana)}

.header-util_ig{display:flex; align-items:center; gap:8px}
.header-util_ig svg{
  width:18px; height:18px; fill:none; stroke:currentColor;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.header-util_ig span{font-family:var(--label); font-size:0.6875rem; letter-spacing:.1em; font-weight:700}
.header-copy{
  font-family:var(--label); font-size:0.625rem; font-weight:700;
  color:var(--gray-696); margin-top:20px;
}

.header-button{display:none}

/* ============================================================
   MAIN / WRAPPER
   ============================================================ */
.main{position:relative}
.wrapper{width:100%; padding:0 7.6%}

/* ---------- HERO ---------- */
.hero{position:relative}
.hero-thumbnail{
  position:relative; overflow:hidden;
  border-radius:0 0 var(--r-lg) 0;
}
.hero-thumbnail_bg{position:absolute; inset:0; background:var(--off-white); z-index:-1}
.hero-thumbnail_img{
  position:relative; width:100%; aspect-ratio:4/3;
  background:#2f2c27 center/cover no-repeat;
  display:flex; align-items:center; justify-content:center;
}
.hero-thumbnail_img .ph{color:rgba(255,255,255,.4)}
.hero-thumbnail_img.has-img .ph{display:none}
.hero-thumbnail::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  box-shadow:0 0 0 1px var(--gray-dcd) inset; mix-blend-mode:darken;
  border-radius:inherit;
}

.hero-scroll{display:none}

/* ---------- TITLE ---------- */
.titleblock{padding:56px 0 0}
.titleblock_catch{
  font-size:0.75rem; font-weight:700; color:var(--gray-696);
  letter-spacing:.08em; margin-bottom:14px;
}
.titleblock_title{
  font-size:3.5rem; font-weight:900; letter-spacing:.02em; line-height:1;
}
.titleblock_sub{
  font-family:var(--label); font-size:0.75rem; letter-spacing:.06em;
  color:var(--ink); margin-top:14px; font-weight:500;
}

/* ---------- タグピル（NEWSへのリンク：操作できる＝黄） ---------- */
.tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:24px}
.tags a{
  display:inline-block; position:relative; z-index:1; overflow:hidden;
  padding:6px 14px; border-radius:var(--r-md);
  border:2px solid var(--banana); background:var(--banana); color:var(--banana-ink);
  font-size:0.625rem; font-weight:700; letter-spacing:.06em;
  transition:color .1s var(--ease);
}
.tags a::after{
  content:""; position:absolute; z-index:-1;
  top:-100%; right:-3rem; bottom:-100%; left:-3rem;
  background:var(--ink); border-radius:100%;
  transform:scaleX(0); transform-origin:right;
  transition:1.2s transform var(--ease);
}

/* ============================================================
   SECTION 共通
   ============================================================ */
.sec{position:relative; margin-top:80px; padding-top:80px}
.sec::before{
  content:""; position:absolute; top:0; left:0;
  width:100%; height:2px; background:var(--gray-c1c);
}
.heading{
  font-family:var(--label); font-size:2rem; font-weight:700; letter-spacing:.04em;
}
.jaHeading{font-size:0.9375rem; font-weight:700; margin-top:8px}

/* ---------- INFORMATION ---------- */
.store_info{
  background:var(--off-white); border-radius:var(--r-md) 0 var(--r-md) 0;
  padding:40px 30px; margin-top:32px;
}
.store_info > div + div{margin-top:20px}
.store_term{font-size:0.75rem; color:var(--gray-696)}
.store_desc{font-size:0.9375rem; font-weight:700; line-height:1.6; margin-top:5px}
.store_desc a{color:var(--banana); font-weight:700; text-decoration:underline; text-underline-offset:3px}

/* ---------- ABOUT ---------- */
.about-body{margin-top:32px}
.about-lede{font-size:1.125rem; font-weight:700; line-height:1.7; margin-bottom:1.6em}
.about-body p + p{margin-top:1.6em}
.about-body a{color:var(--banana); font-weight:700; text-decoration:underline; text-underline-offset:3px}

.quote{
  margin-top:48px; padding:28px 24px;
  border:2px solid var(--gray-c1c); border-radius:var(--r-md) 0 var(--r-md) 0;
}
.quote blockquote p{font-size:1rem; font-weight:700; line-height:1.8}
.quote blockquote p::before{content:"「"}
.quote blockquote p::after{content:"」"}
.quote figcaption{font-size:0.75rem; color:var(--gray-696); line-height:1.8; margin-top:12px}

/* ---------- NEWS ---------- */
.news-filter{display:flex; flex-wrap:wrap; gap:8px; margin-top:32px}
.filter-pill{
  position:relative; z-index:1; overflow:hidden;
  padding:6px 14px; border-radius:var(--r-md);
  border:2px solid var(--gray-c1c); background:transparent; color:var(--gray-696);
  font-size:0.625rem; font-weight:700; letter-spacing:.06em;
  transition:color .1s var(--ease), border-color .1s var(--ease), background-color .1s var(--ease);
}
.filter-pill.is-active{
  border-color:var(--banana); background:var(--banana); color:var(--banana-ink);
}

.cards_list{display:flex; flex-direction:column; gap:20px; margin-top:28px}
.card a{
  display:block; padding:20px;
  border:1px solid var(--gray-eae); border-radius:var(--r-md);
  box-shadow:0 3px 6px rgba(18,18,18,.2);
  transition:box-shadow .5s var(--ease);
}
.card_thumbnail{
  position:relative; aspect-ratio:1/1; overflow:hidden;
  border-radius:var(--r-md) 0 var(--r-md) 0;
  background:var(--off-white) center/cover no-repeat;
  display:flex; align-items:center; justify-content:center;
  transition:border-radius .5s var(--ease);
}
.card_thumbnail::before{
  content:""; position:absolute; inset:0;
  box-shadow:0 0 0 1px var(--gray-dcd) inset; mix-blend-mode:darken;
  border-radius:inherit;
}
.card_thumbnail .ph{
  font-family:var(--label); font-size:1.5rem; font-weight:700;
  color:var(--gray-c1c); line-height:1.1; letter-spacing:.04em;
}
.card_date{
  font-family:var(--label); font-size:0.6875rem; font-weight:700;
  color:var(--gray-696); margin-top:15px; letter-spacing:.04em;
}
.card_category{
  font-size:0.75rem; font-weight:700; color:var(--banana); margin-top:6px;
}
.card_title{
  font-size:1.125rem; font-weight:700; line-height:1.444; margin-top:8px;
  transition:opacity .5s var(--ease);
}
.card_excerpt{font-size:0.8125rem; color:var(--gray-696); line-height:1.75; margin-top:10px}
.card.is-hidden{display:none}

.news-empty{font-size:0.875rem; color:var(--gray-696); margin-top:24px}
.news-note{font-size:0.8125rem; color:var(--gray-696); margin-top:32px}

/* ---------- ボタン（円形ワイプ） ---------- */
.button{margin-top:20px}
.button a{
  display:flex; align-items:center; justify-content:center;
  width:240px; max-width:100%; height:50px; border-radius:var(--r-md);
  background:var(--banana); border:2px solid var(--banana); color:var(--banana-ink);
  font-size:0.9375rem; font-weight:700;
  position:relative; z-index:1; overflow:hidden;
  transition:color .1s var(--ease);
}
.button a::after{
  content:""; position:absolute; z-index:-1;
  top:-100%; right:-3rem; bottom:-100%; left:-3rem;
  background:var(--white); border-radius:100%;
  transform:scaleX(0); transform-origin:right;
  transition:1.2s transform var(--ease);
}

/* ---------- 丸ボタン ---------- */
.moreButton{margin-top:28px}
.moreButton a{
  display:flex; align-items:center; justify-content:center;
  width:69px; height:69px; border-radius:50%;
  background:var(--banana); color:var(--banana-ink);
  font-family:var(--label); font-size:0.75rem; font-weight:700; letter-spacing:.06em;
  box-shadow:0 3px 3px rgba(18,18,18,.4);
  transition:box-shadow .3s var(--ease), transform .3s var(--ease);
}

/* ---------- CLUBS ---------- */
.clubs-intro{margin-top:28px; font-size:0.9375rem}
.club{margin-top:48px}
.club_media{
  position:relative; aspect-ratio:4/3; overflow:hidden;
  background:var(--off-white) center/cover no-repeat;
  border-radius:0 0 var(--r-lg) 0;
  display:flex; align-items:center; justify-content:center;
  transition:border-radius .5s var(--ease);
}
.club_media::before{
  content:""; position:absolute; inset:0;
  box-shadow:0 0 0 1px var(--gray-dcd) inset; mix-blend-mode:darken;
  border-radius:inherit;
}
.club_media.has-img .ph{display:none}
.club_text{margin-top:20px}
.club_no{
  font-family:var(--label); font-size:0.6875rem; font-weight:700;
  letter-spacing:.16em; color:var(--gray-696);
}
.club_name{font-size:1.5rem; font-weight:900; line-height:1.3; margin-top:6px}
.club_host{font-size:0.75rem; font-weight:700; color:var(--gray-696); margin-top:8px}
.club_text > p:not([class]){margin-top:16px; font-size:0.9375rem}
.club_links{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px}
.club_links a{
  font-family:var(--label); font-size:0.6875rem; font-weight:700;
  padding:6px 14px; border-radius:var(--r-md);
  border:2px solid var(--gray-c1c); color:var(--ink);
  position:relative; z-index:1; overflow:hidden;
  transition:color .1s var(--ease), border-color .1s var(--ease);
}
.club_links a::after{
  content:""; position:absolute; z-index:-1;
  top:-100%; right:-3rem; bottom:-100%; left:-3rem;
  background:var(--banana); border-radius:100%;
  transform:scaleX(0); transform-origin:right;
  transition:1.2s transform var(--ease);
}
.clubs-foot{
  margin-top:48px; padding-top:24px; border-top:1px solid var(--gray-c1c);
  font-size:0.8125rem; color:var(--gray-696);
}

/* ---------- PEOPLE（雛形用。HTMLはコメントアウト中） ---------- */
.people-list{display:flex; flex-wrap:wrap; gap:32px; margin-top:40px}
.people-person a{display:flex; align-items:center; gap:15px}
.people-person_thumbnail{
  width:70px; height:70px; flex:none; border-radius:50%; overflow:hidden;
  border:2px solid var(--gray-c1c);
}
.people-person_thumbnail.is-member{border-color:var(--banana)}
.people-person_thumbnail img{width:100%; height:100%; object-fit:cover; transform:scale(1.7)}
.people-person_name{font-size:0.9375rem; font-weight:700}
.people-person_romaji{font-family:var(--label); font-size:0.75rem; color:var(--ink)}
.people-person_title{font-size:0.625rem; color:var(--gray-696)}

/* ---------- ACCESS ---------- */
.access-grid{margin-top:32px}
.access-addr{font-size:1.125rem; font-weight:700; line-height:1.7}
.access-list{margin-top:24px; border-top:1px solid var(--gray-c1c)}
.access-list li{
  border-bottom:1px solid var(--gray-c1c); padding:13px 0;
  font-size:0.875rem; display:grid; grid-template-columns:1fr; gap:2px;
}
.access-list b{font-size:0.6875rem; letter-spacing:.1em; color:var(--gray-696); font-weight:700}
.access-note{font-size:0.8125rem; color:var(--gray-696); margin-top:20px}
.access-map{
  margin-top:28px; overflow:hidden; position:relative;
  border-radius:var(--r-md) 0 var(--r-md) 0; border:1px solid var(--gray-eae);
}
.access-map iframe{width:100%; height:300px; border:0}

/* ---------- CONTACT ---------- */
.contact-lead{margin-top:28px; font-size:0.9375rem}

/* ---------- FOOTER ---------- */
.footer{
  background:var(--charcoal); color:#fff;
  margin-top:100px; padding:50px 7.6% 130px; text-align:center;
}
.footer-logo{font-size:1.625rem; font-weight:900; letter-spacing:.04em}
.footer-logo span{
  font-family:var(--label); font-size:0.6875rem; letter-spacing:.2em;
  opacity:.6; font-weight:500; margin-left:.6em;
}
.footer-addr{font-size:0.75rem; opacity:.7; margin-top:12px; line-height:1.8}
.footer-copy{font-family:var(--label); font-size:0.625rem; font-weight:700; opacity:.45; margin-top:28px}

/* ============================================================
   SP（<1025px）
   ============================================================ */
@media screen and (max-width:1024px){
  .header{
    top:0; left:0; right:0; height:100px;
    display:flex; align-items:center; justify-content:space-between;
    padding:0 7.6%; color:#fff;
    background:linear-gradient(0deg, transparent 0%, rgba(18,18,18,.5) 100%);
  }
  .header-inner{display:contents}
  .menu{display:none}
  .header-util{display:none}

  .header-button{
    display:flex; flex-direction:column; align-items:center; gap:8px;
    position:relative; z-index:12; color:#fff;
  }
  .header.is-open .header-button{color:#fff}
  .header-button_bars{display:block; width:37px; height:8px; position:relative}
  .header-button_bars::before,
  .header-button_bars::after{
    content:""; position:absolute; left:0; width:37px; height:2px; background:currentColor;
    transition:transform .4s var(--ease), top .4s var(--ease);
  }
  .header-button_bars::before{top:0}
  .header-button_bars::after{top:8px}
  .header-button[aria-expanded="true"] .header-button_bars::before{top:4px; transform:rotate(45deg)}
  .header-button[aria-expanded="true"] .header-button_bars::after{top:4px; transform:rotate(-45deg)}
  .header-button_text{font-family:var(--label); font-size:0.625rem; font-weight:700; letter-spacing:.12em}

  .menu-mobile{
    position:fixed; inset:0; z-index:11;
    background:rgba(0,0,0,.9); color:#fff;
    padding:100px 7.6% 140px;
    display:flex; align-items:center;
    opacity:0; visibility:hidden;
    transition:opacity .8s var(--ease), visibility .8s var(--ease);
  }
  .menu-mobile.is-open{opacity:1; visibility:visible}
  .menu-mobile_inner{width:100%}
  .menu-mobile a{
    display:block; padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.15);
  }
  .menu-mobile a span{
    font-family:var(--label); font-size:1.125rem; font-weight:700; letter-spacing:.04em;
  }
  .menu-mobile a i{font-style:normal; font-size:0.6875rem; opacity:.55; margin-left:12px}

  .navigation-mobile{
    position:fixed; left:0; right:0; bottom:0; z-index:9;
    height:70px; display:flex;
    background:rgba(18,18,18,.75);
    -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
    border-radius:var(--r-lg) 0 0 0;
    padding-bottom:env(safe-area-inset-bottom);
  }
  .navigation-item{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    color:rgba(255,255,255,.6);
    transition:color .5s var(--ease);
  }
  .navigation-item svg{
    width:24px; height:24px; fill:none; stroke:currentColor;
    stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round;
  }
  .navigation-item span{font-family:var(--label); font-size:0.625rem; font-weight:700}
  .navigation-item.is-current{color:var(--banana)}

  .footer{padding-bottom:130px}
}

/* ============================================================
   PC（≥1025px）— 左サイドバー固定の2カラム
   ============================================================ */
@media screen and (min-width:1025px){
  html{scroll-padding-top:60px}
  body{letter-spacing:.05em}

  .header{
    top:0; left:0; width:var(--sidebar); height:100vh;
    background:var(--ink); color:#fff;
    padding:40px 0 40px 40px;
    transform:translateX(-100%);
  }
  .header.is-in{transform:none}
  .header-inner{
    height:100%; display:flex; flex-direction:column; justify-content:space-between;
    padding-right:24px;
  }
  .logo-mark{width:96px}
  .header-logo{flex-direction:column; align-items:flex-start; gap:10px}

  .menu{display:flex; flex-direction:column; gap:22px}
  .menu-item{transition:color .3s var(--ease)}

  .header-button{display:none}
  .menu-mobile{display:none}
  .navigation-mobile{display:none}

  .main{margin-left:var(--sidebar)}
  .wrapper{
    width:100%; max-width:1050px;
    padding:0 clamp(40px, 6.5%, 96px);
  }

  /* HERO：右下だけでなく対角2隅（PCルール） */
  .hero-thumbnail{border-radius:0 0 var(--r-lg) 0}
  .hero-thumbnail_img{aspect-ratio:16/9; max-height:78vh}

  .hero-scroll{
    display:block; position:absolute; left:clamp(24px, 3vw, 44px); bottom:40px; z-index:2;
  }
  .hero-scroll span{
    writing-mode:vertical-rl; font-family:var(--label);
    font-size:0.625rem; font-weight:700; color:var(--banana); letter-spacing:.12em;
  }
  .hero-scroll i{
    display:block; width:1px; height:80px; margin:10px auto 0;
    background:rgba(240,165,0,.2); position:relative; overflow:hidden;
  }
  .hero-scroll i::after{
    content:""; position:absolute; left:0; width:1px; height:100%;
    background:var(--banana); animation:workScrollDown 3.5s ease-in-out infinite;
  }

  .titleblock{padding-top:80px}
  .titleblock_title{font-size:6rem}
  .titleblock_catch{font-size:0.875rem}

  .sec{margin-top:120px; padding-top:120px}
  .sec::before{width:156px; left:50%; transform:translateX(-50%)}
  .heading{font-size:2.375rem}

  .store_info{padding:40px 40px; max-width:780px}
  .store_info > div{display:grid; grid-template-columns:150px 1fr; gap:0 24px; align-items:start}
  .store_term{padding-top:.3em}
  .store_desc{margin-top:0}

  .about-body{max-width:83.8095%}
  .about-lede{font-size:1.375rem}
  .quote{max-width:83.8095%; padding:32px 32px}
  .quote blockquote p{font-size:1.125rem}

  /* NEWS：3列グリッド */
  .cards_list{
    display:flex; flex-direction:row; flex-wrap:wrap;
    column-gap:2.8571%; row-gap:1.5625vw;
  }
  .card{width:31.4285%; max-width:330px}
  .card a{height:100%}
  .card_title{
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    overflow:hidden; height:50px;
  }
  .card_excerpt{
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }

  /* CLUBS：画像とテキストの2カラム（交互） */
  .club{
    display:flex; flex-direction:row-reverse; align-items:flex-start;
    column-gap:4.7619%; margin-top:80px;
  }
  .club_media{width:64.7619%; flex:none; border-radius:var(--r-lg) 0 var(--r-lg) 0}
  .club_text{width:30.4761%; margin-top:0}
  .club:nth-of-type(even){flex-direction:row}
  .club_name{font-size:1.875rem}

  .people-list{column-gap:5.7143%; row-gap:60px}
  .people-person{width:29.5238%; max-width:310px}
  .people-person_name{font-size:1.3125rem}
  .people-person_title{font-size:0.75rem}

  .access-grid{display:grid; grid-template-columns:1fr 1.15fr; gap:4.7619%; align-items:start}
  .access-map{margin-top:0}
  .access-map iframe{height:100%; min-height:360px}
  .access-list li{grid-template-columns:100px 1fr; gap:16px}
  .access-list b{padding-top:.3em}
  .access-addr{font-size:1.375rem}

  .footer{margin-left:var(--sidebar); padding:50px 7.6%}

  .main, .footer{transition:none}
}

@media screen and (min-width:1921px){
  .main, .footer{margin-left:auto; margin-right:auto; max-width:1500px}
}

/* ============================================================
   HOVER（タッチ端末を除外）
   ============================================================ */
@media (any-hover: hover){
  .tags a:hover{color:#fff}
  .tags a:hover::after{transform:scaleX(1); transform-origin:left}

  .filter-pill:hover{border-color:var(--banana); color:var(--ink)}

  .button a:hover{color:var(--banana)}
  .button a:hover::after{transform:scaleX(1); transform-origin:left}

  .moreButton a:hover{box-shadow:none; transform:translateY(5px)}

  .club_links a:hover{border-color:var(--banana); color:var(--banana-ink)}
  .club_links a:hover::after{transform:scaleX(1); transform-origin:left}

  /* 角丸が対角 → 全周に変わる「呼吸」 */
  .card a:hover{box-shadow:0 3px 14px rgba(18,18,18,.28)}
  .card a:hover .card_thumbnail{border-radius:var(--r-md)}
  .card a:hover .card_title{opacity:.7}

  .club:hover .club_media{border-radius:var(--r-lg)}

  .menu-item:hover{color:var(--banana)}
  .header-util_ig:hover{color:var(--banana)}
  .store_desc a:hover, .about-body a:hover{opacity:.7}
  .menu-mobile a:hover span{color:var(--banana)}
  .navigation-item:hover{color:#fff}
}

@keyframes workScrollDown{
  0%{transform:translateY(-100%)}
  50%{transform:translateY(0)}
  100%{transform:translateY(100%)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation:none !important}
}