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

html {
  scroll-padding-top: 180px; /* sticky headerの高さ＋余白 */
}

/* TypeSquare Webfonts Plugin for XSERVER */
.nijimiMgo { font-family: "秀英にじみ丸ゴシック B", sans-serif; }

/* 表示用フォント（h2.font-display など）の約物詰め */
.font-display {
    font-feature-settings: "palt" 1;
    text-spacing-trim: trim-start; /* モダンブラウザでさらに精度UP */
}

.turquoise {
    color:#009799!important;
}

/* ============================================
   フッター（#brxe-jvzpys）スタイル
   ============================================ */

:root {
  /* ---- アイコン ----
     本番移行時：url() の "/dev" 部分を削除 */
  --icon-menu-parent: url("/tc2607/wp-content/uploads/2026/05/icon_arrow_gr.svg");
  --icon-menu-child:  url("/tc2607/wp-content/uploads/2026/05/icon_line_gr.svg");

  /* ---- 波形シェイプ ----
     振幅UP版：制御点を強めつつ viewBox を上拡張して見切れ回避
     調整: c の制御点y で振幅、viewBox min-y で上余白を確保 */
  --shape-bg-footer: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 -30 1440 130' preserveAspectRatio='none'><path d='M623.9,50c291.6,50,657.1,40,815.6,0V100H-1.5V50c95.1,-25,367.7,-70,625.4,0Z' fill='%23fff'/></svg>");

  /* ---- レイアウト変数 ---- */
  --footer-wave-h: 150px;       /* 波形帯の高さ（PC） */
  --footer-dot-color: #FFF8F8;  /* ドットの色 */
  --footer-wave-color: #fff8f8; /* 波形帯の色 */
  --footer-bg-color: #ffffff;   /* フッター地色 */
}

/* SPで波形帯を低くする */
@media (max-width: 478px) {
  :root {
    --footer-wave-h: 80px;
  }
}

/* ============================================
   ドット背景パターン（teal #1aa1a3・丸ドット）
   下端に波形カットアウト（次セクション色 #fff8f8 を見せる）
   採用情報セクション等、複数ページで使用
   ============================================ */

.bg-dots-teal {
  position: relative;
  isolation: isolate;
  overflow: hidden; /* 念のため：波形が左右にはみ出した時用 */

  /* ドットパターン */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24'><circle cx='3' cy='3' r='2.5' fill='%231aa1a3'/></svg>");
  background-repeat: repeat;
}

/* 下端の波形（カマボコ） */
.bg-dots-teal::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;                    /* サブピクセル隙間対策で1pxはみ出させる */
  width: 100%;
  aspect-ratio: 1440 / 105.89;     /* SVG固有の比率を維持 */

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 105.89' preserveAspectRatio='none'><path fill='%23FFF8F8' d='M720.05,0C456.88,0,209.56,38.42-5.37,105.89h1450.84C1230.54,38.42,983.22,0,720.05,0Z'/></svg>");
  background-size: 100% 100%;
  background-repeat: no-repeat;

  pointer-events: none;             /* クリックを透過 */
  z-index: 1;                       /* 親の背景より前、内側コンテンツより前面（後述） */
}

.bg-dots-recruit {
  position: relative;
  isolation: isolate;
  overflow: hidden; /* 念のため：波形が左右にはみ出した時用 */

  /* ドットパターン */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24'><circle cx='3' cy='3' r='2.5' fill='%231aa1a3'/></svg>");
  background-repeat: repeat;
}


/* ============================================
   ドット背景パターン（sage #d6eade・ペールグリーン ドット）
   下端に波形カットアウト（次セクション色 #fff8f8 を見せる）
   ============================================ */

.bg-dots-sage {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  background-color: #d6eade;

  /* ドットパターン（#f2f9eb） */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24'><circle cx='3' cy='3' r='2.5' fill='%23f2f9eb'/></svg>");
  background-repeat: repeat;
}

/* 下端の波形（カマボコ） */
.bg-dots-sage::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  width: 100%;
  aspect-ratio: 1440 / 105.89;

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 105.89' preserveAspectRatio='none'><path fill='%23FFF8F8' d='M720.05,0C456.88,0,209.56,38.42-5.37,105.89h1450.84C1230.54,38.42,983.22,0,720.05,0Z'/></svg>");
  background-size: 100% 100%;
  background-repeat: no-repeat;

  pointer-events: none;
  z-index: 1;
}


/* ============================================
   ドット背景パターン（mint #DDF2F2・白ドット）
   ヒーローセクション等、明るい印象のセクションで使用
   ============================================ */

.bg-dots-mint {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  background-color: #DDF2F2;

  /* ドットパターン（白） */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24'><circle cx='3' cy='3' r='2.5' fill='%23FFFFFF'/></svg>");
  background-repeat: repeat;
}


/* 下端の波形（カマボコ） */
.bg-dots-mint::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  width: 100%;
  aspect-ratio: 1440 / 105.89;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 105.89' preserveAspectRatio='none'><path fill='%23FFF8F8' d='M720.05,0C456.88,0,209.56,38.42-5.37,105.89h1450.84C1230.54,38.42,983.22,0,720.05,0Z'/></svg>");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 1;
}


/* ============================================
   フッター本体
   ============================================ */

#brxe-jvzpys {
  position: relative;
  isolation: isolate;

  /* 地色 + ドットパターン */
  background-color: var(--footer-bg-color);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24'><rect width='6' height='6' fill='%23FFF8F8'/></svg>");
  background-repeat: repeat;
}

/* 上端の波形帯 */
#brxe-jvzpys::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;                 /* top:0 / left:0 / right:0 のショートハンド */
  height: var(--footer-wave-h);
  background-color: var(--footer-wave-color);

  -webkit-mask-image: var(--shape-bg-footer);
          mask-image: var(--shape-bg-footer);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;

  transform: scaleY(-1);             /* 上下反転：上端塗り・下端波形 */
  z-index: -1;
  pointer-events: none;
}

/* ============================================
   フッター ナビメニュー アイコン
   ============================================ */

#brxe-jvzpys .bricks-nav-menu li.menu-item {
  position: relative;
  padding-left: 24px;
  list-style: none;
}

#brxe-jvzpys .bricks-nav-menu li.menu-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#brxe-jvzpys .bricks-nav-menu li.parent::before {
  width: 17px;
  height: 17px;
  background-image: var(--icon-menu-parent);
}

#brxe-jvzpys .bricks-nav-menu li.child::before {
  width: 12px;
  height: 2px;
  background-image: var(--icon-menu-child);
}