
/*****************************************
html, body
******************************************/

html,
body {
  overflow-y: hidden;
  height: 100%;
  font-size: 13px;
  line-height: 1.2;
  color: #111;
  padding-right: 0px!important
}

/*****************************************
NSI2 背景色
******************************************/

.nsi2-bg {
  background: #F3F3F3;
}

/*****************************************
NSI2 ヘッダー
******************************************/

.nsi2-header-lg {
  height: 180px;
}

.nsi2-header-md {
  height: 60px;
}

/*****************************************
NSI2 ロゴ
******************************************/

div.nsi2-logo-lg span {
  color: #8A8A8A;
}

div.nsi2-logo-lg span.ns {
  font-size: 60px;
}

div.nsi2-logo-lg span.i {
  font-size: 108px;
  -webkit-text-stroke: 1px #8A8A8A;
  -webkit-text-fill-color: transparent;
}

div.nsi2-logo-lg span.two {
  font-size: 45px;
  -webkit-text-stroke: 1px #8A8A8A;
  -webkit-text-fill-color: transparent;
  vertical-align: top;
  position: relative;
  top: 11.9px;
}

div.nsi2-logo-md span {
  /* color:#8A8A8A; */
  color: white;
}

div.nsi2-logo-md span.ns {
  font-size: 27px;
}

div.nsi2-logo-md span.i {
  font-size: 46px;
  /* -webkit-text-stroke: 1px #8A8A8A; */
  -webkit-text-stroke: 0.5px white;
  -webkit-text-fill-color: transparent;
  position: relative;
  top: -1.2px;
  left: -2px;
}

div.nsi2-logo-md span.two {
  font-size: 24px;
  /* -webkit-text-stroke: 1px #8A8A8A; */
  -webkit-text-stroke: 0.5px white;
  -webkit-text-fill-color: transparent;
  vertical-align: top;
  position: relative;
  top: 5.8px;
  left: -5px;
}

/*****************************************
大分類ごとのテーマカラー設定
******************************************/

.bg-ps {
  background-color: rgb(192, 144, 49);
}

.bg-bms {
  background-color: rgb(56, 126, 68);
}

.bg-sms {
  background-color: rgb(40, 86, 165);
}

.bg-tms {
  background-color: rgb(241, 105, 46);
}

.bg-ems {
  background-color: rgb(190, 39, 45);
}

.bg-mst {
  background-color: rgb(210, 210, 210);
}

.bg-doc {
  background-color: rgb(121, 49, 173);
}

.border-ps {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(192, 144, 49);
}

.border-bms {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(56, 126, 68);
}

.border-sms {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(40, 86, 165);
}

.border-tms {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(241, 105, 46);
}

.border-ems {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(190, 39, 45);
}

.border-mst {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(210, 210, 210);
}

.border-doc {
  border-left-width: 0px;
  border-right-width: 0px;
  border-top-width: 0px;
  border-bottom-width: 5px;
  border-bottom-color: rgb(121, 49, 173);
}

.shadow-ps {
  box-shadow: 0 0 0 0.2rem rgba(192, 144, 49, 0.6) !important;
}

.shadow-bms {
  box-shadow: 0 0 0 0.2rem rgba(56, 126, 68, 0.6) !important;
}

.shadow-sms {
  box-shadow: 0 0 0 0.2rem rgba(40, 86, 165, 0.6) !important;
}

.shadow-tms {
  box-shadow: 0 0 0 0.2rem rgba(241, 105, 46, 0.6) !important;
}

.shadow-ems {
  box-shadow: 0 0 0 0.2rem rgba(190, 39, 45, 0.6) !important;
}

.shadow-mst {
  box-shadow: 0 0 0 0.2rem rgba(210, 210, 210, 0.6) !important;
}

.shadow-doc {
  box-shadow: 0 0 0 0.2rem rgba(121, 49, 173, 0.6) !important;
}


/************************************************************
control
*************************************************************/

form .validate.ng-invalid {
  border-color: #dc3545 !important;
}

.input-xs {
  width: 80px;
}

.input-s {
  width: 160px;
}

.input-m {
  width: 280px;
}

.input-l {
  width: 400px;
}

.input-xl {
  width: 520px;
}

