		.card-header {
			background-color: #ffffff; 
			border-color: #0f0f0f;
			flex: 0 0 auto;
			height: 46px;
			display: flex;
		/*	align-items: center; */
		/* justify-content: center; */
		}
		.card-footer {
			background-color: #ffffff; 
			border-color: #0c0c0c;
			flex: 0 0 auto;
			height: 46px;
			display: flex;
		/*	align-items: center; */
		/*	justify-content: center; */
		}
		.btnx--outline-green{
		color: var(--bs-green); background:var(--bs-white); border: 1px solid #ffffff; 
		}
		/* レイアウト全体を 100vh 高さに設定 */
		.layout {
			display: flex;
			flex-direction: column;
			height: 100vh;
		}
		/* メインコンテンツはスクロール可能 */
		.content {
			flex: 1 1 auto;
			overflow-y: auto;
		}
		/* Webkit系ブラウザ（Chrome, Edge, Safari）用 */
		.content::-webkit-scrollbar {
			width: 4px; /* スクロールバーの幅 */
		}
		
		/* Webkit系ブラウザ（Chrome, Edge, Safari）用 */
		.content::-webkit-scrollbar-thumb {
			background: rgba(0, 0, 0, 0.4);
			border-radius: 4px;
			height: 20px; /* つまみ部分の最小サイズ */
			margin: 20px; /* トラック内で余白を作り、短く見せる */
		}
		.content::-webkit-scrollbar-thumb:hover {
			background: rgba(0, 0, 0, 0.6); /* ホバー時の色 */
		}
		.content::-webkit-scrollbar-track {
			background: linear-gradient(
				to bottom,
				transparent 20%,
				rgba(0, 0, 0, 0.1) 20%,
				rgba(0, 0, 0, 0.1) 80%,
				transparent 80%
			);
			scrollbar-gutter: stable both-edges; /* スクロールバーの両端に余白を追加 */
		}
		/* Firefox用 */
		.content {
			scrollbar-width: thin; /* スクロールバーを細くする */
			scrollbar-color: rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.1); /* スクロールバーと背景の色 */
		}