/* ------ */
.color_A48747 {
  color: #a48747 !important;
}

.white {
  color: #fff !important;
}

/* ------ */
/* ------ */
.menu nav ul li a {
  margin: 0 0.8vw !important;
  color: #fff !important;
}
.menu nav ul li a:hover {
  border-bottom: 4px solid #a58f68 !important;
  color: #a58f68 !important;
}
.menu nav ul li.active a {
  color: #a58f68 !important;
  border-bottom: 4px solid #a58f68 !important;
}
.menu nav .rightNav .phone_txt {
  color: #f9f600 !important;
}

.activeMenuFloatStatus {
  background-color: #000 !important;
}

.bodyPage .webNav {
  background-color: #000 !important;
}

/* ------ */
/* ------ */
footer .caseInfo {
  background: transparent linear-gradient(180deg, #1d170c 5%, #3b2511 100%) 0% 0% no-repeat padding-box !important;
}

/* ------ */
/* ------ */
.noteBody {
  position: absolute;
  display: block;
  color: #fff;
  padding: 5px 5px;
  font-size: 14px;
  background-color: rgba(35, 24, 21, 0.8);
}

.noteBody.left {
  bottom: 5px;
  left: 5px;
}

.noteBody.right {
  bottom: 5px;
  right: 5px;
}

.noteBody.top {
  bottom: initial !important;
  top: 5px;
}

.noteBody.black {
  color: #000;
}

/* ------ */
/* ------ */
.keyVision {
  width: 100%;
  position: relative;
}
.keyVision .fullBg {
  position: relative;
  width: 100%;
  min-height: 53vw;
  background-image: url("/case_assets/tpone250144/assets/images/sample/p1.jpg?v=2501080915");
  background-size: cover;
  background-position: center;
}
.keyVision .fullBg img {
  width: 100%;
}
.keyVision .logo {
  position: absolute;
  width: 42vw;
  height: 15vw;
  top: 15vw;
  left: 29vw;
  z-index: 8;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p1_01.png?v=2501080915);
  background-repeat: no-repeat;
  background-size: contain;
}
.keyVision .logo img {
  width: 100%;
}
.keyVision .slogan1 {
  position: absolute;
  width: 53vw;
  height: 7vw;
  top: 35vw;
  left: 23vw;
  z-index: 8;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p1_02.png?v=2501080915);
  background-repeat: no-repeat;
  background-size: contain;
}
.keyVision .slogan1 img {
  width: 100%;
}
.keyVision .video {
  padding-bottom: 56.25%;
  width: 100%;
  height: 0;
  position: relative;
  left: 0;
}
.keyVision .video .object {
  position: relative;
  height: 100%;
}
.keyVision .video .object .mask {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.3);
}
.keyVision .video .object video {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -99;
}

.btn-more {
  display: block;
  width: 5.5vw;
  height: 2vw;
  background-image: url("/case_assets/tpone250144/assets/images/sample/more.png");
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: 1vw;
}

.btn-more:hover {
  background-image: url("/case_assets/tpone250144/assets/images/sample/more_1.png");
}

.pcTxtCenter .btn-more {
  margin-left: auto;
  margin-right: auto;
}

/* ------ */
.fullRegion .txt .body h3 {
  font-family: "Noto Serif TC", serif !important;
  font-size: 1.5vw !important;
  font-weight: bold !important;
  color: #a48747;
}
.fullRegion .txt .body h1 {
  font-family: "Noto Serif TC", serif !important;
  font-size: 2.25vw !important;
  font-weight: bold !important;
  color: #12202e;
  margin: 0.75vw 0;
}
.fullRegion .txt .body p {
  font-size: 1vw !important;
  line-height: 2vw !important;
  color: #12202e;
}

.flexRegion {
  display: flex;
}

.blockRegion {
  display: block;
}

.regionTopNotSpace {
  margin-top: 0px !important;
}

.regionBottomNotSpace {
  margin-bottom: 0px !important;
}

.bottomMinHeight {
  min-height: 20vw;
}

