@charset "UTF-8";
/* ===========================================
トップページ専用CSS
=========================================== */

/* ===========================================
トップバナーのカスタマイズ
=========================================== */
.swiper-pagination-bullet-active {
	background-color: var(--color-primary) !important;
}

/* ===========================================
Ajaxローディング
=========================================== */
#ajax-post-list-container {
	position: relative;
}

#ajax-post-list-container.is-loading::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.7);
	z-index: 10;
}

#ajax-post-list-container.is-loading::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	margin: -20px 0 0 -20px;
	border: 3px solid #f3f3f3;
	border-top: 3px solid var(--color-primary);
	border-radius: 50%;
	animation: spin 1s linear infinite;
	z-index: 11;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

#ajax-post-list-container.is-loading .ajax-post-list-content {
	opacity: 0.5;
	pointer-events: none;
	transition: opacity 0.2s ease;
}