/* Header Start */
.dropdown-submenu {
  margin: 0;
  padding: 0;
}

.dropdown-submenu label {
  display: block;
  padding : 8px;
  color: rgb(41, 20, 20);
  font-weight: bold;  
  cursor: pointer;
}

.dropdown-submenu input[type="checkbox"] {
  display: none;
}

.dropdown-submenu .content {
  height: 0;
  padding: 0;
  overflow: hidden;    
}

.switch1:checked + .content {
  height: auto;  
}
.switch2:checked + .content {
  height: auto;  
}
.switch3:checked + .content {
  height: auto;  
}

#header{
  background-image:
    radial-gradient(#0ff, transparent),
    radial-gradient(rgb(65, 38, 216), transparent);
  background-attachment: fixed;
  min-height: 5vh;  
}

/* Header End */

#main{
  background-color: #dddee721;
  min-height: 86vh;
}

#footer {
  color: #fff;
  font-size: 15px;
  background: linear-gradient(45deg, rgb(145,236,255) 0%, rgb(167,205,250) 100%), center center no-repeat;
  background-size: cover;  
  padding: 5px;
  width: 100%;;

  display: flex;
  justify-content: center;
  align-items: center;
  
  /*絶対位置*/
  /* position: absolute; */

  /* bottom: 0; */
  margin-top: 1vh;
  min-height: 5vh;
}

/* 新規登録ボタン */
.add-data-button::after{
  content:"新規登録";
}

/* .save-button::after{
 
} */

.insert-button::after{
  content:"新規登録";
}

.update-button::after{
  content:"更新";
}

.delete-button::after{
  content:"削除";
}
.restore-button:after{
  content:"削除取消";
}

/* 検索モーダル表示ボタン */
.search-modal-button::after{
  content:"検索画面";
}


/* 検索項目クリアボタン */
.clear-button::after{
  content:"クリア";
}

/* 検索ボタン */
.search-button::after{
  content:" 検索";
}

.modal-close-button::after{
  content:"閉じる";
}


/* default_button */
.default_button{
  margin: 3px;
  padding: 1px;
  color: #fff;
  background-color: #383634;
  border-radius: 100vh;
}

.default_button:hover{
  color: #fff;
  background-color: #5f4e3c;
}

.default_button a{  
  text-decoration:none;
  color: #fff;
}



/* delete-modal-execution-button */
/* 画面の動きで背景色が変更される */
.delete-modal-execution-button{
  margin: 3px;  
  color: #fff;    
  border-radius: 100vh;
}

.delete-modal-execution-button:hover{
  /* 画面の動きで背景色が変更される */  
  color: #fff;    
}


/* login_info_change_button */
.login_info_change_button{
  margin: 3px;
  background-color: #9fac29;
  border-radius: 100vh;
  color: #fff;    
}

.login_info_change_button:hover{
  background-color: #b2c228;  
  color: #fff;    
}

/* modal_screen_move_button */
.modal_screen_move_button{
  margin: 3px;
  background-color: #e744da;
  border-radius: 100vh;
  color: #fff;    
}

.modal_screen_move_button a{
  text-decoration:none;
  color: #fff;    
}

.modal_screen_move_button a:hover{  
  color: #fff;    
  text-decoration:underline solid #f00;
}


#school_info_modal th , #majorsubject_info_modal th , #majorsubject_list_modal th{
  background-color: #c0dda4;
}

#school_info_modal td , #majorsubject_info_modal td , #majorsubject_list_modal td{
  background-color: #e5f2f7;
}

/* 操作不可能 */
.impossible {
	pointer-events: none;
	opacity: 0.9;
}

button{  
  border: none;  /* 枠線を消す */
  outline: none; /* クリックしたときに表示される枠線を消す */
  background: transparent; /* 背景の灰色を消す */
}

.original-label{
    padding: 0;
    margin: 2% 0 0 1%;    
    text-align: left;
    font-weight: 600;
}

.original-button{
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  /* color: #212529; */
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  /* background-color: transparent; */
  border: 1px solid transparent;
  padding: 0.1rem 0.5rem;
  font-size: 1rem;
  /* border-radius: 0.25rem; */
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}


/* マスタ画面のtable設定 Start */

.scroll-wrap-x {
  overflow-x: scroll;
}

.scroll-wrap-y {
  overflow-y: scroll;
}

