@charset "utf-8";

/* ==========================================

  “Item List” CSS

========================================== */
/* Counts
---------------------------------------- */
#allResults                 {   width: 100%; text-align: right; padding: 0 5px 0 0; margin: 0 0 2.0em;}
#allResults strong          {   font-size: 3.0em; font-weight: normal; display: block;}
#allResults strong:after    {   content: "件"; font-size: 16px; padding-left: 4px;}
#allResults a b             {   font-size: 2em; font-weight: normal; padding: 2px;}



/* Recommended
---------------------------------------- */
#recommended			{	width:100%; margin-bottom: 80px; }
#recommended ul			{	width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0px;}
#recommended li			{	flex-basis: 32%; margin: 0 2.0% 20px 0; }
#recommended li:nth-of-type(3n) {   margin: 0 0 20px;}
#recommended li > a		{	display:block; width:100%; height: auto; overflow: hidden; position: relative;}
#recommended li img,
#recommended li a img	{	width:100%; height:auto; border: 1px solid #eee;}
#recommended li div		{	display: flex; flex-wrap: wrap; justify-content: flex-end; padding: 10px 0 10px; background: #fff;}
#recommended li div div {   max-height: 0; overflow: hidden; padding: 0; margin-top: 10px; /* transition: max-height 2.0s; */}
#recommended li div div a	{	flex-basis: 100%; display: flex; flex-wrap: wrap; justify-content: flex-end; padding: 0 0 10px;}
#recommended li div p	{	flex-basis: 100%; color: #000; padding: 10px 0 0 10px;}
#recommended li a:hover	{	opacity:0.7;}

#recommended li div p.recom_sta {
    font-weight: bold;
}
#recommended li div p.recom_copy {
    max-width: 304px;
    font-size: 1.6em;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#recommended li div p.recom_room {
    font-size: 1.4em;
    text-align: right;
    padding-right: 28px;
    margin-bottom: 5px;
}
#recommended li div p.recom_area {
    flex-basis: auto;
    font-size: 1.6em;
    text-align: right;
    padding-left: 5px;
    border-top: 1px solid #000;
}
#recommended li div p.recom_price {
    flex-basis: 40%;
    font-size: 1.6em;
    text-align: right;
    padding: 10px 5px 0 0;
    margin-right: 20px;
    border-top: 1px solid #000;
}

/* Accordion */
#recommended li div input       {   position: absolute; z-index: -1; opacity: 0;}
#recommended li div p label     {   font-size: 16px; cursor: pointer; display: block; }
#recommended li div p.recom_price label {   position: relative; padding-right: 1.4em;}
#recommended li div p.recom_price label:before {content: "OPEN";width: 4em;height: 1em;font-size: 18px;text-align: right;line-height: 100%;position: absolute;top: 0;right: 1em;display: block;}
#recommended li div p.recom_price label:after { content: "▼";width: 1em;height: 1em;font-size: 18px;text-align: center;line-height: 100%;position: absolute;top: 0;right: 0;display: block;/* transition: all 1.0s; */}
#recommended li div input:checked ~ p.recom_price label:before {   content: "CLOSE"; }
#recommended li div input:checked ~ p.recom_price label:after {   transform: rotate(180deg); margin-top: -3px; }
#recommended li div input:checked ~ div {   max-height: 1420px; }

@media screen and (max-width: 480px) {
    #recommended li			{	flex-basis: 100%; }
}



/* pagination
---------------------------------------- */
#pagination 	{	margin-top:50px; font-size:0;}
#pagination li	{	display:inline-block; border-right:1px solid #aaa; padding:0 7px; font-size:13px; color:#d50000; font-weight:bold;}
#pagination li a{	font-weight:normal;}
#pagination li:first-child	{	border-left:1px solid #aaa;}