table {
	width: 100%;
	border-collapse: collapse
}

@media screen and (max-width: 575px) {
	table {
		width: 100%
	}
}

table th, table td {
	padding: .5em;
	text-align: left
}

table td {
	word-break: break-all
}

	table td a {
		word-break: break-all
	}

table th {
	background-color: #F3F3F3;
	color: #333;
	text-align: center;
	white-space: nowrap
}

table.table_hover tr:hover {
	background: #F3F3F3
}

table.table_sprite tr:nth-child(even) {
	background: #F5F5F5
}

@media screen and (max-width: 575px) {
	.table_list {
		background-color: transparent !important
	}

		.table_list thead, .table_list tbody, .table_list th, .table_list td, .table_list tr {
			display: block
		}

			.table_list thead tr {
				position: absolute;
				top: -9999px;
				left: -9999px
			}

		.table_list tr {
			border: 1px solid #ccc;
			margin-bottom: 10px
		}

		.table_list td {
			border: none !important;
			border-bottom: 1px solid #eee !important;
			position: relative;
			padding-left: 35% !important;
			white-space: normal;
			text-align: left
		}

			.table_list td:before {
				content: attr(data-title);
				position: absolute;
				top: .5em;
				left: .5em;
				width: 30%;
				padding-right: 10px;
				white-space: nowrap;
				text-align: left;
				font-weight: bold;
				color: #000
			}
}

.fix_th_table {
	margin: 1em 0
}

@media screen and (max-width: 767px) {
	.fix_th_table {
		position: relative;
		width: 100%;
		overflow: hidden !important
	}
}

@media screen and (max-width: 767px) {
	.fix_th_table table {
		display: block;
		width: 100%;
		overflow-x: scroll;
		padding-bottom: 1em
	}
}

.fix_th_table th, .fix_th_table td {
	width: 10em;
	padding: .8em 0;
	text-align: center;
	line-height: 1.2
}

@media screen and (max-width: 767px) {
	.fix_th_table th, .fix_th_table td {
		display: inline-block;
		margin-right: -6px;
		margin-left: 0;
		margin-top: -1px
	}
}

.fix_th_table th:first-child {
	width: 8em;
	white-space: normal
}

@media screen and (max-width: 767px) {
	.fix_th_table th:first-child {
		position: absolute !important;
		left: 0;
		top: auto
	}
}

@media screen and (max-width: 767px) {
	.fix_th_table tr {
		display: block;
		clear: both;
		white-space: nowrap;
		width: auto;
		padding-left: 8em
	}

		.fix_th_table tr:first-child {
			border-top: #ddd 1px solid
		}
}

@media screen and (max-width: 767px) {
	.table_wrapper {
		width: 100%;
		display: block;
		overflow: hidden;
		*zoom: 1;
		overflow: hidden;
		overflow-x: auto;
		padding-bottom: 1em;
		-webkit-overflow-scrolling: touch;
		-webkit-transform: translate3d(0, 0, 0)
	}

		.table_wrapper table {
			width: 100%;
			min-width: 600px
		}
}

.scroltable {
	min-width: 600px !important
}

.scroltable-wrapper {
	position: relative;
	-webkit-overflow-scrolling: touch;
	-webkit-transform: translate3d(0, 0, 0)
}

.scroltable-container {
	overflow: auto
}

.scroltable-nav {
	display: none;
	position: absolute;
	width: 60px;
	height: 100%;
	cursor: pointer;
	z-index: 9
}

	.scroltable-nav.scroltable-nav-left {
		left: 0;
		background: #fff;
		background: -webkit-linear-gradient(left, #fff, rgba(255,255,255,0));
		background: linear-gradient(to right, #ffffff,rgba(255,255,255,0))
	}

		.scroltable-nav.scroltable-nav-left .tablearrow_left {
			position: fixed;
			left: 0em;
			top: 0em;
			display: none;
			z-index: 9
		}

@media screen and (max-width: 767px) {
	.scroltable-nav.scroltable-nav-left .tablearrow_left {
		display: block
	}
}

.scroltable-nav.scroltable-nav-left .tablearrow_left:before {
	position: absolute;
	top: 0em;
	left: -.2em;
	width: 30px;
	height: 30px;
	background: url(../vendor/scrolltable/images/arrow-left.png) no-repeat 10px center;
	content: "";
	z-index: 2
}

.scroltable-nav.scroltable-nav-right {
	right: 0;
	background: rgba(255,255,255,0);
	background: -webkit-linear-gradient(left, rgba(255,255,255,0), #fff);
	background: linear-gradient(to right, rgba(255,255,255,0),#ffffff)
}

	.scroltable-nav.scroltable-nav-right .tablearrow_right {
		position: fixed;
		top: 0em;
		right: 0em;
		display: none;
		z-index: 9
	}

@media screen and (max-width: 767px) {
	.scroltable-nav.scroltable-nav-right .tablearrow_right {
		display: block
	}
}

.scroltable-nav.scroltable-nav-right .tablearrow_right:before {
	position: absolute;
	top: 0em;
	right: -.2em;
	width: 30px;
	height: 30px;
	background: url(../vendor/scrolltable/images/arrow-right.png) no-repeat right 10px center;
	content: "";
	z-index: 2
}

@keyframes arrow_left {
	from {
		left: -.2em
	}

	to {
		left: .3em
	}
}

@keyframes arrow_right {
	from {
		right: -.2em
	}

	to {
		right: .3em
	}
}
