@charset "UTF-8";

.center {
	margin: 0 auto;
}

.aligncenter {
	text-align: center !important;
}

.alignleft {
	text-align: left !important;
}

.alignright {
	text-align: right !important;
}

.floatleft {
	float: left !important;
}

.floatright {
	float: right !important;
}

.maincontent {
	margin: 10px auto !important;
	width: 97%;
	/* content: " "; */
	/* display: table; */
}

.tablelist {
	width: 100%;
}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th,
	.table>thead>tr>td, .table>thead>tr>th {
	padding: 0 4px;
}
/** 新規登録ボタン */
.editbutton {
	margin-bottom: 5px;
	/*  width: 100px; */
	float: right;
}
/*focus button*/
a.tabkey:focus {
	border: 1px solid #2e6da4;
	outline: none;
}

.button-footer .message-area, .button-footer .message-modal-area {
	display: block;
}

/* 従業員検索ダイアログタイプの画面 */
.message-modaldialog-area {
	width: 100%;
}

.message-modaldialog-area li {
	display: list-item;
}
/*Huy add: エラーメッセージをScrollさせる*/
.button-footer .message-area.scroll {
	height: 150px;
	overflow-x: scroll;
}

/* Grid layout */
.fullwidth {
	width: 100%;
}

.width50 {
	margin: 0 auto;
	width: 50%;
}

.modalbody .item {
	display: inline-block;
}

.modalresulttable {
	background: #fff;
}

.checkbox-label {
	float: left;
	padding-right: 8px;
	padding-right: 8px;
	line-height: 28px;
}

.highlight {
	background: #f00;
}

.modalresulttable .on, .modalresulttable .hover {
	background-color: #c9e5ff !important;
	color: #000 !important;
}

.editbutton ul, .editbutton ul li {
	float: left;
}

.editbutton li {
	padding: 0 3px;
}

.editbutton li a {
	display: block;
}

.editbutton li.on a, .editbutton li a:hover {
	background-color: #4e6adb;
}

.editbutton li a:hover img {
	opacity: 1;
}

.editbutton a {
	padding-left: 8px;
	padding-right: 8px;
}

.editbutton .off a {
	cursor: default;
	opacity: 0.4;
}

.editbutton .off a:hover {
	background: none;
}

.buttitlebar {
	float: left;
	margin-left: 10px;
	width: 115px;
}
/** Searchbar input width */
.searchbar .item.but input {
	width: 130px;
}
/* datatable with header fixed parent div のスタイル
   初期表示は 隠すようにする、Datatableがinitされた後、表示する
*/
.dataTableParentHidden {
	overflow: hidden;
	height: 0px;
	width: 100%;
}

/* When no data is showed, hide default messsage of datatables */
.dataTables_empty {
	display: none;
}

/* scroll data table style */
/* table.scrollTable thead th, table.scrollTable thead td {
    padding: 10px 18px;
}
table.scrollTable tbody th, table.scrollTable tbody td {
    padding: 8px 10px;
} */
/*  .scrollTable th, .scrollTable td { white-space: nowrap; } */

/** 従業員区分選択モーダルスタイル */

/* 従業員区分名称リスト */
.emptypecontainer ul.syncData {
	margin-left: 50px;
}

.emptypecontainer li {
	background-color: #4e6adb;
	border: none;
	color: #fff;
	float: left;
	margin-right: 2px;
	margin-bottom: 2px;
	font-size: 0.928rem;
	font-weight: 600;
	height: 28px;
	line-height: 28px;
	text-align: center;
	white-space: nowrap;
	padding-left: 5px;
	padding-right: 5px;
	/* width: 5em; */
}
/* 従業員区分をWrapperする部分 */

.emptypecontainer li,
.expPatternItemContainer li {
	width: 10em !important;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

@media(max-width:1024px){
	.emptypecontainer {
        max-width: 700px !important;
    }

    .expPatternItemContainer {
        max-width: 700px !important;
    }
}

@media(min-width:1024px){
	.emptypecontainer {
        /*width: 700px !important;*/
    }

    .expPatternItemContainer {
        /*width: 700px !important;*/
    }
}
/* 従業員区分選択ボタン */
.emptypecontainer .butedit {
	float: left;
	padding-top: 5px;
}

/** End 従業員区分選択モーダルスタイル*/

/** 諸届選択モーダルスタイル */

/* 諸届名称リスト */
.reporttypecontainer ul {
	margin-left: 50px;
}

.reporttypecontainer li {
	background-color: #4e6adb;
	border: none;
	color: #fff;
	float: left;
	margin-right: 2px;
	margin-bottom: 2px;
	font-size: 0.928rem;
	font-weight: 600;
	height: 28px;
	line-height: 28px;
	text-align: center;
	width: 5em;
}
/* 諸届をWrapperする部分 */
.reporttypecontainer {
	width: 500px;
}
/* 諸届選択ボタン */
.reporttypecontainer .butedit {
	float: left;
	padding-top: 5px;
}

/** End 諸届選択モーダルスタイル*/
.t3FromToGroup .groupitem {
	float: left;
}

.groupitem .betweenLabel {
	padding-left: 20px;
	padding-right: 20px;
}

/* 共通Components: 組織種別と下位組織 */
.t3OrgTypeGroup {
	display: inline-block;
	margin-left: 20px;
	margin-top: -10px;
}

.t3OrgTypeGroup .groupitem {
	float: left;
}

.t3OrgTypeGroup .groupitem label.checkbox {
	margin-left: 10px;
}

.leftGroup {
	float: left;
}

@media ( max-width :530px) {
	.t3FromToGroup .groupitem {
		width: 100%;
	}
	.groupitem .betweenLabel {
		padding-left: 0;
	}
	.emptypecontainer {
	width: 95%;
	}
}

@media ( max-width :1024px){
	.emptypecontainer {
	width: 95%;
	}
}