@charset "UTF-8";
/* ---- 顏色庫 ---- */
/* ---- 滑鼠手勢 ---- */
/* ---- 版面排版 ---- */
.w100{
    width:100%;
}

.w60 {
    width: 60%;
}

.w50 {
    width: 50%;
}

.w40 {
    width: 40%;
}

.w25{
    width:25%;
}

/* ---- 版面定位 ---- */
/* ---- RWD的斷點 ---- */
/* ---- 共同設定 ---- */
/* ---- 區塊水平置中 ---- */
/* ---- 客製化下拉式選單 ---- */
/* ---- 按鈕外觀 ---- */
/* ---- 按鈕顏色 ---- */
.fwarn {
    color: red;
}
.fred {
    color: red;
}
.fgray {
    color: gray;
}
.fgreen {
    color: green;
}
.fmB {
    color: #0067b3;
}
/* ---- 重點備註 ---- */
/* ---- 圓角半徑 ---- */
/* ---- 字體字級 ---- */
/* ---- 字體粗細 ---- */
/* ---- 字體顏色 ---- */
/* ---- 字體間距 ---- */
/* ---- INPUT 外框 ---- */
/* ---- 陰影 ---- */
/* ---- 表格的ICON ---- */
/* ---- CLEARFIX ---- */
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url(https://fonts.googleapis.com/earlyaccess/cwtexkai.css);
* {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  letter-spacing: 1px;
  margin: 0;
  padding: 0;
}

body {
  font-family: "Noto Sans TC", sans-serif;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
}

ul {
  list-style-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

.inline{
    display:inline;
}

html::-webkit-scrollbar-track {
  background: transparent;
}

html::-webkit-scrollbar {
  background: #dcdfe9;
  height: 8px;
  width: 8px;
}

html::-webkit-scrollbar-thumb {
  background: #0067b3;
}

::-moz-placeholder {
  color: #b4b4b4;
  font-size: 13px;
  font-weight: 500;
}

::placeholder {
  color: #b4b4b4;
  font-size: 13px;
  font-weight: 500;
}

.wrapper {
  background: #f5f6fa;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  position: relative;
  width: 100%;
}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

/* --主版-版頭的CSS--------------------------------- */
.headerUI {
  background: #fff;
  box-shadow: 0 2px 3.2px rgba(0, 0, 0, 0.22);
  padding: 0 20px;
  position: fixed;
  width: 100%;
  z-index: 100;
}
.headerUI .content {
  line-height: 50px;
}
.headerUI img.logo {
  float: left;
  height: auto;
  max-width: 132px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.headerUI ul.menu {
  float: right;
  list-style-type: none;
  padding: 10.8px 0;
}
.headerUI ul.menu li {
  display: inline-block;
  padding-right: 12px;
}
.headerUI ul.menu li.pr0 {
  padding-right: 0;
}
.headerUI ul.menu li.loginInHide {
 
}
.headerUI ul.menu li.mainSubMenu {
  position: relative;
}
.headerUI ul.menu a {
  color: #353b39;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.12s ease-in-out 0s;
}
.headerUI ul.menu a.selected, .headerUI ul.menu a:not(.btn):active, .headerUI ul.menu a:not(.btn):hover {
  color: #0067b3;
}
.headerUI ul.menu a.btn {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 46px;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  display: block;
  height: 46px;
  line-height: 42px;
  padding: 0 16px;
  text-align: center;
  transform: translateY(-2px);
  width: 112px;
}
.headerUI ul.menu a.btn:active, .headerUI ul.menu a.btn:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}
.headerUI ul.menu ul.subMenu {
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
  border-radius: 0 0 6px 6px;
  display: none;
  left: 0;
  padding: 5px 14px 10px;
  position: absolute;
  transform: translateY(11px);
  width: 160px;
}
.headerUI ul.menu ul.subMenu li {
  display: block;
  line-height: 34px;
  padding: 0;
}

/* --內頁-房產大小事的CSS--------------------------------- */
.knowledgeBox {
  margin: 0 auto;
  max-width: 1222px;
  padding-bottom: 102px;
  width: 100%;
}
.knowledgeBox h2 {
  color: #353b39;
  font-size: 26px;
  font-weight: 700;
}
.knowledgeBox .tabContent:not(.tabContentFirst) {
  display: none;
}

.projectListBox.desktopHide {
  display: none;
}
.projectListBox .tabContent:not(.tabContentFirst) {
  display: none;
}

.knowledgeListBox {
  border: 1px solid #dcdcdc;
  margin-top: 32px;
  padding: 20px 22px 0;
  width: 100%;
}
.knowledgeListBox .knowledgeContent {
  border-bottom: 1px solid #dcdcdc;
  display: flex;
  padding-bottom: 24px;
}
.knowledgeListBox .knowledgeContent:last-of-type {
  border-bottom: none;
  padding: 24px 0 2.4% !important;
}
.knowledgeListBox .knowledgeContent .knowledgePic {
  width: 31.359%;
}
.knowledgeListBox .knowledgeContent .knowledgePic img {
  height: auto;
  max-width: 100%;
}
.knowledgeListBox .knowledgeContent .knowledgeText {
  margin-left: 24px;
  width: 68%;
}
.knowledgeListBox .knowledgeText {
  margin-top: -2px;
}
.knowledgeListBox .knowledgeText h3 {
  color: #353b39;
  font-size: 24px;
  line-height: 32px;
  padding-bottom: 8px;
  text-align: justify;
}
.knowledgeListBox .knowledgeText .text {
  margin-top: 8px;
  position: relative;
}
.knowledgeListBox .knowledgeText .text p {
  color: #353b39;
  display: -webkit-box;
  font-size: 15px;
  font-weight: 500;
  line-height: 25px;
  max-height: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.knowledgeListBox .knowledgeText button.readMoreBtn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: none;
  border: none;
  bottom: 0;
  color: #0067b3;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  opacity: 1;
  position: absolute;
  right: 0;
  transition: all 0.4s ease-in-out 0s;
  transform: translateY(-4px);
}
.knowledgeListBox .knowledgeText .text button.readMoreBtn:hover {
  opacity: 0.7;
}
.knowledgeListBox .knowledgeText .text button.readMoreBtn a {
  color: #0467b3;
  text-decoration: none;
}
.knowledgeListBox .knowledgeText span.date {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0;
}
.knowledgeListBox ul.pagination {
  padding-bottom: 4%;
}

/* --地圖搜尋-物件首頁頁面的CSS--------------------------------- 沒引用 */
/*.mapSearchResultBox {
  margin-top: 26px;
  position: relative;
  width: 100%;
}
.mapSearchResultBox .leftContent {
  bottom: -6px;
  float: left;
  position: absolute;
}
.mapSearchResultBox .leftContent p {
  color: #353b39;
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
}
.mapSearchResultBox .leftContent span.number {
  color: #0067b3;
  font-family: "Myriad Pro", sans-serif;
  font-size: 64px;
  font-weight: 700;
  margin-right: 3.2px;
}
.mapSearchResultBox .rightContent {
  display: flex;
  float: right;
}
.mapSearchResultBox .rightContent button {
  background: linear-gradient(-180deg, #ffffff 60%, #e0e0e0 100%);
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(43, 43, 43, 0.32);
  color: #353b39;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 46px;
  line-height: 42px;
  margin-right: 24px;
  padding: 0 14px;
}
.mapSearchResultBox .rightContent button:last-of-type {
  margin-right: 0;
}
.mapSearchResultBox .rightContent button:active, .mapSearchResultBox .rightContent button:hover {
  background: linear-gradient(0deg, #fff 60%, #ebecf0 100%);
}

.mapProjectBox {
  filter: drop-shadow(0 2px 2.5px rgba(0, 0, 0, 0.24));
  margin-top: 28px;
  width: 100%;
}
.mapProjectBox .mapUI {
  border: none;
  height: 640px;
  overflow: hidden;
  width: 100%;
}

table.mapTable {
  border-collapse: collapse;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  color: #353b39;
  margin-top: 34px;
  width: 100%;
}
table.mapTable thead {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  filter: drop-shadow(0 2px 2px rgba(43, 43, 43, 0.38));
  width: 100%;
}
table.mapTable thead tr {
  position: sticky;
}
table.mapTable thead th {
  border: none;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 56px;
  padding: 0 15px;
  text-align: justify;
  white-space: nowrap;
}
table.mapTable tbody {
  background: #fff;
  width: 100%;
}
table.mapTable tbody td {
  border: 1px solid #dcdcdc;
  color: #353b39;
  font-size: 15px;
  font-weight: 500;
  height: 52px;
  line-height: 25px;
  padding: 8px 15px;
  white-space: wrap;
}
table.mapTable tbody td.textNoWrap {
  white-space: nowrap;
}
table.mapTable tbody td a {
  color: #353b39;
  cursor: pointer;
  font-size: 15px;
  text-decoration: none;
  transition: all 0.12s ease-in-out 0s;
}
table.mapTable tbody td a:hover {
  color: #0067b3;
}
table.mapTable tbody tr:first-of-type td {
  border-top: none;
}
table.mapTable tbody span.tagUI {
  border: 1px solid #dcdcdc;
  color: #353b39;
  cursor: pointer;
  display: block;
  font-size: 12px;
  font-weight: 500;
  height: 32px;
  line-height: 30px;
  margin-bottom: 8px;
  overflow: hidden;
  padding: 0 6px;
  transition: all 0.12s ease-in-out 0s;
}
table.mapTable tbody span.tagUI:hover {
  border: 1px solid #0472c0;
  color: #0472c0;
}
table.mapTable tbody span.tagUI.bigSize {
  width: 88px;
}
table.mapTable tbody span.tagUI.smallSize {
  width: 75px;
}
table.mapTable tbody span.tagUI:last-of-type {
  margin-bottom: 0;
}*/

/* --內頁-隱私權政策頁面的CSS--------------------------------- */
.privacyBox {
  margin: 0 auto;
  max-width: 1222px;
  padding-bottom: 102px;
  width: 100%;
}
.privacyBox h2 {
  color: #353b39;
  font-size: 25px;
  font-weight: 700;
}
.privacyBox .tabContent:not(.tabContentFirst) {
  display: none;
}
.privacyBox .tabContent.selected {
  display: inherit;
}
.privacyBox .tabContent picture.aboutUsPic img {
  display: block;
  height: auto;
  margin: 32px auto 0 auto;
  width: 100%;
}
.privacyBox .tabContent .text {
  border-bottom: 1px solid #dcdcdc;
  padding: 18px 0;
}
.privacyBox .tabContent .text:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.privacyBox .tabContent .text.dFlex {
  display: flex;
}
.privacyBox .tabContent .text.pt0 {
  padding-top: 0;
}
.privacyBox .tabContent .qAndAListBox {
  margin-top: 30px;
}
.privacyBox .tabContent .qAndATitle {
  align-items: center;
  display: flex;
}
.privacyBox .tabContent .qAndATitle h3 {
  font-size: 22px;
  line-height: 32px;
  margin-left: 20px;
  text-align: justify;
  width: 80%;
}
.privacyBox .tabContent .qAndANo {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
  color: #fff;
  display: block;
  font-size: 26px;
  font-weight: 600;
  height: 50px;
  line-height: 46px;
  text-align: center;
  width: 54px;
}
.privacyBox .tabContent .qAndAText {
  padding-left: 74px;
}
.privacyBox .tabContent h3 {
  color: #353b39;
  font-size: 22px;
  font-weight: 700;
  line-height: 32px;
  padding-bottom: 12px;
}
.privacyBox .tabContent p {
  font-size: 15px;
  line-height: 27px;
  text-align: justify;
}
.privacyBox .tabContent p.pb {
  padding-bottom: 12px;
}
.privacyBox .tabContentFirst {
  border: none;
  box-shadow: none;
  padding: 0;
}
.privacyBox .tabContentFourth {
  border: 1px solid #dcdcdc;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  margin-top: 32px;
  padding: 0 22px 26px 22px;
}

/* --內頁-詳文頁面的CSS--------------------------------- */
#mask {
  background: rgba(0, 0, 0, 0.68);
  -webkit-backdrop-filter: blur(30px);
          backdrop-filter: blur(30px);
  display: none;
  height: 100%;
  padding: 16px;
  position: fixed;
  width: 100%;
  z-index: 100;
}

.floorPhotoModal {
  background: #fff;
  border-radius: 6px;
  box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.1);
  display: none;
  margin: 0 auto;
  max-width: 660px;
  padding: 12px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.floorPhotoModal .modalCloseBtn {
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.22));
  font-size: 24px;
  font-weight: 600;
  height: 40px;
  position: absolute;
  right: -20px;
  text-align: center;
  top: -20px;
  width: 40px;
}
.floorPhotoModal .modalCloseBtn:after, .floorPhotoModal .modalCloseBtn:before {
  content: "";
  background: #353b39;
  bottom: 0;
  display: block;
  height: 3.4px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 20px;
}
.floorPhotoModal .modalCloseBtn:after {
  transform: rotate(-45deg);
}
.floorPhotoModal .modalCloseBtn:before {
  transform: rotate(45deg);
}
.floorPhotoModal img {
  height: auto;
  width: 100%;
}

