/* Custom page CSS
-------------------------------------------------- */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://use.fontawesome.com/releases/v5.3.1/css/all.css);

:root { 
	/* -------------------------------------------------- */
	/*  color                                             */
	/* -------------------------------------------------- */
	--color-test : #ff3366;					/* Test */
	/* Control - Text */
	--color-text-dark : #2b2b2b;			/* 文字 */
	--color-text-light : #ffffff;			/* 文字 */
	--color-text-light-dark : #594e52;		/* 文字 */
	--color-text-stress : #ff4500;			/* 文字 */
	--color-text-section : #888888;			/* セクションタイトル文字 */	
	--color-text-footer : #6c757d;			/* フッター文字 */
		
	/* Control - Area */
	--color-interface : #ffffff;			/* インターフェースエリア  #ffffff*/
	--color-blank : #f3f3f3;				/* ブランクエリア  #f3f3f3*/
	--color-header-border : #d9d9d9;		/* ヘッダー境界ボーダー*/
	--color-separate-border-dark : #696969;	/* 区切りボーダー*/
	--color-separate-border-light : #ff6347;/* 区切りボーダー*/
	--color-band-class-name : #fff3b8;		/* クラス名*/
	--color-communication-area : #dbebc4;	/* コミュニケーションエリア*/
	--color-modal-header : #b2cbe4;			/* モーダルヘッダー */
	
	/* Control - Grid */
	--color-grid-header : #5b7e91;			/* グリッドヘッダー #dcdcdc 5b7e91*/
	--color-grid-header-border : #f8fbf8;	/* グリッドヘッダー ボーダー */
	--color-grid-body : #f8fbf8;			/* グリッドボディ*/
	--color-grid-body-light : #fffffc;		/* グリッドボディ*/
	--color-grid-body-header : #c0c6c9;		/* グリッドボディヘッダー*/
	--color-grid-body-odd : #e7f4f6;		/* グリッド明細奇数番目 #c3c3c3 b5c7d1 #c1e4e9 #e7f4f6*/
	--color-grid-body-even : #d4ecef;		/* グリッド明細偶数番目 #c3c3c3 86a3b3 #9bd4dc #d4ecef*/
	--color-grid-body-border : #dcdcdc;		/* グリッド明細ボーダー */
	--color-grid-body-childcare : #f8b862;	/* グリッド保育従事者 */
	--color-grid-body-child : #a0d8ef;		/* グリッド園児合計 */
	--color-grid-body-error : #e60033;		/* グリッドエラー */
	--color-grid-body-warning : #ffdc00;	/* グリッド警告 */
	--color-grid-body-band : #4c6473;		/* グリッド帯 */
	--color-grid-icon-error : #ffea00;		/* グリッドアイコンエラー */
	--color-grid-icon-warning : #ffffff;	/* グリッドアイコン警告 */
	--color-grid-calendar-date :#043c78;	/* グリッドカレンダー日付 */
	
	/* Control - Button */
	--color-button-event : #3e98db;			/* ボタンエリア */
	--color-button-panel : #455765;			/* ボタンエリア */
	--color-button-delete : #e60033;		/* 削除ボタンエリア */
	--color-button-working-start : #68a4d9;	/* 出勤ボタン */
	--color-button-working-end : #ea618e;	/* 退勤ボタン */
	--color-button-break-start : #89c997;	/* 休憩開始ボタン */
	--color-button-break-end : #fad09e;		/* 休憩終了ボタン */
	--color-button-date : #f7f6f5;			/* カレンダー前日翌日ボタン */
	--color-button-time-bg : #ffffff;		/* カレンダー前次時間ボタン背景 */
	--color-button-time-border : #ced4da;	/* カレンダー前次時間ボタンボーダー */
	--color-button-sleep : #89c997;			/* 睡眠ボタン */
	--color-button-bowels : #be8f68;		/* 排便ボタン */
	--color-button-meal : #d1de4c;			/* 食事ボタン */
	--color-button-mood : #a0d8ef;			/* 機嫌ボタン */
	--color-button-temperature : #f7f6f5;	/* 検温ボタン */
	--color-button-shift-ask : #00afcc;		/* シフト提出ボタン */
	--color-button-shift-closed : #fff799;	/* シフト締切ボタン */
	--color-button-shift-cancel : #ef857d;	/* シフト締切解除ボタン */
	--color-button-shift-settled : #2cb4ad;	/* シフト確定ボタン */
	--color-button-shift-clear : #e83929;	/* シフトクリアボタン */
	--color-button-absent : #ef857d;		/* 欠席連絡ボタン */
	--color-button-late : #fff799;			/* 遅刻連絡ボタン */
	--color-button-print : #8f6552;			/* 帳票ボタン */
	--color-button-monthly-report : #38b48b;/* 月次報告ボタン */
	--color-button-pmms-cooperation : 006400;/* 公金管理ボタン */
	--color-button-sick-child : #88b5d3;	/* 病児保育 園児 */
	--color-button-sick-nurse : #f5b199;	/* 病児保育 看護師 */
	--color-button-sick-teacher : #a5c9c1;	/* 病児保育 保育士 */
	--color-button-sleep-action : #1e50a2;	/* 午睡アクションボタン */
	--color-button-transition : #316745;	/* 別画面 */
	--color-button-excel : #107C41;			/* Excelボタンエリア */
	
	/* Menu Item */
	--color-daily-board : #a688bd;			/* デイリーボード */
	--color-child-book : #bbe2f1;			/* 園児台帳*/
	--color-information : #fdd35c;			/* お知らせ*/
	--color-bulletin-board : #edde7b;		/* 掲示板*/
	--color-schedule : #f5b2b2;				/* 園内スケジュール*/
	--color-shift-calendar : #ff7f50;		/* シフト希望提出*/
	--color-staff-shift : #00947a;			/* スタッフシフト*/
	--color-child-attend-plan : #4753a2;	/* 園児出席予定表*/
	--color-staff-clock-on : #3cb37a;		/* スタッフ通勤打刻*/
	--color-child-clock-on : #006eb0;		/* 園児通園打刻*/
	--color-staff-attend : #a5c9c1;			/* スタッフ出勤簿*/
	--color-child-attend : #88b5d3;			/* 園児出席簿*/
	--color-child-communication : #fad09e;	/* コミュニケーション*/
	--color-new-status : #da536e;			/* 新着件数 */
	--color-facility : #9d8e87;				/* 園管理*/
	--color-distribute-documents : #f6ae54;	/* 配布資料*/
	--color-settings : #7d7d7d;				/* 設定*/
	--color-sick : #f6bfbc;					/* 病児保育*/
	--color-download-documents : #c89932;	/* 様式ダウンロード*/
	--color-food-inspection : #c7dc68;		/* 検食*/
	--color-codmon-migration : #2ca9e1;		/* CODMON移行*/
	--color-notification : #f0e68c;			/* 運営からのお知らせ */
	
	--color-required : #eebbcb;				/* 必須 */

	--color-weekday : #f8fbf8;				/* 平日 */
	--color-sunday : #ff3366;				/* 日曜日 */
	--color-saturday : #0000ff;				/* 土曜日 */
	--color-child-mood-good : #fdd35c;		/* 機嫌_良 */
	--color-child-mood-normal : #594e52;	/* 機嫌_普 */
	--color-child-mood-bad : #82cddd;		/* 機嫌_悪 */
	--color-attendance-none : #3cb37a;		/* 登園_未着 */
	--color-attendance-arrival : #82cddd;	/* 登園_登園 */
	--color-attendance-home : #fdd35c;		/* 登園_退園 */
	--color-save-none : #ef857d;			/* 日誌_未作成 */
	--color-save-temporarily : #fdd35c;		/* 日誌_編集中 */
	--color-save-make : #82cddd;			/* 日誌_作成済み */
	--color-new-status-new : #fff462;		/* 新着_新着 */
	--color-new-status-read : #d83473;		/* 新着_既読 */

	--color-faq-base : #11beae;				/* icon_地球 */
	
	/* Control - Icon */
	--color-icon-globe : #f3981d;			/* icon_地球 */
	--color-icon-user : #626063;			/* icon_ユーザー */
	--color-icon-thermometer : #79c06e;		/* icon_体温計 */
	--color-icon-information : #fac559;		/* icon_情報 */
	
	/* Control - Scrollbar */
	--color-scrollbar-track : #f5f5f5;		/* スクロールバーの軌道 */
	--color-scrollbar-thumb : #808080;		/* スクロールバーの動く部分 */
	
	/* Control - Tab */
	--color-tab-control-base : #ffffff;		/* Tabコントロール */
	--color-tab-control-active : #4169e1;	/* Tabコントロール Active */

	/* ------------------------- END -------------------------------- */

	
	--color-datepicker-calendar : #ffffff;	/* DatePickerカレンダーエリア */
	--color-datepicker-icon : #808080;		/* DatePickerアイコンエリア */
	--color-line-dark : #465258;			/* ライン */
	--color-line-light : #6f7e8d;			/* ライン */
	--color-line-smoke : #dcdcdc;			/* ライン */
	--color-panel-select : #0d0015;			/* パネル選択 */
	--color-panel-select-border : #a22041;	/* パネル選択 ボーダー*/
	--color-checkbox-border : #999999;		/* チェックボックスボーダー*/
	--color-checkbox-select : #009a9a;		/* チェックボックス選択*/
	--color-breadcrumb-panel : #dcdcdc;		/* パンくずリスト*/
	--color-breadcrumb-select : #ff7f50;	/* パンくずリスト選択*/
	--color-breadcrumb-hover : #999999;		/* パンくずリストhover*/

}

