﻿body {
	/*アプリケーション共通の背景色*/
	/*background-color: #FAFAFA;*/
	background-color: #FFF;
	/*アプリケーション共通のパディング*/
	padding: 10px;
}

a { text-decoration: none; }
a:hover { text-decoration: underline; }
/*a:link { color:#545454 }
a:visited { color:#545454 }*/

/*ページトップへ移動するボタン*/
.pagetop {
  cursor: pointer;
  position: fixed;
  right: 30px;
  bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  transition: .3s;
  /*color: #00A6C4;*/
  color: #000;
  /*background: #eee;*/
  background: #fff;
  opacity: 80%;
  z-index: 2;
  box-shadow: 0 0 10px grey;
}
.pagetop:hover {
    /*box-shadow: 0 0 10px #00A6C4;*/
	box-shadow: 0 0 10px grey;
}

/* bootstrap上書き */
.table thead th   { 
    text-align: center; 
    vertical-align: middle; 
    /*background-color:#0094dd;
	color:#fff;*/
}
.table th,
.table td {
	/*padding: 0.3rem;
	vertical-align:unset;
	text-align:center;*/
}
.table-sm td, 
.table-sm th {
	/*padding: 0.25em;
	font-size:0.9em;*/
}
.btn-xs {
	padding:1px 5px;
	font-size:12px;
	line-height:1.5;
	border-radius:3px;
	margin-top:-3px;
}
.btn-light {
	/*border:1px solid #5a6268 !important;*/
}
.alert-right {
	border:1px solid #5a6268 !important;
}
.btn-primary>a {
	color:#fff;
}
.btn-light>a {
	color:#212529;
}
.row {
	margin-left: unset;
	margin-right:unset;
}
.form-label {
	margin-bottom: unset;
}
.nav-item>a,
.nav-link>a {
	color:#212529;
	text-decoration:none;
}
.dropdown-item:active {
	color:#212529;
	background-color:transparent!important;
}
.dropdown-item>a {
	color:#212529;
	text-decoration:none;
	display:block;
}
.w-10 {width:10%!important;}
.w-15 {width:15%!important;}
.w-20 {width:20%!important;}
.w-30 {width:30%!important;}
.w-40 {width:40%!important;}
.w-60 {width:60%!important;}
.w-70 {width:70%!important;}
.w-80 {width:80%!important;}
.w-90 {width:90%!important;}

.w-2em  {width: 2em!important;}
.w-3em  {width: 3em!important;}
.w-4em  {width: 4em!important;}
.w-5em  {width: 5em!important;}
.w-6em  {width: 6em!important;}
.w-8em  {width: 8em!important;}
.w-10em {width:10em!important;}
.w-12em {width:12em!important;}
.w-14em {width:14em!important;}
.w-16em {width:16em!important;}
.w-18em {width:18em!important;}
.w-20em {width:20em!important;}
.w-22em {width:22em!important;}
.w-24em {width:24em!important;}

/* bootstrap 拡張 */
.color-danger { color: #dc3545; }
.bg-danger { background-color: #dc3545; }

/* react-icons上書き */
i.fas,
i.far {
	margin-right:0.25rem!important;
}

/* Material-UI上書き */
button {
	box-shadow:none !important;
}

/* IMEモード */
.ime-on   {ime-mode:active;}
.ime-off  {ime-mode:inactive;}
.ime-none {ime-mode:disabled;}

/* ヘッダ固定テーブルスクロール */
/* テーブルのラッパー */
/*div.sticky-table-wrapper {
    overflow: scroll;
    height: 59vh;*/ /* JS でウィンドウスクロールが出ないよう調整しています。 */
/*}*/ /*★このスタイルは各コンポーネントのstyled-componentにて設定します。※高さをコンポーネントごとに調整するため★*/
table.sticky-table thead th {
    /* 縦スクロール時に固定する */
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    /* tbody内のセルより手前に表示する */
    z-index: 3;
	/*セル色をつける*/
	background-color: #fff;
}

/* その他 */
input[type="number"] {
	text-align:right;
}
.table input[type=checkbox]{
	margin-left:1em;
	margin-right:1em;
}
.table td.edit-btn {
	width:5em;
}

/* 検索用inputのラベル や checkboxのラベル */
label.label-sm {
	font-size: 0.9em;
    margin-bottom:0rem;
}

label.label-inline {
	width: auto;
	padding-top:0.2em;
	padding-left:0.2em;
	padding-right:0.2em;
}

/* 日付コントロール */
input[type=date] {
    width: 9.5em;
	text-align: center!important;
	/*padding: 0.5em 0!important;*/
}
input[type=date]::-webkit-date-and-time-value {
	margin-right: 1px;
}

/* 入力フォームのラベル */
div.form-label {
	text-align: right;
    padding-top: 0.3em;
    font-size: 0.9em;
	font-weight:bold;
}

/*編集中のアラート表示*/
div.editing-info {

	/* class='alert'の設定 */
	position: relative;
    padding: 0.5rem 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;

	/* class='alert-warning'の色*/
	color: #664d03;
    background-color: #fff3cd;
    border-color: #ffecb5;

	margin-bottom:0.25em;
}

/*編集モードチェック*/
div.editing-check {
	padding-left: 1rem;
}

/*必須入力項目*/
input.required,
select.required,
textarea.required,
div.required {
    /*danger color*/
	background-color: #f8d7da;
    border-color: #f5c2c7;
	/*warning color*/
	/*background-color: #fff3cd;
    border-color: #ffecb5;*/
}

.alert.sticky {
/* 縦スクロール時に固定する */
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 11;
}

/*フローティング表示する利用者情報*/
/*.user-info-floating {
	position: fixed;
    right: 30px;
    top: 2%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15em;
    height: 50px;
    border-radius: 5%;
    transition: .3s;
    color: #00A6C4;
    color: #084298;
    background-color: #cfe2ff;
    border-color: #b6d4fe;
    opacity: 80%;
    z-index: 2;
}*/

/* テーブルのヘッダ */
table.table thead > tr > th {
	background-color: #cfe2ff;
}

/* 編集中の行の背景色 */
tr.editing th,
tr.editing td {
	background-color: #fff3cd
}



