@charset "UTF-8";
/***************************************************************
layout
***************************************************************/

/*------------------------------------------------------------
base
------------------------------------------------------------*/

body {
  background-color: #F4F7FA;
}

.fixed-nav {
  padding-top: 60px;
}

/*聖徳大学ロゴ色*/

.u_color {
  color: #7E5FDD;
}

.u_color_bg {
  background-color: #7E5FDD;
}

/*------------------------------------------------------------
header
------------------------------------------------------------*/

header#header {
  width: 100%;
  height: 60px;
  background-color: #7E5FDD;
  color: #fff;
}

.navbar {
  padding: 0;
}

.navbar-brand {
  padding: 7px 0;
  margin-left: 5px;
  font-size: 1rem;
}

.navbar-center {}

.navbar-center {
  margin: 0 0 0 auto;
}

/*.navbar-item{height: 100%;}*/

.navbar-menu {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
  list-style-type: none;
  margin-bottom: 0;
}

.navbar-menu .nav-link {
  vertical-align: middle;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.navbar-menu .nav-item .nav-link {
  padding: 23px 1rem;
  margin-left: 2px;
  width: 96px;
  font-size: 14px;
  line-height: 1;
  text-align: center;
  background-color: rgb(255, 255, 255, 0);
  color: #fff;
}

.navbar-menu .active .nav-link, .navbar-menu .nav-item .nav-link:hover {
  background-color: #fff;
  color: #7E5FDD;
  font-weight: bold;
}

/*ログアウト*/

.navbar #global_navbar_logout {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  color: #fff;
  width: 97px;
  height: 60px;
  font-size: 14px;
}

/*------------------------------------------------------------
sidebar
------------------------------------------------------------*/

.sidebar {
  position: fixed;
  top: 60px;
  bottom: 0;
  left: 0;
  padding: 0;
  z-index: 1;
  height: 100%;
  background-color: #333;
}

.sidebar-sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 60px;
  /* Height of navbar */
  height: calc(100vh - 50px);
  padding-top: .5rem;
  overflow-x: hidden;
  overflow-y: auto;
  /* Scrollable contents if viewport is shorter than content. */
}

.tabs {
  padding-top: 32px;
}

.sidebar .nav-link {
  padding: 12px 12px 12px 20px;
  font-size: 14px;
  color: #fff;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.sidebar .nav-link:hover, .sidebar .active .nav-link {
  background-color: rgb(127, 138, 148, 0.6);
  /*background-color: #7F8A94;*/
}

.sidebar li i {
  margin-right: 1em;
}

/*------------------------------------------------------------
main
------------------------------------------------------------*/

.page-header {
  margin-top: 10px;
  margin-bottom: 30px;
  border-bottom: 1px solid #7E5FDD;
}

.page-header h1 {
  color: #7E5FDD;
  font-size: 21px;
  font-weight: bold;
  line-height: 34px;
}

/**********************************************
topArea（ページタイトル直下、テーブルの上）
**********************************************/

