body > header {
	background: var(--color-white);
	padding: calc(var(--padding) / 2) var(--padding);
	z-index: 10;
	top: 0;
}

body.scrolled > header {
	box-shadow: var(--shadow-2);
}

body > header h1 {
	width: 260px;
	z-index: 10;
}

body > header h1 a {
	display: flex;
	flex-wrap: nowrap;
	gap: 5px;
	align-items: flex-start;
	justify-content: flex-start;
}

body > header >div .contact .button {
	border: solid 1px var(--color-black);
	background: var(--color-white);
	color: var(--color-black);
	border-radius: 100px;
	letter-spacing: 2px;
	display: flex;
	flex-wrap: nowrap;
	gap: 5px;
	line-height:1.2;
	align-items: center;
	justify-content: center;
}

body > header >div .contact .button:hover {
	background: var(--color-lightgray);
	color: var(--color-black);
}

body > header >div .contact .button img {
	height: 1em;
	width: auto;
}

body > header >div .contact p.tel {
	font-size: 1.1em;
	font-weight: bold;
	text-align:right;
}

body > header >div .contact p.tel a {
	display: flex;
	flex-wrap: nowrap;
	gap: 5px;
	align-items: center;
	justify-content: flex-start;
	margin-top: 2px;
	font-size: clamp(1.2em, 1.8vw, 1.6em);
	font-weight: 700;
	line-height: 1;
}

body > header >div .contact p.tel a img {
	height: 0.9em;
	width: auto;
}

body > header >div .contact p.tel a:hover {
	color: var(--color-green);
}


@media (max-width: 920px) {
	body > .menu-trigger {
		position: fixed;
		right: 0px;
		top: 25px;
		z-index: 9999;
	}
	body > header{
		padding-right: 40px;
	}
	body > header >div .contact .button{
		min-width: unset;
	}
}
@media (max-width: 820px) {
	body > .menu-trigger {
		position: fixed;
		right: calc(var(--padding) - 10px);
		top: 5px;
	}
	body > header {
		letter-spacing: 0;
	}

	body > header > div {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body > header h1 {
		width: 150px;
	}

	/* お問い合わせを画面下固定に */
	body > header >div .contact {
		position: fixed;
		left: 0;
		bottom: 0;
		background: var(--color-lightgreen);
		width: 100%;
		padding: 10px 20px;
		line-height: 1.5;

		flex-direction: row-reverse;
		justify-content: center !important;
	}

	body > header >div .contact p {
		flex:1;
	}
	body > header >div .contact p.tel {
		font-size:1em;
	}

	body > header >div .contact p.tel a:before {
		content: "";
		width: 20px;
		height: 20px;
		background: url(../_img/icons/green/tel.svg) no-repeat;
		background-size: contain;

	}

	body > header >div .contact p.tel a img {
		display: none;
	}

	body > header >div .contact .button {
		letter-spacing: 0px;
		min-width: unset;
	}
	body > header >div .contact .button i {
		font-size:1.2em;
	}
}

/* ワイド画面時 */
@media (min-width: 521px) {
    body > header .store-link {
        position:fixed;
        right:-60px;
        top:calc(30% + 220px);
        transition:right var(--transition);
    }
    body.scrolled > header .store-link {
        right:0;
    }
    body > header .store-link a {
        background: var(--color-green);
        border-radius: var(--radius) 0 0 var(--radius);
        width: 60px;
        height:fit-content;
        padding: 20px 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap:10px;
    }
    body > header .store-link a:hover {
        background:#4DBC31;
    }
    body > header .store-link a img {
        width:20px;
    }
    body > header .store-link a span {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 40px;
        writing-mode: vertical-lr;
        color: var(--color-white);
        font-weight:bold;
    }
}

@media (max-width: 520px) {
    body > header .store-link {
        margin-right:25px;
    }
    body > header .store-link a {
        background: var(--color-green);
        border-radius: 100px;
        padding: 5px 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap:5px;
    }
    body > header .store-link a img {
        width:20px;
    }
    body > header .store-link a span {
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: var(--color-white);
        font-weight:bold;
    }
}