update

css/all.css

@@ -3,6 +3,16 @@
   font-family: "Noto Sans TC", sans-serif !important;
 }
 
+.fa,
+.far,
+.fas {
+  font-family: Font Awesome\ 5 Free !important;
+}
+
+body {
+  overflow-x: hidden;
+}
+
 /* Bootstrap Start */
 .form-control:focus,
 .btn-check:focus + .btn,
@@ -53,4 +63,457 @@
   display: none;
 }
 
-/* Bootstrap End *//*# sourceMappingURL=all.css.map */
+/* Bootstrap End */
+/* Navbar Start */
+#navbar {
+  position: sticky;
+  top: 0;
+  z-index: 1000;
+}
+#navbar.show {
+  position: fixed !important;
+  overflow-y: auto;
+  overflow-x: hidden;
+  width: 100%;
+  height: 100%;
+  z-index: 2000;
+}
+#navbar.show .navbar {
+  padding-bottom: 0;
+}
+#navbar .navbar {
+  z-index: 100;
+  background-color: white !important;
+  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.15);
+}
+#navbar .navbar .container-fluid {
+  padding: 0 2.5rem;
+}
+@media (max-width: 1200px) {
+  #navbar .navbar .container-fluid {
+    padding: 0 1.5rem;
+  }
+}
+@media (max-width: 991px) {
+  #navbar .navbar .container-fluid {
+    padding: 0;
+  }
+}
+@media (max-width: 1400px) {
+  #navbar .navbar .navbar-nav .nav-item {
+    margin: 0;
+  }
+}
+#navbar .navbar .navbar-nav .nav-item .nav-link {
+  padding: 1.5rem 1.2rem;
+  position: relative;
+  font-size: 1.125rem;
+  cursor: pointer;
+  color: #34404b;
+  border-bottom: 4px solid transparent;
+}
+@media (max-width: 1200px) {
+  #navbar .navbar .navbar-nav .nav-item .nav-link {
+    padding: 1.5rem 0.8rem;
+    font-size: 1rem;
+  }
+}
+@media (max-width: 991px) {
+  #navbar .navbar .navbar-nav .nav-item .nav-link {
+    padding: 1rem 0;
+    border-bottom: none;
+  }
+}
+#navbar .navbar .navbar-nav .nav-item .nav-link:hover {
+  border-bottom: 4px solid #ee7800;
+}
+@media (max-width: 991px) {
+  #navbar .navbar .navbar-nav .nav-item .nav-link:hover {
+    border-bottom: none;
+  }
+}
+#navbar .navbar .navbar-nav .nav-item .nav-link .expand i {
+  color: #D3D3D3;
+}
+@media (max-width: 991px) {
+  #navbar .navbar .navbar-nav li {
+    border-bottom: 1px solid #F4F4F4;
+  }
+}
+@media (max-width: 991px) {
+  #navbar .navbar .navbar-nav li:last-child {
+    border-bottom: none;
+  }
+}
+@media (min-width: 991px) {
+  #navbar .navbar li.dropdown:hover > .dropdown-menu {
+    display: block;
+  }
+}
+#navbar .navbar .dropdown-level-width {
+  min-width: 13.5rem;
+}
+#navbar .navbar .dropdown-level-width li {
+  margin: 5px 0;
+}
+#navbar .navbar .search-btn {
+  border: none;
+  background: transparent;
+}
+#navbar .navbar .search-btn img {
+  margin-bottom: -3px;
+}
+#navbar .navbar .hover-block .nav-link {
+  border-bottom: none !important;
+}
+#navbar .navbar .hover-block .nav-link:hover a, #navbar .navbar .hover-block .nav-link:hover p {
+  color: #ee7800;
+}
+@media (max-width: 991px) {
+  #navbar .navbar .dropdown-sub {
+    padding: 5px 0;
+    padding-left: 45px;
+  }
+}
+@media (max-width: 991px) {
+  #navbar .navbar .dropdown-sub:first-child {
+    border-top: 1px solid #F4F4F4;
+  }
+}
+@media (min-width: 991px) {
+  #navbar .navbar .dropdown-sub:hover .dropdown-menu {
+    display: block;
+  }
+}
+#navbar .navbar .dropdown-sub:hover .submenu, #navbar .navbar .dropdown-sub:hover > :hover > a {
+  color: #ee7800;
+}
+#navbar .navbar .dropdown-sub p {
+  font-size: 16px;
+}
+#navbar .navbar .dropdown-sub .submenu {
+  color: #34404b;
+}
+#navbar .navbar .dropdown-sub .dropdown-menu {
+  top: -9px !important;
+  left: 213px;
+}
+#navbar .navbar .dropdown-sub .dropdown-menu > li:hover > a {
+  color: #ee7800;
+}
+#navbar .navbar .dropdown-item {
+  padding: 0.25rem 1.2rem;
+}
+@media (max-width: 991px) {
+  #navbar .navbar .dropdown-item {
+    padding: 0.5rem;
+  }
+}
+#navbar .navbar .dropdown-item:hover {
+  background-color: #fff;
+}
+@media (max-width: 991px) {
+  #navbar .navbar .dropdown-menu {
+    border: none;
+  }
+}
+#navbar .navbar .logo {
+  width: 130px;
+}
+#navbar .navbar .search-text {
+  color: #ee751b;
+}
+#navbar .navbar .renovation-btn {
+  display: block;
+  color: #ee751b;
+  background: #fff;
+  border: 1px solid #ee751b;
+  border-radius: 3px;
+  padding: 10px 20px;
+  margin-left: 50px;
+}
+
+.navbar-toggler {
+  border-color: transparent !important;
+}
+.navbar-toggler:focus {
+  box-shadow: none;
+}
+
+.shadow-item {
+  position: absolute;
+  display: none;
+  height: 3px;
+  top: 53px;
+  width: 100vw;
+  right: 0;
+  left: 0;
+  margin: auto;
+  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.15);
+  border-bottom: 1px solid #ccc;
+}
+@media (max-width: 991px) {
+  .shadow-item {
+    display: block;
+  }
+}
+
+/* Navbar End */
+/* Footer Start */
+.footer {
+  padding: 3rem;
+  background-color: #f4f4f4;
+  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
+}
+@media (max-width: 767px) {
+  .footer {
+    padding: 2rem;
+  }
+}
+@media (max-width: 575px) {
+  .footer {
+    padding: 2rem 1rem;
+  }
+}
+.footer h2 {
+  text-align: center;
+  border-top: 1px solid #d1d2d3;
+  margin-top: 50px;
+  padding-top: 30px;
+  color: #707070;
+  font-size: 16px;
+  font-weight: 300;
+  letter-spacing: 0.05rem;
+  line-height: 1.5;
+}
+.footer h4 {
+  font-size: 1.375rem;
+  font-weight: 500;
+  color: #797979;
+  text-align: center;
+  margin-bottom: 50px;
+}
+@media (max-width: 991px) {
+  .footer h4 {
+    text-align: left;
+    margin-bottom: 20px;
+  }
+}
+@media (max-width: 991px) {
+  .footer .about-list,
+  .footer .follow-list,
+  .footer .more-list {
+    display: flex;
+    justify-content: center;
+  }
+}
+@media (max-width: 991px) {
+  .footer .about-list section,
+  .footer .follow-list section,
+  .footer .more-list section {
+    width: 300px;
+  }
+}
+.footer .follow-list,
+.footer .more-list {
+  padding: 0;
+  overflow: hidden;
+  position: relative;
+}
+@media (max-width: 991px) {
+  .footer .follow-list,
+  .footer .more-list {
+    margin-top: 30px;
+    padding-top: 30px;
+    border-top: 1px solid #989898;
+  }
+}
+.footer .about-list a {
+  color: #707070;
+  transition: all 0.3s;
+}
+.footer .about-list a:hover {
+  opacity: 0.8;
+}
+.footer .about-list img {
+  width: 20px;
+  height: 20px;
+  margin-right: 7px;
+}
+.footer .about-list ul {
+  letter-spacing: 0.05em;
+}
+.footer .about-list ul li {
+  margin: 5px 0;
+}
+@media (max-width: 991px) {
+  .footer .about-list ul li {
+    margin: 0;
+    height: 30px;
+  }
+}
+.footer .about-list ul li span {
+  color: #ea068c;
+}
+@media (max-width: 991px) {
+  .footer .about-list section {
+    width: 300px;
+  }
+}
+.footer .follow-list .media {
+  display: flex;
+}
+.footer .follow-list .media a {
+  display: block;
+  margin: 0 3px;
+  position: relative;
+}
+.footer .follow-list .media .media-item.after {
+  position: absolute;
+  top: 0;
+  left: 0;
+  opacity: 0;
+}
+.footer .follow-list img {
+  width: 45px;
+  height: 45px;
+  margin-right: 5px;
+  transition: all 0.3s;
+}
+@media (max-width: 1200px) {
+  .footer .follow-list img {
+    width: 40px;
+    height: 40px;
+  }
+}
+.footer .more-list a {
+  display: inline-block;
+  margin: 5px;
+  padding-bottom: 5px;
+  color: #797979;
+  border-bottom: 1px solid;
+  transition: all 0.3s;
+}
+.footer .more-list a:hover {
+  opacity: 0.8;
+}
+.footer .more-list .subscriber-item {
+  width: 100%;
+  max-width: 300px;
+  margin: auto;
+  display: flex;
+  flex-direction: column;
+  border: 2px solid #34404b;
+}
+.footer .more-list .subscriber-item:hover {
+  border: 2px solid #EE7800;
+}
+.footer .more-list .subscriber-item:hover button {
+  background-color: #EE7800;
+}
+.footer .more-list .subscriber-item input {
+  padding: 10px;
+  border: none;
+}
+.footer .more-list .subscriber-item input:focus-visible {
+  outline: none;
+}
+.footer .more-list .subscriber-item ::-moz-placeholder {
+  text-align: center;
+}
+.footer .more-list .subscriber-item ::placeholder {
+  text-align: center;
+}
+.footer .more-list .subscriber-item button {
+  padding: 15px;
+  border: none;
+  color: #fff;
+  background-color: #34404b;
+  transition: all 0.1s;
+}
+.footer .more-list .subscriber-item .spinner-border {
+  display: none;
+}
+.footer .more-list .subscriber-item .spinner-border.show {
+  display: block;
+}
+.footer .more-list .subscriber-item.input-error {
+  border-color: #ff5252;
+}
+.footer .more-list .subscriber-item.input-error button {
+  background-color: #ff5252;
+}
+.footer .more-list .link {
+  max-width: 280px;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+}
+@media (max-width: 991px) {
+  .footer .more-list .link {
+    max-width: 310px;
+    justify-content: start;
+  }
+}
+
+/* Footer End */
+/* searchModal Start */
+.search-modal {
+  letter-spacing: 1px;
+}
+@media (max-width: 991px) {
+  .search-modal .modal-dialog {
+    max-width: 100%;
+  }
+}
+.search-modal .modal-content {
+  border: none;
+  background: transparent;
+}
+.search-modal .modal-content .input-group {
+  height: 50px;
+}
+.search-modal .modal-content .input-group .input-group-text {
+  display: flex;
+  align-items: center;
+  padding: 0.5rem 2rem !important;
+  margin-bottom: 0;
+  color: #fff;
+  text-align: center;
+  white-space: nowrap;
+  background-color: #ee7800;
+  border: 2px solid #ee7800;
+  line-height: 1.5;
+  border-radius: 0.3rem;
+  cursor: pointer;
+}
+.search-modal .keyword-list {
+  display: flex;
+  align-items: center;
+  padding: 0 20px;
+}
+.search-modal .keyword-list ul {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-wrap: wrap;
+  color: #fff;
+}
+.search-modal .keyword-list ul li {
+  margin: 5px 10px 5px 0;
+  cursor: pointer;
+  transition: all 0.3s;
+}
+.search-modal .keyword-list ul li:hover {
+  opacity: 0.8;
+}
+.search-modal .keyword-list span {
+  color: #fff;
+  margin-right: 10px;
+}
+
+.modal-backdrop.show {
+  opacity: 0.7 !important;
+}
+
+/* searchModal End *//*# sourceMappingURL=all.css.map */

css/all.scss

@@ -3,6 +3,21 @@
   font-family: 'Noto Sans TC', sans-serif !important;
 }
 
+.fa,
+.far,
+.fas {
+  font-family: Font Awesome\ 5 Free !important;
+}
+
+body {
+  overflow-x: hidden;
+
+  // &.menu-show {
+  //   height: 100vh;
+  //   overflow: hidden;
+  // }
+}
+
 /* Bootstrap Start */
 
 .form-control:focus,
@@ -62,4 +77,536 @@
   }
 }
 
-/* Bootstrap End */
+/* Bootstrap End */
+
+/* Navbar Start */
+
+#navbar {
+  position: sticky;
+  top: 0;
+  z-index: 1000;
+
+  &.show {
+    position: fixed !important;
+    overflow-y: auto;
+    overflow-x: hidden;
+    width: 100%;
+    height: 100%;
+    z-index: 2000;
+
+    .navbar {
+      padding-bottom: 0;
+    }
+  }
+
+  .navbar {
+    z-index: 100;
+    background-color: white !important;
+    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.15);
+
+    @media (max-width: 991px) {
+      // box-shadow: none;
+    }
+
+    .container-fluid {
+      padding: 0 2.5rem;
+
+      @media (max-width: 1200px) {
+        padding: 0 1.5rem;
+      }
+
+      @media (max-width: 991px) {
+        padding: 0;
+      }
+    }
+
+    .navbar-nav {
+      .nav-item {
+        @media (max-width: 1400px) {
+          margin: 0;
+        }
+
+        .nav-link {
+          padding: 1.5rem 1.2rem;
+          position: relative;
+          font-size: 1.125rem;
+          cursor: pointer;
+          color: #34404b;
+          border-bottom: 4px solid transparent;
+
+          @media (max-width: 1200px) {
+            padding: 1.5rem .8rem;
+            font-size: 1rem;
+          }
+
+          @media (max-width: 991px) {
+            padding: 1rem 0;
+            border-bottom: none;
+          }
+
+          &:hover {
+            border-bottom: 4px solid #ee7800;
+
+            @media (max-width: 991px) {
+              border-bottom: none;
+            }
+          }
+
+          .expand i {
+            color: #D3D3D3;
+          }
+        }
+      }
+
+      li {
+        @media (max-width: 991px) {
+          border-bottom: 1px solid #F4F4F4;
+        }
+
+        &:last-child {
+          @media (max-width: 991px) {
+            border-bottom: none;
+          }
+        }
+      }
+    }
+
+    @media (min-width: 991px) {
+      li.dropdown:hover>.dropdown-menu {
+        display: block;
+      }
+    }
+
+    .dropdown-level-width {
+      min-width: 13.5rem;
+
+      li {
+        margin: 5px 0;
+      }
+    }
+
+    .search-btn {
+      border: none;
+      background: transparent;
+
+      img {
+        margin-bottom: -3px;
+      }
+    }
+
+    .hover-block {
+      .nav-link {
+        border-bottom: none !important;
+
+        &:hover a,
+        &:hover p {
+          color: #ee7800;
+        }
+      }
+    }
+
+    .dropdown-sub {
+
+      @media (max-width: 991px) {
+        padding: 5px 0;
+        padding-left: 45px;
+      }
+
+      &:first-child {
+        @media (max-width: 991px) {
+          border-top: 1px solid #F4F4F4;
+        }
+      }
+
+      &:hover {
+        .dropdown-menu {
+          @media (min-width: 991px) {
+            display: block;
+          }
+        }
+
+        .submenu,
+        &>:hover>a {
+          color: #ee7800;
+        }
+      }
+
+      p {
+        font-size: 16px;
+      }
+
+      .submenu {
+        color: #34404b;
+      }
+
+      .dropdown-menu {
+        top: -9px !important;
+        left: 213px;
+
+        &>li:hover>a {
+          color: #ee7800;
+        }
+      }
+    }
+
+    .dropdown-item {
+      padding: .25rem 1.2rem;
+
+      @media (max-width: 991px) {
+        padding: .5rem;
+      }
+
+      &:hover {
+        background-color: #fff;
+      }
+    }
+
+    .dropdown-menu {
+      @media (max-width: 991px) {
+        border: none;
+      }
+    }
+
+    .logo {
+      width: 130px;
+    }
+
+    .search-text {
+      color: #ee751b;
+    }
+
+    .renovation-btn {
+      display: block;
+      color: #ee751b;
+      background: #fff;
+      border: 1px solid #ee751b;
+      border-radius: 3px;
+      padding: 10px 20px;
+      margin-left: 50px;
+    }
+  }
+}
+
+.navbar-toggler {
+  border-color: transparent !important;
+
+  &:focus {
+    box-shadow: none;
+  }
+}
+
+.shadow-item {
+  position: absolute;
+  display: none;
+  height: 3px;
+  top: 53px;
+  width: 100vw;
+  right: 0;
+  left: 0;
+  margin: auto;
+  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.15);
+  border-bottom: 1px solid #ccc;
+
+  @media (max-width: 991px) {
+    display: block;
+
+  }
+}
+
+/* Navbar End */
+
+/* Footer Start */
+
+.footer {
+  padding: 3rem;
+  background-color: #f4f4f4;
+  box-shadow: 0 0 20px rgba(0, 0, 0, .2);
+
+  @media (max-width: 767px) {
+    padding: 2rem;
+  }
+
+  @media (max-width: 575px) {
+    padding: 2rem 1rem;
+  }
+
+  h2 {
+    text-align: center;
+    border-top: 1px solid #d1d2d3;
+    margin-top: 50px;
+    padding-top: 30px;
+    color: #707070;
+    font-size: 16px;
+    font-weight: 300;
+    letter-spacing: .05rem;
+    line-height: 1.5;
+  }
+
+  h4 {
+    font-size: 1.375rem;
+    font-weight: 500;
+    color: #797979;
+    text-align: center;
+    margin-bottom: 50px;
+
+    @media (max-width: 991px) {
+      text-align: left;
+      margin-bottom: 20px;
+    }
+  }
+
+  .about-list,
+  .follow-list,
+  .more-list {
+    @media (max-width: 991px) {
+      display: flex;
+      justify-content: center;
+    }
+
+    section {
+      @media (max-width: 991px) {
+        width: 300px;
+      }
+    }
+  }
+
+  .follow-list,
+  .more-list {
+    padding: 0;
+    overflow: hidden;
+    position: relative;
+
+    @media (max-width: 991px) {
+      margin-top: 30px;
+      padding-top: 30px;
+      border-top: 1px solid #989898;
+    }
+  }
+
+  .about-list {
+    a {
+      color: #707070;
+      transition: all .3s;
+
+      &:hover {
+        opacity: .8;
+      }
+    }
+
+    img {
+      width: 20px;
+      height: 20px;
+      margin-right: 7px;
+    }
+
+    ul {
+      letter-spacing: .05em;
+
+      li {
+        margin: 5px 0;
+
+        @media (max-width: 991px) {
+          margin: 0;
+          height: 30px;
+        }
+
+        span {
+          color: #ea068c;
+        }
+      }
+    }
+
+    section {
+      @media (max-width: 991px) {
+        width: 300px;
+      }
+    }
+  }
+
+  .follow-list {
+    .media {
+      display: flex;
+
+      a {
+        display: block;
+        margin: 0 3px;
+        position: relative;
+      }
+
+      .media-item {
+        &.after {
+          position: absolute;
+          top: 0;
+          left: 0;
+          opacity: 0;
+        }
+      }
+    }
+
+    img {
+      width: 45px;
+      height: 45px;
+      margin-right: 5px;
+      transition: all .3s;
+
+      @media (max-width: 1200px) {
+        width: 40px;
+        height: 40px;
+      }
+    }
+  }
+
+  .more-list {
+    a {
+      display: inline-block;
+      margin: 5px;
+      padding-bottom: 5px;
+      color: #797979;
+      border-bottom: 1px solid;
+      transition: all .3s;
+
+      &:hover {
+        opacity: .8;
+      }
+    }
+
+    .subscriber-item {
+      width: 100%;
+      max-width: 300px;
+      margin: auto;
+      display: flex;
+      flex-direction: column;
+      border: 2px solid #34404b;
+
+      &:hover {
+        border: 2px solid #EE7800;
+
+        button {
+          background-color: #EE7800;
+        }
+      }
+
+      input {
+        padding: 10px;
+        border: none;
+
+        &:focus-visible {
+          outline: none;
+        }
+      }
+
+      ::placeholder {
+        text-align: center;
+      }
+
+      button {
+        padding: 15px;
+        border: none;
+        color: #fff;
+        background-color: #34404b;
+        transition: all .1s;
+      }
+
+      .spinner-border {
+        display: none;
+
+        &.show {
+          display: block;
+        }
+      }
+
+      &.input-error {
+        border-color: #ff5252;
+
+        button {
+          background-color: #ff5252;
+        }
+      }
+    }
+
+    .link {
+      max-width: 280px;
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: center;
+
+      @media (max-width: 991px) {
+        max-width: 310px;
+        justify-content: start;
+      }
+    }
+  }
+}
+
+/* Footer End */
+
+/* searchModal Start */
+
+.search-modal {
+  letter-spacing: 1px;
+
+  .modal-dialog {
+    @media (max-width: 991px) {
+      max-width: 100%;
+    }
+  }
+
+  .modal-content {
+    border: none;
+    background: transparent;
+
+    .input-group {
+      height: 50px;
+
+      .input-group-text {
+        display: flex;
+        align-items: center;
+        padding: 0.5rem 2rem !important;
+        margin-bottom: 0;
+        color: #fff;
+        text-align: center;
+        white-space: nowrap;
+        background-color: #ee7800;
+        border: 2px solid #ee7800;
+        line-height: 1.5;
+        border-radius: 0.3rem;
+        cursor: pointer;
+      }
+    }
+  }
+
+  .keyword-list {
+    display: flex;
+    align-items: center;
+    padding: 0 20px;
+
+    ul {
+      margin: 0;
+      padding: 0;
+      display: flex;
+      flex-wrap: wrap;
+      color: #fff;
+
+      li {
+        margin: 5px 10px 5px 0;
+        cursor: pointer;
+        transition: all 0.3s;
+
+        &:hover {
+          opacity: 0.8;
+        }
+      }
+    }
+
+    span {
+      color: #fff;
+      margin-right: 10px;
+    }
+  }
+}
+
+.modal-backdrop.show {
+  opacity: 0.7 !important;
+}
+
+/* searchModal End */

