@charset "utf-8";

.car-rental-list {font-size:16px; text-align:left;}
.car-rental-list * {margin:0; padding:0;}
.car-rental-list .list {margin:0 -15px; display:flex; flex-wrap:wrap;}
.car-rental-list .list > a {width:50%; text-decoration:none; color:#000; padding:30px 15px 0 15px; box-sizing:border-box; display:block; transition:opacity 0.3s ease;}
.car-rental-list .list > a:hover {opacity:0.7;}
.car-rental-list .list .img {width:100%; padding:75% 0 0 0; background-repeat:no-repeat; background-position:center center; background-size:contain; border:solid 1px #999; border-radius:10px; box-sizing:border-box; position:relative;}
.car-rental-list .list .name {font-size:22px; font-weight:400; margin:5px 0 0 0;}
.car-rental-list .list .option {margin:4px -2px 0 -2px; display:flex; flex-wrap:wrap;}
.car-rental-list .list .option > div {padding:4px 2px 0 2px; box-sizing:border-box;}
.car-rental-list .list .option > div > span {font-size:14px; white-space:nowrap; padding:0 10px; border:solid 1px #999; border-radius:3px; display:block;}
.car-rental-detail {font-size:16px; text-align:left;}
.car-rental-detail * {margin:0; padding:0;}
.car-rental-detail .name {font-size:30px; font-weight:900; text-align:center;}
.car-rental-detail .option {margin:10px -2px 0 -2px; display:flex; flex-wrap:wrap;}
.car-rental-detail .option > div {padding:4px 2px 0 2px; box-sizing:border-box;}
.car-rental-detail .option > div > span {white-space:nowrap; padding:0 10px; border:solid 1px #999; border-radius:3px; display:block;}
.car-rental-detail .point {font-size:18px; text-align:center; margin:30px 0 0 0;}
.car-rental-detail .cost {margin:30px 0 0 0; padding:0 0 10px 0; background-color:#eee; border-radius:5px; overflow:hidden;}
.car-rental-detail .cost dt {font-size:20px; font-weight:400; text-align:center; color:#fff; margin:0 0 10px 0; padding:2px 0 6px 0; background-color:#51a9c3;}
.car-rental-detail .cost dd {font-size:16px; text-align:right; padding:0 20px;}
.car-rental-detail .cost dd:nth-of-type(1) {font-size:20px; font-weight:900;}
.car-rental-detail .cost dd.note {margin:5px 0 0 0;}
.car-rental-detail .detail {margin:30px 0 0 0; display:block; box-sizing:border-box;}
.car-rental-detail .detail dl {margin:0; padding:5px 10px; border-bottom:solid 1px #ccc; display:flex; box-sizing:border-box;}
.car-rental-detail .detail dl:nth-of-type(even) {background-color:rgba(0,0,0,0.03);}
.car-rental-detail .detail dt {width:14em; margin:0; padding:0;}
.car-rental-detail .detail dt .sub {font-size:80%;}
.car-rental-detail .detail dd {margin:0; padding:0; flex:1;}
.car-rental-detail .btns {margin:30px 0 0 0; display:flex; flex-wrap:wrap; justify-content:center;}
.car-rental-detail .btns > div {width:50%; padding:10px 10px; box-sizing:border-box;}
.car-rental-detail .btns a,
.car-rental-detail .btns button {width:100%; height:5em; font-size:24px; font-weight:900; line-height:1.4; text-align:center; text-decoration:none; color:#fff; background-color:#2581c2; box-shadow:-1px -1px 2px 0px rgba(0,0,0,0.3) inset; border:none; border-radius:100px; box-sizing:border-box; display:flex; justify-content:center; align-items:center;}
.car-rental-detail .btns button {height:3em; letter-spacing:0.2em;}
.car-rental-detail .form {margin:30px 0 0 0;}
.car-rental-detail .form dl {text-align:left; margin:15px 0 0 0;}
.car-rental-detail .form dl:first-of-type {margin-top:0;}
.car-rental-detail .form dt {font-size:18px; font-weight:400; text-align:center; margin:0 0 15px 0; padding:2px 10px; background-color:#eee; border-radius:5px;}
.car-rental-detail .form .error-txt {text-align:center;}
.car-rental-detail .form.type1 dl {display:flex;}
.car-rental-detail .form.type1 dt {width:10em; margin:0; padding:2px 10px; box-sizing:border-box; display:flex; justify-content:center; align-items:center;}
.car-rental-detail .form.type1 dd {padding:0 0 0 15px; flex:1;}
.car-rental-detail .form.type1 .error-txt {text-align:left;}
.car-rental-detail .period .clm {display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.car-rental-detail .period .clm > div {display:flex; align-items:center;}
.car-rental-detail .period .clm > div > div {box-sizing:border-box;}
.car-rental-detail .period .clm > div > div:nth-of-type(1) {padding:0 0.3em 0 0; flex:1;}
.car-rental-detail .period .clm > div:nth-of-type(2) {width:3em; line-height:1; text-align:center; display:block; transform:rotate(-90deg);}
.car-rental-detail .period .clm option:disabled {color:#ccc;}
.car-rental-detail .period .clm :placeholder-shown {color:#000;}
.car-rental-detail .period .clm ::-webkit-input-placeholder {color:#000;}
.car-rental-detail .period .clm :-moz-placeholder {color:#000; opacity:1;}
.car-rental-detail .period .clm ::-moz-placeholder {color:#000; opacity:1;}
.car-rental-detail .period .clm :-ms-input-placeholder {color:#000;}
.car-rental-detail .price dd {text-align:right;}
.car-rental-detail .address .clm {margin:-5px 0 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.car-rental-detail .address .clm > div {width:100%; margin:5px 0 0 0;}
.car-rental-detail .address .clm > div:nth-of-type(1) {width:8em;}
.car-rental-detail .address .clm > div:nth-of-type(2) {width:auto; padding:0 0 0 10px;}
#calendarObj {background-color:rgba(0,0,0,0.7); z-index:400;}

@media screen and (max-width:767px){
	.car-rental-list .list {margin:0;}
	.car-rental-list .list > a {width:100%; padding:30px 0 0 0;}
	.car-rental-list .list .name {font-size:22px; text-align:left;}
	.car-rental-list .list .option {margin-top:0;}
	.car-rental-detail .name {font-size:24px;}
	.car-rental-detail .option {margin:10px -3px 0 -3px; justify-content:flex-start;}
	.car-rental-detail .option > div {padding:6px 3px 0 3px;}
	.car-rental-detail .option > div > span {font-size:14px;}
	.car-rental-detail .point {font-size:16px; text-align:left; margin:30px 0 0 0;}
	.car-rental-detail .cost {margin:30px 0 0 0; padding:0 0 10px 0; background-color:#eee; border-radius:5px; overflow:hidden;}
	.car-rental-detail .cost dt {font-size:16px;}
	.car-rental-detail .cost dd {font-size:16px; padding:0 10px;}
	.car-rental-detail .cost dd:nth-of-type(1) {font-size:18px;}
	.car-rental-detail .cost dd.note {font-size:14px;}
	.car-rental-detail .btns {display:block;}
	.car-rental-detail .btns > div {width:auto; padding:5px 0;}
	.car-rental-detail .btns a {height:5em; font-size:18px;}
	.car-rental-detail .btns button {height:3em; font-size:18px;}
	.car-rental-detail .form {margin:30px 0 0 0;}
	.car-rental-detail .form dt {font-size:16px;}
	.car-rental-detail .period .clm > div:nth-of-type(2) {width:100%; padding:5px 0; transform:rotate(0deg);}
}