index_designerList.html 122 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856
  1. <!DOCTYPE html>
  2. <html lang="zh_TW">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge, Chrome=1">
  7. <meta http-equiv="Cache-Control" content="no-cache">
  8. <meta name="copyright" content="2021 © 幸福空間 │ All Rights Reserved.">
  9. <meta name="creation-date" content="2021-08-05 12:00:04 GTM+8">
  10. <meta name="description" content="讓幸福室內設計,走進您的生活,解決您的裝潢問
  11. 題!幸福空間是台灣最大的室內設計、設計師與設計個案影音平台之一,找尋室內設計點子與案例我
  12. 們一定能幫助你!">
  13. <meta name="distribution" content="Taiwan">
  14. <meta name="keywords" content="">
  15. <meta name="revisit-after" content="1 days">
  16. <meta name="robots" content="all">
  17. <meta name="format-detection" content="telephone=no">
  18. <meta property="og:description" content="讓幸福室內設計,走進您的生活,解決您的裝潢問題!
  19. 幸福空間是台灣最大的室內設計、設計師與設計個案影音平台之一,找尋室內設計點子與案例我們一定能幫助
  20. 你!"/>
  21. <meta property="og:site_name" content="幸福空間"/>
  22. <meta property="og:title" content="幸福空間 - 台灣最大的室內設計、設計師與設計個案影音平台"/>
  23. <meta property="og:type" content="website"/>
  24. <meta property="og:locale" content="zh_TW">
  25. <title>幸福空間 - 室內設計、裝潢、居家生活、影音平台</title>
  26. <link rel="icon" href="images/favicon.ico">
  27. <link rel="stylesheet" href="css/reset.css">
  28. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
  29. crossorigin="anonymous">
  30. <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css"
  31. rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
  32. crossorigin="anonymous">
  33. <!-- <link rel="stylesheet" href="css/jquery-ui.css"> -->
  34. <link rel="stylesheet" type="text/css" href="css/slick.css" />
  35. <link rel="stylesheet" type="text/css" href="css/slick-theme.css" />
  36. <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  37. <link rel="stylesheet" href="css/list-style.css">
  38. <script>
  39. !function (f, b, e, v, n, t, s) {
  40. if (f.fbq) return;
  41. n = f.fbq = function () {
  42. n.callMethod ?
  43. n.callMethod.apply(n, arguments) : n.queue.push(arguments)
  44. };
  45. if (!f._fbq) f._fbq = n;
  46. n.push = n;
  47. n.loaded = !0;
  48. n.version = '2.0';
  49. n.queue = [];
  50. t = b.createElement(e);
  51. t.async = !0;
  52. t.src = v;
  53. s = b.getElementsByTagName(e)[0];
  54. s.parentNode.insertBefore(t, s)
  55. }(window, document, 'script',
  56. 'https://connect.facebook.net/en_US/fbevents.js');
  57. fbq('init', '585285442299590');
  58. fbq('track', 'PageView');
  59. </script>
  60. </head>
  61. <body>
  62. <div style="overflow-x:hidden;">
  63. <section class="sec-00 w-100">
  64. <button class="text-center sec-00__close">
  65. <i class="fas fa-chevron-up" style="transform:translateY(-2px);"></i>
  66. <p>隱藏</p>
  67. </button>
  68. <div class="container-fluid" style="padding:0;margin:0;position: relative;">
  69. <div class="sec-00__slider">
  70. </div>
  71. <div class="sec-00__bulletList">
  72. <div class="sec-00__bullet"></div>
  73. <div class="sec-00__bullet"></div>
  74. <div class="sec-00__bullet"></div>
  75. <div class="sec-00__bullet"></div>
  76. <div class="sec-00__bullet"></div>
  77. <div class="sec-00__bullet"></div>
  78. <div class="sec-00__bullet"></div>
  79. <div class="sec-00__bullet"></div>
  80. <div class="sec-00__bullet"></div>
  81. <div class="sec-00__bullet"></div>
  82. <div class="sec-00__bullet"></div>
  83. </div>
  84. </div>
  85. </section>
  86. <nav class="navbar navbar-expand-lg navbar-light navbar-main">
  87. <div class="container-fluid" style="margin:0;">
  88. <a href="https://hhh.com.tw/" class="navbar-brand navbar-logo"><img src="https://m.hhh.com.tw/_nuxt/img/def1b0a.svg" alt="" width="110"></a>
  89. <div class="collapse navbar-collapse" id="navbarSupportedContent">
  90. <ul class="navbar-nav mx-auto mb-2 mb-lg-0">
  91. <li class="nav-item">
  92. <a class="nav-link" style="color: #ee7800;" target="_blank" href="https://m.hhh.com.tw/about/calculator/">估預算</a>
  93. </li>
  94. <li class="nav-item">
  95. <a class="nav-link" style="color: #ee7800;" href="https://m.hhh.com.tw/photos/index/">找風格</a>
  96. <div class="dropbox">
  97. <div class="container stylebox" style="max-width: 650px;">
  98. <div class="row g-0 px-5">
  99. <div class="col-5">
  100. <ul class="mx-auto mb-lg-0">
  101. <li class="dropbox-item mb-3">
  102. <a class="dropbox-link dropbox-btn" target="_blank" href="https://m.hhh.com.tw/about/calculator/">估預算</a>
  103. </li>
  104. <li class="dropbox-item mb-0">
  105. <a class="dropbox-link dropbox-btn" target="_blank" href="https://hhh.com.tw/about/request/">找諮詢</a>
  106. </li>
  107. </ul>
  108. </div>
  109. <div class="col">
  110. <ul class="mx-auto mb-2 mb-lg-0">
  111. <li class="dropbox-item">
  112. <a class="dropbox-link" href="https://m.hhh.com.tw/photos/lists/nordic-style/" >北歐風</a>
  113. </li>
  114. <li class="dropbox-item">
  115. <a class="dropbox-link" href="https://m.hhh.com.tw/photos/lists/modern-style/">現代風</a>
  116. </li>
  117. <li class="dropbox-item">
  118. <a class="dropbox-link"href="https://m.hhh.com.tw/photos/lists/industry-style/">工業風</a>
  119. </li>
  120. </ul>
  121. </div>
  122. <div class="col">
  123. <ul class="mx-auto mb-2 mb-lg-0">
  124. <li class="dropbox-item">
  125. <a class="dropbox-link" href="https://m.hhh.com.tw/cases/lists/small-ctype/">小坪數</a>
  126. </li>
  127. <li class="dropbox-item">
  128. <a class="dropbox-link" href="https://m.hhh.com.tw/search/lists/case/%E9%A2%A8%E6%B0%B4-keyword/">風水</a>
  129. </li>
  130. </ul>
  131. </div>
  132. <div class="col">
  133. <ul class="mx-auto mb-2 mb-lg-0">
  134. <li class="dropbox-item">
  135. <a class="dropbox-link" href="https://hhh.com.tw/search/lists/video/%E8%8E%8E%E8%8E%8E-keyword/">莎莎看房去</a>
  136. </li>
  137. <li class="dropbox-item">
  138. <a class="dropbox-link" href="https://hhh.com.tw/topic/detail/402/">小坪數大空間</a>
  139. </li>
  140. <li class="dropbox-item">
  141. <a class="dropbox-link" href="https://hhh.com.tw/videos/lists/">發燒影音</a>
  142. </li>
  143. <li class="dropbox-item">
  144. <a class="dropbox-link" href="">居家防疫動起來</a>
  145. </li>
  146. </ul>
  147. </div>
  148. </div>
  149. </div>
  150. </div>
  151. </li>
  152. <li class="nav-item">
  153. <a class="nav-link" href="https://m.hhh.com.tw/columns/lists/all-columntypea/">專欄文章</a>
  154. <div class="dropbox">
  155. <div class="container">
  156. <div class="row g-0">
  157. <div class="col">
  158. <ul class="mx-auto mb-lg-0">
  159. <li class="dropbox-item first">
  160. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/">編輯精選</a>
  161. </li>
  162. <li class="dropbox-item">
  163. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/hometrends-columntypeb/">居家趨勢</a>
  164. </li>
  165. <li class="dropbox-item">
  166. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/hotrank-columntypeb/">人氣排行</a>
  167. </li>
  168. <li class="dropbox-item">
  169. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/archdesign-columntypeb/">建築設計</a>
  170. </li>
  171. <li class="dropbox-item">
  172. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/styleselection-columntypeb/">風格選店</a>
  173. </li>
  174. <li class="dropbox-item">
  175. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/charitable-columntypeb/">公益活動</a>
  176. </li>
  177. <li class="dropbox-item">
  178. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/editorchoose-columntypea/exhibition-columntypeb/">展演資訊</a>
  179. </li>
  180. </ul>
  181. </div>
  182. <div class="col">
  183. <ul class="mx-auto mb-2 mb-lg-0">
  184. <li class="dropbox-item first">
  185. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/">居家設計</a>
  186. </li>
  187. <li class="dropbox-item">
  188. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/smallhouse-columntypeb/">小宅規劃</a>
  189. </li>
  190. <li class="dropbox-item">
  191. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/oldhouse-columntypeb/">老屋翻新</a>
  192. </li>
  193. <li class="dropbox-item">
  194. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/stylebuild-columntypeb/">風格營造</a>
  195. </li>
  196. <li class="dropbox-item">
  197. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/color-columntypeb/">配色佈置</a>
  198. </li>
  199. <li class="dropbox-item">
  200. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/goodhouse-columntypeb/">好宅特輯</a>
  201. </li>
  202. <li class="dropbox-item">
  203. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/housedesign-columntypea/proposal-columntypeb/">設計提案</a>
  204. </li>
  205. </ul>
  206. </div>
  207. <div class="col">
  208. <ul class="mx-auto mb-2 mb-lg-0">
  209. <li class="dropbox-item first">
  210. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/decoration-columntypea/">裝修前線</a>
  211. </li>
  212. <li class="dropbox-item">
  213. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/decoration-columntypea/news-columntypeb/">裝修最前線</a>
  214. </li>
  215. <li class="dropbox-item">
  216. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/decoration-columntypea/allocation-columntypeb/">預算配置</a>
  217. </li>
  218. <li class="dropbox-item">
  219. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/decoration-columntypea/process-columntypeb/">施工流程</a>
  220. </li>
  221. <li class="dropbox-item">
  222. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/decoration-columntypea/knowledge-columntypeb/">建材知識</a>
  223. </li>
  224. </ul>
  225. </div>
  226. <div class="col">
  227. <ul class="mx-auto mb-2 mb-lg-0">
  228. <li class="dropbox-item first">
  229. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/plus-columntypea/">生活PLUS</a>
  230. </li>
  231. <li class="dropbox-item">
  232. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/plus-columntypea/fengshui-columntypeb/">居家風水</a>
  233. </li>
  234. <li class="dropbox-item">
  235. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/plus-columntypea/housekeeping-columntypeb/">家事清潔</a>
  236. </li>
  237. <li class="dropbox-item">
  238. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/plus-columntypea/storageskills-columntypeb/">收納技巧</a>
  239. </li>
  240. <li class="dropbox-item">
  241. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/plus-columntypea/renovation-columntypeb/">改造修繕</a>
  242. </li>
  243. </ul>
  244. </div>
  245. <div class="col">
  246. <ul class="mx-auto mb-2 mb-lg-0">
  247. <li class="dropbox-item first">
  248. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/gooditem-columntypea/">品牌好物</a>
  249. </li>
  250. <li class="dropbox-item">
  251. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/gooditem-columntypea/furnishings-columntypeb/">傢俱家飾</a>
  252. </li>
  253. <li class="dropbox-item">
  254. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/gooditem-columntypea/appliances-columntypeb/">美型家電</a>
  255. </li>
  256. <li class="dropbox-item">
  257. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/gooditem-columntypea/recommend-columntypeb/">推薦廚衛</a>
  258. </li>
  259. <li class="dropbox-item">
  260. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/gooditem-columntypea/homegoods-columntypeb/">居家好物</a>
  261. </li>
  262. <li class="dropbox-item">
  263. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/gooditem-columntypea/quality-columntypeb/">優質建材</a>
  264. </li>
  265. </ul>
  266. </div>
  267. <div class="col">
  268. <ul class="mx-auto mb-2 mb-lg-0">
  269. <li class="dropbox-item first">
  270. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/focus-columntypea/">房市焦點</a>
  271. </li>
  272. <li class="dropbox-item">
  273. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/focus-columntypea/housingnews-columntypeb/">房市新聞</a>
  274. </li>
  275. <li class="dropbox-item">
  276. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/focus-columntypea/specsearch-columntypeb/">建案特蒐</a>
  277. </li>
  278. <li class="dropbox-item">
  279. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/focus-columntypea/buyandsell-columntypeb/">買屋賣屋</a>
  280. </li>
  281. <li class="dropbox-item">
  282. <a class="dropbox-link" href="https://m.hhh.com.tw/columns/lists/focus-columntypea/mortgage-columntypeb/">房貸稅務</a>
  283. </li>
  284. </ul>
  285. </div>
  286. <div class="col">
  287. <ul class="mx-auto mb-2 mb-lg-0">
  288. <li class="dropbox-item first">
  289. <a class="dropbox-link" href="https://m.hhh.com.tw/topic/lists/1-page/new-sort/">主題企劃</a>
  290. </li>
  291. </ul>
  292. </div>
  293. </div>
  294. </div>
  295. </div>
  296. </li>
  297. <li class="nav-item">
  298. <a class="nav-link" target="_blank" href="https://m.hhh.com.tw/designers/lists/">設計師</a>
  299. <div class="dropbox">
  300. <div class="container designerbox" style="max-width: 680px;">
  301. <div class="row g-0 px-5">
  302. <div class="col-5">
  303. <ul class="mx-auto mb-lg-0">
  304. <li class="dropbox-item mb-4">
  305. <!-- <a class="dropbox-link dropbox-btn" target="_blank" href="https://m.hhh.com.tw/decoquery/lists/address/">查證照</a> -->
  306. </li>
  307. </ul>
  308. </div>
  309. <div class="col">
  310. <ul class="mx-auto mb-2 mb-lg-0">
  311. <li class="dropbox-item first">
  312. <a class="dropbox-link" href="https://m.hhh.com.tw/designers/lists/">室內設計師</a>
  313. </li>
  314. </ul>
  315. </div>
  316. <div class="col">
  317. <ul class="mx-auto mb-2 mb-lg-0">
  318. <li class="dropbox-item first">
  319. <a class="dropbox-link" target="_blank" href="https://event.hhh.com.tw/2021-Most-Favorite-Designers/index.php">觀眾最愛設計師</a>
  320. </li>
  321. <li class="dropbox-item first">
  322. <a class="dropbox-link" target="_blank" href="https://event.hhh.com.tw/topglory/">GLORY 國際大賞</a>
  323. </li>
  324. <li class="dropbox-item first">
  325. <a class="dropbox-link" target="_blank" href="https://hhh.com.tw/event170427/">老屋翻新居家改造</a>
  326. </li>
  327. </ul>
  328. </div>
  329. </div>
  330. </div>
  331. </div>
  332. </li>
  333. <li class="nav-item lg">
  334. <a class="nav-link" target="_blank" href="https://m.hhh.com.tw/products/lists/">居家商品</a>
  335. <div class="dropbox">
  336. <div class="container">
  337. <div class="row g-0">
  338. <div class="col-2">
  339. <ul class="mx-auto mb-lg-0">
  340. <li class="dropbox-item mb-4">
  341. <a class="dropbox-link dropbox-btn" target="_blank" href="https://shop.hhh.com.tw/"><img src="images/menu/cart.svg" width="15" alt=""><p>+好物</p></a>
  342. </li>
  343. </ul>
  344. </div>
  345. <div class="col">
  346. <ul class="mx-auto mb-3">
  347. <li class="dropbox-item first">
  348. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/1-page/new-sort/">建材</a>
  349. </li>
  350. <li class="dropbox-item">
  351. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/wooden-pcategoryb/1-page/new-sort/">木地板</a>
  352. </li>
  353. <li class="dropbox-item">
  354. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/sheetmetal-pcategoryb/1-page/new-sort/">板材</a>
  355. </li>
  356. <li class="dropbox-item">
  357. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/tile-pcategoryb/1-page/new-sort/">磁磚</a>
  358. </li>
  359. <li class="dropbox-item">
  360. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/stone-pcategoryb/1-page/new-sort/">石材</a>
  361. </li>
  362. <li class="dropbox-item">
  363. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/cement-pcategoryb/1-page/new-sort/">水泥</a>
  364. </li>
  365. <li class="dropbox-item">
  366. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/glass-pcategoryb/1-page/new-sort/">玻璃、隔熱膜</a>
  367. </li>
  368. <li class="dropbox-item">
  369. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/wallcovering-pcategoryb/1-page/new-sort/">壁紙、壁布</a>
  370. </li>
  371. <li class="dropbox-item">
  372. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/building-pcategorya/doorswindows-pcategoryb/1-page/new-sort/">門窗</a>
  373. </li>
  374. </ul>
  375. <ul class="mx-auto">
  376. <li class="dropbox-item first">
  377. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/coating-pcategorya/1-page/new-sort/">塗料</a>
  378. </li>
  379. <li class="dropbox-item">
  380. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/coating-pcategorya/paint-pcategoryb/1-page/new-sort/">油漆</a>
  381. </li>
  382. <li class="dropbox-item">
  383. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/coating-pcategorya/coatings-pcategoryb/1-page/new-sort/">塗料</a>
  384. </li>
  385. </ul>
  386. </div>
  387. <div class="col">
  388. <ul class="mx-auto mb-3">
  389. <li class="dropbox-item first">
  390. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/furniture-pcategorya/1-page/new-sort/">傢俱</a>
  391. </li>
  392. <li class="dropbox-item">
  393. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/furniture-pcategorya/living-pcategoryb/1-page/new-sort/">客廳</a>
  394. </li>
  395. <li class="dropbox-item">
  396. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/furniture-pcategorya/bedroom-pcategoryb/1-page/new-sort/">臥室</a>
  397. </li>
  398. <li class="dropbox-item">
  399. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/furniture-pcategorya/restaurant-pcategoryb/1-page/new-sort/">餐廳</a>
  400. </li>
  401. <li class="dropbox-item">
  402. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/furniture-pcategorya/study-pcategoryb/1-page/new-sort/">書房/辦公室</a>
  403. </li>
  404. <li class="dropbox-item">
  405. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/furniture-pcategorya/storage-pcategoryb/1-page/new-sort/">收納</a>
  406. </li>
  407. </ul>
  408. <ul class="mx-auto">
  409. <li class="dropbox-item first">
  410. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/home-pcategorya/1-page/new-sort/">寢具裝飾</a>
  411. </li>
  412. <li class="dropbox-item">
  413. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/home-pcategorya/bedding-pcategoryb/1-page/new-sort/">寢飾</a>
  414. </li>
  415. <li class="dropbox-item">
  416. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/home-pcategorya/curtains-pcategoryb/1-page/new-sort/">窗簾、葉窗</a>
  417. </li>
  418. <li class="dropbox-item">
  419. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/home-pcategorya/carpet-pcategoryb/1-page/new-sort/">地毯、地墊</a>
  420. </li>
  421. <li class="dropbox-item">
  422. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/home-pcategorya/artdecoration-pcategoryb/1-page/new-sort/">藝術、擺飾</a>
  423. </li>
  424. <li class="dropbox-item">
  425. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/home-pcategorya/mirror-pcategoryb/1-page/new-sort/">鏡子</a>
  426. </li>
  427. </ul>
  428. </div>
  429. <div class="col">
  430. <ul class="mx-auto">
  431. <li class="dropbox-item first">
  432. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/1-page/new-sort/">家電</a>
  433. </li>
  434. <li class="dropbox-item">
  435. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/refrigerator-pcategoryb/1-page/new-sort/">冰箱</a>
  436. </li>
  437. <li class="dropbox-item">
  438. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/airconditioning-pcategoryb/1-page/new-sort/">冷氣、空調</a>
  439. </li>
  440. <li class="dropbox-item">
  441. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/tv-pcategoryb/1-page/new-sort/">電視</a>
  442. </li>
  443. <li class="dropbox-item">
  444. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/projector-pcategoryb/1-page/new-sort/">投影機</a>
  445. </li>
  446. <li class="dropbox-item">
  447. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/sound-pcategoryb/1-page/new-sort/">音響</a>
  448. </li>
  449. <li class="dropbox-item">
  450. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/aircleaner-pcategoryb/1-page/new-sort/">空氣清淨機</a>
  451. </li>
  452. <li class="dropbox-item">
  453. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/vacuumcleaner-pcategoryb/1-page/new-sort/">吸塵器</a>
  454. </li>
  455. <li class="dropbox-item">
  456. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/efan-pcategoryb/1-page/new-sort/">電風扇</a>
  457. </li>
  458. <li class="dropbox-item">
  459. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/eheater-pcategoryb/1-page/new-sort/">電暖器機</a>
  460. </li>
  461. <li class="dropbox-item">
  462. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/dehumidifier-pcategoryb/1-page/new-sort/">除濕機</a>
  463. </li>
  464. <li class="dropbox-item">
  465. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/massage-pcategoryb/1-page/new-sort/">按摩家電</a>
  466. </li>
  467. <li class="dropbox-item">
  468. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/household-pcategorya/coffee-pcategoryb/1-page/new-sort/">咖啡機</a>
  469. </li>
  470. </ul>
  471. </div>
  472. <div class="col">
  473. <ul class="mx-auto">
  474. <li class="dropbox-item first">
  475. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/1-page/new-sort/">廚房</a>
  476. </li>
  477. <li class="dropbox-item">
  478. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/electromagnetic-pcategoryb/1-page/new-sort/">電磁、電子爐</a>
  479. </li>
  480. <li class="dropbox-item">
  481. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/dryingmachine-pcategoryb/1-page/new-sort/">洗、烘碗機</a>
  482. </li>
  483. <li class="dropbox-item">
  484. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/ventilator-pcategoryb/1-page/new-sort/">排油煙機</a>
  485. </li>
  486. <li class="dropbox-item">
  487. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/steamoven-pcategoryb/1-page/new-sort/">烤箱、蒸爐</a>
  488. </li>
  489. <li class="dropbox-item">
  490. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/kithardware-pcategoryb/1-page/new-sort/">廚房五金</a>
  491. </li>
  492. <li class="dropbox-item">
  493. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/kitchen-pcategorya/potsandutensils-pcategoryb/1-page/new-sort/">鍋具、器皿</a>
  494. </li>
  495. </ul>
  496. </div>
  497. <div class="col">
  498. <ul class="mx-auto">
  499. <li class="dropbox-item first">
  500. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/1-page/new-sort/">衛浴</a>
  501. </li>
  502. <li class="dropbox-item">
  503. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/bathtub-pcategoryb/1-page/new-sort/">浴缸</a>
  504. </li>
  505. <li class="dropbox-item">
  506. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/waterheater-pcategoryb/1-page/new-sort/">電熱水器</a>
  507. </li>
  508. <li class="dropbox-item">
  509. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/bathaircondition-pcategoryb/1-page/new-sort/">浴室空調</a>
  510. </li>
  511. <li class="dropbox-item">
  512. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/bathfittings-pcategoryb/1-page/new-sort/">衛浴五金</a>
  513. </li>
  514. <li class="dropbox-item">
  515. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/showerdoor-pcategoryb/1-page/new-sort/">淋浴拉門</a>
  516. </li>
  517. <li class="dropbox-item">
  518. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/bathroom-pcategorya/bathm-pcategoryb/1-page/new-sort/">衛浴設備</a>
  519. </li>
  520. </ul>
  521. </div>
  522. <div class="col">
  523. <ul class="mx-auto">
  524. <li class="dropbox-item first">
  525. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/1-page/new-sort/" >照明</a>
  526. </li>
  527. <li class="dropbox-item">
  528. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/ceiling-pcategoryb/1-page/new-sort/">吸頂燈</a>
  529. </li>
  530. <li class="dropbox-item">
  531. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/spotlight-pcategoryb/1-page/new-sort/">投射燈</a>
  532. </li>
  533. <li class="dropbox-item">
  534. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/chandelier-pcategoryb/1-page/new-sort/">吊燈</a>
  535. </li>
  536. <li class="dropbox-item">
  537. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/walllamp-pcategoryb/1-page/new-sort/">壁燈</a>
  538. </li>
  539. <li class="dropbox-item">
  540. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/tablelamp-pcategoryb/1-page/new-sort/">檯燈</a>
  541. </li>
  542. <li class="dropbox-item">
  543. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/standing-pcategoryb/1-page/new-sort/">立燈</a>
  544. </li>
  545. <li class="dropbox-item">
  546. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/recessed-pcategoryb/1-page/new-sort/">嵌燈</a>
  547. </li>
  548. <li class="dropbox-item">
  549. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/lighting-pcategorya/lightbulbs-pcategoryb/1-page/new-sort/">燈泡、燈具</a>
  550. </li>
  551. </ul>
  552. </div>
  553. <div class="col">
  554. <ul class="mx-auto">
  555. <li class="dropbox-item first">
  556. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/1-page/new-sort/">其他</a>
  557. </li>
  558. <li class="dropbox-item">
  559. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/fire-pcategoryb/1-page/new-sort/">消防設備</a>
  560. </li>
  561. <li class="dropbox-item">
  562. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/smartdevice-pcategoryb/1-page/new-sort/">智能設備</a>
  563. </li>
  564. <li class="dropbox-item">
  565. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/lifegroceries-pcategoryb/1-page/new-sort/">生活雜貨</a>
  566. </li>
  567. <li class="dropbox-item">
  568. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/cleaningsupplies-pcategoryb/1-page/new-sort/">清潔用品</a>
  569. </li>
  570. <li class="dropbox-item">
  571. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/photography-pcategoryb/1-page/new-sort/">攝影</a>
  572. </li>
  573. <li class="dropbox-item">
  574. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/other-pcategorya/otherservice-pcategoryb/1-page/new-sort/">其他服務</a>
  575. </li>
  576. </ul>
  577. </div>
  578. <div class="col-2">
  579. <ul class="mx-auto mb-2 mb-lg-0">
  580. <li class="dropbox-item first">
  581. <a class="dropbox-link" target="_blank" href="https://event.hhh.com.tw/2020-Top-Brands/">消費者最愛品牌</a>
  582. </li>
  583. <li class="dropbox-item first">
  584. <a class="dropbox-link" href="https://hhh.com.tw/products/lists/1-page/new-sort/">所有商品</a>
  585. </li>
  586. <li class="dropbox-item first">
  587. <a class="dropbox-link" href="https://hhh.com.tw/brands/lists/">所有品牌</a>
  588. </li>
  589. </ul>
  590. </div>
  591. </div>
  592. </div>
  593. </div>
  594. </li>
  595. <li class="nav-item">
  596. <a class="nav-link" target="_blank" href="https://m.hhh.com.tw/builder/lists/">新建案</a>
  597. <div class="dropbox">
  598. <div class="container newbox" style="max-width: 650px;">
  599. <div class="row g-0 px-5">
  600. <div class="col-6">
  601. <ul class="mx-auto mb-lg-0">
  602. <li class="dropbox-item mb-4">
  603. <a class="dropbox-link dropbox-btn" target="_blank" href="https://www.leju.com.tw/page_search_result">實價登錄</a>
  604. </li>
  605. </ul>
  606. </div>
  607. <div class="col-3">
  608. <ul class="mx-auto mb-2 mb-lg-0">
  609. <li class="dropbox-item first">
  610. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/1-page/">依地區</a>
  611. </li>
  612. <li class="dropbox-item">
  613. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/100-citys/1-page/">臺北市</a>
  614. </li>
  615. <li class="dropbox-item">
  616. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/101-citys/1-page/">新北市</a>
  617. </li>
  618. <li class="dropbox-item">
  619. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/103-citys/1-page/">桃園市</a>
  620. </li>
  621. <li class="dropbox-item">
  622. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/104-citys/1-page/">新竹縣</a>
  623. </li>
  624. <li class="dropbox-item">
  625. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/105-citys/1-page/">新竹市</a>
  626. </li>
  627. <li class="dropbox-item">
  628. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/107-citys/1-page/">臺中市</a>
  629. </li>
  630. </ul>
  631. </div>
  632. <div class="col-3">
  633. <ul class="mx-auto mb-2 mb-lg-0">
  634. <li class="dropbox-item first">
  635. <a class="dropbox-link" href="https://m.hhh.com.tw/cases/lists/small-ctype/">新建案</a>
  636. </li>
  637. <li class="dropbox-item">
  638. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/mrt-types/1-page/">捷運宅</a>
  639. </li>
  640. <li class="dropbox-item">
  641. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/function-types/1-page/">機能宅</a>
  642. </li>
  643. <li class="dropbox-item">
  644. <a class="dropbox-link" href="https://hhh.com.tw/builder/lists/king-types/1-page/">帝王宅</a>
  645. </li>
  646. </ul>
  647. </div>
  648. </div>
  649. </div>
  650. </div>
  651. </li>
  652. <li class="nav-item">
  653. <a class="nav-link" target="_blank" href="https://m.hhh.com.tw/forum/category/">討論區</a>
  654. <div class="dropbox">
  655. <div class="container forumbox" style="max-width: 450px;">
  656. <div class="row g-0 px-5">
  657. <div class="col-6">
  658. <ul class="mx-auto mb-2 mb-lg-0">
  659. <li class="dropbox-item">
  660. <a class="dropbox-link" href="https://hhh.com.tw/forum/lists?category=1" target="_blank">居家綜合</a>
  661. </li>
  662. <li class="dropbox-item">
  663. <a class="dropbox-link" target="_blank" href="https://hhh.com.tw/forum/lists?category=2">室內設計與佈置</a>
  664. </li>
  665. <li class="dropbox-item">
  666. <a class="dropbox-link" target="_blank" href="https://hhh.com.tw/forum/lists?category=3">房屋修繕</a>
  667. </li>
  668. </ul>
  669. </div>
  670. <div class="col-6">
  671. <ul class="mx-auto mb-2 mb-lg-0">
  672. <li class="dropbox-item">
  673. <a class="dropbox-link" target="_blank" href="https://hhh.com.tw/forum/lists?category=4">房產房產經驗宅</a>
  674. </li>
  675. <li class="dropbox-item">
  676. <a class="dropbox-link" target="_blank" href="https://hhh.com.tw/forum/lists?category=5">家店開箱與討論</a>
  677. </li>
  678. </ul>
  679. </div>
  680. </div>
  681. </div>
  682. </div>
  683. </li>
  684. <li class="nav-item">
  685. <a class="nav-link" onclick="todayTV();">TV節目表</a>
  686. </li>
  687. </ul>
  688. </div>
  689. <div class="navbar-brand navbar-search me-2 d-flex align-items-center">
  690. <img width="25" class="navbar-search-magnify" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMC4wMDMiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMC4wMDMgMjAiPgogIDxnIGlkPSJzZWFyY2giIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0wLjA1KSI+CiAgICA8cGF0aCBpZD0iUGF0aF8yMjcyIiBkYXRhLW5hbWU9IlBhdGggMjI3MiIgZD0iTTE5Ljg4LDE4Ljk4bC00Ljg2Mi00Ljg2YTguNTM5LDguNTM5LDAsMSwwLS44NDMuODQzbDQuODYyLDQuODZhLjYuNiwwLDAsMCwuNDIxLjE3Ny41ODQuNTg0LDAsMCwwLC40MjEtLjE3N0EuNi42LDAsMCwwLDE5Ljg4LDE4Ljk4Wk0xLjI0Myw4LjUyOGE3LjMzMyw3LjMzMywwLDEsMSw3LjMzMyw3LjMzNUE3LjM0LDcuMzQsMCwwLDEsMS4yNDMsOC41MjhaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwKSIgZmlsbD0iI2VlNzgwMCIvPgogIDwvZz4KPC9zdmc+Cg==" alt="">
  691. <div class="dropbox">
  692. <div class="container">
  693. <div class="w-100 text-center dropbox__searchBar mb-3">
  694. <input type="text" class="dropbox__searchBar__input" placeholder="請輸入關鍵字">
  695. <button class="dropbox__searchBar__submit">搜尋</button>
  696. </div>
  697. <div class="dropbox__searchtab">
  698. <div class="dropbox__tab dropbox__tabdiv">
  699. <ul class="nav row nav-pills gx-2 justify-content-around">
  700. <li class="nav-item col text-center">
  701. <button class="nav-item-link bg-transparent" id="pills-img-tab">圖片</button>
  702. </li>
  703. <li class="nav-item col text-center">
  704. <button class="nav-item-link bg-transparent" id="pills-article-tab">專欄文章</button>
  705. </li>
  706. <li class="nav-item col text-center">
  707. <button class="nav-item-link bg-transparent" id="pills-case-tab">設計案例</button>
  708. </li>
  709. <li class="nav-item col text-center">
  710. <button class="nav-item-link bg-transparent" id="pills-designer-tab">設計師</button>
  711. </li>
  712. <li class="nav-item col text-center">
  713. <button class="nav-item-link bg-transparent" id="pills-home-tab">居家商品</button>
  714. </li>
  715. <li class="nav-item col text-center">
  716. <button class="nav-item-link bg-transparent" id="pills-news-tab">新建案</button>
  717. </li>
  718. </ul>
  719. </div>
  720. <div class="tab-content dropbox-tab-content" id="pills-tab-2">
  721. <div class="" id="pills-img-tab">
  722. <div class="tabpar tabpar__1">
  723. <select name="image-style" id="image-style" class="col select">
  724. <option value="" selected="selected" disabled>風格</option>
  725. <option value="all-style">不拘</option>
  726. <option value="modern-style">現代風</option>
  727. <option value="nordic-style">北歐風</option>
  728. <option value="industry-style">工業風</option>
  729. <option value="american-style">美式風</option>
  730. <option value="leisure-style">休閒多元風</option>
  731. </select>
  732. <select name="image-space" id="image-space" class="col select">
  733. <option value="" selected="selected" disabled>空間</option>
  734. <option value="all-space">不拘</option>
  735. <option value="living-space">客廳</option>
  736. <option value="kitchen-space">廚房</option>
  737. <option value="children-space">兒童房</option>
  738. <option value="study-space">書房</option>
  739. <option value="restaurant-space">餐廳</option>
  740. </select>
  741. <select name="image-area" id="image-area" class="col select">
  742. <option value="" selected="selected" disabled>坪數</option>
  743. <option value="all-area">不拘</option>
  744. <option value="c20-area">20坪以下</option>
  745. <option value="c21-area">21-30坪</option>
  746. <option value="c31-area">31-50坪</option>
  747. <option value="c51-area">51坪以上</option>
  748. </select>
  749. <button class="col image-search">送出</button>
  750. </div>
  751. </div>
  752. <div class="" id="pills-article-tab">
  753. <div class="tabpar tabpar__2">
  754. <button class="col article-btn" onclick="window.open(`https://hhh.com.tw/columns/lists/editorchoose-columntypea/`);">編輯精選</button>
  755. <button class="col article-btn" onclick="window.open(`https://m.hhh.com.tw/columns/lists/housedesign-columntypea/`);">居家設計</button>
  756. <button class="col article-btn" onclick="window.open(`https://m.hhh.com.tw/columns/lists/decoration-columntypea/`);">裝修前線</button>
  757. </div>
  758. </div>
  759. <div class="" id="pills-case-tab">
  760. <div class="tabpar tabpar__3">
  761. <select name="cases-type" id="cases-type" class="col select">
  762. <option value="small-ctype">小坪數</option>
  763. <option value="all-ctype">不拘</option>
  764. <option value="standard-ctype">標準格局</option>
  765. <option value="big-ctype">大坪數</option>
  766. <option value="villa-ctype">別墅</option>
  767. <option value="raisehigh-ctype">挑高樓層</option>
  768. <option value="middle-ctype">樓中樓</option>
  769. <option value="sample-ctype">實品/樣品屋</option>
  770. <option value="workspace-ctype">工作空間</option>
  771. <option value="commercial-ctype">商業空間</option>
  772. <option value="homestay-ctype">民宿旅館</option>
  773. <option value="dining-ctype">餐飲空間</option>
  774. <option value="public-ctype">公共空間</option>
  775. </select>
  776. <select name="cases-condition" id="cases-condition" class="col select">
  777. <option value="renovation-condition">老屋翻新</option>
  778. <option value="all-condition">不拘</option>
  779. <option value="new-condition">新成屋</option>
  780. <option value="blanks-condition">毛胚屋</option>
  781. <option value="selfbuilt-condition">自地自建</option>
  782. </select>
  783. <select name="case-shui" id="case-shui" class="col select">
  784. <option value="" selected="selected" disabled>風水</option>
  785. <option value="風水">風水</option>
  786. </select>
  787. <button class="col case-search">送出</button>
  788. </div>
  789. </div>
  790. <div class="" id="pills-designer-tab">
  791. <div class="tabpar tabpar__4">
  792. <select name="designer-city" id="designer-city" class="col select">
  793. <option value="" selected="selected" disabled>所在縣市</option>
  794. </select>
  795. <select name="designer-country" id="designer-country" class="col select">
  796. <option value="" selected="selected" disabled>所在地區</option>
  797. </select>
  798. <select name="designer-region" id="designer-region" class="col select">
  799. <option value="坪數" selected="selected" disabled>接案地區</option>
  800. <option value="all-region">不拘</option>
  801. <option value="north-region">北區</option>
  802. <option value="central-region">中區</option>
  803. <option value="south-region">南區</option>
  804. <option value="east-region">宜蘭花東</option>
  805. <option value="outlying-region">離島地區</option>
  806. <option value="overseas-region">海外地區</option>
  807. </select>
  808. <button class="col designer-search">送出</button>
  809. </div>
  810. </div>
  811. <div class="" id="pills-home-tab">
  812. <div class="tabpar tabpar__5">
  813. <button class="col home-btn" onclick="window.open(`https://hhh.com.tw/products/lists/furniture-pcategorya/1-page/new-sort`);">傢俱</button>
  814. <button class="col home-btn" onclick="window.open(`https://hhh.com.tw/products/lists/household-pcategorya/1-page/new-sort/`);">家電</button>
  815. <button class="col home-btn" onclick="window.open(`https://hhh.com.tw/products/lists/building-pcategorya/1-page/new-sort/`);">建材</button>
  816. </div>
  817. </div>
  818. <div class="" id="pills-news-tab">
  819. <div class="tabpar tabpar__6">
  820. <select name="news-city" id="news-city" class="col select">
  821. <option value="風格" selected="selected" disabled>所在縣市</option>
  822. <option value="100-citys">台北市</option>
  823. <option value="101-citys">新北市</option>
  824. <option value="102-citys">基隆市</option>
  825. <option value="103-citys">桃園市</option>
  826. <option value="104-citys">新竹縣</option>
  827. <option value="105-citys">新竹市</option>
  828. <option value="107-citys">台中市</option>
  829. </select>
  830. <select name="news-types" id="news-types" class="col select">
  831. <option value="空間" selected="selected" disabled>類型</option>
  832. <option value="mrt-types">捷運宅</option>
  833. <option value="function-types">機能宅</option>
  834. <option value="king-types">帝王宅</option>
  835. </select>
  836. <button class="col news-search">送出</button>
  837. </div>
  838. </div>
  839. </div>
  840. </div>
  841. <div class="text-center dropbox__hots">
  842. <strong class="dropbox__hots__title">熱搜關鍵字:</strong>
  843. <a class="dropbox__hots__link">小坪數</a>
  844. <a class="dropbox__hots__link">收納</a>
  845. <a class="dropbox__hots__link">軟裝佈置</a>
  846. <a class="dropbox__hots__link">幸福經紀人</a>
  847. <a class="dropbox__hots__link">承炫設計</a>
  848. <a class="dropbox__hots__link">風水</a>
  849. <a class="dropbox__hots__link">北歐風</a>
  850. <a class="dropbox__hots__link">周石設計</a>
  851. </div>
  852. </div>
  853. </div>
  854. </div>
  855. <div class="navbar-brand navbar-login ms-2 d-flex align-items-center">
  856. <a href="https://hhh.com.tw/login/index" class="navbar-login">登入 / 註冊</a>
  857. </div>
  858. </div>
  859. </nav>
  860. <section class="w-100 hero">
  861. <div style="padding:0;margin:0;">
  862. <img class="img-fluid w-100 hero__img" src="" alt="">
  863. </div>
  864. </section>
  865. <section class="content">
  866. <div class="row justify-content-around">
  867. <div class="col-12 col-lg-4 col-xl-3">
  868. <div class="infoCard">
  869. <div class="infoCard__avatar mx-auto mb-3" >
  870. </div>
  871. <h2 class="infoCard__name"></h2>
  872. <span class="mb-3 d-inline-block">設計師</span>
  873. <h4 class="mb-3 infoCard__company"> <!--恆岳空間設計--></h4>
  874. <strong class="mb-3 infoCard__seo"></strong>
  875. <div class="infoCard__approve mb-3">
  876. <!--★老屋翻新‧住宅改造-->
  877. </div>
  878. <div class="infoCard__detail">
  879. <div class="infoCard__basics">
  880. <aside class="d-flex">
  881. <div class="infoCard__detail__l">
  882. <div>免費專線:</div>
  883. </div>
  884. <div class="infoCard__detail__r">
  885. <a href="tel:0809000123,19499" class="text-hhh">0809-000-123#18890</a>
  886. </div>
  887. </aside>
  888. <aside class="d-flex">
  889. <div class="infoCard__detail__l">
  890. <div>諮詢專線:</div>
  891. </div>
  892. <div class="infoCard__detail__r">
  893. <div>0809-000-123#18890</div>
  894. </div>
  895. </aside>
  896. <aside class="d-flex">
  897. <div class="infoCard__detail__l">
  898. <div>諮詢專線:</div>
  899. </div>
  900. <div class="infoCard__detail__r">
  901. <div>0937-070-794</div>
  902. </div>
  903. </aside>
  904. <aside class="d-flex">
  905. <div class="infoCard__detail__l">
  906. <div>公司傳真:</div>
  907. </div>
  908. <div class="infoCard__detail__r">
  909. <div>02-2562-7002</div>
  910. </div>
  911. </aside>
  912. <aside class="d-flex">
  913. <div class="infoCard__detail__l">
  914. <div>公司地址:</div>
  915. </div>
  916. <div class="infoCard__detail__r">
  917. <div>台北市中山區林森北路50號4樓之一</div>
  918. </div>
  919. </aside>
  920. <aside class="d-flex">
  921. <div class="infoCard__detail__l">
  922. <div>電子信箱:</div>
  923. </div>
  924. <div class="infoCard__detail__r">
  925. <div>hengyuehdesign@gmail.com,gakuju@gmail.com</div>
  926. </div>
  927. </aside>
  928. <aside class="d-flex">
  929. <div class="infoCard__detail__l">
  930. <div>公司網址:</div>
  931. </div>
  932. <div class="infoCard__detail__r">
  933. <div>
  934. http://www.hengyueh.com.tw/</div>
  935. </div>
  936. </aside>
  937. </div>
  938. <div class="infoCard__detail other">
  939. <div class="infoCard__branches">
  940. <aside class="d-flex">
  941. <div class="infoCard__detail__l">
  942. <div>分公司地址:</div>
  943. </div>
  944. <div class="infoCard__detail__r">
  945. <div>台北市中山區林森北路50號4樓之一</div>
  946. </div>
  947. </aside>
  948. <aside class="d-flex">
  949. <div class="infoCard__detail__l">
  950. <div>分公司電話:</div>
  951. </div>
  952. <div class="infoCard__detail__r">
  953. <div>02-2562-7755</div>
  954. </div>
  955. </aside>
  956. <aside class="d-flex">
  957. <div class="infoCard__detail__l">
  958. <div>分公司傳真:</div>
  959. </div>
  960. <div class="infoCard__detail__r">
  961. <div>02-2562-7002</div>
  962. </div>
  963. </aside>
  964. <aside class="d-flex">
  965. <div class="infoCard__detail__l">
  966. <div>分公司地址:</div>
  967. </div>
  968. <div class="infoCard__detail__r">
  969. <div>上海市闵行区东川路2688号</div>
  970. </div>
  971. </aside>
  972. </div>
  973. <aside class="d-flex">
  974. <div class="infoCard__detail__l title mt-5 mb-3">
  975. <div>接案條件</div>
  976. </div>
  977. <div class="infoCard__detail__r">
  978. <div></div>
  979. </div>
  980. </aside>
  981. <div class="infoCard__terms">
  982. <aside class="d-flex">
  983. <div class="infoCard__detail__l">
  984. <div>接案預算:</div>
  985. </div>
  986. <div class="infoCard__detail__r">
  987. <div>不限</div>
  988. </div>
  989. </aside>
  990. <aside class="d-flex">
  991. <div class="infoCard__detail__l">
  992. <div>接案坪數:</div>
  993. </div>
  994. <div class="infoCard__detail__r">
  995. <div>不限</div>
  996. </div>
  997. </aside>
  998. <aside class="d-flex">
  999. <div class="infoCard__detail__l">
  1000. <div>特殊接案:</div>
  1001. </div>
  1002. <div class="infoCard__detail__r">
  1003. <div>不限</div>
  1004. </div>
  1005. </aside>
  1006. <aside class="d-flex">
  1007. <div class="infoCard__detail__l">
  1008. <div>收費方式:</div>
  1009. </div>
  1010. <div class="infoCard__detail__r">
  1011. <div>請來電洽詢 / 【丈量費】NT$5,000元(透天別墅另計) *此費用含實地丈量、需求訪談、
  1012. 初步平面配置與風格提案 *以上費用於簽設計合約時,可全額折抵</div>
  1013. </div>
  1014. </aside>
  1015. <aside class="d-flex">
  1016. <div class="infoCard__detail__l">
  1017. <div>付費方式:</div>
  1018. </div>
  1019. <div class="infoCard__detail__r">
  1020. <div>簽約付30%、依工程進度分兩次,各付30%、完工驗收收10%</div>
  1021. </div>
  1022. </aside>
  1023. <aside class="d-flex">
  1024. <div class="infoCard__detail__l">
  1025. <div>付費方式:</div>
  1026. </div>
  1027. <div class="infoCard__detail__r">
  1028. <div>簽約付30%、依工程進度分兩次,各付30%、完工驗收收10%</div>
  1029. </div>
  1030. </aside>
  1031. <aside class="d-flex">
  1032. <div class="infoCard__detail__l">
  1033. <div>接案區域:</div>
  1034. </div>
  1035. <div class="infoCard__detail__r">
  1036. <div>北區,中區,南區,大陸</div>
  1037. </div>
  1038. </aside>
  1039. <aside class="d-flex">
  1040. <div class="infoCard__detail__l">
  1041. <div>接案類型:</div>
  1042. </div>
  1043. <div class="infoCard__detail__r">
  1044. <div>小坪數,標準格局,別墅,大坪數,樓中樓,商業空間,工作空間,餐飲空間,民宿旅館,公共空間</div>
  1045. </div>
  1046. </aside>
  1047. <aside class="d-flex">
  1048. <div class="infoCard__detail__l">
  1049. <div>接案風格:</div>
  1050. </div>
  1051. <div class="infoCard__detail__r">
  1052. <div>現代風,鄉村風,古典風,休閒多元,美式風,奢華風,新古典,日式禪風,東方風,混搭風,前衛風,北歐風,工業風,異國風</div>
  1053. </div>
  1054. </aside>
  1055. </div>
  1056. </div>
  1057. <section class="scMedia">
  1058. <a href="">
  1059. <img src="https://hhh.com.tw/assets/images/rv_web/fb.svg" alt="">
  1060. </a>
  1061. <a href="">
  1062. <img src="https://hhh.com.tw/assets/images/rv_web/line.svg" alt="">
  1063. </a>
  1064. <a href="">
  1065. <img src="https://hhh.com.tw/assets/images/rv_web/wechat.svg" alt="">
  1066. </a>
  1067. <a href="">
  1068. <img src="https://hhh.com.tw/assets/images/rv_web/share.svg" alt="">
  1069. </a>
  1070. <span>
  1071. <img src="https://hhh.com.tw/assets/images/rv_web/like-o.svg" class="dislike" alt="">
  1072. <img src="https://hhh.com.tw/assets/images/rv_web/like.svg" class="like" alt="">
  1073. </span>
  1074. </section>
  1075. </div>
  1076. </div>
  1077. </div>
  1078. <div class="col-12 col-lg-8 col-xl-9">
  1079. <div class="infoContent">
  1080. <div class="d-flex justify-content-between position-relative">
  1081. <ul class="nav d-flex nav-pills flex-wrap" id="pills-tab" role="tablist">
  1082. <!-- <li class="nav-item active p-0" role="presentation">
  1083. <a class="nav-item-link nav-item-active bg-transparent active" id="pills-intro-tab"
  1084. data-bs-toggle="pill" data-bs-target="#pills-intro" type="button" role="tab"
  1085. aria-controls="pills-intro" aria-selected="true" data-link="https://hhh.com.tw/cases/lists/">設計師作品</a>
  1086. </li>
  1087. <li class="nav-item p-0" role="presentation">
  1088. <a class="nav-item-link nav-item-active bg-transparent" id="pills-video-tab"
  1089. data-bs-toggle="pill" data-bs-target="#pills-video" type="button" role="tab"
  1090. aria-controls="pills-video" aria-selected="false" data-link="https://hhh.com.tw/videos/lists/">設計師影音</a>
  1091. </li>
  1092. <li class="nav-item p-0" role="presentation">
  1093. <a class="nav-item-link nav-item-active bg-transparent" id="pills-columns-tab"
  1094. data-bs-toggle="pill" data-bs-target="#pills-columns" type="button" role="tab"
  1095. aria-controls="pills-columns" aria-selected="false" data-link="https://hhh.com.tw/columns/lists/">設計師專欄</a>
  1096. </li>
  1097. <li class="nav-item p-0" role="presentation">
  1098. <a class="nav-item-link nav-item-active bg-transparent" id="pills-vr360-tab"
  1099. data-bs-toggle="pill" data-bs-target="#pills-vr360" type="button" role="tab"
  1100. aria-controls="pills-vr360" aria-selected="false" data-link="https://hhh.com.tw/columns/lists/">VR 360</a>
  1101. </li>
  1102. <li class="nav-item p-0" role="presentation">
  1103. <a class="nav-item-link nav-item-active bg-transparent" id="pills-company-tab"
  1104. data-bs-toggle="pill" data-bs-target="#pills-company" type="button" role="tab"
  1105. aria-controls="pills-company" aria-selected="false" data-link="https://hhh.com.tw/columns/lists/">設計師公司簡介</a>
  1106. </li> -->
  1107. </ul>
  1108. <div class="likeSee align-self-end" hidden>
  1109. <span class="likeSee__views">人氣</span>
  1110. <span class="likeSee__divider"></span>
  1111. <span class="likeSee__sort">最新</span>
  1112. </div>
  1113. <aside class="nav-collapse-fixed" id="nav-collapse">
  1114. <ul class="nav d-flex nav-collpase flex-wrap pill-aside scroll-nav-collapse" id="pills-tab" role="tablist">
  1115. <!-- <li class="nav-item active p-0" role="presentation">
  1116. <a class="nav-item-link nav-item-active bg-transparent active" id="pills-intro-tab"
  1117. data-bs-toggle="pill" data-bs-target="#pills-intro" type="button" role="tab"
  1118. aria-controls="pills-intro" aria-selected="true" data-link="https://hhh.com.tw/cases/lists/">設計師作品</a>
  1119. </li>
  1120. <li class="nav-item p-0" role="presentation">
  1121. <a class="nav-item-link nav-item-active bg-transparent" id="pills-video-tab"
  1122. data-bs-toggle="pill" data-bs-target="#pills-video" type="button" role="tab"
  1123. aria-controls="pills-video" aria-selected="false" data-link="https://hhh.com.tw/videos/lists/">設計師影音</a>
  1124. </li>
  1125. <li class="nav-item p-0" role="presentation">
  1126. <a class="nav-item-link nav-item-active bg-transparent" id="pills-columns-tab"
  1127. data-bs-toggle="pill" data-bs-target="#pills-columns" type="button" role="tab"
  1128. aria-controls="pills-columns" aria-selected="false" data-link="https://hhh.com.tw/columns/lists/">設計師專欄</a>
  1129. </li>
  1130. <li class="nav-item p-0" role="presentation">
  1131. <a class="nav-item-link nav-item-active bg-transparent" id="pills-vr360-tab"
  1132. data-bs-toggle="pill" data-bs-target="#pills-vr360" type="button" role="tab"
  1133. aria-controls="pills-columns" aria-selected="false" data-link="https://hhh.com.tw/columns/lists/">VR 360</a>
  1134. </li>
  1135. <li class="nav-item p-0" role="presentation">
  1136. <a class="nav-item-link nav-item-active bg-transparent" id="pills-company-tab"
  1137. data-bs-toggle="pill" data-bs-target="#pills-company" type="button" role="tab"
  1138. aria-controls="pills-company" aria-selected="false" data-link="https://hhh.com.tw/columns/lists/">設計師公司簡介</a>
  1139. </li> -->
  1140. </ul>
  1141. </aside>
  1142. </div>
  1143. <div class="tab-content mt-5" id="pills-tabContent">
  1144. <!-- <div class="tab-pane fade active show" id="pills-intro" role="tabpanel"
  1145. aria-labelledby="pills-intro-tab">
  1146. <div class="row">
  1147. <div class="col-md-4">
  1148. <a href="" target="_blank">
  1149. <div class="card">
  1150. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1151. </div>
  1152. <div class="card-body">
  1153. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1154. <p class="card-text mb-0">
  1155. <a href="" class="card__tag" target="_blank">混搭風</a>
  1156. <a href="" class="card__tag" target="_blank">混搭風</a>
  1157. <a href="" class="card__tag" target="_blank">混搭風</a>
  1158. </p>
  1159. </div>
  1160. </div>
  1161. </a>
  1162. </div>
  1163. <div class="col-md-4">
  1164. <a href="" target="_blank">
  1165. <div class="card">
  1166. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1167. </div>
  1168. <div class="card-body">
  1169. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1170. <p class="card-text mb-0">
  1171. <a href="" class="card__tag" target="_blank">混搭風</a>
  1172. <a href="" class="card__tag" target="_blank">混搭風</a>
  1173. <a href="" class="card__tag" target="_blank">混搭風</a>
  1174. </p>
  1175. </div>
  1176. </div>
  1177. </a>
  1178. </div>
  1179. <div class="col-md-4">
  1180. <a href="" target="_blank">
  1181. <div class="card">
  1182. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1183. </div>
  1184. <div class="card-body">
  1185. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1186. <p class="card-text mb-0">
  1187. <a href="" class="card__tag" target="_blank">混搭風</a>
  1188. <a href="" class="card__tag" target="_blank">混搭風</a>
  1189. <a href="" class="card__tag" target="_blank">混搭風</a>
  1190. </p>
  1191. </div>
  1192. </div>
  1193. </a>
  1194. </div>
  1195. </div>
  1196. </div>
  1197. <div class="tab-pane fade" id="pills-video" role="tabpanel"
  1198. aria-labelledby="pills-video-tab">
  1199. <div class="row">
  1200. <div class="col-md-4">
  1201. <a href="" target="_blank">
  1202. <div class="card">
  1203. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1204. <img src="https://hhh.com.tw/assets/images/rv_web/play.svg" alt="" width="50" height="50">
  1205. </div>
  1206. <div class="card-body">
  1207. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1208. <p class="card-text mb-0">
  1209. <a href="" class="card__tag" target="_blank">混搭風</a>
  1210. <a href="" class="card__tag" target="_blank">混搭風</a>
  1211. <a href="" class="card__tag" target="_blank">混搭風</a>
  1212. </p>
  1213. </div>
  1214. </div>
  1215. </a>
  1216. </div>
  1217. <div class="col-md-4">
  1218. <a href="" target="_blank">
  1219. <div class="card">
  1220. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1221. <img src="https://hhh.com.tw/assets/images/rv_web/play.svg" alt="" width="50" height="50">
  1222. </div>
  1223. <div class="card-body">
  1224. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1225. <p class="card-text mb-0">
  1226. <a href="" class="card__tag" target="_blank">混搭風</a>
  1227. <a href="" class="card__tag" target="_blank">混搭風</a>
  1228. <a href="" class="card__tag" target="_blank">混搭風</a>
  1229. </p>
  1230. </div>
  1231. </div>
  1232. </a>
  1233. </div>
  1234. </div>
  1235. </div>
  1236. <div class="tab-pane fade" id="pills-columns" role="tabpanel"
  1237. aria-labelledby="pills-columns-tab">
  1238. <div class="row">
  1239. <div class="col-md-4">
  1240. <a href="" target="_blank">
  1241. <div class="card">
  1242. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1243. </div>
  1244. <div class="card-body">
  1245. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1246. <p class="card-text mb-0">
  1247. <a href="" class="card__tag" target="_blank">混搭風</a>
  1248. <a href="" class="card__tag" target="_blank">混搭風</a>
  1249. <a href="" class="card__tag" target="_blank">混搭風</a>
  1250. </p>
  1251. </div>
  1252. </div>
  1253. </a>
  1254. </div>
  1255. <div class="col-md-4">
  1256. <a href="" target="_blank">
  1257. <div class="card">
  1258. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1259. </div>
  1260. <div class="card-body">
  1261. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1262. <p class="card-text mb-0">
  1263. <a href="" class="card__tag" target="_blank">混搭風</a>
  1264. <a href="" class="card__tag" target="_blank">混搭風</a>
  1265. <a href="" class="card__tag" target="_blank">混搭風</a>
  1266. </p>
  1267. </div>
  1268. </div>
  1269. </a>
  1270. </div>
  1271. <div class="col-md-4">
  1272. <a href="" target="_blank">
  1273. <div class="card">
  1274. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1275. </div>
  1276. <div class="card-body">
  1277. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1278. <p class="card-text mb-0">
  1279. <a href="" class="card__tag" target="_blank">混搭風</a>
  1280. <a href="" class="card__tag" target="_blank">混搭風</a>
  1281. <a href="" class="card__tag" target="_blank">混搭風</a>
  1282. </p>
  1283. </div>
  1284. </div>
  1285. </a>
  1286. </div>
  1287. </div>
  1288. </div>
  1289. <div class="tab-pane fade" id="pills-vr360" role="tabpanel"
  1290. aria-labelledby="pills-vr360-tab">
  1291. <div class="row">
  1292. <div class="col-md-4">
  1293. <a href="" target="_blank">
  1294. <div class="card">
  1295. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1296. </div>
  1297. <div class="card-body">
  1298. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1299. <p class="card-text mb-0">
  1300. <a href="" class="card__tag" target="_blank">混搭風</a>
  1301. <a href="" class="card__tag" target="_blank">混搭風</a>
  1302. <a href="" class="card__tag" target="_blank">混搭風</a>
  1303. </p>
  1304. </div>
  1305. </div>
  1306. </a>
  1307. </div>
  1308. <div class="col-md-4">
  1309. <a href="" target="_blank">
  1310. <div class="card">
  1311. <div class="card__bgImg" style="background-image: url(https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg);">
  1312. </div>
  1313. <div class="card-body">
  1314. <h5 class="card-title card__title mt-0">藏岳│混搭風│26坪</h5>
  1315. <p class="card-text mb-0">
  1316. <a href="" class="card__tag" target="_blank">混搭風</a>
  1317. <a href="" class="card__tag" target="_blank">混搭風</a>
  1318. <a href="" class="card__tag" target="_blank">混搭風</a>
  1319. </p>
  1320. </div>
  1321. </div>
  1322. </a>
  1323. </div>
  1324. </div>
  1325. </div> -->
  1326. <!-- <div class="tab-pane fade" id="pills-company" role="tabpanel"
  1327. aria-labelledby="pills-company-tab">
  1328. <div class="row justfy-content-between">
  1329. <div class="col-md-8">
  1330. <article class="company__article">
  1331. <div class="company__block">
  1332. <h4 class="company__title">設計理念</h4>
  1333. <div class="company__text">
  1334. 空間設計的美學藝術,蔡岳儒總監更能將日式精闢的手工藝術融入台灣的設計與工程,更將留日所學發揚光大明確的把結構、
  1335. 動線、收納、光線與品味融入建築、景觀與室內三大空間之中,藉由點線面展現出空間的獨特性,並賦予空間延續的生命活力。
  1336. <br>
  1337. Design director Yueh-Ju Tsai is good at applying Japanese handmade fine art to the design
  1338. and construction in Taiwan. Mr. Tsai has developed what he learned in Japan, and applied
  1339. structure, flow, storage, light and taste to the area of architecture, landscape and
  1340. interior. Mr. Tsai utilizes dots, lines, surface to show the unique character of space and
  1341. put vivid life into the space.
  1342. </div>
  1343. </div>
  1344. <div class="company__block">
  1345. <h4 class="company__title">公司統編</h4>
  1346. <div class="company__text">
  1347. 經濟部/財政部登記有案:54656779
  1348. </div>
  1349. </div>
  1350. <div class="company__block">
  1351. <h4 class="company__title">相關經歷</h4>
  1352. <div class="company__text">
  1353. <p>蔡岳儒
  1354. <br>◆現任/恆岳空間設計 主持設計師
  1355. <br>◆學歷/東京デザイナー学院卒業
  1356. <br>◆經歷/十餘年設計、工程經歷。
  1357. <br><br>1999年日本國色彩士
  1358. <br>2000年東京デザイナ-学院卒業
  1359. <br>2009年一級室內裝飾設計師
  1360. <br>2012年環保署整潔綠美化管理人員
  1361. <br>2013年內政部建築物室內裝修登記立案
  1362. <br>2014年無障礙設施設備勘檢人員培訓</p>
  1363. </div>
  1364. </div>
  1365. <div class="company__block">
  1366. <h4 class="company__title">專業證照</h4>
  1367. <div class="company__text">
  1368. 建築物室內裝修專業技術人員登記證 高恒悌 第40EC116787號
  1369. <br>建築物室內裝修專業技術人員登記證 高恒悌 第40EC116787號
  1370. </div>
  1371. </div>
  1372. </article>
  1373. </div>
  1374. <div class="col-md-4 fb__block">
  1375. <div class="fb-page" data-href="https://www.facebook.com/yayihouse.tw" data-tabs="timeline" data-width="390" data-height="700" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
  1376. <blockquote cite="https://www.facebook.com/yayihouse.tw" class="fb-xfbml-parse-ignore">
  1377. <a href="https://www.facebook.com/yayihouse.tw">雅驛室內裝修有限公司</a>
  1378. </blockquote>
  1379. </div>
  1380. </div>
  1381. </div> -->
  1382. </div>
  1383. </div>
  1384. <!-- <div class="d-flex justify-content-center py-3 py-md-5">
  1385. <div id="loading_img">
  1386. <svg class="loading-move" xmlns="http://www.w3.org/2000/svg" width="40" height="41.965"
  1387. viewBox="0 0 40 41.965">
  1388. <defs>
  1389. <style>
  1390. .a {
  1391. fill: #ee751b;
  1392. }
  1393. </style>
  1394. </defs>
  1395. <circle class="a" cx="4.89" cy="4.89" r="4.89" transform="translate(16.094)" />
  1396. <ellipse class="a" cx="2.933" cy="2.933" rx="2.933" ry="2.933"
  1397. transform="translate(18.05 36.099)" />
  1398. <ellipse class="a" cx="4.401" cy="4.401" rx="4.401" ry="4.401" transform="translate(4.487 5.464)" />
  1399. <circle class="a" cx="2.445" cy="2.445" r="2.445" transform="translate(30.626 31.609)" />
  1400. <ellipse class="a" cx="3.911" cy="3.911" rx="3.911" ry="3.911" transform="translate(0 18.056)" />
  1401. <circle class="a" cx="1.955" cy="1.955" r="1.955" transform="translate(36.091 20.01)" />
  1402. <path class="a" d="M5.065,20.213a3.422,3.422,0,1,0,4.839,0A3.419,3.419,0,0,0,5.065,20.213Z"
  1403. transform="translate(1.403 11.424)" />
  1404. <ellipse class="a" cx="1.466" cy="1.466" rx="1.466" ry="1.466"
  1405. transform="translate(31.603 8.434)" />
  1406. </svg>
  1407. </div>
  1408. </div> -->
  1409. </div>
  1410. </div>
  1411. </section>
  1412. <footer class="footer">
  1413. <div class="container" style="margin:0 auto;">
  1414. <div class="row">
  1415. <div class="col footer__block">
  1416. <h4 class="footer__block-title">相關連結</h4>
  1417. <ul class="footer__block-list">
  1418. <li><a class="footer__list-item" href="http://gstv.com.tw/" target="_blank">
  1419. <div class="footer__list-icon"><img src="images/menu/tv.svg" alt=""></div>
  1420. <p>幸福空間居家台</p>
  1421. </a></li>
  1422. <li><a class="footer__list-item" href="https://event.hhh.com.tw/contest/2018/" target="_blank">
  1423. <div class="footer__list-icon"><img src="images/menu/prize.svg" alt=""></div>
  1424. <p>ADA 亞洲設計獎</p>
  1425. </a></li>
  1426. <li><a class="footer__list-item" href="https://event.hhh.com.tw/2019global-award/" target="_blank">
  1427. <div class="footer__list-icon"><img src="images/menu/champion.svg" alt=""></div>
  1428. <p>國際設計大獎代辦</p>
  1429. </a></li>
  1430. <li><a class="footer__list-item" href="https://www.leju.com.tw/" target="_blank">
  1431. <div class="footer__list-icon"><img data-src="images/menu/Image 1@2x.png" alt="" width="20" class="lazyload"></div>
  1432. <p>樂居網</p>
  1433. </a></li>
  1434. <li><a class="footer__list-item" href="https://shop.hhh.com.tw/" target="_blank">
  1435. <div class="footer__list-icon"><img src="images/menu/cart.svg" alt=""></div>
  1436. <p>+好物</p>
  1437. </a></li>
  1438. </ul>
  1439. </div>
  1440. <div class="col footer__block">
  1441. <h4 class="footer__block-title">相關社群</h4>
  1442. <div class="d-flex flex-column justify-content-center">
  1443. <ul class="footer__block-socials">
  1444. <li><a href="https://www.facebook.com/hhhfb"><img src="images/menu/fb.svg" alt="" class="d-inline-block"></a></li>
  1445. <li><a href="https://line.me/ti/p/%40ovs4341s"><img src="images/menu/line.svg" alt="" class="d-inline-block"></a></li>
  1446. <li><a href="https://www.youtube.com/user/gorgeousspace"><img src="images/menu/youtube.svg" alt="" class="d-inline-block"></a></li>
  1447. <li><a href="https://www.instagram.com/gorgeous_space/"><img data-src="images/menu/instagram@2x.png" width="43" alt="" class="d-inline-block lazyload"></a></li>
  1448. <li><a href=""><img src="images/menu/pinterest.svg" alt="" class="d-inline-block"></a></li>
  1449. </ul>
  1450. <div class="py-4 text-center d-flex justify-content-center">
  1451. <a href="https://www.facebook.com/agent.hhh.com.tw" class="follows-fp me-2"><img src="images/menu/fb.svg" alt="" width="20" class="d-inline-block me-2"><p>幸福經紀人</p></a>
  1452. <a href="https://www.facebook.com/retire.tw/" class="follows-fp ms-2"><img src="images/menu/fb.svg" alt="" width="20" class="d-inline-block me-2"><p>退休好幸福</p></a>
  1453. </div>
  1454. </div>
  1455. </div>
  1456. <div class="col footer__block d-flex flex-column justify-content-center align-items-center">
  1457. <div class="footer__block-phone">
  1458. <p>幸福經紀人免付費諮詢電話</p><span class="ms-2"><a class="text-phone" href="tel:0800-366-086">0800-366-086</a></span></a>
  1459. </div>
  1460. <div class="footer__block-links">
  1461. <div class="footer__block-links-grp">
  1462. <a href="https://m.hhh.com.tw/about/contact/">關於我們</a>
  1463. <a href="https://m.hhh.com.tw/about/timeline/">公司歷程</a>
  1464. </div>
  1465. <div class="footer__block-links-grp">
  1466. <a href="https://m.hhh.com.tw/about/privacy_policy/">隱私保護</a>
  1467. <a href="https://www.104.com.tw/company/d6hr8sg">企業徵才</a>
  1468. </div>
  1469. <div class="footer__block-links-grp">
  1470. <a href="https://m.hhh.com.tw/about/contact/">聯絡我們</a>
  1471. <a href="https://m.hhh.com.tw/about/sitemap/">網站地圖</a>
  1472. </div>
  1473. </div>
  1474. <!-- <div class="footer__block-subscribe">
  1475. <input type="text" name="searchQuery" class="subscribeBar p-2" placeholder="訂閱電子報,請輸入您的Email">
  1476. <button type="button" class="subscribeBtn">訂閱</button>
  1477. </div> -->
  1478. </div>
  1479. </div>
  1480. </div>
  1481. <div class="container-fluid bottom-box">
  1482. </div>
  1483. </footer>
  1484. <div class="fixed-btn">
  1485. <!-- <div class="btn-favor mb-2" data-bs-toggle="modal" data-bs-target="#favorModal">
  1486. <img src="images/gotop.png" width="28" alt="">
  1487. </div>
  1488. <div class="btn-login mb-2" data-bs-toggle="modal" data-bs-target="#loginModal">
  1489. <img src="images/gotop.png" width="28" alt="">
  1490. </div> -->
  1491. <div class="btn-gotop">
  1492. <img data-src="images/gotop.webp" width="28" alt="" class="lazyload">
  1493. </div>
  1494. </div>
  1495. <div class="modal fade" id="loginModal" tabindex="-1" aria-labelledby="loginModalLabel" aria-hidden="true">
  1496. <div class="modal-dialog modal-dialog-centered">
  1497. <div class="modal-content">
  1498. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  1499. <div class="container-fluid sec-login-block px-0">
  1500. <div class="sec-login-list w-100">
  1501. <h4 class="sec- text-center">會員登入</h4>
  1502. <hr>
  1503. <div class="sec-login-btns">
  1504. </div>
  1505. </div>
  1506. </div>
  1507. </div>
  1508. </div>
  1509. </div>
  1510. <div class="modal fade" id="emailModal" tabindex="-1" aria-labelledby="emailModalLabel" aria-hidden="true">
  1511. <div class="modal-dialog modal-dialog-centered emodal">
  1512. <div class="modal-content">
  1513. <div class="modal-header text-center border-0">
  1514. <h5 class="modal-title font-weight-bold emodal-title" id="forwardModalLabel">轉寄好友</h5>
  1515. </div>
  1516. <div class="modal-body">
  1517. <div class="col">
  1518. <div class="input-group">
  1519. <input type="text" class="form-control fm-input-border" placeholder="收件人email" name="email" id="email">
  1520. <div class="input-group-append">
  1521. <button class="btn btn-plus" id="putEmail" type="button" onclick="putEmail()">
  1522. <i class="fa fa-plus fm-plus" aria-hidden="true"></i></button>
  1523. </div>
  1524. </div>
  1525. <div class="text-end">
  1526. <small class="text-danger" id="error"></small>
  1527. </div>
  1528. </div>
  1529. <div class="col mb-3 d-flex flex-wrap">
  1530. <span class="fm-email-btnWrapper m-1" id="putEmail_hidden" style="display: none;">
  1531. <span class="fm-email-btn">
  1532. <small class="mr-1" id="add_email"></small>
  1533. <i class="fa fa-times-circle fm-close" aria-hidden="true"></i>
  1534. </span>
  1535. </span>
  1536. </div>
  1537. <div class="col mb-3">
  1538. <input type="text" class="form-control font-weight-bold " id="title" value="" placeholder="">
  1539. </div>
  1540. <div class="col mb-3">
  1541. <textarea class="form-control" id="content" rows="5" name="content" placeholder="內容"></textarea>
  1542. </div>
  1543. </div>
  1544. <div class="modal-button-wrapper d-flex justify-content-center mb-4">
  1545. <a class="btn modal-button me-2 btn-send active" id="doSend">送出</a>
  1546. <a class="btn modal-button btn-dismiss" data-bs-dismiss="modal" aria-label="Close">取消</a>
  1547. </div>
  1548. </div>
  1549. </div>
  1550. </div>
  1551. <div class="modal fade" id="favorModal" tabindex="-1" aria-labelledby="favorModalLabel" aria-hidden="true">
  1552. <div class="modal-dialog modal-dialog-centered">
  1553. <div class="modal-content">
  1554. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  1555. <div class="container-fluid sec-favor-block px-0">
  1556. <div class="sec-favor-list w-100">
  1557. <h4 class="sec-favor-title text-center">我的喜好</h4>
  1558. <hr>
  1559. <div class="sec-favor-form">
  1560. <form action="" method="" id="msform">
  1561. <div class="d-flex justify-content-between align-items">
  1562. <div class="form-user">Hi 陳喬治</div>
  1563. <ul class="p-0 form-progressbar">
  1564. <li class="active">1</li>
  1565. <li>2</li>
  1566. <li>3</li>
  1567. </ul>
  1568. </div>
  1569. <fieldset class="form-step form-step1 text-center">
  1570. <div style="position: relative;">
  1571. <h4 class="mb-3">請選擇設計風格 / 多選</h4>
  1572. <div class="row mb-2">
  1573. <input type="checkbox" value="北歐風" name="q1" id="1a" checked/>
  1574. <label class="col-4 mr fs-label-info text-center" for="1a">
  1575. <div class="imgfr mb-1"></div>
  1576. <p>北歐風</p>
  1577. </label>
  1578. <input type="checkbox" value="現代風" name="q1" id="1b" />
  1579. <label class="col-4 mr fs-label-info text-center" for="1b">
  1580. <div class="imgfr mb-1"></div>
  1581. <p>現代風</p>
  1582. </label>
  1583. <input type="checkbox" value="工業風" name="q1" id="1c" />
  1584. <label class="col-4 mr fs-label-info text-center" for="1c">
  1585. <div class="imgfr mb-1"></div>
  1586. <p>工業風</p>
  1587. </label>
  1588. </div>
  1589. <div class="row mb-2">
  1590. <input type="checkbox" value="美式風" name="q1" id="1d" />
  1591. <label class="col-4 mr fs-label-info text-center" for="1d">
  1592. <div class="imgfr mb-1"></div>
  1593. <p>美式風</p>
  1594. </label>
  1595. <input type="checkbox" value="鄉村風" name="q1" id="1e" />
  1596. <label class="col-4 mr fs-label-info text-center" for="1e">
  1597. <div class="imgfr mb-1"></div>
  1598. <p>鄉村風</p>
  1599. </label>
  1600. <input type="checkbox" value="古典風" name="q1" id="1f" />
  1601. <label class="col-4 mr fs-label-info text-center" for="1f">
  1602. <div class="imgfr mb-1"></div>
  1603. <p>古典風</p>
  1604. </label>
  1605. </div>
  1606. <div class="row mb-2">
  1607. <input type="checkbox" value="新古典風" name="q1" id="1g" />
  1608. <label class="col-4 mr fs-label-info text-center" for="1g">
  1609. <div class="imgfr mb-1"></div>
  1610. <p>新古典風</p>
  1611. </label>
  1612. <input type="checkbox" value="休閒多元" name="q1" id="1h" />
  1613. <label class="col-4 mr fs-label-info text-center" for="1h">
  1614. <div class="imgfr mb-1"></div>
  1615. <p>休閒多元</p>
  1616. </label>
  1617. <input type="checkbox" value="其他" name="q1" id="1i" />
  1618. <label class="col-4 mr fs-label-info text-center" for="1i">
  1619. <div class="imgfr mb-1"></div>
  1620. <p>其他</p>
  1621. </label>
  1622. </div>
  1623. <input class="next" type="button" value="下一步">
  1624. </div>
  1625. </fieldset>
  1626. <fieldset class="form-step form-step2 text-center">
  1627. <div style="">
  1628. <h4 class="mb-3">請選擇喜歡的居家空間 / 多選</h4>
  1629. <div class="row mb-2">
  1630. <input type="checkbox" value="北歐風" name="q2" id="2a" checked/>
  1631. <label class="col-4 mr fs-label-info text-center" for="2a">
  1632. <div class="imgfr mb-1"></div>
  1633. <p>客廳</p>
  1634. </label>
  1635. <input type="checkbox" value="現代風" name="q2" id="2b" />
  1636. <label class="col-4 mr fs-label-info text-center" for="2b">
  1637. <div class="imgfr mb-1"></div>
  1638. <p>餐廳</p>
  1639. </label>
  1640. <input type="checkbox" value="工業風" name="q2" id="2c" />
  1641. <label class="col-4 mr fs-label-info text-center" for="2c">
  1642. <div class="imgfr mb-1"></div>
  1643. <p>臥室</p>
  1644. </label>
  1645. </div>
  1646. <div class="row mb-2">
  1647. <input type="checkbox" value="美式風" name="q2" id="2d" />
  1648. <label class="col-4 mr fs-label-info text-center" for="2d">
  1649. <div class="imgfr mb-1"></div>
  1650. <p>廚房</p>
  1651. </label>
  1652. <input type="checkbox" value="鄉村風" name="q2" id="2e" />
  1653. <label class="col-4 mr fs-label-info text-center" for="2e">
  1654. <div class="imgfr mb-1"></div>
  1655. <p>浴室</p>
  1656. </label>
  1657. <input type="checkbox" value="古典風" name="q2" id="2f" />
  1658. <label class="col-4 mr fs-label-info text-center" for="2f">
  1659. <div class="imgfr mb-1"></div>
  1660. <p>玄關</p>
  1661. </label>
  1662. </div>
  1663. <div class="row mb-2">
  1664. <input type="checkbox" value="新古典風" name="q2" id="2g" />
  1665. <label class="col-4 mr fs-label-info text-center" for="2g">
  1666. <div class="imgfr mb-1"></div>
  1667. <p>兒童房</p>
  1668. </label>
  1669. <input type="checkbox" value="休閒多元" name="q2" id="2h" />
  1670. <label class="col-4 mr fs-label-info text-center" for="2h">
  1671. <div class="imgfr mb-1"></div>
  1672. <p>陽台</p>
  1673. </label>
  1674. <input type="checkbox" value="其他" name="q1" id="2i" />
  1675. <label class="col-4 mr fs-label-info text-center" for="2i">
  1676. <div class="imgfr mb-1"></div>
  1677. <p>其他</p>
  1678. </label>
  1679. </div>
  1680. <input class="next" type="button" value="下一步">
  1681. </div>
  1682. </fieldset>
  1683. <fieldset class="form-step form-step3 text-center">
  1684. <h4 class="mb-3 text-center">請選擇以下條件</h4>
  1685. <div class="step3-block text-start">
  1686. <span class="step3-block-title">房屋坪數 / 單選</span>
  1687. <input type="radio" value="20坪以下" name="q3" id="3a" />
  1688. <label class="mr fs-label-chbox radio" for="3a">20坪以下</label>
  1689. <input type="radio" value="20~30坪" name="q3" id="3b" />
  1690. <label class="mr fs-label-chbox radio" for="3b">20~30坪</label>
  1691. <input type="radio" value="30~40坪" name="q3" id="3c" />
  1692. <label class="mr fs-label-chbox radio" for="3c">31~50坪</label>
  1693. <input type="radio" value="50坪以上" name="q3" id="3e" />
  1694. <label class="mr fs-label-chbox radio" for="3e">50坪以上</label>
  1695. </div>
  1696. <div class="step3-block text-start">
  1697. <span class="step3-block-title text-left">房屋預算 / 單選</span>
  1698. <input type="radio" value="20坪以下" name="q4" id="4a" />
  1699. <label class="mr fs-label-chbox radio" for="4a">100萬以下</label>
  1700. <input type="radio" value="20~30坪" name="q4" id="4b" />
  1701. <label class="mr fs-label-chbox radio" for="4b">101~200萬</label>
  1702. <input type="radio" value="30~40坪" name="q4" id="4c" />
  1703. <label class="mr fs-label-chbox radio" for="4c">201~300萬</label>
  1704. <input type="radio" value="50坪以上" name="q4" id="4e" />
  1705. <label class="mr fs-label-chbox radio" for="4e">301萬以上</label>
  1706. </div>
  1707. <div class="step3-block text-start">
  1708. <span class="step3-block-title text-left">裝修屋況 / 單選</span>
  1709. <input type="radio" value="20坪以下" name="q5" id="5a" />
  1710. <label class="mr fs-label-chbox radio" for="5a">新成屋</label>
  1711. <input type="radio" value="20~30坪" name="q5" id="5b" />
  1712. <label class="mr fs-label-chbox radio" for="5b">中古屋</label>
  1713. <input type="radio" value="30~40坪" name="q5" id="5c" />
  1714. <label class="mr fs-label-chbox radio" for="5c">毛胚屋</label>
  1715. <input type="radio" value="50坪以上" name="q5" id="5d" />
  1716. <label class="mr fs-label-chbox radio" for="5d">老屋翻新</label>
  1717. <input type="radio" value="50坪以上" name="q5" id="5e" />
  1718. <label class="mr fs-label-chbox radio" for="5e">自地自建</label>
  1719. </div>
  1720. <div class="btngrp text-center">
  1721. <input class="skip d-block mb-2" type="button" value="略過">
  1722. <input class="next d-block" type="button" value="下一步">
  1723. </div>
  1724. </fieldset>
  1725. </form>
  1726. </div>
  1727. <div class="sec-favor-checklist d-none">
  1728. <form action="" method="">
  1729. <div class="form-user">Hi 陳喬治</div>
  1730. <fieldset class="form-step text-center">
  1731. <h4 class="mb-3 text-center">請選擇以下條件</h4>
  1732. <div class="step3-block text-start">
  1733. <span class="step3-block-title">設計風格 / 多選</span>
  1734. <input type="checkbox" value="20坪以下" name="style" id="north" />
  1735. <label class="mr fs-label-chbox radio" for="north">北歐風</label>
  1736. <input type="checkbox" value="20~30坪" name="style" id="modern" />
  1737. <label class="mr fs-label-chbox radio" for="modern">現代風</label>
  1738. <input type="checkbox" value="30~40坪" name="style" id="indust" />
  1739. <label class="mr fs-label-chbox radio" for="indust">工業風</label>
  1740. <input type="checkbox" value="50坪以上" name="style" id="usa" />
  1741. <label class="mr fs-label-chbox radio" for="usa">美式風</label>
  1742. <input type="checkbox" value="50坪以上" name="style" id="casual" />
  1743. <label class="mr fs-label-chbox radio" for="casual">休閒多元</label>
  1744. <input type="checkbox" value="50坪以上" name="style" id="country" />
  1745. <label class="mr fs-label-chbox radio" for="country">鄉村風</label>
  1746. <input type="checkbox" value="50坪以上" name="style" id="old" />
  1747. <label class="mr fs-label-chbox radio" for="old">古典風</label>
  1748. <input type="checkbox" value="50坪以上" name="style" id="other" />
  1749. <label class="mr fs-label-chbox radio" for="other">其他</label>
  1750. </div>
  1751. <div class="step3-block text-start mb-3">
  1752. <span class="step3-block-title">喜歡的居家空間 / 多選</span>
  1753. <input type="checkbox" value="20坪以下" name="space" id="salon" />
  1754. <label class="mr fs-label-chbox radio" for="salon">客廳</label>
  1755. <input type="checkbox" value="20~30坪" name="space" id="restaurant" />
  1756. <label class="mr fs-label-chbox radio" for="restaurant">餐廳</label>
  1757. <input type="checkbox" value="30~40坪" name="space" id="bedroom" />
  1758. <label class="mr fs-label-chbox radio" for="bedroom">臥室</label>
  1759. <input type="checkbox" value="50坪以上" name="space" id="kitchen" />
  1760. <label class="mr fs-label-chbox radio" for="kitchen">廚房</label>
  1761. <input type="checkbox" value="50坪以上" name="space" id="bathroom" />
  1762. <label class="mr fs-label-chbox radio" for="bathroom">浴室</label>
  1763. <input type="checkbox" value="50坪以上" name="space" id="porch" />
  1764. <label class="mr fs-label-chbox radio" for="porch">玄關</label>
  1765. <input type="checkbox" value="50坪以上" name="space" id="childroom" />
  1766. <label class="mr fs-label-chbox radio" for="childroom">兒童房</label>
  1767. <input type="checkbox" value="50坪以上" name="space" id="balcony" />
  1768. <label class="mr fs-label-chbox radio" for="balcony">陽台</label>
  1769. <input type="checkbox" value="50坪以上" name="space" id="others" />
  1770. <label class="mr fs-label-chbox radio" for="others">其他</label>
  1771. </div>
  1772. <div class="step3-block text-start">
  1773. <span class="step3-block-title">房屋坪數 / 單選</span>
  1774. <input type="radio" value="20坪以下" name="feet" id="below20" />
  1775. <label class="mr fs-label-chbox radio" for="below20">20坪以下</label>
  1776. <input type="radio" value="20~30坪" name="feet" id="20to30" />
  1777. <label class="mr fs-label-chbox radio" for="20to30">20~30坪</label>
  1778. <input type="radio" value="30~40坪" name="feet" id="30to50" />
  1779. <label class="mr fs-label-chbox radio" for="30to50">31~50坪</label>
  1780. <input type="radio" value="50坪以上" name="feet" id="above50" />
  1781. <label class="mr fs-label-chbox radio" for="above50">50坪以上</label>
  1782. </div>
  1783. <div class="step3-block text-start">
  1784. <span class="step3-block-title text-left">房屋預算 / 多選</span>
  1785. <input type="checkbox" value="20坪以下" name="budget" id="below1m" />
  1786. <label class="mr fs-label-chbox radio" for="below1m">100萬以下</label>
  1787. <input type="checkbox" value="20~30坪" name="budget" id="100to200" />
  1788. <label class="mr fs-label-chbox radio" for="100to200">101~200萬</label>
  1789. <input type="checkbox" value="30~40坪" name="budget" id="200to300" />
  1790. <label class="mr fs-label-chbox radio" for="200to300">201~300萬</label>
  1791. <input type="checkbox" value="50坪以上" name="budget" id="300up" />
  1792. <label class="mr fs-label-chbox radio" for="300up">301萬以上</label>
  1793. </div>
  1794. <div class="step3-block text-start">
  1795. <span class="step3-block-title text-left">裝修屋況 / 單選</span>
  1796. <input type="radio" value="20坪以下" name="condition" id="new" />
  1797. <label class="mr fs-label-chbox radio" for="new">新成屋</label>
  1798. <input type="radio" value="20~30坪" name="condition" id="aged" />
  1799. <label class="mr fs-label-chbox radio" for="aged">中古屋</label>
  1800. <input type="radio" value="30~40坪" name="condition" id="unfinished" />
  1801. <label class="mr fs-label-chbox radio" for="unfinished">毛胚屋</label>
  1802. <input type="radio" value="50坪以上" name="condition" id="refurbish" />
  1803. <label class="mr fs-label-chbox radio" for="refurbish">老屋翻新</label>
  1804. <input type="radio" value="50坪以上" name="condition" id="selfown" />
  1805. <label class="mr fs-label-chbox radio" for="selfown">自地自建</label>
  1806. </div>
  1807. <div class="btngrp text-center">
  1808. <input class="next d-block mb-3" type="button" value="下一步">
  1809. </div>
  1810. </fieldset>
  1811. </form>
  1812. </div>
  1813. </div>
  1814. </div>
  1815. </div>
  1816. </div>
  1817. </div>
  1818. </div>
  1819. <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"
  1820. integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p"
  1821. crossorigin="anonymous"></script>
  1822. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js"
  1823. integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT"
  1824. crossorigin="anonymous"></script>
  1825. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  1826. <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
  1827. <script async defer src="js/index-designer.js"></script>
  1828. <script async defer src="js/index-list.js"></script>
  1829. <script src="js/lazy-load.js" async></script>
  1830. </body>
  1831. </html>