@charset "Shift_JIS";

/*--------------------------------------------------------------------------
   table 共通
---------------------------------------------------------------------------*/
table{
	border-collapse:separate;
}

/*--------------------------------------------------------------------------
   table 余白
---------------------------------------------------------------------------*/
.tablebox + .listbox{
	margin-top:12px;
}
.tablebox + .tablebox{
	margin-top:12px;
}

/* table.list_tablelayout ---------------------------------------- */
table.list_tablelayout {
	width:100%;
	background:#fff;
	line-height:1.5;
	margin-left:auto;
	margin-right:auto;
	border-collapse:collapse;
	table-layout:auto;
}
table.list_tablelayout thead th,
table.list_tablelayout thead td,
table.list_tablelayout tbody th,
table.list_tablelayout tbody td{
	background:#FFF;
	text-align:center;
	vertical-align:middle;
	word-wrap:break-word;
	background-clip:padding-box;
}
	table.list_tablelayout tbody tr:nth-child(odd) th,
	table.list_tablelayout tbody tr:nth-child(odd) td{
		background:#FDFDFD;
		background-clip:padding-box;
	}
table.list_tablelayout thead th{
	font-weight:normal;
	padding:7px 8px 5px 8px;
	background:#EFEFEF;
	border-top:1px solid #B5C4D2;
	border-bottom:1px solid #B5C4D2;
	border-right:1px solid #D5D5D5;
}
	table.list_tablelayout th:first-child {
		border-left:1px solid #B5C4D2;
	}
	table.list_tablelayout th:last-child {
		border-right:1px solid #B5C4D2;
	}
table.list_tablelayout tbody th,
table.list_tablelayout tbody td {
	padding:7px 8px 5px 8px;
	border:none;
	border-right:1px solid #E5E5E5;
	border-bottom:1px solid #C5D4E2;
}
	table.list_tablelayout tbody th:first-child,
	table.list_tablelayout tbody td:first-child {
		border-left:1px solid #C5D4E2;
	}
	table.list_tablelayout tbody th:last-child,
	table.list_tablelayout tbody td:last-child {
		border-right:1px solid #C5D4E2;
	}


/*--------------------------------------------------------------------------
   table スクロール
---------------------------------------------------------------------------*/
/* form table sticky --------------------------- */
.table_sticky{
	overflow:auto;
	width:100%;
}
.table_sticky table{
	border-spacing:0;
	border-collapse:separate;
}
.table_sticky thead{
	position:sticky;
	top:0;
	left:0;
	z-index:3;
}
.table_sticky thead th:first-child,
.table_sticky tbody th{
	position:sticky;
	top:0;
	left:0;
	z-index:2;
}

/* form table scroll（スクロール） */
.tab_scroll{
	overflow-x:scroll;
}

/*--------------------------------------------------------------------------
   table フォーム用
---------------------------------------------------------------------------*/
/* tablebox */
.tablebox{
	border-radius:3px;
	box-shadow:0 0px 3px 0 rgba(0, 0, 0, .3);
	box-sizing:border-box;
	padding:12px;
}

/* table_addform 縦 */
table.table_addform{
	width:100%;
	border-radius:2px;
}
table.table_addform th{
	text-align:left;
	font-weight:normal;
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	background:#F5F5F5;
	padding:8px 12px;
}
	table.table_addform th.t-tlt{
		width:230px;
	}
	table.table_addform th span.icon-required{
		float:right;
		vertical-align:middle;
		background:#FF0000;
		color:#FFF;
		border-radius:3px;
		padding:0 6px;
		margin-left:6px;
	}
table.table_addform td{
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	padding:8px 12px;
}
	table.table_addform td input,
	table.table_addform td select{
		box-sizing:border-box;
	}
	table.table_addform td.t-textarea{
		width:calc(100% - 200px);
	}