.topArea {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

/*flexのアイテムを右寄せ*/

.topArea .right-end {
  margin: 0 0 0 auto;
}

.topArea label {
  font-size: 16px;
  margin-bottom: 0;
}

.topArea label i {
  font-size: 16px;
  vertical-align: middle;
}

.topArea .form-control {
  display: inline-block;
  width: 180px;
}

.topArea input[type="text"] {
  vertical-align: middle;
  border: 1px solid #ddd;
  height: 30px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

#reporepo_admin_submenu_mail_list li a {
  color: #7E5FDD;
  font-weight: bold;
}

/**********************************************
tableArea
**********************************************/

.tableArea {
  padding: 0 0 22px;
}

.tableArea .table-header {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  padding-top: 16px;
  height: 60px;
}

.table-title {
  margin: 2px 0 0 15px;
  font-size: 18px;
  font-weight: bold;
  color: #333;
}

/*テーブルタイトル右エリア**********************************/

.table-header .right-end {
  margin: 0 16px 0 auto;
}

/***************************************************************
parts
***************************************************************/

/*背景白ボックス*/

.cardStyle {
  margin: 16px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.cardStyle header.title {
  padding: 24px;
  font-weight: bold;
  color: #7E5FDD;
}

.cardStyle .card-content {
  padding: 0 24px 24px 24px;
}

/*------------------------------------------------------------
form
------------------------------------------------------------*/

.form-control {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

/*------------------------------------------------------------
ボタン
------------------------------------------------------------*/

button.btn {
  font-size: 14px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

.btn-primary {
  background: linear-gradient(to bottom, #7E5FDD 0%, #6149AB 100%);
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.12), 1px 1px 2px rgba(0, 0, 0, 0.24);
  border-color: #7E5FDD;
}

/*hover指定（button適用時含む）*/

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary:active.focus, .btn-primary.active, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.active.focus, .open>.dropdown-toggle.btn-primary, .open>.dropdown-toggle.btn-primary:hover, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary.focus, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus {
  background: #B19CFF;
  border-color: #B19CFF;
  color: #fff;
}

/*クリックした後のグロー*/

.btn-primary:focus, .btn-primary.focus {
  box-shadow: 0 0 0 .2rem rgba(210, 178, 252, 0.5)
}

/*クリックした後*/

.btn-primary.disabled, .btn-primary:disabled {
  background-color: #B19CFF;
  border-color: #B19CFF
}

/*クリック時*/

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show>.btn-primary.dropdown-toggle {
  background-color: #9D82FF;
  border-color: #D2B2FC
}

/*クリック時グロー*/

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show>.btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 .2rem rgba(210, 178, 252, 0.5)
}

/*------------------------------------------------------------
secondary
------------------------------------------------------------*/

.btn-secondary {
  background-color: #7F8A94;
  border-color: #7F8A94;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary:active:focus, .btn-secondary:active:hover, .btn-secondary:active.focus, .btn-secondary.active, .btn-secondary.active:focus, .btn-secondary.active:hover, .btn-secondary.active.focus, .open>.dropdown-toggle.btn-secondary, .open>.dropdown-toggle.btn-secondary:hover, .open>.dropdown-toggle.btn-secondary:focus, .open>.dropdown-toggle.btn-secondary.focus, .btn-secondary.disabled:hover, .btn-secondary[disabled]:hover, fieldset[disabled] .btn-secondary:hover, .btn-secondary.disabled:focus, .btn-secondary[disabled]:focus, fieldset[disabled] .btn-secondary:focus, .btn-secondary.disabled.focus, .btn-secondary[disabled].focus, fieldset[disabled] .btn-secondary.focus {
  background: #B19CFF;
  border-color: #B19CFF;
  color: #fff;
}

/*------------------------------------------------------------
warning
------------------------------------------------------------*/

.btn-warning {
  /*background-color: #7E5FDD;*/
  background: linear-gradient(to bottom, #C3E545 0%, #AECC3D 100%);
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.12), 1px 1px 2px rgba(0, 0, 0, 0.24);
  border-color: #C3E545;
}

.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning:active:focus, .btn-warning:active:hover, .btn-warning:active.focus, .btn-warning.active, .btn-warning.active:focus, .btn-warning.active:hover, .btn-warning.active.focus, .open>.dropdown-toggle.btn-warning, .open>.dropdown-toggle.btn-warning:hover, .open>.dropdown-toggle.btn-warning:focus, .open>.dropdown-toggle.btn-warning.focus, .btn-warning.disabled:hover, .btn-warning[disabled]:hover, fieldset[disabled] .btn-warning:hover, .btn-warning.disabled:focus, .btn-warning[disabled]:focus, fieldset[disabled] .btn-warning:focus, .btn-warning.disabled.focus, .btn-warning[disabled].focus, fieldset[disabled] .btn-warning.focus {
  background: #A7EC1A;
  border-color: #A7EC1A;
  color: #fff;
}

.btn-warning:focus, .btn-warning.focus {
  box-shadow: 0 0 0 .2rem rgba(128, 255, 0, 0.5)
}

.btn-warning.disabled, .btn-warning:disabled {
  background-color: #A7EC1A;
  border-color: #A7EC1A
}

.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, .show>.btn-warning.dropdown-toggle {
  background-color: #90B800;
  border-color: #A7EC1A
}

.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, .show>.btn-warning.dropdown-toggle:focus {
  box-shadow: 0 0 0 .2rem rgba(128, 255, 0, 0.5)
}

/*ボタンデザイン効果
------------------------------------------------------------*/

.fab {
  /*シャドウ*/
  transition: .3s;
  /*滑らかな動きに*/
  /*box-shadow: 0 2px 2px 0 rgba(0,0,0,.12), 0 2px 2px 0 rgba(0,0,0,.24);/*影*/
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.12), 1px 1px 2px rgba(0, 0, 0, 0.24);
}

.gd {
  /*青グラデーション*/
  background: linear-gradient(to bottom, #7E5FDD 0%, #6149AB 100%);
}

button.btn-lg {
  font-size: 16px;
}

button.btn-lg i {
  margin-right: 0.6em;
}

.mdi::before {
  font-size: 24px;
  line-height: 14px;
}

.btn .mdi::before {
  /*position: relative;*/
  top: 4px;
}

.btn-xs .mdi::before {
  font-size: 18px;
  top: 3px;
}

.btn-sm .mdi::before {
  font-size: 18px;
  top: 3px;
}

.mdi.mdi-18px {
  position: relative;
  top: 1px;
}

/*------------------------------------------------------------
テーブル
------------------------------------------------------------*/

.tableArea .table>thead>tr>th {
  border: none;
  background-color: #F9F9F9;
  color: #808080;
  font-weight: normal;
  font-size: 13px;
  white-space: nowrap;
}

.tableArea .table td, .tableArea .table th {
  border-top: none;
  border-bottom: 1px solid #ddd;
  color: #333
}

/*------------------------------------------------------------
検索
------------------------------------------------------------*/

.searchArea .form-control {
  display: inline-block;
  width: 160px;
}

.searchArea input[type="text"] {
  border: 1px solid #ccc;
  height: 30px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

.searchArea label {
  font-size: 14px;
  margin-right: 10px;
}

.searchArea input {
  vertical-align: middle;
}

.searchArea .btn {
  vertical-align: middle;
  border: none;
  line-height: 30px;
  font-size: 14px;
  margin: -1px 0 0 0;
  padding: 0 1em;
}

/*------------------------------------------------------------
期間を指定してダウンロード
------------------------------------------------------------*/

/*.downloader .btn-lg*/

.topArea .btn-lg {
  border: none;
  margin-top: -5px;
}

/*小見出しとinput欄の間をあける*/

label>input:first-of-type {
  margin-left: 5px;
}

/*------------------------------------------------------------
input file
------------------------------------------------------------*/

.import_file input[type="file"].form-control {
  padding: 4px;
  min-width: 400px;
  background-color: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

/*------------------------------------------------------------
ページネーション
------------------------------------------------------------*/

.tableArea nav.pagination {
  margin-right: 16px;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

ul.pagination-list {
  margin-bottom: 0;
}

.page-link, .page-link:hover {
  color: #333;
  border-color: #ccc;
}

.page-item.active .page-link {
  color: #fff;
  border: 1px solid #ccc;
  background-color: #7E5FDD;
}

.page-link:hover {
  background-color: #CCE8FF;
}

/***************************************************************
ページ別クラス
***************************************************************/

/*------------------------------------------------------------
メール
------------------------------------------------------------*/

/*ナビゲーション*/

#reporepo_admin_submenu_mail_list {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
  list-style-type: none;
  margin-bottom: 0;
  padding: 0;
  justify-content: space-between;
}

#reporepo_admin_submenu_mail_list li {
  /*width:174px;*/
  position: relative;
  margin-right: 20px;
  width: 174px;
  text-align: center;
  font-size: 16px;
  line-height: 1;
}

#reporepo_admin_submenu_mail_list li a {
  padding: 15px 0;
  border: 2px solid #7E5FDD;
  background-color: #fff;
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

#reporepo_admin_submenu_mail_list li a:hover {
  border-color: #B19CFF;
  color: #B19CFF;
}

/*メールリスト
------------------------------------------------------------*/

#mail-list input[type="number"] {
  width: 50px;
}

#mail-list .right-end {
  text-align: right;
  margin-right: 16px;
}

/*テンプレ
------------------------------------------------------------*/

#mailtemplate_edit_form {
  padding: 30px;
  border-top: 1px solid #ccc;
}

