@charset "utf-8";

/** 반응형 회원관리 설정 **/

/* 로그인 모바일 설정 */
.wrapLogin {
	position: relative;
	margin-bottom:150px;
}
.boxLogin {
	padding: 10%;
	border: 1px solid #dadada;
	background: #fff;
}
.txtLoginDesc {
	display: none;
}
.titleLogin { /* 로그인 박스 타이틀 */
	color: #f08200;
	font-size: 1.2em;
}
.boxLoginInput {
	margin-top: 20px;
}
.InputWrap label {
	display: none;
}
.InputWrap > div {
	width: 100%;
}
.InputWrap > div > input {
	width: 100%;
	background: #f5f5f5;
	border: none;
	padding: 3%;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}
.boxPwInput {
	margin-top: 10px;
}
.my_error_display > label,
.join_error_display > label {
	color: #000;
	font-size: 0.78em;
	display: block;
	margin-top: 5px;
	padding: 3%;
	background: #ff8888;
	position: relative;
}
.btnLogin {
	margin-top: 10px;
}
.btnLogin > a { /* 로그인 버튼 */
	color: #fff;
	text-decoration: none;
	display: block;
	padding: 3% 0;
	background: #f08200;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
.btnLogin > a:hover { /* 로그인 버튼 오버 */
	font-weight: 700;
	color:#fff;
	text-decoration:none;
	background: #e35507;
}
.SaveId {
	color: #777;
	font-size: 0.9285714285714286em;
	margin-top: 5px;
	padding-top: 5px;
	padding-bottom: 15px;
	border-bottom: 1px solid #dadada;
}
.SaveId input {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	margin: 0;
	vertical-align: middle;
}
.boxLoginBtns {
	margin-top: 10px;
}
.boxLoginBtns > a { /* 로그인 기타 버튼 */
	color: #777;
	font-size: 0.9285714285714286em;
	text-decoration: none;
	display: block;
	padding: 3% 0;
	background: #fff;
	border: 1px solid #f08200;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
.boxLoginBtns > a.btnLoginJoin {
	color: #000;
	margin-top: 10px;
}

/* 아이디 / 비밀번호 찾기 모바일 설정 */
.wrapIdPwFind {
	position: relative;
}
.boxIdPwFind {
	padding: 20px;
	border: 1px solid #dadada;
	background: #fff;
}
.txtIdPwFindDesc {
	display: none;
}
.titleIdPwFind { /* 아이디&비밀번호 찾기 타이틀 */
	color: #f08200;
	font-size: 1.2em;
}
.boxIdPwFindInput {
	margin-top: 20px;
}
.boxIdPwFindInput > .InputWrap {
	width: 79%;
}
.boxPhoneInput,
.boxPhoneInput2 {
	margin-top: 10px;
}
.btnIdPwFindCheck {
	margin-top: 10px;
}
.btnIdPwFindCheck > a { /* 아이디&비밀번호 찾기 버튼 */
	color: #fff;
	letter-spacing: -.5px;
	height: 100%;
	text-decoration: none;
	display: block;
	padding: 3% 0;
	background: #f08200;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
.btnIdPwFindCheck > a:hover { /* 아이디&비밀번호 찾기 버튼 오버 */
	font-weight: 700;
	color:#fff;
	text-decoration:none;
	background: #e35507;
}

/* 회원 가입 동의 설정 */
.boxJoinOrder > li {
	width: 33.33%;
	display: inline-block;
	*display: inline;
	*zoom: 1;
}
#JoinOrder1 {
	text-align: left;
}
#JoinOrder2 {
	text-align: center;
}
#JoinOrder3 {
	text-align: right;
}
.boxJoinOrder > li > span {
	width: 85%;
	color: #666;
	text-align: center;
	padding: 10px 0;
	display: inline-block;
	*display: block;
	*zoom: 1;
	background: #fff;
	border: 1px solid #f08200;
}
.boxJoinOrder > li.ThisOrder > span {
	color: #fff;
	background: #f08200;
	border: 1px solid #f08200;
}
.wrapJoinAgree {
	margin-top: 20px;
	border: 1px solid #dadada;
	padding: 5%;
}
.titleJoinAgree {
	color: #f08200;
	font-size: 1.2em;
}
.boxJoinAgree {
	margin-top: 10px;
}
.boxAgreeTxt > div {
	color: #666;
	font-size: 0.8571428571428571em;
	line-height: 1.4;
	height: 130px;
	overflow-x: hidden;
	overflow-y: scroll;
	border-top: 1px solid #dadada;
	border-bottom: 1px solid #dadada;
	padding: 10px;
	background: #fafafa;
}
.btnAgreeCheck {
	font-size: 0.8571428571428571em;
	margin-top: 10px;
}
.NoticeAgree {
	color: #666;
	font-size: 0.8571428571428571em;
	margin-top: 5px;
}
.boxAllAgreeWrap {
	margin-top: 10px;
}
.btnJoin {
	margin-top: 20px;
	display: block;
}
.btnJoin > a { /* 동의 버튼 */
	color: #fff;
	text-decoration: none;
	display: block;
	padding: 3% 0;
	background: #f08200;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
.btnJoin > a:hover { /* 동의 버튼 오버 */
	font-weight: 700;
	color:#fff;
	text-decoration:none;
	background: #e35507;
}

/* 회원가입 정보 설정 */
.wrapJoinForm {
	margin-bottom: 50px;
}
.boxJoinForm {
	margin-top: 20px;
}
.titleJoinForm {
	color: #f08200;
	font-size: 1.2em;
}
.JoinFormDesc {
	color: #555;
	font-size: 0.8571428571428571em;
	margin-top: 10px;
}
.tableJoinForm {
	margin-top: 20px;
	border-top: 2px solid #dadada;
	border-bottom: 2px solid #dadada;
}
.tableJoinForm,
.tableJoinForm * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.tableJoinForm form > ul {
	border-top: 1px solid #dadada;
	margin:0;
}
.tableJoinForm form > ul.First {
	border-top: none;
}
.tableJoinForm form > ul > li {
	color: #666;
	font-size: 0.9285714285714286em;
	vertical-align: top;
}
.tableJoinForm form > ul > li.tableHead {
	color: #f08200;
	padding: 8px 5px 5px 5px;
}
.tableJoinForm form > ul > li.tableCell {
	padding: 5px 5px 8px 5px;
}
.tableJoinForm form > ul > li.tableCell label {
	display: none;
}
.tableJoinForm form > ul > li.tableCell input[type="text"],
.tableJoinForm form > ul > li.tableCell input[type="password"] {
	width: 100%;
	color: #666;
	font-size: 0.8571428571428571em;
	border: none;
	background: #e3e3e3;
	padding: 3%;
}
.tableJoinForm form > ul > li.JoinEmailCell > input {
	width: 46% !important;
}
.tableJoinForm form > ul > li.JoinEmailCell > select {
	color: #666;
	display: block;
	width: 100%;
	margin-top: 5px;
	padding: 2%;
	border: 1px solid #f08200;
}
.tableJoinForm form > ul > li.JoinEmailCell > span {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	width: 8%;
	text-align: center;
}
.tableJoinForm form > ul > li.JoinCellPhone > select,
.tableJoinForm form > ul > li.JoinCellPhone > input {
	width: 30% !important;
}
.tableJoinForm form > ul > li.JoinCellPhone > select {
	color: #666;
	text-align: center;
	padding: 2% 0;
	border: 1px solid #f08200;
}
.tableJoinForm form > ul > li.JoinCellPhone > span {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	width: 5%;
	text-align: center;
}
.tableJoinForm form > ul > li.JoinAddress > input {
	width: 46% !important;
	margin-top: 5px;
}
.tableJoinForm form > ul > li.JoinAddress > span {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	width: 8%;
	text-align: center;
}
.tableJoinForm form > ul > li.JoinAddress > div > input {
	margin-top: 5px;
}
a.btnZipCode,
.boxBtnJoinWrap > a {
	color: #777;
	font-size: 0.9285714285714286em;
	text-decoration: none;
	display: block;
	padding: 3% 0;
	margin-top: 5px;
	background: #fff;
	border: 1px solid #f08200;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
.boxBtnJoinWrap {
	margin-top: 15px;
	overflow:hidden;
}
.boxBtnJoinWrap > a {
		width: 48%;
		float: right;
}
.boxBtnJoinWrap > a:first-child { /* 회원 가입 버튼 */
	float: left;
	color: #fff;
	text-decoration: none;
	display: block;
	padding: 3% 0;
	background: #f08200;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
.boxBtnJoinWrap > a:first-child:hover { /* 회원 가입 버튼 오버 */
	font-weight: 700;
	color:#fff;
	text-decoration:none;
	background: #e35507;
}

/* 회원 탈퇴 설정 */
.tableOutForm .OutTextNotice {
	color: #333;
	font-size: 0.9285714285714286em;
	line-height: 1.6;
	margin-bottom: 20px;
}
.tableOutForm .OutTextNotice .OutId {
	color: #f08200;
	font-weight: 700;
	padding-left: 5px;
	padding-right: 5px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	border-bottom: 1px solid #f08200;
}
.tableOutForm .OutTextCheck {
	color: #000;
	font-weight: 700;
	font-size: 0.9285714285714286em;
	line-height: 1.6;
	letter-spacing: -.6px;
	text-align: center;
	margin-bottom: 30px;
}
.tableOutInfo {
	border-top: 2px solid #dadada;
	border-bottom: 2px solid #dadada;
	margin-bottom: 20px;
}
.tableOutInfo > ul {
	border-top: 1px solid #dadada;
	margin:0;
}
.tableOutInfo > ul > li {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	*display: inline;
	*zoom: 1;
}
.tableOutInfo > ul > li.tableHead {
	width: 30%;
	color: #f08200;
	font-size: 0.9285714285714286em;
	padding: 8px 5px;
	background: #fff;
}
.tableOutInfo > ul > li.tableCell {
	font-weight: 700;
	width: 70%;
	padding: 8px 5px 8px 10px;
}
.tableOutForm .OutTextReason {
	line-height: 1.5;
	font-size: 0.9285714285714286em;
}
.tableOutForm .OutTextReason > p:first-child {
	color: #000;
	font-weight: 700;
	line-height: 1.4;
	padding-bottom: 8px;
	border-bottom: 1px solid #dadada;
	margin-bottom: 10px;
}
.tableOutForm .OutTextReason .OutRadio > input {
	padding: 0;
	margin: 0;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: text-top;
}
.OutTextReasonBox {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	margin-top: 10px;
	width: 100%;
}
.OutTextReasonBox textarea {
	color: #666;
	font-size: 0.9285714285714286em;
	width: 50%;
	height: 50px;
}

/* 회원관리 레이아웃 설정 */
.memCon { /* 모바일 설정 */
	margin-right: auto;
	margin-left: auto;
}
@media (min-width: 768px) {
	.memCon { /* 태블릿 설정 */
		width: 100%;
	}
}
@media (min-width: 1100px) {
	.memCon { /* 태블릿 설정 */
		width: 708px;
	}
}

/* 로그인 해상도별 설정 */
@media (min-width: 768px) {
	.txtLoginDesc {
		display: block;
		margin-top: 10px;
	}
	.InputWrap {
		width: 85%;
		display: inline-block;
		*display: inline;
		*zoom: 1;
		vertical-align: top;
	}
	.InputWrap > div {
		position: relative;
	}
	.InputWrap > div > input {
		width: 96%;
		padding: 10px 2%;
	}
	.my_error_display,
	.join_error_display {
		position: absolute;
		top: 0;
		right: 0;
		height: 100%;
		display: inline-block;
		*display: block;
		*zoom: 1;
	}
	.my_error_display > label,
	.join_error_display > label {
		width: 110px;
		display: block;
		margin-top: 0;
		padding: 13px 5px;
	}
	.btnLogin {
		width: 14%;
		height: 84px;
		margin-left: 1%;
		display: inline-block;
		*display: inline;
		*zoom: 1;
		vertical-align: top;
		margin-top: 0px;
	}
	.btnLogin > a { /* 로그인 버튼 */
		width: 100%;
		height: 100%;
		line-height: 84px;
		vertical-align: middle;
		padding: 0;
	}
	.boxLoginBtns:before,
	.boxLoginBtns:after {
		content: " ";
		display: table;
	}
	.boxLoginBtns:after {
		clear: both;
	}
	.boxLoginBtns > a { /* 로그인 기타 버튼 */
		width: 48%;
		float: right;
		padding: 15px 0;
	}
	.boxLoginBtns > a:first-child {
		float: left;
	}
	.boxLoginBtns > a.btnLoginJoin {
		color: #000;
		margin-top: 0px;
	}
}

/* 아이디&비밀번호 찾기 해상도별 설정 */
@media (min-width: 768px) {
	.boxIdPwFind {
		padding: 8% 12%;
	}
	.txtIdPwFindDesc {
		display: block;
		margin-top: 10px;
	}
	.btnIdPwFindCheck {
		width: 20%;
		height: 84px;
		margin-left: 1%;
		display: inline-block;
		*display: inline;
		*zoom: 1;
		vertical-align: top;
		margin-top: 0px;
	}
	.btnIdPwFindCheck > a { /* 로그인 버튼 */
		width: 100%;
		height: 100%;
		line-height: 84px;
		vertical-align: middle;
		padding: 0;
	}
}

/* 회원 가입 동의 해상도별 설정 */
@media (min-width: 768px) {
	.boxAllAgreeWrap {
		margin-top: 20px;
		margin-bottom: 50px;
	}
	.boxAllAgree {
		text-align: center;
	}
	.btnJoin > a {
		width: 200px;
		padding: 15px 20px;
		margin: 0 auto;
	}
}

/* 회원가입 정보 설정 */
@media (min-width:768px) {
	.tableJoinForm form > ul > li {
		color: #666;
		font-size: 0.9285714285714286em;
		padding: 10px;
		display: inline-block;
		*display: inline;
		*zoom: 1;
		vertical-align: top;
	}
	.tableJoinForm form > ul > li.tableHead {
		color: #f08200;;
		width: 20%;
		padding: 10px;
	}
	.tableJoinForm form > ul:nth-child(2n) {
		background: #fafafa;
	}
	.tableJoinForm form > ul > li.tableCell {
		width: 80%;
		position: relative;
		overflow: hidden;
		padding: 5px;
	}
	.tableJoinForm form > ul > li.tableCell label {
		display: inline-block;
		*display: inline;
		*zoom: 1;
		position: absolute;
		top: -999px;
	}
	.tableJoinForm form > ul > li.tableCell input[type="text"],
	.tableJoinForm form > ul > li.tableCell input[type="password"] {
		padding: 5px;
	}
	.tableJoinForm form > ul > li.JoinEmailCell > input {
		width: 31% !important;
	}
	.tableJoinForm form > ul > li.JoinEmailCell > select {
		display: inline-block;
		*display: inline;
		*zoom: 1;
		width: 30%;
		margin-top: 0px;
		margin-left: 2%;
		padding: 1px 5px;
	}
	.tableJoinForm form > ul > li.JoinEmailCell > span {
		width: 6%;
	}
	.tableJoinForm form > ul > li.JoinCellPhone > input {
		width: 30% !important;
	}
	.tableJoinForm form > ul > li.JoinCellPhone > select {
		width: 30% !important;
		padding: 1px 5px;
	}
	.tableJoinForm form > ul > li.JoinCellPhone > span {
		width: 5%;
	}
	.tableJoinForm form > ul > li.JoinAddress > input {
		width: 47% !important;
	}
	.tableJoinForm form > ul > li.JoinAddress > span {
		width: 6%;
	}
	a.btnZipCode {
		padding: 5px 0;
	}
	.boxBtnJoinWrap {
		text-align: center;
	}
	.boxBtnJoinWrap > a {
		float: none !important;
		display: inline-block !important;
		*display: inline !important;
		*zoom: 1 !important;
		width: 20%;
		padding: 2% 0 !important;
	}
	.boxBtnJoinWrap > a:first-child {
		margin-right: 10px;
	}
}

.boxLoginBtns > a.btn_sns_login {position:relative;padding:12px 0 12px 53px;height:45px;font-size:14px;font-weight:700;line-height:21px;text-align:center;border:0;}
.boxLoginBtns > a.btn_sns_login:before {content:'';display:block;position:absolute;top:0;left:0;width:52px;height:45px;border-right:1px solid;background-image:url(../images/common/icon-login-logo.png);background-repeat:no-repeat;}
.boxLoginBtns > a.btn_sns_login:hover {text-decoration:none;}

.boxLoginBtns > a.btnNaverLogin {background-color:#1ec800;color:#fff;}
.boxLoginBtns > a.btnNaverLogin:before {border-color:#1cbb00;}
.boxLoginBtns > a.btnKakaoLogin {margin-top:10px;background-color:#ffde00;color:#3b1e1e;}
.boxLoginBtns > a.btnKakaoLogin:before {border-color:#ebcd00;background-position:0 -100px;}
@media (min-width: 768px) {
	.boxLoginBtns > a.btnKakaoLogin {margin-top:0;}
}