@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
*/

/* フォント */
.zen-maru-gothic-light {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.zen-maru-gothic-regular {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.zen-maru-gothic-medium {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.zen-maru-gothic-bold {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.zen-maru-gothic-black {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 900;
  font-style: normal;
}




/* Body */
body {
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 500;
    font-style: normal;
}



/* =========================================
   角丸画像用の共通クラス
========================================= */
.image-round img {
    border-radius: 1.5rem !important;
    overflow: hidden;
}

.image-round-s img {
    border-radius: 0.5rem !important;
    overflow: hidden;
}



/* =========================================
   マージン
========================================= */
.u-mb-5 {
    margin-bottom: 0.5em !important;
}

.u-mb-70 {
    margin-bottom: 7em !important;
}

.u-mb-80 {
    margin-bottom: 8em !important;
}

.u-mb-90 {
    margin-bottom: 9em !important;
}

.u-mb-100 {
    margin-bottom: 10em !important;
}



/* =========================================
   パディング
========================================= */
.o-pt-100 {
    padding-top: 100px !important;
}

@media screen and (max-width: 767px) {
    .o-pt-100 {
        padding-top: 50px !important;
    }
}



/* =========================================
   テキスト揃え
========================================= */
@media screen and (max-width: 767px) {
    .text-left {
        text-align: left !important;
    }
}



/* =========================================
   行間
========================================= */
.line-height01 {
    line-height: 1.2;
}



/* =========================================
   非表示設定
========================================= */
.view-hide {
    display: none;
}


/* =========================================
   ノーマルボタン（is-style-btn_normal）の右側に矢印を追加
========================================= */

/* ボタン本体を矢印配置の基準点にする */
.swell-block-button.is-style-btn_normal .swell-block-button__link {
    position: relative !important;
}

/* 矢印（→）の生成と配置 */
.swell-block-button.is-style-btn_normal .swell-block-button__link::after {
    content: "\2192" !important; /* 「→」のUnicode */
    position: absolute !important;
    top: 50% !important;
    right: 25px !important; /* 右端からの距離（お好みで調整してください） */
    transform: translateY(-50%) !important;
    
    /* 矢印の見た目の調整 */
    font-size: 1.2em; /* 矢印の大きさ */
    font-weight: normal; /* 太さを細めに設定 */
    transition: transform 0.3s ease; /* （おまけ）ホバー時のアニメーション準備 */
}

/* （オプション）マウスオーバー時に矢印が少し右に動くアクション */
.swell-block-button.is-style-btn_normal .swell-block-button__link:hover::after {
    transform: translate(5px, -50%) !important;
}




/* =========================================
   共通ボタン（more-btn-m）の横幅拡張
========================================= */
.post_content .more-btn-m .swell-block-button__link {
    width: 250px !important; /* ここでお好みの横幅に調整してください（例：400px、80% など） */
    max-width: 100% !important; /* スマホ画面ではみ出さないための安全対策 */
    box-sizing: border-box !important;
}




/* =========================================
   共通固定ボタン（スタッフ募集・見学会）
========================================= */
.header-flex-bt {
    /* スクロールしても固定する設定 */
    position: fixed;
    top: 107px; /* SWELLのヘッダーの高さに合わせて数値を調整してください（例：100pxなど） */
    right: 0;  /* 画面右端に配置 */
    z-index: 9999; /* 他の要素より手前に表示 */
    
    /* ボタンの並び設定（横並び） */
    display: flex;
    flex-direction: row; /* 横並びに変更 */
    gap: 0; /* 画像のように隙間なく並べる */
    
    /* リストの初期設定をリセット */
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ボタン単体の設定とホバーアクション */
.header-flex-bt li {
    cursor: pointer;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2)); /* 軽い影をつける */
    transition: all 0.3s ease;
}

/* マウスオーバー時の動き（少し明るく、少し浮く） */
.header-flex-bt li:hover {
    transform: translateY(-2px);
    opacity: 0.9;
}

/* =========================================
   スマホ（SP）表示時の調整
========================================= */
@media screen and (max-width: 767px) {
    .header-flex-bt {
        top: 54px; /* スマホ版ヘッダーの高さに合わせて調整してください */
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }
    
    .header-flex-bt img {
        width: 50px; /* スマホ閲覧時に邪魔にならないようサイズを縮小 */
        height: auto;
    }
    
    /* スライドメニューが開いている時はボタンを隠す */
    html[data-spmenu="opened"] .header-flex-bt {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important; /* タップも無効化 */
    }
}

/* =========================================
   パンくずリスト
========================================= */
#breadcrumb {
    background-color: #FCF7F4 !important;
}

/* =========================================
   下層ページヘッダー下部の波形オーバーレイ
========================================= */
.l-topTitleArea {
    position: relative !important;
    min-height: 500px;
}

.l-topTitleArea::after {
    content: "";
    position: absolute;
    bottom: -1px; /* 画像と波の間にできる1pxの隙間を防止 */
    left: 0;
    width: 100%;
    
    /* 波の高さ（画面幅に応じて可変するようにvwを使用） */
    height: 4vw; 
    min-height: 20px; /* スマホ表示などで潰れすぎないための最小の高さ */
    
    /* 2枚目の波画像のURLに書き換えてください */
    background-image: url('/wp/wp-content/uploads/2026/09/header-nami-scaled.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% 100%;
    
    z-index: 2; /* 写真より前面に表示 */
    pointer-events: none; /* クリック操作の邪魔にならないようにする */
}

@media screen and (max-width: 768px) {
    .l-topTitleArea {
        min-height: 250px !important;
    }
}

/* =========================================
   下層ページヘッダー：テキスト背景の白グラデーション
========================================= */
.l-topTitleArea::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    /* 左から右へ向かって「白→透明」になるグラデーション */
    background: linear-gradient(to right, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 60%);
    
    z-index: 1; /* 写真より上、波形(z-index: 2)より下に配置 */
    pointer-events: none;
}

/* グラデーションに埋もれないようにテキストを一番手前に出す */
.l-topTitleArea .c-titleArea__body {
    position: relative;
    z-index: 3 !important; 
}

@media screen and (max-width: 768px) {
    .l-topTitleArea::before {
        /* グラデーションをリセットし、全体に50%の白を被せる */
        background: rgba(0, 0, 0, 0.1) !important;
    }
}


/* =========================================
   下層ページヘッダータイトル文字調整
========================================= */
.l-topTitleArea__body {
    text-shadow: 3px 3px 5px rgba(0, 0, 0, .5);
}
.c-pageTitle {
    font-size: 2.75em;
}

@media screen and (max-width: 768px) {
    .l-topTitleArea__body {
        text-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
    }
    
    .c-pageTitle {
        font-size: 1.75em;
        text-align: center;
    }
}




























/* =========================================
   メインビジュアル内 ブログパーツのレイアウト調整（PC版）
========================================= */
@media screen and (min-width: 960px) {
    /* 1. ブログパーツ全体を左寄せにし、位置を微調整 */
    .p-mainVisual__textLayer .p-blogParts {
        width: 100%;
        max-width: 600px;
        margin-right: auto;
        text-align: left;
        padding-left: 0;
        margin-left: clamp(-80px, calc(-50vw + 500px), 0px); 
        transform: translateY(-100px); /* 上への引き上げ（そのまま） */
    }

    /* 2. メインコピー画像（英語を学ぶより...）のサイズ調整と左寄せ */
    .p-mainVisual__textLayer .p-blogParts figure.wp-block-image {
        margin-left: 0;
        margin-right: auto;
        margin-bottom: 2em; /* 下のテキストとの余白 */
        text-align: left;
    }
    .p-mainVisual__textLayer .p-blogParts figure.wp-block-image img {
        width: 100%;
        max-width: 500px; /* コピー画像の最大サイズを調整 */
        height: auto;
    }

    /* 3. リード文（ことばだけじゃない...）の調整 */
    .p-mainVisual__textLayer .p-blogParts p {
        font-weight: 700;
        text-align: left; 
        font-size: 1.1rem; 
        line-height: 1.8; 
        margin-bottom: 2.5em; 
        text-shadow: none !important; 
        color: #333; 
        padding-left: 30px; /* ここを追記：左に30pxの余白 */
    }

    /* 4. 横並びボタンブロック全体（wp-block-columns）の調整 */
    .p-mainVisual__textLayer .p-blogParts .wp-block-columns {
        justify-content: flex-start; 
        gap: 20px !important; /* 枠同士の隙間を20pxに固定 */
        margin-left: 0;
        padding-left: 30px; 
    }
    
    /* カラム（個別の枠）の余計な余白と幅設定を強制リセット */
    .p-mainVisual__textLayer .p-blogParts .wp-block-column {
        flex-basis: auto !important;
        flex-grow: 0 !important;
        min-width: 0 !important; /* 以前の200px指定を解除して、画像サイズに枠を合わせる */
        margin-left: 0 !important; /* WordPress標準の勝手につく左マージンを消去 */
    }

    /* 画像サイズの指定（50%ではなく、上限のpxを指定する方が綺麗に揃います） */
    .p-mainVisual__textLayer .p-blogParts .wp-block-column img {
        width: 100% !important; 
        max-width: 220px !important; /* ここでボタンの大きさを調整（例：160px〜200pxなどお好みで） */
        height: auto;
    }
    
    /* カラム内の個別のボタン幅調整 */
    .p-mainVisual__textLayer .p-blogParts .wp-block-column {
        flex-basis: auto !important; /* SWELLの自動幅をリセット */
        flex-grow: 0;
        min-width: 200px; /* ボタンの最小幅 */
    }
}

/* =========================================
   PC表示時：スマホ用の装飾HTMLを隠す
========================================= */
.p-mv-mobile-decor {
    display: none;
}

/* =========================================
   スマホ・タブレット表示時（959px以下）のレイアウト
========================================= */
@media screen and (max-width: 959px) {
    
    /* --- 1. ブログパーツ全体の調整 --- */
    .p-mainVisual__textLayer .p-blogParts {
        position: relative !important; /* 装飾配置の「基準点」にする */
        margin-top: 300px !important; /* 人物の顔を避けて下げる */
        padding: 0 !important;
        text-align: center;
    }
    
    /* PC用のメインコピー画像を非表示 */
    .p-mainVisual__textLayer .p-blogParts figure.main-copy {
        display: none;
    }
    
    /* --- 2. キャッチコピー（段落）のテキスト調整 --- */
    .p-mainVisual__textLayer .p-blogParts p {
        text-align: center;
        font-size: 16px !important; 
        color: #432724 !important; 
        text-shadow: none !important; /* ドロップシャドウを消去 */
        margin-bottom: 1.5em;
        padding-left: 0 !important;
    }

    /* --- 3. 画像ボタン（CTA）の横並び設定 --- */
    .p-mainVisual__textLayer .p-blogParts .wp-block-columns.main-cta-btn {
        display: flex !important;
        flex-direction: row !important; 
        flex-wrap: nowrap !important;
        gap: 10px !important;
        padding-left: 0 !important;
    }
    
    /* カラムをちょうど50%ずつの幅にする */
    .p-mainVisual__textLayer .p-blogParts .wp-block-columns.main-cta-btn > .wp-block-column {
        flex: 1 1 50% !important;
        width: 50% !important;
        margin-bottom: 0 !important;
    }

    /* 中の画像をカラム幅に100%フィットさせる */
    .p-mainVisual__textLayer .p-blogParts .wp-block-columns.main-cta-btn img {
        width: 100% !important;
        height: auto !important;
        display: block;
    }

    /* --- 4. スマホ専用装飾の表示とベースレイアウト --- */
    .p-mv-mobile-decor {
        display: block !important;
        position: absolute !important;
        top: 0; left: 0;
        width: 100%; height: 100%;
        pointer-events: none; /* クリックの邪魔にならないようにする */
        z-index: 0;
    }

    /* キャッチコピーやボタンをイラストより前面に出す */
    .p-mainVisual__textLayer .p-blogParts > *:not(.p-mv-mobile-decor) {
        position: relative;
        z-index: 2;
    }

    /* 個別イラストの共通設定 */
    .mv-decor-item {
        position: absolute;
        height: auto;
    }

    /* --- 5. 各イラストの配置 --- */
    .mv-decor-hello {
        top: -70px; 
        left: -5%;
        width: 120px; 
    }

    .mv-decor-water {
        top: -60px;
        right: -1%;
        width: 100px;
    }

    .mv-decor-yellow {
        top: 80px; 
        left: -10%;
        width: 50px;
    }

    .mv-decor-pink {
        top: 40px; 
        right: -10%;
        width: 60px;
    }
}




/* =========================================
   セクション区切りの波
========================================= */
.nami-box .l-article {
    max-width: 100% !important;    
}

.nami-box .swell-block-fullWide__inner {
    padding: 0 !important;
}

.nami-box .l-article img {
    width: 100% !important;
    height: auto !important;
}

/* セクション区切りの波 上向き */
.nami-box.nami-top .l-article img {
    transform: scaleY(-1) scaleX(-1);
}



/* =========================================
   セクション見出し
========================================= */

/* --- 1. 英語サブタイトル（OUR STRENGTHS）の装飾 --- */
.sec-sub-ttl {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px; /* テキストと左右の飾り画像の隙間 */
    
    color: #831d79; /* パープル */
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 5px !important;
}

/* 左右の黄色の飾り罫（共通設定） */
.sec-sub-ttl::before,
.sec-sub-ttl::after {
    content: "";
    display: inline-block;
    width: 30px; /* 画像の幅に合わせて調整してください */
    height: 30px; /* 画像の高さに合わせて調整してください */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(-10px); /* マイナスの値で上に移動させます */
}

/* 左の飾り罫 */
.sec-sub-ttl::before {
    background-image: url('/wp/wp-content/uploads/2026/08/ttl-left-icon.png'); 
}

/* 右の飾り罫 */
.sec-sub-ttl::after {
    background-image: url('/wp/wp-content/uploads/2026/08/ttl-right-icon.png'); 
}


/* --- 2. 日本語メインタイトル（私たちの強み）の装飾 --- */
h2.sec-ttl {
    color: #432724 !important; /* こげ茶色 */
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-align: center;
    
    /* SWELL標準の装飾（線など）があればリセットする */
    border: none;
    background: transparent;
    
    /* 波線を下に入れるための余白 */
    position: relative !important;
    padding-bottom: 40px !important;
    
    margin-bottom: 1em !important;
}

/* --- 下部の緑の波線 --- */
.post_content h2.sec-ttl::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 160px !important; /* 波線画像の幅 */
    height: 30px !important; /* 波線画像の高さ */
    
    background-image: url('/wp/wp-content/uploads/2026/08/wave-line.png') !important; 
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;

    /* SWELL標準の下線（ボーダーや背景色）を完全に打ち消す */
    background-color: transparent !important;
    border: none !important;
}

/* --- スマホ表示時の文字サイズ調整 --- */
@media screen and (max-width: 767px) {
    .sec-sub-ttl {
        font-size: 0.8rem;
    }
    h2.sec-ttl {
        font-size: 1.5rem;
    }
}

/* --- セクションタイトル h3 --- */
h3.sec-ttl-h3 {
    color: #920783 !important;
    font-size: 1.5em !important;
}

@media screen and (max-width: 767px) {
    h3.sec-ttl-h3 {
        font-size: 1.2em !important;
    }
}

/* --- セクション内 h3（sec-ttl-h3）のSWELL標準装飾リセット --- */
.post_content h3.sec-ttl-h3 {
    /* SWELLの装飾（余白・背景・線など）を強制リセット */
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    /*margin-top: 2em !important;*/
    
    /* 必要に応じてお好みの下余白などを設定してください */
    margin-bottom: 20px !important; 
}

/* SWELLの見出しに付与される疑似要素（左の縦線や下線など）を消去 */
.post_content h3.sec-ttl-h3::before,
.post_content h3.sec-ttl-h3::after {
    display: none !important;
    content: none !important;
}



/* =========================================
   TOPページ調整
========================================= */
.top #content {
    padding-top: 0 !important;
}

