@charset "UTF-8";
/* CSS Document */
/*=============================================
***********************************************

　　共通

***********************************************
=============================================*/
body{
	color: #000000;
	font-family: dnp-shuei-gothic-gin-std, sans-serif;
	font-weight: 400;
	font-style: normal;
	letter-spacing: .1em;
	font-size: 14px;
	line-height: 1.7;
	box-sizing: border-box;
}
.flexbox{
	display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}
a{
	color: #000000;
	text-decoration: none;
}
a:hover{opacity: 0.6;}
img{max-width: 100%;}
.sp{display: none;}
section { scroll-margin-top: 95px; /* ヘッダーの高さに合わせて調整 */}
/*=============================================
***********************************************

　　header

***********************************************
=============================================*/
header{
	font-size: 13px;
	padding: 30px 0;
  /* 追従（スクロール固定） */
	position: fixed;
	top: 0;
	z-index: 10;
	width: 100%;
}
/* 初期状態：透明（追従） */
header.site-header {
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.header_in{
	max-width: 1800px;
	width: 95%;
	margin: 0 auto;
	justify-content: space-between;
}
header h1{
	width: 3.5%;
	min-width: 45px;
	z-index: 10;
	padding-left: 10px;
}
header.site-header .color{display: none;}
header .menu{
	max-width:1000px;
	width: 90%;
}
header ul{display: inline-flex;}
header li {
	list-style-type: none;
	flex-grow: 1;
	text-align: center;
}
header li + li { border-left: 1px solid #ffffff; }
header li a{
	color: #ffffff;
	display: block;
	line-height: 1;
}
header li a img{max-width: 20px;}
header li:last-child{
	flex-grow: 0;
	border-left: none;
	margin-left: 5%;
}
header li:last-child a{
	align-items: center;
	column-gap: .5em;
}
/* スクロールのメニューバーデザイン */
header.site-header.scrolled li + li { border-color:  #b31e23; }
header.site-header.scrolled a{color: #b31e23;}
header.site-header.scrolled .color{display: inline-block;}
header.site-header.scrolled .white{display: none;}
.header_in{
	max-width: 1800px;
	width: 95%;
	margin: 0 auto;
	justify-content: space-between;
}

/* 追加：ハンバーガーボタン ---------------------- */
.site-header .hamburger{
	display: none;              /* PCでは非表示 */
	appearance: none;
	width: 42px;
	height: 42px;
	border: 0;
	background: transparent;
	position: relative;
	align-self: center;
	cursor: pointer;
	z-index: 10;
}
.site-header .hamburger span{
	position: absolute;
	left: 8px; right: 8px;
	height: 2px;
	background: #ffffff;
	transform-origin: center;
	transition: transform .25s ease, top .25s ease, opacity .2s ease;
}
header.site-header.scrolled .hamburger span{background: #b31e23;}
.site-header .hamburger span:nth-child(1){ top: 13px; }
.site-header .hamburger span:nth-child(2){ top: 20px; }
.site-header .hamburger span:nth-child(3){ top: 27px; }

/* 開いた時の「×」アニメ */
.site-header.is-open .hamburger span:nth-child(1){ top: 20px; transform: rotate(45deg);}
.site-header.is-open .hamburger span:nth-child(2){opacity: 0;}
.site-header.is-open .hamburger span:nth-child(3){top: 20px; transform: rotate(-45deg);}

/* 750px以下：ハンバーガー化 ---------------------- */
@media (max-width: 950px){
	header{padding: 10px 0;}
	/* ロゴは左、ハンバーガーは右に */
		.site-header{ align-items: center; }
		.site-header .hamburger{ display: inline-block; margin-left: auto; }
	/* メニューはオーバーレイで全画面 */
	header .menu{
		width: 100%;
		position: fixed;
		inset: 0;
		display: block;
		transform: translateY(-100%);
		transition: transform 1.5s ease;
		padding-top: 100px;
		background-color: #ffffff;/* ヘッダー分の余白。数字は調整可 */
		}
	/* 開いた状態 */
		.site-header.is-open .menu{
		transform: translateY(0);
		}
	/* 縦並びに変更 */
	header ul{
		margin: 0 auto;
		max-width: 600px;
		width: 90%;
	}
	header li{
		flex-grow: 0;
		width: 100%;
		text-align: left;
		border: none !important;
	}
	header li + li{border-top: 1px solid #b31e23 !important;}
	header li a{padding: 1.5em; color: #b31e23;!important;}
	header li:last-child{margin-left: 0;}
	header li:last-child a{
		display: flex; align-items: center; gap: .6em;
	}
	/* 背景下のスクロール抑止（任意） */

	body.no-scroll{height: 100vh; overflow: hidden;}
	
	header.site-header.is-open.site-header .hamburger span{background-color: #b31e23;}
	header.site-header.is-open .white{display: none!important;}
	header.site-header.is-open .color {display: inline-block !important;}
}

/*=============================================
***********************************************

　　お問い合わせ

***********************************************
=============================================*/
.contact_box{
	background-color:#f7f9f6 ;
	padding: 60px 0;
}
.contact_box a{
	
}
.contact_box div{
	max-width: 1400px;
	margin: 0 auto;
	width: 90%;
	text-align: left;
}
.contact_box div img{
	max-width: 20px;
	margin-right: .5em;
	vertical-align: baseline;
}
/*=============================================
***********************************************

　　footer

***********************************************
=============================================*/
#footer{
	width: 90%;
	margin: 80px auto;
	align-items: flex-end;
	justify-content: space-between;
	gap: 40px 5%;
}
#footer div p:first-child{margin-bottom: 1em;}
#footer div small{display: block;}
#footer div>small{
	text-align: right;
	font-size: 10px;
}
.stop_inshu{
	gap: 1em;
	font-size: 10px;
	align-items: center;
	margin-bottom: 1em;
	text-align: right;
}
@media screen and (max-width: 750px) {
	#footer {margin: 60px auto;}
	#footer div>small,
	.stop_inshu{text-align: center;}
	.stop_inshu{
		    flex-direction: column-reverse;
    align-items: center;
	}
	#footer div,
	.stop_inshu li{width: 100%;}
	.stop_inshu li .sp{display: block;}
}