body {
  overflow-x: hidden;
  background: #0A2D62;
}
.shine-girl-area {
  background: #0A2D62;
  width: 19.2rem;
  height: 10rem;
  position: relative;
  /*  .light-girl{
    position: absolute;
    bottom: 0;
    z-index: 999;
    width: 19.2rem;
    text-align: center;
    img.light-girl-bg{
      display:block;
      margin-left: 50%;
      transform: translateX(-50%);
      position: absolute;
      width: 9.0rem;
      bottom: 0;
    }
    .light-girl-img{
      position: absolute;
      width: 5.17rem;
      left:4.55rem;
      bottom: 1.01rem;
      .animation(tB,2s)
    }
  }*/
}
.shine-girl-area .girl {
  z-index: 999;
}
.shine-girl-area .light-girl-star {
  width: 7.3rem;
  z-index: 999;
  display: block;
  position: absolute;
  top: 1.45rem;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.shine-girl-area img.light-girl-bg {
  position: absolute;
  width: 9rem;
  top: 1.42rem;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.shine-girl-area .light-girl-img {
  position: absolute;
  width: 5.17rem;
  left: 4.55rem;
  top: 4.6rem;
  -webkit-animation: girl 5s both infinite;
  -moz-animation: girl 5s both infinite;
  -ms-animation: girl 5s both infinite;
  animation: girl 5s both infinite;
}
.shine-girl-area #main {
  width: 19.2rem;
  height: 7rem;
  position: absolute;
  bottom: 0;
}
.shine-girl-area .canvas-wrap > div {
  background: #0A2D62;
}
.shine-girl-area .ultext {
  position: absolute;
  width: 12rem;
  top: 2rem;
  text-align: center;
  color: white;
  z-index: 999;
}
.shine-girl-area .ultext .liBig {
  line-height: 1.5;
  margin-bottom: 0.14rem;
}
.shine-girl-area .ultext .liText {
  line-height: 1.5;
  color: #D1FFE8;
}
.join-us-area {
  width: 19.2rem;
  height: 10.65rem;
  background-image: url("../image/HR_banner2.png");
  background-size: cover;
  position: relative;
}
.join-us-area .ultext {
  position: absolute;
  width: 12rem;
  top: 1.02rem;
  text-align: center;
  color: white;
  z-index: 999;
}
.join-us-area .ultext .liText {
  line-height: 1.5;
  color: #D1FFE8;
}
.join-us-area .ultext .liBig {
  line-height: 1.5;
  margin-bottom: 0.2rem;
}
.join-us-area .ultext .last {
  margin-top: 0.62rem;
}
.join-us-area .tirs-area {
  position: absolute;
  bottom: 0;
  height: 7.23rem;
  width: 12rem;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.join-us-area .tirs-area .bg-color {
  position: relative;
  width: 100%;
  height: 100%;
  background: #0A2D62;
  opacity: 0.5;
}
.join-us-area .tri-div {
  text-align: center;
}
.join-us-area .tri-div .img-tri {
  display: block;
}
.join-us-area .tri-div .img-t {
  -webkit-animation: tB 2s both infinite;
  -moz-animation: tB 2s both infinite;
  -ms-animation: tB 2s both infinite;
  animation: tB 2s both infinite;
}
.join-us-area .tri-div .jobs {
  color: #98FAC9;
  text-align: center;
  position: absolute;
  width: 100%;
  cursor: pointer;
}
.join-us-area .tri-main {
  position: absolute;
  height: 4.58rem;
  width: 5.63rem;
  left: 3.18rem;
  top: 1.02rem;
}
.join-us-area .tri-main .img-tri {
  position: absolute;
  top: 0;
  height: 4.58rem;
  width: 5.63rem;
  opacity: 0.5;
}
.join-us-area .tri-main .img-t {
  height: 2.45rem;
  width: 3.29rem;
  position: absolute;
  top: -0.1rem;
  left: 1.37rem;
}
.join-us-area .tri-first {
  position: absolute;
  height: 1.68rem;
  width: 2.94rem;
  left: 0rem;
  top: 1.42rem;
}
.join-us-area .tri-first .img-tri {
  position: absolute;
  top: 0;
  height: 1.68rem;
  width: 2.94rem;
  opacity: 0.5;
}
.join-us-area .tri-first .img-t {
  width: 0.24rem;
  height: 2.01rem;
  position: absolute;
  top: -1.17rem;
  left: 50%;
}
.join-us-area .tri-first .jobs {
  top: 1rem;
}
.join-us-area .tri-second {
  position: absolute;
  height: 2.21rem;
  width: 2.77rem;
  left: 2.65rem;
  bottom: 1.2rem;
}
.join-us-area .tri-second .img-tri {
  position: absolute;
  top: 0;
  height: 2.21rem;
  width: 2.77rem;
  opacity: 0.5;
}
.join-us-area .tri-second .img-t {
  width: 0.25rem;
  height: 1.55rem;
  position: absolute;
  top: -0.17rem;
  left: 50%;
}
.join-us-area .tri-second .jobs {
  top: 1.4rem;
}
.join-us-area .tri-third {
  position: absolute;
  height: 1.67rem;
  width: 1.61rem;
  left: 6.35rem;
  bottom: 0.4rem;
}
.join-us-area .tri-third .img-tri {
  position: absolute;
  top: 0;
  height: 1.67rem;
  width: 1.61rem;
  opacity: 0.5;
}
.join-us-area .tri-third .img-t {
  width: 0.19rem;
  height: 0.86rem;
  position: absolute;
  top: 0rem;
  left: 50%;
}
.join-us-area .tri-third .jobs {
  top: 1rem;
}
.join-us-area .tri-forth {
  position: absolute;
  height: 2.76rem;
  width: 2.75rem;
  right: 0.85rem;
  top: 3.68rem;
}
.join-us-area .tri-forth .img-tri {
  position: absolute;
  top: 0;
  height: 2.76rem;
  width: 2.75rem;
  opacity: 0.5;
}
.join-us-area .tri-forth .img-t {
  width: 0.25rem;
  height: 1.55rem;
  position: absolute;
  top: 0rem;
  left: 50%;
}
.join-us-area .tri-forth .jobs {
  top: 1.6rem;
}
.join-us-area .tri-fifth {
  position: absolute;
  height: 2.26rem;
  width: 2.59rem;
  right: 0rem;
  top: 1.42rem;
}
.join-us-area .tri-fifth .img-tri {
  position: absolute;
  top: 0;
  height: 2.26rem;
  width: 2.59rem;
  display: block;
  opacity: 0.5;
}
.join-us-area .tri-fifth .img-t {
  width: 0.24rem;
  height: 1.14rem;
  position: absolute;
  top: 0rem;
  left: 50%;
}
.join-us-area .tri-fifth .jobs {
  top: 1rem;
}
@keyframes tB {
  0% {
    transform: translateY(10px);
  }
  50% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes girl {
  0% {
    transform: translateY(30px);
    transform: translateX(30px);
  }
  50% {
    transform: translateY(0px);
    transform: translateX(0px);
  }
  100% {
    transform: translateY(30px);
    transform: translateX(30px);
  }
}