html{
    height:100%;
}
body{
    font-family: 'Hiragino Kaku Gothic ProN',YuGothic,'Yu Gothic','游ゴシック体','游ゴシック',sans-serif;
    height:100%;
}


/* モーダル */
@media (min-width: 576px){
    .search-modal-dialog {
        max-width: 80%;
        margin: 1.75rem auto;
    }
}

/* 背景 */
.bg-blue{background-color:#0000ff;}
.bg-gray{background-color:#c6c6c6;}
.bg-gray-important{background-color:#c6c6c6!important;}
.bg-dark-gray{background-color:#6c6b6b;}
.bg-light-gray{background-color:#dadada;}
.bg-light-yellow{background-color:#feffb8;}
.bg-black{background-color:#000000;}
.bg-white{background-color:#ffffff;}
.bg-green{background-color:#00ff00;}
.bg-dark-green{background-color:#269b26;}
.bg-crimson{background-color:#dc143c;}
.bg-royalblue{background-color:#4169e1;}
.bg-red{background-color:#ff0000;}
.bg-light-danger{background-color: #f9c7c7};
.bg-pink{background-color:#ff9d9d;}
.bg-orangeore{background-color:#f8c6a2;}
.bg-dark-orange{background-color:#db6007;}
.bg-attention{background-color:#f0f16a;}
.bg-top-infomation{background-color: #91e8f5;}
.bg-aquamarine{background-color:#7fffd4 ;}
.bg-dark-aquamarine{background-color:#53b997 ;}
.bg-light-aquamarine{background-color:#f0ffff ;}
.bg-firebrick{background-color:#b22222;}
.bg-warning{background-color:#d9ff00;}
.bg-yellow{background-color:#ffff00;}
.bg-dark-yellow{background-color: #d59900;}
.border-warning{border-color:#d9ff00;}
.bg-readonly{background-color: #e9ecef;}
.bg-purchase{background-color:#473bbf;}

.text-red{color:red;}
.text-blue{color:blue;}
.text-white{color:white;}
.text-black{color:black;}
.text-gray{color:#818184;}
.text-green{color:#00ff00;}
.text-deepgreen{color:#049e04e8;}

.no_br{white-space: nowrap;}

.h1{
    font-size: 2.5rem!important;;
}

/* h */
.h3{
    font-size: 1.75rem;      font-weight: 500;   line-height: 1.2;
}
.h4{
    font-size: 1.5rem;      font-weight: 500;   line-height: 1.2;
}
.h5{
    font-size: 1.25rem;     font-weight: 500;   line-height: 1.2;
}
.font-small{
    font-size: 0.8rem;     font-weight: 500;
}
.font-very-small{
    font-size: 0.6rem;     font-weight: 500;
}

/* ヘッダ */
.dropdown-head-profile .dropdown-item{
    color: #4e4e4e;
    font-size:0.75rem;
}


/* 各画面での指示 */
.project_head_check_01{
    position: relative;
    border-top: solid 2px #984b4b;
    border-bottom: solid 2px #984b4b;
    background: #ffdfdf;
    line-height: 1.4;
    padding: 0.4em 0.5em;
    margin: 2em 0 0.5em;
}
.project_head_check_01:after{
    position: absolute;
    font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
    content: '\f0a7\ Check';
    background: #984b4b;
    color: #fff;
    left: 0px;
    bottom: 100%;
    border-radius: 5px 5px 0 0;
    padding: 5px 7px 3px;
    font-size: 0.7em;
    line-height: 1;
    letter-spacing: 0.05em;
}

.project_head_check{
    position: relative;
    color: #000;
    background: #ffdfdf;
    border-top: solid 2px #984b4b;
    border-bottom: solid 2px #984b4b;
    line-height: 1.4;
    padding: 0.5em 0.5em 0.5em 1.8em;
}
.project_head_check:after{
    font-family: "Font Awesome 5 Free";
    content: "\f14a";
    position: absolute;
    left : 0.5em;
}
/* ボタン */
.btn-label{
    padding:0rem .5rem;
}
.btn-thin{
    padding:.1rem .3rem;
    margin:.2rem 0;
    font-size:0.7rem;
    line-height:1.5;
    border-radius: .2rem;
}

/*-------- テーブル -----------*/
/* テーブルのストライプ */
.table-striped tbody tr:nth-of-type(odd) {
	background-color: rgba(0,0,0,.02);
}
.table-striped-2span tbody tr:nth-of-type(4n+1), .table-striped-2span tbody tr:nth-of-type(4n+2) {
    background-color: rgba(0,0,0,.02);
}
/* ホバー */
.table-hover tbody tr:hover {
    /*color: #212529;*/
    background-color: rgba(0, 0, 0, 0.1)!important;
}

/* tbody全体ホバー */
.tbodyhover tbody:hover{
    background-color: rgba(0, 0, 0, 0.1)!important;
}

.table td{
    vertical-align:middle;
}





/*--------- カレンダー系 ---------*/
#schedule_calendar table th{
    color:#818184;
}

#schedule_calendar td.w6 {
    background-color: #bccbfe;
}

#schedule_calendar td.w0 {
    background-color: #FFD1D1;
}
#schedule_calendar .day,#schedule_calendar .day_link {
    font-size:1.25rem;
    font-weight:bold;
}

#schedule_calendar div.cal_box {
    overflow-x : hidden;
    overflow-y : hidden;
    margin : 1px;
    height:1rem;
    padding:0px;
    line-height:0.5rem;
}
#schedule_calendar div.salaried{
    background: #fb6666;
}
#schedule_calendar div.holidaywork{
    background: #05d2bc;
}

#schedule_calendar div.chokki{
    background: #804ae7;
}
#schedule_calendar div.absence{
    background: #e74a4a;
}

#schedule_calendar div.compensatory{
    background: #3348be;
    border: 1px solid #3348be;
}

#schedule_calendar div.zangyo{
    background: #05d2bc;
}

#schedule_calendar div.late{
    background: #5e05d2;
}

#schedule_calendar div.cal_box a{
    font-size:0.7rem;
    color:#ffffff;
    text-decoration: none;
    padding : 0px;
    margin:0px;
}
#schedule_calendar div.disable{
    display:none;
}

.badge-darklight{
    color:#fff;
    background-color: #858687;
}

.badge-small{
    font-size:0.5em;
}
.badge-big{
    font-size:125%;
}
/*---------- フォーム --------*/
/* マウスクリック不可 tabindex=-1を設定しないとタブ遷移できるので忘れずに */
.none_input{
    pointer-events : none;
    background-color:#e9ecef;
}
.pulldown_readonly{
    background-color:#e9ecef;
}


.form-control-noborder{
    border:none!important;
}


/*------- プロジェクト・経費管理システム */
.ps_container{
    font-size:0.8rem;
    background-color: #d6d6d6;
    min-height:100%;                        /* 画面下部まで延ばす */
}
.ps_container h1,.h1{font-size:1.5em;}

.ps_container h2,.h2{font-size:1.3rem;}
.ps_container h3,.h3{font-size:1.0rem;}

.ps_container h1{
    border-bottom:1px solid rgb(180, 180, 180);
}
.ps_container nav.breadcrumbNav{
    padding-top:0.8rem;
    padding-bottom:0.3rem;
}
.ps_container nav.breadcrumbNav a{
    color:#6c757d;
}

.ps_container .breadcrumb{
    background-color: #fbefe5;
}

.ps_container .breadcrumb-item{
    color:#6c757d;
}

.ps_container .breadcrumb-item.active{
    color:#000000;
}

/* 下線 */
.ps_container h3{
    border-bottom:1px solid #808080;
}

.ps_container th{
    background-color: #e8ffe7;
}

/* 各機能コンテナ */
.ps_container .my_container{
    border:  1px solid rgba(0,0,0,.125);
    background-color: #fff;
    border-radius: .25rem;
    padding:1rem;
}

.ps_container .my_container .my_child_container{
    border:  1px solid rgba(0,0,0,.125);
    background-color: #fffafa9e;
    border-radius: .25rem;
    padding:.5rem 1.5rem;
}

/* コンテナ内 フォーム情報 */
.ps_container .my_container .form-control-sm{
    padding: .2rem;
    font-size: .8rem;
    line-height: 1.2;
    border-radius: .2rem;
}
.ps_container .my_container input.form-control-sm{
    height: calc(1.5em + .5rem + 2px);
}
.ps_container .my_container textarea.form-control{
    height: auto;
}

/* コンテナ内 フォームグループ */
.ps_container .my_container .form-group{
    margin-bottom:0.2rem;
}

.ps_container .my_container .form-group label{
    margin-bottom:0.1rem;
}

/* PC画面の場合、THに色を塗る */
@media (min-width:767px) {
    .ps_container .my_container .form-group .th{
        background-color: #ffdee2;
    }
}

.ps_container .my_container .form-row-align{
    line-height: 2.5em;
}

.no_width{
    width:initial!important;
}

.ps_table th,td{
    padding:.2rem;
}
.ps_table th,.ps_result_tbl th{
    background-color: #ffeaea;
}

.ps_search_form > table{
    color:#000000;
    font-size:0.8em;
}

.ps_search_form .form-control{
    height: calc(1.5em + .5rem + 2px);
    padding: .25rem .5rem;
    font-size: .7rem;
    line-height: 1.5;
    border-radius: .2rem;
}

.ps_result_tbl th{
    border-top : 0px;
    border-bottom : 1px;
}
.ps_result_tbl th,.ps_result_tbl td{
    padding:0.5rem 0.5rem;
}

.ps_result_tbl tbody.thin{
    font-size:0.8rem;
}
@media (max-width:767px) {
    .page-link{
        padding:0.15rem .4rem;
    }
}

/*------ 勤怠管理  -----*/
#schedule_calendar table td{
		padding : 0px;
		vertical-align: top;
		height: 80px;
	}

#att_header span.head_val {
    font-size:1.3rem;
    font-weight:bold;
}

#att_header .head_contents{
    padding : 0 10px;
}


#schedule_calendar .work{
    background:#abaaa5;
    color:#ffffff;
}

#schedule_calendar .work_contents{
    text-align:center;
    font-size:0.8rem;
}

#schedule_calendar .holiday{
    background:#fb6666;
    font-size:0.8rem;
    text-align:center;
    color:#ffffff;
}
#schedule_calendar .holiday a{
    color:#ffffff;
}

#schedule_calendar .holiday_work{
    background:#05d2bc;
    font-size:0.8rem;
    text-align:center;
}

#schedule_calendar .holiday_work a{
    color:#ffffff;
}

/*------- bootstrap hack ---------*/
.breadcrumb{
    background-color: #e5fbf3;
}

/* ぱんくずのマージン調整 */
.container-fluid .breadcrumb{
    margin-bottom:0.1rem;
    padding : .5rem 1.0rem;
}

.card-body{
    padding:0.5rem 1.25rem;
}

/* luminasプラグインを表示する際に、Bootstrapのfix-topの上を行く必要がある */
.lum-lightbox{
    z-index: 1501;
}

/*------------- ボタン ---------------*/
/* 通常のボタン色 */
.btn-pink,
.btn-pink.disabled, .btn-pink:disabled {
  color: #fff;
  background-color: #ff00f2;
  border-color: #bd01b3;
}

/* focusされた時の枠線の色 */
.btn-pink:focus, .btn-pink.focus,
.btn-pink:not(:disabled):not(.disabled):active:focus, .btn-pink:not(:disabled):not(.disabled).active:focus,
.show > .btn-pink.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

/* hover時（マウスカーソルを重ねた時）の色（通常より濃いor暗めの色を指定）*/
.btn-pink:hover {
  color: #fff;
  background-color: #ff00f2;
  border-color: #bd01b3;
}

/* active時の色（hover時と同等かさらに濃いor暗めの色を指定） */
.btn-pink:not(:disabled):not(.disabled):active, .btn-pink:not(:disabled):not(.disabled).active,
.show > .btn-pink.dropdown-toggle {
  color: #fff;
  background-color: #ff00f2;
  border-color: #bd01b3;
}

.btn-outline-pink {
    color: #ff00f2;
    background-color: transparent;
    background-image: none;
    border-color: #ff00f2;
  }
  
  .btn-outline-pink:hover,
  .btn-outline-pink:not(:disabled):not(.disabled):active, .btn-outline-pink:not(:disabled):not(.disabled).active,
  .show > .btn-outline-pink.dropdown-toggle {
    color: #fff;
    background-color: #ff00f2;
    border-color: #ff00f2;
  }
  
  .btn-outline-pink:focus, .btn-outline-pink.focus,
  .btn-outline-pink:not(:disabled):not(.disabled):active:focus, .btn-outline-pink:not(:disabled):not(.disabled).active:focus,
  .show > .btn-outline-pink.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
  }
  
  .btn-outline-pink.disabled, .btn-outline-pink:disabled {
    color: #ff00f2;
    background-color: transparent;
  }


/* お気に入りで使用 */
.btn-outline-fav-off{
    color:#6c757d;
    border-color:#6c757d;
}
.btn-outline-fav-off:hover{
  color:#ff005e;
  background-color:#fff;
  border-color:#ff005e;
}
.btn-outline-fav{
    color:#ff005e;
    background-color:#fff;
    border-color:#ff005e;
 }
.btn-outline-fav:hover{
    color:#b98c9d;
    border-color:#b98c9d;
}

/* Select2のreadonly見た目対応 */
.select2-readonly .select2-selection--single {
    background-color: #e9ecef!important; /* グレーアウト色 */
    cursor: not-allowed!important;        /* マウスカーソルを変更 */
}


/* エラーコンテナ */
div.bserr{
    a {
        color:#fff;
        text-decoration: underline; /* 下線を表示 */
        text-decoration-color: #fff; /* 下線の色を赤にする */
    }
}


/*-------------- 多層配置用の最小CSS ------------------*/
.dropdown-submenu {
  position: relative;
}

/* 基本は右側に出す */
.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-left: .1rem;
}

/* 左展開用クラス */
.dropdown-submenu.drop-left > .dropdown-menu {
  left: auto;
  right: 100%;
  margin-right: .1rem;
}

@media (max-width: 767.98px) {

  /* サブメニュー全体を縦展開として扱う */
  .dropdown-submenu > .dropdown-menu {
    --indent: 1rem;               /* 1文字分相当。好みで調整可 */
    margin-left: var(--indent);   /* ← 枠ごと右にずらす（ボーダーも含めて移動） */
    width: calc(100% - var(--indent)); /* ← ずらした分だけ幅を減らす */
    background-color: #f7f3f3;
  }

  /* さらに深い階層もすべてインデント */
  .dropdown-submenu .dropdown-submenu > .dropdown-menu {
    --indent: 2rem;               /* 1文字分相当。好みで調整可 */
    margin-left: var(--indent);   /* ← 枠ごと右にずらす（ボーダーも含めて移動） */
    width: calc(100% - var(--indent)); /* ← ずらした分だけ幅を減らす */
  }
  .dropdown-submenu .dropdown-submenu .dropdown-submenu > .dropdown-menu {
    margin-left: 3em !important; /* 第3階層 → 3文字インデント */
  }

  /* PC用左右展開を無効化 */
  .dropdown-submenu > .dropdown-menu {
    top: 0 !important;
  }
}