@charset "utf-8";
/* CSS Document */

.margin {
  position: relative;
  width: 1200px;
  margin: 0 auto;
}

.title {
  overflow: hidden;
}

.title .title-left {
  float: left;
  font: 700 40px/58px "微软雅黑";
  margin-top: 76px;
  color: #777de8;
}

.title .title-right {
  float: left;
  font: 700 14px/42px "微软雅黑";
  margin: 96px 0 0 6px;
  color: #aaa;
}

.title .title-top {
  text-align: center;
  font: 700 40px/1 "微软雅黑";
  margin-top: 60px;
  color: #777de8;
}

.title .title-bottom {
  text-align: center;
  font: 700 14px/42px "微软雅黑";
  color: #aaa;
}

/* logo和nav */
#header {
  height: 120px;
  background: #fff;
  overflow: hidden;
}

#header .logo {
  margin-top: 27px;
  width: 206px;
  height: 67px;
  float: left;
}

#header .logo img {
  display: block;
  width: 100%;
  height: 100%;
}
#header .logo2 {
  margin: 66px 0 0 6px;
  width: 280px;
  height: 23px;
  float: left;
}

#header .logo2 img {
  display: block;
  width: 100%;
  height: 100%;
}

#header .nav {
  float: right;
}

#header .nav li {
  width: 100px;
  height: 120px;
  display: block;
  float: left;
}
#header .nav li a {
  cursor: pointer;
  text-align: center;
  width: 100px;
  height: 120px;
  display: block;
  font: 200 14px/120px "微软雅黑";
  color: #666;
}

#header .nav li.active a {
  color: #eccd3d;
}
#header .nav li a:hover {
  background: #eccd3d;
  color: #fff;
}

/* banner */
#banner img {
  width: 100%;
  height: 100%;
}

/* slogan */
#slogan {
  overflow: hidden;
  height: 280px;
}

#slogan ul {
  height: 100px;
  margin-top: 80px;
}

#slogan ul li {
  float: left;
}

/* 愿景与使命 */
#vision {
  position: relative;
  height: 600px;
  background: #eaebef;
}

.vision-img {
  width: 782px;
  height: 431px;
  position: absolute;
  left: -108px;
  bottom: -462px;
}
.vision-img img {
  width: 100%;
  height: 100%;
}

.vision-main {
  width: 500px;
  padding-right: 5px;
  position: absolute;
  top: 130px;
  right: 0;
}

.vision-main h3 {
  margin-top: 18px;
  font: 700 34px/66px "微软雅黑";
  color: #222;
}
.vision-main p {
  font: 200 14px/30px "微软雅黑";
  color: #666;
}

/* 我们的优势 */
#advantage {
  padding-bottom: 20px;
  background: #fff;
}

.advantage-main .advantage-main-l {
  margin-top: 40px;
  float: left;
  width: 580px;
}
.advantage-main .advantage-main-r {
  float: right;
  width: 580px;
}
.advantage-main .advantage-main-r img {
  margin: 120px 0 60px 10px;
}

.advantage-main h3 {
  font: 700 34px/60px "微软雅黑";
  color: #222;
}
.advantage-main p {
  font: 200 14px/28px "微软雅黑";
  color: #666;
  margin-bottom: 15px;
}

/* 我们的产品 */
#products {
  background: #3387e9;
  padding-bottom: 50px;
}

#products .title .title-left {
  color: #fff;
}

#products .title .title-right {
  color: #fff;
}

.products-main {
  margin-top: 50px;
}
.products-main .phone-left {
  margin-left: 50px;
  width: 360px;
  float: left;
}
.products-main .phone-left img {
  width: 100%;
}
#products .products-main .phone-introduce {
  float: left;
}
#products .products-main .phone-right {
  margin-right: 50px;
  width: 360px;
  float: right;
}
.products-main .phone-right img {
  width: 100%;
}

/* 立即体验 */
#download {
  height: 660px;
  width: 100%;
  background: #fff url(../images/download-b.png) bottom center no-repeat;
  background-size: 100% 85px;
}

.download-main {
  padding: 0 200px;
  margin-top: 80px;
  display: flex;
  justify-content: space-between;
}

