/*
 * 亀谷歯科医院：表示の調整（2026-10-22）
 *   - ヘッダーのロゴを SVG ＋ Web フォントに置き換え（高解像度の画面でもぼやけない）
 *   - 動きを自然に：メニューのホバーで文字がずれない／読み込み時の跳ねる丸とせり上がりをやめる／点滅をやめる
 *   - スマホ：ヘッダーを低くし、メニューの文字間隔を揃える
 */

/* ---------- ロゴ ---------- */
.site-branding .kg-logo-h1 {
	display: inline;
	margin: 0;
	font-size: inherit;
	line-height: inherit;
}

.site-branding .kg-logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: #fff;
	text-decoration: none;
	vertical-align: middle;
	line-height: 1;
}

.site-branding .kg-logo:hover,
.site-branding .kg-logo:focus {
	color: #fff;
	text-decoration: none;
}

.site-branding .kg-logo svg {
	flex: none;
	width: auto;
	height: 46px;
}

.site-branding .kg-logo__text {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-family: 'M PLUS Rounded 1c', 'Kosugi Maru', sans-serif;
	font-weight: 500;
	white-space: nowrap;
}

.site-branding .kg-logo__ja {
	font-size: 25px;
	letter-spacing: 0.3em;
	margin-right: -0.3em;
}

.site-branding .kg-logo__en {
	font-size: 13px;
	letter-spacing: 0.2em;
}

/* ---------- ヘッダー：固定表示への切り替えは背景と影だけを短く変える ---------- */
#masthead.site-header {
	transition: background-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* ---------- メニュー（PC）：ホバーで余白を変えず、色だけをなめらかに変える ---------- */
@media screen and (min-width: 1141px) {
	.onepress-menu > li:not(.telantf) > a,
	.onepress-menu > li:not(.telantf) > a:hover,
	.onepress-menu > li.onepress-current-item:not(.telantf) > a {
		display: inline-block;
		margin: 0 0.15em !important;
		padding: 0 1.1em !important;
		border-radius: 999px;
		line-height: 2.5;
		letter-spacing: 0.14em !important;
		transition: background-color 0.25s ease, color 0.25s ease;
	}

	.onepress-menu > li:not(.telantf) > a {
		background-color: transparent !important;
	}

	.onepress-menu > li:not(.telantf) > a:hover,
	.onepress-menu > li:not(.telantf) > a:focus-visible,
	.onepress-menu > li.onepress-current-item:not(.telantf) > a {
		background-color: #fff !important;
		color: #ff9600 !important;
	}

	/* 電話番号：ホバーで余白を変えない */
	.onepress-menu li.telantf > a,
	.onepress-menu li.telantf > a:hover {
		display: inline-block;
		margin: 0 !important;
		padding: 0 0.75em 0 0.25em !important;
		border-radius: 999px;
		transition: background-color 0.25s ease, color 0.25s ease;
	}
}

/* ---------- メニュー（スマホ・タブレット） ---------- */
@media screen and (max-width: 1140px) {
	.onepress-menu.onepress-menu-mobile > li:not(.telantf) > a,
	.onepress-menu.onepress-menu-mobile > li:not(.telantf) > a:hover,
	.onepress-menu.onepress-menu-mobile > li.onepress-current-item:not(.telantf) > a {
		display: block;
		margin: 0 !important;
		padding: 15px 24px !important;
		border-radius: 0;
		letter-spacing: 0.12em !important;
		background-color: transparent !important;
		color: #555 !important;
		transition: background-color 0.2s ease, color 0.2s ease;
	}

	.onepress-menu.onepress-menu-mobile > li:not(.telantf) > a:active,
	.onepress-menu.onepress-menu-mobile > li:not(.telantf) > a:focus-visible {
		background-color: #fff6ea !important;
		color: #ff9600 !important;
	}
}

/* ---------- トップ画像：跳ねる丸と、遅れてせり上がる動きをやめ、短いフェードだけにする ---------- */
.hero-slideshow-wrapper .slider-spinner {
	display: none !important;
}

.hero-slideshow-wrapper .hero__content .hero-large-text,
.hero-slideshow-wrapper .hero__content .hero-small-text,
.hero-slideshow-wrapper .hero__content .btn,
.hero-slideshow-wrapper.loaded .container .hero__content:hover .hero-large-text,
.hero-slideshow-wrapper.loaded .container .hero__content:hover .hero-small-text,
.hero-slideshow-wrapper.loaded .container .hero__content:hover .btn {
	visibility: visible !important;
	opacity: 1;
	transform: none !important;
	transition: none !important;
}

.hero-slideshow-wrapper .hero__content .hero-large-text {
	animation: kg-fade-in 0.6s ease-out both;
}

@keyframes kg-fade-in {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* ---------- 「ページ上部へ」の矢印：点滅をやめる ---------- */
.back-to-top .wow,
.wow.flash {
	visibility: visible !important;
	animation: none !important;
}

/* ---------- スマホ：ヘッダーを低くする ---------- */
@media screen and (max-width: 767px) {
	#masthead.site-header {
		padding: 6px 0;
		line-height: 56px;
	}

	.site-branding {
		width: auto !important;
	}

	.site-branding .site-logo-div {
		line-height: 56px;
	}

	.site-branding .kg-logo {
		gap: 8px;
	}

	.site-branding .kg-logo svg {
		height: 34px;
	}

	.site-branding .kg-logo__text {
		gap: 4px;
	}

	.site-branding .kg-logo__ja {
		font-size: 19px;
	}

	.site-branding .kg-logo__en {
		font-size: 10px;
	}

	.onepress-menu.onepress-menu-mobile {
		top: 68px !important;
	}

	/* トップ画像を、低くなったヘッダーのすぐ下から始める */
	#hero .container {
		padding-top: 0 !important;
	}

	#hero .hero__content {
		margin-top: 80px !important;
	}
}

/* ---------- 動きを減らす設定の閲覧者には、アニメーションを出さない ---------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation: none !important;
		transition: none !important;
		scroll-behavior: auto !important;
	}
}
