@charset "UTF-8";
/* CSS Document */

/* Web予約システム */
.web_reservation_back{background-color: #cee7cc;padding: 50px 0;}
.web_reservation_back2{background-color: #eee;padding: 30px 0 20px 0;}
textarea:focus, input:focus, input[type]:focus {outline: 0; box-shadow: none; background-color: #ffffff;}
.web_reservation div:first-child{margin-top: 0px;}
.web_reservation>div{margin-top: 30px;}
.web_reservation div>span{background-color: #65c400;color: #fff;width: 24px;height: 24px;display: inline-block;text-align: center;margin: 0 10px 10px 0;}
.web_reservation div>div{font-weight: bold;}

/* セレクトボックス */
.cp_ipselect {overflow: hidden;text-align: center;}
.cp_ipselect select {width: 100%;padding-right: 1em;cursor: pointer;text-indent: 0.01px;text-overflow: ellipsis;border: none;outline: none;background: transparent;background-image: none;box-shadow: none;-webkit-appearance: none;appearance: none;}
.cp_ipselect select::-ms-expand { display: none;}
.cp_ipselect.cp_sl01 {position: relative;border: 0px solid #bbbbbb;border-radius: 2px;background: #ffffff;}
.cp_ipselect.cp_sl01::before {position: absolute;top: 0.9em;right: 0.9em;width: 0;height: 0;padding: 0;content: '';border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 10px solid #666666;pointer-events: none;}
.cp_ipselect.cp_sl01 select {padding: 8px 38px 8px 8px;color: #000;}
label{background-color: #fff;margin-bottom: 0;height: 50px;padding: 5px 0;}
.form-control {border: 0px;}
.btn-info {background-color: #65c400!important;border-color: #65c400!important;}
.btn-info:hover{background-color: #65c400;border-color: #65c400;opacity: 0.8;}
@media (min-width: 768px) {
	.car_type{ margin-top: 10px!important; }
}
@media (max-width: 767.98px) {
	.car_type{ margin-top: 10px!important; }
}

@media (min-width: 768px) {
	.web_reservation{width: 450px;margin: 0 auto 50px;}
	.web_reservation input{display: inline-block;width: 220px;}
	.departure{vertical-align: top; display: table; border-collapse: separate; border-spacing: 5px 0; margin-bottom: 5px;}
	.return{vertical-align: top; display: table; border-collapse: separate; border-spacing: 5px 0;}
	.br{border-radius: 8px; width: 440px; margin: 0 5px;}
	/*.date_label{position: relative;top:-15px;}*/
	label span{display: inline-block;margin: 0 20px;background-color: #eee;border-radius: 15px;padding: 3px 5px;font-size: 11px;font-weight: bold;}
	.lefttop{border-radius: 8px 0 0 0; display: table-cell; width: 330px;}
	.righttop{border-radius: 0 8px 0 0; max-width: 120px; width: 120px; display: table-cell;}
	.leftbottom{border-radius: 0 0 0 8px; display: table-cell; width: 330px;}
	.rightbottom{border-radius: 0 0 8px 0; max-width: 120px; width: 120px; display: table-cell;}
	/*.return{position: relative;top: -10px;margin-bottom: -24px;}*/
	
	/* 車両選択 */
	.modal-dialog {max-width: 900px;}
	.reference {margin-top: 10px;}
	.reference img{width: 100px;padding-left: 5px;}
}
@media (max-width: 767.98px) {
	.web_reservation{width: 90%;margin: 0 auto 50px;}
	.web_reservation input{display: inline-block;vertical-align: middle;line-height: 2em;padding-top: 6px;}
	.departure{width: 100%;}
	.br{border-radius: 8px;width: 100%;}
	.form-control{width: 174px;padding: 0;font-size: 14px;}
	label span{display: inline-block;margin: 0 10px;background-color: #eee;border-radius: 15px;padding: 3px;font-size: 11px;font-weight: bold;vertical-align: middle;}		
	.lefttop{border-radius: 8px 0 0 0;width: 65%;float: left;margin-right: 3px;}
	.righttop{border-radius: 0 8px 0 0;width: 33%;}
	.leftbottom{border-radius: 0 0 0 8px;width: 65%;float: left;margin-right: 3px;}
	.rightbottom{border-radius: 0 0 8px 0;width: 33%;}
	.return{position: relative;top: 3px;margin-bottom: 10px;}
	
	/* 車両選択 */
	.modal-dialog {max-width: 900px;}
	.reference {margin-top: 10px;}
	.reference img{width: 100px;padding-left: 5px;}
}
/*@media all and (-ms-high-contrast: none){
  .date_label{ position: relative; top:-19px;}
}
@supports (-ms-ime-align: auto) {
  .date_label{ position: relative; top:-19px;}
}*/
@media (max-width: 414px) {
	.form-control{width: 174px;padding: 0;font-size: 14px;}
}
@media (max-width: 375px) {
	.form-control{width: 150px;padding: 0;font-size: 14px;}
}
@media (max-width: 320px) {
	.form-control{width: 110px;padding: 0;font-size: 14px;}
}


/* 3列ボックス-車種選択 */
@media (min-width: 768px) {
	.flex2{display: flex;}	
	.flex2:last-child{margin: 20px 0;}
	.flex2>div{margin-right: 20px;text-align: left;width: 275px;position: relative;font-size: 13px;}
	.flex2>div:last-child{margin-right: 0px;}
	.flex2>div>a>div:nth-child(1){margin-bottom: 10px;padding: 10px;}
	.flex2>div>a>div:nth-child(2){font-size: 18px;font-weight: bold;}
	.flex2>div>a>div:nth-child(3){font-size: 14px;margin-bottom: 5px;color: #eb6100;font-weight: bold;padding-right: 5px;}
	
	.modal_link>a{ display: block; top: 0; left: 0; width: 100%; height: 100%; color: #000; text-decoration: none;}
	.modal_link>a:hover{ text-decoration: none; opacity: 0.7;}
	
	.no_type{height: 350px; line-height: 350px; text-align: center; font-weight: bold; font-size: 18px;}
}
@media (max-width: 767.98px) {
	.flex2{margin-top: 20px;}	
	.flex2:last-child{margin-bottom: 20px;}
	.flex2>div{margin: 20px 0;text-align: left;width: 100%;position: relative;font-size: 13px;}
	.flex2>div:last-child{margin-right: 0px;}
	.flex2>div>a>div:nth-child(1){padding: 10px;}
	.flex2>div>a>div:nth-child(2){font-size: 18px;font-weight: bold;}
	.flex2>div>a>div:nth-child(3){font-size: 18px;margin-bottom: 5px;color: #eb6100;font-weight: bold;padding-right: 5px;}
	
	.modal_link>a{ display: block; top: 0; left: 0; width: 100%; height: 100%; color: #000; text-decoration: none;}
	.modal_link>a:hover{ text-decoration: none; opacity: 0.7;}
	
	.no_type{ border: 1px solid #ddd; height: 100px; line-height: 100px; text-align: center; font-weight: bold; font-size: 18px; padding: 0!important;}
}


@media (min-width: 768px) {
}
@media (max-width: 767.98px) {
}


@media (min-width: 768px) {
}
@media (max-width: 767.98px) {
}
