:root {
  --primary-color: hsl(355.06deg 100% 45.29%); /* 主要颜色 */
  --secondary-color: #3357c9; /* 次要颜色 */
  --accent-color: #fe0100; /* 强调颜色 */
}
html{
  font-family: "Noto Sans TC" !important;
}
.text-primary {
  color: var(--primary-color);
}
.bg-primary {
  background-color: var(--primary-color);
}
.border-primary {
  border-color: var(--primary-color);
}

.bg-secondary {
  background-color: var(--secondary-color);
}

.bg-accent {
  background-color: var(--accent-color);
}

.right-82 {
 right: 21rem;
}

.h-30r {
  height: 30rem;
}

.div-w1200{
  max-width: 1200px;
  margin: 0 auto  
}

#third_circle_text{
  right: -1rem;
  top: -3rem;
  min-width: 100rem;
  position: absolute;
}

#third_circle_1{
  z-index: 2;
  right: 0px;
  top: 134px;
  width: 480px;
  position: absolute;
}

#third_circle_2{
  z-index: 3;
  right: 0px;
  top: 406px;
  width: 763px;
  position: absolute;
}

#third_circle_3{
  z-index: 2;
  right: 0px;
  top: 680px;
  width: 763px;
  position: absolute;
}

#img_second_01,#img_second_03{
  position: relative;
  left: -150px;
}

#img_second_02,#img_second_04 {
  position: relative;
  right: -150px;
}

.div_fourth_01,.div_fourth_02{
  display: none;
  position: relative;
  top: -150px;
}

#img_ninth_01 {
  right: 0px;
  position: absolute;
}

#divPhone img:hover{
  width: 50px;
}

.HamburgerMenu {
  position: absolute;
  right: 2vw;
  top: 2.8vw;
  display: inline-block;
  z-index: 100;
  cursor: pointer;
}

.strip1,
.strip2,
.strip3 {
  width: 5vw;
  height: 0.5vw;
  background: #fff;
  margin: 1.4vw;
  transition: .4s;
}

.active .strip1 {
  transform: rotate(-45deg) translate(-1.4vw, 1.3vw);
}

.active .strip2 {
  opacity: 0;
}

.active .strip3 {
  transform: rotate(45deg) translate(-1.4vw, -1.3vw);
}