@charset "utf-8";



html,

body {

   width: 100%;

   height: 100%;

}



body {

   font-family: "Microsoft YaHei";

   font-size: 14px;

   color: #3f3f3f;

   overflow: auto !important;

}



.rel {

   position: relative;

}



.abs {

   position: absolute;

}



.animate {

   opacity: 0;

   -webkit-transition: all 1s;

   transition: all 1s;

   position: relative;

   -webkit-animation-fill-mode: forwards;

   animation-fill-mode: forwards;

   -webkit-animation-timing-function: ease-out;

   animation-timing-function: ease-out;

}



a {

   text-decoration: none;

   color: #4d4d4d;

}



a:link {

   text-decoration: none;

}



a:visited {

   text-decoration: none;

}



a:hover {

   text-decoration: none;

}



a:active {

   text-decoration: none;

}



/*导航开始*/

.bg {

   position: absolute;

   width: 100%;

   display: block;

   background: url(../images/bg.jpg) no-repeat;

   height: 1450px;

   background-size: 100% 100%;

}



.bg-salary {

   background: url(../images/bg2.jpg) no-repeat;

   height: 3250px;

   background-size: 100% 100%;

}



.bg-job {

   background: url(../images/bg3.jpg) no-repeat;

   height: 1948px;

   background-size: 100% 100%;

}



.wrap {

   position: relative;

   width: 100%;

   min-width: 1325px;

   height: 100%;

   background-size: 100% auto;

}



.top {

   height: auto;

   overflow: hidden;

   position: relative;

}



.top-bg {

   height: 80px;

   width: 100%;

   background: rgba(0, 39, 70, 0.5);

   position: absolute;

   left: 0;

   top: 0;

}



.logo-nav {

   width: 1200px;

   margin: 0 auto;

   position: relative;

}



.logo {

   float: left;

   margin-top: 12px;

}



.nav {

   position: absolute;

   right: 0;

}



.nav li {

   position: relative;

   float: left;

   line-height: 80px;

   text-align: center;

   width: 117px;

}



.nav li a {

   position: relative;

   display: block;

   font-size: 18px;

   font-weight: bold;

   color: #fff;

}



.nav li.on a,

.nav li a:hover {

   line-height: 80px;

   z-index: 5;

   background: url(../images/shape.png) no-repeat;

   background-size: 100%;

   color: #fff;

   /* font-weight: bold; */

   height: 80px;

}



.nav li.on a .tip,

.nav li a:hover .tip {

   position: absolute;

   bottom: 15px;

   z-index: 99;

   left: 0;

   right: 0;

   margin: 0 auto;

}







.container {

   position: relative;

   top: -7px;

}





.section {

   background: url('../images/bg.jpg') no-repeat;

   width: 100%;

   height: 100%;

   background-size: 100% 100%;

   top: 0;

   position: absolute

}



.job-1 {

   display: block;

   margin: 0 auto;

   padding-top: 30px;

}



.enter {

   width: 14.9%;

   margin-left: 8%;

   margin-top: 2%;

}



.logo1 {

   position: absolute;

   left: 8%;

   margin-top: 3%;

   width: 18.8%;

}



.city {

   bottom: 0;

   width: 100%;

   margin-top: 90px;

}



/*导航结束*/



.fl {

   float: left;

}



.hide {

   display: none;

}



.show {

   display: block;

}





.banner {

   width: 100%;

   /* position: relative; */

   /* z-index: -1; */

   /* display: block; */

   /* margin-top: -80px */

   display: block;

}



.right-img {

   position: absolute;

   right: 0;

   top: 20px;

   z-index: 1;

   pointer-events: none;

}



.boy {

   position: absolute;

   bottom: 0;

   z-index: 99;

   left: 0;

   z-index: -1;

}



.center {

   display: block;

   margin: 0 auto;

}



/*版权*/

.footer {

   position: absolute;

   left: 0;

   bottom: 0;

   width: 100%;

   height: 50px;

   color: #fff;

   text-align: center;

   z-index: 60;

   line-height: 50px;

   font-size: 12px;

   /* background: #d9d9d9; */

}



.footer img {

   vertical-align: text-bottom

}



.cover {

   position: fixed;

   width: 100%;

   height: 100%;

   top: 0;

   left: 0;

   background: #000;

   z-index: 100;

   font-size: 16px;

   display: none;

   overflow: hidden;

}



