﻿@charset "utf-8";
/*--------------------------------------------------------------
*Filename:                     login css
---------------------------------------------------------------*/
/*reset css  start
----------------------*/
html {	
	-webkit-text-size-adjust: 100%
}
body {
	margin: 0
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block
}
audio, canvas, progress, video {
	display: inline-block;
	vertical-align: baseline
}
audio:not([controls]) {
	display: none;
	height: 0
}
[hidden], template {
	display:none
}
a {
	background: 0 0
}
a:active, a:hover {
	outline: 0
}
abbr[title] {
	border-bottom: 1px dotted
}
b, strong {
	font-weight: 700
}
dfn {
	font-style: italic
}
h1 {
	margin: .67em 0
}
mark {
	color: #000;
	background: #ff0
}
small {
	font-size: 80%
}
sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}
sup {
	top: -.5em
}
sub {
	bottom: -.25em
}
img {
	max-width: 100%;
	border: 0
}
svg:not(:root) {
	overflow: hidden
}
figure {
	margin: 1em 40px
}
hr {
	box-sizing: content-box;
	height: 0
}
pre {
	overflow: auto
}
code, kbd, pre, samp {
	font-family: monospace, monospace;
	font-size: 1em
}
button, input, optgroup, select, textarea {
	font: inherit;
	margin: 0;
	color: inherit
}
button {
	overflow: visible
}
button, select {
	text-transform: none
}
button, html input[type=button], input[type=reset], input[type=submit] {
	cursor: pointer;
	-webkit-appearance: button
}
button[disabled], html input[disabled] {
	cursor: default
}
input {
	line-height: normal;
}
input[type=checkbox], input[type=radio] {
	box-sizing: border-box;
	padding: 0
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
	height:auto
}
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
	-webkit-appearance:none
}
fieldset {
	margin: 0 2px;
	padding: .35em .625em .75em;
	border: 1px solid silver
}
legend {
	padding: 0;
	border: 0
}
textarea {
	overflow: auto
}
optgroup {
	font-weight: 700
}
table {
	border-spacing: 0;
	border-collapse: collapse
}
td, th {
	padding: 0
}
* {
	margin: 0;
	padding: 0;
	list-style: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	outline: 0;
	-webkit-tap-highlight-color: transparent;
	-webkit-tap-highlight-color: transparent
}
body {
	font-size: 14px;
	line-height: 1.5;
	font-family: 'Helvetica Neue', Helvetica, sans-serif;
	color: #000;
	background-color: #4B6080;
	-webkit-overflow-scrolling: touch
}
a {
	cursor: pointer;
	text-decoration: none;
	color: #007aff
}
a:active {
	color: #0062cc
}
.hide{
	display: none !important;
}
/*reset css  end
----------------------*/
/*login css  start
----------------------*/
.flog-wrap{
	position: absolute;
	top: 40%;
	left: 50%;
	margin-left: -190px;
	width: 380px;
    -webkit-transform: translateY(-40%);
    transform: translateY(-40%);	
}

.flog-tit{
	padding: 15px;
	text-align: center;
}
.flog-tit .pic{
	display: inline-block;
	width: 150px;
	height: 50px;
	background-image: url(../images/logo-pc.png);
	background-repeat: no-repeat;
	background-position: center;
}

.flog-tit .logo-txt{
    text-align: center;
    margin-top: 37px;
}

.flog-tit .txt{
	padding: 15px 0;
	color: #ccc;
	font-size: 18px;
}

