/* 図 */
figure img {
	width: min(100%, 450px);
	height: auto;
}
figure.twocolumns {
	display: table;
	width: calc(100% - 1em);
}
figure.twocolumns .container1 {
	display: table-cell;
	width: 50%;
	margin: 0;
	text-align: center;
	vertical-align: middle;
}
figure.twocolumns .container2 {
	display: table-cell;
	width: 50%;
	margin: 0;
	text-align: center;
	vertical-align: middle;
}

/* 旅程の詳細を表示/隠す */
table.timeline caption {
	text-align: right;
	background-color: #E0E0E0;
	color: black;
	margin-bottom: 3px;
}
table.timeline caption label {
	display: block;
	width: 100%;
}
input[type=checkbox] + table span.shown { display: none; }
input[type=checkbox] + table span.hidden { display: inline; }
input[type=checkbox]:checked + table span.shown { display: inline; }
input[type=checkbox]:checked + table span.hidden { display: none; }
input[type=checkbox] + table.timeline tbody { display: none; }
input[type=checkbox]:checked + table.timeline tbody { display: table-row-group; }
@media (prefers-color-scheme: dark) {
	table.timeline caption {
		background-color: #2A2A2A;
		color: white;
	}
}

/* 旅程の表 */
table.timeline tr th.day1 { background-color: #FFEAF4; color: black; }
table.timeline tr th.day2 { background-color: #EAF7FF; color: black; }
table.timeline tr th.day3 { background-color: #F5FFEA; color: black; }
table.timeline tr th.day4 { background-color: #FFF7EA; color: black; }
table.timeline tr th.day5 { background-color: #F4EAFF; color: black; }
table.timeline tr th.day6 { background-color: #ECEFFD; color: black; }
table.timeline tr.gap { border-width: 2px; border-style: solid hidden; border-color: var(--color-table-border); height: 5px; }
@media (prefers-color-scheme: dark) {
	table.timeline tr th.day1 { background-color: #550028; color: white; }
	table.timeline tr th.day2 { background-color: #003555; color: white; }
	table.timeline tr th.day3 { background-color: #2D5500; color: white; }
	table.timeline tr th.day4 { background-color: #553500; color: white; }
	table.timeline tr th.day5 { background-color: #280055; color: white; }
	table.timeline tr th.day6 { background-color: #09144D; color: white; }
}

table.timeline {
	width: calc(100% - 1em);
	font-size: 10pt;
}
table.timeline tr td:nth-child(1):not([colspan]) {
	width: 1%;
	white-space: nowrap;
	border-right: none;
	padding-right: 0;
}
table.timeline tr td:nth-child(2) {
	width: 15%;
	min-width: 5em;
	border-right: none;
	border-left: none;
}
table.timeline tr td:nth-child(3) {
	width: 1%;
	white-space: nowrap;
	border-right: none;
	border-left: none;
	padding-right: 0;
	padding-left: 0;
}
table.timeline tr td:nth-child(4) {
	width: 1%;
	white-space: nowrap;
	border-right: none;
	border-left: none;
	padding-right: 0;
}
table.timeline tr td:nth-child(5) {
	width: 15%;
	min-width: 5em;
	border-left: none;
}
table.timeline tr td:nth-child(6) {
	width: 20%;
	min-width: 7em;
}
table.timeline tr td:nth-child(7) {
	width: 50%;
}

@media all and (max-width:768px){
	table.timeline { font-size: 9.5pt; }
}
@media all and (min-width:600px) and (max-width:649px){
	table.timeline { font-size: 9pt; }
}
@media all and (max-width:599px){
	table.timeline { width: calc(100% - 0.5em); }
	figure.twocolumns {
		display: block;
		width: calc(100% - 0.5em);
	}
	figure.twocolumns .container1,
	figure.twocolumns .container2 {
		display: block;
		width: auto;
	}
}
@media all and (max-width:480px){
	table.timeline { font-size: 9pt; }
	table.timeline tr td: nth-child(2),
	table.timeline tr td:nth-child(5) { min-width: 4em; }
	table.timeline tr td:nth-child(6) { min-width: 5em; }
}