/*
 * ファミリーホール本体サイト 共通CSS
 * ヘッダー / グローバルナビ / SPメニュー / 固定バナー / 追従バー / フッター / モーダル / 共通CTA / 共通見出し
 * すべて body.ns-fh 配下のクラス(ns-)にだけ当てる。要素セレクタ単体では書かない。
 * 色の使い分け: 紺(--fh-navy)は地と資料請求 / 朱(--fh-red)は電話だけ / 緑(--fh-now)は電話の「受付中」だけ / 生成り(--fh-cream)は式場の行の地。
 */

.ns-fh {
	--fh-navy: #333786;
	--fh-deep: #11137a;
	--fh-red: #cc4f41;
	--fh-red-dark: #db311e;
	--fh-pink: #eb345f;
	--fh-pink-text: #da214d;
	--fh-orange: #f28510;
	--fh-green: #567652;
	--fh-nav-bg: #f4f9fc;
	--fh-foot-bg: #f8f8f8;
	--fh-line: #eeeeee;
	--fh-muted: #999999;
	--fh-yokohama: #007cba;
	--fh-kawasaki: #333786;
	--fh-fujisawa: #583081;
	--fh-funabashi: #4da29a;
	--fh-kashiwa: #11688f;
	--fh-now: #0c8542;
	--fh-cream: #f5f0e3;
	--fh-cream-line: #dcd6c6;
	--fh-serif: var(--wp--preset--font-family--serif);
	--fh-sans: var(--wp--preset--font-family--sans);
	--fh-num: var(--wp--preset--font-family--num);
	--fh-inner: 1300px;

	/* 旧サイトと同じ本文。ベースの base サイズは可変(PC で 17px)・行間 1.5 なので 16px / 1.7 に戻す */
	font-size: 16px;
	line-height: 1.7;

	/* 旧サイトと同じ字送り。ベーステーマの palt(字詰め)は行の折り返し位置がずれるので戻す */
	letter-spacing: 0.8px;
	font-feature-settings: normal;
}

.ns-fh.ns-menu-open,
.ns-fh.ns-modal-open {
	overflow: hidden;
}

/* ------------------------------------------------------------------
 * 共通ユーティリティ
 * ------------------------------------------------------------------ */

.ns-inner {
	width: min(var(--fh-inner), 100% - 40px);
	margin-inline: auto;
}

.ns-inner--narrow {
	width: min(990px, 100% - 40px);
}

.ns-sp {
	display: none;
}

.ns-ico-tel,
.ns-ico-ext,
.ns-ico-chev {
	display: inline-block;
	flex: 0 0 auto;
	vertical-align: middle;
}

.ns-ico-ext {
	margin-left: 4px;
}

.ns-stars {
	display: inline-flex;
	gap: 1px;
	color: #dad80e;
	vertical-align: middle;
}

.ns-stars svg {
	display: block;
}

/* パンくず(投稿・一覧・固定ページ共通) */
/* 旧サイトはブラウザ既定の禁則(auto)。ベースの strict だと「ー」の前で折り返せず 1 行増える箇所がある */
.ns-fh :is(p, li, dd, dt, th, td, figcaption, blockquote, h1, h2, h3, h4, h5, h6) {
	line-break: auto;
}

/* パンくずは旧サイトと同じく文字の流れで折り返す(項目ごとに折り返さない) */
.ns-crumb {
	margin: 10px 0;
	font-size: 12px;
	line-height: 1.7;
}

.ns-crumb__list {
	display: block;
}

.ns-crumb__item {
	display: inline;
}

.ns-crumb__sep {
	margin: 0 4.2px;
}

.ns-crumb a {
	display: inline;
	color: #333333;
	text-decoration: none;
}

.ns-crumb a:hover {
	text-decoration: underline;
}

/* 見出し(com-tit-01 相当) */
.ns-tit {
	font-family: var(--fh-serif);
	font-size: 33px;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	color: #333333;
	margin-bottom: 30px;
}

.ns-tit__top {
	display: block;
	font-family: var(--fh-sans);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.4;
	margin-bottom: 7px;
}

.ns-tit__mini {
	font-size: 28px;
}

.ns-tit__main {
	display: inline;
	font-size: 36px;
	line-height: 1.4;
	color: var(--fh-navy);
	background: #ffffff;
	padding: 3px;
	margin-left: 3px;
}

.ns-tit__main--blue {
	background: #eaecf7;
}

.ns-tit__num {
	font-family: var(--fh-num);
	font-size: 54px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--fh-navy);
}

/* 大見出し(com-tit-02 相当) */
.ns-tit2 {
	font-family: var(--fh-serif);
	font-size: 32px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	color: #333333;
	margin-bottom: 20px;
}

.ns-tit2__num {
	font-family: var(--fh-num);
	font-size: 53px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--fh-navy);
}

.ns-tit2__point {
	color: var(--fh-navy);
}

/* 「特徴 1」 */
.ns-feature {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	overflow: hidden;
	color: var(--fh-navy);
	margin-bottom: 30px;
}

/* 旧サイトは 177px の罫線画像を絶対配置している(内側の端が中央から 83px)。
   SP は枠からはみ出す描き方なので、はみ出しは overflow: hidden で止める */
.ns-feature__rule {
	position: absolute;
	top: 50%;
	right: calc(50% + 83px);
	display: block;
	width: 177px;
	height: 1px;
	max-width: none;
	margin-top: -1px;
}

.ns-feature__rule--r {
	right: auto;
	left: calc(50% + 83px);
	transform: scaleX(-1);
}

.ns-feature__label {
	font-family: var(--fh-serif);
	font-size: 35px;
	font-weight: 600;
	line-height: 1;
	margin-top: 10px;
}

.ns-feature__num {
	font-family: var(--fh-num);
	font-size: 73px;
	font-weight: 400;
	line-height: 1;
}

/* ピルボタン(一覧はこちら) */
.ns-pill {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	max-width: 380px;
	margin: 0 auto;
	padding: 15px;
	background: var(--fh-deep);
	border: 1px solid var(--fh-deep);
	border-radius: 50px;
	color: #ffffff;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	text-align: center;
	text-decoration: none;
}

