@charset "utf-8";


.memberLayout .login_box h3 {font-size:25px; font-weight:700; margin-bottom:20px; text-align:center; line-height: 1; color:#000;}
.login_box .form-group label {display: none;}
.login_box .form-group > div+div {margin-top:10px;}
.login_box .form-group .checkWrap {text-align:left;}
.login_box .form-group .checkWrap input {width:15px; height:15px; transform:translateY(-1px);}

.login_box .btn-wrap a {display: inline-block; width: 100%; color: #fff!important; background-color:var(--base4); line-height:1; border-radius:5px; font-size:20px; padding:16px 10px;
text-align:center; transition:all 0.2s;}
.login_box .btn-wrap a:hover {background:#112969;}
.login_box .info.box {display:flex; justify-content:center; margin-top:20px; gap:40px;}
.login_box .info.box a {display:inline-block; color:#000; font-weight:500; transform:var(--textRotate); position:relative; font-size:18px;}
.login_box .info.box > div {position:relative;}
.login_box .info.box > div+div:before {content:""; display:block; width:1px; height:16px; background:#999; position:absolute; left:-20px; top:7px;}
.login_box .info.box a:hover {color:var(--amethyst);}

.member .login .login_box {width:70%; display:grid; grid-template-columns: 320px auto; gap:50px; margin:0 auto; align-items: center; border:1px solid #e5e5e5; border-radius:10px; padding:50px;  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.03), 0 6px 6px rgba(0,0,0,0.03);}
.member .login .login_box .titBox div {display: flex; flex-direction: column; align-items: center; justify-content: center;}
.member .login .login_box .titBox div img {width:250px;}

form[class*="form-"] input[type="text"], form[class*="form-"] input[type="password"], form[class*="form-"] input[type="number"], form[class*="form-"] select, form[class*="form-"] textarea {border-left: 3px solid var(--base4); min-width:100%; border-radius:5px;}

.member .login .more {width:70%; margin:0 auto; background:#f3f3f3; border:1px solid #ddd; border-radius:10px; margin-top:20px; padding:50px; box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.03), 0 6px 6px rgba(0,0,0,0.03);}
.member .login .more {display:grid; grid-template-columns: auto auto;}
.member .login .more li {padding-right:75px;}
.member .login .more li+li {border-left:1px solid #ddd; padding-left:75px; padding-right:0;}
.member .login .more p {font-size:var(--fontSize20); font-weight:600; margin-bottom:10px; text-align: center;}
.member .login .more div {display:flex; gap:10px;}
.member .login .more div a {width: 100%; /*background:var(--base4);*/ background:#393f4c; padding:15px 20px; border-radius:5px; color:#fff; text-align:center; transition:.3s;}
.member .login .more div a:hover {background:#686f7d;}
.member .login .more li:first-child div a {background:#686f7d; transition:.3s;}
.member .login .more li:first-child div a:hover {background:#393e47;}

.member .login .more li a {font-weight:600;}


.member .login .site a {width: 100%; /*background:var(--base4);*/ background:#393f4c; padding:15px 20px; border-radius:5px; color:#fff; text-align:center; transition:.3s;}
.member .login .site {display: flex; gap:10px;}
.member .login .site a {padding-left:50px;}
.member .login .site .naver {background:#06be34 url(/images/common/i-naver.svg) no-repeat left 20px center; background-size:40px;}
.member .login .site .naver a {padding-left:45px;}
.member .login .site .kakao {color:#292717; background:#fee100 url(/images/common/i-kakao.svg) no-repeat left 20px center; background-size:40px;}

.member .idsearchWrap {display: grid; grid-template-columns: auto; width: 50%; gap: 60px; margin:0 auto;}
.member .idsearchWrap .login_box {border:1px solid #ddd; border-radius:10px;  padding:50px;  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.03), 0 6px 6px rgba(0,0,0,0.03);}
.member .idsearchWrap .titBox p {text-align:center; margin-bottom:0px; color:var(--base1); font-weight:600;}
.member .idsearchWrap .titBox .subTit {text-align:center; margin-bottom:25px;}
.member .idsearchWrap .titBox span {padding: 0 0 0 20px; background: url(/images/common/i-info.svg) 0 2px no-repeat; font-size:16px; background-size: 15px;}


.member .searchTit {margin-bottom:5px; color:var(--base3);}

.memberLayout .login_box .search_complete h3 {text-align:left;}
.memberLayout .login_box .search_complete span {color:var(--base4);}

select:focus{border-radius:5px !important;}


/* 체크박스:: */
.checkWrap_sunnong {padding:20px 0; color:#000; font-size:17px; background-color:transparent; text-align:right;}
.checkWrap_sunnong>* {display:inline-block; vertical-align:middle; line-height:1; font-weight:normal;}
.checkWrap_sunnong input {}
.checkWrap_sunnong input[type='checkbox'] { position : absolute; left : -999999px;}
.checkWrap_sunnong input[type='checkbox']+label { padding:3px 30px; padding-left:30px; background:url(/images/common/i-check.png) no-repeat left top 2px / 20px ; cursor:pointer; font-size:19px;}
.checkWrap_sunnong input[type='checkbox']:checked+label {background-image:url(/images/common/i-check-on.png);}

.checkWrap_sunnong input[type='radio'] {display:none;}
.checkWrap_sunnong input[type='radio']+label {padding:3px 0px; padding-left:30px;  background:url(/images/common/i-check.png) no-repeat left top 0px / 20px ; cursor:pointer;}
.checkWrap_sunnong input[type='radio']:checked+label {background-image:url(/images/common/i-check-on.png);}

/* ************************ 태블릿 이하(~991) ************************ */
@media (max-width: 1199px) { 

/********* 로그인페이지 ***********/
.member .login .login_box {width:100%;}
.member .login .more {width:100%;}
}

/* ************************ 태블릿 이하(~991) ************************ */
@media (max-width: 991px) { 

form[class*="form-"] input[type="text"], form[class*="form-"] input[type="password"], form[class*="form-"] input[type="number"], form[class*="form-"] select, form[class*="form-"] textarea {height:45px;}

/********* 로그인페이지 ***********/
.memberLayout .login_box {padding: 30px 0;}
.memberLayout .login_box+.login_box {margin-top:0;}
.memberLayout .login_box h3 {font-size:26px;}
.login_box .info.box a {font-size:16px; }
.login_box .btn-wrap a {font-size:18px; padding: 14px 10px;}
.termWrap h3 {text-align:center; font-size:20px;}
.checkWrap_sunnong {font-size:16px;}
.checkWrap_sunnong input[type='checkbox']+label {background: url(/images/common/i-check.png) no-repeat left top 0px / 20px; font-size:16px;}

.join .formGroup {padding:10px 0 15px;}
.join .formGroup .labelName {display:block; padding:7px 20px 7px 10px; font-size:16px;}
.join .formGroup>div p {display:block!important; padding-left:0;}
.join .formGroup>div .btn_upload p {padding-left:20px;}
.join .formGroup .labelName.empha:before {left:-1px;}
.join .formGroup .inputWrap.h0 {width:100%; gap:0px;}

.join_end {text-align:center; padding:30px 30px 0px!important; border-radius:10px; border:1px solid #ddd}
.join_end .title {font-size:20px; color:#000; font-weight:600}
.join_end .title span {color:#8d2b21;}
.join_end p {margin-top:20px; font-size:15px;}
.join_end p br {display:none;}


.member .login .login_box {width: 100%; grid-template-columns: auto;}
.member .login .more {width: 100%; grid-template-columns: auto; gap:20px;}
.member .login .more li+li {padding-left:0; border-left:0;}
.member .login .more li {padding-right:0;}

.member .idsearchWrap {grid-template-columns: repeat(1, 1fr); gap:30px;}

.member .idsearchWrap {width: 100%;}

}




/* ************************ 모바일 ************************ */
@media (max-width: 767px) { 


.memberLayout .login_box {padding: 30px 0;}
.memberLayout .login_box h3 {font-size:24px;}
.memberBtn-single li a {font-size:16px; padding:15px 50px;}
.memberLayout .join .checkWrap_sunnong {margin-top:15px;}

.checkWrap_sunnong input[type='checkbox']+label {text-align:left; line-height:1.4; padding-top:0;}

.join .h4 {font-size:18px;}
.join .formGroup .inputWrap.address .directly input {width:330px;}
.join .formGroup.attach.type1 span {flex-wrap:wrap;}
.memberLayout .agree pre, .memberLayout .privacy pre {font-size:14px;}

.member .login .more .site {flex-direction: column;}

.member .login .site {flex-direction: column;}



}



/* ************************ 모바일 ************************ */
@media (max-width: 500px) { 



.memberLayout .login_box {width:100%;}
.telWrap input:not([type=radio]):not([type=checkbox]) {width:90px!important;} 
.join .formGroup .inputWrap select, .join .formGroup .inputWrap input:not([type=radio]):not([type=checkBox]) {width:220px!important;}
.telWrap .telSpan {padding:0;}
.join .formGroup .inputWrap.address .directly input {width:100%!important;}
.join .formGroup.autoCode .inputWrap input:not([type=radio]):not([type=checkBox]) {width:100%;}
.memberBtn-single li a {padding:15px 30px;}
.join .formGroup .inputWrap>div+div {padding-left:0;}
.member .login .more div {flex-direction: column;}
.member .idsearchWrap .login_box {padding:30px;}

.member .login .login_box {gap:30px; padding:40px;}
.member .login .login_box .titBox div img {width:80%;}
.member .login .more div a {padding:14px 10px; line-height:1;}

.member .login .more p {line-height:1.4; font-size: var(--fontSize18);}

}



/* ************************ 모바일 ************************ */
@media (max-width: 375px) { 
	.member .login .login_box .titBox div img {display:none;}
	.member .login .site a {padding: 15px 0;}
	.member .login .login_box {padding:0; border:none; box-shadow:0px 0px 0px;}
	.member .login .more {padding:20px;}
	.member .idsearchWrap .login_box {padding:0; border:none; box-shadow:0px 0px 0px;}
	.member .idsearchWrap {gap:50px;}
}