html {
	height: 100%;
	font-size: 100%;
}

@media screen and (max-width: 1024px) {
	/* 1024pxまでの幅の場合に適応される */
	html {
		font-size: 1rem;
	}
}

@media screen and (max-width: 768px) {
	/* 768pxまでの幅の場合に適応される */
	html {
		font-size: 0.75rem;
	}
}

@media screen and (max-width: 480px) {
	/* 480pxまでの幅の場合に適応される */
	html {
		font-size: 0.5rem;
	}
}

@media screen and (max-width: 320px) {
	/* 320pxまでの幅の場合に適応される */
	html {
		font-size: 0.5rem;
	}
}
/* Common styles
-------------------------------------------------- */
body {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 100vh;
	font-size : 0.75rem;
	color: var(--color-text-dark);
 	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
table {
	font-size : 0.75rem;
	color: var(--color-text-dark);
 	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.wrapper {
	flex: 1 0 auto;
	margin-bottom: auto;
	background-color: var(--color-blank);
}
.form {
    margin-bottom: 0;
}
.form-control {
	font-size : 0.75rem;
    margin-bottom: 0.25rem;
    padding-top: 0.25rem;
    padding-right: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 0.25rem;
}
.form-group {
    margin-bottom: 0.25rem;
}
.contents_title {
	margin-top:0;
	margin-right:0;
	margin-bottom: 1rem;
	margin-left: 0.5rem;
	font-size:16px;
	color: var(--color-text-section);
}
input[type="date"],
input[type="month"]
 {
	width: 8rem;
}
input[type="time"]
{
	width: 4.5rem;
}
.modal-body input[type="time"]
{
	width: 5.5rem;
    font-size: 1.0rem;
} 
select.form-control,
select.form-control:not([size]):not([multiple]) 
{
	height:26.8px ;
}
textarea
{
	width: 20rem;
	height:5rem ;
}
textarea:disabled,
textarea[readonly]
{
	background-color: var(--color-blank);
	width: 100%;
	height:100%;
}
.glyphicon {
    padding: 0.3rem;
}
.simpleicon {
    margin-bottom: 0;
    padding-top: 0.375rem;
    font-size: 1rem;
}
.accounticon {
    margin-bottom: 0;
    padding-top: 0.375rem;
    font-size: 1.5rem;
}
.ime-active  {
	ime-mode: active;
}
.ime-inactive {
	ime-mode: inactive;
}
.inline {
	display : inline-block;
	_display : inline;
}
.nowrap {
	white-space: nowrap;
}
.none {
	display:none;
}
.hidden {
	visibility:hidden;
}
.hide {
	display:none;
	visibility:hidden;
}
/* .collapse { */
/* 	visibility:collapse; */
/* } */
.bold {
	font-weight: bold;
}
.btn {
	font-size: 0.75rem;
}
.btn .glyphicon {
	top:0;
	line-height: 1.5;
}
.btn-date {
	width: 1.5rem;
	height:30px;
	color: var(--color-text-dark);
	background-color: var(--color-button-date);
	border-color: var(--color-button-date);
	margin-left: 0.125rem;
	margin-right: 0.125rem;
}
.btn-time {
	width: 1.5rem;
 	height:30px;
	color: var(--color-text-dark);
	background-color: var(--color-button-time-bg);
	border-color: var(--color-button-time-border);
	border-radius: 0.25rem;
	margin-left: 0.125rem;
	margin-right: 0.125rem;
}
.table-scroll {
	overflow-x : auto;
}
.table-fixed {
	table-layout: fixed;
}
.right {
  text-align: right;
}
.left {
  text-align: left;
}
.center {
  text-align: center;
}
.relative {
	position: relative;
}
.stress {
	font-size: 2.0rem;
	color: var(--color-text-stress);	/* 文字 */
	font-weight: bold;
}
.isselect {
	color: var(--color-checkbox-select);	/* 文字 */
}
.word-wrap-break {
	word-wrap: break-word;
	word-break:normal;
	display: inline-flex;
	width:20rem;
	line-height: 36px;
}
.word-wrap-block {
	display: inline-block;
}
.underline {
	text-decoration: underline #1e50a2;
}

.disp-sp {
	display: none;
}


/* list styles
-------------------------------------------------- */
.panel-heading div, .panel-body div{
	overflow: hidden;
}
.panel-heading .form-control, .panel-body .form-control {
	margin-bottom: 0;
}
.panel-heading input[type="date"], 
.panel-body input[type="date"] {
	height:26.8px ;
	width: 6.5rem;
}
.panel-heading input[type="date"]::-webkit-inner-spin-button ,
.panel-body input[type="date"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.panel-heading input[type="date"]::-webkit-clear-button ,
.panel-body input[type="date"]::-webkit-clear-button {
	-webkit-appearance: none;
}

/* font-size */
.f-12 {
	font-size: 4.0rem;	
}
.f-11 {
	font-size: 3.5rem;	
}
.f-10 {
	font-size: 3.0rem;	
}
.f-9 {
	font-size: 2.5rem;	
}
.f-8 {
	font-size: 2.0rem;	
}
.f-7 {
	font-size: 1.5rem;	
}
.f-6 {
	font-size: 1.0rem;	
}
.f-5 {
	font-size: 0.75rem;	
}
.f-4 {
	font-size: 0.625rem;	
}
.f-3 {
	font-size: 0.5rem;	
}
.f-2 {
	font-size: 0.375rem;	
}
.f-1 {
	font-size: 0.25rem;	
}

/* width */
.w-60 {
    width: 60rem;
}
.w-58 {
    width: 58rem;
}
.w-56 {
    width: 56rem;
}
.w-55 {
    width: 55rem;
}
.w-50 {
    width: 50rem;
}
.w-49 {
    width: 49rem;
}
.w-40 {
    width: 40rem;
}
.w-30 {
    width: 30rem;
}
.w-26 {
    width: 26rem;
}
.w-25 {
    width: 25rem;
}
.w-23 {
    width: 23rem;
}
.w-20 {
    width: 20rem;
}
.w-18 {
    width: 18rem;
}
.w-17 {
    width: 17rem;
}
.w-16 {
    width: 16rem;
}
.w-15 {
    width: 15rem;
}
.w-14 {
    width: 14rem;
}
.w-13 {
    width: 13rem;
}
.w-12 {
    width: 12rem;
}
.w-11 {
    width: 11rem;
}
.w-10 {
    width: 10rem;
}
.w-9 {
    width: 9rem;
}
.w-8h {
    width: 8.5rem;
}
.w-8 {
    width: 8rem;
}
.w-7h {
    width: 7.5rem;
}
.w-7 {
    width: 7rem;
}
.w-6h {
    width: 6.5rem;
}
.w-6 {
    width: 6rem;
}
.w-5 {
    width: 5rem;
}
.w-4h {
    width: 4.5rem;
}
.w-4 {
    width: 4rem;
}
.w-3 {
    width: 3rem;
}
.w-2h {
    width: 2.5rem;
}
.w-2Q {
    width: 2.25rem;
}
.w-2 {
    width: 2rem;
}
.w-1h {
    width: 1.5rem;
}
.w-1 {
    width: 1rem;
}
.w-0 {
    width: 0;
    min-width: 0;
    max-width: 0;
}
.wp-20 {
    width: 20%;
}
.wp-10 {
    width: 10%;
}
.wp-9 {
    width: 9%;
}
.wp-8 {
    width: 8%;
}
.wp-7 {
    width: 7%;
}
.wp-6 {
    width: 6%;
}
.wp-5 {
    width: 5%;
}
.wp-4 {
    width: 4%;
}
.wp-3 {
    width: 3%;
}
.wp-2 {
    width: 2%;
}
.w-min-5 {
	min-width: 5rem;
}
.w-min-4 {
	min-width: 4rem;
}
.w-min-3 {
	min-width: 3rem;
}
.w-min-2 {
	min-width: 2rem;
}
.w-min-1 {
	min-width: 1rem;
}

/* custom height */
.h-9 {
    height: 5.0rem;
}
.h-8 {
    height: 4.5rem;
}
.h-7 {
    height: 4.0rem;
}
.h-6 {
    height: 3.5rem;
}
.h-5 {
    height: 3.0rem;
}
.h-4 {
    height: 2.5rem;
}
.h-3 {
    height: 2.0rem;
}
.h-2 {
    height: 1.5rem;
}
.h-1 {
    height: 1rem;
}

/* custom margin */
.cml-7 {
	margin-left: 7.0rem;	
}
.cml-7h {
	margin-left: 7.5rem;	
}
.cml-8h {
	margin-left: 8.5rem;	
}
.cml-9h {
	margin-left: 9.5rem;	
}
.cml-12h {
	margin-left: 12.75rem;	
}
.cmt-m1 {
	margin-top: -0.5rem;	
}

/* custom padding */
.cp-1 {
	padding: 0.125rem;	
}
.cpt-1 {
	padding-top: 0.125rem;	
}
.cpr-1 {
	padding-right: 0.125rem;	
}
.cpb-1 {
	padding-bottom: 0.125rem;	
}
.cpl-1 {
	padding-left: 0.125rem;	
}
.cp-2 {
	padding: 0.375rem;	
}
.cpt-2 {
	padding-top: 0.375rem;	
}
.cpr-2 {
	padding-right: 0.375rem;	
}
.cpb-2 {
	padding-bottom: 0.375rem;	
}
.cpl-2 {
	padding-left: 0.375rem;	
}
/* custom border */
.bt-0 {
	border-top: 0;
}
.bl-0 {
	border-left: 0;
}
.br-0 {
	border-right: 0;
}
.bb-0 {
	border-bottom: 0;
}
.bb-1 {
	border-bottom: 1px solid var(--color-grid-body-border);
}
.bt-1 {
	border-top: 1px solid var(--color-grid-body-border);
}
.bt-2 {
	border-top: 2px solid var(--color-grid-body-border);
}
.bo-dark {
	border-color: var(--color-separate-border-dark);
}
.bo-light {
	border-color: var(--color-separate-border-light);
}

/* --------------------------------------------------
  color
-------------------------------------------------- */
.color-text-dark {
	color: var(--color-text-dark);	/* 文字 */
}
.color-text-light {
	color: var(--color-text-light);	/* 文字 */
}
.color-text-footer {
	color: var(--color-text-footer);	/* フッター文字 */
}
.color-interface {
	color: var(--color-interface);	/* インターフェースエリア */
}
.color-blank {
	color: var(--color-blank);	/* ブランクエリア */
}
.color-grid-icon-error {
	color: var(--color-grid-icon-error);	/* グリッドアイコンエラー */
}
.color-grid-icon-warning {
	color: var(--color-grid-icon-warning);	/* グリッドアイコン警告 */
}
.color-button-event {
	color: var(--color-button-event);	/* ボタンエリア */
}
.color-button-panel {
	color: var(--color-button-panel);	/* ボタンエリア */
}
.color-button-delete {
	color: var(--color-button-delete);	/* 削除ボタンエリア */
}
.color-datepicker-calendar {
	color: var(--color-datepicker-calendar);	/* DatePickerカレンダーエリア */
}
.color-datepicker-icon {
	color: var(--color-datepicker-icon);	/* DatePickerアイコンエリア */
}
.color-line-dark {
	color: var(--color-line-dark);	/* ラインカラー */
}
.color-line-light {
	color: var(--color-line-light);	/* ラインカラー */
}
.color-line-smoke {
	color: var(--color-line-smoke);	/* ラインカラー */
}
.color-weekday {
	color: var(--color-weekday);	/* 平日 */
}
.color-sunday {
	color: var(--color-sunday);	/* 日曜日 */
}
.color-saturday {
	color: var(--color-saturday);	/* 土曜日 */
}
.color-child-mood-good {
	color: var(--color-child-mood-good);	/* 機嫌_良 */
}
.color-child-mood-normal {
	color: var(--color-child-mood-normal);	/* 機嫌_普 */
}
.color-child-mood-bad {
	color: var(--color-child-mood-bad);	/* 機嫌_悪 */
}
.color-button-sleep {
	color: var(--color-button-sleep);		/* 睡眠ボタン */
}
.color-button-bowels {
	color: var(--color-button-bowels);		/* 排便ボタン */
}
.color-button-meal {
	color: var(--color-button-meal);		/* 食事ボタン */
}
.color-button-mood {
	color: var(--color-button-mood);		/* 機嫌ボタン */
}
.color-button-temperature {
	color: var(--color-button-temperature);	/* 検温ボタン */
}
.color-icon-globe {
	color: var(--color-icon-globe);	/* icon 地球 */
}
.color-icon-user {
	color: var(--color-icon-user);	/* icon ユーザー */
}
.color-icon-thermometer {
	color: var(--color-icon-thermometer);	/* icon 体温計 */
}
.color-icon-information {
	color: var(--color-icon-information);	/* icon 注意 */
}


/* --------------------------------------------------
  bg-color
-------------------------------------------------- */
.bg-color-interface {
	background-color: var(--color-interface);			/* インターフェースエリア */
}
.bg-color-blank {
	background-color: var(--color-blank);				/* ブランクエリア */
}
.bg-color-communication-area {
	background-color: var(--color-communication-area);	/* コミュニケーションエリア */
}
.bg-color-daily-board {
	background-color: var(--color-daily-board);			/* デイリーボード */
}
.bg-color-child-book {
	background-color: var(--color-child-book);			/* 園児台帳 */
}
.bg-color-information {
	background-color: var(--color-information);			/* お知らせ  */
}
.bg-color-bulletin-board {
	background-color: var(--color-bulletin-board);		/* 掲示板  */
}
.bg-color-schedule {
	background-color: var(--color-schedule);			/* 園内スケジュール */
}
.bg-color-shift-calendar {
	background-color: var(--color-shift-calendar);		/* シフト希望提出 */
}
.bg-color-staff-clock-on {
	background-color: var(--color-staff-clock-on);		/* スタッフ通勤打刻 */
}
.bg-color-child-clock-on {
	background-color: var(--color-child-clock-on);		/* 園児通園打刻 */
}
.bg-color-staff-shift {
	background-color: var(--color-staff-shift);			/* スタッフシフト */
}
.bg-color-child-attend-plan {
	background-color: var(--color-child-attend-plan);	/* 園児出席予定表 */
}
.bg-color-staff-attend {
	background-color: var(--color-staff-attend);		/* スタッフ通勤簿 */
}
.bg-color-child-attend {
	background-color: var(--color-child-attend);		/* 園児出席簿 */
}
.bg-color-child-communication {
	background-color: var(--color-child-communication);	/* コミュニケーション */
}
.bg-color-facility {
	background-color: var(--color-facility);			/* 園管理 */
}
.bg-color-distribute-documents {
	background-color: var(--color-distribute-documents);	/* 配布資料 */
}
.bg-color-settings {
	background-color: var(--color-settings);				/* 設定 */
}
.bg-color-sick {
	background-color: var(--color-sick);					/* 病児保育 */
}
.bg-color-download-documents {
	background-color: var(--color-download-documents);		/* 様式ダウンロード */
}
.bg-color-food-inspection {
	background-color: var(--color-food-inspection);			/* 検食 */
}
.bg-color-codmon-migration {
	background-color: var(--color-codmon-migration);		/* CODMON移行 */
}
.bg-color-notification {
	background-color: var(--color-notification);			/* 運営からのお知らせ */
}
.bg-color-required {
	background-color: var(--color-required);			/* 必須 */
}
.bg-color-grid-body-error {
	background-color: var(--color-grid-body-error);		/* グリッドエラー */
}
.bg-color-grid-body-warning {
	background-color: var(--color-grid-body-warning);		/* グリッド警告 */
}
.bg-color-grid-icon-error {
	background-color: var(--color-grid-icon-error);		/* グリッドアイコンエラー */
}
.bg-color-grid-icon-warning {
	background-color: var(--color-grid-icon-warning);	/* グリッドアイコン警告 */
}
.bg-color-grid-calendar-date {
	background-color: var(--color-grid-calendar-date);	/* グリッドカレンダー日付 */
}
.bg-color-button-event {
	background-color: var(--color-button-event);		/* ボタンエリア */
}
.bg-color-button-panel {
	background-color: var(--color-button-panel);		/* ボタンエリア */
}
.bg-color-button-delete {
	background-color: var(--color-button-delete);		/* 削除ボタンエリア */
}
.bg-color-button-shift-ask {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-button-shift-ask);	/* シフト提出ボタン */
}
.bg-color-button-shift-closed {
	background-color: var(--color-button-shift-closed);	/* シフト締切ボタン */
}
.bg-color-button-shift-cancel {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-button-shift-cancel);	/* シフト締切解除ボタン */
}
.bg-color-button-shift-settled {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-button-shift-settled);/* シフト確定ボタン */
}
.bg-color-button-absent {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-button-absent);		/* 欠席連絡ボタン */
}
.bg-color-button-late {
	background-color: var(--color-button-late);			/* 遅刻連絡ボタン */
}
.bg-color-button-print {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-button-print);		/* 帳票ボタン */
}
.bg-color-button-monthly-report {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-monthly-report);	/* 月次報告ボタン */
}
.bg-color-button-pmms-cooperation {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-pmms-cooperation);	/* 公金管理ボタン */
}
.bg-color-button-sick-child {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-sick-child);		/* 病児保育 園児 */
}
.bg-color-button-sick-nurse {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-sick-nurse);		/* 病児保育 看護師 */
}
.bg-color-button-sick-teacher {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-sick-teacher);		/* 病児保育 保育士 */
}
.bg-color-button-transition {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-transition);		/* 別画面 */
}
.bg-color-button-excel {
	color: var(--color-text-light);							/* 文字 */
	background-color: var(--color-button-excel);			/* Excelボタン */
}

