@charset "UTF-8";
html,
body {
  padding: 0;
  margin: 0;
}

* {
  font-family: "LXGW WenKai TC", cursive;
  font-weight: 400;
  font-style: normal;
}

body {
  width: 100%;
  display: flex;
  justify-content: center;
}
body > .phoneVersion {
  width: 576px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  min-height: 100svh;
}
body > .phoneVersion > header {
  width: 100%;
  max-width: 576px;
  height: 5vh;
  height: 5dvh;
  height: 5svh;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  position: fixed;
}
body > .phoneVersion > header > div {
  width: 100%;
}
body > .phoneVersion > header > div > a {
  width: 100%;
}
body > .phoneVersion > header > div > a > img {
  display: block;
  margin: 0 auto;
  width: 80%;
}
body > .phoneVersion > .overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  /* 透黑背景 */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}
body > .phoneVersion > .overlay > .message {
  color: white;
  font-size: 1.5rem;
  text-align: center;
  background: rgba(255, 255, 255, 0.1);
  /* 半透明背景 */
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
body > .phoneVersion .hidden {
  visibility: hidden;
}
body > .phoneVersion > .container {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  height: 100svh;
  overflow-x: scroll;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  white-space: nowrap;
  display: flex;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
body > .phoneVersion > .container > .profile {
  scroll-snap-align: start;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  height: 100svh;
  padding-top: 5vh;
  padding-top: 5dvh;
  padding-top: 5svh;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
body > .phoneVersion > .container > .profile.bg1 {
  background-image: url(../../../../../imgs/profilePageBg1.png);
}
body > .phoneVersion > .container > .profile.bg2 {
  background-image: url(../../../../../imgs/profilePageBg2.png);
}
body > .phoneVersion > .container > .profile.bg3 {
  background-image: url(../../../../../imgs/profilePageBg3.png);
}
body > .phoneVersion > .container > .profile .profileheadshot {
  width: 100%;
  height: 73vh;
  height: 73dvh;
  height: 73svh;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container {
  width: 100%;
  height: 73vh;
  height: 73dvh;
  height: 73svh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait {
  width: 90%;
  aspect-ratio: 3/4;
  overflow: hidden;
  margin: 0 auto;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel {
  width: 100%;
  height: 100%;
  perspective: 1200px;
  perspective-origin: center center;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 5px 5px 15px 1px rgba(0, 0, 0, 0.3);
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
  opacity: 1;
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  /* 向前翻頁動畫 */
  /* 向後翻頁動畫 */
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 20px;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-next:not(.carousel-item-start) {
  transform: perspective(1200px) rotateY(-90deg) translateZ(-50px);
  transform-origin: left center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-next.carousel-item-start {
  transform: perspective(1200px) rotateY(0deg) translateZ(0px);
  transform-origin: left center;
  opacity: 1;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active.carousel-item-start {
  transform: perspective(1200px) rotateY(90deg) translateZ(-50px);
  transform-origin: left center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-prev:not(.carousel-item-end) {
  transform: perspective(1200px) rotateY(90deg) translateZ(-50px);
  transform-origin: right center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-prev.carousel-item-end {
  transform: perspective(1200px) rotateY(0deg) translateZ(0px);
  transform-origin: right center;
  opacity: 1;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active {
  /* 活動項目樣式 */
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active.carousel-item-end {
  transform: perspective(1200px) rotateY(-90deg) translateZ(-50px);
  transform-origin: right center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active:not(.carousel-item-start):not(.carousel-item-end) {
  transform: perspective(1200px) rotateY(0deg) translateZ(0px);
  opacity: 1;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-control-prev,
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel .carousel-control-next {
  width: 40px;
  height: 40px;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  transition: all 0.3s ease;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-control-prev:hover,
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel .carousel-control-next:hover {
  background: rgba(255, 255, 255, 0.4);
  border-color: rgba(255, 255, 255, 0.6);
  transform: translateY(-50%) scale(1.1);
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-control-prev > .carousel-control-prev-icon {
  background-image: url("../../../../../imgs/arrowLeft.png");
  width: 24px;
  height: 24px;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-portrait > #headshot-carousel > .carousel-control-next > .carousel-control-next-icon {
  background-image: url("../../../../../imgs/arrowRight.png");
  width: 24px;
  height: 24px;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape {
  width: 432px;
  height: 243px;
  margin: 0 auto;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel {
  width: 100%;
  height: 100%;
  perspective: 1200px;
  perspective-origin: center center;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 5px 5px 15px 1px rgba(0, 0, 0, 0.3);
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
  opacity: 1;
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  /* 向前翻頁動畫 */
  /* 向後翻頁動畫 */
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 20px;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-next:not(.carousel-item-start) {
  transform: perspective(1200px) rotateY(-90deg) translateZ(-50px);
  transform-origin: left center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-next.carousel-item-start {
  transform: perspective(1200px) rotateY(0deg) translateZ(0px);
  transform-origin: left center;
  opacity: 1;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active.carousel-item-start {
  transform: perspective(1200px) rotateY(90deg) translateZ(-50px);
  transform-origin: left center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-prev:not(.carousel-item-end) {
  transform: perspective(1200px) rotateY(90deg) translateZ(-50px);
  transform-origin: right center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-prev.carousel-item-end {
  transform: perspective(1200px) rotateY(0deg) translateZ(0px);
  transform-origin: right center;
  opacity: 1;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active {
  /* 活動項目樣式 */
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active.carousel-item-end {
  transform: perspective(1200px) rotateY(-90deg) translateZ(-50px);
  transform-origin: right center;
  opacity: 0;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-inner > .carousel-item.carousel-item-active:not(.carousel-item-start):not(.carousel-item-end) {
  transform: perspective(1200px) rotateY(0deg) translateZ(0px);
  opacity: 1;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-control-prev,
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel .carousel-control-next {
  width: 40px;
  height: 40px;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  transition: all 0.3s ease;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-control-prev:hover,
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel .carousel-control-next:hover {
  background: rgba(255, 255, 255, 0.4);
  border-color: rgba(255, 255, 255, 0.6);
  transform: translateY(-50%) scale(1.1);
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-control-prev > .carousel-control-prev-icon {
  background-image: url("../../../../../imgs/arrowLeft.png");
  width: 24px;
  height: 24px;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-control-next > .carousel-control-next-icon {
  background-image: url("../../../../../imgs/arrowRight.png");
  width: 24px;
  height: 24px;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > #cardCarousel {
  width: 432px;
  border-radius: 20px;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > #cardCarousel > .carousel-inner {
  width: 100%;
  height: 100%;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > #cardCarousel > .carousel-inner > .carousel-item {
  width: 100%;
  height: 100%;
}
body > .phoneVersion > .container > .profile .profileheadshot > .profileheadshot-carousel_container > #cardCarousel > .carousel-inner > .carousel-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 20px;
}
body > .phoneVersion > .container > .profile > .profileInfo {
  width: 100%;
  max-width: 576px;
  height: 22svh;
  display: flex;
  flex-direction: column;
  background-image: url("../img/aboutUsInfoBg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop {
  z-index: 2;
  width: 100%;
  white-space: normal;
  display: flex;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .name {
  width: 80%;
  text-align: left;
  display: flex;
  align-items: center;
  font-size: 17pt;
  font-weight: 600;
  padding-left: 1rem;
  color: #fefefe;
  white-space: normal;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .profileInfoCounter {
  width: 20%;
  padding-right: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .profileInfoCounter > .profileInfoCounterData {
  width: 100%;
  font-size: 9pt;
  font-weight: 700;
  color: white;
  background-color: black;
  border-radius: 10px;
  text-align: center;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom {
  display: flex;
  z-index: 2;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData {
  width: 80%;
  padding-left: 1rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .jobtitle {
  text-align: left;
  font-size: 11pt;
  color: #fefefe;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .company {
  text-align: left;
  font-size: 11pt;
  color: #fefefe;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .phoneLink {
  text-align: left;
  font-size: 11pt;
  text-decoration: none;
  color: #fefefe;
  display: flex;
  justify-content: flex-start;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .phoneLink > i {
  color: #ffd700;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .addressLink {
  text-align: left;
  font-size: 11pt;
  text-decoration: none;
  color: #fefefe;
  display: flex;
  justify-content: flex-start;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .addressLink > i {
  color: #ffd700;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .emailLink {
  text-align: left;
  font-size: 11pt;
  text-decoration: none;
  color: #fefefe;
  display: flex;
  justify-content: flex-start;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .emailLink > i {
  color: #ffd700;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoBtn {
  width: 20%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-right: 1rem;
  gap: 5px;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoBtn > .hideBtn {
  width: 100%;
  height: 22px;
  text-decoration: none;
  background: linear-gradient(to top right, #f5a711, #f9640b);
  border-radius: 10px;
  color: #fefefe;
  text-align: center;
  font-size: 10pt;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoBtn > .hideBtn > img {
  width: 100%;
  height: 100%;
}
body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoCounter {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 9pt;
  font-weight: 700;
  color: white;
  background-color: black;
}
body > .phoneVersion > .container > .profile > .next-page {
  font-size: 11pt;
  writing-mode: vertical-rl;
  position: absolute;
  top: 42%;
  transform: translateY(-50%);
  right: 0;
  background-color: #fefefe;
}
body > .phoneVersion > .container > .profile > .next-page > img {
  width: 16px;
}
body > .phoneVersion > .container > .moreInfoBtn {
  flex: 0 0 auto;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  height: 100svh;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
body > .phoneVersion > .container > .moreInfoBtn.bg1 {
  background-image: url(../../../../../imgs/moreInfoBg1.png);
}
body > .phoneVersion > .container > .moreInfoBtn.bg2 {
  background-image: url(../../../../../imgs/moreInfoBg2.png);
}
body > .phoneVersion > .container > .moreInfoBtn.bg3 {
  background-image: url(../../../../../imgs/moreInfoBg3.png);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container {
  position: relative;
  width: 240px;
  height: 230px;
  margin-top: 8svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hexagon {
  position: absolute;
  width: 80px;
  height: 87px;
  background: linear-gradient(to top right, #f5a711, #f9640b);
  -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
          clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
  border: none;
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hexagon:hover {
  background-color: #4682b4;
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hexagon > a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: black;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hexagon > a > div {
  font-size: 16px;
  font-weight: 600;
  color: black;
  text-align: center;
  height: 100%;
  display: flex;
  align-items: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-left {
  top: 50%;
  left: 15%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-right {
  top: 50%;
  left: 85%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-top-left0 {
  top: 20%;
  left: -4%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-top-left1 {
  top: 20%;
  left: 32%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-top-right0 {
  top: 20%;
  left: 68%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-top-right1 {
  top: 20%;
  left: 104%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-bottom-left0 {
  top: 80%;
  left: -4%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-bottom-left1 {
  top: 80%;
  left: 32%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-bottom-right0 {
  top: 80%;
  left: 68%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .hexagon-container > .hex-bottom-right1 {
  top: 80%;
  left: 104%;
  transform: translate(-50%, -50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn {
  width: 100%;
  height: 40vh;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .tab-pane.active {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active {
  flex-wrap: wrap;
  gap: 10%;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .companyLink,
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active .shopLink,
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active .communityLink {
  width: 40%;
  margin-bottom: 0.5rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .companyLink > img,
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active .shopLink > img,
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active .communityLink > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .relatedLink {
  width: 40%;
  margin-bottom: 0.5rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .relatedLink > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .relatedLink > .relatedLinkName {
  font-size: 10pt;
  color: white;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .otherLink {
  width: 40%;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .otherLink > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .otherRelationLink {
  width: 40%;
  margin-top: 0.5rem;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  background: linear-gradient(to top right, #f5a711, #f9640b);
  border: none;
  border-radius: 80px;
  padding: 0.5rem 0.3rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .otherRelationLink > .otherRelationLinkName {
  font-size: 12pt;
  color: white;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > h2 {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .otherCompanyLinkhref {
  width: 40%;
  margin-bottom: 0.5rem;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  background: linear-gradient(to top right, #f5a711, #f9640b);
  border: none;
  border-radius: 80px;
  padding: 0.5rem 0.3rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .changeContentBtn > .link.active > .otherCompanyLinkhref > .otherCompanyLinkName {
  font-size: 12pt;
  color: white;
}
body > .phoneVersion > .container > .moreInfoBtn > .modal > .modal-dialog > .modal-content {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
body > .phoneVersion > .container > .moreInfoBtn > .modal > .modal-dialog > .modal-content.bg1 {
  background-image: url(../../../../../imgs/moreInfoBg1.png);
}
body > .phoneVersion > .container > .moreInfoBtn > .modal > .modal-dialog > .modal-content.bg2 {
  background-image: url(../../../../../imgs/moreInfoBg2.png);
}
body > .phoneVersion > .container > .moreInfoBtn > .modal > .modal-dialog > .modal-content.bg3 {
  background-image: url(../../../../../imgs/moreInfoBg3.png);
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal {
  height: 100%;
  min-height: 100svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content {
  height: 100%;
  min-height: 100svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-body {
  height: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-body > .qrCode {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-body > .qrCode > .qrCodePic {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-body > .qrCode > .qrCodePic > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-body > .qrCode > .qrCodePic > a {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .qrCodeModal > .modal-dialog > .modal-content > .modal-body > .qrCode > .qrCodePic > a > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal {
  height: 100%;
  min-height: 100svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content {
  height: 100%;
  min-height: 100svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media {
  width: 100%;
  flex: 1;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > .mediaTitle {
  font-size: 16pt;
  text-align: center;
  font-weight: 600;
  margin-bottom: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > #mediaVideoCarousel {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > #mediaVideoCarousel > .carousel-inner {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > #mediaVideoCarousel > .carousel-inner > .carouselIframe {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > #mediaVideoCarousel > .carousel-inner > .carouselIframe > iframe {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > #mediaVideoCarousel > .carousel-control-prev {
  top: 50%;
  transform: translateY(-50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > #mediaVideoCarousel > .carousel-control-next {
  top: 50%;
  transform: translateY(-50%);
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > .mediaVideoMore {
  width: -moz-fit-content;
  width: fit-content;
  color: #4160ff;
  font-weight: 600;
  text-decoration: none;
  font-size: 12pt;
  display: block;
  margin: 0 auto;
  padding-bottom: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaVideo > .mediaVideoNone {
  text-align: center;
  margin-bottom: 2rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg > .mediaTitle {
  font-size: 16pt;
  text-align: center;
  font-weight: 600;
  margin-bottom: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg > #mediaImgCarousel > .carousel-inner {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg > #mediaImgCarousel > .carousel-inner > .carouselImg {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg > #mediaImgCarousel > .carousel-inner > .carouselImg > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg > .mediaImgMore {
  width: -moz-fit-content;
  width: fit-content;
  color: #4160ff;
  font-weight: 600;
  text-decoration: none;
  font-size: 12pt;
  display: block;
  margin: 0 auto;
  padding-bottom: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .mediaImgModal > .modal-dialog > .modal-content > .modal-body > .media > .mediaImg > .mediaImgNone {
  text-align: center;
  margin-bottom: 2rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal {
  height: 100%;
  min-height: 100svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content {
  height: 100%;
  min-height: 100svh;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body {
  height: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe {
  width: 100%;
  flex: 1;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe > .cardCarousel {
  width: 100%;
  display: flex;
  justify-content: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe > .cardCarousel > #carouselExample {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe > .cardCarousel > #carouselExample > .carousel-inner {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe > .aboutMeNone {
  text-align: center;
  margin-bottom: 2rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-introduction {
  width: 100%;
  text-align: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-introduction > .about-us-introduction-title {
  font-weight: bold;
  font-size: 18pt;
  white-space: normal;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-introduction > .about-us-introduction-text {
  font-size: 12pt;
  width: 100%;
  white-space: normal;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-introduction > .about-us-introduction-img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-introduction > .about-us-introduction-img > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-service {
  width: 100%;
  text-align: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-service > .about-us-service-title {
  font-weight: bold;
  font-size: 18pt;
  margin-bottom: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-service > .about-us-service-items {
  width: 100%;
  font-size: 14pt;
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding-left: 0;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-service > .about-us-service-items > .about-us-service-item {
  width: 50%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-service > .about-us-service-img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .aboutMeModal > .modal-dialog > .modal-content > .modal-body > .aboutMe .introService > .about-us-service > .about-us-service-img > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .buyCardBtnModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .buyCardBtnModal > .modal-dialog > .modal-content > .modal-body {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .buyCardBtnModal > .modal-dialog > .modal-content > .modal-body > .buyCard {
  width: 100%;
  height: 500px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
body > .phoneVersion > .container > .moreInfoBtn > .buyCardBtnModal > .modal-dialog > .modal-content > .modal-body > .buyCard > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .buyCardBtnModal > .modal-dialog > .modal-content > .modal-footer > .buyCardLinkBtn {
  background: linear-gradient(to top right, #f5a711, #f9640b);
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-body {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-body > .card-container {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-body > .card-container > .counterCard {
  background-color: #fff8dc;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  padding-top: 1rem;
  text-align: center;
  width: 125px; /* 可依需求調整 */
  transition: transform 0.2s;
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-body > .card-container > .counterCard:hover {
  transform: scale(1.05);
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-body > .card-container > .counterCard > div {
  margin-bottom: 0.5rem;
  color: #0066cc; /* 企業主色 */
}
body > .phoneVersion > .container > .moreInfoBtn > .allCounterModal > .modal-dialog > .modal-content > .modal-body > .card-container > .counterCard > p {
  font-size: 1.5rem;
  font-weight: bold;
  color: #333;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body > .activityCatalog {
  width: 100%;
  background-color: #fefefe;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body > .activityCatalog > .activityEvent {
  width: 100%;
  border: 1px solid black;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body > .activityCatalog > .activityEvent > .activityImg {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body > .activityCatalog > .activityEvent > .activityImg > img {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body > .activityCatalog > .activityEvent .activityTitle {
  font-size: 14pt;
  font-weight: 600;
  margin: 1rem 0;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityCatalogModal > .modal-dialog > .modal-content > .modal-body > .activityCatalog > .activityEvent .activityContent {
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 顯示 3 行 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* 若想讓多行省略尾端顯示 ...，可再加上： */
  white-space: normal;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityEventModal > .modal-dialog > .modal-content > .modal-header > .modal-title {
  font-size: 16pt;
  font-weight: 600;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityEventModal > .modal-dialog > .modal-content > .modal-body {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityEventModal > .modal-dialog > .modal-content > .modal-body > .activity {
  width: 100%;
  background-color: #fefefe;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityEventModal > .modal-dialog > .modal-content > .modal-body > .activity > .download {
  width: 100%;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityEventModal > .modal-dialog > .modal-content > .modal-body > .activity > .download > .title {
  font-size: 14pt;
  font-weight: 600;
  margin-bottom: 1rem;
}
body > .phoneVersion > .container > .moreInfoBtn > .activityEventModal > .modal-dialog > .modal-content > .modal-body > .activity > .download > .downloadhref {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
body > .phoneVersion > .container > .moreInfoBtn > footer {
  width: 100%;
  background-color: black;
  color: white;
  display: flex;
  justify-content: space-around;
  align-items: center;
  white-space: normal;
  padding: 1rem 0;
}
body > .phoneVersion > .container > .moreInfoBtn > footer > .copyright {
  width: 65%;
  font-size: 12pt;
}
body > .phoneVersion > .container > .moreInfoBtn > footer > .copyright > a {
  color: #7ed0ff;
  text-decoration: none;
}
body > .phoneVersion > .container > .moreInfoBtn > footer > .buyCardBtn {
  width: 35%;
  text-align: center;
  border-radius: 10px;
  padding: 0.1rem 0;
  background: linear-gradient(to top right, #f5a711, #f9640b);
  text-decoration: none;
  display: flex;
  align-items: center;
  cursor: pointer;
}
body > .phoneVersion > .container > .moreInfoBtn > footer > .buyCardBtn > .empty {
  width: 10%;
  font-size: 14pt;
  font-weight: 600;
  color: black;
}
body > .phoneVersion > .container > .moreInfoBtn > footer > .buyCardBtn > .buyCardBtnText {
  width: 80%;
  font-size: 12pt;
  font-weight: 600;
  color: black;
}
body > .phoneVersion > .container > .moreInfoBtn > .previous-page {
  font-size: 11pt;
  writing-mode: vertical-rl;
  position: absolute;
  top: 42%;
  transform: translateY(-50%);
  left: 0;
  background-color: #fefefe;
}
body > .phoneVersion > .container > .moreInfoBtn > .previous-page > img {
  width: 16px;
}
body > .phoneVersion > .aboutMe {
  width: 100%;
  padding-top: 8svh;
  flex: 1;
}
body > .phoneVersion > .aboutMe > .cardCarousel {
  width: 100%;
  display: flex;
  justify-content: center;
}
body > .phoneVersion > .aboutMe > .cardCarousel > #carouselExample {
  width: 100%;
}
body > .phoneVersion > .aboutMe > .cardCarousel > #carouselExample > .carousel-inner {
  width: 100%;
}
body > .phoneVersion > .aboutMe > .aboutMeNone {
  text-align: center;
  margin-bottom: 2rem;
}
body > .phoneVersion > .aboutMe .introService > .about-us-introduction {
  width: 100%;
  text-align: center;
}
body > .phoneVersion > .aboutMe .introService > .about-us-introduction > .about-us-introduction-title {
  font-weight: bold;
  font-size: 18pt;
}
body > .phoneVersion > .aboutMe .introService > .about-us-introduction > .about-us-introduction-text {
  font-size: 12pt;
}
body > .phoneVersion > .aboutMe .introService > .about-us-introduction > .about-us-introduction-img {
  width: 100%;
}
body > .phoneVersion > .aboutMe .introService > .about-us-introduction > .about-us-introduction-img > img {
  width: 100%;
}
body > .phoneVersion > .aboutMe .introService > .about-us-service {
  width: 100%;
  text-align: center;
}
body > .phoneVersion > .aboutMe .introService > .about-us-service > .about-us-service-title {
  font-weight: bold;
  font-size: 18pt;
  margin-bottom: 1rem;
}
body > .phoneVersion > .aboutMe .introService > .about-us-service > .about-us-service-items {
  width: 100%;
  font-size: 14pt;
  display: flex;
  flex-wrap: wrap;
}
body > .phoneVersion > .aboutMe .introService > .about-us-service > .about-us-service-items > .about-us-service-item {
  width: 50%;
}
body > .phoneVersion > .aboutMe .introService > .about-us-service > .about-us-service-img {
  width: 100%;
}
body > .phoneVersion > .aboutMe .introService > .about-us-service > .about-us-service-img > img {
  width: 100%;
}
body > .phoneVersion > .media {
  width: 100%;
  padding-top: 8svh;
  flex: 1;
}
body > .phoneVersion > .media > .mediaVideo {
  width: 100%;
}
body > .phoneVersion > .media > .mediaVideo > .mediaTitle {
  font-size: 16pt;
  text-align: center;
  font-weight: 600;
  margin-bottom: 1rem;
}
body > .phoneVersion > .media > .mediaVideo > #mediaVideoCarousel {
  width: 100%;
}
body > .phoneVersion > .media > .mediaVideo > #mediaVideoCarousel > .carousel-inner {
  width: 100%;
}
body > .phoneVersion > .media > .mediaVideo > #mediaVideoCarousel > .carousel-inner > .carouselIframe {
  width: 100%;
}
body > .phoneVersion > .media > .mediaVideo > #mediaVideoCarousel > .carousel-inner > .carouselIframe > iframe {
  width: 100%;
}
body > .phoneVersion > .media > .mediaVideo > #mediaVideoCarousel > .carousel-control-prev {
  top: 50%;
  transform: translateY(-50%);
}
body > .phoneVersion > .media > .mediaVideo > #mediaVideoCarousel > .carousel-control-next {
  top: 50%;
  transform: translateY(-50%);
}
body > .phoneVersion > .media > .mediaVideo > .mediaVideoMore {
  width: -moz-fit-content;
  width: fit-content;
  color: #4160ff;
  font-weight: 600;
  text-decoration: none;
  font-size: 12pt;
  display: block;
  margin: 0 auto;
  padding-bottom: 1rem;
}
body > .phoneVersion > .media > .mediaVideo > .mediaVideoNone {
  text-align: center;
  margin-bottom: 2rem;
}
body > .phoneVersion > .media > .mediaImg {
  width: 100%;
}
body > .phoneVersion > .media > .mediaImg > .mediaTitle {
  font-size: 16pt;
  text-align: center;
  font-weight: 600;
  margin-bottom: 1rem;
}
body > .phoneVersion > .media > .mediaImg > .mediaImgMore {
  width: -moz-fit-content;
  width: fit-content;
  color: #4160ff;
  font-weight: 600;
  text-decoration: none;
  font-size: 12pt;
  display: block;
  margin: 0 auto;
  padding-bottom: 1rem;
}
body > .phoneVersion > .media > .mediaImg > .mediaImgNone {
  text-align: center;
  margin-bottom: 2rem;
}

.container,
.container-sm {
  max-width: 100% !important;
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  --bs-gutter-x: 0 !important;
}

@keyframes arrowLeftFloat {
  0% {
    left: 15px;
  }
  50% {
    left: 5px;
  }
  100% {
    left: 15px;
  }
}
@keyframes arrowRightFloat {
  0% {
    right: 15px;
  }
  50% {
    right: 5px;
  }
  100% {
    right: 15px;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* (約 576px) 時 */
@media (max-width: 36rem) {
  body > .phone-version > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-control-prev > .carousel-control-prev-icon {
    width: 16px;
    height: 16px;
  }
  body > .phone-version > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape > #headshot-carousel > .carousel-control-next > .carousel-control-next-icon {
    width: 16px;
    height: 16px;
  }
}
/*  (約 480px) 時 */
@media (max-width: 30rem) {
  body > .phoneVersion > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape {
    width: 400px;
    height: 225px;
    margin: 0 auto;
  }
  body > .phoneVersion > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > #cardCarousel {
    width: 400px;
  }
  body > .phoneVersion > .container > .profile > .profileInfo {
    height: 24svh;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .name {
    font-size: 16pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .jobtitle {
    font-size: 13pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .company {
    font-size: 13pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .phoneLink {
    font-size: 13pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .addressLink {
    font-size: 13pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .emailLink {
    font-size: 13pt;
  }
}
/* (約 414px) 時 */
@media (max-width: 25.875rem) {
  body > .phoneVersion > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape {
    width: 368px;
    height: 207px;
    margin: 0 auto;
  }
  body > .phoneVersion > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > #cardCarousel {
    width: 368px;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .name {
    font-size: 15pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .jobtitle {
    font-size: 12pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .company {
    font-size: 12pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .phoneLink {
    font-size: 12pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .addressLink {
    font-size: 12pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .emailLink {
    font-size: 12pt;
  }
}
/* (約 376px) 時 */
@media (max-width: 23.5rem) {
  body > .phoneVersion > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > .profileheadshot-carousel-landscape {
    width: 320px;
    height: 180px;
    margin: 0 auto;
  }
  body > .phoneVersion > .container > .profile > .profileheadshot > .profileheadshot-carousel_container > #cardCarousel {
    width: 320px;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .name {
    font-size: 14pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .jobtitle {
    font-size: 11pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .company {
    font-size: 11pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .phoneLink {
    font-size: 11pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .addressLink {
    font-size: 11pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .emailLink {
    font-size: 11pt;
  }
}
/*  (約 320px) 時 */
@media (max-width: 20rem) {
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoTop > .name {
    font-size: 12pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .jobtitle {
    font-size: 10pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .company {
    font-size: 10pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .phoneLink {
    font-size: 10pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .addressLink {
    font-size: 10pt;
  }
  body > .phoneVersion > .container > .profile > .profileInfo > .profileInfoBottom > .profileInfoData > .emailLink {
    font-size: 10pt;
  }
}/*# sourceMappingURL=style.css.map */