/* table_addform 横 */
table.table_addform_side{
	width:100%;
}
table.table_addform_side th{
	text-align:center;
	font-weight:normal;
	vertical-align:middle;
	border-right:3px solid #FFF;
	background:#F5F5F5;
	padding:6px 8px;
}
	table.table_addform_side th:last-child{
		border-right:none;
	}
	table.table_addform_side th span.icon-required{
		float:right;
		vertical-align:middle;
		color:#FFF;
		border-radius:3px;
		background:#EE0000;
		padding:0 6px;
	}
table.table_addform_side td{
	vertical-align:middle;
	border-bottom:1px solid #eee;
	padding:6px 8px;
}
	table.table_addform_side td input[type="submit"],
	table.table_addform_side td input[type="button"],
	table.table_addform_side td select{
		width:100%;
		box-sizing:border-box;
	}

/* addbox（追加用のフォーム） */
.addbox{
	text-align:center;
	margin:20px;
}

.table_addform table{
	width:100%;
}
.table_addform table th{
	min-width:160px;
	text-align:left;
	font-weight:normal;
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	background:#F5F5F5;
	padding:8px 12px;
}
.table_addform table td{
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	padding:8px 12px;
}
	.table_addform table  th span.icon-required{
		float:right;
		vertical-align:middle;
		color:#FFF;
		border-radius:3px;
		background:#EE0000;
		padding:0 6px;
	}

/*--------------------------------------------------------------------------
   table parts
---------------------------------------------------------------------------*/
table tbody td.t-name,
table tbody td.t-tlt,
table tbody td.t-sub-tlt{
	text-align:left;
}
table tbody td.t-operation span,
table tbody td.t-operation span input{
	cursor:pointer;
}
	table tbody td.t-operation span:hover{
		text-decoration:underline;
		text-decoration-color:#2D9B8D;
	}
	table tbody td.t-operation span + span{
		margin-left:12px;
	}


/*--------------------------------------------------------------------------
   ul_addform
---------------------------------------------------------------------------*/
ul.ul_addform li dl{
	display:table;
}
ul.ul_addform li dl dt{
	display:table-cell;
	min-width:250px;
	text-align:left;
	font-weight:normal;
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	background:#c9e9dc;
	padding:8px 12px;
}
ul.ul_addform li dl dd{
	display:table-cell;
	text-align:left;
	font-weight:normal;
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	padding:8px 12px;
}
ul.ul_addform li dl dt + dd:last-child{
	width: 100%;
}
	ul.ul_addform li dl dt span.icon-required{
		float:right;
		vertical-align:middle;
		color:#FFF;
		border-radius:3px;
		background:#EE0000;
		padding:0 6px;
	}
	ul.ul_addform li dl dd input,
	ul.ul_addform li dl d select{
		box-sizing:border-box;
	}
	ul.ul_addform li dl dd input + input{
		margin-left:12px;
	}


/* 住所入力欄 */
ul.ul_addform li dl dd div.dl_address{
	display:flex;
	flex-wrap:wrap;
}
	ul.ul_addform li dl dd div.dl_address dl{
		display:block;
	}
	ul.ul_addform li dl dd div.dl_address dl dt{
		min-width:100px;
	}

.day_title_li{
	height:2em;
	background:#98d4b3;
}

.day_title{
	line-height:2em;
	padding:0 .8em;
	font-weight:bold;
}
.li_space{
	height:1em;
}

/*--------------------------------------------------------------------------
   ul_search
---------------------------------------------------------------------------*/
ul.ul_search{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}
ul.ul_search li input[type="button"]{
	margin-left:6px;
}
ul.ul_search li dl{
	display:table;
}
ul.ul_search li dl dt{
	display:table-cell;
	text-align:left;
	font-weight:normal;
	vertical-align:middle;
	border-bottom:3px solid #FFF;
	padding:3px;
}
ul.ul_search li dl dd{
	display:table-cell;
	text-align:left;
	font-weight:normal;
	vertical-align:middle;
	padding:3px;
}
	ul.ul_search li dl dt span.icon-required{
		float:right;
		vertical-align:middle;
		color:#FFF;
		border-radius:3px;
		background:#EE0000;
		padding:0 6px;
	}
	ul.ul_search li dl dd input,
	ul.ul_search li dl d select{
		box-sizing:border-box;
	}

