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

.c-gnav a::after { background: #5C4033 !important;}

/* Contact Form 7 が自動でフォーム先頭に差し込む Turnstile を全消し */
.wpcf7 form > .cf-turnstile { 
  display:none !important; 
}
 
/* 自分で置いたラッパーのものは表示する */
.turnstile-wrap .cf-turnstile { 
  display:block !important; 
}
 
/* レイアウト安定用 */
.turnstile-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  margin:16px 0 12px;
  min-height:44px;   /* 成功メッセージで高さがズレないように */
}
.cf-turnstile, .cf-turnstile > iframe{
  display:block;
  max-width:100%;
}


/* ========= リセット & 共通設定 ========= */
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 1.2em;   /* ↑0 ↓1.2em に統一 */
  padding: 0;
  font-weight: 400 !important;
  line-height: 1.4;
  /* 好みでフォントを変更 */
  /* font-family: "Noto Sans JP", sans-serif; */
}

/* ========= サイズ指定 ========= */
h1 { font-size: clamp(2.4rem, 5vw, 3.2rem); }   /* 例: 38–51px */
h2 { font-size: clamp(2.0rem, 4vw, 2.8rem); }   /* 例: 32–45px */
h3 { font-size: clamp(1.6rem, 3vw, 2.2rem); }   /* 例: 26–35px */
h4 { font-size: 1.4rem; }                       /* 22px */
h5 { font-size: 1.2rem; }                       /* 19px */
h6 { font-size: 1.0rem; }                       /* 16px */

/* ========= SWELL 独自クラスも上書き ========= */
/* ブロックエディタで挿入される装飾タイトル */
.c-mainTitle,
.c-blockTitle,
.c-postTitle,
.l-entry h2,
.l-entry h3,
.l-entry h4,
.l-entry h5,
.l-entry h6 {
  margin: inherit;
  padding: inherit;
  font: inherit;
  line-height: inherit;
  font-weight: 400;
}

/* もし「装飾ライン・アイコン」も不要なら非表示に */
.c-mainTitle::before,
.c-mainTitle::after,
.c-blockTitle::before,
.c-blockTitle::after {
  display: none !important;
}

/* 見出し本体 ─ 背景・ボーダー・影をゼロに */
h1, h2, h3, h4, h5, h6,
.c-mainTitle, .c-blockTitle, .c-postTitle,
.l-entry h2, .l-entry h3, .l-entry h4, .l-entry h5, .l-entry h6 {
  background: none !important;
  border:     none !important;
  box-shadow: none !important;
}

/* 擬似要素（before / after）の装飾をゼロに */
h1::before,  h1::after,
h2::before,  h2::after,
h3::before,  h3::after,
h4::before,  h4::after,
h5::before,  h5::after,
h6::before,  h6::after,
.c-mainTitle::before, .c-mainTitle::after,
.c-blockTitle::before, .c-blockTitle::after,
.c-postTitle::before, .c-postTitle::after {
  content: none !important;   /* 中身を消す */
  display: none !important;   /* 要素自体を消す */
}

h2 > span {
  position: relative;
  display: inline-block;
  padding-left: 60px;       /* ← アイコン幅 + 文字との間隔（調整可） */
}

h2 > span::before {
    content: '';
    position: absolute;
    left: 0;
    top: 51%;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background: url(https://kbm-law.jp/wp-content/uploads/2025/08/kbmlogo2.png) no-repeat center / contain;
    display: block !important;
    pointer-events: none;
}
/* =========================================
   Contact Form 7 - Compact & Responsive UI
   ※配色は元の意図（#333 / #f9f9f9 / #5C4033）を踏襲
   ========================================= */

/* ブロック包み込み（空指定の修正） */
.wp-block-contact-form-7-contact-form-selector {
  width: 100%;
}

/* ベース */
.wpcf7 {
  max-width: 760px;           /* 1000 → 760 でコンパクト */
  margin: 0 auto;
  padding: 16px;               /* 30 → 16 */
  background-color: #f9f9f9;   /* 踏襲 */
  border-radius: 8px;          /* 10 → 8 */
  box-shadow: 0 0 8px rgba(0,0,0,0.04); /* やや軽く */
  line-height: 1.6;
  font-size: 15px;             /* 全体をやや小さめに統一 */
}

/* 行間（p要素の間隔を詰める） */
.wpcf7-form > p {
  margin: 10px 0;              /* 1.5em → 10px */
}

/* タイトル（存在する場合） */
.wpcf7-form-title {
  font-size: 18px;             /* 24/30 → 18 */
  font-weight: 700;
  text-align: left;            /* センター → 左寄せで詰まって見えにくくしない */
  margin: 0 0 12px;
  color: #333;                 /* 踏襲 */
}

/* ラベル */
.wpcf7 label {
  display: block;
  margin: 0 0 6px;             /* 8 → 6 */
  font-weight: 600;
  color: #333;                 /* 踏襲 */
  font-size: 14px;             /* 24 → 14 でコンパクト */
}

/* 必須マーク（元の仕組みを踏襲） */
.wpcf7 .wpcf7-form-control-wrap.required::before {
  content: "必須";
  display: inline-block;
  background-color: #e74c3c;
  color: #fff;
  font-size: 11px;             /* 12 → 11 */
  padding: 1px 6px;
  margin-right: 8px;
  border-radius: 3px;
  vertical-align: middle;
}

/* 入力系（テキスト/メール/電話/日付/セレクト/テキストエリア） */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="date"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  padding: 8px 10px;           /* 12 → 8/10 */
  margin: 0;                   /* p の margin で縦間隔を管理 */
  border: 1px solid #ddd;
  border-radius: 6px;          /* 5 → 6（角を少しだけ滑らかに） */
  font-size: 15px;             /* 24 → 15 */
  background-color: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}

