/* RECOMMEND 一覧ページ*/
#recommend #salesBox .textBox{ padding-top: 0;}
#recommend #salesBox .estateAddress .sub{ font-size: 16px; color: #333;}
#recommend #salesBox .status{ min-height: 30px; margin: 15px 0 12px; gap: 8px;}
#recommend #salesBox .status li{ display: inline-block; flex-basis: auto;  padding: 5px 10px; border-radius: 5px; margin-bottom: 0; margin-right: 8px; text-align: center; font-size: 15px; letter-spacing: 0.08em;}
#recommend .orderChange { text-align: right; margin: 0 0 40px 0; padding: 10px; background: #f1f1f1;}
#recommend .orderChange select { background-color: white; border: thin solid blue; border-radius: 4px; display: inline-block; font: inherit; line-height: 1.5em; padding: 0.5em 3.5em 0.5em 1em; margin: 0; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; }
#recommend .orderChange select.classic { background-image: linear-gradient(45deg, transparent 50%, blue 50%), linear-gradient(135deg, blue 50%, transparent 50%), linear-gradient(to right, skyblue, skyblue); background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), 100% 0; background-size: 5px 5px, 5px 5px, 2.5em 2.5em; background-repeat: no-repeat; }
#recommend .orderChange select.classic:focus { background-image: linear-gradient(45deg, white 50%, transparent 50%), linear-gradient(135deg, transparent 50%, white 50%), linear-gradient(to right, gray, gray); background-position: calc(100% - 15px) 1em, calc(100% - 20px) 1em, 100% 0; background-size: 5px 5px, 5px 5px, 2.5em 2.5em;  background-repeat: no-repeat; border-color: grey; outline: 0; }
#recommend .orderChange select.round { background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), radial-gradient(#ddd 70%, transparent 72%); background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), calc(100% - .5em) .5em; background-size: 5px 5px, 5px 5px, 1.5em 1.5em; background-repeat: no-repeat; }
#recommend .orderChange select.round:focus { background-image: linear-gradient(45deg, white 50%, transparent 50%), linear-gradient(135deg, transparent 50%, white 50%), radial-gradient(gray 70%, transparent 72%); background-position: calc(100% - 15px) 1em, calc(100% - 20px) 1em, calc(100% - .5em) .5em; background-size: 5px 5px, 5px 5px, 1.5em 1.5em; background-repeat: no-repeat; border-color: green; outline: 0; }
#recommend .reserve_link{ width: calc(100% - 60px); left: 30px; bottom: 92px; position: absolute; background: #bb3614; color: #fff; display: flex; padding: 10px 0 8px; align-items: center; justify-content: center; text-decoration: none; font-weight: bold; font-size: clamp( 14px , 2vw , 16px); letter-spacing: 0.08em; transition: all 0.3s;}
#recommend .reserve_link::before{ content: ""; display: block; background: url(/assets/img/recommend/icon_reserve.png) no-repeat; width: 32px; height: 33px; margin-right: 10px;}
#recommend .reserve_link:hover{ opacity: 0.8; transition: all 0.3s;}

@media screen and (max-width:1200px) {
	#recommend .reserve_link{ bottom: 60px;}
	#recommend .estateLink{ bottom: 0;}
}

@media screen and (max-width:767px) {
	/* RECOMMEND 一覧ページ*/
	#recommend .reserve_link{ width: calc(100% - 10px); left: 5px; bottom: 45px;}
	#recommend .reserve_link::before { width: 20px; height: 21px; background-size: cover;}
	#recommend #salesBox .estateAddress .sub{ font-size: 4vw;}
	#recommend #salesBox .textBox .specBox{ flex-basis:65%; }
	#recommend #salesBox .status{ flex-basis: auto; min-height: 0;}
	#recommend #salesBox .status li {margin-bottom: 0; }
	
}