.bg-color-datepicker-calendar {
	background-color: var(--color-datepicker-calendar);	/* DatePickerカレンダーエリア */
}
.bg-color-datepicker-icon {
	background-color: var(--color-datepicker-icon);		/* DatePickerアイコンエリア */
}
.bg-color-line-dark {
	background-color: var(--color-line-dark);			/* ラインカラー */
}
.bg-color-line-light {
	background-color: var(--color-line-light);			/* ラインカラー */
}
.bg-color-grid-header {
	background-color: var(--color-grid-header);			/* グリッドヘッダー */
}
.bg-color-grid-body-odd {
	background-color: var(--color-grid-body-odd);		/* グリッド明細奇数番目 */
}
.bg-color-grid-body-even {
	background-color: var(--color-grid-body-even);		/* グリッド明細偶数番目 */
}
.bg-color-weekday {
	background-color: var(--color-weekday);				/* 平日 */
}
.bg-color-sunday {
	background-color: var(--color-sunday);				/* 日曜日 */
}
.bg-color-saturday {
	background-color: var(--color-saturday);			/* 土曜日 */
}
.bg-color-attendance-none {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-attendance-none);		/* 登園_未着 */
}
.bg-color-attendance-arrival {
	color: var(--color-text-light-dark);				/* 文字 */
	background-color: var(--color-attendance-arrival);	/* 登園_登園 */
}
.bg-color-attendance-home {
	color: var(--color-text-light-dark);				/* 文字 */
	background-color: var(--color-attendance-home);		/* 登園_退園 */
}
.bg-color-save-none {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-save-none);			/* 日誌_未作成 */
}
.bg-color-save-temporarily {
	color: var(--color-text-light-dark);				/* 文字 */
	background-color: var(--color-save-temporarily);	/* 日誌_編集中 */
}
.bg-color-save-make {
	color: var(--color-text-light-dark);				/* 文字 */
	background-color: var(--color-save-make);			/* 日誌_作成済み */
}
.bg-color-new-status-new {
	color: var(--color-text-light-dark);				/* 文字 */
	background-color: var(--color-new-status-new);		/* 新着_新着 */
}
.bg-color-new-status-read {
	color: var(--color-text-light);						/* 文字 */
	background-color: var(--color-new-status-read);		/* 新着_既読 */
}

