@charset "UTF-8";
/* CSS Document */

/*===================================================
    outsource用CSS
===================================================*/



/* --------------------------------------------------
    メイン
-------------------------------------------------- */

/*    共通設定
-------------------------------------------------- */
*{
	box-sizing: border-box;
}
.container{
	width:95%;
	margin:0 auto;
}
h5{
	font-size: 16px;
	color: #c70012;
	clear:both;
	padding:40px 0 20px 10px;
	border-bottom:1px solid #ccc;
	font-weight: bold;
}
h6{
	font-size: 14px;
	color: #c70012;
	font-weight: bold;
}
.payroll-title{
	text-align: center;
}
.payroll-title-p{
	color: #c70012;
	font-size: 16px;
}
.payroll-title h4{
	font-size: 27px;
	color: #c70012;
	padding:30px 0;
}
.payroll-one-p{
	width:55%;
	float:left;
}
.payroll-one-p p{
	padding:15px 0;
}
.payroll-one-img{
	width:45%;
	float:left;
}
.payroll-one-img img{
	width:100%;
}
.prt-con{
	width:20%;
	padding:1px;
	float:left;
	height:300px;
	font-size: 14px;
	text-align: center;
}
.prt-con p{
	padding:30px 0;
}
.pay{
	font-size: 12px;
}
.pay h6{
	padding:20px 0;
}
.payroll-two h5{
	border:none;
}
.four-top-p p{
	font-size: 12px;
	padding:10px 0;
}
.four-top-p img{
	display: block;
	width:95%;
	margin:0 auto;
}
.step-wrap {
	display: flex;
	justify-content: center;
}
@media (max-width: 567px) {
  .step-wrap {
  	display: block;
  }
}
.step-img-wrap {
	display: flex;
	align-items: center;
	padding-left: 15px;
}
@media (max-width: 567px) {
  .step-img-wrap {
  	display: block;
  	padding-top: 20px;
  	padding-bottom: 20px;
  }
}
.step-img-wrap img:nth-child(1){
	display: block;
	width: 120px;
	height: 120px;
}
.step-img-wrap img:nth-child(2){
	display: block;
	width: 21px;
	height: 38px;
	margin-left: 5px;
}
@media (max-width: 567px) {
  .step-img-wrap img:nth-child(2) {
  	position: relative;
  	transform: rotate(90deg);
  	margin-left: 0;
  	left:52px;
  }
}
.step{
	width:16.5%;
/*	float:left;*/
	text-align: center;
}
@media (max-width: 567px) {
  .step {
  	display: flex;
  	width: 100%;
  }
}
@media (max-width: 567px) {
  .step-content-wrap {
  	margin-left: 20px;
  	width: auto;
  	text-align: left;
  }
}
.step .step-content-wrap p{
	padding-bottom:20px;
	font-size: 11px;
}
.five-top-p p{
	padding:10px 0;
}
table{
	border:1px solid #ccc;
}
.table1 table{
	width:50%;
	text-align: center;
}
table tbody td,table tbody th,table thead th,table thead td{
	text-align: center;
	line-height: 3;
	border:1px solid #c6c9cd;
}
.table1 table thead td,.table2 table thead td{
	background-color: #dfdfe4;
	width:30%;
}
.table1 table thead th,.table2 table thead th{
	font-size: 14px;
	width:25%;
	background-color: #c3c3cc;
}
.table1 table tbody th,.table2 table tbody th{
	font-size: 14px;
	width:25%;
	background-color: #c3c3cc;
}
.table1 table tbody td,.table2 table tbody td{
	width:30%;
}
.table1 p,.table2 p{
	padding:10px 0;
}
.table2 table{
	width:30%;
}
.table3,.table4{
	width:70%;
	margin-bottom:40px;
}
.table3 table thead tr th,.table4 table thead tr th{
	width:10%;
}
.table3 table thead tr td,.table4 table thead tr td{
	width:10%;
}


.table3 table thead td,.table4 table thead td{
	background-color: #dfdfe4;
	width:10%;
}
.table3 table thead th,.table4 table thead th{
	width:10%;
	background-color: #c3c3cc;
}
.table3 table tbody th,.table4 table tbody th{
	width:10%;
	background-color: #c3c3cc;
}
.table3 table tbody td,.table4 table tbody td{
	width:10%;
}



@media (max-width: 576px) {
	h5{
	font-size: 16px;
	clear:both;
	padding:40px 0 20px 10px;
}
.payroll-one-p{
	width:100%;
	float:none;
}
.payroll-one-p p{
	padding:15px 0;
}
.payroll-one-img{
	width:100%;
	float:none;
}
.payroll-one-img img{
	width:100%;
}
.payroll-title h4 {
    font-size: 20px;
}
.prt-con{
	width:50%;
	height:280px;
	font-size: 12px;
}
.four-top-p p{
	font-size: 12px;
	padding:10px 0;
}
.four-top-p img{
	display: block;
	width:95%;
	margin:0 auto;
}
.step p{
	font-size: 8px;
}
.table1 table{
	width:100%;
}
.table2 table{
	width:100%;
}
.table3,.table4{
	width:100%;
	font-size: 8px;
}
}

/* add 20210802 iida */
.payroll-five h5{
	margin-bottom: 20px;
}
.payroll-five p{
	padding-left: 2em;
	margin-bottom: 10px;
}
.payroll-five p span{
	margin-left: -2em;
	padding-right: 1em;
}
.outsource-imglayout{
	text-align:center;
}
.outsource-imglayout img{
	max-width:100%;
}