css/lists.css

@@ -17,9 +17,20 @@
 .search-card .search-bar-keyword {
   font-size: 14px;
 }
+@media (max-width: 575px) {
+  .search-card .search-bar-keyword p {
+    min-width: 75px;
+    margin-top: 3px;
+  }
+}
 .search-card .search-bar-keyword li {
   margin-right: 15px;
 }
+@media (max-width: 575px) {
+  .search-card .search-bar-keyword li {
+    margin: 3px 10px 3px 0;
+  }
+}
 .search-card .form-control {
   font-size: 0.875rem;
   border: 2px solid #EE7800;
@@ -83,31 +94,57 @@
   font-size: 14px;
 }
 .filter-list .designer-card .person-img {
-  width: 80px;
+  width: 100%;
   height: 80px;
+  max-width: 80px;
   background-size: cover;
   background-position: top;
   border-radius: 50%;
   box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.15);
 }
+@media (max-width: 991px) {
+  .filter-list .designer-card .person-img {
+    height: 70px;
+    max-width: 70px;
+  }
+}
+@media (max-width: 767px) {
+  .filter-list .designer-card .person-img {
+    height: 80px;
+    max-width: 80px;
+  }
+}
 .filter-list .designer-card .cover-img {
   height: 235px;
   -o-object-fit: cover;
      object-fit: cover;
 }
+@media (max-width: 991px) {
+  .filter-list .designer-card .cover-img {
+    height: 160px;
+  }
+}
+@media (max-width: 767px) {
+  .filter-list .designer-card .cover-img {
+    height: 235px;
+  }
+}
 .filter-list .designer-card .card-body section {
   width: 70%;
 }