#mailtemplate_edit_form .form-control {
  margin-bottom: 10px;
}

#mailtemplate .right-end {
  text-align: right;
}

/*------------------------------------------------------------
操作記録
------------------------------------------------------------*/

.target_change {
  padding: 16px 0;
}

.target_change .text {
  font-size: 16px;
  font-weight: bold;
  color: #7E5FDD;
}

#operation_record_change_target_form label {
  font-size: 16px;
  font-weight: bold;
}

#operation_record_change_target_form label>input[type="radio"] {
  margin-right: 0.3em;
}

#operation_record_change_target_form label {
  margin-left: 0.5em;
}

#operation_record_change_target_form button {
  margin-left: 1em;
  padding-left: 2em;
  padding-right: 2em;
}

/*------------------------------------------------------------
変更ウインドウ
------------------------------------------------------------*/

.dialogArea {
  background-color: rgba(0, 0, 0, 0.5);
  bottom: 0;
  display: none;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 4000;
}

.overflow-dialog {
  display: none;
  left: 0;
  margin: auto;
  position: fixed;
  right: 0;
  width: 400px;
  z-index: 4001;
}

.overflow-dialog.overflow-dialog-large {
  width: 720px;
}

.overflow-dialog.overflow-dialog-large input {
  width: 100%;
}