.flog-row{
	background: #F9F9F9;
	border-radius: 5px;
}
.flog-row .row-box:last-child{
	border: none !important;
}
.row-box{
	display: table;
	width: 100%;
	padding: 10px 20px;
	border-bottom: 1px solid #ccc;
}
.row-box:after{
	clear: both;
	display: table;
	content: "";
}
.row-box .tl{
	position: relative;
	display: table-cell;
	height: 40px;
	vertical-align: middle;
}
.row-box .tr{
	display: table-cell;
	width: 80px;
	height: 40px;
	color: #333;
	font-size: 14px;
	text-align: right;
	vertical-align: middle;
}
.row-box label{
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 30px;
	height: 40px;
	color: #ccc;
	font-size: 16px;
	line-height: 40px;
	text-align: left;
}
.row-box .icon-del{
	position: absolute;
	top: 50%;
	right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    display: none;
	color: #ccc;
}
.row-box input{
	width: 100%;
	height: 40px;
	padding: 10px 0;
	padding-left: 30px;
	border: none;
	background: none;
	-webkit-box-shadow: 0 0 0px 100px #f9f9f9 inset;
	color: #333;
	font-size: 14px;
	line-height: 1.5;
}
.row-box input.error{
	color: #F96A40;
}
.row-box input.error:focus{
	color: #333;
}
.row-box input.error::-webkit-input-placeholder {
	color: #F96A40;
}
.row-box input.error:-moz-placeholder{
	color: #F96A40;
}
.row-box input.error::-moz-placeholder{
	color: #F96A40;
}
.row-box input.error:-ms-input-placeholder {
	color: #F96A40;
}

.row-box input::-webkit-input-placeholder {
	color: #333;
}
.row-box input:-moz-placeholder {
	color: #333;
}
.row-box input::-moz-placeholder {
	color: #333;
}
.row-box input:-ms-input-placeholder {
	color: #333;
}

.row-box input:focus::-webkit-input-placeholder {
	color: #333;
}
.row-box input:focus:-moz-placeholder {
	color: #333;
}
.row-box input:focus::-moz-placeholder {
	color: #333;
}
.row-box input:focus:-ms-input-placeholder {
	color: #333;
}
.row-box .tr a{
	display: inline-block;
	color: #333;	
}
.row-box .tr a:hover{
	color: #80AAEC;
}
.row-box .tr a.iconfont{
	display: inline-block;
	color: #ccc;
	font-size: 14px;	
}
.row-box .tr a.iconfont:hover{
	color: #80AAEC;
}
.row-box .tr img{
	float: right;
	display: block;
	width: 80px;
	height: 40px;
	overflow: hidden;
	cursor: pointer;
}

.flog-err{
	padding: 15px 0;
	color: #fff;
	font-size: 14px;
	line-height: 1.5;
	text-align: center;
}

.flog-agr{
	padding: 10px 20px 0 20px;
	color: #ccc;
	font-size: 12px;
}
.flog-agr a{
	color: #80AAEC;	
}
.flog-agr a:hover{
	color: #ccc;
}
.flog-agr .iconfont {
	margin-right: 5px;
	width: auto;
	padding: 0;
	border: none !important;
	background: none !important;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	font-size: 14px;
}
.flog-agr .iconfont:checked {
	border: none !important;
	background: none !important;
	outline: none;
}
.flog-agr .iconfont:focus {
	border: none !important;
	background: none !important;
	outline: none;
}
.flog-agr .iconfont:before {
	content: "\e9e5";
	color: #ccc;
}
.flog-agr .iconfont:checked:before {
	content: "\e9e4";
	color: #C9CFD9;
}

.flog-btn button{
	display: block;
	width: 100%;
	padding: 13px 0;
	border: none;
	border-radius: 5px;
	background-color: #6281B1;
	color: #fff;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
}
.flog-btn button:hover{
	background-color: #80AAEC;
}
.flog-btn button:focus{
	background-color: #80AAEC;
}
.flog-btn button:active{
	background-color: #80AAEC;
}
.flog-btn button:disabled{
	background-color: #ccc;
}
.flog-btn a{
	display: block;
	width: 100%;
	padding: 13px 0;
	border: none;
	border-radius: 5px;
	background-color: #6281B1;
	color: #fff;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
}
.flog-btn a:hover{
	background-color: #80AAEC;
}
.flog-btn a:active{
	background-color: #80AAEC;
}
.flog-btn a.disabled{
	background-color: #ccc;
}

