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

/*table.schedule----------------------------------------*/

table.schedule {
    width: 100%;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 0px 15px;
    font-size: 1.2rem;
}
 
table.schedule th,
table.schedule td {
    padding: 10px;
}
 
table.schedule th {
    background: #FBE6E4;
    vertical-align: middle;
    text-align: left;
    width: 100px;
    overflow: visible;
    position: relative;
    color: #666;
    font-weight: bold;
    font-size: 1.5rem;
}
 
table.schedule th:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #FBE6E4;
    border-width: 10px;
    margin-top: -10px;
}

 
table.schedule td {
    background: #f8f8f8;
    width: 360px;
    padding-left: 20px;
}


/*table.outline----------------------------------------*/

table.outline {
    width: 100%;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 0px 5px;
    font-size: 1.2rem;
}
 
table.outline th,
table.outline td {
    padding: 10px;
}
 
table.outline th {
    background: #C1C1C1;
    vertical-align: middle;
    text-align: left;
    width: 100px;
    overflow: visible;
    position: relative;
    color: #000;
    font-weight: bold;
    font-size: 1.4rem;
}
 
table.outline th:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #C1C1C1;
    border-width: 10px;
    margin-top: -10px;
}

 
table.outline td {
    background: #f8f8f8;
    width: 360px;
    padding-left: 20px;
}

table.outline p { margin-bottom:20px}


@media screen and (min-width : 768px){
table.outline {font-size: 1.4rem;}	
	
	}

/*table.recruit2----------------------------------------*/

.recruit2{
width: 100%;
border-collapse: collapse;
}
.recruit2 th{
width: 25%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #FBE6E4;
border: 1px solid #b9b9b9;
font-size:1.6rem
}
.recruit2 td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
font-size:1.4rem
}






/*table.recruit3----------------------------------------*/

.recruit3{
	display:block;
    width: 100%;
	margin:0 auto;
	padding:0;
	position:relative;
	border-collapse:collapse;
	border-spacing:0;
}

.recruit3 thead { float:left}

.recruit3 thead tr th { display:block}

.recruit3 tbody { display:block;
                  position:relative;
				  overflow-x: auto;
				  white-space: nowrap}

.recruit3 tbody tr { border-collapse: collapse;
                     border-spacing:0;
					 display: inline-block;
					 vertical-align: top;
					 border-right: 1px solid #BABCBF
					 } 

.recruit3 tbody tr th,
.recruit3 tbody tr td{
	display:block;
	vertical-align: top;
	margin-right:0}

.recruit3 table tr th,
.recruit3 table tr td{
	text-align:center;
	border-top: 1px solid #333}
	
	
.recruit3 tr th:last-child,
.recruit3 tr td:last-child { border-bottom:1px solid #333 }

.recruit3 table tr th { background:#FFF2E8}

.recruit3 th {
padding: 6px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #FBE6E4;
border: 1px solid #b9b9b9;
font-size:1.6rem;
height:30px;}

.recruit3 td { padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
font-size:1.4rem;
height:30px;
}