@charset "UTF-8";
/* -------------------------------------------------------------------------- */
/* 共通色の定義 */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* 各色の定義 */
/* -------------------------------------------------------------------------- */
.red-theme, div.error {
  background-color: #F44336;
  color: #FFFFFF;
}
.red-theme i[class^=icon-], div.error i[class^=icon-] {
  color: inherit;
}
.red-theme .dropmenu li a, div.error .dropmenu li a {
  background-color: #D32F2F;
  color: #FFFFFF;
}
.red-theme .dropmenu li a:hover, div.error .dropmenu li a:hover {
  background-color: #FFCDD2;
  color: #FF5252;
}
.red-theme .dropmenu li ul li a, div.error .dropmenu li ul li a {
  border-top-color: #ff9aa4;
}

.pink-theme {
  background-color: #E91E63;
  color: #FFFFFF;
}
.pink-theme i[class^=icon-] {
  color: inherit;
}
.pink-theme .dropmenu li a {
  background-color: #C2185B;
  color: #FFFFFF;
}
.pink-theme .dropmenu li a:hover {
  background-color: #F8BBD0;
  color: #FF4081;
}
.pink-theme .dropmenu li ul li a {
  border-top-color: #f38db0;
}

.purple-theme {
  background-color: #9C27B0;
  color: #FFFFFF;
}
.purple-theme i[class^=icon-] {
  color: inherit;
}
.purple-theme .dropmenu li a {
  background-color: #7B1FA2;
  color: #FFFFFF;
}
.purple-theme .dropmenu li a:hover {
  background-color: #E1BEE7;
  color: #E040FB;
}
.purple-theme .dropmenu li ul li a {
  border-top-color: #d099d9;
}

.indigo-theme {
  background-color: #3F51B5;
  color: #FFFFFF;
}
.indigo-theme i[class^=icon-] {
  color: inherit;
}
.indigo-theme .dropmenu li a {
  background-color: #303F9F;
  color: #FFFFFF;
}
.indigo-theme .dropmenu li a:hover {
  background-color: #C5CAE9;
  color: #536DFE;
}
.indigo-theme .dropmenu li ul li a {
  border-top-color: #a0a8db;
}

.blue-theme {
  background-color: #2196F3;
  color: #FFFFFF;
}
.blue-theme i[class^=icon-] {
  color: inherit;
}
.blue-theme .dropmenu li a {
  background-color: #1976D2;
  color: #FFFFFF;
}
.blue-theme .dropmenu li a:hover {
  background-color: #BBDEFB;
  color: #448AFF;
}
.blue-theme .dropmenu li ul li a {
  border-top-color: #8bc7f8;
}

.lblue-theme, div.success {
  background-color: #03A9F4;
  color: #FFFFFF;
}
.lblue-theme i[class^=icon-], div.success i[class^=icon-] {
  color: inherit;
}
.lblue-theme .dropmenu li a, div.success .dropmenu li a {
  background-color: #0288D1;
  color: #FFFFFF;
}
.lblue-theme .dropmenu li a:hover, div.success .dropmenu li a:hover {
  background-color: #B3E5FC;
  color: #03A9F4;
}
.lblue-theme .dropmenu li ul li a, div.success .dropmenu li ul li a {
  border-top-color: #82d4fa;
}

.green-theme {
  background-color: #4CAF50;
  color: #FFFFFF;
}
.green-theme i[class^=icon-] {
  color: inherit;
}
.green-theme .dropmenu li a {
  background-color: #388E3C;
  color: #FFFFFF;
}
.green-theme .dropmenu li a:hover {
  background-color: #C8E6C9;
  color: #4CAF50;
}
.green-theme .dropmenu li ul li a {
  border-top-color: #a5d6a7;
}

.lgreen-theme {
  background-color: #8BC34A;
  color: #212121;
}
.lgreen-theme i[class^=icon-] {
  color: inherit;
}
.lgreen-theme .dropmenu li a {
  background-color: #689F38;
  color: #FFFFFF;
}
.lgreen-theme .dropmenu li a:hover {
  background-color: #DCEDC8;
  color: #8BC34A;
}
.lgreen-theme .dropmenu li ul li a {
  border-top-color: #c4e0a2;
}

