@charset "UTF-8";

/*
 * Template: swell
 * Theme Name: SWELL CHILD
 * Theme URI: https://swell-theme.com/
 * Description: SWELLの子テーマ
 * Version: 1.0.0
 * Author: LOOS WEB STUDIO
 * Author URI: https://loos-web-studio.com/
 * License: GNU General Public License
 * License URI: http://www.gnu.org/licenses/gpl.html
 */
 @font-face {
  font-family: 'Zen Maru Gothic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/wp-content/font/zen-maru-gothic-v19-japanese_latin-500.woff2') format('woff2');
}

@font-face {
  font-family: 'Zen Maru Gothic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/wp-content/font/zen-maru-gothic-v19-japanese_latin-700.woff2') format('woff2');
}

/*
 * ANCHOR クラス名リファレンス
 *
 * [見出し]
 *   .tombo_midashi     - トンボ装飾の見出し（.tombo-wrapperで自動ラップ）
 *   .tombo-box         - トンボ装飾の汎用ボックス（グループブロックに付与）
 *   .line_midashi      - 上下ライン＋マーカー見出し
 *   .kakomi-midashi    - 囲みマーカー見出し
 *   .is-white          - line_midashiの白マーカー変種
 *
 * [カード]
 *   .custom-card-column - 汎用カード
 *   .teams-card-column  - スタッフ紹介カード
 *
 * [背景]
 *   .ac-grade    - アクセス背景グラデーション
 *   .kimidori-bg - 黄緑背景
 *   .pink-bg     - 薄ピンク背景
 *   .blue-bg     - 薄青背景
 *
 * [テーブル]
 *   .yui-basic-table  - 基本テーブル（茶ボーダー）
 *   .yui-access-table - アクセステーブル（幅80%、レスポンシブ縮小）
 *   .yui-full-table   - フル幅テーブル（幅100%）
 *
 * [ユーティリティ]
 *   .u-rounded-xs〜xl - 角丸（4px〜24px）
 *   .-border01〜04    - 角丸10px（SWELLボーダー装飾）
 *   .w-800            - max-width: 800px（カラム中央寄せ用）
 *   .no-pt            - 上余白なし
 *   .mt-2em / .mb-0em - マージン調整
 *   .sp-py-40         - SPのみpadding-bottom: 6em
 *   .visually-hidden  - 視覚的に非表示（SR用）
 *   .zenmaru          - Zen Maru Gothic適用
 *   .fuwafuwa         - ふわふわアニメーション
 *   .bg               - 背景装飾用z-index
 *   .g_map            - Google Maps埋め込み
 */


/* ============================================================
   SECTION 1. 変数定義
   ============================================================ */
:root {
    --yui-pink: #EC6D81;
    --yui-brown: #582923;
    --yui-blue: #38a1db;
    --yui-font-primary: "Zen Maru Gothic", sans-serif;
}

/* ============================================================
   SECTION 2. 関西ページ カラーオーバーライド
   ============================================================ */
#body_wrap.is-kansai {
    --color_main: var(--yui-blue);
    --color_htag: var(--yui-blue);
    --color_main_thin: rgba(0, 165, 205, 0.05);
    --color_main_dark: rgba(0, 124, 154, 1);
    --color_list_check: var(--yui-blue);
    --color_list_num: var(--yui-blue);
    --color_faq_q: var(--yui-blue);
    --color_icon_announce: var(--yui-blue);
    --color_icon_announce_bg: #e3f3fc;
}

#body_wrap.is-kansai .c-pageTitle {
    background-color: var(--yui-blue);
    color: #fff;
}

#body_wrap.is-kansai .post_content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title))::before {
    background: repeating-linear-gradient(
        90deg,
        var(--color_htag) 0%,
        var(--color_htag) 20%,
        rgba(0, 165, 205, 0.2) 90%,
        rgba(0, 165, 205, 0.2) 100%
    ) !important;
}

#body_wrap.is-kansai .c-headLogo__img {
    content: url('https://yuimawaru.co.jp/wp-content/uploads/2026/04/yui-logo-blue.svg');
}

/* ============================================================
   湘南ページ カラーオーバーライド
   適用条件: body_wrap に .is-shonan を付与
   ベースカラー: #68ae28
   ============================================================ */

