/* セクション編集 — レイヤーの動き（アニメーション）キーフレーム
 * 振幅は CSS 変数で各要素ごとに調整可能。フロント・編集の双方で読み込む。 */
@keyframes se-shake {
	0%, 100% { translate: 0 0; }
	20% { translate: calc( -1 * var( --se-amp, 8px ) ) 0; }
	40% { translate: var( --se-amp, 8px ) 0; }
	60% { translate: calc( -0.6 * var( --se-amp, 8px ) ) 0; }
	80% { translate: calc( 0.6 * var( --se-amp, 8px ) ) 0; }
}
@keyframes se-bounce {
	0%, 100% { translate: 0 0; }
	50% { translate: 0 calc( -1 * var( --se-amp, 14px ) ); }
}
@keyframes se-wiggle {
	0%, 100% { rotate: calc( -1 * var( --se-amp-r, 3deg ) ); }
	50% { rotate: var( --se-amp-r, 3deg ); }
}
@keyframes se-pulse {
	0%, 100% { scale: 1; }
	50% { scale: calc( 1 + var( --se-amp-s, 0.06 ) ); }
}
@keyframes se-float {
	0%, 100% { translate: 0 0; }
	50% { translate: 0 calc( -1 * var( --se-amp, 10px ) ); }
}
@keyframes se-spin {
	from { rotate: 0deg; }
	to { rotate: 360deg; }
}

/* ナビのスマホ用ハンバーガー / アコーディオン変換 */
.se-nav-toggle {
	display: none;
	appearance: none;
	border: 0;
	background: transparent;
	color: inherit;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	padding: 6px 12px;
}
/* タブレット幅以下で有効化 */
@media ( max-width: 900px ) {
	[data-se-nav] .se-nav-toggle { display: inline-block; }
	[data-se-nav="hamburger"] > ul,
	[data-se-nav="hamburger"] > ol,
	[data-se-nav="hamburger"] > div > ul,
	[data-se-nav="accordion"] > ul,
	[data-se-nav="accordion"] > ol {
		display: none !important;
	}
	[data-se-nav].se-nav-open > ul,
	[data-se-nav].se-nav-open > ol,
	[data-se-nav].se-nav-open > div > ul {
		display: block !important;
	}
	[data-se-nav="hamburger"].se-nav-open > ul,
	[data-se-nav="hamburger"].se-nav-open > ol {
		position: absolute;
		left: 0;
		right: 0;
		background: #ffffff;
		box-shadow: 0 8px 24px rgba( 0, 0, 0, 0.18 );
		padding: 8px 0;
		z-index: 9998;
	}
	[data-se-nav].se-nav-open > ul li,
	[data-se-nav].se-nav-open > ol li {
		display: block !important;
		width: 100% !important;
		float: none !important;
	}
}