.lime-theme {
  background-color: #CDDC39;
  color: #212121;
}
.lime-theme i[class^=icon-] {
  color: inherit;
}
.lime-theme .dropmenu li a {
  background-color: #AFB42B;
  color: #212121;
}
.lime-theme .dropmenu li a:hover {
  background-color: #F0F4C3;
  color: #CDDC39;
}
.lime-theme .dropmenu li ul li a {
  border-top-color: #e5ec98;
}

.yellow-theme {
  background-color: #FFEB3B;
  color: #212121;
}
.yellow-theme i[class^=icon-] {
  color: inherit;
}
.yellow-theme .dropmenu li a {
  background-color: #FBC02D;
  color: #212121;
}
.yellow-theme .dropmenu li a:hover {
  background-color: #FFF9C4;
  color: #FFEB3B;
}
.yellow-theme .dropmenu li ul li a {
  border-top-color: #fff491;
}

.amber-theme, div.warn {
  background-color: #FFC107;
  color: #212121;
}
.amber-theme i[class^=icon-], div.warn i[class^=icon-] {
  color: inherit;
}
.amber-theme .dropmenu li a, div.warn .dropmenu li a {
  background-color: #FFA000;
  color: #212121;
}
.amber-theme .dropmenu li a:hover, div.warn .dropmenu li a:hover {
  background-color: #FFECB3;
  color: #FFC107;
}
.amber-theme .dropmenu li ul li a, div.warn .dropmenu li ul li a {
  border-top-color: #ffdf80;
}

.orange-theme {
  background-color: #FF9800;
  color: #212121;
}
.orange-theme i[class^=icon-] {
  color: inherit;
}
.orange-theme .dropmenu li a {
  background-color: #F57C00;
  color: #212121;
}
.orange-theme .dropmenu li a:hover {
  background-color: #FFE0B2;
  color: #FF9800;
}
.orange-theme .dropmenu li ul li a {
  border-top-color: #ffcb7f;
}

.brown-theme {
  background-color: #795548;
  color: #FFFFFF;
}
.brown-theme i[class^=icon-] {
  color: inherit;
}
.brown-theme .dropmenu li a {
  background-color: #5D4037;
  color: #FFFFFF;
}
.brown-theme .dropmenu li a:hover {
  background-color: #D7CCC8;
  color: #9E9E9E;
}
.brown-theme .dropmenu li ul li a {
  border-top-color: #c2b1aa;
}

.bluegray-theme, .-theme {
  background-color: #607D8B;
  color: #FFFFFF;
}
.bluegray-theme i[class^=icon-], .-theme i[class^=icon-] {
  color: inherit;
}
.bluegray-theme .dropmenu li a, .-theme .dropmenu li a {
  background-color: #455A64;
  color: #FFFFFF;
}
.bluegray-theme .dropmenu li a:hover, .-theme .dropmenu li a:hover {
  background-color: #CFD8DC;
  color: #607D8B;
}
.bluegray-theme .dropmenu li ul li a, .-theme .dropmenu li ul li a {
  border-top-color: #b1c0c6;
}

.white-theme {
  background-color: #FFFFFF;
  color: #607D8B;
}
.white-theme i[class^=icon-] {
  color: inherit;
}
.white-theme .dropmenu li a {
  background-color: #FFFFFF;
  color: #455A64;
}
.white-theme .dropmenu li a:hover {
  background-color: #607D8B;
  color: #FFFFFF;
}
.white-theme .dropmenu li ul li a {
  border-top-color: #b1c0c6;
}

/* -------------------------------------------------------------------------- */
/* ここからスタイル定義 */
/* -------------------------------------------------------------------------- */
html, body {
  width: 100%;
  height: 100%;
  font-family: "メイリオ", "Meiryo", sans-serif;
  font-size: 18px;
  line-height: 120%;
  color: #212121;
}

body {
  margin: 0px;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  background-color: #f5f9fc;
}

* {
  color: inherit;
  box-sizing: border-box;
}

table td:not(.message) {
  background-color: #ffffff;
}

a {
  color: #448AFF;
}

ul {
  list-style: none;
}
ul li {
  list-style-type: none;
}
ul li.selected::before, ul li.checked::before {
  display: inline-block;
  content: "✔";
  position: absolute;
  left: 5px;
  top: 5px;
}
ul.list {
  list-style: disc;
}
ul.list li {
  list-style-type: disc;
}

