@charset "UTF-8";
/*公用样式*/
html {
  /*-webkit-filter: grayscale(100%);*/
  /*filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);*/
}
body {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-family: "Microsoft YaHei", Helvetica, Arial, sans-serif; }

a {
  text-decoration: none; }

img {
  display: block;
  border: 0; }

.clear {
  clear: both; }

.clear:after {
  content: "";
  clear: both;
  display: block; }

.hide {
  display: none !important; }

ul, li {
  padding: 0;
  margin: 0;
  list-style: none; }

/*浮动*/
.pull-left {
  float: left; }

.pull-right {
  float: right; }

/*定位*/
.rela {
  position: relative; }

.abs {
  position: absolute; }

.fixed {
  position: fixed; }

/*居中*/
.center {
  text-align: center;
  margin: 0 auto; }

/*分割*/
.split li {
  display: inline; }
  .split li:after {
    content: '|';
    padding: 0 .5em; }
  .split li:last-child:after {
    content: ''; }

/*文本对齐*/
.text-left {
  text-align: left; }

.text-center {
  text-align: center; }

.text-right {
  text-align: right; }

body {
  font-size: 16px;
  padding-top: 90px; }

.bold {
  font-weight: bold; }

.text-left {
  text-align: left !important;
  line-height: 2 !important;
  padding: 1.3em; }

.widget {
  width: 1140px;
  margin: 30px auto 60px;
  background-color: transparent;
  box-sizing: border-box; }
  .widget.padding {
    padding: 40px; }
  .widget > .title {
    text-align: center; }
    .widget > .title > img {
      display: block;
      margin: 0 auto 30px; }
  .widget > .content > .text {
    font-size: 16px;
    line-height: 37px;
    text-indent: 2em;
    color: #666; }

.bg_center {
  width: 100%;
  height: 1182px;
  background: url(../images/bg_mid.jpg) no-repeat center 99px; }

/*页头导航栏*/
#header {
  width: 100%;
  height: 90px;
  background-color: #FFF;
  box-shadow: 0 1px 5px #756C6C;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999999; }
  #header .header-panel {
    width: 1140px;
    height: 90px;
    margin: 0 auto; }
    #header .header-panel .logo {
      width: 304px;
      height: 51px;
      top: 20px;
      left: 0;
      background: url(../images/logo.png) no-repeat center center; }
    #header .header-panel .nav-panel {
      right: 0;
      top: 30px; }
      #header .header-panel .nav-panel ul li {
        height: 20px;
        float: left;
        display: block;
        padding: 0 1em;
        border-right: 2px solid #237DE3; }
        #header .header-panel .nav-panel ul li a {
          font-size: 19px;
          color: #237DE3;
          line-height: 20px;
          transition: all .3s ease-out; }
        #header .header-panel .nav-panel ul li.active a, #header .header-panel .nav-panel ul li:hover a {
          color: #F05F40; }
        #header .header-panel .nav-panel ul li:last-child {
          border-right: 0;
          padding-right: 0; }

/*顶部大图*/
#banner {
  width: 100%;
  max-width: 1920px;
  height: 446px;
  background: url(http://www.hnrcsc.com/html/rpo/images/banner.jpg) no-repeat center center; }
  #banner .text {
    color: #FFF;
    width: 1140px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 90px; }
    #banner .text .line1 {
      font-size: 33px;
      font-weight: bold;
      line-height: 48px;
      display: block;
      margin: 0 auto;
      text-align: center; }
    #banner .text .line2 {
      margin-top: 38px;
      font-size: 19px;
      line-height: 24px;
      color: #FEFEFE;
      text-align: center; }

/*RPO介绍*/
#introduce {
  margin-top: -100px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  background-color: #FFF; }

/*服务特色*/
#service-features .featrues-item {
  width: 373px;
  height: 254px;
  border-radius: 5px;
  background-color: #FFF;
  box-shadow: 0 0 2px #333;
  cursor: pointer;
  padding: 28px;
  box-sizing: border-box;
  position: relative; }
  #service-features .featrues-item .icon {
    width: 68px;
    height: 68px;
    position: absolute;
    left: 29px;
    top: 28px;
    overflow: hidden; }
    #service-features .featrues-item .icon > img {
      position: absolute;
      top: -100px;
      left: 0;
      filter: drop-shadow(0 100px 0 #237DE3); }
  #service-features .featrues-item .title {
    position: absolute;
    font-size: 21px;
    font-weight: bold;
    color: #237DE3;
    left: 112px;
    top: 32px;
    line-height: 32px; }
    #service-features .featrues-item .title > span {
      display: block;
      font-size: 16px; }
  #service-features .featrues-item .quotation {
    width: 68px;
    height: 68px;
    position: absolute;
    right: 14px;
    top: 29px;
    overflow: hidden; }
    #service-features .featrues-item .quotation > img {
      position: absolute;
      top: -100px;
      left: 0;
      filter: drop-shadow(0 100px 0 #40B0FE); }
  #service-features .featrues-item .text {
    color: #666;
    font-size: 16px;
    position: absolute;
    top: 110px;
    width: 320px;
    line-height: 26px; }
  #service-features .featrues-item.active {
    background: #218ED9;
    background: -webkit-linear-gradient(140deg, #0068b1 0%, #218ed9 50%, #40b0fe 100%);
    background: -o-linear-gradient(140deg, #0068b1 0%, #218ed9 50%, #40b0fe 100%);
    background: -ms-linear-gradient(140deg, #0068b1 0%, #218ed9 50%, #40b0fe 100%);
    background: -moz-linear-gradient(140deg, #0068b1 0%, #218ed9 50%, #40b0fe 100%);
    background: linear-gradient(310deg, #0068b1 0%, #218ed9 50%, #40b0fe 100%); }
    #service-features .featrues-item.active .icon > img {
      filter: drop-shadow(0 100px 0 #FFF); }
    #service-features .featrues-item.active .title {
      color: #FFF; }
    #service-features .featrues-item.active .quotation > img {
      filter: drop-shadow(0 100px 0 #FFF); }
    #service-features .featrues-item.active .text {
      color: #FFF; }

/*服务流程*/
#service-process {
  width: 100% !important;
  height: 298px !important;
  background: url(../images/bg_flow.png) no-repeat center center; }

/*联系我们*/
#contact > .content li {
  color: #0085B3;
  text-align: center;
  width: 228px;
  float: left;
  display: block; }
  #contact > .content li > img {
    width: 100px;
    height: 100px;
    margin: 0 auto; }
  #contact > .content li .name {
    font-size: 19px;
    line-height: 3; }
  #contact > .content li .contact {
    font-size: 15px;
    line-height: 1.6; }

#footer {
  background: #333;
  padding: 50px 20px;
  font-size: 19px;
  color: #7B7B7B;
  text-align: center; }
  #footer > .nav-panel {
    margin: 0 auto 33px; }
    #footer > .nav-panel ul li {
      height: 20px;
      display: inline;
      border-right: 2px solid #7B7B7B; }
      #footer > .nav-panel ul li a {
        color: #7B7B7B;
        line-height: 20px;
        padding: 0 1em; }
      #footer > .nav-panel ul li:last-child {
        border-right: 0; }
  #footer .address {
    margin-bottom: 38px; }
  #footer .copyright {
    line-height: 2; }