.socialShareModal {
  background: #fff;
  border-radius: 6px;
  display: none;
  margin: 0 auto;
  max-width: 380px;
  padding: 18px 18px 28px;
  transform: translateY(24%);
}
.socialShareModal h3 {
  color: #353b39;
  font-size: 22px;
  font-weight: 700;
}
.socialShareModal .btnGroup {
  display: block;
  margin-top: 20px;
}
.socialShareModal .btnGroup button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  border-radius: 6px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  display: block;
  font-size: 16px;
  font-weight: 700;
  height: 54px;
  letter-spacing: 0.2px;
  text-align: center;
  width: 100%;
}
.socialShareModal .btnGroup button img.icon {
  display: inline-block;
  height: auto;
  margin-right: 10px;
  max-width: 32px;
  vertical-align: middle;
}
.socialShareModal .btnGroup li {
  margin-bottom: 22px;
}
.socialShareModal .btnGroup button {
  width: 100%;
}
.socialShareModal .btnGroup button.fBSharingBtn {
  background: #1877f2;
  color: #fff;
}
.socialShareModal .btnGroup button.lineSharingBtn {
  background: #00b900;
  color: #fff;
}
.socialShareModal .btnGroup button.messengerSharingBtn, .socialShareModal .btnGroup button.twitterSharingBtn {
  background: #fff;
  border: 1px solid #dcdcdc;
  color: #353b39;
}
.socialShareModal button.closeModalBtn {
  background: linear-gradient(-180deg, #c4c5d0 40%, #b9bac4 100%);
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  border: none;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 52px;
  line-height: 48px;
  margin: 28px auto 0;
  width: 140px;
}
.socialShareModal button.closeModalBtn:hover {
  background: linear-gradient(0deg, #c4c5d0 40%, #b9bac4 100%);
}

#mask2 {
    background: rgba(0, 0, 0, 0.68);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    display: none;
    height: 100%;
    padding: 16px;
    position: fixed;
    width: 100%;
    z-index: 100;
}

.CopyPageBox {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    width: 400px;
    height: 500px;
    background-color: #fff;
    padding: 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.copyTop{
    display:flex;
    justify-content:center;
}

.copyProjectText{
    padding:10px;
    border:2px solid #353b39;
    height:400px;
}

.ProjectCopy{
    float:right;
}

.projectDetailBox {
    margin: 0 auto;
    max-width: 1222px;
    width: 100%;
}

.projectDetailBox > section{
    margin:0 10px 20px 10px;
}

.projectInfoBox {
    display: flex;
    margin-bottom: 40px;
}
.projectInfoBox .leftContent {
  width: 67%;
}
.projectInfoBox .leftContent h2 {
  color: #353b39;
  font-size: 28px;
  font-weight: 700;
}
.projectInfoBox .addressBox {
  border-bottom: 1px solid #dcdcdc;
  margin-top: 14px;
  padding-bottom: 14px;
}
.projectInfoBox .addressBox p {
  color: #353b39;
  display: block;
  float: left;
  font-size: 15px;
  font-weight: 600;
  line-height: 25px;
  text-align: justify;
}
.projectInfoBox .addressBox a {
  color:black;
}
.projectList .label {
    padding: 8px;
    display: flex;
    border-radius: 5px;
    text-align: center;
    background-color: white;
    height: 25px;
    opacity: 0.8;
    position: absolute;
    top: 7px;
    right: 10px;
    z-index: 1;
    justify-content: center;
    align-items: center;
}
.projectInfoBox .addressBox ul.linkBtnBox {
  display: flex;
  float: left;
  flex-wrap: wrap;
  margin: 2.2px 0 0 14px;
}
.projectInfoBox .addressBox li {
  margin-right: 12px;
  position: relative;
}
.projectInfoBox .addressBox li a {
  color: #353b39;
  font-size: 15px;
  font-weight: 600;
  position: relative;
  text-decoration: none;
}
    .projectInfoBox .addressBox li.reportErrorBtn a {
        padding-left: 22px;
    }

        .projectInfoBox .addressBox li.reportErrorBtn a:before {
            content: "";
            background: url(../images/reportError.png) no-repeat;
            background-size: 16px 17px;
            bottom: 0;
            display: block;
            height: 17px;
            left: 0;
            margin: auto;
            position: absolute;
            top: 0;
            width: 16px;
        }
.projectInfoBox .addressBox li.socialShareBtn a {
  padding-left: 22px;
}
.projectInfoBox .addressBox li.socialShareBtn a:before {
  content: "";
  background: url(../images/shareBtnIcon.png) no-repeat;
  background-size: 16px 17px;
  bottom: 0;
  display: block;
  height: 17px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 16px;
}
.projectInfoBox .addressBox li.joinLoveBtn a {
  padding-left: 22px;
}
.projectInfoBox .addressBox li.joinLoveBtn a:before {
  content: "";
  background: url(../images/joinLoveBtn.png) no-repeat;
  background-size: 16px 15px;
  bottom: 0;
  display: block;
  height: 15px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 16px;
}
.projectInfoBox .addressBox li.removeLoveBtn a {
  padding-left: 22px;
}
.projectInfoBox .addressBox li.removeLoveBtn a:before {
  content: "";
  background: url(../images/removeLoveBtn1.png) no-repeat;
  background-size: 16px 15px;
  bottom: 0;
  display: block;
  height: 15px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 90px;
}
.projectInfoBox .addressBox li.contactUsBtn a {
  padding-left: 30px;
}
.projectInfoBox .addressBox li.contactUsBtn a:before {
  content: "";
  background: url(../images/contactBtnIcon.png) no-repeat;
  background-size: 24px 17px;
  bottom: 0;
  display: block;
  height: 17px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 24px;
}
.projectInfoBox .sliderBox {
  padding-top: 18px;
}
.projectInfoBox .sliderBox .bigPicBox img {
  display: block;
  height: auto;
  margin: 0 auto;
  width: 100%;
}
.projectInfoBox .sliderBox .smallPicBox {
  display: flex;
  margin-top: 12px;
}
.projectInfoBox .sliderBox .smallPicBox li {
  margin-right: 16px;
}
.projectInfoBox .sliderBox .smallPicBox li:last-of-type {
  margin-right: 0;
}
.projectInfoBox .sliderBox .smallPicBox li img.selected {
  border: 4px solid #0067b3;
}
.projectInfoBox .sliderBox .smallPicBox img {
  height: auto;
  width: 100%;
}
.projectInfoBox .rightContent {
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  margin-left: 52px;
  padding: 24px 18px 18px;
  position: relative;
  transform: translateY(-8px);
  width: 30%;
}
.projectInfoBox .rightContent:before {
  content: "";
  background: #0067b3;
  display: block;
  height: 8px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.projectInfoBox .rightContent .salesIntroBox {
  border-bottom: 1px solid #dcdcdc;
  display: flex;
  padding-bottom: 18px;
}
.projectInfoBox .rightContent .profilePhoto {
  width: 44%;
}
.projectInfoBox .rightContent img.salesPhoto {
  border: 1px solid #dcdcdc;
  border-radius: 50%;
  height: auto;
  max-width: 100%;
}
.projectInfoBox .salesName {
  padding-left: 29px;
  width: 57%;
}
.projectInfoBox .salesName h2 {
  color: #353b39;
  font-size: 22px;
  font-weight: 700;
  padding: 6px 0;
}
.projectInfoBox .salesName h4 {
  color: #737378;
  font-size: 16px;
  font-weight: 700;
}
.projectInfoBox .salesName a.telNo {
  color: #353b39;
  font-size: 18px;
  font-weight: 700;
  text-decoration: underline;
}
.projectInfoBox .salesName .socialBtn {
  display: flex;
  margin-top: 18px;
}
.projectInfoBox .salesName .socialBtn img {
  height: auto;
  max-width: 38px;
}
.projectInfoBox .salesName .socialBtn li {
  margin-right: 10px;
}
.projectInfoBox .salesName .socialBtn li:last-of-type {
  margin-right: 0;
}
.projectInfoBox ul.projectInfoList {
  display: flex;
  flex-wrap: wrap;
  line-height: 49px;
  margin-top: 6px;
}
.projectInfoBox ul.projectInfoList li {
  align-items: center;
  display: flex;
  width: 100%;
}
.projectInfoBox ul.projectInfoList li.mobileShow {
  display: none;
}
.projectInfoBox ul.projectInfoList h5 {
  color: #353b39;
  float: left;
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  transform: translateY(-1px);
  width: 34%;
}
.projectInfoBox ul.projectInfoList p {
  color: #353b39;
  float: left;
  line-height: 28px;
  text-align: left;
  width: 70%;
}
.projectInfoBox ul.projectInfoList span.bigText {
  color: #0067b3;
  font-size: 20px;
  font-weight: 700;
}
.projectInfoBox ul.projectInfoList span.dateText {
  color: #0067b3;
  font-family: "Myriad Pro", sans-serif !important;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 0.2px;
}
.projectInfoBox ul.projectInfoList span.dateText.mr {
  margin-right: 4px;
}
.projectInfoBox ul.projectInfoList span.number {
  color: #0067b3;
  font-family: "Myriad Pro", sans-serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 0.2px;
}
.projectInfoBox ul.projectInfoList span.smallText {
  color: #353b39;
  font-size: 14px;
  font-weight: 700;
  margin-left: 2px;
}

button.checkMoreProjectBtn {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
  border: none;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 48px;
  line-height: 42px;
  margin-top: 10px;
  text-decoration: none;
  width: 100%;
}
button.checkMoreProjectBtn img.icon {
  display: inline-block;
  height: auto;
  margin-left: 10px;
  max-width: 22px;
  vertical-align: text-bottom;
}
button.checkMoreProjectBtn:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}

.projectDetailBox .projectFeatureBox  {
  display: flex;
  flex-wrap: nowrap;
}
.projectDetailBox .projectFeatureBox .featureContentBox {
  display:flex;
  flex-wrap:wrap;
  width: 100%;
  align-content:flex-start;
}
.projectDetailBox .projectFeatureBox .floorPhotoBox {
  margin-left: 48px;
  width: 43%;
}
.projectDetailBox .projectFeatureBox .floorPhotoBox img {
  height: auto;
  width: 100%;
}
.projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox {
  display: block;
  margin-top: 8px;
}
.projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox li {
  cursor: pointer;
  margin-bottom: 28px;
  opacity: 1;
  transition: all 0.7s ease-in-out 0s;
}
.projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox li:last-child {
  margin-bottom: 0;
}
.projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox li:hover {
  opacity: 0.82;
}
.projectDetailBox section div.title {
  display:block;
  padding-bottom: 10px;
  width:100%;
}
.projectDetailBox .projectFeatureBox h3 {
  color: #353b39;
  float: left;
  font-size: 25px;
  font-weight: 700;
}

.projectDetailBox .projectFeatureBox .text.dFlex {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
}



.projectDetailBox .projectFeatureBox .text p {
  color: #353b39;
  font-size: 15px;
  font-weight: 500;
  line-height: 25px;
  text-align: justify;
}



.projectDetailBox .projectFeatureBox .text span.readMoreText {
  display: none;
}
.projectDetailBox .projectFeatureBox button.readMoreBtn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: none;
  border: none;
  bottom: 0;
  color: #0067b3;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  opacity: 1;
  position: absolute;
  right: 0;
  transition: all 0.4s ease-in-out 0s;
  transform: translateY(-4px);
}
.projectDetailBox .projectFeatureBox button.readMoreBtn:hover {
  opacity: 0.7;
}
.tagUIBox {
    display: block;
    position: absolute;
    bottom: 15px;
    left: 15px;
}
.tagUIBox span {
    border: 1px solid #dcdcdc;
}
.projectDetailBox .projectFeatureBox .tagUIBox {
  display: flex;
  flex-wrap: nowrap;
  float: left;
  margin-left: 8px;
}
.projectDetailBox .projectFeatureBox span.tagUI {
  border: 1px solid #dcdcdc;
  color: #353b39;
  cursor: pointer;
  display: block;
/*  display: inline-block;*/
  font-size: 12px;
  font-weight: 500;
  height: 32px;
  line-height: 30px;
  margin-right: 8px;
  overflow: hidden;
  padding: 0 6px;
  transition: all 0.12s ease-in-out 0s;
}
.projectDetailBox .projectFeatureBox span.tagUI:last-of-type {
  margin-right: 0;
}
.projectDetailBox .projectFeatureBox span.tagUI:hover {
  border: 1px solid #0067b3;
  color: #0067b3;
}

.projectDetailBox .projectAuthLoginBox h3 {
  color: #353b39;
  font-size: 25px;
  font-weight: 700;
}
.projectDetailBox .projectAuthLoginBox h4 {
  border-bottom: 1px solid #dcdcdc;
  color: #353b39;
  font-size: 23px;
  font-weight: 700;
  padding-bottom: 10px;
}
.projectDetailBox .projectAuthLoginBox h5 {
  color: #0067b3;
  font-size: 17px;
  font-weight: 700;
}
.projectDetailBox .projectAuthLoginBox .authLoginListBox {
  display: flex;
  flex-wrap: nowrap;
}
.projectDetailBox .projectAuthLoginBox .content {
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  border-top: 8px solid #0067b3;
  margin-right: 46px;
  padding: 16px 16px 28px;
  width: 33%;
}
.projectDetailBox .projectAuthLoginBox .content:last-of-type {
  margin-right: 0;
}
.projectDetailBox .projectAuthLoginBox .contentText {
  padding-top: 8px;
}
.projectDetailBox .projectAuthLoginBox .contentText li {
  line-height: 40px;
}
.projectDetailBox .projectAuthLoginBox .text {
  align-items: center;
  display: flex;
}
.projectDetailBox .projectAuthLoginBox .text p {
  color: #353b39;
  font-size: 15px;
  font-weight: 500;
  line-height: 27px;
}
.projectDetailBox .projectAuthLoginBox .text span.number {
  color: #353b39;
  font-family: "Myriad Pro", sans-serif;
  font-size: 30px;
  font-weight: 700;
}
.projectDetailBox .projectAuthLoginBox .text span.redNumber {
  color: #df1d3b;
  font-weight: 700;
}
.projectDetailBox .projectAuthLoginBox .memo {
  background: #eee;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  margin-top: 8px;
  padding: 10px;
}
.projectDetailBox .projectAuthLoginBox .memo p {
  color: #353b39;
  font-size: 15px;
  font-weight: 600;
  line-height: 25px;
  text-align: center;
}
.projectDetailBox .projectAuthLoginBox span.bigText {
  color: #353b39;
  font-family: "Myriad Pro", sans-serif;
  font-size: 20px;
  font-weight: 700;
}
.projectDetailBox .projectAuthLoginBox button {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
  border: none;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 46px;
  line-height: 42px;
  margin: 22px auto 8px auto;
  max-width: 120px;
  text-decoration: none;
  width: 100%;
}
.projectDetailBox .projectAuthLoginBox button:active, .projectDetailBox .projectAuthLoginBox button:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}

.projectDetailBox .otherProjectBox.pb {
  padding-bottom: 102px;
}
.projectDetailBox .otherProjectBox.sMt {
  margin-top: 30px;
}
.projectDetailBox .otherProjectBox h3 {
  color: #353b39;
  font-size: 25px;
  font-weight: 700;
}
.projectDetailBox .otherProjectBox li.projectCard {
  border: 1px solid #dcdcdc;
  float: left;
  width: 100% !important;
}
.projectDetailBox .otherProjectBox .projectCardPic, .projectDetailBox .otherProjectBox li.projectCard.relative {
  position: relative;
}
.projectDetailBox .otherProjectBox .projectMarkUI {
  background: rgba(255, 153, 51, 0.9);
  border-radius: 0 0 6px 0;
  display: block;
  height: 38px;
  padding: 8px 0 4px 0;
  position: absolute;
  top: 0;
  width: 102px;
  z-index: 100;
}
.projectDetailBox .otherProjectBox .projectMarkUI p {
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  margin: 0;
  text-align: center;
}
.projectDetailBox .otherProjectBox .adaptivePic {
  display: block;
  height: auto;
  overflow: hidden;
  padding-top: 56.7%;
  position: relative;
  width: 100%;
}
.projectDetailBox .otherProjectBox .adaptivePic img {
  bottom: 0;
  display: block;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}

.projectListBox .otherProjectSlider {
  display: flex;
}
.projectListBox .otherProjectSlider li.projectCard {
  width: 48.2% !important;
}
    .projectListBox .otherProjectSlider li.projectCard:nth-child(2n+2) {
        /*  margin-right: 0;*/
        
    }
.projectListBox .otherProjectSlider li.projectCard.salesProject:nth-child(3n+3) {
  margin-right: 3.5% !important;
}
.projectListBox .otherProjectSlider li.projectCard:nth-last-child(1), .projectListBox .otherProjectSlider li.projectCard:nth-last-child(2) {
  margin-bottom: 0 !important;
}

