@charset "UTF-8";

@import url('/res/css/style_kwb_layout.css');

.clientBusPick_main{
	display: block;
	max-width: 1200px;
}
.clientBusPick_main > h1{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	padding: 20px 0 10px;
	box-sizing: border-box;
	font-weight: normal;
	color: #F37B1D;
}
.clientBusPick_main > h1 > span{
	display: inline-block;
	margin: 0.25rem;
}
/* 查詢選位 */
.clientBusPick_main > h1 > input[type="button"]{
	border: 0;
	width: auto;
	margin: 0.25rem;
	background-color: #ffa219;
    border: 1px solid #ffa219;
	color: #FFF;
	padding: 0.25rem 1rem;
	box-sizing: border-box;
}
.clientBusPick_main > h1 > input[type="button"]:hover{
	background-color: #fff;
	color:  #ffa219;
}

/* 標題-No. */
.clientBusPick_list_title_no{ width: 5%; }
/* 標題-車次or團名 */
.clientBusPick_list_title_busname{ width: 25%; }
/* 標題-出發時間 */
.clientBusPick_list_title_departuredate{ width: 20%; }
/* 標題-總位數 */
.clientBusPick_list_title_totalseat{ width: 10%; }
/* 標題-尚餘空位 */
.clientBusPick_list_title_remainderseat{ width: 5%; }
/* 標題-位數 */
.clientBusPick_list_title_seat{ width: 10%; }
/* 標題-狀態 */
.clientBusPick_list_title_status{ width: 5%; }
/* 標題-開放時間 */
.clientBusPick_list_title_duringdate{ width: 20%; }

/* 出發時間 */
.clientBusPick_list_departuredate{}

.clientBusPick_list_departuredate > ul{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.clientBusPick_list_departuredate > ul > li{
	white-space: nowrap;
	display: inline-block;
	padding: 5px;
	box-sizing: border-box;
}
/* 狀態 */
.clientBusPick_list > table tr td.clientBusPick_list_status{
	min-width: 100px;
	padding: 0.5rem;
}
.clientBusPick_list_status > input[value="選位"]{
	border: 0;
	background-color: #70b725;
	padding: 0.25rem;
}
/* 開放時間 */
.clientBusPick_list_duringdate{}

.clientBusPick_list_duringdate > ul{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.clientBusPick_list_duringdate > ul > li{
	white-space: nowrap;
	display: inline-block;
	padding: 5px;
	box-sizing: border-box;
}
.clientBusPick_list_duringdate > ul > li > span{
	display: inline-block;
	padding: 0 0 0 5px;
	box-sizing: border-box;
}

/* 圖示說明 */
.clientBusPick_list{ margin: 0 auto; }

.clientBusPick_list_notice{
	width: 100%;
	padding: 0 10px 10px;
	box-sizing: border-box;
	background-color: #FFF;
}
.clientBusPick_list_notice > p{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	padding: 5px 0;
	box-sizing: border-box;
}
.clientBusPick_list_notice > p > i{ margin: 0 5px 0 0; }


@media all and (max-width: 768px)
{
	.kwb_main > form > ul > li{ display: none; }

	.kwb_main > form > ul > li.kwb_now{ display: inline-block; }

	/* 開放時間 */
	.clientBusPick_list_title_duringdate,
	.clientBusPick_list_duringdate{ display: none; }
	/* 車次or團名 */
	.clientBusPick_list_title_busname,
	.clientBusPick_list_busname{ width: 100%; }
	/* 出發時間 */
	.clientBusPick_list_departuredate > ul{ flex-wrap: nowrap; }
}
@media all and (max-width: 650px)
{
	/* No. */
	.clientBusPick_list_title_no,
	.clientBusPick_list_no{ display: none; }
}
@media all and (max-width: 550px)
{
	/* 出發時間 */
	.clientBusPick_list_title_departuredate,
	.clientBusPick_list_departuredate{ display: none; }
}
@media all and (max-width: 425px)
{
	.clientBusPick_main > h1{ padding: 5px 0 10px; }

	.clientBusPick_main > h1 > span,
	.clientBusPick_main > h1 > input[type="button"]{
		display: block;
		text-align: center;
		width: 100%;
		margin: 0.25rem auto;
	}
	/* 總位數 */
	.clientBusPick_list_title_totalseat,
	.clientBusPick_list_totalseat{ display: none; }
}
@media all and (max-width: 375px)
{
	/* 尚餘空位 */
	.clientBusPick_list_title_remainderseat,
	.clientBusPick_list_remainderseat{ display: none; }
}