@charset "UTF-8";
/* CSS Document */

/*========================================================
  利用規約
*/
.term-box {
  height: 340px;
  overflow-y: auto;
  text-align: left;
  margin-top: 20px;
  border: #e9e8ec 1px solid;
  padding: 20px;
}

/*========================================================
  検索
*/
/*検索条件*/
.search-condition {
  display: flex;
    -webkit-flex-wrap: nowrap;
  flex-wrap: wrap;
  margin: 0 -10px
}
.search-condition li {
  display: flex;
  flex-wrap: wrap;
  /*align-items: center;*/
  font-size: 1.2rem;
  margin: 5px 10px;
}
/*flex-basis：ベースの幅*/
.fx-base-w-200 {
    -ms-flex-preferred-size: 200px;
  flex-basis: 200px;
}
.fx-base-w-300 {
    -ms-flex-preferred-size: 300px;
  flex-basis: 300px;
}
.fx-base-w-400 {
    -ms-flex-preferred-size: 400px;
  flex-basis: 400px;
}
.fx-base-w-500 {
    -ms-flex-preferred-size: 500px;
  flex-basis: 500px;
}
.fx-base-w-600 {
    -ms-flex-preferred-size: 600px;
  flex-basis: 600px;
}
/*flex-grow：伸び率*/
.fx-grow-2 {
    -webkit-box-flex: 2;
    -ms-flex-positive: 2;
  flex-grow: 2;/*デフォルト値: 0*/
}

/*検索条件の項目名*/
.search-condition li .label {
  background-color: #e6e8e8;
  display: inline-block;
  padding: 0.7rem 1rem;
  margin-right: 5px; 
}
/*検索条件のフォーム全体（親）*/
.form-content {
  display: flex;
  flex-wrap: nowrap;/*子要素折り返さない*/
  align-items: center;/*子要素を上下中央にそろえる*/
}
.form-content > *:not([type="checkbox"]):not([type="radio"]) {
  margin: 0 10px 0 0;
}
/*.form-content　内で右寄せ*/
.form-content .form-content-right {
  margin: 0 0 0 auto !important;
}
/* 製本の画像付きラジオボタンがモーダル幅を超える場合に自動的に折り返す */
.form-content.bookbinding-container {
  flex-wrap: wrap;
  align-items: flex-start;
}
/* テキストボックスの前後に付ける接尾辞などを折り返さず表示 */
.txt-suffix {
  white-space: nowrap;
  display: inline-block;
  margin-left: 4px;
}

/*Tableの固定列幅*/
.tbl .w-icon {
  width: 48px;
  white-space: nowrap;
}
.tbl .w-iconx2 {
  width: 96px;
  white-space: nowrap;
}
.tbl .w-switch {
  width: 60px;
}
.tbl .w-icon-wrap {
  width: 48px;
}

/*要素を分割する*/
ul.divide-wrap {
  overflow: hidden;
  margin: -5px;
}
ul.divide-wrap > li {
  display: inline-block;
  margin: 5px;
}

/*タブ ページ切り替え*/
#tab-menu {
  margin-bottom: 20px;
}
#tab-menu .tab-btn {
  position: relative;
  float: left;
  display: inline-block;
  width: 210px;
  height: 40px;
  line-height: 40px;
  border-radius: 0.3rem;
  text-align: center;
  margin-right: 6px;
  margin-bottom: 4px;
  transition: .4s;
}
#tab-menu .tab-btn:not(.is-active) {
  background-color: #ced3d2;
  color: #FFF;
}

#tab-menu .tab-btn.is-active {
  background-color: var(--col-01);
  color: #FFF;
}
#tab-menu .tab-btn:not(.is-active):hover{
  background-color: var(--col-01);
  color: #FFF;
}
#tab-menu .tab-btn a {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #fff;
}
#tab-menu .tab-btn:hover a {
  color: #fff;
}

/* 無効化されたタブのスタイル */
#tab-menu .tab-disabled {
  pointer-events: none; /* クリックイベントを無効化 */
  opacity: 0.5;
}
#tab-menu .tab-disabled.tab-btn:not(.is-active):hover {
  background-color: #ced3d2 !important; /* ホバー時も通常の非アクティブ色を維持 */
  color: #333 !important;
}
#tab-menu .tab-disabled a {
  color: #999 !important;
  cursor: not-allowed;
}
#tab-menu .tab-disabled.tab-btn:hover a {
  color: #999 !important; /* ホバー時も同じ色 */
}

#tab-menu .tab-btn02 {
  position: relative;
  float: left;
  display: inline-block;
  width: 140px;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  text-align: center;
  margin-right: 6px;
  margin-bottom: 4px;
  transition: .4s;
  color: #FFF;
}
#tab-menu .tab-btn02:not(.is-active) {
  background-color: #ced3d2;
}
#tab-menu .tab-btn02.is-active {
  background-color: var(--col-01);
}
#tab-menu .tab-btn02:not(.is-active):hover{
  background-color: var(--col-01);
}