/* ヘッダー */
.header {
  min-height: 3rem;
}
.header .logo {
  height: 3rem;
  vertical-align: bottom;
}
.header .dropmenu {
  margin-right: 10px;
}

/* フッター */
footer {
  color: #092a8d;
  text-align: center;
  margin-top: 1rem;
  font-size: 0.8rem;
  line-height: 0.9rem;
  height: 2rem;
}
footer img {
  height: 0.7rem;
}

/* -------------------------------------------------------------------------- */
/* MESSAGE */
/* -------------------------------------------------------------------------- */
div.message {
  margin: 2px 0;
  padding: 7px 14px;
  overflow: inherit;
}
div.message.hidden {
  height: 0;
  padding: 0;
}
div.message.hidden * {
  display: none;
}

.cake-error, p.error {
  background-color: unset;
  color: #C3232D;
  margin: 18px 0;
  padding: 7px 14px;
}

input[type=file].error {
  color: #C3232D;
  outline: solid;
}

/* -------------------------------------------------------------------------- */
/* 要素の並べ方の定義 */
/* -------------------------------------------------------------------------- */
.nowrap, .multiselect li a, .multiselect, .dropmenu li a, .dropmenu {
  white-space: nowrap;
}

.nowrap-parent div {
  display: inline-block;
}

.flex-between {
  display: flex;
  justify-content: space-between;
  line-height: 1.5rem;
}

.flex-pdng {
  padding: 0px 20px 0px 0px;
}

.flex-rtl {
  flex-direction: row-reverse;
}

.flex-fit {
  flex: 1 1 auto;
}

div.flex-parent-horizontal {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
}
div.flex-parent-horizontal.align-items-top {
  align-items: flex-start;
}

.align-left {
  text-align: left;
}

.align-center, .item-box .item-body .submit {
  text-align: center;
}

.align-right, .paging {
  text-align: right;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}

.clearfix:after {
  clear: both;
}

.position-bottom {
  position: relative;
}
.position-bottom > * {
  position: absolute;
  bottom: 0;
}

/* -------------------------------------------------------------------------- */
/* FONT */
/* -------------------------------------------------------------------------- */
.font-big {
  font-size: 1.4rem;
  line-height: 1.5rem;
  font-weight: bold;
}

.font-normal {
  font-size: 1rem;
  line-height: 1.1rem;
  font-weight: bold;
}

.font-small, .multiselect li a, .dropmenu li a, .font-small > button, .multiselect li a > button, .dropmenu li a > button, .font-small select, .multiselect li a select, .dropmenu li a select {
  font-size: 0.8rem;
  line-height: 0.9rem;
  font-weight: inherit;
}

.font-bold, .switchArea {
  font-weight: bold;
}

/* フォントアイコンの設定 */
i[class^=icon-] {
  color: gray;
}

i[class=icon-info-circled] {
  color: green;
}

.trans90 {
  transform: rotate(90deg);
}

/* SVGアイコンの設定 */
svg.icon {
  width: 36px;
  height: 32px;
}

/* ---------------------------------------- */
/* iziToast custom */
/* ---------------------------------------- */
.iziToast.iziToast-large > .iziToast-body .iziToast-message, .iziToast.iziToast-large > .iziToast-body .iziToast-title {
  font-size: 23.4px;
  line-height: 1.2em;
}
.iziToast.iziToast-large > .iziToast-body .iziToast-buttons > a, .iziToast.iziToast-large > .iziToast-body .iziToast-buttons > button, .iziToast.iziToast-large > .iziToast-body .iziToast-buttons > input {
  font-size: 23.4px;
}

/* ---------------------------------------- */
/* Element : loading_overlay */
/* ---------------------------------------- */
/* くるくる */
#loading_overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.65);
  display: none;
  z-index: 2000;
  text-align: center;
}
#loading_overlay i {
  position: absolute;
  top: 40%;
  font-size: 4rem;
  margin-left: -2rem;
}
#loading_overlay div#progress_message_area {
  position: absolute;
  display: none;
  border: solid 1px #999;
  background-color: #cccccc !important;
  top: 10%;
  left: 15%;
  right: 15%;
  width: 70%;
  font-size: 1.2rem;
  text-align: center;
  background: #fff;
  padding: 10px;
  border-radius: 4px;
}

/* ---------------------------------------- */
/* 進捗率のグラフ */
/* ---------------------------------------- */
.pr.around {
  position: relative;
  display: inline-block;
  margin: 1em;
}

