#item_0 {
  left: 50vw;
  top: 2vw;
}

@media (min-width: 1200px) {
  #item_0 {
    left: 580px;
    top: 120px;
  }
}

#item_1 {
  left: 19vw;
  top: 20vw;
  width: 18vw;
}

@media (min-width: 1200px) {
  #item_1 {
    left: 78px;
    top: 160px;
    width: 180px;
  }
}

#item_2 {
  left: 56vw;
  top: 20vw;
  width: 20vw;
}

@media (min-width: 1200px) {
  #item_2 {
    left: 960px;
    top: 180px;
    width: 180px;
  }
}

#item_3 {
  left: 0vw;
  top: 20vw;
  width: 18vw;
}

@media (min-width: 1200px) {
  #item_3 {
    left: 80px;
    top: 295px;
    width: 180px;
  }
}

#item_4 {
  left: 33vw;
  top: 108vw;
  width: 18vw;
}

@media (min-width: 1200px) {
  #item_4 {
    left: 400px;
    top: 814px;
    width: 180px;
  }
}

#item_5 {
  left: 77vw;
  top: 20vw;
  width: 20vw;
}

@media (min-width: 1200px) {
  #item_5 {
    left: 960px;
    top: 310px;
    width: 180px;
  }
}

#item_6 {
  left: 1vw;
  width: 20vw;
  top: 108vw;
}

@media (min-width: 1200px) {
  #item_6 {
    left: 70px;
    top: 752px;
    width: 180px;
  }
}

#item_7 {
  left: 79vw;
  top: 90vw;
  width: 20vw;
}

@media (min-width: 1200px) {
  #item_7 {
    left: 960px;
    top: 610px;
    width: 180px;
  }
}

#item_8 {
  left: 1vw;
  top: 90vw;
  width: 20vw;
}

@media (min-width: 1200px) {
  #item_8 {
    left: 70px;
    top: 602px;
    width: 180px;
  }
}

#item_9 {
  left: 62vw;
  top: 108vw;
}

@media (min-width: 1200px) {
  #item_9 {
    left: 960px;
    top: 762px;
  }
}

#item_10 {
  left: 22vw;
  top: 2vw;
}

@media (min-width: 1200px) {
  #item_10 {
    left: 360px;
    top: 110px;
  }
}

#line_0 {
  top: 58vw;
  left: 31vw;
  width: 0;
  transform: rotate(-90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_0 {
    top: 400px;
    left: 380px;
    width: 0;
    transform: rotate(-90deg);
    transform-origin: left;
  }
}

#line_1 {
  top: 210px;
  right: 820px;
  width: 0;
}

@media (min-width: 1200px) {
  #line_1 {
    top: 235px;
    right: 820px;
    width: 0;
  }
}

#line_2 {
  top: 55vw;
  left: 38vw;
  width: 0;
  transform: rotate(-90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_2 {
    top: 360px;
    left: 450px;
    width: 0;
    transform: rotate(-90deg);
    transform-origin: left;
  }
}

#line_3 {
  top: 53vw;
  left: 55vw;
  width: 0;
  transform: rotate(-90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_3 {
    top: 320px;
    left: 680px;
    width: 0;
    transform: rotate(-90deg);
    transform-origin: left;
  }
}

#line_4 {
  top: 55vw;
  left: 63vw;
  width: 0;
  transform: rotate(-90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_4 {
    top: 330px;
    left: 745px;
    width: 0;
    transform: rotate(-90deg);
    transform-origin: left;
  }
}

#line_5 {
  top: 80px;
  left: 745px;
  width: 0;
  display: none;
}

@media (min-width: 1200px) {
  #line_5 {
    top: 260px;
    left: 745px;
    width: 0;
    display: block;
  }
}

#line_6 {
  top: 61vw;
  left: 75vw;
  width: 0;
}

@media (min-width: 1200px) {
  #line_6 {
    top: 370px;
    left: 870px;
    width: 0;
  }
}

#line_7 {
  top: 65vw;
  left: 75vw;
  width: 0;
}

@media (min-width: 1200px) {
  #line_7 {
    top: 440px;
    left: 870px;
    width: 0;
  }
}

#line_8 {
  top: 65vw;
  left: 90vw;
  width: 0;
  transform: rotate(90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_8 {
    top: 440px;
    left: 1045px;
    width: 0;
    transform: rotate(90deg);
    transform-origin: left;
  }
}

#line_9 {
  top: 70vw;
  left: 52vw;
  width: 0px;
  transform: rotate(90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_9 {
    top: 510px;
    left: 610px;
    width: 0px;
    transform: rotate(90deg);
    transform-origin: left;
  }
}

#line_10 {
  top: 115vw;
  left: 52vw;
  width: 0;
}

@media (min-width: 1200px) {
  #line_10 {
    top: 830px;
    left: 610px;
    width: 0;
  }
}

#line_11 {
  top: 85vw;
  left: 40vw;
  width: 0;
  transform: rotate(90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_11 {
    top: 670px;
    left: 520px;
    width: 0;
    transform: rotate(90deg);
    transform-origin: left;
  }
}

#line_12 {
  top: 80vw;
  left: 32vw;
  width: 0;
  transform: rotate(90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_12 {
    top: 620px;
    left: 390px;
    width: 0;
    transform: rotate(90deg);
    transform-origin: left;
  }
}

#line_13 {
  top: 115vw;
  right: 68vw;
  width: 0;
}

@media (min-width: 1200px) {
  #line_13 {
    top: 810px;
    right: 809px;
    width: 0;
  }
}

