@charset "utf-8";
/* ===========================================================================
   Rio Group サイト共通スタイル
   設計: PC 基準幅 1440px / SP 基準幅 414px / ブレークポイント 768px 1本
   色  : #080808 背景 / #efefef 文字 / #393939 罫線  の実質3色
   書体: Michroma（欧文・仮）+ Noto Sans JP
   =========================================================================== */

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,h4,p,ul,ol,li,figure,dl,dd{margin:0}
ul,ol{list-style:none;padding:0}
a{text-decoration:none;color:inherit}
img,svg,video{display:block;width:100%;vertical-align:top}
button{appearance:none;background:transparent;border:0;color:inherit;font:inherit;cursor:pointer}
::-webkit-scrollbar{display:none}

html{font-size:62.5%;height:100%}
body{
  background-color:#080808;color:#efefef;
  font-family:"Michroma","Noto Sans JP",sans-serif;
  font-weight:400;line-height:1.4;min-height:100vh;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  -ms-overflow-style:none;scrollbar-width:none;
  overflow-y:scroll;text-rendering:optimizeSpeed;
}
:focus-visible{outline:2px solid #efefef;outline-offset:4px}

/* 固定ヘッダーのぶんだけアンカーの着地点を下げる（scrollIntoView / ハッシュ遷移の両方に効く） */
[id]{scroll-margin-top:110px}
@media (max-width:768px){[id]{scroll-margin-top:76px}}

@keyframes flash-inv{
  0%{opacity:1}10%{opacity:0}20%{opacity:1}30%{opacity:0}40%{opacity:1}
  50%{opacity:0}60%{opacity:1}70%{opacity:0}80%{opacity:1}90%{opacity:0}100%{opacity:1}
}

/* ---------- header ---------- */
.l-header{
  align-items:center;display:flex;justify-content:space-between;
  left:0;top:0;position:fixed;width:100%;z-index:5;
  padding:3.4722222222vw 6.5277777778vw 0;
  opacity:0;transform:translateY(-100%);
  transition:opacity .6s,transform .6s;
}
/* ロゴを正しい色で出すため反転合成はやめ、代わりに上部へ薄いスクリムを敷く */
.l-header::before{
  background:linear-gradient(180deg,rgba(8,8,8,.75),rgba(8,8,8,.45) 55%,rgba(8,8,8,0));
  content:"";height:calc(100% + 48px);left:0;top:0;position:absolute;width:100%;
  pointer-events:none;z-index:-1;
}
.l-header.-shown{opacity:1;transform:translateY(0)}
/* 中央: ロゴ（左右の SNS / Menu と釣り合うよう中央寄せ） */
.l-header-logo{
  align-items:center;display:flex;flex-direction:column;gap:7px 0;
  width:15.2777777778vw;max-width:220px;min-width:150px;transition:opacity .3s;
}
.l-header-logo__item{display:block;width:100%}
.l-header-logo .-sp{display:none}
.l-header-logo__note{
  color:#efefef;font-family:"Noto Sans JP",sans-serif;font-size:1rem;
  letter-spacing:.24em;line-height:1;opacity:.65;white-space:nowrap;
}
.l-header-logo.-hidden{opacity:0;pointer-events:none}

/* 右: Menu */
.l-header-info{align-items:center;display:flex;flex:1 0 0;font-size:1.6rem;gap:0 18px;justify-content:flex-end;z-index:2}
/* 左: SNS */
.l-header-sns{align-items:center;display:flex;flex:1 0 0;gap:0 8px;z-index:2}
.l-header-sns__link{
  align-items:center;border:1px solid #efefef;border-radius:50%;color:#efefef;display:flex;
  height:34px;width:34px;justify-content:center;transition:background-color .3s,color .3s;
}
.l-header-sns__link svg{height:15px;width:15px}
.l-header-sns__link:hover{background-color:#efefef;color:#080808}
.l-header-menu__button{
  border:1px solid #efefef;background-color:#efefef;color:#080808;border-radius:32px;
  font-size:1.4rem;letter-spacing:.08em;line-height:1;padding:14px 30px 12px;
  text-transform:uppercase;transition:opacity .3s;
}
.l-header-menu__button .-close{display:none}
.l-header-menu__button.-opened .-menu{display:none}
.l-header-menu__button.-opened .-close{display:inline}
.l-header-menu__button.-hidden{opacity:0;pointer-events:none}

/* ---------- global nav (modal) ---------- */
.l-navigation{
  background-color:rgba(8,8,8,.94);height:var(--vh,100vh);left:0;top:0;position:fixed;width:100%;z-index:4;
  opacity:0;pointer-events:none;transition:opacity .4s;
  display:flex;align-items:center;
}
.l-navigation.-opened{opacity:1;pointer-events:auto}
.l-navigation__inner{
  align-items:center;display:flex;justify-content:space-between;gap:0 6vw;
  margin:0 auto;padding:0 6.5277777778vw;width:100%;
}
.l-navigation__wrap{display:flex;flex-direction:column;gap:14px 0}
.l-navigation__item.-main{font-size:4.4rem;line-height:1;text-transform:uppercase}
.l-navigation__item.-sub{font-size:1.6rem;line-height:1;text-transform:uppercase}
.l-navigation__item.-sub:first-of-type{margin-top:26px}
.l-navigation__link{transition:color .3s}
.l-navigation__link.-disabled{color:#393939}
.l-navigation-lang{display:flex;font-size:1.4rem;gap:0 10px;margin-top:44px;letter-spacing:.06em}
.l-navigation-lang__link{opacity:.4}
.l-navigation-lang__link.-active{opacity:1}
.l-navigation__image{border-radius:10px;overflow:hidden;height:33vw;width:33vw;flex:none}
.l-navigation__image img{height:100%;object-fit:cover}

/* ---------- cursor ---------- */
.c-cursor{
  background-color:#efefef;border-radius:50%;height:15px;width:15px;
  left:0;top:0;position:fixed;z-index:7;pointer-events:none;opacity:0;
  mix-blend-mode:difference;
  transition:width .5s cubic-bezier(.5,.1,0,1),height .5s cubic-bezier(.5,.1,0,1),opacity .3s .4s;
}
.c-cursor.-visibled{opacity:1}
.c-cursor.-active{height:55px;width:55px}

/* ---------- loading ---------- */
.c-loading{height:var(--vh,100vh);left:0;top:0;position:fixed;width:100%;z-index:8}
.c-loading__background{background-color:#080808;height:100%;left:0;top:0;position:absolute;width:100%}
.c-loading__heading{
  /* 横長ロゴ（logo_01.png / 800x200）に合わせた幅 */
  left:50%;top:50%;position:absolute;transform:translate(-50%,-50%);
  width:min(26vw,380px);min-width:240px;
}
.c-loading__heading img{display:block;height:auto;width:100%}
.c-loading__heading .__inner{display:block;opacity:0;transform:translateY(50%);
  transition:opacity .3s,transform .3s}
.c-loading__heading .__inner.-in{opacity:1;transform:translateY(0)}
.c-loading__heading .__inner.-out{opacity:0;transform:translateY(-20%)}
.c-loading.-fade .c-loading__background{opacity:0;transition:opacity .6s}
.c-loading.-done{display:none}

/* ---------- 背景の発光オブジェクト ---------- */
.p-index-background{
  height:var(--vh,100vh);left:0;top:0;position:fixed;width:100%;
  mix-blend-mode:screen;overflow:hidden;pointer-events:none;
}
.c-object{
  opacity:0;position:absolute;
  transition:opacity .6s ease-out,left .6s ease-out,width .6s ease-out;
}
.c-object.-mv   {opacity:1;top:50%;transform:translateY(-50%);left:36.1111111111vw;width:58.6805555556vw}
.c-object.-event{opacity:1;top:50%;transform:translateY(-50%);left:25.6944444444vw;width:48.4722222222vw}
.c-object.-floor{opacity:1;top:50%;transform:translateY(-50%);left:1.3888888889vw; width:69.6527777778vw}
.c-object.-vip  {opacity:1;top:50%;transform:translateY(-50%);left:52.0833333333vw;width:47.7777777778vw}
.c-object.-catch{opacity:1;top:50%;transform:translateY(-50%);left:33.5416666667vw;width:61.25vw}

.p-index__inner{position:relative;z-index:1}

/* ---------- MV ---------- */
.p-index-mv{height:var(--vh,100vh);min-height:100vh;position:relative}
.p-index-mv__title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.p-index-mv__background{
  height:var(--vh,100vh);left:0;top:0;position:absolute;width:100%;overflow:hidden;
  transition:border-radius .6s,height .6s,left .6s,top .6s,width .6s;
}
.p-index-mv__background.-inview{
  border-radius:10px;
  top:1.3888888889vw;left:1.3888888889vw;
  width:calc(100% - 2.7777777778vw);
  height:calc(var(--vh,100vh) - 2.7777777778vw);
}
.p-index-mv__background video{height:100%;object-fit:cover;width:100%}
.p-index-mv__wrap{
  bottom:5.5555555556vw;left:6.25vw;position:absolute;
  opacity:0;transform:translateY(20%);text-shadow:0 0 10px #fff;
  transition:transform .6s .3s,text-shadow .3s .3s;
}
.p-index-mv__wrap.-inview{
  text-shadow:0 0 0 #fff;transform:translateY(0);
  animation:flash-inv .3s .3s cubic-bezier(.4,0,.2,1) forwards;
}
.p-index-mv__button{align-items:center;display:flex;gap:0 .9027777778vw;width:max-content}
.p-index-mv__button + .p-index-mv__button{margin-top:15px}
.p-index-mv__button .-icon{
  border:1px solid #efefef;border-radius:50%;flex:none;overflow:hidden;position:relative;
  transform:translateY(.4166666667vw);width:2.0833333333vw;min-width:26px;color:#efefef;
}
.p-index-mv__button .-icon::before{
  background-color:#efefef;border-radius:50%;content:"";height:110%;width:110%;
  left:50%;top:50%;position:absolute;transform:translate(-50%,-50%) scale(0);transition:transform .3s;
}
.p-index-mv__button .-icon svg{position:relative;width:100%;padding:22%}
.p-index-mv__button .-text{font-size:5.5555555556vw;line-height:1;text-transform:uppercase}

/* ---------- concept ---------- */
.p-index-concept{align-items:center;display:flex;height:var(--vh,100vh);padding-left:6.5277777778vw}
.p-index-concept__contents{text-shadow:0 0 10px #fff;transition:text-shadow .3s .3s}
.p-index-concept__contents.-inview{
  text-shadow:0 0 0 #fff;animation:flash-inv .3s .3s cubic-bezier(.4,0,.2,1) forwards;
}
.p-index-concept__heading{text-transform:uppercase}
.p-index-concept__heading .-sub{display:block;font-size:1.4rem;transform:translateX(5px);letter-spacing:.08em}
.p-index-concept__heading .-main{display:block;font-size:7.5rem;line-height:1.1;margin-top:18px}
.p-index-concept__button{
  border:1px solid #393939;border-radius:32px;font-size:1.8rem;line-height:1;margin-top:36px;
  overflow:hidden;position:relative;transition:color .3s;width:190px;
}
.p-index-concept__button::before{
  background-color:#efefef;border-radius:50%;content:"";height:190px;width:190px;
  left:50%;top:50%;position:absolute;transform:translate(-50%,-50%) scale(0);transition:transform .3s;
}
.p-index-concept__button:hover{color:#080808}
.p-index-concept__button:hover::before{transform:translate(-50%,-50%) scale(1)}
.c-button{
  align-items:center;display:flex;height:100%;justify-content:center;position:relative;
  text-transform:uppercase;width:100%;z-index:2;padding:20px 0 22px;letter-spacing:.06em;
}

/* ---------- floor / vip (共通) ---------- */
.p-index-floor,.p-index-vip{padding:0 6.5277777778vw;margin-top:132px}
.p-index-floor .__heading,.p-index-vip .__heading{
  font-size:4rem;padding-bottom:12px;position:relative;text-transform:uppercase;
}
.p-index-floor .__heading .__text,.p-index-vip .__heading .__text{opacity:0;display:inline-block}
.p-index-floor.-inview .__heading .__text,.p-index-vip.-inview .__heading .__text{
  animation:flash-inv .3s cubic-bezier(.4,0,.2,1) .4s forwards;
}
.p-index-floor .__heading::before,.p-index-vip .__heading::before,
.p-index-floor .__heading::after, .p-index-vip .__heading::after{
  bottom:0;content:"";display:block;height:1px;left:0;position:absolute;width:0;
}
.p-index-floor .__heading::before,.p-index-vip .__heading::before{
  background-color:#393939;transition:width .4s .6s ease-in;
}
.p-index-floor .__heading::after,.p-index-vip .__heading::after{
  background-color:#efefef;transition:width .4s .8s ease-in;
}
.p-index-floor.-inview .__heading::before,.p-index-vip.-inview .__heading::before,
.p-index-floor.-inview .__heading::after, .p-index-vip.-inview .__heading::after{width:100%}
.p-index-floor .__wrap,.p-index-vip .__wrap{
  align-items:flex-start;display:flex;justify-content:space-between;margin-top:40px;
}
.p-index-floor .__inner,.p-index-vip .__inner{flex:none;overflow:hidden;transition:width .3s 1s;width:0}
.p-index-floor.-inview .__inner,.p-index-vip.-inview .__inner{width:26.3194444444vw}
.p-index-floor .-info,.p-index-vip .-info{width:100%}
.p-index-floor .-info__item:not(:first-child),.p-index-vip .-info__item:not(:first-child){margin-top:13px}
.p-index-floor .-info__link,.p-index-vip .-info__link{
  align-items:center;border-bottom:1px solid #393939;display:flex;font-size:1.4rem;
  justify-content:space-between;line-height:1.8;padding-bottom:5px;position:relative;transition:color .3s;
}
.p-index-floor .-info__link::before,.p-index-vip .-info__link::before{
  background-color:#efefef;bottom:-1px;content:"";display:block;height:1px;left:0;position:absolute;
  transition:width .3s;width:0;
}
.p-index-floor .-info__link:hover::before,.p-index-vip .-info__link:hover::before{width:100%}
.p-index-floor .-info__link.-disabled,.p-index-vip .-info__link.-disabled{color:#393939}
.p-index-floor .-info__point,.p-index-vip .-info__point{
  background-color:#efefef;border-radius:50%;display:block;height:8px;width:8px;flex:none;
  transition:background-color .3s,height .3s,width .3s;
}
.p-index-floor .-info__link:hover .-info__point,.p-index-vip .-info__link:hover .-info__point{
  background-color:#393939;height:20px;width:20px;
}
.p-index-floor .__button,.p-index-vip .__button{
  border:1px solid #393939;border-radius:32px;font-size:1.8rem;line-height:1;margin-top:40px;
  overflow:hidden;position:relative;transition:color .3s;width:190px;
}
.p-index-floor .__button::before,.p-index-vip .__button::before{
  background-color:#efefef;border-radius:50%;content:"";height:190px;width:190px;
  left:50%;top:50%;position:absolute;transform:translate(-50%,-50%) scale(0);transition:transform .3s;
}
.p-index-floor .__button:hover,.p-index-vip .__button:hover{color:#080808}
.p-index-floor .__button:hover::before,.p-index-vip .__button:hover::before{transform:translate(-50%,-50%) scale(1)}
.p-index-floor .-exterior,.p-index-vip .-exterior{
  flex:none;height:36.9444444444vw;position:relative;width:55.4861111111vw;
}
.p-index-floor .-exterior__inner,.p-index-vip .-exterior__inner{
  border-radius:10px;height:0;overflow:hidden;position:relative;transition:height .3s 1s;
}
.p-index-floor.-inview .-exterior__inner,.p-index-vip.-inview .-exterior__inner{height:100%}
.p-index-floor .-exterior__item{
  height:100%;left:0;top:0;position:absolute;width:100%;opacity:0;transition:opacity .8s;
}
.p-index-floor .-exterior__item.-current{opacity:1}
.p-index-vip .-exterior__item{height:100%}
.p-index-floor .-exterior img,.p-index-vip .-exterior img{
  height:100%;object-fit:cover;transform:scale(1.2);transition:transform .3s 1s;will-change:transform;
}
.p-index-floor.-inview .-exterior img,.p-index-vip.-inview .-exterior img{transform:scale(1)}
.p-index-floor .-exterior img.-sp,.p-index-vip .-exterior img.-sp{display:none}

/* ---------- marquee ---------- */
.p-index-band{mix-blend-mode:difference;margin-top:200px;overflow:hidden}
.p-index-band__text{font-size:7.5rem;line-height:1.15;text-transform:uppercase}
.p-index-band__text .-block{display:flex;width:max-content;will-change:transform}
.p-index-band__text .-item{display:inline-block;flex:none;margin-left:.4em;white-space:nowrap}
@media (prefers-reduced-motion: no-preference){
  #jsi-band__top.-run   {animation:marquee-l 25s linear infinite}
  #jsi-band__bottom.-run{animation:marquee-r 20s linear infinite}
}
@keyframes marquee-l{from{transform:translateX(0)}     to{transform:translateX(-50%)}}
@keyframes marquee-r{from{transform:translateX(-50%)}  to{transform:translateX(0)}}

/* ---------- footer ---------- */
.l-footer{padding:180px 6.5277777778vw 40px;position:relative;z-index:1}
.l-footer__head{border-bottom:1px solid #393939;padding-bottom:28px}
.l-footer-nav{display:flex;flex-wrap:wrap;gap:14px 40px;font-size:1.4rem;text-transform:uppercase;letter-spacing:.06em}
.l-footer-nav__link{transition:color .3s}
.l-footer-nav__link.-disabled{color:#393939}
.l-footer__foot{
  align-items:baseline;display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:space-between;margin-top:24px;
}
.l-footer-note{color:#efefef;font-family:"Noto Sans JP",sans-serif;font-size:1.2rem;line-height:1.8;max-width:62ch}
.l-footer-copyright{color:#efefef;font-size:1.2rem;letter-spacing:.06em}

/* ===========================================================================
   SP (基準幅 414px)
   =========================================================================== */
@media (max-width:768px){
  .l-header{padding:18px 24px 0 18px}
  /* SP は SNS を出さず、ロゴを左端に寄せる */
  .l-header-sns{display:none}
  /* SP は横幅が足りないのでシンボルマークだけにする */
  .l-header-logo{align-items:flex-start;width:auto;max-width:none;min-width:0;gap:5px 0}
  .l-header-logo .-pc{display:none}
  .l-header-logo .-sp{display:block;width:30px}
  .l-header-logo__note{font-size:.9rem;letter-spacing:.16em}
  .l-header-info{font-size:1.2rem;gap:0 10px}
  .l-header-menu__button{font-size:1rem;padding:9px 16px 8px;white-space:nowrap}

  .l-navigation__inner{flex-direction:column;align-items:flex-start;padding:96px 7.2463768116vw 40px;overflow-y:auto;height:100%}
  .l-navigation__item.-main{font-size:2.8rem}
  .l-navigation__item.-sub{font-size:1.3rem}
  /* SP はメニュー内のキービジュアルを出さない */
  .l-navigation__image{display:none}

  .c-cursor{display:none}
  .c-loading__heading{width:64vw;min-width:0}
  
  .p-index-mv{min-height:0}
  .p-index-mv__background.-inview{
    top:15.7004830918vw;left:2.4154589372vw;
    width:calc(100% - 4.8309178744vw);
    height:calc(var(--vh,100vh) - 20.5314009662vw);
  }
  .p-index-mv__wrap{bottom:12.5603864734vw;left:7.2463768116vw}
  .p-index-mv__button{gap:0 2.4154589372vw}
  .p-index-mv__button .-icon{width:min(5.2vw,22px);min-width:0;transform:translateY(.5vw)}
  .p-index-mv__button .-text{font-size:min(5.6vw,24px)}

  .p-index-concept{height:auto;padding:44.2028985507vw 7.2463768116vw}
  .p-index-concept__heading .-sub{font-size:1.1rem}
  .p-index-concept__heading .-main{font-size:min(9.6618357488vw,4rem)}
  .p-index-concept__button{font-size:1.5rem;width:164px}
  .c-button{padding:14px 0 16px}

  .p-index-event{padding-top:90px}
  .p-index-event__heading{font-size:2.5rem;padding:0 4.8309178744vw}
  .p-index-event__wrap{padding-left:4.8309178744vw;margin-top:24px}
  .p-index-event-info{gap:0 4.8309178744vw}
  .p-index-event-info__item,
  .p-index-event-info__item.-current{min-width:0;width:78vw;padding-top:0}
  .p-index-event-info__thumb,
  .p-index-event-info__item.-current .p-index-event-info__thumb{height:78vw;min-height:0}
  .p-index-event-info__title{font-size:1.7rem}
  .p-index-event__arrow{position:static;transform:none;margin:0}
  .p-index-event__arrow.-prev,.p-index-event__arrow.-next{
    position:absolute;top:auto;bottom:-70px;right:auto;height:44px;width:44px;
  }
  .p-index-event__arrow.-prev{left:4.8309178744vw}
  .p-index-event__arrow.-next{left:calc(4.8309178744vw + 54px)}
  .p-index-event__button{margin-top:110px;font-size:1.5rem;width:164px}

  .p-index-floor,.p-index-vip{padding:0 4.8309178744vw;margin-top:110px}
  .p-index-floor .__heading,.p-index-vip .__heading{font-size:2.5rem;padding-bottom:14px}
  .p-index-floor .__wrap,.p-index-vip .__wrap{flex-direction:column-reverse;margin-top:23px}
  .p-index-floor.-inview .__inner,.p-index-vip.-inview .__inner{width:100%}
  .p-index-floor .__inner,.p-index-vip .__inner{margin:28px 0 0;transition:width .3s 1.4s}
  .p-index-floor .-info__link,.p-index-vip .-info__link{font-size:1.2rem;line-height:1.6}
  .p-index-floor .__button,.p-index-vip .__button{font-size:1.5rem;margin-top:28px;width:164px}
  .p-index-floor .__button::before,.p-index-vip .__button::before{content:none}
  .p-index-floor .-exterior,.p-index-vip .-exterior{height:112.8019323671vw;width:100%}
  .p-index-floor .-exterior img.-pc,.p-index-vip .-exterior img.-pc{display:none}
  .p-index-floor .-exterior img.-sp,.p-index-vip .-exterior img.-sp{display:block}

  .p-index-band{margin-top:110px}
  .p-index-band__text{font-size:3.4rem}

  .l-footer{padding:120px 4.8309178744vw 32px}
  .l-footer-nav{font-size:1.2rem;gap:12px 24px}
  .p-index-concept__button::before,.p-index-event__button::before{content:none}
}

/* ===========================================================================
   GROUP RANKING
   配置は添付デザインのまま、配色・書体はサイト本体に合わせる。
   #080808 / #efefef / #393939 の 3 色、見出しは Michroma、和文は Noto Sans JP。
   =========================================================================== */
.l-rank-band{
  /* 背景の発光オブジェクトは透かしつつ、カードの上下だけ落として文字の可読性を確保する。
     端はフェードさせるので「別の帯」には見えない。 */
  background:linear-gradient(180deg,
    rgba(8,8,8,0) 0,
    rgba(8,8,8,.66) 120px,
    rgba(8,8,8,.66) calc(100% - 120px),
    rgba(8,8,8,0) 100%);
  color:#efefef;
  font-family:"Noto Sans JP",sans-serif;
  padding:0 6.5277777778vw;
}

.c-rank__head{margin-bottom:2.7777777778vw}
.c-rank__heading{
  align-items:baseline;display:flex;flex-wrap:wrap;gap:0 20px;
  font-family:"Michroma","Noto Sans JP",sans-serif;font-size:4rem;font-weight:400;
  line-height:1.1;text-transform:uppercase;
}
.-inview .c-rank__heading,
.p-ranking-page .c-rank__heading{animation:flash-inv .3s cubic-bezier(.4,0,.2,1) .3s forwards}
.c-rank__heading .-ja{
  color:#efefef;font-family:"Noto Sans JP",sans-serif;font-size:1.3rem;font-weight:400;
  letter-spacing:.08em;
}
.c-rank__period{
  align-items:center;display:flex;flex-wrap:wrap;gap:10px 12px;
  justify-content:flex-end;margin-top:26px;
}
.c-rank__period .-label{color:#efefef;font-size:1.3rem;letter-spacing:.04em}
.c-rank__select{position:relative;display:inline-block}
.c-rank__select::after{
  border-left:4px solid rgba(0,0,0,0);border-right:4px solid rgba(0,0,0,0);
  border-top:5px solid #efefef;content:"";pointer-events:none;
  position:absolute;right:14px;top:50%;transform:translateY(-30%);
}
.c-rank__select select{
  appearance:none;-webkit-appearance:none;
  background-color:rgba(239,239,239,.04);border:1px solid #393939;border-radius:3px;
  color:#efefef;cursor:pointer;font-family:"Noto Sans JP",sans-serif;font-size:1.3rem;
  line-height:1;min-width:110px;padding:11px 38px 11px 16px;transition:border-color .3s;
}
.c-rank__select select:hover{border-color:#efefef}
.c-rank__select select option{background-color:#141414;color:#efefef}

/* ---- タブ ---- */
.c-rank-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:0 1.5277777778vw;margin-bottom:3.4722222222vw}
.c-rank-tabs__item{position:relative}
.c-rank-tabs__link{
  border-bottom:1px solid #393939;color:#efefef;display:block;
  font-family:"Noto Sans JP",sans-serif;font-size:1.5rem;letter-spacing:.06em;
  padding-bottom:16px;text-align:center;width:100%;
  transition:color .3s,border-color .3s;
}
.c-rank-tabs__link:hover{color:#efefef}
.c-rank-tabs__link.-selected{border-bottom-color:#efefef;color:#efefef;cursor:default}
.c-rank-tabs__link.-selected::after{
  border-left:6px solid rgba(0,0,0,0);border-right:6px solid rgba(0,0,0,0);
  border-top:7px solid #efefef;content:"";
  left:50%;bottom:-8px;position:absolute;transform:translateX(-50%);
}

/* ---- カード ---- */
.c-rank__panel{display:none}
.c-rank__panel.-selected{display:block}
.c-rank__list{display:grid;grid-template-columns:repeat(5,1fr);gap:2.7777777778vw 1.6666666667vw}
.c-rank__link{display:block}
.c-rank__thumb{
  aspect-ratio:3/4;background-color:#141414;border-radius:10px;overflow:hidden;position:relative;
}
.c-rank__thumb img{height:100%;object-fit:cover;width:100%;transition:transform .4s}
.c-rank__link:hover .c-rank__thumb img{transform:scale(1.06)}
.c-rank__no{
  backdrop-filter:blur(6px);background-color:rgba(8,8,8,.6);bottom:0;color:#efefef;display:block;
  font-family:"Michroma","Noto Sans JP",sans-serif;font-size:1.2rem;left:0;letter-spacing:.06em;
  padding:11px 0 10px;position:absolute;text-align:center;width:100%;
}
.c-rank__store{color:#efefef;font-size:1.1rem;letter-spacing:.04em;line-height:1.5;margin-top:14px}
.c-rank__name{font-size:1.8rem;font-weight:400;letter-spacing:.02em;line-height:1.4;margin-top:6px}

.c-rank__more{
  border:1px solid #393939;border-radius:32px;font-size:1.8rem;line-height:1;
  margin:4.1666666667vw auto 0;overflow:hidden;position:relative;transition:color .3s;width:190px;
}
.c-rank__more::before{
  background-color:#efefef;border-radius:50%;content:"";height:190px;width:190px;
  left:50%;top:50%;position:absolute;transform:translate(-50%,-50%) scale(0);transition:transform .3s;
}
.c-rank__more:hover{color:#080808}
.c-rank__more:hover::before{transform:translate(-50%,-50%) scale(1)}
.c-rank__button{
  align-items:center;display:flex;font-family:"Michroma","Noto Sans JP",sans-serif;
  justify-content:center;padding:20px 0 22px;position:relative;text-transform:uppercase;z-index:2;
}
/* タブ（店舗）ごとのランキング末尾に置く店舗情報への導線 */
.c-rank__shoplink{display:flex;justify-content:center;margin-top:3.4722222222vw}
.c-rank__shoplink .c-btn{flex:none;white-space:nowrap}
.c-rank__note{color:#efefef;font-size:1.2rem;line-height:1.9;margin-top:3.4722222222vw}

/* ---- トップページに置いたときの位置 ---- */
.p-index-ranking{margin-top:132px;position:relative;z-index:1}
.c-object.-ranking{opacity:1;top:50%;transform:translateY(-50%);left:12.5vw;width:64vw}

@media (max-width:768px){
  .l-rank-band{padding:0 4.8309178744vw}
  .c-rank__head{margin-bottom:24px}
  .c-rank__heading{font-size:2.5rem;gap:0 10px}
  .c-rank__heading .-ja{font-size:1.1rem}
  .c-rank__period{gap:8px;justify-content:flex-start;margin-top:18px}
  .c-rank__period .-label{font-size:1.1rem}
  .c-rank__select select{font-size:1.2rem;min-width:0;padding:10px 32px 10px 12px}
  .c-rank-tabs{grid-template-columns:repeat(2,1fr);gap:0 4vw;margin-bottom:28px}
  .c-rank-tabs__item:nth-child(n+3){margin-top:20px}
  .c-rank-tabs__link{font-size:1.2rem;padding-bottom:12px}
  .c-rank__list{grid-template-columns:repeat(2,1fr);gap:26px 4.8309178744vw}
  .c-rank__no{font-size:1rem;padding:8px 0 7px}
  .c-rank__store{font-size:1rem;margin-top:10px}
  .c-rank__name{font-size:1.4rem}
  .c-rank__more{font-size:1.5rem;margin-top:34px;width:164px}
  .c-rank__more::before{content:none}
  .c-rank__button{padding:14px 0 16px}
  .c-rank__shoplink{margin-top:28px}
  .c-rank__note{font-size:1.1rem;margin-top:28px}
  .p-index-ranking{margin-top:110px}
  .c-object.-ranking{left:0;width:100vw}
}

/* ---- トップの SHOP セクション（Floor Guide の置き換え） ---- */
.p-index-shop{margin-top:132px;padding:0 6.5277777778vw}
.p-index-shop__heading{font-size:4rem;margin-bottom:34px;text-transform:uppercase}
.p-index-shop.-inview .p-index-shop__heading{animation:flash-inv .3s cubic-bezier(.4,0,.2,1) .4s forwards}
.p-index-shop__list{display:grid;gap:34px 2.2222222222vw;grid-template-columns:repeat(3,1fr)}
.p-index-shop__thumb{
  aspect-ratio:3/2;background-color:#141414;border-radius:10px;overflow:hidden;
}
.p-index-shop__thumb img{height:100%;object-fit:cover;width:100%;transition:transform .4s}
.p-index-shop__link:hover .p-index-shop__thumb img{transform:scale(1.05)}
.p-index-shop__area{color:#efefef;font-size:1.1rem;letter-spacing:.06em;margin-top:14px}
.p-index-shop__name{font-family:"Michroma",sans-serif;font-size:1.7rem;line-height:1.3;margin-top:6px}
.p-index-shop__addr{color:#efefef;font-size:1.2rem;line-height:1.7;margin-top:8px}
.p-index-shop__meta{color:#efefef;font-size:1.1rem;margin-top:6px}
.p-index-shop .c-cta{margin:56px auto 0;width:190px}
.p-index-shop .c-cta .c-button{
  border:1px solid #393939;border-radius:32px;font-size:1.8rem;line-height:1;
  transition:background-color .3s,color .3s;
}
.p-index-shop .c-cta .c-button:hover{background-color:#efefef;color:#080808}
.p-index-concept__text{color:#efefef;font-family:"Noto Sans JP",sans-serif;font-size:1.4rem;line-height:2;margin-top:22px}

@media (max-width:768px){
  .p-index-shop{margin-top:110px;padding:0 4.8309178744vw}
  .p-index-shop__heading{font-size:2.5rem;margin-bottom:22px}
  .p-index-shop__list{grid-template-columns:1fr;gap:28px}
  .p-index-shop__name{font-size:1.5rem}
  .p-index-shop .c-cta{width:164px}
  .p-index-shop .c-cta .c-button{font-size:1.5rem;padding:14px 0 16px}
  .p-index-concept__text{font-size:1.2rem;margin-top:16px}
}

/* ===========================================================================
   グローバルナビ（PC のみ）
   右 40% を黒一色のパネルにし、左 60% は背面のサイトが透けるオーバーレイ。
   パネル内の項目は左揃え＋区切り線＋丸アローの行レイアウト。
   SP（max-width:768px）側の指定には一切干渉しない。
   =========================================================================== */
@media (min-width:769px){
  /* 左 60%：背面のサイトが透けて見えるので、オーバーレイで落として可読性を確保する */
  .l-navigation{
    align-items:stretch;
    background-color:rgba(8,8,8,.72);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
  }
  .l-navigation__inner{justify-content:flex-end;gap:0;margin:0;padding:0}
  /* 右 40%：黒一色のメニューパネル。ヘッダー（z-index:5）が上に重なる */
  .l-navigation__block{
    background-color:#080808;
    display:flex;flex-direction:column;
    /* 中央寄せだが、項目が増えて溢れたときに上が切れないよう safe を付ける */
    justify-content:flex-start;justify-content:safe center;
    height:100%;overflow-y:auto;padding:110px 4.4vw 48px;
    text-align:left;width:40%;min-width:400px;
  }
  .l-navigation__wrap{align-items:stretch;gap:0}
  .l-navigation__item{border-bottom:1px solid #2c2c2c}
  .l-navigation__item.-main{font-size:2.6rem}
  .l-navigation__item.-sub{font-size:1.7rem}
  .l-navigation__item.-sub:first-of-type{margin-top:0}
  /* 項目名は左、丸アローは右端。行全体がクリック領域になる */
  .l-navigation__link{
    align-items:center;display:flex;gap:0 20px;justify-content:space-between;
    padding:17px 0;width:100%;
  }
  .l-navigation__link::after{
    align-items:center;border:1px solid #efefef;border-radius:50%;color:#efefef;
    content:"\203a";display:flex;flex:none;font-size:1.5rem;height:30px;
    justify-content:center;line-height:1;padding-bottom:3px;
    transition:background-color .3s,color .3s;width:30px;
  }
  .l-navigation__link:hover::after{background-color:#efefef;color:#080808}
  .l-navigation__link.-disabled::after{border-color:#393939;color:#393939}
  .l-navigation-lang{justify-content:flex-start}
  .l-navigation-shop__item{display:block}
  .l-navigation-shop__link{flex-direction:row;gap:0 12px;justify-content:flex-start}
  .l-navigation__image{display:none}
}
