@charset "utf-8";

/* 検索窓カラー設定 */


/* 逆区間ボタン 文字色 */
.btn-reverse{
	color:#fff;
}
/* 逆区間ボタン 背景色 */
.btn-reverse{
	background:#999;
}
/* 検索ボタン 文字色 */
.btn-search{
	color:#fff;
}
/* 検索ボタン 背景色 */
.btn-search{
	background:#333;
}

/* 検索項目 文字色 */
#wbs_from dt,
#wbs_to dt,
#wbs_departure dt{
	color:#333;
}


/* 検索窓
********************************/

#wbs_searchbox input{
	background:#fff;
}


.form-control {
	display: block;
	width: 100%;
	height: calc(2.25rem + 2px);
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

input[type="date"].form-control{
	outline: none !important;
	width:170px;
	height:auto;
}


#wbs_searchbox_ol{
	/*border-top:1px solid #ddd;
	border-left:1px solid #ddd;
	border-right:1px solid #ddd;
	border-bottom:1px solid #ddd;
	border-radius:5px;*/
	padding:0;
}


#wbs_searchbox dl, 
#wbs_searchbox ol, 
#wbs_searchbox ul,
#wbs_searchbox dd{
	margin-bottom:0;
}

#wbs_searchbox dt{
	font-weight:bold;
}

#wbs_searchbox dd{
	margin-left:0;
}

#wbs_searchbox select{
	display:block;
	width:100%;
	border-radius:5px;
	padding:7px;
}

#wbs_searchbox button{
	border:none;
	outline:none;
}

#wbs_searchbox select:hover,
#wbs_searchbox input:hover,
#wbs_searchbox button:hover{
	cursor:pointer;
}
#wbs_searchbox .btn-reverse:hover,
#wbs_searchbox .btn-search:hover{
	opacity:0.8;
}
#wbs_searchbox label{
	display:none;
}

#wbs_searchbox .btn-search{
	display:block;
	font-weight:bold;
	padding:7px;
	margin:5px auto 5px auto;
	width:150px;
	border-radius:5px;
}

#wbs_searchbox .btn-reverse{
	display:block;
	font-weight:bold;
	padding:7px;
	width:100%;
	border-radius:5px;
}

#wbs_from dl,
#wbs_to dl,
#wbs_departure dl{
	display:flex;
}

#wbs_from dt,
#wbs_to dt,
#wbs_departure dt{
	padding:5px;
	font-size:14px;
	width:70px;
}

#wbs_from dd,
#wbs_to dd,
#wbs_departure dd{
	padding:5px;
}

@media(min-width : 768px){
	#wbs_searchbox_in {
		display:flex;
		justify-content: center;
		align-items: center;
	}
	#wbs_reverse{
		padding:10px;
		margin-top:15px;
		width:40px;
	}
}


@media(min-width : 992px) {
	#wbs_searchbox .btn-search{
		width:100%
	}
	#wbs_from dt, #wbs_to dt, #wbs_departure dt{
		line-height:38px;
	}
	#wbs_from,
	#wbs_to,
	#wbs_departure{
		padding:0 10px;
		
	}
	#wbs_searchbox .btn-search{
		margin-top:20px;
		margin-left:10px;
		line-height:25px;
		width:120px;
	}
}

@media(min-width : 768px) and (max-width : 991px) {
	#wbs_from dl, #wbs_to dl, #wbs_departure dl,
	#wbs_from dt, #wbs_to dt, #wbs_departure dt{
		width:100%;
		display:block;
	}
	#wbs_from dt,
	#wbs_to dt,
	#wbs_departure dt{
		padding:0 10px;
	}
	#wbs_searchbox .btn-reverse{
		margin:23px 0 0 0px;
	}
	#wbs_searchbox .btn-search{
		margin-top:42px;
		margin-left:10px;
		line-height:25px;
		width:120px;
	}
}

@media(max-width:767.9px) {
	#wbs_searchbox_in{
		position:relative;
	}
	#wbs_searchbox_ol{
		padding:0;
	}
	#wbs_from dl{
		margin-top:0;
	}
	#wbs_from{
		padding:5px;
	}
	#wbs_to{
		padding:5px;
	}
	#wbs_reverse{
		padding:5px 0px;
	}
	#wbs_departure{
		padding:0 5px 0 5px;
	}
	#wbs_from,
	#wbs_to{
		width:100%;
	}
	#wbs_from dd,
	#wbs_to dd,
	#wbs_departure dd{
		width:100%;
	}
	#wbs_to {
		padding-top:15px;
	}
	#wbs_reverse{
		position:absolute;
		top:40px;
		left:132px;
	}
	input[type="date"].form-control{
		width:93% !important;
	}
	#wbs_reverse .btn-reverse{
		display:block;
		font-weight:bold;
		padding:5px;
		width:100px;
		border-radius:5px;
		position:absolute;
		top:17px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}
	
	#wbs_from dt, #wbs_to dt, #wbs_departure dt{
		line-height:38px;
	}
	#wbs_departure dl{
		margin-top:0;
	}

	#wbs_searchbox .btn-search{
		width:200px;
		margin:10px auto;
	}
}

@media(max-width:374px) {
	#wbs_searchbox_ttl{
		font-size:16px;
	}
	#wbs_reverse .btn-reverse{
		top:17px;
	}
	#wbs_from dt, #wbs_to dt, #wbs_departure dt{
		font-size:12px;
	}
	
}

@media(max-width:287px) {

	#wbs_searchbox .btn-search{
		width:70%;
	}
	#wbs_searchbox select{
		width:90%;
	}
	
	#wbs_from dl, #wbs_to dl, #wbs_departure dl{
		display:block;
	}
	#wbs_from dt, #wbs_to dt, #wbs_departure dt{
		line-height:1.0;
	}
	#wbs_from dd, #wbs_to dd, #wbs_departure dd{
		width:100%;
	}
	input[type="date"].form-control{
		width:80%;
	}
	#wbs_reverse .btn-reverse{
		top:42px;
		left:-65px;
	}
}
/* 検索項目 文字色調整 */
option:disabled {
    color: #CCC;
}

#wbs_searchbox .btn-search {
  background: linear-gradient(to right, #f4791f, #c6201e);
  color: #ffffff;
  font-size: 16px;
  font-weight: bold;
  padding: 12px 24px;
  border: none;
  border-radius: 4px;
  text-transform: uppercase;
  cursor: pointer;
  width: 100%;
  max-width: 350px;
  height: 60px;
}
#wbs_searchbox .btn-search:hover {
  opacity: 0.9;
}
#wbs_searchbox .btn-search:active {
  box-shadow: 0px 2px 0px #b30024;
  transform: translateY(2px);
}
#wbs_reverse .btn-reverse {
  color: #f4791f;
  background-color: #fff;
  border: 1px solid #ced4da;
  border-radius: 4px;
}