@charset "UTF-8";
/* =========================================================
   page-simple-common.css
   井上（ウェスタナ）作成ページ共通スタイル（1枚集約版）
   ---------------------------------------------------------
   ・情報セキュリティ基本方針ページ（page-simple-security.php）
     と SDGs宣言ページ（page-simple-sdgs.php）の両方が、この
     1枚を読み込む。今後ウェスタナ作成ページを増やす場合も、
     このファイルにスタイルを追記していく運用とする。
   ・既存テーマCSS（style.css / style_new.css）には一切
     手を加えていない。各クラスは専用クラス／専用 body クラス
     配下にのみ効くため、他ページへの影響は生じない。
   ・代表ご挨拶ページ（.aisatu_text p）の文字サイズに合わせ、
     font-size:18px / line-height:33px を基準としている。

   ［目次］
     1. シンプル全幅ページ（情報セキュリティ基本方針など）  .simple-page
     2. SDGs宣言ページ                                       .sdgs-page
   ========================================================= */


/* =========================================================
   1. シンプル全幅ページ（情報セキュリティ基本方針など）
   ========================================================= */

/* ---- このテンプレート専用：main を画面幅いっぱいに ----
   会社情報ページ（.page-template-page-company .processorsearch_full）と同じ手法。
   通常 .processorsearch_full は max-width:1200px だが、このテンプレートのページ
   だけ全幅に上書きし、グローバルメニュー直下のパンくず帯（.breads）を画面幅
   いっぱいに表示する。body クラスで限定しているため他ページには影響しない。 */
.page-template-page-simple-security .processorsearch_full {
	max-width: 100%;
}

/* ---- ページ全体のラッパー ---- */
.simple-page {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 60px 20px;
	box-sizing: border-box;
}

/* ---- ページ見出し（固定ページのタイトル） ---- */
/* 見出しは .simple-page ラッパーの外に置くため、子孫セレクタではなく単独で指定する。 */
.simple-page-title {
	font-size: 30px;
	line-height: 1.5;
	text-align: center;
	border-bottom: 1px solid #333;
	width: fit-content;
	margin: 50px auto 30px;
	padding-bottom: 10px;
}

/* ---- 本文 ---- */
/* 固定ページ本文(the_content)はこの .simple-page-content の中に出力される。
   代表挨拶と同じ 18px / 33px を本文の段落に適用する。 */
.simple-page .simple-page-content {
	font-size: 18px;
	line-height: 33px;
}

.simple-page .simple-page-content p {
	font-size: 18px;
	line-height: 33px;
	margin: 0 0 1.5em;
}

/* 本文中の見出し（必要に応じて固定ページ側で h2/h3 を使った場合） */
.simple-page .simple-page-content h2 {
	font-size: 24px;
	line-height: 1.5;
	margin: 2em 0 0.8em;
}

.simple-page .simple-page-content h3 {
	font-size: 20px;
	line-height: 1.5;
	margin: 1.8em 0 0.6em;
}

/* 本文中のリスト */
.simple-page .simple-page-content ul,
.simple-page .simple-page-content ol {
	font-size: 18px;
	line-height: 33px;
	margin: 0 0 1.5em;
	padding-left: 1.5em;
}

/* リンク */
.simple-page .simple-page-content a {
	color: #543624;
	text-decoration: underline;
}

.simple-page .simple-page-content a:hover {
	text-decoration: none;
}

/* ---- スマホ対応 ---- */
@media screen and (max-width: 768px) {
	.simple-page {
		padding: 30px 16px;
	}
	.simple-page-title {
		font-size: 24px;
		margin: 30px auto 20px;
	}
	.simple-page .simple-page-content,
	.simple-page .simple-page-content p,
	.simple-page .simple-page-content ul,
	.simple-page .simple-page-content ol {
		font-size: 16px;
		line-height: 28px;
	}
}


/* =========================================================
   2. SDGs宣言ページ（page-simple-sdgs.php）
   ========================================================= */

/* ---- このテンプレート専用：main を画面幅いっぱいに ----
   会社情報ページと同じ手法。body クラスで限定するため他ページには影響しない。
   これでグローバルメニュー直下のパンくず帯（.breads）が画面幅いっぱいになる。 */
