@charset "UTF-8";
body {
  background-color: #f8f8f8;
  font-family: -apple-system-font, 'Segoe UI', 'Roboto', sans-serif;
  /* フッタと同じ高さに設定 */
  margin-bottom: 30px;
  /* 一番下までスクロールした時の余白 */
  padding-bottom: 5px; }

h1, h2, h3, h4, h5, h6 {
  font-family: -apple-system-font, 'Segoe UI Light', 'Segoe UI', 'Roboto', sans-serif;
  font-weight: 300;
  color: #026974; }

h2 {
  margin: 15px 0 30px -12px; }

.header {
  background-color: #0786bd;
  margin-bottom: 14px;
  padding: 12px 0px;
  color: white; }
  .header h1 {
    font-size: 40px;
    line-height: 1;
    margin: 8px 0 5px 0;
    color: #fff; }
  .header img {
    float: left;
    margin: 0 10px 5px 0; }

.pane-content {
  background-color: white;
  padding: 0px 8px;
  border: 1px solid #dddddd;
  border-top: none;
  white-space: pre;
  overflow: auto;
  max-height: 350px;
  font-size: 13px;
  font-family: Monaco, Menlo, Consolas, 'Courier New', monospace; }

.search-form {
  background-color: #74b9ff;
  padding: 10px;
  border-radius: 8px; }

/* ロード中表示のアイコン回転アニメーション */
.refresh-animate {
  animation: spin 1.0s infinite linear; }

@keyframes spin {
  from {
    transform: scale(1) rotate(0deg); }
  to {
    transform: scale(1) rotate(360deg); } }

/*
 * 画面幅
 */
@media (max-width: 991px) {
  .header h1 {
    font-size: 22px;
    line-height: 1;
    margin-top: 7px;
    color: #fff; }
  h2 {
    font-size: 22px;
    margin: 10px 0 25px 0; }
  h4 {
    display: none; } }

@media (max-width: 767px) {
  body {
    font-size: 16px;
    margin-bottom: 10px; } }

/*
 * Bootstrapスタイルの改変
 */
.row {
  margin-top: 5px;
  margin-bottom: 5px; }

/*.btn {
    padding: 6px 36px;
    border-radius: 16px;
}
*/
/* エラー時、入力フォーム背景を赤くする */
.has-error .form-control {
  background-color: #f2dede; }

/* メニュー固定文字用 */
.navbar-inverse .navbar-brand.navbar-static {
  color: #fff; }

/*アイコン付きボタンベース（bootstrapの.btnと合わせて指定） */
@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/fa-solid-900.eot");
  src: url("../fonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../fonts/fa-solid-900.woff2") format("woff2"), url("../fonts/fa-solid-900.woff") format("woff"), url("../fonts/fa-solid-900.ttf") format("truetype"), url("../fonts/fa-solid-900.svg#fontawesome") format("svg"); }

.btn[class^="icoBtn-"],
.btn[class*=" icoBtn-"] {
  padding: 6px 36px;
  border-radius: 16px;
  transition: .4s;
  border-color: #ccc; }
  .btn[class^="icoBtn-"]:before,
  .btn[class*=" icoBtn-"]:before {
    display: inline-block;
    font: normal normal normal 14px/1;
    font-family: "FontAwesome";
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-left: -10px;
    margin-right: 8px; }
  .btn[class^="icoBtn-"]:hover,
  .btn[class*=" icoBtn-"]:hover {
    color: #333;
    background-color: #ccc;
    border-color: #ccc; }
  .btn[class^="icoBtn-"].icoSmall,
  .btn[class*=" icoBtn-"].icoSmall {
    font-size: small;
    margin-top: 10px;
    padding: 3px 20px; }
  .btn[class^="icoBtn-"].color-red,
  .btn[class*=" icoBtn-"].color-red {
    color: #fff;
    background-color: #f82a2a; }
  .btn[class^="icoBtn-"].color-blue,
  .btn[class*=" icoBtn-"].color-blue {
    color: #fff;
    background-color: #0984e3; }
  .btn[class^="icoBtn-"].color-green,
  .btn[class*=" icoBtn-"].color-green {
    color: #fff;
    background-color: #51a228; }

/*ボタン別アイコン指定（FontAwesome）*/
/*EXCELボタン*/
.icoBtn-excel {
  color: #fff;
  background-color: #207245; }
  .icoBtn-excel:before {
    content: "\f1c3"; }

/*EXCELボタン（ドロップダウン*/
.icoBtn-excel-nonstyle {
  color: #fff;
  background-color: #207245; }

/*検索ボタン*/
.icoBtn-search {
  color: #fff;
  background-color: #0984e3; }
  .icoBtn-search:before {
    content: "\f002"; }

/*詳細ボタン*/
.icoBtn-detail {
  color: #333;
  background-color: #00cec9; }
  .icoBtn-detail:before {
    content: "\f022"; }

/*行追加ボタン*/
.icoBtn-addRow {
  color: #333;
  background-color: #ffeaa7; }
  .icoBtn-addRow:before {
    content: "\f055"; }

/*追加ボタン*/
.icoBtn-add {
  color: #333;
  background-color: #fab1a0; }
  .icoBtn-add:before {
    content: "\f055"; }

/*更新ボタン*/
.icoBtn-update {
  color: #fff;
  background-color: #fa5858; }
  .icoBtn-update:before {
    content: "\f044"; }

/*複写ボタン*/
.icoBtn-copy {
  color: #333;
  background-color: #fab1a0; }
  .icoBtn-copy:before {
    content: "\f24d"; }

/*削除ボタン*/
.icoBtn-delete {
  color: #fff;
  background-color: #d63031; }
  .icoBtn-delete:before {
    content: "\f2ed"; }

/*閉じるボタン*/
.icoBtn-close {
  color: #fff;
  background-color: #636e72; }
  .icoBtn-close:before {
    content: "\f057"; }

/*クリアボタン*/
.icoBtn-clear:before {
  content: "\f12d"; }

/*ファイルダウンロードボタン*/
.icoBtn-file {
  color: #fff;
  background-color: #00b894; }
  .icoBtn-file:before {
    content: "\f15c"; }

/*ファイルボタン*/
.icoBtn-clearfile {
  color: #fff;
  background-color: #00b894; }
  .icoBtn-clearfile:before {
    content: "\f15b"; }

/*ハンドシェイクボタン*/
.icoBtn-handShake {
  color: #fff;
  background-color: #e17055; }
  .icoBtn-handShake:before {
    content: "\f2b5"; }

/*アップロード*/
.icoBtn-upload {
  color: #fff;
  background-color: #ff7675; }
  .icoBtn-upload:before {
    content: "\f382"; }

/*ダウンロード*/
.icoBtn-download {
  color: #fff;
  background-color: #0984e3; }
  .icoBtn-download:before {
    content: "\f381"; }

/*FAX*/
.icoBtn-fax {
  color: #fff;
  background-color: #e17055; }
  .icoBtn-fax:before {
    content: "\f1ac"; }

/*請求*/
.icoBtn-bill {
  color: #fff;
  background-color: #e17055; }
  .icoBtn-bill:before {
    content: "\f571"; }

/*参照*/
.icoBtn-glass {
  color: #fff;
  background-color: #74b9ff; }
  .icoBtn-glass:before {
    content: "\f530"; }

/*アドレス帳*/
.icoBtn-address:before {
  content: "\f2b9"; }

/*承認*/
.icoBtn-approve:before {
  content: "\f4fc"; }

/*承認OK*/
.icoBtn-good {
  color: #fff;
  background-color: #0984e3; }
  .icoBtn-good:before {
    content: "\f164"; }

/*承認NG*/
.icoBtn-bad {
  color: #fff;
  background-color: #ff7675; }
  .icoBtn-bad:before {
    content: "\f165"; }

/*CheckOK*/
.icoBtn-ok {
  color: #fff;
  background-color: #0984e3; }
  .icoBtn-ok:before {
    content: "\f058"; }

/*グリッド行ヘッダ用行追加アイコン*/
/*行追加*/
.gridAddRowBtn:before {
  font: normal normal normal 14px/1;
  font-family: "FontAwesome";
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  content: "\f055"; }

.gridAddRowBtn:hover {
  color: #333;
  cursor: pointer; }

/*行削除*/
.gridDelRowBtn:before {
  color: #fa5858;
  font: normal normal normal 14px/1;
  font-family: "FontAwesome";
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  content: "\f057"; }

.gridDelRowBtn:hover {
  color: #f5a9a9;
  cursor: pointer; }

/*マスタ参照*/
.gridListBtn:before {
  font: normal normal normal 14px/1;
  font-family: "FontAwesome";
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  content: "\f022"; }

.gridListBtn:hover {
  color: #333;
  cursor: pointer; }

/* tab color */
.nav-tabs > li > a {
  background-color: #b8cce4;
  border-color: #777777;
  color: #495d75;
  padding: 5px 20px; }

/* active tab color */
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  color: #fff;
  background-color: #0085c7;
  border: 1px solid #888888; }

/* hover tab color */
.nav-tabs > li > a:hover {
  color: #fff;
  border-color: #000000;
  background-color: #495d75; }

/*
 * 画面幅
 */
@media (min-width: 992px) {
  .collapse.app-lg-visible {
    display: block; }
  .btn.collapse {
    display: none !important; } }

@media (max-width: 991px) {
  .tabbable {
    margin-bottom: 20px; }
  .dl-horizontal, .btn-group, .input-group {
    margin-bottom: 10px; }
  .btn[data-target] {
    width: 100%;
    margin-bottom: 20px; }
  .row {
    margin-top: 20px;
    margin-bottom: 10px; } }

@media (max-width: 767px) {
  .dl-horizontal dd {
    width: 48%;
    float: right; }
  .dl-horizontal dt {
    width: 48%;
    float: left;
    text-align: right; }
  .row {
    margin-top: 5px;
    margin-bottom: 5px; } }

/* ヘッダ部分をデバイスに応じてテーブル表示にする */
@media (min-width: 768px) {
  .header-row {
    display: table;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px; }
    .header-row > * {
      display: table-row;
      width: 100%; }
      .header-row > * > * {
        display: table-cell;
        vertical-align: middle; }
    .header-row label:not(.radio-inline) {
      width: 1%;
      min-width: 80px;
      padding-left: 5px; }
    .header-row .col-md-1,
    .header-row .col-md-2,
    .header-row .col-md-3,
    .header-row .col-md-4,
    .header-row .col-md-5,
    .header-row .col-md-6,
    .header-row .col-md-7,
    .header-row .col-md-8,
    .header-row .col-md-9,
    .header-row .col-md-10,
    .header-row .col-md-11,
    .header-row .col-md-12 {
      padding-left: 0px;
      padding-right: 0px;
      float: none; } }

/* ################################################################ */
/* ## メニューバーSTART ########################################### */
/* ################################################################ */
/* #### 運営用 #### */
.navbar-operator {
  background-color: #248;
  border-color: #152aac; }

.navbar-operator .navbar-brand {
  color: #ccc; }

.navbar-operator .navbar-brand:hover,
.navbar-operator .navbar-brand:focus {
  color: #fff;
  background-color: transparent; }

.navbar-operator .navbar-text {
  color: #ccc; }

.navbar-operator .navbar-nav > li > a {
  color: #ccc; }

.navbar-operator .navbar-nav > li > a:hover,
.navbar-operator .navbar-nav > li > a:focus {
  color: #fff;
  background-color: transparent; }

.navbar-operator .navbar-nav > .active > a,
.navbar-operator .navbar-nav > .active > a:hover,
.navbar-operator .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #3969c7; }

.navbar-operator .navbar-nav > .disabled > a,
.navbar-operator .navbar-nav > .disabled > a:hover,
.navbar-operator .navbar-nav > .disabled > a:focus {
  color: #444;
  background-color: transparent; }

.navbar-operator .navbar-toggle {
  border-color: #152aac; }

.navbar-operator .navbar-toggle:hover,
.navbar-operator .navbar-toggle:focus {
  background-color: #3969c7; }

.navbar-operator .navbar-toggle .icon-bar {
  background-color: #fff; }

.navbar-operator .navbar-collapse,
.navbar-operator .navbar-form {
  border-color: #101010; }

.navbar-operator .navbar-nav > .open > a,
.navbar-operator .navbar-nav > .open > a:hover,
.navbar-operator .navbar-nav > .open > a:focus {
  color: #fff;
  background-color: #3969c7; }

@media (max-width: 767px) {
  .navbar-operator .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #3969c7; }
  .navbar-operator .navbar-nav .open .dropdown-menu .divider {
    background-color: #3969c7; }
  .navbar-operator .navbar-nav .open .dropdown-menu > li > a {
    color: #9d9d9d; }
  .navbar-operator .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-operator .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #fff;
    background-color: transparent; }
  .navbar-operator .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-operator .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-operator .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background-color: #3969c7; }
  .navbar-operator .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-operator .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-operator .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent; } }

.navbar-operator .navbar-link {
  color: #9d9d9d; }

.navbar-operator .navbar-link:hover {
  color: #fff; }

.navbar-operator .btn-link {
  color: #9d9d9d; }

.navbar-operator .btn-link:hover,
.navbar-operator .btn-link:focus {
  color: #fff; }

.navbar-operator .btn-link[disabled]:hover,
fieldset[disabled] .navbar-operator .btn-link:hover,
.navbar-operator .btn-link[disabled]:focus,
fieldset[disabled] .navbar-operator .btn-link:focus {
  color: #444; }

/* メニュー固定文字用 */
.navbar-operator .navbar-brand.navbar-static {
  color: #fff; }

/*
 * Wijmoのスタイル
 */
/* FlexGridの既定のスタイル */
.wj-flexgrid {
  height: 600px;
  background-color: white;
  /*box-shadow: 4px 4px 10px 0px rgba(50, 50, 50, 0.75);*/
  margin-bottom: 12px; }

.wj-flexgrid .wj-cell .wj-filter-on .wj-elem-filter {
  background-color: red; }

/* 固定セル */
/*.wj-frozen:not(.wj-state-selected):not(.wj-state-multi-selected) {
    background-color: #f8ffd6;

    &.wj-alt {
        background-color: #f8ffd6;
    }
}*/
/* 固定エリアの端 */
/*.wj-frozen-row {
    border-bottom: 1px solid rgba(0,0,0,.5);
}

.wj-frozen-col {
    border-right: 1px solid rgba(0,0,0,.5);
}*/
/* 読み取り専用要素 */
.wj-state-readonly {
  background-color: #eee; }

/* wijmoフォーム用エラー枠 */
.has-error .wj-control .wj-input-group {
  border: 1px solid;
  border-color: #a94442;
  /*box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.75);*/ }

/* エラー時、入力フォーム背景を赤くする */
.has-error .wj-control .wj-input-group .wj-form-control {
  background-color: #f2dede; }

/* ポップアップ用 */
.wj-dialog-body .dl-horizontal dt,
.modal-body .dl-horizontal dt {
  width: 100px; }

.wj-dialog-body .dl-horizontal dd,
.modal-body .dl-horizontal dd {
  margin-left: 120px; }

/* グリッドの読み取り専用セルの背景色を変える（全体が読み取り専用ではない場合） */
.wj-flexgrid .wj-cells:not([aria-readonly="true"]) .wj-cell:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected)[aria-readonly="true"],
.wj-flexgrid .wj-cells:not([aria-readonly="true"]) .wj-alt:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected)[aria-readonly="true"] {
  background-color: #eee; }

/*グリッドヘッダでフィルタ指定時は色つける*/
.wj-flexgrid .wj-cell.wj-header.wj-filter-on {
  background-color: yellow; }

/*
 * 画面幅
 */
@media (max-width: 991px) {
  .wj-flexgrid {
    box-shadow: 2px 2px 8px 0 rgba(50, 50, 50, 0.5);
    margin-bottom: 12px; }
  .wj-dropdown {
    width: 100%;
    margin-bottom: 10px; } }

/*@media(max-width: 767px) {
}*/
/*
 * Vueコンポーネントで使用するスタイルの定義
 */
/*ページングボタン*/
.pageing-button .btn {
  padding: 6px 12px; }

/* オーバーレイ表示用半透明エリア */
.overlay {
  position: absolute;
  /* Sit on top of the page content */
  display: none;
  /* Hidden by default */
  width: 100%;
  /* Full width (cover the whole page) */
  height: 100%;
  /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  /* Black background with opacity */
  z-index: 2;
  /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer;
  /* Add a pointer on hover */ }

/* 画像アップロード枠 */
.image-upload-area.has-border {
  border: 5px dashed #806050;
  border-radius: 4px; }

/* Vueがロードされるまでの表示 */
.load-wait {
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  text-align: center;
  padding-top: 30vh; }
  .load-wait.fadeout {
    animation: load-fadeout 0.3s linear 0s 1; }
  .load-wait .jumbotron {
    color: white;
    /*#555;*/
    background-color: transparent;
    /*rgba(238, 238, 238, 0.2);*/ }

@keyframes load-fadeout {
  0% {
    opacity: 1; }
  75% {
    opacity: 0.5; }
  100% {
    opacity: 0; } }

/* AJAX用ロード中表示 */
.load-ajax {
  display: none;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  text-align: center;
  padding-top: 30vh;
  z-index: 1000; }
  .load-ajax .loading-body {
    display: inline-block;
    width: 100px;
    height: 100px;
    padding-top: 5px;
    border: 1px #ddd solid;
    border-radius: 4px;
    background-color: #eee;
    font-size: 48pt; }

/* グリッドの行ヘッダーのポップオーバー */
.grid-popover .popover-content {
  padding: 0px;
  margin: 0px; }
  .grid-popover .popover-content .list-group-item {
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #ddd; }
    .grid-popover .popover-content .list-group-item:first-child {
      border-top: 0px; }
    .grid-popover .popover-content .list-group-item:last-child {
      border-bottom: 0px; }