@charset "utf-8";
* {word-wrap: break-word; padding:0px; margin: 0px;}
body{margin: 0px; font: 16px  Microsoft YaHei, 宋体, Verdana, sans-serif; color:#555; background:#fff;_background-attachment:fixed;_background-image:url(about:blank); }
p {margin:10px 0 10px 0;}
ul,li {list-style:none;}
form, img {margin:0; border:0px; padding:0; vertical-align:top;}
a {color: #555; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; }
a:hover { color: #187fc3; text-decoration:none;}
select,input,textarea{font: 14px  Microsoft YaHei, 宋体, Verdana, sans-serif;}
.clear {clear:both;}
.f12 {font-size:12px;}
.f14 {font-size:14px;}
.f16 {font-size:16px;}
.f18 {font-size:18px;}
.f24 {font-size:24px;}
.f30 {font-size:30px;}
.f40 {font-size:40px;}
.b {font-weight:bold;}
.xt {font-style:italic;}
.ya {font-family:"Microsoft YaHei","宋体";}
.he {font-family:"黑体","宋体";}
.pa {font-family:"Palatino Linotype";}
.ar {font-family:"Arial";}
.s1 {color:#444;}
.s1 a{color:#444;}
.s1 a:hover{color:#187fc3;}
.s2 {color:#666;}
.s2 a{color:#666;}
.s2 a:hover{color:#187fc3;}
.s3 {color:#999;}
.s3 a{color:#999;}
.s3 a:hover{color:#187fc3;}
.s4 {color:#187fc3;}
.s4 a{color:#187fc3;}
.s4 a:hover{color:#444;}
.s5 {color:#bbb;}
.s5 a{color:#bbb;}
.s5 a:hover{color:#fff;}
.s6 {color:#fff;}
.s6 a{color:#fff;}
.s6 a:hover{color:#fff;}


/************************************************************************************************************************************************/
/*********************************************** PC端 *******************************************************************************************/

@media screen and (min-width: 1025px){

/*head*/
#top { background:#fff; height:80px; width:100%; position:fixed; z-index:8888; top:0; box-shadow:1px 0 1px 1px #ddd; filter:alpha(opacity=95); -moz-opacity:0.95; -khtml-opacity: 0.95; opacity: 0.95; }
#top .w {width:1100px; margin:auto;}
#top .logo {padding:20px 0 0 0; float:left;}
#top .logo img {width:136px; }
 
.navmenu {float:right; padding:30px 0 0 0;} 
.navmenu-default .navmenu-nav>.active>a, 
.navbar-default .navbar-offcanvas .navmenu-nav>.active>a, 
.navmenu-default .navmenu-nav>.active>a:hover, 
.navbar-default .navbar-offcanvas .navmenu-nav>.active>a:hover, 
.navmenu-default .navmenu-nav>.active>a:focus, 
.navbar-default .navbar-offcanvas .navmenu-nav>.active>a:focus {color: #187fc3;background-color: transparent;}
.navmenu-nav li {float:left; margin-left:40px;}

#topline {height:80px; width:1100px;}

/*banner*/
#banner {width:1100px; margin:30px auto -80px auto; background:#f7f7f7; height:520px;}

#banner .swiper-container {width: 1100px; max-width:1100px; }
#banner .swiper-slide {text-align: center;background: #fff;
 	        display: -webkit-box;
	        display: -ms-flexbox;
	        display: -webkit-flex;
	        display: flex;
	        -webkit-box-pack: center;
	        -ms-flex-pack: center;
	        -webkit-justify-content: center;
	        justify-content: center;
	        -webkit-box-align: center;
	        -ms-flex-align: center;
	        -webkit-align-items: center;
	        align-items: center;
}
#banner .swiper-slide img {width: 1100px; height:520px;}
 
/*download*/
#download {padding:140px 0 0 0;}
#download .t {text-align:center;}
#download .w {width:1100px; margin:auto; overflow:hidden;}
#download .list {width:1200px; margin:60px 0 0 0;}
#download .list li {float:left; margin-right:94px; text-align:center;}

#download .list-a a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/apple.png) center 65px no-repeat;}
#download .list-a a:hover {border:2px #000 solid; background:url(../images/apple.png) center -85px #000 no-repeat; }
#download .list-b a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/Android.png) center 65px no-repeat;}
#download .list-b a:hover {border:2px #97c03d solid; background:url(../images/Android.png) center -85px #97c03d no-repeat; }
#download .list-c a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/erweima.png) center center no-repeat; background-size:100px 100px;}
#download .list-c a:hover {border:2px #187fc3 solid; background:url(../images/erweima.png) center center #187fc3 no-repeat; background-size:100px 100px; }
#download .list-d a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/weixin.png) center center no-repeat; background-size:100px 100px;}
#download .list-d a:hover {border:2px #2bad13 solid; background:url(../images/weixin.png) center center #2bad13 no-repeat; background-size:100px 100px; }

/*process*/
#process {padding:80px 0 0 0; margin:0 0 -80px 0;}
#process .t {text-align:center; background:#187fc3; padding:60px 0 0 0; color:#fff;}
#process .w {background:url(../images/processbg.png) center 134px #187fc3 no-repeat;}
#process .list {width:1100px; margin:auto; padding:60px 0;}
#process .list ul {width:1200px; overflow:hidden; }
#process .list li {float:left; text-align:center; width:160px; margin-right:75px;}
#process .list li img {width:160px; height:160px;}
#process .list li p {padding:30px 0 0 0;}
#process .intro {color:#bee0f7;} 

/*service*/
#service {padding:140px 0 0 0;}
#service .t {text-align:center;}
#service .w {width:1100px; margin:auto; overflow:hidden;}
#service .swiper-container {width: 100%;height: 330px;margin:auto; }
#service .swiper-slide {width:1000px;}
#service .swiper-slide img {width:200px; height:200px; float:left; margin:60px 60px 0 60px;}
#service .swiper-slide .content {margin:70px 80px 0 0; line-height:34px;}
#service .swiper-slide .title {margin:0 0 20px 0;}


/*about*/
#about {padding:80px 0 0 0; margin:0 0 -80px 0;}
#about .t {text-align:center; background:#f7f7f7; padding:60px 0 0 0;}
#about .intro {width:800px; margin:auto; padding:20px 0 0 0; text-align:center; line-height:30px;}
#about .w {background:#f7f7f7;}
#about .list {width:1100px; margin:auto; padding:60px 0;}
#about .list ul {width:1200px; overflow:hidden; }
#about .list li {float:left; text-align:center; margin-right:70px;}
#about .list li img {width:320px; height:320px;}
#about .list li p {padding:10px 0 0 0;}

/*faq*/
#faq {padding:140px 0 0 0;}
#faq .t {text-align:center;}
#faq .w {width:1100px; margin:auto; overflow:hidden;}

#faq .container {position:relative;margin:50px auto 0 auto;}
#faq .accordion {position:relative; display: inline-block; width: 100%; vertical-align: middle;}
#faq .accordion a {position: relative;display: block; font-size:24px; background:url(../images/faqico.png) 5px 20px no-repeat; padding:0 0 0 50px; line-height:60px; height:60px;}
#faq .accordion a:hover {color: #187fc3; }
#faq .accordion-desc {z-index: 2; padding:10px 0 30px 50px; color:#777; line-height:26px;}

/*contact*/
#contact {padding:80px 0 0 0; margin:0 0 -80px 0;}
#contact .t {text-align:center; background:#187fc3; line-height:80px; padding:35px 0 0 0;}
#contact .t img {margin-right:15px; height:75px;}
#contact .w {background:#187fc3; text-align:center; padding:5px 0 30px 0;}

/*弹出窗口*/
.popupbox {width:900px;height:500px; background:#fff; display: none;float: left;position: fixed;top: 50%; left: 50%;z-index: 9999999;box-shadow: 0px 0px 20px #333;}
#fade {display: none; background: #333;position: fixed; left: 0; top: 0;width: 100%; height: 100%;opacity: .7;z-index: 9999;}
#intabdiv {height:500px; overflow-y:auto; line-height:34px; }
#intabdiv .title {margin:40px 0 0 40px;}
#intabdiv .content {margin:40px;}
.close a {width:24px;height:24px; right:-12px;background: url(../images/close.png) no-repeat; position:absolute; margin-top:-12px;z-index: 99999999;}

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/  
::-webkit-scrollbar  
{  
    width: 12px;  
    height: 12px;  
    background-color: #F5F5F5;  
}  
  
/*定义滚动条轨道 内阴影+圆角*/  
::-webkit-scrollbar-track  
{  
     border-radius: 10px;  
    background-color: #F5F5F5;  
}  
  
/*定义滑块 内阴影+圆角*/  
::-webkit-scrollbar-thumb  
{  
    border-radius: 20px;  
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.1);  
    background-color: #ccc;  
} 


/*右侧客服*/
#kefu {position:fixed; width:120px; text-align:center; padding:15px 0; line-height:26px; background:#fff; right:0px; top:300px; z-index:2222;}
#kefu .tel {border-bottom:1px #eee solid; padding:0 0 10px 0; margin:0 0 10px 0;}
#kefu .mail {line-height:18px; padding:5px 10px 0 10px;}

}


/************************************************************************************************************************************************/
/*********************************************** iPad横屏专用 ***********************************************************************************/

@media screen and (min-width: 769px) and (max-width: 1024px){

/*head*/
#top { background:#fff; height:80px; width:100%; position:fixed; z-index:8888; top:0; box-shadow:1px 0 1px 1px #ddd; filter:alpha(opacity=95); -moz-opacity:0.95; -khtml-opacity: 0.95; opacity: 0.95; }
#top .w {width:1024px; margin:auto;}
#top .logo {padding:20px 0 0 20px; float:left;}
#top .logo img {width:136px; }
 
.navmenu {float:right; padding:30px 30px 0 0;} 
.navmenu-default .navmenu-nav>.active>a, 
.navbar-default .navbar-offcanvas .navmenu-nav>.active>a, 
.navmenu-default .navmenu-nav>.active>a:hover, 
.navbar-default .navbar-offcanvas .navmenu-nav>.active>a:hover, 
.navmenu-default .navmenu-nav>.active>a:focus, 
.navbar-default .navbar-offcanvas .navmenu-nav>.active>a:focus {color: #187fc3;background-color: transparent;}
.navmenu-nav li {float:left; margin-left:40px;}

#topline {height:80px; width:1024px;}

/*banner*/
#banner {width:1024px; margin:30px auto -80px auto; background:#f7f7f7; height:520px;}

#banner .swiper-container {width: 1024px; max-width:1024px;}
#banner .swiper-slide {text-align: center;background: #fff;
 	        display: -webkit-box;
	        display: -ms-flexbox;
	        display: -webkit-flex;
	        display: flex;
	        -webkit-box-pack: center;
	        -ms-flex-pack: center;
	        -webkit-justify-content: center;
	        justify-content: center;
	        -webkit-box-align: center;
	        -ms-flex-align: center;
	        -webkit-align-items: center;
	        align-items: center;
}
#banner .swiper-slide img {width: 1024px; height:520px;}
 
/*download*/
#download {padding:140px 0 0 0;}
#download .t {text-align:center;}
#download .w {width:1024px; margin:auto; overflow:hidden;}
#download .list {margin:60px 0 0 0;}
#download .list li {float:left; margin-left:42px; text-align:center;}

#download .list-a a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/apple.png) center 65px no-repeat;}
#download .list-a a:hover {border:2px #000 solid; background:url(../images/apple.png) center -85px #000 no-repeat; }
#download .list-b a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/Android.png) center 65px no-repeat;}
#download .list-b a:hover {border:2px #97c03d solid; background:url(../images/Android.png) center -85px #97c03d no-repeat; }
#download .list-c a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/erweima.png) center center no-repeat; background-size:100px 100px;}
#download .list-c a:hover {border:2px #187fc3 solid; background:url(../images/erweima.png) center center #187fc3 no-repeat; background-size:100px 100px; }
#download .list-d a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/weixin.png) center center no-repeat; background-size:100px 100px;}
#download .list-d a:hover {border:2px #2bad13 solid; background:url(../images/weixin.png) center center #2bad13 no-repeat; background-size:100px 100px; }

/*process*/
#process {padding:80px 0 0 0; margin:0 0 -80px 0;}
#process .t {text-align:center; background:#187fc3; padding:60px 0 0 0; color:#fff;}
#process .w {background:#187fc3;}
#process .list {width:1024px; margin:auto; padding:60px 0;}
#process .list ul {overflow:hidden; }
#process .list li {float:left; text-align:center; width:130px; margin-left:62px;}
#process .list li img {width:130px; height:130px;}
#process .list li p {padding:30px 0 0 0;}
#process .intro {color:#bee0f7;} 

/*service*/
#service {padding:140px 0 0 0;}
#service .t {text-align:center;}
#service .w {width:1024px; margin:auto; overflow:hidden;}
#service .swiper-container {width: 100%;height: 260px;margin:auto; }
#service .swiper-slide {width:1000px;}
#service .swiper-slide img {width:200px; height:200px; float:left; margin:60px 60px 0 60px;}
#service .swiper-slide .content {margin:70px 80px 0 0; line-height:34px;}
#service .swiper-slide .title {margin:0 0 20px 0;}
#service .swiper-pagination, .swiper-button-prev, .swiper-button-next {display:none;}


/*about*/
#about {padding:80px 0 0 0; margin:0 0 -80px 0;}
#about .t {text-align:center; background:#f7f7f7; padding:60px 0 0 0;}
#about .intro {width:800px; margin:auto; padding:20px 0 0 0; text-align:center; line-height:30px;}
#about .w {background:#f7f7f7;}
#about .list {width:1024px; margin:auto; padding:60px 0;}
#about .list ul {overflow:hidden; }
#about .list li {float:left; text-align:center; margin-left:58px;}
#about .list li img {width:260px; height:260px;}
#about .list li p {padding:10px 0 0 0;}

/*faq*/
#faq {padding:140px 0 0 0;}
#faq .t {text-align:center;}
#faq .w {width:1024px; margin:auto; overflow:hidden;}

#faq .container {position:relative;margin:50px auto 0 auto;}
#faq .accordion {position:relative; display: inline-block; width: 100%; vertical-align: middle;}
#faq .accordion a {position: relative;display: block; font-size:24px; background:url(../images/faqico.png) 25px 20px no-repeat; padding:0 0 0 65px; line-height:60px; height:60px;}
#faq .accordion a:hover {color: #187fc3; }
#faq .accordion-desc {z-index: 2; padding:10px 35px 30px 65px; color:#777; line-height:26px;}

/*contact*/
#contact {padding:80px 0 0 0; margin:0 0 -80px 0;}
#contact .t {text-align:center; background:#187fc3; line-height:80px; padding:35px 0 0 0;}
#contact .t img {margin-right:15px; height:75px;}
#contact .w {background:#187fc3; text-align:center; padding:5px 0 30px 0;}

/*弹出窗口*/
.popupbox {width:900px;height:500px; background:#fff; display: none;float: left;position: fixed;top: 50%; left: 50%;z-index: 9999999;box-shadow: 0px 0px 20px #333;}
#fade {display: none; background: #333;position: fixed; left: 0; top: 0;width: 100%; height: 100%;opacity: .7;z-index: 9999;}
#intabdiv {height:500px; overflow-y:auto; line-height:34px; }
#intabdiv .title {margin:40px 0 0 40px;}
#intabdiv .content {margin:40px;}
.close a {width:24px;height:24px; right:-12px;background: url(../images/close.png) no-repeat; position:absolute; margin-top:-12px;z-index: 99999999;}



/*右侧客服*/
#kefu {position:fixed; width:120px; text-align:center; padding:15px 0; line-height:26px; background:#fff; right:0px; top:300px; z-index:2222;}
#kefu .tel {border-bottom:1px #eee solid; padding:0 0 10px 0; margin:0 0 10px 0;}
#kefu .mail {line-height:18px; padding:5px 10px 0 10px;}

}

 

/************************************************************************************************************************************************/
/*********************************************** 所有竖屏设备************************************************************************************/

@media screen and (min-width: 240px) and (max-width: 768px){


.f16 {font-size:16px;}
.f18 {font-size:18px;}
.f24 {font-size:16px;}
.f30 {font-size:20px;}
.f40 {font-size:40px;}


/*head*/
#top {background:#fff; height:60px; width:100%; position:fixed; z-index:8888; top:0; box-shadow:1px 0 1px 1px #ddd; filter:alpha(opacity=95); -moz-opacity:0.95; -khtml-opacity: 0.95; opacity: 0.95; }
#top .logo {padding:15px 0 0 15px; float:left;}
#top .logo img {width:100px; }
 
.navmenu {display:none;}

#topline {height:60px; width:100%;}

/*banner*/
#banner {width:100%; margin:0 auto -80px auto; background:#f7f7f7;}

#banner .swiper-container {width: 100%; }
#banner .swiper-slide {text-align: center;background: #fff;
 	        display: -webkit-box;
	        display: -ms-flexbox;
	        display: -webkit-flex;
	        display: flex;
	        -webkit-box-pack: center;
	        -ms-flex-pack: center;
	        -webkit-justify-content: center;
	        justify-content: center;
	        -webkit-box-align: center;
	        -ms-flex-align: center;
	        -webkit-align-items: center;
	        align-items: center;
}
#banner .swiper-slide img {width: 100%; }
 
/*download*/
#download {padding:100px 0 0 0;}
#download .t {text-align:center;}
#download .w {width:100%; margin:auto; overflow:hidden;}
#download .list {width:100%; margin:20px 0 0 0;}
#download .list li {float:left; width:50%; text-align:center;}

#download .list-a a {width:100%;height:100px; margin:0 0 10px 0; display:block; border:0px #eee solid; background:url(../images/apple.png) center 15px no-repeat;}
#download .list-a a:hover {border:0px #000 solid; background:url(../images/apple.png) center -135px #000 no-repeat; }
#download .list-b a {width:100%;height:100px; margin:0 0 10px 0; display:block; border:0px #eee solid; background:url(../images/Android.png) center 15px no-repeat;}
#download .list-b a:hover {border:0px #97c03d solid; background:url(../images/Android.png) center -135px #97c03d no-repeat; }
#download .list-c,#download .list-d {display:none;}
#download .list-c a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/erweima.png) center center no-repeat; background-size:100px 100px;}
#download .list-c a:hover {border:2px #187fc3 solid; background:url(../images/erweima.png) center center #187fc3 no-repeat; background-size:100px 100px; }
#download .list-d a {width:200px; height:200px; margin:0 0 20px 0; display:block; border:2px #eee solid; background:url(../images/weixin.png) center center no-repeat; background-size:100px 100px;}
#download .list-d a:hover {border:2px #2bad13 solid; background:url(../images/weixin.png) center center #2bad13 no-repeat; background-size:100px 100px; }

/*process*/
#process {padding:20px 0 0 0; margin:0 0 -80px 0;}
#process .t {text-align:center; background:#187fc3; padding:20px 0 0 0; color:#fff;}
#process .w {background:#187fc3;}
#process .list {width:100%; margin:auto; padding:30px 0 0 0;}
#process .list ul {width:100%; overflow:hidden; }
#process .list li {text-align:center; margin-bottom:30px;}
#process .list li img {width:180px; height:180px;}
#process .list li p {padding:10px 0 0 0;}
#process .intro {color:#bee0f7;} 

/*service*/
#service {padding:100px 0 0 0;}
#service .t {text-align:center;}
#service .w {width:100%; margin:auto; overflow:hidden;}
#service .swiper-container {width:100%;}
#service .swiper-slide {width:100%; margin:auto; text-align:center;}
#service .swiper-slide img {width:180px; height:180px; margin:30px 0 0 0;;}
#service .swiper-slide .content {margin:20px 20px 0 20px; line-height:30px; color:#666;}
#service .swiper-slide .title {margin:0 0 10px 0; font-size:20px;}
#service .swiper-pagination, .swiper-button-prev, .swiper-button-next {display:none;}

/*about*/
#about {padding:30px 0 0 0; margin:0 0 -80px 0;}
#about .t {text-align:center; background:#f7f7f7; padding:30px 0 0 0;}
#about .intro {width:92%; margin:auto; padding:20px 0 0 0; text-align:center; line-height:30px;}
#about .w {background:#f7f7f7;}
#about .list {width:100%; margin:auto; padding:30px 0 10px 0;}
#about .list ul {width:100%; overflow:hidden; margin:auto;}
#about .list li {text-align:center; margin:0 auto 20px auto;}
#about .list li img {width:260px; height:260px;}
#about .list li p {padding:5px 0 0 0;}

/*faq*/
#faq {padding:110px 0 0 0;}
#faq .t {text-align:center;}
#faq .w {width:100%; margin:auto; overflow:hidden;}

#faq .container {position:relative;margin:20px auto 0 auto;}
#faq .accordion {position:relative; display: inline-block; width: 100%; vertical-align: middle;}
#faq .accordion a {position: relative;display: block; font-size:18px; background:url(../images/faqico.png) 20px 10px no-repeat; padding:0 0 0 60px; line-height:40px; height:40px;}
#faq .accordion a:hover {color: #187fc3; }
#faq .accordion-desc {z-index: 2; padding:5px 20px 15px 60px; color:#777; line-height:26px;}

/*contact*/
#contact {padding:30px 0 0 0; margin:0 0 -80px 0;}
#contact .t {text-align:center; background:#187fc3; line-height:60px; padding:15px 0 0 0;}
#contact .t img {margin-right:15px; height:55px;}
#contact .w {background:#187fc3; text-align:center; padding:5px 0 20px 0;}

/*弹出窗口*/
.popupbox {width:90%;height:80%; background:#fff; display: none;float: left;position: fixed;top:50%; left: 51%;z-index: 9999999;box-shadow: 0px 0px 20px #333;}
#fade {display: none; background: #333;position: fixed; left: 0; top: 0;width: 100%; height: 100%;opacity: .7;z-index: 9999;}
#intabdiv {height:100%; overflow-y:auto; line-height:30px; }
#intabdiv .title {margin:20px 0 0 20px;}
#intabdiv .content {margin:20px;}
.close a {width:24px;height:24px; right:-12px;background: url(../images/close.png) no-repeat; position:absolute; margin-top:-12px;z-index: 99999999;}

/*右侧客服*/
#kefu {display:none;}

}