body {
  overflow-x: hidden;
}
::-moz-placeholder {
  color: #C9CEE6;
}
::-webkit-input-placeholder {
  color: #C9CEE6;
}
:-ms-input-placeholder {
  color: #C9CEE6;
}
body,
textarea,
input {
  font-family: PingFang SC, Microsoft YaHei, Helvetica, Arial, sans-serif;
}
.swiper-container {
  height: 599px;
}
body .m-header {
  position: relative;
  overflow: hidden;
}
body .m-header .pagination {
  position: absolute;
  z-index: 20;
  bottom: 130px;
  width: 100%;
  text-align: center;
}
body .m-header .swiper-pagination-switch {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #555;
  margin: 0 5px;
  opacity: 0.2;
  border: 2px solid #fff;
  cursor: pointer;
}
body .m-header .swiper-active-switch {
  background: #9FA7EC;
  border: none;
  opacity: 1;
}
body .m-header .background1 {
  width: 100%;
  height: 599px;
  background: url(../images/banner01@1x.png) center center no-repeat;
}
body .m-header .background2 {
  width: 100%;
  height: 599px;
  background: url(../images/banner02@1x.png) center center no-repeat;
}
body .m-header .m-header-bottom {
  width: 100%;
  position: absolute;
  bottom: 1px;
  background: rgba(12, 20, 77, 0.35);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4c000000, 0, endColorstr=#4c000000, 0);
  z-index: 10;
}
body .m-header .m-header-bottom .container {
  width: 1180px;
  margin: 21px auto 20px;
}
body .m-header .m-header-bottom .item {
  float: left;
  width: 25%;
  text-align: center;
  padding-top: 42px;
  position: relative;
  color: #8391C9;
  letter-spacing: 0;
}
body .m-header .m-header-bottom .item .img {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -16px;
  width: 33px;
  height: 30px;
}
body .m-header .m-header-bottom .item .img.rate {
  background: url(../images/rate@1x.png) center center no-repeat;
}
body .m-header .m-header-bottom .item .img.protect {
  background: url(../images/protect@1x.png) center center no-repeat;
  width: 30px;
  height: 32px;
  margin-left: -15px;
}
body .m-header .m-header-bottom .item .img.pledge {
  background: url(../images/pledge@1x.png) center center no-repeat;
}
body .m-header .m-header-bottom .item .img.service {
  background: url(../images/service@1x.png) center center no-repeat;
  width: 32px;
  height: 32px;
}
.m-introduce {
  background: #fff;
  width: 1180px;
  margin: 0 auto;
  text-align: center;
}
.m-introduce .m-introduce-header {
  margin-top: 50px;
  font-size: 28px;
  color: #4C5795;
  letter-spacing: 0;
  line-height: 32px;
  font-weight: bolder;
}
.m-introduce .m-introduce-header.first {
  margin-top: 20px;
}
.m-introduce .m-introduce-header .m-introduce-header-sub {
  font-size: 14px;
  line-height: 17px;
  color: #A1ABDF;
  margin-top: 11px;
  font-weight: normal;
}
.m-introduce .m-introduce-header .marquee {
  line-height: 20px;
}
.m-introduce .m-introduce-header .marquee a{
  font-size: 14px;
  color: #333;
}
.m-introduce .m-introduce-text {
  margin-top: 40px;
  color: #000000;
  letter-spacing: 0;
  line-height: 24px;
  text-align: justify;
  text-indent: 30px;
}
.m-introduce .m-introduce-img {
  margin-top: 30px;
  width: 1180px;
  height: 300px;
  background: url(../images/introduce@1x.png) center center no-repeat;
}
.m-introduce .m-introduce-step {
  text-align: center;
  margin: 45px auto 50px;
}
.m-introduce .m-introduce-step .step {
  width: 125px;
  display: inline-block;
  *display: inline;
  zoom: 1;
}
.m-introduce .m-introduce-step .step .img {
  width: 89px;
  height: 82px;
  margin-left: 6px;
}
.m-introduce .m-introduce-step .step .img.commit {
  background: url(../images/commit@1x.png) center center no-repeat;
}
.m-introduce .m-introduce-step .step .img.pass {
  background: url(../images/pass@1x.png) center center no-repeat;
}
.m-introduce .m-introduce-step .step .img.write {
  background: url(../images/write@1x.png) center center no-repeat;
}
.m-introduce .m-introduce-step .step .title {
  font-size: 14px;
  margin-top: 26px;
  color: #333333;
  letter-spacing: 0;
  text-align: center;
}
.m-introduce .m-introduce-step .middle {
  width: 95px;
  height: 1px;
  background: url(../images/Line@1x.png) center center no-repeat;
  display: inline-block;
  *display: inline;
  zoom: 1;
  margin: 0 36px;
  position: relative;
  top: -81px;
}
.m-rule {
  background: #E9F0F9;
  overflow: hidden;
}
.m-rule .m-rule-header {
  text-align: center;
  margin-top: 50px;
  font-size: 28px;
  color: #4C5795;
  letter-spacing: 0;
  line-height: 32px;
  font-weight: bolder;
}
.m-rule .m-rule-header .m-rule-header-sub {
  font-size: 14px;
  line-height: 17px;
  color: #A1ABDF;
  margin-top: 11px;
  font-weight: normal;
}
.m-rule .m-rule-content {
  text-align: center;
  margin: 50px auto 102px;
}
.m-rule .m-rule-content .text {
  width: 440px;
  text-align: justify;
  position: relative;
  bottom: 25px;
  text-indent: 30px;
}
.m-rule .m-rule-content .img {
  margin-right: 58px;
  width: 112px;
  height: 152px;
  background: url(../images/license@1x.png) center center no-repeat;
}
.m-rule .m-rule-content .cell {
  display: inline-block;
  *display: inline;
  zoom: 1;
  color: #333333;
  letter-spacing: 0;
  line-height: 24px;
}
.m-footer-img {
  width: 1182px;
  height: 344px;
  background: url(../images/map@1x.png) center center no-repeat;
  margin: 60px auto 0;
}
.m-footer {
  background: #fff;
}
.m-connect {
  width: 100%;
  background: url(../images/connect-me@1x.png) center center no-repeat;
  background-size: cover;
  overflow: hidden;
}
.m-connect .title {
  font-size: 28px;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  margin: 45px auto 57px;
}
.m-connect .m-connect-form {
  width: 608px;
  margin: 0 auto;
}
.m-connect .m-connect-form .item {
  float: left;
  margin-bottom: 24px;
  background: #FFFFFF;
  border-radius: 4px;
  position: relative;
}
.m-connect .m-connect-form .item .error {
  background: #FF9985;
  border-radius: 4px;
  font-size: 12px;
  color: #FFFFFF;
  letter-spacing: 0;
  line-height: 14px;
  padding: 7px 16px;
  position: absolute;
  white-space: nowrap;
  top: 50%;
  margin-top: -14px;
}
.m-connect .m-connect-form .item .error.right {
  left: 306px;
}
.m-connect .m-connect-form .item .error.right::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-right: 5px solid #FF9985;
  left: -5px;
  top: 50%;
  margin-top: -5px;
}
.m-connect .m-connect-form .item .error.right.text {
  left: 625px;
  bottom: 30px;
  top: inherit;
  margin-top: 0;
}
.m-connect .m-connect-form .item .error.left {
  right: 306px;
}
.m-connect .m-connect-form .item .error.left::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid #FF9985;
  right: -5px;
  top: 50%;
  margin-top: -5px;
}
.m-connect .m-connect-form .item .connect-input {
  width: 289px;
  height: 44px;
  padding: 14px 16px;
  border: none;
  border-radius: 4px;
  font-size: 14px;
  color: #575D7F;
}
.m-connect .m-connect-form .item .connect-text {
  font-size: 14px;
  width: 608px;
  height: 168px;
  padding: 14px 16px;
  border: none;
  border-radius: 4px;
  color: #575D7F;
  resize: none;
}
.m-connect .m-connect-button {
  background: #456EE1;
  border-radius: 4px;
  width: 180px;
  height: 44px;
  margin: 16px auto 50px;
  line-height: 44px;
  color: #fff;
  text-align: center;
  overflow: hidden;
  cursor: pointer;
}
.clearfix::after {
  clear: both;
  content: '.';
  display: block;
  width: 0;
  height: 0;
  visibility: hidden;
}
input:focus,
textarea:focus {
  outline: none;
}
.custom-placeholder {
  color: #575D7F;
}
/*
 * Swiper 2.7.6
 * Mobile touch slider and framework with hardware accelerated transitions
 *
 * http://www.idangero.us/sliders/swiper/
 *
 * Copyright 2010-2015, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us/
 *
 * Licensed under GPL & MIT
 *
 * Released on: February 11, 2015
*/
/* ===============================================================
Basic Swiper Styles 
================================================================*/
.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  direction: ltr;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  /* Fix of Webkit flickering */
  z-index: 1;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  -webkit-transition-property: -webkit-transform, left, top;
  -webkit-transition-duration: 0s;
  -webkit-transform: translate3d(0px, 0, 0);
  -webkit-transition-timing-function: ease;
  -moz-transition-property: -moz-transform, left, top;
  -moz-transition-duration: 0s;
  -moz-transform: translate3d(0px, 0, 0);
  -moz-transition-timing-function: ease;
  -o-transition-property: -o-transform, left, top;
  -o-transition-duration: 0s;
  -o-transform: translate3d(0px, 0, 0);
  -o-transition-timing-function: ease;
  -o-transform: translate(0px, 0px);
  -ms-transition-property: -ms-transform, left, top;
  -ms-transition-duration: 0s;
  -ms-transform: translate3d(0px, 0, 0);
  -ms-transition-timing-function: ease;
  -webkit-transition-property: left, top, -webkit-transform;
  transition-property: left, top, -webkit-transform;
  transition-property: transform, left, top;
  transition-property: transform, left, top, -webkit-transform;
  transition-duration: 0s;
  transform: translate3d(0px, 0, 0);
  transition-timing-function: ease;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.swiper-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -ms-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  float: left;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
  -ms-touch-action: pan-y;
}
.swiper-wp8-vertical {
  -ms-touch-action: pan-x;
}
/* ===============================================================
Your custom styles, here you need to specify container's and slide's
sizes, pagination, etc.
================================================================*/
.swiper-container {
  /* Specify Swiper's Size: */
  /*width:200px;
	height: 100px;*/
}
.swiper-slide {
  /* Specify Slides's Size: */
  /*width: 100%;
	height: 100%;*/
}
.swiper-slide-active {
  /* Specific active slide styling: */
}
.swiper-slide-visible {
  /* Specific visible slide styling: */
}
/* ===============================================================
Pagination Styles
================================================================*/
.swiper-pagination-switch {
  /* Stylize pagination button: */
}
.swiper-active-switch {
  /* Specific active button style: */
}
.swiper-visible-switch {
  /* Specific visible button style: */
}

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