@charset "UTF-8";
@font-face {
  font-family: 'black';
  src: url("../fonts/notosanshans-black.ttf") format("truetype"); }
@font-face {
  font-family: 'regular';
  src: url("../fonts/notosanshans-regular.ttf") format("truetype"); }
@font-face {
  font-family: 'regular2';
  src: url("../fonts/notoregular.ttf") format("truetype"); }
@font-face {
  font-family: 'medium';
  src: url("../fonts/notosanshans-medium.ttf") format("truetype"); }
@font-face {
  font-family: 'bold';
  src: url("../fonts/notosanshans-bold.ttf") format("truetype"); }
@font-face {
  font-family: 'numbers';
  src: url("../fonts/factory-liningnumbers.ttf") format("truetype"); }
@font-face {
  font-family: 'din-bold';
  src: url("../fonts/din_bold.ttf") format("truetype"); }
@font-face {
  font-family: 'din-blck';
  src: url("../fonts/din_black_0.ttf") format("truetype"); }
@font-face {
  font-family: 'din-regular';
  src: url("../fonts/din-regular.ttf") format("truetype"); }
* {
  padding: 0;
  margin: 0;
  outline: none;
  font-family: "Microsoft Yahei"; }

html {
  font-size: calc(22px + 6 * (100vw - 1000px) / 1000); 
}

input,
textarea {
  border: none;
  outline: none; }
  input::-webkit-input-placeholder,
  textarea::-webkit-input-placeholder {
    color: #d4d4d4;
    font-weight: normal;
    font-family: 'regular2'; }

ul {
  list-style: none; }

