html{overflow-x: hidden;}
.banner.typehr .swiper-slide{ height: 401px;}
.banner.typehr .hrbanner-txt{width: 100%; box-sizing: border-box;}
.banner.typehr .hrbanner-txt .img{width: 21.44%;}
.banner.typehr .hrbanner-txt .img img{ width: 100%;}
.banner.typehr .hrbanner-txt h3{ margin-top: 40px; font-size: 24px; font-weight: 300; color: #fff;}
.ratio-img img{width: 100%;}

.hr-part01{padding:40px 0; background: #F4F4F4;}
.hr-part01 span{ float: left; width: 22%;font-size: 48px;font-weight: 300;color: #000000;line-height: 56px;}
.hr-part01 ul{ float: right; width: 75%;}
.hr-part01 li{ float: left; widtH:49.25%; margin-bottom: 1.5%;}
.hr-part01 li:nth-child(2n){ float: right;}
.hr-part01 li:last-child{margin-bottom: 0;}
.hr-part01 li:nth-last-of-type(2){margin-bottom: 0;}
.hr-part01 li dl{position: relative;}
.hr-part01 li dt img{width: 100%;}
.hr-part01 li dd{ display: none; position: absolute; lefT:0; top:0; box-sizing: border-box; color:#000; padding:4% 5%; width: 100%; height: 100%;}
.hr-part01 li dd h2{font-size:30px; font-weight: 400;margin-bottom:4%; height:80px; line-height: 40px;}
.hr-part01 li dd p{font-size: 16px;font-weight: 300; height: 72px;line-height: 24px;overflow: hidden;}

.hr-part02{ padding: 40px 0; background: #FFFFFF;}
.hr-part02 h2{font-size: 32px;font-weight:400;color: #000000;line-height: 40px;}
.hr-part02 ul{margin-top: 24px;}
.hr-part02 li{ float: left;position: relative; width:49.5%;}
.hr-part02 li:nth-child(2n){ float: right;}
.hr-part02 li dl{position: relative;}
.hr-part02 li dt img{width: 100%;}
.hr-part02 li dd{position: absolute; lefT:0; top:0; box-sizing: border-box; color: #fff; padding:72px 80px; width: 100%; height: 100%;}
.hr-part02 li dd h3{font-size: 48px; font-weight: 400; line-height: 56px;}
.hr-part02 li dd h4{margin-top: 16px;font-size: 32px;font-weight: 400; color: #FFFFFF;line-height: 40px;}
.hr-part02 li dd a.b-btn{color: #000; background: #fff; position: absolute; left:80px; bottom:40px;}
.hr-part02 li dd a.b-btn:hover{background:#c8c8c8;}

.hr-part03{position: relative;}
.hr-part03 .con{position: absolute; lefT:0; top:0; width: 100%; height: 100%;}
.hr-part03 .con dl{margin:40px 0 0; width: 48.94%;}
.hr-part03 .con dl dt{ margin-bottom: 40px;font-size: 48px;font-weight: 300;color: #000000;line-height: 56px;}
.hr-part03 .con dl dd{border-top: 1px solid #A6A6A6; padding: 15px 0 40px;}
.hr-part03 .con dl dd h3{height: 24px;font-size: 16px;font-weight: 500;color: #000000;line-height: 24px;}
.hr-part03 .con dl dd p{ opacity: 0.8; width: 77%; margin-top:8px; font-size: 16px;font-weight: 300;color: #000000;line-height: 24px;}



.hr-part04{padding: 40px 0; background: #fff;}
.hr-part04 h2{font-size: 32px;font-weight: 400;color: #000000;line-height: 40px;}
.hr-part04 ul{margin-top:24px;}
.hr-part04 li{margin-bottom: 24px; background: #F4F4F4;}
.hr-part04 li:last-child{margin-bottom: 0;}
.hr-part04 li dl{ overflow: hidden;}
.hr-part04 dl dt{float: left; width: 50%;}
.hr-part04 dl dd{ float: right; width: 50%; padding:40px; box-sizing: border-box;}
.hr-part04 dl dd h3{font-size: 24px;font-weight: 500;color: #333333;line-height: 32px; overflow: hidden;}
.hr-part04 dl dd h4{margin: 4px 0 28px; font-size: 16px;font-weight:500;color: #333333;opacity: 0.9; line-height: 32px; overflow: hidden;}
.hr-part04 dl dd p{position: relative; padding-left: 15px; margin-bottom:12px;font-size: 16px;font-weight: 300;color: #000;line-height: 24px;}
.hr-part04 dl dd p::before{content: ""; position: absolute; lefT:0; top:9px; width: 6px; height: 6px; border-radius: 100%; background: #333;}
.hr-part04 dl dd p span{ display: block; opacity: 0.6;}
.hr-part04 li:nth-child(2n) dl dt{ float: right;}
.hr-part04 li:nth-child(2n) dl dd{ float: left;}


.hr-part05{padding: 40px 0; color: #fff; background: #000;}
.hr-part05 span{ float: left; width: 22%;font-size: 48px;font-weight: 300;line-height: 56px;}
.hr-part05 ul{ float: right; width: 75%; margin: 0 -0.8%;}
.hr-part05 li{ float: left; widtH:31.73%; margin:0 0.8% 1.8%;}
.hr-part05 li:last-child{margin-bottom: 0;}
.hr-part05 li:nth-last-of-type(2),.hr-part05 li:nth-last-of-type(3){margin-bottom: 0;}
.hr-part05 li dl{position: relative;}
.hr-part05 li dt img{width: 100%;}
.hr-part05 li dd{ position: absolute; lefT:0; top:0; box-sizing: border-box; width: 100%; height: 100%;}
.hr-part05 li dd h3{ padding:16px; font-size: 16px; font-weight: 500;color: #FFFFFF;line-height: 24px;}


.hr-part06{padding: 40px 0; background: #F4F4F4;}
.hr-part06 h2{margin-bottom:24px; margin-left: 16px;font-size: 32px;font-weight:400;color: #000000;line-height:40px;}
.hrpart06-swiper .swiper-slide{width:100%!important; background: #fff; position: relative;}
.hrpart06-swiper .swiper-button-prev,.hrpart06-swiper .swiper-button-next{ left:calc(48.76% - 96px); top:calc(100% - 48px); margin-top:0; widtH:48px; height: 48px; background:rgba(0,0,0,0.5);}
.hrpart06-swiper .swiper-button-next{left:calc(48.76% - 48px);}
.hrpart06-swiper .swiper-button-prev i,.hrpart06-swiper .swiper-button-next i{ display: block; widtH:24px; height: 24px; line-height: 24px; margin:12px; text-align: center; color: #fff;}
.hrpart06-swiper .swiper-button-prev i{transform: rotate(180deg);}
.hrpart06-swiper .img{ float: left; width:48.76%;}
.hrpart06-swiper .img img{ widtH:100%;}
.hrpart06-swiper .txt{ float: right; width:51.24%; height: 100%;}
.hrpart06-swiper .txt .tt{padding:64px 48px 0;position: relative;}
.hrpart06-swiper .txt .tt::before{content: ""; position: absolute; lefT:36px; top:15px; width:52px; height: 45px; background: url(../upload/hrnew/dot.png) no-repeat; background-size: cover; overflow: hidden;}
.hrpart06-swiper .txt .tt p{font-size: 16px;line-height: 32px; height: 160px; overflow: hidden; font-weight: 400;color: #000; opacity: 0.6;}
.hrpart06-swiper .txt .bb{ padding:24px 24px 28px 48px; width:calc(51.24% - 72px); background: #E5F5F5; position: absolute;right:0; bottom:0;}
.hrpart06-swiper .txt .bb dt{ width:60%;}
.hrpart06-swiper .txt .bb dt h3{font-size: 24px; line-height: 32px;font-weight: 500;color: #333333;}
.hrpart06-swiper .txt .bb dt span{display: block; margin-top: 4px;font-size: 16px;line-height: 24px; font-weight: 400;color: #333333; opacity: 0.8;}
/*.hrpart06-swiper .txt .bb dd{ position: absolute; right:0; top:0; bottom:0; width:40%; background: #00A0A0;}
.hrpart06-swiper .txt .bb dd a{padding: 16px 16px; width:calc(100% - 32px); display: block; color:#fff;}
.hrpart06-swiper .txt .bb dd a i{ float: right;}
.hrpart06-swiper .txt .bb dd:hover{ background: #007878;}*/
@media only screen and (max-width:1659px) {
    .banner.typehr .hrbanner-txt{margin: 0 5%;}
}

@media only screen and (max-width:1599px) {
    .hr-part01 span,.hr-part02 li dd h3,.hr-part03 .con dl dt,.hr-part05 span{font-size: 32px; line-height: 40px; font-weight: 400;}
    .hr-part03 .con dl dd{padding: 15px 0 20px;}
    .hr-part02 li dd{padding:8%;}
    .hr-part02 li dd a.b-btn{left:8%;}
}
@media only screen and (max-width:1350px) {
    .hr-part03 .con dl dt{margin-bottom: 20px;}
    .hr-part04 dl dd{padding: 24px;}
    .hr-part04 dl dd h4{margin: 4px 0 16px;}
    .hr-part04 dl dd p{margin-bottom: 5px;}
}

@media only screen and (max-width:1279px) {
    .hr-part03 .con dl dt{margin-bottom: 10px;}
    .hr-part03 .con dl dd{padding: 10px 0;}
    .hr-part03 .con dl dd p{margin-top: 0;}
    .hr-part04 li dl{ height: auto!important;}
    .hr-part04 dl dt,.hr-part04 dl dd{width: 100%;}
    .hrpart06-swiper .img,.hrpart06-swiper .txt{ width: 100%;}
    .hrpart06-swiper .txt .bb{position: static; width: 100%;}
    .hrpart06-swiper .swiper-button-prev{left:calc(100% - 96px);}
    .hrpart06-swiper .swiper-button-next{right:0; left: auto;}
}
.banner.typehr .hrbanner-txt .img-phone,.hr-part03 .img-phone{ display: none;}
@media only screen and (max-width:1023px) {    
    .banner.typehr .swiper-slide{ height: auto;}
    .banner.typehr .hrbanner-txt{padding: 0 16px;}
    .banner.typehr .hrbanner-txt .img,.hr-part03 .img{ display: none;}
    .banner.typehr .hrbanner-txt .img-phone{ display: block; width: 58%;}
    .banner.typehr .hrbanner-txt .img-phone img,.hr-part03 .img-phone img{width: 100%;}
    .hr-part01 span,.hr-part02 h2,.hr-part03 .con dl dt,.hr-part04 h2,.hr-part05 span,.hr-part06 h2{ font-size: 28px; line-height: 28px; height: auto;}
    .hr-part01 span br,.hr-part05 span br{ display: none;}
    .hr-part01 span,.hr-part05 span{width: 100%;padding:0 16px; margin-bottom: 20px; box-sizing: border-box;}
    .hr-part01 ul{width: 100%;}
    .hr-part02 li dd h3{ font-size: 24px; height: auto; line-height: 24px;}
    .hr-part02 li dd h4{ font-size: 24px; margin-top: 8px; height: auto; line-height: 24px;}
    .hr-part02 h2,.hr-part03 .con,.hr-part04 h2{padding:0 16px; box-sizing: border-box;}
    .hr-part03 .img-phone{ display: block;}
    .hr-part03 .con{position: absolute;}
    .hr-part03 .con dl{margin-top: 40px;}
    .hr-part03 .con dl dt{margin-bottom: 20px;}
    .hr-part03 .con dl dd{padding: 16px 0 24px;}
    .hr-part04 li dl{ height: auto!important;}
    .hr-part04 dl dt,.hr-part04 dl dd{ width: 100%;}
    .hr-part04 dl dd h3{ font-size:20px; line-height: 24px;}
    .hr-part04 dl dd h4,.hr-part04 dl dd p{ font-size: 14px;}
    .hr-part05 ul{width: 100%; margin: 0;}
    .hr-part05 li{ width: 100%; margin: 0 0 12px!important;}  
    .hrpart06-swiper .txt .tt p{ height: auto; padding-bottom: 40px;}
}

@media only screen and (max-width:767px) {
    .banner.typehr .hrbanner-txt{margin: 0; top:36%;}
    .banner.typehr .hrbanner-txt h3{margin-top: 20px; font-size: 18px;}
    .hr-part01{ background: #fff;}
    .hr-part01 li{width: 100%; margin-bottom: 2px!important;}
    .hr-part02{ padding: 0 0 40px;}
    .hr-part02 li{width: 100%; margin-bottom:2px;}
    .hr-part02 li:last-child{margin-bottom: 0;}
    .hr-part02 li dd{padding: 24px 16px;}
    .hr-part02 li dd a.b-btn{left:16px; bottom:16px; width:calc(100% - 32px);}
    .hr-part02 li dd h4{font-size:18px;}
    .hr-part03 .con dl{ width: 100%;}
    .hr-part03 .con dl dd p{ width: 100%; font-size: 12px; line-height: 20px; margin-top: 8px;}
    .hr-part04,.hr-part06{padding-bottom: 0;}
    .hr-part04 ul{ margin-top: 20px;}
    .hr-part04 li{ margin-bottom: 0;}
    .hr-part04 dl dd{ padding: 24px 16px;}
    .hr-part04 dl dd h4{ margin:10px 0 20px; line-height: 14px;}
    .hr-part04 dl dd p{margin-bottom:10px; line-height: 22px;}
    .hr-part04 dl dd p::before{width:4px; height:4px;}
    .hr-part05 li{margin-bottom:2px!important;}
    .hr-part06{ background: #fff;}
    .hrpart06-swiper, .hrpart06-swiper .swiper-slide{ background: #F4F4F4;}
    .hrpart06-swiper .txt .bb{padding: 14px 16px;}
    .hrpart06-swiper .txt .bb dt{ width: 100%;}
    .hrpart06-swiper .txt .bb dt h3{font-size: 16px; line-height: 1.5;}
    .hrpart06-swiper .txt .bb dt span{ font-size: 14px; margin-top: 0; line-height: 1.5;}
    .hrpart06-swiper .txt .tt{padding: 42px 16px 0; font-size: 14px;}
    .hrpart06-swiper .txt .tt::before{ width: 24px; height: 17px; left: 16px; top:20px;}
    .hrpart06-swiper .txt .tt p{font-size: 14px; line-height: 20px; padding-bottom: 20px;}
}


@media only screen and (min-width:1025px) {
.xx{transition: 0.3s all;-webkit-transition: 0.3s all;-moz-transition: 0.3s all;-o-transition: 0.3s all;-ms-transition: 0.3s all;}
}