#log_in{
	width: 100vw;	/* w728 h410 */
	height: 56.25vw;
	box-sizing:border-box;
	-moz-box-sizing:border-box; /* Firefox */
	-webkit-box-sizing:border-box; /* Safari */
	font-family: katong;
	position: relative;
}

#log_in.hide{
	display: none;
}
.sign_in{
	position: absolute;
	z-index: 999;
	width: 100%;
	height: 100%;
	background-image: url("/static/app/images/ui/login_background.png");
	background-repeat: no-repeat;
	background-size: 100% 100%; /* contain  自适应   100% 适合移动端*/
	-moz-background-size: 100% 100%;
	-webkit-box-sizing: 100% 100%;
	display: block;
}
#mask{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 998;
	background: rgba(146,146,146,.5);
}
.sign_in #cancelBtn{
	background-image: url(/static/app/images/ui/login_close.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	width:5vw;
	height:5vw;
	position: absolute;
	top: 7.2%;
	left: 90.2%;
}
.sign_in #sureBtn{
	background-image: url("/static/app/images/ui/sure.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	width: 34vw;
	height: 10vw;
	position: absolute;
	left:30vw;
	top: 42.8vw;
}
#formSex{
	text-align: center;
	position: absolute;
	top: 24%;
	left: 0;
	color: rgba(130,98,5,1);
	width: 100%;
}

#formSex .boy,.girl{
	float: left;
	position: relative;
	width: 22vw;

}
#formSex .boy{
	margin-left: 22vw;
}
#formSex .girl{
	margin-left: 10vw;
}
#formSex label{
	display: block;
	height:10vw;
	line-height: 10vw;
	text-align: right;
	cursor: pointer;
}
#formSex input{
	position: absolute;
	top: 3.8vw;
	left: 1.8vw;
	bottom:0;
	opacity: 0;
	display: block;
	width: 3.5vw;
	height: 3.5vw;
	cursor: pointer;
	z-index:888;
}
#formSex span{
	position: absolute;
	top: 3.5vw;
	left: 1.5vw;
	bottom:0;
	display: block;
	width:4vw;
	height:4vw;
	border:2px solid rgba(144,144,144,1);
	border-radius: 50%;
	cursor: pointer;
	box-sizing: border-box;
}


#formSex span.active{
	background-color: #000;
}
#age{
	width: 100vw;
	height: 16.5%;
	position: absolute;
	top: 50%;
	left: 0;
}

#age #ageWrap{
	background-image: url("/static/app/images/ui/age.png");
	width:  40vw;
	height: 100%;
	background-size: 100% 100%;
	display: inline-block;
	float: left;
	position: absolute;
	margin-left: 2vw;

}
#ageWrap #myAge{
	background-image: url("/static/app/images/ui/pointRed.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	width: 28%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
#myAge.textStyle{
	color: rgba(255, 246, 182 ,1);
	text-align: left;
	height:100%;
	line-height:95%;
	font-weight: normal;
	vertical-align: middle;
	text-indent: 3.5vw;
	/*font-size: .7rem;*/
}
#age .ageText{
	color: rgba(130,98,5,1);
	display: inline-block;
	float: left;
	height: 100%;
	margin-left: 21vw;
}
@font-face {
     font-family: katong;
     src: url("/static/app/fonts/PCfonts.eot");/* IE9 */
     src: url("/static/app/fonts/PCfonts.woff") format("woff"), /*  chrome、firefox  */
              url("/static/app/fonts/PCfonts.ttf") format("truetype"); /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */
     font-weight: normal;
     font-style: normal;
}
html{font-size: 26px}
@media screen and (min-width:321px) and (max-width:375px){html{font-size:28px}}
@media screen and (min-width:376px) and (max-width:414px){html{font-size:32px}}
@media screen and (min-width:415px) and (max-width:639px){html{font-size:42px}}
@media screen and (min-width:640px) and (max-width:719px){html{font-size:52px}}
@media screen and (min-width:720px) and (max-width:749px){html{font-size:56px}}
@media screen and (min-width:750px) and (max-width:799px){html{font-size:60px}}
@media screen and (min-width:800px){html{font-size:80px}}

blockquote,body,em,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul,html
{
	margin:0;padding:0;
	}
body{
	overflow-x: hidden;
	overflow-y: hidden;
	font-family: katong;
}
ul,li{
	list-style: none;
}

a{
	color:inherit;
	text-decoration: none;
}

img{
	border: none;
}
i,h4{
	font-style: normal;
}
input, button {
	display: inline;
	outline: none;
	border: none;
}