.bg-color-button-sleep {
	background-color: var(--color-button-sleep);		/* 睡眠ボタン */
}
.bg-color-button-bowels {
	background-color: var(--color-button-bowels);		/* 排便ボタン */
}
.bg-color-button-meal {
	background-color: var(--color-button-meal);			/* 食事ボタン */
}
.bg-color-button-mood {
	background-color: var(--color-button-mood);			/* 機嫌ボタン */
}
.bg-color-button-temperature {
	background-color: var(--color-button-temperature);	/* 検温ボタン */
}



/* header styles
-------------------------------------------------- */
#header {
  	border-bottom : 1px solid;
	border-color : var(--color-header-border);
}

/* Navbar styles
-------------------------------------------------- */
#headNavbar {
	width: 100%;
	margin-right: 1.0rem;
}
#headNavbar .navbar-toggler {
	border-color: var(--color-header-border);
	color: var(--color-text-dark);
}
#headNavbar .nav-item {
	border-radius: 5px;
	-webkit-border-radius: 5px; /* Safari,Google Chrome用 */
	-moz-border-radius: 5px; /* Firefox用 */
/* 	background-color: var(--color-button-panel); */
	padding: 0.25rem;
	margin: 0.25rem;
}
#headNavbar .nav-item .nav-title {
	font-size: 1.5rem;
}
#headNavbar .nav-link {
    display: block;
    padding: 0.5rem 0.5rem;
}
#headNavbar .navbar-text {
	color: var(--color-text-dark);
	margin-left: 0.5rem;
	padding-top: 0.5rem;
	padding-bottom: 0;
}
#headNavbar ul {
  margin-bottom:0.25rem;
  border:1px solid;
  border-radius: 5px;
  border-color: var(--color-header-border);
}
#headNavbar .nav-item img {
	width: 30px;
	height: 30px;
}
#headNavbar #navStaffCommunication,
#headNavbar #navChildCommunication,
#headNavbar #navInformation,
#headNavbar #navLatest,
#headNavbar #navFAQ,
#headNavbar #navUserManual
{
  position: relative;
}
#headNavbar #navStaffCommunication .maru,
#headNavbar #navChildCommunication .maru,
#headNavbar #navInformation .maru,
#headNavbar #navLatest .maru-small {
  position: absolute;
  bottom: 0rem;
  right: 0rem;
}
.maru {
	height:20px;
	width:20px;
	border-radius:50%;
	line-height:20px;
	text-align:center;
	color: var(--color-text-light);
	background-color: var(--color-new-status);
}
.maru-small {
	height:15px;
	width:15px;
	border-radius:50%;
	line-height:15px;
	text-align:center;
	color: var(--color-text-light);
	background-color: var(--color-new-status);
}
#navLatest .nav-link img,
#navFAQ .nav-link img,
#navUserManual .nav-link img 
{
	width: 20px;
	height: 20px;
}
#navLatest .nav-link,
#navFAQ .nav-link,
#navUserManual .nav-link
{
    display: block;
    padding: 0.125rem 0.125rem;
}

