/*************************************************************
  the_content()内のレイアウト調整スタイル


  ＜詳細＞
  └ ここで言うレイアウト調整は横幅、背景などの調整を行っています
    また、the_content()内だけを調整してます。

  └ 以下classを持ってるページが該当
　  └ 対応エリア > サブエリア (.page-area-pref) ※ 固定ページ
　  └ 対応エリア > サブエリア > エリア詳細 (.page-area)
　  └ コラム > 記事 (.dispose)
　  └ コラム > 回収可能な品目 > 品目 (.dispose)
    ※ <main>のクラスで切り分け

*************************************************************/

:root {
	--commonbgColor: #fff;
	--fFamily: NotoSansJP, sans-serif;
}

/* └ 対応エリア > サブエリア  (.page-area-pref) */
.page-area-pref .content {
	width: 100%;
	padding-inline: 2rem;
	background-color: var(--commonbgColor);
	padding-top: 3rem;
	padding-bottom: 2rem;
	font-family: var(--fFamily);
}

/* └ 対応エリア > サブエリア > エリア詳細 (.page-area) */
.page-area .inner .content {
	width: 100%;
	padding-inline: 2rem;
	background-color: var(--commonbgColor);
	padding-top: 3rem;
	padding-bottom: 2rem;
	font-family: var(--fFamily);
}


/*
  └ コラム > 記事 (.dispose)
  └ コラム > 回収可能な品目 > 品目 (.dispose)
 */

.dispose {
	background-color: var(--commonbgColor);
}

.dispose .content .inner {
	margin: 0 auto;
	background-color: var(--commonbgColor);
	width: calc(100% - 4rem);
	font-family: var(--fFamily);
}

/* 別途調整必要な箇所 -----------------------------------------------*/
/* .parts */
.parts {
	background-color: #e0edf1;
}

/* wp-block-lazyblock-dispose-case */
.page-area .wp-block-lazyblock-dispose-case,
.dispose .wp-block-lazyblock-dispose-case {
	width: 100%;
	margin: 0;
	padding: 0;
}

.page-area .wp-block-lazyblock-dispose-case .case-inner,
.dispose .wp-block-lazyblock-dispose-case .case-inner {
	padding: 0;
}

/* PC - スタイル *******************************************/
@media screen and (min-width: 769px) {
	:root {
		--commonWidth: 960px;
	}

	.page-area .content .inner {
		width: var(--commonWidth);
		margin: 0 auto;
	}

	.dispose .content .inner {
		width: var(--commonWidth);
		background-color: var(--commonbgColor);
	}

	.dispose .content .author>.author-inner {
		width: 100%;
	}
}