body, html {
	position: relative;
	margin:0 auto;
	max-width: 600px;
	height: 100%;
	font-size:16px;
}
a { color: #000; }

.show { display:block; }
.hide { display:none; }
.float-left { float:left; }
.float-right { float:right; }
.float-clear { clear:both; }
.text-left { text-align:left; }
.text-right { text-align:right; }
.text-center { text-align:center; }

.flex-left, .flex-right, .flex-between, .flex-center {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.flex-right { justify-content: flex-end; }
.flex-between { justify-content: space-between; }
.flex-center { justify-content: center; }
.overflow-hidden { overflow: hidden; }

.mt5 { margin-top: 5px; }
.mb5 { margin-bottom: 5px; }
.mt10 { margin-top: 10px; }
.mb10 { margin-bottom: 10px; }
.mt15 { margin-top: 15px; }
.mb15 { margin-bottom: 15px; }
.mt20 { margin-top: 20px; }
.mb20 { margin-bottom: 20px; }
.mt30 { margin-top: 30px; }
.mb30 { margin-bottom: 30px; }

.border-top-1px, .border-bottom-1px { position:relative; }
.border-top-1px:before{content:" ";position:absolute;left:0;top:0;right:0;height:1px;border-top:1px solid #e3e3e3;color:#c0bfc4;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}
.border-bottom-1px:after{content:" ";position:absolute;left:0;bottom:-1px;right:0;height:1px;border-bottom:1px solid #e3e3e3;color:#c0bfc4;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}

.main {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* home */
.home .header {
    position: relative;
    padding: 15px;
    color: #ffffff;
    text-align: center;
    background-color: #56b4a2;
    z-index: 2;
}
.home .header .title {
	margin: 15px 0;
	font-size: 40px;
	font-weight: 800;
}
.home .header .title img {
	position: relative;
	top: 10px;
	margin:0 10px 0 0;
	width: 55px;
	height: auto;
}
.home .header .desc {
	margin-bottom: 5px;
	height: 105px;
	font-size: 22px;
	font-weight: 500;
	line-height: 35px;
	overflow: auto;
	background-color: #56b4a2;
	position: relative;
	z-index: 3;
}
.home .header .bottom {
	position: absolute;
	left: 0;
	bottom: -25px;
	width: 100%;
	height: 50px;
	background-color: #56b4a2;
	border-radius: 50%;
	z-index: 1;
}
.home .body {
	position: relative;
    flex-direction: column;
	margin-top: 25px;
    height: calc(100% - 320px);
    z-index: 3;
}
.home .body .btn {
	display: inline-block;
	padding: 20px;
	text-align: center;
}
.home .body .btn .btn-icon img {
  width: 80px;
  height: auto;
}
.home .body .btn .btn-block,
.home .body .btn .btn-test {
	/*display: inline-block;*/
	width: 128px;
	height: 40px;
	line-height: 40px;
	color: #137964;
	font-size: 18px;
	text-align: center;
	border: 4px solid #137964;
	border-radius: 30px;
}
.home .body .btn .btn-female,
.home .body .edit-female .btn .btn-block {
	color: #eb2d52;
	border-color: #eb2d52;
}
.home .body .btn .birth {
	width: 100%;
	height: 36px;
	color: #137964;
	font-size: 18px;
	border: none;
	background-color: transparent;
	text-align: center;
}
.home .body .btn .btn-block .birth::-webkit-input-placeholder {
	color: #137964;
}
.home .body .edit-female .btn .btn-block .birth,
.home .body .edit-female .btn .btn-block .birth::-webkit-input-placeholder {
	color: #eb2d52;
}




/*2022年1月10日 10:27:48*/
.home .body .btn .realname {
	width: 100%;
	height: 36px;
	color: #137964;
	font-size: 18px;
	border: none;
	background-color: transparent;
	text-align: center;
}
.home .body .btn .btn-block .realname::-webkit-input-placeholder {
	color: #137964;
}
.home .body .edit-female .btn .btn-block .realname,
.home .body .edit-female .btn .btn-block .realname::-webkit-input-placeholder {
	color: #eb2d52;
}
.home .body .btn .mobile {
	width: 100%;
	height: 36px;
	color: #137964;
	font-size: 18px;
	border: none;
	background-color: transparent;
	text-align: center;
}
.home .body .btn .btn-block .mobile::-webkit-input-placeholder {
	color: #137964;
}
.home .body .edit-female .btn .btn-block .mobile,
.home .body .edit-female .btn .btn-block .mobile::-webkit-input-placeholder {
	color: #eb2d52;
}







.home .body .btn .btn-test {
	color: #ffffff;
	background-color: #137964;
}
.home .body .edit-female .btn .btn-test {
	border-color: #eb2d52;
	background-color: #eb2d52;
}
.home .body .btn .btn-divier {
	height: 13px;
}
.home .footer {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 5px;
	text-align: center;
}
.home .footer span {
	display: inline-block;
	padding: 5px 10px;
}
.home .footer span.manage {
	position: absolute;
	left: 3px;
	bottom: -3px;
	color: #999;
	font-size: 18px;
	text-decoration: underline;
}
.home .footer span.copyright {
	color: #999;
	font-size: 14px;
	text-decoration: underline;
}
.home .copyright-content {
	padding: 15px;
}
.home .copyright-content .avatar {
	float: left;
	margin-right: 10px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	overflow: hidden;
}
.home .copyright-content .avatar img {
	width: 100%;
	height: auto;
}

/* quiz */
.quiz {
	background-color: #EEC591;
}
.quiz .header {
	padding: 15px;
    color: #333;
    font-size: 17px;
    background-color: #ffffff;
}
.quiz .header .high-light{
	font-weight: bold;
	font-size: 20px;
	color: #ee4c6c;
	margin: 0 5px;
}
.quiz .body {
	padding-bottom: 20px;
}
.quiz .body .list .left,
.quiz .body .list .right {
	position: relative;
    margin: 30px 0;
    min-height: 50px;
}
.quiz .body .list .icon {
	position: absolute;
	left: 10px;
	top: 0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #dddddd;
	overflow: hidden;
}
.quiz .body .list .icon img {
	width: 100%;
	height: auto;
}
.quiz .body .list .box {
	margin: 0 50px 0 75px;
}
.quiz .body .list .box .msg {
	position: relative;
	display: inline-block;
	padding: 10px 15px;
	color: #333333;
	font-size: 17px;
	border-radius: 15px;
	background-color: #ffffff;
	box-shadow: 0 0 6px rgba(0,0,0,.1);
}
.quiz .body .list .box .msg::after {
	content: ' ';
	display: block;
	clear: both;
}
.quiz .body .list .left::before,
.quiz .body .list .right::before, {
	position: absolute;
	left: 70px;
	top: 21px;
	content: ' ';
	width: 10px;
	height: 10px;
	background-color: #ffffff;
	transform:rotate(45deg);
}
.quiz .body .list .right::before {
	left: inherit;
	right: 70px;
}
.quiz .body .list .right .icon {
	left: inherit;
	right: 10px;
}
.quiz .body .list .right .box {
	margin: 0 75px 0 50px;
	text-align: right;
}
.quiz .body .list .right .box .msg {
	padding: 10px 0 0 10px;
	width: 200px;
	text-align: left;
}
.quiz .body .list .right .box .msg .btn-answer {
	float: left;
	margin: 0 10px 10px 0;
	padding: 10px 15px;
	width: 60px;
	font-size: 16px;
	text-align: center;
	border-radius: 12px;
	background-color: #f4f4f4;
}
.quiz .body .list .right .box .msg .btn-answer:active {
	background-color: #dddddd;
}
.quiz .body .list .right .box .msg .btn-answer-active,
.quiz .body .list .right .box .msg .btn-answer-active:active {
	color: #ffffff;
	background-color: #56b4a2;
}
.quiz .body .list .right .box .msg-female .btn-answer-active,
.quiz .body .list .right .box .msg-female .btn-answer-active:active {
	background-color: #ee4c6c;
}
.quiz .footer {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 15px;
	text-align: center;
}
.quiz .footer span {
	display: inline-block;
	padding: 4px 10px 5px 10px;
	color: #ffffff;
	font-size: 12px;
	border-radius: 12px;
	background-color: rgba(0,0,0,.4);
}

/* result */
.result .userinfo {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 15px 15px 0 15px;
}
.result .userinfo .avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: #f4f4f4;
	overflow: hidden;
}
.result .userinfo .avatar img {
    width: 100%;
    height: auto;
}
.result .userinfo .nickname {
    margin: 0 10px;
    max-width: 60%;
    color: #333333;
    font-size: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.result .userinfo .desc {
    color: #999999;
    font-size: 15px;
}
.result .divider {
	margin: 25px 15px -10px 15px;
	text-align: center;
	border-top: 1px solid #eeeeee;
}
.result .divider span {
    position: relative;
    border: 5px solid #ffffff;
    top: -17px;
    display: inline-block;
    padding: 3px 10px 4px 10px;
    color: #ffffff;
    font-size: 12px;
    border-radius: 15px;
    background-color: #56b4a2;
}
.result .diagnose .header {
    text-align: center;
}
.result .diagnose .header .title {
	color: #149382;
	font-size: 40px;
	font-weight: 800;
}
.result .diagnose .header .detail {
	margin: 10px 0;
	color: #149382;
	font-size: 20px;
}
.result .diagnose .header .subdetail {
	margin: 10px 0;
	color: #149382;
	font-size: 18px;
}
.result .diagnose .charts {
	margin: 0 15px 15px 15px;
}
.result .features {
	padding: 0 15px;
}
.result .features .detail {
    margin: 5px 0 5px 0;
    color: #828282;
    font-size: 15px;
}
.result .methods,
.result .foods,
.result .custom,
.result .qrcode {
    margin: 0 15px;
    padding: 10px 0;
    text-align: center;
}
.result .methods img,
.result .foods img,
.result .custom img,
.result .qrcode img {
    width: 100%;
    height: auto;
}
.result .qrcode img {
	width: 200px;
}
.result .footer {
	padding: 20px 0 40px 0;
	text-align: center;
}
.result .footer .btn-return {
    display: inline-block;
    padding: 0 20px;
    height: 40px;
    line-height: 40px;
    color: #ffffff;
    font-size: 28px;
    font-weight: 500;
    text-align: center;
    border-radius: 30px;
    background-color: #ee4c6c;
}
.result .footer .btn-return:active {
    background-color: #149382;
}
.result-female .divider span {
    background-color: #ee4c6c;
}
.result-female .diagnose .header .title,
.result-female .diagnose .header .detail,
.result-female .diagnose .header .subdetail {
	color: #eb2d52;
}
.result-female .footer .btn-return {
	background-color: #56b4a2;
}
.result-female .footer .btn-return:active {
	background-color: #be3d56;
}

/* manage-index */
.manage-index {
	padding-top: 82px;
}
.manage-index .summary {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 80px;
	border-bottom: 2px solid #eee;
	background-color: #ffffff;
}
.manage-index .summary .weui-flex__item {
	position: relative;
	flex-direction: column;
	padding: 15px 0;
	font-size: 12px;
}
.manage-index .summary .weui-flex__item::after {
	position: absolute;
	content: " ";
	right: 0;
	top: 50%;
	margin-top: -20px;
	width: 1px;
	height: 40px;
	border-right: 1px solid #f4f4f4;
}
.manage-index .summary .weui-flex__item:first-child:active {
	background-color: #eee;
}
.manage-index .summary .weui-flex__item:last-child::after {
	display: none;
}
.manage-index .summary .weui-flex__item .count {
	color: #000;
	font-size: 20px;
}
.manage-index .summary .weui-flex__item span:last-child {
	line-height: 20px;
}
.manage-index .summary a.weui-flex__item span:last-child {
	position: relative;
}
.manage-index .summary a.weui-flex__item span:last-child::after {
	position: absolute;
	content: " ";
	margin-top: -3px;
	right: -8px;
	top: 50%;
	width: 4px;
	height: 4px;
	border-top: 1px solid #333;
	border-right: 1px solid #333;
	-webkit-transform:rotate(45deg);
}
.manage-index .header {
	margin: 0 15px;
	padding: 5px;
	border-top: 1px solid #eeeeee;
	border-bottom: 1px solid #eeeeee;
	color: #333333;
	font-size: 14px;
	line-height: 20px;
	text-align: center;
}
.manage-index .charts {
	margin: 15px;
}
.manage-index .butter {
    padding: 20px 0 40px 0;
    text-align: center;
}
.manage-index .butter .btn-return {
	display: inline-block;
	padding: 0 20px;
	height: 40px;
	line-height: 40px;
	color: #ffffff;
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	border-radius: 30px;
	background-color: #56b4a2;
}
.manage-index .butter .btn-return:active {
	background-color: #149382;
}
.manage-index .charts-items {
	margin: 5px 0 0 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
.manage-index .charts-items li {
	display: inline-block;
	margin: 5px;
	font-size: 12px;
}
.manage-index .charts-items li i {
	display: inline-block;
	margin-right: 3px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
}

/* manage-family */
.manage-family {
	padding-top: 40px;
}
.manage-family .navbar {
    position: fixed;
    left: 0;
    top: 0;
    height: 40px;
    width: 100%;
    overflow: hidden;
    color: #333;
    font-size: 16px;
	line-height: 40px;
    text-align: center;
    border-bottom: 2px solid #f4f4f4;
    background-color: #fff;
    z-index: 9;
}
.manage-family .navbar a:active {
	background-color: #eee;
}
.manage-family .navbar .left {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	padding: 0 15px;
}
.manage-family .navbar .title {
	display: inline-block;
	padding: 0 15px;
	max-width: 60%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.manage-family .navbar .right {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	padding: 0 15px;
}
.manage-family .list .list-thead {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 15px 15px 5px 15px;
	background-color: #f4f4f4;
	font-size: 14px;
	color: #999;
}
.manage-family .list .list-thead div.user-edit {
	margin-right: 15px;
	width: 50px;
	text-align: center;
}
.manage-family .list .list-item {
	position: relative;
	margin-left: 15px;
	padding: 15px 15px 15px 0;
	min-height: 50px;
	border-bottom: 1px solid #f4f4f4;
}
.manage-family .list .list-item .avatar {
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #f4f4f4;
	overflow: hidden;
	z-index: 1;
}
.manage-family .list .list-item .avatar img {
	width: 100%;
	height: auto;
}
.manage-family .list .list-item .info {
	padding: 0 5px 0 65px;
}
.manage-family .list .list-item .info .name {
	color: #333;
	font-size: 16px;
	min-height: 24px;
	line-height: 24px;
}
.manage-family .list .list-item .info .desc {
	margin-top: 10px;
}
.manage-family .list .list-item .info .desc span {
	margin-right: 8px;
	color: #aaa;
	font-size: 14px;
}
.manage-family .list .list-footer {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 80px;
}
.manage-family .list .list-footer span {
	color: #cccccc;
	font-size: 14px;
}

/* manage-user-chart */
.manage-user-chart .header {
	margin: 15px;
	padding: 10px;
	border: 1px solid #eeeeee;
	border-radius: 3px;
	color: #333333;
	font-size: 14px;
	line-height: 25px;
}
.manage-user-chart .charts {
	margin: 0 15px 15px 15px;
}
.manage-user-chart .list .list-item {
	margin: 20px 0;
}
.manage-user-chart .list .list-item .title {
	padding: 5px 15px;
	color: #333333;
	font-size: 16px;
	font-weight: 700;
	line-height: 30px;
	border-bottom: 1px solid #eee;
}
.manage-user-chart .list .list-item .list-item-sub {
	padding: 15px 15px 0 15px;
}
.manage-user-chart .list .list-item .list-item-sub .question,
.manage-user-chart .list .list-item .list-item-sub .answer {
	float: left;
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	color: #ffffff;
	font-size: 14px;
	border-radius: 50%;
	background-color: #2c88f7;
}
.manage-user-chart .list .list-item .list-item-sub .answer {
  background-color: #56b4a2;
}
.manage-user-chart .list .list-item .list-item-sub .text {
	padding-left: 30px;
	color: #555555;
	font-size: 14px;
	line-height: 25px;
}
.manage-user-chart .list .list-item .list-item-sub .divider {
	height: 15px;
	clear: both;
}
.manage-user-chart .list .list-item .list-item-sub::after {
	display: block;
	content: ' ';
	clear: both;
}
.manage-user-chart .list .list-item .list-item-sub .rate {
	color: #f5a623;
}

/* manage-user-edit */
.manage-user-edit {
	background-color: #f4f4f4;
}
.manage-user-edit .result .userinfo{
 	justify-content: flex-start;
 }

 #WXCover {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	display: none;
	z-index: 20000;
}

#WXCover img {
	position: fixed;
	right: 18px;
	top: 5px;
	width: 260px;
	height: 180px;
	z-index: 20001;
}