.data-info-table{  
  width: 100%;
  margin: 5px 0 5px 0;
  border-collapse:separate;
  border-spacing: 0;    
  white-space: nowrap;

}

.data-info-table th:first-child{
  border-radius: 5px 0 0 0;
}

.data-info-table th:last-child{
  border-radius: 0 5px 0 0;
  border-right: 1px solid #3c6690;
}

.data-info-table th{
  text-align: center;
  color:white;
  background: linear-gradient(#829ebc,#225588);
  border-left: 1px solid #3c6690;
  border-top: 1px solid #3c6690;
  border-bottom: 1px solid #3c6690;
  box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
  /* min-width: 80px; */
  padding: 5px 0;
}

.data-info-table td{
  text-align: center;
  border-left: 1px solid #a8b7c5;
  border-bottom: 1px solid #a8b7c5;
  border-top:none;
  box-shadow: 0px -3px 5px 1px #eee inset;  
  /* min-width: 80px; */
  padding: 5px 10px;
}

.data-info-table td:last-child{
  border-right: 1px solid #a8b7c5;
}

.data-info-table tr:last-child td:first-child {
  border-radius: 0 0 0 5px;
}

.data-info-table tr:last-child td:last-child {
  border-radius: 0 0 5px 0;
} 

/* マスタ画面のtable設定 End*/


#save-form{
  overflow-x: hidden;
  overflow-y: auto;
}
/* モーダル内のボタン設定 Start */
.modal-button{  
  border: none;
  outline: none; /* クリックしたときに表示される枠線を消す */
  background: transparent; /* 背景の灰色を消す */
}

.modal-button:hover {
  background-color: #cdf06d;
  cursor: pointer;
}
.modal-button.active {
  background-color: #cdf06d;
}

.modal-button.focus {
  background-color: #cdf06d;
}
/* モーダル内のボタン設定 End */


/* モーダル内のアイコン設定 Start */

.fa-edit{
  color: green;  
}

.fa-arrow-right:before{
  margin-right: 3px;
  margin-left: 3px;
}

.fa-thumbs-down{
  color: red;  
}

.fa-thumbs-up{
  color: blue;  
}



/* モーダル内のアイコン設定 End */

/* マスタ画面の削除モーダル設定 start */



/* マスタ画面の削除モーダル設定 End */

.last-name-class{
  margin: 0 5px 0 0;
}



.inoperable{
  pointer-events: none;
  opacity:0.1;
}





.loader-area{
  position: fixed;
  background: rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
  top: 0; 
  left: 0;
  z-index: 100000;
}


.loader {
  position: fixed;    
  top: 48%;
  left: 48%;
  z-index: 100001;
}

/* 参考URL */
/* https://css-loaders.com/colorful/ */

.loader {
  width: 40px;
  aspect-ratio: 1;
  border-radius: 50%;
  margin-top: -30px;
  display: flex;
  justify-content: center;
  overflow: hidden;
  transform-origin: 50% 116.5%;
  animation: l17 2s infinite linear;
}
.loader:before {
  content:"";
  min-width: 233%;
  height: 233%;
  background: 
  radial-gradient(farthest-side,#00DA3C 90%,#0000) top,
  radial-gradient(farthest-side,#00CBE7 90%,#0000) left,
  radial-gradient(farthest-side,#FD8603 90%,#0000) bottom,
  radial-gradient(farthest-side,#F4F328 90%,#0000) right;
  background-size: 43% 43%;
  background-repeat: no-repeat;
  animation: inherit;
  animation-direction: reverse;
}

@keyframes l17 {
  100% {transform: rotate(360deg)}
}






.processing-area{
  position: fixed;
  background: rgba(0, 0, 0, 0.1);
  width: 100%;
  height: 100%;
  top: 0; 
  left: 0;
  z-index: 100000;
}


.processing {
  position: fixed;    
  top: 48%;
  left: calc((100% - 120px) / 2);
  z-index: 100001;
}



.processing {
  width: 120px;
  height: 20px;
  border-radius: 20px;
  background:
   repeating-linear-gradient(135deg,#f03355 0 10px,#ffa516 0 20px) 0/0%   no-repeat,
   repeating-linear-gradient(135deg,#ddd    0 10px,#eee    0 20px) 0/100%;
  animation: l3 2s infinite;
}
@keyframes l3 {
    100% {background-size:100%}
}