.colorPalette .nav-item 
{
	width:15em;
	border-radius: 5px;
	-webkit-border-radius: 5px; /* Safari,Google Chrome用 */
	-moz-border-radius: 5px; /* Firefox用 */
	padding: 0.25rem;
	margin: 0.25rem;
}
.colorPalette .nav-item
{
	font-size: 0.75rem;
}
.colorPalette .nav-link
{
    display: block;
	padding-top: 0.25rem;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	padding-bottom: 0.25rem;
}
.colorPalette .navbar-text
{
	color: var(--color-text-dark);
	margin-left: 0.5rem;
	padding-top: 0.5rem;
	padding-bottom: 0;
}



.facility-name {
	font-size: 1.0rem;
}

/* select box time styles
-------------------------------------------------- */
select.select-time, select.select-time:not([size]):not([multiple]) 
{
	width: 6rem;
	height: 30px;
}

/* Sticky footer styles
-------------------------------------------------- */
.sticky-footer {
	flex-shrink: 0;
	background-color: var(--color-interface);
	padding: 0.25rem;
	font-size: 0.5rem;
}
.sticky-footer .copy {
	font-size: 0.8rem;
	color: var(--color-text-footer);
	margin: 0;
}

/* Alert Message
-------------------------------------------------- */
#alert-message {
	display: none;
}