.flog-lnk{
	padding: 40px 0 15px 0;
	color: #ccc;
	font-size: 14px;
	text-align: center;
}
.flog-lnk a{
	color: #80AAEC;	
}
.flog-lnk a:hover{
	color: #ccc;
}


.fagr-wrap{
	position: fixed;
	z-index: 99;
	top:0;
	left: 0;
	right: 0;
	display: none;
	width: 100%;
	height: 100%;
	padding: 5% 0;
    background-color: #4B6080;
	overflow: hidden;
}
.fagr-iner{
	position: relative;
	margin: 0 auto;
	width: 600px;
	padding: 20px 30px;
	max-height: 100%;
	background-color: #fff;
	overflow-y: auto;
}
.fagr-tit{
	padding-top: 20px;
	color: #333;
	font-size: 20px;
	text-align: center;
}
.fagr-tit:after{
	margin: 10px auto;
	display: table;
	content: "";
	width: 90px;
	height: 4px;
	background-color: #ededed;
}
.fagr-txt{
	padding: 10px 0;
}
.fagr-txt p{
	margin-bottom: 5px;
	text-indent: 2em;
	color: #999;
	font-size: 13px;
	line-height: 1.75;
}
.fagr-cls{
	position: absolute;
	top: 20px;
	right: 20px;
	display: inline-block;
}
.fagr-cls a{
	color: #C9CFD9;
	font-size: 28px;
	line-height: 1.0;
}
.fagr-cls a:hover{
	color: #80AAEC;	
}
.fbk-lnk{
	display: none;
}

.flog-auth{
    margin-top:20px;
}
.flog-auth .login-style {
    display: inline-block;
    margin-left:5px;
}
.flog-auth .login-style:first-child {
    display: inline-block;
    margin-left: 0px;
}

.flog-auth .login-style img{
    vertical-align:middle;
}

.flog-auth .login-style a {
    color: #C9CFD9;
    vertical-align: middle;
}

