/* 新しいヘッダー（ロゴ＋キャッチ＋MENU）。
   tools/make-header-css.py が tools/area-style.css から切り出して作る。
   手で直さない。直すときは area-style.css の方を直して作り直す。
   エリアページは areaAddon.css に同じものが入っているので、これは読まない。 */

:root{
	--blue:#0e86c8;      /* ロゴの水色。見出し・主色 */
	--blue-d:#0a6b9e;
	--blue-l:#eaf6fc;    /* 薄い背景 */
	--orange:#ff9900;    /* 既存のナビの色。アクセント */
	--orange-d:#f07c00;
	--red:#cc0000;       /* 既存。金額・電話 */
	--ink:#333333;       /* 既存の本文色 */
	--sub:#6f7b85;
	--line:#d7e8f2;
	--white:#ffffff;
}

#wrap header.hd5{
	display:block;
	max-width:none;
	margin:0;
	padding:0;
	background:var(--white);
	border-bottom:1px solid var(--line);
	overflow:visible;
	/* 開いたメニューがファーストビューの画像の下に潜らないように */
	position:relative;
	z-index:1300;
}
.hd5in{
	display:flex;
	align-items:center;
	gap:14px;
	max-width:1000px;
	margin:0 auto;
	padding:9px 16px;
	box-sizing:border-box;
}
.hd5logo{
	flex:0 0 auto;
	display:block;
	line-height:0;
}
.hd5logo img{
	display:block;
	width:52px;
	height:auto;
}
#wrap .hd5catch{
	flex:1 1 auto;
	margin:0;
	padding:0;
	color:var(--ink);
	font-size:15px;
	font-weight:bold;
	line-height:1.5;
}
.hd5menu{
	flex:0 0 auto;
	margin-left:auto;
	position:relative;
}
.hd5menu > summary{
	list-style:none;
	cursor:pointer;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	width:54px;
	min-height:44px;
	padding:4px 0;
}
.hd5menu > summary::-webkit-details-marker{
	display:none;
}
.hd5menu > summary::marker{
	content:'';
}
.hd5bars{
	display:block;
	width:28px;
}
.hd5bars i{
	display:block;
	height:3px;
	margin:5px 0;
	border-radius:2px;
	background:var(--ink);
}
.hd5label{
	display:block;
	margin-top:3px;
	font-size:10px;
	font-weight:bold;
	letter-spacing:.08em;
	color:var(--ink);
}
/* 共通CSS が要素セレクタで nav{height:40px;background:#FF9900} を当てている。
   このパネルも nav なので、打ち消さないと中身があふれる。 */
#wrap nav.hd5nav{
	position:absolute;
	right:0;
	top:100%;
	z-index:1200;
	width:auto;
	height:auto;
	min-width:230px;
	clear:none;
	text-align:left;
	background:var(--white);
	border:1px solid var(--line);
	border-radius:6px;
	box-shadow:0 8px 20px rgba(0,0,0,.16);
}
#wrap nav.hd5nav ul{
	margin:0;
	padding:4px 0;
	list-style:none;
}
#wrap nav.hd5nav li{
	margin:0;
}
#wrap nav.hd5nav a{
	display:block;
	padding:13px 18px;
	font-size:15px;
	line-height:1.4;
	color:var(--ink);
	text-decoration:none;
	border-bottom:1px solid var(--blue-l);
}
#wrap nav.hd5nav li:last-child a{
	border-bottom:none;
}
#wrap nav.hd5nav a:hover{
	background:var(--blue-l);
	color:var(--blue-d);
}

/* パンくずは左端にそろえる（2026-10-22 ユーザー指示）。
   共通CSS が margin-left:40px を当てていた。 */
#wrap #pan{
	margin-left:0;
	padding-left:14px;
}
/* 共通CSS の「#content1 p span{font-size:14px}」が効いて、赤文字（.fcR）だけ
   本文より小さく見えていた（2026-10-22 指摘）。本文と同じ大きさに戻す。 */
#wrap #content1 p span{
	font-size:inherit;
}
#wrap #pan,#wrap #pan a{
	color:var(--sub);
	font-size:13px;
	line-height:1.8;
}

@media only screen and (max-width: 600px){
.hd5in{
	gap:10px;
	padding:7px 12px;
}
.hd5logo img{
	width:44px;
}
#wrap .hd5catch{
	font-size:13px;
	line-height:1.4;
}
.hd5menu > summary{
	width:48px;
}
#wrap nav.hd5nav{
	min-width:0;
	width:calc(100vw - 24px);
	max-width:320px;
}

}