.pr.around span {
  color: navy;
}

.pr.around span.outer {
  position: absolute;
  left: 0;
  top: 0;
  width: 60px;
  text-align: center;
  font-size: 5px;
  padding: 10px 0;
}

.pr.around span.value {
  font-size: 18px;
}

/* -------------------------------------------------------------------------- */
/* MENU */
/* -------------------------------------------------------------------------- */
/* ドロップメニュー */
.dropmenu {
  *zoom: 1;
  width: -moz-fit-content;
  width: fit-content;
  width: -webkit-fit-content;
  margin: auto;
  padding: 0;
  display: flex;
}
.dropmenu > li > a:not(:only-child) {
  cursor: default;
}
.dropmenu li {
  background-color: #D8D8D8;
  margin: 0;
  flex-grow: 1;
  position: relative;
  justify-content: flex-end;
}
.dropmenu li:hover:not([disabled]) {
  background-color: #BBDEFB;
}
.dropmenu li:hover:not([disabled]) ul li {
  height: 2rem;
}
.dropmenu li a {
  color: black;
  display: block;
  margin: 0;
  padding: 0.5rem;
  text-decoration: none;
}
.dropmenu li[disabled] a {
  opacity: 0.3;
  cursor: not-allowed;
}
.dropmenu li ul {
  z-index: 999;
  position: absolute;
  top: 100%;
  margin: 0;
  padding: 0;
  min-width: 100%;
}
.dropmenu li ul li {
  min-width: 100%;
  overflow: hidden;
  height: 0;
  transition: 0.2s;
}
.dropmenu li ul li a {
  padding: 0.7rem 1.2rem;
  border-top-style: solid;
  border-top-width: 1px;
  text-align: left;
}
.dropmenu li ul li.separate a {
  border-top-width: 2px;
}

td .dropmenu {
  width: auto;
}
td .dropmenu li ul {
  width: auto;
  left: -8rem;
  border-radius: 20px;
}
td .dropmenu li ul li a {
  border-style: none;
  background-color: #303F9F;
  color: #FFFFFF;
}
td .dropmenu a:hover {
  background-color: #C5CAE9;
  color: #536DFE;
}

/* サイドメニュー */
nav.sidemenu {
  border: solid 1px;
  border-radius: 0.2rem;
  margin-right: 1rem;
}
nav.sidemenu ul {
  padding: 1rem 0.5rem;
  margin: 0;
}
nav.sidemenu ul li ul {
  padding: 0.5rem 1rem;
}
nav.sidemenu a {
  text-decoration: none;
}
nav.sidemenu a:hover {
  font-weight: bold;
}

nav.sidenav {
  margin-right: 5px;
  white-space: nowrap;
}
nav.sidenav ul {
  padding: 0;
}
nav.sidenav ul li {
  margin: 2px;
  padding-left: 1.5rem;
}
nav.sidenav ul li a {
  color: #FFFFFF;
  background-color: #009688;
  display: block;
  text-decoration: none;
  padding: 0.5rem;
}
nav.sidenav ul li a:hover {
  background-color: #B2DFDB;
}
nav.sidenav ul li[disabled] {
  padding-left: unset;
}
nav.sidenav ul li[disabled] a::before {
  content: "→ ";
  color: #FFEB3B;
}

/* コンテキストメニュー */
div[id^=_id_popup_] {
  cursor: pointer;
}
div[id^=_id_popup_] li {
  border: 1px solid transparent;
}
div[id^=_id_popup_] li.separate {
  border-top: 1px solid #a2a2a2;
}
div[id^=_id_popup_] li:hover:not([disabled]) {
  border: 1px solid #78aee5;
  background-color: #d1e2f2;
}
div[id^=_id_popup_] li[disabled] {
  opacity: 0.3;
  cursor: not-allowed;
}