/* 枠 */
/*.top .l-content {
    margin: 0 auto 0 !important;
}*/




/* =========================================
   固定ページ調整
========================================= */
.l-content {
    padding-top: 0 !important;
    margin: 0 auto 0 !important;
}




/* =========================================
   ニュース＆イベント
========================================= */
.top-news-sec {
    padding-top: 100px !important;
    padding-bottom: 50px !important;
}

.top-news-sec .news-ttl {
    font-size: 24px;
    color: #432724;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.top-news-sec .news-ttl-sub {
    font-size: 14px;
    color: #920783;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
    font-style: normal;
    
}

@media screen and (max-width: 768px) {
    .top-news-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
}



/* =========================================
   私たちの強み
========================================= */
/* セクション全体を基準点にする（いただいたpaddingと合体） */
.top-strengths-sec {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
    position: relative !important;
    overflow: hidden; /* はみ出しによる横スクロールを防止 */
}

/* SWELLやWordPressが勝手に作る「見えない基準点」を強制解除 */
.top-strengths-sec .swell-block-fullWide__inner,
.top-strengths-sec .wp-block-custom-html {
    position: static !important;
}

/* 中央のコンテンツ（テキストや画像）を前面に出す */
.top-strengths-sec .swell-block-fullWide__inner > *:not(.p-strengths-decor) {
    position: relative !important;
    z-index: 2 !important;
}

/* 装飾オブジェクト全体を包むラッパー */
.p-strengths-decor {
    position: absolute !important;
    top: 0;
    bottom: 0; /* これでセクションの上下いっぱいに広がります */
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1250px; 
    pointer-events: none; 
    z-index: 0;
}

/* 個別オブジェクトの共通設定 */
.decor-item {
    position: absolute;
    height: auto;
}

/* 各オブジェクトの配置（%で指定してレスポンシブ対応） */
.decor-blue {
    top: 5%;
    right: 5%;
    width: 69px;
}
.decor-green-sq {
    top: 40%;
    left: 2%;
    width: 28px;
}
.decor-wave {
    bottom: 25%;
    right: 2%;
    width: 80px;
}
.decor-yellow {
    bottom: 10%;
    left: 8%;
    width: 84px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .top-strengths-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .decor-item {
        transform: scale(0.6); /* スマホでは全体的に少し小さくする */
    }
}




/* =========================================
   プログラムを探す
========================================= */
.top-programs-sec {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
    position: relative !important;
    overflow: hidden; 
}

/* SWELLの基準点を強制解除 */
.top-programs-sec .swell-block-fullWide__inner,
.top-programs-sec .wp-block-custom-html {
    position: static !important;
}

/* コンテンツを前面へ */
.top-programs-sec .swell-block-fullWide__inner > *:not(.p-programs-decor) {
    position: relative !important;
    z-index: 2 !important;
}

/* 装飾ラッパー */
.p-programs-decor {
    position: absolute !important;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1250px; 
    pointer-events: none; 
    z-index: 0;
}

/* 各パーツの個別配置（幅は書き出した2倍サイズの「半分」のpxを指定） */
.decor-prog-dots {
    top: 10%;
    right: 0%;
    width: 85px; 
}
.decor-prog-yellow {
    top: 45%;
    left: -2%;
    width: 48px;
}
.decor-prog-illust {
    bottom: 0%;
    left: -5%;
    width: 206px; 
}
.decor-prog-pink {
    bottom: 25%;
    right: 1%;
    width: 54px;
}

/* =========================================
   3カラムカードレイアウト
========================================= */
/* --- カード全体のベースデザイン --- */
.p-program-card {
    background-color: #ffffff;
    border-radius: 24px;
    padding: 35px 25px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    
    /* 高さの違うボタンリストがあってもカードの高さを揃える設定 */
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    box-sizing: border-box;
}

/* --- アイコン画像 --- */
.p-program-card_icon {
    margin: 0 0 15px 0 !important;
    text-align: center;
}
.p-program-card_icon img {
    width: 80px;
    height: auto;
}

/* --- タイトル（SWELLのデフォルト装飾をリセット） --- */
.post_content h3.p-program-card_title {
    color: #432724 !important;
    font-size: 1.25rem !important;
    font-weight: bold !important;
    margin: 0 0 20px 0 !important;
    text-align: center !important;
    
    /* SWELLの見出し装飾（線など）を消去 */
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}

/* --- サムネイル写真 --- */
.p-program-card__thumb {
    width: 100%;
    margin: 0 0 15px 0 !important;
}
.p-program-card__thumb img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
}

/* --- ボタンリスト全体 --- */
.p-program-card__list {
    width: 100%;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    
    /* 修正ポイント：下揃えをやめて上揃えにし、余った空間をカードの下側に逃がす */
    margin-top: 0 !important;
    margin-bottom: auto !important; 
}

/* --- 個別ボタン（共通スタイル） --- */
/* SWELLのテキストリンク設定に勝つために詳細度を上げています */
.post_content .p-program-card__list a.p-program-card__btn {
    display: block !important;
    width: 100% !important;
    padding: 7px 30px 10px !important;
    border-radius: 50px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    text-align: center !important;
    font-weight: bold !important;
    font-size: 0.95rem !important;
    position: relative !important;
    box-sizing: border-box !important;
    transition: all 0.3s ease !important;
    line-height: 1.4 !important;
}

/* 右側の矢印（>） */
.post_content .p-program-card__list a.p-program-card__btn::after {
    content: "\003E" !important;
    position: absolute !important;
    right: 20px !important; /* 💡右端からの距離 */
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-family: sans-serif !important;
    font-weight: normal !important;
    font-size: 1.1em !important;
}

/* ホバー時のアクション */
.post_content .p-program-card__list a.p-program-card__btn:hover {
    opacity: 0.85 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
}

/* === カラーテーマ別設定 === */
.post_content .p-program-card--pink a.p-program-card__btn {
    background-color: #f29c9c !important;
}
.post_content .p-program-card--blue a.p-program-card__btn {
    background-color: #92b8c5 !important;
}
.post_content .p-program-card--green a.p-program-card__btn {
    background-color: #9ab476 !important;
}

