/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/** スタイル指定 */
body {
  background-color: #fff;
  color: #333;
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 13px;
  line-height: 18px;
}

p,
ol,
ul,
td {
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 13px;
}

pre {
  background-color: #eee;
  padding: 10px;
  font-size: 11px;
}

a {
  color: #000;
}

a:hover {
  color: #fff;
  background-color: #000;
}

th {
  padding-bottom: 5px;
}

td {
  padding: 1px 1px 1px 1px;
}

div.field,
div.actions {
  margin-bottom: 10px;
}


#notice {
  color: green;
}

/*layouts start */
#myappcontainer {
  width: 100%;
  margin: 0 auto;
  /* 開いているWindowsサイズの中心、の意味 */
}

#myappheader {
  width: 100%;
  margin: 0px auto;
  background-color: #ebf5fc;
}

#myappentirebody {
  margin: 0 auto;
}

#myappmsgarea {
  margin: 0 auto;
}

#myappbody {
  margin: 0 auto;
}

#myappfooter {
  text-align: center;
  height: 80px;
}

#homeDiv {
  width: 100%;
  margin: 0px auto;
  background-color: #B4B0B0;
}

#homeDiv img:not(#logo) {
  width: 100%;
}

#homeDivMemu {
  width: 100%;
  height: 50px;
  margin: 0px auto;
  background-color: #999999;
}

#homeDivLogo {
  width: 100%;
  background-color: #FFFFFF;
}

.titleDiv {
  width: 100%;
  height: 30px;
  line-height: 30px;
  margin-bottom: 5px;
  background-color: #C0C0C0;
  color: #000000;
  font-weight: bold;
}

.coiTitleDiv {
  width: 100%;
  margin-bottom: 5px;
  background-color: #C0C0C0;
  color: #000000;
  font-weight: bold;
  display: inline-block;
  padding: 6px 6px 6px 20px;
}

.menuLink {
  font-weight: bold;
  color: #FFFFFF;
}

.active {
  background-color: #4472C4;
}

/*layouts end */

/*共通*/
thead {
  background-color: #F5FFFA;
  color: #606060;
}

thead th {
  text-align: center;
}

/*i {
    width:10px;
    height:10px;
    line-height: 24px;
    vertical-align: top;
    margin: 10px 10px 0 10px;
    overflow: hidden;
    background:#FFFFFF;
    display:inline-block;
}*/

/*ログイン画面 */
#loginDiv {
  border: 1px solid #ccc;
  margin: 2em auto 1em;
  max-width: 400px;
  min-width: 350px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
}

.table.modal_table> :not(caption)>*>* {
  padding: 0.2rem 0.2rem !important;
}

.readonlyitem {
  background-color: #e9ecef !important;
  border: 1px solid #ccc !important;
  cursor: not-allowed !important;
}

.flex-container {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.flex-container input {
  box-sizing: border-box;
}

#titleDiv {
  font-weight: bold;
  color: #ffffff;
  width: 100%;
  height: 30px;
  background: linear-gradient(to right, #12408b, #ebf5fc);
}

/* メニューバー　関係css start */
div.menubar {
  /* background-color: #e1c9fa ; */
  /* バーの背景色 */
  background-color: #ebf5fc;
  border-top: 0px double #800000;
  /* バーの上端線 */
  border-bottom: 0px double #800000;
  /* バーの下端線 */
  min-width: 500px;
  /* メインメニュー全部が収まる最低横幅 */
  border-color: #800000;
  /* サブメニュー全体の枠線の色 */
  position: relative;
  z-index: 99;
}

div.menubar ul#menu {
  margin: 0px 0px 0px 5px;
  /* メニューバー外側の余白 */
  padding: 0px;
  /* メニューバー内側の余白 */
  height: 39px;
  /* メニューバーの高さ */
  border-color: #800000;
  /* サブメニュー全体の枠線の色 */
}

div.menubar ul#menu li {
  width: 150px;
  /* メニュー項目の横幅 */
  height: 40px;
  /* メニュー項目の高さ(「メニューバーの高さ」と一致させる) */
  float: left;
  list-style-type: none;
  position: relative;
  border-width: 1px 1px 1px 1px;
  /* サブメニュー全体の枠線の太さ */
  border-style: solid;
  /* サブメニュー全体の枠線の線種 */
  border-color: #FFFFFF;
  /* サブメニュー1項目の枠線の色 */
}