.ns-pill:hover {
	text-decoration: none;
	opacity: 0.85;
}

/* 補足文(flow_text) */
.ns-flowtext {
	width: min(1040px, 100%);
	margin: 0 auto 20px;
	padding: 30px;
	background: rgba(247, 247, 240, 0.5);
	border: 1px solid #e9e7df;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.7;
	text-align: center;
}

/* 横長バナー3種 */
.ns-widebnrs {
	display: flow-root;
}

.ns-widebnrs li {
	margin-bottom: 30px;
	text-align: center;
}

.ns-widebnrs a,
.ns-widebnrs button {
	display: block;
	margin: 0 auto;
	padding: 0;
	max-width: 1103px;
}

.ns-widebnrs img {
	width: 100%;
	height: auto;
}

/* ------------------------------------------------------------------
 * ヘッダー
 * ------------------------------------------------------------------ */

.ns-head {
	position: relative;
	z-index: 1000;
	background: #ffffff;
}

.ns-head__belt {
	background: #ffffff;
}

.ns-head__inner {
	width: min(var(--fh-inner), 100% - 40px);
	margin-inline: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	height: 74px;
}

.ns-head__logo {
	flex: 0 0 auto;
	line-height: 0;
}

.ns-head__logo a {
	display: block;
}

.ns-head__logo img {
	width: 370px;
	height: auto;
}

.ns-head__rel {
	display: flex;
	gap: 8px;
}

.ns-head__pill {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 168px;
	height: 54px;
	padding: 0 14px 0 5px;
	border: 2px solid currentColor;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
}

/* 旧サイトの丸矢印(Font Awesome の擬似要素)を SVG の実要素で置き換えたもの */
.ns-head__pill .ns-ico-circle {
	position: absolute;
	top: 50%;
	right: 5px;
	width: 13px;
	height: 13px;
	/* home.css が .ns-ico-circle を赤で塗るので、ここはピルの色を継がせる */
	color: inherit;
	transform: translateY(-50%);
}

.ns-head__pill:hover {
	text-decoration: none;
	opacity: 0.8;
}

.ns-head__pill small {
	display: block;
	font-size: 14px;
	font-weight: 700;
}

.ns-head__pill--navy {
	color: var(--fh-navy);
}

.ns-head__pill--green {
	color: var(--fh-green);
}

.ns-head__util {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ns-head__tel {
	position: relative;
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 270px;
	height: 56px;
	padding: 0 24px 0 14px;
	background: #ffffff;
	border: 1px solid var(--fh-red);
	border-radius: 50px;
	box-shadow: 3px 3px 0 var(--fh-red);
	color: var(--fh-red);
	line-height: 1.1;
}

.ns-head__tel-lead {
	font-size: 13px;
	font-weight: 700;
	color: #333333;
}

.ns-head__tel-num {
	display: flex;
	align-items: center;
	gap: 4px;
	font-family: var(--fh-serif);
	font-size: 20px;
	font-weight: 600;
	white-space: nowrap;
}

/* 旧サイトは「はこちら」だけ 18px。20px のままだと 270px の枠で 2 行に折り返す */
.ns-head__tel-sub {
	font-size: 18px;
}

/* 旧サイトの右端の矢印(擬似要素の三角)を SVG で置き換えたもの */
.ns-head__tel > .ns-ico-chev {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
}

.ns-head__inq {
	display: block;
	line-height: 0;
}

.ns-head__inq img {
	width: 288px;
	height: auto;
}

.ns-head__burger {
	display: none;
}

/* グローバルナビ(PC) */
.ns-gnav {
	position: relative;
	background: var(--fh-nav-bg);
	border-top: 1px solid #bcd7e3;
	border-bottom: 3px solid var(--fh-navy);
}

/* スマホのメニューにだけ出す部品(先頭の案内と式場の行・資料請求・関連サイト) */
.ns-gnavhurry,
.ns-gnav__doc,
.ns-gnavrel {
	display: none;
}

.ns-gnav__list {
	width: min(var(--fh-inner), 100% - 40px);
	margin-inline: auto;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	height: 54px;
}

/* ベースの reset が ul[class] の padding を 0 にするので 2 クラスで書く */
.ns-gnav .ns-gnav__list {
	padding-left: 20px;
}

.ns-gnav__item {
	display: flex;
	align-items: center;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
}

/* 項目はリンク。押すと電話のポップアップを開く 2 つ(式場一覧・朱の「お急ぎの方はこちらから」)はボタン */
.ns-gnav__item > a,
.ns-gnav__item > button {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 20px;
	color: #333333;
	text-decoration: none;
	border-right: 1px solid #b9c3cc;
}

.ns-gnav__item > button {
	font: inherit;
	letter-spacing: inherit;
}

.ns-gnav__item > a:hover,
.ns-gnav__item > button:hover {
	color: var(--fh-navy);
	text-decoration: none;
}

.ns-gnav__item--home > a {
	padding-left: 6px;
}

.ns-gnav__home-txt {
	display: none;
}

.ns-gnav__item--sp {
	display: none;
}

.ns-gnav__item:has(+ .ns-gnav__item--hurry) > a {
	border-right: 0;
}

.ns-gnav__item--hurry {
	align-self: stretch;
}

.ns-gnav__item--hurry > button {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	width: 236px;
	height: 100%;
	padding: 7px 26px 5px 14px;
	background: var(--fh-red);
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	white-space: nowrap;
	border-right: 0;
	position: relative;
}

.ns-gnav__item--hurry > button:hover {
	color: #ffffff;
	opacity: 0.9;
}

.ns-gnav__hurry-lead {
	display: block;
	font-size: 13px;
}

.ns-gnav__item--hurry .ns-ico-chev {
	position: absolute;
	right: 10px;
	top: 50%;
	margin-top: -6px;
}

/* プルダウン */
.ns-gnav__item--sub {
	position: static;
}

.ns-gnav__sub {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	display: none;
	background: #ffffff;
	padding: 5px 0;
	z-index: 100;
	box-shadow: 0 8px 12px rgba(0, 0, 0, 0.08);
}

.ns-gnav__item--sub:hover .ns-gnav__sub,
.ns-gnav__item--sub:focus-within .ns-gnav__sub {
	display: block;
}

.ns-gnav__sublist {
	width: min(var(--fh-inner), 100% - 40px);
	margin-inline: auto;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	padding: 12px 0 12px 110px;
}

.ns-gnav__sublist a {
	display: block;
	width: 170px;
	color: #333333;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	border: 0;
	padding: 0;
}

.ns-gnav__sublist a:hover {
	color: var(--fh-navy);
}

.ns-gnav__thumb {
	display: block;
	margin-bottom: 6px;
}

.ns-gnav__thumb img {
	width: 170px;
	height: 110px;
	object-fit: cover;
	border-radius: 4px;
}

.ns-gnav__bg {
	display: none;
}

/* SPクイックバー(PCでは出さない) */
.ns-spquick {
	display: none;
}

/* PC右端の固定バナー */
.ns-sidebnr__item {
	position: fixed;
	right: 0;
	z-index: 900;
	display: block;
	padding: 0;
	line-height: 0;
}

.ns-sidebnr__item--line {
	top: 85px;
}

.ns-sidebnr__item--reason {
	top: 170px;
}

.ns-sidebnr__item--club {
	top: 340px;
}

.ns-sidebnr__item--inquiry {
	top: 500px;
}

/* ------------------------------------------------------------------
 * PC 追従下部バー / SP 下端固定バー
 * ------------------------------------------------------------------ */

.ns-footbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1001;
	background: var(--fh-navy);
	transform: translateY(100%);
	transition: transform 0.3s ease;
}

