/*style.css p321*/


input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }

input {
  background-color: transparent;
}


* {
  font-family: Arial, Helvetica, sans-serif;
}

body {
    overflow: hidden;
}


.headder {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #4196e1;
  width: 100%;
  height: 50px;
  margin: 0;
}

.headder1 {
  flex: 1;
  margin: 0 20px 0 20px;
}

.headder1 h1 {
  margin: 0;
}

.headder1 a {
  color: #fff;
  text-decoration: none;
  font-size: 20px;
}

.headder2 {
  display: flex;
  flex-direction: column;
  margin: 0 20px 0 20px;
}

.headder2 span {
  font-size: 12px;
  color: #fff;
}

.headder3 {
  flex-shrink: 0;
  margin: 0 20px 0 20px;
}

.headder3 a {
  color: #ffff00;
  text-decoration: none;
  font-size: 12px;
}

h2 {
  font-size: 12px;
}


.user-menu-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
	width: 100%;
	height: 50px;
	background-color: #ffffff;
}

.user-info {
  text-align: left;
  width: 15%;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.user-info p {
  height: 25px;
  margin: 0;
  line-height: 25px;
}

.menu-sections {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 85%;
}

.menu-section {
  margin: 5px;
  font-size: 12px;
  flex: 1 0 100px;
  display: flex;
  flex-direction: column;
}

.menu-section detales {
  flex: 1 0 auto;
  width: 100%;
}

.menu-section summary {
  background-color: #ffffff;
  cursor: pointer;
  display: block;
}

.menu-section ul {
  margin-top: 5px;
  list-style-type: none;
  padding: 0;
}

/*↑追加*/

ul.error_list{
	border: 1px solid #FF0000;
	background-color: #FFCCCC;
	padding-top: 10px;
	padding-bottom: 10px;
}

ul.error_list li{
	color:#FF0000;
}

ul.status_list{
	border: 1px solid #0000FF;
	background-color: #00FFFF;
	padding-top: 10px;
	padding-bottom: 10px;
}

ul.status_list li{
	color:#0000FF;
}




div.menu_table-container {
  display: grid;
  grid-template-columns: 10% 90%; /* menu_projectとmenu_jobの幅を指定 */
  width: 70%;
}

table.menu_project,
table.menu_job {
	border-collapse: collapse;
	margin: 5px;
}


table.menu_project th,
table.menu_project td,
table.menu_job th,
table.menu_job td  {
	border: 1px #c0c0c0 solid;
	font-size: 9px;
}

/*日程管理 table menu_project*/

table.menu_project select,
table.menu_project button {
    width: 100%;
    font-size: 9px;
}

button {
  padding: 3px 3px; /* ボタンの内側の余白 */
  background-color: #c0c0c0; /* ボタンの背景色 */
  color: black; /* ボタンのテキスト色 */
  border: none; /* ボタンのボーダー */
  cursor: pointer; /* カーソルのスタイル */
}

button:hover {
  background-color: #0000ff; /* ボタンにカーソルが乗ったときの背景色 */
  color: #ffffff;
}

/*日程管理 table menu_job*/

table.menu_job td {
    width: 10%;
    font-size: 9px;
}

table.menu_job select {
    width: 100%;
    font-size: 9px;
}




/*日程管理用テーブル*/

.list_table-container {
	position: relative; /* コンテナを相対的な位置に配置 */
  width: 100%; /* コンテナの幅 */
  height: calc(100vh - 265px);
}

.list_table-control {
  display: flex; /* 水平方向にテーブルを配置 */
  flex-direction: row; /* 横並びにする */
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.task_area {
  flex: 0 0 auto;
  overflow-x: hidden;
  overflow-y: auto;
  height: calc(100% - 17px);
  margin-right: 5px;
  margin-top: 0.5px;

}

/* Chrome、Safari、Opera用 */
.task_area::-webkit-scrollbar {
  display: none;
}

/* IE、Edgeなど一部ブラウザ用 */
.task_area {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.job_area {
  flex: 1 1 auto; /* job_areaは残りのスペースを使う */
  overflow-x: scroll; /* 横スクロールを有効にする */
  overflow-y: auto;
  height: 100%;
  margin-left: 5px;
}


.task_list {
  table-layout: fixed;
  width: 615px;
}

.job_list {
  table-layout: fixed;
  width: 500px;
}

thead {
  position: sticky;
  top: 0;
  left: 0;
}

.task_list,
.job_list {
	border-collapse: separate;
	border-spacing: 0;
}

table.task_list th,
table.job_list th {
	border-right: 1px #c0c0c0 solid;
	border-bottom: 1px #c0c0c0 solid;
	height: 20px;
	font-size: 9px;
	background-color: #ffffff;
}

table.task_list td,
table.job_list td  {
	border-right: 1px #c0c0c0 solid;
	border-bottom: 1px #c0c0c0 solid;
	height: 15px;
	font-size: 9px;
}

/* 行の最初のセルに対して左側の罫線を追加 */
table.task_list th:first-child,
table.job_list th:first-child,
table.task_list td:first-child,
table.job_list td:first-child {
	border-left: 1px solid #c0c0c0;
}

.task_list input,
.job_list input {
  border: none;
}

.list_no { width: 3%; }
.list_project { width: 11%; }
.list_factory { width: 11%; }
.list_line { width: 11%; }
.list_process { width: 11%; }
.list_machine { width: 11%; }
.list_model { width: 13%; }
.list_spec { width: 13%; }
.list_note { width: 16%; }

/*.job_operator { width: 40px; }
.job_note { width: 80px; }
.job_date { width: 55px; }
.job_dead { width: 50px; }*/

.job_operator { width: 60px; }
.job_note { width: 80px; }
.job_plan_start { width: 55px; }
.job_result_start { width: 55px; }
.job_plan_complete { width: 55px; }
.job_result_complete { width: 55px; }
.job_deadline_job_name { width: 60px; }
.job_plan_deadline { width: 55px; }
.job_result_deadline { width: 55px; }

.task_list input,
.task_list select,
.job_list input,
.job_list select {
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	font-size: 9px;
}

.job_date input[type="text"]  {
  width: 100%;
}

.job_date input[type="date"] {
  width: 100%;
}

.job_date input[type="search"] {
  width: 100%;
}

.overflow-visible {
  white-space: nowrap; /* テキストを折り返さないようにする */
  overflow: visible; /* ボックスからはみ出てもテキストを表示する */
}













/*カスタムメニュー*/
.custom-menu {
  background-color: #f1f1f1; /* 背景色を指定 */
  font-size: 14px; /* フォントサイズを指定 */
  /* 他のスタイルプロパティを追加 */
}

.custom-menu li {
  padding: 8px 12px; /* メニューアイテムの余白を指定 */
  /* 他のスタイルプロパティを追加 */
}

.custom-menu li:hover {
  background-color: #ddd; /* メニューアイテムのホバー時の背景色を指定 */
  /* 他のスタイルプロパティを追加 */
}


/*カレンダー見栄え*/
.ui-datepicker-current {
    display: none;	/*Todayボタン非表示*/
}

</style>