/* ---------- 覚書メモ ---------- 
   　　半角スペース
   　　半角スペースよりやや広いスペース
   　　全角スペース
   　半角よりさらに小さいスペース
   ---------- 覚書メモ ---------- */

/* ~~ この固定幅コンテナが他のすべてのエレメントを囲みます。~~ */
.container {
  width: 640px;
  background-color: #FFF;
  margin: 0 auto;
  /* 幅に加え、両側を自動値とすることで、レイアウトが中央に揃います。 */
}

.full-screen {
  height: 100vh;
  /* ビューポートの高さを100%に設定 */
  display: flex;
  /* コンテンツを中央配置するためにFlexboxを使用 */
  align-items: center;
  justify-content: center;
  background-color: #e6feff;
  /* 背景色 */
  color: rgb(0, 0, 0);
  /* テキストの色 */
  text-align: center;
}

/* 日付入力CSS */
input[type="date"] {
  font-size: 18px;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 150px;
  height: 30px;
  background-color: #ffffff;
}


.Underline-Warning {
  width: 200px;
  height: 40px;
  padding: 5px;
  border: 1px solid #ccc;
  background: linear-gradient(to bottom,
      transparent 0%,
      /* 上から */
      transparent 85%,
      /* 85%まで透明 */
      #ffc107 85%,
      /* 85%に色（黄色） */
      #ffc107 100%);
}

.Underline-Yellow {
  width: 200px;
  height: 40px;
  padding: 5px;
  border: 1px solid #ccc;
  background: linear-gradient(to bottom,
      transparent 0%,
      /* 上から */
      transparent 85%,
      /* 85%まで透明 */
      #ff8811 85%,
      /* 85%に色（黄色） */
      #ff8811 100%);
}

.Underline-Blue {
  width: 200px;
  height: 40px;
  padding: 5px;
  border: 1px solid #ccc;
  background: linear-gradient(to bottom,
      transparent 0%,
      /* 上から */
      transparent 85%,
      /* 85%まで透明 */
      #48acff 85%,
      /* 85%に色（青色） */
      #48acff 100%);
}

.Underline-Red {
  width: 200px;
  height: 40px;
  padding: 5px;
  border: 1px solid #ccc;
  background: linear-gradient(to bottom,
      transparent 0%,
      /* 上から */
      transparent 85%,
      /* 85%まで透明 */
      #ff8a8a 85%,
      /* 下85%に色（薄い赤色） */
      #ff8a8a 100%);
}

.Underline-Red2 {
  width: 200px;
  height: 40px;
  padding: 5px;
  border: 1px solid #ccc;
  background: linear-gradient(to bottom,
      transparent 0%,
      /* 上から */
      transparent 85%,
      /* 85%まで透明 */
      #ff0000 85%,
      /* 下85%に色（赤色） */
      #ff0000 100%);
}

.Underline-Gold {
  width: 200px;
  height: 40px;
  padding: 5px;
  border: 1px solid #ccc;
  background: linear-gradient(to bottom,
      transparent 0%,
      /* 上から */
      transparent 85%,
      /* 85%まで透明 */
      #FFD700 85%,
      /* 85%に色（黄色） */
      #FFD700 100%);
}

.Status-Box {
  width: 400px;
  min-height: 20px;

  /* 文字 */
  font-size: 14px;
  line-height: 1.6;
  color: #333;

  /* 文字位置 */
  text-align: left;
  /* 左寄せ */
  /* 上詰めを確実にする */
  display: block;

  /* 行間 */
  line-height: 1.2;

  /* 余白 */
  padding: 5px;


  /* 背景 */
  background-color: #f2f2f2;

  /* 凹み3D枠 */
  border-top: 2px solid #999;
  border-left: 2px solid #999;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  /*より凹ませたい場合*/
  box-shadow: inset 2px 2px 4px rgba(0, 0, 0, 0.2);
  /* 角を少し丸く */
  border-radius: 6px;


  /* 複数行対応 */
  white-space: pre-wrap;
}

/*テキスト配置 縦横ともに中央揃え*/
.center-box {
  display: flex;
  justify-content: center;
  /* 横中央 */
  align-items: center;
  /* 縦中央 */
  height: 150px;
  /* 高さが必要 */
  border: 1px solid #999;
}

/*  ブロック要素の配置を中央にするためのスタイルを Bootstrapのバージョンにより変更
   .left-align-cell  { /*Bootstrap_V4 以前はコレ
   .left-align-cell , .text-left { /*Bootstrap_V5 以降はコレ
*/

/* ブロック要内 配置設定 */
.left-align-cell {
  /*Bootstrap_V4 以前は有りダブルため, 「.text-left」 */
  /* Bootstrap5 .text-start と同等 */
  text-align: left;
}

.right-align-cell {
  /*Bootstrap_V4 以前は有りダブルため 「,  .text-right」 */
  /* Bootstrap5 .text-end と同等 */
  text-align: right;
}

.center-align-cell {
  /*Bootstrap_V4 以前は有りダブルため 「,  .text-right」 */
  /* Bootstrap5 .text-end と同等 */
  text-align: center;
}

.styleYen {
  text-align: right !important;
}

.styleYen0 {
  font-family: 'Courier New', 'Monaco', 'Osaka-Mono', 'Consolas', monospace;
  text-align: right !important;
}

/* テーブルセル内などで横スクロールを可能にするスタイル */
.scrollable-cell {
  overflow-x: auto;
  /* 横スクロールを可能にする */
  white-space: nowrap;
  /*  テキストを折り返さない */
}

/* 表示用のテキストボックスのスタイル スロールバー無 */
.dispTextBox {
  border: none;
  /* 枠線を消す */
  background: transparent;
  /* 背景を透過 */
  outline: none;
  /* フォーカスアウトラインを消す（下で代替推奨） */
  box-shadow: none;
  /* ブラウザ固有の影を消す */
  -webkit-appearance: none;
  /* iOS/Safari のデフォルトスタイル抑制 */
  appearance: none;
  /* 標準プロパティで互換性向上 */
  color: inherit;
  /* 親の色を継承 */
  padding: 0;
  /* 必要なら調整 */
  caret-color: transparent;
  /* カーソル（点滅）を非表示に（読み取り専用なら違和感少ない） */
  background-image: none;
  /* 何か画像が入る場合の対策 */
}

/* 類似名称 popup表示用 */
.popupWindow {
  display: none;
  /*width: 300px;
  height: 500px;*/
  min-width: 200px;
  /* 最小幅 */
  max-width: 350px;
  /* 最大幅 */
  min-height: 50px;
  /* 最小高さ */
  max-height: 500px;
  /* 最大高さ */
  overflow: auto;
  /* コンテンツが溢れた場合にスクロールを表示 */
  position: absolute;
  background-color: #ffcaca;
  border: 3px solid #ff0000;
  padding: 10px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  white-space: nowrap;
  z-index: 99;
}


/* ポップアップフレーム popup-frame*/
.popup-frame {
  position: absolute;
  width: 250px;
  height: 100px;
  padding: 10px 10px 10px 10px;
  background-color: #fcfcfc;
  border: 2px solid #000000;
  border-radius: 10px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
  font-size: 16px;
  transition: all 0.3s ease;
  /* 滑らかにアニメーション */
  z-index: 1000;
}

.color-Kaikou {
  background-color: #ffd3ae !important;
}

.color-kaiko {
  background-color: #ffd2fb;
  font-weight: bold;
}


.PropertySetting-frame {
  position: absolute;
  /*
  width: 240px;
  height: 90px;
  padding: 30px 10px 10px 10px;*/
  background-color: #ffed4e;
  border: 2px solid #3e5bff;
  border-radius: 5px;
  /*box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
  font-size: 16px;
  transition: all 0.3s ease;
  z-index: 1000;*/
}

.popup-type1 {
  position: absolute;
  width: 240px;
  height: 90px;
  padding: 30px 10px 10px 10px;
  background-color: #ff9a9a;
  border: 5px solid #c90000;
  border-radius: 16px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
  font-size: 16px;
  transition: all 0.3s ease;
  /* 滑らかにアニメーション */
  z-index: 1000;
}

.popup-type2 {
  position: absolute;
  width: 240px;
  height: 90px;
  padding: 30px 10px 10px 10px;
  background-color: #b8ffb8;
  border: 5px solid #c90000;
  border-radius: 16px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
  font-size: 16px;
  transition: all 0.3s ease;
  /* 滑らかにアニメーション */
  z-index: 1000;
}

.toggle-btn {
  position: absolute;
  top: 3px;
  left: 3px;
  padding: 4px 10px;
  font-size: 12px;
  border: none;
  border-radius: 8px;
  background-color: #7fa650;
  color: white;
  cursor: pointer;
}

.Search-btn {
  padding: 4px 10px;
  font-size: 12px;
  border: none;
  border-radius: 8px;
  background-color: #48acff;
  color: #e5ff00;
  cursor: pointer;
}

.Apply-btn {
  padding: 4px 10px;
  font-size: 12px;
  border: none;
  border-radius: 8px;
  background-color: #ff4848;
  color: #e5ff00;
  cursor: pointer;
}

.btnHelp {
  width: 25px;
  height: 25px;
  line-height: 20px;
}

.btnHelp a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  background: #88edff;
  text-align: center;
  border: 1px solid #000000;
  color: #2d0fd8;
  font-size: 22px;
  font-weight: bold;
  border-radius: 7px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
}

.btnHelp a:hover {
  background: #0cc6ff;
  color: #000000;
  margin-left: 0px;
  margin-top: 0px;
  border: 2px solid #000000;
  box-shadow: none;
  text-decoration: none;
}


.btnHelp2 {
  width: 160px;
  height: 30px !important;
  line-height: 27px !important;
}

.btnHelp2 a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  text-decoration: none !important;
  background: #0057F5 !important;
  text-align: center !important;
  border: 2px solid #000000;
  color: #FFFFFF !important;
  font-size: 16px !important;
  font-weight: bold !important;
  border-radius: 50px !important;
  -webkit-border-radius: 50px !important;
  -moz-border-radius: 50px !important;
  box-shadow: 1px 1px 0px 1px #B8B8B8 !important;
  transition: all 0.5s ease !important;
}

.btnHelp2 a:hover {
  background: #80ffff !important;
  color: #000000 !important;
  margin-left: 0px !important;
  margin-top: 0px !important;
  border: 2px solid #000dff !important;
  box-shadow: 1px 1px 0px 1px #B8B8B8 inset !important;
}

.btn-Link01 {
  color: #fff !important;
  background-color: #28a745 !important;
  font-weight: normal;
  transition:
    transform 0.1s ease,
    box-shadow 0.1s ease,
    background-color 0.1s ease,
    font-weight 0.1s ease;
  /* 黒枠 */
  border: 1px solid #000 !important;
  /* グレーの影（浮いて見える） */
  box-shadow: 2px 2px 0 #999;
  /* アニメーション */
  transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.1s ease;
}

/* hover（マウスを乗せたとき） */
.btn-Link01:hover {
  color: #000 !important;
  background-color: #2fc24f !important;
  font-weight: bold;
  /* 黒枠 */
  border: 2px solid #000 !important;
  /* 沈む */
  transform: translate(1px, 1px);
  /* 影を消す */
  box-shadow: none;
}

/* 押している最中（active） */
.btn-Link01:not(:disabled):not(.disabled):active,
.btn-Link01:not(:disabled):not(.disabled).active {
  background-color: #1e7e34 !important;
  /* さらに押し込まれた感じ */
  transform: translate(2px, 2px);
  box-shadow: none;
}

/* フォーカス */
.btn-Link01:focus,
.btn-Link01.focus {
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

/* 無効状態 */
.btn-Link01.disabled,
.btn-Link01:disabled {
  color: #fff;
  background-color: #28a745;
  border-color: #000;
  box-shadow: none;
  cursor: not-allowed;
}

.btn-Link01 {
  color: #fff !important;
  background-color: #28a745 !important;
  font-weight: normal;
  transition:
    transform 0.1s ease,
    box-shadow 0.1s ease,
    background-color 0.1s ease,
    font-weight 0.1s ease;
  /* 黒枠 */
  border: 1px solid #000 !important;
  /* グレーの影（浮いて見える） */
  box-shadow: 2px 2px 0 #999;
  /* アニメーション */
  transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.1s ease;
}

/* hover（マウスを乗せたとき） */
.btn-Link02:hover {
  color: #000 !important;
  background-color: #dc3545 !important;
  font-weight: bold;
  /* 黒枠 */
  border: 2px solid #000 !important;
  /* 沈む */
  transform: translate(1px, 1px);
  /* 影を消す */
  box-shadow: none;
}

/* 押している最中（active） */
.btn-Link02:not(:disabled):not(.disabled):active,
.btn-Link02:not(:disabled):not(.disabled).active {
  background-color: #c82333 !important;
  /* さらに押し込まれた感じ */
  transform: translate(2px, 2px);
  box-shadow: none;
}

/* フォーカス */
.btn-Link02:focus,
.btn-Link02.focus {
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

/* 無効状態 */
.btn-Link02.disabled,
.btn-Link02:disabled {
  color: #fff;
  background-color: #bd2130;
  border-color: #000;
  box-shadow: none;
  cursor: not-allowed;
}





.checkbox-group label {
  display: flex;
  /* labelをFlexコンテナにする */
  align-items: center;
  /* 子要素（チェックボックスとテキスト）を垂直方向に中央揃え */
  gap: 5px;
  /* チェックボックスとテキストの間にスペースを追加（任意） */
}

/* チェックボックスの幅が固定されるようにすることも可能 */
.checkbox-group input[type="checkbox"] {
  flex-shrink: 0;
  /* チェックボックスが縮まないようにする */
}

/*
input[readonly] {
	color: #bc417a !important;;
	background-color: #E2E8E7 !important;;
	cursor: not-allowed;
}
*/
/*
input[readonly].schedule-input-style{
  background-color: #ffffff;
  cursor: not-allowed;
}
*/


/* 点線 */
.dotline {
  border-top: 1px dotted #333333;
  border-bottom: none;
  border-right: none;
  border-left: none;
  color: #FFFFFF;
}

/* 画像配置 */
.imagebox_r {
  float: right;
  margin-left: 10px;
  margin-top: 5px;
  font-size: 100%;
  text-align: center;
  line-height: 13pt;
  color: #996600;
}

.imagebox_l {
  float: left;
  margin-right: 10px;
  margin-top: 5px;
  font-size: 100%;
  text-align: center;
  line-height: 13pt;
  color: #996600;
}

.imagebox_l2 {
  float: left;
  margin-right: 5px;
  margin-top: 0px;
  font-size: 100%;
  text-align: center;
  line-height: 13pt;
  color: #996600;
}




/*	テキスト	*/
.text {
  font-size: 80%;
  line-height: 150%;
  color: #000000
}

/* 全体 */
div.left {
  text-align: left;
}

div.center {
  text-align: center;
}

div.right {
  text-align: right;
}

div_m1 {
  width: 300px;
  /* 全体幅 */
  height: 50px;
  /* 全体高さ */
  text-align: center;
  /* 文字を中央 */
  line-height: 150%;
  /* 行の高さ */
  position: absolute;
}

/* テキスト均等割り付け*/
.text-evenly {
  /*background-color: #A2E9EF !important;*/
  /*font-size: 14px !important; */
  /* 1rem=16px */
  font-weight: Bold !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  text-align-last: justify !important;
}


/*枠外を表示しない */
.Over-Hidden {
  overflow: hidden;
  height: auto;
}

/* ナヴィゲーションバー ssを定義して縮小化するサイズを小さくする*/

@media (max-width: 299.98px) {

  .navbar-expand-ss>.container,
  .navbar-expand-ss>.container-fluid {
    padding-right: 0;
    padding-left: 0;
  }
}

@media (min-width: 300px) {
  .navbar-expand-ss {
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .navbar-expand-ss .navbar-nav {
    -ms-flex-direction: row;
    flex-direction: row;
  }

  .navbar-expand-ss .navbar-nav .dropdown-menu {
    position: absolute;
  }

  .navbar-expand-ss .navbar-nav .nav-link {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
  }

  .navbar-expand-ss>.container,
  .navbar-expand-ss>.container-fluid {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
  }

  .navbar-expand-ss .navbar-collapse {
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }

  .navbar-expand-ss .navbar-toggler {
    display: none;
  }
}

@media (max-width: 767.98px) {

  .navbar-expand-md>.container,
  .navbar-expand-md>.container-fluid {
    padding-right: 0;
    padding-left: 0;
  }
}


/* メニューのスタイル */
.fixed-menu0 {
  position: fixed;
  /* 固定 */
  top: 0;
  /* 上から0px */
  left: 0;
  /* 左から0px */
  width: 1000px;
  /* 幅 */
  /*background-color: #333;*/
  /* 背景色 */
  color: white;
  /* テキスト色 */
  padding: 10px;
  /* 内側の余白 */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
  /* 影 */
}

/* 固定メニュー */
.fixed-menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: #ad7272;
  color: white;
  padding: 10px 15px;
  z-index: 1030;
  width: auto;
  /* 必要に応じて調整 */
  font-size: 16px;
  /* 拡大時も読みやすいサイズに */
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
  /* 影 */
}

/* 固定用のスタイル（カスタマイズ可能） */
.fixed-top-left {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1030;
  /* Bootstrapのz-index基準 */
}

/*
position: fixed;
top: 0;
left: 0;
background-color: #333;
color: white;
padding: 10px 15px;
z-index: 1000;
*/


/* メニューバーのスタイル */
.menu-bar {
  position: fixed;
  /* 上部に固定 */
  top: 0;
  /* 上端に配置 */
  left: 0;
  /* 左端に配置 */
  width: 500px;
  /* 100%:横幅を画面いっぱいに設定 */
  /*background-color: #444;*/
  /* 背景色 */
  color: white;
  /* テキストの色 */
  padding: 10px 0;
  /* 上下の余白 */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
  /* 影を追加 */
  z-index: 1000;
  /* 他の要素より前面に表示 */
  display: flex;
  /* 横並び配置 */
  justify-content: center;
  /* 中央揃え */
}

/* メニュー内のリンク */
.menu-bar a {
  color: white;
  /* リンクの色 */
  text-decoration: none;
  /* 下線を削除 */
  margin: 0 15px;
  /* 左右の間隔 */
  font-size: 16px;
  /* テキストサイズ */
}

.menu-bar a:hover {
  text-decoration: underline;
  /* ホバー時に下線を追加 */
}

.MenuBox {
  position: relative;
  height: 40px;
  width: 370px;
  left: 0px;
  top: 0px;
}

.MenuBox2{
  position: relative;
  height: 40px;
  width: 300px;
  left: 0px;
  top: 0px;
}

.FixW {
  overflow: hidden;
  width: 100px;
  height: 20px;
  /* 	background-color:#FF0;*/
}

.frmBox {
  height: 20px;
  width: 100px;
  background-color: #FCC;
  position: absolute;
}

.frmBox2 {
  top: 0px;
  left: 0px;
  height: 20px;
  width: 100px;
  /*	background-color: #FCC;	*/
  padding-top: 2px;
  padding-bottom: 2px;
  vertical-align: middle;
}

.BoxBase {
  height: 20px;
  width: 100px;
  position: relative;
}

.BoxFree {
  position: relative;
  height: auto;
  width: auto;
  text-align: left;
}

.BoxCenter {
  height: 20px;
  width: 100px;
  position: relative;
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
}

.BoxLocate {
  position: absolute;
  width: 10px;
  height: 10px;
  left: 0px;
  right: 0px;
  margin: 0px;
  text-align: left;
}

.BoxPos {
  position: absolute;
  width: 10px;
  height: 10px;
  left: 0px;
  right: 0px;
  margin: 0px;
  text-align: left;
}

.BoxPos0 {
  position: absolute;
  left: 0px;
  right: 0px;
  overflow: visible;
  line-height: 160%;
}

.BoxLabel {
  position: absolute;
  left: 0px;
  right: 0px;
  overflow: visible;
  background-color: rgba(255, 255, 255, 1);
  border: 1px groove rgba(153, 153, 153, 1);
}

a.LstPrdct {
  text-decoration: none !important;
  /* リンク部分の下線を消す */
  /*    text-decoration: underline;        */
  /* リンク部分の下線を消す */
}

a.LstPrdct:link {
  color: #000000;
}

/* まだ見ていないリンク色 */
a.LstPrdct:visited {
  color: #000000;
}

/* 既に見たリンク色 */
a.LstPrdct2 {
  text-decoration: none !important;
  /* リンク部分の下線を消す */
  display: block;
  /*    text-decoration: underline;        */
  /* リンク部分の下線を消す */
}

a.LstPrdct2:link {
  color: #000000;
}

/* まだ見ていないリンク色 */
a.LstPrdct2:visited {
  color: #000000;
}

a.LstPrdct2:hover {
  color: #000000;
  background-color: #CCFFFF;
  position: relative;
  top: 1px;
  left: 1px;
}

a.LstPrdct2:active {
  color: #000000;
}


/* 既に見たリンク色 */
a.LstPrdct3 {
  text-decoration: none !important;
  /* リンク部分の下線を消す */
  display: block;
  /*    text-decoration: underline;        */
  /* リンク部分の下線を消す */
}

a.LstPrdct3:link {
  color: #000000;
  background-color: #ccffff;
}

/* まだ見ていないリンク色 */
a.LstPrdct3:visited {
  color: #000000;
}

a.LstPrdct3:hover {
  color: #000000;
  background-color: #30ffff;
  position: relative;
  top: 1px;
  left: 1px;
}

a.LstPrdct3:active {
  color: #000000;
}




/* 既に見たリンク色 */
/* リンク装飾 */
a:link {
  color: blue;
}

/* a:visited { color: #333333; } */
a:hover {
  color: #0066ff;
  background-color: #CCFFFF;
  position: relative;
  top: 1px;
  left: 1px;
}

a:active {
  color: #0066ff;
}

/* リンクの幅拡大 */
a.widelink {
  display: block;
}

/* ▼リンクの上にマウスが載った際の装飾(背景色だけ指定) */
/*
.sample a:hover { background-color: #fcfcaa; }
*/

/* リンク部分 */
a.MenuButton {
  text-align: center;
  display: block;
  /* リンクをブロックに変換 */
  height: 40px;
  width: 370px;
  line-height: 250%;
  text-decoration: none;
  /* リンク部分の下線を消す */
  border-left: solid 1px #cccccc;
  /* 左罫線 */
  border-top: solid 1px #cccccc;
  /* 上罫線 */
  border-right: solid 2px #808080;
  /* 右罫線 */
  border-bottom: solid 2px #808080;
  /* 下罫線 */
  background-color: #c0c0c0;
  /* 背景色 */
}

a.MenuButton:link {
  color: #000000;
}

/* まだ見ていないリンク色 */
a.MenuButton:visited {
  color: #000000;
}

/* 既に見たリンク色 */
a.MenuButton:hover {
  border-left: solid 2px #808080;
  /* 左罫線 */
  border-top: solid 2px #808080;
  /* 上罫線 */
  border-right: solid 1px #cccccc;
  /* 右罫線 */
  border-bottom: solid 1px #cccccc;
  /* 下罫線 */
}

/* リンク部分 */
a.MenuButton2 {
  text-align: center;
  display: block;
  /* リンクをブロックに変換 */
  height: 40px;
  width: 370px;
  line-height: 250%;
  text-decoration: none;
  /* リンク部分の下線を消す */
  border-left: solid 1px #cccccc;
  /* 左罫線 */
  border-top: solid 1px #cccccc;
  /* 上罫線 */
  border-right: solid 2px #808080;
  /* 右罫線 */
  border-bottom: solid 2px #808080;
  /* 下罫線 */
  background-color: #ff8080;
  /* 背景色 */
}

a.MenuButton2:link {
  color: #000000;
}

/* まだ見ていないリンク色 */
a.MenuButton2:visited {
  color: #000000;
}

/* 既に見たリンク色 */
a.MenuButton2:hover {
  border-left: solid 2px #808080;
  /* 左罫線 */
  border-top: solid 2px #808080;
  /* 上罫線 */
  border-right: solid 1px #cccccc;
  /* 右罫線 */
  border-bottom: solid 1px #cccccc;
  /* 下罫線 */
}

/* リンク部分 */
a.MenuButton3 {
  text-align: center;
  display: block;
  /* リンクをブロックに変換 */
  height: 40px;
  width: 370px;
  line-height: 250%;
  text-decoration: none;
  /* リンク部分の下線を消す */
  border-left: solid 1px #cccccc;
  /* 左罫線 */
  border-top: solid 1px #cccccc;
  /* 上罫線 */
  border-right: solid 2px #808080;
  /* 右罫線 */
  border-bottom: solid 2px #808080;
  /* 下罫線 */
  background-color: #c4ff80;
  /* 背景色 */
}

a.MenuButton3:link {
  color: #000000;
}

/* まだ見ていないリンク色 */
a.MenuButton3:visited {
  color: #000000;
}

/* 既に見たリンク色 */
a.MenuButton3:hover {
  border-left: solid 2px #808080;
  /* 左罫線 */
  border-top: solid 2px #808080;
  /* 上罫線 */
  border-right: solid 1px #cccccc;
  /* 右罫線 */
  border-bottom: solid 1px #cccccc;
  /* 下罫線 */
}


/* リンク部分 */
a.MenuButton4 {
  text-align: center;
  display: block;
  /* リンクをブロックに変換 */
  height: 40px;
  width: 370px;
  line-height: 250%;
  text-decoration: none;
  /* リンク部分の下線を消す */
  border-left: solid 1px #cccccc;
  /* 左罫線 */
  border-top: solid 1px #cccccc;
  /* 上罫線 */
  border-right: solid 2px #808080;
  /* 右罫線 */
  border-bottom: solid 2px #808080;
  /* 下罫線 */
  background-color: #316ff4e0;
  /* 背景色 */
}

a.MenuButton4:link {
  color: #ffffff;
}

/* まだ見ていないリンク色 */
a.MenuButton4:visited {
  color: #fffcfc;
}

/* 既に見たリンク色 */
a.MenuButton4:hover {
  border-left: solid 2px #808080;
  /* 左罫線 */
  border-top: solid 2px #808080;
  /* 上罫線 */
  border-right: solid 1px #cccccc;
  /* 右罫線 */
  border-bottom: solid 1px #cccccc;
  /* 下罫線 */
}

/* リンク部分 */
a.MenuButton5 {
  text-align: center;
  display: block;
  /* リンクをブロックに変換 */
  height: 40px;
  width: 330px;
  line-height: 250%;
  text-decoration: none;
  /* リンク部分の下線を消す */
  border-left: solid 1px #cccccc;
  /* 左罫線 */
  border-top: solid 1px #cccccc;
  /* 上罫線 */
  border-right: solid 2px #808080;
  /* 右罫線 */
  border-bottom: solid 2px #808080;
  /* 下罫線 */
  background-color: #c4ff80;
  /* 背景色 */
}

a.MenuButton5:link {
  color: #000000;
}

/* まだ見ていないリンク色 */
a.MenuButton5:visited {
  color: #000000;
}

/* 既に見たリンク色 */
a.MenuButton5:hover {
  border-left: solid 2px #808080;
  /* 左罫線 */
  border-top: solid 2px #808080;
  /* 上罫線 */
  border-right: solid 1px #cccccc;
  /* 右罫線 */
  border-bottom: solid 1px #cccccc;
  /* 下罫線 */
}





/* ボタンCSS */

.menu-button0 {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #333333;
  font-size: 18px;
  border-radius: 0px;
  width: 200px;
  height: 40px;
  font-weight: bold;
  border: 2px solid #333333;
  transition: 0.3s;
  box-shadow: 3px 3px 0px 0px rgba(51, 51, 51, 1);
  background-color: #00ffff;
}

.menu-button0:hover {
  box-shadow: 0 0 #333;
  color: #00ffff;
  background-color: #333;
  text-decoration: none;
}

.menu-button {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #333333;
  font-size: 18px;
  border-radius: 0px;
  width: 200px;
  height: 40px;
  font-weight: bold;
  border: 2px solid #333333;
  transition: 0.3s;
  box-shadow: 3px 3px 0px 0px rgba(51, 51, 51, 1);
  background-color: #ffffff;
}

.menu-button:hover {
  box-shadow: 0 0 #333;
  color: #fff;
  background-color: #333;
  text-decoration: none;
}




/* 早移動(早送りなど) */
.btnFastMove {
  width: 40px;
  height: 23px;
  line-height: 20px;
}

.btnFastMove a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  background: #0099FF;
  text-align: center;
  color: #FFFFFF;
  font-size: 15px;
  font-weight: bold;
  border: 1px solid #000000;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  box-shadow: 2px 2px 0px 0px #DEDEDE;
}

.btnFastMove a:hover {
  background: #0099FF;
  color: #FFFC00;
  margin-left: 1px;
  margin-top: 1px;
  box-shadow: none;
  text-decoration: none;
}


/* -----  ボタンCSS  マウスを合わせたとき変化なし  ---- */
.btn-Page1 {
  width: 32px;
  height: 32px;
  line-height: 26px;
  user-select: none;
}

.btn-Page1 a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  background: #12FF0D;
  text-align: center;
  border: 2px solid #000000;
  color: #000000;
  font-size: 22px;
  font-weight: bold;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  box-shadow: 2px 2px 0px 0px #DEDEDE;
}

.btn-Page1 a:hover {
  background: #12FF0D;
  color: #000000;
  margin-left: -1px;
  /* マウスを合わせても 沈むまない様に*/
  margin-top: -1px;
  border: 2px solid #000000;
  box-shadow: none;
  text-decoration: none;
  cursor: default;
  /*not-allowed; */
  /* 禁止マーク */
  /* pointer; */
  /* ← 指（リンク）カーソル */
}


/* -----  ボタンCSS  マウスを合わせたとき 沈む  ---- */
.btn-Page2 {
  width: 32px;
  height: 32px;
  line-height: 28px;
  user-select: none;
}

.btn-Page2 a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  background: #0BA909;
  text-align: center;
  border: 2px solid #087606;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: bold;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  /*box-shadow: 2px 2px 0px 0px #DEDEDE;*/
  transition: all 0.1s ease;
}

.btn-Page2 a:hover {
  background: #12FF0D;
  color: #000000;
  font-size: 22px;
  margin-left: 1px;
  /* マウスを合わせたとき 沈む動作*/
  margin-top: 1px;
  border: 2px solid #000000;
  box-shadow: none;
  text-decoration: none;
}

/* --------------------------------------------------*/


.btn-Mode1 {
  width: 150px;
  height: 40px;
  line-height: 35px;
}

.btn-Mode1 a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  background: #12FF0D;
  text-align: center;
  border: 2px solid #000000;
  color: #000000;
  font-size: 22px;
  font-weight: bold;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  box-shadow: 2px 2px 0px 0px #DEDEDE;
}

.btn-Mode1 a:hover {
  background: #12FF0D;
  color: #000000;
  margin-left: -1px;
  margin-top: -1px;
  border: 2px solid #000000;
  box-shadow: none;
  text-decoration: none;
}

.btn-Mode2 {
  width: 150px;
  height: 40px;
  line-height: 35px;
}

.btn-Mode2 a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  background: #0BA909;
  text-align: center;
  border: 2px solid #087606;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: bold;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  box-shadow: 2px 2px 0px 0px #DEDEDE;
  transition: all 0.1s ease;
}

.btn-Mode2 a:hover {
  background: #12FF0D;
  color: #000000;
  font-size: 22px;
  margin-left: 1px;
  margin-top: 1px;
  border: 2px solid #000000;
  box-shadow: none;
  text-decoration: none;
}




.detail-box {
  display: none;
  margin-top: 5px;
  padding: 10px;
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.popup-old-frame000 {
  position: absolute;
  display: none;
  width: 300px;
  background-color: #fff;
  border: 1px solid #999;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
  padding: 10px;
  z-index: 1000;
}


.myButton {
  -moz-box-shadow: 0px 1px 0px 0px #fff6af;
  -webkit-box-shadow: 0px 1px 0px 0px #fff6af;
  box-shadow: 0px 1px 0px 0px #fff6af;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffab23));
  background: -moz-linear-gradient(top, #ffec64 5%, #ffab23 100%);
  background: -webkit-linear-gradient(top, #ffec64 5%, #ffab23 100%);
  background: -o-linear-gradient(top, #ffec64 5%, #ffab23 100%);
  background: -ms-linear-gradient(top, #ffec64 5%, #ffab23 100%);
  background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23', GradientType=0);
  background-color: #ffec64;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #ffaa22;
  display: inline-block;
  cursor: pointer;
  color: #333333;
  font-family: Arial;
  font-size: 12px;
  font-weight: bold;
  padding: 3px 12px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #ffee66;
}

.myButton:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, #ffec64));
  background: -moz-linear-gradient(top, #ffab23 5%, #ffec64 100%);
  background: -webkit-linear-gradient(top, #ffab23 5%, #ffec64 100%);
  background: -o-linear-gradient(top, #ffab23 5%, #ffec64 100%);
  background: -ms-linear-gradient(top, #ffab23 5%, #ffec64 100%);
  background: linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#ffec64', GradientType=0);
  background-color: #ffab23;
}

.myButton:active {
  position: relative;
  top: 1px;
}

.fontTitle {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 24px;
}

.strRed {
  color: #FF0000;
}

.strBlack {
  color: #00FF00;
}

.stlCellH1 {
  background-color: #DBDBEE;
  width: 100px;
  height: 30px;
  text-align: center;
  line-height: 180%;
}

.stlCellH2 {
  background-color: #DBDBEE;
  width: 100px;
  height: 30px;
  text-align: center;
  line-height: 180%;
}

.stlCellD1 {
  width: 300px;
  height: 30px;
  text-align: left;
}

.stlCellD2 {
  width: 100px;
  height: 30px;
  text-align: left;
}

.stlCellD3 {
  width: 200px;
  height: 30px;
  text-align: left;
}

.boxDialog {
  position: absolute;
  width: 200px;
  height: 50px;
  top: 0px;
  left: 0px;
  border-radius: 5px;
  background-color: rgba(204, 204, 204, 1);
  border-top-style: double;
  border-right-style: double;
  border-bottom-style: double;
  border-left-style: double;
}

.ItemName {
  background-color: rgba(131, 227, 235, 1.00);
  height: 30px;
  display: flex;
  align-items: center;
  border: 1px double #007bff !important;
  padding-top: 3;
  padding-right: 3;
  padding-bottom: 3;
  margin: 2;
}

.ItemData {
  background-color: rgba(250, 250, 250, 1.00);
  height: 30px;
  display: flex;
  align-items: center;
  border: 1px solid #dee2e6 !important;
  border-color: #007bff !important;
}

/*  ■■ テーブル ヘッダー固定 ■■■■■■■■■■■■■■■■ */
/*　スクロールバーの実装 */
.table_sticky {
  display: block;
  overflow-y: scroll;
  height: calc(100vh/2);
  border: 1px solid;
  border-collapse: collapse;
}

.table_sticky thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #A2E9EF;
  border-top: #FFFFFF;
}

.pos-rela {
  /* 親要素 */
  position: relative !important;
}

.pos-abso {
  /* 子要素 親要素を元に位置決めする */
  position: absolute !important;
}




.st-tbl1 thead th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.st-tbl1 th:first-child {
  position: sticky;
  left: 0;
  background: #f1f1fd;
}

.st-tbl1 th:nth-child(2) {
  position: sticky;
  left: 0;
  /*  background: #f1f1fd; */
}

.st-tbl1 th:nth-child(3) {
  position: sticky;
  left: 0;
  /*  background: #f1f1fd; */
}

/*
.st-tbl1 th {
  background-color: #555;
  color: #fff;
  white-space: nowrap;
}
.st-tbl1 th,
.st-tbl1 td {
  text-align: left;
  padding: 0.5em 1em;
  white-space: nowrap;
}
 .st-tbl1 table {
    display: flex;
}
.st-tbl1 tbody {
    display: flex;
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
}
.st-tbl1 th,
.st-tbl1 td {
    display: block;
}
.text{
    background: #f1f1fd;
}
*/
.slider {
  overflow-y: auto;
  height: 200px;
  width: 500px;
  margin: 0 auto;
}

.slider table {
  margin: 0 auto;
  padding: 0;
  border-collapse: collapse;
}

.slider th,
.slider td {
  border: 1px solid #999;
  padding: 6px;
  /*white-space: nowrap;*/
}

.slider tr:first-child th,
.slider tr th:first-child {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: white;
}

.slider tr:first-child th:first-child {
  z-index: 10;
}

.slider tr:first-child th:before,
.slider tr th:first-child:before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 100%;
  height: 100%;
  border: 1px solid #999;
}

.zfixed01,
.zfixed02 {
  position: sticky;
  /*  top: 0;
  left: 0; */
  /*  color: #fff;
  background: #333; */
}

.zfixed01 {
  z-index: 2;
}

.zfixed02 {
  z-index: 1;
}

/*  ■■■■■■■■■■■■■■■■■■■■■■ */
/*  ■■■■■■■ Bootstrap 拡張 ■■■■■■■ */
/*非表示にする*/
.DispNon {
  display: none !important;
}

/* カレンダー土日色設定 */
.datepicker-days th.dow:nth-last-child(7),
.datepicker-days td:nth-last-child(7) {
  color: #f00;
}

.datepicker-days th.dow:last-child,
.datepicker-days td:last-child {
  color: #00f;
}

.WaitIcon {
  background-image: url("../image/wait01.gif");
  /*background-image:url("wait00.jpg") ;*/
  background-size: contain;
  /* 画像のサイズを指定    */
  width: 50px;
  /* 横幅のサイズを指定    */
  height: 50px;
  /* 縦幅のサイズを指定    */

}

.WaitIcon300 {
  background-image: url("../image/wait01.gif");
  /*background-image:url("wait00.jpg") ;*/
  background-size: contain;
  /* 画像のサイズを指定    */
  width: 300px;
  /* 横幅のサイズを指定    */
  height: 300px;
  /* 縦幅のサイズを指定    */

}

.radio-group {
  display: flex;
  gap: 20px;
  justify-content: center;
}

.row-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;

  background-color: #b8fcc0 !important;
  font-weight: normal;
  /* :bold; : normal*/
  font-size: 16px;
  padding-left: 0px !important;
  padding-right: 0px !important;
}


.table-item {
  background-color: #c8fdff !important;
  font-weight: normal;
  /* :bold;*/
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.table-item1 {
  background-color: #A2E9EF !important;
  font-size: 14px !important;
  /* 1rem=16px */
  font-weight: Bold !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  text-align-last: justify !important;
}

.table-item2 {
  background-color: #FF93AB !important;
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.table-item3 {
  background-color: #B0FF99 !important;
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.table-item4 {
  background-color: #ff0000 !important;
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.table-item5 {
  background-color: #DDffff !important;
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.table-item6 {
  background-color: #A2E9EF !important;
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
  position: sticky;
}

.table-item7 {
  color: #ffffff !important;
  background-color: #2c2c2c !important;
  font-weight: bold;
  font-size: 14px;
  padding-left: 10px !important;
  padding-right: 10px !important;
  position: sticky;
}

.table-data {
  background-color: #FAFFAF;
  left: 10px !important;
  margin: 0 !important;
}

.table-data01 {
  background-color: #ffec47;
  left: 10px !important;
  margin: 0 !important;
}

.table-data02 {
  background-color: #eec362;
  left: 10px !important;
  margin: 0 !important;
}

.table-data03 {
  background-color: #ff9a9a;
  left: 10px !important;
  margin: 0 !important;
}

.table-data04 {
  background-color: #ff0000;
  left: 10px !important;
  margin: 0 !important;
}

.table-data05 {
  background-color: #ddf8dd;
  left: 10px !important;
  margin: 0 !important;
}

.table-dataRdo1 {
  background-color: #b8ffb8;
  left: 10px !important;
  margin: 0 !important;
}

.table-dataRdo2 {
  background-color: #ff9a9a;
  left: 10px !important;
  margin: 0 !important;
}

.table-dataRdo3 {
  background-color: #ff9a9a;
  left: 10px !important;
  margin: 0 !important;
}

.table-dataRdo4 {
  background-color: #b8ffb8;
  left: 10px !important;
  margin: 0 !important;
}

.table-dataRdo5 {
  background-color: #b8ffb8;
  left: 10px !important;
  margin: 0 !important;
}

.table-dataRdo6 {
  background-color: #ff9a9a;
  left: 10px !important;
  margin: 0 !important;
}


.table-view {
  padding-left: 20px !important;
  margin: 0 !important;
}

.table-view-num {
  text-align: left !important;
  padding-left: 20px !important;
  margin: 0 !important;
}

.table-title {
  font-weight: bold;
  font-size: 18px;
  line-height: 120%;
  height: 45px;
}

.table-bordered2 {
  border: 2px solid #012981;
}

.table-bordered3 {
  border: 3px solid #012981;
}

.border-2px {
  border: 2px solid #2A88E7 !important;
}

.border-3px {
  border: 3px solid #2A88E7 !important;
}



.text-black {
  color: #000000 !important;
}

.color-White {
  background-color: #FFFFFF !important;
}

.color-Login {
  color: whitesmoke !important;
  background-color: #1231C4 !important;
}

.color-Kouji {
  background-color: #FFD700 !important;
}

.color-Jinin {
  background-color: #FFD700 !important;
}

.color-Kizai {
  background-color: #FFD700 !important;
}

.color-Maintenance {
  background-color: #FF0E0E !important;
}

.color-MainteID {
  background-color: #ff00ff !important;
}

.color-Office {
  background-color: #FFD700 !important;
}

.color-Standby {
  background-color: #BFFFCA !important;
}

.color-StandbyLight {
  background-color: #D3FFDB !important;
}

.color-Holiday {
  background-color: #C2C4FD !important;
}

.color-HolidayLight {
  background-color: #E5E6FB !important;
}

.color-Product {
  background-color: #F48F0E !important;
}

.color-LightBlue2 {
  color: black !important;
  background-color: #B8C5FF !important;
}

.color-LightYellow2 {
  color: black !important;
  background-color: #FFEC47 !important;
}

.color-pink2 {
  color: black !important;
  background-color: #FF84B9 !important;
}

.color-lawngreen {
  color: black !important;
  background-color: #7cfc00 !important;
}

.color-blue {
  color: #ffffff !important;
  background-color: #0000ff !important;
}

.color-darkgreen {
  color: whitesmoke !important;
  background-color: #006400 !important;
}

.color-bk01 {
  color: black !important;
  background-color: #B9F599 !important;
}

.color-bk02 {
  background-color: #A8DAFB !important;
}

.color-List01 {
  background-color: #FF8C00 !important;
}

.color-List02 {
  background-color: #FFC4E1 !important;
}

.color-List03 {
  background-color: #58ACFF !important;
}

.color-ProcessTitle {
  background-color: #D5E10B !important;
}

.color-ProcessType {
  background-color: #F2F883 !important;
}

.color-LabelPrint {
  color: rgba(87, 87, 87, 1.00) !important;
  background-color: #ADFDA7 !important;
}

.color-Stock {
  color: rgba(4, 3, 122, 1.00) !important;
  background-color: #49B921 !important;
}

.color-item1 {
  color: rgba(4, 3, 122, 1.00) !important;
  background-color: #49B921 !important;
}

.color-item2 {
  color: rgba(4, 3, 122, 1.00) !important;
  background-color: #49B921 !important;
}

.color-Link01 {
  color: #fff !important;
  background-color: #218838 !important;
}

.border-black {
  border-color: #000000 !important;
}

.bc-lime {
  color: #000000 !important;
  background-color: #00ff00 !important;
}

.MaxH300 {
  overflow-y: auto;
  max-height: 300px;
}


.wProcessDay {
  width: 1500px !important;
}


/* ボタン CSS　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */

/* HELPボタン 青 ■■■■■■■■■■■■■■*/
.btn-help {
  font-weight: bold !important;
  color: #FFF !important;
  background-color: #0005FF !important;
  border-color: #000F8C !important;
  border-width: 2px !important;
  /* 角を丸くする */
  border-radius: 10px;
  /* 影 */
  box-shadow: 2px 2px 0 #999;
  transition: all 0.1s ease;
}

/* hover（有効時のみ） */
.btn-help:hover:not(:disabled):not(.disabled) {
  color: #000000 !important;
  background-color: #00eeff !important;
  border-color: #0005FF !important;
  border-width: 3px !important;
  /* 沈む動作 */
  transform: translate(1px, 1px);
  box-shadow: none;
  /* 角を丸くする */
  border-radius: 12px;
}

/* 非活性（disabled） */
.btn-help:disabled,
.btn-help.disabled {
  color: #ccc !important;
  background-color: #777 !important;
  border-color: #555 !important;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.6;
}

/* 非活性時は hover を無効化 */
.btn-help:disabled:hover,
.btn-help.disabled:hover {
  transform: none;
}



/* 送信ボタン 青 ■■■■■■■■■■■■■■*/
.btn-submitBlue {
  font-weight: bold !important;
  color: #FFF !important;
  background-color: #0005FF !important;
  border-color: #000F8C !important;
  border-width: 3px !important;
  /* 角を丸くする */
  border-radius: 8px;
  /* 影 */
  box-shadow: 2px 2px 0 #999;
  transition: all 0.1s ease;
}

/* hover（有効時のみ） */
.btn-submitBlue:hover:not(:disabled):not(.disabled) {
  color: #2d11ff !important;
  background-color: #00eeff !important;
  border-color: #ff0000 !important;
  border-width: 5px !important;
  /* 沈む動作 */
  transform: translate(2px, 2px);
  box-shadow: none;
}

/* 非活性（disabled） */
.btn-submitBlue:disabled,
.btn-submitBlue.disabled {
  color: #ccc !important;
  background-color: #777 !important;
  border-color: #555 !important;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.6;
}

/* 非活性時は hover を無効化 */
.btn-submitBlue:disabled:hover,
.btn-submitBlue.disabled:hover {
  transform: none;
}

/* 送信ボタン 黄 ■■■■■■■■■■■■■■ */
.btn-submitYellow {
  font-weight: bold !important;
  color: #000 !important;                 /* 文字は黒 */
  background-color: #FFD500 !important;  /* 基本：黄色 */
  border-color: #C9A800 !important;      /* 濃い黄色 */
  border-width: 3px !important;
  border-radius: 8px;
  box-shadow: 2px 2px 0 #999;
  transition: all 0.1s ease;
}

/* hover（有効時のみ） */
.btn-submitYellow:hover:not(:disabled):not(.disabled) {
  color: #000 !important;
  background-color: #FFF2A8 !important;  /* 明るい黄色 */
  border-color: #FF8C00 !important;      /* オレンジ寄り */
  border-width: 5px !important;
  transform: translate(2px, 2px);        /* 沈む */
  box-shadow: none;
}

/* 非活性（disabled） */
.btn-submitYellow:disabled,
.btn-submitYellow.disabled {
  color: #ccc !important;
  background-color: #777 !important;
  border-color: #555 !important;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.6;
}

/* 非活性時は hover を無効化 */
.btn-submitYellow:disabled:hover,
.btn-submitYellow.disabled:hover {
  transform: none;
}

/* 送信ボタン グレー ■■■■■■■■■■■■■■ */
.btn-submitGray {
  font-weight: bold !important;
  color: #000 !important;                 /* 文字は黒 */
  background-color: #E0E0E0 !important;  /* 基本：明るいグレー */
  border-color: #9E9E9E !important;      /* 枠：濃いグレー */
  border-width: 3px !important;
  border-radius: 8px;
  box-shadow: 2px 2px 0 #999;
  transition: all 0.1s ease;
}

/* hover（有効時のみ） */
.btn-submitGray:hover:not(:disabled):not(.disabled) {
  color: #000 !important;
  background-color: #F5F5F5 !important;  /* 明るめグレー */
  border-color: #616161 !important;      /* 枠を少し締める */
  border-width: 5px !important;
  transform: translate(2px, 2px);        /* 沈む */
  box-shadow: none;
}

/* 非活性（disabled） */
.btn-submitGray:disabled,
.btn-submitGray.disabled {
  color: #aaa !important;
  background-color: #777 !important;
  border-color: #555 !important;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.6;
}

/* 非活性時は hover を無効化 */
.btn-submitGray:disabled:hover,
.btn-submitGray.disabled:hover {
  transform: none;
}



/* 送信ボタン 赤 ■■■■■■■■■■■■■■*/
.btn-submitRed {
  font-weight: bold !important;
  color: #FFF !important;

  /* 通常時（濃い赤） */
  background-color: #d60000 !important;
  border-color: #8c0000 !important;
  border-width: 3px !important;

  /* 角を丸くする */
  border-radius: 8px;

  /* 影 */
  box-shadow: 2px 2px 0 #999;

  transition: all 0.1s ease;
}

/* hover（有効時のみ） */
.btn-submitRed:hover:not(:disabled):not(.disabled) {
  color: #fff !important;

  /* hover時（明るい赤） */
  background-color: #ff4d4d !important;
  border-color: #b30000 !important;
  border-width: 5px !important;

  /* 沈む動作 */
  transform: translate(2px, 2px);

  box-shadow: none;
}

/* 非活性（disabled） */
.btn-submitRed:disabled,
.btn-submitRed.disabled {
  color: #eee !important;
  background-color: #999 !important;
  border-color: #777 !important;

  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.6;
}

/* 非活性時は hover を無効化 */
.btn-submitRed:disabled:hover,
.btn-submitRed.disabled:hover {
  transform: none;
}




.btn-submitRegist {
  font-weight: bold !important;
  color: #FFF !important;
  background-color: #0005FF !important;
  border-color: #000F8C !important;
  border-width: 3px !important;
}

.btn-submitRegistS {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #ffffff;
  font-size: 12px;
  border-radius: 6px;
  width: 50px;
  height: 20px;
  background-color: #0080ff;
}

.btn-submitUpdate {
  font-weight: bold !important;
  color: #FFFF00 !important;
  background-color: #4C71FF !important;
  border-color: #000F8C !important;
  border-width: 3px !important;
}

.btn-submitDelete {
  font-weight: bold !important;
  color: #FFFF00 !important;
  background-color: #ff0000 !important;
  border-color: #a30000 !important;
  border-width: 3px !important;
}

.btn-submitL {
  font-weight: bold !important;
  color: #000 !important;
  background-color: #DFED6E;
  border-color: #809312 !important;
  border-width: 3px !important;
}

.btn-submitS {
  font-weight: bold !important;
  color: #000 !important;
  background-color: #E5E5E5 !important;
  border-color: #242424 !important;
  border-width: 1px !important;
}

.btn-updateOffice {
  font-weight: bold !important;
  color: #000 !important;
  background-color: #E5FF13 !important;
  border-color: #707070 !important;
  border-width: 3px !important;
  border-radius: 5px !important;
}

.btn-RestOffice {
  font-weight: bold !important;
  color: #000 !important;
  background-color: #16FBFF !important;
  border-color: #707070 !important;
  border-width: 3px !important;
  border-radius: 5px !important;
}


/* 編集ボタン　*/
.btn-edit {
  margin-left: 3px;
  padding-left: 2px !important;
  padding-right: 2px !important;
  font-weight: bold !important;
  color: #000 !important;
  background-color: #FEFEFE !important;
  border-width: 3px !important;
  border-radius: 4px !important;
  border-color: #1d9750 !important;
  box-shadow: 2px 1px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 編集ボタン マウスが乗ったら沈む */
.btn-edit:hover {
  color: #FFF !important;
  background-color: #03632e !important;
  border-color: #7aff81 !important;
  box-shadow: 0px 0px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 全複写ボタン  */
.btn-copyAll {
  font-weight: bold !important;
  color: #fff !important;
  background-color: #005CD8 !important;
  border-color: #048FDC !important;
  border-width: 3px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 2px 1px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 全複写ボタン マウスが乗ったら沈む */
.btn-copyAll:hover {
  color: #ffff00 !important;
  background-color: #003c8a !important;
  border-color: #5ec7ff !important;
  box-shadow: 0px 0px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 複写ボタン  */
.btn-copy {
  margin-left: 3px;
  font-weight: bold !important;
  color: #000 !important;
  background-color: #FEFEFE !important;
  border-color: #048FDC !important;
  border-width: 3px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 2px 1px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
  cursor: pointer !important;
}

/* 複写ボタン マウスが乗ったら沈む */
.btn-copy:hover {
  color: #ffff00 !important;
  background-color: #003c8a !important;
  border-color: #5ec7ff !important;
  box-shadow: 0px 0px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

.btn-copy.is-wait {
  cursor: wait !important;
  pointer-events: none;
  /* 連打防止 */
  opacity: .85;
}


/* 新期ボタン  */
.btn-new {
  margin-left: 3px;
  font-weight: bold !important;
  color: #000 !important;
  background-color: #FFFFFF !important;
  border-color: #048FDC !important;
  border-width: 3px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 2px 1px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 新期ボタン マウスが乗ったら沈む */
.btn-new:hover {
  color: #ffff00 !important;
  background-color: #ff0000 !important;
  border-color: #5ec7ff !important;
  box-shadow: 0px 0px 0 #8cb39d, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 全削除ボタン*/
.btn-delAll {
  margin-left: 3px;
  margin-left: 3px;
  font-weight: bold !important;
  color: #FFF !important;
  background-color: #8E0002 !important;
  border-color: #FF0808 !important;
  border-width: 3px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 2px 1px 0 #b38c8c, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 全削除ボタン マウスが乗ったら沈む */
.btn-delAll:hover {
  color: #ffff00 !important;
  background-color: #ff0000 !important;
  border-color: #5ec7ff !important;
  box-shadow: 0px 0px 0 #b38c8c, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 削除ボタン */
.btn-del {
  margin-left: 3px;
  font-weight: bold !important;
  color: #000 !important;
  background-color: #FFFFFF !important;
  border-color: #FF0808 !important;
  border-width: 3px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 2px 1px 0 #b38c8c, 0 3px 6px rgba(0, 0, 0, .12) !important;
}

/* 削除ボタン マウスが乗ったら沈む */
.btn-del:hover {
  color: #ffff00 !important;
  background-color: #ff0000 !important;
  border-color: #5ec7ff !important;
  box-shadow: 0px 0px 0 #b38c8c, 0 3px 6px rgba(0, 0, 0, .12) !important;
}





.btn-report {
  font-weight: bold !important;
  color: #FFFFFF !important;
  background-color: #2125FF !important;
  border-color: #707070 !important;
  border-width: 3px !important;
  border-radius: 5px !important;
}

.btn-Type01 {
  font-weight: bold !important;
  color: #000000 !important;
  background-color: #79f8ed !important;
  border-color: #707070 !important;
  border-width: 1px !important;
  border-radius: 5px !important;
  padding: 0px !important;
}

.btn-copyClip {
  width: 80px !important;
  height: 30px !important;
  line-height: 20px !important;

  font-weight: bold !important;
  color: #000 !important;
  background-color: hsl(56, 98%, 41%) !important;
  border-color: #048FDC !important;
  border-width: 2px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 0px 6px 0px -2px #9b9b9b;
}

.btn-copyClip:hover {
  box-shadow: 0 0 #fff;
  transform: translateY(1px);
  color: #000000 !important;
  background: hsl(64, 100%, 57%) !important;
}


.btn-ApprovalForm {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #555555;
  font-size: 18px;
  border-radius: 8px;
  width: 180px;
  height: 30px;
  font-weight: bold;
  border: 2px solid #555555;
  transition: 0.3s;
  box-shadow: 0px 6px 0px -2px rgb(10, 117, 19);
  background-color: #0df85c;
}

.btn-ApprovalForm:hover {
  box-shadow: 0 0 #fff;
  transform: translateY(1px);
}

.btn-ApprovalForm:disabled,
.btn-ApprovalForm.disabled {
  background-color: #ccc;
  border-color: #aaa;
  color: #888;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

.btn-Approval {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #555555;
  font-size: 22px;
  border-radius: 8px;
  width: 80px;
  height: 30px;
  font-weight: bold;
  border: 2px solid #555555;
  transition: 0.3s;
  box-shadow: 0px 6px 0px -2px rgba(67, 145, 209, 1);
  background-color: #90caf9;
}

.btn-Approval:hover {
  box-shadow: 0 0 #fff;
  transform: translateY(1px);
}

.btn-Approval:disabled,
.btn-Approval.disabled {
  background-color: #ccc;
  border-color: #aaa;
  color: #888;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

.btn-Mitsumori {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #000000;
  font-size: 22px;
  border-radius: 8px;
  width: 80px;
  height: 30px;
  font-weight: bold;
  border: 2px solid #000000;
  transition: 0.3s;
  box-shadow: 0px 6px 3px -2px rgb(40, 116, 31);
  background-color: #8ee3a6;
}

.btn-Mitsumori:hover {
  box-shadow: 0 0 #fff;
  transform: translateY(1px);
}

.btn-Mitsumori:disabled,
.btn-Mitsumori.disabled {
  background-color: #ccc;
  border-color: #aaa;
  color: #888;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}


.btn-Logo {
  width: 40px !important;
  height: 40px !important;
  line-height: 20px !important;

  font-weight: bold !important;
  color: #000 !important;
  background-color: hsl(0, 0%, 100%) !important;
  border-color: #048FDC !important;
  border-width: 2px !important;
  border-radius: 5px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
  box-shadow: 0px 6px 0px -2px #9b9b9b;
}

.btn-Logo:hover {
  box-shadow: 0 0 #fff;
  transform: translateY(1px);
  color: #000000 !important;
  background: hsl(115, 100%, 50%) !important;
}




.btn-NarrowDown {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  font-size: 18px;
  border-radius: 4px;
  width: 80px;
  height: 30px;
  font-weight: bold;
  border: 2px solid #555555;
  transition: 0.3s;
  box-shadow: 0px 6px 0px -2px rgba(67, 145, 209, 1);
  background-color: #138fc9;
}

.btn-NarrowDown:hover {
  box-shadow: 0 0 #fff;
  transform: translateY(1px);
  color: #000000 !important;
  background: #26FFFD !important;
}

.Operator-Pos {
  right: 10px;
  top: 9px;
}

.Operator-PosReturn {
  right: 150px;
  top: 6px;
}

.Operator-PosList {
  right: 210px;
  top: 7px;
}

.Operator {
  width: 7rem;
  height: 1.7rem;
  line-height: 0px !important;
}

.btn-csv {
  color: rgba(248, 255, 6, 1.00) !important;
  background-color: #007bff;
}

a.btn-csv:hover,
a.btn-csv:focus {
  color: #fff;
  background-color: #0062cc;
}

.flexiblebox {
  display: flex;
  align-items: center;
  /* 縦方向中央揃え */
  justify-content: center;
  /* 横方向中央揃え */
}

.TextVerticalCenter {
  display: table-cell;
  vertical-align: middle;
}

.btn-font1 {
  /* ボタンフォント設定(標準　*/
  font-weight: 400;
  font-size: 14px;
  /*0.8rem !important;*/
  line-height: 15px;
}

.btn-font2 {
  /* ボタンフォント設定(標準　*/
  font-weight: 400;
  font-size: 10px;
  /*0.8rem !important;*/
  line-height: 11px;
}

.btn-fontM {
  /* ボタンフォント設定 M(標準)　*/
  font-weight: 400;
  font-size: 14px;
  /*0.8rem !important;*/
  line-height: 15px;
}

.btn-fontL {
  /* ボタンフォント設定L　*/
  font-weight: 400;
  font-size: 20px;
  /*0.8rem !important;*/
  line-height: 21px;
}

.btn-fontS {
  /* ボタンフォント設定S */
  font-weight: 400;
  font-size: 12px;
  /*0.8rem !important;*/
  line-height: 13px;
}

.btn-fontSS {
  /* ボタンフォント設定SS　*/
  font-weight: 400;
  font-size: 10px;
  /*0.8rem !important;*/
  line-height: 11px;
}

.btn-normal {
  /* 角丸四角 その他 №0　*/
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 5px;
  padding: 2px;
  /*height: 20px !important;*/
}

.btn-normal0 {
  /* 角丸四角 その他 №0　*/
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 5px;
  padding: 2px;
  /*  font-size: 14px; 
  line-height: 14px;
  height: 20px !important;*/
}

.btn-car0 {
  /* 〇  車  №1　*/
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 20px;
  padding: 2px;
  /*  font-size: 0.8rem !important;
  line-height:0.8rem;
  height: 40px !important;
    width: 60px;*/
}

.btn-ship0 {
  /* 〇  船  №2*/
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 0 0 12px 12px;
  padding: 2px;
  /*  font-size: 0.8rem !important;
  line-height: 0;
  height: 30px !important; */
}

.btn-crane0 {
  /* ／■／ クレーン №3*/
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 50% 0 50% 0;
  padding: 2px;
  /*  font-size: 0.8rem !important;
  line-height: 0;
  height: 20px !important;

*/
}

.ColorRed {
  color: #FF0000;
}


.btn-Diving {
  color: #fff;
  background-color: #CC0000;
  border: 2px solid #0004CC;
}

.btn-ColorBaseID100 {
  /* 本社      拠点色 */
  color: #fff;
  background-color: #000000;
  border-color: #888888;
}

.btn-ColorBaseID200 {
  /* 東京支店 */
  color: #000;
  background-color: #FF8888;
  border-color: #000000;
}

.btn-ColorBaseID300 {
  /* 鹿島支店 */
  color: #fff;
  background-color: #0000ff;
  border-color: #000000;
}

.btn-ColorBaseID400 {
  /* 東海支店 */
  color: #000;
  background-color: #ffa500;
  border-color: #000000;
}

.btn-ColorBaseID500 {
  /* 千葉支店 */
  color: #000;
  background-color: #ffff00;
  border-color: #000000;
}

.btn-ColorBaseID700 {
  /* 調査測量部 */
  color: #fff;
  background-color: #008000;
  border-color: #000000;
}

.btn-ColorGray {
  color: #fff;
  background-color: #A0A0A0;
  border-color: #A0A0A0;
}

.btn-Color01 {
  color: #000000;
  background-color: #FFFFFF;
  border-color: #000000;
}

.btn-Color02 {
  color: #fff;
  background-color: #0000FF;
  border-color: #0000FF;
}

.btn-Color03 {
  color: #000;
  background-color: #60FF60;
  border-color: #00FF00;
}

.btn-Color04 {
  color: #000;
  background-color: #FC68FC;
  border-color: #FC68FC;
}

.btn-Color05 {
  color: #000;
  background-color: #FFE248;
  border-color: #FFE248;
}

.btn-Color06 {
  color: #000;
  background-color: #C0C0C0;
  border-color: #000000;
}

.btn-Color07 {
  color: #000;
  background-color: #87CEEB;
  border-color: #87CEEB;
}

.btn-Color08 {
  color: #fff;
  background-color: #28794B;
  border-color: #28794B;
}

.btn-Color09 {
  color: #fff;
  background-color: #FF7807;
  border-color: #FF7807;
}

.btn-Color10 {
  color: #000;
  background-color: #ff69b4;
  /*ピンク*/
  border-color: #ff69b4;
}

.btn-Color11 {
  color: #fff;
  background-color: #9400d3;
  /*紫*/
  border-color: #9400d3;
}

.btn-Color12 {
  color: #000;
  background-color: #a9b735;
  /*若草色*/
  border-color: #a9b735;
}

.btn-Color13 {
  color: #fff;
  background-color: #a0522d;
  /*茶*/
  border-color: #a0522d;
}

.btn-Color14 {
  color: #fff;
  background-color: #010101;
  /*茶*/
  border-color: #010101;
}

.btn-Color20 {
  color: #ff0000;
  background-color: #ffffff;
  /*茶*/
  border-color: hwb(0 0% 0%);
}


.btn-custom {
  background-color: #FF1493 !important;
  color: #ffffff !important;
}

.btn-custom:hover {
  color: #fff;
  background-color: #c91b78 !important;
  border-color: #117a8b;
}


.td01 {
  width: 25px !important;
}

.td02 {
  width: 25px !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  text-align: center !important;
}

.td03 {
  width: 25px !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  text-align: center !important;
  font-size: 10px !important;
}

.td04 {
  width: 25px !important;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 1;
}

.td05 {
  width: 25px !important;
  position: sticky;
  top: 25;
  left: 0;
  z-index: 1;
}

.td06 {
  width: 50px !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  text-align: right !important;
  font-size: 15px !important;
}

.line-bottom01 {
  border-bottom: 3px solid #333 !important;
}

.line-Sides3a {
  border-left: 3px solid #F8A3B5 !important;
  border-top: 3px solid #F8A3B5 !important;
}

.line-Sides3b {
  border-left: 3px solid #2EB1E2 !important;
  border-top: 3px solid #2EB1E2 !important;
}

.line-Sides3c {
  border-left: 3px solid #FCBF3A !important;
  border-top: 3px solid #FCBF3A !important;
}

.line-Sides3d {
  border-left: 3px solid #B1D4EA !important;
  border-top: 3px solid #B1D4EA !important;
}