.ns-footbar.is-show {
	transform: none;
}

.ns-footbar__inner {
	width: min(var(--fh-inner), 100% - 40px);
	margin-inline: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 4px 0;
}

.ns-footbar__logo {
	line-height: 0;
}

.ns-footbar__logo img {
	width: 378px;
	height: auto;
	padding: 5px;
}

.ns-footbar__tel {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 270px;
	height: 54px;
	padding: 0;
	background: var(--fh-red-dark);
	border-radius: 10px;
	color: #ffffff;
	line-height: 1;
}

.ns-footbar__tel-lead {
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	margin-top: 2px;
}

.ns-footbar__tel-num {
	font-family: var(--fh-serif);
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.5px;
	line-height: 1;
	margin-top: 5px;
}

.ns-footbar__tel-num small {
	font-size: 14px;
}

.ns-footbar__btn {
	display: block;
	line-height: 0;
}

.ns-footbar__btn img {
	height: 66px;
	width: auto;
}

.ns-spbar {
	display: none;
}

/* ------------------------------------------------------------------
 * フッター
 * ------------------------------------------------------------------ */

.ns-foot {
	margin-top: 20px;
	background: var(--fh-foot-bg);
	padding: 60px 0 120px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.7;
}

.ns-foot__inner {
	width: min(var(--fh-inner), 100% - 40px);
	margin: 0 auto 30px;
	display: grid;
	grid-template-columns: 380px minmax(0, 1fr);
	column-gap: 100px;
	align-items: start;
}

.ns-foot__company {
	grid-column: 1;
	grid-row: 1;
	width: 380px;
}

.ns-foot__links {
	grid-column: 1;
	grid-row: 2;
}

.ns-foot__menus {
	grid-column: 2;
	grid-row: 1 / span 2;
	justify-self: end;
}

.ns-foot__logo {
	display: block;
	line-height: 0;
}

.ns-foot__logo img {
	width: 380px;
	height: auto;
}

.ns-foot__relbnrs {
	display: grid;
	gap: 10px;
	margin-top: 25px;
}

.ns-foot__relbnrs a {
	display: block;
	line-height: 0;
}

.ns-foot__relbnrs img {
	width: 380px;
	height: auto;
}

.ns-foot__links {
	padding-top: 30px;
}

.ns-foot__links-ttl {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 16px;
	font-weight: 600;
}

.ns-foot__links-rule {
	display: block;
	flex: 1 1 auto;
	height: 1px;
	background: #333333;
}

/* reset.css の ul[class]{padding:0} に負けないよう 2 クラスで書く。旧 .connection_list は上 10px */
.ns-foot__links .ns-foot__links-list {
	padding-top: 10px;
}

.ns-foot__links-list {
	padding-top: 10px;
}

.ns-foot__links-list li {
	margin-bottom: 3px;
}

.ns-foot__links-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 209px;
	color: #333333;
	font-size: 15px;
	text-decoration: none;
}

/* 旧サイトは PC がシェブロン、SP が外部リンクアイコン(テキスト直後)の 2 通り */
.ns-foot__links-list .ns-ico-ext {
	display: none;
	margin-left: 6px;
}

.ns-foot__links-list .ns-ico-chev {
	flex: 0 0 auto;
	stroke-width: 3;
}

.ns-foot__links-list a:hover {
	text-decoration: underline;
}

.ns-foot__menus {
	display: flex;
	gap: 60px;
}

/* 旧サイトの列幅は中身なり(1 列目 192.4 / 2 列目 254)。固定すると折り返しが変わる */
.ns-foot__menu {
	flex: 0 0 auto;
}

/* 旧はどの li も下 10px の内側余白(外側余白だと最後の 1 つが ul の外へ逃げる) */
.ns-foot__menu > li {
	padding-bottom: 10px;
}

.ns-foot__menu a {
	color: #333333;
	text-decoration: none;
}

.ns-foot__menu a:hover {
	text-decoration: underline;
}

/* 表示名を切れ目で分けた項目(fh_footer_label)。PC は切れ目ごとに改行して、列の幅を広げない。
 * 右の列は 1 行で書ける幅(253.6)がロゴ側との余白にちょうど収まる設計で、長い項目を 1 行で足すと
 * 1025〜1083px で画面の外へ出る。列の右端は右の追従バナーの下にもなる(1340px 以下で 78px・1440px で 28px) */
