@charset "utf-8";

.container::after,
.row::after,
.container::before,
.row::before {
  display: none;
}

@media (min-width: 800px) {
  * {
    box-sizing: content-box;
  }

  html,
  body,
  div,
  p,
  ul,
  ol,
  li,
  dl,
  dt,
  dd,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  form,
  input,
  select,
  button,
  textarea,
  iframe,
  table,
  th,
  td {
    margin: 0;
    padding: 0;
  }

  img {
    border: 0 none;
    vertical-align: top;
  }

  ul,
  li,
  dl,
  dd,
  dt {
    list-style-type: none;
  }

  i,
  em,
  cite {
    font-style: normal;
  }

  body {
    -webkit-text-size-adjust: none;
    font-family: "Microsoft YaHei";
  }

  a {
    text-decoration: none;
  }

  .clear,
  .cle {
    clear: both;
  }

  a:focus {
    outline: none;
  }

  .animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  }

  .i_tcase_img .animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
  }

  .animated.maxtime {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
  }

  @-webkit-keyframes fadeInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
  }

  @-webkit-keyframes fadeInLeftBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-200%);
      transform: translateX(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInLeftBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-200%);
      transform: translateX(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig;
  }

  @-webkit-keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }

  @-webkit-keyframes fadeInRightBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(200%);
      transform: translateX(200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInRightBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(200%);
      transform: translateX(200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig;
  }

  @-webkit-keyframes fadeInTop {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-100%);
      transform: translateY(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes fadeInTop {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-100%);
      transform: translateY(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  .fadeInTop {
    -webkit-animation-name: fadeInTop;
    animation-name: fadeInTop;
  }

  @-webkit-keyframes fadeInTopBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-200%);
      transform: translateY(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes fadeInTopBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-200%);
      transform: translateY(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  .fadeInTopBig {
    -webkit-animation-name: fadeInTopBig;
    animation-name: fadeInTopBig;
  }

  @-webkit-keyframes fadeInBottom {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      transform: translateY(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes fadeInBottom {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      transform: translateY(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  .fadeInBottom {
    -webkit-animation-name: fadeInBottom;
    animation-name: fadeInBottom;
  }

  @-webkit-keyframes shake {

    0%,
    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translateX(10px);
      transform: translateX(10px)
    }
  }

  @keyframes shake {

    0%,
    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translateX(-10px);
      -ms-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translateX(10px);
      -ms-transform: translateX(10px);
      transform: translateX(10px)
    }
  }

  .shake {
    opacity: 1;
    -webkit-animation-name: shake;
    animation-name: shake
  }

  @-webkit-keyframes swing {
    20% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg)
    }

    40% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg)
    }

    60% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    80% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    100% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg)
    }
  }

  @keyframes swing {
    20% {
      -webkit-transform: rotate(15deg);
      -ms-transform: rotate(15deg);
      transform: rotate(15deg)
    }

    40% {
      -webkit-transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
      transform: rotate(-10deg)
    }

    60% {
      -webkit-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    80% {
      -webkit-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    100% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg)
    }
  }

  .swing {
    opacity: 1;
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
  }

  @-webkit-keyframes tada {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    10%,
    20% {
      -webkit-transform: scale(0.9) rotate(-3deg);
      transform: scale(0.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale(1.1) rotate(3deg);
      transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
      -webkit-transform: scale(1.1) rotate(-3deg);
      transform: scale(1.1) rotate(-3deg)
    }

    100% {
      -webkit-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0)
    }
  }

  @keyframes tada {
    0% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }

    10%,
    20% {
      -webkit-transform: scale(0.9) rotate(-3deg);
      -ms-transform: scale(0.9) rotate(-3deg);
      transform: scale(0.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale(1.1) rotate(3deg);
      -ms-transform: scale(1.1) rotate(3deg);
      transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
      -webkit-transform: scale(1.1) rotate(-3deg);
      -ms-transform: scale(1.1) rotate(-3deg);
      transform: scale(1.1) rotate(-3deg)
    }

    100% {
      -webkit-transform: scale(1) rotate(0);
      -ms-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0)
    }
  }

  . {
    opacity: 1;
    -webkit-animation-name: tada;
    animation-name: tada
  }

  @keyframes fadeMoveLeft {
    from {
      margin-left: 3px;
    }

    to {
      margin-left: -6px;
    }
  }

  @-moz-keyframes fadeMoveLeft {
    from {
      margin-left: 3px;
    }

    to {
      margin-left: -6px;
    }
  }

  @-webkit-keyframes fadeMoveLeft {
    from {
      margin-left: 3px;
    }

    to {
      margin-left: -6px;
    }
  }

  .fadeMoveLeft {
    animation: fadeMoveLeft 0.5s infinite;
    -moz-animation: fadeMoveLeft 0.5s infinite;
    -webkit-animation: fadeMoveLeft 0.5s infinite;
  }

  @keyframes fadeMoveRight {
    from {
      margin-left: -3px;
    }

    to {
      margin-left: 6px;
    }
  }

  @-moz-keyframes fadeMoveRight {
    from {
      margin-left: -3px;
    }

    to {
      margin-left: 6px;
    }
  }

  @-webkit-keyframes fadeMoveRight {
    from {
      margin-left: -3px;
    }

    to {
      margin-left: 6px;
    }
  }

  .fadeMoveRight {
    animation: fadeMoveRight 0.5s infinite;
    -moz-animation: fadeMoveRight 0.5s infinite;
    -webkit-animation: fadeMoveRight 0.5s infinite;
  }

  @-webkit-keyframes lightSpeedIn {
    0% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }

    60% {
      -webkit-transform: translateX(-20%) skewX(30deg);
      transform: translateX(-20%) skewX(30deg);
      opacity: 1
    }

    80% {
      -webkit-transform: translateX(0%) skewX(-15deg);
      transform: translateX(0%) skewX(-15deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }
  }

  @keyframes lightSpeedIn {
    0% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      -ms-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }

    60% {
      -webkit-transform: translateX(-20%) skewX(30deg);
      -ms-transform: translateX(-20%) skewX(30deg);
      transform: translateX(-20%) skewX(30deg);
      opacity: 1
    }

    80% {
      -webkit-transform: translateX(0%) skewX(-15deg);
      -ms-transform: translateX(0%) skewX(-15deg);
      transform: translateX(0%) skewX(-15deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(0%) skewX(0deg);
      -ms-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }
  }

  .lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  @-webkit-keyframes flipInY {
    0% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateY(-10deg);
      transform: perspective(400px) rotateY(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateY(10deg);
      transform: perspective(400px) rotateY(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }
  }

  @keyframes flipInY {
    0% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      -ms-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateY(-180deg);
      -ms-transform: perspective(400px) rotateY(-180deg);
      transform: perspective(400px) rotateY(-180deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateY(180deg);
      -ms-transform: perspective(400px) rotateY(180deg);
      transform: perspective(400px) rotateY(180deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      -ms-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }
  }

  .flipInY {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
  }

  @-webkit-keyframes flipInX {
    0% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateX(-10deg);
      transform: perspective(400px) rotateX(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateX(10deg);
      transform: perspective(400px) rotateX(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }
  }

  @keyframes flipInX {
    0% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      -ms-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateX(-10deg);
      -ms-transform: perspective(400px) rotateX(-10deg);
      transform: perspective(400px) rotateX(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateX(10deg);
      -ms-transform: perspective(400px) rotateX(10deg);
      transform: perspective(400px) rotateX(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      -ms-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }
  }

  .flipInX {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
  }

  @-webkit-keyframes pulse {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0)
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }
  }

  @keyframes pulse {
    0% {
      -webkit-transform: scale(0);
      -ms-transform: scale(0);
      transform: scale(0)
    }

    100% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }
  }

  .pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
  }

  @-webkit-keyframes show {
    0% {
      opacity: 0;
    }

    100% {
      opacity: 1;
    }
  }

  @keyframes show {
    0% {
      opacity: 0;
    }

    100% {
      opacity: 1;
    }
  }

  .show {
    -webkit-animation-name: show;
    animation-name: show;
  }

  .revealOnScroll {
    opacity: 0;
  }



  .t_ver {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    display: none;
  }

  .t_ver ul {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 9999;
  }

  .t_ver li {
    float: left;
    margin: 0px 5px;
  }

  .t_ver a {
    display: block;
    font-size: 12px;
    color: #333;
    line-height: 30px;
  }

  .t_ver a:hover {
    color: #174596;
  }


  .t_logo {
    position: absolute;
    top: 15px;
    left: 0px;
  }

  .t_logo img {
    width: 131px;
    height: 44px;
    border: 0px;
  }


  .top {
    width: 100%;
    z-index: 99;
    position: relative;
    height: 74px;
    border-bottom: 1px solid #dddddd;
  }

  .t_t {
    position: relative;
    z-index: 100;
    width: 1200px;
    margin: 0 auto;
    height: 74px;
  }

  .t_curr {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
  }



  .xn_ba_banner {
    width: 100%;
    height: 768px;
    position: relative;
    background: #000;
    overflow: hidden;
    min-width: 1200px;
  }

  .banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;

    height: 100%;
  }

  .focus {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-position: center center;
    display: none;
  }

  .focus img {
    display: block;
    height: 100%;
  }

  .logo-c {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 10;
    color: #fff;
    border-top: 1px solid transparent;
    display: none;
  }

  .logo-img {
    display: block;
    width: 266px;
    position: absolute;
    left: 50%;
    margin-left: -133px;
    top: 25%;
  }

  .slogan {
    text-align: center;
    font-size: 32px;
    top: 38%;
    position: absolute;
    width: 1000px;
    left: 50%;
    margin-left: -500px;
    color: #f6f6f6;
  }

  .slogan span {
    display: block;
  }

  .slogan2 {
    margin-top: 15px;
    font-size: 12px;
    opacity: 0.6;
    text-transform: uppercase;
  }

  .logo-c .return {
    text-align: center;
    font-size: 20px;
    top: 61%;
    position: absolute;
    width: 1000px;
    left: 50%;
    margin-left: -500px;
  }

  .logo-c .return a {
    color: #fff;
  }

  .logo-c .language {
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 16px;
    color: #fff;
    bottom: 100px;
  }

  .logo-c .language a {
    color: #fff;
    line-height: 30px;
    margin: 0px 5px;
  }

  .logo-c .language a:hover {
    color: #174596;
  }

  .langage_box {
    display: inline-block;
    padding: 0px 15px;
    border-radius: 8px;
    background: #605f60;
  }

  .nav {
    text-align: center;
    font-size: 0;
    position: absolute;
    width: 1000px;
    margin-left: -500px;
    left: 50%;
    top: 60%;
  }

  .nav-item {
    width: 115px;
    height: 115px;
    display: inline-block;
    font-size: 14px;
    text-align: center;
    margin-right: 14px;
    color: #f6f6f6;
    background: rgba(255, 255, 255, .3);
    -o-border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
  }

  .nav-item:last-child {
    margin-right: 0;
  }

  .nav-item:hover {
    background: rgba(23, 69, 146, .8);
    text-decoration: none;
  }

  .nav-ico {
    padding-top: 75px;
    font-size: 16px;
  }

  .nav0 {
    background: url(/public/image/nav0.png) no-repeat center top 20px;
  }

  .nav1,
  .nav37 {

    background: url(/public/image/nav1.png) no-repeat center top 20px;
  }

  .nav8,
  .nav38 {

    background: url(/public/image/nav2.png) no-repeat center top 20px;
  }

  .nav14,
  .nav39 {
    background: url(/public/image/nav3.png) no-repeat center top 20px;
  }

  .nav15,
  .nav40 {
    background: url(/public/image/nav4.png) no-repeat center top 20px;
  }

  .nav16,
  .nav41 {
    background: url(/public/image/nav5.png) no-repeat center top 20px;
  }

  .handle {
    position: absolute;
    width: 100%;
    bottom: 48px;
    text-align: center;
    font-size: 0;
    z-index: 10;
  }

  .handle-item {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(/public/image/handle.png) no-repeat center center;
    margin: 0 10px;
  }

  .handle-item:hover,
  .handle-item.on {
    background: url(/public/image/handle_hover.png) no-repeat center center;
  }



  .xn_c_index_23_wrap {
    width: 100%;
  }

  .xn_c_index_23_bigbox {
    width: 1200px;
    margin: 0 auto;
  }

  .xn_c_index_23_fltitle {
    text-align: center;
    padding-top: 56px;
  }

  .xn_c_index_23_cName {
    display: block;
    font-size: 26px;
    color: #333333;
    margin-bottom: 5px;
  }

  .xn_c_index_23_eName {
    font-size: 12px;
    color: #999999;
    text-transform: uppercase;
    margin: 0px 5px;
    line-height: 24px;
  }

  .xn_c_index_23_topmore {
    display: none;
  }

  .xn_c_index_23_line {
    display: inline-block;
    font-size: 0px;
    width: 20px;
    height: 1px;
    background: #999999;
    position: relative;
    top: -4px;
  }

  .xn_c_index_23_contbox2 {
    display: inline-block;
    width: 123px;
    height: 123px;
    background: url(/public/image/pro_type.png) no-repeat center center;
    text-align: center;
    line-height: 123px;
    margin: 0px 13px;
    opacity: 0;
  }

  .xn_c_index_23_contbox {
    text-align: center;
    margin-top: 40px;
  }

  .xn_c_index_23_contbox2 a {
    display: block;
    width: 123px;
    height: 123px;
    font-size: 16px;
    color: #333333;
  }

  .xn_c_index_23_contbox2:hover,
  .xn_c_index_23_contbox2.curr {
    background: url(/public/image/pro_type_hover.png) no-repeat center center;
  }

  .xn_c_index_23_contbox2:hover a,
  .xn_c_index_23_contbox2.curr a {
    color: #fff;
  }

  .xn_c_index_23_contbox2.curr {
    opacity: 1;
  }


  .xn_c_index_24_wrap {
    width: 100%;
  }

  .xn_c_index_24_bigbox {
    width: 1200px;
    margin: 0 auto;
  }

  .xn_c_index_24_fltitle {
    text-align: center;
    padding-top: 56px;
  }

  .xn_c_index_24_cName {
    display: block;
    font-size: 26px;
    color: #333333;
    margin-bottom: 5px;
  }

  .xn_c_index_24_eName {
    font-size: 12px;
    color: #999999;
    text-transform: uppercase;
    margin: 0px 5px;
    line-height: 24px;
  }

  .xn_c_index_24_topmore {
    display: none;
  }

  .xn_c_index_24_line {
    display: inline-block;
    font-size: 0px;
    width: 20px;
    height: 1px;
    background: #999999;
    position: relative;
    top: -4px;
  }

  .xn_c_index_24_contbox2 {
    display: inline-block;
    width: 123px;
    height: 123px;
    background: url(/public/image/pro_type.png) no-repeat center center;
    text-align: center;
    /* line-height: 123px; */
    margin: 0px 13px;
    opacity: 0;
  }
	
	.enspan {
		font-size: 12px;
	}
	
	.xn_c_index_24_contbox2>a>span {
		display: block;
		padding: 45px 0;
	}

  .xn_c_index_24_contbox {
    text-align: center;
    margin-top: 40px;
  }

  .xn_c_index_24_contbox2 a {
    display: block;
    width: 123px;
    height: 123px;
    font-size: 16px;
    color: #333333;
  }

  .xn_c_index_24_contbox2:hover,
  .xn_c_index_24_contbox2.curr {
    background: url(/public/image/pro_type_hover.png) no-repeat center center;
  }

  .xn_c_index_24_contbox2:hover a,
  .xn_c_index_24_contbox2.curr a {
    color: #fff;
  }

  .xn_c_index_24_contbox2.curr {
    opacity: 1;
  }


  .i_tcase {
    width: 100%;
    padding-bottom: 50px;
  }

  .i_tcase_f {
    width: 1200px;
    margin: 0 auto;
  }

  .i_tcase_t {
    text-align: center;
    padding-top: 87px;
  }

  .i_tcase_t1 {
    display: block;
    font-size: 26px;
    color: #333333;
    margin-bottom: 5px;
  }

  .i_tcase_t3 {
    font-size: 12px;
    color: #999999;
    text-transform: uppercase;
    margin: 0px 5px;
    line-height: 24px;
  }

  .i_tcase_t2 {
    display: inline-block;
    font-size: 0px;
    width: 20px;
    height: 1px;
    background: #999999;
    position: relative;
    top: -4px;
  }

  .i_tcase_tc {
    font-size: 14px;
    color: #666;
    line-height: 24px;
    text-align: center;
    margin-top: 20px;
    width: 780px;
    margin: 0 auto;
  }

  .i_tcase_m {
    margin-top: 40px;
    overflow: hidden;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		align-items: center;
  }

  .i_tcase_m img {
    width: 10%;
  }

  .i_tcase_main {
    width: 190px;
    float: left;
    overflow: hidden;
    margin: 0px 25px;
  }

  .i_tcase_img {
    width: 190px;
    height: 165px;
    overflow: hidden;
    padding-left: 20px;
    padding-top: 20px;
    box-sizing: content-box;
  }

  .i_tcase_img img {
    width: 149px;
    height: 149px;
    -webkit-transition: all .6s ease-out;
    -o-transition: all .6s ease-out;
    transition: all .6s ease-out;
  }

  .i_tcase_main_name a {
    margin-top: 10px;
    display: block;
    width: 190px;
    font-size: 18px;
    color: #666666;
    line-height: 24px;
    font-weight: bold;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    -moz-binding: url('ellipsis.xml#ellipsis');
  }

  .i_tcase_main_cnt2 {
    display: block;
    width: 190px;
    font-size: 14px;
    color: #999999;
    line-height: 20px;
    text-align: center;
    height: 40px;
    overflow: hidden;
    margin-top: 10px;
  }

  .i_tcase_main:hover .i_tcase_main_name a {
    color: #174596;
  }

  .i_tcase_main:hover .i_tcase_main_cnt2 {
    color: #174596;
  }

  .i_tcase_main:hover .i_tcase_img img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }


  .index_cnt {
    width: 100%;
    
  }

  .index_cnt_m {
    width: 100%;
    position: relative;
    margin: 0 auto;
  }

  .index_cnt {
    width: 100%;
  }

  .index_cnt_m {
    width: 100%;
    position: relative;
    margin: 0 auto;
  }

  .index_body {
    min-width: 1200px;
    overflow-x: hidden;
  }

  .revealOnScroll {
    opacity: 0;
  }

  .animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
  }

  .animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
  }

  .animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
  }

  @-webkit-keyframes bounce {

    0%,
    100%,
    20%,
    50%,
    80% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    40% {
      -webkit-transform: translateY(-30px);
      transform: translateY(-30px)
    }

    60% {
      -webkit-transform: translateY(-15px);
      transform: translateY(-15px)
    }
  }

  @keyframes bounce {

    0%,
    100%,
    20%,
    50%,
    80% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    40% {
      -webkit-transform: translateY(-30px);
      -ms-transform: translateY(-30px);
      transform: translateY(-30px)
    }

    60% {
      -webkit-transform: translateY(-15px);
      -ms-transform: translateY(-15px);
      transform: translateY(-15px)
    }
  }

  .bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce
  }

  @-webkit-keyframes flash {

    0%,
    100%,
    50% {
      opacity: 1
    }

    25%,
    75% {
      opacity: 0
    }
  }

  @keyframes flash {

    0%,
    100%,
    50% {
      opacity: 1
    }

    25%,
    75% {
      opacity: 0
    }
  }

  .flash {
    -webkit-animation-name: flash;
    animation-name: flash
  }

  @-webkit-keyframes pulse {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    50% {
      -webkit-transform: scale(1.1);
      transform: scale(1.1)
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }
  }

  @keyframes pulse {
    0% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }

    50% {
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1)
    }

    100% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }
  }

  .pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
  }

  @-webkit-keyframes rubberBand {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    30% {
      -webkit-transform: scaleX(1.25) scaleY(0.75);
      transform: scaleX(1.25) scaleY(0.75)
    }

    40% {
      -webkit-transform: scaleX(0.75) scaleY(1.25);
      transform: scaleX(0.75) scaleY(1.25)
    }

    60% {
      -webkit-transform: scaleX(1.15) scaleY(0.85);
      transform: scaleX(1.15) scaleY(0.85)
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }
  }

  @keyframes rubberBand {
    0% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }

    30% {
      -webkit-transform: scaleX(1.25) scaleY(0.75);
      -ms-transform: scaleX(1.25) scaleY(0.75);
      transform: scaleX(1.25) scaleY(0.75)
    }

    40% {
      -webkit-transform: scaleX(0.75) scaleY(1.25);
      -ms-transform: scaleX(0.75) scaleY(1.25);
      transform: scaleX(0.75) scaleY(1.25)
    }

    60% {
      -webkit-transform: scaleX(1.15) scaleY(0.85);
      -ms-transform: scaleX(1.15) scaleY(0.85);
      transform: scaleX(1.15) scaleY(0.85)
    }

    100% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }
  }

  .rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
  }

  @-webkit-keyframes shake {

    0%,
    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translateX(10px);
      transform: translateX(10px)
    }
  }

  @keyframes shake {

    0%,
    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translateX(-10px);
      -ms-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translateX(10px);
      -ms-transform: translateX(10px);
      transform: translateX(10px)
    }
  }

  .shake {
    -webkit-animation-name: shake;
    animation-name: shake
  }

  @-webkit-keyframes swing {
    20% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg)
    }

    40% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg)
    }

    60% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    80% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    100% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg)
    }
  }

  @keyframes swing {
    20% {
      -webkit-transform: rotate(15deg);
      -ms-transform: rotate(15deg);
      transform: rotate(15deg)
    }

    40% {
      -webkit-transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
      transform: rotate(-10deg)
    }

    60% {
      -webkit-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    80% {
      -webkit-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    100% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg)
    }
  }

  .swing {
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
  }

  @-webkit-keyframes tada {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    10%,
    20% {
      -webkit-transform: scale(0.9) rotate(-3deg);
      transform: scale(0.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale(1.1) rotate(3deg);
      transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
      -webkit-transform: scale(1.1) rotate(-3deg);
      transform: scale(1.1) rotate(-3deg)
    }

    100% {
      -webkit-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0)
    }
  }

  @keyframes tada {
    0% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }

    10%,
    20% {
      -webkit-transform: scale(0.9) rotate(-3deg);
      -ms-transform: scale(0.9) rotate(-3deg);
      transform: scale(0.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale(1.1) rotate(3deg);
      -ms-transform: scale(1.1) rotate(3deg);
      transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
      -webkit-transform: scale(1.1) rotate(-3deg);
      -ms-transform: scale(1.1) rotate(-3deg);
      transform: scale(1.1) rotate(-3deg)
    }

    100% {
      -webkit-transform: scale(1) rotate(0);
      -ms-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0)
    }
  }

  .tada {
    -webkit-animation-name: tada;
    animation-name: tada
  }

  @-webkit-keyframes wobble {
    0% {
      -webkit-transform: translateX(0%);
      transform: translateX(0%)
    }

    15% {
      -webkit-transform: translateX(-25%) rotate(-5deg);
      transform: translateX(-25%) rotate(-5deg)
    }

    30% {
      -webkit-transform: translateX(20%) rotate(3deg);
      transform: translateX(20%) rotate(3deg)
    }

    45% {
      -webkit-transform: translateX(-15%) rotate(-3deg);
      transform: translateX(-15%) rotate(-3deg)
    }

    60% {
      -webkit-transform: translateX(10%) rotate(2deg);
      transform: translateX(10%) rotate(2deg)
    }

    75% {
      -webkit-transform: translateX(-5%) rotate(-1deg);
      transform: translateX(-5%) rotate(-1deg)
    }

    100% {
      -webkit-transform: translateX(0%);
      transform: translateX(0%)
    }
  }

  @keyframes wobble {
    0% {
      -webkit-transform: translateX(0%);
      -ms-transform: translateX(0%);
      transform: translateX(0%)
    }

    15% {
      -webkit-transform: translateX(-25%) rotate(-5deg);
      -ms-transform: translateX(-25%) rotate(-5deg);
      transform: translateX(-25%) rotate(-5deg)
    }

    30% {
      -webkit-transform: translateX(20%) rotate(3deg);
      -ms-transform: translateX(20%) rotate(3deg);
      transform: translateX(20%) rotate(3deg)
    }

    45% {
      -webkit-transform: translateX(-15%) rotate(-3deg);
      -ms-transform: translateX(-15%) rotate(-3deg);
      transform: translateX(-15%) rotate(-3deg)
    }

    60% {
      -webkit-transform: translateX(10%) rotate(2deg);
      -ms-transform: translateX(10%) rotate(2deg);
      transform: translateX(10%) rotate(2deg)
    }

    75% {
      -webkit-transform: translateX(-5%) rotate(-1deg);
      -ms-transform: translateX(-5%) rotate(-1deg);
      transform: translateX(-5%) rotate(-1deg)
    }

    100% {
      -webkit-transform: translateX(0%);
      -ms-transform: translateX(0%);
      transform: translateX(0%)
    }
  }

  .wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
  }

  @-webkit-keyframes bounceIn {
    0% {
      opacity: 0;
      -webkit-transform: scale(.3);
      transform: scale(.3)
    }

    50% {
      opacity: 1;
      -webkit-transform: scale(1.05);
      transform: scale(1.05)
    }

    70% {
      -webkit-transform: scale(.9);
      transform: scale(.9)
    }

    100% {
      opacity: 1;
      -webkit-transform: scale(1);
      transform: scale(1)
    }
  }

  @keyframes bounceIn {
    0% {
      opacity: 0;
      -webkit-transform: scale(.3);
      -ms-transform: scale(.3);
      transform: scale(.3)
    }

    50% {
      opacity: 1;
      -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
      transform: scale(1.05)
    }

    70% {
      -webkit-transform: scale(.9);
      -ms-transform: scale(.9);
      transform: scale(.9)
    }

    100% {
      opacity: 1;
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }
  }

  .bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn
  }

  @-webkit-keyframes bounceInDown {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateY(30px);
      transform: translateY(30px)
    }

    80% {
      -webkit-transform: translateY(-10px);
      transform: translateY(-10px)
    }

    100% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes bounceInDown {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      -ms-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateY(30px);
      -ms-transform: translateY(30px);
      transform: translateY(30px)
    }

    80% {
      -webkit-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
      transform: translateY(-10px)
    }

    100% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
  }

  @-webkit-keyframes bounceInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateX(30px);
      transform: translateX(30px)
    }

    80% {
      -webkit-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes bounceInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      -ms-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateX(30px);
      -ms-transform: translateX(30px);
      transform: translateX(30px)
    }

    80% {
      -webkit-transform: translateX(-10px);
      -ms-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
  }

  @-webkit-keyframes bounceInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      transform: translateX(2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateX(-30px);
      transform: translateX(-30px)
    }

    80% {
      -webkit-transform: translateX(10px);
      transform: translateX(10px)
    }

    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes bounceInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      -ms-transform: translateX(2000px);
      transform: translateX(2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateX(-30px);
      -ms-transform: translateX(-30px);
      transform: translateX(-30px)
    }

    80% {
      -webkit-transform: translateX(10px);
      -ms-transform: translateX(10px);
      transform: translateX(10px)
    }

    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
  }

  @-webkit-keyframes bounceInUp {
    0% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      transform: translateY(2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateY(-30px);
      transform: translateY(-30px)
    }

    80% {
      -webkit-transform: translateY(10px);
      transform: translateY(10px)
    }

    100% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes bounceInUp {
    0% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      -ms-transform: translateY(2000px);
      transform: translateY(2000px)
    }

    60% {
      opacity: 1;
      -webkit-transform: translateY(-30px);
      -ms-transform: translateY(-30px);
      transform: translateY(-30px)
    }

    80% {
      -webkit-transform: translateY(10px);
      -ms-transform: translateY(10px);
      transform: translateY(10px)
    }

    100% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
  }

  @-webkit-keyframes bounceOut {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    25% {
      -webkit-transform: scale(.95);
      transform: scale(.95)
    }

    50% {
      opacity: 1;
      -webkit-transform: scale(1.1);
      transform: scale(1.1)
    }

    100% {
      opacity: 0;
      -webkit-transform: scale(.3);
      transform: scale(.3)
    }
  }

  @keyframes bounceOut {
    0% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }

    25% {
      -webkit-transform: scale(.95);
      -ms-transform: scale(.95);
      transform: scale(.95)
    }

    50% {
      opacity: 1;
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1)
    }

    100% {
      opacity: 0;
      -webkit-transform: scale(.3);
      -ms-transform: scale(.3);
      transform: scale(.3)
    }
  }

  .bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut
  }

  @-webkit-keyframes bounceOutDown {
    0% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      transform: translateY(2000px)
    }
  }

  @keyframes bounceOutDown {
    0% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
      transform: translateY(-20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      -ms-transform: translateY(2000px);
      transform: translateY(2000px)
    }
  }

  .bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
  }

  @-webkit-keyframes bounceOutLeft {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateX(20px);
      transform: translateX(20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }
  }

  @keyframes bounceOutLeft {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateX(20px);
      -ms-transform: translateX(20px);
      transform: translateX(20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      -ms-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }
  }

  .bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
  }

  @-webkit-keyframes bounceOutRight {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateX(-20px);
      transform: translateX(-20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      transform: translateX(2000px)
    }
  }

  @keyframes bounceOutRight {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateX(-20px);
      -ms-transform: translateX(-20px);
      transform: translateX(-20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      -ms-transform: translateX(2000px);
      transform: translateX(2000px)
    }
  }

  .bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
  }

  @-webkit-keyframes bounceOutUp {
    0% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateY(20px);
      transform: translateY(20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }
  }

  @keyframes bounceOutUp {
    0% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    20% {
      opacity: 1;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      -ms-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }
  }

  .bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp
  }

  @-webkit-keyframes fadeIn {
    0% {
      opacity: 0
    }

    100% {
      opacity: 1
    }
  }

  @keyframes fadeIn {
    0% {
      opacity: 0
    }

    100% {
      opacity: 1
    }
  }

  .fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
  }

  @-webkit-keyframes fadeInDown {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes fadeInDown {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
      transform: translateY(-20px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
  }

  @-webkit-keyframes fadeInDownBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes fadeInDownBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      -ms-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
  }

  @-webkit-keyframes fadeInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-20px);
      transform: translateX(-20px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes fadeInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-20px);
      -ms-transform: translateX(-20px);
      transform: translateX(-20px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
  }

  @-webkit-keyframes fadeInLeftBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes fadeInLeftBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      -ms-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
  }

  @-webkit-keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      transform: translateX(20px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      -ms-transform: translateX(20px);
      transform: translateX(20px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
  }

  @-webkit-keyframes fadeInRightBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      transform: translateX(2000px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes fadeInRightBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      -ms-transform: translateX(2000px);
      transform: translateX(2000px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
  }

  @-webkit-keyframes fadeInUp {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      transform: translateY(100%)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes fadeInUp {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
      transform: translateY(100%)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
  }

  @-webkit-keyframes fadeInUpBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(40px);
      transform: translateY(40px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes fadeInUpBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(40px);
      -ms-transform: translateY(40px);
      transform: translateY(40px)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig
  }

  @-webkit-keyframes fadeOut {
    0% {
      opacity: 1
    }

    100% {
      opacity: 0
    }
  }

  @keyframes fadeOut {
    0% {
      opacity: 1
    }

    100% {
      opacity: 0
    }
  }

  .fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
  }

  @-webkit-keyframes fadeOutDown {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(20px);
      transform: translateY(20px)
    }
  }

  @keyframes fadeOutDown {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
      transform: translateY(20px)
    }
  }

  .fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
  }

  @-webkit-keyframes fadeOutDownBig {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      transform: translateY(2000px)
    }
  }

  @keyframes fadeOutDownBig {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      -ms-transform: translateY(2000px);
      transform: translateY(2000px)
    }
  }

  .fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
  }

  @-webkit-keyframes fadeOutLeft {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-20px);
      transform: translateX(-20px)
    }
  }

  @keyframes fadeOutLeft {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-20px);
      -ms-transform: translateX(-20px);
      transform: translateX(-20px)
    }
  }

  .fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
  }

  @-webkit-keyframes fadeOutLeftBig {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }
  }

  @keyframes fadeOutLeftBig {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      -ms-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }
  }

  .fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
  }

  @-webkit-keyframes fadeOutRight {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      transform: translateX(20px)
    }
  }

  @keyframes fadeOutRight {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      -ms-transform: translateX(20px);
      transform: translateX(20px)
    }
  }

  .fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
  }

  @-webkit-keyframes fadeOutRightBig {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      transform: translateX(2000px)
    }
  }

  @keyframes fadeOutRightBig {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      -ms-transform: translateX(2000px);
      transform: translateX(2000px)
    }
  }

  .fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
  }

  @-webkit-keyframes fadeOutUp {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px)
    }
  }

  @keyframes fadeOutUp {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
      transform: translateY(-20px)
    }
  }

  .fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
  }

  @-webkit-keyframes fadeOutUpBig {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }
  }

  @keyframes fadeOutUpBig {
    0% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      -ms-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }
  }

  .fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
  }

  @-webkit-keyframes flip {
    0% {
      -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
      transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
    }

    40% {
      -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
      transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
    }

    50% {
      -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
      transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
    }

    80% {
      -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
      transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
    }

    100% {
      -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
      transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
    }
  }

  @keyframes flip {
    0% {
      -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
      -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
      transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
    }

    40% {
      -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
      -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
      transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
    }

    50% {
      -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
      -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
      transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
    }

    80% {
      -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
      -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
      transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
    }

    100% {
      -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
      -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
      transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
    }
  }

  .animated.flip {
    -webkit-backface-visibility: visible;
    -ms-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip
  }

  @-webkit-keyframes flipInX {
    0% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateX(-10deg);
      transform: perspective(400px) rotateX(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateX(10deg);
      transform: perspective(400px) rotateX(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }
  }

  @keyframes flipInX {
    0% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      -ms-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateX(-10deg);
      -ms-transform: perspective(400px) rotateX(-10deg);
      transform: perspective(400px) rotateX(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateX(10deg);
      -ms-transform: perspective(400px) rotateX(10deg);
      transform: perspective(400px) rotateX(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      -ms-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }
  }

  .flipInX {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
  }

  @-webkit-keyframes flipInY {
    0% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateY(-10deg);
      transform: perspective(400px) rotateY(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateY(10deg);
      transform: perspective(400px) rotateY(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }
  }

  @keyframes flipInY {
    0% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      -ms-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateY(-10deg);
      -ms-transform: perspective(400px) rotateY(-10deg);
      transform: perspective(400px) rotateY(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateY(10deg);
      -ms-transform: perspective(400px) rotateY(10deg);
      transform: perspective(400px) rotateY(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      -ms-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }
  }

  .flipInY {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
  }

  @-webkit-keyframes flipOutX {
    0% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }
  }

  @keyframes flipOutX {
    0% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      -ms-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      -ms-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }
  }

  .flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important
  }

  @-webkit-keyframes flipOutY {
    0% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }
  }

  @keyframes flipOutY {
    0% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      -ms-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      -ms-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }
  }

  .flipOutY {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY
  }

  @-webkit-keyframes lightSpeedIn {
    0% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }

    60% {
      -webkit-transform: translateX(-20%) skewX(30deg);
      transform: translateX(-20%) skewX(30deg);
      opacity: 1
    }

    80% {
      -webkit-transform: translateX(0%) skewX(-15deg);
      transform: translateX(0%) skewX(-15deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }
  }

  @keyframes lightSpeedIn {
    0% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      -ms-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }

    60% {
      -webkit-transform: translateX(-20%) skewX(30deg);
      -ms-transform: translateX(-20%) skewX(30deg);
      transform: translateX(-20%) skewX(30deg);
      opacity: 1
    }

    80% {
      -webkit-transform: translateX(0%) skewX(-15deg);
      -ms-transform: translateX(0%) skewX(-15deg);
      transform: translateX(0%) skewX(-15deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(0%) skewX(0deg);
      -ms-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }
  }

  .lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  @-webkit-keyframes lightSpeedOut {
    0% {
      -webkit-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }
  }

  @keyframes lightSpeedOut {
    0% {
      -webkit-transform: translateX(0%) skewX(0deg);
      -ms-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      -ms-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }
  }

  .lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  @-webkit-keyframes rotateIn {
    0% {
      -webkit-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(-200deg);
      transform: rotate(-200deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  @keyframes rotateIn {
    0% {
      -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(-200deg);
      -ms-transform: rotate(-200deg);
      transform: rotate(-200deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  .rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
  }

  @-webkit-keyframes rotateInDownLeft {
    0% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  @keyframes rotateInDownLeft {
    0% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  .rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
  }

  @-webkit-keyframes rotateInDownRight {
    0% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  @keyframes rotateInDownRight {
    0% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  .rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
  }

  @-webkit-keyframes rotateInUpLeft {
    0% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  @keyframes rotateInUpLeft {
    0% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  .rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
  }

  @-webkit-keyframes rotateInUpRight {
    0% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  @keyframes rotateInUpRight {
    0% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }

    100% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }
  }

  .rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
  }

  @-webkit-keyframes rotateOut {
    0% {
      -webkit-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(200deg);
      transform: rotate(200deg);
      opacity: 0
    }
  }

  @keyframes rotateOut {
    0% {
      -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
      transform-origin: center center;
      -webkit-transform: rotate(200deg);
      -ms-transform: rotate(200deg);
      transform: rotate(200deg);
      opacity: 0
    }
  }

  .rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
  }

  @-webkit-keyframes rotateOutDownLeft {
    0% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }
  }

  @keyframes rotateOutDownLeft {
    0% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }
  }

  .rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
  }

  @-webkit-keyframes rotateOutDownRight {
    0% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }
  }

  @keyframes rotateOutDownRight {
    0% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }
  }

  .rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
  }

  @-webkit-keyframes rotateOutUpLeft {
    0% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }
  }

  @keyframes rotateOutUpLeft {
    0% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: left bottom;
      -ms-transform-origin: left bottom;
      transform-origin: left bottom;
      -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      opacity: 0
    }
  }

  .rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
  }

  @-webkit-keyframes rotateOutUpRight {
    0% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }
  }

  @keyframes rotateOutUpRight {
    0% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      opacity: 1
    }

    100% {
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      opacity: 0
    }
  }

  .rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
  }

  @-webkit-keyframes slideInDown {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }

    100% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes slideInDown {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      -ms-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }

    100% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
  }

  @-webkit-keyframes slideInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }

    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes slideInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      -ms-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }

    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
  }

  @-webkit-keyframes slideInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      transform: translateX(2000px)
    }

    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }
  }

  @keyframes slideInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      -ms-transform: translateX(2000px);
      transform: translateX(2000px)
    }

    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }
  }

  .slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
  }

  @-webkit-keyframes slideOutLeft {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }
  }

  @keyframes slideOutLeft {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(-2000px);
      -ms-transform: translateX(-2000px);
      transform: translateX(-2000px)
    }
  }

  .slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
  }

  @-webkit-keyframes slideOutRight {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      transform: translateX(2000px)
    }
  }

  @keyframes slideOutRight {
    0% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(2000px);
      -ms-transform: translateX(2000px);
      transform: translateX(2000px)
    }
  }

  .slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
  }

  @-webkit-keyframes slideOutUp {
    0% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }
  }

  @keyframes slideOutUp {
    0% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(-2000px);
      -ms-transform: translateY(-2000px);
      transform: translateY(-2000px)
    }
  }

  .slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
  }

  @-webkit-keyframes slideInUp {
    0% {
      -webkit-transform: translateY(2000px);
      transform: translateY(2000px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }
  }

  @keyframes slideInUp {
    0% {
      -webkit-transform: translateY(2000px);
      -ms-transform: translateY(2000px);
      transform: translateY(2000px)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }
  }

  .slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
  }

  @-webkit-keyframes slideOutDown {
    0% {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      transform: translateY(2000px)
    }
  }

  @keyframes slideOutDown {
    0% {
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateY(2000px);
      -ms-transform: translateY(2000px);
      transform: translateY(2000px)
    }
  }

  .slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
  }

  @-webkit-keyframes hinge {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0);
      -webkit-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out
    }

    20%,
    60% {
      -webkit-transform: rotate(80deg);
      transform: rotate(80deg);
      -webkit-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out
    }

    40% {
      -webkit-transform: rotate(60deg);
      transform: rotate(60deg);
      -webkit-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out
    }

    80% {
      -webkit-transform: rotate(60deg) translateY(0);
      transform: rotate(60deg) translateY(0);
      -webkit-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out;
      opacity: 1
    }

    100% {
      -webkit-transform: translateY(700px);
      transform: translateY(700px);
      opacity: 0
    }
  }

  @keyframes hinge {
    0% {
      -webkit-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
      -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out
    }

    20%,
    60% {
      -webkit-transform: rotate(80deg);
      -ms-transform: rotate(80deg);
      transform: rotate(80deg);
      -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out
    }

    40% {
      -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
      transform: rotate(60deg);
      -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out
    }

    80% {
      -webkit-transform: rotate(60deg) translateY(0);
      -ms-transform: rotate(60deg) translateY(0);
      transform: rotate(60deg) translateY(0);
      -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
      transform-origin: top left;
      -webkit-animation-timing-function: ease-in-out;
      animation-timing-function: ease-in-out;
      opacity: 1
    }

    100% {
      -webkit-transform: translateY(700px);
      -ms-transform: translateY(700px);
      transform: translateY(700px);
      opacity: 0
    }
  }

  .hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge
  }

  @-webkit-keyframes rollIn {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-100%) rotate(-120deg);
      transform: translateX(-100%) rotate(-120deg)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0px) rotate(0deg);
      transform: translateX(0px) rotate(0deg)
    }
  }

  @keyframes rollIn {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-100%) rotate(-120deg);
      -ms-transform: translateX(-100%) rotate(-120deg);
      transform: translateX(-100%) rotate(-120deg)
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0px) rotate(0deg);
      -ms-transform: translateX(0px) rotate(0deg);
      transform: translateX(0px) rotate(0deg)
    }
  }

  .rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
  }

  @-webkit-keyframes rollOut {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0px) rotate(0deg);
      transform: translateX(0px) rotate(0deg)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(100%) rotate(120deg);
      transform: translateX(100%) rotate(120deg)
    }
  }

  @keyframes rollOut {
    0% {
      opacity: 1;
      -webkit-transform: translateX(0px) rotate(0deg);
      -ms-transform: translateX(0px) rotate(0deg);
      transform: translateX(0px) rotate(0deg)
    }

    100% {
      opacity: 0;
      -webkit-transform: translateX(100%) rotate(120deg);
      -ms-transform: translateX(100%) rotate(120deg);
      transform: translateX(100%) rotate(120deg)
    }
  }

  .rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
  }

  .revealOnScroll {
    opacity: 0;
  }

  .animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  }

  .animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
  }

  .animated.maxtime {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
  }

  @-webkit-keyframes fadeInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInLeft {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
  }

  @-webkit-keyframes fadeInLeftBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-200%);
      transform: translateX(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInLeftBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(-200%);
      transform: translateX(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig;
  }

  @-webkit-keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }

  @-webkit-keyframes fadeInRightBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(200%);
      transform: translateX(200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  @keyframes fadeInRightBig {
    0% {
      opacity: 0;
      -webkit-transform: translateX(200%);
      transform: translateX(200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig;
  }

  @-webkit-keyframes fadeInTop {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-100%);
      transform: translateY(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes fadeInTop {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-100%);
      transform: translateY(-100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  .fadeInTop {
    -webkit-animation-name: fadeInTop;
    animation-name: fadeInTop;
  }

  @-webkit-keyframes fadeInTopBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-200%);
      transform: translateY(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes fadeInTopBig {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-200%);
      transform: translateY(-200%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  .fadeInTopBig {
    -webkit-animation-name: fadeInTopBig;
    animation-name: fadeInTopBig;
  }

  @-webkit-keyframes fadeInBottom {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      transform: translateY(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes fadeInBottom {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100%);
      transform: translateY(100%);
    }

    100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  .fadeInBottom {
    -webkit-animation-name: fadeInBottom;
    animation-name: fadeInBottom;
  }

  @-webkit-keyframes shake {

    0%,
    100% {
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translateX(10px);
      transform: translateX(10px)
    }
  }

  @keyframes shake {

    0%,
    100% {
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
      -webkit-transform: translateX(-10px);
      -ms-transform: translateX(-10px);
      transform: translateX(-10px)
    }

    20%,
    40%,
    60%,
    80% {
      -webkit-transform: translateX(10px);
      -ms-transform: translateX(10px);
      transform: translateX(10px)
    }
  }

  .shake {
    opacity: 1;
    -webkit-animation-name: shake;
    animation-name: shake
  }

  @-webkit-keyframes swing {
    20% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg)
    }

    40% {
      -webkit-transform: rotate(-10deg);
      transform: rotate(-10deg)
    }

    60% {
      -webkit-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    80% {
      -webkit-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    100% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg)
    }
  }

  @keyframes swing {
    20% {
      -webkit-transform: rotate(15deg);
      -ms-transform: rotate(15deg);
      transform: rotate(15deg)
    }

    40% {
      -webkit-transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
      transform: rotate(-10deg)
    }

    60% {
      -webkit-transform: rotate(5deg);
      -ms-transform: rotate(5deg);
      transform: rotate(5deg)
    }

    80% {
      -webkit-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
      transform: rotate(-5deg)
    }

    100% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg)
    }
  }

  .swing {
    opacity: 1;
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
  }

  @-webkit-keyframes tada {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    10%,
    20% {
      -webkit-transform: scale(0.9) rotate(-3deg);
      transform: scale(0.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale(1.1) rotate(3deg);
      transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
      -webkit-transform: scale(1.1) rotate(-3deg);
      transform: scale(1.1) rotate(-3deg)
    }

    100% {
      -webkit-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0)
    }
  }

  @keyframes tada {
    0% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }

    10%,
    20% {
      -webkit-transform: scale(0.9) rotate(-3deg);
      -ms-transform: scale(0.9) rotate(-3deg);
      transform: scale(0.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
      -webkit-transform: scale(1.1) rotate(3deg);
      -ms-transform: scale(1.1) rotate(3deg);
      transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
      -webkit-transform: scale(1.1) rotate(-3deg);
      -ms-transform: scale(1.1) rotate(-3deg);
      transform: scale(1.1) rotate(-3deg)
    }

    100% {
      -webkit-transform: scale(1) rotate(0);
      -ms-transform: scale(1) rotate(0);
      transform: scale(1) rotate(0)
    }
  }

  . {
    opacity: 1;
    -webkit-animation-name: tada;
    animation-name: tada
  }

  @keyframes fadeMoveLeft {
    from {
      margin-left: 3px;
    }

    to {
      margin-left: -6px;
    }
  }

  @-moz-keyframes fadeMoveLeft {
    from {
      margin-left: 3px;
    }

    to {
      margin-left: -6px;
    }
  }

  @-webkit-keyframes fadeMoveLeft {
    from {
      margin-left: 3px;
    }

    to {
      margin-left: -6px;
    }
  }

  .fadeMoveLeft {
    animation: fadeMoveLeft 0.5s infinite;
    -moz-animation: fadeMoveLeft 0.5s infinite;
    -webkit-animation: fadeMoveLeft 0.5s infinite;
  }

  @keyframes fadeMoveRight {
    from {
      margin-left: -3px;
    }

    to {
      margin-left: 6px;
    }
  }

  @-moz-keyframes fadeMoveRight {
    from {
      margin-left: -3px;
    }

    to {
      margin-left: 6px;
    }
  }

  @-webkit-keyframes fadeMoveRight {
    from {
      margin-left: -3px;
    }

    to {
      margin-left: 6px;
    }
  }

  .fadeMoveRight {
    animation: fadeMoveRight 0.5s infinite;
    -moz-animation: fadeMoveRight 0.5s infinite;
    -webkit-animation: fadeMoveRight 0.5s infinite;
  }

  @-webkit-keyframes lightSpeedIn {
    0% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }

    60% {
      -webkit-transform: translateX(-20%) skewX(30deg);
      transform: translateX(-20%) skewX(30deg);
      opacity: 1
    }

    80% {
      -webkit-transform: translateX(0%) skewX(-15deg);
      transform: translateX(0%) skewX(-15deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }
  }

  @keyframes lightSpeedIn {
    0% {
      -webkit-transform: translateX(100%) skewX(-30deg);
      -ms-transform: translateX(100%) skewX(-30deg);
      transform: translateX(100%) skewX(-30deg);
      opacity: 0
    }

    60% {
      -webkit-transform: translateX(-20%) skewX(30deg);
      -ms-transform: translateX(-20%) skewX(30deg);
      transform: translateX(-20%) skewX(30deg);
      opacity: 1
    }

    80% {
      -webkit-transform: translateX(0%) skewX(-15deg);
      -ms-transform: translateX(0%) skewX(-15deg);
      transform: translateX(0%) skewX(-15deg);
      opacity: 1
    }

    100% {
      -webkit-transform: translateX(0%) skewX(0deg);
      -ms-transform: translateX(0%) skewX(0deg);
      transform: translateX(0%) skewX(0deg);
      opacity: 1
    }
  }

  .lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  @-webkit-keyframes flipInY {
    0% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateY(-10deg);
      transform: perspective(400px) rotateY(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateY(10deg);
      transform: perspective(400px) rotateY(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }
  }

  @keyframes flipInY {
    0% {
      -webkit-transform: perspective(400px) rotateY(90deg);
      -ms-transform: perspective(400px) rotateY(90deg);
      transform: perspective(400px) rotateY(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateY(-180deg);
      -ms-transform: perspective(400px) rotateY(-180deg);
      transform: perspective(400px) rotateY(-180deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateY(180deg);
      -ms-transform: perspective(400px) rotateY(180deg);
      transform: perspective(400px) rotateY(180deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateY(0deg);
      -ms-transform: perspective(400px) rotateY(0deg);
      transform: perspective(400px) rotateY(0deg);
      opacity: 1
    }
  }

  .flipInY {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
  }

  @-webkit-keyframes flipInX {
    0% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateX(-10deg);
      transform: perspective(400px) rotateX(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateX(10deg);
      transform: perspective(400px) rotateX(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }
  }

  @keyframes flipInX {
    0% {
      -webkit-transform: perspective(400px) rotateX(90deg);
      -ms-transform: perspective(400px) rotateX(90deg);
      transform: perspective(400px) rotateX(90deg);
      opacity: 0
    }

    40% {
      -webkit-transform: perspective(400px) rotateX(-10deg);
      -ms-transform: perspective(400px) rotateX(-10deg);
      transform: perspective(400px) rotateX(-10deg)
    }

    70% {
      -webkit-transform: perspective(400px) rotateX(10deg);
      -ms-transform: perspective(400px) rotateX(10deg);
      transform: perspective(400px) rotateX(10deg)
    }

    100% {
      -webkit-transform: perspective(400px) rotateX(0deg);
      -ms-transform: perspective(400px) rotateX(0deg);
      transform: perspective(400px) rotateX(0deg);
      opacity: 1
    }
  }

  .flipInX {
    -webkit-backface-visibility: visible !important;
    -ms-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
  }

  @-webkit-keyframes pulse {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0)
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1)
    }
  }

  @keyframes pulse {
    0% {
      -webkit-transform: scale(0);
      -ms-transform: scale(0);
      transform: scale(0)
    }

    100% {
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1)
    }
  }

  .pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
  }

  @-webkit-keyframes show {
    0% {
      opacity: 0;
    }

    100% {
      opacity: 1;
    }
  }

  @keyframes show {
    0% {
      opacity: 0;
    }

    100% {
      opacity: 1;
    }
  }

  .show {
    -webkit-animation-name: show;
    animation-name: show;
  }


  .xn_c_index_23_2_wrap {
    width: 100%;
    height: 510px;
    background: #f5f5f5;
    margin-top: 65px;
  }

  .xn_c_index_23_2_wbox {
    width: 1200px;
    height: 510px;
    margin: 0 auto;
    position: relative;
  }

  .xn_c_index_23_2_scroll {
    width: 1200px;
    height: 510px;
    overflow: hidden;
  }

  .xn_c_index_23_2_cLi {
    width: 1200px;
    height: 510px;
    float: left;
  }

  .xn_c_index_23_2_cLi_cbox_left {
    width: 510px;
    height: 510px;
    float: left;
    overflow: hidden;
  }

  .xn_c_index_23_2_cLi_cbox_left img {
    width: 510px;
    height: 510px;
    object-fit: contain;
    -webkit-transition: all .6s ease-out;
    -o-transition: all .6s ease-out;
    transition: all .6s ease-out;
  }

  .xn_c_index_23_2_cLi_cbox_right {
    width: 600px;
    height: 510px;
    float: right;
  }

  .xn_c_index_23_2_cLi_cbox_con {
    padding-top: 110px;
  }

  .xn_c_index_23_2_cLi_title a {
    font-size: 26px;
    color: #333333;
  }

  .xn_c_index_23_2_cLi_title a:hover {
    color: #174596;
  }

  .xn_c_index_23_2_cLi_c {
    font-size: 14px;
    color: #666;
    line-height: 24px;
    width: 600px;
    height: 120px;
    overflow: hidden;
    margin-top: 10px;
  }

  .xn_c_index_23_2_cMain_li {
    width: 134px;
    height: 116px;
    overflow: hidden;
    background: #fff;
    float: left;
    margin-right: 6px;
  }

  .xn_c_index_23_2_cMain_li img {
    width: 134px;
    height: 83px;
    margin-top: 18px;
    -webkit-transition: all .6s ease-out;
    -o-transition: all .6s ease-out;
    transition: all .6s ease-out;
  }

  .xn_c_index_23_2_cMain_li:hover img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }

  .xn_c_index_23_2_cLi_clist_more {
    float: left;
    width: 134px;
    height: 116px;
    overflow: hidden;
    background: #174592;
  }

  .xn_c_index_23_2_cLi_clist_more a {
    display: block;
    float: left;
    width: 134px;
    padding-top: 76px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    background: url(/public/image/prod_more.png) no-repeat center top 25px;
  }

  .xn_c_index_23_2_cLi_left {
    width: 100px;
    height: 100px;
    background: url(/public/image/products_left.png) no-repeat center center;
    position: absolute;
    left: -100px;
    top: 205px;
    background-size: 100%;
    cursor: pointer;
  }

  .xn_c_index_23_2_cLi_right {
    width: 100px;
    height: 100px;
    background: url(/public/image/products_right.png) no-repeat center center;
    position: absolute;
    right: -100px;
    top: 205px;
    background-size: 100%;
    cursor: pointer;
  }

  .xn_c_index_23_2_cul {
    position: relative;
  }

  .xn_c_index_23_2_cLi_left:hover,
  .xn_c_index_23_2_cLi_right:hover {
    opacity: 0.7;
  }

  .xn_c_index_23_2_cLi_cbox_left:hover img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }


  .xn_c_index_24_2_wrap {
    width: 100%;
    height: 510px;
    background: #f5f5f5;
    margin-top: 65px;
  }

  .xn_c_index_24_2_wbox {
    width: 1200px;
    height: 510px;
    margin: 0 auto;
    position: relative;
  }

  .xn_c_index_24_2_scroll {
    width: 1200px;
    height: 510px;
    overflow: hidden;
  }

  .xn_c_index_24_2_cLi {
    width: 1200px;
    height: 510px;
    float: left;
  }

  .xn_c_index_24_2_cLi_cbox_left {
    width: 510px;
    height: 510px;
    float: left;
    overflow: hidden;
  }

  .xn_c_index_24_2_cLi_cbox_left img {
    width: 510px;
    height: 510px;
    -webkit-transition: all .6s ease-out;
    -o-transition: all .6s ease-out;
    transition: all .6s ease-out;
    object-fit: contain;
  }

  .xn_c_index_24_2_cLi_cbox_right {
    width: 600px;
    height: 510px;
    float: right;
  }

  .xn_c_index_24_2_cLi_cbox_con {
    padding-top: 110px;
  }

  .xn_c_index_24_2_cLi_title a {
    font-size: 26px;
    color: #333333;
  }

  .xn_c_index_24_2_cLi_title a:hover {
    color: #175696;
  }

  .xn_c_index_24_2_cLi_c {
    font-size: 14px;
    color: #666;
    line-height: 24px;
    width: 600px;
    height: 120px;
    overflow: hidden;
    margin-top: 10px;
  }

  .xn_c_index_24_2_cMain_li {
    width: 134px;
    height: 116px;
    overflow: hidden;
    background: #fff;
    float: left;
    margin-right: 6px;
  }

  .xn_c_index_24_2_cMain_li img {
    width: 134px;
    height: 83px;
    margin-top: 18px;
    -webkit-transition: all .6s ease-out;
    -o-transition: all .6s ease-out;
    transition: all .6s ease-out;
    object-fit: contain;
    background-color: #fff;
  }

  .xn_c_index_24_2_cMain_li:hover img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }

  .xn_c_index_24_2_cLi_clist_more {
    float: left;
    width: 134px;
    height: 116px;
    overflow: hidden;
    background: #174592;
  }

  .xn_c_index_24_2_cLi_clist_more a {
    display: block;
    float: left;
    width: 134px;
    padding-top: 76px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    background: url(/public/image/prod_more.png) no-repeat center top 25px;
  }

  .xn_c_index_24_2_cLi_left {
    width: 100px;
    height: 100px;
    background: url(/public/image/products_left.png) no-repeat center center;
    position: absolute;
    left: -100px;
    top: 205px;
    background-size: 100%;
    cursor: pointer;
  }

  .xn_c_index_24_2_cLi_right {
    width: 100px;
    height: 100px;
    background: url(/public/image/products_right.png) no-repeat center center;
    position: absolute;
    right: -100px;
    top: 205px;
    background-size: 100%;
    cursor: pointer;
  }

  .xn_c_index_24_2_cul {
    position: relative;
  }

  .xn_c_index_24_2_cLi_left:hover,
  .xn_c_index_24_2_cLi_right:hover {
    opacity: 0.7;
  }

  .xn_c_index_24_2_cLi_cbox_left:hover img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }


  .xn_c_index_about {
    width: 100%;
    height: 540px;
    background: url(/public/image/xn_c_index_about.png) center no-repeat;
  }

  .xn_c_index_about_box {
    width: 1200px;
    margin: 0 auto;
  }

  .xn_c_index_about_top {
    width: 100%;
    line-height: 40px;
    text-align: center;
    color: #333;
    font-weight: bold;
    font-size: 26px;
    padding-top: 70px;
  }

  .xn_c_index_about_line {
    display: block;
    width: 30px;
    height: 2px;
    background: #333;
    margin: 0 auto;
    margin-top: 5px;
  }

  .xn_c_index_about_con {
    line-height: 30px;
    text-align: center;
    color: #666;
    font-size: 14px;
    margin-top: 50px;
  }

  .xn_c_index_about_shu {
    text-align: center;
    margin-top: 20px;
  }

  .xn_c_index_about_shu li {
    width: 295px;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    text-align: center;
  }

  .xn_c_index_about_shu li:first-child {
    background: no-repeat;
  }

  .xn_c_index_about_shut {
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 38px;
    color: #333333;
    font-family: "[HYk1gj]";
  }

  .xn_c_index_about_shut a {
    font-size: 32px;
    color: #333333;
    font-family: "微软雅黑";
    font-weight: bold;
  }

  .xn_c_index_about_shub {
    width: 100%;
    height: 32px;
    line-height: 32px;
    font-size: 17px;
    color: #333;
    margin-top: 12px;
  }

  .xn_c_index_about_more {
    width: 149px;
    height: 41px;
    margin: 55px auto 0;
  }

  .xn_c_index_about_more a {
    display: block;
    width: 136px;
    height: 43px;
    text-align: center;
    color: #666;
    font-size: 14px;
    line-height: 43px;
    border: 1px solid #666;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
  }

  .xn_c_index_about_more a:hover {
    background: #174596;
    color: #fff;
    cursor: pointer;
    -webkit-animation-name: hvr-wobble-vertical;
    animation-name: hvr-wobble-vertical;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
  }

  @-webkit-keyframes hvr-wobble-vertical {
    16.65% {
      -webkit-transform: translateZ(8px);
      transform: translateZ(8px);
    }

    33.3% {
      -webkit-transform: translateZ(-6px);
      transform: translateZ(-6px);
    }

    49.95% {
      -webkit-transform: translateZ(4px);
      transform: translateZ(4px);
    }

    66.6% {
      -webkit-transform: translateZ(-2px);
      transform: translateZ(-2px);
    }

    83.25% {
      -webkit-transform: translateZ(1px);
      transform: translateZ(1px);
    }

    100% {
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
    }
  }

  @keyframes hvr-wobble-vertical {
    16.65% {
      -webkit-transform: translateZ(8px);
      transform: translateZ(8px);
    }

    33.3% {
      -webkit-transform: translateZ(-6px);
      transform: translateZ(-6px);
    }

    49.95% {
      -webkit-transform: translateZ(4px);
      transform: translateZ(4px);
    }

    66.6% {
      -webkit-transform: translateZ(-2px);
      transform: translateZ(-2px);
    }

    83.25% {
      -webkit-transform: translateZ(1px);
      transform: translateZ(1px);
    }

    100% {
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
    }
  }

  .xn_c_index_about_shut:hover {
    cursor: pointer;
    -webkit-animation-name: hvr-wobble-vertical;
    animation-name: hvr-wobble-vertical;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
  }

  @-webkit-keyframes hvr-wobble-vertical {
    16.65% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }

    33.3% {
      -webkit-transform: translateY(-6px);
      transform: translateY(-6px);
    }

    49.95% {
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
    }

    66.6% {
      -webkit-transform: translateY(-2px);
      transform: translateY(-2px);
    }

    83.25% {
      -webkit-transform: translateY(1px);
      transform: translateY(1px);
    }

    100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }

  @keyframes hvr-wobble-vertical {
    16.65% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
    }

    33.3% {
      -webkit-transform: translateY(-6px);
      transform: translateY(-6px);
    }

    49.95% {
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
    }

    66.6% {
      -webkit-transform: translateY(-2px);
      transform: translateY(-2px);
    }

    83.25% {
      -webkit-transform: translateY(1px);
      transform: translateY(1px);
    }

    100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
  }


  .xn_c_index_sv_t {
    text-align: center;
    padding-top: 65px;
  }

  .xn_c_index_sv_t1 {
    display: block;
    font-size: 26px;
    color: #333333;
    margin-bottom: 5px;
  }

  .xn_c_index_sv_t3 {
    font-size: 12px;
    color: #999999;
    text-transform: uppercase;
    margin: 0px 5px;
    line-height: 24px;
  }

  .xn_c_index_sv_t2 {
    display: inline-block;
    font-size: 0px;
    width: 20px;
    height: 1px;
    background: #999999;
    position: relative;
    top: -4px;
  }

  .xn_c_index_sv_tc {
    font-size: 14px;
    color: #666;
    line-height: 24px;
    text-align: center;
    margin-top: 20px;
  }

  .xn_c_index_sv_m {
    width: 1200px;
    margin: 0 auto;
    margin-top: 70px;
    overflow: hidden;
  }

  .xn_c_index_sv_left {
    width: 875px;
    /* height: 575px; */
    float: left;
  }

  .xn_c_index_sv_right {
    width: 275px;
    float: right;
		margin-top: 78px;
  }

  .xn_c_index_sv_limg {
    width: 62px;
    height: 63px;
    /* padding: 3px; */
    background: #fff;
    float: left;
    border-radius: 50%;
  }

  .xn_c_index_sv_limg img {
    width: 62px;
    height: 63px;
		border-radius: 50%;
		image-rendering: -webkit-optimize-contrast;
  }

  .xn_c_index_sv_li {
    width: 275px;
    height: 68px;
    background: #f2f2f2;
    border-radius: 45px;
    overflow: hidden;
    margin-bottom: 12px;
  }

  .xn_c_index_sv_lc {
    width: 173px;
    float: right;
  }

  .xn_c_index_sv_lc_name {
    font-size: 16px;
    color: #333;
    line-height: 25px;
    margin-top: 22px;
  }

  .xn_c_index_sv_lc_c {
    font-size: 12px;
    color: #999;
    margin-top: 3px;
  }


  .xn_c_index_news {
    width: 100%;
  }

  .xn_c_index_news_top {
    text-align: center;
    padding-top: 65px;
  }

  .xn_c_index_news_top1 {
    display: block;
    font-size: 26px;
    color: #333333;
    margin-bottom: 5px;
  }

  .xn_c_index_news_top2 {
    font-size: 12px;
    color: #999999;
    text-transform: uppercase;
    margin: 0px 5px;
    line-height: 24px;
  }

  .xn_c_index_news_line {
    display: inline-block;
    font-size: 0px;
    width: 20px;
    height: 1px;
    background: #999999;
    position: relative;
    top: -4px;
  }


  .xn_c_index_357_wrap {
    width: 1200px;
    height: auto;
    margin: 48px auto 0;
    overflow: hidden;
    height: 336px;
    position: relative;
  }

  .xn_c_index_357_main {
    height: auto;
    overflow: hidden;
    position: relative;
  }

  .xn_c_index_357_inner {
    height: 336px;
    overflow: hidden;
    position: relative;
  }

  .xn_c_index_357_inner ul {
    height: 336px;
    overflow: hidden;
    position: relative;
  }

  .xn_c_index_357_inner li {
    width: 100%;
    height: 336px;
    float: left;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
    z-index: 22;
  }

  .xn_c_index_357_img {
    width: 432px;
    height: 288px;
    overflow: hidden;
    position: absolute;
    left: 42px;
    top: 0;
    z-index: 10;
  }

  .xn_c_index_357_img img {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
  }

  .xn_c_index_357_conbox {
    width: 1200px;
    height: 291px;
    background: #eeeeee;
    margin-top: 45px;
  }

  .xn_c_index_357_conboxc {
    width: 643px;
    float: right;
    margin-right: 40px;
  }

  .xn_c_index_357_tmname {
    display: none !important;
  }

  .xn_c_index_357_inner .xn_c_index_357_ft {
    width: 100%;
    height: 30px;
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 33;
  }

  .xn_c_index_357_inner .xn_c_index_357_title {
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    padding-top: 27px;
    text-align: left;
    box-sizing: content-box;
  }

  .xn_c_index_357_title a {
    font-size: 20px;
    color: #333333;
  }

  .xn_c_index_357_title a:hover {
    color: #174596
  }

  .xn_c_index_357_Date {
    height: 20px;
    line-height: 20px;
    padding-left: 563px;
    width: 92px;
    background: url(/public/image/xn_c_index_357_date.png) left no-repeat;
  }

  .xn_c_index_357_Date>span {
    display: block;
    float: left;
    color: #a0a0a0;
    font-size: 12px;
  }

  .xn_c_index_357_intro {
    height: 104px;
    line-height: 26px;
    margin-top: 6px;
    color: #333333;
    font-size: 12px;
    overflow: hidden;
  }

  .xn_c_index_357_nums {
    overflow: hidden;
    text-align: center;
    position: absolute;
    top: 307px;
    z-index: 30;
    position: absolute;
    left: 230px;
  }

  .xn_c_index_357_nums span {
    width: 9px;
    height: 9px;
    display: inline-block;
    border: 1px solid #174596;
    border-radius: 50%;
    margin-right: 13px;
    cursor: pointer;
  }

  .xn_c_index_357_nums span.curr,
  .xn_c_index_357_nums span:hover {
    background: #174596 !important;
    border: 1px solid #174596;
  }

  .xn_c_index_357_prev,
  .xn_c_index_357_next {
    display: none;
  }

  .xn_c_index_357_more {
    width: 149px;
    height: 41px;
    margin-top: 36px;
    float: right;
  }

  .xn_c_index_357_more a:hover {
    border: 1px solid #fff;
    color: #fff;
    background: #174596;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
  }

  .xn_c_index_357_more a {
    width: 147px;
    height: 39px;
    text-align: center;
    line-height: 39px;
    font-size: 14px;
    display: block;
    border: 1px solid #174596;
    color: #174596;
    background: none;
  }


  .xn_c_index_39_wrap {
    width: 1200px;
    margin: 59px auto 50px;
    overflow: hidden;
  }

  .xn_c_index_39_topbox {
    width: 100%;
    line-height: 30px;
  }

  .xn_c_index_39_newsmore {
    float: right;
  }

  .xn_c_index_39_nrbox {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .xn_c_index_39_nrboxsmall {
    float: left;
    width: 588px;
    height: 125px;
    margin-left: 24px;
    margin-bottom: 34px;
    background: #eeeeee;
  }

  .xn_c_index_39_nrboxsmall0 {
    margin-left: 0 !important;
  }

  .xn_c_index_39_nrboxsmall2 {
    margin-left: 0 !important;
  }

  .xn_c_index_39_lftbox {
    float: left;
    width: 146px;
    height: 103px;
    position: relative;
    padding: 10px 0px;
    padding-left: 12px;
  }

  .xn_c_index_39_img {
    width: 146px;
    height: 103px;
  }

  .xn_c_index_39_lftbox img {
    width: 146px;
    height: 103px;
  }

  .xn_c_index_39_ritbox {
    float: right;
    width: 420px;
    height: 123px;
    background: #eeeeee;
  }

  .xn_c_index_39_nrboxsmall:hover .xn_c_index_39_ritbox {
    background: none;
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee
  }

  .xn_c_index_39_title {
    width: 345px;
    margin-left: 13px;
    margin-top: 6px;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .xn_c_index_39_title a {
    color: #333333;
    font-size: 14px;
    display: block;
    width: 345px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .xn_c_index_39_title a:hover {
    color: #174596;
  }

  .xn_c_index_39_click,
  .xn_c_index_39_more {
    display: none;
  }

  .xn_c_index_39_coent {
    width: 345px;
    height: 44px;
    line-height: 22px;
    overflow: hidden;
    margin-left: 13px;
    font-size: 12px;
    color: #999999;
    margin-top: 15px;
  }

  .xn_c_index_39_time {
    margin-left: 13px;
    font-size: 12px;
    color: #999999;
  }

  .xn_f_21_xhbox {
    float: left;
    font-size: 14px;
    color: #dddddd;
    margin-right: 10px;
  }

  .index_body .xn_f_21_wrap {
    display: block;
  }

  .foot .xn_f_21_xhbox a {
    font-size: 14px;
    color: #dddddd;
  }

  .foot .xn_f_21_xhbox a:hover {
    color: #fff;
    text-decoration: underline;
  }


  .foot_copy {
    width: 1020px;
    float: left;
    font-size: 14px;
    color: #ddd;
    line-height: 24px;
    opacity: 0.34;
    margin-top: 10px;
  }

  .foot .foot_copy_ba a {
    font-size: 14px;
    color: #ddd;
    line-height: 24px;
  }

  .foot .foot_copy_ba a:hover {
    color: #fff;
    opacity: 1 !important;
  }


  .xn_f_2_warp {
    width: 1020px;
    float: left;
    margin-top: 5px;
  }


  .foot {
    width: 100%;
    position: relative;
    text-align: center;
    font-size: 12px;
    color: #666666;
    line-height: 25px;
    background: #333333;
    padding: 30px 0px 10px 0;
  }

  .foot a {
    font-size: 12px;
    color: #939393;
    text-decoration: none;
    line-height: 25px;
  }

  .foot_c {
    position: relative;
    width: 1200px;
    margin: auto;
    text-align: left;
    overflow: hidden;
    height: 132px;
  }


  .xn_f_company {
    width: 1020px;
    float: left;
    font-size: 20px;
    color: #dddddd;
    font-weight: bold;
  }


  .xn_f_ewm {
    width: 105px;
    float: right;
    position: absolute;
    right: 10px;
    top: 0px;
  }

  .xn_f_ewm img {
    width: 105px;
    height: 105px;
    margin-bottom: 5px;
  }

  .xn_f_ewm_text {
    font-size: 14px;
    color: #ffffff;
    text-align: center;
  }


  .xn_m_6_wrap {
    position: fixed;
    height: auto;
    z-index: 10001;
    top: 25% !important;
    width: 120px;
    right: 0 !important;
  }

  .xn_m_6_wrap .xn_m_6_cent {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }

  .xn_m_6_head,
  #xn_m_6_orderBox_2,
  #xn_m_6_orderBox_3,
  #xn_m_6_orderBox_4,
  #xn_m_6_orderBox_8 {
    display: none;
  }

  .xn_m_6_orderId,
  .xn_m_6_mbox h4 {
    display: none;
  }

  #xn_m_6_orderBox_1,
  .xn_m_6_foot,
  #xn_m_6_orderBox_5,
  #xn_m_6_orderBox_6 {
    width: 120px;
    height: 60px;
    margin-top: 2px;
  }

  .xn_m_6_qq_ul {
    width: 60px;
    height: 60px;
    border-radius: 5px;
    cursor: pointer;
    background: url(/public/image/yx_qq.png) no-repeat center #4C484D;
    margin-bottom: 2px;
  }

  .xn_m_6_qq_ul:hover {
    width: 120px;
    height: 60px;
    background: url(/public/image/yx_qq.png) no-repeat 16px center #D1313D;
  }

  .xn_m_6_qq_li {
    width: 75px;
    padding-left: 45px;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    font-size: 12px;
    color: #fff;
    text-align: center;
  }

  .xn_m_6_qq_li img {
    display: none;
  }

  .xn_m_6_qq_li a {
    color: #fff;
  }

  .xn_c_contact_1_wrap {
    width: 640px;
    margin: 80px auto 0 auto;
  }

  .xn_m_6_tel_ul {
    width: 60px;
    height: 60px;
    border-radius: 5px;
    cursor: pointer;
    background: url(/public/image/yx_phone.png) no-repeat center #4C484D;
    margin-bottom: 2px;
  }

  .xn_m_6_tel_ul:hover {
    width: 160px;
    height: 60px;
    background: url(/public/image/yx_phone.png) no-repeat 16px center #D1313D;
  }

  .xn_m_6_tel_li {
    width: 110px;
    padding-left: 50px;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    font-size: 12px;
    color: #fff;
    text-align: center;
  }

  .xn_m_6_tel_li img {
    display: none;
  }

  .xn_m_6_markrt_code_ul {
    width: 60px;
    height: 60px;
    border-radius: 5px;
    cursor: pointer;
    background: url(/public/image/yx_wm.png) no-repeat center #4C484D;
    float: right;
    position: relative;
  }

  .xn_m_6_markrt_code_li {
    position: absolute;
    width: 130px;
    height: 130px;
    top: -28px;
    right: 60px;
    display: none;
  }

  .xn_m_6_markrt_code_li img {
    width: 130px;
    height: 130px;
  }

  .xn_m_6_markrt_code_ul:hover .xn_m_6_markrt_code_li {
    display: block;
  }

  .xn_m_6_foot {
    width: 60px;
    height: 60px;
    background: url(/public/image/yx_top.png) no-repeat center #4C484D;
    float: right;
    border-radius: 5px;
    cursor: pointer;
  }


  .close {
    background: url(/public/image/cgagffpneaoakiegaaaenocwtpc874.png) center no-repeat;
    width: 68px;
    height: 20px;
    font-size: 0;
    position: absolute;
    top: -5px;
    border-radius: 8px;
    right: 2px;
    cursor: pointer;
    margin: 0 !important;
    z-index: 999;
  }

  .xn_m_2_wrap {
    top: -50px;
  }

  .xn_m_2_head {
    width: 70px;
    height: 20px;
    color: #fff;
  }

  .xn_m_2_wrap {
    position: fixed;
    height: auto;
    width: 70px;
    z-index: 99;
    top: 230px !important;
    right: 3% !important;
    -webkit-transform: translateY(50%);
    -moz-transform: translateY(50%);
    -ms-transform: translateY(50%);
    -o-transform: translateY(50%);
    transform: translateY(50%);
    display: none;
  }

  .xn_m_2_mbox img {
    display: none;
    width: 100px;
    clear: both;
    height: 100px;
    position: absolute;
    margin-left: -101px;
    margin-top: -1px;
  }

  .xn_m_2_tel_box {
    opacity: 0;
  }

  .xn_m_2_tel_box img {
    width: 20px;
  }

  .xn_m_2_head .close {
    cursor: pointer;
    text-align: left;
    margin-top: 13px;
    display: none;
  }

  .xn_m_2_mbox ul {}

  .xn_m_2_markrt_code img {
    width: 100px;
  }

  .xn_m_2_small_but {
    width: 20px;
    height: 50px;
    background: #666666;
    position: absolute;
    top: 50%;
    margin-top: -25px;
    right: 0px;
    cursor: pointer;
    color: #fff;
    font-size: 12px;
    display: none;
    text-align: center;
    line-height: 24px;
  }

  .xn_m_2_foot {
    transition: all 0.6s ease 0s;
    width: 59px;
    overflow: hidden;
    height: 59px;
    background: #fff url(/public/image/top1.png)no-repeat;
    cursor: pointer;
    font-size: 0px;
    color: #fff;
    line-height: 110px;
    text-align: center;
    border: 1px solid #eeeeee;
    border-top: none;
  }

  .xn_m_2_foot:hover {
    background: #637d8e url(/public/image/top11.png)no-repeat;
  }

  .xn_m_2_orderId {
    display: none;
  }

  .xn_m_2_mbox {
    position: relative;
    width: 70px;
  }

  .xn_m_2_markrt_ali {
    display: none;
  }

  #xn_m_2_Text4 {
    font-size: 12px;
    display: none;
    padding: 6px 4px;
    background: url(/public/image/xuan_hover.png) no-repeat;
  }

  #xn_m_2_Text1 {
    display: none;
  }

  .xn_m_2_markrt_code {
    background: url(/public/image/xuan_erweima.png) no-repeat;
    cursor: pointer;
  }

  .xn_m_2_markrt_code:hover #xn_m_2_Text4 {
    display: block;
  }

  .xn_m_2_markrt_code:hover .xn_m_2_markrtimg {
    display: block;
  }

  .xn_m_2_telephone {
    transition: all 0.6s ease 0s;
    cursor: pointer;
    width: 59px;
    height: 59px;
    margin-top: -10px;
    background: #fff;
    border: 1px solid #eeeeee;
    border-bottom: none;
    background: #fff url(/public/image/shouji.png)no-repeat;
    background-size: 100%;
    border-top: none;
  }

  .xn_m_2_telephone:hover {
    background: #fff3ea url(/public/image/pp.png) center 10px no-repeat;
  }

  .xn_m_2_telephone:hover .xn_m_2_telephone>h4 {
    display: block;
  }

  .xn_m_2_telephone:hover .xn_m_2_tel_box {
    opacity: 1;
  }

  .xn_m_2_telephone:hover {
    background: #fff url(/public/image/11111.jpg)no-repeat;
    border: 1px solid #eeeeee;
    border-bottom: none;
    background-size: 100%;
    border-top: none;
  }

  .xn_m_2_markrt_qq {
    margin-top: 52px;
  }

  .xn_m_2_sky_author {
    display: none;
  }

  .xn_m_2_markrt_qq:hover .xn_m_2_qq_li {
    display: block;
  }

  .xn_m_2_telephone h4 {
    display: none;
    left: 7px;
    color: #fff;
    text-align: center;
    height: 22px;
    font-size: 14px;
    font-weight: normal;
    overflow: hidden;
    position: absolute;
    bottom: 0px;
  }

  .xn_m_2_markrtimg {
    display: none;
    position: absolute;
    right: 48px;
    top: -28px;
  }

  .xn_m_2_tel_box {
    transition: all 0.6s ease 0s;
    position: absolute;
    right: 59px;
    top: 0px;
    width: 168px;
    height: 59px;
    line-height: 59px;
    color: #fff;
    background: #637d8e;
    opacity: 0;
  }

  .xn_m_2_tel_tel {
    margin-left: 20px;
    font-size: 19px;
  }

  .xn_m_2_qq_li:nth-of-type(1) {
    display: none !important;
  }

  .xn_m_2_qq_li {
    transition: all 0.6s ease 0s;
    width: 59px;
    height: 69px;
    background: #fff3ea;
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid #eeeeee;
    border-bottom: none;
    margin-top: 62px;
  }

  .xn_m_2_qq_li a:hover {
    background: #637d8e url(/public/image/yijian.png)no-repeat 6px 15px;
  }

  .xn_m_2_qq_li a {
    transition: all 0.6s ease 0s;
    font-size: 14px;
    color: #fff;
    display: block;
    text-align: center;
    line-height: 110px;
    font-size: 0px;
    background: #fff url(/public/image/yijian11.png)no-repeat 6px 15px;
  }

  .xn_m_2_qq_img {
    display: none;
  }

  .xn_m_2_markrt_sky h4 {
    display: none;
  }

  .xn_m_2_markrt_sky {
    transition: all 0.6s ease 0s;
    width: 59px;
    height: 59px;
    background: #fff;
    position: absolute;
    top: 22px;
    left: 0;
    border: 1px solid #eeeeee;
    border-bottom: none;
    background: #fff url(/public/image/onli.png)no-repeat center;
  }

  .xn_m_2_markrt_sky:hover {
    opacity: 0.8;
    cursor: pointer;
    background: #637d8e url(/public/image/onli111.png)no-repeat center;
  }

  .xn_m_2_markrt_sky a {
    cursor: pointer;
    background: url(/public/image/ph.png)no-repeat center 10px;
    display: block;
    color: #fff;
    font-size: 14px;
    text-align: center;
    line-height: 110px;
  }

  #qrcode,
  #qrAPPIOS,
  #qrAPPAndroid {
    display: none;
  }

  #newBridge .icon-right-center {
    top: 46% !important;
  }

  .i_tcase_main .pcba {}

  .i_tcase_main .pcba {}


  /*prodshow_banner*/
  .prodshow_banner {
    width: 100%;
    height: 457px;
    overflow: hidden;
    position: relative;
    margin: 0 auto;
  }

  .prodshow_banner_m {
    Z-INDEX: 0;
    width: 1920px;
    height: 457px;
    position: absolute;
    left: 50%;
    margin-left: -960px;
  }

  /*end_prodshow_banner*/
  /*ea_ba*/
  /*ea_c*/
  /*n_content_right_name_r*/
  .n_content_right_name_r {
    word-spacing: -4px;
    width: 400px;
    height: 23px;
    color: #777;
    font-size: 12px;
    text-align: left;
    line-height: 23px;
    margin-bottom: 2px;
  }

  .n_r_wz1,
  .n_r_wz2,
  .n_r_wz3,
  .n_r_wz4,
  .n_r_wz5,
  .n_r_wz6 {
    color: #fff;
  }

  .n_r_wz3,
  .n_r_wz5 {
    letter-spacing: -1px;
  }

  .n_r_wz1 a {
    color: #fff;
  }

  .n_r_wz2 a,
  .n_r_wz4 a,
  .n_r_wz5 a,
  .n_r_wz6 a {
    color: #fff;
  }

  .n_content_right_name_r ul li {
    float: left;
  }

  .n_content_right_name_r ul li img {
    margin-right: 12px;
    display: none;
  }

  /*end_n_content_right_name_r */
  /*xn_c_prodshow_13_wrap*/
  .xn_c_prodshow_13_ul {
    padding-top: 75px;
		width: 1200px;
		display: flex;
		flex-wrap: wrap;
  }
	
	.xn_c_prodshow_13_ul>li {
		width: 31%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		background-color: #f5f5f5;
		margin-left: 20px;
		padding-top: 10px;
		margin-bottom: 20px;
	}
	
	.xn_c_prodshow_13_ul>li>a {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}
	
	.xn_c_prodshow_13_ul>li:hover {
		box-shadow: 0 0 10px #999;
		transition: 0.5s ease;
	}
	
	.xn_c_prodshow_13_ul>li:nth-child(4n) {
		margin-right: 0px;
	}
	
	.propic {
		width: 350px;
		height: 280px;
		object-fit: contain;
		background-color: #fff;
	}
	
	.proname {
		color: #333;
		font-size: 16px;
		font-weight: 600;
		margin: 20px 0 0px 0;
	}
	
	.prodesc {
		overflow: hidden;
		text-overflow:ellipsis;
		white-space: nowrap;
		width: 260px;
		font-size: 12px;
		color: #8f8f8f;
		margin-bottom: 10px;
	}
  .xn_c_prodshow_13_wrap {
    width: 1200px;
    margin: 0 auto;
    background: url(/public/image/innerback.jpg);
    box-shadow: 0px 7px 19px 0px #ededed;
  }

  .xn_c_prodshow_13_wrap_2 {
    color: #666666;
    text-align: center;
    display: block;
    font-size: 12px;
    margin-top: 2px;
    margin-bottom: 20px;
    margin-left: -1px;
  }

  .xn_c_prodshow_13_wrap_1_1 {
    margin: 0 auto;
    display: block;
    padding-top: 75px;
    width: 220px;
    height: 77px;
    line-height: 75px;
    font-size: 30px;
    text-align: center;
    /* overflow: hidden; */
  }

  .xn_c_prodshow_13_price,
  .xn_c_prodshow_13_pmarket,
  .xn_c_prodshow_13_pmember {
    display: none;
  }

  .xn_c_prodshow_13_li {
    width: 1060px;
    height: 215px;
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 30px;
    margin-left: 71px;
  }

  .xn_c_prodshow_13_img {
    width: 320px;
    height: 199px;
    float: left;
    overflow: hidden;
    margin-right: 39px;
    margin-top: -15px;
  }

  .xn_c_prodshow_13_img img {
    width: 100%;
    height: 100%;
  }

  .xn_c_prodshow_13_name {
    transition: all 0.6s ease 0s;
    margin-top: 12px;
    margin-bottom: 16px;
    float: left;
    width: 500px;
  }

  .xn_c_prodshow_13_name a {
    color: #555555;
    font-size: 18px;
  }

  .xn_c_prodshow_13_neirong {
    transition: all 0.6s ease 0s;
    color: #777777;
    font-size: 14px;
    line-height: 26px;
    margin-bottom: 18px;
    width: 530px;
    float: left;
  }

  .xn_c_prodshow_13_zhtime3,
  .xn_c_prodshow_13_zhtime4,
  .xn_c_prodshow_13_zhtime5 {
    color: #c8c8c8;
    font-size: 18px;
  }

  .xn_c_prodshow_13_zhtime2,
  .xn_c_prodshow_13_zhtime1 {
    color: #c8c8c8;
    font-size: 14px;
  }

  .xn_c_prodshow_13_more {
    transition: all 0.6s ease 0s;
    float: right;
    margin-top: -90px;
    border-left: 1px solid #eeeeee;
    width: 75px;
    height: 39px;
    line-height: 39px;
    padding-left: 27px;
  }

  .xn_c_prodshow_13_more a {
    transition: all 0.6s ease 0s;
    color: #bcbcbc;
    font-size: 18px;
  }

  .xn_c_prodshow_13_time {
    float: left;
    width: 500px;
  }

  .xn_c_prodshow_13_li:hover .xn_c_prodshow_13_neirong {
    color: #333333;
    margin-left: 10px;
  }

  .xn_c_prodshow_13_li:hover .xn_c_prodshow_13_more {
    margin-right: -10px;
  }

  .xn_c_prodshow_13_li:hover .xn_c_prodshow_13_more a {
    color: #333333;
  }

  .xn_c_prodshow_13_li:hover .xn_c_prodshow_13_name {
    margin-left: 10px;
  }

  /*end_xn_c_prodshow_13_wrap*/


  /*fy*/
  .case_body .fy {
    padding-top: 42px;
  }

  .news_body .fy {
    margin-bottom: 65px;
  }

  .fy {
    width: 100%;
    text-align: center;
    font-size: 0px;
    line-height: 36px;
    clear: both;
    padding-top: 78px;
    margin-bottom: 65px;
    padding-bottom: 26px;
  }

  .fy span,
  .fy span a {
    color: #999999;
    vertical-align: top;
    margin: 0px;
    font-size: 14px;
  }

  .fy span a:hover {
    background: #637d8e;
    transition: all 0.6s ease 0s;
    border: 1px solid #e9e9e9;
    color: #fff !important;
  }

  .fy span a {
    background: #fff;
  }

  .fy span {
    margin: 0px 2px;
  }

  .fy_1 {
    display: none;
  }

  .fy_2 {
    display: inline-block;
    font-size: 16px;
    width: 83px;
    height: 36px;
  }

  .fy_2 a {
    display: block;
    width: 83px;
    height: 36px;
    font-size: 14px;
    border: 1px solid #e9e9e9;
    line-height: 36px;
  }

  .fy .fy_2 a:hover {}

  .fy_3 {
    margin-left: 5px;
    margin-right: 5px;
    display: none;
  }

  .fy_4 {
    display: none;
  }

  .fy_5 {
    margin-left: 5px;
    margin-right: 5px;
    display: none;
  }

  .fy_6 {
    display: inline-block;
    font-size: 16px;
    width: 83px;
    height: 36px;
  }

  .fy_6 a {
    display: block;
    width: 83px;
    height: 36px;
    font-size: 14px;
    border: 1px solid #e9e9e9;
    line-height: 36px;
  }

  .fy .fy_6 a:hover {}

  .fy_7 {
    margin-left: 5px;
    margin-right: 5px;
    display: none;
  }

  .fy_8 {
    display: none;
  }

  .fy_9 {
    display: none;
  }

  .fy_out {
    display: inline-block;
    font-size: 16px;
    height: 36px;
  }

  .fy_out a {
    display: block;
    width: 37px;
    font-size: 14px;
    height: 36px;
    border: 1px solid #e9e9e9;
  }

  .fy_on {
    display: inline-block;
    font-size: 16px;
    width: 37px;
    height: 36px;
  }

  .fy .fy_on a,
  .fy .fy_out a:hover {
    display: block;
    background: #333;
    transition: all 0.6s ease 0s;
    border: 1px solid #333;
    color: #fff !important;
    width: 37px;
    height: 36px;
  }

  .case_body .fy .fy_on a,
  .case_body .fy .fy_out a:hover {
    display: block;
    background: #333;
    transition: all 0.6s ease 0s;
    border: 1px solid #333;
    color: #fff !important;
    width: 37px;
    height: 36px;
  }

  .case_body .fy span a:hover {
    background: #333;
    transition: all 0.6s ease 0s;
    border: 1px solid #333;
    color: #fff !important;
  }

  /*end_fy*/

  /*n_main*/
  .n_main {
    width: 100%;
    margin: 0;
    padding: 0;
    height: auto;
    overflow: hidden;
    margin-top: -200px;
    z-index: 5;
    position: relative;
  }

  .n_content {
    width: 1200px;
    margin: 0 auto;
  }

  .prod_view_body .n_content {
    margin-top: 258px;
  }

  .case_body {
    overflow-x: hidden;
  }

  .case_view_body {
    overflow-x: hidden;
  }

  .prod_view_body .n_main {
    width: 100%;
    height: 100%;
    background: url(/public/image/bigpro.png)no-repeat;
    margin-top: 0px;
  }

  .n_content_left_cnt {
    height: auto;
    /* background: #fff; */
    margin-bottom: 30px;
  }

  .about_body .n_content_left_cnt {
    margin-top: 203px !important;
  }

  .honor_body .n_content_left_cnt {
    margin-top: 203px !important;
  }

  .recruitment_body .n_content_left_cnt {
    margin-top: 203px !important;
  }

  .n_content_left_cnt ul li ul li ul {
    border-bottom: none !important;
  }

  .left_typeUl_t3100 {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .left_menu1 {
    height: 30px;
    transition: all 0.6s;
    padding: 0 5px;
    background: #fff;
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    border-radius: 20px;
    border: 1px solid #d2d2d2;
    margin-right: 5px;
		max-width: 128px;
  }

  .left_menu1 a {
    /* width: 84px; */
    line-height: 31px;
    color: #616161;
  }

  .left_menu1:hover a {
    display: inline-block;
    color: #fff;
  }

  .left_menu1:hover {
    background: #666;
  }

  .left_menu1 a.show {
    background: #666;
    color: #fff;
    padding: 8px;
    height: 14px;
    line-height: 14px;
    margin: 0 auto;
    width: 68px;
    font-weight: bold;
    font-size: 12px;
    float: left;
    text-align: center;
    border-radius: 20px;
    margin-right: 5px;
  }

  /*.left_menu1_2 {margin:0 auto;width:193px;  background: #FFFFFF; font-weight:bold; font-size:12px; font-weight:bold; margin-bottom:6px;}
.left_menu1_2 a{width:100px; margin:0px auto 6px auto; border-bottom:1px solid #EBEBEB; font-weight:bold; font-size:13px; font-weight:bold; display:inline-block; padding-left:68px; line-height:30px; color: #d40000; background:url(/public/image/icpsp1_n_left_menujt.png) 50px center no-repeat #fff; text-decoration:none;}
.left_menu1_2 a:hover{}
.left_menu1_2 :hover{background-color: #292929;}*/
  .left_menu1_2 {
    transition: all 0.6s ease 0s;
    margin: 0 auto;
    width: 84px;
    height: 31px;
    border-radius: 20px;
    background: #fff;
    font-weight: bold;
    font-size: 12px;
    float: left;
    text-align: center;
    border: 1px solid #d2d2d2;
    margin-right: 5px;
  }

  .left_menu1_2 a {
    width: 84px;
    line-height: 31px;
    display: inline-block;
    color: #fff;
    background: #666;
    border-radius: 20px;
  }

  .left_menu1_2:hover a {}

  .left_menu1_2:hover {}

  .left_menu1_cur {
    margin: 0 auto;
    width: 84px;
    background: #666;
    font-weight: bold;
    font-size: 12px;
    float: left;
    text-align: center;
    border: 1px solid #666;
    margin-right: 5px;
    line-height: 31px;
    height: 31px;
    border-radius: 20px;
  }

  .left_menu1_cur a {
    display: inline-block;
    color: #fff;
    text-decoration: none;
  }

  .left_menu2 {
    width: auto;
    float: left;
    margin-right: 10px;
  }

  .left_menu2 a {
    width: auto;
    padding: 0 10px;
    color: #fff;
    background: #666;
    font-weight: normal;
    border-radius: 20px;
    display: block;
  }

  .left_menu2 a:hover {
    color: #fff;
    text-decoration: underline;
  }

  .n_content_left_cnt ul ul {
    /* width: 400px; */
    overflow: hidden;
    padding-top: 20px;
    display: none
  }

  .n_content_left_cnt ul ul .left_menu2_cur a {
    color: #fff;
    text-decoration: underline;
    font-weight: normal;
    width: auto;
    float: left;
    padding: 0 10px;
    background: #666;
    margin-right: 10px;
  }

  .left_menu3 {
    width: 193px;
  }

  .left_menu3 a {
    color: #000;
    height: 20px;
    text-indent: 20px;
    background: none !important;
    font-weight: normal;
    border: none !important;
  }

  .left_menu3 a:hover {
    color: #F00;
    height: 20px;
    background: none !important;
    font-weight: normal;
  }

  .left_menu3_2 {
    width: 193px;
  }

  .left_menu3_2 a {
    color: #C00;
    height: 20px;
    text-indent: 20px;
    background: none !important;
    font-weight: normal;
    border: none !important;
  }

  .left_menu3_2 a:hover {
    color: #F00;
    height: 20px;
    background: none !important;
    font-weight: normal;
  }

  .left_menu3_cur {
    width: 193px;
  }

  .left_menu3_cur a {
    color: #C00;
    height: 20px;
    text-indent: 20px;
    background: none !important;
    font-weight: normal;
    border: none !important;
  }

  .left_menu3_cur a:hover {
    color: #F00;
    background: none !important;
    font-weight: normal;
  }

  .n_content_left_cnt ul ul ul {
    width: 400px;
    overflow: hidden;
    padding-top: 20px;
  }

  .n_content_left {
    width: 217px;
    height: auto;
    float: left;
    position: relative;
  }

  .n_content_right {
    position: relative;
    width: 783px;
    height: auto;
    float: right;
    padding-bottom: 20px;
  }

  .n_content_right_name {
    display: none;
    width: 92%;
    height: 90px;
    margin: 0 auto;
    position: relative;
    border-bottom: 1px solid #DBDBDB;
  }

  .n_content_right_m {
    display: none;
    text-align: left;
    width: 92%;
    margin: 0 auto;
    line-height: 24px;
    color: #737373;
    font-size: 12px;
    padding: 30px 0 20px 0;
    position: relative;
  }

  .xn_f_21_wrap {
    width: 1020px;
    float: left;
    font-size: 14px;
    color: #dddddd;
    margin-top: 5px;
  }


  .n_content_prodshow {
    width: 1200px;
    margin: 0 auto;
    background: url(/public/image/innerback.jpg);
  }

  .xn_c_prodshowv_5_wrap_2 {
    width: 243px;
    color: #666666;
    text-align: center;
    display: block;
    font-size: 12px;
    margin-top: 4px;
    margin-bottom: 100px;
    margin-left: -16px;
  }

  .xn_c_prodshowv_5_wrap_1 {
    margin: 0 auto;
    display: block;
    padding-top: 75px;
    width: 208px;
    height: 77px;
    /* overflow: hidden; */
  }

  .xn_c_prodshowv_5_wrap_1_1 {
    margin: 0 auto;
    display: block;
    width: 210px;
    height: 77px;
    line-height: 75px;
    font-size: 30px;
    text-align: center;
    /* overflow: hidden; */
  }

  /*end_n_content_prodshow*/
  /*n_content_right_m*/
  .n_content_right_m {
    display: none;
    text-align: left;
    width: 92%;
    margin: 0 auto;
    line-height: 24px;
    color: #737373;
    font-size: 12px;
    padding: 30px 0 20px 0;
    position: relative;
  }

  /*end_n_content_right_m*/
  /*n_content_left*/
  .n_content_left {
    width: 217px;
    height: auto;
    float: left;
    position: relative;
  }

  /*end_n_content_left*/
  /*n_content_right*/
  .n_content_right {
    position: relative;
    width: 1100px;
    height: auto;
    float: right;
    padding-bottom: 20px;
    margin-top: 155px;
  }

  /*end_n_content_right*/
  /*n_content_right_name*/
  .n_content_right_name {
    display: none;
    width: 92%;
    height: 90px;
    margin: 0 auto;
    position: relative;
    border-bottom: 1px solid #DBDBDB;
  }

  /*end_n_content_right_name*/
  /*pro_view*/
  .pro_view {
    width: 710px;
    padding: 20px 0 0 0;
    position: relative;
  }

  /*end_pro_view*/
  /*prod_big*/
  .prod_big {
    width: 375px;
    height: 330px;
    float: left;
    margin-right: 50px;
    margin-bottom: 20px;
  }

  /*end_prod_big*/
  /*ea_c*/


  /*xn_c_prodv_67_wrap*/
  .xn_c_prodv_67_wrap {
    width: 490px;
    height: auto;
    float: left;
    margin-top: 45px;
    position: relative;
  }

  /**/
  .EIMS_C_40014_1_s_box {
    width: 490px;
    height: 305px;
    position: relative;
    border: 1px solid #ececec;
  }

  .EIMS_C_40014_1_s_box img {
    width: 490px;
    height: 305px;
  }

  .EIMS_C_40014_1_s_box .move {
    position: absolute;
    top: 0;
    left: 0;
    background: #EEE;
    z-index: 99;
    filter: alpha(opacity=60);
    opacity: 0.6;
    display: none;
    cursor: move;
  }

  /**/
  .EIMS_C_40014_1_g-box .b_box {
    position: absolute;
    top: 0px;
    overflow: hidden;
    display: none;
  }

  .EIMS_C_40014_1_g-box .b_box img {
    position: absolute;
    top: 0px;
    left: 0px;
    border-style: none;
  }

  /**/
  .EIMS_C_40014_1_i_box {
    width: 490px;
    overflow: hidden;
    height: 60px;
    float: left;
    position: relative;
    margin: 6px 0 0 0;
  }

  .EIMS_C_40014_1_p_box {
    width: 424px;
    overflow: hidden;
    height: 60px;
    float: left;
    margin: 0 0 0 34px;
    position: relative;
  }

  .EIMS_C_40014_1_p_box ul {
    height: 75px;
    position: absolute;
    top: 0;
    left: 0;
    margin-left: 0px;
  }

  .EIMS_C_40014_1_p_box li {
    width: 100px;
    height: 60px;
    float: left;
    margin-right: 8px;
  }

  .EIMS_C_40014_1_p_box li a {
    width: 100px;
    height: 58px;
    display: block;
    border: 1px solid #d9d9d9
  }

  .EIMS_C_40014_1_p_box li a.xn_c_prodv_67_curr {
    border: 1px solid #e5e5e5;
  }

  .EIMS_C_40014_1_p_box li img {
    width: 100px;
    height: 58px;
    border-style: none;
  }

  #EIMS_C_40014_1_pre,
  #EIMS_C_40014_1_next {
    width: 30px;
    height: 60px;
    position: absolute;
    top: 0px;
    cursor: pointer;
    background: #000;
  }

  #EIMS_C_40014_1_pre {
    left: 0px;
    background: url(/public/image/40014_1_pre.png) no-repeat;
  }

  #EIMS_C_40014_1_next {
    right: 0px;
    background: url(/public/image/40014_1_next.png) no-repeat;
  }

  /*end_xn_c_prodv_67_wrap*/


  /*xn_c_prodv_57_wrap*/
  .xn_c_prodv_57_wrap {
    width: 550px;
    margin: 45px auto 0;
    float: right;
  }

  .xn_c_prodv_57_jshao1 {
    display: none;
  }

  .xn_c_prodv_57_jshao2 {
    display: block;
    height: 40px;
    line-height: 20px;
    overflow: hidden;
    width: 100%;
    font-size: 12px;
  }

  .xn_c_prodv_57_jshao {
    border-bottom: 1px dashed #e2e2e2;
    padding-bottom: 15px;
    margin-top: 10px;
  }

  .xn_c_prodv_57_name h1 {
    font-size: 20px;
    font-weight: normal;
    color: #15202f;
    white-space: nowrap;
    text-overflow: ellipsis;
    /**/
    -o-text-overflow: ellipsis;
    /**/
    overflow: hidden;
    /**/
    -moz-binding: url('ellipsis.xml#ellipsis');
    height: 42px;
    line-height: 42px;
  }

  .xn_c_prodv_57_mliao {
    display: none;
  }

  .xn_c_prodv_57_xhao {
    line-height: 30px;
    height: 30px;
  }

  .xn_c_prodv_57_xhao2 {
    font-size: 12px;
    color: #2f2f2f;
    display: inline-block;
    float: left;
    width: 60%;
    overflow: hidden;
    line-height: 30px;
    height: 30px;
  }

  .xn_c_prodv_57_xhao1 {
    font-size: 12px;
    color: #2f2f2f;
    display: inline-block;
    float: left;
  }

  .xn_c_prodv_57_yans {
    line-height: 30px;
    height: 30px;
  }

  .xn_c_prodv_57_yans2 {
    font-size: 12px;
    color: #2f2f2f;
    display: inline-block;
    float: left;
    width: 60%;
    overflow: hidden;
    line-height: 30px;
    height: 30px;
  }

  .xn_c_prodv_57_yans1 {
    font-size: 12px;
    color: #2f2f2f;
    display: inline-block;
    float: left;
  }

  .xn_c_prodv_57_lxing {
    margin-top: 10px;
    line-height: 30px;
    height: 30px;
  }

  .xn_c_prodv_57_lxing2 {
    font-size: 12px;
    color: #2f2f2f;
    display: inline-block;
    float: left;
    width: 60%;
    overflow: hidden;
    line-height: 30px;
    height: 30px;
  }

  .xn_c_prodv_57_lxing1 {
    font-size: 12px;
    color: #2f2f2f;
    display: inline-block;
    float: left;
  }

  .xn_c_prodv_57_lbie {
    border-top: 1px dashed #e2e2e2;
    margin-top: 42px;
    line-height: 50px;
    height: 50px;
  }

  .xn_c_prodv_57_lbie2 {
    font-size: 24px;
    color: #15202f;
    display: inline-block;
    font-weight: bold;
    float: left;
    width: 60%;
    overflow: hidden;
    line-height: 40px;
    height: 40px;
  }

  .xn_c_prodv_57_lbie1 {
    font-size: 16px;
    color: #2e2e2e;
    display: inline-block;
    float: left;
  }

  .xn_c_prodv_57_lbie1 span {
    padding-top: 8px;
  }

  /*end_xn_c_prodv_57_wrap*/


  /*xn_c_prodv_75_wrap*/
  .xn_c_prodv_75_wrap {
    width: 100%;
    margin: 20px auto;
  }

  .xn_c_prodv_75_Model1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
    font-weight: bold;
  }

  .xn_c_prodv_75_Model2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Access1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
    font-weight: bold;
  }

  .xn_c_prodv_75_Access2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Uses1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
    font-weight: bold;
  }

  .xn_c_prodv_75_Uses2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Earnings1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
    font-weight: bold;
  }

  .xn_c_prodv_75_Earnings2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Interest1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
  }

  .xn_c_prodv_75_Interest2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Spec1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
  }

  .xn_c_prodv_75_Spec2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Model1 {
    display: block;
    height: 60px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 16px;
    color: #15202f;
  }

  .xn_c_prodv_75_Model2 {
    font-size: 12px;
    line-height: 28px;
    color: #666666;
  }

  .xn_c_prodv_75_Model2 td {
    border: solid 1px #e1e1e1;
    padding: 2px 10px;
    font-size: 14px;
  }

  .xn_c_prodv_75_Model2 td:nth-child(1) {
    width: 25%;
    /* background:#e9e9e9; text-align: left;*/
  }

  .xn_c_prodv_75_Model2:nth-child(2) {
    /* background:#F2F2F2; */
    width: 75%;
    padding-left: 20px;
  }

  .xn_c_prodv_75_Model2 table {
    border-collapse: collapse;
  }


  /*end_xn_c_prodv_75_wrap*/
  /*xn_c_prodv_7_wrap*/
  .xn_c_prodv_7_wrap {
    width: 100%;
    border: 1px solid #f1f1f1;
    /* background: #fff; */
    height: 58px;
    margin-top: 40px;
    line-height: 58px;
  }

  .xn_c_prodv_7_wrap #EIMS_C_3_1_box_div {
    overflow: hidden;
  }

  .xn_c_prodv_7_wrap #EIMS_C_3_1_box_div ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
  }

  .xn_c_prodv_7_wrap #EIMS_C_3_1_box_div li {
    float: left;
  }

  .xn_c_prodv_7_wrap .EIMS_C_3_1_page {
    white-space: nowrap;
    text-overflow: ellipsis;
    /**/
    -o-text-overflow: ellipsis;
    /**/
    overflow: hidden;
    /**/
    -moz-binding: url('ellipsis.xml#ellipsis');
    /**/
    FONT-SIZE: 12px;
    COLOR: #666;
    width: 400px;
    overflow: hidden;
    display: inline-block;
    HEIGHT: 58px;
    LINE-HEIGHT: 58px;
  }

  .xn_c_prodv_7_wrap .EIMS_C_3_1_page A:link {
    COLOR: #666;
    TEXT-DECORATION: none;
  }

  .xn_c_prodv_7_wrap .EIMS_C_3_1_page A:visited {
    COLOR: #666;
    TEXT-DECORATION: none;
  }

  .xn_c_prodv_7_wrap .EIMS_C_3_1_page A:hover {
    COLOR: #ff0000;
    TEXT-DECORATION: underline;
  }

  .xn_c_prodv_7_wrap #EIMS_C_3_1_Downli {
    margin-right: 25px;
    float: right;
    text-align: right;
  }

  .xn_c_prodv_7_wrap #EIMS_C_3_1_Upli {
    margin-left: 25px;
    float: left;
  }

  /*end_xn_c_prodv_7_wrap*/

  /*xn_c_prodv_64_wrap*/
  .xn_c_prodv_64_wbox {
    width: 100%;
  }

  .xn_c_prodv_64_wrap {
    width: 100%;
    margin: 10px auto;
    height: 280px;
    font-size: 12px;
    /* background: #fff; */
  }

  .xn_c_prodv_64_top {
    width: 100%;
    line-height: 56px;
    height: 56px;
    border-bottom: 1px solid #f6f6f6;
  }

  .xn_c_prodv_64_cWrap {
    font-size: 20px;
    font-weight: bold;
    margin-left: 30px;
  }

  .xn_c_prodv_64_topmore {
    margin-right: 30px;
    float: right;
    margin-top: 0;
  }

  .xn_c_prodv_64_topmore a {
    color: #000000;
    font-size: 12px;
  }

  .xn_c_prodv_64_topmore a:hover {
    color: #f00;
    text-decoration: underline;
  }

  .xn_c_prodv_64_eWrap {
    display: none;
  }

  .xn_c_prodv_64_dashw {
    display: none;
  }

  .xn_c_prodv_64_cocnt {
    width: auto;
    margin-left: 30px;
    margin-top: 30px;
  }

  .xn_c_prodv_64_cocntbox {
    float: left;
    width: 200px;
    margin-right: 15px;
  }

  .xn_c_prodv_64_cocntlft {
    width: 198px;
    border: 1px solid #f4f4f4;
    height: 118px;
    position: relative;
  }

  .xn_c_prodv_64_cocntlft img {
    width: 198px;
    height: 118px;
  }

  .xn_c_prodv_64_cocntlft a {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 198px;
    border: 1px transparent rgba(28, 30, 45, 0);
    transition: 1s all ease;
    background: rgba(28, 30, 45, 0);
    height: 118px;
    display: block;
  }

  .xn_c_prodv_64_cocntlft:hover a {
    opacity: 1;
    background: rgba(28, 30, 45, 0.5);
  }

  .xn_c_prodv_64_cocntlft a img {
    width: 39px;
    height: 39px;
    margin: 40px 0 0 80px;
    text-align: Center;
  }

  .xn_c_prodv_64_cocntrit {}

  .xn_c_prodv_64_cocntrit_name {
    width: 100%;
    line-height: 20px;
    text-align: center;
  }

  .xn_c_prodv_64_cocntrit_name a {
    color: #1c1e2d;
    font-size: 12px;
    height: 48px;
    line-height: 48px;
  }

  .xn_c_prodv_64_cocntrit_name a:hover {
    color: #ff0000;
    text-decoration: underline;
  }

  .xn_c_prodv_64_cocntrit_time {
    display: none;
    width: 140px;
    line-height: 20px;
  }

  .xn_c_prodv_64_cocntrit_cont {
    display: none;
    width: 140px;
    height: 40px;
    line-height: 20px;
    overflow: hidden;
  }

  .xn_c_prodv_64_cocntrit_more {
    display: none;
    width: 140px;
  }

  .xn_c_prodv_64_cocntrit_Unit {
    display: none;
  }

  /*end_xn_c_prodv_64_wrap*/

  /*xn_c_prodv_6_wrap*/
  .xn_c_prodv_6_wrap {
    width: 380px;
    margin-top: 15px;
    height: 27px;
    width: 150px;
    overflow: hidden;
    text-align: center;
    line-height: 25px;
  }

  .xn_c_prodv_6_wrap a {
    display: block;
    border: solid 1px #174592;
    height: 25px;
    
    color: #174592;
    font-size: 14px;
  }

  .xn_c_prodv_6_wrap a:hover {
    background: #174592;
    color: #fff;
  }

  .xn_c_prodv_6_wrap img {
    display: none;
  }

  #gotop {
    width: 80px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    font-size: 12px;
    background: #15489c;
    border: 0;
    color: #fff;
    cursor: pointer;
    position: fixed;
    bottom: 0%;
    right: 0%;
    z-index: 9999;
  }

  #gotop:hover {
    background: #ff1100;
  }


  /*xn_n_14_wrap*/
  .xn_n_14_wrap {
    position: relative;
    width: 1200px;
    margin: 0 auto;
  }

  .xn_n_14_wrap_main {
    width: 941px;
    height: 74px;
    position: absolute;
    right: 0px;
    top: -74px;
    z-index: 999;
  }

  .xn_n_14_wrap_main>ul>li {
    float: left;
    float: left;
    padding: 0 20px;
    height: 74px;
    position: relative;
  }

  .xn_n_14_wrap_main>ul>li>a {
    display: block;
    min-width: 64px;
    height: 72px;
    line-height: 72px;
    font-size: 16px;
    color: #333333;
    text-align: center;
  }

  /* .xn_n_14_wrap_main>ul .nav_0 a{color:#174596; border-bottom:2px solid #174596} */
  .xn_n_14_wrap_main>ul>li:hover a.wone {
    color: #174596;
    border-bottom: 2px solid #174596
  }

  .xn_n_14_wrap_main>ul>li.xn_n_14_wrap_menu1_cur>a {
    color: #174596;
    border-bottom: 2px solid #174596
  }

  .xn_n_14_wrap_main>ul>li>ul {
    width: 150px;
    position: absolute;
    left: 50%;
    margin-left: -75px;
    top: 74px;
    text-align: center;
    background: #fff;
    border: 1px solid #f0f0f0;
    z-index: 9;
  }

  .xn_n_14_wrap_main>ul>li>ul+ul {
    display: none !important;
  }

  .xn_n_14_wrap_main>ul>li>ul>li {
    border-bottom: solid 1px #ededed;
    padding: 10px 0;
    position: relative;
  }

  .xn_n_14_wrap_main>ul>li>ul>li a {
    font-size: 14px;
    color: #333;
    line-height: 30px;
    border-bottom: 2px solid #ffffff
  }

  .xn_n_14_wrap_main>ul>li:hover ul>li a:hover {
    color: #174596;
    border-bottom: 2px solid #174596;
  }

  .xn_n_14_wrap_main>ul>li>ul>li ul {
    position: absolute;
    right: -153px;
    background: #fff;
    width: 153px;
    top: 0;
  }

  .xn_n_14_wrap_main>ul>li>ul>li ul li {
    padding: 10px;
    border-bottom: solid 1px #ededed;
  }

  /*xn_n_14_wrap*/

  .n_content_case {
    width: 1200px;
    margin: 0 auto;
    margin-bottom: 45px;
    background: url(/public/image/innerback.jpg);
  }

  .n_case_m {
    width: 1130px;
    height: auto;
    margin: 0 auto;
    overflow: hidden;
  }

  .n_case_main {
    width: 370px;
    height: 280px;
    position: relative;
    float: left;
    margin-bottom: 32px;
    margin-right: 10px;
  }

  .n_case_img {
    width: 370px;
    height: 237px;
  }

  .n_case_img_1 {
    width: 370px;
    height: 237px;
    overflow: hidden;
  }

  .n_case_img img {
    width: 100%;
    height: 100%;
  }

  .n_case_main_name {
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
  }

  .n_case_main_name1 {
    color: #000;
    font-weight: bold;
    display: none;
  }

  .n_case_main_name2 a {
    color: #666666;
    font-size: 14px;
  }

  .n_case_main_name2 a :hover {
    color: #637d8e;
  }

  .n_case_main_cnt {
    font-size: 12px;
    color: #999999;
    margin-top: -3px;
    display: none;
  }

  .n_case_main:hover .n_case_img a:after {
    opacity: 1;
  }

  .n_case_main:hover .n_case_img {
    transform: scale(1.1);
    transition: 1.2s transform;
    -webkit-transform: scale(1.1);
    -webkit-transition: 1.2s transform;
  }

  .n_case_img a:after {
    transition: all 1s ease 0s;
    content: "";
    position: absolute;
    width: 370px;
    height: 237px;
    opacity: 0.8;
    z-index: 11;
    top: 0px;
    left: 0px;
    opacity: 0;
    background: url(/public/image/case_hover.png) rgba(31, 31, 31, 0.75) center no-repeat;
  }

  .n_case_main_cnt1 {
    color: #999999;
    float: left;
  }

  .n_case_main_cnt2 {
    line-height: 18px;
    display: block;
    overflow: hidden;
    color: #999999;
    margin-top: 3px;
  }

  .n_case_main_more {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 10px;
    display: none;
  }

  .n_case_main_more a {
    color: #C00;
    text-decoration: none;
  }

  .n_case_main_more a:hover {
    color: #C00;
    text-decoration: underline;
  }

  .n_case_more {
    position: absolute;
    right: 0;
    top: 10px;
  }

  .n_case_more a {
    background: url(/public/image/icpsp1_index_commore1.png) no-repeat;
    width: 44px;
    height: 11px;
    display: block;
  }

  .n_case_more a:hover {
    background: url(/public/image/icpsp1_index_commore2.png) no-repeat;
    width: 44px;
    height: 11px;
  }

  .n_case_main:nth-of-type(3n) {
    margin-right: 0px;
  }

  .xn_c_casev_2_warp img {
    max-width: 100%;
  }

  .xn_c_casev_6_wrap {
    width: 1045px;
    margin: 10px auto;
    font-size: 12px;
  }

  .xn_c_casev_6_wbox {
    width: 1045px;
  }

  .xn_c_casev_6_top {
    width: 1045px;
    text-align: left;
    margin: 26px 0;
    height: 38px;
    color: #444444;
    font-size: 16px;
    line-height: 28px;
    border-bottom: solid 1px #ddd;
    font-weight: bold;
  }

  .xn_c_casev_6_cocnt {
    width: 1045px;
  }

  .xn_c_casev_6_contbox {
    width: 160px;
    height: 158px;
    float: left;
    margin-right: 17px;
  }

  .xn_c_casev_6_contbox:nth-child(6) {
    margin-right: 0px;
  }

  .xn_c_casev_6_contbox:hover .xn_c_casev_6_cocntrit {
    margin-top: -7px;
  }

  .xn_c_casev_6_cocntlft {
    float: left;
    width: 160px;
    height: 102px;
    margin-bottom: 11px;
  }

  .xn_c_casev_6_cocntlft img {
    width: 100%;
    height: 100%;
  }

  .xn_c_casev_6_cocntrit {
    float: left;
    width: 140px;
    transition: all 0.6s ease 0s;
  }

  .xn_c_casev_6_cocntrit_name {
    width: 140px;
    line-height: 20px;
  }

  .xn_c_casev_6_cocntrit_time {
    width: 140px;
    line-height: 20px;
  }

  .xn_c_casev_6_cocntrit_Click {
    width: 140px;
    margin-bottom: 11px;
    color: #b7b7b7;
    font-size: 12px;
  }

  .xn_c_casev_6_cocntrit_cont {
    width: 140px;
    height: 40px;
    line-height: 20px;
    overflow: hidden;
  }

  .xn_c_casev_6_cocntrit_more {
    width: 140px;
    display: none;
  }

  .xn_c_newsv_6_cocntrit_name a {
    color: #333333;
    font-size: 12px;
  }

  .xn_c_newsv_6_cocntrit_name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .xn_c_casev_6_cocntrit_time {
    display: none;
  }

  .xn_c_casev_6_cocntrit_cont {
    display: none;
  }



  /*end_n_content_left_cnt */
  /*xn_c_about_1_warp*/
  .xn_c_about_1_warp {
    width: 1054px;
    margin: 0 auto;
    overflow: hidden;
    margin-bottom: 130px;
  }

  .xn_c_about_1_warp img {
    max-width: 100%;
  }

  /*end_xn_c_about_1_warp*/
  /*n_main*/
  .n_main {
    width: 100%;
    margin: 0;
    padding: 0;
    height: auto;
    overflow: hidden;
    margin-top: -200px;
    z-index: 5;
    position: relative;
  }

  .n_content {
    width: 1200px;
    margin: 0 auto;
  }

  .prod_view_body .n_content {
    margin-top: 258px;
  }

  .case_body {
    overflow-x: hidden;
  }

  .case_view_body {
    overflow-x: hidden;
  }

  .prod_view_body .n_main {
    width: 100%;
    height: 100%;
    background: url(/public/image/bigpro.png)no-repeat;
    margin-top: 0px;
  }

  /*end_n_main*/
  /*n_content_about*/
  .n_content_about {
    width: 1200px;
    margin: 0 auto;
    margin-bottom: 120px;
    box-shadow: 0px 7px 19px 0px #ededed;
    padding-bottom: 40px;
    background: url(/public/image/innerback.jpg);
  }

  .n_about_m_2 {
    color: #666666;
    text-align: center;
    display: block;
    font-size: 12px;
    margin-top: 7px;
    margin-bottom: 100px;
    width: 217px;
    margin-left: 1px;
  }

  .n_about_m_1 {
    margin: 0 auto;
    display: block;
    padding-top: 73px;
    height: 120px;
    width: 221px;
    margin-bottom: 127px;
  }

  .n_about_m_1_1 {
    margin: 0 auto;
    display: block;
    width: 220px;
    height: 77px;
    line-height: 75px;
    font-size: 30px;
    text-align: center;
  }

  .n_about_m_3 {
    font-size: 36px;
    color: #666666;
    text-align: center;
    display: block;
    margin: 0 auto;
    padding-top: 15px;
  }

  .n_about_m_4 {
    font-size: 13px;
    color: #666666;
    text-align: center;
    display: block;
    margin: 0 auto;
    line-height: 26px;
    margin-bottom: 28px;
    margin-top: 9px;
  }

  .n_about_m_5 {
    width: 776px;
    height: 236px;
    overflow: hidden;
    margin-left: 210px;
  }

  .n_about_m_bottom {
    transition: all 1.0s ease 0s;
    width: 181px;
    height: 44px;
    margin: 0 auto;
    margin-top: 71px;
    background: #637d8e;
    text-align: center;
    line-height: 44px;
    display: block;
  }

  .n_about_m_bottom a {
    color: #ffffff;
    font-size: 13px;
    display: block;
  }

  .n_about_m_bottom:hover {
    background: #4F6371;
  }

  .about2 {
    width: 1100px;
    height: 428px;
    margin: 0 auto;
    overflow: hidden;
  }


  .nnews_lb_2 {
    color: #666666;
    text-align: center;
    display: block;
    font-size: 12px;
    margin-top: 7px;
    margin-bottom: 100px;
    width: 217px;
    margin-left: 2px;
  }

  .nnews_lb_1 {
    margin: 0 auto;
    display: block;
    padding-top: 74px;
    height: 105px;
    width: 220px;
    margin-bottom: 155px;
  }

  .nnews_lb_1_1 {
    margin: 0 auto;
    display: block;
    width: 220px;
    height: 77px;
    line-height: 75px;
    font-size: 30px;
    text-align: center;
  }

  .nnews_lb {
    width: 1200px;
    margin: 0px auto;
    background: url(../images/cgage1mfjz6ayqitaab5ka95pt4495.png)no-repeat;
    overflow: hidden;
    box-shadow: 0px 7px 19px 0px #ededed;
  }

  .nnews_lb_m {
    width: 958px;
    height: 160px;
    position: relative;
    border-bottom: 1px solid #f6f6f6;
    margin-top: 10px;
    margin: 0 auto;
    margin-bottom: 29px;
  }

  .nnews_lb_m:nth-of-type(1) {
    margin-top: 112px;
  }

  .nnews_lb_m:hover .nnews_lb_title {
    margin-left: 15px;
  }

  .nnews_lb_m:hover .nnews_lb_title a {
    color: #333333;
  }

  .nnews_lb_m:hover .nnews_lb_cnt {
    margin-left: 15px;
  }

  .nnews_lb_m:hover .nnews_lb_date {
    background: url(../images/jiantou.png)no-repeat 49px 49px;
    color: #333333;
  }

  .nnews_lb_img {
    position: absolute;
    left: 0;
    top: 0;
  }

  .nnews_lb_img img {
    width: 200px;
    height: 130px;
    border: 0px;
  }

  .nnews_lb_title {
    transition: all 0.6s ease 0s;
    position: absolute;
    left: 234px;
    top: 16px;
    width: 500px;
    white-space: nowrap;
    font-size: 16px;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    -moz-binding: url('ellipsis.xml#ellipsis');
  }

  .nnews_lb_title a {
    color: #575757;
    text-decoration: none;
  }

  .nnews_lb_title a:hover {
    color: #333333;
  }

  .nnews_lb_cnt {
    transition: all 0.6s ease 0s;
    position: absolute;
    left: 235px;
    top: 54px;
    width: 500px;
    height: 84px;
    overflow: hidden;
    font-size: 14px;
    line-height: 28px;
    color: #999999;
  }

  .nnews_lb_date {
    background: url(../images/jiantou.png)no-repeat -49px 49px;
    transition: all 0.6s ease 0s;
    position: absolute;
    top: 14px;
    right: 68px;
    font-size: 12px;
    color: #CCC;
    width: 81px;
    height: 100px;
  }

  .nnews_lb_bq {
    float: left;
    color: #666;
    margin-right: 5px;
  }

  .nnews_lb_date1,
  .nnews_lb_date2,
  .nnews_lb_date3,
  .nnews_lb_date4,
  .nnews_lb_date5 {
    font-family: "寰蒋闆呴粦";
    float: left;
    font-size: 29px;
  }

  .nnews_lb_bq1 {
    float: left;
    color: #666;
    margin-right: 5px;
  }

  .nnews_lb_date1,
  .nnews_lb_date2 {
    display: none;
  }

  .nnews_lb_click {
    position: absolute;
    top: 23px;
    left: 410px;
    font-size: 12px;
    color: #CCC;
    display: none;
  }

  .nnews_lb_xq {
    position: absolute;
    top: 120px;
    right: 0px;
    display: none;
  }

  .nnews_lb_xq a {
    color: #333;
    text-decoration: none;
  }

  .n_content_new {

    width: 1200px;
    margin: 0 auto;
    background: #fff;
  }

  .news_view {
    width: 1098px;
    color: #818181;
    line-height: 26px;
    margin: 0 auto;
  }

  .news_view_head {
    width: 1098px;
    position: relative;
    height: 80px;
    margin-left: 50px;
    padding-top: 83px;
  }

  .n_content_new {
    width: 1200px;
    margin: 0 auto;
    background: #fff;
  }

  .xn_c_newsv_15_from {
    float: left;
    color: #c1c1c1;
    font-size: 12px;
    margin-top: 8px;
    margin-right: 52px;
  }

  .news_view_head {
    width: 1098px;
    position: relative;
    height: 80px;
    margin-left: 50px;
    padding-top: 83px;
  }

  .news_view_title {
    font-size: 16px;
    color: #444444;
    font-weight: bold;
    width: 1098px;
  }

  .news_view_date {
    position: absolute;
    left: 100px;
    top: 40px;
  }

  .news_view_click {
    float: left;
    color: #c1c1c1;
    font-size: 12px;
    margin-top: 7px;
  }

  .news_view_sx #EIMS_C_3_1_box_div {
    width: 1098px;
    margin: 20px auto;
    overflow: hidden;
    margin-top: 30px;
  }

  .news_view_sx #EIMS_C_3_1_box_div ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
  }

  .news_view_sx #EIMS_C_3_1_box_div li {
    float: left;
    margin-right: 20px;
  }

  .news_view_sx .EIMS_C_3_1_page {
    FONT-SIZE: 12px;
    COLOR: #6a6a6a;
    LINE-HEIGHT: 20px;
  }

  .news_view_sx .EIMS_C_3_1_page A:link {
    COLOR: #6a6a6a;
    TEXT-DECORATION: none;
  }

  .news_view_sx .EIMS_C_3_1_page A:visited {
    COLOR: #6a6a6a;
    TEXT-DECORATION: none;
  }

  .news_view_sx .EIMS_C_3_1_page A:hover {
    COLOR: #007ac3;
  }

  .news_view_sx.EIMS_C_3_1_page a {
    color: #000000;
    font-size: 14px;
  }

  .news_view_sx #EIMS_C_3_1_Upli {
    float: left;
    width: 585px;
    margin-bottom: 14px;
  }

  .news_view_sx #EIMS_C_3_1_Upli a:hover {
    color: #007ac3;
  }

  .news_view_sx #EIMS_C_3_1_Upli a:hover #EIMS_C_3_1_UpNew {
    text-decoration: underline;
  }

  .news_view_sx #EIMS_C_3_1_Downli {
    float: right;
  }

  .news_view_sx #EIMS_C_3_1_Downli a:hover {
    color: #007ac3;
  }

  .news_view_sx #EIMS_C_3_1_Downli a:hover #EIMS_C_3_1_DownNew {
    text-decoration: underline;
  }

  .xn_c_newsv_7_dansheng1 {
    width: 66px;
    height: 22px;
    color: #666666;
    font-size: 12px;
    background-color: #f0f0f0;
    display: block;
    position: absolute;
    margin-top: 94px;
    line-height: 22px;
    text-align: center;
  }

  .xn_c_newsv_7_wrap {
    width: 1098px;
    margin: 0 auto;
    margin-bottom: 119px;
  }

  .sv_view_body .xn_c_newsv_7_wrap {
    margin-bottom: 37px;
  }

  .xn_c_newv_7_wbox {
    width: 100%;
  }

  .xn_c_newv_7_wbox>ul {
    overflow: hidden;
    max-height: 222px;
    border-top: 2px solid #e5e5e5;
    background: url(../images/minde.png)no-repeat center;
  }

  .xn_c_newv_7_wbox ul li:nth-of-type(1) {
    width: 100%;
    margin-top: 15px;
    padding-left: 0px;
    margin-bottom: 34px;
  }

  .xn_c_newsv_7_list {
    line-height: 18px;
    float: left;
    width: 478px;
    height: 18px;
  }

  .news_view_body .xn_c_newsv_7_list {
    line-height: 18px;
    float: left;
    width: 549px;
    height: 18px;
  }

  .xn_c_newsv_7_list:nth-of-type(2n+1) {
    width: 402px;
    padding-left: 72px
  }

  .xn_c_newsv_7_list a {
    color: #6a6a6a;
    font-size: 12px;
  }

  .xn_c_newsv_7_list a:hover {
    text-decoration: underline;
    color: #007ac3;
  }

  .xn_c_newsv_7_headImg {
    width: 30px;
    height: 30px;
    background: url(../images/xn_c_index_62_right.png) no-repeat center;
    float: left;
  }

  .xn_c_newsv_7_headTitle {
    float: left;
  }

  .xn_c_newsv_7_title {
    float: left;
    text-indent: 12px;
    background: url(../images/views_icon.png) no-repeat 0 14px;
    width: 316px;
    height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .xn_c_newsv_7_clickcount {
    float: left;
    display: none;
  }

  .xn_c_newsv_7_time {
    float: left;
    font-size: 12px;
    color: #6a6a6a;
    letter-spacing: -1px;
  }

  .xn_c_newsv_7_neirong {
    height: 44px;
    line-height: 22px;
    overflow: hidden;
    display: none;
  }

  .xn_c_newsv_7_headmore {
    display: none;
  }

  .footer {
    padding: 25px 0;
    background: #c9cacc;
    color: #666;
  }

  .footer .company-info-box {
    margin-top: 25px;
  }

  .footer .company-info-box .row {
    display: flex;
    justify-content: space-between;
  }

  .footer .company-info-box .row .col-sm-9 {
    display: flex;
  }

  .footer .company-info-box .row .company-info {
    margin-left: 10px;
    padding: 0 10px;
    border-left: 1px solid #000;
    font-size: 12px;
  }

  .footer .company-info-box .row .col-sm-3 {
    width: auto;
  }
}

