/* =========================================================
   さくらの里 / 猫装飾修正 v0.7.0
   SPでは実際の要素位置を確認して、重ならない空白へ自動配置する。
========================================================= */

html {
	overflow-x: clip;
}

.sns-cat-decoration {
	position: absolute !important;
	display: block !important;
	width: 124px !important;
	max-width: 124px !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	object-fit: contain !important;
	transform: none !important;
	opacity: 0.92;
	pointer-events: none;
	user-select: none;
	-webkit-user-drag: none;
	z-index: 6;
}

.sns-cat-decoration--right {
	right: 24px !important;
	left: auto !important;
}

.sns-cat-decoration--left {
	right: auto !important;
	left: 24px !important;
}

.sns-cat-decoration--upper,
.sns-cat-decoration--middle {
	top: 205px !important;
}

.sns-cat-decoration--home {
	top: 190px !important;
}

.sns-cat-decoration--cat-1,
.sns-cat-decoration--cat-4 {
	width: 142px !important;
	max-width: 142px !important;
}

.sns-cat-decoration--cat-3,
.sns-cat-decoration--cat-6 {
	width: 98px !important;
	max-width: 98px !important;
}

.sns-cat-decoration--cat-5 {
	width: 112px !important;
	max-width: 112px !important;
}

.admin-bar .sns-cat-decoration {
	margin-top: 32px !important;
}

@media (max-width: 1180px) {
	.sns-cat-decoration {
		width: 104px !important;
		max-width: 104px !important;
	}

	.sns-cat-decoration--right {
		right: 12px !important;
	}

	.sns-cat-decoration--left {
		left: 12px !important;
	}

	.sns-cat-decoration--cat-1,
	.sns-cat-decoration--cat-4 {
		width: 118px !important;
		max-width: 118px !important;
	}

	.sns-cat-decoration--cat-3,
	.sns-cat-decoration--cat-6 {
		width: 82px !important;
		max-width: 82px !important;
	}

	.sns-cat-decoration--cat-5 {
		width: 94px !important;
		max-width: 94px !important;
	}
}

@media (max-width: 782px) {
	.admin-bar .sns-cat-decoration {
		margin-top: 46px !important;
	}
}

@media (max-width: 1023px) {
	/*
	 * SP・タブレット縦では固定topを使わない。
	 * JavaScriptが見出し・本文・ボタン・画像の位置を確認してから表示する。
	 */
	.sns-cat-decoration {
		top: 0 !important;
		right: auto !important;
		left: 0 !important;
		width: 88px !important;
		max-width: 88px !important;
		margin: 0 !important;
		opacity: 0.88;
		visibility: hidden;
		z-index: 4;
	}

	.sns-cat-decoration.sns-cat-decoration--sp-positioned {
		visibility: visible;
	}

	.sns-cat-decoration.sns-cat-decoration--sp-hidden {
		display: none !important;
	}

	.sns-cat-decoration--cat-1,
	.sns-cat-decoration--cat-4 {
		width: 102px !important;
		max-width: 102px !important;
	}

	.sns-cat-decoration--cat-3,
	.sns-cat-decoration--cat-6 {
		width: 72px !important;
		max-width: 72px !important;
	}

	.sns-cat-decoration--cat-5 {
		width: 80px !important;
		max-width: 80px !important;
	}
	.admin-bar .sns-cat-decoration {
		margin-top: 0 !important;
	}
}

@media (max-width: 767px) {
	.sns-cat-decoration {
		width: 68px !important;
		max-width: 68px !important;
	}

	.sns-cat-decoration--cat-1,
	.sns-cat-decoration--cat-4 {
		width: 78px !important;
		max-width: 78px !important;
	}

	.sns-cat-decoration--cat-3,
	.sns-cat-decoration--cat-6 {
		width: 56px !important;
		max-width: 56px !important;
	}

	.sns-cat-decoration--cat-5 {
		width: 62px !important;
		max-width: 62px !important;
	}
}

@media (max-width: 420px) {
	.sns-cat-decoration {
		width: 60px !important;
		max-width: 60px !important;
	}

	.sns-cat-decoration--cat-1,
	.sns-cat-decoration--cat-4 {
		width: 68px !important;
		max-width: 68px !important;
	}

	.sns-cat-decoration--cat-3,
	.sns-cat-decoration--cat-6 {
		width: 48px !important;
		max-width: 48px !important;
	}

	.sns-cat-decoration--cat-5 {
		width: 54px !important;
		max-width: 54px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sns-cat-decoration {
		animation: none !important;
		transition: none !important;
	}
}
