.searh_wrapper a:hover img{-webkit-transition: all .3s;-o-transition: all .3s;-moz-transition: all .3s;-ms-transition: all .3s;transition: all .3s;   transform: scale(1.03);}

/*-----側邊選頁-----*/
.sidebar_quickMenu {width: 40px;position: fixed;z-index: 100;right:3%;top:200px;}
.sidebar_quickMenu .sidebar_page_view a{background-color:#eaeaea;margin-bottom: 0;position: relative;box-shadow:none;}
.sidebar_quickMenu .sidebar_page_view span.page_no{ display: block; font-size: 15px;width:25px; height:25px;background-color: #000; color: #fff; line-height: 25px; border-radius: 100%;  position: absolute;top: 0;  bottom: 0;left: 0;right: 0;margin: auto;}

/*-----按鈕------*/
.btn_green{ display: block; width:80%;border-radius:30px; height: 45px; line-height: 45px;text-align: center;background: linear-gradient(to right, #36ab9d 30%, #5ed793 100%);color: #fff;margin: 0 auto;margin-top: 30px;}
.btn_green:hover{background: linear-gradient(to right, #009688 30%, #009688 100%);color: #fff;margin: 0 auto;margin-top: 30px;}
.btn_green.mobile_web{display: none;}

/*-----進階搜尋-----*/
.searh_wrapper{display: block; max-width: 1200px;margin: 0 auto; padding: 50px 20px; box-sizing:border-box;}
form{width:62%;}
.search_header{ display: block;}
.key_search{display:block; text-align:center;}
.key_search:before{display: inline-block; content: "關鍵熱搜:"}
.key_search span{display: inline-block;margin-left: 10px;font-weight: 500;}
.key_search span:before{display: inline-block; content: "#"}
.key_mark,.key_mark a{ color: #ea4c89;}
.search_box{ display: block;width: 100%; height: 50px; border-radius:50px; border:1px solid #000;margin-top: 30px; }
.search_icon{display:inline-block;width: 20px; font-size:1.3em;line-height: 50px;margin-left: 20px;margin-right:10px;}
.SearchTypeahead{display: inline-block;height:45px;position: relative; bottom:1px;}
.SearchTypeahead-searchInput{-webkit-appearance: none;-moz-appearance: none;appearance: none;background: transparent; border: none;color: #000;font-size:1.25em;font-weight:500;width: 100%; height: 100%;overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;width:100%;}
.Search-tabNav{display: block; height: 50px; float: right; padding:8px 25px 0 15px ;border-left: 1px solid #000;box-sizing: border-box;}
.Search-tabNav li{display: inline-block;}
.Search-tabNav li a{display: block; padding:5px 15px;background-color: #fff; border-radius: 30px;}
.Search-tabNav li a:hover, .Search-tabNavigation li a:focus, .Search-tabNav.mobile_web li a:hover, .Search-tabNav.mobile_web li a:focus, .Search-tabNav li a.selected{background-color: #000; color: #fff; }

/*最近查詢條件----輸入字時display:block*/
.suggestion {display:none;background-color: #fff; width: 100%;position: absolute;top:47px; z-index: 99; border-right: 1px solid #000; border-bottom: 1px solid #000; border-left:  1px solid #000;  box-sizing: border-box;
	-webkit-border-bottom-right-radius: 20px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-bottom-right-radius:10px;
	-moz-border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	border-bottom-left-radius:10px;
	overflow: hidden;padding-bottom:15px; z-index:10;}
.suggestion li {line-height:2.5em;padding-left: 20px;}
.suggestion li i{margin-right: 5px;color: #000;}
.suggestion  p{color: #666;font-weight: 500;padding:10px 0 8px 20px;}
.suggestion li:hover{background-color: #e2e2e2;}

/*----進階搜尋-----*/
.filter_wrapper{display:flex;width: 100%; margin-top: 30px;justify-content: flex-end;}
.filter_bar{display:flex;width:100%;}
.filter_bar .block{ display: inline-block;width:20%;margin-right:20px;}
select{display:block;width:100%; height:45px;  color: #000;   border:2px solid #fff;border-radius:5px;font-size:1em;padding:0 10px;background-color:#fff;font-weight:600;border:1px solid #000; }

/*------select樣式------*/
.dropdown{ display:inline-block;width:100%; position:relative;padding: 0; }
.dropdown:after { content: '';  position: absolute;  z-index: 2;  top:11px;  right:10px;  width: 0;  height: 0;  border:7px dashed;  border-color: #000 transparent;  pointer-events: none;outline: #000;}
.dropdown:after {  margin-top: 10px;  border-top-style: solid;  border-bottom: none;}
.dropdown select{  -webkit-appearance:none;  -moz-appearance:none;  -o-appearance:none;   appearance:none;-ms-appearance:none; }
.dropdown select::-ms-expand{  display:none;}
.dropdown option{   margin: 3px;  padding: 6px 10px;  text-shadow: none;  background:#fff; cursor: pointer; line-height: 1.5em;outline:0;}
.dropdown-select:focus {  z-index: 3;width: 100%;  color: #000;  outline: 2px solid #000;  outline: 2px solid -webkit-focus-ring-color; outline-offset: -2px;}

/*----排序條件-----*/
.sort_menu{display:flex;width:30%; justify-content: space-between;}
.total_search{display:block;width:40%;line-height: 45px; position: relative;text-align: right;margin-right:5px;}
.sort_menu .block{display: inline-block;width:52%;}
.sort_menu_NeedToMove {display:none;}

.search_result_3cols {
	display: flex;
	align-content: center;
	justify-content: space-between;
	align-items: flex-start;
	flex-direction: row;
	flex-wrap: wrap;
}
	.search_result_3cols .result_gallery {
		margin: 40px 0;
	}


/*----手機版 進階搜尋-----*/
.filter_bar.mobile_web{display:none;}
.filter_bar.mobile_web button{display:inline-block;width:100%; position:relative;height: 50px;background-color: #fff;border:1px solid #000;font-size: 16px;font-weight:600;border-radius: 5px;}
.filter_bar.mobile_web button:after { content: '';  position: absolute;  z-index: 2;  top:20px;  right:10px;  width: 0;  height: 0;  border:7px dashed;  border-color: #fff transparent transparent transparent; /*border-color: transparent transparent #fff transparent;*/ pointer-events: none;outline: #000;}

.filter_bar.mobile_web.open button{display:inline-block;width:100%; position:relative;height: 50px;background-color: #fff;border:1px solid #000;font-size: 16px;font-weight:600;border-radius: 5px;}
.filter_bar.mobile_web.open button:after{ content: '';  position: absolute;  z-index: 2;  top:20px;  right:10px;  width: 0;  height: 0;  border:7px dashed;  border-color: #000 transparent transparent transparent; /*border-color: transparent transparent #000 transparent;*/  pointer-events: none;outline: #000;}
	.filter_bar.mobile_web.close button:after {
		border-color: transparent transparent #000 transparent;
		top: 13px;
	}

.second_nav{display: block; width: 100%;box-sizing: border-box;overflow: hidden;position:relative;background-color: #fff;border:1px solid #000; border-radius: 5px;border-top: 0; }
.second_nav ul li h2.open a:after { content: '';  position: absolute;  z-index: 2;  top:20px;  right:10px;  width: 0;  height: 0;  border:7px dashed;  border-color: #fff transparent transparent transparent; pointer-events: none;outline: #000;}
.second_nav ul li h2.close a:after { content: '';  position: absolute;  z-index: 2;  top:13px;  right:10px;  width: 0;  height: 0;  border:7px dashed;  border-color: transparent transparent #fff transparent; pointer-events: none;outline: #000; }
.second_nav ul li h2.close a{background-color:#009688;color: #fff;}
.second_nav ul li h2 a{display: block;padding:10px;border-bottom: 1px solid #bebebe; position:relative;text-align: center;background-color:#fff;color: #000;}
/*.second_nav ul li h2 a:hover, .second_nav ul li h2 a:focus{background-color:#009688;color: #fff; }*/
/*.second_nav ul li h2 a:hover:after 
,.second_nav ul li h2 a:focus:after 
,.second_nav ul li h2.close a:focus:after{border-color: transparent transparent #fff transparent; top:13px; }*/
.filter_bar.mobile_web.open .second_nav{display:none;}
.second_nav .open ~ .third_nav{display:none;}


.third_nav {
	display: block;
	padding: 10px 20px;
	background-color: #f0f0f0;
}
.third_nav li{display: inline-block;width:32.8%; padding:5px;text-align: center;box-sizing: border-box;}
.third_nav li a:hover , .third_nav li a:focus, .third_nav li.selected{color:#009688;}

/*---搜尋條件----*/
.search_results_filter{margin-top:30px;}
.search_results_filter div{margin: 0 5px; display:inline-block;cursor:pointer}
.search_results_filter div i{display:inline-block; width:18px; height:18px; background-color: #000; border-radius: 100%;line-height:15px;text-align: center;margin-left:3px;}
.x_mark {display: inline-block;width: 12px;height: 2px;background: #fff;line-height: 0;font-size: 0;vertical-align: middle;-webkit-transform: rotate(45deg); }
.x_mark:after {content: "/";display: block;width: 12px;height: 2px;background: #fff;-webkit-transform: rotate(-90deg);}
.search_results_filter div:hover i{ background-color:#009688; }

/*----關鍵字廣告-----*/
.ppc{display: block;text-align: center;margin:40px 0;}
.ppc strong{font-weight:600;font-size: 1.25em;}

/*----搜尋結果樣式-----*/
.result_row{display: flex; justify-content: space-between;margin:80px 0; flex-wrap: nowrap;position: relative;}
.result_row h2{display: inline-block; font-size: 1.25em; font-weight: 500;z-index:99;}
.result_row h2 a:hover{color:#009688;}
.contact{display: block; width:200px;text-align: center;}
.result_designer{width:190px;}
.row_photo{display: block; width:190px; height:190px;  border-radius: 100%;overflow: hidden;margin-top: 10px;}
.row_photo img{width: 100%;}
.result_info{width:78%;}
.over_the_years_project{display: flex;justify-content:space-between;}

.company h2{margin-right: 15px;}
.company h3{font-weight: 500;margin-bottom: 10px}
.company .area:before{display: inline-block; content: "接案區域："}
.company .style:before{display: inline-block; content: "擅長風格："}

.over_the_years_project{display: flex; flex-wrap: wrap;margin-top:20px;}
.over_the_years_project>div{display: block; width:23%;position: relative;overflow: hidden;}
.over_the_years_project>div a{display: block;width: 100%;height: 0;padding-bottom: 66.6%;overflow: hidden;}
.over_the_years_project div img , .ad_row_img img, .result_gallery_img img {display: block;max-width: 100%; max-height: 100%; position: absolute;  top: 0;  right: 0;  left: 0;  margin: auto; height:100%; width:auto;} 
.ad_row_img img{width:100%;}

.btn_preview a {display:none;width:45px;height:45px;line-height:45px;font-weight: 100;color: #000;		text-align: center;margin-top:10px;}

/*---廣告版位----*/
.ad_board {display: flex; justify-content: space-between;padding:30px; box-sizing: border-box;background-color: #ededed;margin:80px 0;}
.ad_row{ display: block; width: 32%;position: relative;}
.ad_row h3{ font-weight: 500; }
.ad_row:hover h3{color:#009688;}
.ad_row_img{  width: 100%; height: 0;padding-bottom: 66.6%;position: relative;overflow: hidden;margin-bottom: 8px; }
.ad_row_img span{display: block; position: absolute;color: #fff; right: 5px; top:3px;z-index: 3; }
.ad_board2{margin:80px 0 0 0;}

.search_result2, .search_result3, .search_result6 {
	display: flex;
	align-content: center;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: row;
	flex-wrap: wrap;
}
/*---搜尋圖庫結果----*/
.result_gallery{display: block; width: 30%;position: relative;overflow: hidden;}
.result_gallery_img{width: 100%;height: 0;padding-bottom: 66.6%;overflow: hidden;position: relative;margin-bottom: 8px;}
.result_gallery h4{font-size: 1.25em; font-weight: 500;display: block; }
.result_gallery a:hover h4{color:#009688;}
.search_result2 .result_gallery, .search_result3 .result_gallery, .search_result6 .result_gallery {
	margin: 40px 19px;
}
.search_result2 .page_view, .search_result3 .page_view, .search_result6 .page_view {
	width: 100%;
}

/*---圖庫標籤----*/
.result_gallery .result_gallery_tag {display:inline-block;float: left;margin-top: 10px;}
.result_gallery_tag a{ display:inline-block; padding: 2px 8px; background-color:#ededed;text-align: center; margin-right:4px;box-sizing: border-box;border-radius: 5px; font-size: 15px;}
.result_gallery_tag a:hover{background-color: #71bea5; color: #fff;}
.result_gallery_tag a:before{display: inline-block; content:"#";}

.result_article_img{display:block;width:22%;position: relative;}
.result_article_img a{ display: block; width: 100%; height: 0;padding-bottom: 66.6%;position: relative;overflow: hidden;position: relative;z-index: 1;}

.result_article_img img{display: block;max-width: 100%; max-height: 100%; position: absolute;  top: 0;  right: 0;  left: 0;  margin: auto; aspect-ratio:3/2}
.result_article_img .tag_hot_search , .result_gallery .tag_hot_search{position: absolute; top:0;left: 0; z-index: 9;}


.result_article_content{width:75%;position: relative;}
.result_article_content h2{margin-bottom: 10px;}
.result_article_content p{display: block; height: 50px;overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.article_info{position: absolute;bottom: 0; left: 0;}
.article_data {display: inline-block;float: left;}
.article_info span{ padding-right: 15px;}
.article_info .view{padding-left: 15px; border-left: 1px solid #999;}
.article_info .view:before{display: inline-block; content: "人氣"; margin-right: 5px;}


.result_gallery_tag{display: inline-block;float: left;}
.bookmark{display:inline-block; padding:2px 0px; width:70px;text-align: center;border-radius:3px;;z-index: 9;background-color:#ce2b6b;font-size: 15px;font-weight: 400;float: right;margin-top: 10px;}
.bookmark a{color: #fff;}
.bookmark i{margin-right:3px;}
.result_article_content .bookmark{margin-top:0px;margin-left: 20px;}
.result_article_content .bookmark span{padding-right: 0;}


.result_gallery.result_product .result_gallery_img .bookmark{display: none;}
.result_gallery.result_product:hover .result_gallery_img .bookmark{display:block;}
.result_product h3 , .result_product h4{display: block;position:relative;}
.result_product:hover {color:#009688;}
.result_product .bookmark{float: none; position: absolute;right: 5px; bottom: 5px;}

.result_gallery.result_video h2{margin-bottom: 15px;font-size: 1.25em;}
.result_gallery.result_video a:hover h2{color:#009688;}
.tag_60sec_tv {position: absolute;top: 0;left:74px;z-index: 9;}
.play{display: block;width: 100px;height: 100px;text-align: center;line-height:93px;border-radius: 100%;border: 2px solid #fff;position: absolute;top: 0;right: 0;bottom: 0;left: 0;margin: auto;background: rgba(0,0,0,.3);box-sizing: border-box;padding-left: 10px;    z-index: 5;
font-size: 2em;color: #fff;}
.play:hover{background: rgba(255,255,255,1);color: #000;}

.over_the_years_project .tag_hot_search.mobile_web{ display:none; position: absolute; z-index:99;}
.result_gallery_videotag{ position: absolute; display: block; z-index: 9;}
.result_gallery.result_video .tag_hot_search { display: inline-block; position: unset; left: unset; top: unset; }
.result_gallery.result_video .tag_60sec_tv { display: inline-block; position: unset; left: unset; top: unset; }


.Search-tabNav.mobile_web {
	display: none;
}

.page_view_inner {    margin: 120px auto 80px;}
.pathway{ display: block; padding:20px 10px;box-sizing: border-box; }
.pathway span {display: inline-block;margin: 0 5px;}
.pathway span {display: inline-block;margin: 0 5px;}
.pathway span:before{display:inline-block; content: ">";margin-right: 5px;}
.pathway span:first-child:before{display:none;}

@media (min-width:320px) and (max-width:1200px) {
	form {width:58%;}
}

@media (min-width:320px) and (max-width:1100px) {
	form {width:53%;}
	.filter_bar{width:65%;}	
	.row_photo{margin-top:0; }
}

@media (min-width:1024px) and (max-width:1024px) {
	.result_gallery{width:46%;}
}
@media (min-width:320px) and (max-width:1024px) {
/*	.filter_wrapper.filter_wrapper_right{justify-content: end;}*/
	.sort_menu{justify-content: end;margin-right: 5px;}
	.row_photo {width:180px; height:180px;margin: 0 auto;}
	
	.result_gallery.result_product .result_gallery_img .bookmark{display:inline-block;}
	
	.filter_bar{display: none;}
	.filter_bar.mobile_web{display: block;}
	.filter_bar.mobile_web{width: 70%;}
	.filter_bar.mobile_web .block{width: 100%;}
	.filter_bar.mobile_web option{background: #f0f0f0;}
	.filter_bar.mobile_web option ul{display: block;width: 100%;}
	.filter_bar.mobile_web option ul li{display: block; width: 50%;}
}


@media (min-width:320px) and (max-width:960px) {
	.IsWeb .container.content {padding-top:30px;}
	.Search-tabNav.mobile_web{display: block;float: none;text-align:center;border:none;}
	.Search-tabNav{display: none;}
	.Search-tabNav{padding: 0;}
	.search_box{margin-top:10px;}
	form {width:90%;}
	.key_search{display: none;}
	
	.sort_menu{width:38%;}
	.sidebar_quickMenu {right:10px;top:200px;}
	.result_designer{display: block; margin: 0 auto;}
	.row_photo {width:180px; height:180px;margin: 0 auto;margin-bottom: 10px;}
	.result_row{display:block;}
	.result_row h2{display: block;}
	.result_info{width: 100%;text-align: center;}
	.btn_green{display: none;}
	.btn_green.mobile_web{display: block;margin: 0 auto;margin-top: 20px; width:25%;}
	.company .tag_hot_search , .search_results_filter{display: none;}
	.over_the_years_project .tag_hot_search.mobile_web{ display:block;}
	.over_the_years_project>div{width: 100%;margin-top:20px;}
	.over_the_years_project>div:nth-child(n+2) , .ad_row:nth-child(n+2){display: none;}
	.result_row{margin-bottom:100px ;}
	.ad_board{display: block;}
	.ad_row{width: 100%;}
	.btn_preview {display: block;text-align: center;}
	.btn_preview a {display: inline-block;}
	
	.result_article_img{width:100%;}
	.result_article_content{width: 100%;}
	.result_gallery{width: 100%;margin-bottom:50px;}
    .result_gallery.result_product{width: 100%;}
	.article_info{position: relative;margin-top:20px;}
	
}

@media (min-width:320px) and (max-width:640px) {
	.filter_wrapper{display:block;}
	form {width:85%;}
	.btn_green.mobile_web{ width:35%;}
	.sort_menu{justify-content: flex-end;width: 100%;margin-top: 20px;}
	.sort_menu .block{width:20%;}
	.total_search{margin-right: 15px;}
}

@media (min-width:320px) and (max-width:480px) {
	form {width:82%;}
	.third_nav li{width:32.7%;}
	.sort_menu .block{width:30%;}
	.ad_board{padding: 20px;}
	.result_gallery_tag{display: none;}
	.bookmark{display: block;position: relative; float: right;margin-top:10px;}	
	.result_article_content .bookmark{position:relative; bottom:0px;}
	.result_video .bookmark{margin-top:10px;}
	.Search-tabNav li a{padding: 5px 12px;}

}

@media (min-width:320px) and (max-width:414px) {
	.btn_green.mobile_web{ width:50%;}
	.third_nav li{width:49.3%;}
	form {width:78%;}
	.sort_menu .block{width:35%;}
	.filter_bar.mobile_web{width: 100%;}

}



@media (min-width:320px) and (max-width:360px) {	
	.third_nav li{width:100%;}
	form {width:76%;}
	.sort_menu .block{width:40%;}
	.play{width:90px; height:90px;line-height:85px;}
}

@media (min-width:320px) and (max-width:320px) {
	.Search-tabNav li a{padding: 5px 8px;}	
	form {width:72%;}
/*	.result_gallery .result_gallery_tag{display: none;}*/
	.article_info {display: inline-block;margin-top:10px;}
    .result_article_content .bookmark{ margin-left:0;}
}


.result_video .sh_icon.shi-play {
	border: 0;
	min-height: 100%;
	background-size: contain;
	width: 40px;
}
.result_video a:hover .sh_icon.shi-play {
	filter:invert(0);
}