.ns-foot__ph {
	display: block;
}

/* reset.css の ul[class]{padding:0} に負けないよう 2 クラスで書く */
.ns-foot__menu .ns-foot__submenu {
	padding-left: 20px;
	margin-top: 10px;
}

.ns-foot__submenu li {
	padding-bottom: 10px;
}

.ns-foot__copy {
	text-align: center;
	font-size: 12px;
	font-weight: 600;
	padding: 4px 0;
}

/* ------------------------------------------------------------------
 * モーダル
 * ------------------------------------------------------------------ */

.ns-modal {
	position: fixed;
	inset: 0;
	z-index: 5000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.ns-modal[hidden] {
	display: none;
}

.ns-modal__bg {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.6);
}

.ns-modal__box {
	position: relative;
	width: 100%;
	max-width: var(--fh-inner);
	max-height: calc(100vh - 40px);
	overflow: auto;
	background: #ffffff;
	border-radius: 10px;
	padding: 20px 20px 10px;
	text-align: center;
}

/* ------------------------------------------------------------------
 * 電話の「受付中」の表示(.ns-telnow): 緑の帯の中央に、点と「18:42現在、お電話を受付中です」。
 * HTML は inc/site-halls.php の fh_get_tel_now()。時刻(.ns-telnow__num)は、見ている人の端末の時計で入る。
 * 電話のポップアップ・スマホのメニュー・式場ページ(置き場所ごとの大きさは、それぞれの区画と pages/hall.css)で使う。
 * ------------------------------------------------------------------ */

.ns-telnow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	background: var(--fh-now);
	color: #ffffff;
	font-family: var(--fh-sans);
	font-size: clamp(13px, 3.95vw, 16px);
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1;
	white-space: nowrap;
}

.ns-telnow__num {
	margin-right: 1px;
	font-family: var(--fh-num);
	font-size: 1.3em;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.02em;
}

/* 点(受付中の印)。外側の輪だけが、ゆっくり広がって消える */
.ns-telnow__dot {
	position: relative;
	flex: 0 0 auto;
	display: inline-block;
	width: 10px;
	height: 10px;
	background: #ffffff;
	border-radius: 50%;
}

.ns-telnow__dot span {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: inherit;
	border-radius: 50%;
	animation: ns-telnow-pulse 1.8s ease-out infinite;
}

