@charset "UTF-8";
/* CSS Document */


/*太字*/
#page2 strong {
	color: black;
}
/*記事内赤文字下線リンク*/
#page2 .articleLink {
	color: #bf253a!important;
    text-decoration: underline!important;
}
#page2 .articleLink:hover {
    text-decoration: none!important;
}
/*li黒丸*/
#page2 .list--style {
    list-style: disc;
    padding-left: 2rem;
}
/*外部リンクアイコン*/
.exLinkIcon::after {
    content: "";
    display: inline-block;
    background: url(/global-data/20250128111516208.svg) no-repeat 50% 0;
    background-size: contain;
    width: 20px;
    height: 20px;
    position: absolute;
    left: auto;
    margin-left: 5px;
}
/*h4ピンクタイトル*/
.h4PinkTitle {
	color: #f18772!important;
    font-weight: bold!important;
}
.question {
padding-top: 20px;
}
.borderPinkTop {
border-top: 2px solid #f6c0b2;	
}
.borderPinkRight {
border-right: 2px solid #f6c0b2;	
}
.borderPinkBottom {
border-bottom: 2px solid #f6c0b2;	
}
.borderPinkLeft {
border-left: 2px solid #f6c0b2;	
}
/*ヘッダーナビゲーション*/
#header nav ul li a::before, #header ul.menuFirst li a::after{
display: none !important;
}
#header nav ul.menuFirst li a .txt img {
	max-height: 20px;
	width: auto;
}
#header nav ul a .txt:after {
	background-size: contain;
}
/* --- ドロップダウンメニューのアクセシビリティ修正 --- */

/* 親liの位置基準を担保 */
.menuFirst > li {
	position: relative!important;
}

/* 下層メニューの初期状態（display:none を使わず安全に隠す） */
ul.localMenuUl {
	opacity: 0!important;
	visibility: hidden!important;
	pointer-events: none!important; /* 非表示時にクリック・フォーカスさせない */
	position: absolute!important;
	top: 100%!important;
	left: 0!important;
	transition: opacity 0.3s ease, visibility 0.3s ease!important;
	z-index: 1000!important;
}

/* ホバー時、および親li内部にフォーカスが存在する時に表示（:focus-within） */
.menuFirst > li:hover > ul.localMenuUl,
.menuFirst > li:focus-within > ul.localMenuUl {
	opacity: 1!important;
	visibility: visible!important;
	pointer-events: auto!important;
}
/*関連記事リスト*/
.relationPostWrap .extCatList5_WL .bCatListLabel .bcatlabel {
	font-size: 1.3rem;
}
.extCatList5 ul.extCatListUL li strong {
	margin: 15px 0 0 0;
    font-size: 1.6rem;
}
.relationPostWrap .hBorderBottomPink .title:after {
	width: 180px!important;
}
.relationPostWrap .extCatList5 ul.extCatListUL {
justify-content: space-around;
margin-right: 0!important;
}
.relationPostWrap .extCatList5 ul.extCatListUL li {
max-width: 250px;
}
/*Q&Aアイコン*/
h3 .icon_q {
    position: relative;
}
h3 .icon_q::before {
    content: "";
    background-image: url(/global-data/20260629060900244.png);
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin-right: 1rem;
}
.icon_a::before {
    content: "";
    background-image: url(/global-data/20260626065323888.png);
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    vertical-align: middle;
    margin-right: 1rem;
}
/*ナビゲーションメニュー改修260810*/
#header nav ul a.knowledge .txt::after {
	background-image: url(https://www.okanouenooisyasan.com/global-data/20260810114601904.png)!important;
}
#header nav ul a.life-plan .txt::after {
	background-image: url(https://www.okanouenooisyasan.com/global-data/20260810114601963.png)!important;
}
#header nav ul a.worries .txt::after {
	background-image: url(https://www.okanouenooisyasan.com/global-data/2026081011460219.png)!important;
}
#header nav ul a.faq .txt::after {
	background-image: url(https://www.okanouenooisyasan.com/global-data/20260810114601835.png)!important;
}
#header nav ul a.contents .txt:after {
    background-image: url(https://www.okanouenooisyasan.com/global-data/20260810114601611.png) !important;
}
#header .head .kanagawa {
  top: 0px!important;
}
/*2026アクセシビリティ最適化　アコーディオンメニューサイズ修正*/
ul.localMenuUl > li > a, 
ul.localMenuUl>li>a span.txtOuter {
    /* 修正前: font-size: 13px; */
    font-size: 1.5rem!important; /* 13px 相当（13 ÷ 16 = 0.8125rem） */
}
/*知識ページの5つメニュー200%対応*/
.bCustomS .bcu_link_inner span.bcu_link_content {
	line-height: 1.25em;
}
.category-navi {}
/*ボタンタグのフォーカス*/
/* キーボード・マウス問わずフォーカス時に表示 */
.btnRed:focus,
input[type="submit"]:focus,
button:focus {
  outline: 2px solid #0056b3 !important;
  outline-offset: 2px !important;
}

