html {
  height: 100%;
}

body {
  background: #FFF;
  color: #5d6b6f;
  font-family: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
  line-height: 190%;
  min-height: 100%;
  display: flex;
}

.box {
  flex: 1 1 auto;
  width: 100%;
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-content: flex-start;
  align-items: center;
  min-height: 100vh;
  height: 100%;
}

.relative {
  position: relative;
  width: 235px;
}

.absolute {
  position: absolute;
}

.form-horizontal .control-label {
  font-size: 16px;
  margin-right: 20px;
  text-align: right;
}

.boxA {
  order: 1;
  flex: 1 1 auto;
}

.boxB {
  flex: 1 1 auto;
  padding-top:30px;
}

.boxB p.attention {
    font-size: 11px;
    color: gray;
    line-height: 2em;
}

.hbox {
  width: 100%;
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
}

.hboxA {
  flex: 0 1 auto;
}

.hboxB {
  flex: 1 1 auto;
}

.hboxC {
  flex: 1 1 auto;
}

.hboxD {
  flex: 10 1 auto;
}

.bottom300 {
  margin-top: 30px;
}

.alert-success-style {
  height: 45px;
  font-size: 2em;
  padding-top: 5px;
  padding-left: 5px;
}

.menuIcon {
  padding-top: 20px;
  font-size: 1.5em;
  font-family: "メイリオ","Meiryo","verdana","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","ＭＳ Ｐゴシック","MS PGothic","Sans-Serif";
}

.loginIcon {
  font-size: 1.1em;
  font-family: "メイリオ","Meiryo","verdana","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","ＭＳ Ｐゴシック","MS PGothic","Sans-Serif";
}

footer {
  order: 2;
  flex: 0 0 auto;
  right: 0;
  bottom: 0;
  width: 100%;
  left: 0;
  padding: 0.2rem;
  background-color: #fcfcfc;
  text-align: center;
}

.animate-show-hide.ng-hide {
  opacity: 0;
}

.animate-show-hide.ng-hide-add,
.animate-show-hide.ng-hide-remove {
  transition: all linear 0.5s;
}


input[type="radio"] {
  margin-right: 10px;
}

.fa-1x5 {
  font-size: 1.5em;
}

.fa-1x3 {
  font-size: 1.3em;
}

.btn-success,
.btn-success:hover,
.btn-success:active,
.btn-success:visited,
.btn-success:focus,
.btn-info,
.btn-info:hover,
.btn-info:active,
.btn-info:visited,
.btn-info:focus {
  font-size: 16px;
  height: 45px;
  margin-right: 50px;
  min-width: 70px;
}

.btn-height-lg,
.btn-height-lg:hover,
.btn-height-lg:active,
.btn-height-lg:visited,
.btn-height-lg:focus .btn-height-lg {
  height: 60px;
  margin-right: 80px;
}

.left-padding-30 {
  padding-left: 30px;
}


.navbar-brand {
  font-size: 30px;
}


.navbar-nav > li > a, .navbar-brand {
  padding-top: 25px !important;
  padding-bottom: 0 !important;
  height: 70px;
}

/*
         .navbar-header {
            padding-top: 30px;
        }
            */
.navbar {
  min-height: 70px !important;
}

.navbar-default {
  background-color: #d6ece9;
  border-color: #d6ece9;
}

.navbar-default .navbar-brand {
  color: #5d6b6f;
}

.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #36b2a4;
}

.navbar-default .navbar-text {
  color: #5d6b6f;
}

.navbar-default .navbar-nav > li > a {
  color: #5d6b6f;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #36b2a4;
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #36b2a4;
  background-color: #d6ece9;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #36b2a4;
  background-color: #d6ece9;
}

.navbar-default .navbar-toggle {
  border-color: #d6ece9;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #d6ece9;
}

.navbar-default .navbar-toggle .icon-bar {
  background-color: #5d6b6f;
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #5d6b6f;
}

.navbar-default .navbar-link {
  color: #5d6b6f;
}

.navbar-default .navbar-link:hover {
  color: #36b2a4;
}

@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #5d6b6f;
  }

  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #36b2a4;
  }

  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #36b2a4;
    background-color: #d6ece9;
  }
}


.font-fontawesome {
  font-family: 'FontAwesome';
}

.errMessge {
  color: red;
}

.hasPdf {
  color: blue;
}

.header-fixed {
  width: 100%;
}