/* フォームのtextarea */
.textarea{
	width:100%;
}

/*--------------------------------------------------------------------------
   sublist
---------------------------------------------------------------------------*/
.sublist{
}
.sublist .pagefeed{
}

dl.dl_list{
	display:flex;
	align-items:center;
}
	dl.dl_list dt,
	dl.dl_list dd{
		padding:6px;
	}
	dl.dl_list dd input + input{
		margin-left:6px;
	}

/*--------------------------------------------------------------------------
   tab-area
---------------------------------------------------------------------------*/
.tab-area{
	display:flex;
	flex-wrap: wrap;
	gap: 3px;
	padding:0 12px;
}
.tablebox .tab-area{
	padding: 0;
	margin-bottom: 12px;
}
.tab{
	text-align:center;
	color:#307475;
	border:2px solid #307475;
	background:#FFF;
	border-radius:3px;
	padding:6px 16px;
	transition:all 0.2s 0s ease;
	cursor:pointer;
}
	.tab.active{
		position:relative;
		color:#fff;
		background:#307475;
		padding-left:24px;
	}
		.tab.active:before{
			position:absolute;
			content:"";
			top:12px;
			left:6px;
			display:inline-block;
			width:8px;
			height:8px;
			border-top:2px solid #FFF;
			border-right:2px solid #FFF;
			transform:rotate(45deg);
		}
	.tab:hover{
		color:#fff;
		background:#307475;
	}
.panel > .tablebox{
	margin-top:12px;
}
.panel {
	display:none;
	text-align:center;
}
.panel.active {
	display:block;
}

/* tab-emp-detail */
ul.tab-emp-detail li.tab{
	white-space:nowrap;
}

.tablebox_sub{
	float:right;
	margin:10px 0 0 4px;
	padding:1em;
	text-align:left;
	width:28%;
	background:#e1f4f4;
}
.tablebox_sub p{
	margin-bottom:1em;
}


/*--------------------------------------------------------------------------
   datepicker
---------------------------------------------------------------------------*/
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
	width:auto;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus{
	border:1px solid #E9E9E9;
	background:none;
}
.ui-datepicker-header a{
	transition:unset;
}


/*--------------------------------------------------------------------------
   adm_menu
---------------------------------------------------------------------------*/
/* portal */
.portal + .portal{
	margin-top:16px;
}
.portal a{
	text-decoration:underline;
	text-underline-offset:2px;
}
	.portal a:hover{
		text-decoration:none;
	}

.portal h2{
	position:relative;
	font-size:20px;
	font-weight:normal;
	margin:0 0 6px;
	padding-left:30px;
}
	.portal h2:before{
		position:absolute;
		width:26px;
		height:26px;
		left:0px;
	}
	/* 入社前社員進行状況 */
	.portal h2.tlt_emp:before{
		content:url(../images/icon_tlt_emp.png);
	}
	/* 依頼進行状況 */
	.portal h2.tlt_reg:before{
		content:url(../images/icon_tlt_req.png);
	}

/* portal_tablelayout */
table.portal_tablelayout {
	width:100%;
	background:#fff;
	line-height:1.5;
	margin-left:auto;
	margin-right:auto;
	border-collapse:collapse;
	table-layout:auto;
}
table.portal_tablelayout thead th,
table.portal_tablelayout thead td,
table.portal_tablelayout tbody th,
table.portal_tablelayout tbody td{
	background:#FFF;
	vertical-align:middle;
	word-wrap:break-word;
	background-clip:padding-box;
}
table.portal_tablelayout thead th{
	color:#888;
	border-bottom:1px solid #C5D4E2;
	padding:7px 8px 5px 8px;
	text-align:center;
}
table.portal_tablelayout tbody td{
	border-bottom:1px solid #C5D4E2;
	text-align:center;
	padding:7px 8px 5px 8px;
}
table.portal_tablelayout tbody td.t-tlt{
	text-align:left;
}

