@charset "utf-8";

button{border:0; padding:0; box-shadow:none; background:none; outline:none; cursor:pointer;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{-webkit-appearance: none; margin:0;}
input[type="number"]{-moz-appearance:textfield;}

.loginArea{width:100%; max-width:540px; margin:0 auto; padding:10em 0 4em 0; text-align:left; font-size:20px; color:#000;}
.loginArea .loginTitle{font-size:1.6em; font-weight:700; letter-spacing:-0.5px; line-height:1;}
.loginArea .loginText{font-size:0.85em; font-weight:400; letter-spacing:-1px; line-height:1.529; margin-top:15px;}
.loginArea .loginText strong{font-weight:900;}
.loginArea .snsLogin{width:100%; display:flex; flex-direction:column; flex-wrap:wrap; margin-top:1.5em;}
.loginArea .snsLogin > button{width:100%; height:55px; text-align:center; align-self:center; background-repeat:no-repeat; background-position:left center; background-size:cover;}
.loginArea .snsLogin > button + button{margin-top:0.75em;}
.loginArea .snsLogin > button.kakaoLogin{background-color:#fde333; background-image:url("/img/sub/kakao_login.jpg");}
.loginArea .snsLogin > button.naverLogin{background-color:#5add51; background-image:url("/img/sub/naver_login.jpg");}
.loginArea .loginBox{width:100%; margin-top:4em; min-height:650px;}
.loginArea .loginBox .loginTabs{width:100%; display:flex; text-align:center; margin-bottom:2em;}
.loginArea .loginBox .loginTabs .tabItem{width:50%; padding:0.9em 0; font-size:0.9em; font-weight:700; letter-spacing:-0.5px; line-height:1; align-self:center; background-color:#f8f8f8; border:1px solid #f8f8f8; border-bottom-color:#000; position:relative; color:#949494;}
.loginArea .loginBox .loginTabs .tabItem.on{background-color:#fff; border-color:#000; color:#000;}
.loginArea .loginBox .loginTabs .tabItem.on::after{content:""; display:block; width:100%; height:1px; background-color:#fff; position:absolute; bottom:-1px; left:0; z-index:2;}
.loginArea .loginBox .loginInput{width:100%; height:auto; display:none;}
.loginArea .loginBox #findInput .loginInput{display:block;}
.loginArea .loginBox .loginInput#tab0{display:block;}
.loginArea .loginBox .loginInput .inputBox{width:100%; height:auto; margin-bottom:1.5em;}
.loginArea .loginBox .loginInput .inputBox input[type="text"], .loginArea .loginBox .loginInput .inputBox input[type="password"], .loginArea .loginBox .loginInput .inputBox input[type="number"]{width:100%; height:50px; border:1px solid #dbdbdb; padding:0.5em 1em; text-align:left; font-family:inherit; font-size:0.8em; font-weight:400; letter-spacing:-1px; color:#000;}
.loginArea .loginBox .loginInput .inputBox input + input{margin-top:0.75em;}
.loginArea .loginBox .loginBtn{width:100%; height:55px; text-align:center; background-color:#b18e6b; font-size:1.1em; font-weight:700; letter-spacing:-0.5px; color:#fff; line-height:55px;}
.loginArea .loginBox .loginInput .memberLink{width:100%; display:flex; margin-top:2em; text-align:center;}
.loginArea .loginBox .loginInput .memberLink a{width:calc(50% - 4.5px); height:50px; border:1px solid #060606; background-color:#fff; font-size:0.8em; font-weight:700; letter-spacing:-0.5px; color:#000; line-height:48px;}
.loginArea .loginBox .loginInput .memberLink a + a{margin-left:9px;}
.loginArea .loginBox .loginInput .loginNotice{width:100%; height:auto; margin-top:2em; text-align:center; padding:1em; background-color:#f3f3f3; font-size:0.9em; font-weight:400; letter-spacing:-0.5px; line-height:1.5;}
.loginArea .loginBox .loginInput .loginNotice strong{font-weight:900; color:#ff0000;}
.loginArea .guestOrderCheck{margin-top:2em; padding-top:2em;}
.loginArea .guestOrderCheck .guestOrder{margin-top:1.5em;}
.loginArea .guestOrderCheck .guestOrder a{display:block; width:100%; height:55px; text-align:center; background-color:#b18e6b; font-size:1.1em; font-weight:700; letter-spacing:-0.5px; color:#fff; line-height:55px; margin-top:0.5em;}

.joinArea{width:1120px; height:auto; margin:0 auto; padding:5.45em 0; font-size:20px; letter-spacing:-0.5px;}
.joinArea .areaTitle{width:100%; height:auto; padding:30px 0; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-direction:row; flex-direction:row; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-bottom:1px solid #e8e8e8;}
.joinArea .areaTitle h2{display:inline-block; font-size:1.8em; font-weight:700; color:#000;}
.joinArea .areaTitle .progress{display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-direction:row; flex-direction:row; -webkit-box-pack:start; -ms-flex-pack:start; justify-content:flex-start; -webkit-box-align:center; -ms-flex-align:center; align-items:center; font-size:0.85em; font-weight:700; color:#a0a0a0;}
.joinArea .areaTitle .progress .arrow{margin:0 15px;}
.joinArea .areaTitle .progress .listItem.on{color:#b88757;}
.joinArea .allAgreeBox{width:100%; height:auto; padding-bottom:1.15em; border-bottom:1px solid #000; margin-top:2.25em;}
.joinArea .agreeBox{margin-top:2em;}
.joinArea .agreeBox .agreeText{width:100%; height:140px; padding:1em; margin-top:1em; border:1px solid #e9e9e9; background-color:#fff; font-size:0.75em; font-weight:400; letter-spacing:-0.5px; line-height:1.6; color:#363535; word-break:keep-all; overflow-y:auto;}
.joinArea .certificationBox{display:flex; justify-content:center; align-items:center; width:100%; height:auto; padding:2em 1em; background-color:#f9f9f9; margin-top:2.5em;}
.joinArea .certificationBox .inputBox{display:inline-flex; align-self:center; aling-items:center;}
.joinArea .certificationBox .inputBox + .inputBox{margin-left:3em;}
.joinArea .certificationBox .inputBox label{align-self:center; display:inline-block; font-size:0.85em; font-weight:500; letter-spacing:-0.5px; margin-right:20px; min-width:3em;}
.joinArea .certificationBox .inputBox input[type="text"]{display:inline-block; font-size:0.85em; font-family:inherit; font-weight:400; color:inherit; width:100%; max-width:168px; height:40px; border:1px solid #ccc; background-color:#fff; padding:5px;}
.joinArea .certificationBox .inputBox.call select, .joinArea .certificationBox .inputBox.call input[type="number"]{display:inline-block; width:calc(33.333% - 0.67em); max-width:100px; height:40px; border:1px solid #ccc; background-color:#fff; padding:5px;}
.joinArea .certificationBox .inputBox.call span{align-self:center; display:inline-block; width:1em; text-align:center; font-size:1em; font-weight:400; color:#000; line-height:40px;}
.joinArea select{background:#fff url("/img/bu/bu-select.png") no-repeat right; background-position:calc(100% - 5px) center;}
.joinArea .btnBox{display:flex; justify-content:center; width:100%; height:auto; margin-top:3em;}
.joinArea .btnBox > *{display:inline-block; align-self:center; text-align:center; width:calc(50% - 6px); max-width:200px; height:62px; font-size:1em; font-weight:400; letter-spacing:-1px; color:#fff; background-color:#3d3e3e;}
.joinArea .btnBox > * + *{margin-left:12px;}
.joinArea .btnBox .btnType1{background-color:#b18e6b;}

.joinArea .boxTitle{font-size:1.2em; font-weight:700; line-height:1; margin-bottom:1.1em; color:#000;}
.joinArea .joinInputArea{width:100%; margin-top:3em; position:relative;}
.joinArea .joinInputArea .joinInputBox{width:100%;}
.joinArea .joinInputArea .joinInputBox .joinInput{width:100%; height:auto; border-top:1px solid #000; margin-bottom:3em;}
.joinArea .joinInputArea .joinInputBox .joinInput .row{width:100%; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -ms-flex-line-pack:stretch; align-content:stretch; text-align:left; color:#000; padding:0.75em 1em; border-bottom:1px solid #e8e8e8;}
.joinArea .joinInputArea .joinInputBox .joinInput .row.btw{-webkit-box-pack: justify;-ms-flex-pack: justify; justify-content:space-between;}
.joinArea .joinInputArea .joinInputBox .joinInput .row > * {-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;}
.joinArea .joinInputArea .joinInputBox .joinInput .row > label{display:inline-block; width:160px; font-size:0.8em; font-weight:400; letter-spacing:-1px; position:relative;}
.joinArea .joinInputArea .joinInputBox .joinInput .row > label .require{display:block; font-size:1em; color:#ff0000; position:absolute; top:0; left:-8px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox{width:auto; -webkit-box-flex:1; -ms-flex-positive:1; flex-grow:1; overflow:hidden; max-width:calc(100% - 160px);}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox .input_text{display:inline-block;vertical-align:top;font-size:0.75em;line-height: 20px; padding : 10px 0px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox select, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox input[type="text"], .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox input[type="password"], .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox input[type="number"]{display:inline-block; vertical-align:top; width:100%; max-width:300px; height:40px; -webkit-box-sizing:border-box; box-sizing:border-box; border:1px solid #ccc; font-size:0.75em; font-weight:400; letter-spacing:-1px; color:#000; padding:0.5em; outline:none;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox select{background:#fff url("/img/bu/bu-select.png") no-repeat right; background-position:calc(100% - 5px) center;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox .floatBox{display:inline-block; vertical-align:top; overflow:hidden; width:340px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call select, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call input[type="number"], .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call span{float:left;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call select, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call input[type="number"]{width:calc(33.333% - 10px); max-width:100px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call span{display:inline-block; vertical-align:top; width:20px; text-align:center; font-size:0.75em; font-weight:400; color:#000; line-height:40px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail select, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail input[type="text"], .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail span{float:left;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail select, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail input[type="text"]{width:calc(33.333% - 10px); max-width:100px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail span{display:inline-block; vertical-align:top; width:20px; text-align:center; font-size:0.75em; font-weight:400; color:#000; line-height:40px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.birth input[type="number"], .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.birth span{float:left;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.birth input[type="number"]{width:calc(33.333% - 30px); max-width:100px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.birth span + input[type="number"]{margin-left:10px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.birth span{display:inline-block; vertical-align:top; width:20px; text-align:center; font-size:0.75em; font-weight:400; color:#000; line-height:40px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.post .dvy_new_post{max-width:150px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.post .dvy_new_post + button{margin-left:0.5em; margin-top:5px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.post .dvy_addr1, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.post .dvy_addr2{max-width:500px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.radio input[type="radio"], .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.radio input[type="checkbox"]{display:inline-block; vertical-align:top; width:20px; height:20px; -webkit-box-sizing:border-box; box-sizing:border-box; margin:0 5px 0 0;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.radio label{display:inline-block; vertical-align:top; font-size:0.75em; font-weight:400; color:#000; line-height:20px; margin-right:20px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.radio input[type="radio"]:checked + label, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.radio input[type="checkbox"]:checked + label{font-weight:700;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.refund .inRow{display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.refund select, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.refund #refund_account{width:40%; max-width:150px; margin-right:10px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.refund select + input[type="text"]{width:calc(60% - 10px);}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.complete span{font-size:0.75em; font-weight:400; margin-top:0.5em;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.complete p{font-size:0.75em; font-weight:400; margin-top:0.5em;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox .inRow{width:100%; height:auto; overflow:hidden;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox .inRow + .inRow{margin-top:0.5em;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .agreeCheck{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex; vertical-align:middle; margin-left:10px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inBtnBox{display:inline-block; width:82px;}
.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBtn{display:inline-block; vertical-align:top; width:auto; min-width:82px; height:30px; text-align:center; font-size:0.7em; font-weight:700; letter-spacing:-1px; color:#fff; line-height:30px; background-color:#3d3e3e; padding:0 1em;}

.joinArea .joinSuccess{width:100%; height:auto; text-align:center; margin-top:3em; word-break:keep-all;}
.joinArea .joinSuccess .successTitle{font-family: 'Nanum Myeongjo'; font-size:2.5em; font-weight:700; letter-spacing:-0.05em; line-height:1.3; margin-bottom:1.25em;}
.joinArea .joinSuccess .successTitle span{font-family: 'Nanum Myeongjo'; color:#b88757;}
.joinArea .joinSuccess strong{display:block; font-size:1.8em; font-weight:700; letter-spacing:-0.05em; line-height:1.3;}
.joinArea .joinSuccess strong span{color:#b88757;}
.joinArea .joinSuccess p{font-size:0.85em; font-weight:400; letter-spacing:-0.05em; line-height:1.6; margin-top:2em;}

@media (max-width:1119px) {
	.joinArea{width:100%; padding:5.45em 20px 50px 20px;}
}

@media (max-width:767px) {
	.loginArea{max-width:600px; padding:120px 30px 100px;}
	.loginArea .loginBox{min-height:auto;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox .floatBox{display:block; width:100%;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row .agreeCheck{display:block; margin-left:0; margin-top:10px;}
	.joinArea .joinSuccess p br{display:none;}
}

@media (max-width:756px) {
	.loginArea{font-size:18px;}
	.joinArea{font-size:18px;}
	.joinArea .areaTitle{padding:15px 0;}
	.joinArea .areaTitle .progress{display:none;}

	.joinArea .certificationBox{justify-content:flex-start; flex-wrap:wrap;}
	.joinArea .certificationBox .inputBox{width:100%;}
	.joinArea .certificationBox .inputBox + .inputBox{margin-left:0; margin-top:1em;}
	.joinArea .certificationBox .inputBox input[type="text"], .joinArea .certificationBox .inputBox.call select, .joinArea .certificationBox .inputBox.call input[type="number"]{max-width:none;}
	.joinArea .btnBox > *{height:50px;}
}

@media (max-width:640px) {
	.joinArea .boxTitle{margin-bottom:0.65em;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row{padding:0.75em 0.5em;}
}

@media (max-width:600px) {
	.joinArea .joinInputArea .joinInputBox .joinInput .row > label{width:100%;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row > label br{display:none;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox{width:100%; margin-top:0.5em; max-width:none;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row .inBtnBox{padding-left:0;}
}

@media (max-width:450px) {
	.joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.call span, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.mail span, .joinArea .joinInputArea .joinInputBox .joinInput .row .inputBox.birth span{width:15px;}
	.joinArea .joinInputArea .joinInputBox .joinInput .row .inBtnBox{width:70%;}
}

.designChk{display:inline-block; overflow:hidden; position:relative;}
.designChk input[type="checkbox"]{width:0; height:0; border:0; padding:0; margin:0; position:absolute; top:-100px; left:-100px; overflow:hidden;}
.designChk label{display:block; font-size:0.75em; font-weight:700; line-height:21px; padding-left:30px; color:#868686; position:relative; width:auto; height:21px;}
.designChk label.large{font-size:1.05em;}
.designChk label.medium{font-size:0.85em;}
.designChk label span{display:block; width:20px !important; height:20px; position:absolute; top:50%; transform:translateY(-50%); left:0; border:1px solid #b18e6b; background-repeat:no-repeat; background-position:center; background-size:12px 9px;}
.designChk label span.bg{background-color:#b18e6b;}
.designChk input[type="checkbox"]:checked + label{color:#000;}
.designChk input[type="checkbox"]:checked + label span.bg{background-image:url("/img/sub/color_check_w.png");}
.designChk input[type="checkbox"]:checked + label span.line{background-image:url("/img/sub/color_check_br.png");}