.header-fixed > thead,
.header-fixed > tbody,
.header-fixed > thead > tr,
.header-fixed > tbody > tr,
.header-fixed > thead > tr > th,
.header-fixed > tbody > tr > td {
  display: block;
}

.header-fixed > tbody > tr:after,
.header-fixed > thead > tr:after {
  content: ' ';
  display: block;
  visibility: hidden;
  clear: both;
}

.header-fixed > tbody {
  overflow-y: auto;
  height: 150px;
}

.header-fixed > tbody > tr > td,
.header-fixed > thead > tr > th {
  width: 20%;
  float: left;
}


.custom-popover {
  max-width: 600px;
  max-height: 400px;
  overflow-y: scroll;
}

.custom-popover .popover-header {
  background: #FAFAFA;
  border-bottom: 1px solid #EAEAEA;
}

.custom-popover .popover-header .popover-header-content {
  max-width: 75rem;
  margin-left: auto;
  margin-right: auto;
  line-height: 20px;
}

.custom-popover .popover-header .title {
  padding-top: 7px;
  padding-bottom: 5px;
  padding-left: 20px;
  font-size: 17px;
  font-weight: 600;
  float: left;
}

.custom-popover .popover-header .options {
  border-left: 1px solid #EAEAEA;
  padding-top: 16px;
  padding-bottom: 16px;
  float: right;
  width: 65%;
  text-align: left;
  padding-left: 30px;
}

.custom-popover .popover-header .option {
  display: inline-block;
  margin: 0 5px;
}

.custom-popover .popover-header .option input {
  margin-bottom: 0;
}

.custom-popover .popover-header .option label {
  vertical-align: 1px;
}

.custom-popover .popover-body {
  text-align: center;
  font-weight: 300;
  height: 300px;
  overflow-y: auto;
}

.custom-popover .popover-body span {
  font-weight: 400;
}

.custom-popover .popover-footer {
  text-align: right;
  padding: 40px 30px;
}

.history-dt {
  width: 100px !important;
  font-size: 12px;
}

.history-dd {
  width: 120px !important;
  font-size: 11px;
  margin-left: 120px !important;
  text-align: left;
}

.history-header {
  padding: 5px 5px;
  color: #5d6b6f;
  background-color: #f5f5f5;
  border-bottom: 1px solid #ddd;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  text-align: left;
  font-weight: 500;
}

.custom-popover table.usage {
  font-size: 11px;
  border-bottom: solid 1px #ddd;
  margin: 6px;
  width: 200px;
}

.custom-popover .alert {
  font-size: 11px;
  margin: 6px;
  width: 220px;
}

.history-dl {
  margin-bottom: 0px !important;
}

markSuccess {
  background-color: #f5f5f5;
  color: #5d6b6f;
  font-size: 10px;
}

markCreatIng {
  background-color: #f5f5f5;
  color: #46b8da;
  font-size: 10px;
}

markError {
  background-color: #f5f5f5;
  color: #f0ad4e;
  font-size: 10px;
}


.btn-re, .btn-re:hover, .btn-re:active, .btn-re:visited, .btn-re:focus {
  font-size: 10px;
  height: 18px;
  margin-right: 5px;
  min-width: 36px;
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
  padding: 2px 2px 2px 2px;
  line-height: 1.5;
  border-radius: 3px;
}

.btn-re:hover {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}

#vertical-container {
  height: 100%;
  width: 400px;
}

#vertical-container .panel {
  padding: 0px;
}

.repeated-item {
  border-bottom: 1px solid #ddd;
  box-sizing: border-box;
  height: 40px;
  padding-top: 10px;
}

.md-virtual-repeat-container {
}

.readingData {
  font-size: 15px;
  color: #46b8da;
  float: right;
  margin-top: 10px;
}

.noHistory {
  font-size: 20px;
  color: #46b8da;
}

.history-panel {
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.history-panel-body {
  padding-left: 5px !important;
  padding-right: 5px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.md-virtual-repeat-container .md-virtual-repeat-offsetter {
}

.virtualRepeatdemoDeferredLoading #vertical-container {
  height: 292px;
  width: 100%;
  max-width: 400px;
}


.virtualRepeatdemoDeferredLoading md-content {
  margin: 16px;
}

.virtualRepeatdemoDeferredLoading md-virtual-repeat-container {
  border: solid 1px grey;
}

.virtualRepeatdemoDeferredLoading .md-virtual-repeat-container .md-virtual-repeat-offsetter div {
  padding-left: 16px;
}