#body_wrap.is-shonan {
    --color_main: #68ae28;
    --color_htag: #68ae28;
    --color_main_thin: rgba(104, 174, 40, 0.05);
    --color_main_dark: rgba(78, 130, 20, 1);
    --color_list_check: #68ae28;
    --color_list_num: #68ae28;
    --color_faq_q: #68ae28;
    --color_icon_announce: #68ae28;
    --color_icon_announce_bg: #eef6e3;
}

/* ページタイトル帯 */
#body_wrap.is-shonan .c-pageTitle {
    background-color: #68ae28;
    color: #fff;
}

/* h3 下線グラデーション */
#body_wrap.is-shonan .post_content h3:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title))::before {
    background: repeating-linear-gradient(
        90deg,
        #68ae28 0%,
        #68ae28 20%,
        rgba(104, 174, 40, 0.2) 90%,
        rgba(104, 174, 40, 0.2) 100%
    ) !important;
}

/* ヘッダーロゴ差し替え（SVG用意後にパスを修正） */
 #body_wrap.is-shonan .c-headLogo__img {
    content: url('https://yuimawaru.co.jp/wp-content/uploads/2026/04/yui-logo-green.svg');
}


/* ============================================================
   SECTION 3. グローバル・リセット
   ============================================================ */
img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
}

h1, h2, h3, h4, h5, h6,
.p-entry__head,
.wp-block-heading {
    font-family: var(--yui-font-primary) !important;
}


/* ============================================================
   SECTION 4. ヘッダー・ナビゲーション
   ============================================================ */
.-parallel .l-header__logo {
    width: 1200px;
    margin: auto;
    padding: 10px 10px !important;
}

@media not all and (min-width: 960px) {
    .l-header__inner {
        padding: 0 10px;
    }
}

/* グローバルナビ */
.c-gnav > .menu-item > a .ttl {
    font-family: var(--yui-font-primary);
    font-size: 17px;
    font-weight: 500;
}

/* ドロップダウンメニュー（サブメニュー） */
.l-header .sub-menu a {
    color: var(--yui-brown);
    font-family: var(--yui-font-primary), sans-serif;
}

.l-header .sub-menu {
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}

/* 固定ヘッダー */
#fix_header .sub-menu,
.l-fixHeader .sub-menu {
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}

#fix_header .c-gnav > li > a,
.l-fixHeader .c-gnav > li > a {
    color: var(--yui-brown) !important;
    font-family: var(--yui-font-primary), sans-serif;
}

#fix_header .sub-menu li a,
.l-fixHeader .sub-menu li a {
    color: var(--yui-brown) !important;
    font-family: var(--yui-font-primary), sans-serif;
}

.c-gnav .sub-menu a {
    color: var(--yui-brown) !important;
}

/* お問い合わせボタン（ナビ最終項目） */
.c-gnav > .menu-item:last-child {
    background: var(--color_main);
    color: #fff;
}

#fix_header .c-gnav > .menu-item:last-child > a,
.l-fixHeader .c-gnav > .menu-item:last-child > a {
    color: #fff !important;
}


/* ============================================================
   SECTION 5. レイアウト・余白
   ============================================================ */
.page .l-content,
.top #content {
    padding-top: 0;
}

@media (max-width: 960px) {
    .l-content {
        padding-top: 0;
    }
}

.post_content > .swell-block-fullWide {
    margin-bottom: 0 !important;
}

