/* 余計な干渉を避けるため、ビジネスページ用の見出し・レイアウトだけ残す */

/* ファーストビュー */
.business-hero{
  position: relative;
  overflow: hidden;
  background-image: url("../images/business1.svg"); /* assets/css → assets/images の相対パス */
  background-size: cover;
  background-position: center;
  height: 500px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.business-title{
  position: absolute;
  bottom: -90px;
  right: 0;
  padding-right: 20px;
  top:170px;
  font-size: clamp(280px, 10vw, 580px);
  font-weight: 300;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.15);
  font-family: 'Helvetica Neue', sans-serif;
  transform: translateX(-100%);
  opacity: 0;
  animation: slideInRight 1.5s ease-out forwards;
}
@keyframes slideInRight{ to{ transform: translateX(0); opacity:1; } }

.concept{ padding:80px 20px; background:#fff; }
.concept__inner{ position:relative; max-width:800px; margin:0 auto; padding-left:30px; }
.concept__inner::before{ content:""; position:absolute; top:0; left:0; width:2px; height:100%; background:#ccc; }
.concept__title{ font-size:32px; line-height:1.4; font-weight:700; margin-bottom:24px; }
.concept__body p{ font-size:16px; line-height:1.8; margin-bottom:16px; }

@keyframes fadeUpOnLoad{0%{opacity:0;transform:translateY(40px);}100%{opacity:1;transform:translateY(0);}}
.animate-on-load{ opacity:0; animation:fadeUpOnLoad .9s ease-out forwards; }

/* セクション：レンタカー・車両卸売 */
*,*::before,*::after{ box-sizing:border-box; }

.service-hero{
  display:flex; align-items:center; justify-content:space-between;
  gap:80px; max-width:1200px; margin:0 auto; padding:80px 20px;
}
.service-hero__content{ flex:1; }
.service-hero__image{ flex:1; text-align:right; }
.service-hero__image img{ max-width:100%; height:auto; border-radius:8px; }
.service-hero__title{ font-size:2rem; line-height:1.4; margin-bottom:24px; }
.service-hero__text p{ font-size:1rem; line-height:1.8; color:#555; margin-bottom:16px; }

@keyframes fadeUp{from{opacity:0; transform:translateY(40px);} to{opacity:1; transform:translateY(0);} }
.fade-up-on-load{ opacity:0; transform:translateY(40px); animation:fadeUp .8s ease forwards; animation-delay:.2s; }

/* 特徴グリッド */
.features-section{ max-width:1200px; margin:0 auto; padding:80px 20px; background:#f8f9fa; margin-bottom:80px; }
.features-heading{ font-size:2rem; text-align:center; font-weight:700; margin-bottom:60px; color:#001f5c; }
.features-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:30px; }
.feature-item{ background:#fff; padding:32px; border-radius:16px; box-shadow:0 8px 24px rgba(0,0,0,.05); transition:transform .3s, box-shadow .3s; }
.feature-item:hover{ transform:translateY(-4px); box-shadow:0 12px 30px rgba(0,0,0,.1); }
.feature-icon{ width:40px; height:40px; margin-bottom:20px; }
.feature-title{ font-size:1.2rem; font-weight:600; margin-bottom:16px; color:#333; }
.feature-text{ font-size:1rem; line-height:1.75; color:#555; }

.animate-fade{ opacity:1; transform:translateY(20px); transition:opacity .6s ease-out, transform .6s ease-out; }
.animate-fade.show{ opacity:1; transform:translateY(0); }



/* ==== 車両卸売：サービスの特徴 ==== */
.features{ padding:80px 20px; max-width:1200px; margin:0 auto; background:#f8f9fa; }
.features__inner{ max-width:1200px; margin:0 auto; }
.features__title{ font-size:2rem; font-weight:700; margin-bottom:2rem; color:#001f5c; text-align:center; }
.features__list{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px,1fr));
  gap:40px; list-style:none; padding:0; margin:0;
}
.features__item{
  background:#fff; border-radius:12px; padding:32px 24px; border:1px solid #eee;
  box-shadow:0 4px 16px rgba(0,0,0,.05);
  transition:transform .3s ease, box-shadow .3s ease;
}
.features__item:hover{ transform:translateY(-4px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.features__item .feature-icon{ width:48px; height:48px; margin-bottom:16px; display:block; }
.features__item h4{ font-size:1.125rem; margin-bottom:12px; color:#001f5c; }
.features__item p{ font-size:.95rem; color:#333; line-height:1.7; }


/* ラベル */
.service-hero__label{ display:inline-flex; align-items:baseline; gap:8px; margin-bottom:16px; color:#007acc; font-weight:700; }
.service-hero__number{ display:inline-block; font-size:2.5rem; line-height:1; }
.service-hero__name{ font-size:1rem; line-height:1.4; }
.service-hero__slash{ opacity:.7; margin-left:4px; font-size:.9rem; }

/* 横スクロールテキスト */
.services-ticker{ overflow:hidden; padding:16px 0; }
.services-ticker__track{ display:inline-block; white-space:nowrap; width:max-content; animation:ticker 30s linear infinite; }
.services-ticker__item{ display:inline-block; margin-right:4rem; color:rgba(204,204,204,.3); font-weight:700; font-size:5rem; }
@keyframes ticker{ 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }



/* 追従バナー全体のサイズを決める親 */
.floating-banner {
  width: 300px;   /* ←ここで全体の直径を決める */
  height: 300px;
  bottom: 20px;
  right: 20px;
  position: fixed;
  z-index: 9999;
  opacity: 1;
}

/* 円の中身（車アイコンや回転テキストの親） */
.banner-circle {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0; /* 不要なずれ補正を消す */
}

/* 車アイコン：サイズ・位置 */
.circle-icon {
  position: absolute;
  top: 75%;  /* 真ん中寄せ */
  left: 69%;
  transform: translate(-50%, -50%);
  width: 170px;   /* ←ここで車アイコン単体の大きさを調整 */
  height: auto;
  z-index: 2;
}

/* テキストサークル：サイズ・位置 */
.circle-text {
  position: absolute;
  top: 75%;
  left: 125%;
  width: 76%;  /* 親にフィット */
  height: 77%;
  transform: translate(-50%, -50%);
  transform-origin: center center;
  z-index: 1;
  pointer-events: none;
  animation: circleSpin 20s linear infinite;
}

/* 回転アニメ */
@keyframes circleSpin {
  0%   { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}




/* レスポンシブ */
@media (max-width: 768px){
  .business-hero{ height:30vh; }
  .business-title{ top:220px; left:130px; font-size:4.7rem; font-weight:400; color:rgba(255,255,255,.2); text-shadow:none; }
  .service-hero{ flex-direction:column; align-items:center; padding:24px 16px; gap:24px; }
  .service-hero__title{ font-size:18px; font-weight:700; line-height:1.6; margin-bottom:12px; }
  .service-hero__text p{ font-size:14px; line-height:1.7; margin-bottom:12px; }
  .services-ticker{ margin-top:-70px; }
}

/* 汎用 */
html,body{ margin:0; padding:0; box-sizing:border-box; }




/* ==== Business 専用：フッターを最下部に復帰させる強制パッチ ==== */

/* ページ骨格（GeneratePressのラッパ）がflex等でも、Businessだけはブロックに戻す */
body.business-page #page,
body.business-page .site,
body.business-page .site-content,
body.business-page .site-main,
body.business-page #main {
  display: block !important;
  width: 100%;
}

/* main 内に浮動要素があっても高さを確保（collapse防止） */
body.business-page .site-main::after,
body.business-page #main::after {
  content: "";
  display: block;
  clear: both;
}

/* セクションは普通にフローさせる（念のため） */
body.business-page section { float: none !important; position: static !important; }

/* フッターは横並びから独立 + 全幅 + 表示強制 */
body.business-page .site-footer {
  display: block !important;
  position: relative !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1; /* 固定バナーの下でOK */
}

/* フッター内側は中央寄せ・コンテンツ幅に */
body.business-page .inside-site-footer,
body.business-page .footer-widgets-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
}

/* 直前セクション（卸売の特徴）に下マージンを付けて余白を確保 */
body.business-page .features,
body.business-page .features.features--wholesale { margin-bottom: 60px; }

/* 横スク封印（再掲） */
body.business-page { overflow-x: hidden; }




/* レンタカー事業・車両卸売事業の見出しを少し小さめに */
body.business-page .service-hero__title {
  font-size: 1.4rem;   /* 元:2rem → 少し小さく */
  line-height: 1.5;
  font-weight: 600;
}
@media (max-width: 768px) {
  body.business-page .service-hero__title {
    font-size: 16px;   /* 元:18px → 少し小さく */
  }
}
/* ファーストビュー Business タイトル調整 */
body.business-page .business-title {
  font-size: clamp(300px, 11vw, 550px);  /* 全体的に一段階小さく */
  top: 340px;                           /* 下へ移動（元:170px） */
}











/* ========================================== *//* ========================================== *//* ========================================== *//* ========================================== */


/**** =====================================================
  page-business（固定ID:129）専用：ヘッダーを全PCで統一
  - ロゴ左端 / メニュー右端
  - 中央幅の制限を解除（全幅行）
  - ロゴサイズ・メニュー間隔・縦幅を変数で統一管理
===================================================== ****/

/* このページだけのトークン（数値はお好みで微調整OK） */
body.page-id-129{
  --biz-hd-pad-x: 32px;   /* ヘッダー左右パディング（端からの距離） */
  --biz-hd-pad-y: 18px;   /* ヘッダー上下パディング＝縦幅感 */
  --biz-logo-h:   28px;   /* ロゴ高さ（24〜40pxで調整可） */
  --biz-gap:      32px;   /* メニュー項目の間隔 */
  --biz-font:     18px;   /* メニュー文字サイズ */
}

/* PC幅のみで適用（テーマの崩れ防止） */
@media (min-width: 769px){

  /* 行を全幅にし、左右端に寄せる */
  body.page-id-129 .site-header .inside-header{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    max-width:none !important;     /* 中央1200px制限などを解除 */
    margin:0 !important;
    padding: var(--biz-hd-pad-y) var(--biz-hd-pad-x) !important;
    box-sizing:border-box !important;
  }

  /* ロゴ：左端固定（テキストサイト名は隠す） */
  body.page-id-129 .site-branding,
  body.page-id-129 .site-logo{
    flex:0 0 auto !important;
    margin:0 !important;
  }
  body.page-id-129 .custom-logo{
    height: var(--biz-logo-h) !important;
    width:auto !important;
    max-height:none !important;
    display:block !important;
  }
  body.page-id-129 .site-title,
  body.page-id-129 .main-title{ display:none !important; }

  /* メニュー：右端固定（折返し禁止・均等間隔） */
  body.page-id-129 .main-navigation{
    margin-left:auto !important;
    margin-right:0 !important;
    float:none !important;
    display:flex !important;
    align-items:center !important;
  }
  body.page-id-129 .main-navigation .main-nav > ul{
    display:flex !important;
    gap: var(--biz-gap) !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
  }
  body.page-id-129 .main-navigation .main-nav > ul > li > a{
    font-size: var(--biz-font) !important;
    line-height:1.5 !important;
    padding:0 !important;
    font-weight:500 !important;
    text-decoration:none !important;
    color:#111 !important;
  }

  /* 過去の“ズラし”指定を無効化（保険） */
  body.page-id-129 .site-header,
  body.page-id-129 .inside-header,
  body.page-id-129 .site-branding,
  body.page-id-129 .site-logo,
  body.page-id-129 .main-navigation{
    position:relative !important;
    left:auto !important; right:auto !important; transform:none !important;
    float:none !important;
  }
}

/* 必要ならモバイルのロゴサイズもあわせる（任意） */
@media (max-width: 768px){
  body.page-id-129 .custom-logo{
    height: 22px !important;
    width:auto !important;
  }
}

/* ===== page-business (page-id:129) 専用：ロゴサイズ調整 強制版 ===== */
body.page-id-129 .site-logo img,
body.page-id-129 .site-branding img,
body.page-id-129 img.custom-logo {
  height: 22px !important;    /* ← 好みの高さに調整 (例: 18〜26px) */
  width: auto !important;
  max-height: none !important;
}








/* クリックを確実に通す＆最前面へ */
.about-button{
  position: relative;
  z-index: 2147483647;       /* てっぺん */
  cursor: pointer;
  pointer-events: auto !important;
}
.about-button img{
  display: block;
  pointer-events: none;      /* 画像がイベントを奪わない */
}

/* “かぶさり”がちなレイヤーを無効化（あれば効きます） */
.ghost-hider,
.section-mask,
.hero-overlay,
.click-blocker{
  pointer-events: none !important;
}

/* 親が transform で積層バグる保険 */
.about-button{ isolation: isolate; }

/* ボタンの親が overflow:hidden で見えない時の保険（任意） */
.about-button{ overflow: visible; }