/* -------------------------------------------------------------------------- */
/* FORMのINPUT要素 */
/* -------------------------------------------------------------------------- */
input[type=text], input[type=password], input[type=mail], input[type=number], select, textarea {
  color: #292929;
  font-size: 0.9rem;
  padding: 0.1rem;
  border: solid 1px #bbbbbb;
  border-radius: 0.15rem;
  margin: 0.1rem 0.5rem;
  margin-left: 0;
  /* 大きめ */
}
input[type=text]:focus, input[type=password]:focus, input[type=mail]:focus, input[type=number]:focus, select:focus, textarea:focus {
  border: solid 1px;
}
input[type=text]:disabled, input[type=password]:disabled, input[type=mail]:disabled, input[type=number]:disabled, select:disabled, textarea:disabled {
  background-color: #bbb;
  color: #fff;
}
input[type=text].wide, input[type=password].wide, input[type=mail].wide, input[type=number].wide, select.wide, textarea.wide {
  width: 30rem;
}

/* 背景 */
.back-highlight {
  background-color: #BBDEFB;
}

/* ラベル */
.input label {
  padding-right: 0.4rem;
}
.input label + textarea {
  vertical-align: top;
  width: 70vw;
}

.form label {
  display: inline-block;
  width: 7rem;
}

.form_largelabel label {
  display: inline-block;
  width: 14rem;
}

.form .checkbox label {
  width: inherit;
}

/* ラジオボタン */
.label_radio input[type=radio] {
  display: none;
}
.label_radio input[type=radio]:checked + label {
  color: #448AFF;
}
.label_radio input[type=radio]:checked + label i {
  color: #448AFF;
}
.label_radio label {
  cursor: pointer;
}

input[type=radio] {
  transform: scale(1.5);
}

/* チェックボックス */
input[type=checkbox] {
  transform: scale(1.5);
}

.form .input.checked {
  font-weight: bold;
}

/* スイッチ風チェックボックス */
.switchLabel {
  display: inline-flex;
  margin: auto;
  padding-right: 8px;
  font-size: 0.8rem;
  line-height: 1.2rem;
}

.switchArea {
  text-align: center;
  position: relative;
  margin: auto;
  margin-left: 2px;
  background: rgba(255, 255, 255, 0.4);
  line-height: 1.2rem;
  width: 3.3rem;
}
.switchArea input[type=checkbox] {
  display: none;
}
.switchArea input[type=checkbox]:checked + label {
  border-color: #448AFF;
}
.switchArea input[type=checkbox]:checked + label span:after {
  content: "ON";
  padding: 0 0.8rem 0 0;
  color: #448AFF;
}
.switchArea input[type=checkbox]:checked ~ .swImg {
  transform: translateX(2.1rem);
  background: #448AFF;
}
.switchArea label {
  cursor: pointer;
  display: block;
  box-sizing: border-box;
  border: 2px solid #757575;
  border-radius: 1rem;
  height: 1.2rem;
}
.switchArea label span:after {
  content: "OFF";
  padding: 0 0 0 0.8rem;
  color: #757575;
}
.switchArea .swImg {
  position: absolute;
  width: 0.8rem;
  height: 0.8rem;
  background: #757575;
  top: 4px;
  left: 4px;
  border-radius: 0.5rem;
  transition: 0.2s;
}

/* テーブル風 */
.form .form_table {
  border: solid 1px #bbbbbb;
  border-radius: 0.15rem;
  margin: 0.1rem;
}
.form .form_table .input {
  border-bottom: solid 1px #bbbbbb;
  padding: 5px;
}
.form .form_table .input.checkbox label {
  width: 100%;
}

/* マルチセレクトボックス（ドロップメニュー風） */
.multiselect {
  *zoom: 1;
  width: -moz-fit-content;
  width: fit-content;
  width: -webkit-fit-content;
  margin: auto;
  padding: 0;
  display: inline-block;
}
.multiselect li {
  margin: 0;
  flex-grow: 1;
  position: relative;
  justify-content: flex-end;
}
.multiselect li a {
  background-color: white;
  color: black;
  display: block;
  font-size: smaller;
  margin: 0;
  padding: 0.25rem 0.2rem;
  border-radius: 0.1rem;
  border: solid 1px #a2a2a2;
  text-decoration: none;
}
.multiselect li ul {
  z-index: 999;
  position: absolute;
  top: 100%;
  margin: 0;
  padding: 0;
  min-width: 100%;
  display: none;
}
.multiselect li ul li {
  min-width: 100%;
  overflow: hidden;
  transition: 0.2s;
}
.multiselect li ul li a {
  padding: 5px 1rem;
  border-top-style: solid;
  border-top-width: 1px;
  text-align: left;
}
.multiselect li ul li.separate a {
  border-top-width: 2px;
}

fieldset {
  margin: 0;
}

