.tsoh {
	&-time-table {
		width: auto;

		@media only screen and (max-width: 786px) {
			width: 100%;
		}
		&-widget {
			width: 100%;
		}
		max-width: 100%;
		table-layout: auto;
		border-collapse: collapse;
		margin: 1em 0;
		th,
		td {
			padding: 1em;
			border: 1px solid #ddd;

			@media only screen and (max-width: 786px) {
				padding: 0.5em;
				font-size: 0.85em;
			}

			@media only screen and (max-width: 320px) {
				padding: 0.25em;
			}
		}
		&-header {
			.time-belt {
				text-align: center;
			}
			.date {
				text-align: center;
			}
		}
	}
	&-cell {
		text-align: center;
		.now &.today {
			background-color: #fffbdc;
		}
		&.close {
			color: #ddd;
		}
		&.open {
			color: #69b073;
		}
	}
	&-row-header {
		text-align: center;
		font-weight: $tsoh-font-weight-regular;
		color: #444;
	}

	&-holiday-note {
		td {
			font-size: 0.85em;
			padding: 1em;
			border-color: transparent;
			color: #888;
		}
	}

	&-time-table-narrow {
		width: 100%;
		th,
		td {
			padding: 0.5em;
			font-size: 0.85em;

			@media only screen and (max-width: 320px) {
				padding: 0.25em;
			}
		}
	}
}