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

/* ヘッダー部分全体の位置調整と下にラインを入れる */
.l-header{
	margin-bottom:-30px;
    padding-bottom: 0px;              /* 線との間隔 */
  position: relative; /* 擬似要素の基準にする */
}
.l-header::after {
  content: "";
  display: block;
  width: 1300px;             /* ← コンテンツ幅に合わせる */
  max-width: 92vw;           /* ← 画面が狭いときは自動で縮む保険 */
  height: 5px;              /* ← 太さ */
  background: #3BBF5C;       /* ← 色 */
  margin: 0 auto;            /* ← 中央寄せ */
}

/* ヘッダーの並び（ロゴ→検索→メニュー） */
.l-header__inner{
  display:flex;
  align-items:center;
  gap:30px;
}

/* 検索フォームのスタイル（現在不使用） */
.header-search.pc_{ display:flex; align-items:center; }
.header-search.pc_{
  width: 300px; max-width: 36vw; margin-top:0px;
  padding: 10px 12px !important;
}

/* 検索窓の高さ調整（現在不使用）*/
.c-searchForm__s {
  height: 30px !important;         /* 入力欄の高さ */
  line-height: 30px !important;    /* テキストの縦位置を合わせる */
  padding: 0 12px !important;      /* 上下0 / 左右12px に調整 */
  box-sizing: border-box !important;
}
.header-search .c-searchForm__submit{
  margin-left:8px; border-radius:6px;
  height: 30px !important;         /* 検索ボタンの高さも合わせる */
  width: 30px !important;          /* 正方形にする場合 */
}

/* 検索窓の高さ調整*/
.wp-block-search__input{
  height: 30px !important;         /* 入力欄の高さ */
  line-height: 30px !important;    /* テキストの縦位置を合わせる */
  padding: 0 12px !important;      /* 上下0 / 左右12px に調整 */
  box-sizing: border-box !important;
}

/* メニューは右端へ */
.l-header__gnav{ margin-left:auto; }

/* SPで折り返す場合（必要なら） */
@media (max-width:1024px){
  .header-search{ flex-basis:100%; }
  .header-search .search-field{ width:100%; }
}



/* グローバルナビ全体に共通のライン */
/* メインメニューの横並び間隔を広げる */
.c-gnav { column-gap: 10px; height: 40px; margin-top:60px;}

/* リンク本体 */
.c-gnav > li > a{
  position: relative;
  display: inline-block;
  padding: 5x 8px 0px !important;
  color: #333 !important;
  text-decoration: none;
  font-weight: 700;
  line-height: 1.3;
}

/* 文字サイズは .ttl にも当てるのがコツ */
.c-gnav > li > a,
.c-gnav > li > a .ttl{
  font-size: 14px !important;
}


/* 下ライン（常時表示） */
.c-gnav > li > a::after{
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 3px;
  background: #8acdea;          /* デフォルトのライン色 */
  opacity: .55;                  /* 常時うっすら見せる */
  transform: scaleX(1);          /* ← 常時表示ポイント */
  transition: opacity .25s ease, background-color .25s ease, height .25s ease;
}

/* 下ライン（常時表示）の色を行ごとに変更 */
.c-gnav > li.menu-item-69  > a::after{ background:#3BBF5C; } /* あ行：グリーン */
.c-gnav > li.menu-item-70  > a::after{ background:#F23545; } /* か行：赤 */
.c-gnav > li.menu-item-71  > a::after{ background:#F2C335; } /* さ行：イエロー */
.c-gnav > li.menu-item-72  > a::after{ background:#0583F2; } /* た行：ブルー */
.c-gnav > li.menu-item-73  > a::after{ background:#333; } /* な行：黒 */
.c-gnav > li.menu-item-74  > a::after{ background:#3BBF5C; } /* は行：グリーン */
.c-gnav > li.menu-item-75  > a::after{ background:#F23545; } /* ま行：赤 */
.c-gnav > li.menu-item-76  > a::after{ background:#F2C335; } /* や行：イエロー */
.c-gnav > li.menu-item-77  > a::after{ background:#0583F2; } /* ら行：ブルー */
.c-gnav > li.menu-item-78  > a::after{ background:#333; } /* わ行：黒 */

/* ホバー時は少し濃く・太く */
.c-gnav > li > a:hover::after,
.c-gnav > li.current-menu-item > a::after,
.c-gnav > li.current_page_item > a::after{
  opacity: 1;
  height: 4px;
}

/* ホバー時の文字色（お好みで） */
.c-gnav > li > a:hover{
  color: #0e6ba8;
}



/* ヒーローラッパー：比率固定・最小高さを無効化 */
#block-5 .wp-block-cover{
  width: 100%;
  aspect-ratio: 16 / 9 !important;  /* ここを好みで 2/1 や 21/9 に */
  min-height: auto !important;
  height: auto !important;
  overflow: hidden;
}
/* 画像は親にフィットさせて比率維持 */
#block-5 .wp-block-cover__image-background{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: right center;     /* キャラを右に見せたい場合 */
  display: block;
}

/* カバーのオーバーレイ（色味）を使わないなら消す（任意） */
/* #block-5 .wp-block-cover__background{ display:none; } */