/* -------------------------------------------------------------------------- */
/* Container */
/* -------------------------------------------------------------------------- */
#main-container {
  flex: 1 0 auto;
  padding: 1rem;
  padding-top: 0.5rem;
}
#main-container .content-wrapper {
  width: auto;
  margin-left: auto;
  margin-right: auto;
}
#main-container .content-wrapper .form-area {
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
  padding: 1rem;
}
#main-container .content-wrapper .form-area table {
  width: auto;
  margin-bottom: 2rem;
}
#main-container .content-wrapper .form-area table td {
  padding: 0.3rem;
}

/* パンくず */
.breadcrumbs, .breadcrumbs li {
  display: inline-block;
  margin: 5px;
}

/* -------------------------------------------------------------------------- */
/* Button */
/* -------------------------------------------------------------------------- */
/* デフォルトのボタン */
.button-default, .button-highlight, .button-small, .button-big {
  color: #212121;
  font-size: 0.9rem;
  line-height: 1.1rem;
  padding: 0.25rem 0.2rem;
  min-width: 6rem;
  text-align: center;
  vertical-align: bottom;
  background: linear-gradient(0deg, #D8D8D8 0%, #ffffff 100%);
  border-radius: 0.1rem;
  border: solid 1px #a2a2a2;
}
.button-default:active, .button-highlight:active, .button-small:active, .button-big:active {
  background: linear-gradient(0deg, #ffffff 0%, #D8D8D8 100%);
}
.button-default:hover, .button-highlight:hover, .button-small:hover, .button-big:hover {
  cursor: pointer;
}
.button-default:disabled, .button-highlight:disabled, .button-small:disabled, .button-big:disabled {
  background: linear-gradient(0deg, #D8D8D8 0%, #ffffff 100%);
  opacity: 0.4;
  cursor: not-allowed;
}

a.button-default, a.button-highlight, a.button-small, a.button-big {
  color: black;
  display: inline-block;
  text-decoration: none;
}

/* 大きめのボタン */
.button-big {
  font-size: 1rem;
  line-height: 1.15rem;
  padding: 0.5rem 0.2rem;
  min-width: 6rem;
}

/* 小さめのボタン */
.button-small {
  font-size: 0.8rem;
  padding: 0.3rem 0.2rem;
  min-width: 3rem;
}

/* 強調ボタン */
.button-highlight {
  background: linear-gradient(0deg, #BBDEFB 0%, #ffffff 100%);
}
.button-highlight:active {
  background: linear-gradient(0deg, #ffffff 0%, #BBDEFB 100%);
}
.button-highlight:disabled {
  background: linear-gradient(0deg, #BBDEFB 0%, #ffffff 100%);
}

/* フラットなボタン */
a.button-flat {
  display: block;
  padding: 3px 0.8rem;
  text-decoration: none;
  white-space: nowrap;
}
a.button-flat i[class^=icon-] {
  color: #448AFF;
}
a.button-flat:hover {
  background: #BBDEFB;
  border-radius: 0.4rem;
}

/* フォントアイコンのボタン */
a.button-icon {
  display: block;
  padding: 3px;
}
a.button-icon i[class^=icon-] {
  color: #448AFF;
  font-size: 1.2rem;
}
a.button-icon:hover {
  background: #BBDEFB;
  border-radius: 0.4rem;
}

/* 浮き出しボタン */
.raised, .dropmenu > li {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}

/* 表示を切り替えるボタン */
.toggle_btn {
  color: white;
  background-color: gray;
  height: -moz-fit-content;
  height: fit-content;
  height: -webkit-fit-content;
  line-height: 1.5rem;
}
.toggle_btn:hover {
  cursor: pointer;
}
.toggle_btn i {
  color: white;
}

/* ここから複数画面で共通の定義 */
.page-title {
  font-size: 1.2rem;
  margin: 0.5rem 2rem 0.5rem 0;
  font-weight: bold;
  text-align: left;
}

h4 {
  border-bottom: solid 1px;
}
h4 span {
  display: inline-block;
  color: #757575;
  font-size: 0.8rem;
  font-weight: normal;
  margin-left: 3rem;
}

.paging {
  width: 100%;
  margin: 3px;
}
.paging span {
  margin: 0 0.5rem;
}

table.common-table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  font-size: 0.9rem;
}
table.common-table tr.row-state-deliver td.col-state {
  color: #dd0000;
}
table.common-table tr.row-state-absence td.col-state {
  color: #F47E00;
}
table.common-table tr.row-state-complete {
  background: #eaeaea;
}
table.common-table tr.row-highlight {
  background: #FFEECC !important;
}
table.common-table th {
  border: 1px solid #aaaaaa;
  background: #cccccc;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  padding: 0.1rem 0.25rem;
}
table.common-table th a {
  color: black;
}
table.common-table td {
  border: 1px solid #cacaca;
  vertical-align: middle;
  text-align: center;
  line-height: normal;
  padding: 0.1rem 0.25rem;
}
table.common-table td.actions {
  width: 2rem;
}
table.common-table td.message {
  border-style: none;
  text-align: left;
  background-color: #f5f9fc;
}
table.common-table td.success {
  color: #0288D1;
}
table.common-table td.error {
  color: #C3232D;
}

.panel-search {
  width: 300px;
  margin-right: 0.4rem;
  /* ブロック検索の条件 */
}
.panel-search input[type=text], .panel-search input[type=mail], .panel-search select, .panel-search textarea {
  width: 95%;
}
.panel-search input, .panel-search select, .panel-search textarea {
  margin-bottom: 10px;
}
.panel-search .submit {
  margin: 10px;
}
.panel-search .condition {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 1px;
}
.panel-search .condition input {
  flex-grow: 1;
  /* margin: 0; */
}
.panel-search .condition input[type=number] {
  width: 3rem;
}
.panel-search .condition input[type=text] {
  width: 5rem;
}
.panel-search .condition .condition-operator {
  padding: 0;
  width: 3.3rem;
}

.panel-content {
  width: calc(100% - 300px);
}

.item-box {
  background-color: #ffffff;
  border: solid 1px #777777;
  overflow: hidden;
  margin: 0;
  text-align: left;
}
.item-box .item-header {
  padding: 0.2rem;
  overflow: auto;
  border-bottom: solid 1px #777777;
  font-weight: bold;
}
.item-box .item-header img {
  height: 1rem;
}
.item-box .item-header a {
  /*color: $theme_color;*/
  margin: 0 0.5rem;
  margin-left: 1rem;
  text-decoration: none;
  font-weight: normal;
}
.item-box .item-body {
  padding: 0.2rem;
  overflow: auto;
}
.item-box .item-body table.common-table {
  width: auto;
  margin: 10px;
}

.box-parent {
  width: 100%;
  display: flex;
}

.box {
  width: auto;
  margin: 0.1rem;
  display: inline-block;
}

.header-large-text {
  font-size: 1.5rem;
}

.inline-item {
  display: inline;
}

#jquery-ui-sortable-tr {
  margin: 0;
}

.jquery-ui-sortable-td:hover {
  cursor: move;
}

.grabbing {
  cursor: move;
  cursor: grab;
}
.grabbing:active {
  cursor: grabbing;
}

/* -------------------------------------------------------------------------- */
/* ダイアログ */
/* -------------------------------------------------------------------------- */
.modalDialog {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  display: none;
  z-index: 1500;
  text-align: center;
}
.modalDialog .dialogTitle {
  margin: 0rem 1.5rem 1rem 1.5rem;
  font-weight: bold;
  border-bottom: 1px solid #BDBDBD;
  text-align: center;
}
.modalDialog > * {
  position: absolute;
  top: 30%;
  left: 30%;
  background-color: #fff;
  border: 2px solid;
  border-radius: 0.5rem;
  box-shadow: 0rem 0rem 5px 3px #000;
  text-align: left;
  padding: 1rem;
}
.modalDialog > *.flat {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border: none;
  box-shadow: none;
  padding: 0rem;
  border-radius: 5px;
  margin: auto;
  width: auto;
  height: auto;
}
.modalDialog > *.flat > i {
  cursor: pointer;
  color: #000;
  font-size: 36px;
  position: absolute;
  top: -35px;
  right: -35px;
  background: #fff;
  display: block;
  text-align: center;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}
.modalDialog > *.flat > i::before {
  margin: 0;
}
.modalDialog > *.flat > img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: auto;
  height: auto;
}

/* -------------------------------------------------------------------------- */
/* DatePicker */
/* -------------------------------------------------------------------------- */
.datepicker {
  width: 120px;
  text-align: center;
}

.fixed_table_wrapper, .fixed_table_wrapper *, .fixed_table_wrapper *::before, .fixed_table_wrapper *::after {
  overflow: auto;
  box-sizing: content-box !important;
}

.fixed_table_wrapper {
  border-bottom: solid 1px #cccccc;
  position: fixed;
  top: 102px;
  right: 0;
  left: 325px;
  bottom: 50px;
}

/* ここから固有の画面（Template）毎の定義 */
/* -------------------------------------------------------------------------- */
/* ログイン画面 */
/* -------------------------------------------------------------------------- */
#login {
  color: #092a8d;
  text-align: center;
}
#login fieldset {
  background: #ffffff;
  box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.4) inset;
  padding: 2rem;
  margin-top: 5vh;
  margin-bottom: 1rem;
  width: 60%;
  display: inline-block;
  color: #212121;
}
#login fieldset .input {
  margin: 0.5rem;
}
#login fieldset button {
  margin-top: 1rem;
}