.no-pt {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

@media (max-width: 960px) {
    .sp-py-40 {
        padding-bottom: 6em !important;
    }
}


/* ============================================================
   SECTION 6. ページタイトル・アイキャッチ
   ============================================================ */
.c-pageTitle {
    background-color: var(--yui-pink);
    color: #fff;
    display: inline-block;
    padding: 2px 10px;
    font-family: var(--yui-font-primary);
    font-size: 1.6em;
    font-style: normal;
    font-weight: 500;
}

.l-topTitleArea__body {
    text-align: center;
}

.page .l-topTitleArea__body {
    text-shadow: none;
}

/* アイキャッチ画像の透過（.l-topTitleArea img = .c-filterLayer__img と同一要素） */
.l-topTitleArea img {
    opacity: 0.5 !important;
    z-index: 0;
}


/* ============================================================
   SECTION 7. トップページ（メインビジュアル）
   ============================================================ */
.Top_shadow {
    filter:
        drop-shadow(0 0 2px rgba(236, 109, 129, 0.8))
        drop-shadow(0 0 3px rgba(236, 109, 129, 0.6))
        drop-shadow(0 0 10px rgba(236, 109, 129, 0.5))
        drop-shadow(0 3px 12px rgba(0, 0, 0, 0.18));
}

.Top_txt {
    position: absolute;
    bottom: 80px;
}

@media screen and (max-width: 767px) {
    .p-mainVisual__textLayer {
        left: 50% !important;
        width: 80%;
        top: -10%;
    }
}


/* ============================================================
   SECTION 8. FV波・背景装飾
   ============================================================ */
.fv-wave-pc {
    position: absolute;
    margin: auto;
    height: auto;
    top: -24px;
    z-index: 100;
}

.fv-wave-sp {
    position: absolute;
    margin: auto;
    height: auto;
    top: -18px;
    z-index: 100;
}

.bg {
    position: relative;
    transform: translateZ(1px);
}


/* ============================================================
   SECTION 9. 見出し：トンボ（tombo_midashi / tombo-box）
   ============================================================ */

/* --- 9a. トンボ見出し（h2.tombo_midashi） --- */
.tombo-wrapper {
    position: relative !important;
    display: block !important;
}

h2.tombo_midashi {
    position: relative !important;
    padding: 60px 80px !important;
    margin: 40px auto !important;
    max-width: 1200px !important;
}

/* 左上 */
h2.tombo_midashi::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('https://yuimawaru.co.jp/wp-content/uploads/2026/01/tombo.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}

/* 右上（左右反転） */
h2.tombo_midashi::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('https://yuimawaru.co.jp/wp-content/uploads/2026/01/tombo.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    transform: scaleX(-1) !important;
}

/* 左下（180度回転） */
.tombo-wrapper::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    bottom: 10px !important;
    left: 10px !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('https://yuimawaru.co.jp/wp-content/uploads/2026/01/tombo.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    transform: rotate(180deg) scaleX(-1) !important;
    z-index: 1 !important;
    pointer-events: none !important;
    visibility: visible !important;
}

/* 右下（180度回転＋左右反転） */
.tombo-wrapper::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    bottom: 10px !important;
    right: 10px !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('https://yuimawaru.co.jp/wp-content/uploads/2026/01/tombo.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    transform: rotate(180deg) !important;
    z-index: 1 !important;
    pointer-events: none !important;
    visibility: visible !important;
}

/* トンボ見出し レスポンシブ */
@media screen and (max-width: 768px) {
    h2.tombo_midashi {
        padding: 40px 40px !important;
        max-width: 100% !important;
        font-size: 1.3rem !important;
    }

    h2.tombo_midashi::before,
    h2.tombo_midashi::after,
    .tombo-wrapper::before,
    .tombo-wrapper::after {
        width: 30px !important;
        height: 30px !important;
    }

    h2.tombo_midashi::before { top: 5px !important; left: 5px !important; }
    h2.tombo_midashi::after  { top: 5px !important; right: 5px !important; }
    .tombo-wrapper::before   { bottom: 5px !important; left: 5px !important; }
    .tombo-wrapper::after    { bottom: 5px !important; right: 5px !important; }
}

@media screen and (max-width: 599px) {
    h2.tombo_midashi::before,
    h2.tombo_midashi::after,
    .tombo-wrapper::before,
    .tombo-wrapper::after {
        display: none !important;
    }

    h2.tombo_midashi {
        padding: 20px 16px !important;
    }
}

/* --- 9b. トンボ汎用ボックス（.tombo-box） --- */
.tombo-box {
    position: relative !important;
    padding: 60px 80px !important;
    margin: 40px auto !important;
    max-width: 1200px !important;
}

/* 左上 */
.tombo-box::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('https://yuimawaru.co.jp/wp-content/uploads/2026/01/tombo.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    visibility: visible !important;
}

/* 右上（左右反転） */
.tombo-box::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    width: 40px !important;
    height: 40px !important;
    background-image: url('https://yuimawaru.co.jp/wp-content/uploads/2026/01/tombo.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    transform: scaleX(-1) !important;
    visibility: visible !important;
}

/* 下2つは .tombo-wrapper の既存CSSが効く */

/* トンボ汎用ボックス レスポンシブ */
@media screen and (max-width: 768px) {
    .tombo-box {
        padding: 40px 40px !important;
        max-width: 100% !important;
    }

    .tombo-box::before,
    .tombo-box::after {
        width: 30px !important;
        height: 30px !important;
    }

    .tombo-box::before { top: 5px !important; left: 5px !important; }
    .tombo-box::after  { top: 5px !important; right: 5px !important; }
}

@media screen and (max-width: 480px) {
    .tombo-box {
        padding: 20px !important;
    }

    .tombo-box::before,
    .tombo-box::after {
        display: none !important;
    }
}


/* ============================================================
   SECTION 10. 見出し：上下ラインとマーカー（line_midashi）
   ============================================================ */
h2.wp-block-heading.is-style-section_ttl.line_midashi {
    position: relative !important;
    padding: 0.8em 0 !important;
    text-align: center;
    display: table;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: visible !important;
    margin-bottom: 3em;
}

h2.wp-block-heading.is-style-section_ttl.line_midashi span {
    padding: 0.1em 0.2em !important;
    position: relative;
    display: inline-block;
    z-index: 2;
    font-family: var(--yui-font-primary);
}

/* マーカー色：標準（黄色） */
h2.wp-block-heading.is-style-section_ttl.line_midashi:not(.is-white) span {
    background: linear-gradient(transparent 60%, #DFF038 60%, #DFF038 85%, transparent 80%) !important;
}

/* マーカー色：白（.is-white） */
h2.wp-block-heading.is-style-section_ttl.line_midashi.is-white span {
    background: linear-gradient(transparent 60%, #ffffff 60%, #ffffff 85%, transparent 80%) !important;
}

/* 上下フルワイドライン（共通） */
h2.wp-block-heading.is-style-section_ttl.line_midashi::before,
h2.wp-block-heading.is-style-section_ttl.line_midashi::after {
    position: absolute !important;
    content: '' !important;
    display: block !important;
    width: 100vw !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    height: 1px !important;
    background-color: #333 !important;
    z-index: -1 !important;
}

h2.wp-block-heading.is-style-section_ttl.line_midashi::before {
    top: 0 !important;
}

h2.wp-block-heading.is-style-section_ttl.line_midashi::after {
    bottom: 0 !important;
}


/* ============================================================
   SECTION 11. 見出し：囲みマーカー（kakomi-midashi）
   ============================================================ */
 /*spanの余白消す*/  
h2.wp-block-heading.is-style-section_ttl.line_midashi span + br + span {
    padding-left: 0 !important;
}
h2.wp-block-heading.is-style-section_ttl.line_midashi span:has(~ br) {
    padding-right: 0 !important;
}

h2.wp-block-heading.is-style-section_ttl.kakomi-midashi {
    display: table;
    width: auto;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center;
    padding: 0.8em 1.2em !important;
    border: 1px solid #333333 !important;
    background-color: #fff !important;
    background-image: none !important;
    line-height: 1.5;
    position: relative;
    z-index: 1;
}

h2.wp-block-heading.is-style-section_ttl.kakomi-midashi span {
    position: relative;
    display: inline-block;
}

h2.wp-block-heading.is-style-section_ttl.kakomi-midashi span::before {
    content: "";
    position: absolute;
    bottom: 10%;
    left: -5px;
    right: -5px;
    height: 40%;
    background-color: #FDDDE1;
    z-index: -1;
}


/* ============================================================
   SECTION 12. 見出し補助
   ============================================================ */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
}

.heading-image-container {
    text-align: center;
    margin: 0 auto 2em;
}

/* スマートフォン向け デフォルト見出しサイズ調整 */
@media screen and (max-width: 767px) {
    .post_content h3 {
        font-size: 1.25em;
    }
}


/* ============================================================
   SECTION 13. カード：共通カード（custom-card-column）
   ============================================================ */

/* --- カラム並び：高さ揃え --- */
.custom-card-column .swell-block-columns__inner {
  align-items: stretch !important;
}

/* --- 各カード本体 --- */
.custom-card-column .swell-block-column {
  display: flex !important;
  flex-direction: column !important;
  background-color: #fff !important;
  border: 1px solid var(--yui-brown) !important;
  border-radius: 15px !important;
  padding: 0.6em 1.2em 1.2em !important;
  overflow: hidden;
}

/* --- h3 の下余白を統一（画像あり・なし共通） --- */
.custom-card-column .swell-block-column h3 {
  margin-bottom: 0.6em !important;
}

/* --- h3 直後の p（画像なしパターン） --- */
.custom-card-column .swell-block-column h3 + p {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* --- 画像：左右の padding を打ち消して幅いっぱいに --- */
.custom-card-column .swell-block-column figure {
  margin-left: -1.2em !important;
  margin-right: -1.2em !important;
  margin-bottom: 1em !important;
  width: calc(100% + 2.4em) !important;
  max-width: none !important;
}

.custom-card-column .swell-block-column img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
}

/* --- 最後の要素をカード下端に揃える（ボタン等） --- */
.custom-card-column .swell-block-column > :last-child,
.custom-card-column .swell-block-column > .wp-block-group > .wp-block-group__inner-container > :last-child {
  margin-top: auto !important;
  padding-top: 0.4em !important;
}

/* --- ↑の打ち消し：画像なしで p が最後の要素になる場合は下端揃え不要 --- */
.custom-card-column .swell-block-column > h3 + p:last-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* --- グループブロック（同期パターン）対応 --- */
.custom-card-column .swell-block-column > .wp-block-group {
  padding-top: 0 !important;
  margin-top: 0 !important;
  flex-grow: 1 !important;
}

.custom-card-column .swell-block-column > .wp-block-group > .wp-block-group__inner-container {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* --- 中央寄せ（関西2カラム等） --- */
.swell-block-columns.custom-card-column.w-800 {
  margin-left: auto;
  margin-right: auto;
}


/* カスタムカード SP表示 写真高さ修正 */
@media (max-width: 599px) {
  .custom-card-column .swell-block-column figure {
    position: relative !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
  }
  .custom-card-column .swell-block-column figure img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

/* illust-full: スマホでイラストを全部表示するクラス */	
  .custom-card-column.illust-full .swell-block-column figure {
    position: relative !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
  }
  .custom-card-column.illust-full .swell-block-column figure img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }	
	
}

/* ============================================================
   SECTION 14. カード：スタッフ紹介（teams-card-column）
   ============================================================ */
.teams-card-column .swell-block-columns__inner {
    align-items: stretch !important;
}

.teams-card-column .swell-block-column {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    background-color: #fff !important;
    border: 1px solid var(--yui-brown) !important;
    border-radius: 15px !important;
    padding: 0.8em 1.2em 0 !important;
    overflow: hidden;
    text-align: center;
}

.teams-card-column .swell-block-column figure {
    margin-left: -1.2em !important;
    margin-right: -1.2em !important;
    width: calc(100% + 2.4em) !important;
    max-width: none !important;
    margin-bottom: 0 !important;
    aspect-ratio: auto !important;
    flex-grow: 1 !important;
    overflow: hidden !important;
}

.teams-card-column .swell-block-column figure img {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center top !important;
    transform: none !important;
}

.teams-card-column .swell-block-column .swell-block-button {
    margin-top: auto !important;
    padding-top: 1em !important;
    padding-bottom: 1em !important;
}

.teams-card-column .swell-block-column h3 {
    margin-bottom: 0.6em !important;
}

/* 中央寄せ（関西スタッフ2名等） */
.swell-block-columns.teams-card-column.w-800 {
    margin-left: auto;
    margin-right: auto;
}


/* ============================================================
   SECTION 15. テーブル
   ============================================================ */
.yui-basic-table table,
.yui-basic-table th,
.yui-basic-table td {
    border-color: var(--yui-brown);
}

.yui-basic-table.is-style-simple thead td,
.yui-basic-table.is-style-simple thead th {
  border-bottom: 2px solid var(--yui-brown);
}

.yui-basic-table td:first-child {
    width: 30% !important;
}

.yui-access-table {
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    max-width: 800px;
}

.yui-access-table table,
.yui-access-table th,
.yui-access-table td {
    border-color: var(--yui-brown);
}

.yui-access-table td:first-child {
    width: 30% !important;
}

@media (max-width: 960px) {
    .yui-access-table {
        width: 90%;
    }
}

@media screen and (max-width: 768px) {
    .yui-access-table {
        width: 100%;
    }
}

.yui-full-table {
    width: 100%;
    max-width: none;
}

.yui-full-table table,
.yui-full-table th,
.yui-full-table td {
    border-color: var(--yui-brown);
}


/* ============================================================
   SECTION 16. ボタン
   ============================================================ */
.is-style-btn_line a {
    background-color: rgba(255, 255, 255, 1);
}


/* ============================================================
   SECTION 17. Google Maps
   ============================================================ */
.g_map {
    height: 0;
    padding-top: 50%;
    position: relative;
    width: 100%;
}

.g_map iframe,
.g_map object,
.g_map embed {
    border-radius: 15px;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}


/* ============================================================
   SECTION 18. 背景ユーティリティ
   ============================================================ */
.ac-grade {
    background-image: linear-gradient(180deg, rgba(58, 233, 241, 0), rgba(97, 223, 229, 1) 61%, rgba(65, 164, 253, 1));
}

.kimidori-bg {
    background-color: #F6FDC4 !important;
}

.pink-bg {
    background-color: #FFF4F6 !important;
}

.blue-bg {
    background-color: #E3F9FE !important;
}


/* ============================================================
   SECTION 19. 角丸ユーティリティ
   ============================================================ */
.u-rounded-xs, .u-rounded-xs img { border-radius: 4px; }
.u-rounded-sm, .u-rounded-sm img { border-radius: 8px; }
.u-rounded-md, .u-rounded-md img { border-radius: 12px; }
.u-rounded-lg, .u-rounded-lg img { border-radius: 16px; }
.u-rounded-xl, .u-rounded-xl img { border-radius: 24px; }

/* SWELLボーダー装飾の角丸 */
.-border01,
.-border02,
.-border03,
.-border04 {
    border-radius: 10px;
}


/* ============================================================
   SECTION 20. 汎用ユーティリティ
   ============================================================ */
.w-800 {
    max-width: 800px !important;
}

.mt-2em  { margin-top: 2em !important; }
.mb-0em  { margin-bottom: 0em !important; }
.zenmaru { font-family: var(--yui-font-primary); }


/* ============================================================
   SECTION 21. アニメーション
   ============================================================ */

/* ふわふわ */
.fuwafuwa {
    animation: fuwafuwa 2.6s infinite;
}

@keyframes fuwafuwa {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-10px); }
}

/* メインビジュアル レイヤー制御 */
.p-mainVisual__slideLayer {
    z-index: 2;
    position: relative;
}

.p-mainVisual__bgLayer {
    z-index: 1;
    position: relative;
}


/* ============================================================
   SECTION 22. 印刷設定
   ============================================================ */
@media print {
    .sp_contact,
    .top_title {
        display: none !important;
    }
}
/* ============================================================
   SECTION 23. フッター
   ============================================================ */
/* フッターメニュー：Zen Maru Gothic + 茶色 */
.l-footer .c-listMenu a {
  font-family: var(--yui-font-primary), sans-serif;
  color: var(--yui-brown);
}

/* フッタープロフィール：茶色 */
.l-footer .p-profileBox {
  color: var(--yui-brown);
}
.l-footer .p-profileBox__name {
  color: var(--yui-brown);
}
.l-footer .p-profileBox__text {
  color: var(--yui-brown);
}

/* ============================================
   関西・湘南 H1タイトル改行制御
   ============================================


/* ----- 共通スタイル ----- */
.page-id-1372 .c-pageTitle,
.page-id-2141 .c-pageTitle,
.page-id-2151 .c-pageTitle {
  margin-inline: auto;
  word-break: keep-all;
  overflow-wrap: break-word;
}

/* --- /kansai/contact/ （YUIMAWARU KANSAI お問い合わせ） --- */
.page-id-1372 .c-pageTitle {
  max-width: 15em;
}

/* --- /shonan/ （ゆいまわるSHONAN 神奈川事業部） --- */
.page-id-2141 .c-pageTitle {
  max-width: 12em;
}

/* --- /shonan/contact/ （ゆいまわるSHONAN お問い合わせ） --- */
.page-id-2151 .c-pageTitle {
  max-width: 14em;
}


/* ----- スマホ（599px以下） ----- */
@media screen and (max-width: 599px) {
  .page-id-1372 .c-pageTitle,
  .page-id-2141 .c-pageTitle,
  .page-id-2151 .c-pageTitle {
    max-width: none;
    font-size: 1.25rem;
  }
}

/* ----- タブレット（600px〜959px） ----- */
@media screen and (min-width: 600px) and (max-width: 959px) {
  .page-id-1372 .c-pageTitle,
  .page-id-2141 .c-pageTitle,
  .page-id-2151 .c-pageTitle {
    max-width: none;
  }
}