/** ■■■ 検索 ■■■ **/
/** 期間指定INPUTの幅 **/
#term_start, #term_end {
	width: 15ch;
}

.selectable.unselected {
	filter: grayscale(100%);
	opacity: 0.5;
}
.AGERATING {
	display: none;
}
.AGERATING.on {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}
#MEMOPTIONS {
	display: flex;
	align-items: center;
	justify-content: start;
	flex-wrap: wrap;
	padding: 0.5em;
}
[id^="ACOPTIONS_"] {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.aC-child {
flex-grow: 1;
text-align: center;
}
.aC-child .ABTN {
	width: 100%;
	box-sizing: border-box;
}




/** ローディングスピナー **/
.spinner {
	border: 16px solid #f3f3f3;
	border-top: 16px solid #3498db;
	border-radius: 50%;
	width: 120px;
	height: 120px;
	animation: spin 2s linear infinite;
	display: none;
}
.spinner--global {
	position: fixed; inset: 0; display: grid; place-items: center;
	z-index: 9999; background: rgba(255,255,255,0.0);
}
.spinner--global::before {
	content: ""; width: 48px; height: 48px;
	border: 4px solid #cbd5e1; border-top-color: #0ea5e9;
	border-radius: 50%; animation: spin .8s linear infinite;
}
/* 基本変数 */
:root{
	--sf-height: auto;         /* 固定時の高さはコンテンツに任せる */
	--sf-bg: #fff;
	--sf-border: 1px solid #ddd;
	--sf-padding: 12px;
	--sf-gap: 12px;
	--sf-col1: 300px; /* ← ここで col1 の幅を統一。調整してください */
}


/* フォーム本体：デスクトップ時は左 (オプション群) と右 (submit) をグリッドで分ける */
.search_footer {
	box-sizing: border-box;
	width: 100%;
	background: var(--sf-bg);
	border-top: var(--sf-border);
	padding: var(--sf-padding);
	display: grid;
	grid-template-columns: 1fr 200px; /* 右列は submit の領域を確保 */
	gap: var(--sf-gap);
	align-items: stretch;
	column-gap: 20px;
}

/* 左側：3行を縦に並べる（各行は横に3分割） */
.sf_left {
	display: grid;
	grid-auto-rows: min-content;
	gap: 8px;
}

/* 各行：折り返さない、最小幅で収める */
.fs_opt_row {
	display: grid;
	grid-template-columns: var(--sf-col1) auto 1fr;
	column-gap: 8px;
	align-items: center;
	white-space: nowrap;      /* デスクトップでは折り返し禁止 */
	min-width: 0;
	font-size: 0.8em;
	line-height: 1em;
}

/* 列ごとの幅調整 */
.fs_opt_col.col1 { flex: 0 0 auto; /* 内容幅 */ max-width: 20%; }
.fs_opt_col.col2 { flex: 0 0 auto; /* ラジオ等 */ padding: 0 6px; }
.fs_opt_col.col3 { flex: 1 1 auto;  /* 右寄せの説明など */ min-width: 0; }
.fs_opt_col.col1 {
	white-space: nowrap;
}

.fs_opt_col.col2 {
	justify-self: start; /* ラジオボタンを左寄せ */
}

.fs_opt_col.col3 {
	min-width: 0;
}

/* 右側 submit は縦に3行を跨ぐイメージ（gridで中央寄せ） */
.sf_right {
	display: flex;
	align-items: center;
	justify-content: center;
}

/* submit ボタン：可能な限り幅を確保 */
.sf_submit {
	width: 100%;
	max-width: 260px;
}

/* 固定表示モード（NT_01V が Disp on のときに追加する class: fixed_on） */
.search_footer.fixed_on {
	position: sticky;
	bottom: -5px;
	z-index: 110;        /* #FOOTER が 100 の想定 */
	/* 幅を中央に寄せたいなら max-width と margin 指定 */
	margin-left: auto;
	margin-right: auto;
  }