.bodyRegion {
  position: relative;
  width: 100%;
  padding: 3vw 0;
  overflow: hidden;
  align-items: center;
  display: flex;
}
.bodyRegion .txt {
  width: 32vw;
}
.bodyRegion .txt h3 {
  font-family: "Noto Serif TC", serif !important;
  font-size: 1.5vw;
  font-weight: bold;
  color: #a48747;
}
.bodyRegion .txt h1 {
  font-family: "Noto Serif TC", serif !important;
  font-size: 2.25vw;
  font-weight: bold;
  color: #12202e;
  margin: 0.75vw 0;
}
.bodyRegion .txt p {
  font-size: 1vw;
  line-height: 2vw;
  color: #12202e;
}
.bodyRegion .txt.middle {
  width: 48vw !important;
}
.bodyRegion .txt.big {
  width: 55vw !important;
}

.bodyRegion.right {
  justify-content: flex-end;
}
.bodyRegion.right .txt {
  padding-right: 5vw;
}

.bodyRegion.left {
  justify-content: flex-start;
}
.bodyRegion.left .txt {
  padding-left: 5vw;
}

.bodyRegion.top {
  align-items: flex-start;
}
.bodyRegion.top .txt {
  padding-top: 1.5vw;
}

.bodyRegion.bottom {
  align-items: flex-end;
}

.fullBgRegion {
  position: relative;
  width: 100%;
}

.bodyRegion.subStyle .txt h1 {
  width: -moz-max-content;
  width: max-content;
  border-top: solid 1px #bd9452;
  border-bottom: solid 1px #bd9452;
}

.fullRegion .txt .body h1 {
  width: -moz-max-content;
  width: max-content;
  border-top: solid 1px #bd9452;
  border-bottom: solid 1px #bd9452;
}

.introBg1 {
  min-height: 20vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/bg1.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: left;
}