/* Modal styles
-------------------------------------------------- */
.modal .modal-header,
.modal .modal-footer {
	background-color: var(--color-modal-header);
}
.modal .modal-title {
	color: var(--color-text-dark);
}
.modal .modal-body .table {
	color: var(--color-text-dark);
}
.modal .modal-header .close  
{
	padding:1rem;
	margin-top: -1rem;
	margin-right: -1rem;
	margin-bottom: -1rem;
	margin-left: 0.5rem;
}
.modal .modal-dialog 
{
	width:700px;
	min-width: 700px;
	max-width: 700px;
}
.modal #action-container
{
	background-color: var(--color-interface);
	padding-top:0rem;
	padding-bottom:0.5rem;
	padding-left:0rem;
	padding-right:0.5rem;
}
.modal .list-container
{
	width: 480px;
	min-width: 480px;
}
.modal .table 
{
    margin-bottom: 0;
}
.modal .table tbody th,
.modal .table tbody td
{
	border: 0;
    padding: 0;
    padding-bottom: 0.3125rem;
    vertical-align:middle;
}
.modal .form-control 
{
	margin: 0;
}
.modal .form-group 
{
	margin: 0;
}
.modal .col-form-label 
{
	padding-top: 0.3125rem;
    padding-bottom: 0.3125rem;
}
.modal select.form-control 
{
	height:26.8px ;
}
.modal .table tbody th
{
	width: 100px;
	text-align: right;
    vertical-align:top;
    padding-top: 0.25rem;
}
.modal .table thead th,
.modal .table thead td,
.modal .table tbody th,
.modal .table tbody td
{
    padding-top: 0.5rem;
    padding-left: 0.5rem;
    padding-bottom: 0.5rem;
    padding-right: 0rem;
}