.overflow-dialog.overflow-dialog-large textarea {
  width: 100%;
  height: 200px;
}

.overflow-dialog.error_detail_dialog pre {
  max-height: 500px;
  overflow-y: auto;
}

article.message {
  margin: 16px 0;
  padding: 24px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}

.message-header p {
  font-size: 20px;
  font-weight: bold;
  color: #7E5FDD;
}

.message-body label {
  font-size: 14px;
}

.message-body input.form-control {
  margin: 10px 0;
}

/*------------------------------------------------------------
REPORT EDIT
------------------------------------------------------------*/

.report textarea {
  height: 150px;
}

.pdfcontainer_buttons {
  top: 75px;
  text-align: right;
}

.pdfcontainer_buttons button {
  display: none;
}

.pre-wrap {
  white-space: pre-wrap;
}

textarea.confirm:disabled {
  background-color: #fff;
  border: 0;
  color: #212529;
  padding: 0;
  resize: none;
}

/*------------------------------------------------------------
LOGIN BOX
------------------------------------------------------------*/

#login-box header h1 {
  font-size: 26px;
}

#login-box {
  margin-top: 50px;
}

#login-box label {
  width: 100%;
  font-size: 18px;
}

#login-box label>input:first-of-type {
  margin: 0.2em 0 0.3em 0;
}

#login-box .btn-lg {
  margin: 1em 0;
}

#login-box hr {
  margin: 3em 0 1em;
}

/*------------------------------------------------------------
footer
------------------------------------------------------------*/

#footer {
  width: 100%;
  padding: 18px;
  border-top: 1px solid #ddd;
  background-color: #F4F7FA;
}

#copyright {
  font-size: 12px;
}