@keyframes ns-telnow-pulse {
	0% {
		opacity: 0.75;
		transform: scale(1);
	}

	80%,
	100% {
		opacity: 0;
		transform: scale(2.5);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ns-telnow__dot span {
		animation: none;
		opacity: 0;
	}
}

/* ------------------------------------------------------------------
 * 式場の行(.ns-telrows): 電話のポップアップとスマホのメニューで共通。HTML は inc/site-main.php の fh_the_tel_rows()。
 * 1 行 = 左に、市と区の札・式場名・「式場のページへ」(1 つのリンク)／右に、朱の電話のボタン(押すと発信)。
 * ------------------------------------------------------------------ */

.ns-telrows {
	letter-spacing: 0.02em;
}

.ns-telrow {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	column-gap: 8px;
	padding: 5px 0;
	border-top: 1px solid var(--fh-cream-line);
}

.ns-telrow:first-child {
	border-top: 0;
}

.ns-telrow__page {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 1px;
	min-height: 52px;
	color: #222222;
	text-decoration: none;
}

/* 札の色は、市ごと(これまでの電話の一覧の帯と同じ色) */
.ns-telrow__city {
	padding: 1px 8px;
	border-radius: 2px;
	background: var(--fh-navy);
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.5;
}

.ns-telrow__city--yokohama {
	background: var(--fh-yokohama);
}

.ns-telrow__city--kawasaki {
	background: var(--fh-kawasaki);
}

.ns-telrow__city--fujisawa {
	background: var(--fh-fujisawa);
}

.ns-telrow__city--funabashi {
	background: var(--fh-funabashi);
}

.ns-telrow__city--kashiwa {
	background: var(--fh-kashiwa);
}

.ns-telrow__name {
	color: var(--fh-navy);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.35;
}

/* 式場名は「ファミリーホール」と残りの間でだけ折り返す */
.ns-telnm {
	display: inline-block;
}

/* 所在地は、768px 以上のポップアップでだけ見せる */
.ns-telrow__addr {
	display: none;
	color: #444444;
	font-size: 12.5px;
	line-height: 1.5;
}

.ns-telrow__go {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #333333;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.5;
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: nowrap;
}

.ns-telrow__go .ns-ico-chev {
	color: var(--fh-navy);
}

.ns-telrow__tel {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 164px;
	height: 52px;
	background: var(--fh-red);
	border-radius: 6px;
	box-shadow: 0 3px 8px rgba(204, 79, 65, 0.32);
	color: #ffffff;
	font-family: var(--fh-num);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
}

.ns-telrow__tel:hover,
.ns-telrow__page:hover {
	text-decoration: none;
}

.ns-telrow__tel .ns-ico-tel {
	width: 17px;
	height: 17px;
}

.ns-telrow__page:focus-visible,
.ns-telrow__tel:focus-visible {
	outline: 3px solid var(--fh-navy);
	outline-offset: 2px;
}

/* 幅の狭い端末(360px 未満) */
@media (max-width: 359px) {
	.ns-telrow__name {
		font-size: 13px;
	}

	.ns-telrow .ns-telrow__tel {
		width: 144px;
		font-size: 19.5px;
	}
}

/* ------------------------------------------------------------------
 * 各式場の電話のポップアップ(#ns-tel-modal)。HTML は template-parts/modals.php。
 * 上から、紺の帯(題・1 行・右上に×と「閉じる」)→ 緑の「受付中」の帯 → 生成りの地に式場の行 → 白い地に「閉じる」。
 * 帯と下の「閉じる」は動かず、行だけが中でスクロールする。
 * ------------------------------------------------------------------ */

.ns-modal--tel {
	padding: 12px;
}

.ns-modal--tel .ns-modal__box {
	display: flex;
	flex-direction: column;
	max-width: 900px;
	max-height: calc(100vh - 24px);
	max-height: calc(100dvh - 24px);
	padding: 0;
	overflow: hidden;
	border-radius: 8px;
	text-align: left;
}

.ns-telpop__head {
	position: relative;
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 58px;
	padding: 9px 68px 9px 16px;
	background: var(--fh-navy);
	color: #ffffff;
}

.ns-telpop__ttl {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.35;
}

.ns-telpop__lead {
	margin-top: 2px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.5;
	opacity: 0.94;
}

.ns-telpop__x {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	width: 58px;
	padding: 0;
	background: #23266b;
	color: #ffffff;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1;
}

.ns-telpop__x:focus-visible {
	outline: 3px solid #ffffff;
	outline-offset: -5px;
}

.ns-telpop__now {
	flex: 0 0 auto;
	height: 34px;
}

.ns-telpop__body {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 3px 12px 4px;
	background: var(--fh-cream);
}

.ns-telpop__foot {
	flex: 0 0 auto;
	padding: 8px 12px 10px;
	background: #ffffff;
	border-top: 1px solid var(--fh-cream-line);
}

.ns-telpop__close {
	display: block;
	width: 100%;
	height: 44px;
	padding: 0;
	background: #ffffff;
	border: 1.5px solid var(--fh-navy);
	border-radius: 6px;
	color: var(--fh-navy);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-align: center;
}

.ns-telpop__close:focus-visible {
	outline: 3px solid var(--fh-navy);
	outline-offset: 2px;
}

@media (max-width: 359px) {
	.ns-telpop__lead {
		letter-spacing: 0;
	}
}

/* 768px 以上: 行を 2 列に並べ、所在地も見せる */
@media (min-width: 768px) {
	.ns-modal--tel {
		padding: 24px;
	}

	.ns-modal--tel .ns-modal__box {
		max-height: calc(100vh - 48px);
		max-height: calc(100dvh - 48px);
	}

	.ns-telpop__head {
		min-height: 72px;
		padding: 12px 96px 12px 28px;
	}

	.ns-telpop__ttl {
		font-size: 23px;
	}

	.ns-telpop__lead {
		font-size: 14px;
	}

	.ns-telpop__x {
		width: 84px;
		font-size: 12px;
	}

	.ns-telpop__now {
		height: 40px;
		font-size: 17px;
	}

	.ns-telpop__body {
		padding: 8px 28px 10px;
	}

	.ns-telpop__body .ns-telrows {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 40px;
	}

	.ns-telpop__body .ns-telrow {
		padding: 11px 0;
	}

	.ns-telpop__body .ns-telrow:nth-child(2) {
		border-top: 0;
	}

	.ns-telpop__body .ns-telrow__name {
		font-size: 17px;
	}

	.ns-telpop__body .ns-telrow__addr {
		display: block;
	}

	.ns-telpop__body .ns-telrow__go {
		font-size: 13px;
	}

	.ns-telpop__body .ns-telrow__tel {
		width: 204px;
		height: 60px;
		font-size: 27px;
	}

	.ns-telpop__foot {
		padding: 12px 28px 16px;
	}

	.ns-telpop__close {
		max-width: 380px;
		height: 48px;
		margin: 0 auto;
	}
}

/* 丸い枠の「閉じる」(無料会員のページの特典のポップアップ)。電話のポップアップの「閉じる」は .ns-telpop__close */
.ns-modal__close {
	display: block;
	width: 100%;
	max-width: 380px;
	margin: 0 auto;
	padding: 10px 20px;
	background: #ffffff;
	border: 1px solid var(--fh-navy);
	border-radius: 50px;
	color: var(--fh-navy);
	font-size: 16px;
	font-weight: 600;
	text-align: center;
}

.ns-modal__x {
	position: absolute;
	top: 12px;
	right: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	color: #333333;
}

.ns-modal--reason .ns-modal__box {
	max-width: 820px;
	padding: 48px 40px 36px;
	text-align: left;
}

.ns-reason__ttl {
	font-family: var(--fh-serif);
	font-size: 22px;
	font-weight: 700;
	color: var(--fh-navy);
	text-align: center;
	margin-bottom: 20px;
}

.ns-reason__h {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	margin: 22px 0 8px;
}

.ns-reason__h strong {
	color: var(--fh-red);
}

.ns-reason p {
	font-size: 15px;
}

.ns-reason__close {
	margin-top: 22px;
	font-weight: 600;
	text-align: center;
}

/* ------------------------------------------------------------------
 * 共通CTAバナー(電話 / 資料請求 / 会員 / 事前相談 / 生活保護)
 * ------------------------------------------------------------------ */

.ns-ctabnrs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 422px));
	gap: 20px 16px;
	justify-content: center;
}

.ns-ctabnrs a,
.ns-ctabnrs button {
	display: block;
	padding: 0;
	line-height: 0;
}

.ns-ctabnrs img {
	width: 100%;
	height: auto;
}

.ns-ctabnrs--welfare {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: center;
}

.ns-ctabnrs--welfare .ns-ctabnrs__welfare {
	grid-column: 1;
	grid-row: 1 / span 2;
}

/* 生活保護バナーだけ枠より一回り小さい(旧サイトの実測 95%) */
.ns-ctabnrs--welfare .ns-ctabnrs__welfare a,
.ns-ctabnrs--welfare .ns-ctabnrs__welfare picture {
	width: 95%;
	margin-inline: auto;
}

.ns-ctabnrs--welfare .ns-ctabnrs__tel {
	grid-column: 2;
	grid-row: 1;
}

.ns-ctabnrs--welfare .ns-ctabnrs__inq {
	grid-column: 3;
	grid-row: 1;
}

.ns-ctabnrs--welfare .ns-ctabnrs__club {
	grid-column: 2;
	grid-row: 2;
}

.ns-ctabnrs--welfare .ns-ctabnrs__consult {
	grid-column: 3;
	grid-row: 2;
}