/* ステータスアイコン */
.status_icon{
	display:inline-block;
	width:56px;
	line-height:20px;
	text-align:center;
	font-size:13px;
	color:#FFF;
	border-radius:3px;
}
/* 完了 */
.status_comp{
	background:#FF5050;
}
/* 進行中 */
.status_progress{
	background:#2B9BED;
}
/* 未返信 */
.status_noreply{
	background:#FF8C00;
}
/* 未送信 */
.status_nosend{
	background:#FF8C00;
}

/* 詳細リンク */
.portal_link{
	text-align:right;
	margin-top:6px;
}
	.portal_link a{
		position:relative;
		display:inline-block;
		padding-left:16px;
	}
	.portal_link a:before{
		position:absolute;
		content:"";
		top:6px;
		left:0px;
		display:inline-block;
		width:8px;
		height:8px;
		border-top:2px solid #2D9B8D;
		border-right:2px solid #2D9B8D;
		transform:rotate(45deg);
	}

/* list_emp */
ul.list_emp{
	display:flex;
	flex-wrap:wrap;
}
ul.list_emp li{
	width:120px;
	text-align:center;
	border-radius:5px;
	margin:6px;
}
	ul.list_emp li p.img_emp{
		padding:8px 0 0;
	}
	ul.list_emp li p.f_emp{
		color:#FFF;
		font-size:13px;
		padding:6px 0 0;
	}
	ul.list_emp li p.number{
		font-size:18px;
		border-radius:5px;
		padding:0 0 8px;
	}
	ul.list_emp li p.number a{
		color:#FFF;
		text-underline-offset:3px;
		text-decoration-thickness:1px;
	}

	/* 入社前社員ログイン前 */
	ul.list_emp li.statusbox_before_sending,
	ul.list_emp li.statusbox_not_login{
		border:3px solid #42AD82;
		background:#42AD82;
	}
		ul.list_emp li.statusbox_before_sending p.f_emp,
		ul.list_emp li.statusbox_not_login p.f_emp{
			background:#42AD82;
		}
	/* 入社前社員ログイン〜完了前 */
	ul.list_emp li.statusbox_login,
	ul.list_emp li.statusbox_consent{
		border:3px solid #2B9BED;
		background:#2B9BED;
	}
		ul.list_emp li.statusbox_login p.f_emp,
		ul.list_emp li.statusbox_consent p.f_emp{
			background:#2B9BED;
		}
	/* 入社前社員完了後 */
	ul.list_emp li.statusbox_comp,
	ul.list_emp li.statusbox_decline,
	ul.list_emp li.statusbox_cancel{
		border:3px solid #FF5050;
		background:#FF5050;
	}
		ul.list_emp li.statusbox_comp p.f_emp,
		ul.list_emp li.statusbox_decline p.f_emp,
		ul.list_emp li.statusbox_cancel p.f_emp{
			background:#FF5050;
		}
	/* 入社前社員ログイン〜完了前 */
	ul.list_emp li.statusbox_cancel{
		border:3px solid #9f8bcc;
		background:#9f8bcc;
	}
		ul.list_emp li.statusbox_cancel p.f_emp{
			background:#9f8bcc;
		}


/*--------------------------------------------------------------------------
   adm_req_list
---------------------------------------------------------------------------*/
/* adm_req_emp */
ul.req_emp_tlt{
	display:flex;
}
ul.req_emp_tlt + ul.ul_search{
	margin-top:12px;
}
ul.req_emp_tlt li + li{
	margin-left:12px;
}
ul.req_emp_tlt li > span{
	display:inline-block;
	background:#EDFBFD;
	font-size:13px;
	color:#509495;
	border:1px solid #BDDBDD;
	border-radius:3px;
	padding:3px 6px;
	margin-right:6px;
}