.page-template-page-simple-sdgs .processorsearch_full {
	max-width: 100%;
}

.sdgs-page {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 50px 20px 70px;
	box-sizing: border-box;
	color: #333;
}

/* ---- ページ見出し ---- */
.sdgs-page-title {
	font-size: 30px;
	line-height: 1.5;
	text-align: center;
	border-bottom: 1px solid #333;
	width: fit-content;
	margin: 0 auto 20px;
	padding-bottom: 10px;
}

/* ---- リード文（ページ冒頭の概要） ---- */
.sdgs-lead {
	font-size: 18px;
	line-height: 33px;
	text-align: center;
	max-width: 860px;
	margin: 0 auto 60px;
}

/* ---- 各目標ブロック ---- */
.sdgs-block {
	margin: 0 0 40px;
	padding: 0 0 32px;
	border-bottom: 1px dashed #ccc;
}
.sdgs-block:last-of-type {
	border-bottom: none;
}

/* 目標ブロックの見出し行（アイコン＋目標名を横並び） */
.sdgs-block-head {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 16px;
}

/* アイコン（複数並ぶ場合もある） */
.sdgs-icons {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
	line-height: 0;
}
.sdgs-icons img {
	width: 60px;
	height: 60px;
	display: block;
}

/* 目標名（見出し） */
.sdgs-block-head h2 {
	font-size: 22px;
	line-height: 1.5;
	margin: 0;
	font-weight: bold;
}

/* 小見出し（2030年に向けたゴール / 具体的な取り組み） */
.sdgs-block h3 {
	font-size: 18px;
	line-height: 1.5;
	margin: 28px 0 12px;
	padding-left: 12px;
	border-left: 5px solid #25a3d6;
	font-weight: bold;
}

/* 本文段落 */
.sdgs-block p {
	font-size: 18px;
	line-height: 33px;
	margin: 0 0 1em;
}

/* 取り組みリスト */
.sdgs-block ul {
	list-style: none;
	margin: 0 0 1em;
	padding: 0;
}
.sdgs-block ul li {
	font-size: 18px;
	line-height: 33px;
	margin: 0 0 14px;
	padding-left: 24px;
	position: relative;
}
.sdgs-block ul li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 13px;
	width: 8px;
	height: 8px;
	background: #25a3d6;
	border-radius: 50%;
}

/* ---- 取組概要ブロック ---- */
.sdgs-summary {
	background: #f9f9f9;
	padding: 36px 32px;
	margin: 0 0 50px;
}
.sdgs-summary h2 {
	font-size: 20px;
	line-height: 1.5;
	margin: 0 0 18px;
	font-weight: bold;
	text-align: center;
}
.sdgs-summary p {
	font-size: 18px;
	line-height: 33px;
	margin: 0 0 1em;
}
.sdgs-summary p:last-child {
	margin-bottom: 0;
}

/* ---- 国連が求める出典表記・免責文 ---- */
.sdgs-disclaimer {
	font-size: 13px;
	line-height: 22px;
	color: #777;
	border-top: 1px solid #e0e0e0;
	padding-top: 20px;
	margin-top: 10px;
}
.sdgs-disclaimer a {
	color: #25a3d6;
	word-break: break-all;
}

/* ---- スマホ対応 ---- */
@media screen and (max-width: 768px) {
	.sdgs-page {
		padding: 30px 16px 50px;
	}
	.sdgs-page-title {
		font-size: 24px;
	}
	.sdgs-lead {
		font-size: 16px;
		line-height: 28px;
		text-align: left;
		margin-bottom: 40px;
	}
	.sdgs-block-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}
	.sdgs-icons img {
		width: 80px;
		height: 80px;
	}
	.sdgs-block-head h2 {
		font-size: 19px;
	}
	.sdgs-block h3,
	.sdgs-block p,
	.sdgs-block ul li,
	.sdgs-summary p {
		font-size: 16px;
		line-height: 28px;
	}
	.sdgs-summary {
		padding: 24px 18px;
	}
}