@charset "utf-8";


/* フッターボタン -------------------------------------------------------------------------------*/
.modalcontents .button-footer, .modaldialogcontents .button-footer,
.modalcontentsMulti .button-footer{
	display: block;
	z-index: 1000001;
}

/* モーダルレーヤ -------------------------------------------------------------------------------------*/
.modallayer, .modallayerMulti, .approveListModalLayer {
	background-color: rgba(0, 0, 0, 0.7);
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000000
}

/* モーダルダイアログ-------------------------------------------------------------------------------------*/
.modaldialogcontents {
	background-color: #f0f0f0;
	border-radius: 5px;
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000000;
}


.modaldialogcontents h1 {
	background-color: #4e6adb;
	border-radius: 5px 5px 0 0;
	color: #fff;
	font-size: 1.285rem;
	height: 45px;
	line-height: 45px;
	text-align: center;
}
.modaldialogcontents .modalbody { padding: 5px 20px; }


/* モーダル -------------------------------------------------------------------------------------*/
.modalcontents, .modalcontentsMulti {
	color: #fff;
	height: 100%;
	opacity: 0;
	overflow-y: scroll;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000000;
}

/* モーダルヘッダー -----------------------------------------------------------------------------*/
.modalheader {
	/* position: absolute;
	width: 25%; */
	position: fixed;
	left: 0;
	width: 25%;
}
.modalheader h1 {
	border-bottom: solid 1px #fff;
	font-size: 2.571rem;
	text-align: right;
}

.modalheader .comment {
	font-size: 1rem;
	font-weight: 600;
	margin-top: 10px;
	text-align: right;
}

/* モーダルボディー -----------------------------------------------------------------------------*/
.modalarticle {
	margin-top: 20px;
	margin-bottom: 60px;
	padding-left: 25%;
	width: 100%;
}


/*-----------------------------------------------------------------------------------------------*/
/* 諸届設定（モーダル） -------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.modalselect { position: relative; }
.modalselect h2 {
	font-size: 1em;
	position: absolute;
	top: 0;
	left: 0;
	text-align: right;
	padding-right: 10px;
	width: 110px;
}
.modalselect ul {
	margin-bottom: 10px;
	margin-left: 110px;
	max-width: 560px;
}
.modalselect li {
	float: left;
	margin-right: 2px;
	margin-bottom: 2px;
}
.modalselect li a {
	background-color: #eceff1;
	color: #607d8b;
	cursor: pointer;
	display: block;
	font-size: 0.928rem;
	height: 68px;
	text-align: center;
	transition: background-color 0.2s;
	width: 68px;
}

.modalselect li a span {
	display: block;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	word-wrap: break-word;
}
.modalselect li a.on {
	background-color: #ff9400;
	color: #fff;
}

.modalselect li a.item-hover, .modalselect li a.item-focus {
	background-color: #ffc107;
	color: #fff;
}

.modalselect li a.item-focus {
	outline: dotted 1px #fff;
}

/* フォーム */
.modalbody .item { padding: 5px 0; }
.modalbody .label {
	font-size: 0.857rem;
	margin-top: 7px;
	width: 5em;
}
.modalbody input[type="text"],
.modalbody input[type="password"] { height: 26px; }
.modalbody .select,
.modalbody .radio,
.modalbody .checkbox {
	height: 26px;
	line-height: 26px;
	padding-top: 0px;
}
.modalbody .inputBtn a {
	height: 26px;
}





/* ボタン */
.modalbutton {
	text-align: center;
	padding: 0 20px 20px;
}
.modalbutton li {
	display: inline-block;
	margin: 0 10px;
}
.modalbutton .button a { width: 100px; }

/* 従業員検索ダイアログタイプの画面のメッセージ部分 */
.modaldialogmessage {
	text-align: center;
	margin-top: 5px;
	margin-bottom: 5px;
}

/* 確認 -------------------------------------------------------------------------------*/
.confirm .message, .confirm .messageError {
	margin-bottom: 20px;
	text-align: center;
}
.confirm .message p, .confirm .messageError p {
	display: inline-block;
	text-align: left;
}
.confirm .messageError p {
	color: #f00;
}

.confirm .message .text { padding-left: 5px; }

.confirm .label { width: 5em; }

@media(max-width:960px){
}