/**
 * index-v8.css - トップページ専用（唯一の権威ソース）
 * style.css の後に読み込まれ、index固有のスタイルを上書き
 */

/* ===== 背景グリッド ===== */
.grid-bg{position:fixed;top:62px;left:0;right:0;bottom:0;z-index:0;display:grid;grid-template-columns:repeat(3,calc((100vw - 4px)/3));grid-auto-rows:calc((100vw - 4px)/3);gap:2px;overflow:hidden}
.bg-tile{width:calc((100vw - 4px)/3);height:calc((100vw - 4px)/3);overflow:hidden;position:relative;transition:opacity .6s}
.bg-tile.is-fading{opacity:0}
.bg-tile--img{background-size:cover;background-position:center;background-color:#222}
.bg-tile--text{display:flex!important;flex-wrap:wrap!important;align-items:center!important;align-content:center!important;justify-content:center!important;padding:8px!important;text-align:center!important;line-height:1.4!important;word-break:break-word!important}
.bg-tile--text,.bg-tile--text *{writing-mode:horizontal-tb!important}
.bg-tile__word{display:inline!important}
.bg-tile__word--xl{font-size:1.5em;font-weight:900}
.bg-tile__word--lg{font-size:1.25em;font-weight:700}
.bg-tile__word--md{font-size:1em;font-weight:500}
.bg-tile__word--sm{font-size:.88em}
.bg-tile__word--xs{font-size:.78em}
.hbg1{background-color:#1a1a2e}.hbg2{background-color:#16213e}.hbg3{background-color:#1b1b2f}.hbg4{background-color:#0f3460}
.hbg5{background-color:#1a0a2e}.hbg6{background-color:#2d132c}.hbg7{background-color:#1c1427}.hbg8{background-color:#10253e}
.hfn1{font-family:'Dela Gothic One',cursive;font-size:.78rem}
.hfn2{font-family:'Reggae One',cursive;font-size:.78rem}
.hfn3{font-family:'Hachi Maru Pop',cursive;font-size:.72rem}
.hfn4{font-family:'Yusei Magic',sans-serif;font-size:.76rem}
.hfn5{font-family:'RocknRoll One',sans-serif;font-size:.78rem}
.hfn6{font-family:'Kosugi Maru',sans-serif;font-size:.76rem}
.hgr1 .bg-tile__word{background:linear-gradient(135deg,#f093fb,#f5576c);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr2 .bg-tile__word{background:linear-gradient(135deg,#4facfe,#00f2fe);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr3 .bg-tile__word{background:linear-gradient(135deg,#43e97b,#38f9d7);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr4 .bg-tile__word{background:linear-gradient(135deg,#fa709a,#fee140);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr5 .bg-tile__word{background:linear-gradient(135deg,#a18cd1,#fbc2eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr6 .bg-tile__word{background:linear-gradient(135deg,#ffecd2,#fcb69f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr7 .bg-tile__word{background:linear-gradient(135deg,#89f7fe,#66a6ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hgr8 .bg-tile__word{background:linear-gradient(135deg,#fddb92,#d1fdff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* ===== ヒーロー ===== */
.hero{position:relative;width:100%;height:88vh;height:88svh}
.hero__veil{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1;pointer-events:none}
.hero__center{position:absolute;top:33%;left:50%;transform:translate(-50%,-50%);z-index:2;text-align:center;pointer-events:none}
.hero__catch{font-size:clamp(.7rem,3.5vw,1.1rem);color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.8),0 0 40px rgba(0,0,0,.5);letter-spacing:.1em;margin:0 0 12px;font-weight:500;white-space:nowrap}
.hero__logo{font-family:'Dela Gothic One',cursive;font-size:2.4rem;letter-spacing:.04em;color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.7),0 0 60px rgba(0,0,0,.4),0 4px 8px rgba(0,0,0,.9);margin:0}
.hero__sub{display:inline-block!important;font-size:.78rem!important;color:rgba(255,255,255,.85)!important;letter-spacing:.15em;margin:0!important;margin-top:10px!important;background:rgba(12,12,28,.75)!important;padding:6px 18px!important;border-radius:20px!important;text-shadow:none!important}
.hero__scroll-cta{position:absolute;bottom:70px;left:50%;transform:translateX(-50%);z-index:3;pointer-events:none;display:flex;flex-direction:column;align-items:center;filter:none!important}
.hero__scroll-label{font-size:.72rem!important;letter-spacing:.35em;color:rgba(255,255,255,.7)!important;font-weight:700!important;margin-bottom:10px;background:rgba(12,12,28,.65);padding:4px 14px;border-radius:12px;text-shadow:none!important}
.hero__scroll-bar{width:2px;height:50px;background:rgba(255,255,255,.4)}
.hero__scroll-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.8);margin-top:4px;animation:idx-dot 1.8s ease-in-out infinite}
@keyframes idx-dot{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}

/* ===== コンテンツ構造 ===== */
.main-content{position:relative;z-index:10}
.main-content .container{padding-bottom:0}
.main-content .section{margin-bottom:0;padding:20px 0}
.content-fade{background:linear-gradient(to bottom,transparent 0%,rgba(12,12,28,.5) 30%,rgba(12,12,28,.72) 60%,rgba(12,12,28,.72) 100%);padding-top:40px}
.content-body{background:rgba(12,12,28,.72);padding-bottom:0}

/* ===== 検索バー（flex配置、虫眼鏡正常表示） ===== */
.search-bar{
  display:flex!important;
  align-items:center!important;
  background:rgba(20,20,40,.88)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:28px!important;
  padding:0 16px!important;
  height:48px!important;
  box-shadow:none!important;
  position:static!important;
  gap:0!important;
}
.search-bar__icon{
  position:static!important;
  left:auto!important;
  top:auto!important;
  transform:none!important;
  font-size:1.1rem!important;
  margin-right:10px!important;
  flex-shrink:0!important;
  display:inline-block!important;
  color:rgba(255,255,255,.5)!important;
}
.search-bar__input{
  flex:1!important;
  width:auto!important;
  padding:0!important;
  border:none!important;
  background:transparent!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:.85rem!important;
  box-shadow:none!important;
}
.search-bar__input::placeholder{
  color:rgba(255,255,255,.4)!important;
  -webkit-text-fill-color:rgba(255,255,255,.4)!important;
}
.search-bar__input:focus{
  border:none!important;
  box-shadow:none!important;
  outline:none!important;
}

/* ===== 速報ボックス ===== */
.shop-news-box{background:rgba(20,20,40,.88)!important;border:1px solid rgba(255,255,255,.14)!important}
.shop-news-name{color:#7cb3f0!important}
.shop-news-message{color:rgba(255,255,255,.7)!important}

/* ===== エリアセクション ===== */
.area-section{background:rgba(20,20,40,.88)!important;border:1px solid rgba(255,255,255,.14)!important}
.area-gps-btn{color:#7cb3f0!important;background:rgba(74,144,217,.15)!important;border:2px solid rgba(124,179,240,.4)!important}
.area-gps-btn:hover{background:rgba(74,144,217,.25)!important}
.area-divider{color:rgba(255,255,255,.7)!important;margin-top:14px!important;font-weight:500!important}
.area-divider::before,.area-divider::after{background:rgba(255,255,255,.25)!important}

/* アコーディオン */
.area-accordion__header{color:#fff!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
.area-accordion__header:hover{background:rgba(255,255,255,.05)!important}
.area-accordion__count{color:rgba(255,255,255,.45)!important}
.area-accordion__arrow{color:rgba(255,255,255,.35)!important}

/* サブアコーディオン（白背景完全除去） */
.sub-accordion__header{background:rgba(20,20,40,.7)!important;border:1px solid rgba(255,255,255,.1)!important;color:#fff!important}
.sub-accordion__header:hover{background:rgba(74,144,217,.15)!important;border-color:rgba(124,179,240,.4)!important}
.sub-accordion__name{color:rgba(255,255,255,.9)!important}
.sub-accordion__count{color:rgba(255,255,255,.4)!important}
.sub-accordion__arrow{color:rgba(255,255,255,.3)!important}

/* エリアボタン（白背景完全除去） */
.area-btn{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important}
.area-btn:hover{background:rgba(74,144,217,.2)!important;border-color:rgba(124,179,240,.5)!important;color:#7cb3f0!important}
.area-btn small{color:rgba(255,255,255,.4)!important}

/* ===== 新着店舗 ===== */
.shop-card{background:rgba(20,20,40,.88)!important;border:1px solid rgba(255,255,255,.14)!important}
.shop-card:hover{border-color:rgba(124,179,240,.35)!important;box-shadow:0 4px 16px rgba(0,0,0,.4)!important;transform:none!important}
.shop-card__name{color:#fff!important}
.shop-card__badge{color:#7cb3f0!important;background:rgba(124,179,240,.2)!important}
.shop-card__message{color:rgba(255,255,255,.55)!important}
.shop-card__btn{color:#7cb3f0!important;background:rgba(74,144,217,.15)!important;padding:6px 12px!important;border-radius:6px!important;font-weight:600!important}
.shop-card__btn:hover{background:rgba(74,144,217,.3)!important}
.shop-card__favorite{color:rgba(255,255,255,.35)!important;border-color:rgba(255,255,255,.15)!important;padding:6px 10px!important;min-width:44px!important}
.shop-card__favorite svg{display:block;width:18px;height:18px;min-width:18px;min-height:18px;flex-shrink:0}
.shop-card__favorite:hover{color:rgba(255,107,107,.6)!important}
.shop-card__favorite.is-fav{color:#ff6b6b!important;border-color:rgba(255,107,107,.3)!important}

/* ===== more-btn ===== */
.more-btn{color:rgba(255,255,255,.6)!important;background:rgba(20,20,40,.88)!important;border:1px solid rgba(255,255,255,.14)!important;margin-top:14px!important;margin-bottom:16px!important}
.more-btn:hover{background:rgba(74,144,217,.15)!important;border-color:rgba(124,179,240,.3)!important;color:#7cb3f0!important}

/* ===== 求人バナー ===== */
.recruit-banner__title{color:#fff!important}
.recruit-banner__desc{color:rgba(255,255,255,.9)!important}

/* ===== お知らせ ===== */
.notice-card{background:rgba(20,20,40,.88)!important;border:1px solid rgba(255,255,255,.14)!important}
.notice-item{color:#fff!important;transition:background .2s!important}
.notice-item:hover{background:rgba(74,144,217,.12)!important}
.notice-item__date{color:rgba(255,255,255,.4)!important}
.notice-item__text{color:rgba(255,255,255,.85)!important}
.sec-head__title{color:#fff!important}

/* ===== セクション間グリッド ===== */
.idx-tw-break{margin:8px 0}
.idx-tw-break .tw-grid{border-radius:0}

/* ===== コピーライト ===== */
.idx-copyright{text-align:center;padding:24px 16px 16px;font-size:.68rem;color:rgba(255,255,255,.25)}

/* ===== 無限フィード ===== */
.idx-infinite-section{padding-top:8px;padding-bottom:120px}
.idx-infinite-section .sec-title{font-size:.88rem;font-weight:700;color:#fff;margin-bottom:10px;display:flex;align-items:center;gap:6px}

/* ===== 遷移エフェクト ===== */
.trans-overlay{position:fixed;inset:0;z-index:9999;pointer-events:none;overflow:hidden}
.trans-overlay.is-active{pointer-events:auto}
.trans-tape{position:absolute;white-space:nowrap;display:flex;gap:4px;align-items:center;will-change:transform,opacity}
.trans-tape--v{flex-direction:column;white-space:normal}
.trans-tape--v .trans-tape__word{writing-mode:vertical-rl}
.trans-tape__word{flex-shrink:0;font-weight:700}
.trans-flash{position:fixed;inset:0;z-index:10000;background:#fff;opacity:0;pointer-events:none}

/* ===== PC対応 ===== */
@media (min-width: 768px) {
  .hero__logo{font-size:3.2rem}
  .hero__catch{font-size:1.1rem}
  .hero__sub{font-size:.88rem!important}
}

/* ===== SEOテキスト ===== */
.idx-seo-text{padding:20px 16px 4px;font-size:.72rem;line-height:1.8;color:rgba(255,255,255,.45)}
.idx-seo-text p{margin:0}
.idx-footer-links{display:flex;justify-content:center;gap:16px;padding:12px 16px 4px;font-size:.7rem}
.idx-footer-links a{color:rgba(255,255,255,.35);text-decoration:none}
.idx-footer-links a:hover{color:#7cb3f0}
