@charset "utf-8";

/* ===== 旧バナー（第43回まで・.ibn）を消す。キャッシュ HTML（最大30日）に残っている分 ===== */
.ibn-sec,
.ibn {
	display: none !important;
}

/* ===== 固定バナー（第44回） =====
	クラス名に banner / ad / promo / popup を使わない（EasyList のパス名ルール対策）。接頭辞は ibp。
	画像は背景に敷き、aspect-ratio を画像と一致させる（どの幅でも歪まない）。
	既定はスマホ・狭いカラム用（左側の切り出し 920×674 / 無料登録は 920×580）。
	PC かつカラム 600px 以上のときだけ横長（1440×480＝3:1）に切り替える。
	切り替えをカラム幅（.ibp-sec のコンテナクエリ）で見るのは第43回と同じ理由:
	/td/results のようにウィンドウが広くてもカラムが 340〜432px しかない面がある。 */
.ibp-sec {
	container-type: inline-size;
	container-name: ibpsec;
	margin: 1.3em 0 1.7em;
}

.ibp {
	position: relative;
	display: block;
	width: 100%;
	max-width: 460px;
	margin: 0 auto;
	aspect-ratio: 920 / 674;
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 0 0 0 1px #dbe4f0;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 100%;
	background-color: #f3f6fb;
	text-decoration: none;
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.ibp:hover {
	box-shadow: 0 0 0 1px #b9cde8, 0 4px 16px rgba(10, 37, 80, 0.16);
}

.ibp-f_blue,
.ibp-f_white {
	aspect-ratio: 920 / 580;
}

/* 画像内の文言（読み上げ用）。見た目には出さない */
.ibp-t {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.ibp-s_top   { background-image: url(/assets/n/i/ibp_s_top_sp_1109.webp); }
.ibp-s_topb  { background-image: url(/assets/n/i/ibp_s_topb_sp_1110.webp); }
.ibp-s_wl    { background-image: url(/assets/n/i/ibp_s_wl_sp_1109.webp); }
.ibp-s_scr   { background-image: url(/assets/n/i/ibp_s_scr_sp_1109.webp); }
.ibp-s_mcp   { background-image: url(/assets/n/i/ibp_s_mcp_sp_1109.webp); }
.ibp-f_blue  { background-image: url(/assets/n/i/ibp_f_blue_sp_1109.webp); }
.ibp-f_white { background-image: url(/assets/n/i/ibp_f_white_sp_1109.webp); }

@media only screen and (min-width: 960px) {
	@container ibpsec (min-width: 600px) {
		.ibp,
		.ibp-f_blue,
		.ibp-f_white {
			/* 11-09 ユーザー指示: 旧固定バナーと同じく本文カラムいっぱいに広げる（左右の端を本文と揃える） */
			max-width: none;
			aspect-ratio: 1440 / 480;
		}
		.ibp-s_top   { background-image: url(/assets/n/i/ibp_s_top_pc_1109.webp); }
		.ibp-s_topb  { background-image: url(/assets/n/i/ibp_s_topb_pc_1110.webp); }
		.ibp-s_wl    { background-image: url(/assets/n/i/ibp_s_wl_pc_1109.webp); }
		.ibp-s_scr   { background-image: url(/assets/n/i/ibp_s_scr_pc_1109.webp); }
		.ibp-s_mcp   { background-image: url(/assets/n/i/ibp_s_mcp_pc_1109.webp); }
		.ibp-f_blue  { background-image: url(/assets/n/i/ibp_f_blue_pc_1109.webp); }
		.ibp-f_white { background-image: url(/assets/n/i/ibp_f_white_pc_1109.webp); }
	}
}

/* ===== ポップアップ（中央モーダル・popup.js は不変） =====
	画像は 1440×480（3:1）。箱は popup.css の max-width:720px のまま＝PC では 720×240 で出る。
	スマホでは横長のままだと文字が小さすぎるので、左側の切り出し画像に差し替える
	（img の content 置き換え。Chrome・Safari で効く。効かないブラウザでも横長画像がそのまま出るだけ）。 */
#ib-popup-box img[src*="/ibp_"] {
	background: #fff;
}

@media (max-width: 600px) {
	#ib-popup-box img[src*="/ibp_s_top_pc_"]   { content: url(/assets/n/i/ibp_s_top_sp_1109.webp); }
	#ib-popup-box img[src*="/ibp_s_topb_pc_"]  { content: url(/assets/n/i/ibp_s_topb_sp_1110.webp); }
	#ib-popup-box img[src*="/ibp_s_wl_pc_"]    { content: url(/assets/n/i/ibp_s_wl_sp_1109.webp); }
	#ib-popup-box img[src*="/ibp_s_scr_pc_"]   { content: url(/assets/n/i/ibp_s_scr_sp_1109.webp); }
	#ib-popup-box img[src*="/ibp_s_mcp_pc_"]   { content: url(/assets/n/i/ibp_s_mcp_sp_1109.webp); }
	#ib-popup-box img[src*="/ibp_f_blue_pc_"]  { content: url(/assets/n/i/ibp_f_blue_sp_1109.webp); }
	#ib-popup-box img[src*="/ibp_f_white_pc_"] { content: url(/assets/n/i/ibp_f_white_sp_1109.webp); }
	#ib-popup-box {
		max-width: 400px;
	}
}