/*手风琴*/
.accordion {
  width: 1140px;
  height: 348px;
  overflow: hidden; }
  .accordion > .accordion-item {
    height: 348px;
    width: 68px;
    float: left;
    display: block;
    overflow: hidden;
    transition: all .3s ease-out; }
    .accordion > .accordion-item > .accordion-panel {
      width: 868px;
      height: 348px; }
      .accordion > .accordion-item > .accordion-panel > .title {
        width: 67px;
        border-right: 1px solid #FFF;
        height: 348px;
        cursor: pointer;
        background-color: #40B0FE;
        background-repeat: no-repeat;
        background-position: 20px 40px;
        transition: all .3s ease-out; }
      .accordion > .accordion-item > .accordion-panel > .content {
        width: 800px;
        height: 348px;
        background-color: #0068B1;
        background-position: center center;
        background-repeat: no-repeat; }
    .accordion > .accordion-item.active {
      width: 800px; }
      .accordion > .accordion-item.active > .accordion-panel > .title {
        width: 0;
        border-right: 0; }

#rotating-gallery {
  width: 1140px;
  height: 360px;
  display: block;
  position: relative; }
  #rotating-gallery > li {
    position: absolute;
    border-radius: 5px;
    overflow: hidden;
    z-index: 99;
    transition: all .5s ease-out;
    left: 374px;
    bottom: 40px;
    filter: brightness(1);
    opacity: 0.8;
    cursor: pointer; }
    #rotating-gallery > li a {
      width: 392px;
      height: 266px;
      opacity: 0; }
      #rotating-gallery > li a img {
        width: 392px;
        height: 266px;
        transition: all .5s ease-out; }
    #rotating-gallery > li.current {
      z-index: 999;
      left: 330px;
      bottom: 30px;
      filter: brightness(1);
      opacity: 1; }
      #rotating-gallery > li.current img {
        width: 480px;
        height: 326px; }
    #rotating-gallery > li.right2 {
      left: 698px;
      z-index: 9;
      bottom: 0px; }
    #rotating-gallery > li.right1 {
      left: 568px;
      z-index: 99;
      opacity: 0.9;
      bottom: 20px; }
    #rotating-gallery > li.left1 {
      left: 180px;
      z-index: 99;
      opacity: 0.9;
      bottom: 20px; }
    #rotating-gallery > li.left2 {
      left: 50px;
      z-index: 9;
      bottom: 0px; }

.arrow {
  width: 71px;
  height: 70px;
  display: block;
  position: absolute;
  background-image: url(../images/button_arrow.png);
  bottom: 145px;
  cursor: pointer;
  z-index: 99999; }
  .arrow.left {
    left: 0; }
  .arrow.right {
    right: 0;
    background-position: right center; }

#recommend > .content {
  height: 590px;
  background: url(../images/recommend.png) no-repeat left top 40px; }
  #recommend > .content > .recommend-list {
    width: 700px;
    display: block;
    left: 440px; }
    #recommend > .content > .recommend-list li {
      height: 92px; }
      #recommend > .content > .recommend-list li .index {
        display: block;
        width: 50px;
        height: 50px;
        background-color: #237DE3;
        border-radius: 3px;
        text-align: center;
        line-height: 50px;
        color: #FFF;
        font-size: 32px;
        float: left;
        margin-right: 20px; }
      #recommend > .content > .recommend-list li .text {
        font-size: 16px;
        color: #666;
        float: left; }
        #recommend > .content > .recommend-list li .text .title {
          font-size: 19px;
          font-weight: bold;
          color: #237DE3;
          display: block;
          margin-bottom: 4px; }
  #recommend > .content > .recommend-text {
    width: 100%;
    margin: 0 auto;
    height: 96px;
    font-size: 16px;
    line-height: 40px;
    color: #666;
    text-align: center;
    top: 470px; }