@charset "euc-kr";


.screenOut { display:block; position:absolute;left:-9999px;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999px;}
.needInput { font-size: 30px; font-family: "µ¸¿ò",dotum; line-height: 160%; text-align: center; height: 45px; padding: 0; color: #fff; font-weight: bold; border: 1px solid #fed4f1;}
.bgCol1 { background: #767676;}
//.bgCol2 { background: #fa9754;}
.needCf { color: #666; padding: 8px 0 5px 0;}
.needL { font-size: 20px; color: #000; margin-bottom: 30px; }
.needS { font-size: 14px; color: #000; line-height: 160%;}
.needCheck { display: inline-block; margin: 0 0 0 3px; vertical-align: text-bottom; width: 12px; height: 12px; background: #fff url('/img/theme/need/btn_checkbox.gif') 0 0 no-repeat; }
	.needCheck.on { background-position: 0 -80px;}





.needTop, .needCon, .needBtm { width: 750px; height:80px; font-family: "µ¸¿ò",dotum;}

.needTop { position:relative; height: 64px; margin-top: 0px; background: url('/img/theme/need/needTit.jpg') no-repeat;}
	.needTop .step { position:absolute; right: 0;}
	.needTop .step span { display: block; float: left; width: 46px; height: 64px; background: url('/img/theme/need/bg_step.jpg') 0 0 no-repeat;}
	.needTop .step span.on { width: 56px;}
	#tStep1 {background-position: 0 0;}
	#tStep2 {background-position: -46px 0;}
	#tStep3 {background-position: -92px 0;}
	#tStep4 {background-position: -138px 0;}
	#tStep5 {background-position: -184px 0; width: 66px;}


	#tStep1.on {background-position: 0px -64px;}
	#tStep2.on {background-position: -56px -64px; }
	#tStep3.on {background-position: -112px -64px;}
	#tStep4.on {background-position: -168px -64px; }
	#tStep5.on {background-position: -224px -64px; width: 105px; }


/* º»¹® ÁøÇà */
.needCon { position: relative; margin-bottom: 20px; height: 633px;}
	.needCon.birth { background: url('/img/theme/need/bg_step1.jpg') no-repeat;}
	.needCon.result { background: url('/img/theme/need/bg_step5.jpg') no-repeat;}
	.needCon.result2 { background: url('/img/theme/need/bg_step5_2.jpg') no-repeat;}
	.needCon.result3 { background: url('/img/theme/need/bg_step5_3.jpg') no-repeat;}
	.needCon .birthday { position: absolute; top: 323px; left: 266px;}
	.needCon .insuAge { position: absolute; top: 418px; left: 266px;}

	.needCon .sex {}
	.needCon .sex li { float: left; }
	.needCon .sex li a { display: block;}
	#male {width: 378px; height: 633px;  background: url('/img/theme/need/bg_step21.jpg') no-repeat 0 0; }
	#female {width: 372px; height: 633px; background: url('/img/theme/need/bg_step22.jpg') no-repeat 0 0;}
	#male.on {background-position: -378px 0;}
	#female.on {background-position: -372px 0;}

	.insuAge .listage { width: 234px; height: 65px; background:url('/img/theme/need/bg_input2.jpg') right  0 no-repeat ;}
	.insuAge .listage a.ageBox { display: block; font-size: 34px; line-height:190%; color: #fff; padding-left: 50px; text-decoration: none;}
	
	.insuAge .selectage { position: absolute; top: -150px; left:0; width: 234px; background: #4a59a1;}
	.insuAge .selectage ul { background: #5fa7ed; margin: 5px;}
	.insuAge .selectage ul li { border-bottom: 1px solid #fff; text-align:center;}
	.insuAge .selectage ul li.last { border-bottom-color: #4a59a1;}
	.insuAge .selectage ul li a { display: block; padding: 10px 0; font-family: "µ¸¿ò",dotum; font-size: 20px; color: #fff; }
	.insuAge .selectage ul li a.on { background: #4a59a1;}

	/* °¡Á·¼±Åà */
	.needCon .selectFam { position: absolute; top: 150px; left: 95px;}
	.needCon .selectFam li { display: block; float: left; width: 50px; height: 50px; cursor: pointer;}
	.needCon .selectFam li a {display: block; width: 100%; height: 100%;}
	.needCon .selectFam li.single { position: absolute; left: 0;}
	.needCon .selectFam li.marry { position: absolute; left: 235px;}
	.needCon .selectFam li.family { position: absolute; left: 485px;}
	.needCon .fam { position: absolute; top: 0; left:0; width: 750px; height: 633px; background: url('/img/theme/need/bg_step3.jpg') no-repeat;}
		.needCon .fam.people1 { background-position: 0 0;}
		.needCon .fam.people2 { background-position: 0 -633px;}
		.needCon .fam.people3 { background-position: 0 -1266px;}
		.needCon .fam.people4 { background-position: 0 -1899px;}

	/* ±âÁ¸°¡ÀÔº¸Çè À¯¹« */
	.needCon .selectInsu { position: absolute; top: 165px; left: 194px;}
	.needCon .selectInsu li { display: block; float: left; width: 50px; height: 50px; cursor: pointer;}
	.needCon .selectInsu li a {display: block; width: 100%; height: 100%;}
	.needCon .selectInsu li.have { position: absolute; left: 0;}
	.needCon .selectInsu li.haveno { position: absolute; left: 270px;}
	.needCon .already { position: absolute; top: 0; left:0; width: 750px; height: 633px; background: url('/img/theme/need/bg_step4.jpg') no-repeat; z-index: -1;}
		.needCon .already.have1 { background-position: 0 0;}
		.needCon .already.have2 { background-position: 0 -633px;}
		.needCon .already.have3 { background-position: 0 -1266px;}
	.needCon .insuList { z-index: 10;}

	.tblinsulist { position: absolute; top: 410px; left: 25px; border:0; border-collapse:collapse; table-layout:fixed;}
		.tblinsulist td { border: 1px solid #647b8a; border-top: none; border-left: none; width: 174px; height: 62px; font-size: 16px; line-height: 18px; color: #000; vertical-align: middle; background: #fff url('/img/theme/need/btn_checkbox.gif') no-repeat 20px 23px; cursor: pointer;}
		.tblinsulist td strong { display: inline-block; width: 110px; margin-left: 45px;}
		.tblinsulist td.on { background-position: 20px -57px;}

	/* °á°ú */

	.needCon .resText { margin-left: 35px;}
	.needCon .resText { width: 680px; height: 150px; padding: 40px 0 0 0;}
		.needCon .resText .resuS { font-size: 20px; color: #fff; margin-bottom: 30px; line-height: 28px; }
		.needCon .resText .resuC { font-size: 14px; color: #000; line-height: 160%;}
	.needCon .goodList { padding-top: 40px; text-align: center;}
		.needCon .goodList .listWarp { display: inline-block; margin: 0 auto; text-align: center;}
		.needCon .goodList .listWarp .goodDetail { position: relative; display: inline-block; width: 218px; margin: 0 4px; height: 330px; background: #fff url('/img/theme/need/bg_good.jpg') center 0 no-repeat;}

	.needCon .nThanks { position: absolute; top: 390px; left: 150px; width: 460px; text-align: center; line-height:200%;}

	.goodDetail p { position: absolute; width: 160px; left: 30px;}
	.goodDetail p.copy1 { top: 25px; font-size: 12px; color: #718a9e; line-height: 140%; letter-spacing: -0.08em;}
	.goodDetail p.copy2 { top: 67px; font-size: 20px; color: #000; line-height: 24px;}
	.goodDetail p.goodLogo { top: 167px;}
	.goodDetail p.goodName { top: 205px; font-size: 14px; line-height: 140%;}
	.goodDetail p.goodBtn { top: 270px;}

	.needCon .inputCon { position: absolute; top: 320px; left: 100px;}
		.tblinput { width: 534px;}
		.tblinput th, .tblinput td { vertical-align: top; font-family: "µ¸¿ò",dotum;}
		.tblinput td { padding-bottom: 6px; #padding-bottom: 4px}
		.tblinput tr { padding: 2px 0;}
		.tblinput th { font-size: 18px; background: none; text-align: left; padding-top: 11px;}
		.tblinput td input { background: #eee; height: 45px; border: hidden; padding-left: 15px; font-size: 20px; line-height: 210%; font-weight: bold;  font-family: "µ¸¿ò",dotum; border: 1px solid #eee;}

		.tblinput td .inputCall { position: relative; height: 45px; z-index: 100;}
		.tblinput td .inputCall.type2 { z-index:10;}
			.inputCall .nphone1, .inputCall .nphone2, .inputCall .nphone3 { float: left;}
			.inputCall .nphone1 { width: 114px; height: 45px; #margin-top: 1px; margin-right: 6px; #margin-right: 6px;background: #eee url('/img/theme/need/bg_input.jpg') 80px 15px no-repeat ;}
			.inputCall .nphone1 a.phoneBox { display: block; font-size: 22px; line-height: 200%; color: #000; padding-left: 15px; text-decoration: none;}
			.inputCall .nphone2 { margin-right: 6px; #margin-right: 3px;}
			.inputCall .nphone3 { #margin-top: 1px;}

			.inputCall .selectNum { position: absolute; top: 45px; left:0; width: 114px; height: 100px; }
				.inputCall .selectNum ul {}
				.inputCall .selectNum ul li {  border-top: 1px solid #fff; background: #eee;}
				.inputCall .selectNum ul li a { display: block; width: 114px; height: 45px; text-decoration: none; font-size: 20px; color: #000;}
				.inputCall .selectNum ul li a strong { display: block; padding: 15px 0 0 15px; }

			.inputCon .btnCon {position: absolute; top: 255px; left: 220px; background: yellow;}




.needBtm { position: relative;}
	.needBtm a { position: absolute; display: block;}
	.needBtm a.refresh { top: 6px;}
	.needBtm a.pre { top: 6px; left: 220px; }
	.needBtm a.pre.alone { top: 6px; #margin-left: 50px; left: 300px;}
	.needBtm a.next { left: 380px;}
	.needBtm a.next.alone { left: 250px;}