/* フローティングCTAボタン専用スタイル */
.floating-cta {
	position: fixed;
	bottom: 2rem;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: row;
	gap: 1rem;
	z-index: 1000;
	/* スマホのブラウザUIとの重複を防ぐ */
	padding-bottom: env(safe-area-inset-bottom);
}

.floating-cta .floating-cta-button {
	padding: 0rem 2rem !important;
	border-radius: 50px !important;
	text-decoration: none !important;
	font-weight: bold !important;
	transition: all 0.3s ease !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 140px !important;
	height: 50px !important;
}

.floating-cta .floating-cta-casual {
	background: linear-gradient(135deg, #10b981, #3b82f6) !important;
	color: white !important;
	border: none !important;
	box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3) !important;
}

.floating-cta .floating-cta-casual:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4) !important;
}

.floating-cta .floating-cta-entry {
	background: linear-gradient(135deg, #06b6d4, #a855f7) !important;
	color: white !important;
	border: none !important;
	box-shadow: 0 4px 15px rgba(6, 182, 212, 0.3) !important;
}

.floating-cta .floating-cta-entry:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 6px 20px rgba(6, 182, 212, 0.4) !important;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
	.floating-cta {
		flex-direction: row;
		bottom: 1rem;
		gap: 0.5rem;
		justify-content: center;
		max-width: calc(100vw - 2rem);
		left: 1rem;
		right: 1rem;
		transform: none;
		flex-wrap: wrap;
	}
	
	.floating-cta .floating-cta-button {
		padding: 0.8rem 1rem !important;
		font-size: 0.8rem !important;
		min-width: auto !important;
		flex: 1 !important;
		max-width: 120px !important;
		height: 44px !important;
		white-space: nowrap !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
	}
}

/* より小さな画面サイズ用の調整 */
@media (max-width: 480px) {
	.floating-cta {
		bottom: 0.8rem;
		gap: 0.4rem;
		left: 0.8rem;
		right: 0.8rem;
	}
	
	.floating-cta .floating-cta-button {
		padding: 0.7rem 0.8rem !important;
		font-size: 0.75rem !important;
		height: 40px !important;
		max-width: 100px !important;
	}
}