.input-xxl {
  width: 720px;
}

/** テーブル共通 */

td .d-inline-block {
  width: 100%;
}

td .btn {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  font-size: 13px;
}

td input[type='text'] {
  width: 100%;
  margin-top: -2px;
  height: 135%;
}

/* ここから */

main {
  min-width: 1085px !important;
}

main.full-width {
  width: calc(100vw - 70px) !important;
  /* これがあると、崩れる　
    min-width: 1280px !important; */
}

/* ここから */


.list-section-table-wrapper {
  overflow-x: scroll;
}

.detail-section-table-wrapper {
  overflow-x: scroll;
}

/* ここまで　共通一覧テーブルを使用する場合必要ないので削除する */

/* .list-section-table-wrapper {
  width: calc(100vw - 310px) !important;
  min-width: 970px !important;
}
.list-section-table-wrapper.full-width {
  width: calc(100vw - 70px) !important;
  min-width: 1280px !important;
} */

/* .list-section-table-wrapper.full-width table {
  min-width: 100% !important;
} */

/*****************************************
ツリー
******************************************/
tree-root {
  text-align: left;
}


/************************************************************
１ページ（詳細のみ）レイアウト
*************************************************************/
.singlepage-section {
  height: calc(100% - 5px);

}
.singlepage-section > .nsi2-cmn-list-section-header {
  
}
.singlepage-section .singlepage-section-content {
  height: calc(100% - 15px)!important;
  /* 43px */
}

/************************************************************
詳細、一覧レイアウト
*************************************************************/
.list-section {
  height: 100%;
  /* text-align: left; */
}
.list-section .list-section-content {
  height: calc(100% - 30px)!important;
}

.detail-section {
  height: calc(100% - 0px);
  /* text-align: left; */
}


div.mst .detail-section {
  height: calc(100% - 3px);
}

.detail-section > *:nth-child(1) {
  /** 詳細バーがない場合の高さ */
  /** 詳細バーがない場合は1個目の要素 */
  height: calc(100% - 2px);
}

.detail-section > *:nth-child(2) {
  /** 詳細バーがある場合の高さ */
  /** 詳細バーがある場合は2個目の要素 */
  height: calc(100% - 20px);
}

.detail-section .detail-section-content {
  margin-bottom: 2px;
  border: solid 1px #bbb;
}
.detail-section .detail-section-content .nav-tabs {
  border-top: 0px;
  border-left: 0px;
  border-right: 0px;
}

.detail-section .detail-section-content .tab-content {
  /** タブがある場合の高さ */
  height: calc(100% - 30px);
  /* height: calc(100% - 27px); */

  border: 0px;
}
.detail-section .detail-section-content .tab-content > .tab-pane {
  height: 100%;
}



/** 詳細表示 */
div.detail-section-content div.container div.d-inline-block > button {
  min-width: 200px;
}

div.space {
  height: 10px;
}

/** 詳細表示：ヘッダータブ部分  */

.tab-header-buttons {
  position: absolute;
  right: 13px;
  margin-top: 20px;
}

.tab-header-buttons>button {
  padding: 0px;
  border: 0px;
  width: 18px;
  height: 18px;
  margin-right: 0px;
}

/** 詳細表示：ヘッダー部分  */

.detail-header-buttons {
  /* position: absolute; */
  right: 13px;
  margin-top: 0px;
}

.detail-header-buttons>button {
  padding: 0px;
  border: 0px;
  width: 18px;
  height: 18px;
  margin-right: 0px;
}







.header-fixed {
  min-width: 970px;
  width: 100%;
  table-layout: fixed;
  border-left: rgb(224, 224, 224) solid 1px;
  border-right: rgb(224, 224, 224) solid 1px;
  border-bottom: rgb(224, 224, 224) solid 1px;
  border-top: rgb(224, 224, 224) solid 1px;
  margin-bottom: 0px;
  ;
}

.header-fixed .width-sss {
  width: 18px;
}

.header-fixed .width-ss {
  width: 30px;
}

.header-fixed .width-s {
  width: 50px;
}

.header-fixed .width-m {
  width: 100px;
}

.header-fixed .width-l {
  width: 140px;
}