/* フォーカス */
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="date"]:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
  border-color: #4a90e2;
  outline: none;
  box-shadow: 0 0 0 3px rgba(74,144,226,0.12);
}

/* テキストエリア */
.wpcf7 textarea {
  min-height: 120px;           /* 150 → 120 */
  resize: vertical;
}

/* セレクトのカスタム矢印（軽量・小さめ） */
.wpcf7 select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg fill="black" xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path d="M6 8l4 4 4-4"/></svg>');
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 16px;
  padding-right: 30px;         /* 矢印分の余白 */
}

/* チェックボックス＆ラジオのレイアウト */
.wpcf7 .wpcf7-checkbox,
.wpcf7 .wpcf7-radio {
  display: block;
  margin: 8px 0 6px;           /* 20 → 詰める */
}

.wpcf7 .wpcf7-list-item {
  display: inline-flex;         /* ラベルと垂直中央を揃えやすく */
  align-items: center;
  gap: 6px;
  margin: 0 14px 8px 0;        /* 0 20 10 0 → 0 14 8 0 */
}

.wpcf7 .wpcf7-list-item-label {
  margin: 0;
  cursor: pointer;
  font-size: 14px;             /* 24 → 14 */
}

.wpcf7 input[type="submit"] {
  display: block;
  margin: 14px auto 0; /* 上余白14px、左右自動で中央寄せ */
  min-width: 180px;
  max-width: 100%;
  padding: 10px 16px;
  background-color: #fff;
  color: #000;
  border: 1px solid #5C4033;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}

.wpcf7 input[type="submit"]:hover {
  background-color: #5C4033;    /* 踏襲 */
  color: #fff;
}

/* エラー（フィールド単体のヒント） */
.wpcf7 .wpcf7-not-valid-tip {
  color: #e74c3c;
  font-size: 12px;              /* 14 → 12 */
  margin-top: 4px;              /* -15/15 → 正方向に微調整 */
}

/* エラー/成功メッセージ（旧クラス互換 + 新仕様も対応） */
.wpcf7 .wpcf7-validation-errors,
.wpcf7 .wpcf7-acceptance-missing,
.wpcf7 form.invalid .wpcf7-response-output {
  border: 2px solid #e74c3c;
  background-color: rgba(231,76,60,0.08);
  color: #e74c3c;
  padding: 10px 12px;           /* 15 → 10/12 */
  margin-top: 12px;
  border-radius: 6px;
  font-size: 14px;
}

.wpcf7 .wpcf7-mail-sent-ok,
.wpcf7 form.sent .wpcf7-response-output {
  border: 2px solid #2ecc71;
  background-color: rgba(46,204,113,0.08);
  color: #2ecc71;
  padding: 10px 12px;
  margin-top: 12px;
  border-radius: 6px;
  font-size: 14px;
}

/* プライバシーポリシー同意 */
.wpcf7 .privacy-policy-acceptance {
  margin: 14px 0;               /* 30 → 14 */
  padding: 10px;                /* 15 → 10 */
  background-color: #fff;       /* 踏襲 */
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 14px;
}

/* 日付ピッカーのインジケータ */
.wpcf7 input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0.8;                 /* 0.7 → 0.8（視認性ちょいUP） */
  cursor: pointer;
}

/* -------------------------
   レスポンシブ
   ------------------------- */
@media (max-width: 768px) {
  .wpcf7 {
    padding: 14px;              /* 20 → 14 に統一 */
  }
  .wpcf7-form-title {
    font-size: 16px;            /* 20 → 16 */
    margin-bottom: 10px;
  }
  .wpcf7 label {
    font-size: 13px;
  }
  .wpcf7 input[type="submit"] {
    display: block;
    width: 100%;                /* モバイルは全幅 */
    min-width: 0;
    margin-top: 12px;
  }
  .wpcf7 .wpcf7-list-item {
    display: flex;              /* モバイルは縦方向に密に */
    margin: 0 0 8px 0;
  }
}

@media (max-width: 480px) {
  .wpcf7 {
    padding: 12px;              /* さらに小さく */
  }
  .wpcf7 input[type="text"],
  .wpcf7 input[type="email"],
  .wpcf7 input[type="tel"],
  .wpcf7 input[type="date"],
  .wpcf7 select,
  .wpcf7 textarea {
    font-size: 14px;            /* 指あたり誤タップを避けつつ詰める */
    padding: 8px 10px;
  }
  .wpcf7 .privacy-policy-acceptance {
    font-size: 13px;
  }
}


