@charset "shift_jis"; 

.table {
	width:100%;
	border-collapse: collapse;
}
.table td,
.table th {
	padding:20px;
	border: 1px solid #ccc;
}
.table th {
	width:25%;
	background:#f7f7f7;
}
@media all and (-ms-high-contrast:none){
	.table td,
	.table th {padding:13px 10px 7px;}
}

@media only screen and (max-width:768px) {
	.table{display: block;}
	.table thead {display: block;}
	.table tbody {display: block;}
	.table tbody tr {
		display: block;
		text-align:left;
	}
	.table th,
	.table td {
		display: list-item;
		list-style-type: none;
		border: none;
		text-align:left;
		width:100%;
		padding:10px;
	}
	.table th {
		background: #efefef;
	}
	.table td {
	}
}
@media only screen and (max-width:480px) {
	.table th,
	.table td { padding:5px; font-size:0.9em; line-height:1.5em;}
}


/*SPで落とさない**************/
.table_pc {
	width:100%;
	border-collapse: collapse;
	table-layout:auto;
}
.table_pc th {
	width:20%;
	background:#f7f7f7;
}

.table_pc td,
.table_pc th {
	position:relative;
	padding:10px;
	border: 1px solid #ccc;
}
.table_pc thead th,
.table_pc thead td{
	background:#666666;
	color:#ffffff;
	border: 1px solid #666666;
}



@media all and (-ms-high-contrast:none){
	.table_pc td,
	.table_pc th {padding:13px 10px 7px;}
}
@media only screen and (max-width:480px) {
	.table_pc td,
	.table_pc th {padding:5px;font-size:0.9em; line-height:1.5em;}
}


/*横スクロールするテーブル**************/

/*テーブルにスクロール*/
.table_sticky {
	display: block;
	overflow:hidden;
	}
.table_sticky > div.table_sticky_scroll {
  overflow: scroll;
  height: 75vh;
	}

.table_sticky table {
	width:100%;
	/*border-collapse: collapse;*/
	table-layout:auto;
  -webkit-overflow-scrolling: touch;
}
.table_sticky td,
.table_sticky th {
	position:relative;
	padding:10px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	white-space: nowrap;
	}
.table_sticky th {
	background:#f7f7f7;
	}
.table_sticky td {
	background:#ffffff;
	}
.table_sticky thead th,
.table_sticky thead td{
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		background:#666666;
		color:#ffffff;
		z-index:2;
	border-top: 1px solid #ccc;

		}
.table_sticky tbody tr th:first-child{
		position: -webkit-sticky;
		position: sticky;
		left: 0;
		background:#f7f7f7;
		z-index:1;
	border-left: 1px solid #ccc;
	}
.table_sticky thead th:first-child{
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		left: 0;
		z-index:3;
	}

@media all and (-ms-high-contrast:none){
	.table_sticky > div.table_sticky_scroll {
		overflow-y:inherit;
		overflow-x:auto;
		height:inherit;
		}

	.table_sticky td,
	.table_sticky th {padding:13px 10px 7px;}
}
@media only screen and (max-width:480px) {
	.table_sticky td,
	.table_sticky th {padding:5px;font-size:0.9em; line-height:1.5em;}
}





/**/
.table_dot {
	width:100%;
	border-collapse: collapse;
	border-top: 1px dotted #ccc;
	}
.table_dot td,
.table_dot th {
	padding:20px;
	border-bottom: 1px dotted #ccc;
	}
.table_dot th {
	width:25%;
	background:#f7f7f7;
	}
	
@media all and (-ms-high-contrast:none){
	.table_dot td,
	.table_dot th {	padding:13px 10px 7px;}
}
@media only screen and (max-width:768px) {
	.table_dot{display: block;}
	.table_dot thead {display: block;}
	.table_dot tbody {display: block;}
	.table_dot tbody tr {
		display: block;
		text-align:left;
	}
	.table_dot th,
	.table_dot td {
		width:100%;
		display: list-item;
		list-style-type: none;
		padding:10px;
		text-align:left;
	}
	.table_dot th {}
	.table_dot td {}
}
@media (-ms-high-contrast:none) and (max-width: 768px) {
	.table_dot th,
	.table_dot td {padding:8px 5px 2px;}
}

/*SPでおちない*/
.table_dot_pc{
	width:100%;
	border-collapse: collapse;
	border-top: 1px dotted #ccc;
	}
.table_dot_pc caption{
	font-weight:bold;
	text-align:left;
	}
.table_dot_pc td,
.table_dot_pc th {
	padding:10px;
	border-bottom: 1px dotted #ccc;
	}
.table_dot_pc th {
	width:25%;
	background:#f7f7f7;
	}

@media all and (-ms-high-contrast:none){
	.table_dot_pc td,
	.table_dot_pc th {	padding:13px 10px 7px;}
}
@media only screen and (max-width:480px) {
	.table_dot_pc td,
	.table_dot_pc th{
		padding:5px;
	}
}
@media (-ms-high-contrast:none) and (max-width: 480px) {
	.table_dot_pc td,
	.table_dot_pc th {	padding:8px 5px 2px;}
}