/* --內頁-業務個人形象頁面的CSS--------------------------------- */
.contentWrapper {
  background: linear-gradient(90deg, #0067b3 0%, #0472c0 40%, #077cc3 66%, #0a84c5 100%);
  padding: 88px 0 0 22px;
}
.contentWrapper .contentBox {
  background: #fff;
  border-bottom-left-radius: 22px;
  border-top-left-radius: 22px;
  padding-top: 24px;
  width: 100%;
}
.contentWrapper .contentBox.passwordPadding {
  padding: 3.2% 0 8%;
}
.contentWrapper h3 {
  color: #353b39;
  font-size: 22px;
  font-weight: 700;
}

.indexContentWrapper {
  background: linear-gradient(90deg, #0067b3 0%, #0472c0 40%, #077cc3 66%, #0a84c5 100%);
  padding: 73px 0 0 22px;
}
.indexContentWrapper .indexBox {
  background: #fff;
  border-bottom-left-radius: 22px;
  width: 100%;
}

.breadCrumbBox {
  margin: 0 auto;
  max-width: 1222px;
  padding-bottom: 18px;
  width: 100%;
}
.breadCrumbBox p, .breadCrumbBox p a {
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 26px;
  text-align: justify;
  transition: all 0.12s ease-in-out 0s;
}
.breadCrumbBox p a {
  text-decoration: underline;
  text-underline-offset: 6px;
}
.breadCrumbBox p a:active, .breadCrumbBox p a:hover {
  text-decoration: underline;
  text-underline-offset: 6px;
}
.breadCrumbBox p.fLeft {
  float: left;
}
.breadCrumbBox p.fRight {
  float: right;
}
.breadCrumbBox span.dash {
  padding: 0 4px;
}

.salesBox .salesBoxContent {
  align-items: center;
  background: #fff;
  border: 1px solid #dcdcdc;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  display: flex;
  margin: 0 auto;
  max-width: 1222px;
  padding: 16px 26px 18px;
  width: 100%;
}
.salesBox .contentText {
  align-items: center;
  display: flex;
  width: 88%;
}
.salesBox img.salesPhoto {
  border-radius: 50%;
  max-height: 134px;
  max-width: 134px;
}
.salesBox .salesName {
  border-right: 1px solid #dcdcdc;
  padding: 0 20px;
  width: 30.8%;
}
.salesBox .salesName h2 {
  color: #353b39;
  font-size: 22px;
  font-weight: 700;
  margin: 4px 0 6px;
}
.salesBox .salesName h4 {
  color: #737378;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}
.salesBox .salesName a.telNo {
  color: #353b39;
  font-size: 20px;
  font-weight: 800;
  text-decoration: none;
}
.salesBox .salesName ul.socialBtn {
  display: flex;
  margin-top: 10px;
}
.salesBox .salesName ul.socialBtn li:first-child {
  margin-right: 10px;
}
.salesBox .salesName ul.socialBtn img {
  height: auto;
  max-width: 34px;
}

.qrCode {
  border-right: 1px solid #dcdcdc;
  padding: 0 28px;
}
.qrCode img {
  max-width: 78px;
}

.salesIntroText {
  width: 90%;
}
.salesIntroText h4 {
  font-size: 18px;
  font-weight: 700;
  line-height: 26px;
  margin-bottom: 6px;
  text-align: justify;
}
.salesIntroText p {
  font-size: 15px;
  line-height: 25px;
  text-align: justify;
}

.projectSearchBox h2 {
  color: #353b39;
  font-size: 25px;
  font-weight: 700;
}

.projectSearchBox,
.projectListBox {
    margin: 42px auto 0 auto;
    max-width: 1222px;
    width: 100%;
}
.projectSearchBox h3,
.projectListBox h3 {
  color: #353b39;
  font-size: 25px;
  font-weight: 700;
}
.projectSearchBox .searchUI,
.projectListBox .searchUI {
  background: rgba(238, 238, 238, 0.66);
  border: 1px solid #dcdcdc;
  box-shadow: 0 2px 4.5px rgba(0, 0, 0, 0.18);
  margin-top: 18px;
  padding: 16px;
  width: 100%;
}
.projectSearchBox .searchUI.secondTh,
.projectListBox .searchUI.secondTh {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
}
.projectSearchBox .searchUI.secondTh input[type=search], .projectSearchBox .searchUI.secondTh input[type=search]:focus,
.projectListBox .searchUI.secondTh input[type=search],
.projectListBox .searchUI.secondTh input[type=search]:focus {
  box-shadow: none;
}
.projectSearchBox .searchUI .searchUITop, .projectSearchBox .searchUI .searchUIBottom,
.projectListBox .searchUI .searchUITop,
.projectListBox .searchUI .searchUIBottom {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.projectSearchBox .searchUI .searchUIBottom,
.projectListBox .searchUI .searchUIBottom {
  margin-top: 20px;
}
.projectSearchBox .searchUI .checkBoxWrapper,
.projectListBox .searchUI .checkBoxWrapper {
  display: flex;
  flex-wrap: nowrap;
}
.projectSearchBox .searchUI .checkBox,
.projectListBox .searchUI .checkBox {
  align-items: center;
  display: flex;
  margin-right: 16px;
}
.projectSearchBox .searchUI .checkBox:last-child,
.projectListBox .searchUI .checkBox:last-child {
  margin-right: 0;
}
.projectSearchBox .searchUI .checkBox label,
.projectListBox .searchUI .checkBox label {
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  width: 58%;
}
.projectSearchBox .searchUI .checkBox label.textWhite,
.projectListBox .searchUI .checkBox label.textWhite {
  color: #fff;
}
.projectSearchBox .searchUI select,
.projectListBox .searchUI select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: url(../images/selectIcon.png) 92% center no-repeat;
  background-color: #fff;
  background-size: 9px 15px;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  height: 46px;
  outline: none;
  /*margin-right: 1.88%;*/
  padding: 12px;
  width: 15.3%;
}
.projectSearchBox .searchUI select.indexSelectUI,
.projectListBox .searchUI select.indexSelectUI {
  width: 15%;
}
.projectSearchBox .searchUI select:last-child,
.projectListBox .searchUI select:last-child {
  margin-right: 0;
}
.projectSearchBox .searchUI input[type=checkbox],
.projectListBox .searchUI input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #dcdcdc;
  cursor: pointer;
  display: block;
  height: 24px;
  margin-right: 6px;
  position: relative;
  width: 24px;
}
.projectSearchBox .searchUI input[type=checkbox]:checked,
.projectListBox .searchUI input[type=checkbox]:checked {
  background: #fff;
}
.projectSearchBox .searchUI input[type=checkbox]:checked:before,
.projectListBox .searchUI input[type=checkbox]:checked:before {
  content: "";
  border: solid #0067b3;
  border-width: 0 3.4px 3.4px 0;
  display: block;
  height: 10px;
  left: 33%;
  position: absolute;
  top: 11%;
  transform: rotate(45deg);
  width: 4px;
}
.projectSearchBox .searchUI input[type=search],
.projectListBox .searchUI input[type=search] {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  box-shadow: inset 0 0.2px 0.3px rgba(0, 0, 0, 0.2);
  font-size: 13px;
  font-weight: 600;
  height: 46px;
  outline: none;
  padding: 12px;
  width: 90%;
}
.projectSearchBox .searchUI input[type=search]:focus,
.projectListBox .searchUI input[type=search]:focus {
  border: 1px solid #0067b3;
}
.projectSearchBox .searchUI input[type=submit],
.projectListBox .searchUI input[type=submit] {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
  border: none;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  height: 46px;
  line-height: 42px;
  margin-left: 2%;
  width: 100px;
}
.projectSearchBox .searchUI input[type=submit]:active, .projectSearchBox .searchUI input[type=submit]:hover,
.projectListBox .searchUI input[type=submit]:active,
.projectListBox .searchUI input[type=submit]:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}
.projectSearchBox .searchUI input[type=submit].indexSearchBtn,
.projectListBox .searchUI input[type=submit].indexSearchBtn {
  background: linear-gradient(0deg, #ffc700 0%, #ffe300 100%);
  color: #353b39;
}
.projectSearchBox .searchUI input[type=submit].indexSearchBtn:active, .projectSearchBox .searchUI input[type=submit].indexSearchBtn:hover,
.projectListBox .searchUI input[type=submit].indexSearchBtn:active,
.projectListBox .searchUI input[type=submit].indexSearchBtn:hover {
  background: linear-gradient(180deg, #ffc700 0%, #ffe300 100%);
}

.projectSearchBox.mt0 {
  margin-top: 0;
}

.projectListBox.mt0 {
  margin-top: 0;
}

.projectListBox ul.projectList.dFlex {
  display: flex;
  flex-wrap: wrap;
}
.projectListBox ul.projectList.flexNoWrap {
  display: block;
  flex-wrap: nowrap;
}
.projectListBox ul.projectList.flexNoWrap li.projectCard {
  display: inline-block;
}
.projectListBox ul.projectList li.w100 {
  width: 100% !important;
}
.projectListBox ul.projectList li.projectCard {
  background: #fff;
  border: 1px solid #dcdcdc;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  margin: 0 3.5% 3.5% 0;
  width: 31%;
  position: relative;
/*  height:400px;*/
}
.justify-content-center{
    display:flex;
    justify-content:center;
}
.projectListBox ul.projectList li.mbBig {
    /*  margin-bottom: 3.7%;*/
    margin-bottom: 0%;
}
.projectListBox ul.projectList li.projectCard.salesProject:nth-child(3n+3) {
  margin-right: 0;
}
.projectListBox ul.projectList li.projectCard.noShadow {
  box-shadow: none;
}
.projectListBox ul.projectList li.projectCard img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.projectListBox ul.projectList li .content {
  padding: 8px 15px 14px;
}
.projectListBox ul.projectList li .content.bigPtb {
  padding: 5px 15px 21px;
}
.projectListBox ul.projectList .adaptivePic {
  display: block;
  height: auto;
  overflow: hidden;
  padding-top: 56.7%;
  position: relative;
  width: 100%;
}
.obj-cover {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}
.projectListBox ul.projectList .adaptivePic img {
  bottom: 0;
  display: block;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}
.projectListBox ul.projectList h4 a {
  color: #0067b3;
  display: -webkit-box;
  font-size: 22px;
  font-weight: 700;
  max-height: 32px;
  overflow: hidden;
  text-decoration: none;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.projectListBox ul.projectList p {
  display: -webkit-box;
  font-size: 15px;
  font-weight: 600;
  margin-top: 10px;
  max-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.projectListBox ul.projectList p.mts {
  margin-top: 2px;
}
.projectListBox ul.projectList p a {
  color: #353b39;
  font-size: 15px;
  text-decoration: none;
}
.projectListBox ul.projectContent {
  margin: 10px 10px 30px;
}
.projectListBox ul.projectContent.sMb {
  margin: 7px 0 0;
}
.projectListBox ul.projectContent li.text {
  box-shadow: none;
  display: inline-block;
  line-height: 27px;
  margin-right: 4px;
  width: 30%;
}
.projectListBox ul.projectContent li.text:nth-child(2n+2) {
  margin-left: 0;
  width: 56%;
}
.projectListBox ul.projectContent li.text:nth-child(3n+3) {
  margin-right: 4px;
}
.projectListBox ul.projectContent li.bigText {
  width: 40%;
}
.projectListBox ul.projectContent li.text.w25 {
  width: 25%;
}
.projectListBox ul.projectContent li.text.w40 {
  width: 40%;
}
.projectListBox ul.projectContent li.text.w56 {
  width: 56%;
}
.projectListBox ul.projectContent li.text.w90 {
    width: 90%;
}

.projectListBox ul.projectContent li.desktopHide {
  display: none;
}
.projectListBox ul.projectContent span {
  font-size: 15px;
}
.projectListBox ul.projectContent span.title {
  font-weight: 500;
}
.projectListBox ul.projectContent span.biggerText {
  font-family: "Myriad Pro", sans-serif;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0;
  margin-right: 0;
  width: 100%;
}
.projectListBox ul.projectContent span.priceText {
  color: #df4d20;
  font-family: "Myriad Pro", sans-serif;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0;
  padding-right: 2px;
}
.projectListBox ul.projectContent span.wanText {
  color: #df4d20;
}
.projectListBox ul.projectContent span.fw500 {
  font-weight: 500;
  margin-left: -2px;
}
.projectListBox .btnBox {
  border-top: 1px solid #dcdcdc;
  padding-top: 10px;
  text-align: right;
}
.projectListBox .btnBox a {
  color: #353b39;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  padding-right: 16px;
  position: relative;
  text-decoration: none;
  transition: all 0.12s ease-in-out 0s;
}
.projectListBox .btnBox a:after {
  content: "";
  background: url(../images/readMoreBtnIcon.png) no-repeat;
  background-size: 13px 12px;
  display: block;
  height: 12px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-44%);
  width: 13px;
}
.projectListBox .btnBox a:hover {
  color: #0067b3;
}
.projectListBox .btnBox a:active:after, .projectListBox .btnBox a:hover:after {
  content: "";
  background: url(../images/readMoreBtnIconHover.png) no-repeat;
  background-size: 13px 12px;
  display: block;
  height: 12px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-44%);
  width: 13px;
}

.twoColumnProjectBox ul.projectContent li.bigText {
  width: 24%;
}

/* --首頁的CSS--------------------------------- */
.indexBox > section:not(:nth-of-type(1)):not(:nth-of-type(2)) {
    max-width: 1222px;
    padding-bottom: 72px;
    width: 100%;
}

.indexBox > section:not(:nth-of-type(1)):not(:nth-of-type(2)):not(:last-of-type) {
    margin: 0px auto 0 auto;
}

.indexBox > section:last-of-type {
    margin: 40px auto 0 auto;
}

.indexBox > section.indexHotBox::before {
    content: "";
    background: #ededed;
    border-radius: 16px 0 0 16px;
    display: block;
    height: 400px;
    left: 22.5%;
    position: absolute;
    transform: translateY(10.8%);
    width: 77.5%;
}

.indexBox > section.indexKnowledgeBox::before {
    content: "";
    background: #ededed;
    border-radius: 16px 0 0 16px;
    display: block;
    height: 500px;
    left: 22.5%;
    position: absolute;
    transform: translateY(10.8%);
    width: 77.5%;
}

.indexBox > section.indexTopSalesBox::before{
    content: "";
    background: #ededed;
    border-radius: 16px 0 0 16px;
    display: block;
    height: 538px;
    left: 22.5%;
    position: absolute;
    transform: translateY(10.8%);
    width: 77.5%;
}

.indexBigSliderBox {
    background: #ededed;
    display: block;
    width: 100%;
}

.indexSearchBox .indexSearchContent {
  background: #0067b3;
  box-shadow: 0 2px 4.5px rgba(0, 0, 0, 0.18);
  display: block;
  margin: -99px auto 0 auto;
  max-width: 1222px;
  padding: 16px 26px 24px 26px;
  position: relative;
  width: 100%;
  z-index: 10;
}
.indexSearchBox h3 {
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  padding-left: 18px;
  position: relative;
}
.indexSearchBox h3:before {
  content: "";
  background: #fff;
  display: block;
  height: 22px;
  left: 0;
  position: absolute;
  top: 0;
  transform: translateY(4px);
  width: 4px;
}
.indexSearchBox .content {
  display: flex;
  margin-top: 20px;
}
.indexSearchBox .content .selectUIBox {
  display: flex;
  flex-wrap: nowrap;
  flex-basis: 54%;
}
.indexSearchBox .content .selectUIBox select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: url(../images/selectIcon.png) 92% center no-repeat;
  background-color: #fff;
  background-size: 9px 15px;
  border: 1px solid #dcdcdc;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  height: 46px;
  outline: none;
  margin-right: 18px;
  padding: 12px;
  width: 100%;
}
.indexSearchBox .content input[type=search] {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  height: 46px;
  outline: none;
  padding: 8px 12px 12px;
  transition: all 0.4s ease-in-out 0s;
  width: 82%;
}
.indexSearchBox .content button.searchBtn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: linear-gradient(0deg, rgb(255, 199, 0) 0%, rgb(255, 225, 0) 50%, rgb(255, 227, 0) 100%);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 46px;
  margin-left: 18px;
  width: 140px;
}
.indexSearchBox .content button.searchBtn:active, .indexSearchBox .content button.searchBtn:hover {
  background: linear-gradient(180deg, rgb(255, 199, 0) 0%, rgb(255, 225, 0) 50%, rgb(255, 227, 0) 100%);
}
.indexSearchBox .checkBoxBtnFrame {
  display: flex;
  flex-wrap: wrap;
}
.indexSearchBox .checkBoxBtnBox {
  display: flex;
  flex-wrap: wrap;
  margin: 16px 4.6px 0 0;
}
.indexSearchBox .checkBoxBtnBox.ml {
  margin-left: 12px;
}
.indexSearchBox .checkBoxBtnBox li:not(.title) {
  align-items: center;
  display: flex;
  margin-right: 18px;
}
.indexSearchBox .checkBoxBtnBox li:last-child {
  margin-right: 0;
}
.indexSearchBox .checkBoxBtnBox li.title {
  color: #fff;
  font-weight: 600;
  margin-right: 2px;
}
.indexSearchBox .checkBoxBtnBox label {
  color: #fff;
  cursor: pointer;
  margin-left: 8px;
  position: relative;
  width: 58%;
}
.indexSearchBox .checkBoxBtnBox input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: #fff;
  border-radius: 2px;
  box-shadow: 1px 1px rgba(0, 0, 0, 0.12);
  display: block;
  height: 20px;
  position: relative;
  width: 20px;
}
.indexSearchBox .checkBoxBtnBox input[type=checkbox]:checked:before {
  content: "";
  border: solid #0266be;
  border-width: 0 3.4px 3.4px 0;
  display: block;
  height: 10px;
  left: 33%;
  position: absolute;
  top: 11%;
  transform: rotate(45deg);
  width: 4px;
}

.indexProjectListBox {
  margin-top: 122px;
  position: relative;
}
.indexProjectListBox:after {
  content: "";
  background: #ededed;
  display: block;
  height: 420px;
  position: absolute;
  top: 0;
  width: 100%;
}
.indexProjectListBox:before {
  content: "";
  background: url(../images/indexProjectListBgTop.png) no-repeat;
  background-size: 100%;
  display: block;
  height: 88px;
  left: 0;
  position: absolute;
  top: 0;
  transform: translateY(-84px);
  width: 100%;
  z-index: 10;
}
.indexProjectListBox .indexProjectListContent {
  transform: translateY(-84px);
  z-index: 20;
}

.indexPopularProjectBox {
  display: block;
  width: 100%;
}
.indexPopularProjectBox .indexProjectContent {
  margin: 46px auto 0 auto;
  max-width: 1222px;
}
.indexPopularProjectBox h3 {
  color: #353b39;
  font-size: 26px;
  font-weight: 700;
}
.indexPopularProjectBox li.projectCard {
  white-space: wrap;
}

.indexTopSalesBox {
  width: 100%;
}
/*.indexTopSalesBox:before {
  content: "";
  background: #ededed;
  border-radius: 16px 0 0 16px;
  display: block;
  height: 538px;
  left: 22.5%;
  position: absolute;
  transform: translateY(10.8%);
  width: 77.5%;
}*/
.indexTopSalesBox .box {
  max-width: 1222px;
  margin: 0 auto;
}
.indexTopSalesBox h3, .indexTopSalesBox h4 {
  color: #353b39;
  font-weight: 700;
}
.indexTopSalesBox h3 {
  font-size: 26px;
}
.indexTopSalesBox h4 {
  font-size: 23px;
}
.indexTopSalesBox img.shadow {
  box-shadow: 0 2.4px 4px rgba(0, 0, 0, 0.2);
  height: auto;
  width: 100%;
}
.indexTopSalesBox .indexTopSalesContent {
  margin-top: 66px;
  position: relative;
}

/*.indexKnowledgeBox {
  margin: 96px auto 0 auto;
  max-width: 1222px;
  padding-bottom: 188px;
  width: 100%;
}
.indexKnowledgeBox:before {
  content: "";
  background: #ededed;
  border-radius: 16px 0 0 16px;
  display: block;
  height: 538px;
  left: 22.5%;
  position: absolute;
  transform: translateY(10.8%);
  width: 77.5%;
}*/
.indexKnowledgeBox .indexTopSalesContent {
  margin-top: 66px;
}
.indexKnowledgeBox li {
  background: #fff;
  border: 1px solid #dcdcdc;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 2.4px 4px;
  padding: 14px 14px 9.42px;
}
.indexKnowledgeBox h3, .indexKnowledgeBox h4 a {
  color: #353b39;
  font-weight: 700;
  text-decoration: none;
}
.indexKnowledgeBox h3 {
  font-size: 26px;
}
.indexKnowledgeBox h4 {
  font-size: 22px;
  padding: 10px 0 8px;
}
.indexKnowledgeBox p {
  font-size: 15px;
  line-height: 25px;
  padding: 10px 0 8px;
  text-align: justify;
}
/*.indexHotBox {
    margin: 36px auto 0 auto;
    max-width: 1222px;
    padding-bottom: 188px;
    width: 100%;
}

.indexHotBox:before {
    content: "";
    background: #ededed;
    border-radius: 16px 0 0 16px;
    display: block;
    height: 418px;
    left: 22.5%;
    position: absolute;
    transform: translateY(10.8%);
    width: 77.5%;
}*/