/* --- タイトル（SWELLのデフォルト装飾を完全にリセット） --- */
.post_content h3.p-program-card_title,
.post_content h3.p-program-card__title {
    /* デザインの指定 */
    color: #432724 !important;
    font-size: 1.25rem !important;
    font-weight: bold !important;
    margin: 0 0 20px 0 !important;
    text-align: center !important;
    line-height: 1.4 !important;
    
    /* SWELLの見出し装飾をすべて強制リセット */
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* SWELLの見出しに付与される疑似要素（チェックマークや線など）も念のため非表示に */
.post_content h3.p-program-card_title::before,
.post_content h3.p-program-card_title::after,
.post_content h3.p-program-card__title::before,
.post_content h3.p-program-card__title::after {
    display: none !important;
    content: none !important;
}

/* =========================================
   スマホ表示時：プログラムセクションのイラスト被り解消
========================================= */
@media screen and (max-width: 768px) {
    /* 1. ボタンの下にイラストを置くためのスペース（余白）を確保 */
    .top-programs-sec {
        padding-bottom: 50px !important; 
    }

    /* 2. イラストをボタンの下へ移動 */
    .decor-prog-illust {
        display: none;
        /*bottom: 0px !important;
        left: -4% !important;
        width: 220px !important;*/
    }
}




/* =========================================
   先生・フレンズについて
========================================= */
.top-about-sec {
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    position: relative !important;
    overflow: hidden;   
}

.top-about-sec .wp-block-media-text {
    gap: 2.5em !important;
}

.is-vertically-aligned-top>.wp-block-media-text__content {
    padding-top: 0 !important;
}

@media screen and (max-width: 767px) {
    .top-about-sec {
        padding-bottom: 50px !important;
    }
    .is-vertically-aligned-top>.wp-block-media-text__content {
        padding-top: 1.5rem !important;
    }
}

/* SWELLの基準点を強制解除 */
.top-about-sec .swell-block-fullWide__inner,
.top-about-sec .wp-block-custom-html {
    position: static !important;
}

/* コンテンツを前面へ */
.top-about-sec .swell-block-fullWide__inner > *:not(.p-about-decor) {
    position: relative !important;
    z-index: 2 !important;
}

/* 装飾ラッパー */
.p-about-decor {
    position: absolute !important;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1250px; 
    pointer-events: none; 
    z-index: 0;
}

/* 各パーツの個別配置（幅は書き出した2倍サイズの「半分」のpxを指定） */
.decor-about-yellow {
    top: 3%;
    left: 2%;
    width: 84px; 
}
.decor-about-blue {
    top: 30%;
    right: 2%;
    width: 42px;
}
.decor-about-dots {
    bottom: 16%;
    left: -2%;
    width: 85px; 
}
.decor-about-pink {
    bottom: 1%;
    right: 15%;
    width: 54px;
}

/* =========================================
   スマホ表示時：「先生・フレンズについて」セクションのセンター揃え
========================================= */
@media screen and (max-width: 768px) {
    /* 1. 見出しと段落テキストを中央揃えにする */
    .top-about-sec .wp-block-media-text__content,
    .top-about-sec .wp-block-media-text__content h3,
    .top-about-sec .wp-block-media-text__content p {
        text-align: center !important;
    }

    /* 2. SWELLボタンブロックを中央揃えにする */
    .top-about-sec .wp-block-media-text__content .swell-block-button {
        justify-content: center !important;
        text-align: center !important;
    }
    
    /* ボタン自体がインラインブロックなどの場合の保険 */
    .top-about-sec .wp-block-media-text__content .swell-block-button__link {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}




/* =========================================
   アクセス案内カード（3カラムレイアウト）
========================================= */
.top-access-sec {
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    position: relative !important;
    overflow: hidden; 
}


/* --- カード全体のベースデザイン --- */
.p-access-card {
    background-color: #ffffff;
    border-radius: 24px;
    padding: 30px 25px !important; 
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

/* --- 上部のリボン画像とテキスト --- */
.p-access-card__ribbon {
    position: relative;
    text-align: center;
    margin: 0 auto 15px !important; 
    width: 160px;
}
.p-access-card__ribbon img {
    width: 100%;
    height: auto;
    display: block;
}

/* リボンに乗せるテキストの装飾 */
.p-access-card__ribbon-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* 縦横のど真ん中に配置 */
    
    color: #ffffff; /* 文字色：白 */
    font-weight: 700; /* 太字 */
    font-size: 1.1rem; /* 文字サイズ */
    letter-spacing: 0.15em; /* 少し字間を空ける */
    white-space: nowrap; /* 改行させない */
}

/* --- 写真・マップエリア --- */
.p-access-card__media {
    width: 100%;
    margin: 0 0 15px 0 !important; 
    border-radius: 12px;
    background-color: #f0f0f0;
    overflow: hidden;
}
.p-access-card__media img,
.p-access-card__media iframe {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border: none;
}

/* --- 住所・電話番号エリア内の段落余白 --- */
.post_content .p-access-card__info p,
.post_content .p-access-card_info p {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 0 0 15px 0 !important; 
}
.post_content .p-access-card__info p:last-child,
.post_content .p-access-card_info p:last-child {
    margin-bottom: 0 !important;
}

/* SWELL標準の段落余白を打ち消し、フレックスボックスでアイコンと横並びに */
.post_content .p-access-card__info p {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 0 0 5px 0 !important;
    line-height: 1.4;
}
.post_content .p-access-card__info p:last-child {
    margin-bottom: 0 !important;
}

/* --- 各種アイコン画像 --- */
.p-access-card__icon {
    width: 20px !important; /* アイコン画像の表示サイズ */
    height: auto;
    flex-shrink: 0;
    margin-top: 2px; /* 1行目のテキストと高さを合わせる微調整 */
}

.p-access-card .is-style-btn_normal {
    width: 100%;
    margin-top: 20px;
}

.p-access-card .swell-block-button__link {
    width: 80% !important;
}

/* =========================================
   アクセスセクション（.top-access-sec）の装飾
========================================= */
/* SWELLの基準点を強制解除 */
.top-access-sec .swell-block-fullWide__inner,
.top-access-sec .wp-block-custom-html {
    position: static !important;
}

/* コンテンツを前面へ */
.top-access-sec .swell-block-fullWide__inner > *:not(.p-access-decor) {
    position: relative !important;
    z-index: 2 !important;
}

/* 装飾ラッパー */
.p-access-decor {
    position: absolute !important;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1250px; 
    pointer-events: none; 
    z-index: 0;
}

/* 個別オブジェクト共通 */
.p-access-decor .decor-item {
    position: absolute;
    height: auto;
}

/* 上部図形の配置 */
.decor-acc-blue {
    top: 5%;
    right: 5%;
    width: 69px;
}
.decor-acc-yellow {
    top: 20%;
    left: 2%;
    width: 48px;
}
.decor-acc-green {
    bottom: 35%;
    right: 2%;
    width: 28px;
}

/* 下部イラストの配置（外側にはみ出すようにマイナス指定） */
.decor-acc-illust-l {
    bottom: -1%;
    left: -8%;
    width: 298px; /* 実際の2倍画像の半分のpxを指定してください */
}
.decor-acc-illust-r {
    bottom: -2%;
    right: -8%;
    width: 480px; /* 実際の2倍画像の半分のpxを指定してください */
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .top-access-sec {
    }

    .p-access-decor .decor-item {
        transform: scale(0.6);
    }
    
    .decor-acc-illust-l {
        bottom: -20px;
        left: -10%;
        width: 298px; /* 実際の2倍画像の半分のpxを指定してください */
    }
    .decor-acc-illust-r {
        bottom: -20px;
        right: -15%;
        width: 480px; /* 実際の2倍画像の半分のpxを指定してください */
    }
}




/* =========================================
   オリジナルグッズ スライダー＆カードデザイン
========================================= */
.top-goods-sec {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
    position: relative !important;
    overflow: hidden;
}

/* スライダー全体の枠 */
.goods-swiper {
    position: relative;
    padding: 0px 60px 50px !important; 
    max-width: 1000px;
    margin: 0 auto;
}

/* --- カード本体 --- */
.p-goods-card {
    background-color: #ffffff;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid #f0f0f0;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

/* --- スライドの枠を一番高いカードに合わせて伸ばす --- */
.goods-swiper .swiper-slide {
    height: auto !important; 
}

/* 写真部分 */
.p-goods-card__thumb {
    width: 100%;
    margin: 0 0 15px 0 !important;
    border-radius: 12px;
    overflow: hidden;
    background-color: #f6e6f0; /* ダミー画像の背景色 */
}
.p-goods-card__thumb img {
    width: 100%;
    aspect-ratio: 1 / 1; /* 写真を強制的に正方形にする */
    object-fit: cover;
    display: block;
}

/* テキスト部分 */
.p-goods-card__body {
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* ボタンを一番下に押し下げる設定 */
}

/* タイトル */
.p-goods-card__title {
    font-size: 1.1rem !important;
    font-weight: bold !important;
    color: #1a1a1a !important;
    margin: 0 0 0 0 !important;
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
}
/* SWELLの疑似要素リセット */
.p-goods-card__title::before, .p-goods-card__title::after { display: none !important; }

/* 価格 */
.p-goods-card__price {
    font-size: 0.95rem;
    font-weight: bold;
    color: #1a1a1a;
    margin: 0 0 5px 0 !important;
}

/* 説明文 */
.p-goods-card__desc {
    font-size: 0.85rem;
    line-height: 1.6;
    color: #333;
    margin: 0 0 20px 0 !important;
}

/* 購入ボタン */
.p-goods-card__btn {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 80%;
    margin: auto auto 0; /* 上部の余白を自動にして一番下に固定 */
    padding: 12px;
    background-color: #f7a9a9 !important; /* ピンク色 */
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: bold;
    font-size: 0.95rem;
    border-radius: 50px; /* ピル型 */
    transition: all 0.3s ease;
    
    /* ↓購入できるようになったら消す */
    display: none !important;
}
.p-goods-card__btn:hover {
    opacity: 0.85;
    transform: translateY(-2px);
}

/* --- 左右の矢印デザイン --- */
.goods-swiper .swiper-button-prev,
.goods-swiper .swiper-button-next {
    width: 50px;
    height: 50px;
    background-color: #9ab476; /* グリーン */
    border-radius: 50%;
    color: #ffffff;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;
}
/* 矢印のアイコンの大きさを調整 */
.goods-swiper .swiper-button-prev::after,
.goods-swiper .swiper-button-next::after {
    font-size: 20px;
    font-weight: bold;
}
/* 矢印の配置位置 */
.goods-swiper .swiper-button-prev { left: 5px !important; }
.goods-swiper .swiper-button-next { right: 5px !important; }

/* スマホ表示時の矢印微調整 */
@media screen and (max-width: 767px) {
    .goods-swiper { padding: 20px 10px !important; }
    .goods-swiper .swiper-button-prev { left: 0px !important; }
    .goods-swiper .swiper-button-next { right: 0px !important; }
}

/* =========================================
   オリジナルグッズセクション（.top-goods-sec）の装飾
========================================= */
/* SWELLの基準点を強制解除 */
.top-goods-sec .swell-block-fullWide__inner,
.top-goods-sec .wp-block-custom-html {
    position: static !important;
}

/* コンテンツを前面へ */
.top-goods-sec .swell-block-fullWide__inner > *:not(.p-goods-decor) {
    position: relative !important;
    z-index: 2 !important;
}

/* 装飾ラッパー */
.p-goods-decor {
    position: absolute !important;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1250px; 
    pointer-events: none; 
    z-index: 0;
}

/* 個別オブジェクト共通 */
.p-goods-decor .decor-item {
    position: absolute;
    height: auto;
}

/* 各パーツの配置（幅は書き出した2倍サイズの「半分」のpxを指定） */
.decor-goods-dots {
    top: 5%;
    left: 5%;
    width: 85px; 
}

.decor-goods-blue {
    bottom: 5%;
    right: 2%;
    width: 42px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .p-goods-decor .decor-item {
        transform: scale(0.6); /* スマホでは少し小さくする */
    }
    
    /* 移動ボタンを上部（画像エリア付近）に引き上げる */
    .top-goods-sec .swiper-button-prev,
    .top-goods-sec .swiper-button-next {
        top: 30% !important;
        margin-top: 0 !important;
    }
}




/* =========================================
   採用セクション（top-recruit-sec）統合スタイル
========================================= */

/* --- 1. セクション全体のベース設定 --- */
.top-recruit-sec {
    position: relative !important;
    z-index: 1;
    overflow: hidden;
    padding-top: 100px !important;
    padding-bottom: 350px !important;
}

/* SWELLの内枠の基準点を強制解除 */
.top-recruit-sec .swell-block-fullWide__inner {
    position: static !important;
}

/* --- 2. 中央テキストの設定 --- */
/* ラッパーとフル幅イラストを除外して前面に出す */
.top-recruit-sec .swell-block-fullWide__inner > *:not(.p-recruit-visuals):not(.wp-block-image) {
    max-width: 650px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    position: relative !important; 
    z-index: 2 !important;         
}

/* --- 3. 画像・装飾の共通ラッパー --- */
.p-recruit-visuals {
    position: absolute !important;
    top: 0;
    bottom: 0; 
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: 1250px; 
    height: 100%;
    pointer-events: none;
    z-index: 0;
}

/* --- 4. 人物画像の設定 --- */
.recruit-visual-img {
    position: absolute;
    width: 32%;
    max-width: 350px; 
    min-width: 200px;
    height: auto;
    pointer-events: auto;
}

/* 人物画像の個別配置 */
.img-pos-1 { top: 0%; left: -2%; }
.img-pos-2 { top: 5%; right: -3%; }
.img-pos-3 { top: 35%; left: 1%; } 
.img-pos-4 { top: 38%; right: 1%; }

/* --- 5. 装飾パーツの設定 --- */
.decor-recruit-item {
    position: absolute;
    height: auto;
    pointer-events: none;
    z-index: 1; 
}

/* 装飾パーツの個別配置（幅は2倍サイズの半分のpxを指定） */
.decor-rec-yellow {
    top: 0%;
    left: -5%;
    width: 48px;
}
.decor-rec-dots {
    top: 67%;
    left: 50%;
    transform: translateX(-50%); /* 画面中央に固定 */
    width: 85px;
}
.decor-rec-pink {
    top: 78%;
    right: -5%;
    width: 54px;
}

/* --- 6. セクション下部のイラスト（全幅化） --- */
.top-recruit-sec .wp-block-image {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-bottom: 0 !important; 
    line-height: 0;
}

.top-recruit-sec .wp-block-image img {
    width: 100% !important;
    height: auto !important;
    display: block;
}

.top-recruit-sec .top-recruit-footer {
    margin-top: 8em;
    vertical-align: bottom;
}

/* =========================================
   スマホ・タブレット表示時（768px以下）
========================================= */
@media screen and (max-width: 768px) {
    /* セクション余白の縮小 */
    .top-recruit-sec {
        padding-top: 40px !important;
        padding-bottom: 120px !important;
        margin-bottom: 1.6em !important;
    }

    /* 人物画像のグリッド化 */
    .p-recruit-visuals {
        position: relative !important;
        z-index: 1;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-top: 50px;
        left: auto;
        transform: none;
        width: 100%;
        height: auto;
        margin-bottom: 0 !important;
    }

    /* 人物画像の絶対配置を解除 */
    .recruit-visual-img {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    .decor-rec-yellow,
    .decor-rec-dots,
    .decor-rec-pink {
        display: none;
    }
    
    .top-recruit-sec .top-recruit-footer {
        margin-top: 0;
    }
}








/* ===============================================================================
   固定ページ共通パーツ
=============================================================================== */

/* ===============================================================================
   クラス紹介全ページ共通
=============================================================================== */

/* ---------- 特徴セクション ---------- */
/******************************************************************/
.feature-sec {
    padding-top: 100px !important;
    padding-bottom: 0px !important;
    position: relative;
    z-index: 0;
}

.page-private .feature-sec {
    padding-bottom: 50px !important;
}

/* ---------- 特徴カード（3列レイアウト） ---------- */
.p-feature-card {
    height: 100%;
    background-color: #ffffff;
    border-radius: 15px; /* カードの角丸 */
    padding: 30px 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); /* うっすらとした影 */
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
}

/* 丸い数字アイコン */
.p-feature-card__icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
}

/* 各アイコンの背景色 */
.p-feature-card__icon--pink { background-color: #F2A8A5; }
.p-feature-card__icon--blue { background-color: #9ECBD3; }
.p-feature-card__icon--green { background-color: #9DB469; }

/* 見出し */
.p-feature-card__title {
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    text-align: center;
    line-height: 1.6;
    margin: 20px 0 !important;
    
    /* SWELLデフォルトの装飾を強制解除 */
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
}

/* SWELLの見出し装飾が疑似要素（::before, ::after）で作られている場合の対策 */
.p-feature-card__title::before,
.p-feature-card__title::after {
    display: none !important;
    content: none !important;
}

/* サムネイル画像 */
.p-feature-card__thumb {
    margin: 0 0 20px 0;
    width: 100%;
}

.p-feature-card__thumb img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

/* 説明テキスト */
.p-feature-card__text {
    font-size: 14px;
    line-height: 1.8;
    color: #333333;
    text-align: justify; /* テキストの両端を揃える */
    margin: 0;
}

/* ---------- 5枚の円形画像ジグザグ配置ギャラリー ---------- */
.p-zigzag-gallery {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    
    /* 上下の動きを大きくするため、余白を増やす */
    padding: 200px 0 100px; 
    
    overflow: hidden; 
    box-sizing: border-box;
}

/* 共通設定 */
.p-zigzag-gallery__item {
    flex-shrink: 0;
    margin: 0 1vw;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
}

.p-zigzag-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

/* 各画像のサイズ（メリハリ）と上下のズレ指定 */
.p-zigzag-gallery__item:nth-child(1) {
    width: 22vw;
    transform: translateY(-20%);
}

.p-zigzag-gallery__item:nth-child(2) {
    width: 18vw;
    transform: translateY(30%);
}

.p-zigzag-gallery__item:nth-child(3) {
    width: 24vw;
    transform: translateY(-35%);
}

.p-zigzag-gallery__item:nth-child(4) {
    width: 17vw;
    transform: translateY(43%);
}

.p-zigzag-gallery__item:nth-child(5) {
    width: 17vw;
    transform: translateY(-30%);
}

/* ---------- 背景の装飾オブジェクト ---------- */
.p-decorations {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    
    pointer-events: none; 
    z-index: -1; 
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-deco {
    position: absolute;
    width: 120px; /* 基本のサイズ（個別に上書き可能） */
    height: auto;
    opacity: 1; /* 少し透かして背景になじませる場合 */
}

/* 1: 左上の青いドット */
.p-deco--1 {
    top: 2%;
    left: 5%;
    width: 85px;
}

/* 2: 右上の赤い枠・オレンジ円 */
.p-deco--2 {
    top: 15%;
    right: 3%;
    width: 50px;
}

/* 3: 左中段の赤い枠・ピンク三角 */
.p-deco--3 {
    top: 45%;
    left: 10%;
    width: 60px;
}

/* 4: 中央下段の赤い太枠 */
.p-deco--4 {
    top: 65%;
    left: 25%;
    width: 60px;
}

/* 5: 右下段の赤い枠 */
.p-deco--5 {
    top: 88%;
    right: 40%;
    width: 70px;
}

@media screen and (max-width: 768px) {
    .feature-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-feature-cards {
        flex-direction: column; /* 縦並びに変更 */
    }
    
    .p-feature-card {
        width: 100%; /* 横幅いっぱいに */
    }
    
    .p-zigzag-gallery {
        padding: 80px 0 40px;
    }
    
    .p-zigzag-gallery__item {
        /* 隙間を詰めてはみ出し幅を減らす */
        margin: 0 0.5vw; 
    }
    
    /* スマホ版も全体的に少し縮小 */
    .p-zigzag-gallery__item:nth-child(1) { width: 30vw; }
    .p-zigzag-gallery__item:nth-child(2) { width: 22vw; }
    .p-zigzag-gallery__item:nth-child(3) { width: 30vw; }
    .p-zigzag-gallery__item:nth-child(4) { width: 22vw; }
    .p-zigzag-gallery__item:nth-child(5) { width: 26vw; }
    
    
    /* スマホ表示ではオブジェクトを少し小さくする */
    /*.p-deco {
        width: 70px !important; 
    }
    .p-deco--1 { top: 1%; left: -5%; }
    .p-deco--2 { top: 10%; right: -5%; }
    .p-deco--3 { top: 40%; left: 0%; }
    .p-deco--4 { top: 60%; left: 10%; }
    .p-deco--5 { top: 80%; right: 5%; }*/
    
    .p-deco--1 {
        top: 1%;
        left: -2%;
        width: 50px;
    }
    .p-deco--2 {
        top: 10%;
        right: 1%;
        width: 30px;
    }
    .p-deco--3 {
        top: 40%;
        left: 0%;
        width: 35px;
    }
    .p-deco--4 {
        top: 60%;
        left: 10%;
        width: 30px;
    }
    .p-deco--5 {
        top: 80%;
        right: 5%;
        width: 30px;
    }
}




/* ---------- 目指すことセクション ---------- */
/******************************************************************/

.goal-sec {
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    position: relative;
    z-index: 0;
}

.p-goal-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px; /* カード同士の余白（縦横共通） */
    margin-bottom: 0px;
}

/* カード本体のスタイル */
.p-goal-card {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    border-radius: 24px; /* 丸みの強さ */
    padding: 20px 30px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); /* ふんわりとした影 */
    box-sizing: border-box;
    border: 1px solid #EEEEEE;
}

/* 丸いアイコン画像 */
.p-goal-card__icon {
    width: 75px;
    height: 75px;
    flex-shrink: 0; /* テキストが長くなっても画像を縮小させない */
    margin-right: 25px;
    object-fit: contain;
}

/* テキスト */
.p-goal-card__text {
    font-size: 16px;
    font-weight: 700;
    color: #000000;
    line-height: 1.5;
    margin: 0 !important; /* SWELLのpタグデフォルト余白を強制解除 */
    letter-spacing: 0.05em;
}

/* ---------- 目標セクション 背景の装飾オブジェクト ---------- */

.p-decorations-goals {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* コンテンツの背面に配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-deco-goal {
    position: absolute;
    height: auto;
}

/* 1: 左上の水色の四角 */
.p-deco-goal--1 {
    top: 5%;
    left: 8%;
    width: 40px; /* 画像の表示サイズ */
}

/* 2: 右下の黄色のアーチ */
.p-deco-goal--2 {
    bottom: -2%; /* 下端に少し見切れさせる */
    right: 5%; /* 右端に少し見切れさせる */
    width: 85px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .goal-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-goal-cards {
        grid-template-columns: 1fr; /* 1列の縦並びに変更 */
        gap: 20px;
    }
    .p-goal-card {
        padding: 15px 20px;
        border-radius: 16px;
    }
    .p-goal-card__icon {
        width: 60px;
        height: 60px;
        margin-right: 15px;
    }
    .p-goal-card__text {
        font-size: 15px;
    }
    .p-deco-goal--1 {
        top: 0%;
        left: 2%;
        width: 30px;
    }
    .p-deco-goal--2 {
        bottom: 10%;
        right: -5%;
        width: 60px;
    }
}




/* ---------- 一日のスケジュール ---------- */
/******************************************************************/

.schedule-sec {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
    position: relative;
    z-index: 10; 
    overflow: visible !important;
}

/* 装飾オブジェクト用コンテナ（画面幅100%拡張） */
.p-decorations-schedule {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

/* 各オブジェクトの共通設定 */
.p-deco-schedule {
    position: absolute;
    height: auto;
}

/* 1: 右上のイラスト */
.p-deco-schedule--1 {
    top: -5%;
    right: 5%;
    width: 220px;
}

/* 2: 左上の緑の四角 */
.p-deco-schedule--2 {
    top: 18%;
    left: 8%;
    width: 30px;
}

/* 3: 右中段の水色の円 */
.p-deco-schedule--3 {
    top: 35%;
    right: 12%;
    width: 70px;
}

/* 4: 左中段のピンクの三角 */
.p-deco-schedule--4 {
    top: 50%;
    left: 5%;
    width: 50px;
}

/* 5: 右下段のオレンジの円 */
.p-deco-schedule--5 {
    top: 72%;
    right: 8%;
    width: 50px;
}

/* 6: 左下のイラスト */
.p-deco-schedule--6 {
    bottom: -5%;
    left: 3%;
    width: 240px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .schedule-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-deco-schedule--1 {
        /*top: 1%;
        right: 2%;
        width: 60px;*/
        display: none;
    }
    .p-deco-schedule--2 {
        /*top: 12%;
        left: 2%;
        width: 30px;*/
        display: none;
    }
    .p-deco-schedule--3 {
        /*top: 32%;
        right: 2%;
        width: 30px;*/
        display: none;
    }
    .p-deco-schedule--4 {
        /*top: 48%;
        left: 1%;
        width: 55px;*/
        display: none;
    }
    .p-deco-schedule--5 {
        /*top: 70%;
        right: 2%;
        width: 45px;*/
        display: none;
    }
    .p-deco-schedule--6 {
        /*bottom: 0%;
        left: -2%;
        width: 110px;*/
        display: none;
    }
}




/* ---------- 語学力のめやす ---------- */
/******************************************************************/

.language-sec {
    padding-top: 0 !important;
    padding-bottom: 30px !important;
    position: relative;
    z-index: 0;
}

.page-pre .language-sec,
.page-kinder .language-sec {
    padding-top: 50px !important;
    padding-bottom: 100px !important;
}

/* 装飾オブジェクト用コンテナ（画面幅100%拡張） */
.p-decorations-language {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの背面に配置 */
    overflow: hidden; /* 左右のはみ出しによる横スクロールを防止 */
}

/* 各オブジェクトの共通設定 */
.p-deco-lang {
    position: absolute;
    height: auto;
}

/* 1: 右上の青いドット */
.p-deco-lang--1 {
    top: 15%;
    right: 3%;
    width: 85px;
}

/* 2: 左中段のオレンジの円 */
.p-deco-lang--2 {
    top: 50%;
    left: 2%;
    width: 50px;
}

/* 3: 右下のピンクの三角 */
.p-deco-lang--3 {
    bottom: 5%;
    right: 5%;
    width: 50px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .language-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-deco-lang--1 {
        top: 0%;
        right: -5%;
        width: 40px;
    }
    .p-deco-lang--2 {
        top: 45%;
        left: -3%;
        width: 30px;
    }
    .p-deco-lang--3 {
        bottom: 2%;
        right: 2%;
        width: 30px;
    }
}




/* ---------- クラス詳細 ---------- */
/******************************************************************/


.page-other .details-sec {
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    position: relative;
    z-index: 10; 
    overflow: visible !important;
}

.page-pre .details-sec,
.page-kinder .details-sec,
.page-super .details-sec,
.page-alc .details-sec {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.page-jrclub .details-sec,
.page-private .details-sec {
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

.mombaby-details-sec {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.programming-details-sec {
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

/* テーブル */
.p-custom-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 2em;
    border: none !important; /* 外枠線を消す */
}

/* 共通のセル指定（白い境界線を作る） */
.p-custom-table th,
.p-custom-table td {
    border: 2px solid #FCF7F4 !important; /* 背景色に合わせて線の色を調整 */
    vertical-align: middle;
    padding: 10px 20px !important;
}

/* 左側の見出しセル（紫） */
.p-custom-table th {
    background-color: #92007B !important;
    color: #ffffff !important;
    font-weight: bold;
    text-align: center !important;
    width: 30% !important;
}

/* 右側のデータセル（白） */
.p-custom-table td {
    background-color: #ffffff !important;
    text-align: left !important;
    line-height: 1.6;
}

/* テーブル02 */
.p-custom-table02 {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 2em;
    border: none !important; /* 外枠線を消す */
}

/* 共通のセル指定（白い境界線を作る） */
.p-custom-table02 th,
.p-custom-table02 td {
    border: 2px solid #FFFFFF !important; /* 背景色に合わせて線の色を調整 */
    vertical-align: middle;
    padding: 10px 20px !important;
}

/* 左側の見出しセル（紫） */
.p-custom-table02 th {
    background-color: #92007B !important;
    color: #ffffff !important;
    font-weight: bold;
    text-align: center !important;
    width: 30% !important;
}

/* 右側のデータセル（白） */
.p-custom-table02 td {
    background-color: #EFEFEF !important;
    text-align: left !important;
    line-height: 1.6;
}

/* 装飾オブジェクト用コンテナ（画面幅100%拡張） */
.p-decorations-details {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: auto;
}

/* 各オブジェクトの共通設定 */
.p-deco-details {
    position: absolute;
    height: auto;
    z-index: -1; /* ★メインコンテンツ(2)より「下」に配置 */
}

/* 1: 右上の黄色のアーチ */
.p-deco-details--1 {
    top: 5%;
    right: 5%;
    width: 85px;
}

/* 2: 左中段のピンクのドット */
.p-deco-details--2 {
    top: 35%;
    left: 5%;
    width: 85px;
}

/* 3: 右中段のピンクの三角 */
.p-deco-details--3 {
    top: 58%;
    right: 8%;
    width: 50px;
}

/* 4: 左下の緑の波線 */
.p-deco-details--4 {
    bottom: 12%;
    left: 8%;
    width: 70px;
}

/* 5: 右下の花と走る子供のイラスト */
.p-deco-details--5 {
    bottom: -5%;
    right: 3%;
    width: 340px;
    z-index: 1;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-other .details-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .page-pre .details-sec,
    .page-kinder .details-sec,
    .page-super .details-sec,
    .page-alc .details-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .page-jrclub .details-sec,
    .page-private .details-sec {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    .mombaby-details-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }

    .programming-details-sec {
        padding-top: 50px !important;
        padding-bottom: 150px !important;
    }
    
    
    
    
    .p-custom-table th,
    .p-custom-table02 th {
        width: 35% !important; 
        padding: 15px 10px !important;
        font-size: 14px;
    }
    .p-custom-table td,
    .p-custom-table02 td {
        padding: 15px 15px !important;
        font-size: 14px;
    }
    .p-deco-details--1 {
        top: 2%;
        right: -2%;
        width: 50px;
    }
    .p-deco-details--2 {
        top: 30%;
        left: -5%;
        width: 50px;
    }
    .p-deco-details--3 {
        top: 55%;
        right: -3%;
        width: 30px;
    }
    .p-deco-details--4 {
        /*bottom: 8%;
        left: 2%;
        width: 50px;*/
        display: none;
    }
    .p-deco-details--5 {
        bottom: 0%;
        right: 1%;
        width: 160px;
        
        display: none;
    }
}




/* ---------- お母さまのお声 ---------- */
/******************************************************************/

.page-jrclub .voice-sec {
    padding-top: 50px !important;
    padding-bottom: 350px !important;
    position: relative;
    z-index: 0;
}

.page-pre .voice-sec,
.page-kinder .voice-sec,
.page-super .voice-sec,
.page-alc .voice-sec {
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}



.voice-box.wp-block-media-text {
    --swl-mediatext--space: 2.5em !important;
    --swl-mediatext--gap: 2.5em !important;
    gap: 2.5em !important;
}

/* 装飾オブジェクト用コンテナ（画面幅100%拡張） */
.p-decorations-voice {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの背面に配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-deco-voice {
    position: absolute;
    height: auto;
}

/* 1: 左上のピンクのドット */
.p-deco-voice--1 {
    top: 0%; /* 上に少しはみ出す */
    left: 5%;
    width: 85px;
}

/* 2: 右上の水色の四角 */
.p-deco-voice--2 {
    top: 25%;
    right: 5%;
    width: 40px;
}

/* 3: 左中段のオレンジの円 */
.p-deco-voice--3 {
    top: 45%;
    left: 7%; /* 左に少しはみ出す */
    width: 48px;
}

/* 4: 右下段の緑の波線 */
.p-deco-voice--4 {
    top: 70%;
    right: 2%;
    width: 70px;
}

/* 5: 左下のピンクの三角 */
.p-deco-voice--5 {
    bottom: 10%;
    left: 8%;
    width: 50px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    /*.page-jrclub .voice-sec {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }*/
    .page-jrclub .voice-sec,
    .page-pre .voice-sec,
    .page-kinder .voice-sec,
    .page-super .voice-sec,
    .page-alc .voice-sec {
        padding-top: 50px !important;
        padding-bottom: 180px !important;
    }
    .voice-box.wp-block-media-text {
        --swl-mediatext--space: 0em !important;
        --swl-mediatext--gap: 0em !important;
        gap: 0em !important;
    }
    .voice-box .wp-block-media-text__media img {
        max-width: 150px !important;
        margin: 0 auto !important;
    }
    /* スマホ表示ではオブジェクトを小さくし、配置を微調整 */
    .p-deco-voice--1 {
        top: 0%;
        left: -2%;
        width: 40px;
    }
    .p-deco-voice--2 {
        top: 22%;
        right: -1%;
        width: 30px;
    }
    .p-deco-voice--3 {
        top: 42%;
        left: -4%;
        width: 40px;
    }
    .p-deco-voice--4 {
        top: 70%;
        right: -2%;
        width: 69px;
    }
    .p-deco-voice--5 {
        bottom: 2%;
        left: -2%;
        width: 40px;
    }
}









/* ===============================================================================
   フレンズについて
=============================================================================== */
.page-about {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- about-sec01 ---------- */
/******************************************************************/
.page-about .about-sec01 {
    padding-top: 100px !important;
    padding-bottom: 50px !important;
    position: relative;
    z-index: 0;
}

/* ---------- 背景の装飾オブジェクト ---------- */
.p-decorations-about-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    
    pointer-events: none; 
    z-index: -1; 
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-deco {
    position: absolute;
    width: 120px; /* 基本のサイズ（個別に上書き可能） */
    height: auto;
    opacity: 1; /* 少し透かして背景になじませる場合 */
}

.p-deco--1 {
    top: 0%;
    left: 4%;
    width: 85px;
}

.p-deco--2 {
    top: 20%;
    right: 3%;
    left: auto;
    width: 40px;
}

.p-deco--3 {
    top: 55%;
    left: 10%;
    width: 85px;
}

.p-deco--4 {
    top: 80%;
    right: 5%;
    left: auto;
    width: 70px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-about .about-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-deco--1 {
        top: 0%;
        left: -2%;
        width: 50px;
    }
    .p-deco--2 {
        top: 15%;
        right: 1%;
        left: auto;
        width: 30px;
    }
    .p-deco--3 {
        top: 50%;
        left: 0%;
        width: 50px;
    }
    .p-deco--4 {
        top: 65%;
        left: auto;
        right: 3%;
        width: 30px;
    }
}

/* ---------- about-sec02 ---------- */
/******************************************************************/
.about-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-about-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* カードの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-about-sec02 .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 左上の青い四角 */
.p-decorations-about-sec02 .p-deco-about02--1 {
    top: 2%;
    left: 5%;
    width: 50px;
}

/* 2: 左下の読書する子供たち */
.p-decorations-about-sec02 .p-deco-about02--2 {
    bottom: -3%;
    left: 2%;
    width: 250px;
}

/* 3: 右下の黄色い円 */
.p-decorations-about-sec02 .p-deco-about02--3 {
    bottom: 10%;
    right: 5%;
    width: 45px;
}

/* --- カード一覧レイアウト --- */
.p-philosophy-cards {
    display: flex;
    flex-wrap: wrap;       
    justify-content: center; 
    gap: 30px;             
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    z-index: 2;            
}

/* --- カード本体 --- */
.p-philosophy-card {
    width: calc((100% - 60px) / 3); 
    background-color: #ffffff;
    border-radius: 20px;
    padding: 40px 30px 35px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    border: 1px solid #EEEEEE;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
}

/* アイコンエリア（枠の指定をなくし、配置用の余白のみ残す） */
.p-philosophy-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

/* 画像自体のサイズ指定 */
.p-philosophy-card__icon img {
    width: 75px; /* 用意された画像のサイズに合わせて微調整してください */
    height: auto;
    display: block;
}

/* 見出し */
.p-philosophy-card__title {
    font-size: 1.05rem !important;
    font-weight: bold !important;
    color: #333333 !important;
    line-height: 1.5 !important;
    text-align: center !important;
    margin: 0 0 15px 0 !important;
    
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}
.p-philosophy-card__title::before,
.p-philosophy-card__title::after {
    display: none !important;
}

/* テキスト */
.p-philosophy-card__text {
    font-size: 0.9rem !important;
    line-height: 1.8 !important;
    color: #333333 !important;
    text-align: left !important;
    margin: 0 !important;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 900px) {
    .p-philosophy-card {
        width: calc((100% - 30px) / 2); 
    }
}

@media screen and (max-width: 768px) {
    .about-sec02 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-philosophy-cards {
        gap: 20px;
    }
    .p-philosophy-card {
        width: 100%; 
        padding: 30px 20px;
    }
    
    .p-decorations-about-sec02 .p-deco-about02--1 {
        top: 1%;
        left: -1%;
        width: 35px;
    }
    .p-decorations-about-sec02 .p-deco-about02--2 {
        /*bottom: -2%;
        left: -5%;
        width: 150px;*/
        display: none;
    }
    .p-decorations-about-sec02 .p-deco-about02--3 {
        bottom: 10%;
        right: -2%;
        width: 30px;
    }
}

/* ---------- about-sec03 ---------- */
/******************************************************************/
.about-sec03 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-greetings {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-greetings .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 右上の水色のドット */
.p-decorations-greetings .p-deco-greetings--1 {
    top: 3%;
    right: 8%;
    width: 85px; 
}

/* 2: 左上のピンクの三角 */
.p-decorations-greetings .p-deco-greetings--2 {
    top: 22%;
    left: 5%;
    width: 70px;
}

/* 3: 右中段のオレンジの円 */
.p-decorations-greetings .p-deco-greetings--3 {
    top: 55%;
    right: 5%;
    width: 50px;
}

/* 4: 左下段の緑の四角 */
.p-decorations-greetings .p-deco-greetings--4 {
    bottom: 30%;
    left: 5%;
    width: 30px;
}

/* 5: 右下の緑の波線 */
.p-decorations-greetings .p-deco-greetings--5 {
    bottom: 5%;
    right: 8%;
    width: 60px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .greetings-sec {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-greetings .p-deco-greetings--1 {
        top: 2%;
        right: -2%;
        width: 50px;
    }
    .p-decorations-greetings .p-deco-greetings--2 {
        top: 20%;
        left: -2%;
        width: 35px;
    }
    .p-decorations-greetings .p-deco-greetings--3 {
        top: 52%;
        right: -2%;
        width: 25px;
    }
    .p-decorations-greetings .p-deco-greetings--4 {
        bottom: 25%;
        left: -2%;
        width: 20px;
    }
    .p-decorations-greetings .p-deco-greetings--5 {
        bottom: 2%;
        right: -2%;
        width: 40px;
    }
}


/* ---------- about-sec04 ---------- */
/******************************************************************/
.about-sec04 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    /*padding-bottom: 100px !important;*/
    padding-bottom: 350px !important;
}

@media screen and (max-width: 768px) {
    .about-sec04 {
        padding-top: 50px !important;
        /*padding-bottom: 50px !important;*/
        padding-bottom: 120px !important;
    }
}

/* ---------- about-sec05 ---------- */
/******************************************************************/
.about-sec05 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

@media screen and (max-width: 768px) {
    .about-sec05 {
        padding-top: 50px !important;
        padding-bottom: 100px !important;
    }
}









/* ===============================================================================
   先生たちのご紹介
=============================================================================== */
.page-teacher {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- teacher-sec01 ---------- */
/******************************************************************/
.page-teacher .teacher-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-teacher-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-teacher-sec01 .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 左上の黄色いアーチ */
.p-decorations-teacher-sec01 .p-deco-teacher01--1 {
    top: 5%;
    left: 10%;
    width: 85px; 
}

/* 2: 右中段の水色の四角 */
.p-decorations-teacher-sec01 .p-deco-teacher01--2 {
    top: 50%;
    right: 5%;
    width: 40px; 
}

/* 3: 左下のピンクのドット */
.p-decorations-teacher-sec01 .p-deco-teacher01--3 {
    bottom: 0%;
    left: 5%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-teacher .teacher-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-teacher-sec01 .p-deco-teacher01--1 {
        top: 2%;
        left: -2%;
        width: 45px;
    }
    .p-decorations-teacher-sec01 .p-deco-teacher01--2 {
        top: 40%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-teacher-sec01 .p-deco-teacher01--3 {
        bottom: 5%;
        left: -5%;
        width: 60px;
    }
}

/* ---------- teacher-sec02 ---------- */
/******************************************************************/
.teacher-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-teacher-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-teacher-sec02 .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 右上の水色のドット */
.p-decorations-teacher-sec02 .p-deco-teacher02--1 {
    top: 2%;
    right: 5%;
    width: 85px; 
}

/* 2: 左上のピンクの三角 */
.p-decorations-teacher-sec02 .p-deco-teacher02--2 {
    top: 12%;
    left: 5%;
    width: 70px; 
}

/* 3: 右上段の黄色い円 */
.p-decorations-teacher-sec02 .p-deco-teacher02--3 {
    top: 25%;
    right: 8%;
    width: 50px; 
}

/* 4: 左中段の緑の四角 */
.p-decorations-teacher-sec02 .p-deco-teacher02--4 {
    top: 38%;
    left: 4%;
    width: 30px; 
}

/* 5: 右中段の水色の四角 */
.p-decorations-teacher-sec02 .p-deco-teacher02--5 {
    top: 52%;
    right: 5%;
    width: 40px; 
}

/* 6: 左下段のピンクのドット */
.p-decorations-teacher-sec02 .p-deco-teacher02--6 {
    top: 66%;
    left: 5%;
    width: 85px; 
}

/* 7: 右下段の黄色いアーチ */
.p-decorations-teacher-sec02 .p-deco-teacher02--7 {
    top: 78%;
    right: 7%;
    width: 85px; 
}

/* 8: 左下の黄色い円 */
.p-decorations-teacher-sec02 .p-deco-teacher02--8 {
    top: 90%;
    left: 6%;
    width: 50px; 
}

/* 9: 右下の水色の四角 */
.p-decorations-teacher-sec02 .p-deco-teacher02--9 {
    top: 97%;
    right: 4%;
    width: 50px; 
}

/* =========================================
   スマホ・タブレット表示時の調整
========================================= */
@media screen and (max-width: 768px) {
    .teacher-sec02 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-teacher-sec02 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    .p-decorations-teacher-sec02 .p-deco-teacher02--1 { top: 1%; right: -2%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--2 { top: 10%; left: -2%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--3 { top: 22%; right: -1%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--4 { top: 35%; left: -1%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--5 { top: 50%; right: -2%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--6 { top: 65%; left: -3%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--7 { top: 78%; right: -2%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--8 { top: 88%; left: -1%; }
    .p-decorations-teacher-sec02 .p-deco-teacher02--9 { top: 98%; right: -1%; }
}

/* ---------- teacher-sec03 ---------- */
/******************************************************************/
.teacher-sec03 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-teacher-sec03 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-teacher-sec03 .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 左上のピンクのドット */
.p-decorations-teacher-sec03 .p-deco-teacher03--1 {
    top: 5%;
    left: 5%;
    width: 85px; 
}

/* 2: 右下の黄色い円 */
.p-decorations-teacher-sec03 .p-deco-teacher03--2 {
    bottom: -5%; /* 少しはみ出させる場合はマイナス値に */
    right: 5%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .teacher-sec03 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-teacher-sec03 .p-deco-teacher03--1 {
        top: 2%;
        left: -2%;
        width: 50px;
    }
    .p-decorations-teacher-sec03 .p-deco-teacher03--2 {
        bottom: -2%;
        right: -2%;
        width: 30px;
    }
}









/* ===============================================================================
   学びが飽きない理由
=============================================================================== */
.page-learning {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- learning-sec01 ---------- */
/******************************************************************/
.page-learning .learning-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-learning-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-learning-sec01 .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 左上の黄色いアーチ */
.p-decorations-learning-sec01 .p-deco-learning01--1 {
    top: 5%;
    left: 10%;
    width: 85px; 
}

/* 2: 右中段の水色の四角 */
.p-decorations-learning-sec01 .p-deco-learning01--2 {
    top: 50%;
    right: 5%;
    width: 40px; 
}

/* 3: 左下のピンクのドット */
.p-decorations-learning-sec01 .p-deco-learning01--3 {
    bottom: 0%;
    left: 5%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-learning .learning-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-learning-sec01 .p-deco-learning01--1 {
        top: 2%;
        left: -2%;
        width: 45px;
    }
    .p-decorations-learning-sec01 .p-deco-learning01--2 {
        top: 40%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-learning-sec01 .p-deco-learning01--3 {
        bottom: 5%;
        left: -5%;
        width: 60px;
    }
}

/* ---------- learning-sec02 ---------- */
/******************************************************************/
.page-learning .learning-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-learning-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-learning-sec02 .p-deco {
    position: absolute;
    height: auto;
}

/* 1: 右上の水色のドット */
.p-decorations-learning-sec02 .p-deco-learning02--1 {
    top: 2%;
    right: 5%;
    width: 85px; 
}

/* 2: 左上のピンクの三角 */
.p-decorations-learning-sec02 .p-deco-learning02--2 {
    top: 40%;
    left: 5%;
    width: 70px; 
}

/* 3: 右上段の黄色い円 */
.p-decorations-learning-sec02 .p-deco-learning02--3 {
    bottom: 5%;
    right: 8%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-learning .learning-sec02 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-learning-sec02 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    .p-decorations-learning-sec02 .p-deco-learning02--1 { top: 1%; right: 0%; }
    .p-decorations-learning-sec02 .p-deco-learning02--2 { top: 40%; left: -2%; }
    .p-decorations-learning-sec02 .p-deco-learning02--3 { bottom: 5%; right: -1%; }
}

/* ---------- learning-sec03 ---------- */
/******************************************************************/
.page-learning .learning-sec03 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

/* --- カード一覧レイアウト --- */
.p-learning-cards {
    display: flex;
    flex-wrap: wrap;       
    justify-content: center; 
    gap: 30px;             
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    z-index: 2;            
}

/* --- カード本体 --- */
.p-learning-card {
    width: calc((100% - 60px) / 3); 
    background-color: #ffffff;
    border-radius: 20px;
    padding: 40px 30px 35px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    border: 1px solid #EEEEEE;
    
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
}

/* アイコンエリア（枠の指定をなくし、配置用の余白のみ残す） */
.p-learning-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

/* 画像自体のサイズ指定 */
.p-learning-card__icon img {
    width: 75px; /* 用意された画像のサイズに合わせて微調整してください */
    height: auto;
    display: block;
}

/* 見出し */
.p-learning-card__title {
    font-size: 1.05rem !important;
    font-weight: bold !important;
    color: #333333 !important;
    line-height: 1.5 !important;
    text-align: center !important;
    margin: 0 0 15px 0 !important;
    
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}
.p-learning-card__title::before,
.p-learning-card__title::after {
    display: none !important;
}

/* テキスト */
.p-learning-card__text {
    font-size: 0.9rem !important;
    line-height: 1.8 !important;
    color: #333333 !important;
    text-align: left !important;
    margin: 0 !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-learning-sec03 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-learning-sec03 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-learning-sec03 .p-deco-learning03--1 {
    top: 5%;
    left: 10%;
    width: 85px; 
}

.p-decorations-learning-sec03 .p-deco-learning03--2 {
    top: 30%;
    right: 5%;
    width: 40px; 
}

.p-decorations-learning-sec03 .p-deco-learning03--3 {
    top: 65%;
    left: 5%;
    width: 85px; 
}

.p-decorations-learning-sec03 .p-deco-learning03--4 {
    bottom: 0%;
    right: 5%;
    width: 70px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 900px) {
    .p-learning-card {
        width: calc((100% - 30px) / 2); 
    }
}

@media screen and (max-width: 768px) {
    .page-learning .learning-sec03 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    .about-sec02 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .p-learning-cards {
        gap: 20px;
    }
    .p-learning-card {
        width: 100%; 
        padding: 30px 20px;
    }
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-learning-sec03 .p-deco-learning03--1 {
        top: 2%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-learning-sec03 .p-deco-learning03--2 {
        top: 30%;
        right: -2%;
        width: 40px;
    }
    .p-decorations-learning-sec03 .p-deco-learning03--3 {
        top: 65%;
        left: -5%;
        width: 85px;
    }
    .p-decorations-learning-sec03 .p-deco-learning03--4 {
        bottom: 5%;
        right: 0%;
        width: 70px;
    }
}









/* ===============================================================================
   私たちのプログラム
=============================================================================== */
.page-program {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- program-sec01 ---------- */
/******************************************************************/
.page-program .program-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-program-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-program-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-program-sec01 .p-deco-program01--1 {
    top: 5%;
    left: 10%;
    width: 85px; 
}

.p-decorations-program-sec01 .p-deco-program01--2 {
    top: 50%;
    right: 5%;
    width: 50px; 
}

.p-decorations-program-sec01 .p-deco-program01--3 {
    bottom: 5%;
    left: 5%;
    width: 70px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-program .program-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-program-sec01 .p-deco-program01--1 {
        top: 2%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-program-sec01 .p-deco-program01--2 {
        top: 50%;
        right: -2%;
        width: 50px;
    }
    .p-decorations-program-sec01 .p-deco-program01--3 {
        bottom: 3%;
        left: -5%;
        width: 70px;
    }
}

/* ---------- program-sec02 ---------- */
/******************************************************************/
.page-program .program-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-program-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-program-sec02 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-program-sec02 .p-deco-program02--1 {
    top: 1%;
    left: 5%;
    width: 50px; 
}

.p-decorations-program-sec02 .p-deco-program02--2 {
    top: 16%;
    right: 8%;
    width: 85px; 
}

.p-decorations-program-sec02 .p-deco-program02--3 {
    top: 32%;
    left: 6%;
    width: 30px; 
}

.p-decorations-program-sec02 .p-deco-program02--4 {
    top: 48%;
    right: 5%;
    width: 50px; 
}

.p-decorations-program-sec02 .p-deco-program02--5 {
    top: 64%;
    left: 8%;
    width: 50px; 
}

.p-decorations-program-sec02 .p-deco-program02--6 {
    top: 80%;
    right: 4%;
    width: 70px; 
}

.p-decorations-program-sec02 .p-deco-program02--7 {
    bottom: 1%;
    left: 8%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-program .program-sec02 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-program-sec02 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    .p-decorations-program-sec02 .p-deco-program02--1 { top: 1%; left: -2%; }
    .p-decorations-program-sec02 .p-deco-program02--2 { top: 16%; right: 1%; }
    .p-decorations-program-sec02 .p-deco-program02--3 { top: 32%; left: -1%; }
    .p-decorations-program-sec02 .p-deco-program02--4 { top: 48%; right: -3%; }
    .p-decorations-program-sec02 .p-deco-program02--5 { top: 64%; left: 1%; }
    .p-decorations-program-sec02 .p-deco-program02--6 { top: 80%; right: -1%; }
    .p-decorations-program-sec02 .p-deco-program02--7 { bottom: 1%; left: 2%; }
}

/* ---------- program-sec03 ---------- */
/******************************************************************/
.page-program .program-sec03 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-program-sec03 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-program-sec03 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-program-sec03 .p-deco-program03--1 {
    top: 1%;
    left: 5%;
    width: 85px; 
}

.p-decorations-program-sec03 .p-deco-program03--2 {
    top: 12%;
    right: 8%;
    width: 40px; 
}

.p-decorations-program-sec03 .p-deco-program03--3 {
    top: 24%;
    left: 6%;
    width: 85px; 
}

.p-decorations-program-sec03 .p-deco-program03--4 {
    top: 36%;
    right: 5%;
    width: 70px; 
}

.p-decorations-program-sec03 .p-deco-program03--5 {
    top: 48%;
    left: 8%;
    width: 50px; 
}

.p-decorations-program-sec03 .p-deco-program03--6 {
    top: 60%;
    right: 4%;
    width: 50px; 
}

.p-decorations-program-sec03 .p-deco-program03--7 {
    top: 72%;
    left: 8%;
    width: 60px; 
}

.p-decorations-program-sec03 .p-deco-program03--8 {
    top: 84%;
    right: 4%;
    width: 85px; 
}

.p-decorations-program-sec03 .p-deco-program03--9 {
    bottom: 1%;
    left: 8%;
    width: 70px; 
}

.page-program .program-sec01 .wp-block-columns,
.page-program .program-sec02 .wp-block-columns,
.page-program .program-sec03 .wp-block-columns {
    margin-bottom: 0 !important;
}

.page-program .program-sec01 .wp-block-columns .wp-block-column,
.page-program .program-sec02 .wp-block-columns .wp-block-column,
.page-program .program-sec03 .wp-block-columns .wp-block-column {
    margin-bottom: 6em !important;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-program .program-sec03 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-program-sec03 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    .p-decorations-program-sec03 .p-deco-program03--1 { top: 1%; left: -2%; }
    .p-decorations-program-sec03 .p-deco-program03--2 { top: 12%; right: 1%; }
    .p-decorations-program-sec03 .p-deco-program03--3 { top: 24%; left: -1%; }
    .p-decorations-program-sec03 .p-deco-program03--4 { top: 36%; right: -3%; }
    .p-decorations-program-sec03 .p-deco-program03--5 { top: 48%; left: 1%; }
    .p-decorations-program-sec03 .p-deco-program03--6 { top: 60%; right: -1%; }
    .p-decorations-program-sec03 .p-deco-program03--7 { top: 72%; left: -1%; }
    .p-decorations-program-sec03 .p-deco-program03--8 { top: 84%; right: 2%; }
    .p-decorations-program-sec03 .p-deco-program03--9 { bottom: 1%; left: -2%; }
}

/* ---------- program-sec04 ---------- */
/******************************************************************/
.page-program .program-sec04 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-program-sec04 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1; /* メインコンテンツの後ろに配置 */
    overflow: hidden;
}

/* 各オブジェクトの共通設定 */
.p-decorations-program-sec04 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-program-sec04 .p-deco-program04--1 {
    top: 1%;
    left: 5%;
    width: 40px; 
}

.p-decorations-program-sec04 .p-deco-program04--2 {
    top: 11%;
    right: 8%;
    width: 85px; 
}

.p-decorations-program-sec04 .p-deco-program04--3 {
    top: 22%;
    left: 6%;
    width: 30px; 
}

.p-decorations-program-sec04 .p-deco-program04--4 {
    top: 33%;
    right: 5%;
    width: 50px; 
}

.p-decorations-program-sec04 .p-deco-program04--5 {
    top: 44%;
    left: 8%;
    width: 50px; 
}

.p-decorations-program-sec04 .p-deco-program04--6 {
    top: 55%;
    right: 4%;
    width: 70px; 
}

.p-decorations-program-sec04 .p-deco-program04--7 {
    top: 66%;
    left: 8%;
    width: 85px; 
}

.p-decorations-program-sec04 .p-deco-program04--8 {
    top: 77%;
    right: 4%;
    width: 65px; 
}

.p-decorations-program-sec04 .p-deco-program04--9 {
    top: 88%;
    left: 8%;
    width: 40px; 
}

.p-decorations-program-sec04 .p-deco-program04--10 {
    bottom: 1%;
    right: 6%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-program .program-sec04 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-program-sec04 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    .p-decorations-program-sec04 .p-deco-program04--1 { top: 1%; left: -2%; }
    .p-decorations-program-sec04 .p-deco-program04--2 { top: 11%; right: 1%; }
    .p-decorations-program-sec04 .p-deco-program04--3 { top: 22%; left: -1%; }
    .p-decorations-program-sec04 .p-deco-program04--4 { top: 33%; right: -3%; }
    .p-decorations-program-sec04 .p-deco-program04--5 { top: 44%; left: 1%; }
    .p-decorations-program-sec04 .p-deco-program04--6 { top: 55%; right: -1%; }
    .p-decorations-program-sec04 .p-deco-program04--7 { top: 66%; left: -1%; }
    .p-decorations-program-sec04 .p-deco-program04--8 { top: 77%; right: 2%; }
    .p-decorations-program-sec04 .p-deco-program04--9 { top: 88%; left: -2%; }
    .p-decorations-program-sec04 .p-deco-program04--10 { bottom: 1%; right: -2%; }
}









/* ===============================================================================
   各施設へのアクセス
=============================================================================== */
.page-access {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- access-sec01 ---------- */
/******************************************************************/
.page-access .access-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 350px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-access-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-access-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-access-sec01 .p-deco-access01--1 {
    top: 5%;
    left: 10%;
    width: 85px; 
}

.p-decorations-access-sec01 .p-deco-access01--2 {
    top: 33%;
    right: 5%;
    width: 40px; 
}

.p-decorations-access-sec01 .p-deco-access01--3 {
    top: 66%;
    left: 5%;
    width: 85px; 
}

.p-decorations-access-sec01 .p-deco-access01--4 {
    bottom: 0%;
    right: 10%;
    width: 70px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-access .access-sec01 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-access-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-access-sec01 .p-deco-access01--1 {
        top: 2%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-access-sec01 .p-deco-access01--2 {
        top: 33%;
        right: -2%;
        width: 50px;
    }
    .p-decorations-access-sec01 .p-deco-access01--3 {
        top: 66%;
        left: -5%;
        width: 70px;
    }
    .p-decorations-access-sec01 .p-deco-access01--4 {
        bottom: 2%;
        right: -2%;
        width: 50px;
    }
}









/* ===============================================================================
   瀬田校
=============================================================================== */
.page-seta {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- seta-sec01 ---------- */
/******************************************************************/
.page-seta .seta-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-seta-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-seta-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-seta-sec01 .p-deco-seta01--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--2 {
    top: 12%;
    right: 5%;
    width: 70px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--3 {
    top: 24%;
    left: 5%;
    width: 50px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--4 {
    top: 36%;
    right: 10%;
    width: 30px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--5 {
    top: 48%;
    left: 5%;
    width: 40px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--6 {
    top: 60%;
    right: 10%;
    width: 85px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--7 {
    top: 72%;
    left: 5%;
    width: 85px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--8 {
    top: 84%;
    right: 10%;
    width: 50px; 
}

.p-decorations-seta-sec01 .p-deco-seta01--9 {
    bottom: 4%;
    left: 5%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-seta .seta-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-seta-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-seta-sec01 .p-deco-seta01--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--2 {
        top: 12%;
        right: -2%;
        width: 70px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--3 {
        top: 24%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--4 {
        top: 36%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--5 {
        top: 24%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--6 {
        top: 36%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--7 {
        top: 24%;
        left: -5%;
        width: 85px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--8 {
        top: 36%;
        right: -2%;
        width: 50px;
    }
    .p-decorations-seta-sec01 .p-deco-seta01--9 {
        bottom: 0%;
        left: -5%;
        width: 50px;
    }
}

/* ---------- seta-sec02 ---------- */
/******************************************************************/
.page-seta .seta-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-seta-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-seta-sec02 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-seta-sec02 .p-deco-seta02--1 {
    top: 2%;
    left: 5%;
    width: 50px; 
}

.p-decorations-seta-sec02 .p-deco-seta02--2 {
    top: 16%;
    right: 10%;
    width: 30px; 
}

.p-decorations-seta-sec02 .p-deco-seta02--3 {
    top: 32%;
    left: 5%;
    width: 40px; 
}

.p-decorations-seta-sec02 .p-deco-seta02--4 {
    top: 48%;
    right: 10%;
    width: 85px; 
}

.p-decorations-seta-sec02 .p-deco-seta02--5 {
    top: 64%;
    left: 5%;
    width: 85px; 
}

.p-decorations-seta-sec02 .p-deco-seta02--6 {
    top: 80%;
    right: 10%;
    width: 50px; 
}

.p-decorations-seta-sec02 .p-deco-seta02--7 {
    bottom: 4%;
    left: 5%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-seta .seta-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
     /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-seta-sec02 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-seta-sec02 .p-deco-seta02--1 {
        top: 1%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-seta-sec02 .p-deco-seta02--2 {
        top: 16%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-seta-sec02 .p-deco-seta02--3 {
        top: 32%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-seta-sec02 .p-deco-seta02--4 {
        top: 48%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-seta-sec02 .p-deco-seta02--5 {
        top: 64%;
        left: -5%;
        width: 85px;
    }
    .p-decorations-seta-sec02 .p-deco-seta02--6 {
        top: 80%;
        right: -2%;
        width: 50px;
    }
    .p-decorations-seta-sec02 .p-deco-seta02--7 {
        bottom: 5%;
        left: -5%;
        width: 50px;
    }
}









/* ===============================================================================
   守山校
=============================================================================== */
.page-moriyama {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- seta-sec01 ---------- */
/******************************************************************/
.page-moriyama .moriyama-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-moriyama-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-moriyama-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-moriyama-sec01 .p-deco-moriyama01--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-moriyama-sec01 .p-deco-moriyama01--2 {
    top: 20%;
    right: 5%;
    width: 70px; 
}

.p-decorations-moriyama-sec01 .p-deco-moriyama01--3 {
    top: 40%;
    left: 5%;
    width: 50px; 
}

.p-decorations-moriyama-sec01 .p-deco-moriyama01--4 {
    top: 60%;
    right: 10%;
    width: 30px; 
}

.p-decorations-moriyama-sec01 .p-deco-moriyama01--5 {
    top: 80%;
    left: 5%;
    width: 40px; 
}

.p-decorations-moriyama-sec01 .p-deco-moriyama01--6 {
    bottome: 1%;
    right: 10%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-moriyama .moriyama-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-moriyama-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-moriyama-sec01 .p-deco-moriyama01--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-moriyama-sec01 .p-deco-moriyama01--2 {
        top: 20%;
        right: -2%;
        width: 70px;
    }
    .p-decorations-moriyama-sec01 .p-deco-moriyama01--3 {
        top: 40%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-moriyama-sec01 .p-deco-moriyama01--4 {
        top: 60%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-moriyama-sec01 .p-deco-moriyama01--5 {
        top: 80%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-moriyama-sec01 .p-deco-moriyama01--6 {
        bottom: 1%;
        right: -2%;
        width: 85px;
    }
}

/* ---------- moriyama-sec02 ---------- */
/******************************************************************/
.page-moriyama .moriyama-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-moriyama-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-moriyama-sec02 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-moriyama-sec02 .p-deco-moriyama02--1 {
    top: 1%;
    left: 5%;
    width: 50px; 
}

.p-decorations-moriyama-sec02 .p-deco-moriyama02--2 {
    top: 33%;
    right: 10%;
    width: 30px; 
}

.p-decorations-moriyama-sec02 .p-deco-moriyama02--3 {
    top: 66%;
    left: 5%;
    width: 40px; 
}

.p-decorations-moriyama-sec02 .p-deco-moriyama02--4 {
    bottom: 5%;
    right: 10%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-moriyama .moriyama-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
     /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-moriyama-sec02 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-moriyama-sec02 .p-deco-moriyama02--1 {
        top: 1%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-moriyama-sec02 .p-deco-moriyama02--2 {
        top: 33%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-moriyama-sec02 .p-deco-moriyama02--3 {
        top: 66%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-moriyama-sec02 .p-deco-moriyama02--4 {
        bottom: 2%;
        right: -2%;
        width: 85px;
    }
}









/* ===============================================================================
   草津校
=============================================================================== */
.page-kusatsu {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- seta-sec01 ---------- */
/******************************************************************/
.page-kusatsu .kusatsu-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-kusatsu-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-kusatsu-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-kusatsu-sec01 .p-deco-kusatsu01--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-kusatsu-sec01 .p-deco-kusatsu01--2 {
    top: 20%;
    right: 5%;
    width: 70px; 
}

.p-decorations-kusatsu-sec01 .p-deco-kusatsu01--3 {
    top: 40%;
    left: 5%;
    width: 50px; 
}

.p-decorations-kusatsu-sec01 .p-deco-kusatsu01--4 {
    top: 60%;
    right: 10%;
    width: 30px; 
}

.p-decorations-kusatsu-sec01 .p-deco-kusatsu01--5 {
    top: 80%;
    left: 5%;
    width: 40px; 
}

.p-decorations-kusatsu-sec01 .p-deco-kusatsu01--6 {
    bottome: 1%;
    right: 10%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-kusatsu .kusatsu-sec01 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-kusatsu-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-kusatsu-sec01 .p-deco-kusatsu01--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-kusatsu-sec01 .p-deco-kusatsu01--2 {
        top: 20%;
        right: -2%;
        width: 70px;
    }
    .p-decorations-kusatsu-sec01 .p-deco-kusatsu01--3 {
        top: 40%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-kusatsu-sec01 .p-deco-kusatsu01--4 {
        top: 60%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-kusatsu-sec01 .p-deco-kusatsu01--5 {
        top: 80%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-kusatsu-sec01 .p-deco-kusatsu01--6 {
        bottom: 1%;
        right: -2%;
        width: 85px;
    }
}




/* ---------- about-teacher-sec ---------- */
/******************************************************************/
.about-teacher-sec {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-about-teacher-sec {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-about-teacher-sec .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-about-teacher-sec .p-deco-about-teacher--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-about-teacher-sec .p-deco-about-teacher--2 {
    bottom: 5%;
    right: 5%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .about-teacher-sec {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-about-teacher-sec .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-about-teacher-sec .p-deco-about-teacher--1 {
        top: 2%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-about-teacher-sec .p-deco-about-teacher--2 {
        bottom: 0%;
        right: -2%;
        width: 50px;
    }
}









/* ===============================================================================
   よくある質問
=============================================================================== */
.page-faq {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- faq-sec01 ---------- */
/******************************************************************/
.page-faq .faq-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 350px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-faq-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-faq-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-faq-sec01 .p-deco-faq01--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--2 {
    top: 12%;
    right: 5%;
    width: 70px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--3 {
    top: 24%;
    left: 5%;
    width: 50px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--4 {
    top: 36%;
    right: 10%;
    width: 30px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--5 {
    top: 48%;
    left: 5%;
    width: 40px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--6 {
    top: 60%;
    right: 10%;
    width: 85px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--7 {
    top: 72%;
    left: 5%;
    width: 85px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--8 {
    top: 84%;
    right: 10%;
    width: 50px; 
}

.p-decorations-faq-sec01 .p-deco-faq01--9 {
    bottom: 4%;
    left: 5%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-faq .faq-sec01 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-faq-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-faq-sec01 .p-deco-faq01--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--2 {
        top: 12%;
        right: -2%;
        width: 70px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--3 {
        top: 24%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--4 {
        top: 36%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--5 {
        top: 24%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--6 {
        top: 36%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--7 {
        top: 24%;
        left: -5%;
        width: 85px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--8 {
        top: 36%;
        right: -2%;
        width: 50px;
    }
    .p-decorations-faq-sec01 .p-deco-faq01--9 {
        bottom: 0%;
        left: -5%;
        width: 50px;
    }
}









/* ===============================================================================
   プライバシーポリシー
=============================================================================== */
.page-policy {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- faq-sec01 ---------- */
/******************************************************************/
.page-policy .policy-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 350px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-policy-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-policy-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-policy-sec01 .p-deco-policy01--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-policy-sec01 .p-deco-policy01--2 {
    top: 20%;
    right: 5%;
    width: 70px; 
}

.p-decorations-policy-sec01 .p-deco-policy01--3 {
    top: 40%;
    left: 5%;
    width: 50px; 
}

.p-decorations-policy-sec01 .p-deco-policy01--4 {
    top: 60%;
    right: 10%;
    width: 30px; 
}

.p-decorations-policy-sec01 .p-deco-policy01--5 {
    top: 80%;
    left: 5%;
    width: 40px; 
}

.p-decorations-policy-sec01 .p-deco-policy01--6 {
    bottom: 2%;
    right: 10%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-policy .policy-sec01 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-policy-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-policy-sec01 .p-deco-policy01--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-policy-sec01 .p-deco-policy01--2 {
        top: 20%;
        right: -2%;
        width: 70px;
    }
    .p-decorations-policy-sec01 .p-deco-policy01--3 {
        top: 40%;
        left: -5%;
        width: 50px;
    }
    .p-decorations-policy-sec01 .p-deco-policy01--4 {
        top: 60%;
        right: -2%;
        width: 30px;
    }
    .p-decorations-policy-sec01 .p-deco-policy01--5 {
        top: 80%;
        left: -5%;
        width: 40px;
    }
    .p-decorations-policy-sec01 .p-deco-policy01--6 {
        bottom: 0%;
        right: -2%;
        width: 85px;
    }
}









/* ===============================================================================
   スタッフ募集
=============================================================================== */
.page-recruit {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

/* ---------- recruit-sec01 ---------- */
/******************************************************************/
.page-recruit .recruit-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 100px !important;
    padding-bottom: 50px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec01 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec01 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec01 .p-deco-recruit01--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-recruit-sec01 .p-deco-recruit01--2 {
    top: 33%;
    right: 5%;
    width: 40px; 
}

.p-decorations-recruit-sec01 .p-deco-recruit01--3 {
    top: 66%;
    left: 5%;
    width: 85px; 
}

.p-decorations-recruit-sec01 .p-deco-recruit01--4 {
    bottom: 1%;
    right: 10%;
    width: 70px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec01 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec01 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec01 .p-deco-recruit01--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec01 .p-deco-recruit01--2 {
        top: 33%;
        right: -2%;
        width: 40px;
    }
    .p-decorations-recruit-sec01 .p-deco-recruit01--3 {
        top: 66%;
        left: -5%;
        width: 85px;
    }
    .p-decorations-recruit-sec01 .p-deco-recruit01--4 {
        bottom: 0%;
        right: -2%;
        width: 70px;
    }
}

/* ---------- recruit-sec02 ---------- */
/******************************************************************/
.page-recruit .recruit-sec02 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec02 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec02 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec02 .p-deco-recruit02--1 {
    top: 0%;
    left: 10%;
    width: 50px; 
}

.p-decorations-recruit-sec02 .p-deco-recruit02--2 {
    top: 50%;
    right: 5%;
    width: 40px; 
}

.p-decorations-recruit-sec02 .p-deco-recruit02--3 {
    bottom: 5%;
    left: 5%;
    width: 30px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec02 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec02 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec02 .p-deco-recruit02--1 {
        top: 0%;
        left: -2%;
        width: 50px;
    }
    .p-decorations-recruit-sec02 .p-deco-recruit02--2 {
        top: 50%;
        right: -2%;
        width: 40px;
    }
    .p-decorations-recruit-sec02 .p-deco-recruit02--3 {
        bottom: 0%;
        left: -5%;
        width: 30px;
    }
}

/* ---------- recruit-sec03 ---------- */
/******************************************************************/
.page-recruit .recruit-sec03 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 50px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec03 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec03 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec03 .p-deco-recruit03--1 {
    top: 0%;
    right: 10%;
    width: 85px; 
}

.p-decorations-recruit-sec03 .p-deco-recruit03--2 {
    top: 25%;
    left: 5%;
    width: 70px; 
}

.p-decorations-recruit-sec03 .p-deco-recruit03--3 {
    top: 50%;
    right: 5%;
    width: 50px; 
}

.p-decorations-recruit-sec03 .p-deco-recruit03--4 {
    top: 75%;
    left: 5%;
    width: 30px; 
}

.p-decorations-recruit-sec03 .p-deco-recruit03--5 {
    bottom: 5%;
    right: 5%;
    width: 60px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec03 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec03 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec03 .p-deco-recruit03--1 {
        top: 0%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec03 .p-deco-recruit03--2 {
        top: 25%;
        left: -2%;
        width: 70px;
    }
    .p-decorations-recruit-sec03 .p-deco-recruit03--3 {
        top: 50%;
        right: -5%;
        width: 50px;
    }
    .p-decorations-recruit-sec03 .p-deco-recruit03--4 {
        top: 75%;
        left: -2%;
        width: 30px;
    }
    .p-decorations-recruit-sec03 .p-deco-recruit03--5 {
        bottom: 0%;
        right: -5%;
        width: 60px;
    }
}

/* ---------- recruit-sec04 ---------- */
/******************************************************************/
.page-recruit .recruit-sec04 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec04 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec04 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec04 .p-deco-recruit04--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-recruit-sec04 .p-deco-recruit04--2 {
    top: 50%;
    right: 5%;
    width: 40px; 
}

.p-decorations-recruit-sec04 .p-deco-recruit04--3 {
    bottom: 3%;
    left: 5%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec04 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec04 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec04 .p-deco-recruit04--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec04 .p-deco-recruit04--2 {
        top: 50%;
        right: -2%;
        width: 40px;
    }
    .p-decorations-recruit-sec04 .p-deco-recruit04--3 {
        bottom: 0%;
        left: -5%;
        width: 85px;
    }
}

/* ---------- recruit-sec05 ---------- */
/******************************************************************/
.page-recruit .recruit-sec05 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* ===============================================
   求める人物像（大歓迎 / ごめんなさい）カード
=============================================== */
/* --- 全体のラッパー（2カラム配置） --- */
.p-condition-cards {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
}

/* --- カード本体のベーススタイル --- */
.p-condition-card {
    width: calc(50% - 15px); /* 半分の幅から隙間の半分を引く */
    background-color: #ffffff;
    border-radius: 20px;
    padding: 35px 30px;
    box-sizing: border-box;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03); /* ほんのりとした影 */
}

/* --- カード見出し（ピル型背景） --- */
.p-condition-card__header {
    text-align: center !important;
    padding: 12px 20px !important;
    border-radius: 50px !important;
    font-size: 1.1rem !important;
    font-weight: bold !important;
    color: #333333 !important;
    margin: 0 0 20px 0 !important;
    
    /* SWELL見出しの装飾リセット */
    border: none !important;
    background: none; 
}
.p-condition-card__header::before,
.p-condition-card__header::after {
    display: none !important;
}

/* --- リスト全体の枠 --- */
.p-condition-card__list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* --- 個別のリスト項目 --- */
.p-condition-card__list li {
    display: flex;
    align-items: center;
    padding: 12px 0;
}
/* 最後の項目だけ下の線を消す */
.p-condition-card__list li:last-child {
    border-bottom: none !important;
}

/* アイコン画像エリア */
.p-condition-card__icon {
    flex-shrink: 0; /* テキストが長くても画像を縮小させない */
    width: 30px;    /* ★アイコン画像の表示サイズ */
    margin-right: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.p-condition-card__icon img {
    width: 100%;
    height: auto;
    display: block;
}

/* リストテキスト */
.p-condition-card__text {
    font-size: 0.95rem !important;
    font-weight: bold !important;
    color: #333333 !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}


/* =========================================
   カラーバリエーションごとの装飾設定
========================================= */

/* --- 左側：大歓迎（ピンク系） --- */
/* 見出し背景 */
.p-condition-card--welcome .p-condition-card__header {
    background-color: #fce2e5 !important; 
}
/* 見出しの強調文字色 */
.p-condition-card--welcome .p-condition-card__header span {
    color: #f08395; 
}
/* リスト間の区切り線（点線） */
.p-condition-card--welcome .p-condition-card__list li {
    border-bottom: 2px dotted #fbd3d8;
}

/* --- 右側：ごめんなさい（ブルー系） --- */
/* 見出し背景 */
.p-condition-card--sorry .p-condition-card__header {
    background-color: #cbe6f5 !important; 
}
/* 見出しの強調文字色 */
.p-condition-card--sorry .p-condition-card__header span {
    color: #3b8bb8; 
}
/* リスト間の区切り線（点線） */
.p-condition-card--sorry .p-condition-card__list li {
    border-bottom: 2px dotted #c4e1f1;
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec05 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec05 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec05 .p-deco-recruit05--1 {
    top: 5%;
    right: 2%;
    width: 85px; 
}

.p-decorations-recruit-sec05 .p-deco-recruit05--2 {
    bottom: 6%;
    left: 5%;
    width: 50px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec05 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* 縦並びに変更 */
    .p-condition-cards {
        flex-direction: column;
        gap: 20px;
    }
    
    /* カードの幅を100%にする */
    .p-condition-card {
        width: 100%;
        padding: 25px 20px;
    }
    
    /* 文字サイズの微調整 */
    .p-condition-card__header {
        font-size: 1.05rem !important;
        padding: 10px 15px !important;
        margin-bottom: 20px !important;
    }
    .p-condition-card__text {
        font-size: 0.9rem !important;
    }
    
    /* アイコンサイズの微調整 */
    .p-condition-card__icon {
        width: 25px;
        margin-right: 12px;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec05 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec05 .p-deco-recruit05--1 {
        top: 0%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec05 .p-deco-recruit05--2 {
        bottom: 5%;
        left: -2%;
        width: 50px;
    }
}

/* ---------- recruit-sec06 ---------- */
/******************************************************************/
.page-recruit .recruit-sec06 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec06 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec06 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec06 .p-deco-recruit06--1 {
    top: 0%;
    right: 5%;
    width: 85px; 
}

.p-decorations-recruit-sec06 .p-deco-recruit06--2 {
    top: 50%;
    left: 5%;
    width: 85px; 
}

.p-decorations-recruit-sec06 .p-deco-recruit06--3 {
    bottom: 3%;
    right: 5%;
    width: 60px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec06 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec06 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec06 .p-deco-recruit06--1 {
        top: 0%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec06 .p-deco-recruit06--2 {
        top: 50%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec06 .p-deco-recruit06--3 {
        bottom: 0%;
        right: -5%;
        width: 60px;
    }
}

/* ---------- recruit-sec07 ---------- */
/******************************************************************/
.page-recruit .recruit-sec07 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 20px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec07 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec07 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec07 .p-deco-recruit07--1 {
    top: 0%;
    left: 10%;
    width: 50px; 
}

.p-decorations-recruit-sec07 .p-deco-recruit07--2 {
    top: 50%;
    right: 5%;
    width: 40px; 
}

.p-decorations-recruit-sec07 .p-deco-recruit07--3 {
    bottom: 5%;
    left: 5%;
    width: 30px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec07 {
        padding-top: 50px !important;
        padding-bottom: 20px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec07 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec07 .p-deco-recruit07--1 {
        top: 0%;
        left: -2%;
        width: 50px;
    }
    .p-decorations-recruit-sec07 .p-deco-recruit07--2 {
        top: 50%;
        right: -2%;
        width: 40px;
    }
    .p-decorations-recruit-sec07 .p-deco-recruit07--3 {
        bottom: 0%;
        left: -5%;
        width: 30px;
    }
}

/* ---------- recruit-sec08 ---------- */
/******************************************************************/
.page-recruit .recruit-sec08 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 100px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec08 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec08 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec08 .p-deco-recruit08--1 {
    top: 0%;
    right: 2%;
    width: 85px; 
}

.p-decorations-recruit-sec08 .p-deco-recruit08--2 {
    top: 25%;
    left: 3%;
    width: 70px; 
}

.p-decorations-recruit-sec08 .p-deco-recruit08--3 {
    top: 50%;
    right: 5%;
    width: 50px; 
}

.p-decorations-recruit-sec08 .p-deco-recruit08--4 {
    top: 75%;
    left: 8%;
    width: 30px; 
}

.p-decorations-recruit-sec08 .p-deco-recruit08--5 {
    bottom: 3%;
    right: 3%;
    width: 40px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec08 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec08 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec08 .p-deco-recruit08--1 {
        top: 0%;
        right: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec08 .p-deco-recruit08--2 {
        top: 25%;
        left: -2%;
        width: 70px;
    }
    .p-decorations-recruit-sec08 .p-deco-recruit08--3 {
        top: 50%;
        right: -5%;
        width: 50px;
    }
    .p-decorations-recruit-sec08 .p-deco-recruit08--4 {
        top: 75%;
        left: -2%;
        width: 30px;
    }
    .p-decorations-recruit-sec08 .p-deco-recruit08--5 {
        bottom: 0%;
        right: -5%;
        width: 40px;
    }
}

/* ---------- recruit-sec09 ---------- */
/******************************************************************/
.page-recruit .recruit-sec09 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
    /*overflow: visible !important;*/
}

/* --- 背景の装飾オブジェクト --- */
.p-decorations-recruit-sec09 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
    /*z-index: 11 !important;
    overflow: visible !important;*/
}

/* 各オブジェクトの共通設定 */
.p-decorations-recruit-sec09 .p-deco {
    position: absolute;
    height: auto;
}

.p-decorations-recruit-sec09 .p-deco-recruit09--1 {
    top: 0%;
    left: 10%;
    width: 85px; 
}

.p-decorations-recruit-sec09 .p-deco-recruit09--2 {
    top: 50%;
    right: 5%;
    width: 40px; 
}

.p-decorations-recruit-sec09 .p-deco-recruit09--3 {
    bottom: 5%;
    left: 5%;
    width: 85px; 
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-recruit .recruit-sec09 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    
    /* スマホ表示ではオブジェクトを小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec09 .p-deco {
        transform: scale(0.7); /* 全体を70%に縮小して調整の手間を減らす */
        transform-origin: center center;
    }
    
    /* スマホ表示ではオブジェクトを少し小さくし、画面端寄りに配置 */
    .p-decorations-recruit-sec09 .p-deco-recruit09--1 {
        top: 0%;
        left: -2%;
        width: 85px;
    }
    .p-decorations-recruit-sec09 .p-deco-recruit09--2 {
        top: 50%;
        right: -2%;
        width: 40px;
    }
    .p-decorations-recruit-sec09 .p-deco-recruit09--3 {
        bottom: 0%;
        left: -5%;
        width: 85px;
    }
}









/* ===============================================================================
   お問い合わせ
=============================================================================== */
.page-contact {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

.page-contact .contact-sec01 {
    position: relative;
    z-index: 0;
    padding-top: 50px !important;
    padding-bottom: 350px !important;
}

.page-contact .contact-sec01 .snow-monkey-form {
    background-color: #FFFFFF;
    padding: 60px;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .page-contact .contact-sec01 {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
}







/* ===============================================================================
   お知らせ（ブログページ）
=============================================================================== */
.blog {
    background-color: #FCF7F4;
}
.blog .l-content {
    padding-top: 100px !important;
    padding-bottom: 350px !important;
}
.single .l-content,
.archive .l-content,
.category .l-content{
    padding-top: 4em !important;
    padding-bottom: 350px !important;
}

.l-sidebar .c-widget {
    margin-bottom: 3em;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .blog .l-content {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
    .single .l-content,
    .archive .l-content,
    .category .l-content{
        padding-top: 4em !important;
        padding-bottom: 120px !important;
    }
}















































/* ===============================================================================
   固定ページ共通フッター画像
=============================================================================== */

/* =========================================
   汎用：画像をブラウザの横幅100%に広げるクラス
========================================= */
.u-full-width-img {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-bottom: 23px !important; 
    position: relative !important;
    z-index: 10 !important;
    padding-bottom: 3px !important; 
}

.u-full-width-img img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}






/* ===============================================================================
   フッターエリア全体・ウィジェットの余白調整
=============================================================================== */
.w-beforeFooter {
    margin: 0 auto !important;
    overflow: hidden;
}

/* SWELLウィジェットエリアの余白リセットと階層引き上げ（上にかぶせる） */
#before_footer_widget {
    /* ★マイナスの値で上に引っ張り上げる（かぶせる深さ） */
    margin-top: -300px !important; 
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    /* 上のセクションの背景に潜り込まないよう手前に出す */
    position: relative !important;
    z-index: 10 !important;
}

/* ウィジェット内部の邪魔な下余白を全て強制リセット */
#before_footer_widget .l-container,
#before_footer_widget .widget,
#before_footer_widget .textwidget {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.c-widget + .c-widget {
    margin-top: 0 !important;
}

/* =========================================
   フッター直前ウィジェットのイラスト
========================================= */
/* 1. イラストを画面幅いっぱいに広げる */
.footer-illust {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-bottom: 0 !important;
    line-height: 0 !important;
    position: relative;
    z-index: 10;
}

/* 2. 画像特有の隙間を消し、めり込み防止の白線を引く */
.footer-illust img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}

/* ===============================================================================
   カスタムフッター本体（.p-custom-footer）
=============================================================================== */
/* 大枠（背景色と上部の紫ライン） */
.p-custom-footer {
    background-color: #FAF7F5;
    border-top: 5px solid #95007b;
    padding: 60px 20px;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    box-sizing: border-box;
}

.p-custom-footer__inner {
    max-width: 1000px;
    margin: 0 auto;
}

/* --- グリッドレイアウト --- */
/* 上段の3列レイアウト */
.p-custom-footer__btn-row-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 20px;
}

/* 中段の2列レイアウト */
.p-custom-footer__btn-row-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-bottom: 40px;
}

/* --- 各種ボタン共通設定 --- */
.p-custom-footer__btn {
    background: #ffffff;
    border-radius: 15px;
    padding: 15px 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    text-decoration: none !important;
    color: #1a1a1a !important;
    font-weight: bold;
    font-size: 1.1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    transition: all 0.3s ease;
    height: 90px;
    box-sizing: border-box;
}

.p-custom-footer__btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
    opacity: 1 !important;
}

/* ボタン内のアイコン画像 */
.p-custom-footer__btn img {
    width: 40px;
    height: auto;
}
.p-custom-footer__btn-row-2 .p-custom-footer__btn img {
    width: 50px; /* 中段（2列）のアイコンだけ大きく */
}

/* 中段右「お問い合わせ」のテキスト拡大 */
.p-custom-footer__btn-row-2 .p-custom-footer__btn:last-child span {
    font-size: 1.4rem !important;
    letter-spacing: 1px;
}

/* 電話ボタン内のテキスト調整 */
.p-custom-footer__btn--tel .text-wrap {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}
.p-custom-footer__btn--tel .sub {
    font-size: 0.85rem;
}
.p-custom-footer__btn--tel .main {
    font-size: 1.8rem !important;
    letter-spacing: 1px;
}

/* --- 下段：テキストリンクエリア --- */
.p-custom-footer__info {
    text-align: center;
}

.p-custom-footer__info .logo-text {
    font-size: 1.2rem;
    font-weight: bold;
    letter-spacing: 1.5px;
    margin-bottom: 5px;
    color: #1a1a1a;
}

/* テキストリンクの横並び */
.p-custom-footer__info .nav-links {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 0;
}

.p-custom-footer__info .nav-links li {
    position: relative;
    padding: 0 7px 0 3px;
}

/* | の区切り線を描画（一番最後には付けない） */
.p-custom-footer__info .nav-links li:not(:last-child)::after {
    content: "|";
    position: absolute;
    right: 0;
    color: #333333;
}

.p-custom-footer__info .nav-links a {
    text-decoration: none;
    color: #333;
    font-size: 0.9rem;
}
.p-custom-footer__info .nav-links a:hover {
    color: #95007b;
}

/* 採用詳細ボタン */
.p-custom-footer__info .recruit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #95007b;
    color: #ffffff !important;
    padding: 15px 50px;
    border-radius: 50px;
    font-weight: bold;
    text-decoration: none !important;
    transition: opacity 0.3s;
}
.p-custom-footer__info .recruit-btn:hover {
    opacity: 0.8;
}

/* =========================================
   スマホ表示時のレイアウト調整
========================================= */
@media screen and (max-width: 768px) {
    /* ウィジェットのかぶせる量をスマホ用に減らす */
    #before_footer_widget {
        margin-top: -120px !important;
    }

    /* ボタンをすべて縦1列にする */
    .p-custom-footer__btn-row-3,
    .p-custom-footer__btn-row-2 {
        grid-template-columns: 1fr;
    }
    
    /* リンクを縦並びにして、区切り線(|)を消す */
    .p-custom-footer__info .nav-links {
        flex-direction: column;
        gap: 10px;
    }
    .p-custom-footer__info .nav-links li:not(:last-child)::after {
        display: none;
    }
}









/* ===============================================================================
   ページが見つかりませんでした
=============================================================================== */
.error404 {
    
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
}

.error404 .l-content {
    padding-top: 100px !important;
    padding-bottom: 350px !important;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
    .error404 .l-content {
        padding-top: 50px !important;
        padding-bottom: 120px !important;
    }
}