.cover .iphone {

   width: 460px;

   height: 790px;

   position: absolute;

   left: 37%;

   top: 15%;

   margin-top: -2.18rem;

   margin-left: -1.45rem;

   background: url(../images/phone.png) no-repeat;

   background-size: 100% 100%;

   animation: zhuan 1.5s .3s infinite;

   -webkit-animation: zhuan 1.5s .3s infinite;

}



.cover .iphone>img {

   animation: zhuan 1.5s 0.3s infinite;

   -webkit-animation: zhuan 1.5s 0.3s infinite

}



.cover p {

   position: absolute;

   left: 0 !important;

   top: 55% !important;

   text-align: center;

   width: 100%;

   color: #fff;

   font-size: 3rem;

}



.pageOpen .bg-an {

   animation: bigtosmall 2s both;

   -webkit-animation: bigtosmall 2s both;

   -o-animation: bigtosmall 2s both;

   -moz-animation: bigtosmall 2s both;

   -ms-animation: bigtosmall 2s both;

}





@-webkit-keyframes twinkling {

   0% {

      -webkit-transform: scale(0.5);

   }



   100% {

      -webkit-transform: scale(1);

   }

}



@keyframes twinkling {

   0% {

      -webkit-transform: scale(0.5);

   }



   100% {

      -webkit-transform: scale(1);

   }

}



@-webkit-keyframes rotateImg {

   from {

      -webkit-transform: rotate(-15deg);

   }



   to {

      -webkit-transform: rotate(15deg);

   }

}



@keyframes rotateImg {

   from {

      transform: rotate(-15deg);

   }



   to {

      transform: rotate(15deg);

   }

}



@keyframes zhuan {

   0% {

      transform: rotate(-90deg)

   }



   50% {

      transform: rotate(0deg)

   }



   100% {

      transform: rotate(-90deg)

   }

}



@-webkit-keyframes zhuan {

   0% {

      -webkit-transform: rotate(-90deg)

   }



   50% {

      -webkit-transform: rotate(0deg)

   }



   100% {

      -webkit-transform: rotate(-90deg)

   }

}



@keyframes bigtosmall {

   0% {

      -webkit-transform: scale3d(1.2, 1.2, 1);

   }



   100% {

      -webkit-transform: scale3d(1, 1, 1);

   }

}



@-o-keyframes bigtosmall {

   0% {

      -o-transform: scale3d(1.2, 1.2, 1);

   }



   100% {

      -o-transform: scale3d(1, 1, 1);

   }

}



@-moz-keyframes bigtosmall {

   0% {

      -moz-transform: scale3d(1.2, 1.2, 1);

   }



   100% {

      -moz-transform: scale3d(1, 1, 1);

   }

}



@-ms-keyframes bigtosmall {

   0% {

      -ms-transform: scale3d(1.2, 1.2, 1);

   }



   100% {

      -ms-transform: scale3d(1, 1, 1);

   }

}



@-webkit-keyframes bigtosmall {

   0% {

      -webkit-transform: scale3d(1.2, 1.2, 1);

   }



   100% {

      -webkit-transform: scale3d(1, 1, 1);

   }

}



@media screen and (orientation: portrait) {

   .cover {

      display: block;

   }

}



.title {

   margin-top: 95px;

}



.block-bg {

   background: url('../images/block-1.png') no-repeat;

   width: 1113px;

   height: 373px;

   background-size: 100% 100%;

   margin-top: 30px;

}



.block-job {

   background: url('../images/block-job.png') no-repeat;

   width: 1110px;

   height: 1506px;

   background-size: 100% 100%;

   margin-top: 30px;

}



.p1-2 {

   margin: 0 auto;

   display: block;

   padding-top: 52px;

   width: 87%;

   font-size: 20px;

   color: #fff;

   text-align: justify;

   letter-spacing: 1px;

   text-indent: 40px;

}



.p1-2 span {

   color: #18b8e8;

}



.ball {

   background: url(../images/ball.png) no-repeat;

   width: 825px;

   height: 712px;

}



.ball-container {

   position: absolute;

   width: 340px;

   height: 30px;

   overflow: hidden;

   cursor: pointer;

   transition: all 0.5s ease;

   -webkit-transition: all 0.5s ease;



}



