.table {
	width: 100%;
	border-collapse: collapse;

	> thead,
	> tbody {
		> tr {
			> th,
			> td {
				padding: $sp-3;
				text-align: left;
				vertical-align: top;
			}
		}
	}

	> thead,
	> tbody {
		> tr {
			> th { font-weight: $font-bold;}
		}
	}

	> thead {
		> tr {
			> th { background-color: $co-gray-80;}
		}
	}

	> tbody {
		> tr {
			> th,
			> td {
				padding: $sp-2 $sp-3;
				text-align: left;
				vertical-align: top;
				border-bottom: 1px solid $co-gray-80;
			}
		}
	}
}

.table-striped {
	> tbody > tr {
		> th, > td { border-bottom-color: transparent;}

		&:nth-of-type(even) {
			background-color: $co-gray-90
		}
	}
}

.table-hover {
	> tbody > tr:hover {
		background-color: $co-gray-90
	}
}

.table-responsive {
	overflow-y: auto;

	@include scrollBar();
}