.indexHotBox .indexTopSalesContent {
    margin-top: 66px;
}

.indexHotBox li {
    background: #fff;
    border: 1px solid #dcdcdc;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 2.4px 4px;
    padding: 14px 14px 9.42px;
}

.indexHotBox h3, .indexHotBox h4 a {
    color: #353b39;
    font-weight: 700;
    text-decoration: none;
}

.indexHotBox h3 {
    font-size: 26px;
}

.indexHotBox h4 {
    font-size: 22px;
    padding: 10px 0 8px;
}

.indexHotBox p {
    font-size: 15px;
    line-height: 25px;
    padding: 10px 0 8px;
    text-align: justify;
}

.salesInfoBox {
  display: flex;
}
.salesInfoBox .nameBox {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  width: 22%;
}
.salesInfoBox .nameBox h5 {
  font-size: 17px;
  font-weight: 500;
  margin-top: 7px;
}
.salesInfoBox .salesText {
  display: flex;
  margin: 16px 0 0 14px;
  width: 78%;
}
.salesInfoBox .salesText p {
  display: -webkit-box;
  font-size: 17px;
  font-weight: 500;
  line-height: 26px;
  margin-top: 4px;
  max-height: 50px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/* --內頁-登入&忘記密碼&註冊的CSS--------------------------------- */
.memberLoginBox {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  display: block;
  margin: 0 auto;
  max-width: 900px;
  padding: 20px 25px 28px;
  width: 100%;
}
.memberLoginBox .rightContent {
  border-right: 1px solid #dcdcdc;
  float: left;
  padding-right: 68px;
  width: 60%;
}
.memberLoginBox .otherMenu {
  margin-top: 18px;
}
.memberLoginBox .otherMenu li {
  color: #353b39;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}
.memberLoginBox .otherMenu li:first-of-type {
  float: left;
}
.memberLoginBox .otherMenu li:last-of-type {
  float: right;
}
.memberLoginBox .otherMenu a {
  color: #353b39;
  text-decoration: none;
}
.memberLoginBox .otherMenu a.boldText {
  font-weight: 700;
}
.memberLoginBox .otherMenu a.blueText {
  color: #0067b3;
  padding: 0 0.6px;
}
.memberLoginBox .thirdWayLoginBox {
  float: left;
  padding-left: 68px;
  width: 40%;
}
.memberLoginBox .thirdWayLoginBox h4 {
  color: #353b39;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 12px;
}
.memberLoginBox .thirdWayLoginBox ul {
  margin-top: 18px;
}
.memberLoginBox .thirdWayLoginBox li {
  display: block;
  margin-bottom: 28px;
  width: 100%;
}
.memberLoginBox .thirdWayLoginBox li:last-of-type {
  margin-bottom: 0;
}
.memberLoginBox .thirdWayLoginBox button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  border-radius: 6px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
  cursor: pointer;
  display: block;
  font-size: 16px;
  font-weight: 700;
  height: 48px;
  letter-spacing: 0.2px;
  text-align: center;
  width: 100%;
}
.memberLoginBox .thirdWayLoginBox button img.icon {
  display: inline-block;
  height: auto;
  margin-right: 10px;
  max-width: 32px;
  vertical-align: middle;
}
.memberLoginBox .thirdWayLoginBox button.FBLoginBtn {
  background: #1877f2;
  color: #fff;
}
.memberLoginBox .thirdWayLoginBox button.GmailLoginBtn {
  background: #fff;
  border: 1px solid #dcdcdc;
  color: #353b39;
}
.memberLoginBox .thirdWayLoginBox button.LineLoginBtn {
  background: #00b900;
  color: #fff;
}

.passwordBox {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  display: block;
  margin: 0 auto;
  max-width: 522px;
  padding: 20px 25px 30px;
  width: 100%;
}

.loginUIBox h3 {
  color: #353b39;
  font-size: 23px;
  font-weight: 700;
  padding-bottom: 12px;
}
.loginUIBox p {
  color: #353b39;
  font-size: 14px;
  line-height: 24px;
  text-align: justify;
}
.loginUIBox form.mt {
  margin-top: 12px;
}
.loginUIBox form.mt-2 {
  margin-top: 4px;
}
.loginUIBox label {
  color: #353b39;
  display: block;
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 12px;
}
.loginUIBox .fieldContent {
  margin-bottom: 18px;
}
.loginUIBox .fieldContent.dFlex {
  display: flex;
}
.loginUIBox .fieldContent:last-of-type {
  margin-bottom: 0;
}
.loginUIBox input {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  box-shadow: inset 0 0.2px 0.3px rgba(0, 0, 0, 0.2);
  color: #b4b4b4;
  font-size: 13px;
  font-weight: 500;
  height: 46px;
  outline: none;
  padding: 12px;
  width: 100%;
}
.loginUIBox input:focus {
  border: 1px solid #0067b3;
}
.loginUIBox img.border {
  border: 1px solid #dcdcdc;
}
.loginUIBox img.verifyPic {
  height: auto;
  max-width: 104px;
}
.loginUIBox button.verifyAcquireBtn {
  background: linear-gradient(-180deg, #ffffff 60%, #e0e0e0 100%);
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(43, 43, 43, 0.32);
  color: #353b39;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 44px;
  line-height: 42px;
  margin-left: 18px;
  padding: 0 14px;
}
.loginUIBox button.verifyAcquireBtn:hover {
  background: linear-gradient(0deg, #ffffff 60%, #e0e0e0 100%);
}
.loginUIBox .oneBtnBox {
  display: block;
  margin: 30px auto 0 auto;
  max-width: 146.29px;
  width: 100%;
}
.loginUIBox .twoBtnBox {
  display: flex;
  flex-wrap: wrap;
  margin: 30px auto 0 auto;
  max-width: 328px;
  width: 100%;
}
.loginUIBox .twoBtnBox li {
  margin: 0 27px 0 0;
  width: 45.3%;
}
.loginUIBox .twoBtnBox li:last-of-type {
  margin-right: 0;
}
.loginUIBox .btnBox button, .loginUIBox .btnBox button a {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
  border: none;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 600;
  height: 48px;
  line-height: 48px;
  text-decoration: none;
  width: 100%;
}
.loginUIBox .btnBox button:active, .loginUIBox .btnBox button a:active, .loginUIBox .btnBox button:hover, .loginUIBox .btnBox button a:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}

/* --內頁-會員中心的CSS--------------------------------- */
.memberCenterBox {
  margin: -12px auto 0 auto;
  max-width: 1222px;
  padding-bottom: 62px;
  width: 100%;
}
.memberCenterBox .tabContent:not(.tabContentFirst) {
  display: none;
}
.memberCenterBox .tabContent.selected {
  display: inherit;
}

.memberContentBox {
  margin-top: 32px;
}

.tabContentSecond .memberContentBox {
    margin-top: 0px;
}

.memberPhotoBox {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  float: left;
  width: 26%;
}
.memberPhotoBox .title {
  background: linear-gradient(135deg, #0067b3 0%, #0467b3 50%, #087fc1 51%, #087fc1 100%);
  display: block;
  height: 46px;
  width: 100%;
}
.memberPhotoBox .content {
  padding: 0 17px 15px 17px;
}
.memberPhotoBox .profilePhotoBox {
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.22);
  display: block;
  height: 148px;
  margin: -20px auto 0 auto;
  position: relative;
  width: 148px;
}
.memberPhotoBox img.profilePhoto {
  background: #fff;
  border: 5px solid #fff;
  border-radius: 50%;
  bottom: 0;
  display: block;
  height: auto;
  left: 0;
  max-width: 100%;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  width: 148px;
}
.memberPhotoBox .uploadPicFileBtn {
  background: #fff;
  border-radius: 50%;
  bottom: 0;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.22);
  display: block;
  height: 46px;
  opacity: 1;
  position: absolute;
  right: 0;
  transition: all 0.2s ease-in-out 0s;
  width: 46px;
  z-index: 10;
}
.memberPhotoBox .uploadPicFileBtn:before {
  content: "";
  background: url(../images/profilePhotoUploadIcon.svg) center center no-repeat;
  background-size: 26px 20px;
  bottom: 0;
  display: block;
  height: 20px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 26px;
}
.memberPhotoBox .uploadPicFileBtn input.uploadPicFile {
  display: none;
}
.memberPhotoBox h2 {
  border-bottom: 1px solid #dcdcdc;
  color: #353b39;
  font-size: 25px;
  font-weight: 700;
  padding: 12px 0 14px;
  text-align: center;
}
.memberPhotoBox ul {
  display: block;
  line-height: 34px;
  margin-top: 12px;
}
.memberPhotoBox ul li {
  color: #353b39;
  font-size: 15px;
  font-weight: 600;
}
.memberPhotoBox ul span {
  margin: 0 2px;
}
.memberPhotoBox ul .blueText {
  color: #0067b3;
  font-family: "Myriad Pro", sans-serif;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: 0;
}


.memberContentBox .searchResult p {
    color: #353b39;
    font-size: 15px;
    font-weight: 700;
    line-height: 27px;
}
.memberContentBox .searchResult span.number {
    color: #0067b3;
    font-family: "Myriad Pro", sans-serif;
    font-size: 44px;
    font-weight: 700;
    margin: 0 3.2px;
}
.memberContentBox .searchDataList {
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
    margin-top: 18px;
    padding: 0 17px 37px 17px;
}
.memberContentBox .searchDataList .searchContent {
  border-bottom: 1px solid #dcdcdc;
  display: flex;
  padding: 17px 0 16px;
  position: relative;
  width: 100%;
}
.memberContentBox .searchDataList .searchContent:last-of-type {
  border-bottom: none;
}
.memberContentBox .searchDataList button.removeLoveBtn ,removeBrowserBtn{
  background: url(../images/memberCenterRemoveIcon.svg) center center no-repeat, linear-gradient(-180deg, #fff 60%, #e0e0e0 100%);
  bottom: 0;
  border: 1px solid #dcdcdc;
  border-radius: 50%;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
  cursor: pointer;
  display: block;
  height: 40px;
  margin: auto;
  position: relative;
  left: 50%;
  top: 50%;
  width: 90px;
}
.memberContentBox .searchDataList .pic img {
  height: auto;
  width: 100%;
}
.memberContentBox .searchDataList .content {

}
.memberContentBox .searchDataList .content p {
  display: -webkit-box;
  font-size: 14px;
  font-weight: 600;
  margin-top: 9px;
  max-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.memberContentBox .searchDataList .content p a {
  color: #353b39;
  font-size: 14px;
  text-decoration: none;
}
.memberContentBox .searchDataList .content h4 a {
  color: #0067b3;
  display: -webkit-box;
  font-size: 22px;
  font-weight: 700;
  max-height: 26px;
  overflow: hidden;
  text-decoration: none;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.memberContentBox .searchDataList .projectContentBox {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
}
.memberContentBox .searchDataList ul.projectContent {
  display: block;
  line-height: 27px;
  margin-top: 12px;
}
.memberContentBox .searchDataList ul.projectContent.mr {
  margin-left: 20px;
}
.memberContentBox .searchDataList ul.projectContent li {
  font-weight: 500;
}
.memberContentBox .searchDataList ul.projectContent li span {
  font-size: 15px;
}
.memberContentBox .searchDataList .totalPrice {
  bottom: 12px;
  position: absolute;
  right: 0;
}
.memberContentBox .searchDataList .totalPrice span.unitText {
  color: #353b39;
  font-size: 14px;
  font-weight: 500;
}
.memberContentBox .searchDataList .totalPrice span.number {
  color: #0067b3;
  font-family: "Myriad Pro", sans-serif;
  font-size: 28px;
  font-weight: 700;
  margin-right: 2px;
}

.searchRecordBox {
  float: right;
  width: 70%;
}
.searchRecordBox img.welcomePic {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  height: auto;
  max-width: 100%;
}
.searchRecordBox .myNumberBox {
  background: #fff;
  border: 1px solid #dcdcdc;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  margin-top: 42px;
  padding: 20px 22px 28px 22px;
  width: 100%;
}
.searchRecordBox .myNumberBox h3 {
  color: #353b39;
  font-size: 22px;
  font-weight: 700;
}
.searchRecordBox .myNumberBox ul {
  display: flex;
  flex-wrap: wrap;
  margin-top: 20px;
}
.searchRecordBox .myNumberBox li {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 3.4% 24px 0;
  width: 48%;
}
.searchRecordBox .myNumberBox li:nth-child(2n+2) {
  margin-right: 0;
}
.searchRecordBox .myNumberBox li:last-of-type {
  margin-bottom: 0;
}
.searchRecordBox .myNumberBox li.noFlex {
  display: block;
}
.searchRecordBox .myNumberBox li button.cancelLinkBtn {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: #fff;
  border: none;
  color: rgba(53, 59, 57, 0.65);
  cursor: pointer;
  float: right;
  font-weight: 600;
  width: auto;
}
.searchRecordBox .myNumberBox .loginContent {
  align-items: center;
  display: flex;
  float: left;
}
.searchRecordBox .myNumberBox .loginContent img {
  height: auto;
  max-width: 44px;
}
.searchRecordBox .myNumberBox .loginContent p {
  color: #353b39;
  font-weight: 600;
  margin-left: 18px;
}
.searchRecordBox .myNumberBox label {
  color: #353b39;
  display: block;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 14px;
}
.searchRecordBox .myNumberBox input, .searchRecordBox .myNumberBox select {
  background: #fff;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  color: #353b39;
  font-size: 13px;
  font-weight: 500;
  height: 46px;
  outline: none;
  padding: 12px;
  width: 100%;
}
.searchRecordBox .myNumberBox input {
  box-shadow: inset 0 0.2px 0.3px rgba(0, 0, 0, 0.2);
}
.searchRecordBox .myNumberBox input:focus {
  border: 1px solid #0067b3;
}
.searchRecordBox .myNumberBox select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: url(../images/selectIcon.png) 96% center no-repeat;
  background-color: #fff;
  background-size: 9px 15px;
  border: 1px solid #d4d4d4;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  height: 46px;
  outline: none;
  margin-right: 1.88%;
  padding: 12px;
}
.searchRecordBox .myNumberBox .oneBtnBox {
  display: block;
  margin: 30px auto 0 auto;
  max-width: 146.29px;
  width: 100%;
}
.searchRecordBox .myNumberBox .oneBtnBox li {
  margin-right: 0;
  width: 100%;
}
.searchRecordBox .myNumberBox .twoBtnBox {
  margin: 6px auto 0 auto;
  max-width: 328px;
  width: 100%;
}
.searchRecordBox .myNumberBox .twoBtnBox li {
  margin-bottom: 0;
  margin-right: 27px;
  width: 45.3%;
}
.searchRecordBox .myNumberBox .twoBtnBox li:last-of-type {
  margin-right: 0;
}
.searchRecordBox .myNumberBox button {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
  border: none;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  height: 48px;
  line-height: 42px;
  width: 100%;
}
.searchRecordBox .myNumberBox button:active, .searchRecordBox .myNumberBox button:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}
.searchRecordBox table {
  border-collapse: collapse;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  width: 100%;
}
.searchRecordBox table thead {
  background: #087fc1;
  display: block;
  height: 46px;
  line-height: 44px;
  padding: 0 18px;
}
.searchRecordBox table thead th {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  text-align: left;
}
.searchRecordBox table tbody {
  background: #fff;
  color: #353b39;
  font-size: 15px;
  font-weight: 500;
  line-height: 25px;
}
.searchRecordBox table tbody tr {
  display: block;
  padding: 14px 18px 0;
  width: 100%;
}
.searchRecordBox table tbody tr:last-of-type {
  margin-bottom: 20px;
}
.searchRecordBox table tbody td {
  border-bottom: 1px solid #dcdcdc;
  display: block;
  padding-bottom: 14px;
}
.searchRecordBox table tbody td ul {
  display: flex;
  float: left;
  width: 92%;
}
.searchRecordBox table tbody td li {
  display: inline-block;
}
.searchRecordBox table tbody td li.mr {
  margin-right: 14px;
}
.searchRecordBox table tbody td p {
  max-height: 25px;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.searchRecordBox table tbody button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: none;
  border: none;
  color: #353b39;
  cursor: pointer;
  float: right;
  font-size: 15px;
  font-weight: 600;
  margin-top: 4px;
}

/* Loading Screen Styles */
.loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    z-index: 9999;
}

.spinner {
    border: 8px solid #f3f3f3;
    border-top: 8px solid #3498db;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* --元件-頁籤的CSS--------------------------------- */
.tabBoxUI {
  background: #f9f9f9;
  border: 1px solid #dcdcdc;
  border-radius: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
  display: flex;
  flex-wrap: wrap;
  margin: 22px 0;
  padding: 6.8px;
}
.tabBoxUI li {
  height: 46px;
  line-height: 42px;
  text-align: center;
}
.tabBoxUI li:last-child {
  margin-right: 0;
}
.tabBoxUI li a {
  color: #353b39;
  display: block;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}
.tabBoxUI li.selected {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 6px;
}
.tabBoxUI li.selected:hover {
  background: linear-gradient(0deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
}
.tabBoxUI li.selected a {
  color: #fff;
}

.backEndTabBoxUI {
  background: #fff;
  border-bottom: 2px solid #dcdcdc;
  display: flex;
  flex-wrap: wrap;
}
.backEndTabBoxUI li {
  height: 58px;
  line-height: 54px;
  text-align: center;
}
.backEndTabBoxUI li:last-child {
  margin-right: 0;
}
.backEndTabBoxUI li a {
  color: #8c8c8c;
  display: block;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}
.backEndTabBoxUI li.selected {
  position: relative;
}
.backEndTabBoxUI li.selected a {
  color: #0067b3;
}
.backEndTabBoxUI li.selected:after {
  content: "";
  background: #0067b3;
  bottom: -1px;
  display: block;
  height: 5px;
  position: absolute;
  width: 100%;
}

.projectTabBoxUI {
  display: flex;
  flex-wrap: wrap;
}
.projectTabBoxUI li {
  line-height: 54px;
  max-height: 58px;
  text-align: center;
}
.projectTabBoxUI li:last-child {
  margin-right: 0;
}
.projectTabBoxUI li a {
  color: #8c8c8c;
  display: block;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
}
.projectTabBoxUI li.selected {
  position: relative;
}
.projectTabBoxUI li.selected a {
  color: #0067b3;
}
.projectTabBoxUI li.selected:after {
  content: "";
  background: #0067b3;
  bottom: -1px;
  display: block;
  height: 5px;
  position: absolute;
  width: 100%;
}

.tabBoxUIOne {
  max-width: 400px;
  width: 100%;
}
.tabBoxUIOne li {
  width: 33%;
}

.tabBoxUISecond {
  max-width: 674px;
  width: 100%;
}
.tabBoxUISecond li {
  width: 20%;
}

.tabBoxUIThird {
  width: 100%;
}
.tabBoxUIThird li {
  width: 9.25%;
}

.tabBoxUIFourth {
  border-bottom: 2px solid #dcdcdc;
  width: 100%;
}
.tabBoxUIFourth li {
  width: 16%;
}

/* --元件-頁碼的CSS--------------------------------- */
.pagination {
  align-items: center;
  display: flex;
  justify-content: center;
  padding-bottom: 102px;
  width: 100%;
}
.pagination.memberCenterPadding {
  padding-bottom: 0 !important;
  padding-top: 14px;
}
.pagination.pb0 {
  padding-bottom: 0;
}
.pagination li {
  border: 1px solid #dcdcdc;
  border-radius: 50%;
  display: block;
  height: 46px;
  line-height: 44px;
  margin-right: 15px;
  text-align: center;
  width: 46px;
}
.pagination li.mr0 {
  margin-right: 0;
}
.pagination li span {
  color: #0067b3;
  cursor: pointer;
  display: block;
  font-size: 16px;
  font-weight: 600;
  height: 46px;
  width: 46px;
}
.pagination li span.selected {
  background: linear-gradient(180deg, #0a85c5 0%, #067ac2 50%, #0067b3 90%);
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.36);
  color: #fff;
  cursor: pointer;
  display: block;
  height: 46px;
  width: 46px;
}
.pagination li.pagePrevBtn, .pagination li.pageNextBtn {
  border: none;
  border-radius: 50%;
  cursor: pointer;
  margin-right: 0;
  opacity: 1;
  transition: all 0.4s ease-in-out 0s;
}
.pagination li.pagePrevBtn:hover, .pagination li.pageNextBtn:hover {
  opacity: 0.7;
}
.pagination li.pagePrevBtn .icon, .pagination li.pageNextBtn .icon {
  height: 48px;
  position: relative;
  width: 48px;
}
.pagination li.pagePrevBtn span, .pagination li.pageNextBtn span {
  border-top: 2.8px solid #0067b3;
  border-left: 2.8px solid #0067b3;
  bottom: 0;
  display: block;
  height: 10px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 10px;
}
.pagination li.pagePrevBtn span {
  transform: rotate(-45deg);
}
.pagination li.pageNextBtn span {
  transform: rotate(135deg);
}

/* --主版-刊尾的CSS--------------------------------- */
.footerBox {
  background: linear-gradient(90deg, #0067b3 0%, #0472c0 40%, #077cc3 66%, #0a84c5 100%);
  padding: 40px 22px 36px;
  position: relative;
  width: 100%;
}
.footerBox.mobileMb {
  margin-bottom: 138px;
}
.footerBox .footerFrameBox {
  display: flex;
}
.footerBox .content {
  margin: 0 auto;
  max-width: 1200px;
  width: 100%;
}
.footerBox .leftContent {
  float: left;
  width: 17%;
}
.footerBox .leftContent img.footerLogo {
  height: auto;
  max-width: 100%;
  width: auto;
}
.footerBox .leftContent .text {
  margin-top: 8px;
}
.footerBox .leftContent p {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  line-height: 25px;
  text-align: left;
}
.footerBox .leftContent p a {
  color: #fff;
  text-decoration: none;
}
.footerBox .rightContent {
  display: flex;
  float: right;
  justify-content: space-between;
  width: 83%;
}
.footerBox .rightContent .webLinkBox {
  margin-right: 3.6%;
  width: 58%;
}
.footerBox .rightContent .visitWebBox {
  width: 24%;
}
.footerBox .rightContent .mt {
  margin-top: 26px;
}
.footerBox .rightContent h3 {
  color: #fff;
  cursor: default;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
  position: relative;
}
.footerBox .rightContent h3:after {
  content: "";
  background: #fff;
  bottom: -14px;
  display: block;
  height: 2px;
  position: absolute;
  width: 22px;
}
.footerBox .rightContent a, .footerBox .rightContent p {
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
}
.footerBox .rightContent p {
  line-height: 29px;
  text-align: justify;
}
.footerBox .rightContent li {
  display: inline-block;
  font-size: 15px;
  line-height: 29px;
  width: 48%;
}
.footerBox .rightContent .socialBtn {
  display: flex;
  margin-top: 28px;
}
.footerBox .rightContent .socialBtn li {
  margin-right: 14px;
}
.footerBox .rightContent .socialBtn li:last-of-type {
  margin-right: 0;
}
.footerBox .rightContent .socialBtn img {
  cursor: pointer;
  height: auto;
  max-width: 38px;
  transition: all 0.12s ease-in-out 0s;
}
.footerBox .footerCopyrightBox {
  padding-top: 16px;
  width: 100%;
}
.footerBox .footerCopyrightBox .content {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 14px;
}
.footerBox .footerCopyrightBox .content p {
  color: #fff;
  font-size: 14px;
  line-height: 28px;
  text-align: center;
}
.footerBox .footerCopyrightBox .content p a {
  color: #fff;
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 4.4px;
  transition: all 0.4s ease-in-out 0s;
}
.footerBox .footerCopyrightBox .content p a:hover {
  opacity: 0.82;
}
.footerBox .footerCopyrightBox .content p a.mr {
  margin-right: 4px;
}
.footerBox .footerCopyrightBox .content p a.navMenu {
  color: #ffe300;
}

/* --平板~手機網頁共同的CSS--------------------------------- */
@media screen and (max-width: 1525px) {
  .indexProjectListBox {
    margin-top: 46px;
    padding: 46px 0 !important;
  }
  .indexProjectListBox:after {
    height: 472px;
  }
  .indexProjectListBox:before {
    display: none;
  }
}
@media screen and (max-width: 1412px) {
  .indexBigSliderBox {
    height: auto;
  }
}
@media screen and (max-width: 1300px) {
  .projectListBox ul.projectContent li.text.w25 {
    width: 40%;
  }
  .projectSearchBox .searchUI {
    margin-top: 18px;
    padding: 18px;
  }
  .projectSearchBox .searchUI .checkBoxWrapper {
    margin-bottom: 14px;
  }
  .projectSearchBox .searchUI .searchUITop {
    display: block;
  }
  .projectSearchBox .searchUI .searchUIBottom {
    margin-top: 2.8px;
  }
  .projectSearchBox .searchUI select {
    margin-bottom: 14px;
    margin-right: 1.406%;
    width: 15.11%;
  }
  .projectSearchBox .searchUI select:last-of-type {
    margin-right: 0;
  }
  .projectSearchBox .searchUI.secondTh select {
    width: 49%;
  }
  .projectSearchBox .searchUI.secondTh select:nth-child(2n+2) {
    float: right;
    margin-right: 0;
  }
}
@media screen and (max-width: 1280px) {
  .contentWrapper {
    padding: 18px 0 0 0;
  }
  .contentWrapper .contentBox {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    padding-top: 15px;
  }
  .contentWrapper .footerBox, .contentWrapper .projectSearchBox {
    padding: 0 16px;
  }
  .contentWrapper .knowledgeBox, .contentWrapper .memberCenterBox {
    padding: 0 16px 68px 16px;
  }
  .contentWrapper .memberLoginBox {
    padding: 20px 16px 28px;
  }
  .contentWrapper .projectDetailBox {
    padding: 0 16px 28px 16px;
  }
  .contentWrapper .projectDetailBox .otherProjectBox.pb {
    padding-bottom: 0;
  }
  .contentWrapper .projectSearchBox.p0 {
    padding: 0;
  }
  .contentWrapper .pagination {
    padding-bottom: 62px;
  }
  .contentWrapper .privacyBox {
    padding: 0 16px 62px;
  }
  .contentWrapper .privacyBox .tabContentFourth {
    padding: 0 16px 20px;
  }
  .contentWrapper .breadCrumbBox {
    padding: 64px 16px 12px;
  }
  .contentWrapper .salesBox {
    padding: 0 16px;
  }
  .contentWrapper .salesBox .salesBoxContent {
    max-width: 1168px;
    padding: 16px;
  }
  .contentWrapper .salesBox .salesName {
    padding: 0 16px;
  }
  .contentWrapper .qrCode {
    padding: 0 16px;
  }
  .contentWrapper .projectListBox.mobilePadding {
    padding: 0 16px;
  }
  .contentWrapper .projectListBox.padding0 {
    padding: 0;
  }

  .contentWrapper .projectListBox ul.projectList li.projectCard:nth-child(2n+2) {
    float: right;
/*    margin-right: 0;*/
  }
  .contentWrapper .projectListBox ul.projectList li.projectCard.salesProject:nth-child(3n+3) {
    margin-right: auto;
  }
  .indexContentWrapper {
    padding: 18px 0 0 0;
  }
  .indexContentWrapper .indexBox {
    border-bottom-left-radius: 0;
  }
  .indexContentWrapper .indexProjectContent, .indexContentWrapper .indexProjectListBox, .indexContentWrapper .indexSearchBox, .indexContentWrapper .indexTopSalesBox {
    padding: 0 16px;
  }
  .indexContentWrapper .indexProjectListBox {
    padding: 46px 0 0 0 !important;
  }
  .indexContentWrapper .indexProjectListBox .projectListBox {
    padding: 0 16px;
  }
  .indexContentWrapper .indexKnowledgeBox {
    margin: 60px auto 0 auto;
    padding: 0 16px 64px 16px;
  }
  .indexProjectListBox {
    margin-top: 64px;
  }
  .indexProjectListBox:after {
    display: none;
  }
  .indexProjectListBox li.projectCard {
    width: 48% !important;
  }
  .indexBox > section:before {
    display: none;
  }
  .indexTopSalesBox .indexTopSalesContent,
  .indexKnowledgeBox .indexTopSalesContent {
    margin-top: 22px;
  }
  .memberPhotoBox {
    margin-bottom: 28px;
  }
  .memberContentBox .searchDataList {
    padding: 0 16px 36px 16px;
  }
  .memberContentBox .searchDataList .searchContent {
    padding: 16px 0 12px;
  }
  .memberContentBox .searchDataList .totalPrice {
    bottom: 8px;
  }
  .memberContentBox .searchDataList button.removeLoveBtn , .removeBrowserBtn{
    right: 0;
  }
  .projectInfoBox .leftContent h2 {
    font-size: 26px;
    line-height: 32px;
  }
  .projectInfoBox .rightContent {
    padding: 25px 16px 20px 16px;
  }
  .projectInfoBox .rightContent .salesIntroBox {
    padding-bottom: 16px;
  }
  .salesIntroText {
    margin-left: 0;
  }
  .searchRecordBox .myNumberBox {
    margin-top: 28px;
    padding: 16px 16px 24px 16px;
  }
}
@media screen and (min-width: 1234px) {
  .indexBigSliderBox img.desktopShow {
    display: block;
  }
  .indexBigSliderBox img.mobileShow {
    display: none;
  }
}
@media screen and (max-width: 1234px) {
  .indexBigSliderBox img.desktopShow {
    display: none;
  }
  .indexBigSliderBox img.mobileShow {
    display: block;
  }
}
@media screen and (max-width: 1200px) {
  .headerUI img.logo {
    max-width: 130px;
  }
  .headerUI ul.menu a.btn {
    height: 42px;
  }
  .mapProjectBox .mapUI {
    max-height: 75vw;
  }
  .projectDetailBox .projectAuthLoginBox .contentText {
    padding-top: 0;
  }
  .projectDetailBox .projectAuthLoginBox .text {
    display: block;
  }
  .projectDetailBox .projectAuthLoginBox .text span.number {
    font-size: 27px;
  }
  .projectInfoBox ul.projectInfoList span.dateText, .projectInfoBox ul.projectInfoList span.number {
    font-size: 24px;
  }
  .projectInfoBox p {
    display: flex;
    flex-wrap: wrap;
  }
  
  .projectListBox ul.projectContent li.bigText {
    width: 40%;
  }
  .tabBoxUIFourth li {
    width: 18%;
  }
}
@media screen and (max-width: 1160px) {
  .salesIntroText {
    width: 65%;
  }
}
@media screen and (max-width: 1156px) {
  .projectInfoBox .addressBox ul.linkBtnBox {
    margin-left: 0;
    margin-top: 14px;
    width: 100%;
  }
}
@media screen and (max-width: 1149px) {
  .contentWrapper .contentBox.sPadding {
    padding-top: 10px;
  }
  .projectDetailBox .projectFeatureBox .floorPhotoBox {
    margin-left: 46px;
  }
  .projectInfoBox {
    display: block;
    margin-bottom: 34px;
  }
  .projectInfoBox .leftContent {
    width: 100%;
  }
  .projectInfoBox .leftContent h2 {
    font-size: 22px;
    line-height: 32px;
  }
  .projectInfoBox .addressBox {
    margin-top: 4px;
  }
  .projectInfoBox .addressBox p {
    font-size: 14px;
    line-height: 22px;
  }
  .projectInfoBox .addressBox ul.linkBtnBox {
    margin-top: 8px;
  }
  .projectInfoBox .rightContent {
    margin-left: 0;
    margin-top: 40px;
    width: 100%;
  }
  .projectInfoBox .rightContent .salesIntroBox {
    display: block;
  }
  .projectInfoBox .rightContent .profilePhoto {
    display: block;
    margin: 0 auto;
    max-width: 140px;
    text-align: center;
  }
  .projectInfoBox .rightContent img.salesPhoto {
    margin-bottom: 12px;
    max-width: 140px;
  }
  .projectInfoBox ul.projectInfoList {
    display: flex;
    line-height: 36px;
    margin-top: 6px;
  }
  .projectInfoBox ul.projectInfoList li {
    display: block;
    width: 14.28%;
  }
  .projectInfoBox ul.projectInfoList li:last-child {
    margin-right: 0;
  }
  .projectInfoBox ul.projectInfoList h5, .projectInfoBox ul.projectInfoList p {
    text-align: left;
    width: 100%;
  }
  .projectInfoBox ul.projectInfoList p {
    line-height: 26px;
    margin-top: -5px;
  }
  .projectInfoBox ul.projectInfoList span.bigText {
    font-size: 18px;
  }
  .projectInfoBox ul.projectInfoList span.dateText, .projectInfoBox ul.projectInfoList span.number {
    font-size: 22px;
  }
  .projectInfoBox .salesName {
    padding-left: 0;
    text-align: center;
    width: 100%;
  }
  .projectInfoBox .salesName .socialBtn {
    align-items: center;
    margin-top: 12px;
    justify-content: center;
  }
  .projectInfoBox .sliderBox .smallPicBox {
    margin-top: 12px;
  }
  .projectInfoBox .sliderBox .smallPicBox li {
    margin-right: 12px;
  }
}
@media screen and (max-width: 1149px) and (min-width: 768px) {
  .knowledgeListBox .knowledgeText .text button.readMoreBtn {
    left: 0;
    right: auto;
    transform: translateY(21px);
  }
}
@media screen and (max-width: 1146px) {
  .knowledgeListBox .knowledgeText h3 {
    font-size: 22px;
    line-height: 30px;
  }
  .knowledgeListBox .knowledgeText .text span.readMoreBtn {
    left: 0;
    transform: translateY(24px);
  }
  .projectListBox ul.projectList li {
    width: 44%;
  }
}
@media screen and (max-width: 1108px) {
  table.mapTable {
    box-shadow: none;
    margin-top: 28px;
  }
  table.mapTable thead {
    display: none;
  }
  table.mapTable tbody tr {
    border-top: 1px solid #dcdcdc;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
    margin-bottom: 28px;
    display: block;
  }
  table.mapTable tbody tr:last-of-type {
    margin-bottom: 0;
  }
  table.mapTable tbody td {
    border: none;
    border-bottom: 1px solid #dcdcdc;
    border-right: 1px solid #dcdcdc;
    display: block;
    height: auto;
    padding-left: 23.2%;
    padding-right: 14px;
    position: relative;
    width: 100%;
  }
  table.mapTable tbody td:before {
    background: #0067b3;
    color: #fff;
    content: attr(data-th);
    display: block;
    height: 102%;
    left: 0;
    line-height: 42px;
    padding: 0 0 0 15px;
    position: absolute;
    top: 0;
    width: 20%;
  }
  table.mapTable tbody td.dFlex {
    display: flex;
    flex-wrap: wrap;
  }
  table.mapTable tbody span.tagUI {
    margin-bottom: 0;
    margin-right: 8px;
  }
  table.mapTable tbody span.tagUI:last-of-type {
    margin-right: 0;
  }
}
@media screen and (max-width: 1100px) {
  .footerBox {
    display: block;
    padding: 20px 16px 16px;
  }
  .footerBox .leftContent, .footerBox .rightContent {
    float: none;
    width: 100%;
  }
  .footerBox .leftContent img.footerLogo {
    height: auto;
    max-width: 130px;
  }
  .footerBox .leftContent .text {
    margin-top: 12px;
  }
  .footerBox .rightContent {
    display: flex;
    flex-direction: column;
  }
  .footerBox .rightContent .followUsBox, .footerBox .rightContent .visitWebBox, .footerBox .rightContent .webLinkBox {
    width: 100%;
  }
  .footerBox .rightContent .followUsBox {
    margin-top: 16px;
    order: 1;
  }
  .footerBox .rightContent .visitWebBox {
    margin-top: 22px;
    order: 2;
  }
  .footerBox .rightContent .webLinkBox {
    margin-right: 0;
    margin-top: 16px;
    order: 3;
  }
  .footerBox .rightContent .mt {
    margin-top: 0;
  }
  .footerBox .rightContent h3 {
    margin-bottom: 10px !important;
  }
  .footerBox .rightContent h3:after {
    display: none;
  }
  .footerBox .rightContent li {
    line-height: 30px;
  }
  .footerBox .rightContent .socialBtn {
    margin-top: 16px;
  }
  .footerBox .rightContent .socialBtn li {
    line-height: 0;
    width: 38px;
  }
  .footerBox .footerCopyrightBox .content {
    padding-top: 10px;
  }
  .footerBox .footerCopyrightBox .content p {
    text-align: justify;
  }
}
@media screen and (max-width: 1071px) {
  .tabBoxUIThird li {
    width: 33.3%;
  }
  .backEndTabBoxUI li {
    height: 50px;
    line-height: 42px;
  }
}
@media screen and (max-width: 1064px) {
  .contentWrapper .projectSearchBox .searchUI {
    padding: 14px 10px;
  }
  .contentWrapper .projectSearchBox .searchUI select {
    background: url(../images/selectIcon.png) 97% center no-repeat;
    background-color: #fff;
    background-size: 8px 13px;
    margin-right: 3.6%;
    width: 48.2%;
  }
  .contentWrapper .projectSearchBox .searchUI select:nth-child(2n+2) {
    float: right;
    margin-right: 0;
  }
  .contentWrapper .projectSearchBox .searchUI input[type=search] {
    width: 89.3%;
  }
  .contentWrapper .projectSearchBox .searchUI input[type=submit] {
    margin-left: 3.6%;
  }
  .contentWrapper .salesBox .salesBoxContent {
    padding: 12px 14px 13px;
  }
}
@media screen and (max-width: 1024px) {
  .contentWrapper .contentBox.passwordPadding {
    padding: 36px 16px 72px;
  }
  .indexSearchBox .indexSearchContent {
    padding: 16px 20px 24px 20px;
  }
  .knowledgeBox h2,
  .privacyBox h2 {
    font-size: 22px;
  }
  .indexSearchBox h3,
  .indexPopularProjectBox h3,
  .indexTopSalesBox h3,
  .indexKnowledgeBox h3,
  .projectSearchBox h3,
  .projectListBox h3 {
    font-size: 22px;
  }
  .indexSearchBox h3:before,
  .indexPopularProjectBox h3:before,
  .indexTopSalesBox h3:before,
  .indexKnowledgeBox h3:before,
  .projectSearchBox h3:before,
  .projectListBox h3:before {
    content: "";
    height: 20px;
  }
  .indexTopSalesBox h4 {
    font-size: 22px;
  }
  .knowledgeListBox .knowledgeContent:last-of-type {
    padding: 24px 0 4% !important;
  }
  .pagination li {
    height: 44px;
    line-height: 42px;
    width: 44px;
  }
  .pagination li span, .pagination li span.selected, .pagination li.pagePrevBtn .icon, .pagination li.pageNextBtn .icon {
    height: 44px;
    width: 44px;
  }
  .passwordBox {
    padding: 16px 16px 28px;
  }
  .projectDetailBox .otherProjectBox {
    margin-top: 36px;
  }
  .projectDetailBox .projectAuthLoginBox {
    margin-top: 36px;
  }
  .projectDetailBox .projectAuthLoginBox .authLoginListBox {
    flex-wrap: wrap;
  }
  .projectDetailBox .projectAuthLoginBox .content {
    margin-bottom: 46px;
    margin-right: 4.6%;
    width: 47.67%;
  }
  .projectDetailBox .projectAuthLoginBox .content:nth-child(2n+2) {
    float: right;
    margin-right: 0;
  }
  .projectDetailBox .projectAuthLoginBox .content:last-of-type {
    margin-bottom: 0;
  }
  .projectDetailBox .projectFeatureBox {
    flex-wrap: wrap;
  }
  .projectDetailBox .projectFeatureBox .featureContentBox {
    order: 2;
    display:block;

  }
  .projectDetailBox .projectFeatureBox .floorPhotoBox {
    margin-left: 0;
    margin-bottom: 30px;
    order: 1;
    width: 100%;
  }
  .privacyBox .tabContent .qAndATitle {
    align-items: flex-end;
  }
  .privacyBox .tabContent .qAndATitle h3 {
    font-size: 20px;
    line-height: 30px;
    margin-top: -4px;
  }
  .privacyBox .tabContent .qAndANo {
    height: 48px;
    line-height: 44px;
    width: 52px;
  }
}
@media screen and (max-width: 1023px) {
  .memberPhotoBox,
  .searchRecordBox,
  .memberContentBox {
    float: none;
    width: 100%;
  }
  .salesBox .contentText {
    margin: 0 auto;
    width: 100%;
  }
  .salesBox .salesName {
    width: auto;
  }
  .tabBoxUIFourth li {
    width: 50%;
  }
}
@media screen and (max-width: 940px) {
  .indexSearchBox .content input[type=search] {
    width: 60%;
  }
  table.mapTable tbody td {
    padding-left: 24.8%;
  }
}
@media screen and (max-width: 920px) {
  .indexSearchBox .checkBoxBtnBox {
    margin: 18px 0 0 0;
    width: 100%;
  }
  .indexSearchBox .checkBoxBtnBox.ml {
    margin-left: 0;
  }
  .indexSearchBox .checkBoxBtnBox li:first-child {
    margin-bottom: 12px;
    width: 100%;
  }
}
@media screen and (max-width: 878px) {
  .knowledgeListBox .knowledgeText .text p {
    max-height: 50px;
    -webkit-line-clamp: 2;
  }
  .knowledgeListBox .knowledgeText button.readMoreBtn {
    bottom: -2.8px;
  }
}
@media screen and (max-width: 832px) {
  .projectSearchBox .searchUI.secondTh select {
    width: 48%;
  }
  .projectSearchBox .searchUI input[type=submit] {
    margin-left: 4%;
  }
}
@media screen and (max-width: 820px) {
  .privacyBox .tabContent .qAndATitle {
    align-items: flex-start;
  }
}
@media screen and (max-width: 806px) {
  .indexBigSliderBox {
    padding-top: 6%;
  }
}
@media screen and (min-width: 768px) {
  .mobileMenuBtn {
    display: block;
  }
  picture.aboutUsPic.desktopShow {
    display: block;
  }
  picture.aboutUsPic.mobileShow {
    display: none;
  }
  .projectInfoBox.projectInfoMobile {
    display: none;
  }
  .projectInfoBox .mobileHide {
    display: block;
  }
  .projectListBox .mobileProjectTitle {
    display: none;
  }
  .projectTagUI.desktopHide {
    display: none;
  }
    /*街景圖警告*/
    .street-picMask {
        position: absolute;
        top: 0px;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgba(166,166,166,0.56);
        opacity: 0.9999999;
        min-height: 100%;
        min-width: 100%;
        text-align: center;
        z-index: 2;
    }

    .street-picMask p {
        color: white;
        font-size: 33px;
        opacity: 0.8;
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    }
}
@media screen and (max-width: 768px) {
  .checkMoreProjectBtn {
    display: none;
    margin-top: 0;
  }
  .contentWrapper .projectSearchBox .searchUI select {
    background: url(../images/selectIcon.png) 95.3% center no-repeat;
    background-color: #fff;
    background-size: 8px 13px;
    margin-right: 3.6%;
    width: 48.2%;
  }
  .indexBigSliderBox {
    padding-top: 6%;
  }
  .indexProjectListBox {
    margin-top: 58px;
  }
  .indexSearchBox .indexSearchContent {
    padding: 16px 16px 24px 16px;
  }
  .memberLoginBox .rightContent {
    padding-right: 38px;
  }
  .memberLoginBox .thirdWayLoginBox {
    padding-left: 38px;
  }
  .knowledgeListBox {
    padding: 16px 16px 0;
  }
  .projectDetailBox .projectAuthLoginBox .authLoginListBox {
    display: block;
    padding-top: 22px;
  }
  .projectDetailBox .projectAuthLoginBox .content {
    margin-bottom: 40px;
    margin-right: 0;
    padding: 14px 16px 22px;
    width: 100%;
  }
  .projectDetailBox .projectAuthLoginBox .content:nth-child(2n+2) {
    float: none;
  }
  .projectDetailBox .projectAuthLoginBox .text {
    display: flex;
  }
  .projectInfoBox .rightContent.mobilePaddingOne {
    padding: 12px 16px 11px;
  }
  .projectInfoBox .rightContent.mobilePaddingTwo {
    padding: 26px 16px 20px;
  }
  .projectInfoBox .rightContent .mobileHide {
    display: none !important;
  }
  .projectInfoBox .rightContent .salesIntroBox {
    padding-bottom: 0;
  }
  .projectInfoBox .rightContent .salesIntroBox.borderNone {
    border-bottom: none;
  }
  .projectInfoBox .sliderBox .smallPicBox {
    margin-top: 10px;
  }
  .projectInfoBox .sliderBox .smallPicBox.mobileHide {
    display:none;
  }
  .projectInfoBox ul.projectInfoList {
    margin-top: 0;
  }
  .projectInfoBox ul.projectInfoList h5 {
    float: left;
  }
  .projectInfoBox ul.projectInfoList p {
    float: left;
    margin-top: -4px;
  }
  .projectInfoMobile {
    display: block !important;
  }
  .projectInfoMobile .rightContent {
    transform: translateY(0);
  }
  .projectListBox ul.projectList {
    margin-top: 22px;
  }
}
@media screen and (min-width: 767px) {
  .desktopHide {
    display: none;
  }
  .footerBox .footerCopyrightBox .content p.desktopShow {
    display: block;
  }
  .footerBox .footerCopyrightBox .content p.mobileShow {
    display: none;
  }
  .mobileSalesContactBox {
    display: none;
  }
  .picMarkUI {
    display: none;
  }
  .projectListBox ul.projectContent li.desktopHide {
    display: none;
  }
  .projectListBox .mobileProjectTitle {
    display: none;
  }
}
@media screen and (max-width: 767px) {
    .contentText div.mobileHide {
        display: none;
    }
     .mobileHide {
        display: none;
    }
    .desktopHide {
        color: #CFCFCF;
    }
    .street-picMask {
        display: none;
    }

  .contentWrapper .projectDetailBox {
    padding: 0 16px 20px 16px;
  }
  .contentWrapper .projectListBox ul.projectList li.projectCard.salesProject {
    margin: 0 0 32px 0;
    width: 100%;
  }
  .contentWrapper .projectSearchBox .searchUI select {
    background: url(../images/selectIcon.png) 92.3% center no-repeat;
    background-color: #fff;
    background-size: 8px 13px;
    margin-right: 3.6%;
    width: 48.2%;
  }
  .contentWrapper .privacyBox {
    padding: 0 16px 0;
  }
  .contentWrapper .projectList .btnBox.mobileHide,
  .indexContentWrapper .projectList .btnBox.mobileHide {
    display: none;
  }
  .loginUIBox h3 {
    font-size: 22px;
  }
  .footerBox .footerFrameBox .mobileHide {
    display: none;
  }
  .footerBox .rightContent .followUsBox, .footerBox .rightContent .socialBtn {
    margin-top: 0;
  }
  .footerBox .rightContent .socialBtn {
    justify-content: center;
  }
  .footerBox .footerCopyrightBox .content p {
    line-height: 27px;
  }
  .footerBox .footerCopyrightBox .content p.desktopShow {
    display: none;
  }
  .footerBox .footerCopyrightBox .content p.mobileShow {
    display: block;
  }
  .floorPhotoModal {
    max-width: 84vw;
    padding: 8px;
    top: auto;
    transform: translateY(40%);
  }
  .floorPhotoModal .modalCloseBtn {
    height: 36px;
    right: -18px;
    top: -18px;
    width: 36px;
  }
  .floorPhotoModal .modalCloseBtn:after, .floorPhotoModal .modalCloseBtn:before {
    height: 3.4px;
    width: 18px;
  }
  .indexKnowledgeBox p {
    font-size: 14px;
    line-height: 24px;
  }
  .indexPopularProjectBox select {
    background: url(../images/selectIcon.png) 95% center no-repeat;
    background-size: 8px 13px;
    margin-bottom: 22px;
    margin-right: 0px;
    width: 100%;
  }
  .indexProjectListBox li.projectCard {
    width: 100% !important;
  }
  .indexSearchBox .content {
    flex-wrap: wrap;
  }
  .indexSearchBox .content .selectUIBox {
    flex-basis: 100%;
  }
  .indexSearchBox .content .selectUIBox select {
    margin-right: 18px;
  }
  .indexSearchBox .content .selectUIBox select:last-child {
    margin-right: 0;
  }
  .indexSearchBox .content input[type=search] {
    margin-top: 18px;
    width: 100%;
  }
  .indexSearchBox .content button.searchBtn {
    margin-left: auto;
    margin-right: auto;
    margin-top: 18px;
  }
  .indexSearchBox .indexSearchContent {
    margin: -44px auto 0 auto;
  }
  .projectInfoBox.mobileHide {
    display: none !important;
  }
  .projectInfoBox .rightContent.mobilePaddingOne {
    padding: 16px 12px 10px;
  }
  .projectInfoBox .sliderBox .bigPicBox {
    padding: 0;
  }
  .projectInfoBox .sliderBox .smallPicBox li img.selected {
    border: 2.4px solid #0067b3;
  }
  .projectInfoBox ul.projectInfoList li {
    align-items: center;
    display: flex;
    margin-right: 0;
    padding-bottom: 6px;
    width: 50%;
  }
  .projectInfoBox ul.projectInfoList h5 {
    font-size: 15px;
    line-height: 23px;
    text-align: left;
  }
  .projectInfoBox ul.projectInfoList p {
    display: block;
    margin-top: 0;
  }
  .projectInfoBox ul.projectInfoList span.bigText, .projectInfoBox ul.projectInfoList span.dateText, .projectInfoBox ul.projectInfoList span.number, .projectInfoBox ul.projectInfoList span.smallText {
    font-size: 15px;
  }
  .projectList .label.mobileHide {
    display: none;
  }
  .knowledgeBox h3 {
    font-size: 22px;
    padding: 4px 0 10px;
  }
  .knowledgeBox .text {
    margin-top: 6px;
  }
  .knowledgeListBox {
    padding: 16px 16px 16px;
  }
  .knowledgeListBox .knowledgeContent {
    display: block;
    padding-bottom: 20px;
    position: relative;
  }
  .knowledgeListBox .knowledgeContent:last-of-type {
    padding: 24px 0 20px !important;
  }
  .knowledgeListBox .knowledgeContent .knowledgeText {
    margin-left: 0;
    margin-top: 4px;
    padding-bottom: 22px;
    width: 100%;
  }
  .knowledgeListBox .knowledgeContent .knowledgePic {
    width: 100%;
  }
  .knowledgeListBox .knowledgeContent .knowledgePic img {
    height: auto;
    width: 100%;
  }
  .knowledgeListBox .knowledgeText .text.dFlex {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
  }
  .knowledgeListBox .knowledgeText .text p {
    color: #353b39;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    text-align: justify;
  }
  .knowledgeListBox .knowledgeText button.readMoreBtn {
    font-size: 15px;
    left: 0;
    right: auto;
    top: auto;
    transform: translateY(22px);
  }
  .knowledgeListBox .knowledgeText h3 {
    font-size: 22px;
    padding: 2px 0 8px;
  }
  .knowledgeListBox .knowledgeText span.date {
    font-size: 15px;
  }
  .salesBox .contentText {
    align-items: flex-start;
    padding: 2px 0 10px !important;
    justify-content: center;
  }
  .salesBox img.salesPhoto {
    border-radius: 4px;
    display: block;
    float: left;
    height: auto;
    margin-right: 18px;
    max-height: none;
    max-width: 122px;
  }
  .salesBox .salesBoxContent {
    display: block;
  }
  .salesBox .salesName {
    border-right: none;
    float: left;
    padding: 0 !important;
    text-align: left;
    transform: translateY(-4px);
  }
  .salesBox .salesName h2 {
    font-size: 20px;
    margin: 4px 0 8px;
  }
  .salesBox .salesName h4 {
    font-size: 14px;
  }
  .salesBox .salesName a.telNo {
    font-size: 19px;
  }
  .salesBox .salesName ul.socialBtn {
    width: 100%;
  }
  .salesBox .qrCode {
    border-right: none;
    padding: 0 0 0 16px;
  }
  .salesBox .qrCode img {
    display: none;
    height: auto;
  }
  .salesBox .salesIntroText {
    padding-left: 0;
  }
  .salesBox .salesIntroText h4 {
    font-size: 17px;
    margin-bottom: 3px;
  }
  .salesIntroText {
    width: 100%;
  }
  .salesIntroText p {
    font-size: 14px;
    line-height: 24px;
  }
  .projectDetailBox .otherProjectBox .adaptivePic {
    float: left;
    width: 50%;
  }
  .projectDetailBox .otherProjectBox .adaptivePic.oneColumn {
    float: none;
    width: 100%;
  }
  .projectDetailBox .otherProjectBox .adaptivePic img {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.14);
    height: auto;
    width: 100%;
  }
  .projectDetailBox .otherProjectBox .projectMarkUI {
    height: 24px;
    padding: 2.4px 0 3px;
    width: 78px;
  }
  .projectDetailBox .otherProjectBox .projectMarkUI p {
    font-size: 11px;
  }
  .projectDetailBox .otherProjectBox ul.tabProjectSlider li {
    line-height: 16px;
  }
  .projectDetailBox .otherProjectBox ul.tabProjectSlider li .content.bigPtb {
    padding: 2px 10px 14px;
  }
  .projectDetailBox .otherProjectBox ul.tabProjectSlider li span.biggerText {
    font-size: 18px;
  }
  .projectDetailBox .projectFeatureBox .text p {
    font-size: 14px;
    line-height: 24px;
  }
  .projectDetailBox .tabProjectSlider li.projectCard {
    display: inline-block;
    width: 48% !important;
  }
  .projectListBox.mobileShow {
    display: block;
  }
  .projectListBox ul.projectList .adaptivePic {
    display: block;
    height: auto;
    overflow: hidden;
    padding-top: 29%;
    position: relative;
    width: 100%;
  }
  .projectListBox ul.projectList .adaptivePic img {
    bottom: 0;
    display: block;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
  }
  .projectListBox ul.projectList h4.mobileHide {
    display: none;
  }
  .projectListBox ul.projectList h4 a {
    font-size: 18px;
  }
  .projectListBox ul.projectList li.projectCard {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.14);
    margin-bottom: 22px !important;
    margin-right: 0;
    padding: 10px 10px 30px 10px;
  }
  .projectListBox ul.projectList li.projectCard.mb0 {
    margin-bottom: 0 !important;
  }
  .projectListBox ul.projectList li.projectCard.projectTabPadding {
    padding: 10px 10px 12px 10px;
  }
  .projectListBox ul.projectList p, .projectListBox ul.projectList p a {
    font-size: 14px;
  }
  .projectListBox ul.projectList p.mts {
    margin-top: 4.8px;
  }
  .projectListBox ul.projectList p.mt0 {
    margin-top: 0;
  }
  .projectListBox ul.projectList .pic {
    float: left;
    position: relative;
    width: 50%;
  }
  .projectListBox ul.projectList .pic img {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.14);
    height: auto;
  }
  .projectListBox ul.projectList .picMarkUI {
    background: linear-gradient(90deg, rgb(241, 108, 15) 0%, rgb(247, 79, 6) 50%, rgb(223, 77, 32) 100%);
    border-bottom-right-radius: 6px;
    display: block;
    height: 24px;
    left: 0;
    position: absolute;
    top: 0;
    width: 60px;
    z-index: 100;
  }
  .projectListBox ul.projectList .picMarkUI p {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
    text-align: center;
    transform: scale(0.83);
  }
  .projectListBox ul.projectList li .content {
    float: right;
    padding: 0 0 0 14px;
    width: 50%;
  }
  .projectListBox ul.projectList li .content.bigPtb.oneColumn {
    float: none;
    padding: 0;
    width: 100%;
  }
  .projectListBox ul.projectContent {
    margin: 6px 0 3px;
  }
  .projectListBox ul.projectContent.dFlex {
    display: flex;
    flex-wrap: wrap;
  }
  .projectListBox ul.projectContent li.bigText, .projectListBox ul.projectContent li.text:nth-child(2n+2) {
    width: 100%;
  }
  .projectListBox ul.projectContent li.mobileHide {
    display: none;
  }
  .projectListBox ul.projectContent li.mobileShow {
    display: block;
  }
  .projectListBox ul.projectContent li.text {
    line-height: 24px;
    margin-right: 2.4px !important;
  }
  .projectListBox ul.projectContent li.text.projectTabLh {
    line-height: 18px;
  }
  .projectListBox ul.projectContent li.wAuto {
    width: auto !important;
  }
  .projectListBox ul.projectContent span {
    font-size: 14px;
  }
  .projectListBox ul.projectContent span.priceText {
    font-size: 22px;
  }
  .projectListBox ul.projectContent span.mobilePriceText {
    font-size: 16px;
    font-weight: 600;
  }
  .projectListBox ul.projectContent span.mobileSinglePriceText {
    font-size: 12px;
    font-weight: 500;
    transform: scale(0.83);
  }
  .projectListBox ul.projectContent span.mobilePriceText, .projectListBox ul.projectContent span.mobileWanText, .projectListBox ul.projectContent span.mobileSinglePriceText {
    color: #353b39;
  }
  .projectListBox span.mobileHide {
    display: none;
  }
  .projectListBox .mobileProjectTitle {
    display: block;
    margin-bottom: 14px;
  }
  .mapTableBox.mobileHide {
    display: none;
  }
  .projectTagUI {
    color: #353b39;
    display: block;
    font-size: 12px;
    font-weight: 500;
    position: relative;
    right: 10%;
    transform: scale(0.83);
    width: 118%;
  }
  .projectTagUI span {
    border: 1px solid #dcdcdc;
    line-height: 22px;
    padding: 2px 4px 3px;
    text-align: center;
    width: 50%;
  }
  .projectTagUI span:hover {
    color: 1px solid #0472c0;
  }
  .projectTagUI span.mr {
    margin-right: 4px;
  }

  .mobileSalesContactBox {
    align-items: center;
    background: #fff;
    box-shadow: 0 -6px 6px -4px rgba(0, 0, 0, 0.1);
    bottom: 0;
    padding: 10px 16px 14px;
    position: fixed;
    width: 100%;
    z-index: 200;
  }
  .mobileSalesContactBox .dFlex {
    align-items: center;
    display: flex;
  }
  .mobileSalesContactBox .salesPhotoBox {
    align-items: center;
    display: flex;
    height: 56px;
    overflow: hidden;
    position: relative;
    width: 56px;
  }
  .mobileSalesContactBox .salesPhotoBox img {
    height: auto;
    max-width: 56px;
    width: 100%;
  }
  .mobileSalesContactBox h2 {
    font-size: 15px;
    font-weight: 600;
    line-height: 21px;
    margin: 0 10px;
  }
  .mobileSalesContactBox .mobileSalesBox {
    width: 58%;
  }
  .mobileSalesContactBox .mobileBtnBox {
    width: 80%;
  }
  .mobileSalesContactBox button.btnUI, .mobileSalesContactBox button.btnUI a {
    border: none;
    border-radius: 8px;
    color: #fff;
    display: block;
    font-size: 14px;
    font-weight: 600;
    height: 48px;
    line-height: 44px;
    text-align: center;
    text-decoration: none;
    width: 100%;
  }
  .mobileSalesContactBox button.lineBtn {
    background: linear-gradient(180deg, #06c755 50%, #21a085 150%);
    margin-right: 14px;
  }
  .mobileSalesContactBox button.phoneBtn {
    background: linear-gradient(180deg, #f93 20%, #ff8000 150%);
  }
  picture.aboutUsPic.desktopShow {
    display: none;
  }
  picture.aboutUsPic.mobileShow {
    display: block;
  }
  picture.aboutUsPic img.desktopPic {
    max-width: 1200px;
  }
  picture.aboutUsPic img.mobilePic {
    max-width: 498px;
  }
  .indexTopSalesBox .owl-stage {
    margin: 0 2vw;
    display: grid;
    justify-content:space-between;
    grid-template-columns: repeat(2, 45%);
    grid-gap:30px 25px;
    user-select:none;
  }
  .salesInfoBox{
      height:75px;
      display:block;
  }
  .salesInfoBox .nameBox{
    width:120%;
    overflow:hidden;
    margin-top:3px;

  }
  .salesInfoBox .salesText {
    margin-top:-5px;
    width:175%;
    height:100px;
    overflow:hidden;
    text-overflow:ellipsis;
    margin:0;
  }
  .salesInfoBox .salesText p{
      margin-top: 0 ;
  }
  .indexTopSalesBox h4 {
    font-size: 22px;
    text-overflow: ellipsis;
    
  }
  .indexTopSalesBox p{
    font-size: 15px ;
    line-height:23px !important;
  }
  .indexTopSalesBox img.shadow {
    height: 250px !important;
    width: auto;
  }
    /*街景圖警告*/
    .picMask {
        position: absolute;
        top: 0px;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgba(166,166,166,0.56);
        opacity: 0.9999999;
        min-height: 100%;
        min-width: 100%;
        text-align: center;
        z-index: 99;
    }

    .picMask p {
        color: white;
        font-size: 18px;
        opacity: 0.8;
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    }
}
@media screen and (max-width: 740px) {
  .memberContentBox .searchDataList .searchContent {
    display: block;
    padding: 16px 0 6px;
  }
  .memberContentBox .searchDataList .pic {
    max-width: none;
    width: 100%;
  }
  .memberContentBox .searchDataList .content {
    margin-left: 0;
    margin-top: 6px;
  }
  .memberContentBox .searchDataList ul.projectContent {
    margin-top: 6px;
  }
}
@media screen and (max-width: 705px) {
  .searchRecordBox table tbody td ul {
    display: block;
    float: none;
    width: 100%;
  }
  .searchRecordBox table tbody td li {
    display: block;
  }
  .searchRecordBox table tbody td li.mr {
    margin-right: 6px;
    transform: translateY(-6px);
  }
  .searchRecordBox table tbody td li.mt {
    margin-top: -6px;
  }
  .searchRecordBox table tbody td p {
    max-height: none;
  }
  .searchRecordBox table tbody button {
    margin-top: 8px;
  }
}
@media screen and (max-width: 700px) {
  .contentWrapper .projectListBox .otherProjectSlider {
    display: flex;
  }
  .contentWrapper .projectListBox .otherProjectSlider li.projectCard {
    margin: 0 0 22px 0 !important;
    width: 100% !important;
  }
  .contentWrapper .projectListBox .otherProjectSlider li.projectCard:nth-child(3n+3) {
    margin-right: 0;
  }
  .contentWrapper .projectListBox .otherProjectSlider li.projectCard:nth-last-child(1) {
    margin-bottom: 0 !important;
  }
}
@media screen and (max-width: 670px) {
  .breadCrumbBox p.dHide {
    display: none;
  }
  .headerUI {
    background: rgb(255, 255, 255);
    box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.2);
    display: block;
    padding: 10px 0 12px;
  }
  .headerUI .content {
    line-height: 0;
  }
  .headerUI img.logo {
    display: block;
    float: left;
    height: auto;
    margin-left: 16px;
    max-width: 100px;
    opacity: 1;
    position: static;
    transition: opacity 0.4s ease-out;
    transform: translateY(0%);
  }
  .headerUI ul.menu {
    float: none;
    padding: 0;
  }
  .headerUI ul.menu li {
    padding-right: 0;
  }
  .headerUI ul.menu a {
    font-size: 16px;
    transition: none;
  }
  .headerUI ul.menu a.btn {
    transform: none;
  }
  .headerUI ul.menu ul.subMenu {
    box-shadow: none;
    border-radius: 0;
    display: none;
    padding: 0 0 10px;
    position: static;
    transform: none;
    width: 100%;
  }
  .headerUI ul.menu ul.subMenu li {
    border-bottom: none;
    display: inline-block;
    line-height: normal;
    width: 100%;
  }
  .headerUI ul.menu ul.subMenu li a {
    font-size: 15px;
    padding: 6px 16px 6px 48px;
    position: relative;
  }
  .headerUI ul.menu ul.subMenu li a:before {
    content: "";
    bottom: 0;
    display: block;
    font-size: 14px;
    font-weight: 600;
    height: 2px;
    left: 33px;
    margin: auto;
    position: absolute;
    right: auto;
    top: 0;
    transform: rotate(0deg) translateY(50%);
    width: 8px;
  }
  .headerUI ul.menu ul.subMenu li a:after {
    display: none;
  }
  .headerUI ul.menu ul.subMenu li:nth-child(3) {
    border-bottom: none;
  }
  #mobileMenuBtn {
    float: right;
    height: 22px;
    position: relative;
    right: 16px;
    top: 8.5px;
    transform: rotate(0deg);
    transition: 0.6s ease-in-out;
    width: 24px;
  }
  #mobileMenuBtn span {
    background: rgb(44, 44, 44);
    display: block;
    height: 2.6px;
    left: 0;
    position: absolute;
    transform: rotate(0deg);
    transition: 0.35s ease-in-out;
    width: 24px;
  }
  #mobileMenuBtn span:nth-child(1) {
    top: 0px;
  }
  #mobileMenuBtn span:nth-child(2) {
    top: 8px;
  }
  #mobileMenuBtn span:nth-child(3) {
    top: 16px;
  }
  #mobileMenuBtn.open span:nth-child(1) {
    top: 9px;
    transform: rotate(135deg);
  }
  #mobileMenuBtn.open span:nth-child(2) {
    opacity: 0;
    width: 0%;
  }
  #mobileMenuBtn.open span:nth-child(3) {
    top: 9px;
    transform: rotate(-135deg);
  }
  .nav {
    display: none;
    float: none;
    height: auto;
    position: absolute;
    top: 51px;
    width: 100%;
    z-index: 200;
  }
  .nav ul {
    background: #fff;
  }
  .nav li {
    border-bottom: 1px solid #dcdcdc;
    display: block;
    float: none;
    line-height: 22px;
    text-align: left;
    width: 100%;
  }
  .nav li:last-child {
    border-bottom: none;
  }
  .nav li.mainSubMenu a.subMenuOpen {
    padding-bottom: 2px;
  }
  .nav li.mainSubMenu a.subMenuOpen:after {
    top: 60%;
  }
  .nav li.loginBtn {
    padding: 16px;
  }
  .nav li.mainSubMenu a.iconChange:before {
    content: "";
    display: none;
  }
  .nav li a {
    display: block;
    font-size: 15px;
    font-weight: 600;
    line-height: 25px;
    padding: 12px 16px;
    position: relative;
    text-decoration: none;
    width: 100%;
  }
  .nav li a:before {
    content: "";
    background: #0266be;
    display: block;
    height: 2px;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: rotate(90deg);
    transition: all 0.4s ease-in-out 0s;
    width: 12px;
  }
  .nav li a:after {
    content: "";
    background: #0266be;
    display: block;
    height: 2px;
    position: absolute;
    right: 16px;
    top: 50%;
    width: 12px;
  }
  .nav li.loginBtn a:before, .nav li.loginBtn a:after {
    display: none;
  }
  .mapProjectBox .mapUI {
    max-height: 80vw;
  }
  .contentWrapper {
    padding: 62px 0 0 0;
  }
  .contentWrapper .breadCrumbBox {
    padding: 0 18px 8px 18px;
  }
  .indexBigSliderBox {
    padding-top: 6%;
  }
  .memberLoginBox .rightContent, .memberLoginBox .thirdWayLoginBox {
    float: none;
    width: 100%;
  }
  .memberLoginBox .rightContent {
    border-right: none;
    padding-right: 0;
  }
  .memberLoginBox .thirdWayLoginBox {
    margin-top: 22px;
    padding-left: 0;
  }
  .memberLoginBox .thirdWayLoginBox li {
    margin-bottom: 22px;
  }
  table.mapTable {
    box-shadow: none;
  }
  table.mapTable tbody tr {
    display: block;
    overflow: hidden;
    white-space: nowrap;
  }
  table.mapTable tbody tr::-webkit-scrollbar {
    height: 4px;
    width: 4px;
  }
  table.mapTable tbody tr::-webkit-scrollbar-thumb {
    background: #036abe;
  }
  table.mapTable tbody tr::-webkit-scrollbar-track {
    background: #f7f7f7;
  }
  table.mapTable tbody td {
    padding-left: 44.28%;
  }
  table.mapTable tbody td:before {
    width: 36%;
  }
}
@media screen and (max-width: 600px) {
  .tabBoxUI li {
    margin-bottom: 0;
    width: 50%;
  }
  .tabBoxUI li.mb0 {
    margin-bottom: 0;
  }
  .indexTopSalesBox .owl-stage{
    margin: 0 2vw;
  }
  .indexTopSalesBox img.shadow {
    height: 240px !important;
    width: auto;
  }
}