#line_14 {
  top: 76vw;
  right: 80vw;
  width: 0;
  transform: rotate(-90deg);
  transform-origin: right;
}

@media (min-width: 1200px) {
  #line_14 {
    top: 560px;
    right: 960px;
    width: 0;
    transform: none;
  }
}

#line_15 {
  top: 380px;
  left: 120px;
  width: 0;
  transform: rotate(90deg);
  transform-origin: left;
  display: none;
}

@media (min-width: 1200px) {
  #line_15 {
    top: 560px;
    left: 120px;
    width: 0;
    transform: rotate(90deg);
    transform-origin: left;
    display: block;
  }
}

#line_16 {
  top: 68vw;
  right: 81vw;
  width: 0;
}

@media (min-width: 1200px) {
  #line_16 {
    top: 500px;
    right: 960px;
    width: 0;
  }
}

#line_17 {
  top: 68vw;
  left: 9vw;
  width: 0;
  transform: rotate(-90deg);
  transform-origin: left;
}

@media (min-width: 1200px) {
  #line_17 {
    top: 500px;
    left: 180px;
    width: 0;
    transform: rotate(-90deg);
    transform-origin: left;
  }
}

#app {
  padding-bottom: 35vw;
  overflow-y: hidden;
  padding-top: 40vw;
  margin-bottom: 30px;
}

@media (min-width: 1200px) {
  #app {
    padding-top: 180px;
  }
}

@media (min-width: 1200px) {
  #item_1:hover .hide_it {
    display: block;
  }
}

@media (min-width: 1200px) {
  #item_9:hover .hide_it {
    display: block;
  }
}

@media (min-width: 768px) {
  .txt_title.animate__animated.animate__fadeInDown {
    text-shadow: 0px 0px 8px #000000;
  }
}

.line_hang_ye_ying_yong.slow {
  transition: width 0.6s linear;
  -moz-transition: width 0.6s linear;
  -webkit-transition: width 0.6s linear;
  -o-transition: width .6s linear;
}

#point-0 {
  top: calc(16vw - 5px);
  left: calc(55vw - 5px);
}

@media (min-width: 1200px) {
  #point-0 {
    top: 215px;
    left: 675px;
  }
}

#point-1 {
  top: calc(16vw - 5px);
  left: calc(38vw - 5px);
}

@media (min-width: 1200px) {
  #point-1 {
    top: 205px;
    left: 445px;
  }
}

#point-2 {
  top: calc(34vw - 5px);
  left: calc(31vw - 5px);
}

@media (min-width: 1200px) {
  #point-2 {
    top: 230px;
    left: 252px;
  }
}

#point-5 {
  left: calc(90vw - 5px);
  top: calc(34vw - 5px);
}

@media (min-width: 1200px) {
  #point-5 {
    left: 955px;
    top: 365px;
  }
}

#point-6 {
  left: calc(20vw - 5px);
  top: calc(92vw - 5px);
}

@media (min-width: 1200px) {
  #point-6 {
    left: 115px;
    top: 614px;
  }
}

#point-7 {
  left: calc(90vw - 5px);
  top: calc(92vw - 5px);
}

@media (min-width: 1200px) {
  #point-7 {
    left: 1040px;
    top: 622px;
  }
}

#point-8 {
  left: calc(21vw - 5px);
  top: calc(115vw - 5px);
}

@media (min-width: 1200px) {
  #point-8 {
    left: 243px;
    top: 805px;
  }
}

#point-9 {
  left: calc(40vw - 5px);
  top: calc(111vw - 5px);
}

@media (min-width: 1200px) {
  #point-9 {
    left: 515px;
    top: 825px;
  }
}

#point-3 {
  left: calc(63vw - 5px);
  top: calc(34vw - 5px);
}

@media (min-width: 1200px) {
  #point-3 {
    left: 955px;
    top: 255px;
  }
}

#point-4 {
  left: calc(9vw - 5px);
  top: calc(34vw - 5px);
}

@media (min-width: 1200px) {
  #point-4 {
    left: 175px;
    top: 390px;
  }
}

#point-10 {
  left: calc(62vw - 5px);
  top: calc(115vw - 5px);
}

@media (min-width: 1200px) {
  #point-10 {
    left: 955px;
    top: 825px;
  }
}

#top_txt {
  position: absolute;
  left: 1rem;
  top: 5rem;
  text-align: left !important;
}

@media (max-width: 767px) {
  .txt_title.animate__animated.animate__fadeInDown {
    color: black !important;
  }
}

@media (max-width: 767px) {
  .top_p {
    color: black;
  }
}

#box-0 {
  width: 100px;
  height: 100px;
  background-color: black;
  left: calc(50vw - 50vw);
  top: calc(50% - 50px);
  position: absolute;
  visibility: hidden;
}

@media (min-width: 1200px) {
  #box-0 {
    width: 100px;
    height: 100px;
    background-color: black;
    left: 550px;
    top: 150px;
    position: absolute;
    visibility: hidden;
  }
}

#bg_image {
  display: inline-block;
  width: 100%;
  height: auto;
}

@media (max-width: 1199px) {
  .hang_ye_ying_yong_btn_title_hang_ye_ying_yong {
    font-size: calc(0.4rem + 0.5vw);
  }
}

@media (min-width: 1200px) {
  #line_-1 {
    display: none;
  }
}

#line_-1 {
  left: 90vw;
  top: 61vw;
  transform: rotate(-90deg);
  transform-origin: left;
}

