:root {
    --blue:#5d78ff;
    --indigo:#6610f2;
    --purple:#6f42c1;
    --purple-light:#646c9a;
    --pink:#e83e8c;
    --red:#fb5858;
    --orange:#fd7e14;
    --yellow:#ffc107;
    --green:#28a745;
    --teal:#20c997;
    --cyan:#17a2b8;
    --white:#fff;
    --black: #48465b;
    --gray: #f6f6f9;
    --gray-dark:#343a40;
    --primary:#5867dd;
    --secondary:#e1e1ef;
    --success:#1dc9b7;
    --info: #555d86;
    --warning:#ffb822;
    --danger:#fd397a;
    --light:#f8f9fa;
    --dark:#343a40;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    -webkit-print-color-adjust: exact;
}

/* メインカラー背景 */
.main_color_bg {
	background: var(--main-color) !important;
	color: var(--main-font-color) !important;
}

/* サブカラー背景 */
.sub_color_bg {
	background: var(--sub-color) !important;
	color: var(--sub-font-color) !important;
}

/* 管理メインカラー背景 */
.manage_main_color_bg {
	background: var(--manage-main-color) !important;
	color: var(--manage-main-font-color) !important;
}

/* 管理サブカラー背景 */
.manage_sub_color_bg {
	background: var(--manage-sub-color) !important;
	color: var(--manage-sub-font-color) !important;
}

/* プレースホルダー */
.form-control::placeholder {
	color: #BBBBBB;
	font-size: 0.9rem;
}

.btn-blue {
    color: var(--light) !important;
    background-color: var(--blue) !important;
    border-color: var(--blue) !important;
}
.btn-blue:hover {
    color: var(--light) !important;
    background-color: #3758ff !important;
    border-color: #2a4eff !important;
}

.required:before {
  content: "*";
  font-weight: bold;
  color: var(--red);
}

.completeMessageBox {
  max-width: 600px;
  width: 90%;
  margin: 20px auto 0px auto;
  border: 1px solid #2a4eff;
  text-align: center;
  color: var(--blue);
  padding: 5px 10px;
  background-color: var(--white);
}

.completeMessageBox ul {
  margin-top: 10px;
  margin-bottom: 10px;
  list-style: none;
  padding: 0px;
}

.completeMessageBox ul li {
  color: #2a4eff;
}

.errorMessageBox {
  max-width: 1000px;
  width: 90%;
  margin: 20px auto 0px auto;
  border: 1px solid var(--red);
  text-align: center;
  color: var(--red);
  padding: 15px 10px;
  background-color: var(--white);
}

.errorMessageBox ul {
  list-style: none;
}

.errorMessageBox ul li {
  color: var(--red);
}
  
.class-sunday {
  color: red !important;
}
.class-saturday {
  color: blue !important;
}

/* IME-ON */
.ime-on {
	ime-mode: active;
}

/* IME-OFF */
.ime-off {
	ime-mode: inactive;
}

.number_value {
  text-align : right;
}

/* loading */
.loading {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  z-index: 2000;
  text-align: center;
  background-color: rgba(209, 209, 209, 0.562);
  display: none;
}

.loading_item {
  position: absolute;
  top: 20%;
}

/* loading-text */
.runtime_text {
  margin: 10px auto;
  text-align: center;
  color: #333;
  font-weight: bold;
  font-size: 20px !important;
}

/* loading-image */
.spinner {
  margin: 100px auto;
  width: 80px;
  height: 40px;
  position: relative;
}

.cube1, .cube2 {
  background-color: var(--main-color) !important;
  width: 15px;
  height: 15px;
  position: absolute;
  top: 0;
  left: 0;

  -webkit-animation: sk-cubemove 1.8s infinite ease-in-out;
  animation: sk-cubemove 1.8s infinite ease-in-out;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.cube2 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

@-webkit-keyframes sk-cubemove {
  25% { -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5) }
  50% { -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg) }
  75% { -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5) }
  100% { -webkit-transform: rotate(-360deg) }
}

@keyframes sk-cubemove {
  25% { 
    transform: translateX(42px) rotate(-90deg) scale(0.5);
    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
  } 50% { 
    transform: translateX(42px) translateY(42px) rotate(-179deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
  } 50.1% { 
    transform: translateX(42px) translateY(42px) rotate(-180deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
  } 75% { 
    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
  } 100% { 
    transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
  }
}

/* width */
.min_width_100 {
  min-width: 100px !important;
}

.min_width_200 {
  min-width: 200px !important;
}

.min_width_300 {
  min-width: 300px !important;
}

.width_100 {
  width: 100px !important;
}

.width_200 {
  width: 200px !important;
}

.width_300 {
  width: 300px !important;
}

/* other */
.disabled_input {
  pointer-events: none;
  opacity: 0.9;
}

.no-wrap {
	white-space: nowrap;
}