-.filter-list .designer-card .card-body h5 {
+.filter-list .designer-card .card-body h5,
+.filter-list .designer-card .card-body h6 {
+  line-height: 1.25;
+  font-size: 0.875rem;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
-  -webkit-line-clamp: 1;
-  line-height: 1.25;
+}
+.filter-list .designer-card .card-body h5 {
   height: 1.09375rem;
-  font-size: 0.875rem;
+  -webkit-line-clamp: 1;
 }
 .filter-list .designer-card .card-body h6 {
-  font-size: 0.875rem;
+  -webkit-line-clamp: 2;
 }/*# sourceMappingURL=lists.css.map */

css/lists.css.map

@@ -1 +1 @@
-{"version":3,"sources":["lists.css","lists.scss"],"names":[],"mappings":"AAAA,gBAAgB;ACAhB,YAAA;AAEA;EACE,kBAAA;EACA,gBAAA;EACA,qBAAA;ADCF;;ACEA;EACE,eAAA;EACA,gBAAA;ADCF;;ACGE;EACE,cAAA;ADAJ;ACGE;EACE,eAAA;ADDJ;ACGI;EACE,kBAAA;ADDN;ACKE;EACE,mBAAA;EACA,yBAAA;ADHJ;ACME;EACE,kBAAA;EACA,WAAA;EACA,gBAAA;EACA,mBAAA;EACA,kBAAA;EACA,yBAAA;EACA,yBAAA;EACA,kCAAA;ADJJ;;ACSE;EACE,aAAA;EACA,mBAAA;ADNJ;ACSE;EACE,iBAAA;ADPJ;ACUE;EACE,YAAA;EACA,qBAAA;EACA,uBAAA;ADRJ;ACUI;EACE,cAAA;EACA,qBAAA;ADRN;ACWI;EACE,cAAA;EACA,qBAAA;ADTN;ACaE;EACE,UAAA;EACA,gBAAA;EACA,iBAAA;EACA,gBAAA;ADXJ;ACaI;EACE,wBAAA;EACA,6CAAA;ADXN;ACaM;;EAEE,eAAA;ADXR;ACiBI;EACE,YAAA;EACA,uBAAA;ADfN;ACiBM;EACE,cAAA;ADfR;ACkBM;EACE,cAAA;ADhBR;ACqBE;EACE,eAAA;ADnBJ;ACuBI;EACE,WAAA;EACA,YAAA;EACA,sBAAA;EACA,wBAAA;EACA,kBAAA;EACA,iDAAA;ADrBN;ACwBI;EACE,aAAA;EACA,oBAAA;KAAA,iBAAA;ADtBN;AC0BM;EACE,UAAA;ADxBR;AC2BM;EACE,4BAAA;EACA,gBAAA;EACA,uBAAA;EACA,oBAAA;EACA,qBAAA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;ADzBR;AC4BM;EACE,mBAAA;AD1BR","file":"lists.css"}
+{"version":3,"sources":["lists.css","lists.scss"],"names":[],"mappings":"AAAA,gBAAgB;ACAhB,YAAA;AAEA;EACE,kBAAA;EACA,gBAAA;EACA,qBAAA;ADCF;;ACEA;EACE,eAAA;EACA,gBAAA;ADCF;;ACGE;EACE,cAAA;ADAJ;ACGE;EACE,eAAA;ADDJ;ACIM;EADF;IAEI,eAAA;IACA,eAAA;EDDN;AACF;ACII;EACE,kBAAA;ADFN;ACIM;EAHF;IAII,sBAAA;EDDN;AACF;ACKE;EACE,mBAAA;EACA,yBAAA;ADHJ;ACME;EACE,kBAAA;EACA,WAAA;EACA,gBAAA;EACA,mBAAA;EACA,kBAAA;EACA,yBAAA;EACA,yBAAA;EACA,kCAAA;ADJJ;;ACSE;EACE,aAAA;EACA,mBAAA;ADNJ;ACSE;EACE,iBAAA;ADPJ;ACUE;EACE,YAAA;EACA,qBAAA;EACA,uBAAA;ADRJ;ACUI;EACE,cAAA;EACA,qBAAA;ADRN;ACWI;EACE,cAAA;EACA,qBAAA;ADTN;ACaE;EACE,UAAA;EACA,gBAAA;EACA,iBAAA;EACA,gBAAA;ADXJ;ACaI;EACE,wBAAA;EACA,6CAAA;ADXN;ACaM;;EAEE,eAAA;ADXR;ACiBI;EACE,YAAA;EACA,uBAAA;ADfN;ACiBM;EACE,cAAA;ADfR;ACkBM;EACE,cAAA;ADhBR;ACqBE;EACE,eAAA;ADnBJ;ACuBI;EACE,WAAA;EACA,YAAA;EACA,eAAA;EACA,sBAAA;EACA,wBAAA;EACA,kBAAA;EACA,iDAAA;ADrBN;ACuBM;EATF;IAUI,YAAA;IACA,eAAA;EDpBN;AACF;ACsBM;EAdF;IAeI,YAAA;IACA,eAAA;EDnBN;AACF;ACsBI;EACE,aAAA;EACA,oBAAA;KAAA,iBAAA;ADpBN;ACsBM;EAJF;IAKI,aAAA;EDnBN;AACF;ACqBM;EARF;IASI,aAAA;EDlBN;AACF;ACsBM;EACE,UAAA;ADpBR;ACuBM;;EAEE,iBAAA;EACA,mBAAA;EAEA,4BAAA;EACA,gBAAA;EACA,uBAAA;EACA,oBAAA;ADtBR;ACyBM;EACE,kBAAA;EACA,qBAAA;ADvBR;AC0BM;EACE,qBAAA;ADxBR","file":"lists.css"}

css/lists.scss

@@ -19,8 +19,19 @@
   .search-bar-keyword {
     font-size: 14px;
 
+    p {
+      @media (max-width: 575px) {
+        min-width: 75px;
+        margin-top: 3px;
+      }
+    }
+
     li {
       margin-right: 15px;
+
+      @media (max-width: 575px) {
+        margin: 3px 10px 3px 0;
+      }
     }
   }
 
@@ -105,17 +116,36 @@
 
   .designer-card {
     .person-img {
-      width: 80px;
+      width: 100%;
       height: 80px;
+      max-width: 80px;
       background-size: cover;
       background-position: top;
       border-radius: 50%;
       box-shadow: 2px 2px 10px -2px rgba(0, 0, 0, 0.15);
+
+      @media (max-width: 991px) {
+        height: 70px;
+        max-width: 70px;
+      }
+
+      @media (max-width: 767px) {
+        height: 80px;
+        max-width: 80px;
+      }
     }
 
     .cover-img {
       height: 235px;
       object-fit: cover;
+
+      @media (max-width: 991px) {
+        height: 160px;
+      }
+
+      @media (max-width: 767px) {
+        height: 235px;
+      }
     }
 
     .card-body {
@@ -123,19 +153,24 @@
         width: 70%;
       }
 
-      h5 {
+      h5,
+      h6 {
+        line-height: 1.25;
+        font-size: 0.875rem;
+        // 換行
         -webkit-box-orient: vertical;
         overflow: hidden;
         text-overflow: ellipsis;
         display: -webkit-box;
-        -webkit-line-clamp: 1;
-        line-height: 1.25;
+      }
+
+      h5 {
         height: 1.09375rem;
-        font-size: 0.875rem;
+        -webkit-line-clamp: 1;
       }
 
       h6 {
-        font-size: 0.875rem;
+        -webkit-line-clamp: 2;
       }
     }
   }

designers/lists/index.html

@@ -115,7 +115,37 @@
 </head>
 
 <body>
-
+  <!-- 動態載入 -->
+  <div id="navbar"></div>
+
+  <!-- searchModal -->
+  <div class="modal fade search-modal" id="searchModal" tabindex="-1" aria-labelledby="searchModalLabel"
+    aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered modal-lg">
+      <div class="modal-content">
+        <div class="modal-body">
+          <div class="input-group">
+            <input type="text" class="form-control keyword" placeholder="請輸入關鍵字" aria-label="Please enter keywords"
+              aria-describedby="search-input" />
+            <span class="input-group-text" id="search-input">全站搜尋</span>
+          </div>
+        </div>
+        <section class="keyword-list">
+          <span>熱搜關鍵字：</span>
+          <ul>
+            <li>客變</li>
+            <li>小坪數</li>
+            <li>老屋翻新</li>
+            <li>收納</li>
+            <li>軟裝佈置</li>
+            <li>新手裝修</li>
+            <li>風水</li>
+            <li>北歐風</li>
+          </ul>
+        </section>
+      </div>
+    </div>
+  </div>
 
   <div class="container d-flex flex-column align-items-center justify-content-center list-content">
     <h2 class="list-headline">全國室內設計師推薦</h2>
@@ -129,13 +159,13 @@
               <input type="text" placeholder="請輸入關鍵字" aria-label="請輸入關鍵字" aria-describedby="searchbar"
                 class="form-control border-primary keywords" autocomplete="off">
               <div class="input-group-append">
-                <button type="button" data-ga="View_Search_Results" class="input-group-text">搜尋</button>
+                <button onclick="designerSearch()" type="button" data-ga="View_Search_Results" class="input-group-text">搜尋</button>
               </div>
             </div>
 
             <div class="search-bar-keyword d-flex mt-3 pl-4">
               <p>熱搜關鍵字</p>
-              <ul class="d-flex ps-3">
+              <ul class="d-flex flex-wrap ps-3">
                 <li>
                   <a href="javascript:void(0)" data-ga="Click_Promo_Keyword">客變</a>
                 </li>
@@ -905,11 +935,14 @@
             </ul>
           </nav>
         </div>
-
       </div>
     </div>
   </div>
 
+  <!-- 動態載入 -->
+  <div id="btn-box"></div>
+  <div id="footer" class="d-none d-lg-block"></div>
+
   <!-- jQuery -->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
   <!-- Bootstrap -->
@@ -921,7 +954,7 @@
     crossorigin="anonymous"></script>
   <script src="./js/main.js"></script>
   <script>
-    // // $('#navbar').load('../hhh_index/template/nav-new.html');
+    // $('#navbar').load('../../template/navbar.html');
 
     // $('#removeResultBtn').hide(); // 隱藏全部清除按鈕
 

designers/lists/js/main.js

@@ -1,4 +1,9 @@
-// $('#navbar').load('../hhh_index/template/nav-new.html');
+// $( document ).ready(function() {
+// });
+
+// 載入共用 template
+$('#navbar').load('../../template/navbar.html');
+$('#footer').load('../../template/footer.html');
 
 $('#removeResultBtn').hide(); // 隱藏全部清除按鈕
 
@@ -93,8 +98,6 @@ function createFilterHtml(item) {
 let page = 1; // 當前頁數
 let pageSize = 18; // 每頁數量
 
-let keywordsVal = ""; // 熱搜關鍵字
-
 // 列表篩選
 async function designerSearch(type = "") {
   // 預設排序為 recommend
@@ -105,9 +108,12 @@ async function designerSearch(type = "") {
   if (type === "order_by") {
     url += `&${type}=${assignOrder}`
   }
-  console.log('keywordsVal', keywordsVal);
-  if (keywordsVal !== "") {
-    url += `&keyword=${keywordsVal}`
+
+  let input = $(".keywords").val();
+  console.log('input', input);
+
+  if (input !== "") {
+    url += `&keyword=${input}`
   }
 
   if (filterList.length) {
@@ -165,7 +171,7 @@ async function designerSearch(type = "") {
             <div class="card designer-card">
               <img src="${item.CaseCoverImg}" class="cover-img" alt="${item.DesignerName} ${item.DesignerTitle}">
                 <div class="card-body d-flex align-items-center">
-                  <div class="person-img me-3" style="background-image: url('${item.DesignerCoverImg}');"></div>
+                  <div class="person-img me-3 me-md-2 me-lg-3" style="background-image: url('${item.DesignerCoverImg}');"></div>
                   <section>
                     <h5 class="card-text text-muted mb-2">${item.DesignerTitle}</h5>
                     <h6 class="card-title mb-0 text-dark">
@@ -192,43 +198,122 @@ async function designerSearch(type = "") {
 
 designerSearch();
 
+let maxPagesMobile = 5; // 手機板最多顯示 5 頁
+let maxPagesDesktop = 10; // 電腦版最多顯示 10 頁
+
 // 分頁
 function setPagination(pages) {
-  // 往前一頁
-  let dom = `
-    <li class="page-item" onclick="handlePagination(this, 'previous')">
-      <a class="page-link previous" href="#" aria-label="Previous">
-        <span aria-hidden="true">＜</span>
-      </a>
-    </li>`;
+  let screenWidth = $(window).width();
+  let maxPages = screenWidth > 991 ? maxPagesDesktop : maxPagesMobile;
+
+  function renderPagination(currentPage) {
+    let dom = `
+      <li class="page-item" onclick="handlePagination(this, 'previous')">
+        <a class="page-link previous hidden" href="#" aria-label="Previous">
+          <span aria-hidden="true">＜</span>
+        </a>
+      </li>`;
+
+    let startPage = Math.max(currentPage - Math.floor(maxPages / 2), 1);
+    let endPage = Math.min(startPage + maxPages - 1, pages);
+
+    if (endPage - startPage < maxPages) {
+      startPage = Math.max(endPage - maxPages + 1, 1);
+    }
+
+    for (let index = startPage; index <= endPage; index++) {
+      dom += `
+        <li class="page-item ${index === currentPage ? 'active' : ''}" onclick="handlePagination(this)">
+          <a class="page-link" href="#">${index}</a>
+        </li>`;
+    }
 
-  for (let index = 0; index < pages; index++) {
     dom += `
-      <li class="page-item" onclick="handlePagination(this)">
-        <a class="page-link" href="#">${index + 1}</a>
+      <li class="page-item" onclick="handlePagination(this, 'next')">
+        <a class="page-link next" href="#" aria-label="Next">
+          <span aria-hidden="true">＞</span>
+        </a>
       </li>`;
+
+    $('.filter-list .pagination').html(dom);
+    updateVisibility(currentPage, pages);
   }
 
-  // 往後一頁
-  dom += `
-    <li class="page-item" onclick="handlePagination(this, 'next')">
-      <a class="page-link next" href="#" aria-label="Next">
-        <span aria-hidden="true">＞</span>
-      </a>
-    </li>`;
+   // 更新上頁 & 下頁的按鈕顯示狀態
+  function updateVisibility(page, pages) {
+    if (page === 1) {
+      $('.page-link.previous').addClass('hidden');
+    } else {
+      $('.page-link.previous').removeClass('hidden');
+    }
 
-  $('.filter-list .pagination').html(dom);
-  $('.filter-list .page-item').removeClass('active');
-  $('.filter-list .page-item').eq(page).addClass('active'); // 當前頁數加上選取狀態
+    if (page === pages) {
+      $('.page-link.next').addClass('hidden');
+    } else {
+      $('.page-link.next').removeClass('hidden');
+    }
+  }
 
-  // 設定上一頁按鈕的顯示狀態
-  if (page === 1) {
-    $('.page-link.previous').addClass('hidden');
-  } else {
-    $('.page-link.previous').removeClass('hidden');
+  window.handlePagination = function(item, type = "") {
+    if (type === "previous" && page > 1) {
+      page--;
+    } else if (type === "next" && page < pages) {
+      page++;
+    } else if (!type) {
+      page = parseInt($(item).find('.page-link').text());
+    }
+    renderPagination(page);
+    designerSearch();
   }
+
+  renderPagination(page);
+
+  $(window).on('resize', function() {
+    let newScreenWidth = $(window).width();
+    if ((newScreenWidth > 991 && maxPages !== maxPagesDesktop) || 
+        (newScreenWidth <= 991 && maxPages !== maxPagesMobile)) {
+      maxPages = newScreenWidth > 991 ? maxPagesDesktop : maxPagesMobile;
+      renderPagination(page);
+    }
+  });
 }
 
+// function setPagination(pages) {
+//   // 往前一頁
+//   let dom = `
+//     <li class="page-item" onclick="handlePagination(this, 'previous')">
+//       <a class="page-link previous" href="#" aria-label="Previous">
+//         <span aria-hidden="true">＜</span>
+//       </a>
+//     </li>`;
+
+//   for (let index = 0; index < pages; index++) {
+//     dom += `
+//       <li class="page-item" onclick="handlePagination(this)">
+//         <a class="page-link" href="#">${index + 1}</a>
+//       </li>`;
+//   }
+
+//   // 往後一頁
+//   dom += `
+//     <li class="page-item" onclick="handlePagination(this, 'next')">
+//       <a class="page-link next" href="#" aria-label="Next">
+//         <span aria-hidden="true">＞</span>
+//       </a>
+//     </li>`;
+
+//   $('.filter-list .pagination').html(dom);
+//   $('.filter-list .page-item').removeClass('active');
+//   $('.filter-list .page-item').eq(page).addClass('active'); // 當前頁數加上選取狀態
+
+//   // 設定上一頁按鈕的顯示狀態
+//   if (page === 1) {
+//     $('.page-link.previous').addClass('hidden');
+//   } else {
+//     $('.page-link.previous').removeClass('hidden');
+//   }
+// }
+
 // 頁碼處理
 function handlePagination(item, type = "") {
   if (type === "previous") {
@@ -276,6 +361,5 @@ $(".search-btn-filter button").click(function () {
 $(".search-bar-keyword a").click(function () {
   let keyword = $(this).text();
   $('.keywords').val(keyword);
-  keywordsVal = keyword;
   designerSearch();
 });

img/icon/bag-shopping-solid.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M160 112c0-35.3 28.7-64 64-64s64 28.7 64 64v48H160V112zm-48 48H48c-26.5 0-48 21.5-48 48V416c0 53 43 96 96 96H352c53 0 96-43 96-96V208c0-26.5-21.5-48-48-48H336V112C336 50.1 285.9 0 224 0S112 50.1 112 112v48zm24 48a24 24 0 1 1 0 48 24 24 0 1 1 0-48zm152 24a24 24 0 1 1 48 0 24 24 0 1 1 -48 0z"/></svg>

img/icon/calculator_request.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="26.327" height="26.318" viewBox="0 0 26.327 26.318">
+  <g id="Group_843" data-name="Group 843" transform="translate(-2232.393 -898)">
+    <path id="Path_3985" data-name="Path 3985" d="M21.5,19.5H12" transform="translate(2226.25 889.5)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_3986" data-name="Path 3986" d="M21.5,25.5H12" transform="translate(2226.25 878.75)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_3984" data-name="Path 3984" d="M16.75,13.5H12" transform="translate(2226.25 900.25)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_3987" data-name="Path 3987" d="M14.375,13.5H12" transform="translate(2226.25 905)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <g id="Group_842" data-name="Group 842" transform="translate(245 -2.664)">
+      <path id="Path_3979" data-name="Path 3979" d="M17.467,30.318H7.73A1.73,1.73,0,0,1,6,28.588V7.73A1.73,1.73,0,0,1,7.73,6h15.4a1.73,1.73,0,0,1,1.73,1.73V19.057" transform="translate(1982.393 895.664)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-width="2"/>
+      <path id="Path_3980" data-name="Path 3980" d="M212.846,205.423h-.108a5.578,5.578,0,1,0,2.477.58" transform="translate(1794.404 709.3)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-width="2"/>
+      <path id="Path_3983" data-name="Path 3983" d="M271.519,256.169a2.042,2.042,0,0,0-1.418-.7,1.435,1.435,0,0,0-1.559,1.325c0,.976,1.488,1.13,1.488,1.13s1.64.043,1.64,1.3c0,1.1-1.481,1.054-1.481,1.054a2.015,2.015,0,0,1-1.43-.516" transform="translate(1737.04 662.525)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-width="1.8"/>
+      <line id="Line_86" data-name="Line 86" y1="0.836" transform="translate(2007.142 917.163)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-width="1.8"/>
+      <line id="Line_87" data-name="Line 87" y2="0.988" transform="translate(2007.142 922.811)" fill="none" stroke="#acacac" stroke-linecap="round" stroke-width="1.8"/>
+    </g>
+  </g>
+</svg>

img/icon/feather-briefcase.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22.638" height="20.574" viewBox="0 0 22.638 20.574">
+  <g id="Icon_feather-briefcase" data-name="Icon feather-briefcase" transform="translate(-2 -3.5)">
+    <path id="Path_31" data-name="Path 31" d="M5.064,10.5h16.51a2.064,2.064,0,0,1,2.064,2.064V22.883a2.064,2.064,0,0,1-2.064,2.064H5.064A2.064,2.064,0,0,1,3,22.883V12.564A2.064,2.064,0,0,1,5.064,10.5Z" transform="translate(0 -1.872)" fill="none" stroke="#34404b" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_32" data-name="Path 32" d="M20.255,23.074V6.564A2.064,2.064,0,0,0,18.191,4.5H14.064A2.064,2.064,0,0,0,12,6.564v16.51" transform="translate(-2.809)" fill="none" stroke="#34404b" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+  </g>
+</svg>

img/icon/feather-chevron-right.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20.828" height="11.414" viewBox="0 0 20.828 11.414">
+  <path id="Icon_feather-chevron-right" data-name="Icon feather-chevron-right" d="M13.5,27l9-9-9-9" transform="translate(-7.586 23.5) rotate(-90)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+</svg>

img/icon/feather-file-text.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="21" height="25.75" viewBox="0 0 21 25.75">
+  <g id="Icon_feather-file-text" data-name="Icon feather-file-text" transform="translate(-5 -2)">
+    <path id="Path_33" data-name="Path 33" d="M17.875,3h-9.5A2.375,2.375,0,0,0,6,5.375v19A2.375,2.375,0,0,0,8.375,26.75h14.25A2.375,2.375,0,0,0,25,24.375V10.125Z" transform="translate(0)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_34" data-name="Path 34" d="M21,3v7.125h7.125" transform="translate(-3.125)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_35" data-name="Path 35" d="M21.5,19.5H12" transform="translate(-1.25 -3.438)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_36" data-name="Path 36" d="M21.5,25.5H12" transform="translate(-1.25 -4.688)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path id="Path_37" data-name="Path 37" d="M14.375,13.5H12" transform="translate(-1.25 -2.188)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+  </g>
+</svg>

img/icon/feather-shopping-cart.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="25.737" height="25.158" viewBox="0 0 25.737 25.158">
+  <g id="Icon_feather-shopping-cart" data-name="Icon feather-shopping-cart" transform="translate(-0.5 -0.5)">
+    <path id="Path_40" data-name="Path 40" d="M14.158,31.079A1.079,1.079,0,1,1,13.079,30,1.079,1.079,0,0,1,14.158,31.079Z" transform="translate(-2.947 -8)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
+    <path id="Path_41" data-name="Path 41" d="M30.658,31.079A1.079,1.079,0,1,1,29.579,30,1.079,1.079,0,0,1,30.658,31.079Z" transform="translate(-7.579 -8)" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
+    <path id="Path_42" data-name="Path 42" d="M1.5,1.5H5.816L8.708,15.947a2.158,2.158,0,0,0,2.158,1.737H21.353a2.158,2.158,0,0,0,2.158-1.737l1.726-9.053H6.895" fill="none" stroke="#989898" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+  </g>
+</svg>

img/icon/ionic-ios-calculator.svg

@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="26.327" height="26.318" viewBox="0 0 26.327 26.318">
+  <g id="Group_842" data-name="Group 842" transform="translate(-1987.393 -900.664)">
+    <path id="Path_3979" data-name="Path 3979" d="M17.467,30.318H7.73A1.73,1.73,0,0,1,6,28.588V7.73A1.73,1.73,0,0,1,7.73,6h15.4a1.73,1.73,0,0,1,1.73,1.73V19.057" transform="translate(1982.393 895.664)" fill="none" stroke="#989898" stroke-linecap="round" stroke-width="2"/>
+    <path id="Path_3980" data-name="Path 3980" d="M212.846,205.423h-.108a5.578,5.578,0,1,0,2.477.58" transform="translate(1794.404 709.3)" fill="none" stroke="#989898" stroke-linecap="round" stroke-width="2"/>
+    <path id="Path_3981" data-name="Path 3981" d="M54.58,45.582H45.349a.745.745,0,0,1-.745-.745V42.263a.745.745,0,0,1,.745-.745H55.919a.745.745,0,0,1,.745.745v.806" transform="translate(1947.217 863.004)" fill="none" stroke="#989898" stroke-linecap="round" stroke-width="1.8"/>
+    <rect id="Rectangle_2013" data-name="Rectangle 2013" width="3.237" height="2.65" rx="1.325" transform="translate(1990.921 910.964)" fill="#989898"/>
+    <rect id="Rectangle_2014" data-name="Rectangle 2014" width="3.237" height="2.65" rx="1.325" transform="translate(1996.253 910.964)" fill="#989898"/>
+    <rect id="Rectangle_2015" data-name="Rectangle 2015" width="3.237" height="2.65" rx="1.325" transform="translate(1990.921 915.942)" fill="#989898"/>
+    <rect id="Rectangle_2016" data-name="Rectangle 2016" width="3.237" height="2.65" rx="1.325" transform="translate(1996.253 915.942)" fill="#989898"/>
+    <rect id="Rectangle_2017" data-name="Rectangle 2017" width="3.237" height="2.65" rx="1.325" transform="translate(1990.921 920.97)" fill="#989898"/>
+    <rect id="Rectangle_2018" data-name="Rectangle 2018" width="3.237" height="2.65" rx="1.325" transform="translate(1996.253 920.97)" fill="#989898"/>
+    <rect id="Rectangle_2019" data-name="Rectangle 2019" width="3.237" height="2.65" rx="1.325" transform="translate(2001.544 910.964)" fill="#989898"/>
+    <path id="Path_3983" data-name="Path 3983" d="M271.519,256.169a2.042,2.042,0,0,0-1.418-.7,1.435,1.435,0,0,0-1.559,1.325c0,.976,1.488,1.13,1.488,1.13s1.64.043,1.64,1.3c0,1.1-1.481,1.054-1.481,1.054a2.015,2.015,0,0,1-1.43-.516" transform="translate(1737.04 662.525)" fill="none" stroke="#989898" stroke-linecap="round" stroke-width="1.8"/>
+    <line id="Line_86" data-name="Line 86" y1="0.836" transform="translate(2007.142 917.163)" fill="none" stroke="#989898" stroke-linecap="round" stroke-width="1.8"/>
+    <line id="Line_87" data-name="Line 87" y2="0.988" transform="translate(2007.142 922.811)" fill="none" stroke="#989898" stroke-linecap="round" stroke-width="1.8"/>
+  </g>
+</svg>

img/icon/ionic-ios-search.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="18.469" height="18.474" viewBox="0 0 18.469 18.474">
+  <path id="Icon_ionic-ios-search" data-name="Icon ionic-ios-search" d="M22.753,21.63l-5.137-5.185a7.32,7.32,0,1,0-1.111,1.125l5.1,5.151a.79.79,0,0,0,1.116.029A.8.8,0,0,0,22.753,21.63Zm-10.889-4a5.78,5.78,0,1,1,4.088-1.693A5.745,5.745,0,0,1,11.864,17.633Z" transform="translate(-4.5 -4.493)" fill="#34404b"/>
+</svg>

img/icon/material-people.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16.763" height="16.763" viewBox="0 0 16.763 16.763">
+  <path id="Icon_material-people" data-name="Icon material-people" d="M9.881,14.684a3.592,3.592,0,1,0-3.592-3.592A3.577,3.577,0,0,0,9.881,14.684Zm0,2.395c-2.79,0-8.381,1.4-8.381,4.191v2.993H18.263V21.269C18.263,18.48,12.671,17.079,9.881,17.079Z" transform="translate(-1.5 -7.5)" fill="#34404b"/>
+</svg>

img/icon/material-play-circle-outline.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="79.618" height="79.618" viewBox="0 0 79.618 79.618">
+  <defs>
+    <filter id="Icon_material-play-circle-outline" x="0" y="0" width="79.618" height="79.618" filterUnits="userSpaceOnUse">
+      <feOffset dy="3" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feFlood flood-opacity="0.502"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+  </defs>
+  <g transform="matrix(1, 0, 0, 1, 0, 0)" filter="url(#Icon_material-play-circle-outline)">
+    <path id="Icon_material-play-circle-outline-2" data-name="Icon material-play-circle-outline" d="M27.647,47.673,46.132,33.809,27.647,19.945ZM33.809,3A30.809,30.809,0,1,0,64.618,33.809,30.82,30.82,0,0,0,33.809,3Zm0,55.456A24.647,24.647,0,1,1,58.456,33.809,24.68,24.68,0,0,1,33.809,58.456Z" transform="translate(6 3)" fill="#fff" opacity="0.803"/>
+  </g>
+</svg>

img/icon/simple-hipchat.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="21.498" height="20.087" viewBox="0 0 21.498 20.087">
+  <path id="Icon_simple-hipchat" data-name="Icon simple-hipchat" d="M17.679,17.545s.092-.065.239-.177a8.759,8.759,0,0,0,3.58-6.914c0-5.119-4.813-9.273-10.746-9.273S0,5.334,0,10.453,4.811,19.73,10.747,19.73a12.327,12.327,0,0,0,2.261-.2l.235-.04a11.188,11.188,0,0,0,5.633,1.783.577.577,0,0,0,.494-.989,10.88,10.88,0,0,1-1.691-2.734Zm-1.31-4.054a6.948,6.948,0,0,1-5.6,2.588h-.041a6.957,6.957,0,0,1-5.6-2.588,1.018,1.018,0,0,1-.245-.514.439.439,0,0,1,.4-.471.048.048,0,0,1,.019,0,.563.563,0,0,1,.294.1,8.185,8.185,0,0,0,5.154,1.842,7.887,7.887,0,0,0,5.16-1.844.413.413,0,0,1,.28-.109.432.432,0,0,1,.433.425,1.183,1.183,0,0,1-.24.576h-.01Z" transform="translate(0 -1.181)" fill="#989898"/>
+</svg>

img/media/fb.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
+<title>f</title><g id="圖層_2" data-name="圖層 2">
+<g id="圖層_1-2" data-name="圖層 1"><g id="Community">
+<g id="f"><circle id="Ellipse_8" data-name="Ellipse 8" cx="24" cy="24" r="24" style="fill:#d1d2d3"/>
+<path id="f-2" d="M26.45,17.81H29V14H26c-3.67.14-4.42,2.21-4.5,4.38h0v1.9H19V24h2.5V34h3.77V24h3.08l.6-3.73H25.27V19.12a1.22,1.22,0,0,1,1.13-1.31Z" style="fill:#fff"/></g></g></g></g></svg>

img/media/fb_h.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>f_h</title><g id="圖層_2" data-name="圖層 2"><g id="圖層_1-2" data-name="圖層 1"><g id="Community_hover" data-name="Community hover"><g id="f"><circle id="Ellipse_8" data-name="Ellipse 8" cx="24" cy="24" r="24" style="fill:#3b5998"/><path id="f-2" d="M26.45,17.81H29V14H26c-3.67.14-4.42,2.21-4.5,4.38h0v1.9H19V24h2.5V34h3.77V24h3.08l.6-3.73H25.27V19.12a1.22,1.22,0,0,1,1.13-1.31Z" style="fill:#fff"/></g></g></g></g></svg>

img/media/ig.svg

@@ -0,0 +1,4 @@
+<svg id="instagram" xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
+  <circle id="Ellipse_11" data-name="Ellipse 11" cx="24" cy="24" r="24" fill="#d1d2d3"/>
+  <path id="Path_2808" data-name="Path 2808" d="M17.79,0H2.72A2.44,2.44,0,0,0,0,2.74V17.81A2.41,2.41,0,0,0,2.63,20.5H17.79a2.45,2.45,0,0,0,2.71-2.72V2.69A2.43,2.43,0,0,0,17.79,0ZM16.13,2.32c2,0,2,0,2,2s0,2-2,2-2,0-2-2S14.15,2.32,16.13,2.32Zm-5.87,4a4,4,0,1,1-4,3.93,4.06,4.06,0,0,1,4-3.98Zm7.9,10.67c0,1-.27,1.23-1.22,1.23H3.55c-.94,0-1.2-.27-1.2-1.23V9.52c0-.7.2-.87.85-.84.94.07,1,0,.85.94A6.3,6.3,0,1,0,16.5,9.14c-.07-.37,0-.43.34-.43,1.41-.1,1.41-.13,1.41,1.33Z" transform="translate(14.021 14.019)" fill="#fcfcfc" fill-rule="evenodd"/>
+</svg>

img/media/ln.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>line</title><g id="圖層_2" data-name="圖層 2"><g id="圖層_1-2" data-name="圖層 1"><g id="Community"><g id="line"><circle id="Ellipse_13" data-name="Ellipse 13" cx="24" cy="24" r="24" style="fill:#d1d2d3"/><g id="line-2"><path id="Path_2248" data-name="Path 2248" d="M36.12,23.85a5.83,5.83,0,0,0,.1-.73c0-.31,0-.63,0-.94-.29-5.11-5.6-9.18-12.1-9.18C17.42,13,12,17.31,12,22.63c0,4.89,4.58,8.93,10.52,9.55a.65.65,0,0,1,.58.72h0l-.25,2.28a.66.66,0,0,0,.58.73.65.65,0,0,0,.36-.07c5-2.42,8-4.9,9.8-7.06a26.22,26.22,0,0,0,1.6-2.27A8.11,8.11,0,0,0,36.12,23.85Z" style="fill:#fff"/><path id="Path_2249" data-name="Path 2249" d="M17.45,24.58v-4a.62.62,0,0,0-.62-.62h0a.62.62,0,0,0-.62.62h0V25.2a.62.62,0,0,0,.62.62h2.48a.62.62,0,0,0,.62-.62h0a.62.62,0,0,0-.62-.62H17.45Z" style="fill:#aaa"/><path id="Path_2250" data-name="Path 2250" d="M21.27,25.82H21a.47.47,0,0,1-.48-.48V20.39a.47.47,0,0,1,.48-.48h.27a.48.48,0,0,1,.49.48v4.95A.48.48,0,0,1,21.27,25.82Z" style="fill:#aaa"/><path id="Path_2251" data-name="Path 2251" d="M26.28,20.53v2.85s-2.48-3.22-2.51-3.27a.66.66,0,0,0-.49-.2.64.64,0,0,0-.6.64V25.2a.62.62,0,0,0,.62.62h0a.62.62,0,0,0,.62-.62h0V22.36s2.51,3.26,2.55,3.29a.59.59,0,0,0,.42.17.64.64,0,0,0,.62-.64V20.52a.61.61,0,0,0-.62-.61h0A.61.61,0,0,0,26.28,20.53Z" style="fill:#aaa"/><path id="Path_2252" data-name="Path 2252" d="M32.16,20.53h0a.61.61,0,0,0-.62-.62H29.07a.61.61,0,0,0-.62.62h0V25.2a.62.62,0,0,0,.62.62h2.47a.62.62,0,0,0,.62-.62h0a.62.62,0,0,0-.62-.62H29.69v-1.1h1.85a.61.61,0,0,0,.62-.62h0a.61.61,0,0,0-.62-.61H29.69v-1.1h1.85a.62.62,0,0,0,.62-.62Z" style="fill:#aaa"/></g></g></g></g></g></svg>

img/media/ln_h.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>l_h</title><g id="圖層_2" data-name="圖層 2"><g id="圖層_1-2" data-name="圖層 1"><g id="Community_hover" data-name="Community hover"><g id="line"><circle id="Ellipse_13" data-name="Ellipse 13" cx="24" cy="24" r="24" style="fill:#00c200"/><g id="line-2"><path id="Path_2248" data-name="Path 2248" d="M36.12,23.85a5.83,5.83,0,0,0,.1-.73c0-.31,0-.63,0-.94-.29-5.11-5.6-9.18-12.1-9.18C17.42,13,12,17.31,12,22.63c0,4.89,4.58,8.93,10.52,9.55a.65.65,0,0,1,.58.72h0l-.25,2.28a.66.66,0,0,0,.58.73.65.65,0,0,0,.36-.07c5-2.42,8-4.9,9.8-7.06a26.22,26.22,0,0,0,1.6-2.27A8.11,8.11,0,0,0,36.12,23.85Z" style="fill:#fff"/><path id="Path_2249" data-name="Path 2249" d="M17.45,24.58v-4a.62.62,0,0,0-.62-.62h0a.62.62,0,0,0-.62.62h0V25.2a.62.62,0,0,0,.62.62h2.48a.62.62,0,0,0,.62-.62h0a.62.62,0,0,0-.62-.62H17.45Z" style="fill:#00c200"/><path id="Path_2250" data-name="Path 2250" d="M21.27,25.82H21a.47.47,0,0,1-.48-.48V20.39a.47.47,0,0,1,.48-.48h.27a.48.48,0,0,1,.49.48v4.95A.48.48,0,0,1,21.27,25.82Z" style="fill:#00c200"/><path id="Path_2251" data-name="Path 2251" d="M26.28,20.53v2.85s-2.48-3.22-2.51-3.27a.66.66,0,0,0-.49-.2.64.64,0,0,0-.6.64V25.2a.62.62,0,0,0,.62.62h0a.62.62,0,0,0,.62-.62h0V22.36s2.51,3.26,2.55,3.29a.59.59,0,0,0,.42.17.64.64,0,0,0,.62-.64V20.52a.61.61,0,0,0-.62-.61h0A.61.61,0,0,0,26.28,20.53Z" style="fill:#00c200"/><path id="Path_2252" data-name="Path 2252" d="M32.16,20.53h0a.61.61,0,0,0-.62-.62H29.07a.61.61,0,0,0-.62.62h0V25.2a.62.62,0,0,0,.62.62h2.47a.62.62,0,0,0,.62-.62h0a.62.62,0,0,0-.62-.62H29.69v-1.1h1.85a.61.61,0,0,0,.62-.62h0a.61.61,0,0,0-.62-.61H29.69v-1.1h1.85a.62.62,0,0,0,.62-.62Z" style="fill:#00c200"/></g></g></g></g></g></svg>

img/media/rb.svg

@@ -0,0 +1,13 @@
+<svg id="Group_895" data-name="Group 895" xmlns="http://www.w3.org/2000/svg" width="43" height="43" viewBox="0 0 43 43">
+  <circle id="Ellipse_27" data-name="Ellipse 27" cx="21.5" cy="21.5" r="21.5" fill="#adadad"/>
+  <g id="Group_878" data-name="Group 878" transform="translate(-1147.61 -6332.509)">
+    <path id="Path_3994" data-name="Path 3994" d="M298.3,347.44H300.6c.022,3.42.014,6.841.015,10.261a2.267,2.267,0,0,1-.764,1.914,3.75,3.75,0,0,1-2.293.368c-.3-.655-.6-1.316-.872-1.987.406,0,.813.01,1.218-.014a.356.356,0,0,0,.361-.44C298.285,354.173,298.267,350.805,298.3,347.44Z" transform="translate(857.813 6000.227)" fill="#fff"/>
+    <path id="Path_3995" data-name="Path 3995" d="M352.545,346.514c.793-.012,1.585,0,2.371,0-.413,1.055-1,2.049-1.321,3.133a8.163,8.163,0,0,0,2.2.13c-.591,1.382-1.252,2.735-1.809,4.134a7.906,7.906,0,0,0,1.567.066c-.288.659-.583,1.313-.876,1.968-.9-.015-1.8.037-2.693-.024a.79.79,0,0,1-.765-1c.327-1,.837-1.933,1.225-2.911-.559-.037-1.228.122-1.684-.291-.356-.354-.149-.872.019-1.264Q351.68,348.489,352.545,346.514Z" transform="translate(813.062 6001)" fill="#fff"/>
+    <path id="Path_3996" data-name="Path 3996" d="M423.463,346.59h2.344v.881c1.125-.044,2.434-.041,3.247.871.872.964.589,2.354.64,3.536a2.8,2.8,0,0,1,2.317.95c.615.867.373,1.987.422,2.978-.032.943.2,2.083-.578,2.8-.82.886-2.134.615-3.21.677-.327-.662-.606-1.345-.894-2.024.654-.019,1.308.025,1.96-.022a.383.383,0,0,0,.359-.4,18.722,18.722,0,0,0,0-1.877.75.75,0,0,0-.847-.689c-1.142-.017-2.281,0-3.423,0v5.008h-2.346v-5.012H421.11v-2.354c.779,0,1.56,0,2.339-.012q.022-1.016,0-2.046c-.518-.008-1.037-.015-1.557-.01v-2.359h1.555Zm2.332,3.249q0,1.033.015,2.066h1.582a18.009,18.009,0,0,0-.024-1.863C426.981,349.632,426.3,349.911,425.795,349.839Z" transform="translate(754.466 6000.933)" fill="#fff"/>
+    <path id="Path_3997" data-name="Path 3997" d="M377.207,351.81h5.372v2.359H381.1v7.075c.754.008,1.509,0,2.263.008v2.354H375.5c.354-.786.71-1.572,1.074-2.354.7,0,1.408,0,2.11-.008v-7.07h-1.472Q377.2,352.989,377.207,351.81Z" transform="translate(792.351 5996.596)" fill="#fff"/>
+    <path id="Path_3998" data-name="Path 3998" d="M474.564,351.935a1.171,1.171,0,1,1,.847,2.1c-.439.039-.879.017-1.318.015C474.122,353.344,473.906,352.428,474.564,351.935Z" transform="translate(710.467 5996.688)" fill="#fff"/>
+    <path id="Path_3999" data-name="Path 3999" d="M280.184,365.629c.774,0,1.546.012,2.319-.019-.047,1.323-.195,2.642-.278,3.963a8.162,8.162,0,0,1-1.4,4.421c-.423-.894-.82-1.8-1.216-2.71a3.748,3.748,0,0,0,.224-1.026C279.94,368.725,280.06,367.173,280.184,365.629Z" transform="translate(872 5985.134)" fill="#fff"/>
+    <path id="Path_4000" data-name="Path 4000" d="M329.1,365.72h2.342c.119,1.54.241,3.079.352,4.619a3.671,3.671,0,0,0,.224,1.042c-.4.906-.8,1.811-1.214,2.71a7.843,7.843,0,0,1-1.372-4.065C329.308,368.594,329.214,367.153,329.1,365.72Z" transform="translate(830.892 5985.043)" fill="#fff"/>
+    <path id="Path_4001" data-name="Path 4001" d="M346.26,408.823q.537-1.186,1.084-2.363a17.345,17.345,0,0,0,3.692.181c-.352.789-.713,1.575-1.076,2.359A15.878,15.878,0,0,1,346.26,408.823Z" transform="translate(816.639 5951.203)" fill="#fff"/>
+  </g>
+</svg>

img/media/rb_h.svg

@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 300 300" style="enable-background:new 0 0 300 300;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FB2741;}
+	.st1{fill:#FFFFFF;}
+</style>
+<rect class="st0" width="300" height="300"/>
+<g id="Group_878" transform="translate(-1147.61 -6332.509)">
+	<path id="Path_3994" class="st1" d="M1206.9,6438.3h16c0.2,23.9,0.1,47.7,0.1,71.6c0.5,5-1.5,10-5.3,13.4c-4.9,2.5-10.5,3.4-16,2.6
+		c-2.1-4.6-4.2-9.2-6.1-13.9c2.8,0,5.7,0.1,8.5-0.1c1.4,0.1,2.5-1,2.6-2.4c0-0.2,0-0.5-0.1-0.7
+		C1206.8,6485.2,1206.7,6461.7,1206.9,6438.3z"/>
+	<path id="Path_3995" class="st1" d="M1273.2,6437.2c5.5-0.1,11.1,0,16.5,0c-2.9,7.4-7,14.3-9.2,21.9c5.1,1,10.2,1.3,15.3,0.9
+		c-4.1,9.6-8.7,19.1-12.6,28.8c3.6,0.5,7.3,0.7,10.9,0.5c-2,4.6-4.1,9.2-6.1,13.7c-6.3-0.1-12.6,0.3-18.8-0.2c-3,0-5.5-2.4-5.5-5.5
+		c0-0.5,0.1-1,0.2-1.5c2.3-7,5.8-13.5,8.5-20.3c-3.9-0.3-8.6,0.9-11.7-2c-2.5-2.5-1-6.1,0.1-8.8
+		C1265,6455.5,1269.1,6446.4,1273.2,6437.2z"/>
+	<path id="Path_3996" class="st1" d="M1359.1,6437.3h16.4v6.1c7.8-0.3,17-0.3,22.7,6.1c6.1,6.7,4.1,16.4,4.5,24.7
+		c6.1-0.5,12.1,2,16.2,6.6c4.3,6,2.6,13.9,2.9,20.8c-0.2,6.6,1.4,14.5-4,19.5c-5.7,6.2-14.9,4.3-22.4,4.7c-2.3-4.6-4.2-9.4-6.2-14.1
+		c4.6-0.1,9.1,0.2,13.7-0.2c1.5-0.1,2.6-1.3,2.5-2.8c0.2-4.4,0.2-8.7,0-13.1c-0.2-2.9-2.7-5-5.6-4.8c-0.1,0-0.2,0-0.3,0
+		c-8-0.1-15.9,0-23.9,0v34.9h-16.4v-35h-16.4v-16.4c5.4,0,10.9,0,16.3-0.1c0.1-4.7,0.1-9.5,0-14.3c-3.6-0.1-7.2-0.1-10.9-0.1v-16.5
+		h10.8L1359.1,6437.3z M1375.4,6459.9c0,4.8,0,9.6,0.1,14.4h11c0.2-4.3,0.1-8.7-0.2-13C1383.7,6458.5,1378.9,6460.4,1375.4,6459.9z"
+		/>
+	<path id="Path_3997" class="st1" d="M1300.7,6443.4h37.5v16.5h-10.3v49.4c5.3,0.1,10.5,0,15.8,0.1v16.4h-54.9
+		c2.5-5.5,5-11,7.5-16.4c4.9,0,9.8,0,14.7-0.1v-49.3h-10.3C1300.7,6454.4,1300.7,6448.9,1300.7,6443.4z"/>
+	<path id="Path_3998" class="st1" d="M1408.7,6444.9c3.6-2.7,8.7-2,11.4,1.7c2.7,3.6,2,8.7-1.7,11.4c-1.1,0.8-2.5,1.4-3.9,1.6
+		c-3.1,0.3-6.1,0.1-9.2,0.1C1405.6,6454.8,1404.1,6448.4,1408.7,6444.9z"/>
+	<path id="Path_3999" class="st1" d="M1179.5,6459.9c5.4,0,10.8,0.1,16.2-0.1c-0.3,9.2-1.4,18.4-1.9,27.6c-0.2,11-3.6,21.7-9.8,30.8
+		c-3-6.2-5.7-12.6-8.5-18.9c0.9-2.3,1.4-4.7,1.6-7.2C1177.8,6481.5,1178.7,6470.6,1179.5,6459.9z"/>
+	<path id="Path_4000" class="st1" d="M1234,6459.9h16.3c0.8,10.7,1.7,21.5,2.5,32.2c0.2,2.5,0.7,4.9,1.6,7.3
+		c-2.8,6.3-5.6,12.6-8.5,18.9c-5.8-8.4-9.1-18.2-9.6-28.4C1235.4,6479.9,1234.8,6469.9,1234,6459.9z"/>
+	<path id="Path_4001" class="st1" d="M1254.3,6524.5c2.5-5.5,5-11,7.6-16.5c8.5,1.3,17.2,1.8,25.8,1.3c-2.5,5.5-5,11-7.5,16.5
+		C1271.5,6526.3,1262.8,6525.9,1254.3,6524.5z"/>
+</g>
+<g id="Group_878-2" transform="translate(-1147.61 -6332.509)">
+	<path id="Path_3994-2" class="st1" d="M1206.9,6438.3h16c0.2,23.9,0.1,47.7,0.1,71.6c0.5,5-1.5,10-5.3,13.4
+		c-4.9,2.5-10.5,3.4-16,2.6c-2.1-4.6-4.2-9.2-6.1-13.9c2.8,0,5.7,0.1,8.5-0.1c1.4,0.1,2.5-1,2.6-2.4c0-0.2,0-0.5-0.1-0.7
+		C1206.8,6485.2,1206.7,6461.7,1206.9,6438.3z"/>
+	<path id="Path_3995-2" class="st1" d="M1273.2,6437.2c5.5-0.1,11.1,0,16.5,0c-2.9,7.4-7,14.3-9.2,21.9c5.1,1,10.2,1.3,15.3,0.9
+		c-4.1,9.6-8.7,19.1-12.6,28.8c3.6,0.5,7.3,0.7,10.9,0.5c-2,4.6-4.1,9.2-6.1,13.7c-6.3-0.1-12.6,0.3-18.8-0.2c-3,0-5.5-2.4-5.5-5.5
+		c0-0.5,0.1-1,0.2-1.5c2.3-7,5.8-13.5,8.5-20.3c-3.9-0.3-8.6,0.9-11.7-2c-2.5-2.5-1-6.1,0.1-8.8
+		C1265,6455.5,1269.1,6446.4,1273.2,6437.2z"/>
+	<path id="Path_3996-2" class="st1" d="M1359.1,6437.3h16.4v6.1c7.8-0.3,17-0.3,22.7,6.1c6.1,6.7,4.1,16.4,4.5,24.7
+		c6.1-0.5,12.1,2,16.2,6.6c4.3,6,2.6,13.9,2.9,20.8c-0.2,6.6,1.4,14.5-4,19.5c-5.7,6.2-14.9,4.3-22.4,4.7c-2.3-4.6-4.2-9.4-6.2-14.1
+		c4.6-0.1,9.1,0.2,13.7-0.2c1.5-0.1,2.6-1.3,2.5-2.8c0.2-4.4,0.2-8.7,0-13.1c-0.2-2.9-2.7-5-5.6-4.8c-0.1,0-0.2,0-0.3,0
+		c-8-0.1-15.9,0-23.9,0v34.9h-16.4v-35h-16.4v-16.4c5.4,0,10.9,0,16.3-0.1c0.1-4.7,0.1-9.5,0-14.3c-3.6-0.1-7.2-0.1-10.9-0.1v-16.5
+		h10.8L1359.1,6437.3z M1375.4,6459.9c0,4.8,0,9.6,0.1,14.4h11c0.2-4.3,0.1-8.7-0.2-13C1383.7,6458.5,1378.9,6460.4,1375.4,6459.9z"
+		/>
+	<path id="Path_3997-2" class="st1" d="M1300.7,6443.4h37.5v16.5h-10.3v49.4c5.3,0.1,10.5,0,15.8,0.1v16.4h-54.9
+		c2.5-5.5,5-11,7.5-16.4c4.9,0,9.8,0,14.7-0.1v-49.3h-10.3C1300.7,6454.4,1300.7,6448.9,1300.7,6443.4z"/>
+	<path id="Path_3998-2" class="st1" d="M1408.7,6444.9c3.6-2.7,8.7-2,11.4,1.7c2.7,3.6,2,8.7-1.7,11.4c-1.1,0.8-2.5,1.4-3.9,1.6
+		c-3.1,0.3-6.1,0.1-9.2,0.1C1405.6,6454.8,1404.1,6448.4,1408.7,6444.9z"/>
+	<path id="Path_3999-2" class="st1" d="M1179.5,6459.9c5.4,0,10.8,0.1,16.2-0.1c-0.3,9.2-1.4,18.4-1.9,27.6
+		c-0.2,11-3.6,21.7-9.8,30.8c-3-6.2-5.7-12.6-8.5-18.9c0.9-2.3,1.4-4.7,1.6-7.2C1177.8,6481.5,1178.7,6470.6,1179.5,6459.9z"/>
+	<path id="Path_4000-2" class="st1" d="M1234,6459.9h16.3c0.8,10.7,1.7,21.5,2.5,32.2c0.2,2.5,0.7,4.9,1.6,7.3
+		c-2.8,6.3-5.6,12.6-8.5,18.9c-5.8-8.4-9.1-18.2-9.6-28.4C1235.4,6479.9,1234.8,6469.9,1234,6459.9z"/>
+	<path id="Path_4001-2" class="st1" d="M1254.3,6524.5c2.5-5.5,5-11,7.6-16.5c8.5,1.3,17.2,1.8,25.8,1.3c-2.5,5.5-5,11-7.5,16.5
+		C1271.5,6526.3,1262.8,6525.9,1254.3,6524.5z"/>
+</g>
+</svg>

img/media/tt.svg

@@ -0,0 +1,21 @@
+<svg id="Group_897" data-name="Group 897" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="43" height="43" viewBox="0 0 43 43">
+  <defs>
+    <clipPath id="clip-path">
+      <rect id="Rectangle_2022" data-name="Rectangle 2022" width="43" height="43" fill="#adadad"/>
+    </clipPath>
+  </defs>
+  <g id="Group_877" data-name="Group 877">
+    <g id="Group_876" data-name="Group 876" clip-path="url(#clip-path)">
+      <path id="Path_3984" data-name="Path 3984" d="M42.838,21.419A21.419,21.419,0,1,1,21.419,0,21.419,21.419,0,0,1,42.838,21.419" fill="#adadad"/>
+    </g>
+  </g>
+  <g id="Group_896" data-name="Group 896">
+    <path id="Path_4002" data-name="Path 4002" d="M37.108,47.273l.077.07c.237.169.409.408.636.591a4.142,4.142,0,0,0,2.4.929A4.081,4.081,0,0,0,44.5,45.248a2.778,2.778,0,0,0,.008-.313V25.713c0-.432,0-.433.431-.433q1.46,0,2.921,0a.436.436,0,0,1,.27.041.1.1,0,0,0,.017.013.334.334,0,0,1,.074.173,6.738,6.738,0,0,0,2.708,4.145c.089.065.163.146.249.215l.186.158a4.312,4.312,0,0,1,.592.507A6.737,6.737,0,0,0,54.622,31.9c.088.023.188.021.251.1a.054.054,0,0,0,.016.014.281.281,0,0,1,.049.214q0,1.694,0,3.389c0,.258-.035.272-.3.272A10.874,10.874,0,0,1,52.2,35.6a11.714,11.714,0,0,1-3.842-1.656c-.062-.041-.127-.127-.193-.1-.084.038-.04.146-.04.222,0,3.18.012,6.361-.007,9.541a9.1,9.1,0,0,1-8.043,9.039,9,9,0,0,1-5.177-.915,4.722,4.722,0,0,1-.755-.461l-.224-.2a6.178,6.178,0,0,1-1.323-1.687,9.147,9.147,0,0,1-1.228-4.958,9.094,9.094,0,0,1,6.208-8.216,8.244,8.244,0,0,1,2.09-.425,2.977,2.977,0,0,1,.4-.032.292.292,0,0,1,.182.042.077.077,0,0,0,.02.013.381.381,0,0,1,.028.2q0,1.719,0,3.439c0,.04,0,.081,0,.121-.005.115-.064.154-.173.122a4.354,4.354,0,0,0-.96-.147,3.652,3.652,0,0,0-1.468.218,4.075,4.075,0,0,0-.919,7.265c.114.079.231.153.338.242" transform="translate(-21.406 -17.258)" fill="#fff"/>
+    <path id="Path_4003" data-name="Path 4003" d="M40.133,65.764c.061-.017.1.032.138.058a9.087,9.087,0,0,0,3.315,1.224,8.528,8.528,0,0,0,1.8.1,9.064,9.064,0,0,0,8.379-6.755,8.78,8.78,0,0,0,.276-1.815c.018-.353.016-.706.016-1.06q0-4.546,0-9.092v-.207c.079-.021.115.038.159.068a11.641,11.641,0,0,0,3.509,1.633,11.805,11.805,0,0,0,2.113.38c.3.026.6.023.9.044.132.01.133,0,.135-.133s0-.29,0-.434q0-1.539,0-3.077c0-.064,0-.127.006-.191.27.03.536.089.808.109a4.773,4.773,0,0,0,.5.023c.083,0,.118.027.109.11a.949.949,0,0,0,0,.1v4.45c0,.029,0,.058,0,.087,0,.129,0,.132-.14.131a10.773,10.773,0,0,1-1.387-.092,11.7,11.7,0,0,1-5.124-1.962c-.046-.032-.095-.061-.166-.107v.208q0,4.859,0,9.717a9.032,9.032,0,0,1-9.677,9.022,8.961,8.961,0,0,1-5.556-2.42c-.042-.039-.078-.084-.117-.127" transform="translate(-27.398 -31.752)" fill="#cecece"/>
+    <path id="Path_4004" data-name="Path 4004" d="M60.667,22.885c-.063,0-.127.009-.19.009h-3.13c-.242,0-.242,0-.242.234q0,9.561,0,19.122a4.115,4.115,0,0,1-.171,1.3,4.146,4.146,0,0,1-7.162,1.426.545.545,0,0,1-.046-.072,5.568,5.568,0,0,0,.97.32,4.145,4.145,0,0,0,4.931-3.387,3.98,3.98,0,0,0,.049-.71q0-9.579,0-19.157c0-.3-.042-.261.255-.261q2.209,0,4.417,0h.1c.151,0,.153,0,.153.155a5.033,5.033,0,0,0,.062,1.02" transform="translate(-33.948 -14.821)" fill="#cecece"/>
+    <path id="Path_4005" data-name="Path 4005" d="M37.271,55.887a9.29,9.29,0,0,0-2.635.457,9.062,9.062,0,0,0-5.873,6.139,8.73,8.73,0,0,0-.306,1.79A8.967,8.967,0,0,0,30.9,71.107a.438.438,0,0,1,.039.056,2.139,2.139,0,0,1-.469-.323,9.031,9.031,0,0,1-3.455-7.7,9.028,9.028,0,0,1,5.946-7.89,9,9,0,0,1,2.4-.51,9.348,9.348,0,0,1,1.785.04c.08.01.128.026.126.121-.006.33-.006.66-.008.99" transform="translate(-18.433 -37.35)" fill="#cecece"/>
+    <path id="Path_4006" data-name="Path 4006" d="M44.671,69.9a3.424,3.424,0,0,1-.961-.674,4.022,4.022,0,0,1-1.25-2.513,4.132,4.132,0,0,1,5.209-4.441.251.251,0,0,0,.134.018.472.472,0,0,0,.013-.189q0-1.738,0-3.476c0-.063.006-.127.01-.19a7.444,7.444,0,0,1,1.334.059c.07.008.089.04.087.1,0,.035,0,.069,0,.1q0,2.3,0,4.605a.3.3,0,0,1-.022.176c-.2-.038-.4-.1-.606-.128a4.058,4.058,0,0,0-3.195.851,3.965,3.965,0,0,0-1.5,2.54,4.043,4.043,0,0,0,.678,3.039c.026.038.049.078.073.117" transform="translate(-28.968 -39.887)" fill="#cecece"/>
+    <path id="Path_4007" data-name="Path 4007" d="M87.289,29.964a5.774,5.774,0,0,1-1.2-.967,6.777,6.777,0,0,1-1.833-3.532.18.18,0,0,1,0-.035c.416-.024.833,0,1.25-.011.074,0,.107.028.1.1,0,.029,0,.058,0,.087a6.255,6.255,0,0,0,.894,3.238,6.7,6.7,0,0,0,.711,1c.029.035.071.062.076.113" transform="translate(-57.522 -17.353)" fill="#cecece"/>
+    <path id="Path_4008" data-name="Path 4008" d="M97.91,42.216a6.775,6.775,0,0,1-3.137-1.595,2.469,2.469,0,0,1-.376-.381.184.184,0,0,1,.111.043,6.876,6.876,0,0,0,2.306.816,5.583,5.583,0,0,0,.965.084c.135,0,.139,0,.138.133,0,.3,0,.6-.007.9" transform="translate(-64.443 -27.471)" fill="#cecece"/>
+  </g>
+</svg>

img/media/tt_h.svg

@@ -0,0 +1,47 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 300 300" style="enable-background:new 0 0 300 300;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+	.st1{fill:#CB1C54;}
+	.st2{fill:#6ABAC5;}
+</style>
+<rect width="300" height="300"/>
+<g id="Group_896">
+	<path id="Path_4002" class="st0" d="M109.5,209.4l0.5,0.5c1.7,1.2,2.9,2.8,4.4,4.1c4.8,3.9,10.6,6.2,16.7,6.5
+		c15.1,0.8,28.2-10.2,29.9-25.2c0.1-0.7,0.1-1.5,0.1-2.2V59c0-3,0-3,3-3c6.8,0,13.6,0,20.4,0c0.6-0.1,1.3,0,1.9,0.3l0.1,0.1
+		c0.3,0.3,0.5,0.8,0.5,1.2c2.4,11.7,9.2,22,18.9,28.9c0.6,0.5,1.1,1,1.7,1.5l1.3,1.1c1.5,1.1,2.9,2.2,4.1,3.5
+		c5.4,4.5,11.8,7.8,18.6,9.5c0.6,0.2,1.3,0.1,1.8,0.7l0.1,0.1c0.3,0.4,0.4,1,0.3,1.5c0,7.9,0,15.8,0,23.6c0,1.8-0.2,1.9-2.1,1.9
+		c-5.7,0-11.4-0.7-17-2c-9.6-2.2-18.6-6.1-26.8-11.6c-0.4-0.3-0.9-0.9-1.3-0.7c-0.6,0.3-0.3,1-0.3,1.5c0,22.2,0.1,44.4,0,66.6
+		c0,32.2-24.1,59.3-56.1,63.1c-12.4,1.5-25-0.7-36.1-6.4c-1.9-0.9-3.6-2-5.3-3.2l-1.6-1.4c-3.7-3.4-6.9-7.3-9.2-11.8
+		c-6.1-10.5-9.1-22.5-8.6-34.6c1.2-26.2,18.4-49,43.3-57.3c4.7-1.6,9.6-2.6,14.6-3c0.9-0.1,1.9-0.2,2.8-0.2c0.4,0,0.9,0.1,1.3,0.3
+		l0.1,0.1c0.2,0.4,0.3,0.9,0.2,1.4c0,8,0,16,0,24c0,0.3,0,0.6,0,0.8c0,0.8-0.4,1.1-1.2,0.9c-2.2-0.6-4.4-0.9-6.7-1
+		c-3.5-0.2-7,0.3-10.2,1.5C98.7,162,90.8,178.1,95.9,193c2,6,6,11.1,11.3,14.6C108,208.2,108.8,208.7,109.5,209.4"/>
+	<path id="Path_4003" class="st1" d="M88.8,237.3c0.4-0.1,0.7,0.2,1,0.4c7.1,4.3,14.9,7.2,23.1,8.5c4.1,0.7,8.4,0.9,12.6,0.7
+		c27.7-1.2,51.4-20.3,58.5-47.1c1.1-4.1,1.7-8.4,1.9-12.7c0.1-2.5,0.1-4.9,0.1-7.4c0-21.1,0-42.3,0-63.4v-1.4
+		c0.6-0.1,0.8,0.3,1.1,0.5c7.5,5.1,15.7,9,24.5,11.4c4.8,1.3,9.8,2.2,14.7,2.7c2.1,0.2,4.2,0.2,6.3,0.3c0.9,0.1,0.9,0,0.9-0.9
+		s0-2,0-3c0-7.2,0-14.3,0-21.5c0-0.4,0-0.9,0-1.3c1.9,0.2,3.7,0.6,5.6,0.8c1.2,0.1,2.3,0.2,3.5,0.2c0.6,0,0.8,0.2,0.8,0.8
+		c0,0.2,0,0.5,0,0.7v31c0,0.2,0,0.4,0,0.6c0,0.9,0,0.9-1,0.9c-3.2,0-6.5-0.2-9.7-0.6c-12.8-1.7-25.1-6.4-35.7-13.7
+		c-0.3-0.2-0.7-0.4-1.2-0.7v1.5c0,22.6,0,45.2,0,67.8c0.1,34.8-28.1,63.1-62.9,63.1c-1.5,0-3.1-0.1-4.6-0.2
+		c-14.5-1-28.2-6.9-38.8-16.9C89.3,237.9,89.1,237.5,88.8,237.3"/>
+	<path id="Path_4004" class="st2" d="M186.4,56.3c-0.4,0-0.9,0.1-1.3,0.1h-21.8c-1.7,0-1.7,0-1.7,1.6c0,44.5,0,88.9,0,133.4
+		c0.1,3.1-0.3,6.1-1.2,9.1c-4.7,15.3-20.8,23.9-36.1,19.2c-5.4-1.7-10.2-4.9-13.8-9.2c-0.1-0.2-0.2-0.3-0.3-0.5
+		c2.2,0.9,4.4,1.7,6.8,2.2c15.6,3.2,30.9-6.8,34.2-22.5c0.1-0.4,0.2-0.8,0.2-1.2c0.3-1.6,0.4-3.3,0.3-5c0-44.6,0-89.1,0-133.7
+		c0-2.1-0.3-1.8,1.8-1.8c10.3,0,20.5,0,30.8,0h0.7c1.1,0,1.1,0,1.1,1.1C185.9,51.5,186,53.9,186.4,56.3"/>
+	<path id="Path_4005" class="st2" d="M131.4,129.3c-6.2,0.2-12.4,1.2-18.4,3.2c-19.9,6.6-35.3,22.6-41,42.8
+		c-1.1,4.1-1.9,8.3-2.1,12.5c-1.3,17.6,4.9,34.9,17,47.7c0.1,0.1,0.2,0.3,0.3,0.4c-1.2-0.6-2.3-1.4-3.3-2.3
+		c-16.4-12.8-25.4-32.9-24.1-53.7c1.7-25,18-46.6,41.5-55c5.4-1.9,11-3.1,16.7-3.6c4.2-0.3,8.3-0.2,12.5,0.3
+		c0.6,0.1,0.9,0.2,0.9,0.8C131.4,124.8,131.4,127.1,131.4,129.3"/>
+	<path id="Path_4006" class="st1" d="M109.6,209.4c-2.5-1.2-4.8-2.8-6.7-4.7c-4.9-4.6-8-10.8-8.7-17.5c-1.8-15.8,9.6-30.1,25.4-31.9
+		c3.7-0.4,7.4-0.1,10.9,0.9c0.3,0.1,0.6,0.2,0.9,0.1c0.1-0.4,0.1-0.9,0.1-1.3c0-8.1,0-16.2,0-24.3c0-0.4,0-0.9,0.1-1.3
+		c3.1-0.1,6.2,0,9.3,0.4c0.5,0.1,0.6,0.3,0.6,0.7c0,0.2,0,0.5,0,0.7c0,10.7,0,21.4,0,32.1c0.1,0.4,0,0.8-0.2,1.2
+		c-1.4-0.3-2.8-0.7-4.2-0.9c-7.9-1.3-16,0.9-22.3,5.9c-5.6,4.3-9.4,10.7-10.5,17.7c-1.3,7.4,0.4,15,4.7,21.2
+		C109.3,208.8,109.4,209.1,109.6,209.4"/>
+	<path id="Path_4007" class="st1" d="M207.7,88c-3.1-1.9-5.9-4.1-8.4-6.7c-6.6-6.7-11.1-15.3-12.8-24.6c0-0.1,0-0.2,0-0.2
+		c2.9-0.2,5.8,0,8.7-0.1c0.5,0,0.7,0.2,0.7,0.7c0,0.2,0,0.4,0,0.6c0,8,2.1,15.8,6.2,22.6c1.4,2.5,3.1,4.8,5,7
+		C207.3,87.4,207.6,87.6,207.7,88"/>
+	<path id="Path_4008" class="st2" d="M233.5,102.9c-8.1-1.7-15.7-5.6-21.9-11.1c-1-0.8-1.8-1.7-2.6-2.7c0.3,0,0.6,0.1,0.8,0.3
+		c5,2.8,10.4,4.8,16.1,5.7c2.2,0.4,4.5,0.6,6.7,0.6c0.9,0,1,0,1,0.9C233.5,98.7,233.5,100.8,233.5,102.9"/>
+</g>
+</svg>

img/media/yt.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>y</title><g id="圖層_2" data-name="圖層 2"><g id="圖層_1-2" data-name="圖層 1"><g id="Community"><g id="youtube"><circle id="Ellipse_9" data-name="Ellipse 9" cx="24" cy="24" r="24" style="fill:#d1d2d3"/><path id="youtube-2" d="M35.51,18.53a2.81,2.81,0,0,0-2-2c-1.78-.49-9-.49-9-.49s-7.19,0-9,.49a2.85,2.85,0,0,0-2,2A31.6,31.6,0,0,0,13,24.11a29.66,29.66,0,0,0,.49,5.57,2.79,2.79,0,0,0,2,2c1.78.46,9,.46,9,.46s7.19,0,9-.49a2.84,2.84,0,0,0,2-2A31.26,31.26,0,0,0,36,24.11,29.84,29.84,0,0,0,35.51,18.53Zm-13.37,9V20.69l6,3.42-6,3.42Z" style="fill:#fff"/></g></g></g></g></svg>

img/media/yt_h.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><title>y_h</title><g id="圖層_2" data-name="圖層 2"><g id="圖層_1-2" data-name="圖層 1"><g id="Community_hover" data-name="Community hover"><g id="youtube"><circle id="Ellipse_9" data-name="Ellipse 9" cx="24" cy="24" r="24" style="fill:red"/><path id="youtube-2" d="M35.51,18.53a2.81,2.81,0,0,0-2-2c-1.78-.49-9-.49-9-.49s-7.19,0-9,.49a2.85,2.85,0,0,0-2,2A31.6,31.6,0,0,0,13,24.11a29.66,29.66,0,0,0,.49,5.57,2.79,2.79,0,0,0,2,2c1.78.46,9,.46,9,.46s7.19,0,9-.49a2.84,2.84,0,0,0,2-2A31.26,31.26,0,0,0,36,24.11,29.84,29.84,0,0,0,35.51,18.53Zm-13.37,9V20.69l6,3.42-6,3.42Z" style="fill:#fff"/></g></g></g></g></svg>

img/menu/agent.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="23.264" height="17.658" viewBox="0 0 23.264 17.658"><defs><style>.a,.b,.c{fill:none;stroke-miterlimit:10;stroke-width:1.5px;}.a{stroke:#ee7800;}.a,.c{stroke-linecap:round;}.b,.c{stroke:#4c4c4c;}.d{fill:#4c4c4c;}</style></defs><g transform="translate(-36.25 -652.229)"><path class="a" d="M-183.533,269.746a9.468,9.468,0,0,0,12.306,0" transform="translate(229.689 395.066)"/><g transform="translate(268.976 438.733)"><path class="b" d="M-224.652,214.6l-6.857,5.608a1.272,1.272,0,0,0-.467.984v7.94A1.272,1.272,0,0,0-230.7,230.4h13.543a1.272,1.272,0,0,0,1.271-1.272V221.04a1.272,1.272,0,0,0-.467-.985l-6.686-5.457A1.271,1.271,0,0,0-224.652,214.6Z" transform="translate(0)"/><path class="c" d="M-183.533,269.746a9.468,9.468,0,0,0,12.306,0" transform="translate(-39.287 -44.667)"/><circle class="d" cx="1.152" cy="1.152" r="1.152" transform="translate(-223.933 221.054)"/></g></g></svg>

img/menu/building.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="14.887" height="22.591" viewBox="0 0 14.887 22.591"><defs><style>.a{fill:#ee7800;stroke:#ee7800;stroke-width:1.5px;}.a,.b{stroke-miterlimit:10;}.b{fill:none;stroke:#4c4c4c;}</style></defs><g transform="translate(-37.5 -512.683)"><g transform="translate(-714.436 754.034)"><path class="a" d="M.5,0H1.921a.5.5,0,0,1,.5.5V5.01a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0V.5A.5.5,0,0,1,.5,0Z" transform="translate(757.937 -226.419)"/><g transform="translate(752.436 -240.851)"><path class="b" d="M380.179,737.87v-20.2a.7.7,0,0,0-.694-.694h-12.5a.693.693,0,0,0-.693.693v20.2a.7.7,0,0,0,.694.694h12.5A.7.7,0,0,0,380.179,737.87Z" transform="translate(-366.292 -716.973)"/><g transform="translate(2.484 3.029)"><line class="b" x2="1.955"/><line class="b" x2="1.955" transform="translate(3.482)"/><line class="b" x2="1.955" transform="translate(6.965)"/></g><g transform="translate(2.484 6.16)"><line class="b" x2="1.955"/><line class="b" x2="1.955" transform="translate(3.482)"/><line class="b" x2="1.955" transform="translate(6.965)"/></g><g transform="translate(2.484 9.291)"><line class="b" x2="1.955"/><line class="b" x2="1.955" transform="translate(3.482)"/><line class="b" x2="1.955" transform="translate(6.965)"/></g><g transform="translate(2.484 12.422)"><line class="b" x2="1.955"/><line class="b" x2="1.955" transform="translate(3.482)"/><line class="b" x2="1.955" transform="translate(6.965)"/></g><path class="b" d="M.5,0H2.284a.5.5,0,0,1,.5.5V5.763a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0V.5A.5.5,0,0,1,.5,0Z" transform="translate(5.551 15.827)"/></g></g></g></svg>

img/menu/calculator.svg

@@ -0,0 +1,54 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 72 60" style="enable-background:new 0 0 72 60;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;}
+	.st1{enable-background:new    ;}
+	.st2{fill:#707070;}
+	.st3{fill:#ED7900;stroke:#ED7900;stroke-width:0.2;stroke-miterlimit:10;}
+	.st4{fill:#707070;stroke:#707070;stroke-width:0.2;stroke-miterlimit:10;}
+</style>
+<g id="Group_84" transform="translate(1931 -1016)">
+	<rect id="Rectangle_92" x="-1931" y="1016" class="st0" width="72" height="60"/>
+	<g class="st1">
+		<path class="st2" d="M-1914.7,1053.6c-0.4,1.3-1,2.6-1.7,3.8v11.3h-1.6v-8.9c-0.4,0.6-0.9,1.1-1.4,1.7l-0.5-1.7
+			c1.7-2,2.9-4.3,3.7-6.9L-1914.7,1053.6z M-1910.5,1056.3v-3.2h1.6v3.2h4.7v1.5h-4.7v3.2h3.7v7.7h-1.6v-0.7h-5.8v0.7h-1.6v-7.7h3.6
+			v-3.2h-4.5v-1.5H-1910.5z M-1906.8,1066.5v-3.9h-5.8v3.9H-1906.8z"/>
+		<path class="st2" d="M-1899.8,1057.1c0.5-0.6,1.1-1.3,1.5-2h-4v-1.4h5.7v1.2c-0.7,1.3-1.5,2.3-2.3,3.2c0.3,0.3,0.5,0.6,0.7,0.8
+			h2.3v1c-0.3,1.3-0.6,2.4-0.9,3.1l-1.3-0.5c0.3-0.6,0.5-1.3,0.7-2.1h-1.5v6.7c0,1-0.5,1.5-1.4,1.5h-1.6l-0.3-1.5
+			c0.5,0.1,1,0.1,1.4,0.1c0.3,0,0.4-0.2,0.4-0.6v-6.4h-2.4v-1.5h2.9c-0.6-0.7-1.4-1.5-2.2-2.3l1.2-0.7
+			C-1900.6,1056.3-1900.2,1056.7-1899.8,1057.1z M-1892.8,1056.2c0.1-0.4,0.3-0.7,0.4-1.1h-3.4v-1.4h8.5v1.4h-3.5
+			c-0.1,0.4-0.2,0.8-0.4,1.1h3.2v9.3h-2c1.1,0.7,2.1,1.4,2.9,2.1l-1,1c-0.7-0.7-1.6-1.4-2.8-2.2l0.9-0.9h-3.2l1,0.9
+			c-0.9,0.9-2,1.7-3.3,2.4l-0.9-1.1c1.3-0.6,2.3-1.3,3.1-2.1h-2v-9.3H-1892.8z M-1889.5,1058.8v-1.3h-4.2v1.3H-1889.5z
+			 M-1889.5,1061.5v-1.4h-4.2v1.4H-1889.5z M-1889.5,1062.7h-4.2v1.4h4.2V1062.7z"/>
+		<path class="st2" d="M-1877,1056.9l-1.2-0.8c0.8-1,1.4-2,1.8-3.1l1.5,0.3c-0.1,0.3-0.2,0.5-0.3,0.7h4.6v1.4h-2.5
+			c0.2,0.3,0.4,0.6,0.6,0.9l-1.3,0.5c-0.3-0.5-0.5-0.9-0.9-1.4h-1.1c-0.3,0.5-0.7,1-1,1.5h4.7v6.9h-2v0.9h3.7v1.4h-3.7v2.7h-1.6
+			v-2.7h-4.5c-0.2,0.4-0.4,0.8-0.7,1.1c-0.6,0.7-1.5,1.2-2.9,1.6l-0.8-1.3c1.2-0.3,2-0.7,2.4-1.2c0.1-0.1,0.1-0.2,0.2-0.2h-3.5v-1.4
+			h4l0-0.4v-0.5h-2.1v-6.9H-1877z M-1884.2,1057.3l-1.3-0.9c1-1.1,1.8-2.2,2.2-3.5l1.5,0.3c-0.1,0.3-0.2,0.6-0.3,0.8h3.9v1.4h-1.9
+			c0.2,0.3,0.4,0.5,0.5,0.8l-1.3,0.5c-0.2-0.4-0.5-0.9-0.8-1.3h-1.2C-1883.3,1056.1-1883.7,1056.7-1884.2,1057.3z M-1873.7,1058.8
+			v-0.7h-8.3v0.7H-1873.7z M-1873.7,1060.6v-0.7h-8.3v0.7H-1873.7z M-1873.7,1061.8h-8.3v0.8h8.3V1061.8z M-1879.9,1064.3
+			c0,0.1,0,0.2,0,0.4h4.2v-0.9h-4.2V1064.3z"/>
+	</g>
+	<g id="Group_81" transform="translate(-1900.82 1024.401)">
+		<path id="Path_158" class="st3" d="M12.2,12V7.2c0-2.2-1.7-4.2-3.9-4.5l1.1-2.2c0.1-0.1,0.1-0.3,0-0.4C9.4,0.1,9.3,0,9.2,0H3
+			C2.9,0,2.8,0.1,2.7,0.1c-0.1,0.1-0.1,0.3,0,0.4l1.2,2.2C1.6,3,0,4.9,0,7.2v6.2h0.6V7.2c0-2.1,1.6-3.7,3.7-3.7c0,0,0,0,0.1,0h3.5
+			c1,0,1.9,0.4,2.7,1.1c0.7,0.7,1.1,1.7,1.1,2.7V12H12.2z M7.6,2.7h-3l-1-2h5L7.6,2.7z"/>
+	</g>
+	<path id="Path_215" class="st3" d="M-1897.4,1029.7c0.2-0.1,0.4-0.2,0.6-0.3l-0.1-0.6c-0.3,0.1-0.5,0.1-0.7,0.3L-1897.4,1029.7z"/>
+	<g id="Group_82" transform="translate(-1905 1029.579)">
+		<path id="Path_160" class="st3" d="M5.7,3.6h0.6V2.2c0-0.6,0.3-1.3,0.7-1.7L6.6,0c-0.6,0.6-1,1.4-0.9,2.2L5.7,3.6z"/>
+		<path id="Path_161" class="st3" d="M0.9,11.7l5.8,3.2c0.7,0.4,1.4,0.5,2.2,0.5h11.3c0.2,0,0.3-0.2,0.4-0.4V8.9
+			c0-0.2-0.2-0.3-0.4-0.4h-2.6l-0.1-0.1c-0.4-0.3-0.9-0.6-1.4-0.7c-1.7-0.7-3.5-0.5-5,0.4H8.6c-0.5,0-1,0.3-1.4,0.7
+			c-0.3,0.4-0.4,1-0.3,1.5L2.7,8.3C2,8,1.3,8,0.7,8.4C0.3,8.8,0,9.3,0,9.9V10C-0.1,10.7,0.3,11.4,0.9,11.7z M17.8,9.3h2v5.5h-2V9.3z
+			 M0.6,10c0-0.4,0.2-0.8,0.5-1c0.4-0.2,0.8-0.3,1.2-0.1l5.3,2.7c0.1,0.1,0.1,0.1,0.1,0.1H13V11H8.5c-0.6,0-1-0.5-1-1s0.5-1,1-1l0,0
+			h2.7c0.1,0,0.1,0,0.1-0.1c1.3-0.9,3-1.1,4.5-0.4c0.4,0.2,0.8,0.4,1.2,0.6v5.6H8.9c-0.6,0-1.2-0.1-1.8-0.4l-5.8-3.2
+			C0.8,10.9,0.6,10.5,0.6,10z"/>
+	</g>
+	<rect id="Rectangle_93" x="-1886.5" y="1042.6" class="st4" width="0.6" height="0.6"/>
+	<path id="Path_216" class="st3" d="M-1894.4,1036.4v-0.6h0.4c0.8,0,1.4-0.6,1.4-1.4c0-0.8-0.6-1.4-1.4-1.4h-1.4
+		c-0.3,0-0.6-0.2-0.6-0.5c0,0,0-0.1,0-0.1c0-0.4,0.3-0.6,0.6-0.6c0,0,0,0,0,0h2.4v-0.7h-1.4v-0.6h-0.6v0.6h-0.4
+		c-0.8,0-1.4,0.6-1.4,1.4c0,0.8,0.6,1.4,1.4,1.4l0,0h1.4c0.3,0,0.6,0.2,0.6,0.5c0,0,0,0.1,0,0.1c0,0.4-0.3,0.6-0.6,0.6c0,0,0,0,0,0
+		h-2.4v0.6h1.4v0.6L-1894.4,1036.4L-1894.4,1036.4z"/>
+</g>
+</svg>

img/menu/calendar.svg

@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 72 60" style="enable-background:new 0 0 72 60;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;}
+	.st1{enable-background:new    ;}
+	.st2{fill:#707070;}
+	.st3{fill:#ED7900;}
+</style>
+<g id="Group_86" transform="translate(1781 -1016)">
+	<rect id="Rectangle_90" x="-1781" y="1016" class="st0" width="72" height="60"/>
+	<g class="st1">
+		<path class="st2" d="M-1780.6,1054.9h9.8v1.8h-3.9v10.3h-2.1v-10.3h-3.8V1054.9z"/>
+		<path class="st2" d="M-1770.7,1054.9h2.2l3,9.6h0l3.1-9.6h2.2l-4.1,12.1h-2.4L-1770.7,1054.9z"/>
+	</g>
+	<g class="st1">
+		<path class="st2" d="M-1758.1,1057.6l-1.4-0.9c1-1.1,1.7-2.3,2.1-3.6l1.6,0.3c-0.1,0.3-0.2,0.6-0.3,0.9h4.2v1.4h-2.5
+			c0.4,0.6,0.7,1.1,1,1.6l-1.5,0.5c-0.3-0.7-0.7-1.5-1.2-2.2h-0.8C-1757.2,1056.4-1757.6,1057-1758.1,1057.6z M-1751.3,1067.9
+			l-1.5,0.7c-0.2-0.4-0.3-0.8-0.5-1.2c-1.4,0.4-3.1,0.8-5.1,1.2l-0.4-1.5c0.2-0.1,0.4-0.2,0.4-0.4v-8.6h6.7v6.1h-5.1v2.6
+			c1-0.2,2-0.4,2.9-0.7c-0.2-0.4-0.4-0.8-0.6-1.1l1.5-0.5C-1752.3,1065.5-1751.8,1066.7-1751.3,1067.9z M-1753.3,1059.4h-3.5v1.1
+			h3.5V1059.4z M-1756.8,1062.9h3.5v-1.1h-3.5V1062.9z M-1750.7,1057.7l-1.4-0.9c0.9-1.2,1.5-2.4,1.9-3.7l1.5,0.3
+			c-0.1,0.3-0.2,0.6-0.3,0.8h4.8v1.4h-2.9c0.4,0.6,0.7,1.1,0.9,1.6l-1.4,0.5c-0.3-0.7-0.7-1.5-1.2-2.2h-0.9
+			C-1749.8,1056.4-1750.2,1057.1-1750.7,1057.7z M-1747.8,1067.3l-0.4-1.5l1.5,0.1c0.3,0,0.4-0.2,0.4-0.4v-5.8h-2.7v9.2h-1.6V1058
+			h5.9v7.7c0,1-0.5,1.5-1.5,1.5H-1747.8z"/>
+		<path class="st2" d="M-1728.8,1068.8h-1.6v-1h-8.6v1h-1.6v-15h11.8V1068.8z M-1730.5,1057.8v-2.4h-8.6v2.4H-1730.5z
+			 M-1730.5,1061.9v-2.6h-8.6v2.6H-1730.5z M-1730.5,1066.2v-2.8h-8.6v2.8H-1730.5z"/>
+		<path class="st2" d="M-1718.6,1054.5v-1.3h1.6v1.3h6v1.5h-6v1.2h5v1.5h-5v1.3h6.4v1.5h-7.7c-0.6,0.8-1.3,1.5-2.1,2.2v3.2
+			c1.2-0.4,2.3-0.8,3.5-1.3l0.3,1.5c-1.7,0.7-3.5,1.3-5.3,1.8l-0.5-1.4c0.3-0.1,0.4-0.3,0.4-0.6v-2.1c-0.8,0.5-1.8,1-2.8,1.4
+			l-0.9-1.4c2.5-0.8,4.4-1.9,5.6-3.2h-5v-1.5h6.4v-1.3h-5v-1.5h5v-1.2h-6v-1.5H-1718.6z M-1711.1,1063.1c-0.8,0.8-1.8,1.5-2.9,2
+			c1.1,1,2.5,1.8,4.1,2.3l-1,1.4c-3-1.1-5.2-3.1-6.4-6l1.2-0.7c0.3,0.7,0.7,1.4,1.1,2c1-0.4,1.9-1.1,2.7-2.1L-1711.1,1063.1z"/>
+	</g>
+	<g id="Group_404" transform="translate(-1755 1025.361)">
+		<g id="Group_403">
+			<path id="Path_2424" class="st3" d="M16.9,8.7V3.2c0-0.9-0.8-1.7-1.8-1.6c0,0,0,0,0,0h-1.5V0.4c0-0.2-0.1-0.3-0.2-0.4
+				c0,0-0.1,0-0.1,0h-2.1c-0.2,0-0.4,0.1-0.4,0.3v1.2H6.1V0.4C6.1,0.1,5.8,0,5.6,0H3.5C3.3,0,3,0.1,3,0.3v1.2H1.7
+				C0.8,1.5,0,2.2,0,3.1c0,0,0,0,0,0.1v12.6c0,0.9,0.7,1.6,1.6,1.6c0,0,0,0,0.1,0H9c2.1,2.6,5.8,3,8.4,1c1.4-1.1,2.2-2.8,2.3-4.6
+				C19.6,11.7,18.6,9.8,16.9,8.7z M11.7,0.9h1.1v2h-1.1V0.9z M3.9,0.9h1.3v2H3.9V0.9z M0.9,3.2c0-0.4,0.3-0.8,0.8-0.8
+				c0,0,0.1,0,0.1,0H3v0.8c0,0.3,0.2,0.5,0.5,0.5h2.1c0.3,0,0.5-0.2,0.5-0.5V2.4h4.8v0.8c0,0.2,0.2,0.5,0.4,0.5h2.1
+				c0.2,0,0.3-0.2,0.3-0.5V2.4h1.5c0.5-0.1,0.9,0.3,0.9,0.7c0,0,0,0,0,0v2.7H0.9V3.2z M1.7,16.5c-0.4,0-0.8-0.3-0.8-0.7
+				c0,0,0-0.1,0-0.1v-9h15.2v1.5c-0.8-0.3-1.6-0.5-2.4-0.5c-3.3,0-6,2.7-6,6c0,1,0.2,2,0.7,2.8L1.7,16.5L1.7,16.5z M13.6,18.7
+				c-2.8,0-5.1-2.3-5.1-5.1c0-2.8,2.3-5.1,5.1-5.1c2.8,0,5.1,2.3,5.1,5.1v0C18.7,16.5,16.4,18.7,13.6,18.7L13.6,18.7z"/>
+			<path id="Path_2425" class="st3" d="M15.7,13.7h-2v-2.6c0-0.2-0.2-0.4-0.4-0.4c-0.2,0-0.4,0.2-0.4,0.4v3c0,0.3,0.3,0.4,0.5,0.4
+				h2.3c0.2,0,0.4-0.2,0.4-0.4C16.1,13.9,15.9,13.7,15.7,13.7C15.7,13.7,15.7,13.7,15.7,13.7L15.7,13.7z"/>
+		</g>
+	</g>
+</g>
+</svg>

img/menu/cart.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20.145" height="19.609" viewBox="0 0 20.145 19.609"><defs><style>.a{fill:#ee7800;}.b{fill:#4c4c4c;stroke:#4c4c4c;stroke-width:0.3px;}</style></defs><g transform="translate(-33.269 -144.612)"><path class="a" d="M.356,0h9.853L9.055,4.984,2.2,5.716Z" transform="translate(40 151)"/><g transform="translate(-1.889 -3.303)"><path class="b" d="M80.549,521.865a2.071,2.071,0,1,0,2.071,2.071h0A2.071,2.071,0,0,0,80.549,521.865Zm0,3.222a1.151,1.151,0,1,1,1.151-1.151A1.151,1.151,0,0,1,80.549,525.087Z" transform="translate(-38.913 -358.633)"/><path class="b" d="M279.08,521.865a2.071,2.071,0,1,0,2.071,2.071h0A2.071,2.071,0,0,0,279.08,521.865Zm0,3.222a1.151,1.151,0,1,1,1.151-1.151A1.151,1.151,0,0,1,279.08,525.087Z" transform="translate(-228.698 -358.633)"/><path class="b" d="M1.2,180.471l-14.982-.207L-14.194,179a2.117,2.117,0,0,0-1.979-1.427h-1.542a.46.46,0,0,0-.46.46.46.46,0,0,0,.46.46h1.542a1.2,1.2,0,0,1,1.1.805l2.923,8.815-.23.529a2.209,2.209,0,0,0,.207,2,2.14,2.14,0,0,0,1.726.967H-1.49a.46.46,0,0,0,.46-.46.46.46,0,0,0-.46-.46h-8.953a1.174,1.174,0,0,1-.967-.552,1.266,1.266,0,0,1-.115-1.1l.184-.414,9.689-1.013a2.532,2.532,0,0,0,2.186-1.933l1.1-4.626a.391.391,0,0,0-.069-.391A.576.576,0,0,0,1.2,180.471Zm-1.565,4.994a1.565,1.565,0,0,1-1.4,1.22l-9.574.99-2.14-6.49,14.108.207Z" transform="translate(53.484 -29.506)"/></g></g></svg>

img/menu/champion.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="17.823" height="15.595" viewBox="0 0 17.823 15.595"><defs><style>.a{fill:#4c4c4c;}.b{fill:#ee7800;stroke:#ee7800;stroke-miterlimit:10;stroke-width:1.5px;}</style></defs><g transform="translate(-37.115 -839.999)"><path class="a" d="M17.052,6.084V3.856H5.913V6.084H2.571V8.312A3.344,3.344,0,0,0,6.915,11.5a5.573,5.573,0,0,0,3.453,2.27v3.453H9.254a2.228,2.228,0,0,0-2.228,2.228h8.912a2.228,2.228,0,0,0-2.228-2.228H12.6V13.77a5.572,5.572,0,0,0,3.453-2.27,3.344,3.344,0,0,0,4.345-3.189V6.084ZM5.913,10.331A2.021,2.021,0,0,1,3.894,8.312V7.2H5.913V8.312A5.556,5.556,0,0,0,6.277,10.3,2.022,2.022,0,0,1,5.913,10.331ZM19.071,8.312A2.017,2.017,0,0,1,16.687,10.3a5.556,5.556,0,0,0,.365-1.985V7.2h2.019Z" transform="translate(34.545 836.143)"/><path class="b" d="M.5,0H1.921a.5.5,0,0,1,.5.5V5.01a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0V.5A.5.5,0,0,1,.5,0Z" transform="translate(49.421 851.01) rotate(180)"/></g></svg>

img/menu/close-btn-search.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17"><defs><style>.a{fill:#fff;}.a,.b{stroke:#ee7800;}.b{fill:none;stroke-linecap:round;stroke-miterlimit:10;}</style></defs><g transform="translate(0.5 0.729)"><circle class="a" cx="8" cy="8" r="8" transform="translate(0 -0.229)"/><path class="b" d="M25.6,31.236l2.818-2.818L31.236,25.6" transform="translate(-20.59 -20.66)"/><path class="b" d="M25.6,25.6l2.818,2.818,2.818,2.818" transform="translate(-20.59 -20.66)"/></g></svg>

img/menu/designs.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="19.329" height="19.438" viewBox="0 0 19.329 19.438"><defs><style>.a,.b,.c{fill:none;stroke:#4c4c4c;}.a{stroke-miterlimit:10;}.b,.c{stroke-linejoin:round;}.c{stroke-linecap:round;}.d{fill:#ee7800;}</style></defs><g transform="translate(-35.5 -282.935)"><g transform="translate(36 283.435)"><g transform="translate(3.852 1.228)"><line class="a" y1="1.099" x2="1.099" transform="translate(0 0)"/><line class="a" y1="1.099" x2="1.099" transform="translate(0.926 0.926)"/><line class="a" y1="1.099" x2="1.099" transform="translate(2.778 2.778)"/><line class="a" y1="1.977" x2="1.977" transform="translate(0.973 1.852)"/></g><g transform="translate(12.033 10.395)"><line class="a" y1="1.977" x2="1.977" transform="translate(0 0)"/><line class="a" y1="1.099" x2="1.099" transform="translate(1.804 0.926)"/><line class="a" y1="1.977" x2="1.977" transform="translate(2.778 2.778)"/><line class="a" y1="1.099" x2="1.099" transform="translate(2.73 1.852)"/></g><g transform="translate(0 0)"><path class="b" d="M102.463,535.153l-5.283-5.283-3.724,3.724,5.283,5.283" transform="translate(-93.456 -529.871)"/><rect class="c" width="5.267" height="8.084" transform="translate(8.681 12.515) rotate(-45)"/></g><g transform="translate(3.452 1.941)"><path class="d" d="M101.265,547.362l11.892-11.892-2.429-2.429L98.836,544.934" transform="translate(-98.836 -533.042)"/></g><line class="a" x2="2.489" y2="2.489" transform="translate(2.016 13.997)"/><g transform="translate(0.241 0.729)"><path class="a" d="M116.337,534.7l.384-.384a1.488,1.488,0,0,0,0-2.1h0l-.384-.384a1.489,1.489,0,0,0-2.105,0l-.384.384" transform="translate(-99.626 -531.39)"/><path class="a" d="M98.723,547.538l12.19-12.19-2.489-2.489-12.19,12.19-1.765,4.072a.146.146,0,0,0,.191.191Z" transform="translate(-94.458 -531.782)"/></g></g></g></svg>

img/menu/discuss.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="19.651" height="16.774" viewBox="0 0 19.651 16.774"><defs><style>.a,.b,.c{fill:none;stroke-miterlimit:10;}.a{stroke:#dc5d00;stroke-width:2px;}.a,.c{stroke-linecap:round;}.b,.c{stroke:#4c4c4c;}</style></defs><g transform="translate(-36.5 -562.173)"><g transform="translate(-765.112 850)"><g transform="translate(805.046 -284.126)"><path class="a" d="M442.421,659.288H454.9" transform="translate(-442.421 -659.288)"/><path class="a" d="M442.421,663.267H454.9" transform="translate(-442.421 -660.504)"/><path class="a" d="M442.421,667.246H454.9" transform="translate(-442.421 -661.72)"/></g><g transform="translate(802.112 -287.327)"><path class="b" d="M455.314,666.05a1.616,1.616,0,0,0,1.612-1.612v-9.612a1.616,1.616,0,0,0-1.612-1.612H439.887a1.616,1.616,0,0,0-1.612,1.612v9.612a1.616,1.616,0,0,0,1.612,1.612h4.022v2.757a.174.174,0,0,0,.273.143l3.79-2.885S452.809,666.05,455.314,666.05Z" transform="translate(-438.275 -653.215)"/><g transform="translate(3.233 3.467)"><path class="c" d="M442.932,658.208h12.478" transform="translate(-442.932 -658.208)"/><path class="c" d="M442.932,662.187h12.478" transform="translate(-442.932 -659.424)"/><path class="c" d="M442.932,666.166h12.478" transform="translate(-442.932 -660.641)"/></g></g></g></g></svg>

img/menu/fb.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="43" height="43" viewBox="0 0 43 43"><defs><style>.a{fill:#3b5998;}.b{fill:#fff;}</style></defs><g transform="translate(0.385 0.231)"><g transform="translate(0)"><circle class="a" cx="21.5" cy="21.5" r="21.5" transform="translate(-0.385 -0.231)"/><path class="b" d="M25.623,17.387h2.267V14H25.223c-3.262.124-3.929,1.965-4,3.894h0v1.689H19v3.307h2.222v8.889h3.351V22.889h2.738l.533-3.316H24.574V18.551a1.084,1.084,0,0,1,1-1.165Z" transform="translate(-2.156 -1.555)"/></g></g></svg>

img/menu/freelecture.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="18.699" height="20.865" viewBox="0 0 18.699 20.865"><defs><style>.a{fill:#4c4c4c;}.b{fill:#ee7800;}</style></defs><g transform="translate(-36.005 -606.183)"><g transform="translate(36.005 606.183)"><path class="a" d="M39.454,8.695l1.131-1.132L37.931,4.909,36.8,6.042a9.674,9.674,0,0,1,2.654,2.653Z" transform="translate(-21.886 -2.787)"/><path class="a" d="M11.587,6.355a9.056,9.056,0,1,0,9.058,9.056,9.055,9.055,0,0,0-9.058-9.056Zm0,17.013a7.957,7.957,0,1,1,7.959-7.958,7.957,7.957,0,0,1-7.959,7.958Z" transform="translate(-2.533 -3.602)"/><path class="a" d="M18.336,1.9a9.057,9.057,0,0,1,3.755,0V1.211h.536V.048H17.8V1.212h.536Z" transform="translate(-11.158 -0.048)"/><path class="b" d="M23.327,11.447v6.878H30.2a6.878,6.878,0,0,0-6.878-6.878Z" transform="translate(-14.294 -6.488)"/></g></g></svg>

img/menu/lecture.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="14.802" height="22.366" viewBox="0 0 14.802 22.366"><defs><style>.a{fill:#ee7800;}.b{fill:#4c4c4c;stroke:#4c4c4c;stroke-width:0.3px;}</style></defs><g transform="translate(-38.436 -695.576)"><rect class="a" width="4.457" height="9.208" rx="1" transform="translate(46.883 705.17)"/><path class="b" d="M102.329,5.93a.69.69,0,0,0-.552-1.1H91.434V4.019a1.028,1.028,0,0,1,.3-.731l.975-.975a.347.347,0,0,0,.039-.047,1.208,1.208,0,1,0-.479-.479.343.343,0,0,0-.047.039l-.975.975a1.713,1.713,0,0,0-.5,1.219v.808H88.676a.69.69,0,0,0-.552,1.1l2.62,3.494V20H90.4a1.036,1.036,0,0,0-1.034,1.034v.69a.345.345,0,0,0,.345.345h11.033a.345.345,0,0,0,.345-.345v-.69A1.036,1.036,0,0,0,100.053,20h-.345V9.424ZM93.33.69a.517.517,0,1,1-.517.517A.518.518,0,0,1,93.33.69ZM98.674,20a.345.345,0,1,0,0,.69h1.379a.345.345,0,0,1,.345.345v.345H90.055v-.345a.345.345,0,0,1,.345-.345h6.9a.345.345,0,1,0,0-.69H91.434V7.585H97.3a.345.345,0,1,0,0-.69H91.089a.345.345,0,0,0-.345.345V8.275L88.676,5.517h13.1L99.709,8.275V7.24a.345.345,0,0,0-.345-.345h-.69a.345.345,0,1,0,0,.69h.345V20Z" transform="translate(-49.389 695.726)"/></g></svg>

img/menu/line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="42" height="43" viewBox="0 0 42 43"><defs><style>.a{fill:#00c200;}.b{fill:#fff;}</style></defs><g transform="translate(0.077 0.231)"><g transform="translate(0)"><g transform="translate(0)"><ellipse class="a" cx="21" cy="21.5" rx="21" ry="21.5" transform="translate(-0.077 -0.231)"/><g transform="translate(10.492 11.556)"><path class="b" d="M33.441,22.645A5.182,5.182,0,0,0,33.53,22c0-.276,0-.56,0-.836C33.272,16.618,28.552,13,22.774,13,16.818,13,12,16.831,12,21.56c0,4.347,4.071,7.938,9.352,8.489a.578.578,0,0,1,.516.64h0l-.222,2.027a.587.587,0,0,0,.516.649.578.578,0,0,0,.32-.062,25.582,25.582,0,0,0,8.712-6.276,23.306,23.306,0,0,0,1.422-2.018A7.209,7.209,0,0,0,33.441,22.645Z" transform="translate(-12 -13)"/><path class="a" d="M17.312,24.067V20.511a.551.551,0,0,0-.551-.551h0a.551.551,0,0,0-.551.551h0v4.107a.551.551,0,0,0,.551.551h2.2a.551.551,0,0,0,.551-.551h0a.551.551,0,0,0-.551-.551Z" transform="translate(-12.468 -13.773)"/><path class="a" d="M21.187,25.164h-.24a.418.418,0,0,1-.427-.427v-4.4a.418.418,0,0,1,.427-.427h.24a.427.427,0,0,1,.436.427v4.4a.427.427,0,0,1-.436.427Z" transform="translate(-12.946 -13.767)"/><path class="a" d="M25.88,20.461v2.533s-2.2-2.862-2.231-2.907a.587.587,0,0,0-.436-.178.569.569,0,0,0-.533.569v4.134a.551.551,0,0,0,.551.551h0a.551.551,0,0,0,.551-.551h0V22.088s2.231,2.9,2.267,2.925a.524.524,0,0,0,.373.151.569.569,0,0,0,.551-.569V20.452a.542.542,0,0,0-.551-.542h0a.542.542,0,0,0-.542.551Z" transform="translate(-13.186 -13.767)"/><path class="a" d="M31.748,20.461h0a.542.542,0,0,0-.551-.551H29a.542.542,0,0,0-.551.551h0v4.151a.551.551,0,0,0,.551.551h2.2a.551.551,0,0,0,.551-.551h0a.551.551,0,0,0-.551-.551H29.552v-.978H31.2a.542.542,0,0,0,.551-.551h0a.542.542,0,0,0-.551-.542H29.552v-.978H31.2a.551.551,0,0,0,.551-.551Z" transform="translate(-13.827 -13.767)"/></g></g></g></g></svg>

img/menu/pen.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22.286" height="19.944" viewBox="0 0 22.286 19.944"><defs><style>.a{fill:#ee7800;}.b,.c{fill:none;stroke:#4c4c4c;}.b{stroke-miterlimit:10;}.c{stroke-linecap:round;stroke-linejoin:round;}</style></defs><g transform="translate(-34 -422.079)"><g transform="translate(34 422.783)"><ellipse class="a" cx="3.257" cy="3.257" rx="3.257" ry="3.257" transform="translate(0 12.725)"/><g transform="translate(3.258)"><ellipse class="b" cx="1.273" cy="1.273" rx="1.273" ry="1.273" transform="translate(7.498 7.539)"/><path class="c" d="M312.787,654.5l-2.344,1.967-4.516-5.381,2.344-1.967" transform="translate(-294.462 -649.116)"/><line class="c" x1="7.17" y2="6.016" transform="translate(0.627 9.63)"/><path class="c" d="M304.807,657.29a7.6,7.6,0,0,0-2.2,5.876l-13.188,3.268,5.508-12.421a7.6,7.6,0,0,0,6.169-1.149" transform="translate(-289.416 -650.262)"/></g></g></g></svg>

img/menu/person.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="21.753" height="19.442" viewBox="0 0 21.753 19.442"><defs><style>.a{fill:#ee7800;}.b,.c{fill:none;stroke:#4c4c4c;}.b{stroke-miterlimit:10;}.c{stroke-linecap:round;stroke-linejoin:round;}</style></defs><g transform="translate(-34 -376.224)"><g transform="translate(34 376.724)"><path class="a" d="M137.115,739.537l-2.83-4.17,6.743-2.83,3.625,5.509" transform="translate(-134.285 -722.084)"/><g transform="translate(1.467)"><ellipse class="b" cx="3.666" cy="3.666" rx="3.666" ry="3.666" transform="translate(8.642 0)"/><path class="b" d="M156.866,733.1a3.939,3.939,0,0,0-2.632-3.358,4.036,4.036,0,0,0-4.769,1.874l-2.94,5.093a3.869,3.869,0,0,0-.245.518h-3.62a1.42,1.42,0,0,0-1.387,1.012,1.393,1.393,0,0,0,1.338,1.766h13.881a.647.647,0,0,0,.651-.663C157.1,737.638,156.937,734.141,156.866,733.1Z" transform="translate(-137.357 -721.565)"/><path class="c" d="M137.939,737.716l-2.653-3.91,6.322-2.653,3.4,5.165" transform="translate(-135.285 -722.13)"/><line class="c" y1="2.419" x2="1.466" transform="translate(5.202 13.205)"/></g></g></g></svg>

img/menu/phone.svg

@@ -0,0 +1,83 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 72 60" style="enable-background:new 0 0 72 60;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;}
+	.st1{enable-background:new    ;}
+	.st2{fill:#707070;}
+	.st3{fill:#ED7900;stroke:#ED7900;stroke-width:0.3;}
+</style>
+<g id="Group_83" transform="translate(1999 -1016)">
+	<rect id="Rectangle_94" x="-1999" y="1016" class="st0" width="72" height="60"/>
+	<g class="st1">
+		<path class="st2" d="M-1982,1061.3c-0.6,0.3-1.2,0.6-1.9,0.9v4.8c0,1.1-0.6,1.7-1.7,1.7h-1.5l-0.4-1.6c0.4,0.1,0.9,0.1,1.3,0.1
+			c0.4,0,0.6-0.2,0.6-0.6v-3.7c-0.6,0.2-1.3,0.5-2,0.7l-0.4-1.7c0.8-0.2,1.6-0.4,2.4-0.7v-3.6h-2.2v-1.5h2.2v-2.9h1.6v2.9h1.9v1.5
+			h-1.9v2.9c0.6-0.3,1.3-0.6,1.9-0.9V1061.3z M-1973,1057.9l-5.1,0.9c0.1,0.8,0.2,1.5,0.3,2.2c0.1,0.6,0.3,1.3,0.5,1.8
+			c1-1,1.9-2.2,2.7-3.6l1.4,0.7c-1,1.8-2.1,3.3-3.5,4.6c0.1,0.3,0.3,0.6,0.4,0.8c0.6,1,1.1,1.5,1.6,1.5c0.3-0.1,0.7-1,1.1-2.8
+			l1.4,0.9c-0.3,1-0.6,1.8-1,2.4c-0.4,0.8-0.9,1.2-1.4,1.2c-0.8,0-1.6-0.6-2.4-1.6c-0.3-0.4-0.6-0.9-0.9-1.5
+			c-1.1,0.8-2.3,1.4-3.6,1.9l-0.9-1.4c1.5-0.5,2.8-1.2,3.9-2c-0.2-0.6-0.4-1.2-0.6-1.8c-0.2-0.8-0.4-1.9-0.6-3l-2.1,0.4l-0.2-1.5
+			l2.2-0.4c-0.1-1.4-0.2-2.9-0.2-4.5h1.6c0,1.5,0,3,0.1,4.2l5-0.9L-1973,1057.9z M-1974.2,1055.2l-1.4,0.7c-0.5-0.8-1-1.6-1.6-2.2
+			l1.4-0.7C-1975.3,1053.7-1974.7,1054.5-1974.2,1055.2z"/>
+		<path class="st2" d="M-1967.1,1055.1h1.8v1.5h-5.4v-1.5h2.1c-0.2-0.6-0.5-1.1-0.7-1.7l1.5-0.4
+			C-1967.6,1053.8-1967.3,1054.5-1967.1,1055.1z M-1965.6,1068.5h-1.4v-0.7h-1.8v0.7h-1.5v-5.9h4.7V1068.5z M-1965.8,1057.7v1.4
+			h-4.3v-1.4H-1965.8z M-1965.8,1060v1.4h-4.3v-1.4H-1965.8z M-1967.1,1066.3v-2.4h-1.8v2.4H-1967.1z M-1962.2,1054.3v1.4h-2.8v-1.4
+			H-1962.2z M-1962.2,1058.6v1.4h-2.8v-1.4H-1962.2z M-1956.3,1068.8h-1.5v-0.9h-4.8v0.9h-1.5v-6.4h7.9V1068.8z M-1961.8,1058
+			l-0.9-1.2c0.8-1,1.4-2.3,1.7-3.7l1.4,0.2c-0.1,0.4-0.2,0.9-0.3,1.3h4.3v1.2c-0.3,1.1-0.7,2-1.1,2.7l-1.1-0.9
+			c0.3-0.4,0.5-1,0.7-1.6h-1.3c0,0.5-0.1,1-0.1,1.4c0.4,1.7,1.4,2.8,3,3.4l-0.6,1.3c-1.5-0.6-2.5-1.6-3-3c-0.6,1.4-1.7,2.3-3.2,3
+			l-0.6-1.3c1.7-0.7,2.7-1.8,3.1-3.5c0.1-0.3,0.1-0.8,0.1-1.4h-0.7C-1960.8,1056.6-1961.2,1057.4-1961.8,1058z M-1957.9,1066.4v-2.6
+			h-4.8v2.6H-1957.9z"/>
+		<path class="st2" d="M-1951.5,1055.1c-0.2-0.6-0.5-1.1-0.7-1.7l1.5-0.4c0.3,0.8,0.6,1.5,0.7,2.1h1.8v1.5h-5.5v-1.5H-1951.5z
+			 M-1951.8,1068.8h-1.5v-6.2h4.8v5.9h-1.5v-0.7h-1.8V1068.8z M-1948.7,1057.6v1.4h-4.4v-1.4H-1948.7z M-1948.7,1060v1.4h-4.4v-1.4
+			H-1948.7z M-1950,1064h-1.8v2.3h1.8V1064z M-1947.5,1059.4l-1-1.2c1.3-1.4,2.1-3.1,2.6-5.2l1.6,0.2c-0.1,0.5-0.3,1-0.4,1.5h6
+			c0,6.5-0.1,10.5-0.3,12c-0.2,1.3-1,2-2.4,2c-0.4,0-1,0-1.9-0.1l-0.4-1.5c0.8,0.1,1.5,0.1,2.1,0.1c0.7,0,1.1-0.4,1.2-1.2
+			c0.1-1,0.2-4.2,0.2-9.7h-5.1c-0.3,0.6-0.6,1.1-1,1.6h4.4v8.1h-5.1v-7.2C-1947.2,1059-1947.3,1059.2-1947.5,1059.4z
+			 M-1943.3,1061.2v-2h-2.2v2H-1943.3z M-1943.3,1062.5h-2.2v2.1h2.2V1062.5z"/>
+	</g>
+	<g id="Group_408" transform="translate(-1964.225 1024.401)">
+		<g id="Group_407" transform="translate(0)">
+			<path id="Path_2432" class="st3" d="M11.6,4.5c-0.2-0.9-0.6-1.7-1.2-2.4c-0.3-0.4-0.6-0.7-1-0.9C8.4,0.4,7.2,0,5.9,0l0,0
+				C5.6,0,5.2,0,4.8,0.1c-1.1,0.2-2.1,0.7-3,1.5C0.6,2.7,0,4.3,0,5.9c0,1,0.3,2,0.8,2.9C0.8,8.9,0.9,9.1,1,9.2l-0.9,1.7
+				c-0.2,0.3,0,0.6,0.2,0.8c0.1,0,0.2,0.1,0.3,0.1l0,0c0.1,0,0.2,0,0.3-0.1l1.9-1c0,0,0,0,0,0l0,0c0,0,0.1-0.1,0.1-0.1l0,0
+				c0,0,0-0.1,0-0.1l0,0c0,0,0-0.1,0-0.1l0,0c0,0,0-0.1-0.1-0.1l0,0c0,0,0,0-0.1,0l0,0c-0.1,0-0.1-0.1-0.2,0h0l0,0l0,0
+				c0,0-0.1,0-0.1,0l-1.8,1l1-1.8c0.1-0.1,0-0.2,0-0.3C1.5,8.9,1.4,8.7,1.3,8.5C0.9,7.7,0.6,6.8,0.6,5.9c0-1.4,0.6-2.8,1.6-3.8
+				c1-0.9,2.3-1.5,3.7-1.5l0,0c1.1,0,2.2,0.4,3.2,1.1c2.3,1.8,2.8,5.1,1,7.4C9.9,9.3,9.8,9.5,9.6,9.7c-1,0.9-2.3,1.5-3.7,1.5l0,0
+				c-0.7,0-1.4-0.1-2.1-0.4c-0.2-0.1-0.3,0-0.4,0.2c-0.1,0.2,0,0.3,0.2,0.4l0,0l0,0c0.7,0.3,1.5,0.5,2.3,0.5l0,0
+				c0.4,0,0.8,0,1.1-0.1c1.1-0.2,2.1-0.7,3-1.5c1.2-1.1,1.8-2.7,1.8-4.3C11.8,5.4,11.7,5,11.6,4.5L11.6,4.5z"/>
+		</g>
+	</g>
+	<g id="Group_410" transform="translate(-1957.351 1029.992)">
+		<g id="Group_409" transform="translate(0 0)">
+			<path id="Path_2433" class="st3" d="M0.4,0C0.2,0,0,0.1,0,0.2c0,0.2,0.1,0.3,0.2,0.4s0.3-0.1,0.4-0.2c0,0,0-0.1,0-0.1
+				C0.6,0.1,0.5,0,0.4,0z"/>
+		</g>
+	</g>
+	<g id="Group_412" transform="translate(-1959.761 1029.992)">
+		<g id="Group_411" transform="translate(0 0)">
+			<path id="Path_2434" class="st3" d="M0.4,0C0.2,0,0,0.1,0,0.2c0,0.2,0.1,0.3,0.2,0.4s0.3-0.1,0.4-0.2c0,0,0-0.1,0-0.1
+				C0.6,0.1,0.5,0,0.4,0z"/>
+		</g>
+	</g>
+	<g id="Group_414" transform="translate(-1958.555 1029.992)">
+		<g id="Group_413" transform="translate(0 0)">
+			<path id="Path_2435" class="st3" d="M0.4,0C0.2,0,0,0.1,0,0.2c0,0.2,0.1,0.3,0.2,0.4s0.3-0.1,0.4-0.2c0,0,0-0.1,0-0.1
+				C0.6,0.1,0.5,0,0.4,0z"/>
+		</g>
+	</g>
+	<g id="Group_416" transform="translate(-1973 1027.635)">
+		<g id="Group_415" transform="translate(0 0)">
+			<path id="Path_2436" class="st3" d="M17.4,12.2L17.4,12.2L17.4,12.2c0-0.1-0.1-0.2-0.2-0.2c0,0-0.1,0-0.1,0l0,0c0,0-0.1,0-0.1,0
+				c-0.1,0-0.1,0-0.2,0.1l0,0c-0.1,0.1-0.1,0.1-0.1,0.2c0,0,0,0,0,0.1l0,0c0,0,0,0,0,0c0,0.2,0.1,0.5,0.1,0.7c0,1-0.4,2-1.1,2.7
+				c-0.7,0.7-1.7,1.1-2.7,1.1c-0.1,0-0.1,0-0.2,0c-3.9-0.2-7.5-2.1-9.8-5.2c-1.5-2-2.4-4.4-2.5-7c0-0.1,0-0.1,0-0.2
+				c0-2.1,1.7-3.7,3.7-3.7c0,0,0,0,0.1,0c0.2,0,0.4,0,0.6,0C6.2,0.8,7.1,1.8,7.1,3v1.6c0,0.9-0.8,1.6-1.7,1.6H5
+				c-0.2,0-0.3,0.1-0.3,0.3c0,0,0,0.1,0,0.1c0.2,0.7,0.6,1.4,1,2.1c1.2,2,3.2,3.4,5.4,4c0.2,0,0.3,0,0.4-0.2c0,0,0-0.1,0-0.1V12
+				c0-0.4,0.2-0.8,0.5-1.2c0.3-0.4,0.8-0.5,1.3-0.5h1.2c0.8,0,1.5,0.4,2,1c0.1,0.1,0.3,0.2,0.4,0.1s0.2-0.3,0.1-0.4l0,0
+				c-0.4-0.6-1-1-1.7-1.2c-0.2-0.1-0.5-0.1-0.7-0.1h-1.2c-0.7,0-1.3,0.2-1.8,0.7c-0.2,0.2-0.4,0.5-0.5,0.7c-0.1,0.3-0.2,0.5-0.2,0.8
+				V12c-2.5-0.8-4.5-2.7-5.4-5.2C6,6.8,6.6,6.6,7,6.2c0.4-0.4,0.7-1,0.7-1.6V3c0-0.7-0.3-1.4-0.7-2C6.5,0.5,5.8,0.1,5.1,0
+				C4.8,0,4.6,0,4.4,0l0,0C3.8,0,3.2,0.1,2.6,0.3C1,1,0,2.6,0,4.3c0,0.1,0,0.2,0,0.3c0.1,2.6,1.1,5.2,2.7,7.3
+				c2.4,3.2,6.2,5.2,10.2,5.4c0.1,0,0.2,0,0.2,0l0,0c1.2,0,2.3-0.5,3.1-1.3c0.8-0.8,1.3-1.9,1.3-3.1C17.5,12.7,17.5,12.4,17.4,12.2
+				L17.4,12.2z"/>
+		</g>
+	</g>
+</g>
+</svg>

img/menu/pinterest.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="42.308" height="42.304" viewBox="0 0 42.308 42.304"><defs><style>.a{fill:#e42b33;}.a,.b{fill-rule:evenodd;}.b{fill:#fefefe;}</style></defs><g transform="translate(0)"><path class="a" d="M1243.975,388.647a21.152,21.152,0,1,1-21.151,21.152,21.155,21.155,0,0,1,21.151-21.152Z" transform="translate(-1222.824 -388.647)"/><path class="b" d="M1296.88,435.834c-7.125,0-10.719,4.87-10.719,8.933a8.016,8.016,0,0,0,.279,2.146,4.724,4.724,0,0,0,2.793,3.319.517.517,0,0,0,.749-.355c.069-.252.232-.887.308-1.15a.668.668,0,0,0-.215-.8,3.814,3.814,0,0,1-.818-1.482,4.8,4.8,0,0,1-.175-1.322c0-3.617,2.84-6.856,7.386-6.856,4.024,0,6.242,2.347,6.242,5.483a12.53,12.53,0,0,1-.278,2.644c-.627,2.867-2.271,4.962-4.477,4.962a2.246,2.246,0,0,1-2.369-2.753c.215-.864.529-1.763.79-2.6a8.961,8.961,0,0,0,.534-2.472,1.948,1.948,0,0,0-2.021-2.146c-1.609,0-2.9,1.58-2.9,3.7a5.768,5.768,0,0,0,.1,1.07,4.624,4.624,0,0,0,.377,1.2s-1.643,6.633-1.928,7.795a15.293,15.293,0,0,0-.046,5.437.2.2,0,0,0,.36.08,15.2,15.2,0,0,0,2.706-4.675c.186-.641,1.051-3.937,1.051-3.937a4.367,4.367,0,0,0,3.664,1.785c3.931,0,6.829-2.782,7.77-6.845a13.1,13.1,0,0,0,.325-2.959c0-4.246-3.768-8.2-9.494-8.2Z" transform="translate(-1274.674 -427.134)"/></g></svg>

img/menu/prize.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="11.343" height="17.253" viewBox="0 0 11.343 17.253"><defs><style>.a{fill:#ee7800;}.b{fill:none;stroke:#4c4c4c;stroke-linecap:round;stroke-linejoin:round;}</style></defs><g transform="translate(-40.497 -792.374)"><circle class="a" cx="3" cy="3" r="3" transform="translate(44 796)"/><g transform="translate(40.997 792.874)"><path class="b" d="M17.843,6.671A5.171,5.171,0,1,1,12.671,1.5a5.171,5.171,0,0,1,5.171,5.171Z" transform="translate(-7.5 -1.5)"/><path class="b" d="M11.394,20.827l-.894,6.73,3.694-2.216,3.694,2.216-.894-6.738" transform="translate(-9.022 -11.305)"/></g></g></svg>

img/menu/shopping.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30">
+  <g id="shopping" transform="translate(-1232 -918)">
+    <rect id="Rectangle_1828" data-name="Rectangle 1828" width="30" height="30" transform="translate(1232 918)" fill="none"/>
+    <g id="shopping-bag" transform="translate(1190.2 923)">
+      <path id="Path_2525" data-name="Path 2525" d="M64.8,17.288l-1.145-12.9a.551.551,0,0,0-.548-.5H60.755a3.951,3.951,0,0,0-7.9,0H50.5a.548.548,0,0,0-.548.5L48.8,17.288c0,.016,0,.033,0,.049A2.85,2.85,0,0,0,51.8,20h10a2.85,2.85,0,0,0,3-2.663A.2.2,0,0,0,64.8,17.288ZM56.8,1.1A2.85,2.85,0,0,1,59.651,3.89H53.957A2.85,2.85,0,0,1,56.8,1.1Zm5,17.791h-10a1.762,1.762,0,0,1-1.9-1.534L51,5h1.849V6.675a.552.552,0,0,0,1.1,0V5h5.7V6.675a.552.552,0,0,0,1.1,0V5H62.6l1.1,12.364A1.765,1.765,0,0,1,61.806,18.9Z" transform="translate(0)" fill="#727679"/>
+    </g>
+  </g>
+</svg>