/* Copyright 2015-2020 JiuBenMu, Co.Ltd.*/
/*
  .monkee {
    @include clearfix;
  }
*/
/* # USAGE #
  .monkee {
    @include transition-custom(timing-function, cubic-bezier(0.755, 0.050, 0.855, 0.060));
  }
*/
/* # USAGE #
  .visuallyhidden {
    @include visuallyhidden;
  }
*/
/* # USAGE #
  .icon {
    @include pseudo-elements(before, 1.56em, .125em) {
      background: #333;
      top: .25em;
    }
  }
*/
/* Functions */
/* # Return a unitless number. */
/*
  # Convert Photoshop letter spacing to pixels. http://justinmarsan.com/css-letter-spacing-in-photoshop-and-browsers/
  @params(photoshop-letter-spacing, font-size-in-pixels)

  .foo {
    letter-spacing: letter-spacing-calc(25, 16);
  }
*/
/*
  # Convert px to em.
  @params(font-size-in-pixels, optional-em-base)

  .foo {
    margin-top: em-calc(42px);
  }
*/
.ui-border-t {
  border-top: 1px solid #e5e5e5; }

.ui-border-b {
  border-bottom: 1px solid #e5e5e5; }

.ui-border-tb {
  border-top: #e5e5e5 1px solid;
  border-bottom: #e5e5e5 1px solid;
  background-image: none; }

.ui-border-l {
  border-left: 1px solid #e5e5e5; }

.ui-border-r {
  border-right: 1px solid #e5e5e5; }

.ui-border {
  border: 1px solid #e5e5e5; }

.ui-border-radius {
  border: 1px solid #e5e5e5;
  border-radius: 4px; }

@media screen and (-webkit-min-device-pixel-ratio: 2) {
  .ui-border-radius {
    position: relative;
    border: 0; }

  .ui-border-radius:before {
    content: "";
    width: 200%;
    height: 200%;
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid #e5e5e5;
    -webkit-transform: scale(0.5);
    -webkit-transform-origin: 0 0;
    padding: 1px;
    -webkit-box-sizing: border-box;
    border-radius: 8px;
    pointer-events: none; } }
@media screen and (-webkit-min-device-pixel-ratio: 2) {
  .ui-border {
    position: relative;
    border: 0; }

  .ui-border-t, .ui-border-b, .ui-border-l, .ui-border-r, .ui-border-tb {
    border: 0; }

  .ui-border-t {
    background-position: left top;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)); }

  .ui-border-b {
    background-position: left bottom;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)); }

  .ui-border-t, .ui-border-b, .ui-border-tb {
    background-repeat: repeat-x;
    -webkit-background-size: 100% 1px; }

  .ui-border-tb {
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)), -webkit-gradient(linear, left top, left bottom, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5));
    background-position: top, bottom; }

  .ui-border-l {
    background-position: left top;
    background-image: -webkit-gradient(linear, right top, left top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)); }

  .ui-border-r {
    background-position: right top;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)); }

  .ui-border-l, .ui-border-r {
    background-repeat: repeat-y;
    -webkit-background-size: 1px 100%; }

  .ui-border:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)), -webkit-gradient(linear, left top, right top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)), -webkit-gradient(linear, left top, left bottom, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5)), -webkit-gradient(linear, right top, left top, color-stop(0.5, transparent), color-stop(0.5, #e5e5e5), to(#e5e5e5));
    -webkit-background-size: 100% 1px,1px 100%,100% 1px,1px 100%;
    background-size: 100% 1px,1px 100%,100% 1px,1px 100%;
    -webkit-background-size: 100% 1px,1px 100%,100% 1px,1px 100%;
    background-size: 100% 1px,1px 100%,100% 1px,1px 100%;
    background-repeat: no-repeat;
    background-position: top,right,bottom,left;
    padding: 1px;
    -webkit-box-sizing: border-box;
    z-index: 10;
    pointer-events: none; } }
/*reset style*/
body {
  -webkit-font-smoothing: antialiased;
  font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif; }

