/* CSS Document */




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

	header

============================================================================*/
#header{
	position: absolute;
	width: 100%;
	height: 80px;
	background: #FFF;
    z-index: 999;
}
header .inner {
	width: 1280px;
	min-width: 400px;
	margin: auto;
	height: inherit;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
@media screen and (max-width:1340px) {
	header .inner {
		width: 1200px;
	}
}



/*------------------------------ ロゴ ------------------------------*/
#header_logo{
}
#header_logo img{
	width: 152px;
	height: auto;
}








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

	nav

============================================================================*/
nav ul {
	display: flex;
	align-items: center;
	gap: 35px;
}
nav ul li a {
	position: relative;
	font-size: 15px;
	color: #111;
}
nav ul li:last-child a {
	padding: 10px 25px;
	background: #901d22;
	color: #fff;
	border-radius: 40px;
}
nav ul li:last-child a:hover {
	background: #b02229;
}



/*------------------------------ ホバーのボーダー ------------------------------*/
nav li a::before{
    position: absolute;
	left: 0;
	right:0;
	bottom: -12px;
	width:100%;
	height:2px;
	margin:auto;
	background-color: #e1a231;
	transition: 0.15s  ease-out;
	transform: scaleX(0);
	content: "";
	z-index: 1;
}
nav li a:hover::before{
	transform: scaleX(1);
}
nav li:last-child a::before{
    display: none;
}



/*------------------------------ PC＊スクロール後設定 ------------------------------*/
#header.HeightMin{
	position: fixed;
	border-bottom: 1px solid #eee;
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from { opacity: 0; transform: translateY(-170px);}
  to   { opacity: 1; transform: translateY(0);}
}









@media screen and (max-width:640px) {

header {
	display:none;
}
nav {
	display: none;
}
	

/*============================================================================
	
	header
	
============================================================================*/
#sp_header_logo {
	position: absolute;
	width: 50%;
	max-width: 130px;
	top: 50%;
	transform: translateY(-50%);
	margin-left: 4%;
}
#sp_header_logo img {
	position: relative;
	z-index: 999;
	width: 100%;
	height: auto;
}

	
	
/*============================================================================
	
	SP nav
	
============================================================================*/
.ham_nav {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 70px;
	background: #fff;
	box-sizing: border-box;
	border-bottom: 1px solid #eee;
	z-index: 9998;
}
.ham_nav dl dt {
	cursor: pointer;
}

/* オーバーレイ */
.ham_nav dl dd {
	position: fixed;
	top: 0;
	bottom: 0;
	right: -100%;
	width: 100%;
	background: rgba(225, 160, 50, 0.7);
	transition: all 0.5s ease-in-out;
	z-index: 9999;
}
.ham_nav dl dd.active {
	right: 0;
}

/* メニューパネル */
.ham_nav ul {
	position: fixed;
	top: 0;
	bottom: 0;
	right: -100%;
	width: 90%;
	min-width: 300px;
	padding-top: 80px;
	background: #fff;
	box-sizing: border-box;
	overflow-y: auto;
	transition: all 0.5s ease-in-out;
	z-index: 99999;
}
.ham_nav ul.active {
	right: 0;
}

/* リスト */
.ham_nav ul li {
	position: relative;
	border-bottom: 1px solid #eee;
}
.ham_nav ul li::before {
	position: absolute;
	content: "";
	background: url("../images/icon05.svg") no-repeat center;
	background-size: 10px auto;
	width: 10px;
	height: 20px;
	top: 50%;
	transform: translateY(-50%);
	left: 25px;
}
.ham_nav ul li a {
	display: block;
	color: #111;
	padding: 18px 20px 18px 50px;
	text-decoration: none;
}

/* 最後のボタン */
.ham_nav li:last-of-type {
	border-bottom: none;
}
.ham_nav li:last-of-type::before {
	display: none;
}
.ham_nav li:last-of-type a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 80%;
	height: 60px;
	margin: 30px auto;
	padding: 0;
	background: #901d22;
	color: #fff;
	font-weight: 600;
	border-radius: 50px;
	text-align: center;
	transition: background .2s;
}
.ham_nav li:last-of-type a:hover {
	background: #b02229;
}

/*------------------------------ ハンバーガー ------------------------------*/
.ham_nav dt a {
	position: absolute;
	display: block;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	width: 70px;
	height: 70px;
	z-index: 9999999;
	background: #901d22;
}
.ham_nav dt a span {
	position: absolute;
	display: block;
	left: 21px;
	width: 29px;
	height: 2px;
	background: #fff;
	transition: all 0.4s;
}
.ham_nav dt a span:first-child {
	top: 25px;
}
.ham_nav dt a span:nth-child(2) {
	top: 50%;
	transform: translateY(-50%);
}
.ham_nav dt a span:last-child {
	bottom: 25px;
	transition-delay: .15s;
}
.ham_nav dt a.active span:first-child {
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
}
.ham_nav dt a.active span:nth-child(2) {
	opacity: 0;
	left: -40px;
}
.ham_nav dt a.active span:last-child {
	bottom: 50%;
	transform: translateY(50%) rotate(-45deg);
	transition-delay: 0s;
}

}





