.elementor-kit-9{--e-global-color-primary:#000019;--e-global-color-secondary:#324BC8;--e-global-color-text:#000019;--e-global-color-accent:#324BC8;--e-global-color-d4da88e:#FFFFFF00;--e-global-color-a4d85cb:#FFFFFF;--e-global-color-a32d0f6:#F5F5FA;--e-global-color-838ddf0:#DCDCE1;--e-global-color-8f24ac9:#B4B4B9;--e-global-color-48cb877:#E10032;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-weight:500;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-weight:500;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:600;--e-global-typography-de6c505-font-family:"Zen Kaku Gothic Antique";--e-global-typography-de6c505-font-weight:500;}.elementor-kit-9 e-page-transition{background-color:var( --e-global-color-primary );}.elementor-kit-9 a{color:var( --e-global-color-text );}.elementor-kit-9 a:hover{color:var( --e-global-color-accent );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===============================
   フォーカス時のスタイル（キーボードユーザー向け）
================================= */
:focus {
  outline: 1px solid #ffffff00; /* フォーカス枠線 */
  outline-offset: 1px;        /* 枠線を少し離す */
}

/* ===============================
   選択テキストのスタイル
================================= */
::selection {
  color: #ffffff;            /* 文字色 */
  background-color: #324BC8; /* 選択時の背景色 */
}

/* ===============================
   ヘッダー（共通設定）
================================= */
.sticky-header {
  width: 100% !important;
  left: 0;
  right: 0;
  background: transparent;
  transition: all 0.6s ease;
  padding: 60px 90px; /* PCデフォルト */
}

/* レスポンシブ調整（ヘッダー） */
@media (max-width: 1366px) {
  .sticky-header { padding: 33px 40px; }
}
@media (max-width: 1024px) {
      .sticky-header { padding: 33px 30px; }
}
@media (max-width: 768px) {
  .sticky-header { padding: 13px 20px; }
}

/* ロゴ切替（初期：白） */
.sticky-header .logo-white { display: block; }
.sticky-header .logo-black { display: none; }

/* メニュー文字（初期：白） */
.sticky-header .elementor-widget-n-menu 
  .e-n-menu-title:not(.e-current):not(:hover) 
  .e-n-menu-title-container .e-n-menu-title-text {
  color: #fff;
  transition: color 0.6s ease;
}

/* アイコン（初期：白 → hover時 青） */
.sticky-header .elementor-widget-icon svg path {
  fill: #fff;
  transition: fill 0.6s ease;
}

.sticky-header .elementor-widget-icon:hover svg path,
.elementor-sticky--effects.sticky-header .elementor-widget-icon:hover svg path {
  fill: #324BC8;
}

/* ===============================
   ヘッダー（スクロール後 sticky）
================================= */
.elementor-sticky--effects.sticky-header {
  background: #ffffffE6;
  box-shadow: 0 2px 60px #0000190D;
  padding: 18px 90px; /* PCデフォルト */
}

/* レスポンシブ調整（sticky） */
@media (max-width: 1366px) {
  .elementor-sticky--effects.sticky-header { padding: 13px 40px; }
}
@media (max-width: 1024px) {
  .elementor-sticky--effects.sticky-header { padding: 18px 30px; }
}
@media (max-width: 768px) {
  .elementor-sticky--effects.sticky-header { padding: 3px 20px; }
}

/* ロゴ切替（sticky後：黒） */
.elementor-sticky--effects.sticky-header .logo-white { display: none; }
.elementor-sticky--effects.sticky-header .logo-black { display: block; }

/* メニュー文字（sticky後：黒） */
.elementor-sticky--effects.sticky-header .elementor-widget-n-menu 
  .e-n-menu-title:not(.e-current):not(:hover) 
  .e-n-menu-title-container .e-n-menu-title-text {
  color: #000019;
}

/* アイコン（sticky後：黒） */
.elementor-sticky--effects.sticky-header .elementor-widget-icon svg path {
  fill: #000019;
}

/* ハンバーガー（sticky後：黒） */
.elementor-sticky--effects.sticky-header .hamburger:not(.is-active) .hamburger-inner,
.elementor-sticky--effects.sticky-header .hamburger:not(.is-active) .hamburger-inner::before,
.elementor-sticky--effects.sticky-header .hamburger:not(.is-active) .hamburger-inner::after {
  background-color: #000019;
}
/* ハンバーガー（sticky後：開いている時 → デフォルト維持） */
.elementor-sticky--effects.sticky-header .hamburger.is-active .hamburger-inner,
.elementor-sticky--effects.sticky-header .hamburger.is-active .hamburger-inner::before,
.elementor-sticky--effects.sticky-header .hamburger.is-active .hamburger-inner::after {
  /* transform保持のため色指定なし */
}

/* ===============================
   スクロールコンテナ設定
================================= */
.scroll-container {
  scroll-snap-type: y proximity; /* セクションごとに縦方向スナップ */
  overflow-y: scroll;            /* 縦スクロール有効 */
  scroll-behavior: smooth;       /* スクロールを滑らかに */
}

/* ===============================
   スライドバー ベース
================================= */
.slide-bar {
  position: relative;
  overflow: hidden;
}

/* overlay */
.slide-bar::before,
.slide-bar::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #fff;
  transform: scaleY(1);
  transform-origin: top;
  z-index: 10;
}