ol,
ul {
  list-style-type: none;
  margin-bottom: 0;
  padding-left: 0; }

a {
  color: #010101; }

a:focus, a:hover {
  color: #3fb7f2;
  text-decoration: none; }

dl,
p {
  margin-bottom: 0; }

img {
  max-width: 100%; }

/*commen style*/
.auto-box {
  max-width: 1400px;
  margin: 0 auto; }
  .auto-box:before, .auto-box:after {
    content: " ";
    display: table; }
  .auto-box:after {
    clear: both; }

.header {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
  height: 65px;
  background-color: #ffffff;
  border-bottom: 1px solid #ebf2f6; }
  .header .head-logo {
    float: left;
    margin-top: 20px; }
    .header .head-logo svg, .header .head-logo img {
      height: 25px; }
  .header .head-nav {
    float: right; }
    .header .head-nav li {
      float: left;
      font-size: 16px;
      line-height: 64px; }
      .header .head-nav li a {
        margin: 0 20px; }
  .header .head-right {
    padding-left: 80px;
    padding-top: 15px;
    float: right; }
    .header .head-right .btn-default {
      min-width: 100px;
      margin-left: 10px;
      border-radius: 17px; }

.banner {
  margin-top: 65px;
  height: 600px;
  background: url(../images/banner.jpg) center 0 no-repeat; }
  .banner h2 {
    margin-top: 160px;
    margin-bottom: 50px;
    font-weight: bold;
    font-size: 40px; }
  .banner p {
    width: 545px;
    font-size: 20px;
    line-height: 35px;
    margin-bottom: 86px; }
  .banner .btn {
    background-color: #ff7a1b;
    color: #ffffff;
    width: 205px;
    padding: 15px 12px;
    border-radius: 30px;
    font-size: 20px; }

.content-header {
  padding: 80px 0;
  text-align: center;
  font-size: 40px; }

.solution {
  margin: 0 -30px; }
  .solution:before, .solution:after {
    content: " ";
    display: table; }
  .solution:after {
    clear: both; }
  .solution .solution-item {
    float: left;
    width: 357px;
    height: 525px;
    background: url(../images/solution-item.png) 0 0 no-repeat;
    padding: 8px 11px 0;
    text-align: center;
    transition: all linear 0.2s; }
    .solution .solution-item:hover {
      transform: scale(1.02); }
    .solution .solution-item + .solution-item {
      margin-left: 10px; }
    .solution .solution-item img {
      margin-top: 48px;
      vertical-align: top; }
    .solution .solution-item dl {
      padding: 40px 40px 0; }
      .solution .solution-item dl dt {
        margin-bottom: 20px;
        font-size: 24px;
        font-weight: normal; }
      .solution .solution-item dl dd {
        font-size: 18px;
        line-height: 30px; }

.solution-tab {
  overflow: hidden; }
  .solution-tab .tab-content {
    float: left;
    width: 922px;
    height: 741px;
    overflow: hidden; }
    .solution-tab .tab-content img {
      vertical-align: top;
      display: none; }
  .solution-tab .tab-header {
    overflow: hidden;
    height: 741px;
    border-top: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5; }
    .solution-tab .tab-header .tab-item {
      height: 25%;
      padding-left: 160px;
      cursor: pointer; }
      .solution-tab .tab-header .tab-item + .tab-item {
        border-top: 1px solid #e5e5e5; }
      .solution-tab .tab-header .tab-item.a {
        background: url(../images/tab-icon1.png) 80px center no-repeat; }
      .solution-tab .tab-header .tab-item.b {
        background: url(../images/tab-icon2.png) 80px center no-repeat; }
      .solution-tab .tab-header .tab-item.c {
        background: url(../images/tab-icon3.png) 80px center no-repeat; }
      .solution-tab .tab-header .tab-item.d {
        background: url(../images/tab-icon4.png) 80px center no-repeat; }
      .solution-tab .tab-header .tab-item:hover {
        background-color: #f9f9f9; }
      .solution-tab .tab-header .tab-item h4 {
        margin: 0;
        padding-top: 62px;
        font-size: 24px;
        padding-bottom: 12px; }
      .solution-tab .tab-header .tab-item p {
        padding-right: 40px;
        font-size: 16px;
        color: #7c7c7c; }

.content-c .content-header {
  padding-bottom: 55px; }

.case-tab .tab-header {
  text-align: center; }
  .case-tab .tab-header .tab-item {
    display: inline-block;
    padding: 0 15px 15px;
    line-height: 1;
    margin: 0 55px;
    font-size: 26px;
    cursor: pointer; }
    .case-tab .tab-header .tab-item.active {
      border-bottom: 2px solid #4975e5; }

.pc-case {
  padding-top: 50px; }
  .pc-case ul {
    margin: 0 -25px;
    overflow: hidden; }
    .pc-case ul li {
      float: left;
      width: 435px;
      margin: 0 24px; }
      .pc-case ul li .img-box {
        overflow: hidden;
        width: 435px;
        height: 262px;
        border: 10px solid #f0f0f0;
        border-radius: 5px;
        box-shadow: 0 10px 10px #e7e7e7; }
        .pc-case ul li .img-box:hover img {
          transform: scale(1.1);
          transition: transform linear .2s; }
        .pc-case ul li .img-box img {
          display: block;
          transition: transform linear .3s; }
      .pc-case ul li dl {
        padding-top: 30px;
        padding-bottom: 50px;
        text-align: center; }
        .pc-case ul li dl dt {
          font-size: 16px;
          color: #676767;
          font-weight: normal; }
        .pc-case ul li dl dd {
          margin-top: 5px;
          font-size: 12px;
          color: #b1b1b1; }

.phone-case {
  padding-top: 50px; }
  .phone-case ul {
    margin: 0 -25px;
    overflow: hidden; }
    .phone-case ul li {
      float: left;
      width: 314px;
      margin: 0 24px; }
      .phone-case ul li .img-box {
        overflow: hidden;
        margin: 0 auto;
        width: 220px;
        height: 422px;
        transition: transform linear .2s; }
        .phone-case ul li .img-box:hover {
          transform: scale(1.02);
          transition: transform linear .1s; }
        .phone-case ul li .img-box img {
          display: block; }
      .phone-case ul li dl {
        padding-top: 30px;
        padding-bottom: 50px;
        text-align: center; }
        .phone-case ul li dl dt {
          font-size: 16px;
          color: #676767;
          font-weight: normal; }
        .phone-case ul li dl dd {
          margin-top: 5px;
          font-size: 12px;
          color: #b1b1b1; }

.content-d {
  height: 560px;
  background: #fff url(../images/about-us.jpg) center 0 no-repeat; }
  .content-d .content-header {
    padding-top: 40px;
    padding-bottom: 40px; }
  .content-d .about-us {
    float: left;
    width: 650px;
    padding: 48px;
    font-size: 18px;
    line-height: 40px;
    color: #676767; }
    .content-d .about-us p {
      padding-bottom: 10px; }
  .content-d .contact-us {
    float: right;
    width: 650px;
    padding: 48px; }
    .content-d .contact-us .form-control {
      height: 42px;
      border: 0;
      box-shadow: none;
      border-radius: 0;
      background-color: #ededed;
      resize: vertical; }
    .content-d .contact-us textarea.form-control {
      height: auto; }
    .content-d .contact-us .btn {
      background-color: #ff7a1b;
      border-radius: 0;
      color: #ffffff;
      outline: none; }

.footer {
  height: 80px;
  line-height: 80px;
  text-align: center;
  font-size: 14px;
  background-color: #f7f9fa; }
  .footer span {
    position: relative; }
    .footer span + span:before {
      content: '|';
      margin-left: 10px;
      padding-right: 10px;
      font-size: 12px;
      color: #999999; }

/*# sourceMappingURL=main.css.map */