@charset "UTF-8";
/*!
 * 自作css
 * Copyright 2025-2025 The Bootstrap Yasuhara
 */
/* 全画面背景の設定 */
body {
	background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
				url('https://images.unsplash.com/photo-1554224155-6726b3ff858f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-color: aliceblue !important;
	padding-top: 70px; /* 固定navbarの高さ分のパディング */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* メインコンテンツの背景調整 */
main {
	background: transparent;
	border-radius: 8px;
	margin: 20px;
	backdrop-filter: blur(5px);
}

/* ナビゲーションバーの背景調整 */
.navbar {
	background: rgba(0, 0, 0, 0.9) !important;
	backdrop-filter: blur(20px);
	border-bottom: 1px solid rgba(59, 130, 246, 0.3);
}

/* カード要素の背景調整 */
.card {
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
	transition: all 0.3s ease;
}



/* 登録系画面用のカードスタイル（table-responsiveと同じ） */
.card-registration {
	padding: 20px;
	background: rgba(255, 255, 255, 0.95);
	border-radius: 12px;
	margin: 20px 0;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	color: #000000; /* 登録系画面のカード内のテキストを黒に設定 */
}



/* 登録系画面のカード内のすべてのテキスト要素を黒に設定 */
.card-registration * {
	color: #000000 !important;
}

/* 登録系画面のカードタイトルを黒に設定 */
.card-registration .card-title {
	color: #000000 !important;
}

/* 登録系画面のカードテキストを黒に設定 */
.card-registration .card-text {
	color: #000000 !important;
}

/* 登録系画面のカードヘッダーを黒に設定 */
.card-registration .card-header {
	color: #000000 !important;
	background: rgba(255, 255, 255, 0.95) !important;
}

/* 登録系画面のカード内のフォーム要素を明確に表示 */
.card-registration .form-control,
.card-registration .form-select,
.card-registration .form-check-input,
.card-registration .form-check-label {
	color: #000000 !important;
}

/* 登録系画面のカード内のラベルを黒に設定し、背景を調整 */
.card-registration label {
	/* color: #000000 !important; を削除してHTMLクラスを尊重 */
	font-weight: 600;
	background: rgba(255, 255, 255, 0.8);
	padding: 4px 8px;
	border-radius: 4px;
	margin-bottom: 8px;
	display: inline-block;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

/* 登録系画面のカード内のsmall要素を黒に設定 */
.card-registration small {
	color: #000000 !important;
}

/* 登録系画面のカード内のエラーメッセージを明確に表示 */
.card-registration .error {
	color: #dc3545 !important;
	font-weight: 500;
}

/* 登録系画面のカード内のテーブルを明確に表示 */
.card-registration .table {
	background: rgba(255, 255, 255, 0.95) !important;
}

.card-registration .table th,
.card-registration .table td {
	color: #000000 !important;
}

/* カード内のすべてのテキスト要素を黒に設定 */
.card * {
	color: #000000 !important;
}

/* メニュー画面のカードは除外（白文字を保持） */
.menu-card * {
	color: inherit !important;
}

/* メニュー画面のカードタイトルとテキストは白のまま */
.menu-card .card-title,
.menu-card .card-text {
	color: #ffffff !important;
}

/* メニュー画面のカードにホバー効果を追加 */
.menu-card {
	transition: all 0.3s ease;
	cursor: pointer;
}

.menu-card:hover {
	background: rgba(255, 255, 255, 0.2);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

/* カードタイトルを黒に設定 */
.card-title {
	color: #000000 !important;
}

/* カードテキストを黒に設定 */
.card-text {
	color: #000000 !important;
}

/* カードヘッダーを黒に設定 */
.card-header {
	color: #000000 !important;
	background: rgba(255, 255, 255, 0.9) !important;
}

/* カード内のフォーム要素を明確に表示 */
.card .form-control,
.card .form-select,
.card .form-check-input,
.card .form-check-label {
	color: #000000 !important;
}

/* カード内のラベルを黒に設定 */
.card label {
	/* color: #000000 !important; を削除してHTMLクラスを尊重 */
	font-weight: 500;
}

/* カード内のsmall要素を黒に設定 */
.card small {
	color: #000000 !important;
}

/* カード内のエラーメッセージを明確に表示 */
.card .error {
	color: #dc3545 !important;
	font-weight: 500;
}

/* カード内のテーブルを明確に表示 */
.card .table {
	background: rgba(255, 255, 255, 0.95) !important;
}

/* テーブルの背景調整 */
.table {
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	margin: 20px 0;
	border: 1px solid rgba(79, 70, 229, 0.1);
}

.table thead th {
	background: #000080 !important;
	color: #ffffff !important;
	border: none;
	padding: 15px 12px;
	font-weight: 600;
}

/* ボタンの背景調整 */
.btn-primary {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
}

.btn-primary:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

/* フォーム要素の背景調整と位置調整 */
.form-control {
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
	margin-bottom: 15px;
	vertical-align: middle;
}

/* ファイル入力フィールドのスタイルをリセット */
.form-control[type="file"] {
	background: transparent;
	border: 1px solid #ced4da;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #212529;
	background-color: #fff;
	border-radius: 0.375rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus {
	background: rgba(255, 255, 255, 1);
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

/* フォームグループの間隔調整 */
.form-group {
	margin-bottom: 20px;
}

/* ラベルの位置調整 */
.form-label {
	margin-bottom: 8px;
	display: block;
	font-weight: 600;
	/* color: #212529; を削除してHTMLクラスを尊重 */
}

/* 入力フィールドの垂直位置調整 */
.form-control,
.form-select {
	height: auto;
	min-height: 38px;
	line-height: 1.5;
	padding: 8px 12px;
	vertical-align: middle;
}

/* セレクトボックスの位置調整 */
.form-select {
	background-position: right 12px center;
	padding-right: 40px;
}

/* チェックボックスとラジオボタンの位置調整 */
.form-check {
	margin-bottom: 10px;
	display: flex;
	align-items: center;
}

.form-check-input {
	margin-right: 8px;
	margin-top: 0;
	vertical-align: middle;
}

.form-check-label {
	margin-bottom: 0;
	vertical-align: middle;
}

/* アラートの背景調整 */
.alert {
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(59, 130, 246, 0.2);
}

/* フッターの背景調整 */
footer {
	background: rgba(0, 0, 0, 0.9) !important;
	backdrop-filter: blur(20px);
	border-top: 1px solid rgba(59, 130, 246, 0.3);
	color: #93c5fd;
}

/* ページタイトルのスタイリング */
.page-title {
	color: #ffffff !important;
	font-weight: 600 !important;
	font-size: 1.8rem !important;
	text-align: left !important;
	margin-bottom: 1.5rem !important;
}

/* セクションタイトルのスタイリング */
.section-title {
	color: #ffffff !important;
	font-weight: 600 !important;
	font-size: 1.4rem !important;
	text-align: left !important;
	margin-bottom: 1.5rem !important;
	padding-bottom: 0.5rem !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
}

/* 一般的な見出しのスタイリング */
h1, h2, h3 {
	color: #ffffff !important;
	font-weight: 600 !important;
	text-align: left !important;
	margin-bottom: 1rem !important;
}

h1 {
	font-size: 2rem !important;
}

h2 {
	font-size: 1.6rem !important;
}

h3 {
	font-size: 1.3rem !important;
}

/* フッターを下部に固定 */
footer {
	margin-top: auto;
	padding: 0; /* 余白を削除 */
	background-color: #f8f9fa;
	border-top: 1px solid #dee2e6;
}

.elebook-container {
	max-width: 900px;
	margin: 50px auto;
}
.elebook-title {
	text-align: center;
	margin-bottom: 30px;
	font-weight: bold;
}
.elebook-card {
	transition: 0.3s;
	padding: 20px;
}
.elebook-icon {
	font-size: 40px;
}
.elebook-icon-blue {
	font-size: 40px;
	color: rgb(0, 128, 255);
}
.elebook-icon-green {
	font-size: 40px;
	color: rgb(0, 255, 0);
}
.elebook-icon-orange {
	font-size: 40px;
	color: rgb(255, 128, 0);
}
.elebook-icon-pink {
	font-size: 40px;
	color: rgb(239, 146, 235);
}
.elebook-icon-purple {
	font-size: 40px;
	color: rgb(128, 0, 255);
}
.logout-btn {
	font-size: 18px;
}
.first-letter-blue::first-letter {
	color: rgb(0, 128, 255);
}
.first-letter-green::first-letter {
	color: rgb(0, 255, 0);
}
.first-letter-orange::first-letter {
	color: rgb(255, 128, 0);
}
.first-letter-pink::first-letter {
	color: rgb(239, 146, 235);
}
.first-letter-purple::first-letter {
	color: rgb(128, 0, 255);
}

/* 非活性状態のフォームコントロール */
.form-control-disabled {
	background-color: #e9eced !important;
	color: #6c757d !important;
	cursor: not-allowed !important;
	opacity: 0.65;
}

/* メインコンテンツのフレックス設定 */
main.flex-grow-1 {
	flex: 1 0 auto;
}

/* テーブルのレスポンシブ対応 */
/* テーブルコンテナの余白 */
.table-responsive {
	padding: 20px;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 12px;
	margin: 20px 0;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* 総勘定元帳画面専用のスタイル（table-responsiveと同じ見た目だがマージン調整） */
.general-ledger-container {
	padding: 10px; /* パディングをさらに削減 */
	background: rgba(255, 255, 255, 0.95); /* 背景を少し不透明に */
	border-radius: 8px; /* 角丸を小さく */
	margin: 0; /* マージンを完全に削除 */
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); /* 影を軽く */
}

/* 総勘定元帳画面内の要素間隔を調整 */
.general-ledger-container h5 {
	margin-bottom: 5px !important; /* 見出しの下マージンを大幅削減 */
}

.general-ledger-container .table {
	margin-bottom: 8px !important; /* テーブルの下マージンを大幅削減 */
}

.general-ledger-container .mb-4 {
	margin-bottom: 8px !important; /* ボタンエリアのマージンを大幅削減 */
}

/* 総勘定元帳画面のタブコンテンツのマージンを削減 */
.tab-content.mt-3 {
	margin-top: 0.5rem !important; /* mt-3のマージンを削減 */
}

/* 経費登録画面の見やすさ改善 */
.form-group {
	margin-bottom: 12px;
}

.form-group label {
	font-weight: 600;
	color: #333;
	margin-bottom: 4px;
	display: block;
	font-size: 0.85rem;
}

.form-control, .form-select {
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 6px 10px;
	font-size: 0.9rem;
}

.form-control:focus, .form-select:focus {
	border-color: #007bff;
	box-shadow: 0 0 0 0.1rem rgba(0, 123, 255, 0.15);
}

.form-text {
	color: #666;
	font-size: 0.8rem;
	margin-top: 3px;
}

.error {
	color: #dc3545;
	font-weight: 500;
	font-size: 0.8rem;
	margin-top: 3px;
}

/* レイアウトの調整 */
.row {
	margin-bottom: 8px;
}

.col-md-3, .col-md-4, .col-md-6 {
	padding: 0 8px;
}

/* 4列レイアウトの調整 */
.col-md-3 .form-group {
	margin-bottom: 10px;
}

/* 摘要フィールドの調整 */
.col-12 .form-group {
	margin-bottom: 15px;
}

/* ボタンの間隔調整 */
.btn + .btn {
	margin-left: 0.5rem;
}

/* アラートの間隔調整 */
.alert {
	margin-bottom: 1rem;
}

/* 統一されたメニューへ戻るボタンのスタイル */
.btn-back-to-menu {
	background: linear-gradient(135deg, #3b82f6, #1e40af); /* Blue gradient */
	border: none;
	color: #ffffff;
	padding: 10px 20px;
	border-radius: 8px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center; /* テキストの中央揃えを追加 */
	gap: 6px; /* gapを少し小さくして、テキストの中央寄りを調整 */
	font-weight: 500;
	transition: all 0.3s ease;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	min-width: 140px; /* ボタンの最小幅を設定 */
	text-align: center; /* テキストの中央揃えを追加 */
}

.btn-back-to-menu:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
	color: #ffffff;
	text-decoration: none;
}

.btn-back-to-menu i {
	font-size: 1.1em;
	flex-shrink: 0; /* アイコンのサイズを固定 */
}

/* 管理者メニューへ戻るボタンのスタイル */
.btn-back-to-admin-menu {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	color: #ffffff;
	padding: 10px 20px;
	border-radius: 8px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center; /* テキストの中央揃えを追加 */
	gap: 6px; /* gapを少し小さくして、テキストの中央寄りを調整 */
	font-weight: 500;
	transition: all 0.3s ease;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	min-width: 140px; /* ボタンの最小幅を設定 */
	text-align: center; /* テキストの中央揃えを追加 */
}

.btn-back-to-admin-menu:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
	color: #ffffff;
	text-decoration: none;
}

.btn-back-to-admin-menu i {
	font-size: 1.1em;
	flex-shrink: 0; /* アイコンのサイズを固定 */
}

/* 登録画面用のボタンスタイル */
/* 登録ボタンを中央に配置し、白抜き文字にする */
.btn-registration {
	background: #28a745 !important; /* 緑色の単色 */
	border: none !important;
	color: #ffffff !important; /* 白抜き文字 */
	padding: 10px 30px; /* 横のpaddingを増やして横長に */
	border-radius: 8px;
	font-weight: 500;
	transition: all 0.3s ease;
	box-shadow: 0 4px 16px rgba(40, 167, 69, 0.3);
	min-width: 160px; /* 最小幅を設定して横長に */
}

.btn-registration:hover {
	background: #218838 !important; /* ホバー時の少し暗い緑 */
	color: #ffffff !important; /* ホバー時も白抜き文字を維持 */
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(40, 167, 69, 0.4);
}

/* 一覧へ戻るボタンを白抜き文字にする */
.btn-back-to-list {
	background: #6c757d !important; /* グレーの単色 */
	border: none !important;
	color: #ffffff !important; /* 白抜き文字 */
	padding: 10px 20px;
	border-radius: 8px;
	font-weight: 500;
	transition: all 0.3s ease;
	box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
}

.btn-back-to-list:hover {
	background: #5a6268 !important; /* ホバー時の少し暗いグレー */
	color: #ffffff !important; /* ホバー時も白抜き文字を維持 */
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(108, 117, 125, 0.4);
}

/* タブナビゲーションのスタイル改善 - 背景に同化しないように */
.nav-tabs {
	border-bottom: 3px solid #dee2e6;
	background: #ffffff;
	border-radius: 8px 8px 0 0;
	padding: 15px 15px 0 15px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	margin-bottom: 0;
}

.nav-tabs .nav-item {
	margin-bottom: 0;
}

.nav-tabs .nav-link {
	color: #ffffff !important;
	background: #000080;
	border: 2px solid #000080;
	border-bottom: none;
	border-radius: 8px 8px 0 0;
	padding: 12px 24px;
	margin-right: 8px;
	font-weight: 500;
	transition: all 0.2s ease;
	position: relative;
}

.nav-tabs .nav-link:hover {
	background: #0000a0;
	border-color: #0000a0;
	color: #ffffff !important;
	transform: translateY(-1px);
}

.nav-tabs .nav-link.active {
	background: #ffffff !important;
	color: #000000 !important;
	border-color: #007bff;
	border-bottom: 3px solid #ffffff;
	font-weight: 600;
	box-shadow: 0 -2px 8px rgba(0, 123, 255, 0.2);
}

.nav-tabs .nav-link.active::after {
	content: '';
	position: absolute;
	bottom: -3px;
	left: 0;
	right: 0;
	height: 3px;
	background: #000080;
}

/* タブコンテンツエリアのスタイル */
.tab-content {
	background: #ffffff;
	border: 2px solid #dee2e6;
	border-top: none;
	border-radius: 0 0 8px 8px;
	padding: 25px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* タブ内のコンテンツスタイル */
.tab-pane {
	color: #000000;
}

.tab-pane h5 {
	color: #2c3e50;
	font-weight: 600;
	margin-bottom: 20px;
	border-bottom: 2px solid #dee2e6;
	padding-bottom: 10px;
}

/* モバイル対応のタブスタイル */
@media (max-width: 768px) {
	.nav-tabs {
		padding: 10px 10px 0 10px;
	}
	
	.nav-tabs .nav-link {
		padding: 10px 16px;
		font-size: 14px;
		margin-right: 5px;
	}
	
	.tab-content {
		padding: 20px;
	}
}

/* タブのアニメーション効果 */
.tab-pane.fade {
	transition: opacity 0.2s ease-in-out;
}

.tab-pane.fade.show {
	opacity: 1;
}

/* タブのフォーカス状態 */
.nav-tabs .nav-link:focus {
	outline: 3px solid #4a90e2;
	outline-offset: 2px;
}

/* タブの無効状態 */
.nav-tabs .nav-link:disabled {
	opacity: 0.6;
	cursor: not-allowed;
	background: #f8f9fa !important;
	color: #6c757d !important;
}

/* ファイル一覧画面専用のスタイル */
.file-reference-container .form-label {
	color: #ffffff !important;
	font-weight: 600;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
	margin-bottom: 8px;
	display: block;
}

/* ファイル一覧画面のフォーム要素の背景調整 */
.file-reference-container .form-control,
.file-reference-container .form-select {
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
	margin-bottom: 15px;
	vertical-align: middle;
}

.file-reference-container .form-control:focus,
.file-reference-container .form-select:focus {
	background: rgba(255, 255, 255, 1);
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

/* ファイル一覧画面のセレクトボックスの背景位置調整 */
.file-reference-container .form-select {
	background-position: right 12px center;
	padding-right: 40px;
}

/* ファイル一覧画面のボタンスタイル */
.file-reference-container .btn-primary {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
}

.file-reference-container .btn-primary:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

.file-reference-container .btn-secondary {
	background: linear-gradient(135deg, #6c757d, #5a6268);
	border: none;
	box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
	transition: all 0.3s ease;
}

.file-reference-container .btn-secondary:hover {
	background: linear-gradient(135deg, #5a6268, #495057);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(108, 117, 125, 0.4);
}

/* 経費参照画面専用のスタイル */
.expense-reference-container .form-label {
	color: #ffffff !important;
	font-weight: 600;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
	margin-bottom: 8px;
	display: block;
}

.expense-reference-container .form-control,
.expense-reference-container .form-select {
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
	margin-bottom: 15px;
	vertical-align: middle;
}

.expense-reference-container .form-control:focus,
.expense-reference-container .form-select:focus {
	background: rgba(255, 255, 255, 1);
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

.expense-reference-container .form-select {
	background-position: right 12px center;
	padding-right: 40px;
}

.expense-reference-container .btn-primary {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
}

.expense-reference-container .btn-primary:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

.expense-reference-container .btn-secondary {
	background: linear-gradient(135deg, #6c757d, #5a6268);
	border: none;
	box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
	transition: all 0.3s ease;
}

.expense-reference-container .btn-secondary:hover {
	background: linear-gradient(135deg, #5a6268, #495057);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(108, 117, 125, 0.4);
}

/* 収入参照画面専用のスタイル */
.income-reference-container .form-label {
	color: #ffffff !important;
	font-weight: 600;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
	margin-bottom: 8px;
	display: block;
}

.income-reference-container .form-control,
.income-reference-container .form-select {
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
	margin-bottom: 15px;
	vertical-align: middle;
}

.income-reference-container .form-control:focus,
.income-reference-container .form-select:focus {
	background: rgba(255, 255, 255, 1);
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

.income-reference-container .form-select {
	background-position: right 12px center;
	padding-right: 40px;
}

.income-reference-container .btn-primary {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
}

.income-reference-container .btn-primary:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

.income-reference-container .btn-secondary {
	background: linear-gradient(135deg, #6c757d, #5a6268);
	border: none;
	box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
	transition: all 0.3s ease;
}

.income-reference-container .btn-secondary:hover {
	background: linear-gradient(135deg, #5a6268, #495057);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(108, 117, 125, 0.4);
}

/* 振替参照画面用のスタイル */
.transfer-reference-container .form-label {
	color: white !important;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
	font-weight: 600;
}

.transfer-reference-container .form-control,
.transfer-reference-container .form-select {
	background: rgba(255, 255, 255, 0.9);
	border: 2px solid rgba(255, 255, 255, 0.3);
	color: #333;
	transition: all 0.3s ease;
}

.transfer-reference-container .form-control:focus,
.transfer-reference-container .form-select:focus {
	background: rgba(255, 255, 255, 0.95);
	border-color: rgba(59, 130, 246, 0.8);
	box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25);
}

.transfer-reference-container .form-select {
	/* ギザギザ線を削除 - デフォルトの矢印を使用 */
}

.transfer-reference-container .btn-primary {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
}

.transfer-reference-container .btn-primary:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

.transfer-reference-container .btn-secondary {
	background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
	border: none;
	color: white;
	font-weight: 600;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
}

.transfer-reference-container .btn-secondary:hover {
	background: linear-gradient(135deg, #5a6268 0%, #343a40 100%);
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* 振替取引一覧画面の縦方向配置の強制適用 */
.transfer-reference-container .col-md-2.d-flex.flex-column {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
}

.transfer-reference-container .col-md-2.d-flex.flex-column .form-label {
	margin-bottom: 0.5rem !important;
}

.transfer-reference-container .col-md-2.d-flex.flex-column .form-control,
.transfer-reference-container .col-md-2.d-flex.flex-column .form-select,
.transfer-reference-container .col-md-2.d-flex.flex-column .btn {
	margin-top: auto !important;
}

/* 帳簿管理系（総勘定元帳・仕訳帳）用のスタイル */
.book-management-container .form-label {
	color: white !important;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
	font-weight: 600;
}

.book-management-container .form-control,
.book-management-container .form-select {
	background: rgba(255, 255, 255, 0.95);
	border: 2px solid rgba(255, 255, 255, 0.3);
	color: #333;
	transition: all 0.3s ease;
}

.book-management-container .form-control:focus,
.book-management-container .form-select:focus {
	background: rgba(255, 255, 255, 1);
	border-color: rgba(59, 130, 246, 0.8);
	box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25);
}

.book-management-container .form-select {
	/* ギザギザ線を削除 - デフォルトの矢印を使用 */
}

.book-management-container .btn-primary {
	background: linear-gradient(135deg, #3b82f6, #1e40af);
	border: none;
	box-shadow: 0 4px 16px rgba(59, 130, 246, 0.3);
	transition: all 0.3s ease;
}

.book-management-container .btn-primary:hover {
	background: linear-gradient(135deg, #1e40af, #1e3a8a);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

.book-management-container .btn-secondary {
	background: linear-gradient(135deg, #6c757d, #5a6268);
	border: none;
	box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
	transition: all 0.3s ease;
}

.book-management-container .btn-secondary:hover {
	background: linear-gradient(135deg, #5a6268, #495057);
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(108, 117, 125, 0.4);
}

/* 強制的な縦方向配置の上書き */
.book-management-container .col-md-2.d-flex.flex-column {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
}

.book-management-container .col-md-2.d-flex.flex-column .form-label {
	margin-bottom: 0.5rem !important;
}

.book-management-container .col-md-2.d-flex.flex-column .form-control,
.book-management-container .col-md-2.d-flex.flex-column .form-select,
.book-management-container .col-md-2.d-flex.flex-column .btn {
	margin-top: auto !important;
}

/* 確定申告系画面用のスタイル */
.tax-declaration-container .form-label {
	color: #ffffff !important;
	font-weight: 600;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}

/* フォーム要素の高さを統一して段ずれを防止 */
.tax-declaration-container .form-select,
.tax-declaration-container .form-control {
	height: 38px !important;
	min-height: 38px !important;
}

.tax-declaration-container .d-flex.flex-column {
	min-height: 60px !important;
	align-items: center;
}

.tax-declaration-container .form-label {
	margin-bottom: 0.5rem;
	line-height: 1.2;
	height: 3.6rem;
	min-height: 3.6rem;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.tax-declaration-container .form-control,
.tax-declaration-container .form-select {
	/* デフォルトのスタイルを削除し、HTMLクラスを尊重 */
}

.tax-declaration-container .form-control:focus,
.tax-declaration-container .form-select:focus {
	/* デフォルトのスタイルを削除し、HTMLクラスを尊重 */
}

.tax-declaration-container .btn-primary {
	/* デフォルトのスタイルを削除し、HTMLクラスを尊重 */
}

.tax-declaration-container .btn-primary:hover {
	/* デフォルトのスタイルを削除し、HTMLクラスを尊重 */
}

.tax-declaration-container .btn-secondary {
	/* デフォルトのスタイルを削除し、HTMLクラスを尊重 */
}

.tax-declaration-container .btn-secondary:hover {
	/* デフォルトのスタイルを削除し、HTMLクラスを尊重 */
}

/* 所得金額表示用のスタイル */
.alert.alert-success {
	background: #d4edda;
	border: 1px solid #c3e6cb;
	color: #155724;
}

.alert.alert-danger {
	background: #f8d7da;
	border: 1px solid #f5c6cb;
	color: #721c24;
}

.alert.alert-info {
	background: #d1ecf1;
	border: 1px solid #bee5eb;
	color: #0c5460;
}

/* 所得金額の数値表示を強調 */
.alert h3,
.alert h4 {
	font-weight: 700;
	margin-bottom: 0;
}

.alert h6 {
	font-weight: 600;
	margin-bottom: 0.5rem;
	color: inherit;
}

/* ログイン画面用のスタイル */
/* ログイン画面の背景 */
body.login-page {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
				url('https://images.unsplash.com/photo-1554224155-6726b3ff858f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
}

body.login-page::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, 
		rgba(0, 0, 0, 0.8) 0%, 
		rgba(25, 55, 109, 0.6) 50%, 
		rgba(0, 0, 0, 0.8) 100%);
	z-index: 1;
}

body.login-page .container {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 550px;
	padding: 0 20px;
}

.login-card {
	background: rgba(0, 0, 0, 0.85);
	backdrop-filter: blur(20px);
	border-radius: 8px;
	padding: 60px 50px;
	width: 100%;
	border: 1px solid rgba(59, 130, 246, 0.2);
	box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(59, 130, 246, 0.1);
	animation: fadeInUp 0.8s ease-out;
	position: relative;
	overflow: hidden;
}

.login-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, #1e40af, #3b82f6, #1e40af);
	background-size: 200% 100%;
	animation: shimmer 2s infinite;
}

@keyframes shimmer {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.login-header {
	text-align: center;
	margin-bottom: 40px;
}

.login-logo {
	font-size: 48px;
	color: #3b82f6;
	margin-bottom: 20px;
	text-shadow: 0 0 20px rgba(59, 130, 246, 0.5);
}

.login-title {
	color: #ffffff;
	font-weight: 700;
	font-size: 32px;
	margin-bottom: 8px;
	letter-spacing: -0.5px;
}

.login-subtitle {
	color: #93c5fd;
	font-size: 16px;
	font-weight: 400;
}

.login-card .form-group {
	margin-bottom: 24px;
	position: relative;
}

/* 最高詳細度でBootstrapを上書き */
body.login-page .container .login-card .form-group input.form-control {
	background: rgba(30, 58, 138, 0.7) !important;
	border: 1px solid rgba(59, 130, 246, 0.2) !important;
	border-radius: 4px !important;
	padding: 16px 20px !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	width: 100% !important;
	transition: all 0.3s ease !important;
	box-shadow: none !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

/* フォーカス時も最高詳細度で上書き */
body.login-page .container .login-card .form-group input.form-control:focus {
	outline: none !important;
	background: rgba(30, 58, 138, 0.9) !important;
	border-color: #3b82f6 !important;
	box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2) !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

/* ブラウザの自動補完機能対策 */
body.login-page .container .login-card .form-group input.form-control:-webkit-autofill,
body.login-page .container .login-card .form-group input.form-control:-webkit-autofill:hover,
body.login-page .container .login-card .form-group input.form-control:-webkit-autofill:focus,
body.login-page .container .login-card .form-group input.form-control:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 1000px rgba(30, 58, 138, 0.7) inset !important;
	-webkit-text-fill-color: #ffffff !important;
	background-color: rgba(30, 58, 138, 0.7) !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	transition: background-color 5000s ease-in-out 0s !important;
}

/* プレースホルダーも最高詳細度で上書き */
body.login-page .container .login-card .form-group input.form-control::placeholder {
	color: #ffffff !important;
}

.login-card .form-label {
	position: absolute;
	left: 20px;
	top: 16px;
	color: #6b7280;
	font-size: 16px;
	transition: all 0.3s ease;
	pointer-events: none;
	background: transparent;
	padding: 0 4px;
}

.login-card .form-control:focus ~ .form-label,
.login-card .form-control:not(:placeholder-shown) ~ .form-label {
	top: -8px;
	left: 16px;
	font-size: 12px;
	color: #60a5fa;
	background: rgba(0, 0, 0, 0.9);
}

.btn-login {
	background: #3b82f6;
	border: none;
	border-radius: 4px;
	padding: 16px;
	font-size: 16px;
	font-weight: 600;
	width: 100%;
	color: #ffffff;
	cursor: pointer;
	transition: all 0.3s ease;
	margin-bottom: 24px;
	position: relative;
	overflow: hidden;
}

.btn-login:hover {
	background: #1e40af;
	transform: translateY(-1px);
	box-shadow: 0 10px 25px rgba(59, 130, 246, 0.4);
}

.btn-login:active {
	transform: translateY(0);
}

.signup-link {
	text-align: center;
	color: #93c5fd;
	font-size: 14px;
}

.signup-link a {
	color: #3b82f6;
	text-decoration: none;
	font-weight: 500;
	transition: color 0.3s ease;
}

.signup-link a:hover {
	color: #1e40af;
}

.login-card .alert {
	border-radius: 4px;
	border: none;
	margin-bottom: 24px;
	padding: 16px 20px;
	font-size: 14px;
	position: relative;
}

.login-card .alert-danger {
	background: rgba(239, 68, 68, 0.1);
	color: #fca5a5;
	border: 1px solid rgba(239, 68, 68, 0.3);
}

.login-card .alert-success {
	background: rgba(34, 197, 94, 0.1);
	color: #86efac;
	border: 1px solid rgba(34, 197, 94, 0.3);
}

.login-card .alert-info {
	background: rgba(59, 130, 246, 0.1);
	color: #93c5fd;
	border: 1px solid rgba(59, 130, 246, 0.3);
}

.login-card .alert i {
	margin-right: 8px;
}

/* ログイン画面のレスポンシブ対応 */
@media (max-width: 480px) {
	.login-card {
		padding: 40px 30px;
	}
	
	.login-title {
		font-size: 28px;
	}
	
	.login-logo {
		font-size: 40px;
	}
}

/* ログイン画面のアニメーション効果 */
.login-card .form-group {
	animation: fadeInUp 0.8s ease-out;
	animation-fill-mode: both;
}

.login-card .form-group:nth-child(1) { animation-delay: 0.1s; }
.login-card .form-group:nth-child(2) { animation-delay: 0.2s; }
.login-card .btn-login { animation-delay: 0.3s; }
.login-card .signup-link { animation-delay: 0.4s; }

/* ログイン画面のフォーカス時のラベルアニメーション */
.login-card .form-control:focus ~ .form-label {
	animation: labelFloat 0.3s ease-out;
}

@keyframes labelFloat {
	0% {
		transform: translateY(0) scale(1);
	}
	50% {
		transform: translateY(-2px) scale(1.05);
	}
	100% {
		transform: translateY(-8px) scale(1);
	}
}

/* 確定申告系画面のラベルスタイルを強制適用 */
.tax-declaration-container .form-label.fw-bold.text-dark {
	color: #212529 !important;
	font-weight: 700 !important;
	text-shadow: none !important;
}

.tax-declaration-container .form-control.border-primary {
	border-color: #0d6efd !important;
}

.tax-declaration-container .form-select.border-primary {
	border-color: #0d6efd !important;
}

/* サインアップ画面用のスタイル */
.signup-card {
	background: rgba(0, 0, 0, 0.85);
	backdrop-filter: blur(20px);
	border-radius: 8px;
	padding: 50px 50px;
	width: 100%;
	border: 1px solid rgba(34, 197, 94, 0.2);
	box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(34, 197, 94, 0.1);
	animation: fadeInUp 0.8s ease-out;
	position: relative;
	overflow: hidden;
}

.signup-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, #16a34a, #22c55e, #16a34a);
	background-size: 200% 100%;
	animation: shimmer 2s infinite;
}

.signup-header {
	text-align: center;
	margin-bottom: 35px;
}

.signup-logo {
	font-size: 48px;
	color: #22c55e;
	margin-bottom: 20px;
	text-shadow: 0 0 20px rgba(34, 197, 94, 0.5);
}

.signup-title {
	color: #ffffff;
	font-weight: 700;
	font-size: 28px;
	margin-bottom: 0;
	letter-spacing: -0.5px;
}

.signup-card .form-group {
	margin-bottom: 24px;
	position: relative;
}

/* サインアップ画面のフォーム入力欄 */
body.login-page .container .signup-card .form-group input.form-control {
	background: rgba(20, 83, 45, 0.7) !important;
	border: 1px solid rgba(34, 197, 94, 0.2) !important;
	border-radius: 4px !important;
	padding: 16px 20px !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	width: 100% !important;
	transition: all 0.3s ease !important;
	box-shadow: none !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

body.login-page .container .signup-card .form-group input.form-control:focus {
	outline: none !important;
	background: rgba(20, 83, 45, 0.9) !important;
	border-color: #22c55e !important;
	box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.2) !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

body.login-page .container .signup-card .form-group input.form-control:-webkit-autofill,
body.login-page .container .signup-card .form-group input.form-control:-webkit-autofill:hover,
body.login-page .container .signup-card .form-group input.form-control:-webkit-autofill:focus,
body.login-page .container .signup-card .form-group input.form-control:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 1000px rgba(20, 83, 45, 0.7) inset !important;
	-webkit-text-fill-color: #ffffff !important;
	background-color: rgba(20, 83, 45, 0.7) !important;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	transition: background-color 5000s ease-in-out 0s !important;
}

body.login-page .container .signup-card .form-group input.form-control::placeholder {
	color: #ffffff !important;
}

.signup-card .form-label {
	position: absolute;
	left: 20px;
	top: 16px;
	color: #6b7280;
	font-size: 16px;
	transition: all 0.3s ease;
	pointer-events: none;
	background: transparent;
	padding: 0 4px;
}

.signup-card .form-control:focus ~ .form-label,
.signup-card .form-control:not(:placeholder-shown) ~ .form-label {
	top: -8px;
	left: 16px;
	font-size: 12px;
	color: #4ade80;
	background: rgba(0, 0, 0, 0.9);
}

.btn-signup {
	background: #22c55e;
	border: none;
	border-radius: 4px;
	padding: 16px;
	font-size: 16px;
	font-weight: 600;
	width: 100%;
	color: #ffffff;
	cursor: pointer;
	transition: all 0.3s ease;
	margin-bottom: 24px;
	position: relative;
	overflow: hidden;
}

.btn-signup:hover {
	background: #16a34a;
	transform: translateY(-1px);
	box-shadow: 0 10px 25px rgba(34, 197, 94, 0.4);
}

.btn-signup:active {
	transform: translateY(0);
}

.login-link {
	text-align: center;
	color: #93c5fd;
	font-size: 14px;
}

.login-link a {
	color: #22c55e;
	text-decoration: none;
	font-weight: 500;
	transition: color 0.3s ease;
}

.login-link a:hover {
	color: #16a34a;
}

.signup-card .alert {
	border-radius: 4px;
	border: none;
	margin-bottom: 24px;
	padding: 16px 20px;
	font-size: 14px;
	position: relative;
}

.signup-card .alert-danger {
	background: rgba(239, 68, 68, 0.1);
	color: #fca5a5;
	border: 1px solid rgba(239, 68, 68, 0.3);
}

.signup-card .alert-info {
	background: rgba(34, 197, 94, 0.1);
	color: #86efac;
	border: 1px solid rgba(34, 197, 94, 0.3);
}

.signup-card .alert i {
	margin-right: 8px;
}

/* サインアップ画面のレスポンシブ対応 */
@media (max-width: 480px) {
	.signup-card {
		padding: 40px 30px;
	}
	
	.signup-title {
		font-size: 24px;
	}
	
	.signup-logo {
		font-size: 40px;
	}
}