* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body {
  overflow: hidden;
}

.Guide_Top {
  background: url(../images/ydy/guide_Background.jpg) bottom center no-repeat;
  background-size: cover;
  overflow: hidden;
  position: relative;
}
.Guide_Top .Guide_Right {
  width: 25%;
  height: 75%;
  position: absolute;
  right: 12.5%;
  bottom: 14%;
  align-items: center;
}
.Guide_Top .Guide_Right .rhcpic {
  max-height: 20%;
  width: 80%;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-200%);
  animation: bounceInBottom 1s cubic-bezier(0.48, 0.43, 0.29, 1.3) forwards;
}
.Guide_Top .Guide_Right .rhcpic .Guide_Logo {
  width: 100%;
  height: auto;
}
.Guide_Top .Guide_Right .Following_Information {
  height: 70%;
  max-width: 85%;
}
.Guide_Top .Guide_Right .Following_Information::before {
  content: "";
  background-color: black;
  opacity: 0.459;
  width: 100%;
  height: 80%;
  position: absolute;
  bottom: 0%;
  left: 0%;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-200%);
  animation: bounceInTop 1s ease 0.1s forwards;
}
.Guide_Top .Guide_Right .Following_Information .part1 {
  height: 50%;
  width: 100%;
  position: relative;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item {
  width: 100%;
  height: 25%;
  background: #6fb930;
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  justify-content: space-around;
  padding: 0% 15%;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-200%);
  animation: bounceInRight 0.8s cubic-bezier(0.48, 0.43, 0.29, 1.3) 0.8s forwards;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item:nth-of-type(2) {
  animation-delay: 1s;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item:nth-of-type(3) {
  animation-delay: 1.2s;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item img {
  height: 50%;
  width: auto;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item p {
  transition: transform 0.4s;
  color: #fff;
  font-size: 2.8rem;
  width: 54%;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item:hover img {
  animation: shake 0.4s;
}
.Guide_Top .Guide_Right .Following_Information .part1 .item:hover p {
  transform: translatex(6px);
}
.Guide_Top .Guide_Right .Following_Information .part1 .Header_item {
  display: none;
}
.Guide_Top .Guide_Right .Following_Information .part2 {
  height: 35%;
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  font-size: 1.8rem;
  top: 8%;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item {
  width: 100%;
  min-height: 42%;
  border-radius: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  cursor: pointer;
  text-decoration: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(200%);
  animation: TextAnimation 1s ease 0.5s forwards;
  flex-direction: column;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item:nth-of-type(2) {
  animation-delay: 0.8s;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item p {
  color: #fff;
  position: relative;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item p span {
  display: block;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item:nth-last-of-type(1) p {
  display: flex;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item a {
  margin-top: 2%;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item a img {
  width: 2rem;
  height: auto;
  vertical-align: top;
}
.Guide_Top .Guide_Right .Following_Information .part2 .item_phone {
  flex-direction: column;
  justify-content: space-evenly;
}
.Guide_Top .Guide_Right .part3,
.Guide_Top .Guide_Right .header_Value {
  display: none;
}
.Guide_Top .Guide_leftadd {
  animation: bounceInLeft 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
.Guide_Top .Guide_left {
  width: 30%;
  height: auto;
  position: absolute;
  right: 42%;
  background-color: rgba(0, 0, 0, 0.459);
  padding: 3%;
  opacity: 0;
  visibility: hidden;
  transform: translatex(-200%);
  animation-delay: 0.5s;
}
.Guide_Top .Guide_left .Left_Img {
  position: absolute;
  top: 4%;
  right: 4%;
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.Guide_Top .Guide_left .Left_Img img {
  width: 100%;
  height: 100%;
}
.Guide_Top .Guide_left .Left_Value {
  font-size: 1.6rem;
  color: #fff;
  text-indent: 2em;
  line-height: 2;
  text-align: justify;
}
.Guide_Top .Guide_brief {
  position: absolute;
  left: 0%;
  top: 50%;
  width: 70px;
  height: 60px;
  background-color: #6fb930;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  cursor: pointer;
}
.Guide_Top .Guide_brief img {
  width: 80%;
  height: auto;
}
.Guide_Top .Guide_briefadd {
  animation: Guide_brief 0.5s linear forwards;
}

@media (min-width: 800px) and (max-width: 1024px) {
  .Guide_Top .Guide_Right .Following_Information .part2 .item {
    height: 50%;
  }
}
@media (min-width: 0px) and (max-width: 1024px) {
  .Guide_Top .Guide_left {
    display: none;
  }

  .Guide_Top {
    background: url(../images/ydy/guide_Background.jpg) top left 30% no-repeat;
    background-size: cover;
  }
  .Guide_Top::after {
    content: "";
    background-color: black;
    opacity: 0.459;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0%;
    left: 0%;
  }

  .Guide_Top .Guide_Right {
    width: 100%;
    height: auto;
    position: absolute;
    right: 0%;
    top: 0%;
    bottom: 5%;
    left: 0%;
    justify-content: flex-start;
    overflow: scroll;
    overflow-x: hidden;
    z-index: 80;
  }
  .Guide_Top .Guide_Right .rhcpic {
    position: relative;
    z-index: 99;
    margin-top: 10%;
    height: auto;
    animation-delay: 0.5s;
    width: 100%;
    padding: 0% 10%;
  }
  .Guide_Top .Guide_Right .header_Value {
    display: block;
    margin-top: 5%;
    position: relative;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    animation: bounceInTop2 0.8s cubic-bezier(0.48, 0.43, 0.29, 1.3) forwards;
    animation-delay: 0.8s;
  }
  .Guide_Top .Guide_Right .header_Value p {
    color: #fff;
    position: relative;
    z-index: 99;
    text-align: justify;
    line-height: 2;
    padding: 0% 10%;
    text-indent: 2em;
  }
  .Guide_Top .Guide_Right .Following_Information {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 10%;
    max-width: 100%;
  }
  .Guide_Top .Guide_Right .Following_Information::before {
    display: none;
  }
  .Guide_Top .Guide_Right .Following_Information .part1 {
    width: 100%;
    padding: 0% 15%;
    height: 20rem;
    z-index: 99;
  }
  .Guide_Top .Guide_Right .Following_Information .part1 .item p {
    font-size: 2rem;
  }
  .Guide_Top .Guide_Right .Following_Information .part2 {
    display: none;
  }
  .Guide_Top .Guide_Right .part3 {
    position: relative;
    z-index: 99;
    height: auto;
    width: 100%;
    color: #fff;
    font-size: 1.8rem;
    text-align: left;
    margin-top: 5rem;
    display: flex;
    opacity: 0;
    visibility: hidden;
    animation: bounceInTop2 0.8s cubic-bezier(0.48, 0.43, 0.29, 1.3) forwards;
    animation-delay: 2s;
    padding: 0% 15%;
  }
  .Guide_Top .Guide_Right .part3 div {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    margin-bottom: 4rem;
  }
  .Guide_Top .Guide_Right .part3 p {
    letter-spacing: 1px;
  }
  .Guide_Top .Guide_Right .part3 p .PhoneText {
    display: block;
    margin-bottom: 1rem;
  }
  .Guide_Top .Guide_Right .part3 span {
    letter-spacing: 1px;
  }
  .Guide_Top .Guide_Right .part3 a {
    margin-top: 6%;
    color: #fff;
  }
  .Guide_Top .Guide_Right .part3 a img {
    width: 2rem;
    height: auto;
    vertical-align: top;
  }
  .Guide_Top .Guide_Right .part3 .spanlink {
    display: block;
    margin-top: 4%;
  }

  .Guide_Top .Guide_brief {
    display: none;
  }
}
@media (min-width: 0px) and (max-width: 375px) {
  .Guide_Top .Guide_Right .part3 {
    font-size: 1.6rem;
  }

  .Guide_Top .Guide_Right .Following_Information .part1 .item {
    height: 22%;
  }
}
@media (min-width: 1000px) and (max-width: 1500px) {
  .Guide_Top .Guide_left .Left_Value {
    font-size: 1.8rem;
  }
}