/**
 * リンク・ボタンのタップ／ホバー応答を素早くする
 *
 * @package Sankoudenki
 */

:root {
	--link-motion-duration: 0.12s;
	--link-motion-ease: ease-out;
}

a,
button,
input[type="submit"],
input[type="button"],
label[for],
.interactive-btn,
.card-more-link,
.news-list-link,
.header-nav-link,
.nav-sub-link,
.nav-dropdown-trigger,
.section-cta-btn,
.recruit-cta-btn,
.works-pagination-link,
.works-archive-link,
.works-carousel-btn,
.site-footer a,
.site-footer__blog-btn,
#services a.service-card-detail,
.service-card-hero__link {
	touch-action: manipulation;
	-webkit-tap-highlight-color: rgba(21, 92, 137, 0.14);
}

@media (hover: hover) {
	a.transition-colors,
	.news-list-link,
	.news-list-link .transition-colors,
	.header-nav-link,
	.nav-sub-link {
		transition-duration: var(--link-motion-duration) !important;
		transition-timing-function: var(--link-motion-ease) !important;
	}
}

.card-more-link,
.contact-tel-link,
.works-archive-link,
.news-list-link__arrow,
#services a.service-card-detail,
.interactive-btn,
.interactive-btn-icon {
	transition-duration: var(--link-motion-duration);
	transition-timing-function: var(--link-motion-ease);
}

.card-more-link {
	transition-property: color, gap;
}

.news-list-link {
	transition: background-color var(--link-motion-duration) var(--link-motion-ease),
		color var(--link-motion-duration) var(--link-motion-ease);
}

a:active:not([aria-disabled="true"]),
button:active:not(:disabled),
.card-more-link:active,
.news-list-link:active,
.section-cta-btn:active,
.recruit-cta-btn:active,
.interactive-btn:active,
.header-cta:active,
#services a.service-card-detail:active,
.works-pagination-link:active:not(.dots),
.works-carousel-btn:active {
	transition-duration: 0.05s;
}

.news-list-link:active {
	background-color: rgba(43, 168, 220, 0.16) !important;
}

.news-list-link:active span {
	color: var(--color-primary-hover) !important;
}

#services article.group,
#company article.group {
	transition-duration: 0.15s !important;
	transition-property: border-color, box-shadow;
}

#services .service-card-hero__link img,
#services article.group img.object-cover,
#company article.group img,
.blog-card img {
	transition-duration: 0.2s !important;
	transition-timing-function: ease-out !important;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--link-motion-duration: 0.01ms;
	}
}