/*
	root
*/

/*
	Kadence 用の初期値。案件ごとの上書きはニゴロCSS設定（セレクタ設定）で行う。
	ここを直接書き換えなくてよい。
*/
:root {
	--theme-content-max-width: 110rem;

	/*
		Kadence プリセット（Font Size / Row Gutter）
		1rem ≒ デザイン幅 1600 で 10px。clamp は使わない（rem がすでにフルイドのため）。
	*/
	--theme-font-size-sm: 1.2rem;
	--theme-font-size-md: 1.6rem;
	--theme-font-size-lg: 2.0rem;
	--theme-font-size-xl: 2.4rem;
	--theme-font-size-xxl: 3.2rem;
	--theme-font-size-xxxl: 4.0rem;

	--theme-gutter-sm: 1.6rem;
	--theme-gutter-md: 3.2rem;
	--theme-gutter-lg: 4.8rem;
}
:root,
body {
	--wp--style--global--content-size: var(--theme-content-max-width);
	--wp--style--global--wide-size: 160rem;

	--global-kb-font-size-sm: var(--theme-font-size-sm);
	--global-kb-font-size-md: var(--theme-font-size-md);
	--global-kb-font-size-lg: var(--theme-font-size-lg);
	--global-kb-font-size-xl: var(--theme-font-size-xl);
	--global-kb-font-size-xxl: var(--theme-font-size-xxl);
	--global-kb-font-size-xxxl: var(--theme-font-size-xxxl);

	--global-kb-gap-none: 0;
	--global-kb-gap-sm: var(--theme-gutter-sm);
	--global-kb-gap-md: var(--theme-gutter-md);
	--global-kb-gap-lg: var(--theme-gutter-lg);
	--global-kb-gutter-sm: var(--theme-gutter-sm);
	--global-kb-gutter-md: var(--theme-gutter-md);
	--global-kb-gutter-lg: var(--theme-gutter-lg);
}

/*
	スマホ（767px 以下）
	35rem ≒ デザイン幅 375 の 93%（100vw/37.5 × 35）。
	編集画面のスマホプレビューでも同じメディアクエリが効くように、
	ここ（root.css）で切り替える。sp.css 側の上書きは不要。
*/
@media screen and (max-width: 767px) {
	:root,
	body {
		--theme-content-max-width: 35rem;
	}
}

.kb-row-layout-wrap > .kt-row-column-wrap.kb-theme-content-width {
	max-width: var(--theme-content-max-width);
	margin-left: auto;
	margin-right: auto;
}

/* 強調 */
strong {
	font-weight: bold;
}
em {
	font-weight: bold;
}

/* 横幅一杯の背景 */
.fluid {
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	padding-right: calc(50vw - 50%);
	padding-left: calc(50vw - 50%);
}

/* アイキャッチのobject-fit */
.ncb-recent-post-eyecatch img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	font-family: 'object-fit: cover;';
}

/* フォームのplaceholder */
::placeholder {
	color: #aaaaaa;
}