@media (max-width: 1080px) {

	.flog-wrap{
		position: absolute;
		top: 30%;
		left: 50%;
		margin-left: -140px;
		width: 280px;
	    -webkit-transform: translateY(-30%);
	    transform: translateY(-30%);	
	}
	
	.flog-tit{
		padding: 40px 0px 15px 0px;
		text-align: center;
	}
	.flog-tit .pic{
		display: inline-block;
		width: 150px;
		height: 70px;
		background-image: url(../images/logo-mb.png);
		background-size: 75px 64px;
		background-repeat: no-repeat;
		background-position: center;
	}
	.flog-tit .txt{
		padding: 30px 0 10px 0;
		color: #ccc;
		font-size: 18px;
	}
	.flog-row{
		background: none;
		border-radius: 0;
	}
	.flog-row .row-box:last-child{
		border-bottom: 1px solid #5C759C !important;
	}
	.row-box{
		padding: 10px 0px 0px 0;
		border-bottom: 1px solid #5C759C;
	}
	
	.row-box .tl{
		position: relative;
	}
	.row-box .tr{
		color: #C9CFD9;
	}
	.row-box label{
		left: 5px;
		color: #C9CFD9;
	}
	.row-box input{
		-webkit-box-shadow: 0 0 0px 0px #4B6080 inset;
		color: #C9CFD9;
	}
	.row-box input.error{
		color: #F6AA00;
	}
	.row-box input.error:focus{
		color: #C9CFD9;
	}
	.row-box input.error::-webkit-input-placeholder {
		color: #F6AA00;
	}
	.row-box input.error:-moz-placeholder{
		color: #F6AA00;
	}
	.row-box input.error::-moz-placeholder{
		color: #F6AA00;
	}
	
	.row-box input::-webkit-input-placeholder {
		color: #C9CFD9;
	}
	.row-box input:-moz-placeholder {
		color: #C9CFD9;
	}
	.row-box input::-moz-placeholder {
		color: #C9CFD9;
	}
	.row-box input:-ms-input-placeholder {
		color: #C9CFD9;
	}
	
	.row-box input:focus::-webkit-input-placeholder {
		color: #C9CFD9;
	}
	.row-box input:focus:-moz-placeholder {
		color: #C9CFD9;
	}
	.row-box input:focus::-moz-placeholder {
		color: #C9CFD9;
	}
	.row-box input:focus:-ms-input-placeholder {
		color: #C9CFD9;
	}
	
	.row-box .tr a{
		display: inline-block;
		color: #C9CFD9;	
	}
	.row-box .tr a:hover{
		color: #80AAEC;
	}
	.row-box .tr a.iconfont{
		color: #C9CFD9;
	}
	.row-box .tr a.iconfont:hover{
		color: #80AAEC;
	}
	
	.flog-err{
		padding: 20px 0;
		color: #F6AA00;
	}
	
	.flog-agr{
		padding: 10px 5px 0px 5px;
	}
	
	.flog-btn button{
		padding: 10px 0;
	}
	.flog-btn a{
		padding: 10px 0;
	}
	
	.flog-lnk{
		padding: 30px 0 5px 0;
	}
	
	
	.fagr-wrap{
		position: fixed;
		z-index: 99;
		top:0;
		left: 0;
		right: 0;
		display: none;
		width: 100%;
		height: 100%;
		padding: 60px 30px 80px 30px;
	    background-color: #4B6080;
		overflow: hidden;
	}
	.fagr-iner{
		position: relative;
		margin: 0 auto;
		width: auto;
		padding: 15px;
		max-height: 100%;
		border-radius: 6px;
		background-color: #fff;
		overflow-y: auto;
	}
	.fagr-tit{
		padding-top: 10px;
		color: #333;
		font-size: 18px;
		text-align: center;
	}
	.fagr-tit:after{
		margin: 10px auto;
		display: table;
		content: "";
		width: 90px;
		height: 4px;
		background-color: #ededed;
	}
	.fagr-txt{
		padding: 10px 0;
	}
	.fagr-txt p{
		margin-bottom: 5px;
		text-indent: 2em;
		color: #999;
		font-size: 13px;
		line-height: 1.75;
	}
	.fagr-cls{
		position: fixed;
		top: auto;
		right: calc(50% - 15px);
		bottom: 30px;
	}
	.fagr-cls a{
		color: #C9CFD9;
		font-size: 28px;
		line-height: 1.0;
	}
	.fagr-cls a:hover{
		color: #80AAEC;	
	}
	
	.fbk-lnk{
		position: fixed;
		z-index: 9;
		display: block;
		width: 100%;
		height: 36px;
		background-color: #697a94;
	}
	.fbk-lnk a{
		display: block;
		width: 100%;
		height: 36px;
		padding: 0px 10px;
		color: #fff;
		font-size: 14px;
		line-height: 36px;
	}

    .flog-auth {
        margin-top: 20px;
    }

    .flog-auth .login-style {
        display: inline-block;
        margin-left: 5px;
    }

    .flog-auth .login-style:first-child {
        display: inline-block;
        margin-left: 0px;
    }

    .flog-auth .login-style img {
        vertical-align: middle;
    }

    .flog-auth .login-style a {
        color: #C9CFD9;
        vertical-align: middle;
    }

}

/*login css  end
----------------------*/

/*A8 theme*/
.theme-A8 {
}
.theme-A8 .flog-wrap{
    width:100%;
    left: 0; 
    margin-left: 0; 
}

.theme-A8 .pic {
    width: 100%;
    background-image: url(../images/A8logo-pc.png);
}

.theme-A8 .flog-cont{
    width:380px;
    margin: 0px auto;
}
.theme-A8 .flog-wrap form{
    margin-top:68px;
}

@media (max-width: 1080px){
    .theme-A8 .flog-tit .pic {
        background-size: 300px 64px;
    }

    .theme-A8 .flog-tit .logo-txt img {
        width: 300px;
    }

    .theme-A8 .flog-wrap form {
        margin-top: 18px;
    }

    .theme-A8 .flog-cont {
        width: 280px;
    }
}
/*end A8 theme*/