* {
    margin: 0;
    padding: 0;
    -webkit-appearance: none; /*去掉浏览器默认样式*/
    /*-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;*/
    box-sizing: border-box;
}

html,
body {
   
    overflow-x: hidden;
    background-color:#fff ;
    /*-webkit-user-select: none;*/
}
@media only screen and (max-width:1210px) {
	html,body{
		font-size: 12px;
	}
	img{
		max-width:100%; 
	}
	.wrapper{
		margin: 0 3%; width: auto;
	}
	.header{
		height: 65px;
	}
	.header .logo{
		
	}
	.bj-3d7bf8 {
		padding-bottom: 80px;
	}
	.header .logo img{

	}
	.header .btns{
		position: relative; margin-top: 0; text-align: center;
	}
	.header .btns ul{
		text-align: center;
	}
	.header .btns li{
		float: none; display: inline-block; margin-left: 0; text-align: center; padding: 10px 0; 
	}
	
	.header .nav-wrap{
		position: absolute; left: 0; right: 0; top: 65px;  background: #3e7af8; z-index: 9; display: none; box-shadow: 0px 5px 15px 0px rgba(41, 59, 236, 0.6);
	}
	/*.header.selected .nav{
		display: block;
	}*/
	.header .nav{
		float: none;line-height: 50px;  margin-right: 0;
	}
	.header .nav li{
		display: block; width: 100%; float: none; text-align: center; font-size: 16px; padding: 0; margin-left: 0; border-bottom: 1px dashed rgba(255,255,255,0.3);
	}
	
	.header .nav .on strong:before{
		display: none;
	}
	.header .nav dl{
		width: 100%;position: relative; top: 0;
	}
	.gh {
		float:right;
		height:25px;
		width:23px;
		margin-right:5px;
		margin-top:20px;
		position:relative;
		transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		-webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		-ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		cursor:pointer;
	}
	.gh.selected {
		transform: rotate(90deg);
	}
	.gh a {
		background-color: #fff;
		display: block;
		height: 3px;
		margin-top: -1px;
		position: relative;
		top: 50%;
		transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		width: 100%;
		border-radius: 3px;
	}
	
	.gh a:after, .gh a:before {
		background-color: #fff;
		content: "";
		display: block;
		height: 3px;
		left: 0;
		position: absolute;
		transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
		width:100%;
		border-radius: 3px;
	}
	.gh a:after {
		top:9px;
	}
	.gh a:before {
		top:-8px;
	}
	.gh.selected a:after, .gh.selected a:before {
		top: 0;
	}
	.gh.selected a:before {
		transform: translateY(0px) rotate(-45deg);
		-webkit-transform: translateY(0px) rotate(-45deg);
		-ms-transform: translateY(0px) rotate(-45deg);
	}
	.gh.selected a:after {
		transform: translateY(0px) rotate(45deg);
		-webkit-transform: translateY(0px) rotate(45deg);
		-ms-transform: translateY(0px) rotate(45deg);
	}
	.gh.selected a {
		background-color: transparent !important;
	}
	.sidebar{
		right: 10px;
	}
	.hbanner{
		position: relative; height: 500px;
	}
	.g-txt{
		float: none; padding: 0 3%; position: relative; z-index: 1; width: auto; text-align: center; padding-top:130px;
	}
	.g-txt h2{
		text-align: center; line-height: 1.2; padding-left: 0; font-size: 24px; position: relative;
	}
	.g-txt h2:after{
		position: absolute; left: 50%; margin-left: -25px; bottom: -20px; content: "";
		width: 50px; height: 2px; background-color:#47e7c4 ;
	}
	.g-txt h2 font{
		line-height: 1.3;  font-size: 24px;
	}
	.g-txt h2:before{
		display: none;
	}
	.g-txt p{
		text-align: center; font-size: 16px; padding-top: 40px; max-width: 420px; margin: 0 auto; opacity: 0.8; line-height: 1.6;
	}
	
	.g-home-btn{
		margin-top: 50px; font-size: 18px; width: 180px; height: 45px; line-height: 45px;
	}
	.g-img{
		float: none; padding-top: 0; position: absolute; left: 0; right: 0; text-align: center; bottom: 0; 
	}
	.g-img img{
		opacity: 0.4;
	}
	.hnav{
		margin-top: 0;
	}
	.hnav .wrapper{
		margin: 0;
	}
	.hnav li{
		width: 33.33%; text-align: center; border-right: 0; position: relative;
	}
	.hnav li:after{
		position: absolute; right: 0; top: 0; content: "";
		width: 1px; height:30px; background-color:#f1f1f1 ;
	}
	.hnav li:last-child:after{
		display: none;
	}
	.hnav li .img{
		float: none; padding: 0;
	}
	.hnav li .img img{
		width: 45px;
	}
	.hnav li .txt{
		float: none; max-width: 160px; display: inline-block;
	}
	.hnav li .txt h2{
		font-size: 16px;
	}
	.hnav li .txt br{
		display: none;
	}
	.hnav li .txt p{
		font-size: 12px; padding-top: 10px; margin: 0 10px; line-height: 1.6;
	}
	.g-hd h2{
		font-size: 20px;
	}
	.about-hd h2:before{
		height: 25px; margin-right: 20px;
	}
	.g-hd p{
		font-size: 15px; letter-spacing: 1px; line-height: 1.3;
	}
	.hhelp,
	.hpro,
	.pay{
		padding: 40px 0;
	}
	.hhelp-bd,
	.hpro-bd,
	.pay-bd{
		margin-top: 30px;
	}
	.hnav{
		position: relative;z-index: 2;
	}
	.hhelp{
		background: #fff;
	}
	.hhelp-bd ul{
		height: auto; overflow: hidden;
	}
	.hhelp-bd .txt h2{
		font-size: 15px;
	}
	.hhelp-bd .txt h4{
		padding-top: 5px; font-size: 12px;
	}
	.hhelp-bd li{
		width: 33.33%; margin-bottom: 10px;display: none;
	}
	.hhelp-bd li.s{
		display: block;
	}
	.hhelp-bd li img{
		width:70px;
	}
	.hpro-bd ul{
		height: auto; overflow: hidden;
	}
	.hpro-bd li{
		width: 47%; margin: 0 1%; margin-bottom: 2%; height: 220px;
	}
	.hpro-bd li .img{
		margin-top: 18px;
	}
	.hpro-bd li .img img{
		width: 60px;
	}
	.hpro-bd li .txt h2{
		font-size: 16px; padding: 10px 0 30px;
	}
	.hpro-bd .txt:before{
		top: 50%; width: 40px; margin-left: -20px; height: 1px;
	}
	.hpro-bd li .txt h4{
		font-size: 14px; line-height: 1.5;
	}
	.pay .pay-txt{
		max-width: 420px; margin: 30px auto 0; font-size: 16px; line-height: 1.5;
	}
	.pay .pay-txt br{
		display: none;
	}
	.pay li{
		width: 47%; margin: 0 1%; margin-bottom: 15px; padding: 20px 0 18px;
	}
	.pay li .img img{
		width: 75px;
	}
	.pay li .txt{
		font-size: 14px;
	}
	.g-btn{
		height: 45px; line-height: 45px; font-size: 16px;
	}
	.hview{
		padding: 50px 0;
	}
	.line-27,
	.pro-sys-r .txt h2{
		font-size:18px;
	}
	.line-27:before{
		height: 20px; vertical-align: -2px;
	}
	.hview .img{
		width: 63%; 
	}
	.hview.even .img{
		 margin-right: -30%;
	}
	.hview.odd .img{
		margin-left: -30%; text-align: right;
	}
	.hview-txt{
		width: 60%;
	}
	.hview-txt ul{
		margin-top: 25px;
	}
	.hview-txt li{
		position: relative; padding-left: 30px; font-size: 14px;line-height: 1.8; margin-bottom: 15px;
	}
	.hview-txt li br{
		display: none;
	}
	.hview-txt li .icon-xuanzhongzhuangtai{
		position: absolute; left: 0; top: 0; margin-top: -4px; font-size: 18px;
	}

	.btn-zx,
	.btn-jr{
		 width: 150px; display: block; margin: 0 auto; margin-top: 10px;
	}
	.hstart{
		padding: 40px 0;
	}
	.hpartner{
		height: auto; padding-bottom: 40px;
	}
	.hpart-hd{
		padding-top: 40px;
	}
	.hpart-bd{
		margin-top: 30px;
	}
	.hpart-list li{
		width: auto;
	}
	.hstart-txt{
		padding-left: 20px;
	}
	.hstart-txt h2{
		font-size: 18px;
	}
	.hstart-txt:before{
		width: 3px; height: 30px; margin-top: -15px;
	}
	.hstart-txt p{
		font-size: 12px; line-height: 1.4;
	}
	.hstart-btn{
		position: relative; top: 0; right: 0; margin-top: 0; margin-top: 35px; text-align: center;
	}
	.hstart-btn a{
		height: 45px; width: 200px; line-height: 45px;
	}
	
	.hpart-prev , .hpart-next {
		display: none;
	}
	.hpart-list:before{
		width: 90%; margin-left: -45%; height: 50px; bottom: -15px;
	}
	.hpart-list .hpart-list-item dl{
		padding: 20px 20px; height: auto;
	}
	.footer{
		font-size: 14px; padding-top: 20px;
	}
	.footer dl{
		display: none;
	}
	.footer dt{
		font-size: 16px;
	}
	.footer .s{
		float: left; display: block; 
	}
	
	.footer dl:first-child{
		width: auto; 
	}
	
	.footer .iconfont{
		margin-right: 5px;
	}
	.footer .s:last-child{
		float: right;
	}
	
	
	/*帮助中心 -列表*/
	.faq-view{
		height: 360px;
	}
	.faq-srch{
		margin-top: 80px;
	}
	.faq-srch .txt{
		width: 720px; box-sizing: border-box; height: 50px; line-height: 50px; font-size: 16px; padding-left: 15px;
	}
	.faq-srch .btn{
		height: 50px; line-height: 50px; 
	}
	.faq-nav{
		margin-top: 110px;
	}
	.faq-nav li a{
		font-size: 16px;
	}
	.faq-nav li.on a:before{
		height: 1px;
	}
	.faq-list{
		padding: 30px 0 0;
	}
	.faq-list dl{
		margin-bottom: 20px; box-sizing: border-box;
	}
	.faq-list dt{
		margin-bottom: 10px; font-size: 18px;
	}
	.faq-list dl:before{
		height: 16px; top: 8px;
	}
	.faq-list dd a{
		font-size: 14px; line-height: 1.5;
	}
	.faq-chat{
		padding-top: 50px; padding-bottom: 50px;
	}
	.faq-chat h2{
		font-size: 20px;
	}
	.faq-chat h4{
		font-size: 18px; margin-top: 8px;
	}
	.g-btn-2{
		width: 200px; height: 45px; line-height: 45px; font-size: 18px; margin-top: 30px;
	}
	/*帮助中心-详情*/
	.faqd-hd{
		padding-top: 30px;
	}
	.faqd-bd{
		margin-top: 30px; font-size: 14px; padding: 0 10px;
	}
	.faqd-bd img{
		margin-top: 20px;
	}
	/*产品中心*/
	.probanner{
		position: relative; height: 500px; 
	}
	.g-img{
		font-size: 0; overflow: hidden;
	}
	.g-img img{
		position: relative; margin-bottom: -16%;
	}
	.probanner-r{
		margin-left: 0; display: none;
	}
	.probanner-r img{
		width: 300px;
	}
	.pro-pay,
	.pro-sys,
	.pro-df,
	.pro-qr,
	.about,
	.contact,
	.channel,
	.traffic,
	.sdk,
	.login1{
		padding: 40px 0;
	}
	.pro-pay .wrapper{
		margin: 0;
	}
	.pro-bd,
	.pro-sys .pro-txt{
		margin-top: 30px;
	}
	.pro-pay-l{
		width: 40%; margin-left: -50px;  text-align: right;  box-sizing: border-box; margin-top: 0px;
	}
	.pro-pay-r{
		width: 60%;
	}
	.g-describe{
		margin-top: 20px; font-size: 14px; line-height: 1.5;
	}
	.g-describe br{
		display: none;
	}
	.pro-pay-r ul{
		margin-top: 30px;
	}
	.pro-pay-r li{
		width: 20%;
	}
	.pro-pay-r li img{
		width: 80px;
	}
	.pro-pay-r li span{
		margin-top: 8px; font-size: 14px;
	}
	.pro-sys .pro-txt{
		font-size: 14px; line-height: 1.5; max-width: 600px; margin-left: auto; margin-right: auto;
	}
	.pro-sys .pro-txt br{
		display: none;
	}
	.pro-sys-l, .pro-sys-r{
		float: none; width: auto;
	}
	.pro-sys-l li{
		width: 20%; float: left; text-align: center; 
	}
	.pro-sys-l li a{
		display: block; width: auto; font-size: 16px; line-height: 1.2;padding: 15px 0; height: auto;
	}
	.pro-sys-l li i{
		display: block; margin-right: 0;
	}
	.pro-sys-r{
		padding: 30px 10px; height: auto;
	}
	.pro-sys-r .img{
		margin-top: 0;
	}
	.pro-sys-r .img img{
	
	}
	.pro-sys-r .txt{
		padding: 0 10px;  width: 60%; float: left;
	}
	.pro-sys-r .txt p{
		font-size: 14px; line-height: 1.5;
	}
	.pro-sys-r .btn{
		position: relative; right: 0; bottom: 0; margin-top: 20px; 
	}
	.pro-df-l{
		width: 60%;
	}
	.pro-df-l .btn,
	.pro-qr-l .btn{
		margin-top: 20px;margin-left: auto; margin-right: auto;
	}
	.pro-df-r,
	.odd .pro-qr-r{
		width: 40%;
	}
	.pro-qr-r{
		padding-left: 0;
	}
	.pro-qr-l{
		margin-top: 50px; width: 60%;
	}
	
	/*登录*/
	.login-hd h2{
		font-size: 20px;
	}
	.login-btn .btn{
		font-size: 16px;
	}
	
	.about-bd{
		font-size: 14px; line-height: 1.5; margin-top: 20px;
	}
	.contact-bd{
		padding: 30px 0 ; text-align: center;
	}
	.contact-bd ul,
	.channel-bd{
		margin-top: 20px;
	}
	.contact-bd li,
	.g-bd .txt p{
		font-size: 16px;
	}
	.contact-bd .txt{
		display: inline-block; float: none; text-align: left;
	}
	.contact-bd .img{
		margin-left: 50px; margin-top: 0;display: inline-block; float: none;
	}
	.channel-bd .img,
	.traffic-bd .img{
		width: 40%;
	}
	.channel-bd .txt,
	.traffic-bd .txt{
		width: 55%; margin-left: 5%;
	}
	.traffic-bd .txt{
		margin-left: 0; margin-right: 5%; margin-top: 20px;
	}

	.g-bd .txt p{
		padding-left: 0;
	}
	.g-bd .btn{
		margin-top: 30px;
	}
	.contact-bd li, .g-bd .txt p{
		font-size: 14px;
	}
	.contact-bd li{
		padding-left: 120px; line-height: 1.5;
	}
	.contact-bd span{
		line-height: 1.5; vertical-align: top; margin-top: -6px;
	}
	.contact-bd i{
		margin-right: 15px;
	}
	
	.docs-nav,
	.guide-l{
		width: 200px;
	}
	.docs-nav li a,
	.guide-l li a{
		height: 45px; line-height: 45px; font-size: 18px;
	}
	.docs-main,
	.guide-r{
		width: calc(100% - 220px);
	}
	.docs-hd,
	.guide-rhd{
		font-size: 18px; padding-bottom: 10px; 
	}
	.docs-bd{
		font-size: 14px; line-height: 1.5; padding: 15px 0;
	}
	.guide-rbd{
		padding: 20px 0;
	}
	.guide-rbd p{
		font-size: 14px; line-height: 1.5; margin-bottom: 15px;
	}
	/*开发者中心-DEMO体验*/
	.demo{
		padding: 50px 0; text-align: center;
	}
	.demo-txt h2:before{
		display: none;
	}
	.demo-txt,
	.demo-img,
	.demo2 .demo-img{
		float: none; width: auto; 
	}
	.demo1 .demo-img{
		padding-top: 20px;
	}
	.demo1 .demo-img,
	.demo2 .demo-img{
		padding-right: 0;
	}
	.demo-txt h2{
		font-size: 22px;
	}
	.demo-txt p{
		margin-top: 10px; font-size: 16px;
	}
	.demo2 .btn{
		width: 200px; height: 45px; line-height: 45px; margin-top: 30px;
	}
	
	.banner h2{
		font-size: 26px;
	}
	.banner p{
		letter-spacing: 5px;
	}
	.sdk ul{
		margin-right: 0;
	}
	.sdk li{
		width: 29%; box-sizing: border-box; margin:0 2% ; margin-bottom: 45px; text-align: center; height: 145px;
	}
	.sdk .txt{
		padding-left: 0; display: inline-block; font-size: 18px;
	}
	.sdk .img{
		position: relative; top: 0; right: 0;display: inline-block; vertical-align: middle; margin-left: 10px; width: 70px;
	}
	.sdk .btn{
		margin-left: -50px;
	}
	.sdk .btn a{
		width:100px ; height: 45px; line-height: 45px; font-size: 18px;
	}
	.guide-nv{
		height: auto; line-height: normal; overflow: hidden; border-width: 1px;
	}
	.guide-nv a{
		width: auto; padding: 0 30px; font-size: 18px; height: 40px; line-height: 40px;
	}
	.login-hd p{
		padding: 20px 0 30px;
	}
	.gtpwd-img img{
		width: 80px;
	}
	.gtpwd-txt h2{
		padding-top: 25px; padding-bottom: 40px; font-size: 20px;
	}
	.gtpwd-txt p{
		padding-bottom: 50px; font-size: 16px;
	}
	
	

}
@media only screen and (max-width:768px) {
	.hview.even .img,
	.hview.odd .img,
	.pro-pay-l{
		margin-right: 0; width: auto; float: none; text-align: center; margin-left: 0;
	}
	.hview.even .img img,
	.hview.odd .img img,
	.pro-pay-l img{
		 width: 80%;
	}
	.hview-txt,
	.pro-pay-r{
		float: none; width: auto; margin-top: 25px;
	}
	.pro-pay-r{
		margin-left: 3%; margin-right: 3%;
	}
	.faq-srch{
		width: 100%;
	}
	.faq-srch .txt{
		width: 100%; 
	}
	.faq-nav{
		margin-top: 60px;
	}
	.faq-nav li{
		width: 33.33%;  padding: 10px 0;
	}
	.faq-list dl{
		margin-bottom: 20px; float: none; width: auto;
	}
	.probanner-r img{
		width: 200px;
	}
	.pro-pay-r li{
		width: 25%;
	}
	.pro-pay-r li span{
		font-size: 12px;
	}
	.pro-sys-l li a{
		font-size: 12px;
	}
	.pro-sys-l li i{
		font-size: 24px;
	}
	.pro-df-r,
	.odd .pro-qr-r,
	.pro-df-l,
	.pro-qr-l{
		width: auto; float: none; 
	}
	.pro-df-r, .odd .pro-qr-r{
		width: 80%; margin: 0 auto;
	}
	.pro-qr-l{
		margin-top: 10px;
	}
	.login2{
		padding: 40px 0;
	}
	.login-wp{
		padding: 30px; margin: 0 3%; display: block;
	}
	.login-bd{
		height: auto; overflow: hidden; margin-top: 10px;
	}
	.login2 .txt,
	.login1 .txt{
		width: 100%; box-sizing: border-box; height: 45px; line-height: 45px; margin-top: 5px; font-size: 14px;
		-webkit-appearance:none; border-radius: 0;
		appearance: none;
	}
	.login2 .txt-gt{
		margin-bottom: 60px;
	}
	.gtpwd{
		height: 65px; line-height: 65px;
	}
	.gtpwd-l > label{
		height: 75px;
	}
	.login-bd li{
		position: relative;
	}
	.login-bd img{
		position: absolute; right: 0; margin-top: 10px; height: 45px;
	}
	.login-bd p{
		padding: 20px 0 0;
	}
	.login-btn{
		
	}
	.login-btn .btn {
		 width: 90%; height: 40px; line-height: 40px; margin-bottom: 30px;
		 box-shadow: 0px 9px 10px 0px rgba(41, 59, 236, 0.3);
	}
	.contact-bd .txt{
		display: block; float: none;
	}
	.contact-bd .img{
		margin-left: 0; margin-top: 30px; 
	}
	.contact-bd .img img{
		width: 200px;
	}
	
	.channel-bd .img, .traffic-bd .img,
	.channel-bd .txt, .traffic-bd .txt{
		float: none; width: auto; margin: 0;
	}
	.channel-bd .img, .traffic-bd .img{
		width: 80%; margin: 30px auto 0;
	}
	.g-bd .btn{
		width: 200px; display: block;margin-left: auto; margin-right: auto;
	}
	.docs-nav,
	.guide-l{
		width: auto; float: none; margin-bottom: 0;
	}
	.docs-nav li,
	.guide-l li{
		display: block; width: 33%; float: left; margin-bottom: 0;
	}
	.docs-nav li a,
	.guide-l li a{
		font-size: 12px;
	}
	.docs-main,
	.guide-r{
		float: none;  width: auto;
	}
	.guide-rhd{
		padding-top: 15px;
	}
	.sdk li{
		width: 46%; height: 135px;
	}
	.sdk .txt{
		display: block; padding-top: 20px;
	}
	.sdk .img{
		 margin-left: 0; margin-top: 10px; text-align: center; 
	}
	.guide-nv a{
		font-size: 16px;
	}
	.pro-df-l{
		margin-bottom: 30px;
	}
	.banner{
		height: 255px;
	}
	.sdk .btn{
		bottom: -18px;
	}
	.sdk .btn a{
		height: 40px; line-height: 40px; font-size: 16px;
	}
	
	.pro-sys-r .img img{
		width: 80%;
	}
	.pro-sys-r .txt{
		float: none; width: auto; margin-top: 0;
	}
	.pro-sys-r .txt p br{
		display: none;
	}
	.pro-sys-r .btn{
		text-align: center;
	}
	
	.pro-df-l .btn, .pro-qr-l .btn{
		display: block;
	}
	.line-27, .pro-sys-r .txt h2{
		font-size: 16px;
	}
	.line-27:before{
		vertical-align: -5px;
	}
	
}