@media screen and (max-width : 590px){
  .indexTopSalesBox img.shadow {
    height: 230px !important;
    width: auto;
  }
}

@media screen and (max-width: 566px) {
  .indexSearchBox .checkBoxBtnBox.sMobileMt {
    margin-top: 16px;
  }
  .indexSearchBox .content {
    margin-top: 18px;
  }
  .indexSearchBox .radioBtnBox {
    margin: 14px 4px 0 0;
  }
  .indexSearchBox .radioBtnBox li {
    margin-bottom: 12px;
  }
  .indexTopSalesBox img.shadow {
    height: 220px !important;
    width: auto;
  }
}
@media screen and (max-width: 544px) {
  .projectInfoBox .rightContent.mobilePaddingOne {
    padding: 16px 12px 5px;
  }
  .projectInfoBox ul.projectInfoList li {
    width: 46.9%;
  }
  .projectInfoBox ul.projectInfoList li:nth-child(2n+1) {
    margin-right: 16px;
  }
  .projectInfoBox ul.projectInfoList h5 {
    width: 80px;
  }
  .projectInfoBox ul.projectInfoList span.number {
    font-size: 16px;
  }
  
}
@media screen and (max-width: 520px) {
  .mapSearchResultBox {
    margin-top: 20px;
  }
  .mapSearchResultBox .leftContent, .mapSearchResultBox .rightContent {
    float: none;
  }
  .mapSearchResultBox .leftContent {
    position: static;
  }
  .mapSearchResultBox .leftContent p {
    font-size: 14px;
    line-height: 24px;
  }
  .mapSearchResultBox .leftContent span.number {
    font-size: 44px;
  }
  .mapSearchResultBox .rightContent {
    margin-top: 14px;
  }
  .mapSearchResultBox .rightContent button {
    margin-right: 18px;
  }
  .indexTopSalesBox .nameBox{
      width:100px;
      height:35%;
      overflow:hidden;
  }
}
@media screen and (max-width: 500px) {
  .indexBigSliderBox {
    padding-top: 8%;
  }
  .projectDetailBox .projectFeatureBox .floorPhotoBox {
    margin-bottom: 34px;
  }
  .projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox {
    display: block;
  }
  .projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox li {
    margin-bottom: 16px;
    margin-right: 0;
  }
  .projectDetailBox .projectFeatureBox .floorPhotoBox .floorPicBox li:last-child {
    margin-bottom: 0;
  }
  .projectInfoBox ul.projectInfoList h5 {
    text-align: left;
  }
  .projectInfoBox ul.projectInfoList p {
    text-align: left;
  }
  .indexTopSalesBox img.shadow{
    height:190px !important;
    width:auto ;
  }
  .salesInfoBox .salesText {
        width:170px;
  }

  .salesInfoBox .salesText p {
         line-height: 17px;
  }
}
@media screen and (max-width: 480px) {
  .projectDetailBox .projectFeatureBox h3 {
    display: block;
    float: none;
    font-size: 22px;
  }
    .projectDetailBox .projectFeatureBox .tagUIBox {
        margin-left: 0;
        margin-top: 16px;
    }
  .projectDetailBox .projectAuthLoginBox h4 {
    font-size: 22px;
  }
  .projectDetailBox .otherProjectBox h3, .projectDetailBox .projectAuthLoginBox h3 {
    font-size: 22px;
  }
}
@media screen and (max-width: 472px) {
  .tabBoxUIOne li {
    width: 33%;
  }
  .searchRecordBox .myNumberBox ul {
    display: block;
  }
  .searchRecordBox .myNumberBox li {
    width: 100%;
  }
  .searchRecordBox .myNumberBox .oneBtnBox, .searchRecordBox .myNumberBox .twoBtnBox {
    margin-top: 24px;
    max-width: 142px;
  }
  .searchRecordBox .myNumberBox .twoBtnBox li {
    margin-bottom: 22px;
    margin-right: 0;
    width: 100%;
  }
  .searchRecordBox .myNumberBox .twoBtnBox li:last-of-type {
    margin-bottom: 0;
  }
  .memberLoginBox .oneBtnBox {
    margin: 24px auto 0 auto;
  }
  .contentWrapper .memberLoginBox {
    padding: 16px 16px 28px;
  }
  .memberContentBox .searchDataList .totalPrice {
    left: 0;
    margin-top: 8px;
    position: static;
    right: auto;
  }
  .passwordBox .oneBtnBox, .passwordBox .twoBtnBox {
    margin: 24px auto 0 auto;
  }
}
@media screen and (max-width: 454px) {
  .indexSearchBox .content {
    margin-top: 10px;
  }
  .indexSearchBox .checkBoxBtnBox.sMobileMt {
    margin-top: 8px;
  }
  .indexSearchBox .checkBoxBtnBox li {
    margin-bottom: 14px;
  }

  .indexTopSalesBox img.shadow {
    height: 170px !important;
    width: auto;
  }

  .indexBox > section.indexHotBox::before {
      height: 425px;
  }

  .indexBox > section.indexKnowledgeBox::before {
      height: 425px;
  }

  .indexBox > section.indexTopSalesBox::before {
      height: 325px;
  }

  .projectDetailBox > section {
      margin: 0 0 20px 0;
  }

  .projectListBox ul.projectList li.projectCard img {
    object-fit: fill;
  }
}
@media screen and (max-width: 430px) {
  .indexSearchBox .content .selectUIBox {
    flex-wrap: wrap;
  }
  .indexSearchBox .content .selectUIBox select {
    margin: 0 6% 18px 0;
    width: 47%;
  }
  .indexSearchBox .content .selectUIBox select:nth-child(2n+2) {
    margin-right: 0;
  }
  .indexSearchBox .content .selectUIBox select:last-child {
    margin-bottom: 0;
  }
  .indexSearchBox .content input[type=search] {
    margin-top: 0;
  }
  .projectListBox ul.projectList .adaptivePic {
    padding-top: 26%;
  }
  
}
@media screen and (max-width: 415px) {
  .projectListBox ul.projectList .adaptivePic {
    padding-top: 28%;
  }
}
@media screen and (max-width: 414px) {
  .indexBigSliderBox {
    padding-top: 9%;
  }
  .projectTabBoxUI li a {
    font-size: 15px;
  }
}
@media screen and (max-width: 413px) {
  .projectInfoBox ul.projectInfoList li {
    display: block;
  }
  .projectInfoBox ul.projectInfoList h5 {
    width: 96px;
  }
  .projectListBox ul.projectList .adaptivePic {
    padding-top: 29%;
  }

  .indexTopSalesBox .owl-stage {
    margin: 0 1vw;
  }
  .indexTopSalesBox .nameBox{
    font-size:16px;
    width:100px;
    height:35%;
  }
  .indexTopSalesBox .salesText{
      font-size:14px;
      width:140px

  }
}
@media screen and (max-width: 391px) {
  .memberLoginBox .otherMenu li:first-of-type, .memberLoginBox .otherMenu li:last-of-type {
    float: none;
  }
  .projectListBox ul.projectList li .content {
    margin-top: -2px;
  }
  .projectListBox ul.projectList li.projectCard {
    padding: 10px 10px 30px 10px;
  }
  .projectListBox ul.projectContent li.text {
    line-height: 22px;
  }
}
@media screen and (max-width: 390px) {
  .projectDetailBox .projectAuthLoginBox .text.noFlex {
    display: block;
  }
  .indexTopSalesBox img.shadow{
      height:150px !important;
      width:auto;
  }
}
@media screen and (max-width: 388px) {
  .projectListBox ul.projectList .adaptivePic img {
    aspect-ratio: 2/1.14;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
@media screen and (max-width: 383px) {
  .projectListBox ul.projectList .adaptivePic img {
    aspect-ratio: 2/1.18;
  }
}
@media screen and (max-width: 375px) {
  .indexBigSliderBox {
    padding-top: 10%;
  }
}
@media screen and (max-width: 374px) {
  .projectListBox ul.projectContent li.text, .projectListBox ul.projectContent li.text:nth-child(2n+2) {
    margin-right: 0;
    width: 100%;
  }
  .projectListBox ul.projectList li .content {
    margin-top: -4px;
  }
  table.mapTable tbody td {
    padding-left: 46%;
  }
  table.mapTable tbody td.dFlex {
    display: block;
  }
  table.mapTable tbody span.tagUI {
    margin-bottom: 8px;
    margin-right: 0;
  }
}
@media screen and (max-width: 368px) {
  .projectInfoBox .addressBox {
    margin-top: 6px;
  }
  .projectInfoBox .addressBox ul.linkBtnBox {
    margin-top: 14px;
  }
  .projectInfoBox .addressBox li {
    margin-right: 8px;
  }
  .projectInfoBox .addressBox li:last-of-type {
    margin-bottom: 0;
    margin-right: 0;
  }
  .projectDetailBox .projectFeatureBox span.tagUI {
    padding: 0 4px;
  }
}
@media screen and (min-width: 360px) {
  .projectTabBoxUI li a.desktopShow {
    display: block;
  }
  .projectTabBoxUI li a.mobileShow {
    display: none;
  }
}
@media screen and (max-width: 360px) {
  .indexBigSliderBox {
    padding-top: 11%;
  }
  .indexTopSalesBox h4 {
    font-size: 18px ;
  }
  .indexTopSalesBox .nameBox{
    height:31%
  }
  .indexTopSalesBox .salesText{
      font-size:15px;
      width:130px;
  }
  .passwordBox .twoBtnBox {
    display: block;
    max-width: 142px;
  }
  .passwordBox .twoBtnBox li {
    margin-bottom: 22px;
    margin-right: 0;
    width: 100%;
  }
  .passwordBox .twoBtnBox li:last-of-type {
    margin-bottom: 0;
  }
  .projectTabBoxUI li a.desktopShow {
    display: none;
  }
  .projectTabBoxUI li a.mobileShow {
    display: block;
  }
  .salesInfoBox .nameBox h5 {
    font-size: 14px;
    margin-top: 6px;
  }
  .salesInfoBox .salesText p {
    font-size: 14px;
    line-height: 22px;
    margin-top: 3px;
  }
}
@media screen and (max-width: 358px) {
  .projectListBox ul.projectList .adaptivePic {
    padding-top: 43.022%;
  }
  .projectListBox ul.projectList .adaptivePic img {
    aspect-ratio: 2/1.72;
  }
  .projectListBox ul.projectList li.projectCard {
    padding: 10px;
  }
  .projectTagUI span {
    display: block;
    white-space: wrap;
    width: 61%;
  }
  .projectTagUI span.mb {
    margin-bottom: 10px;
  }

    .projectTagUIRed {
        border-style: solid;
        border-color: red;
    }
}
@media screen and (max-width: 352px) {
  .indexSearchBox .radioBtnBox li {
    width: 30%;
  }
  .indexSearchBox .radioBtnBox li:nth-child(3n+3) {
    margin-right: 0;
  }
}
@media screen and (max-width: 350px) {
  .footerBox.mobileMb {
    margin-bottom: 130px;
  }
  .pagination li {
    margin-right: 8px;
  }
  .mobileSalesContactBox .dFlex .mobileSalesBox {
    width: 60%;
  }
  .mobileSalesContactBox .dFlex .mobileBtnBox {
    width: 100%;
  }
  .mobileSalesContactBox .dFlex .salesPhotoBox {
    height: inherit;
    width: 60px;
  }
}
@media screen and (max-width: 347px) {
  .projectListBox ul.projectList .adaptivePic {
    padding-top: 53.022%;
  }
  .projectListBox ul.projectList .adaptivePic img {
    aspect-ratio: 2/2.1;
  }
  .footerBox.mobileMb {
    margin-bottom: 145px !important;
  }
}
@media screen and (max-width: 342px) {
  .projectListBox ul.projectList .adaptivePic img {
    aspect-ratio: 2/2.16;
  }
  .footerBox .footerCopyrightBox .content p {
    text-align: left;
  }
}
@media screen and (max-width: 335px) {
  .projectListBox ul.projectList .adaptivePic {
    padding-top: 56.022%;
  }
  .projectListBox ul.projectList .adaptivePic img {
    aspect-ratio: 2/2.3;
  }
  .salesBox img.salesPhoto {
    max-width: 100px;
  }
  .picMasktext small {
    font-size: 60% !important;
  }
}
@media screen and (max-width: 320px) {
    .projectListBox ul.projectList .adaptivePic {
        padding-top: 60.022%;
    }

    .indexTopSalesBox img.shadow {
        height: 140px !important;
        width: auto;
    }


}


/*從舊版本中整合過來的css*/

.my-properties {
    background: #FFFFFF;
    -webkit-box-shadow: 0 0 20px rgba(38, 38, 38, 0.2);
    box-shadow: 0 0 20px rgba(38, 38, 38, 0.2);
    padding: 30px;
}

    .my-properties table {
        width: 100%;
        display: table;
    }

        .my-properties table thead tr th {
            font-size: 15px;
            color: #222;
            background-color: #f5f6ff;
            border: none;
            font-weight: 500;
            padding: 10px 10px 10px 0;
        }

            .my-properties table thead tr th:first-child {
                color: #333;
                font-size: 18px;
                font-weight: 600;
                padding-left: 30px;
            }

        .my-properties table tbody tr td {
            border-top: none;
            border-bottom: 1px solid #f3f3f3;
            padding: 30px 20px 30px 0;
            vertical-align: middle;
            font-size: 14px;
        }

        .my-properties table h2 {
            border: none;
            font-size: 16px;
            color: #444;
            text-decoration: none;
            text-transform: capitalize;
            font-weight: 500;
            margin: 0 0 9px 0;
            padding: 0;
        }

    .my-properties a {
        text-decoration: none;
    }

.my-address label {
    color: #222;
}

.my-address .form-group {
    margin-bottom: 1.5rem;
}

.my-properties table tbody tr .image {
    width: 150px;
}

    .my-properties table tbody tr .image a img {
        width: 100%;
        border-radius: 5px;
    }

.my-properties table tbody tr td .actions .edit {
    float: left;
}

.my-properties table tbody tr td .inner figure {
    margin-bottom: 16px;
    color: #333;
}

    .my-properties table tbody tr td .inner figure i {
        font-size: 13px;
    }

.my-properties table tbody tr td .price {
    font-size: 12px;
    font-weight: 500;
}

.my-properties table tbody tr td.actions {
    text-align: right;
}

    .my-properties table tbody tr td.actions .edit {
        float: left;
        color: #008000;
    }

        .my-properties table tbody tr td.actions .edit i {
            -webkit-transition: 0.4s;
            transition: 0.4s;
            margin-right: 5px;
        }

    .my-properties table tbody tr td.actions a {
        padding: 0;
        color: #f50057;
    }

.my-properties table tbody tr td:last-child {
    padding-right: 5px;
}