/* ------全局部分------ */

/*字体与背景色*/
body,input,select,textarea {font-family:"Google Sans", "Gotham","微软雅黑","MicrosoftYaHei","Microsoft YaHei","Noto Sans","Noto Sans CJK SC", "PingFang SC","\5FAE\8F6F\96C5\9ED1",Arial,Tahoma,Helvetica,\5b8b\4f53,"宋体",sans-serif; font-size:12px; line-height: 1.5; color:#000;} 

/*清除内外边距*/
html,body,div,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,object,code,legend,button,input,textarea,th,td,a,img,video{margin:0;padding:0;border:0;outline:0;}

/*清除列表的样式*/
ul, ol, li {list-style-type:none;}

/*清除列表的样式*/
em {font-style:normal;}

/*清除图片间隙边距*/
img,video{vertical-align:top;}

/*让padding只在内部起作用*/
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    
    
    
}

/* 让文本等内容无法选择 */
.disableSelect {
    -moz-user-select: -moz-none;
    -moz-user-select: none;
    -o-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*去掉input、textarea、select的默认样式*/
input, textarea, select{
    appearance:none;
    -webkit-appearance:none;/* Safari 和 Chrome */
    -webkit-appearance:none; /* Safari 和 Chrome */
    -moz-appearance:none; /* Firefox */
    
    
    
    -moz-user-select: -moz-text;
    -moz-user-select: text;
    -o-user-select: text;
    -khtml-user-select: text;
    -webkit-user-select: text;
    -ms-user-select: text;
    user-select: text;
    
}

/*去掉iOS横排放大文字*/
html,body{-webkit-text-size-adjust: 100%;}

/*去掉iOS可点击元素的半透明灰色背景*/
html,body{-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

/* 清除浮动 */
.clearfix {
	clear: all;
}

/*文字呈现点点点*/
.diandian {
	overflow: hidden; /*自动隐藏文字*/
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    white-space: nowrap;/*强制不换行*/
   /* width: 20em;*//*不允许出现半汉字截断*/
}

/*Retina屏显示1像素的下边线*/
.line_bottom {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAAqADAAQAAAABAAAAAgAAAADtGLyqAAAAEUlEQVQIHWNggAJGIC0CYgMAAH8AFpr58RoAAAAASUVORK5CYII=");
	/* background-size: 100% 1px; */
	background-size: 100% 3px;
	background-position: left bottom;
	background-repeat: no-repeat;
  }
  
  /*Retina屏显示1像素的下边线*/
  .line_bottom_dark {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABVJREFUeNpi+P//PwODlpbOf4AAAwAabwR9SscI4AAAAABJRU5ErkJggg==");
	/* background-size: 100% 1px; */
	background-size: 100% 3px;
	background-position: left bottom;
	background-repeat: no-repeat;
  }
  
  /*Retina屏显示1像素的右边线*/
  .line_right {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAAqADAAQAAAABAAAAAgAAAADtGLyqAAAAEElEQVQIHWNggAApJiiDAQABKAAdqLDS3AAAAABJRU5ErkJggg==");
	/* background-size: 1px 100%; */
	background-size: 3px 100%;
	background-position: right top;
	background-repeat: no-repeat;
  }
	/* Retina屏显示1像素的右和底边线 */
  .line_rightBottom {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAAqADAAQAAAABAAAAAgAAAADtGLyqAAAAEElEQVQIHWNggAApJiiDAQABKAAdqLDS3AAAAABJRU5ErkJggg=="),
					url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAAqADAAQAAAABAAAAAgAAAADtGLyqAAAAEUlEQVQIHWNggAJGIC0CYgMAAH8AFpr58RoAAAAASUVORK5CYII=");
	/* background-size: 1px 100%, 100% 1px; */
	background-size: 3px 100%, 100% 3px;
	background-position: right top, left bottom;
	background-repeat: no-repeat, no-repeat;
  }


/* 按钮处理方式 */
/* 正常 */
.btn {
	cursor:pointer;
}
/* 划过 */
/*
.btn:hover {
	filter:alpha(opacity=80);-moz-opacity:0.8;opacity:0.8;
}
*/
/* 按下 */
.btn:active {
	filter:alpha(opacity=70);-moz-opacity:0.7;opacity:0.7;
}




/* 背景图填满且不重复*/
.bgFill_width {
	background-repeat: no-repeat no-repeat;
	background-size:100% auto;
}
.bgFill_cover {
    background-repeat: no-repeat no-repeat;
	background-size:cover;
    background-position: center;
}



/*将元件透明*/
.hideShow {
	opacity:0;
}

/*绝对定位左右居中对齐*/
.center {
	display:block;
	position: absolute;
	margin:0 auto;
	left:0; right:0;
}

/*绝对定位，上下左右居中对齐*/
.center_center {
	margin:auto;
	left:0; right:0; top:0; bottom:0;
	position: absolute;
	display:block;
}

/*图片缩小50%，retina显示*/
.retina {
	transform:scale(0.5);
	-ms-transform:scale(0.5); 	/* IE 9 */
	-moz-transform:scale(0.5); 	/* Firefox */
	-webkit-transform:scale(0.5); /* Safari 和 Chrome */
	-o-transform:scale(0.5); 	/* Opera */
}









/*框架定义--------------------*/

html {
	background: #fff;
/*
	width: 100%;
	height: 100%;
*/
    
}

body {
	/* position: fixed; */
	/* position: absolute; */
	display: block;
	/* overflow: hidden; */

/*	width: 375px;*/
    /* width: 100%; */
    /* height: auto; */
    /*height: 100%;*/
}


/*主容器定义*/
#mainContainer {
	/*position: absolute;*/
    /* position: fixed; */
	display: block;
	
	transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
    
    
    /* overflow: hidden; */
	/* height: auto; */
    /*height: 100%;*/
	/* width: 100%; */
	/* width: 375px; */
	/* height: 724px; */
}


/*外层部件定义*/
#mainContainer > .container {
	/* width: 100%; */
	/* height: auto; */
    /* height: 100%; */
    
	/* position: absolute; */
    /* position: fixed; */
	display: block;
	/* left: 0px; */
	/* top: 0px; */
    
    /* overflow: hidden; */
}
#mainContainer > #loading {
	z-index:14;
    /* display: none; */
}