/* fadeIn 発火時 */
.slide-bar.fadeIn::before,
.slide-bar.fadeIn::after {
  animation: showOverlay 0.6s cubic-bezier(0.4,0,0.2,1) forwards;
}

.slide-bar.fadeIn::before { animation-delay: 0s; z-index: 10; }
.slide-bar.fadeIn::after  { animation-delay: 0.3s; z-index: 5; }

/* overlayアニメーション */
@keyframes showOverlay {
  0%   { transform: scaleY(1); }
  100% { transform: scaleY(0); }
}

/* 画像フェードイン */
.slide-bar img {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.slide-bar.fadeIn img {
  opacity: 1;
  transform: translateY(0);
}

/* ===============================
   このウィジェット内の段落設定
================================= */
.elementor-kit-9 p {
  margin: 0;          /* Elementor が自動で付ける余白を削除 */
}

/* ===============================
   SplitText で生成された行ごとの要素 (.line)
   → 改行で余計なスペースが入らないよう調整
================================= */
.elementor-kit-9 .line {
  display: block;     /* 行として扱う */
  margin: 0;          /* 余計な上下余白を削除 */
  padding: 0;         /* 内側の余白も削除 */
  line-height: inherit; /* 親の行間を継承 */
  white-space: normal;       /* 改行を許可する（はみ出し防止の鍵） */
  overflow-wrap: break-word;  /* 単語が長すぎる場合も枠内で折り返す */
}

/* Elementor > 高度な設定 > カスタムCSS に追加 */
.horizontal-scroll::-webkit-scrollbar {
  height: 2px; /* スクロールバーの太さ */
}

.horizontal-scroll::-webkit-scrollbar-track {
  background: #fff; /* 背景 */
}

.horizontal-scroll::-webkit-scrollbar-thumb {
  background: #000019; /* バーの色 */
  border-radius: 0px;
}

.horizontal-scroll::-webkit-scrollbar-thumb:hover {
  background: #fff;
}

:target {
  scroll-margin-top: 180px;
}

/* ==========================================
   news-sync：JetButton 連動ホバー制御
   （テキスト＋アイコン 同期アニメーション）
========================================== */

/* ==========================================
   ① トランジション保証
   Jet側のアニメーションを安定させる
========================================== */

.news-sync .jet-button__state,
.news-sync .jet-button__state-hover,
.news-sync .jet-button__plane,
.news-sync .jet-button__plane-hover {
  transition: all 0.35s ease;
}


/* ==========================================
   ② 通常テキスト → 上へスライドアウト
========================================== */

.news-sync:hover .jet-button__state {
  transform: translateY(-100%) !important;
  opacity: 0 !important;
}


/* ==========================================
   ③ テキスト hover状態を表示
   下からスライドイン
========================================== */

.news-sync:hover .jet-button__state-hover {
  transform: translateY(0) !important;
  opacity: 1 !important;
}


/* ==========================================
   ④ 背景プレーンのホバー制御
========================================== */

.news-sync:hover .jet-button__plane {
  transform: translateX(100%) !important;
}

.news-sync:hover .jet-button__plane-hover {
  transform: translateY(0) !important;
}

/* ==================================================
   Elementor専用：開閉連動アニメーション
   対応：Off-Canvas, ポップアップ, モバイルメニュー
================================================= */

/* 1. 初期状態：閉じている時は非表示＆位置をずらす */
.offcanvas-animate {
  opacity: 0 !important;
  transform: translateY(15px) !important;
  transition: none !important; /* 閉じる時は即座にリセット（毎回発火の肝） */
  will-change: opacity, transform;
}

/* 2. 発火：親要素が「開いた状態」になった時 */
/* Elementor Off-Canvas 用 */
.e-off-canvas[aria-hidden="false"] .offcanvas-animate,
/* Elementor ポップアップ / モバイルメニュー用 */
[data-elementor-open] .offcanvas-animate,
.elementor-menu-cart--opened .offcanvas-animate,
.is-active .offcanvas-animate {
  opacity: 1 !important;
  transform: translateY(0) !important;
  
  /* 動きの質：少し溜めを作ってから優雅に浮き上がる設定 */
  transition: 
    opacity 0.9s cubic-bezier(0.15, 1, 0.3, 1) 0.9s, 
    transform 0.9s cubic-bezier(0.15, 1, 0.3, 1) 0.9s !important;
}

/* 3. 【おまけ】並んでいる要素を順番に時間差で出したい場合 */
/* クラスに "delay-1", "delay-2" と追加するだけでOK */
.offcanvas-animate.delay-1 { transition-delay: 0.3s !important; }
.offcanvas-animate.delay-2 { transition-delay: 0.6s !important; }
.offcanvas-animate.delay-3 { transition-delay: 0.9s !important; }/* End custom CSS */