/*
 * 20201230 비대면 바우처 추가
 * 
 */

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.contentWrap{position:relative;width:100%; text-align:center;  }
.mypageWrap {position:relative; width:90%; max-width:1145px; margin:0 auto; display:inline-block;margin-bottom:80px; }

.blackArea												{ position:fixed; width:100%; height:100%; background:url(../image/black80.png); z-index:9999; left:0px; top:0px; opacity:0; overflow-y:scroll; text-align:center;}

.loginWrap														{ left: 50%; margin-left: -362px;position:relative; width:90%; max-width:725px; margin-top:40px; background:#fff; display:inline-block; zoom:1; *display:inline; font-family:Nanum Square, sans-serif; letter-spacing: -2px; } /* 190909 max-width:525px;에서 수정 (세정) */
.loginWrap .title												{ position:relative; display:inline-block; zoom:1; *display:inline; width:100%; padding:10px 0px 0 0; text-align:center;}
.loginWrap .title span											{ display:inline-block; zoom:1; *display:inline;  font-size:18px; margin-top:40px;text-align:center; color:#717071; font-family: 'NanumSquare', sans-serif;letter-spacing:0; }

.loginWrap .contWrap											{ position:relative; width:450px; padding:10px 0px; margin:0 auto; }
.loginWrap .contWrap .item										{ position:relative; width:100%; margin:0px 0px 16px 0px; display:inline-block; zoom:1; *display:inline; }
.loginWrap .contWrap .item input								{ width:100%; border:1px solid #717071;; box-sizing:border-box; height:47px; line-height:47px; font-size:16px; padding:0px 0px 0px 10px }


.loginWrap .contWrap .etcBtn									{position:relative;margin-top:10px;}
.loginWrap .contWrap .etcBtn .floatRight						{float:right}
.loginWrap .contWrap .login_btn									 {width:201px;height:60px; background:url(../image/login/login_btn_on.png) center no-repeat; border:0px; float:left;}
.loginWrap .contWrap .login_btn:hover								{ background:url(../image/login/login_btn_hover.png) center no-repeat; cursor:pointer;}
.loginWrap .contWrap .reg_btn									 {width:201px;height:60px; background:url(../image/login/reg_btn_on.png) center no-repeat; border:0px;}
.loginWrap .contWrap .reg_btn:hover								{ background:url(../image/login/reg_btn_hover.png) center no-repeat; cursor:pointer;}

.mypageWrap.easyJoinMember .orderInfoInputWrap
.mypageWrap.easyJoinMember .orderInfoInputWrap .title						{font-size:22px;text-align:center;}
.mypageWrap.easyJoinMember .orderInfoInputWrap .container .item				{width:80%;float:none;margin:0 auto;display:block;margin-bottom:20px;}
.mypageWrap.easyJoinMember .orderInfoInputWrap .container .item	.id_note		{font-size:13px; text-align:right;display:block;margin-top:5px;}
.mypageWrap.easyJoinMember .easyJoinStep									{padding:0;margin:0px 0px 20px 0;}
.mypageWrap.easyJoinMember .agreeWrap .agreeArea							{text-align:right;}
.mypageWrap.easyJoinMember .agreeArea_center						{text-align:center;margin:10px;}
.mypageWrap.easyJoinMember .easyJoinBtn										{width:180px; height:45px;}


.agreeWrap																	{ position:relative; width:100%; margin:45px 0px 80px 0px; }
.agreeWrap.twoView															{ width: 47%; margin: 0 1%; display:inline-block; zoom:1; *display:inline;}
.agreeWrap .titleArea														{ position:relative; width:100%; display:inline-block; zoom:1; *display:inline; text-align:left; }
.agreeWrap .titleArea .title												{ display:inline-block; zoom:1; *display:inline; width:100%; font-size:24px; color:#2a2a2a; }
.agreeWrap .titleArea .subTitle												{ display:inline-block; zoom:1; *display:inline; width:100%; font-size:16px; color:#a2a2a2; letter-spacing: 0;}
.agreeWrap textarea															{ width:100%; height:150px; border:0px; padding:30px 0px; font-size:14px; color:#3E3A39; margin:10px 0px 5px 0; box-shadow:none !important; line-height:180%; border-top:2px solid #6cc2fd; border-bottom:1px solid #B8B8B8;overflow-x:hidden;}
.agreeWrap .agreeArea input													{ width:15px; height:15px; box-shadow:none !important; position:relative;top:3px; }
.agreeWrap .agreeArea														{ position:relative; width:100%; text-align:left; font-size:14px; color:#3E3A39}

.btnArea.joinStep1 															{text-align:center;}
.next_btn 																	{width:183px;height:54px;background:url(../image/login/next_btn.png) center no-repeat;display: inline-block;}
.home_btn 																	{width:183px;height:54px;background:url(../image/login/home_btn.png) center no-repeat;display: inline-block;margin-right:190px;}

.joinStep2,
.joinStep3																	{ display:none; padding:40px 0px 40px 0px; margin:0px; }

.orderInfoInputWrap															{ position:relative; width:100%; margin:00px auto 25px; }
.orderInfoInputWrap .title													{ display:inline-block; zoom:1; *display:inline; width:100%; text-align:left; font-size:22px; color:#2a2a2a; margin:0px 0px 30px 0px; }
.orderInfoInputWrap .title .orderInfoSame									{ position:absolute; left:140px; top:-3px; padding:5px 10px; font-size:12px; background:#fff; color:#000; border:2px solid #000; }
.orderInfoInputWrap .title .orderInfoSame:hover								{ background:#000; border:2px solid #000; color:#fff; }
.orderInfoInputWrap .container												{ position:relative; width:100%; text-align:left; display:inline-block; zoom:1; *display:inline; }
.orderInfoInputWrap .container .item										{ position:relative; width:48%; max-width:460px;text-align:left; display:inline-block; zoom:1; *display:inline; float:left; margin:0px 0px 50px 0px; }
.orderInfoInputWrap .container .item:nth-of-type(2n)						{ float:right; }
.orderInfoInputWrap .container .item strong									{ position:relative; width:100%; display:inline-block; zoom:1; *display:inline; text-align:left; font-weight:normal; font-size:16px; margin:0px 0px 5px 0px; }
.orderInfoInputWrap .container .item input[type=text],
.orderInfoInputWrap .container .item input[type=password]					{ width:100%; height:50px; line-height:50px;/*  background:#f9f9f9; */ border:0px; border:1px solid #cacaca; box-sizing:border-box; padding:0px 20px 0px 50px; font-size:16px; border-radius:5px; }
.orderInfoInputWrap .container .item textarea								{ width:100%; height:100px; background:#f9f9f9; box-sizing:border-box; padding:20px; font-size:14px; border-radius:2px;  -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; -o-transition: all 0.15s ease-out; transition: all 0.15s ease-out; }
.orderInfoInputWrap .container .item i										{ position:absolute; left:5px; top:30px; width:40px; height:40px; line-height:40px; font-size:25px; color:#b7d9f1; text-align:center; }
.orderInfoInputWrap .container .item .zipSrc								{ position:absolute; right:10px; top:34px; padding:5px 10px; background:#747474; color:#fff; display:inline-block; zoom:1; *display:inline; border-radius:3px; font-size:16px;}
.orderInfoInputWrap .container .item .radioWrap								{ position:relative; width:100%; height:40px; line-height:40px; }
.orderInfoInputWrap .container .item .radioWrap input[type="radio"]			{ position:absolute; left:-9999px; top:0px; }
.orderInfoInputWrap .container .item .radioWrap label						{ position:relative; float:left; width:50%; height:40px; font-size:14px; line-height:40px; text-align:center; border:1px solid #ddd; display:inline-block; zoom:1; *display:inline; box-sizing:border-box; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; -o-transition: all 0.15s ease-out; transition: all 0.15s ease-out;}
.orderInfoInputWrap .container .item .radioWrap input:checked + label		{ background:#4d4b48; border:1px solid #4d4b48; color:#fff; }
.orderInfoInputWrap .container .item .radioWrap label:nth-of-type(1)		{ border-radius:5px 0px 0px 5px; }
.orderInfoInputWrap .container .item .radioWrap label:nth-of-type(2)		{ border-radius:0px 5px 5px 0px; }
.orderInfoInputWrap .container .item select									{ width:100%; height:50px; line-height:50px; font-size:1em; }
.orderInfoInputWrap .container .fullsize									{ width:100%; }
.orderInfoInputWrap .container .item textarea								{ border-radius:5px !important; }


.p_div{ width:100%; height:50px; line-height:50px;/*  background:#f9f9f9; */ border:0px; border:1px solid #cacaca; box-sizing:border-box; padding:0px 0px 0px 50px; font-size:16px; border-radius:5px; }
.p_input {width:20%; height:81%; border:1px  solid #ddd; margin:0 5px; text-align:center;  font-family:Nanum Square; font-size:16px;}
.sc_input {width:20%; height:81%; border:1px  solid #ddd; margin-left:5px; text-align:left;  font-family:Nanum Square;padding-left:8px;}
.p_text { position: absolute; right: 0px;  top: 0px; color: red;  font-family:Nanum Square;}
.check_phone {position:absolute; right:10px; top:34px; padding:5px 10px; background:#000; color:#fff; display:inline-block; zoom:1; *display:inline; border-radius:3px; cursor:pointer;  font-family:Nanum Square;}
.reg_fin_btn { width:183px;height:54px; background:url(../image/login/reg_fin_btn.png) center no-repeat; display:inline-block;}


.alertWrap												{ position:fixed; _position:absolute; left:50%; top:0px; border:2px solid #2f2f2f; z-index:9; background:#fff; padding:0px 0px 30px 0px; opacity:0;font-family:Nanum Square; }
.alertWrap .title										{ display:inline-block; zoom:1; *display:inline; width:96%; height:33px; line-height:33px; font-size:14px; background:#D2E7F4; color:#000000; padding:0 2%; text-align:left;}
.alertWrap .title i										{ position:absolute; right:-17px; top:-17px; border:2px solid #000; width:30px; height:30px; line-height:30px; text-align:center; background:#fff; color:#000; border-radius:99px; cursor:pointer; }

.alertWrap .contText									{ display:inline-block; zoom:1; *display:inline; margin:20px 0px; font-size:17px; width:100%; }
.alertWrap .btnArea										{ display:inline-block; zoom:1; *display:inline; width:100%; }
.alertWrap .btnArea a									{ display:inline-block; zoom:1; *display:inline; font-size:15px;  margin:10px 15px; }
.alertWrap .alertCont									{ position:relative; width:100%; display:inline-block; zoom:1; *display:inline; }
.alertWrap .inputArea									{ position:relative; display:inline-block; zoom:1; *display:inline; width:300px; border:1px solid #b0b0b0;margin:30px}
.alertWrap .inputArea input								{ height:41px; line-height:41px; border:none;width:100%;padding:0 85px 0 15px;font-size:16px;}
.alertWrap .inputArea button							{ height:30px; width: 65px; background:#747474; color:#fff;border:0px;margin-left:7px;margin-right:8px;position:absolute;top:5px;right:0px;border-radius:3px;}
.alertWrap .messageArea									{ position:relative; width:100%; text-align:center; font-size:13px; margin:10px 0px; }

.joinComplete											{ position:relative; width:70%; padding:100px; margin:0 auto; }
.joinComplete i											{ font-size:120px; margin:50px 0px 0px 0px; color: #369CFD;}
.joinComplete span										{ display:inline-block; zoom:1; *display:inline; width:100%; }
.joinComplete .cont1									{ font-size:24px; margin:40px 0px 10px 0px; }
.joinComplete .cont2									{ font-size:24px; margin:20px 0px 10px 0px; }
.go_login_btn											{ width:184px; height:55px; background:url(../image/login/go_login_btn.png)center no-repeat;display: inline-block;}

.page_1_btn {
	width: 376px;
	height: 120px;
	background: url("../voucher_guide/image/btn_1_1_72.png") center no-repeat;
	margin: 50px auto 0px auto;
	cursor: pointer;
}

.page_1_btn.on {
	background: url("../voucher_guide/image/btn_1_2_72.png") center no-repeat;
}

.page_2_btn {
	width: 376px;
	height: 120px;
	background: url("../voucher_guide/image/btn_2_1_72.png") center no-repeat;
	margin: 30px auto;
	cursor: pointer;
}

.page_2_btn.on {
	background: url("../voucher_guide/image/btn_2_2_72.png") center no-repeat;
}


/* 웹 반응형 */
@media (max-width: 800px) {
	.page_1_btn {
		margin: 50px auto;
	}

	.page_2_btn {
		margin: 80px auto;
	}
}