body {
	font-family: "游ゴシック", "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.title {
	font-family: "游明朝", "YuMincho", "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.topnote{
	font-family: "游ゴシック", "Hiragino Sans W3" !important;
}

input{
	border-width: 1px;
}

input.long {
	width: 7em;
}

input.middle {
	width: 5.5em;
}
input.short {
	width: 3.5em;
}

input.price {
	width: 6em;
}

select {
	height: 1.8em;
}

table.srch {
	height: 12.5em;
}
/* ------ 検索条件テーブルTD共通 ------ */

table.srch td{

	vertical-align: middle;
	font-size:0.8em;
	padding: 0px !important;
	font-weight: bold;
	background-color:transparent !important;
}
/*
table.srch td{
	background: #ffffff;
}
 */
table.result {
	height: 155px;
}

.product-image {
	width: 135px;
	height: 154px;
	object-fit: contain
}

/**/
tr {
	height: 22px;
}
/**/
.h22{
	height: 22px;
}
button {
	height: 2.5em;
}

button.file-output {
	width: 9em;
}

button.btn-link {
	height: auto;
}

#table_notes {
	width: 400px;
}

.separate-space {
	width: 15px;
}

tr.top_button_area {
	height: 5.4em;
}

#product-name {
	width: 225px;
}

/* 列幅 */
	.c1 {
		width: 135px;
	}

	.c2 {
		width: 225px;
	}

	.c3 {
		/*width: 195px; 出品者*/
		width: 145px;
	}

	.c4 {
		/* width: 325px; 最安値種別*/
		width: 295px;
	}

	.c5 {
		/*width: 210px; 価格変動*/
		width: 130px;
	}

	.c6 {
		/*width: 222px; 販売数　等*/
		width: 174px;
	}

	.c7 {
		/*手数料*/
		width: 162px;

	}

	.c8 {
		/*width: 196px; ネット最安値*/
		width: 140px;
	}

	.c9 {
		/*min-width: 185px; JAN価格表*/
		min-width: 155px;
	}

	.c10 {
		/*width: 204px; 利益*/
		width: 172px;
	}

	.c11 {
	width: 385px;
	}

	.c12 {
	width: 160px;
	}

/*-------------------
	クルクル
 -------------------*/
#overlay_top{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height:100%;
	display: none;
	background: rgba(0,0,0,0.6);
}
#overlay{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height:100%;
	display: none;
	background: rgba(0,0,0,0.6);
}
.cv-spinner {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.spinner {
	width: 80px;
	height: 80px;
	border: 4px #ddd solid;
	border-top: 4px #999 solid;
	border-radius: 50%;
	animation: sp-anime 0.8s infinite linear;
}
@keyframes sp-anime {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(359deg); }
}

#spinner1{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1234;
	width: 100%;
	height:100%;
	display: none;
	background: rgba(0,0,0,0.6);
}
/*@@@ 20241226 */
#spinner {
	display: none; /* 初期状態は非表示 */
	position: fixed;
	top: 50%; /* 画面の中央に配置 */
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 9999; /* 最前面に表示 */
	pointer-events: none; /* クリック操作をスピナーが妨げない */
}

#cursor-spinner {
	position: fixed;
	top: 50%;        /* 画面の垂直中央 */
	left: 50%;       /* 画面の水平中央 */
	transform: translate(-50%, -50%); /* 要素の中心を基準に配置 */
	pointer-events: none;
	z-index: 9999;
	display: none;
}

.spinner-border {
	width: 80px;
	height: 80px;
	border: 0.7em solid rgba(0, 0, 0, 0.1);
	border-top-color: #007bff;
	border-radius: 50%;
	animation: spinner-border 0.75s linear infinite;
}

@keyframes spinner-border {
	100% {
		transform: rotate(360deg);
	}
}
/*-----赤オレンジの文字色----------------*/
.wm-danger{
	color:#ff3300;
}

/*---- numberの上下矢印をけしたい----*/
.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
	-moz-appearance:textfield !important;
}
/*-----フォーカス時の自動枠線を無効にする------*/
:focus {
	outline: none;
}

/* @@@20241105 */
.tooltip-inner {
	text-align: left; /* ツールチップのテキストを左寄せにする */
	color: #fff ;
	max-width: 220px;
}
/* ボタン自体にはスタイルを適用しない */
.custom-tooltip {
	position: relative; /* ツールチップを相対的に配置するために必要 */
}

/* ツールチップの共通スタイル */
.custom-tooltip .custom-tooltip-text {
	visibility: hidden;
	width: 240px;
	background-color: #333;
	color: #fff;
	font-size: 0.8em;
	text-align: center;
	border-radius: 5px;
	padding: 5px;
	position: absolute;
	z-index: 1;
	bottom: 125%; /* ツールチップの位置調整（ボタンの上に表示） */
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

/* ツールチップの矢印 */
.custom-tooltip .custom-tooltip-text::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #333 transparent transparent transparent;
}

/* ホバー時のツールチップ表示 */
.custom-tooltip:hover .custom-tooltip-text {
	visibility: visible;
	opacity: 1;
}