.introBg2 {
  min-height: 53vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p2.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.introBg3 {
  min-height: 47vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p3.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.introBg4 {
  min-height: 20vw;
  background-color: #ecebe7;
  background-image: url(/case_assets/tpone250144/assets/images/sample/bg2.png?v=2501080915);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
}

.introBg5 {
  min-height: 52vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p4.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.introBg6 {
  min-height: 20vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/bg3.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: left;
}

.introBg7 {
  min-height: 53vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p5.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.introBg8 {
  min-height: 53vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p6.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.introBg8 .txt .body h1,
.introBg8 .txt .body p {
  color: #fff !important;
}
.introBg8 .txt .body h1 {
  border: initial;
}

.planRegion2 {
  min-height: 35vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p2_2.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: left;
}
.planRegion2 .txt h1 {
  color: #fff !important;
}
.planRegion2 .txt p {
  color: #fff !important;
}

.planRegion3 {
  min-height: 35vw;
  background-color: #f5f0e9 !important;
}
.planRegion3 .txt .body h1 {
  padding-right: 1.25vw;
}

.planRegion4 {
  background-color: #eaeaea;
}

.planRegion5 {
  background-color: #eaeaea;
}

.teamRegion1 {
  background-color: #f5f0e9 !important;
}
.teamRegion1 .caseStr span {
  font-size: 1.75vw !important;
  font-family: "Noto Serif TC", serif !important;
  font-weight: bold;
  color: #a40202;
}

.teamRegion2 {
  min-height: 69vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p3_2.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.teamRegion2 .txt .body h1,
.teamRegion2 .txt .body p {
  color: #fff !important;
}
.teamRegion2 .txt .body h1 {
  border: initial;
}

.locationRegion2 {
  background-color: #f5f0e9;
}
.locationRegion2 .txt {
  width: 31% !important;
}

.locationRegion3 {
  min-height: 53vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p4_2.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.locationRegion3 .txt .body {
  margin-left: 34vw;
  margin-top: 1vw;
}
.locationRegion3 .txt .body h1,
.locationRegion3 .txt .body p {
  color: #fff !important;
}
.locationRegion3 .txt .body h1 {
  border: initial;
}

.trafficRegion1 {
  background-image: url(/case_assets/tpone250144/assets/images/sample/bg4.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.trafficRegion1 .txt .body h1,
.trafficRegion1 .txt .body p {
  color: #fff !important;
}
.trafficRegion1 .txt .body h1 {
  border: initial;
}

.trafficRegion2 {
  background-color: #f5f0e9;
  justify-content: flex-start !important;
}
.trafficRegion2 .txt {
  width: 35% !important;
}
.trafficRegion2 .img {
  margin-left: 20%;
  margin-right: 5%;
  width: 30% !important;
}

.trafficRegion3 {
  background-color: #fff;
}

.districtRegion1 {
  min-height: 53vw;
  background-image: url(/case_assets/tpone250144/assets/images/sample/p6.jpg?v=2501080915);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.districtRegion1 .txt .body h1,
.districtRegion1 .txt .body p {
  color: #fff !important;
}
.districtRegion1 .txt .body h1 {
  border: initial;
}

.districtRegion2 {
  background-color: #f5f0e9;
}

.districtRegion3 {
  background-color: #fff;
}

/* ------ */
/* ------ */
@media (max-width: 768px) {
  .keyVision .fullBg {
    position: relative;
    width: 100%;
    min-height: 154vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p1.jpg?v=2501080915);
    background-size: cover;
    background-position: center;
  }
  .keyVision .fullBg img {
    width: 100%;
  }
  .keyVision .logo {
    position: absolute;
    width: 77vw;
    height: 31vw;
    max-width: 774px;
    top: 14vw;
    left: 11.5vw;
    z-index: 8;
    background-image: url(/case_assets/tpone250144/assets/images/sample/p1_01.png?v=2501080915);
    background-repeat: no-repeat;
    background-size: contain;
  }
  .keyVision .logo img {
    width: 100%;
  }
  .keyVision .slogan1 {
    position: absolute;
    width: 77vw;
    height: 18vw;
    top: 49vw;
    left: 11.5vw;
    z-index: 8;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p1_02.png?v=2501080915);
    background-repeat: no-repeat;
    background-size: contain;
  }
  .keyVision .slogan1 img {
    width: 100%;
  }
  .keyVision .video {
    width: 100%;
    height: initial;
    padding-bottom: 0%;
    position: relative;
    left: 0;
    z-index: 1;
  }
  .keyVision .video .object {
    position: relative;
    height: 100%;
  }
  .keyVision .video .object video {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -99;
  }
  .fullRegion .txt .body h3 {
    font-family: "Noto Serif TC", serif !important;
    font-size: 4.5vw !important;
    font-weight: bold !important;
    color: #a48747;
  }
  .fullRegion .txt .body h1 {
    font-family: "Noto Serif TC", serif !important;
    font-size: 6.25vw !important;
    font-weight: bold !important;
    color: #12202e;
    margin: 2.75vw 0;
  }
  .fullRegion .txt .body p {
    font-size: 3.75vw !important;
    line-height: 6.5vw !important;
    color: #12202e;
  }
  .treeObject {
    position: absolute;
    left: -20px;
    bottom: -25px;
    z-index: 8;
    width: 75%;
    animation: treeMove 5s infinite alternate-reverse ease-in-out;
  }
  .treeObject img {
    width: 100%;
    max-width: 593px;
  }
  .flexRegion {
    display: flex;
  }
  .blockRegion {
    display: block;
  }
  .btn-more {
    width: 16.5vw;
    height: 6vw;
    margin: 5vw auto 0 !important;
  }
  .bodyRegion {
    position: relative;
    width: 100%;
    padding: 3vw 0;
    overflow: hidden;
    align-items: center;
    display: flex;
  }
  .bodyRegion .txt h3 {
    font-family: "Noto Serif TC", serif !important;
    font-size: 4.5vw;
    font-weight: bold;
    color: #a48747;
  }
  .bodyRegion .txt h1 {
    font-family: "Noto Serif TC", serif !important;
    font-size: 6.25vw;
    font-weight: bold;
    color: #12202e;
    margin: 2.75vw 0;
  }
  .bodyRegion .txt p {
    font-size: 3.75vw;
    line-height: 6.5vw;
    color: #12202e;
  }
  .bodyRegion .txt,
  .bodyRegion .txt.middle,
  .bodyRegion .txt.big {
    width: 80vw !important;
    padding: 7.5vw 0 0 0;
  }
  .bodyRegion.right {
    justify-content: center;
  }
  .bodyRegion.right .txt {
    padding-right: 0;
  }
  .bodyRegion.left {
    justify-content: center;
  }
  .bodyRegion.left .txt {
    padding-left: 0;
  }
  .bodyRegion.top {
    align-items: flex-start;
  }
  .bodyRegion.top .txt {
    padding-top: 7.5vw;
  }
  .bodyRegion.bottom {
    align-items: flex-end;
  }
  .fullBgRegion {
    position: relative;
    width: 100%;
  }
  .introBg1 {
    min-height: 20vw;
    background-color: #dae7f0;
    background-image: none;
  }
  .introBg2 {
    min-height: 130vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p2.jpg?v=2501080915);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .introBg3 {
    min-height: 195vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p3.jpg?v=2501080915);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    background-color: #e9e7e8;
  }
  .introBg4 {
    min-height: 20vw;
    background-color: #035582;
    background-image: none;
  }
  .introBg5 {
    min-height: 132vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p4.jpg?v=2501080915);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .introBg6 {
    min-height: 20vw;
    background-image: none;
    background-color: #132030;
  }
  .introBg7 {
    min-height: 94vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p5.jpg?v=2501080915);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .introBg8 {
    min-height: 170vw;
    background-color: #69a1ee;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p6.jpg?v=2501080915);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
  }
  .introBg8 .txt .body h1,
  .introBg8 .txt .body p {
    color: #fff !important;
  }
  .introBg8 .txt .body h1 {
    border: initial;
  }
  .planRegion1 {
    background-color: #e7e7e7 !important;
  }
  .planRegion1_1 .noteBody {
    position: relative !important;
    width: calc(100% - 6vw);
    left: 0;
    bottom: 0;
    padding: 3vw 3vw 4vw !important;
    background-color: #ffffff !important;
    color: #12202e;
  }
  .planRegion2 {
    flex-direction: column;
    flex-wrap: nowrap;
    min-height: 112vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/bg4.jpg?v=2501080915);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left;
  }
  .planRegion2 .txt h1 {
    color: #fff !important;
  }
  .planRegion2 .txt p {
    color: #fff !important;
  }
  .planRegion2 .firstNote {
    width: calc(100% - 4vw);
    font-size: 2.75vw;
    margin-top: 10vw;
    padding: 2vw;
    color: #fff;
    text-align: left;
  }
  .planRegion2 .noteBody {
    bottom: 20px !important;
  }
  .planRegion2:after {
    content: "";
    width: 100vw;
    height: 77vw;
    background-image: url(/case_assets/tpone250144/assets/images/sample/mob_p2_2.jpg?v=2501080915);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left;
  }
  .planRegion3 {
    min-height: 35vw;
    background-color: #f5f0e9 !important;
  }
  .planRegion3 .txt .body h1 {
    padding-right: 1.25vw;
  }
  .planRegion3 ul {
    display: flex;
    width: 100%;
    flex-direction: column;
  }
  .planRegion3 ul li {
    width: 100%;
    margin-top: 3.5vw;
  }
  .planRegion3 ul li:last-child {
    margin-bottom: 7.5vw;
    font-size: 2.75vw;
    padding: 0 2vw;
    color: #12202e;
  }
  .planRegion4 {
    background-color: #eaeaea;
    padding-bottom: 0 !important;
  }
  .planRegion4 .noteBody {
    position: relative !important;
    width: calc(100% - 6vw);
    left: 0;
    bottom: 0;
    padding: 3vw 3vw 4vw !important;
    background-color: #eaeaea !important;
    color: #12202e;
  }
  .planRegion5 {
    background-color: #eaeaea;
    padding-bottom: 0 !important;
  }
  .planRegion5 .noteBody {
    position: relative !important;
    width: calc(100% - 6vw);
    left: 0;
    bottom: 0;
    padding: 3vw 3vw 4vw !important;
    background-color: #eaeaea !important;
    color: #12202e;
  }
  .teamRegion1 {
    background-color: #f5f0e9 !important;
  }
  .teamRegion1 .caseStr span {
    font-size: 4.95vw !important;
    font-family: "Noto Serif TC", serif !important;
    font-weight: bold;
    color: #a40202;
  }
  .teamRegion1 .img ul {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
  }
  .teamRegion1 .img ul li {
    width: 85%;
    margin: 0 auto 4vw;
    text-align: center;
  }
  .teamRegion1 .img ul li p {
    font-size: 3.75vw;
  }
  .teamRegion2 {
    min-height: 69vw;
    background-color: #ffffff;
    background-image: initial;
  }
  .teamRegion2 .txt .body h1,
  .teamRegion2 .txt .body p {
    color: #12202e !important;
  }
  .teamRegion2 .txt .body h1 {
    border: initial;
  }
  .locationRegion1 {
    background-color: #e7e7e7;
  }
  .locationRegion2 {
    background-color: #f5f0e9;
    padding-bottom: 0 !important;
  }
  .locationRegion2 .txt {
    width: unset !important;
  }
  .locationRegion3 {
    min-height: 53vw;
    background-image: initial;
    background-color: #ffffff;
    padding-top: 10vw !important;
    padding-bottom: 0 !important;
  }
  .locationRegion3 .txt .body {
    margin-left: 34vw;
  }
  .locationRegion3 .txt .body h1,
  .locationRegion3 .txt .body p {
    color: unset !important;
  }
  .locationRegion3 .txt .body h1 {
    border-top: 1px solid #bd9452 !important;
    border-bottom: 1px solid #bd9452 !important;
    margin-bottom: 1vw;
  }
  .trafficRegion1 {
    background-color: #e7e7e7;
    background-image: initial;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
  }
  .trafficRegion1 .txt .body h1,
  .trafficRegion1 .txt .body p {
    color: unset !important;
  }
  .trafficRegion1 .txt .body h1 {
    border-top: 1px solid #bd9452 !important;
    border-bottom: 1px solid #bd9452 !important;
  }
  .trafficRegion2 {
    background-color: #f5f0e9;
    justify-content: flex-start !important;
  }
  .trafficRegion2 .txt {
    width: unset !important;
  }
  .trafficRegion2 .img {
    width: 100% !important;
    margin: initial;
  }
  .trafficRegion2 .img ul {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
  }
  .trafficRegion2 .img ul li {
    width: 85%;
    margin: 0 auto 4vw;
    text-align: center;
  }
  .trafficRegion2 .img ul li p {
    font-size: 3.75vw;
  }
  .trafficRegion3 {
    background-color: #fff;
  }
  .trafficRegion3 .img ul {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
  }
  .trafficRegion3 .img ul li {
    width: 85%;
    margin: 0 auto 4vw;
    text-align: center;
  }
  .trafficRegion3 .img ul li p {
    font-size: 3.75vw;
  }
  .districtRegion1 {
    min-height: 53vw;
    background-image: initial;
    background-color: #e7e7e7;
    padding-bottom: 0 !important;
  }
  .districtRegion1 .txt .body {
    margin-left: 34vw;
  }
  .districtRegion1 .txt .body h1,
  .districtRegion1 .txt .body p {
    color: unset !important;
  }
  .districtRegion1 .txt .body h1 {
    border-top: 1px solid #bd9452 !important;
    border-bottom: 1px solid #bd9452 !important;
    margin-bottom: 1vw;
  }
  .districtRegion2 {
    background-color: #f5f0e9;
    padding-bottom: 0 !important;
  }
  .districtRegion3 {
    background-color: #fff;
  }
  .districtRegion3 .img ul {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
  }
  .districtRegion3 .img ul li {
    width: 85%;
    margin: 0 auto 4vw;
    text-align: center;
  }
  .districtRegion3 .img ul li p {
    font-size: 3.75vw;
  }
}
/* ------ */
@media (min-width: 769px) and (max-width: 860px) {
  .bodyRegion .txt p {
    font-size: 1.2vw;
    line-height: 3vw;
  }
  .fullRegion .txt .body p {
    font-size: 1.2vw !important;
    line-height: 3vw !important;
  }
}
@media (min-width: 861px) and (max-width: 1180px) {
  .bodyRegion .txt p {
    font-size: 1.2vw;
    line-height: 3vw;
  }
  .fullRegion .txt .body p {
    font-size: 1.2vw !important;
    line-height: 3vw !important;
  }
}
@media (min-width: 1181px) and (max-width: 1480px) {
  .bodyRegion .txt p {
    font-size: 1.2vw;
    line-height: 3vw;
  }
  .fullRegion .txt .body p {
    font-size: 1.2vw !important;
    line-height: 3vw !important;
  }
}