/* ==================================================================
   運用スイッチ（このファイルを上げ直すと 5 分で全ページに効く）
   ■ 固定バナー全停止      .ibp-sec { display: none !important; }
   ■ 1 枚だけ止める        notice.php の $IB_NOTICE_W で重み 0（即時なら .ibp-s_mcp { display:none!important } でも可）
   ■ ポップアップ全停止    #ib-popup-box { display: none !important; }
                           #ib-popup-overlay { background: transparent !important; pointer-events: none !important; }
                           #ib-popup-overlay #ib-consent { pointer-events: auto; }
   ■ 画像の差し替え        画像は 90 日キャッシュなので必ず新しいファイル名で上げ、ここの url() を替える
   ================================================================== */

/* ==================================================================
	ヘッダー下の重なり修正（第39回・2026-10-26）

	V1 は固定ヘッダー（.ch）と、PC の固定左サイドバー（.chb-title / .pdl / .ibai）で
	組まれている。AdSense 自動広告が body の先頭（header より前）に入ると
	  - 広告の上部が固定ヘッダーの裏に隠れる
	  - PC では広告の左端に固定サイドバーが重なる
	  - パンくず（header nav.nv）が広告の高さぶん押し下げられ、サイドバーとかぶる
	AdSense の除外エリアでは固定ヘッダーを選べず、プレビューにもこの広告は出ないので CSS で逃がす。
	広告は隠さない（非表示はポリシー違反のおそれ）。位置だけずらす。

	トップ（body.page-top）:
	  固定ヘッダーの下に固定の .section-bar もあるのに、本文の開始位置がほかのページと同じで、
	  広告がなくても本文の先頭が青いバーの裏に潜っていた（スマホで約130px・PCで約13px）。
	  固定バーの下端（スマホ 132px＝48+84／PC 120px＝70+50）ぶん body ごと下げる。
	  padding-top ではなく margin-top にしている理由: スマホのアンカー広告が body に
	  style="padding: 0 0 164px" を直接書き込み、padding-top が上書きされるため。
	  PC は .ccc の padding-top:80px（ヘッダー70px分）を 0 にして二重に空かないようにする。

	トップ以外:
	  先頭の広告だけを、ヘッダーの下（スマホ 48px／PC 70px）へ下げる。
	  PC はサイドバー（左1%＋幅170〜210px）の右へ寄せる。広告があるときだけパンくずも同じだけ右へ寄せる。
	  padding ではなく margin-left＋width:auto にしている理由: padding だと AdSense が
	  iframe を 1200px 固定で描き、右にはみ出して横スクロールが出たため。
   ================================================================== */
body.page-top{margin-top:132px}
body:not(.page-top) > .google-auto-placed:first-child{margin-top:48px}
@media only screen and (min-width:768px){
	body.page-top{margin-top:120px}
	body.page-top .ccc{padding-top:0}
	body:not(.page-top) > .google-auto-placed:first-child{margin-top:70px;margin-left:calc(1% + 230px);width:auto!important;overflow:hidden}
	body:not(.page-top):has(> .google-auto-placed:first-child) header nav.nv{padding-left:calc(1% + 230px)}
}