.p_imgallbox {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}


.p_imgall {
	padding-top: 60px;
	width: 49%;
	background-color: #222222;
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
	margin-right: 5px;
}

.p_imgpic {
	flex-shrink: 0;
	width: 300px;
	height: 200px;
	object-fit: fill;
}

.p_imgname {
	color: #fefefe;
	font-size: 30px;
	line-height: 36px;
}

.p_imgwcon {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	padding-left: 20px;
}

.p_imgdesc {
	padding-top: 10px;
	color: #808080;
	margin-bottom: 30px;
	/* height: 40px;
	overflow: hidden; */
	line-height: 20px;
	display: -webkit-box;
	    -webkit-box-orient: vertical;
	    -webkit-line-clamp: 2;
	    overflow: hidden;
}

.p_imgbtn {
	padding: 5px 0;
	text-align: center;
	width: 130px;
	background-color: #cccccc;
	border-radius: 20px;
}



/* 划光 */
.p_imgpicbox {
	flex-shrink: 0;
	overflow: hidden;
	width: 300px;
  height: 200px;
  line-height: 200px;
  text-align: center;
	color: #fff;
  position: relative;
  transition: .5s;
}

.p_imgpicbox::after {
    content: '';
    /* 绝对定位 */
    position: absolute;
    top: 100px;
    left: 0;
    width: 600px;
    height: 70px;
    /* 背景渐变色 */
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(255, 255, 255, .3), rgba(0, 0, 0, 0));
    /* 让元素旋转-45度 位置距离距离左边不变化，距离下面走360像素的距离 */
    transform: rotate(-45deg) translate(0, -360px);
}

.p_imgall:hover .p_imgpicbox::after {
    /* 过渡时长 */
    transition: 1s;
    transform: rotate(-45deg) translate(0, 100px);
}

.p_imgpicbox:hover {
   /* margin-top: -20px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, .2); */
}

.p_imgall:hover {
	transition: 0.3s;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, .5);
}

.p_imgall:hover .fa.fa-long-arrow-right {
	transition: 0.3s;
	padding-left: 10px;
}




/* 切换语言 */
.changelbox {
	position: absolute;
	display: flex;
	align-items: center;
	left: 50%;
	top: 80%;
	transform: translateX(-50%);
	z-index: 9999999;
	color: #fff;
}

.changel-flag>a {
	padding: 0 5px;
	display: flex;
	align-items: center;
}

#ea_ba {
	position: relative;
}

.mochangelbox {
	display: flex;
	align-items: center;
}