/* 末尾CTA(24時間365日受付中) */
.ns-consult {
	padding: 60px 0;
}

.ns-consult__bg {
	background: url(../img/top/bg_consul.jpg) center / cover no-repeat;
	padding: 110px 0;
}

.ns-consult__lead {
	color: #ffffff;
	font-family: var(--fh-serif);
	font-size: 31px;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
}

.ns-consult__inner {
	width: min(var(--fh-inner), 100% - 40px);
	margin: -65px auto 0;
	text-align: center;
}

.ns-consult__tel {
	display: block;
	max-width: 1102px;
	margin: 0 auto;
	padding: 0;
	line-height: 0;
}

.ns-consult__tel img {
	width: 100%;
	height: auto;
}

/* 末尾の SEO 見出し(旧サイトはフッター直前に 11px の淡色で置いている) */
.ns-pageh1 {
	margin-top: 20px;
	padding-bottom: 20px;
}

.ns-pageh1 h1 {
	width: 60vw;
	color: #7f7e7e;
	font-family: var(--fh-sans);
	font-size: 11px;
	font-weight: 300;
	line-height: 1.7;
	letter-spacing: 0.1em;
	text-align: left;
}

/* ------------------------------------------------------------------
 * 中間幅(1025〜1440)の詰め
 * ------------------------------------------------------------------ */

@media (min-width: 1025px) and (max-width: 1400px) {
	.ns-head__logo img {
		width: 300px;
	}

	.ns-head__pill {
		width: 150px;
	}

	.ns-head__tel {
		width: 240px;
	}

	.ns-head__inq img {
		width: 240px;
	}

	.ns-gnav__item {
		font-size: 14px;
	}

	.ns-gnav__item > a,
	.ns-gnav__item > button {
		padding: 6px 12px;
	}

	.ns-gnav__item--hurry > button {
		width: 204px;
		padding: 7px 22px 5px 10px;
		font-size: 14px;
	}

	.ns-footbar__logo img {
		width: 280px;
	}

	.ns-footbar__btn img {
		height: 56px;
	}
}

/* ------------------------------------------------------------------
 * タブレット・スマートフォン(1024px 以下)
 * ------------------------------------------------------------------ */