/*--------------------------------------------------------------------------
   calendar
---------------------------------------------------------------------------*/
.calendar_wrap{
	width:650px;
	margin:0 auto;
	text-align:center;
	font-size:15px;
}
.calendar_operation{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:4px;
	background:#4dbbbd;
	color:#fff;
}
.calendar_operation_btn{
	position:relative;
	width:21px;
	background:none;
	border:0;
	text-indent:200%;
	white-space:nowrap;
	overflow:hidden;
	cursor:pointer;
	transition:all .5s 0s ease;
}
.calendar_operation_btn:before{
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	width:12px;
	height:12px;
	margin:auto;
	transform:rotate(45deg);
}
.calendar_operation_btn-prev:before{
	left:0;
	border-bottom:3px solid #fff;
	border-left:3px solid #fff;
}
.calendar_operation_btn-next:before{
	right:0;
	border-top:3px solid #fff;
	border-right:3px solid #fff;
}
.calendar_operation_btn:hover{
	opacity:.8;
}
.calendar{
	width:100%;
	margin-top:8px;
}
.calendar_week{
	color:#888;
}
.calendar td{
	height:36px;
	padding:4px;
}
.calendar_close{
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='14' r='14' style='fill:%23eee;'/%3E%3C/svg%3E") !important;
	background:center / 28px 28px no-repeat;
}
.calendar_today{
	background:center / 28px 28px #ffffa8 no-repeat;
}
.calendar a{
	display:block;
	line-height:28px;
	width:28px;
	height:28px;
	margin:0 auto;
	color:#333;
	text-decoration:none;
	border-radius:50%;
}
.calendar a:hover,
.calendar_select{
	background:#4dbbbd;
	color:#fff !important;
}

.selectday{
	display:inline-flex;
	justify-content:center;
	margin-top:16px;
	padding:4px 8px;
	background:#4dbbbd;
	color:#fff;
	font-size:16px;
}
.selectday_day{
	margin-left:8px;
}

/*--------------------------------------------------------------------------
   list_flex
---------------------------------------------------------------------------*/
.list_flex{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}
.list_flex li{
	margin:0 24px 16px 0; 
}

/*--------------------------------------------------------------------------
   list_card
---------------------------------------------------------------------------*/
.list_card_wrap{
	display:flex;
	flex-wrap:wrap;
	margin:0 -8px;
}
.list_card{
	width:100%;
	margin:8px;
	padding:4px 8px;
	border:1px solid #c5d4e2;
	border-radius:8px;
}
.col5 .list_card{
	width:calc(20% - 16px);
}
.list_card_radio{
	position:absolute !important;
}
.list_card_radio:before{
	top:16px !important;
	left:0 !important;
}
.list_card_radio:after{
	top:9px !important;
	left:3px !important;
}
.list_card_label{
	display:block;
	height:100%;
	margin:-4px -8px;
	padding:4px 8px;
}
.list_card_ttl{
	margin:4px 0;
	padding-left:24px;
	color:#888;
	font-size:18px;
	font-weight:bold;
}
.list_card_img_wrap{
	margin-bottom:8px;
	text-align:center;
}
.list_card_media{
	display:flex;
}
.list_card_media_img,
.list_card_media_body{
	flex:1;
}
.list_card_media_img{
	width:240px;
	max-width:240px;
	margin-right:16px;
}

/*--------------------------------------------------------------------------
   dl_colon
---------------------------------------------------------------------------*/
.dl_colon{
	display:table;
}
.dl_colon_dl{
	display:table-row;
}
.dl_colon_dt,
.dl_colon_dd{
	display:table-cell;
}
.dl_colon_dt:after{
	content:"：";
}