.l-header__bar{
	display: none !important;
}

/* ─── 汎用フェードイン ───────────────────────── */
.fade-in-up   {opacity:0; transform:translateY(30px); transition:.6s ease-out;}
.fade-in-left {opacity:0; transform:translateX(-30px);transition:.6s ease-out;}
.fade-in-right{opacity:0; transform:translateX(30px); transition:.6s ease-out;}
.is-visible   {opacity:1; transform:none;}

/* ─── 立体感のあるシャドー（レイアウトに影響しない） ─── */
.card-shadow        {box-shadow:0 8px 24px rgba(0,0,0,.05); transition:box-shadow .3s;}
.card-shadow:hover  {box-shadow:0 12px 32px rgba(0,0,0,.14);}

/* ─── 画像ズーム（ホバ－時だけ） ───────────────── */
.img-zoom           {overflow:hidden;}
.img-zoom img       {transition:transform 1s ease;}
.img-zoom:hover img {transform:scale(1.05);}    

/* ─── パララックス用コンテナ ───────────────────── */
[data-parallax]     {will-change:transform;}



.gothic-font {
  font-family:
    "Noto Sans CJK JP",
    sans-serif;
}

.button-style .swell-block-button__link{
    background-color: #fff;
	color: #3e3a39;
	border-color: #fff;
	opacity:0.8
}

.button-style-01 .swell-block-button__link:hover{
    background-color: #5C4033;
	color: #fff;
}

.button-style-01 .swell-block-button__link{
    background-color: #fff;
	color: #0c0c0c;
	border-color: #0c0c0c;
	opacity:0.8
}

.button-style .swell-block-button__link:hover{
    background-color: #5C4033
;
	color: #fff;
}

body,
body *,
.swl-fz,
.u-fz-l,
.u-fz-xl,
.u-fz-m,
.u-fz-s,
.u-fz-xs,
[class^="swl-"],
[class*=" swl-"],
[class^="u-fz"],
[class*=" u-fz"],
.swl-inline-color,
.swl-inline-color *,
.swl-block-step__title,
.swl-block-step__body {
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  font-style: normal;
}

.wp-block-pullquote.yurai-design{
	border-top: none;
	border-bottom:none;
}
.wp-block-pullquote.yurai-design-top{
	border-top: none;
	border-bottom: 1px solid #666;
}

.yurai-padding blockquote{
  padding: 1.5em .5em 1.5em .5em;
}

.c-gnav>.menu-item>a .ttl{
	font-size: 20px;
}

.l-fixHeader__inner .l-container{
	max-width:1800px
}

.sp-fv,
.pc-fv{
	height: 100vh
}

.zen-kaku-gothic-new-regular{
  font-family: "Zen Kaku Gothic New", sans-serif !important;
  font-weight: 400;
  font-style: normal;
}

.c-pageTitle{
	display:none;
}

.swell-block-accordion__title .u-fz-xl,
.swell-block-accordion__body .u-fz-xl {
  font-size: 1.6rem !important;  /* 必要に応じて調整可能 */
  line-height: 1.6;
}

.swell-block-accordion__title{
  padding: 1.2em 2em;
}
.swell-block-accordion__body{
  padding: 2em;
}

/* ==============================================
 * 1. 共通シャドーユーティリティ
 * ============================================== */
.rich-shadow {                       /* 任意のブロックに class="rich-shadow" を追加すればOK */
  box-shadow: 0 12px 32px rgba(0,0,0,.12);
  border-radius: 12px;               /* 角丸はお好みで */
  overflow: hidden;                  /* はみ出し防止 */
}

/* ==============================================
 * 2. Saach LP 主要ブロックを一括でリッチ化
 * ============================================== */
/* カバー (動画背景セクション) */
.wp-block-cover.alignfull,
.wp-block-cover.alignwide {
  box-shadow: 0 16px 40px rgba(0,0,0,.18);
}

/* メディアテキストの白背景カード部分 */
.wp-block-media-text .wp-block-group.has-background {
  box-shadow: 0 10px 28px rgba(0,0,0,.12);
  border-radius: 8px;
  padding: 2rem;
}



/* アコーディオン */
.swell-block-accordion__item {
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  border-radius: 8px;
  background: #fff;
  margin-bottom: 20px;
}

/* ロゴやアイキャッチ画像に軽めのシャドー */
.wp-block-image img {
  box-shadow: 0 4px 12px rgba(0,0,0,.08);
  border-radius: 6px;
}

.no-shadow.wp-block-image img {
	box-shadow: none !important;
}

/* ==============================================
 * 3. モバイルだけシャドーを弱めたい場合
 * ============================================== */
@media (max-width: 768px) {
  .wp-block-cover.alignfull,
  .wp-block-cover.alignwide {
    box-shadow: 0 6px 20px rgba(0,0,0,.14);
  }
}

.c-gnav a::after{
  background: #0091d4;	
}