@charset "utf-8";


.search{ margin:1em 0 0 0;}
.search_title{float:left; display:block; margin:0 0.3em 0 0; padding:0.5em 1em;background:#fa0}

a.search_title{ background:#eee; color:#666;}
a.search_title:hover{background:#ccc;color:#000;}
.search_box{margin:0.25em 0 1.2em;}
.search_box .focus input{ width:97%}

.search_area{padding:0.3em 0 1em 0em;font-size:0.9em;border-bottom:1px solid #ccc;margin:0 0 0.5em;}
.search_area::after {content:" ";display:block;clear:both;}
.search_area span,.search_area a{vertical-align:middle;display: inline-block}
.search_area .search_txt{float:right;margin-left: 1em;}
.search_area .search_nav{float:left;}
.search_area .search_tx a{display:inline-block;background:#666;color:#fff;width:3em;text-align:center;margin:0 0.1em}
.search_area .search_tx a:hover{background:#000;}
.search_area .search_tx a.on{background:#C00;}
.search_area .search_pic a{border:1px solid #ccc;display:inline-block;text-indent:-9999px;line-height:0px;width:1.1em;height:1.1em;background:url(../../hualien/images/view.png);background-size:1em auto;font-size:1.5em;margin:0 0 0 0.3em;background-position:0 0;}
.search_area .search_pic a.search_view0{background-position:0 0em;}
.search_area .search_pic a.search_view1{background-position:0 -2em;}
.search_area .search_pic a.search_view2{background-position:0 -1em;}
.search_area .search_pic a.view_on{border:1px solid #666;}
.search_area .backhome{display: inline-block;vertical-align: middle; border:1px solid #ccc;font-size:1em;margin:0 0 0 0.3em;padding:0 0.5em;line-height: 1.5em;color: #666}
.search_area .backhome:hover{color: #FFF;background: #666;border:1px solid #666;}


#result{position:relative;margin:0 0 0.5em 0;font-size:1em;}
#result>div{width: 100%;}
#result .gridlists{font-size:1em;}
#result .grid_list{padding:0.5em;margin:0 0 1px 0;font-size:1.1em;}
#result .grid_name{color:#069;font-size:1.2em;}
#result .grid_txt{height:auto;padding:0.5em 0 0 0}
#result .grid_address{font-size:0.9em;padding:0 0 0.3em 0}
#result .grid_list:hover .grid_link::before{background:rgba(0,0,0,0.1)}


#result.result_view1 .grid_list{width:100%;padding:0.9em 0.7em;border-bottom:1px solid #CCC}

#result.result_view1  .grid_pic{width:12em; height:9em;margin: 0 0.7em 0 0;}
#result.result_view1  .grid_beroom{position: absolute;top:1em;width:3em;background:rgba(0,0,0,0.5);color:#FFF;padding:0.1em 0;text-align:center;font-size:0.9em;line-height:1.5em;z-index:5}
#result.result_view1 .grid_beroom{ display:none;}
#result.result_view1 .grid_list a,#result.result_view2 .grid_list a{ cursor: pointer; z-index:5;}

#result.result_view2 .grid_list{width:33.333%;margin-bottom:0.5em;}
#result.result_view2  .grid_pic{float:none;width:100%; height:22vw;margin: 0;min-height:0;}
#result.result_view2  .grid_pic img{}
#result.result_view2  .grid_p{margin:0.5em 0 0 0;padding:0 0 0 0;display: -webkit-box;-webkit-line-clamp:5; -webkit-box-orient: vertical;height:105px;}
#result.result_view2  .grid_beroom{/*position: absolute;right:0.6em;*/top:0.85em;left:0.9em;width:3em;background:rgba(0,0,0,0.5);color:#FFF;padding:0.1em 0;text-align:center;font-size:0.9em;line-height:1.5em;z-index:5; display: none;}
#result .grid_rate{position:relative;display: block;vertical-align: middle;text-align: right;}
#result .grid_prices,
#result .grid_booking{float:none;vertical-align: inherit;display: inline-block}


.navigation{ width:100%; font-size:1.3em; line-height:2.5em; margin:0 0 0.5em;}
.navigation a{ display:block; text-align:center; background:#DDD; color:#666;}
.navigation a:hover{background:#CCC; color:#000;}

@-moz-document url-prefix()
{#result.result_view2 .grid_p:after{content: "";text-align: right;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 70%;
  height: 1.2em;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 1) 90%);
	}}
@media screen and (max-width:741px) {
.search_title{margin:0 0 0 2%}
.search_area{  padding: 0.3em 2% 1em;}
.search_area .search_t,
.search_area .search_txt,
.search_area .search_nav{float: none;display:block;}
.search_area .search_tx{ float:left;}
.search_area .search_pic{ display:none;}
.search_area .search_tx a{/* font-size:1.12em;*/}
.search_area .search_pic a{/*font-size: 1.53em;*/}
#result .gridlists{/*font-size:0.7em;*/}
#result.result_view1 .gridlists{/*font-size:0.65em;*/}
#result.result_view1 .grid_txt{ margin:0; padding:0;}
#result.result_view2 .gridlists{/*font-size:0.6em;*/}
#result.result_view1  .grid_pic{width:6em;min-height:8em;}
#result.result_view1 .grid_list{padding: 0.9em 2% 0.9em 0;}
#result.result_view3 .grid_list{width:100%;border-bottom:1px solid #CCC}
#search_box{  margin: 0.3em 2% 1em;}
#search_box button{ width:3.5em;}
.search_area .search_txt { margin:0em;}
#result.result_view2 .grid_list{width:100%;padding: 0 0 2em 0;}

#result.result_view2 .grid_pic{height:63vw;}
#result.result_view2.result_attraction{margin: 0 0 0 -1%}
#result.result_view2.result_attraction .grid_list{width: 49%;margin: 0 0 0 1%}
#result.result_view2.result_attraction .grid_pic{height:34vw;}
}
@media screen and (max-width:600px) {}
@media screen and (min-width:1180px) {
#result.result_view2 .grid_list{width:25%;}
#result.result_view2 .grid_pic{height:187px;}}