div.menubar ul#menu a {
  background-color: #12408b;
  /* バーの背景色 */
  color: #FFFFFF;
  /* メニュー項目の文字色 */
  line-height: 40px;
  /* メニュー項目のリンクの高さ(「メニュー項目の高さ」と一致させる) */
  text-align: center;
  /* メインメニューの文字列の配置(中央寄せ) */
  text-decoration: none;
  /* メニュー項目の装飾(下線を消す) */
  font-size: 16px;
  display: block;
  width: 100%;
  height: 100%;
}

div.menubar ul#menu a:hover {
  background-color: #ebf5fc;
  /* メニュー項目にマウスが載ったときの背景色 */
  border-color: #12408b;
  border-width: 1px;
  border-style: solid;
  color: #12408b;
  /* メニュー項目にマウスが載ったときの文字色 */
}

div.menubar ul#menu ul.sub {
  background-color: #ebf5fc;
  /* サブメニュー全体の背景色 */
  border-width: 1px 1px 0px 1px;
  /* サブメニュー全体の枠線の太さ */
  border-style: solid;
  /* サブメニュー全体の枠線の線種 */
  margin: 0px;
  padding: 0px;
  display: none;
  position: absolute;
}

div.menubar ul#menu ul.sub li {
  width: 300px;
  /* サブメニュー1項目の横幅 */
  height: 35px;
  /* サブメニュー1項目の高さ */
  border-width: 0px 0px 1px 0px;
  /* サブメニュー1項目の枠線の太さ */
  border-style: solid;
  /* サブメニュー1項目の枠線の線種 */
  border-color: #808080;
  /* サブメニュー1項目の枠線の色 */
}

div.menubar ul#menu ul.sub li a {
  line-height: 35px;
  /* サブメニュー1項目の行の高さ(「サブメニュー1項目の高さ」と合わせる) */
  text-align: left;
  /* サブメニュー1項目の項目名の配置(左寄せ) */
  text-indent: 5px;
  /* サブメニュー1項目の項目名前方の余白 */
}

div.menubar ul#menu ul.sub li a:hover {
  background-color: #ebf5fc;
  /* サブメニュー項目にマウスが載ったときの背景色 */
  color: #12408b;
  /* サブメニュー項目にマウスが載ったときの文字色 */
}

/* メニューバー直後のClearfix */
div.menubar ul#menu {
  zoom: 1;
}

div.menubar ul#menu:after {
  height: 0;
  visibility: hidden;
  content: ".";
  display: block;
  clear: both;
}
/* メニューバー　関係css end */

.field_with_errors {
  padding: 2px;
  background-color: red;
  display: inherit;
  float: left;
}

#error_explanation {
  width: 750px;
  border: 2px solid red;
  padding: 7px 7px 0;
  margin-bottom: 20px;
  background-color: #f0f0f0;
  margin: 0 auto;
}

#error_explanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  margin: -7px -7px 0;
  background-color: #c00;
  color: #fff;
}

#error_explanation ul li {
  font-size: 12px;
  list-style: square;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.logo {
  position: absolute;
  top: 10px;
  left: 30px;
  height: 180px;
  width: 180px;
  background-repeat: round;
}

div.logo_2 {
  font-family: 'Antonio', sans-serif;
  position: absolute;
  top: 80%;
  right: 30px;
  font-size: xx-large;
  color: #FFF;
  text-shadow: 0 0 10px #123b67, 0 0 10px #123b67;
}

div#homeDivMenu {
  background-color: #ebf5fc;
}

.required_mark {
  color: red;
}

#new_case_info_div, #ticket_info_div {
  position: fixed;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -30%);
  background: white;
  border: 1px solid #ccc;
  padding: 20px;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

#new_case_info_div {
  width: 60%;
}

#ticket_info_div {
  width: 85%;
}

.vertical-text {
  writing-mode: vertical-rl;
  text-orientation: upright; 
  white-space: nowrap;
  text-align: center;
  width: 50px;
}


tr.highlight td {
  background-color: #fffae6;
}

.institution-modal-width {
  max-width: 80% !important;
}

/* 同一審査対象の個票が一部しか見つからなかった場合の背景色 */
tr.missing-other-tickets-bg-color td {
  background-color: #FDEBE4;
}

.collection_check_boxes{
    vertical-align: middle;
    margin-bottom: -1px;
}