.header-fixed .width-ll {
  width: 180px;
}

.header-fixed>thead>tr>th {
  height: 28px;
  border-bottom: 0px;
  white-space: nowrap;
}

.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>thead>tr>th,
.header-fixed>tbody>tr>td {
  height: 2.1em;
}

.header-fixed>tbody>tr:after,
.header-fixed>thead>tr:after {
  content: ' ';
  display: block;
  visibility: hidden;
  clear: both;
}

.header-fixed>tbody {
  overflow-y: auto;
  height: 87px;
  /** PG側で高さを設定するか？ */
}

.header-fixed td>select {
  margin-top: -1px;
}

/** 行選択時の背景色 bootstrapのactiveのcssの適用方法不明 */

.table-striped>tbody>tr.active,
.table-striped tbody tr.active:nth-child(odd),
.header-fixed>tbody>tr.active {
  background-color: rgba(204, 0, 0, 0.075);
}

.header-fixed>tbody>tr>td,
.header-fixed>thead>tr>th {
  float: left;
  border-left-style: solid;
  border-left-width: 1px;
  border-left-color: rgb(224, 224, 224);
}

.header-fixed>thead>tr:first-child>th {
  border-top-style: none;
}

.header-fixed>tbody>tr>td:first-child,
.header-fixed>thead>tr>th:first-child {
  border-left-style: none;
}

.header-fixed>tbody>tr>td.border-left-none,
.header-fixed>thead>tr>th.border-left-none {
  border-left-style: none;
}

.header-fixed>tbody>tr>td.border-top-none,
.header-fixed>thead>tr>th.border-top-none {
  border-top-style: none;
}

.header-fixed>tbody>tr>td.height-padding,
.header-fixed>thead>tr>th.height-padding {
  padding: 0.31em;
}

.header-fixed th button.btn,
.header-fixed td button.btn {
  padding: 0px;
  border: 0px;
  height: 100%;
}


/**  共通　*/

div.radio-group>label {
  margin-right: 15px;
}

.btn-link {
  border: none;
}

div.duration-calendar>div.input-group>button.input-group-addon>img {
  width: 1.2rem;
  height: 1rem;
  cursor: pointer;
}

hr.line {
  margin-top: 5px;
  margin-bottom: 5px;
}

/* *,
*::before,
*::after {
box-sizing: border-box;
} */


/** カレンダースタイル */
div.ngb-dp-day {
  outline: unset;
}
.custom-day {
  text-align: center;
  padding: 0.185rem 0.25rem;
  border-radius: 0.25rem;
  display: inline-block;
  width: 2rem;
}

.custom-day:hover,
.custom-day.focused {
  background-color: #e6e6e6;
}

.custom-day.sunday {
  color: red;
}
.custom-day.saturday {
  color: blue;
}
.custom-day.public-holiday {
  /* background-color: #f0ad4e; */
  /* border-radius: 1rem; */
  color: green;
}
.custom-day.holiday {
  background-color: #FFD595;
  /* border-radius: 1rem; */
  /* color: green; */
}

.hidden {
  display: none;
}

/** 日付スタイル */
.dateDuration {
  padding-left: 7px;
  padding-right: 7px;
}

.dateRow {
  padding-left: 0px
}

button.input-group-addon {
  border-top-right-radius: .2rem;
  border-bottom-right-radius: .2rem;
  border: 1px solid #ced4da;
  background-color: #e9ecef;
}

/** 参照 */
.refarence {
  background-color: white!important;
  border: 1px solid #ced4da;
}




.ngb-dp-day {
    text-align: center;
}

as-split.as-horizontal > .as-split-gutter:not(:hover) {
  background-color: #f5f5f5!important;
}
as-split.as-vertical > .as-split-gutter:not(:hover) {
  background-color: white!important;
}
.as-split-gutter:hover {
  background-color: #ddd!important;
}
.as-horizontal > .as-split-gutter > .as-split-gutter-icon {
  background-image: url(/assets/icon/grip-vertical-solid.svg)!important;
  background-position: center 160px!important;
}
.as-vertical > .as-split-gutter > .as-split-gutter-icon {
  background-image: url(/assets/icon/grip-horizontal-solid.svg)!important;
}