/* -------------------------------------------------------------------------- */
/* 企業管理画面 */
/* -------------------------------------------------------------------------- */
/* テーマ選択のradio */
input[type=radio][name=header_color] {
  display: none;
}
input[type=radio][name=header_color]:checked + label {
  border: 1px solid #000;
  box-shadow: 3px 3px 3px #000 inset;
}
input[type=radio][name=header_color]:checked + label::before {
  content: "✔";
}

.theme-div {
  cursor: pointer;
  width: 3rem;
  height: 2rem;
  padding: 0.5rem;
  margin: 0.2rem;
  border-radius: 0.5rem;
  box-shadow: 3px 3px 3px #000;
  float: left;
  text-align: center;
}

/* 企業アイコンのドラッグ＆ドロップ用 */
.file_dd {
  border: 2px dotted #0B85A1;
  width: 15rem;
  min-height: 2rem;
  color: #92AAB0;
  text-align: left;
  vertical-align: middle;
  margin: 5px 20px 5px 0;
  display: inline-block;
}

#print_img {
  border: 1px solid #0B85A1;
}

/* ブロック表示モード編集画面 */
#meta .color:not(.meta, .input) {
  display: none;
}

/* -------------------------------------------------------------------------- */
/* ページ一覧画面 */
/* -------------------------------------------------------------------------- */
.list-page {
  display: flex;
  flex-wrap: wrap;
}