.trapezoid {

   position: absolute;

   left: 12px;

   height: 100%;

   width: 100%;

   background: linear-gradient(#1ebcf3, #08eefd);

   transform: skewX(20deg);

}



.trapezoid-abs {

   position: absolute;

   left: 12px;

   height: 100%;

   width: 100%;

   background: linear-gradient(#1ebcf3, #08eefd);

   transform: skewX(-20deg);

}



.trapezoid-rel {

   position: absolute;

   right: 12px;

   height: 100%;

   width: 100%;

   background: linear-gradient(#1ebcf3, #08eefd);

   transform: skewX(-20deg);

}



.trapezoid-rel-abs {

   position: absolute;

   right: 12px;

   height: 100%;

   width: 100%;

   background: linear-gradient(#1ebcf3, #08eefd);

   transform: skewX(20deg);

}



.ball-container span {

   position: absolute;

   left: 30px;

   line-height: 30px;

   color: #012951;

   font-size: 20px;

}



.ball-container-active {

   transform: scale(1.2);

   -webkit-transform: scale(1.2);

   font-weight: bold;

}



.ball-btn {

   margin: 0 auto;

   margin-top: 30px;

   width: 422px;

   height: 37px;

   position: relative;

   cursor: pointer;

}



.ball-parent-left {

   background: url(../images/btn-left.png) no-repeat;

}



.ball-parent-right {

   background: url(../images/btn-right.png) no-repeat;

}



.btn-left {

   width: 50%;

   left: 0;

   height: 100%;

   position: absolute;

}



.btn-right {

   width: 50%;

   right: 0;

   height: 100%;

   position: absolute;

}



.intro-p {

   color: #fff;

   font-size: 20px;

   text-align: center;

   margin-top: -100px;

}



.m-bg {

   width: 100%;

   height: 100%;

   background: rgba(0, 0, 0, 0.7);

   background-size: 100% 100%;

   position: fixed;

   left: 0;

   top: 0;

   z-index: 99;

}



.company-block {

   background: url(../images/company-block.png) no-repeat;

   width: 700px;

   height: 603px;

   margin: 0 auto;

   margin-top: 90px;

   position: relative;

}



.company-block .intro-content {

   color: #fff;

   width: 90%;

   margin: 0 auto;

   line-height: 23px;



   text-align: justify;

}



.company-block .intro-content p {

   text-indent: 28px;

   padding-top: 20px;

}



.block-title {

   background: url(../images/comtitle.png) no-repeat;

   width: 300px;

   height: 56px;

   margin: 0 auto;

   position: relative;

   top: 30px;

   text-align: center;

   line-height: 63px;

   color: #fff;

   font-size: 16px;

   font-weight: bold;

   background-size: 100% 100%;

}



.close {

   position: absolute;

   right: 0;

   color: #fff;

   cursor: pointer;

}



.company-intro {

   height: 390px;

   overflow-y: auto;

   overflow-x: hidden;

   position: absolute;

   bottom: 100px;

   width: 90%;

   left: 0;

   right: 0;

   margin: 0 auto;

}





.company-intro::-webkit-scrollbar-track {

   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

   background-color: #fff;

}



/* 滚动条的滑轨背景颜色 */

.company-intro::-webkit-scrollbar {

   width: 6px;

   background-color: #ccc;

}



.company-intro::-webkit-scrollbar-thumb {

   background-color: #14d3f7;

}



.subnav {

   background: url(../images/subnav-2.png) no-repeat;

   width: 56px;

   height: 213px;

   color: #fff;

   writing-mode: vertical-lr;

   -ms-writing-mode: tb-lr;

   text-align: center;

   line-height: 54px;

   font-weight: bold;

   font-size: 24px;

   letter-spacing: 2px;

   cursor: pointer;

}



.subnav-click {

   background: url(../images/subnav-1.png) no-repeat;

   color: #003668;

}



.subnav:nth-child(2) {

   margin-top: -20px;

}



.subnav:nth-child(3) {

   margin-top: -20px;

}



.plan-block {

   background: url(../images/plan-block.png) no-repeat;

   width: 1110px;

   height: 958px;

   float: left;

   padding-top: 110px;

}



.plan-block-2 {

   background: url(../images/plan-block-2.png) no-repeat;

   width: 1110px;

   height: 958px;

   float: left;

   padding-top: 110px;

}



.salary-block {

   width: 1110px;

   padding-top: 110px;

   float: left;

}



.salary-block-1 {

   background: url(../images/salary-1.png) no-repeat;

   height: 2717px;

}



.salary-block-2 {

   background: url(../images/salary-2.png) no-repeat;

   height: 1087px;

}



.salary-block-3 {

   background: url(../images/salary-3.png) no-repeat;

   height: 1087px;

}



.subnav-ul {

   float: left;

   margin-top: 210px;

   left: 11px;

   position: relative;

}



.plan-total {

   margin: 0 auto;

   display: block;

   width: 1180px;

   margin-top: 30px;

}



.reder {

   background: url(../images/2-2.png) no-repeat;

   width: 316px;

   height: 318px;

   margin: 0 auto;

   margin-top: 100px;

}



.subleft {

   float: left;

}



.subright {

   float: left;

}



.subright {

   margin-left: 100px;

}



.subcontent-1 {

   width: 90%;

   margin: 0 auto;

}



.reder ul li {

   position: absolute;

   color: #fff;



   cursor: pointer;

   text-align: center;

}



.reder ul li span {

   display: block;

   transition: all 0.5s ease;

   -webkit-transition: all 0.5s ease;

}



.reder-active,

.reder-active-on {

   font-weight: bold;

   color: #13eff9;

   transform: scale(1.3);

   -webkit-transform: scale(1.3);

}



.dott-on,

.dott-active-on {

   /* color: #13eff9; */

   transform: scale(1) !important;

   -webkit-transform: scale(1) !important;

   /* font-weight: bold; */

   opacity: 1 !important;

}



.reder ul li:nth-child(1) {

   left: 130px;

   top: -50px;

}



.reder ul li:nth-child(2) {

   left: 290px;

   top: 40px;

   width: 100px;

}



.reder ul li:nth-child(3) {

   left: 260px;

   top: 260px;

   width: 70px;

   text-align: center;

}



.reder ul li:nth-child(4) {

   left: 110px;

   top: 340px;

   width: 100px;

}



.reder ul li:nth-child(5) {

   left: -10px;

   top: 270px;

   width: 60px;

}



.reder ul li:nth-child(6) {

   left: -50px;

   top: 70px;



}



.dott {

   transition: all 0.5s ease;

   -webkit-transition: all 0.5s ease;

   opacity: 0;

   transform: scale(0.8);

   -webkit-transform: scale(0.8);

}



.reder li:nth-child(1) .dott {

   top: 28px;

   left: 0px;

}



.reder li:nth-child(2) .dott {

   top: 20px;

   left: -30px;

}



.reder li:nth-child(3) .dott {

   top: -60px;

   left: 7px;

}



.reder li:nth-child(4) .dott {

   top: -60px;

   left: 17px;

}



.reder li:nth-child(5) .dott {

   top: -60px;

   left: -3px;

}



.reder li:nth-child(6) .dott {

   top: -20px;

   left: 47px;

}



.market-img {

   margin-top: 80px;

}



.market-ul {

   margin: 0 auto;

   width: 77%;

   margin-top: 70px;

}



.market-ul li {

   float: left;

   margin-left: 97px;

}



.market-ul li:nth-child(1) {

   position: relative;

   top: -20px;

}



.market-ul li:nth-child(3) {

   position: relative;

   top: -30px;

}



.market-ul li:nth-child(5) {

   position: relative;

   top: -25px;

}



.market-ul div {

   position: relative;

   color: #fff;

   font-size: 22px;

   font-weight: bold;

   writing-mode: vertical-lr;

   -ms-writing-mode: tb-lr;

   letter-spacing: 2px;

   text-align: center;

   line-height: 49px;

   margin-left: -12px;

   width: 52px;

   height: 122px;

   transition: all 0.5s ease;

   -webkit-transition: all 0.5s ease;

   cursor: pointer;

}



.market-line {

   margin-top: -20px;

}



.market-ul .market-active,

.market-ul .market-active-on {

   background: url(../images/market-bar.png) no-repeat;

   color: #023c69;

   transform: scale(1.1);

}



.content-0-block {

   background: url(../images/subright.png) no-repeat;

   width: 479px;

   height: 700px;

}



.content-0-title {

   margin-top: 60px;

}



.content-0-div {

   overflow-y: scroll;

   height: 440px;

   margin: auto 17px;

   margin-top: 40px;

}



.content-0-div::-webkit-scrollbar-track {

   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);

   background-color: #fff;

}



/* 滚动条的滑轨背景颜色 */

.content-0-div::-webkit-scrollbar {

   width: 6px;

   background-color: #ccc;

}



.content-0-div::-webkit-scrollbar-thumb {

   background-color: #13eff9;

}