.download-main .download-manual .download-manual-merchant {
  cursor: pointer;
  display: block;
  margin-top: 66px;
  width: 198px;
  height: 58px;
  border: 1px solid #3185e7;
  border-radius: 50px;
  background: #3185e7 url(../images/manual-merchant.png) 24px center no-repeat;
}

.download-main .download-manual .download-manual-merchant p {
  font: 200 12px/16px "微软雅黑";
  color: #fff;
  margin-left: 60px;
}

.download-main .download-manual .download-manual-user {
  cursor: pointer;
  display: block;
  margin-top: 12px;
  width: 198px;
  height: 58px;
  border: 1px solid #3185e7;
  border-radius: 50px;
  background: #fff url(../images/manual-user.png) 24px center no-repeat;
}

.download-main .download-manual .download-manual-user p {
  font: 200 12px/16px "微软雅黑";
  color: #3185e7;
  margin-left: 60px;
}

.download-main .download-manual p.first {
  font: 200 14px/16px "微软雅黑";
  margin-top: 14px;
}

.download-main p.font-w20 {
  margin-top: 12px;
  text-align: center;
  font: 20px/28px "微软雅黑";
  color: #333;
}

.download-main p.font-w14 {
  text-align: center;
  font: 14px/20px "微软雅黑";
  color: #333;
}

/* 关于我们 */
#about {
  padding-bottom: 50px;
  background: #f9f9f9 url(../images/about-b.png) top center no-repeat;
  background-size: 100% 300px;
}

#about .title .title-top {
  margin-top: 40px;
  color: #fff;
}

#about .title .title-bottom {
  color: #fff;
}

.about-main {
  padding: 0 30px 0 420px;
  height: 390px;
  margin-top: 13px;
  background: #fff url(../images/about-b2.png) left center no-repeat;
}

.about-main ul {
  margin-top: 20px;
}

.about-main h3 {
  font: 700 34px/66px "微软雅黑";
  color: #222;
}
.about-main p {
  font: 200 14px/30px "微软雅黑";
  color: #666;
  margin-bottom: 15px;
}
#partner {
  background: #fff;
  overflow: hidden;
  position: relative;
}
.partner-main ul {
  margin-top: 30px;
}
.partner-main ul li {
  display: block;
  width: 398px;
  height: 132px;
  float: left;
}
.partner-main ul li img {
  display: block;
  margin: 31px auto 0;
}
.partner-main ul li .cujinhui {
  margin-top: 1px;
}
.partner-main p {
  overflow: hidden;
  width: 100%;
}
.partner-main p img {
  float: left;
  display: block;
  width: 50%;
  height: auto;
}

#xiala {
  height: 80px;
  overflow: hidden;
}
#xiala img {
  display: block;
  width: 64px;
  height: 35px;
  margin: 9px auto 0;
}
#xiala p {
  font-size: 14px;
  line-height: 28px;
  text-align: center;
}
#shangla {
  height: 80px;
  overflow: hidden;
}
#shangla img {
  display: block;
  width: 64px;
  height: 35px;
  margin: 9px auto 0;
}
#shangla p {
  font-size: 14px;
  line-height: 28px;
  text-align: center;
}

#contact {
  padding-bottom: 50px;
  background: #333;
}

#contact .title .title-left {
  font-weight: 200;
  color: #fff;
}

#contact .title .title-right {
  display: block;
  background: #333;
  color: #aaa;
}

.contact-main .contact-main-left {
  float: left;
}
.contact-main .contact-main-left h3 {
  margin-top: 22px;
  font: 700 24px/86px "微软雅黑";
  color: #fff;
}
.contact-main .contact-main-left p {
  font: 200 14px/36px "微软雅黑";
  color: #aaa;
}
.contact-main .contact-main-right {
  margin-top: 40px;
  width: 500px;
  float: right;
}
.contact-main .contact-main-right input {
  box-sizing: content-box;
  padding: 0 10px;
  height: 40px;
  background: #fff;
  margin-top: 20px;
  border: 0;
  width: 498px;
}
.contact-main .contact-main-right button {
  margin: 20px 0 0 408px;
  width: 90px;
  height: 30px;
}
#copyright {
  background: #000;
  height: 60px;
}
#copyright p {
  text-align: center;
  font: 200 12px/60px "微软雅黑";
  color: #fff;
}
#copyright p a {
  font: 200 12px/60px "微软雅黑";
  color: #fff;
}