@media (max-width: 1024px) {
	/* 帯(ロゴと MENU)が、下へ送っても上に残る。高さは全ページ 56px。バー(.ns-spquick)は <header> の外にあるので残らない。
	   .ns-head は重なりの親(z-index: 1000)＝メニュー(1100)と MENU のボタン(1200)はこの中。固定バー(1001)はメニューの上に出る */
	.ns-head {
		position: sticky;
		top: 0;
	}

	/* 帯が上に残る分(56px)、ページの中のリンク(#…)と scrollIntoView() の着地を下げる(帯の下に隠れないように) */
	html:has(> .ns-fh) {
		scroll-padding-top: 56px;
	}

	.ns-head__belt {
		box-shadow: 0 1px 0 #d9dee6;
	}

	.ns-head__inner {
		width: min(var(--fh-inner), 100% - 32px);
		height: auto;
		padding: 10px 0;
		justify-content: flex-start;
	}

	.ns-head__logo img {
		width: 202px;
	}

	.ns-head__rel,
	.ns-head__util {
		display: none;
	}

	.ns-head__burger {
		position: fixed;
		top: 0;
		right: 0;
		z-index: 1200;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 4px;
		width: 56px;
		height: 56px;
		padding: 0;
		background: var(--fh-navy);
		color: #ffffff;
	}

	.ns-head__burger-bars {
		display: flex;
		flex-direction: column;
		gap: 7px;
	}

	.ns-head__burger-bars i {
		display: block;
		width: 40px;
		height: 3px;
		background: #ffffff;
		transition: transform 0.2s ease, opacity 0.2s ease;
	}

	.ns-head__burger-txt {
		font-size: 11px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.05em;
	}

	.ns-menu-open .ns-head__burger-bars i:nth-child(1) {
		transform: translateY(10px) rotate(45deg);
	}

	.ns-menu-open .ns-head__burger-bars i:nth-child(2) {
		opacity: 0;
	}

	.ns-menu-open .ns-head__burger-bars i:nth-child(3) {
		transform: translateY(-10px) rotate(-45deg);
	}

	.ns-gnav {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 1100;
		width: min(360px, calc(100vw - 40px));
		padding: 0 0 96px;
		overflow-y: auto;
		background: #ffffff;
		border-top: 0;
		border-bottom: 0;
		transform: translateX(100%);
		transition: transform 0.3s ease;
	}

	.ns-menu-open .ns-gnav {
		transform: none;
	}

	/* メニューの先頭: 紺の帯(題と 1 行。右端は MENU のボタンの分を空ける)→「受付中」の帯 → 見出し → 式場の行。地は生成り */
	.ns-gnavhurry {
		display: block;
		background: var(--fh-cream);
	}

	.ns-gnavhurry__head {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 56px;
		padding: 8px 62px 8px 14px;
		background: var(--fh-navy);
		color: #ffffff;
	}

	.ns-gnavhurry__ttl {
		font-size: 16.5px;
		font-weight: 700;
		letter-spacing: 0.04em;
		line-height: 1.35;
	}

	.ns-gnavhurry__lead {
		margin-top: 1px;
		font-size: 10.5px;
		font-weight: 700;
		letter-spacing: 0.02em;
		line-height: 1.5;
		opacity: 0.94;
	}

	.ns-gnavhurry__now {
		height: 30px;
		font-size: 13px;
	}

	.ns-gnavhurry__label {
		padding: 9px 14px 0;
		color: #333333;
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1.4;
	}

	/* ベースの reset が ul[class] の padding を 0 にするので 2 クラスで書く */
	.ns-gnavhurry .ns-telrows {
		padding: 0 14px 4px;
	}

	.ns-gnavhurry .ns-telrow__tel {
		width: 156px;
		height: 50px;
		font-size: 21px;
	}

	/* 着地ページの 5 式場: その式場への発信の大きいボタン(pages/hall.css の .ns-telbnr)を、先頭に置く */
	.ns-gnavhurry__own {
		padding: 10px 14px 2px;
	}

	.ns-gnav__doc {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		height: 48px;
		margin: 12px 14px 4px;
		background: var(--fh-navy);
		border-radius: 6px;
		color: #ffffff;
		font-size: 15px;
		font-weight: 700;
		letter-spacing: 0.04em;
		line-height: 1;
		text-decoration: none;
	}

	.ns-gnav__doc:hover {
		color: #ffffff;
		text-decoration: none;
	}

	.ns-gnav__doc small {
		padding: 3px 7px;
		background: #ffffff;
		border-radius: 2px;
		color: var(--fh-navy);
		font-size: 11px;
		font-weight: 700;
	}

	.ns-gnav__list {
		display: block;
		width: auto;
		height: auto;
	}

	.ns-gnav .ns-gnav__list {
		padding: 0 14px;
	}

	.ns-gnav__item {
		display: block;
		font-size: 15px;
		border-bottom: 1px solid var(--fh-line);
	}

	.ns-gnav__item > a {
		display: block;
		padding: 12px 6px;
		border-right: 0;
	}

	.ns-gnav__item--home > a img {
		display: none;
	}

	.ns-gnav__home-txt {
		display: inline;
	}

	.ns-gnav__item--sp {
		display: block;
	}

	.ns-gnav__item--sub {
		position: static;
	}

	.ns-gnav__sub {
		position: static;
		display: block;
		width: auto;
		padding: 0 0 8px;
		box-shadow: none;
	}

	.ns-gnav__sublist {
		display: block;
		width: auto;
		padding: 0 0 0 16px;
	}

	.ns-gnav__sublist a {
		width: auto;
		padding: 6px 4px;
		text-align: left;
		font-size: 14px;
	}

	.ns-gnav__thumb {
		display: none;
	}

	/* 押すと電話のポップアップを開く 2 つ(式場一覧・朱の項目)は、メニューでは出さない(先頭に、式場の行がある) */
	.ns-gnav__item--halls,
	.ns-gnav__item--hurry {
		display: none;
	}

	.ns-gnavrel {
		display: block;
		margin: 16px 14px 0;
	}

	.ns-gnavrel__ttl {
		color: #555555;
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1.4;
	}

	.ns-gnavrel__list a {
		display: flex;
		align-items: center;
		gap: 4px;
		padding: 9px 4px;
		color: #333333;
		font-size: 14px;
		font-weight: 600;
		line-height: 1.4;
		text-decoration: none;
	}

	.ns-gnav__bg {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 1050;
		background: rgba(0, 0, 0, 0.5);
	}

	.ns-gnav__bg[hidden] {
		display: none;
	}

	/* 3 項目のバー: ご葬儀プラン・無料会員制度・朱の「お急ぎの方はこちらから」(2 枠分。押すと電話のポップアップ) */
	.ns-spquick {
		display: grid;
		grid-template-columns: 1fr 1fr 2fr;
		gap: 1px;
		height: 58px;
		padding-left: 1px;
		background: var(--fh-navy);
		border-top: 1px solid #bcd7e3;
		border-bottom: 1px solid var(--fh-navy);
	}

	.ns-spquick li {
		background: var(--fh-nav-bg);
	}

	.ns-spquick a {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0;
		height: 100%;
		padding: 5px 0;
		color: #333333;
		font-size: 13px;
		font-weight: 600;
		line-height: 13px;
		text-align: center;
		text-decoration: none;
	}

	.ns-spquick svg {
		margin-bottom: 5px;
		color: var(--fh-navy);
	}

	.ns-spquick__hurry {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 4px;
		width: 100%;
		height: 100%;
		padding: 0 4px;
		background: var(--fh-red);
		color: #ffffff;
		line-height: 1;
	}

	.ns-spquick__hurry-lead {
		font-size: 10.5px;
		font-weight: 700;
		letter-spacing: 0.04em;
	}

	.ns-spquick__hurry-main {
		display: flex;
		align-items: center;
		gap: 5px;
		font-size: clamp(12px, 3.6vw, 15px);
		font-weight: 700;
		letter-spacing: 0.02em;
		white-space: nowrap;
	}

	.ns-spquick .ns-spquick__hurry svg {
		width: 17px;
		height: 17px;
		margin: 0;
		color: #ffffff;
	}

	.ns-sidebnr,
	.ns-footbar {
		display: none;
	}

	.ns-spbar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 1001;
		display: flex;
		align-items: center;
		gap: 5px;
		padding: 5px;
		background: #ffffff;
	}

	.ns-spbar li {
		min-width: 0;
	}

	.ns-spbar__tel {
		flex: 320 1 0;
	}

	.ns-spbar__line {
		flex: 235 1 0;
	}

	.ns-spbar__inq {
		flex: 198 1 0;
	}

	.ns-spbar a,
	.ns-spbar button {
		display: block;
		width: 100%;
		padding: 0;
		line-height: 0;
	}

	.ns-spbar img {
		width: 100%;
		height: auto;
	}

	.ns-foot {
		padding: 60px 0 80px;
	}

	.ns-foot__inner {
		width: min(var(--fh-inner), 96%);
		grid-template-columns: minmax(0, 1fr);
		justify-content: stretch;
		row-gap: 30px;
	}

	.ns-foot__company {
		width: 300px;
		justify-self: center;
	}

	.ns-foot__menus {
		grid-column: 1;
		grid-row: 2;
		justify-self: stretch;
	}

	.ns-foot__links {
		grid-column: 1;
		grid-row: 3;
		padding-top: 0;
	}

	.ns-foot__logo img,
	.ns-foot__relbnrs img {
		width: 300px;
	}

	/* 旧 .sankotsu_bnr は SP では上 10px */
	.ns-foot__relbnrs {
		margin-top: 10px;
	}

	.ns-foot__menus {
		flex-direction: column;
		gap: 5px;
		width: 100%;
		margin: 0;
	}

	.ns-foot__menu {
		width: 100%;
	}

	/* 縦積みでは 1 行に収まる(325px 以上)。足りない時だけ切れ目で折り返す */
	.ns-foot__ph {
		display: inline-block;
	}

	.ns-foot__links-list a {
		display: block;
		width: 100%;
	}

	.ns-foot__links-list .ns-ico-ext {
		display: inline-block;
		width: 14px;
		height: 15px;
		vertical-align: -2px;
	}

	.ns-foot__links-list .ns-ico-chev {
		display: none;
	}

	.ns-ctabnrs {
		grid-template-columns: minmax(0, 422px);
	}
}

