/* ------------全ページ共通------------ */


/* ページヘッダーのマスク */
/* ---------------------------------------------------------------------- */
.c-page-header__bgimage::after {
    content: '';
    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at center,
            rgba(255, 255, 255, 0.8) 0%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0) 70%
        ),
        linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0.8) 0%,
            rgba(255, 255, 255, 0.2) 50%,
            rgba(255, 255, 255, 0.6) 100%
        );
}

.c-page-header__title {
    color: #333;
    font-weight: 800;
    letter-spacing: 0.3em;
    text-shadow:
        0 1px 0 #fff,
        0 0 8px rgba(0, 0, 0, 0.2);
    font-size: clamp(28px, 4vw, 48px);
}

.c-page-header__title::after {
    content: '';
    display: block;
    width: 64px;
    height: 3px;
    background: #222;
    margin-top: 12px;
}



/* ページヘッダーのマスク */
/* ---------------------------------------------------------------------- */
/* ==================================================
  Snow Monkey: Page Header 画像をゆっくりズーム
  - 外枠は固定
  - 画像だけ拡大（はみ出しは隠す）
  対象: .c-page-header__bgimage 内の img
================================================== */

/* 外枠でトリミング */
.c-page-header__bgimage {
  overflow: hidden;
}

/* 画像をズーム */
.c-page-header__bgimage > img {
  display: block;
  width: 100%;
  height: 100%;

  /* 画像の見え方を安定させる（cover相当） */
  object-fit: cover;
  object-position: center;

  /* アニメーション */
  transform: scale(1);
  transform-origin: center;
  animation: xcs-pageheader-img-zoom 15s ease-out forwards;

  /* 描画最適化 */
  will-change: transform;
}

/* ズーム量：必要なら 1.05〜1.15 で調整 */
@keyframes xcs-pageheader-img-zoom {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.20);
  }
}

/* モバイルはズームしすぎ回避（任意） */
@media (max-width: 768px) {
  .c-page-header__bgimage > img {
    animation-duration: 10s;
  }
  @keyframes xcs-pageheader-img-zoom {
    from { transform: scale(1); }
    to   { transform: scale(1.10); }
  }
}

/* 動きを抑えたい設定に追従 */
@media (prefers-reduced-motion: reduce) {
  .c-page-header__bgimage > img {
    animation: none;
    transform: none;
  }
}




/* ヘッダーメニュー「お申し込み」だけボタン化
カスタマイザーの「ヘッダーコンテンツ」で、該当htmlを挿入 */
/* ---------------------------------------------------------------------- */
.xcs-menu-apply {
    margin-top: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.8em;
    /* ボタンの内側余白 */
    border-radius: 999px;

    background: #f28c28;
    /* ベースをオレンジにするならここ */
    color: #fff;
    border: 1px solid transparent;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    /* 折り返し防止 */
    transition:
        background 0.5s ease,
        color 0.5s ease,
        border-color 0.5s ease;
    /* ホバーのフィルタ変化をスムーズに */
}

.xcs-menu-apply:hover {
    color: #f28c28;
    background: #fff;
    border: 1px solid #f28c28;
}



/* フッターのCTAボタン（snow monkey editorでPCは非表示（ヘッダーにあるから）） */
/* ---------------------------------------------------------------------- */
.xcs-footer-cta {
    padding: 30px 30px !important;
    text-align: center;

    background:
        radial-gradient(
            circle at center,
            rgba(242, 140, 40, 0.08) 0%,
            rgba(242, 140, 40, 0.04) 45%,
            rgba(242, 140, 40, 0.02) 70%,
            rgba(242, 140, 40, 0) 100%
        ),
        #ffffff;
}

/* フッターの上部余白をなくす（フッターCTA付くので） */
.l-footer {
    padding-top: 0px !important;
}