/*-- member - common css --*/

/*reset*/
#flogin{margin: 0;}

/*container*/
.memberWrap{margin-top: 126px;}

@media screen and (max-width: 1480px){ 
	
	.memberWrap{margin-top: 116px;}
}

@media screen and (max-width: 720px){ 
	
	.memberWrap{margin-top: 101px;}
}

/*-- login --*/
.mbInner{width: 90%;max-width: 400px;margin: 0 auto;}
.regInner{width: 90%;max-width: 640px;margin: 0 auto;}
.mbTitle{font-size: 2.25rem;font-weight: 700;text-align: center;margin-bottom: 40px;}

.comInput{font-size: .9375rem;line-height: 50px;border: 1px solid #dbdbdb;padding: 0 15px;font-weight: 400;border-radius: 5px;outline: none;overflow: hidden;}
.comInput:focus{border-color: #222;outline: none;}
.comInput::placeholder{color: #999;font-size: .9375rem;}
.comInput_w100{display: block;width: 100%;}

.comInput-select{height: 50px;background-image: url(/img/icon/selectdown.png);background-repeat: no-repeat;background-position: right 12px top 50%;
	-webkit-appearance:none; /* for chrome */
	-moz-appearance:none; /*for firefox*/
	appearance:none;
}

.mbSave{display: flex;align-items: center;justify-content: space-between;font-size: .875rem;font-weight: 400;}

.mbCheck{position: relative;}
.mbCheck input[type=checkbox] + label, .mbCheck input[type=radio] + label{display: flex;align-items: center;gap: 8px;color: #888;cursor: pointer;}
.mbCheck input[type=checkbox] + label span, .mbCheck input[type=radio] + label span{width: 20px;height: 20px;border-radius: 4px;border: 1px solid #dbdbdb;background: #FFF;overflow: hidden;}
.mbCheck input[type=checkbox]:checked + label span, .mbCheck input[type=radio]:checked + label span{background: url(/img/chk.png) no-repeat 50% 50% var(--color-1);border-color: var(--color-1);}

.mb_btnBox{margin-top: 20px;}
.mbBtn{display: block;width: 100%;text-align: center;line-height: 50px;border: 1px solid #ddd;border-radius: 5px;font-weight: 400;color: #888;overflow: hidden;}
.mbBtn_01{background: var(--color-1);border-color: var(--color-1);color: #FFF;font-weight: 600;}

.mbSave{display: flex;align-items: center;justify-content: space-between;}
.mbSave a{font-size: 14px;font-weight: var(--fw-4);color: #888;}

@media screen and (max-width: 720px){ 
	
	.mbWrap{padding: 60px 0;}

	.mbTitle{margin-bottom: 30px;}

	.comInput{line-height: 45px;padding: 0 13px;font-size: 14px;}
	.comInput::placeholder{font-size: 14px;}
	.comInput-select{height: 45px;background-position: right 11px top 50%;}

	.mbSave, .mbBtn{font-size: 14px;}
	.mbBtn{line-height: 45px;}
}

/*-- register --*/
.regNavi{display: flex;align-items: center;justify-content: center;gap: 24px;margin-bottom: 40px;}
.regNavi li{font-size: .9375rem;font-weight: 600;color: #979797;position: relative;}
.regNavi li.on{color: #000;}
.regNavi li::after{content: "\e93f";font-family: xeicon!important;position: absolute;top: -1px;left: calc( 100% + 3px );z-index: 1;font-size: 1.13rem;}
.regNavi li:last-child::after{display: none;}

.mbInfobox{padding: 20px;background: #f4f4f4;border-radius: 5px;overflow: hidden;}

.regTerms{margin-top: 35px;}
.regTerms>h4{font-size: 1.13rem;font-weight: bold;padding-bottom: 13px;margin-bottom: 15px;border-bottom: 2px solid #000;}
.regTerms .mbCheck{font-size: .875rem;font-weight: 400;margin-bottom: 15px;}
#fregister textarea{border: 1px solid #dbdbdb;background: #FFF;font-size: .875rem;padding: 20px 5%;font-weight: 400;outline: none;resize: vertical;}

.regTable, .regTable th, .regTable td{font-size: .875rem !important;font-weight: 400;}
.regTable th{font-weight: 500;background: #f4f4f4;}
.regTable td{padding: 13px 15px;border-color: #dbdbdb;}
.regTable .regTcolor td{background: #f9f9f9;font-weight: 500;}

.mb_flexBox{display: flex;align-items: center;justify-content: center;gap: 5px;}

@media screen and (max-width: 720px){ 
	
	.regNavi{margin-bottom: 25px;}
	.regNavi li{font-size: 13px;}
	.regNavi li::after{top: -1px;left: calc( 100% + 5px );z-index: 1;font-size: 15px;}

	.mbInfobox{padding: 15px;}
	
	.regTerms{margin-top: 30px;}
	.regTerms>h4{font-size: 16px;padding-bottom: 12px;margin-bottom: 14px;}
	.regTerms .mbCheck{font-size: 13px;margin-bottom: 14px;}
	#fregister textarea{height: 150px;font-size: 13px;}

	.regTable, .regTable th, .regTable td{font-size: 12px !important;}
}

/*로그인, 회원가입 - 정보입력*/
.regTerms>h4.regGen{display: flex;align-items: flex-end;justify-content: space-between;margin-bottom: 25px;}
.regGen span{font-size: .875rem;font-weight: 500;color: #979797;}
.regGen span i{color: #F00;}

.regBox li{margin-bottom: 20px;}
.regBox li:last-child{margin-bottom: 0;}

.regText{display: block;font-size: .9375rem;font-weight: 500;margin-bottom: 8px;}
.regText b{color: #F00;}

.regInfo, #captcha #captcha_info{display: block;font-size: .875rem;font-weight: 400;margin-top: 8px;color: #888;}

.regCheck label{font-size: .9375rem;}

@media screen and (max-width: 720px){ 
	
	.regGen span{font-size: 12px;}
	.regText, .regCheck label{font-size: 13px;}
	.regInfo, #captcha #captcha_info{font-size: 12px;line-height: 150%;word-break: keep-all;}
}

/*로그인, 회원가입 - 회원가입완료*/
.regResult{text-align: center;}

.regResult h2{font-weight: 400;margin-bottom: 20px;font-size: 1.25rem;}
.regResult h2 b{font-weight: 700;}
.regResult p{font-size: .9375rem;line-height: 180%;border: 1px solid #dbdbdb;border-radius: 8px;overflow: hidden;padding: 20px;color: #777;}

.mb_t10 {margin-top:10px;}

/*비회원구매*/
.guestWrap{margin-top: 40px;}
.guestWrap p{font-size: .875rem;text-align: center;}
.guestWrap .mb_btnBox{margin-top: 10px;}

@media screen and (max-width: 720px){ 
	
	.regResult h2{font-size: 16px;margin-bottom: 18px;}
	.regResult p{font-size: 14px;padding: 15px;}
	
	.guestWrap p{font-size: 13px;}
}

/*회원정보수정*/
.mbChenge{line-height: 160%;font-weight: 400;text-align: center;}
.mbChenge b{font-size: 1.25rem;font-weight: 600;color: #00277f;}

.regCheck label{justify-content: flex-start !important;}

@media screen and (max-width: 720px){ 
	
	.mbChenge{font-size: 14px;}
	
	#pw_wr_password{font-size: 15px !important;}
}