#modalStaffTemperature select ,
#modalChildTemperature select , 
#modalTemperature select 
{
	height:45px;
	font-size: 2.0rem;
}
.modal .kanji-name-item {
	margin:0;
	margin-top:0.5rem;
	margin-bottom:0.5rem;
	font-size: 1.5rem;
	font-weight: bold;
}
.modal .EQ3xxC {
	padding-top: 0.5rem;
	margin-bottom: 0rem;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	font-size: 1.5rem;
}

.modal .cNCk8j{
	width: 10rem;
    min-width: 10rem;	
}
.modal .igNYxL {
	font-size: 0.75rem;
}
/* Trumbowyg styles
-------------------------------------------------- */
.trumbowyg-box {
	margin: 0;
}
.trumbowyg-button-pane {
	white-space: normal;
}
.trumbowyg-editor {
	padding: 0.5rem;
}
.trumbowyg-editor p {
	margin: 0;
}
/* 貼り付け等で混入した文字サイズ指定を無効化し、フォントサイズを統一する */
.trumbowyg-editor [style*="font-size"] ,
.trumbowyg-editor font {
	font-size: inherit !important;
}
/* checkbox
-------------------------------------------------- */
.checkbox-input {
	display: none;
}
.checkbox-parts {
	padding-left: 20px;
	position: relative;
	margin-right: 20px;
	margin-bottom: 0;
}
.checkbox-parts::before {
  content: "";
  display: block;
  position: absolute;
  top: 6;
  left: 0;
  width: 15px;
  height: 15px;
  padding-top: 0.5rem;
  border: 1px solid var(--color-checkbox-border);
  border-radius: 4px;
}
.checkbox-input:checked + .checkbox-parts {
  color: var(--color-checkbox-select);
}
.checkbox-input:checked + .checkbox-parts::after {
  content: "";
  display: block;
  position: absolute;
  top: 2px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid var(--color-checkbox-select);
  border-right: 3px solid var(--color-checkbox-select);
}
.checkbox-group {
	padding-left: 0.5rem;
	height: 21px; /* top:6 + height:15px; */
}

