@charset "utf-8";

/*//////////////////////////////////////////////////////////////////////////////

	時刻表 - 詳細

//////////////////////////////////////////////////////////////////////////////*/


/*------------------------------------------------------------------------------

	contents

------------------------------------------------------------------------------*/

.contents {
	background-color: rgba(233,237,239,1);
}


/*------------------------------------------------------------------------------

	section

------------------------------------------------------------------------------*/

.contents .site_column > section,
.contents #recommend {
	margin-top: 7em;
}

.contents section section {
	margin-top: 4.5em;
}

.contents .site_column > section:first-child,
.contents section section:first-child {
	margin-top: 0;
}

.contents section h2 span::before {
	content: url(../../../common/img/icon_japan_b.svg);
}

.contents section h3 {
	margin-bottom: 1.5em;
	font-weight: bold;
	text-align: center;
	line-height: 1;
	font-size: 1.25em;
	color: rgba(9,61,165,1);
}

.contents section h3 span {
	position: relative;
	padding-left: 1.75em;
}

.contents section h3 span::before {
	content: url(../../../common/img/icon_calendar_blue.svg);
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	width: 1.125em;
}

@media screen and (max-width: 900px){

.contents .site_column > section,
.contents #recommend {
	margin-top: 5em;
}

}

@media screen and (max-width: 767px){

.contents section section {
	margin-top: 3em;
}

}


/*------------------------------------------------------------------------------

	time_table

------------------------------------------------------------------------------*/

.contents .time_table {
	padding: 3.75em 3.25em;
	background-color: #FFF;
}

.contents .time_table thead th {
	padding-top: 0;
	padding-bottom: 1em;
}

.contents .time_table th,
.contents .time_table td {
	display: block;
	width: 25%;
	padding: .75em;
}

.contents .time_table tbody {
	display: block;
}

.contents .time_table thead th,
.contents .time_table tbody th {
	background-color: transparent;
	color: inherit;
}

.contents .time_table th,
.contents .time_table td {
	border: none;
}

main tbody td {
	background-color: transparent;
}

.contents .time_table tr {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	border-bottom: 1px solid rgba(0,0,0,.1);
}

.contents .time_table thead th,
.contents .time_table tbody .flight_number {
	font-weight: bold;
}

.contents .time_table tbody tr:nth-child(odd) {
	background-color: rgba(233,237,239,.5);
}

.contents .time_table .flight_number,
.contents .time_table .times_of_day,
.ru .contents .time_table .remarks {
	padding-right: 0;
	padding-left: 0;
}

.contents .time_table .airlines,
.contents .time_table .flight_number,
.contents .time_table .times_of_day,
.contents .time_table .equipment,
.contents .time_table .route {
	text-align: center;
}

.contents .time_table .airlines { width: 13%;}
.contents .time_table .flight_number { width: 7%;}
.contents .time_table .times_of_day { width: 18%;}
.contents .time_table .equipment { width: 10%;}
.contents .time_table .route { width: 10%;}
.contents .time_table .remarks { width: 42%;}

.contents .time_table tbody .remarks {
	display: none;
}

.contents .time_table tbody .remarks:last-child {
	display: block;
}

.contents .time_table .airlines a {
	display: inline-block;
	margin-bottom: .5rem;
}

.contents .time_table .airlines a:last-child{
	margin-bottom: 0;
}

.contents .time_table .airlines img {
	width: 90px;
}

.contents .time_table tbody .times_of_day > span {
	display: inline-block;
	margin-right: 1.25em;
}

.contents .time_table tbody .times_of_day > span:last-child {
	margin-right: 0;
}

.contents .time_table tbody .times_of_day span span {
	position: relative;
	display: inline-block;
	margin-right: .75em;
	font-size: .875em;
	color: #FFF;
	z-index: 1;
}

.contents .time_table tbody .times_of_day span span::after {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	content: "";
	background-color: rgba(47,60,69,1);
	width: 1.75em;
	height: 1.75em;
	border-radius: 50%;
	z-index: -1;
}

.contents .time_table tbody .flight_number {
	font-size: 1.25em;
}

.contents .time_table .route {
	position: relative;
	background: none;
}

.contents .time_table .route a::after {
	content: url(../../../common/img/icon_blank_blue.svg);
	display: inline-block;
	width: 1.125em;
	margin-left: .35em;
	vertical-align: -.125em;
}

#top .tooltip {
	padding: .5em .75em;
	line-height: 1;
	font-size: .75em;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1);
}


@media screen and (max-width: 1200px){

.contents .time_table .airlines { width: 13%;}
.contents .time_table .flight_number { width: 7%;}
.contents .time_table .times_of_day { width: 24%;}
.contents .time_table .equipment { width: 10%;}
.contents .time_table .route { width: 12%;}
.contents .time_table .remarks { width: 34%;}

}

@media screen and (max-width: 900px){

.contents .time_table {
	padding: 2.75em 2.25em;
}

.contents .time_table .equipment {
	display: none;
}

.contents .time_table .remarks {
	width: 40%;
}

}

@media screen and (max-width: 767px){

.contents .time_table {
	padding: 2.5em 1.25em 1.25em;
}

.contents .time_table th,
.contents .time_table td {
	padding: .75em .5em;
}

.contents .time_table thead th {
	font-size: 2.9vw;
}

.en .contents .time_table thead th,
.ru .contents .time_table thead th {
	font-size: 1.85vw;
}

.contents .time_table .airlines img {
	width: 18vw;
}

.contents .time_table tbody .flight_number {
	font-size: 3.25vw;
}

.contents .time_table .remarks {
	text-align: center;
}

.contents .time_table thead .remarks,
.contents .time_table tbody .remarks {
	display: block;
}

.contents .time_table .airlines { width: 18%;}
.contents .time_table .flight_number { width: 18%;}
.contents .time_table .times_of_day { width: 28%;}
.contents .time_table .route { width: 22%;}
.contents .time_table .remarks { width: 14%;}

.contents .time_table tbody .times_of_day > span {
	display: block;
	margin-right: 0;
	margin-bottom: .5em;
}

.contents .time_table tbody .times_of_day > span:last-child {
	margin-bottom: 0;
}

.contents .time_table tbody .remarks:last-child {
	display: none;
}

.contents .time_table tbody .remarks:empty::before {
	content: "－";
}

.contents .time_table .remarks .more {
	padding: .75em;
	text-decoration: underline;
	cursor: pointer;
}

.contents .time_table tbody .remarks {
	padding: 0;
}

.contents .time_table tbody .remarks:last-child {
	position: relative;
	width: 100%;
	padding: .75em 1em;
	background-color: rgba(47,60,69,1);
	text-align: left;
	color: #FFF;
}

.contents .time_table tbody .remarks:last-child::after {
	position: absolute;
	top: -2.5vw;
	right: 3.25vw;
	display: block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 2.5vw 3vw 2.5vw;
	border-color: transparent transparent rgba(47,60,69,1) transparent;
	animation: up .5s;
}

.contents .time_table tbody .route {
	font-size: 2.75vw;
}

.contents .time_table .route a::after {
	width: 2.5vw;
}

@keyframes up {
	0% {top: 0;}
	100% {top: -2.5vw;}
}

}