#mainContainer > #front {
	z-index:12;
	height: 0px;
	display: none;
}

#mainContainer > #bg {
	z-index:10;
}

#mainContainer > #pages {
	z-index:11;
	/*overflow: hidden;*/
	display: none;
	/* 滚动页面用这个，单屏应用注销这行 */
	/* overflow: scroll; */
	/* 滚动页面用这个，单屏应用注销这行 */
	/* overflow-x:hidden; */
}
#mainContainer > #floatPages {
	z-index:13;
	display: none;
}




/*子页面定义*/
#mainContainer > #pages > .page {
	width: 100%;
	/*height: auto;*/
    /* height: 100%; *//* 单屏页面请用这个 */
    
	/*position: absolute;*//* 滚动页面用这个 */
    /* position: fixed; *//* 单屏页面请用这个 */
	left: 0px;
	top: 0px;
    /*background: #fff;*/
	display: block;

	/* overflow: hidden; */
}






/*子浮页定义*/
#mainContainer #floatPages .floatPage {
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	/*position: absolute;*/
    /*display: block;*/
	
    position: fixed;
	display: flex;
  	align-items: center;
}

.floatPage .background {
	background: rgba(34,35,38,0.6);
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	position: absolute;
	display: block;
}

.floatPage > .main {
	/*width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	*/
	background-color: #fff;
	/*position: absolute;*/
	display: block;




	position: relative;
	width: 290px;
	height: auto;
	margin: auto;
	border-radius: 12px 12px 24px 24px;
	text-align: center;
	padding: 28px 20px 30px 20px;
	/* padding-bottom: 30px; */

	/* top:0px; */
}

.floatPage .closeBtn {
    width: 34px;
    height: 34px;
    background-image: url('../images/closeBtn.png');
    top: -49px;
    position: absolute;
    left: 50%;
    margin-left: -17px;
}


