/*-----------------------------------------
# 로그인
-------------------------------------------*/
.loginWrap{
	width:100%;
	position:relative;
	background: #23201F;
}
.logBox {
    padding: 0;
	width: 100%;
	padding:16rem 0;
    /* background: #fff; */
	position: relative;
}
.logSideBox {
	margin: 0 auto;
	max-width: 64rem;
	padding:0 2rem;
    position: relative;
}

/* .logSideBox::before { */
    /* content: ''; */
    /* width: 0.1rem; */
    /* height: 100%; */
    /* position: absolute; */
    /* left: -0.05rem; */
    /* top: 0; */
    /* background: #EEE; */
    /* transform: tra; */
/* } */

.loginTitle {
	position:Relative;
	margin-bottom:6rem;
}
.logtText{
	color: #F9F9F9;
	text-align: center;
    font-family: pretendard-500;
	font-size:7rem;
	font-weight: 500;
	line-height: 8rem;
}
.loginTitle p span {
    margin: 0 0 2rem 0;
    display: inline-block;
    content: '';
    position: Relative;
    width: 1.6rem;
    height: 1.6rem;
    background-image: url(/public/img/main/mainvtitle_icon.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.loginTitle p {
	text-align: center;
	margin:3rem 0 0 0;
    display: flex;
    color: #F9F9F9;
    font-family: pretendard-400;
    font-size: 1.8rem;
    font-style: normal;
    font-weight: 400;
    line-height: 3rem;
    flex-direction: column;
    align-items: center;
}

.loginTitle.black .logtText{
	color: #23201F;
}
.loginTitle.black p{
	color: #23201F;
}
.loginTitle.black p span {
	background-image: url(/public/img/main/mainvtitle_icon_black.webp);
}


.loin{
	width:100%;
	position:relative;
	margin-bottom:0.8rem;
}
.loin:last-child{
	margin-bottom:0rem;
}
.loin label {
    display: flex;
    font-size: 1.6rem;
font-family: Pretendard;
    line-height: 2.6rem;
    letter-spacing: 0em;
    text-align: left;
    color: #2F2C2C;
    align-items: flex-end;
}
.loin input {
    border-bottom: 1px solid #F9F9F9;
    box-sizing: border-box;
    width: 100%;
    position: relative;
    height: 6.6rem;
    border-radius: 0rem;
    padding: 0;
	margin: 0;
	font-family: pretendard-500;
    font-size: 1.8rem;
    font-weight: 500;
	color: #F9F9F9;
	font-style: normal;
	line-height: 3rem;
	background: #23201F;
}
.loin input:-webkit-autofill,
.loin input:-webkit-autofill:hover,
.loin input:-webkit-autofill:focus,
.loin input:-webkit-autofill:active {
	transition: background-color 5000s;
	-webkit-text-fill-color: #263238 !important;
}
.loin input:focus,
.loin input:active {background:#23201F;}
.loin input:focus{outline: none;}

.loin input::placeholder {
	color: #F9F9F9;
	font-size: 1.8rem;
	line-height: 3rem;
	font-weight: 400;
	font-family: pretendard-400;
	opacity: 0.5;
}

.lobtn {
    width: 100%;
    position: relative;
    margin: 3rem 0 1rem 0;
}
.lobtn button {
    cursor: pointer;
    width: 100%;
    /* height: 6rem; */
	border: 1px solid #6F7474;
    background: #6F7474;
    border-radius: 0;
	font-family: pretendard-500;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 3rem;
    letter-spacing: 0px;
    text-align: center;
    color: #F9F9F9;
    padding: 1.4rem 1rem;
}
.lobtn button:hover {
	border: 1px solid #D8D5CD);
	background: #D8D5CD;
	color:#23201F;
}

.login_infoGroup {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.find_info {
    gap: 0.8rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.find_info span{
	display:inline-block;
	width:3px;
	height:3px;
	border-radius:50%;
	background:#F9F9F9;
}
.find_info a {
	color: #F9F9F9;
	font-family: pretendard-400;
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 2.4rem;
}
.subloInfo{
	display:block;
	text-align:center;
}
.subloInfo p{
	
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 2rem;
	letter-spacing: 0em;
	text-align: center;
	color:#607D8B;
	display:block;
	margin-bottom:0.6rem;
}
.subloInfo a{
	display:inline-block;
	color: #F9F9F9;
	font-family: pretendard-400;
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 2.4rem;
}
@media (max-width:1600px) {
	.logBox {
		padding: 14rem 0;
	}
	.logtText {
		font-size: 6rem;
		line-height: 7rem;
	}
}
@media (max-width:991px) {
	.logBox {
		padding: 12rem 0 12rem 0;
	}
	.logtText {
		font-size: 5rem;
		line-height: 6rem;
	}
}
@media (max-width:767px) {
	.logBox {
		padding: 12rem 0 6rem 0;
	}
	.loginTitle {
		margin-bottom: 3rem;
	}
	.logtText {
		font-size: 3rem;
		line-height: 4rem;
		letter-spacing: -0.9px;
	}
	.loginTitle p span {
		margin: 0 0 1rem 0;
		width: 1.2rem;
		height: 1.2rem;
	}
	.loginTitle p {
		margin: 2rem 0 0 0;
		font-size: 1.3rem;
		line-height: 2rem;
	}
	.loin {
		margin-bottom: 1rem;
	}
	.loin input {
		height: 4.8rem;
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	.loin input::placeholder {
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	.lobtn {
		margin: 4rem 0 1rem 0;
	}
	.lobtn button {
		font-size: 1.6rem;
		line-height: 2.2rem;
		padding: 1.3rem 1rem;
	}
	.find_info {
		gap: 0.6rem;
	}
	.find_info a {
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	.subloInfo a {
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
}

/*-----------------------------------------
# 회원가입
-------------------------------------------*/
.joinWrap{
	width:100%;
	position:relative;
	background: #EFEDEA;
}
.jBox {
    width: 100%;
    position: relative;
    padding: 16rem 0rem;
	overflow:hidden;
}
.joinSideBox {
    max-width: 64rem;
    padding: 0rem 2rem;
    margin: 0 auto;
    width: 100%;
    position: relative;
}
.joinContent{
	width:100%;
	position:relative;
	margin-bottom:5rem;
}
.joinContent.nonemarB{
	margin-bottom:0rem;
}


.tuin {
    width: 100%;
    position: relative;
    margin: 0 0 3rem 0;
}
.tuin label {
    position: relative;
    display: inline-block;
    font-size: 1.5rem;
    font-family: pretendard-400;
	font-weight: 400;
    line-height: 1.4rem;
    text-align: left;
    color: #23201F;
    align-items: center;
}
.tuinreq {
    padding-left: 0rem;
}
.tuinreq:before {
    border-radius: 50%;
    content: '';
    position: absolute;
	right: -1rem;
    top: 0rem;
    width: 0.5rem;
    height: 0.5rem;
    background: #C6C4B8;
}
.tuin label span{
	
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 2.6rem;
	letter-spacing: 0em;
	text-align: left;
	color:#7384CE;
	margin-left:1.2rem;
}
.tuin p {
    margin-left: 1rem;
    font-family: 'Pretendard-Medium';
    margin-top: 0rem;
    display: block;
    font-size: 1.3rem;
    /* font-weight: 400; */
    line-height: 1.3rem;
    letter-spacing: 0em;
    text-align: left;
    color: #607D8B;
}
.tuin dl {
    margin-top: 0.5rem;
    font-family: 'Pretendard-Medium';
    /* margin-top: 0rem; */
    display: block;
    font-size: 1.3rem;
    /* font-weight: 400; */
    line-height: 1.6rem;
    letter-spacing: 0em;
    text-align: left;
    color: #607D8B;
}
.tuin input {
    box-sizing: border-box;
	border-bottom: 1px solid #23201F;
    width: 100%;
    position: relative;
    height: 6rem;
	background: #EFEDEA;
    border-radius: 0;
    padding: 0;
	margin:0;
	
	font-family: pretendard-500;
	font-weight: 500;
    color: #23201F;
    font-size: 1.6rem;
	line-height: 3rem;
}

.tuin input:-webkit-autofill,
.tuin input:-webkit-autofill:hover,
.tuin input:-webkit-autofill:focus,
.tuin input:-webkit-autofill:active {
	transition: background-color 5000s;
	-webkit-text-fill-color: #263238 !important;
}
.tuin input:focus,
.tuin input:active {background:#EFEDEA;}
.tuin input:focus{outline: none;}
.tuin input::placeholder{
	color: #23201F;
	font-family: pretendard-400;
	font-weight: 400;
	font-size: 1.6rem;
	font-style: normal;
	line-height: 3rem;
	opacity: 0.5;
}

.smartBtn {
    display: flex;
    font-size: 1.6rem;
	line-height: 3rem;
	color: #23201F;
	font-family: pretendard-500;
	font-weight: 500;
    cursor: pointer;
    bottom: 1.5rem;
    right: 0rem;
    height: 3rem;
    width: 5.6rem;
    position: absolute;
    z-index: 10;
    align-items: center;
    justify-content: center;
}

.radioBox{
	width:100%;
}
.ramarl{margin-left:1rem;}
.radioBox strong {
    position: relative;
    display: inline-block;
    font-size: 1.5rem;
	font-family: pretendard-400;
	font-weight: 400;
    line-height: 1.4rem;
    letter-spacing: 0em;
    text-align: left;
    color: #23201F;
    align-items: center;
}
/*------ 체크박스 -----*/
.topCheckBox {
    display: flex;
    height: 6rem;
    align-items: center;
}
.topCheckBox span + span {
    margin-left: 3rem;
}
.topCheckBox input[type="radio"]:checked,
.topCheckBox input[type="radio"]:not(:checked) {
	    height: 0;
	position: absolute;
    opacity:0!important;
}
.topCheckBox label{
	position: relative;
	padding-left: 3.4rem;
    cursor: pointer;
    display: inline-block;
    color: #23201F; 
	font-size: 1.6rem;
	font-family: pretendard-400;
	font-weight: 400;
	line-height: 3rem;
}
.topCheckBox input[type="radio"]:checked + label{
    font-family: pretendard-600;
	font-weight: 600;
}
.topCheckBox input[type="radio"]:checked + label:before,
.topCheckBox input[type="radio"]:checked + label:before, .topCheckBox input[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 2rem;
    height: 2rem;
    border: 2px solid #C6C4B8;
    border-radius: 100%;
    background: inherit;
}

.topCheckBox input[type="radio"]:checked + label:before {
    text-align: left;
    color: #39322D;
    border: 2px solid #39322D;
    width: 2rem;
    height: 2rem;
}
.topCheckBox input[type="radio"]:checked + label:after,
.topCheckBox input[type="radio"]:not(:checked) + label:after { content: '';
	width: 1.4rem; height:1.4rem;
	background: #39322D;
	position: absolute;  
	top: 50%;
	transform:translateY(-50%);
	left: 0.5rem;
	border-radius: 100%;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	transition: none;
}
.topCheckBox input[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0); transform: scale(0);
}
/*------ 체크박스 -----*/
.tuin p.myInfoEditNotice, .myInfoEditNotice {
    color: #23201F;
    font-size: 1.3rem;
    line-height: 1.6rem;
    margin:0;
	text-align:left;
	opacity: 0.5;
}


.joinWrap .inq_priCheckText label {cursor:pointer;
	color: #23201F;
	font-family: Pretendard;
	font-size: 1.6rem;
line-height: 3rem;
font-family: pretendard-400;}
.joinWrap .inq_priTop {padding-bottom:1.2rem; margin-bottom:1.2rem; border-bottom:1px solid #2F2C2C;}
.joinWrap .inq_priTop .inq_priCheckText {
	color: #23201F;
	font-family: pretendard-500;
	font-size: 2rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.4rem;
}
.joinWrap .inq_priCheckText {

	cursor: pointer;
}
.inq_priBox{
	display:block;
	padding:3rem 0 0 0;
}
.inq_pri{
	position:relative;
	display:block;
	margin-bottom:0.6rem;
}
.joinWrap .inq_pri {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    padding: 0 0 0.6rem 0;
    margin: 0;
}
.inq_pri:last-child{
	margin-bottom:0rem;
}
.inq_pri input[type="checkbox"]{ 
	position:absolute; 
    width:1px; 
    height:1px; 
    padding:0; 
    margin:-1px; 
    overflow:hidden; 
    clip:rect(0,0,0,0); 
    border:0; 
}
.inq_pri input[type="checkbox"] + label{ 
	display:inline-block; 
    position:relative; 
    padding-left:2.6rem; 
    cursor:pointer; 
	font-size: 1.6rem;
	font-weight: 400;
	font-family: pretendard-400;
	line-height: 3rem;
	color: #23201F;
}
.inq_pri input[type="checkbox"] + label:before{ 
	content:''; 
    position:absolute; 
    left:0; 
    top: 0.5rem;
    width: 2rem;
    height: 2rem;
    text-align:center; 
    background:#fff; 
    border:none; 
    box-sizing:border-box; 
	background:url(/public/img/common/check_before.webp) no-repeat center/cover;
}
.inq_pri input[type="checkbox"]:checked + label:after{ 
	content: ''; 
    position:absolute; 
	top: 0.5rem;
	left:0; 
	width:2rem;
	height:2rem;
    background:url(/public/img/common/check_after.webp) no-repeat center/cover;
}
.inq_pri a {
	text-decoration: underline!important;
	position: relative;
	margin-left: 1rem;
	font-size: 1.6rem;
	font-weight: 400;
	font-family: pretendard-400;
	color: #23201F;
	line-height: 3rem;
	right: 0px;
}

.jcBtnFlexBox{
	width: 100%;
    position: relative;
	display:flex;
	gap:1rem;
	margin: 5rem 0 0 0;
}
.jcBtnFlexBox .jcBtn{
	width:100%;
}
.jcBtnFlexBox .jcBtn button{
	border: 1px solid #D8D5CD;
	background: #D8D5CD;
	font-family: pretendard-600;
    font-weight: 600;
}
.jcBtnFlexBox .jocomBtn1{
	width:100%;
}
.jcBtnBox {
    width: 100%;
    position: relative;
    margin: 5rem 0 0 0;
}
.jcBtn button {
    cursor: pointer;
    width: 100%;
    /* height: 6rem; */
    border: 1px solid #23201F;
    background: #EFEDEA;
    border-radius: 0;
    font-family: pretendard-500;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 3rem;
    letter-spacing: 0px;
    text-align: center;
	color: #23201F;
    padding: 1.4rem 1rem;
}
.jcBtn button:hover{
	border: 1px solid #D8D5CD;
	background: #D8D5CD;
	font-family: pretendard-600;
    font-weight: 600;
}

.secessionGo {
	color: #23201F;
	text-align: center;
	font-family: Pretendard;
	font-size: 1.6rem;
	line-height: 2.4rem;
	text-decoration-line: underline;
	margin-top:2rem;
	opacity: 0.5;
}

@media (max-width: 1600px) {
    .jBox {
        padding: 14rem 0;
    }
}
@media (max-width: 991px) {
    .jBox {
        padding: 12rem 0 12rem 0;
    }
}
@media (max-width: 767px) {
    .jBox {
        padding: 12rem 0 6rem 0;
    }
	
	
	.tuin {
		margin: 0 0 2.4rem 0;
	}
	.tuin label {
		font-size: 1.2rem;
		line-height: 1.2rem;
	}
	.tuinreq:before {
		right: -0.6rem;
		width: 0.3rem;
		height: 0.3rem;
	}
	.tuin input {
		height: 4.8rem;
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	.tuin input::placeholder{
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	.smartBtn {
		font-size: 1.4rem;
		line-height: 2.4rem;
		bottom: 0.9rem;
		right: 0rem;
		height: 3rem;
		width: 5rem;
	}
	.radioBox strong {
		font-size: 1.2rem;
		line-height: 1.2rem;
	}
	.tuin p.myInfoEditNotice, .myInfoEditNotice {
		font-size: 1.2rem;
		line-height: 1.4rem;
	}
	.topCheckBox {
		height: 4.8rem;
	}
	.topCheckBox label{
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	
	
	.inq_priBox {
		padding: 1.6rem 0 0 0;
	}
	.joinWrap .inq_priTop .inq_priCheckText {
		font-size: 1.6rem;
		line-height: 2rem;
	}
	.joinWrap .inq_priCheckText label {
		font-size: 1.3rem;
		line-height: 2.4rem;
	}
	.inq_pri a {
		margin-left: 0.6rem;
		font-size: 1.3rem;
		line-height: 2.4rem;
	}
	
	.inq_pri input[type="checkbox"] + label {
		padding-left: 2rem;
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	.inq_pri input[type="checkbox"] + label:before {
		top: 0.4rem;
		width: 1.6rem;
		height: 1.6rem;
	}
	.inq_pri input[type="checkbox"]:checked + label:after {
		top: 0.4rem;
		width: 1.6rem;
		height: 1.6rem;
	}
	
	
	.jcBtnBox {
		margin: 4rem 0 0 0;
	}
	.jcBtn button {
		font-size: 1.6rem;
		line-height: 2.2rem;
		padding: 1.3rem 1rem;
	}
	
	.jcBtnFlexBox {
		display: flex;
		gap: 1rem;
		margin: 4rem 0 0 0;
		flex-direction: column;
	}
	.secessionGo {
		font-size: 1.4rem;
		line-height: 2.2rem;
		margin-top:1rem;
		opacity: 0.5;
	}
}


/* ::::::::: ======= 아이디 비밀번호 찾기 START ~ ======= ::::::::: */

.find_areaBox {
    margin-bottom: 3rem;
    position: relative;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 100;
	background: #EFEDEA;
}
.find_areaBox .msgarea {
    border-radius: 0.6rem;
    padding: 4rem 2rem;
    border: 1px solid #eee;
    font-size: 16px;
	font-family: pretendard-400;
    font-weight: 400;
    line-height: 26px;
    letter-spacing: 0em;
    text-align: center;
    /* height: 200px; */
}
.msgpadT{
	padding-top:74px!important;
}
.find_areaBox .msgarea span{
	display:block;
	margin-top:20px;
	font-size: 18px;
    font-family: pretendard-600;
	font-weight: 600;
	line-height: 22px;
	letter-spacing: 0em;
	text-align: center;
	color:#94633F;
}
.find_areaBox .msgarea span dt{
	display:inline-block;
font-size: 18px;
font-style: normal;
	font-family: pretendard-400;
font-weight: 400;
line-height: 22px;
letter-spacing: 0em;
text-align: center;
color:#94633F;
}
/* ::::::::: ======= ~ 아이디 비밀번호 찾기 END ======= ::::::::: */


/* ::::::::: ======= 회원가입 완료 START ~ ======= ::::::::: */
.jocomBtnInner {
    display: flex;
    position: Relative;
    width: 100%;
    flex-direction: column;
    gap: 1rem;
}
.jocomBtn1 a {
    display: flex;
    cursor: pointer;
    width: 100%;
    border: 1px solid #23201F;
    background: #EFEDEA;
    border-radius: 0;
    font-family: pretendard-500;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 3rem;
    letter-spacing: 0px;
    text-align: center;
    color: #23201F;
    padding: 1.4rem 1rem;
    justify-content: center;
}
.jocomBtn2 a {
    display: flex;
    cursor: pointer;
    width: 100%;
	background: #D8D5CD;
    border: 1px solid #D8D5CD;
    border-radius: 0;
    font-family: pretendard-500;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 3rem;
    letter-spacing: 0px;
    text-align: center;
    color: #23201F;
    padding: 1.4rem 1rem;
    justify-content: center;
}
@media (max-width: 767px) {
	.jocomBtn1 a,
	.jocomBtn2 a{
		font-size: 1.6rem;
		line-height: 2.2rem;
		padding: 1.3rem 1rem;
	}
}
/* ::::::::: ======= ~ 회원가입 완료 END ======= ::::::::: */