@charset "UTF-8";
/* ============================================================
   固定ページ 見出し(h1)のみシンプル化 (2026-08-30 v5)
   v3からの変更点：見出し下の英語サブタイトル(p)がclamp()による
   連続可変だったため、見出し本体(h1)や common.css 全体の方式
   （768px境界での2段階切替）と表示タイミングが揃っていなかった。
   サブタイトルも768px境界の2段階（16px→12px）に統一。
   v5：.page-titleに固定ヘッダー分のmargin-top:88pxが無く、/contact/等
   写真の無い（薄い）ページで見出しが固定ヘッダーの下に隠れる不具合を修正。

   ・.page-title02（旧：網目背景＋白ボックス型）
     → 網目背景・白ボックスを廃止し、テキスト＋下線のみに
   ・.page-title（写真ヒーロー型：/access/ /guide/ /firststage/）
     → 写真はそのまま残し、見出しは写真に重ねず、写真の下に
       テキスト＋下線のみで表示（絶対配置の中央寄せを廃止）
   見出し(h1)・サブタイトル(p)とも5ブログ(.entry__title)・
   common.css全体と同じ768px境界の2段階切替に統一。
   common.css より後に読み込むことで上書きする
   （common_stylesheetテンプレート末尾にlinkタグ追加）。
   ============================================================ */

.page-title,
.page-title02 {
	height: auto;
	overflow: visible;
}

/* .page-titleには元々固定ヘッダー分のmargin-topが無く、写真が無いページ(/contact/等)や
   写真が薄いページで見出しが固定ヘッダーの下に隠れてしまうため、.page-title02と
   同じ余白を追加する */
.page-title {
	margin-top: 88px;
}

/* 網目背景(bg-border.jpg)は見出しを囲う役割しかないため廃止 */
.page-title02.bg-border {
	background: none;
}

/* 見出しの外枠（白ボックス／absolute中央寄せ）を解除し、通常の行として配置 */
.page-title .box-page-title,
.page-title02 .box-page-title {
	position: static;
	inset: auto;
	margin: 0;
	width: auto;
	height: auto;
	max-width: none;
	background-color: transparent;
	text-align: left;
	padding: 24px 20px;
}

/* 見出し(h1)本体：5ブログの.entry__titleと完全に同じサイズ・太さ・行間に統一
   ※Safari実機で本文テキストが不可視になる事象が報告されたため、
   colorに!importantと-webkit-text-fill-colorを明示し防御 */
.page-title .box-page-title h1,
.page-title02 .box-page-title h1 {
	display: block;
	font-size: 26px;
	font-weight: 500;
	color: #2c2c2a !important;
	-webkit-text-fill-color: #2c2c2a;
	opacity: 1 !important;
	line-height: 1.5;
	margin: 0 0 8px;
	padding-bottom: 12px;
	border-bottom: 2px solid #0F6E56;
}

/* サブタイトル（英語キャプション）：clamp()をやめ、h1と同じ768px境界の2段階に統一 */
.page-title .box-page-title p,
.page-title02 .box-page-title p {
	font-size: 16px;
	color: #666;
	margin: 0;
}

@media (max-width: 768px) {
	.page-title .box-page-title h1,
	.page-title02 .box-page-title h1 {
		font-size: 20px;
	}
	.page-title .box-page-title p,
	.page-title02 .box-page-title p {
		font-size: 12px;
	}
}