:root{
	--white-color : #fff;
	--blue-color: #f1f1f1;
	--border-radius : 6px;
	--margin-bottom : 20px;
}
body{
	margin: 0px;
	background: #e6fbff;
}
.chaxuncontainer{
	position: relative;
	width: 100%;
	margin: 0px auto;
	padding: 60px 0px;
	align-items: center;
	justify-content: center;
	background:url(../images/chaxunbg.png) no-repeat top center #fff;
	background-size:100% 100%;
}
.chaxuncontainer .logo{margin:30px auto;text-align:center;}
.chaxuncontainer .logo img{max-width:90%;}
.inner_container{
	position: relative;
	max-width: 455px;
	width: 100%;
	background: #fff;
	padding: 20px 27px;
	border-radius: var(--border-radius);
	box-sizing: border-box;
	margin: 0 auto;
}
.heading_part{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--margin-bottom);
	border-bottom: 1px solid #ddd;
	padding-bottom:20px;
}
.inner_container .lable{color:#333;margin-bottom:20px;font-weight:bold;line-height:2;}
h2{
	position: relative;
	color: #000;
	margin: 0px;
	font-size: 25px;
}
.age_frm{
	position: relative;
 	margin-bottom: var(--margin-bottom);
	display:flex;
}
label{
	position: relative;
	color:#000;
	font-size: 18px;
	text-align:right;
	padding:8px 15px 8px 0;
	box-sizing:border-box;
	display: block;
	width:25%;
}
.age_fld{
	position: relative;
	width:70%;
	padding: 8px;
	box-sizing: border-box;
	outline: none;
	border-radius: var(--border-radius);
	border: 0px;
	background:var(--blue-color);
	color: #333；;
}
.age_fld:hover{
	border:1px solid var(--white-color);
}

.months{
	max-width: 60%;
}
.error{
	position: relative;
	color: red;
	font-size: 12px;
	margin-top: 2px;
	display:none;
	width:5%;
}
.error.active{
	display: block;
}
.buttons{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin:30px auto;
}
.btn{
	position: relative;
	max-width: 60%;
	width: 100%;
	padding: 7px;
	outline: none;
	border-radius: 6px;
	font-size: 17px;
	font-weight: bolder;
	border: 0px;
	color: #000;
	margin-right: 15px;
	cursor: pointer;
}
.btn_primary{
	background: #EEB5D3;
}
.btn_secondary{
	background: #56DAD2;
}
.btn:last-child{
	margin-right: 0px;
}
.result{
	position: relative;
	max-width: 100%;
	width: 100%;
	margin: 30px auto;
}
.res_sec{
	position: relative;
	max-width: 100%;
	width: 100%;
	padding: 15px 20px;
	background: #b1dfe8;
	border-radius: 6px;
	margin: 0px auto;
	box-sizing: border-box;
}.res_sec .intro{margin:10px auto;border-bottom:1px solid #fff;}
.res_sec p{
	position: relative;
	margin: 0px auto;
	font-size: 20px;height:40px;line-height:40px;
	text-align: center;color:#333;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #fff;
	
}.res_sec p .i1{float:left;width:24%;text-align:right;margin-left:5%;margin-right:5%;text-align-last:justify;}.res_sec p .i2{float:left;width:65%;text-align:center;border-left:1px solid #fff;box-sizing:border-box;}
.current_age{
	text-align: center;
	margin: 10px auto;
}
.current_age h3{
	position: relative;
	margin: 0px;
	font-size: 20px;
	margin-right: 9px;
	color: #000;
}
.current_age span{
	position: relative;
	display: block;
	font-size: 24px;
	color: #f00;
}
@media(max-width:760px){
.inner_container{max-width:90%;}.res_sec p .i1{width:30%;}
}
@media(max-width:505px){
	
	h2{
		font-size: 20px;
	}
	.age_fld{
		max-width: 100%;
	}
	label{
		font-size: 15px;
		margin-bottom: 10px;
	}
	.age_frm{
		margin-bottom: 20px;
	}
	.btn{
		font-size: 15px;
	}
	.res_sec p{
		font-size: 16px;
	}.res_sec p .i1{width:30%;}
	.current_age{
		position: relative;
		display: block;
	}
	.current_age h3{
		font-size: 18px;
	}
	.current_age span{
		font-size: 18px;
	}
} 
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
      -webkit-appearance: none;
  }
  input[type="number"] {
      -moz-appearance: textfield;
  }
  inpit {
      border: none
  }