﻿@charset "utf-8";

/*格式化*/
html,body,div,h1,h2,h3,h4,h5,h6,ul,ol,dl,li,dt,dd,p,blockquote,pre,form,fieldset,table,th,td,span,input,textarea { margin: 0; padding: 0; }
body { font-size: 14px; font-family: "微软雅黑","Arial",Verdana,Arial,Helvetica,sans-serif; padding-top: 1px; background: #fff; }
li,ol { list-style: none; }
ins { text-decoration: none; }
i,em { font-style: normal; }
a { text-decoration: none; font-family: "微软雅黑"; }
a:hover { cursor: pointer; text-decoration: none; }
:focus { outline: 0; }
.clear { clear: both; line-height: 0px; overflow: hidden; zoom: 1; font-size: 0px; content: "."; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
img { padding: 0; margin: 0; }
a img { border: none; }
input,textarea { border: none; font-family: "微软雅黑"; font-size: 13px; }
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 14px; font-family: "微软雅黑"; }
.fl { float: left; }
.fr { float: right; }
/* -- 页面整体布局 -- */
.wrap { min-width: 320px; max-width: 750px; margin: 0 auto; overflow: hidden; position: relative; font-family: "微软雅黑"; background: #fff; }
.wrap img { display: block; width: 100%; }
/**/
html { background: #fff; }
/**/
@media screen and (min-width:320px) {
  html { font-size: 8.533px; }
}
@media screen and (min-width:360px) {
  html { font-size: 9.6px; }
}
@media screen and (min-width:375px) {
  html { font-size: 10px; }
}
@media screen and (min-width:393px) {
  html { font-size: 10.48px; }
}
@media screen and (min-width:400px) {
  html { font-size: 10.664px; }
}
@media screen and (min-width:414px) {
  html { font-size: 11.04px; }
}
@media screen and (min-width:440px) {
  html { font-size: 11.73px; }
}
@media screen and (min-width:480px) {
  html { font-size: 12.796px; }
}
@media screen and (min-width:520px) {
  html { font-size: 13.863px; }
}
@media screen and (min-width:560px) {
  html { font-size: 14.93px; }
}
@media screen and (min-width:600px) {
  html { font-size: 15.996px; }
}
@media screen and (min-width:640px) {
  html { font-size: 17.06px; }
}
@media screen and (min-width:680px) {
  html { font-size: 18.1288px; }
}
@media screen and (min-width:700px) {
  html { font-size: 18.66px; }
}
@media screen and (min-width:720px) {
  html { font-size: 19.1952px; }
}
@media screen and (min-width:750px) {
  html { font-size: 20px; }
}
/*banner*/
.banner { position: relative; z-index: 3; width: 100%; overflow: hidden; }
.banner .swiper-pagination { bottom: 1.5rem; }
.banner .swiper-pagination-bullet { opacity: 0.3; width: 0.8rem; height: 0.8rem; background: #417ADB; border-radius: 50%; margin: 0 0.5rem !important; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.banner .swiper-pagination-bullet-active { opacity: 1; background: #417ADB; }
/*title*/
h2.main_title { overflow: hidden; }
h2.main_title a { display: block; line-height: 0; }
h2.main_title strong { display: block; font-size: 2.1rem; color: #232323; line-height: 100%; float: left; }
h2.main_title i { color: #417adb; }
h2.main_title span { display: block; font-weight: normal; font-size: 1.2rem; color: #417adb; line-height: 100%; margin-top: 0.95rem; float: right; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
h2.main_title span:hover { letter-spacing: 1px; }
/*choose*/
.choose { padding: 4.15rem 2.67%; background: #E8E8E8; }
.choose h2 strong { float: none; text-align: center; }
.choose .pic { margin: 2rem 0; }
.choose li { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; margin-bottom: 1rem; background: #fff; height: 4rem; }
.choose li h3 { height: 4rem; background: #417ADB; font-size: 0; width: 27%; text-align: center; }
.choose li h3 img { width: 1.95rem; display: inline-block; vertical-align: middle; margin-right: 0.55rem; }
.choose li h3 span { display: inline-block; vertical-align: middle; font-size: 1.4rem; color: #fff; line-height: 4rem; }
.choose li p { padding: 0 0.8rem; font-size: 1.2rem; color: #000; line-height: 2rem; }
/*intro*/
.intro { padding: 4.15rem 2.67% 3.6rem; text-align:center; }
.intro h2 { text-align: center; line-height: 0; }
.intro h2 strong { display: block; font-size: 2.1rem; color: #232323; line-height: 100%; }
.intro h2 i { color: #417ADB; }
.intro h2 span { display: block; font-size: 1.1rem; color: #818181; line-height: 100%; font-weight: normal; margin-top: 0.95rem; }
.intro ul { margin-top: 2.55rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.intro li { width: 49.295%; line-height: 0; margin-bottom: 2.3rem; }
.intro li > a { display: block; overflow: hidden; }
.intro li > a img { width: 100%; }
.intro li h4 a { display: block; font-size: 1.2rem; color: #818181; line-height: 1.4rem; font-weight: normal; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -o-transition: all 0.5s ease; transition: all 0.5s ease; box-sizing: border-box; padding: 0 0.5rem; margin-top: 1.5rem; }
.intro li:hover h4 a { color: #417ADB; }
.intro .more{  background: #417adb; border-radius: 1.15rem; font-size: 1.1rem; color: #fff; line-height: 2.25rem; text-align: center; -o-transition: all 0.5s ease; transition: all 0.5s ease; font-weight: bold; padding:0 2rem; display:inline-block; }
/*product*/
.product { background: #f5f5f5; padding: 5.5rem 2.67% 4.8rem; }
.product dl { background: #ffffff; overflow: hidden; margin-bottom: 1.25rem; }
.product dd { overflow: hidden; box-sizing: border-box; padding: 2rem 2rem 2.5rem; }
.product dd h3 { font-size: 2rem; color: #232323; line-height: 2.3rem; position: relative; padding-bottom: 1.2rem; font-weight: bold; margin-bottom: 1.35rem; }
.product dd h3:after { position: absolute; content: ""; width: 2.3rem; height: 1px; background: #417adb; left: 0; bottom: 0; }
.product dd p { float: left; width: 65%; font-size: 1.2rem; color: #232323; line-height: 1.7rem; }
.product dd p span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product dd a.ask { float: right; display: block; width: 8.3rem; margin-top: 0.6rem; height: 2.25rem; background: #417adb; border-radius: 1.15rem; font-size: 1.1rem; color: #fff; line-height: 2.25rem; text-align: center; -o-transition: all 0.5s ease; transition: all 0.5s ease; font-weight: bold; }
.product dd a.ask:hover { letter-spacing: 1px; }
/*tech*/
.tech { padding: 4.3rem 2.67% 1.3rem; }
.tech h2 { margin-bottom: 4.05rem; }
.tech ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.tech li { width: 31.97%; margin-bottom: 3rem; border-bottom: 1px solid #b3b3b3; padding-bottom: 0.1rem; text-align: center; }
.tech li span { display: block; line-height: 0; }
.tech li h3 { font-size: 1.3rem; color: #232323; line-height: 2.6rem; font-weight: bold; }
/*sm_banner*/
.sm_banner { background: url(../images/sm_bg.jpg) no-repeat center top; height: 16.2rem; background-size: 100% 100%; box-sizing: border-box; padding: 3.7rem 2.67% 0; }
.sm_banner h2 { font-size: 2.1rem; color: #F5F5F5; line-height: 2.75rem; margin-bottom: 1.8rem; letter-spacing: 0.2rem; }
.sm_banner h2 strong { display: block; }
.sm_banner p { padding-left: 3.15rem; background: url(../images/sm_icon.png) no-repeat left top; background-size: 2.45rem 2.45rem; }
.sm_banner p strong { display: block; font-size: 1.1rem; color: #F5F5F5; line-height: 100%; font-weight: normal; }
.sm_banner p span { display: block; font-size: 0.9rem; color: #F5F5F5; line-height: 100%; margin-top: 0.85rem; }
/*album*/
.album { padding: 4.45rem 2.67% 5.1rem; }
.album dl { line-height: 0; margin-bottom: 1.3rem; }
.album dd { height: 4.25rem; background: #417adb; }
.album dd h3 { text-align: center; font-size: 1.8rem; color: #fff; line-height: 4.25rem; font-weight: bold; }
/*client*/
.client { padding: 5rem 2.67% 5.85rem; background: #f2f2f2; }
.client h2 { text-align: center; margin-bottom: 2.9rem; }
.client h2 strong { display: block; font-size: 2.1rem; color: #232323; line-height: 100%; }
.client h2 i { color: #417ADB; }
.client h2 span { display: block; font-size: 1.1rem; color: #818181; line-height: 1.4rem; width: 84%; margin: 1.3rem auto 0; }
.client ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; border-bottom: 1px solid #ececec; }
.client ul li { border-left: 1px solid #ececec; border-top: 1px solid #ececec; box-sizing: border-box; width: 33.33%; position: relative; overflow: hidden; }
.client ul li:nth-child(3n) { border-right: 1px solid #ececec; }
/*news*/
.news { padding: 5.35rem 2.67% 6.8rem; }
.news h2 { text-align: center; margin-bottom: 4rem; }
.news h2 strong { float: none; }
.news_nav { position: relative; height: 1.5rem; margin-bottom: 2.1rem; }
.news_nav h3 { float: left; margin-right: 2.45rem; }
.news_nav h3 strong { display: block; font-size: 1.5rem; color: #000; line-height: 100%; font-weight: normal; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.news_nav h3 span { display: block; font-size: 1.2rem; color: #417ADB; line-height: 100%; font-weight: normal; position: absolute; right: 0; top: 0.2rem; display: none; }
.news_nav h3.on strong { color: #417ADB; font-weight: bold; }
.news_nav h3.on span { display: block; }
.news_con .swiper-slide { opacity: 0 !important; }
.news_con .swiper-slide-active { opacity: 1 !important; }
.news_con dl { margin-bottom: 1.5rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; background: #fff; padding: 1rem; box-sizing: border-box; box-shadow: 0 0 1.2rem 0 rgba(0,0,0,0.1); }
.news_con dt { width: 58%; }
.news_con dd { width: 38%; }
.news_con dd h4 { font-size: 1.3rem; line-height: 1.75rem; color: #000; max-height: 3.5rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 1rem 0 3.15rem; font-weight: bold; }
.news_con dd span { display: block; width: 9.25rem; height: 2.5rem; background: #3663ab; font-size: 1.2rem; color: #fff; line-height: 2.5rem; text-align: center; }
.faq { margin-top: 2.5rem; }
.faq h3 { margin-bottom: 1.6rem; }
.faq h3 a { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.faq h3 strong { display: block; font-size: 1.5rem; color: #3663ab; line-height: 100%; }
.faq h3 span { display: block; font-size: 1.2rem; color: #417adb; line-height: 100%; margin-top: 0.25rem; }
.faq .faq_con { background: #fff; box-shadow: 0 0 1.2rem 0 rgba(0,0,0,0.1); padding: 2.7rem 2rem; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; }
.faq .pic { width: 36.66%; }
.faq ul { width: 59%; }
.faq li h4 a { display: block; font-size: 1.2rem; color: #000; line-height: 2.4rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.faq li h4 a:before { content: "*"; padding-right: 0.2rem; }