/* マウス操作時はアウトラインを消し、キーボード操作時だけ出したい場合 */
.coverSlide2025 .swiper-slide:focus-visible {
     position: relative; z-index: 9999; 
	outline: 3px solid #005fcc;
	outline-offset: -3px;
}
/*見出しのクラスに対してフォントサイズ調整*/
.bTtlS.type11 .inner .title {
    font-size: 2.4rem !important; /* ルートの文字サイズ変化に直接連動 */
}
/* 1. 画像リンク自体をブロック化し、フォーカス枠を「内側」に収める */
/*a.bcu_inner {
  display: block !important;
}*/
a.bcu_inner:focus-visible {
  outline: 3px solid #0056b3 !important;
  outline-offset: -3px !important; /* ★マイナス指定で画像の「内側」に枠線を描画（親の overflow:hidden 回避） */
  position: relative !important;
  z-index: 10 !important;
}/* カテゴリナビのリンク要素本体にフォーカス枠を設定 */
.category-navi2 .bcu_link a:focus-visible,
.category-navi .bcu_link a:focus-visible {
  outline: 3px solid #0056b3 !important;
  outline-offset: -3px !important; /* 内側に収めて overflow: hidden による切れを防ぐ */
  position: relative !important;
  z-index: 10 !important;
}

/* 擬似要素（チェックマーク）側はフォーカス枠の描画対象から除外する */
.category-navi2 .bcu_link a:focus-visible::after,
.category-navi .bcu_link a:focus-visible::after {
  outline: none !important;
}
/*横並びカテゴリ選択メニュー*/
.category-navi2 a, .category-navi a {
	min-height: 70px!important;
	height: auto;
}
/* Firefox対策（:focusも併記）および overflow:hidden によるカットの回避 */
.bcu_link > a[href="/supervisor/"]:focus,
.bcu_link > a[href="/supervisor/"]:focus-visible,
#unit-47998 .bcu_link > a:focus,
#unit-47998 .bcu_link > a:focus-visible {
  display: block !important;
  border-radius: 5px !important;
  outline: 3px solid #0056b3 !important;
  outline-offset: -2px !important; /* ★マイナスにしてボタンの内側に枠線を描画 */
  position: relative !important;
  z-index: 10 !important;
}
/* ページ内リンクの遷移先（IDが付いた要素）の上部に余白を設ける */
span[id], h3[id] {
  scroll-margin-top: 90px; /* ★ヘッダーの高さ（＋少しの余裕）を指定 */
}
/*知識ページ　フォントサイズ調整*/
.taglist {
	font-size: 0.8em;
}
#contentsAreaSection .taglistBase a {
	color: #4c3c26;
}
/* bingoが出力するクラスに対してremで上書き */
.ttlAreaWrapper .subtext {
  font-size: 1.2rem !important; /* 12px相当 */
}

.ttlAreaWrapper .title {
  font-size: 2.4rem !important; /* 24px相当（サイトの指定に合わせて調整） */
}
.bcu_title h4 {
  font-size: 2rem !important; 
}
.page-taglist {
	font-size: 1.2rem;
}
/*
 * 200倍（200%）拡大時の表示崩れ対策
 *
 * 【仕組み】
 * 文字が大きく（または画面幅が相対的に狭く）なった時だけ実行。
 * 本の背景画像を消し、テキストを縦一列に並べることで、
 * 文字がどれだけ大きくなっても収まるようにする（レスポンシブ化）。
 */

/*
 * ブラウザの文字サイズが大きく変更された時（200%拡大など）だけ発動
 * 1000px幅の要素の場合、100rem（1000px÷10px）以下になった判定で処理を実行
 */
@media screen and (max-width: 80rem) {

  /* 1. 本の背景画像を消し、文字量に合わせて縦に自動伸縮（height: auto）させる */
  .index-list .bcontainer-inner { /* ★実際の「本の背景画像がセットされている親要素のCSSクラス名」に変更してください */
    background-image: none !important;
    background: none !important;
    height: auto !important;
    min-height: auto !important;
    padding: 20px 0 !important;
  }

  /* 2. 左側・右側の要素の高さ固定（height）や絶対位置（position: absolute）を解除 */
  .index-list .bcontainer-inner .box1,
  .index-list .bcontainer-inner .box2 {
    position: static !important; /* 絶対配置を解除して下に流れるようにする */
    height: auto !important;     /* 高さを自動にして下側があふれるのを防ぐ */
  }

  /* 3. 2カラムが横並びで下溢れする場合は縦一列に配置 */
  .index-list .bcontainer-inner .bCustomS {
    display: block !important;
    height: auto !important;
  }
}