/* 幅の狭い端末(344px 未満): 3 項目のバーの字を少し小さくして、左の 2 つを 1 行に収める(朱のボタンが 2 枠分より広がらないように) */
@media (max-width: 343px) {
	.ns-spquick a {
		font-size: 12px;
	}

	.ns-spquick__hurry-main {
		gap: 4px;
		font-size: 11.5px;
	}

	.ns-spquick .ns-spquick__hurry svg {
		width: 15px;
		height: 15px;
	}
}

/* ------------------------------------------------------------------
 * スマートフォン(767px 以下)
 * ------------------------------------------------------------------ */

@media (max-width: 767px) {
	.ns-sp {
		display: inline;
	}

	.ns-crumb {
		margin: 10px 0 15px;
	}

	.ns-pc {
		display: none;
	}

	.ns-pageh1 h1 {
		width: 80vw;
	}

	.ns-tit {
		font-size: 25px;
		margin-bottom: 30px;
	}

	/* 旧サイトの .btn は SP だけ 14px */
	.ns-pill {
		font-size: 14px;
	}

	.ns-tit__top {
		font-size: 17px;
		margin-bottom: 5px;
	}

	.ns-tit__mini {
		font-size: 20px;
	}

	.ns-tit__main {
		font-size: 29px;
	}

	.ns-tit__num {
		font-size: 34px;
		font-weight: 600;
	}

	.ns-tit2 {
		font-size: 26px;
	}

	.ns-tit2__num {
		font-size: 35px;
	}

	.ns-feature {
		margin-bottom: 20px;
	}

	.ns-feature__rule {
		right: calc(50% + 35.4px);
	}

	.ns-feature__rule--r {
		right: auto;
		left: calc(50% + 35.4px);
	}

	.ns-feature__label {
		margin-top: 3px;
		font-size: 26px;
	}

	.ns-feature__num {
		font-size: 33px;
	}

	.ns-flowtext {
		padding: 30px 20px;
		font-size: 14px;
	}

	.ns-widebnrs li {
		margin-bottom: 0;
		padding: 5px 0;
	}

	.ns-ctabnrs,
	.ns-ctabnrs--welfare {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.ns-ctabnrs li {
		padding: 5px 0;
	}

	.ns-ctabnrs--welfare .ns-ctabnrs__welfare,
	.ns-ctabnrs--welfare .ns-ctabnrs__tel,
	.ns-ctabnrs--welfare .ns-ctabnrs__inq,
	.ns-ctabnrs--welfare .ns-ctabnrs__club,
	.ns-ctabnrs--welfare .ns-ctabnrs__consult {
		grid-column: auto;
		grid-row: auto;
	}

	.ns-consult {
		padding: 30px 0;
	}

	.ns-consult__bg {
		padding: 60px 0 80px;
	}

	.ns-consult__lead {
		font-size: 24px;
	}

	.ns-consult__inner {
		width: min(var(--fh-inner), 100% - 30px);
		margin-top: -65px;
	}

	.ns-modal {
		padding: 12px;
	}

	.ns-modal__box {
		padding: 16px 12px 10px;
		max-height: calc(100vh - 24px);
	}

	.ns-modal--reason .ns-modal__box {
		padding: 44px 18px 24px;
	}

	.ns-reason__ttl {
		font-size: 19px;
	}

	.ns-reason__h {
		font-size: 16px;
	}

	.ns-reason p {
		font-size: 14px;
	}
}

/* ------------------------------------------------------------------
 * 404
 * ------------------------------------------------------------------ */

.ns-404__body {
	padding: 80px 0 200px;
	color: #5c5c5c;
	font-weight: 600;
	text-align: center;
}

.ns-404__num {
	font-size: 90px;
	font-weight: 600;
	line-height: 1.7;
	letter-spacing: 1px;
}

/* 旧サイトと同じ白抜きの数字(輪郭だけ紺で描く) */
.ns-404__num span {
	color: #ffffff;
	-webkit-text-stroke: 1px var(--fh-navy);
}

.ns-404__txt {
	line-height: 1.7;
}

.ns-404__btn {
	margin-top: 50px;
}

@media (max-width: 767px) {

	.ns-404__body {
		padding: 40px 0 100px;
	}

	.ns-404__num {
		font-size: 60px;
	}
}

/* ------------------------------------------------------------------
 * 火葬おまかせプランの「実際の請求書例」バナー(2026-09-28・本体 dir docs/05 §9)
 * 本番の .kasou_invoice_bnr と同じ大きさと余白。トップの位置(FV の中・直下)は assets/css/pages/home.css。
 * ------------------------------------------------------------------ */

.ns-invoicebnr {
	margin: 0;
	line-height: 0;
	text-align: center;
}

.ns-invoicebnr a {
	display: inline-block;
	width: 100%;
	transition: opacity 0.2s;
}

.ns-invoicebnr a:hover {
	opacity: 0.85;
}

.ns-invoicebnr img {
	display: block;
	width: 100%;
	height: auto;
}

.ns-invoicebnr--price {
	max-width: 440px;
	margin: 12px auto 16px;
}

.ns-invoicebnr--appeal {
	max-width: 480px;
	margin: 24px auto 0;
}

@media (max-width: 767px) {

	.ns-invoicebnr--price {
		max-width: 400px;
		margin: 4px auto 16px;
	}

	.ns-invoicebnr--appeal {
		max-width: 400px;
	}
}