/*タブ切り替え*/
#js-tab-menu {
  margin-bottom: 20px;
}
#js-tab-menu .js-tab-btn {
  display: inline-block;
  padding: 0.6em 2.5em;
  line-height: 1.4;
  border-radius: 0.3rem;
  cursor: pointer;
  transition: .4s;
}
#js-tab-menu .js-tab-btn:not(.is-active) {
  background-color: #e9e4fd;
}
#js-tab-menu .js-tab-btn.is-active {
  background-color: #5948a2;
  color: #FFF;
}
#js-tab-menu .js-tab-btn:not(.is-active):hover{
  background-color: #7767bd;
  color: #FFF;
}
.js-tab-body {
  display: none;
}

/*最終更新日時*/
.last-update {
  font-size: 1.2rem;
  line-height: 1.4;
}
.last-update span {
  display: inline-block;
  margin-left: 10px;
}

/*コメント一覧*/
.comment-close {
  display: none;
}
.comment-tbl {
  display: table;
  width: 100%;
}
.comment-tbl .comment-tbl-box {
  display: table-cell;
  padding: 10px;
}
.comment-tbl .comment-tbl-box:nth-child(1) { width: 20%;}
.comment-tbl .comment-tbl-box:nth-child(2) { width: 50%;}
.comment-tbl .comment-tbl-box:nth-child(3) { width: 20%; text-align: right;}
.comment-tbl .comment-tbl-box:nth-child(4) { width: 40px; text-align: right;}
.comment-tbl .comment-tbl-box:nth-child(5) { width: 40px; text-align: right;}

/*アイコンのみが入る場合padding分のマージンを調整*/
.comment-tbl .comment-tbl-box.icf-box {
  padding: 0;
}

/*開閉するボックス*/
.open-comment-box {
  display: none;
  border: 1px solid #e6e8e8;/*e4e3ec*/
  padding: 15px 30px;
  background-color: #fff;
  width: 100%;
}
.open-comment-box li {
  position: relative;
  overflow: hidden;
  padding: 8px 0;
  border-bottom: 1px dotted #e6e8e8;/*e4e3ec*/
}
.open-comment-box li .float-item {
  display: inline-block;
  float: left;
  width: 140px;
}
.open-comment-box li .float-txt {
  overflow: hidden;
  padding-right: 40px;
}
/*========================================================
  エラーページ, 通知ページ
*/
.error-message {
  font-size: 2.0rem;
  color: #ff7676;
  display: inline-block;
  position: relative;
  padding: 60px 0 10px;
  margin-bottom: 20px;
}
.error-message::before {
  font-family: 'icf';
  font-size: 4.0rem;
  content: "\e909";
  position: absolute;
  top: 0;
  left: 50%;
	transform: translateX(-50%);
  color: #ff9797;
  display: block;
  margin: 0 auto;
}
.error-message::after {
  background-color: #FFD5D5;
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
	transform: translateX(-50%);
  width: 80%;
  height: 3px;
  display: block;
  margin: 0 auto;
}

.notice-message {
  font-size: 2.0rem;
  color: #00b976;
  display: inline-block;
  position: relative;
  padding: 60px 0 10px;
  margin-bottom: 20px;
}
.notice-message::before {
  font-family: 'icf';
  font-size: 4.0rem;
  content: "\e909";
  position: absolute;
  top: 0;
  left: 50%;
	transform: translateX(-50%);
  color: #baf1b6;
  display: block;
  margin: 0 auto;
}
.notice-message::after {
  background-color: #baf1b6;
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
	transform: translateX(-50%);
  width: 80%;
  height: 3px;
  display: block;
  margin: 0 auto;
}
/*案件詳細[進行一覧]のモーダル内*/
.input-result-bg {
  background-color: #d7d7de!important;
}
.input-result-box {
  margin: -5px;
}
.input-result-box li {
  background-color: #fff;
  /*border: #dfdfe3 1px solid;*/
  border-radius: 4px;
  display: inline-block;
  margin: 5px;
  font-size: 1.2rem;
  padding: 0 10px;
  vertical-align: middle;
  height: 28px;
  line-height: 28px;
  color: #777;
}
.input-result-box li:first-child {
  width: 20%;
}
.input-result-box li:nth-child(2) {
  width: 60%;
}
/*ボタンとセットの場合*/
.input-result-wrap {
  overflow: hidden;
  position: relative;
}
.input-result-wrap .btn {
  position: absolute;
  right: 0;
  top: 1px;
}

/*AOL項目の右アイコンありバージョンのtd*/
.aol-box {
  padding-right: 90px;
}

/*左右のボックス間で項目を移動するレイアウト*/
.move-items-box {
  display: flex;
  -webkit-box-pack: justify;
     -ms-flex-pack: justify;
   justify-content: space-between;/*水平方向割り付け*/
  -webkit-box-align: center;
     -ms-flex-align: center;
        align-items: center;/*垂直方向中央*/
}
.move-items-box .items-box {
  background-color: #fff;
  /*border: #ddd 1px solid;*/
  width: 260px;
  /*height: 160px;
  overflow-y: auto;
  padding: 10px 0;*/
}
.move-items-box .items-box li {
  padding: 6px 15px;
}
.move-items-box .items-box li:hover {
  background-color: #f2f0fb;
  color: #684de2;
}
.move-items-box .items-box select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  border: #ddd 1px solid;
  padding: 5px
}
.move-items-box .items-box select option {
  padding: 2px
}

.header .env-style {
  font-size:1.5rem; 
  color:#fff;
}

.message-box {
  height: 200px;
  overflow-y: scroll;
  word-break: break-all;
  }