.thumbnail-page {
  background-color: #ffffff;
  border: solid 1px #808080;
  vertical-align: middle;
  padding: 2px;
}

.temporary_page {
  background-color: #D8D8D8;
}

.no-image {
  pointer-events: none;
}

.page-image img {
  border: solid 1px gray;
}

.page-image, .block_image_box {
  position: relative;
  text-align: center;
}
.page-image p.no-image, .block_image_box p.no-image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 0;
  font-weight: 700;
}

.page-icons {
  display: flex;
  height: 1rem;
}
.page-icons i.block-updated {
  display: none;
  color: rgba(255, 0, 0, 0.8);
}
.page-icons svg.block-overlap {
  fill: rgba(255, 0, 0, 0.5);
  stroke: red;
  width: 1.2rem;
}
.page-icons i.exist-sticky-mark {
  color: rgba(242, 238, 0, 0.8);
}
.page-icons i.need-update-margin {
  color: rgba(43, 130, 37, 0.8);
}

/* -------------------------------------------------------------------------- */
/* 全ページ画面 */
/* -------------------------------------------------------------------------- */
.page-frame {
  overflow: auto;
  height: calc(100vh - 12rem);
}

.all-page {
  display: flex;
  flex-wrap: wrap;
  transform-origin: left top;
}

.two-face-page {
  display: flex;
  margin-bottom: 40px;
}

/* -------------------------------------------------------------------------- */
/* ページ編集画面 */
/* -------------------------------------------------------------------------- */
#layout_area {
  display: flex;
}
#layout_area > div.flex_main {
  flex: 1 1 auto;
  border: solid 1px #777777;
  width: 100%;
  height: calc(100vh - 7rem);
  overflow: hidden;
  margin: 0 3px;
}
#layout_area > div.flex_side {
  display: flex;
}

/* ------------------------------------ */
#batch_sending_form {
  display: none;
  border: solid 1px #aaa;
  width: 100%;
  height: 200px;
}