/*====================
 画面全体のレイアウト関連のCSS
====================*/
html {
  background-color: #DBECFC;
  /* width: 1280px; */
}

body {
  background-color: white;
  /* width: 1200px; */
}

.back-color {
  background-color: #DBECFC;
}

.container-color {
  background-color: white;
}

#head {
  padding-top: 50px;
  background-color: #DBECFC;
}

div .header {
  line-height: 40px;
  color: #FFF;
  text-align: center;
  background-color: #337AB7;
}

.footer {
  background-color: #DBECFC;
}

.color-header {
  background-color: #337AB7;
  color: white;
}

.no-float>div {
  float: none;
}

/* フォームの色を黒にする */
.form-control, .form-control:focus, .form-check-label{
  color: black;
}

/*====================
 bootstrap側のボタンカラーに合わせる対応
====================*/
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}

.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary.focus, .btn-secondary:active, .btn-secondary.active, .open>.dropdown-toggle.btn-secondary, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
}

.btn-secondary {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn.focus, .btn:focus {
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}

.btn-primary.focus, .btn-primary:focus {
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}

.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}

/*====================
 モーダルのレイアウト関連のCSS
====================*/
.modal-iframe {
  padding: 0px;
}

.modal-iframe iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  border: none;
}


/*====================
 エラーメッセージのレイアウト関連のCSS
====================*/
.error-tooltip {
  display: none;
  padding: 6px 10px 12px 12px;
  background: url(/css/images/bg_error_tooltip_top-beeb5bf1f713b8e1ce47f2d54c9c340b.gif) left bottom no-repeat;
  color: #ffffff;
  text-align: left;
  width: 200px !important;
  z-index: 1100;
}

.tooltip-left {
  background: url(/css/images/bg_error_tooltip_left-b06c6d56ec5e886a9213fa2aaf0bee2c.gif) left bottom no-repeat !important;
}

.error-field {
  border: 1px solid #dcc;
  background-color: #fee;
}


/*====================
 汎用的なCSS
====================*/
/* 高さを親クラスに合わせる */
.auto-height {
  height: 100% !important;
}

/* 小さい注意書き */
span.attention {
  color: #808080;
  font-size: 0.75rem;
}

@media screen and (min-width: 768px) {
  span.attention {
    color: #808080;
    font-size: 0.625rem;
  }
}

/* 適用した要素を親要素のベースラインに中央で揃える */
.vertical-middle {
    vertical-align: middle;
}

/* 太文字タイトル */
p.title {
  margin-top: 5px;
  margin-bottom: 5px;
  font-weight: bold;
}

/*====================
 テーブルのレイアウト関連のCSS
====================*/

.table>thead>tr>th>div .content-center {
  text-align: center;
}

.table>tbody>tr>th {
  text-align: center;
}

.table>tbody>tr>td, .table>tbody>tr>th, .table>thead>tr>td, .table>thead>tr>th {
  vertical-align: middle;
}