body {
  position: relative;
  background-color: #fff; }

a {
  text-decoration: none; }

.hide {
  display: none !important; }

.vhide {
  visibility: hidden; }

.bg-grey {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #000;
  opacity: 0.65;
  z-index: 29; }

.line {
  position: absolute;
  content: '';
  height: 100%;
  width: 1px;
  z-index: -1;
  background-color: #eeeeee; }

.line-left {
  left: 8.3333%; }

.line-middle {
  left: 41.6666%; }

.line-right {
  right: 8.3333%; }

.letter-four {
  letter-spacing: 1px; }

.letter-seven {
  letter-spacing: 1.3px; }

.letter-thirteen {
  letter-spacing: 1.7px; }

.contact-bg {
  position: relative;
  padding-top: 110px;
  width: 100%;
  height: 2.7rem;
  background: url("../images/contact-bg.jpg") 100% 100%;
  background-size: cover; }
  .contact-bg .line {
    background-color: #eeeeee;
    z-index: 2;
    opacity: 0.2; }

main {
  position: relative;
  width: 100%;
  background: #fafafa; }
  main .contact-container {
    position: relative;
    display: inline-block;
    width: 83.3333%;
    margin-left: 8.3333%;
    margin-right: 8.3333%;
    margin-top: -0.9rem;
    padding: 0.46rem 5.3% 2rem 5.3%;
    background: #fff;
    box-sizing: border-box;
    z-index: 3; }
    main .contact-container:after {
      content: '';
      display: block;
      clear: both; }
    main .contact-container .contact-us {
      float: left;
      width: 130px;
      height: 19px; }
    main .contact-container .crumbs-wrapper {
      float: right;
      font-size: 14px;
      color: #000000; }
      main .contact-container .crumbs-wrapper .crumbs-right {
        margin-left: 15px;
        margin-right: 15px;
        display: inline-block;
        background: url(../images/jt_b.png) no-repeat 0 6px;
        width: 4px;
        height: 14px; }
      main .contact-container .crumbs-wrapper .about-title {
        margin-left: 10px;
        opacity: 0.5; }
        main .contact-container .crumbs-wrapper .about-title:hover {
          opacity: 1; }
      main .contact-container .crumbs-wrapper .index-text {
        cursor: pointer;
        opacity: 0.5;
        transition: all .5s; }
        main .contact-container .crumbs-wrapper .index-text:hover {
          opacity: 1; }
      main .contact-container .crumbs-wrapper .contact-us-text {
        opacity: 1;
        letter-spacing: -0.3px; }
    main .contact-container > h5 {
      margin-top: 0.09rem;
      font-size: 0.4rem;
      font-weight: bold; }
    main .contact-container .short-line {
      width: 0.36rem;
      height: 4px;
      margin-top: 0.14rem;
      background-color: #000000; }
    main .contact-container .contact-img-wrapper {
      margin-top: 1rem; }
      main .contact-container .contact-img-wrapper:after {
        display: block;
        clear: both;
        content: ''; }
      main .contact-container .contact-img-wrapper > li {
        float: left;
        height: 3.2rem;
        background-color: #f1f1f2;
        font-size: 0.16rem;
        margin-left: 0.7%;
        overflow: hidden; }
        main .contact-container .contact-img-wrapper > li:nth-of-type(1) {
          margin-left: 0; }
        main .contact-container .contact-img-wrapper > li:nth-of-type(4) {
          margin-left: 0; }
        main .contact-container .contact-img-wrapper > li h6 {
          font-weight: bold;
          font-size: 0.25rem;
          letter-spacing: -0.6px; }
        main .contact-container .contact-img-wrapper > li > img {
          transition: .8s transform;
          cursor: pointer; }
          main .contact-container .contact-img-wrapper > li > img:hover {
            transform: scale(1.06, 1.06); }
      main .contact-container .contact-img-wrapper .contact-info {
        width: 58%;
        padding: 1.1rem 0 0.5rem 4.3%;
        box-sizing: border-box; }
        main .contact-container .contact-img-wrapper .contact-info > div {
          margin-top: 0.16rem;
          letter-spacing: -0.4px; }
          main .contact-container .contact-img-wrapper .contact-info > div > span:nth-of-type(2) {
            color: #585858; }
      main .contact-container .contact-img-wrapper .banner-img1 {
        width: 18.3%; }
        main .contact-container .contact-img-wrapper .banner-img1 > img {
          width: 100%;
          height: 100%; }
      main .contact-container .contact-img-wrapper .banner-img2 {
        width: 22.3%; }
        main .contact-container .contact-img-wrapper .banner-img2 > img {
          width: 100%;
          height: 100%; }
      main .contact-container .contact-img-wrapper .blue-banner {
        width: 77%;
        font-size: 0.18rem;
        background: url("../images/contact-banner3.png") no-repeat;
        background-size: cover;
        color: #fff;
        margin-top: 0.1rem; }
        main .contact-container .contact-img-wrapper .blue-banner .email-wrapper {
          margin-top: 2.1rem;
          margin-left: 5.5%;
          letter-spacing: -0.4px; }
          main .contact-container .contact-img-wrapper .blue-banner .email-wrapper > div {
            float: left;
            margin-left: 5%;
            padding-left: 5%;
            border-left: 1px solid rgba(255, 255, 255, 0.3); }
            main .contact-container .contact-img-wrapper .blue-banner .email-wrapper > div:nth-of-type(1) {
              border-left: none;
              margin-left: 0;
              padding-left: 0; }
            main .contact-container .contact-img-wrapper .blue-banner .email-wrapper > div .text {
              font-size: 0.16rem; }
            main .contact-container .contact-img-wrapper .blue-banner .email-wrapper > div .email {
              position: relative;
              cursor: pointer;
              font-family: 'medium';
              font-size: 0.13rem; }
              main .contact-container .contact-img-wrapper .blue-banner .email-wrapper > div .email::after {
                content: "";
                position: absolute;
                width: 0;
                bottom: 0;
                height: 2px;
                color: #fff;
                background: #fff;
                right: 0;
                -webkit-transition: width 0.3s cubic-bezier(0.37, 0, 0.21, 1.02);
                transition: width 0.3s cubic-bezier(0.37, 0, 0.21, 1.02); }
              main .contact-container .contact-img-wrapper .blue-banner .email-wrapper > div .email:hover:after {
                left: 0;
                right: auto;
                width: 100%; }
      main .contact-container .contact-img-wrapper .banner-img4 {
        width: 22.3%;
        margin-top: 0.1rem; }
        main .contact-container .contact-img-wrapper .banner-img4 > img {
          width: 100%;
          height: 100%; }
    main .contact-container .branch-office {
      margin-top: 1rem; }
      main .contact-container .branch-office h6 {
        font-weight: bold;
        font-size: 0.25rem;
        letter-spacing: -0.6px; }
      main .contact-container .branch-office > ul {
        margin-top: 0.3rem;
        letter-spacing: -0.4px; }
        main .contact-container .branch-office > ul li {
          position: relative;
          width: 100%;
          box-sizing: border-box;
          height: 0.8rem;
          line-height: 0.8rem;
          border-top: 1px solid #ececec;
          padding: 0.25rem 0; }
          main .contact-container .branch-office > ul li > div {
            height: 100%;
            font-size: 0.18rem;
            color: #808080;
            position: relative;
            line-height: 0.3rem; }
            main .contact-container .branch-office > ul li > div ::after {
              display: block;
              clear: both;
              content: ''; }
            main .contact-container .branch-office > ul li > div span {
              color: #000;
              position: absolute;
              display: inline-block; }
            main .contact-container .branch-office > ul li > div span:nth-child(1) {
              font-size: .18rem; }
            main .contact-container .branch-office > ul li > div span:nth-child(2) {
              left: 1.3rem;
              color: #707070;
              font-size: .16rem; }
            main .contact-container .branch-office > ul li > div span:nth-child(3) {
              left: 7.1rem;
              color: #707070;
              font-size: .16rem; }
        main .contact-container .branch-office > ul li:last-child {
          border-bottom: 1px solid #ececec; }
  main .to_top_box_contact {
    display: none;
    position: fixed;
    bottom: 2rem;
    right: .7rem;
    height: .9rem;
    width: .9rem;
    z-index: 5; }
    main .to_top_box_contact > div {
      position: relative; }
      main .to_top_box_contact > div .to_top_contact {
        position: absolute;
        width: 0.9rem;
        height: 0.9rem;
        background: #38ac60;
        cursor: pointer;
        transition: background-color 0.4s cubic-bezier(0.85, 0.01, 0.14, 0.99) 0.06s; }
        main .to_top_box_contact > div .to_top_contact div {
          width: 3px;
          height: 0.28rem;
          margin: 0.34rem auto 0;
          background: #fff; }
        main .to_top_box_contact > div .to_top_contact i {
          display: block;
          width: 21px;
          height: 0.33rem;
          background: url("../images/to_top.png") no-repeat;
          position: absolute;
          left: 0;
          right: 0;
          margin: auto;
          top: 0.29rem;
          transition: top 0.4s cubic-bezier(0.85, 0.01, 0.14, 0.99) 0.06s; }
        main .to_top_box_contact > div .to_top_contact:hover {
          background: #339856; }
          main .to_top_box_contact > div .to_top_contact:hover i {
            top: 0.18rem; }
  @media screen and (min-width: 2000px) {
    main #contact-head-text {
      font-size: 40px !important; } }
  main .current {
    animation: fadeIn .5s linear 1;
    -webkit-animation: fadeIn .5s linear 1;
    -moz-animation: fadeIn .5s linear 1;
    -o-animation: fadeIn .5s linear 1;
    -ms-animation: fadeIn .5s linear 1; }
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    /*初始状态 透明度为0*/ }
  50% {
    opacity: 0.5;
    /*中间状态 透明度为0*/ }
  100% {
    opacity: 1;
    /*结尾状态 透明度为1*/ } }

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