#modalChildTemperature .checkbox-parts {
	padding-left: 40px;
}
#modalChildTemperature .checkbox-parts::before 
{
  width: 30px;
  height: 30px;
}
#modalChildTemperature .checkbox-input:checked + .checkbox-parts::after{
  top: 7px;
  left: 9px;
  width: 14px;
  height: 21px;
}

/* accordion
-------------------------------------------------- */
#accordion_menu h3 {
	margin-top:0;
	margin-right:0;
	margin-bottom: 0;
	margin-left: 0.5rem;
	padding: 0.5rem;
	font-size:14px;
	font-weight: bold;
	color: var(--color-text-section);
	cursor : pointer;
	display: flex;
	align-items: center;
}
#accordion_menu h3:after {
    content: "";
    flex-grow: 1;
    height: 2px;
    background: var(--color-text-section);
    display: block;
    margin-left: 16px;
}
#accordion_menu h3:hover{
    background: #e7e7e7;
}
#accordion_menu a {
	margin-top:1rem;
	margin-right:0;
	margin-left: 0.5rem;
}
#accordion_menu a[data-toggle="collapse"]{
	display: block;
	text-decoration: none;
	position: relative;
}
#accordion_menu a[data-toggle="collapse"]:hover{
    background: #e7e7e7;
}
#accordion_menu a[data-toggle="collapse"]::after{
    content:"";
	font-weight: bold;
    display: block;
    width: 8px;
    height: 8px;
    border-top: var(--color-text-section) 2px solid;
    border-right: var(--color-text-section) 2px solid;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
#accordion_menu a[aria-expanded=false]::after{
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    transition-duration: 0.3s;
}
#accordion_menu a[aria-expanded=true]::after{
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    transition-duration: 0.3s;
}

/* Card CSS
-------------------------------------------------- */
.card-header {
    cursor: pointer;
    background: var(--color-interface);
}
.card-header h6 {
	margin-left: 0.5rem;
}
.card .card-header a {
    color: #428bca;
}
.card-header .row {
	margin-left: 0;
	margin-right: 0;
}
.card .card-header a[data-toggle="collapse"] {
  display: block;
  padding: .75rem 1.25rem;
  margin: -.75rem -1.25rem;
}
.card-header p {
	margin-bottom: 0.25rem;
}
.card-body p {
	margin-bottom: 0.25rem;
}

/* link
-------------------------------------------------- */
a {
	color: var(--color-text-dark);
	cursor: pointer;
}
a label{
	cursor: pointer;
}

/* icon
-------------------------------------------------- */
.simple-icon {
	margin : 0;
	padding-left : 0.3rem;
	padding-top : 0.5rem;
	padding-bottom : 0.5rem;
	position: relative;
	display: inline-block;
}
.simple-icon-box {
	margin : 0;
	padding-left : 0.125rem;
	padding-top : 0.125rem;
	padding-bottom : 0.125rem;
	position: relative;
	display: inline-block;
}

/* balloon
-------------------------------------------------- */
.balloon {
	display: none;
	position: absolute;
	padding: 16px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;  
	border-radius: 8px;
	background: #111;
	color: #fff;
	z-index: 999;
}
.balloon:after {
	position: absolute;
	bottom: 100%;
	left: 50%;
	width: 0;
	height: 0;
	margin-left: -10px;
	border-bottom-color: #333;
	pointer-events: none;
	content: " ";
	z-index: 999;
}
/* non-responsive
-------------------------------------------------- */
.container {
	width: 970px;
	max-width: none !important;
}

/* required
-------------------------------------------------- */
.must {
	background-color: var(--color-required);
}
.must,
.free {
	color: var(--color-text-light);	
	border-radius: 3px;
	font-size: 0.5rem;
	margin-left:0.25rem;
	padding: 5px 5px;
	letter-spacing: 0.2em;
}
/* checkbox
-------------------------------------------------- */
.checkbox-none {
	display: none;
}
.is-select {
	color: var(--color-text-light);
	background-color: var(--color-panel-select);
	border: 1.5px solid var(--color-panel-select-border);
}
/* section
-------------------------------------------------- */
.section_text {
	margin-top:1rem;
	margin-right:0;
	margin-bottom: 1rem;
	margin-left: 0.5rem;
	font-size: 14px;
	font-weight: bold;
	color: var(--color-text-section);
}

/* language
-------------------------------------------------- */
 /* === ラジオボタンは非表示 ================== */
#langChenge input[type="radio"]{
  display    : none;
}
 
 /* === 各ラジオボタンのラベルをボタンに変更 == */
#langChenge label{
  display    : inline-block;
  border     : 1px solid #ccc;
  box-shadow : 2px 2px #999;
  padding    : 2px 6px;
}
 
 /* === 選択されている言語のラベル色を変更 ==== */
#langChenge input[type="radio"]:checked + label {
  background : #ffa64d;
}

/* scrollbar
-------------------------------------------------- */
::-webkit-scrollbar {
    background: transparent;
    height: 8px;
    width: 8px;
}
::-webkit-scrollbar-thumb {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: var(--color-scrollbar-thumb);
    -webkit-border-radius: 8px;
    border-radius: 8px;
    min-height: 40px;
}
/* Tab Control
-------------------------------------------------- */
.hZUigU .nav-link {
	background-color : var(--color-tab-control-base);
	border-color: #dee2e6 #dee2e6 #fff;
}
.hZUigU .nav-link.active {
	color : var(--color-text-light);
	background-color : var(--color-tab-control-active);
}
	
	
	
	
	
}
