@charset "utf-8";


#contents {height: 100vh;  }


/* 회원탈퇴 */
#remove-id{ position: relative;margin-top: 1.3157vw; }
#remove-id .top .prev{ position: absolute; left: 3.9473vw; top: 4.8684vw; width: 1.9736vw; height: 3.5526vw; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url(../images/sub/prev.png); }
#remove-id .top h4{ border-top: 0.2631vw solid #e5e5e5; border-bottom: 0.2631vw solid #e5e5e5; line-height: 13.1578vw; font-size: 4.6052vw; text-align: center; }
#remove-id .remove-id-in .remove-id-tit { padding: 5.2631vw 4.6052vw 3.9474vw; border-bottom: 1px solid #eee; }
#remove-id .remove-id-in .remove-id-tit p { color: #333; font-size: 4.6053vw; letter-spacing: -0.5px; font-weight: 700; }
#remove-id .remove-id-box { padding: 5.2631vw 4.6052vw;}
#remove-id .remove-id-box ul li input{ margin:0 2.2368vw 0 0; width: 5.5263vw; height: 5.5263vw; border-radius: 50%; border: 0.2631vw solid #ddd; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
#remove-id .remove-id-box ul li input:checked{ border-color: #009eff; background: url(../images/sub/pay_chk_circle.png) no-repeat center; background-size: 2.1052vw 2.1052vw;  }
#remove-id .remove-id-box ul li label{ display: block; line-height: 5.5263vw; font-size: 3.9473vw; font-weight: 500; background: no-repeat center; background-size: cover; }
#remove-id .remove-id-box ul{ display: flex; flex-wrap: wrap; }
#remove-id .remove-id-box ul li{ display: flex; margin-bottom: 4.6053vw; width: 50%; align-items: center; }
#remove-id .reason-txt {line-height: 5.5263vw; font-size: 3.9473vw; font-weight: 500;}
#remove-id #reason-txt { width: 100%; height: 27.6316vw; border: 1px solid #ddd; resize: none; padding: 3.9474vw; box-sizing: border-box; font-size: 3.9474vw; color: #333; border-radius: 1.3157vw; margin-top: 3.9474vw; margin-bottom: 5.2632vw;}
#remove-id .r-bottom p {font-size: 3.2895vw; color: #333; font-weight: 400; line-height: 5.2632vw;}
#remove-id .r-bottom .r-chk-box {display: flex; align-items: center; margin-top: 1.9737vw;}
#remove-id .r-bottom .r-chk-box input {margin: 0; width: 5.2631vw; height: 5.2631vw; border-radius: 1.3157vw; border: 0.2631vw solid #ddd;-webkit-appearance: none;-moz-appearance: none; appearance: none;}
#remove-id .r-bottom .r-chk-box input:checked {background: url(../images/checked.png) no-repeat center; background-size: cover;}
#remove-id .r-bottom .r-chk-box label {margin-left: 1.8421vw; font-size: 3.2895vw; color: #333; font-weight: 700;}

#remove-id .remove-id-agree {padding: 0 3.9473vw; margin-bottom: 8vw;}
#remove-id .remove-id-agree a {display: block; margin: 5.2631vw 0 0; width: 100%; height: 11.8421vw; border: none; line-height: 11.8421vw; border-radius: 1.3157vw; text-align: center; font-size: 3.9473vw; color: #fff; background-color: #009eff;     -webkit-appearance: none; -moz-appearance: none; appearance: none;}


/* 회원정보 */

#userInfo{ position: relative; margin-top: 1.3157vw;}
#userInfo .top .prev{ position: absolute; left: 3.9473vw; top: 4.8684vw; width: 1.9736vw; height: 3.5526vw; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url(../images/sub/prev.png); }
#userInfo .top h4{ border-top: 0.2631vw solid #e5e5e5; border-bottom: 0.2631vw solid #e5e5e5; line-height: 13.1578vw; font-size: 4.6052vw; text-align: center; }
#userInfo .user-box {}
#userInfo .user-box p .left { display: inline-block; width: 18vw; margin-right: 3.9473vw; padding-left: 4.6052vw; }
#userInfo .user-box p span { color: #333; font-size: 4.6053vw; line-height: 14.4737vw; letter-spacing: -0.5px; }
#userInfo .user-box p .right { color: #009eff; }
#userInfo .user-box p input.chg-info { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 18vw; height: 7.2368vw; color: #333; font-size: 3.2895vw; font-weight: 500; border: 0.1316vw solid #ddd; border-radius: 1.3157vw; background-color: #fff; margin-right: 4.6052vw; }
#userInfo .user-box .area-pw { overflow: hidden; display: inline-block; white-space: nowrap; text-indent: 100%; background: url(../images/sub/area-pw.png) repeat-x 0 0; background-size: 1.5789vw; width: 15.7895vw; height: 2vw; }
#userInfo .poR {position: relative; height: 14.4737vw; }
#userInfo .p01 { border-bottom: 1px solid #eee; height: 14.4737vw;}
#userInfo .p02 { border-bottom: 1px solid #eee; height: 14.4737vw;}
#userInfo .p03 { border-bottom: 1px solid #eee; height: 14.4737vw;}

.push-agree-box .check-box { font-size: 4.6053vw; line-height: 14.4737vw; color: #333; display: table; width: 100%; padding: 0 4.6052vw; border-bottom: 1px solid #eee; box-sizing: border-box; }
.push-agree-box .check-box label { display: table-cell; position: relative; }
.push-agree-box .check-box label::before { content: ''; position: absolute; display: block; top: 50%; transform: translateY(-50%); left: auto; right: 0; width: 11.8421vw; height: 5.9211vw; background: #e5e5e5; border-radius: 3.2895vw; transition: .3s ease-in; -webkit-transition: .3s ease-in; }
.push-agree-box .check-box label:after { content: ''; position: absolute; display: block; top: 50%; transform: translateY(-50%); left: auto; right: 0; width: 4.6053vw; height: 4.6053vw; margin-right: 7%; border-radius: 50%; transition: .3s ease-in; -webkit-transition: .3s ease-in; box-shadow: 1px 2px 1px 0 rgb(0 0 0 / 24%), 0 0 1px 1px rgb(0 0 0 / 12%); background: #fff; }
.push-agree-box .check-box.on label:after { margin-right: 1%; }
.push-agree-box .check-box.on label::before { background: #009eff; }

.push-agree-box .remove-id { position: relative; font-size: 4.6053vw; line-height: 14.4737vw; color: #333; display: table; width: 100%; padding: 0 4.6052vw; border-bottom: 1px solid #eee; box-sizing: border-box; }
.push-agree-box .remove-id::after {content: ''; display: block; position: absolute; right: 4.6052vw; bottom: 5.2631vw; width: 1.9737vw; height: 3.5526vw; background: url(../images/sub/next02.png) no-repeat center/cover;}

/* ================================================= 로그인 ================================================= */
input:focus{ border-color: #ff0 !important; }

#logIn{ position: relative;  box-sizing: border-box; overflow: hidden; }
#logIn .top .prev{ position: absolute; left: 3.9473vw; top: 4.8684vw; width: 1.9736vw; height: 3.5526vw; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url(../images/sub/prev.png); }
#logIn .top h4{ border-top: 0.2631vw solid #e5e5e5; border-bottom: 0.2631vw solid #e5e5e5; line-height: 13.1578vw; font-size: 4.6052vw; text-align: center; }

/* =========== 아이디 비번 입력 =========== */
#logIn .loginF-wrap .head { padding: 22.3684vw 11.1842vw 7.8947vw; box-sizing: border-box; text-align: center; font-size: 0; }
#logIn .loginF-wrap .head > img {width: 50vw;}
#logIn .loginF-wrap .head > h4 {color: #fff; font-size: 5.6842vw; font-weight: 700; letter-spacing: 5.8px; margin-top: 5.2632vw;}
#logIn .logForm{ width: 100%; padding: 0 11.1842vw; box-sizing: border-box; }
/*#logIn input.id, #logIn input.pass{ width: 100%; height: 14.0789vw;  padding-left: 4.4737vw; padding-right: 12.5000vw; border: 2px solid #8edffe; border-radius: 1.3157vw; box-sizing: border-box; font-size: 3.9473vw; -webkit-appearance: none; }*/
#logIn input.id, #logIn input.pass{ width: 100%; height: 14.0789vw;  padding-left: 4.4737vw; padding-right: 12.5000vw; border: 2px solid #ec0; border-radius: 1.3157vw; box-sizing: border-box; font-size: 3.9473vw; -webkit-appearance: none; }
#logIn input.id, #logIn input.id{margin-bottom: 2.8947vw;}
#logIn input.id::-webkit-input-placeholder, #logIn input.pass::-webkit-input-placeholder{ color: #b0b0b0; }
#logIn input.id:focus, #logIn input.pass:focus{ border-color: #009eff; }

#logIn .logForm2{ width: 100%; margin-top: 9.2105vw; padding: 0 3.9473vw; box-sizing: border-box; display: none; }
#logIn input.order-num, #logIn input.order-phone{ width: 100%; height: 11.8421vw; margin-bottom: 2.6315vw; padding-left: 4.2105vw; border: 0.2631vw solid #ddd; border-radius: 1.3157vw; box-sizing: border-box; font-size: 3.9473vw; -webkit-appearance: none; }
#logIn input.order-num::-webkit-input-placeholder, #logIn input.order-phone::-webkit-input-placeholder{ color: #aaa; }
#logIn input.order-num:focus, #logIn input.order-phone:focus{ border-color: #009eff; }
#logIn .login_input { position: relative; }
#logIn .login_input .btn_pwonoff { position: absolute; top: 0; right: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url(../images/pw-icon.png); background-repeat: no-repeat; background-position: center center; background-size: 4.3421vw; width: 12.5000vw; height: 14.0789vw; display: block; text-indent: -9999px; }
#logIn .login_input .btn_close { position: absolute; top: 0; right: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url(../images/email-icon.png); background-repeat: no-repeat; background-position: center center; background-size: 4.3421vw; width: 12.5000vw; height: 14.0789vw; display: block; text-indent: -9999px; }

/* =========== 체크박스 =========== */
#logIn .logForm .auto{text-align: center;font-size: 0; margin-top: 5.5263vw;}
#logIn .logForm .auto label{ display: inline-block;  font-size: 3.2894vw; color: #fff; vertical-align: middle; margin-left: 2.8947vw; }
#logIn .logForm .chk { outline: 0; margin: 0; appearance: none;-webkit-appearance: none; -moz-appearance: none; background-color: #fff; border: 1px solid #ddd; border-radius: 1.3158vw; box-sizing: border-box; width: 5.3947vw; height: 5.3947vw; position: relative; vertical-align: middle;}
#logIn .logForm .chk:checked {background-image: url(../images/checked.png); border: 0; background-color: #57a5f0; background-size: cover;}

/* =========== 아이디 비번 찾기 =========== */
/*#logIn .logForm .link-box a { display: inline-block; vertical-align: top; line-height: 5.3947vw; font-size: 3.9473vw; color: #666; }*/
#logIn .logForm .link-box a { 
display: inline-block;
    vertical-align: top;
    line-height: 5.3947vw;
    font-size: 4.5473vw;
    color: #666;
    text-decoration: underline;

}
#logIn .logForm .link-box a.bdr {border-right: 2px solid #9e9e9e; padding-left: 4.4737; padding-right: 4.4737vw; margin-right: 4.4737vw;}
#logIn .logForm .link-box {text-align: center; font-size: 0; margin: 7.8947vw 0 5.5263vw;}


/* =========== 로그인 회원가입 버튼 =========== */
#logIn .logForm .logIn{ display: block; width: 100%; line-height: 11.8421vw; text-align: center; height: 11.8421vw; margin-top: 6.0526vw; 
-webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; border-radius: 1.3157vw; background-color: #ec0; font-size: 3.9473vw; font-weight: 500; color: #fff; }
#logIn .logForm .join{ display: block; width: 100%; height: 13.1579vw; line-height: 13.1579vw; margin-top: 1.7862vw; border-radius: 1.3157vw; text-align: center; font-size: 3.9473vw; font-weight: 500; color: #167ad8; background-color: #fff; }




/* 아이디/비밀번호 찾기 */

#findId{ position: relative; margin-top: 1.3157vw; margin-bottom: 8vw; overflow: hidden; }
#findId .top .prev{ position: absolute; left: 3.9473vw; top: 4.8684vw; width: 1.9736vw; height: 3.5526vw; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url(../images/sub/prev.png); }
#findId .top h4{ border-top: 0.2631vw solid #e5e5e5; border-bottom: 0.2631vw solid #e5e5e5; line-height: 13.1578vw; font-size: 4.6052vw; text-align: center; }

#findId .findId-tab ul {display: flex; border-bottom: 0.2631vw solid #ddd;}
#findId .findId-tab ul li.on {color: #009eff;}
#findId .findId-tab ul li {position: relative; line-height: 13.1578vw; font-size: 4.6052vw; color: #333; letter-spacing: -0.5px; font-weight: 500; width: 50%; text-align: center;}
#findId .findId-tab ul li.on::after {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 0.3947vw; border-radius: 1.3157vw; background-color: #009eff;}

#findId .findIdForm{ width: 100%; margin-top: 9.2105vw; padding: 0 3.9473vw; box-sizing: border-box;}
#findId .findIdForm2 { display: none; width: 100%; margin-top: 9.2105vw; padding: 0 3.9473vw; box-sizing: border-box; }
#findId input.user-name, #findId input.user-phone, #findId input.user-id{ width: 100%; height: 11.8421vw; margin-bottom: 5.9211vw; padding-left: 4.2105vw; border: 0.2631vw solid #ddd; border-radius: 1.3157vw; box-sizing: border-box; font-size: 3.9473vw; -webkit-appearance: none; }
#findId input.user-name::-webkit-input-placeholder, #findId input.user-phone::-webkit-input-placeholder, #findId input.user-id::-webkit-input-placeholder{ color: #aaa; }
#findId input.user-name:focus, #findId input.user-phone:focus, #findId input.user-id:focus{ border-color: #009eff; }
#findId .findIdForm p {color: #333; font-size: 3.9474vw; font-weight: 700; line-height: 3.7105vw; margin-bottom: 2.6316vw;}
#findId .findIdForm2 p {color: #333; font-size: 3.9474vw; font-weight: 700; line-height: 3.7105vw; margin-bottom: 2.6316vw;}

#findId .findIdForm form .go-findId{ display: block; width: 100%; height: 11.8421vw; line-height: 11.8421vw; margin-top: 1.7862vw; border: 0.2631vw solid #009eff; border-radius: 1.3157vw; text-align: center; font-size: 3.9473vw; font-weight: 500; color: #fff; background-color: #009eff; }
#findId .findIdForm2 form .go-findId{ display: block; width: 100%; height: 11.8421vw; line-height: 11.8421vw; margin-top: 1.7862vw; border: 0.2631vw solid #009eff; border-radius: 1.3157vw; text-align: center; font-size: 3.9473vw; font-weight: 500; color: #fff; background-color: #009eff; }


/* ================================================= 회원가입 ================================================= */
#join{ position: relative; height: 100%; }
#join > .top { background:#CDA337; height: 23.6842vw; position: relative; top:0;}
#join > .top .prev{ position: absolute; left: 3.9473vw; top: 14.4737vw; width: 5.2632vw; height: 4.4737vw; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url(../images/arrow03.png); }
#join > .top h4{ text-align:left;font-size: 4.6053vw; font-weight: 700; color: #fff; padding-left: 12.5000vw; padding-top: 14.4737vw; }

#join .joinForm{ width: 100%; box-sizing: border-box; height: calc(100vh - 31.5789vw); }
#join .joinForm .top{ padding: 0 3.9473vw; }
#join .joinForm .top label{ position: relative; font-size: 3.9473vw; font-weight: 700; color: #333; }
#join .joinForm .top label span{ position: absolute; right: -2.5789vw; top: 1.8vw; color: #009eff; }

#join .joinForm .top input[type="text"], #join .joinForm input[type="password"],#join .joinForm .top input[type="number"]{ -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; width: 100%; height: 11.8421vw; margin: 2.7631vw auto; padding: 0 0 0 3.9473vw; border: 0.2631vw solid #ddd; border-radius: 0.6578vw; font-size: 3.9473vw; color: #333; box-sizing: border-box; }
#join .joinForm .top input[type="text"]::placeholder, #join .joinForm input[type="password"]::placeholder,#join .joinForm .top input[type="number"]::placeholder{color: #ccc; }

/* =========== 회원가입 아이디 중복 체크 =========== */
#join .joinForm .top .idChk{ display: flex; justify-content: space-between; }
#join .joinForm .top .numChk{ display: flex; justify-content: space-between; }
#join .joinForm .top .idChk input{ width: 63.1578vw; margin-right: 2.6315vw; margin-left: 0; }
#join .joinForm .top .numChk input{ width: 63.1578vw; margin-right: 2.6315vw; margin-left: 0; }
#join .joinForm .top .idChk button{ display: block; width: 26.3157vw; height: 11.8421vw; margin-top: 2.7631vw; padding: 0; border: 0.2631vw solid #009eff; border-radius: 0.6578vw; font-family: 'Noto Sans KR'; font-weight: 500; text-align: center; line-height: 11.8421vw; font-size: 3.9473vw; color: #009eff; background-color: #fff; box-sizing: border-box; }
#join .joinForm .top .numChk button{ display: block; width: 26.3157vw; height: 11.8421vw; margin-top: 2.7631vw; padding: 0; border: 0.2631vw solid #009eff; border-radius: 0.6578vw; font-family: 'Noto Sans KR'; font-weight: 500; text-align: center; line-height: 11.8421vw; font-size: 3.9473vw; color: #009eff; background-color: #fff; box-sizing: border-box; }
#join .joinForm .top .address .wrap{ display: flex; align-items: center; margin-top: 2.7631vw; }
#join .joinForm .top .address .wrap #postcode{ margin: 0 2.63157vw 0 0; width: 63.1578vw; }
#join .joinForm .top .address .wrap #search{ width: 26.3157vw; height: 11.8421vw; padding: 0; line-height: 11.8421vw; border: 0.2631vw solid #009eff; border-radius: 0.6578vw; background-color: #fff; font-family: 'Noto Sans KR'; font-weight: 500; font-size: 3.9473vw; text-align: center; color: #009eff; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

/* =========== 회원가입 주소입력 돋보기 아이콘 =========== */
/* #join .joinForm .top #address{ background: url(../images/qSearch.png) right 3.9473vw center no-repeat; background-size: 5.5263vw 5.3947vw; } */

/* =========== 이용약관 =========== */
#join .joinForm .bottom{ margin-top: 7.8947vw; padding: 0 3.9473vw 1vw; }
#join .joinForm .bottom input[type="checkbox"]{
    outline: 0;
    margin: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 1.3158vw;
    box-sizing: border-box;
    width: 5.3947vw;
    height: 5.3947vw;
    position: relative;
    vertical-align: middle; }
#join .joinForm .bottom input[type="checkbox"]:checked{ background-image: url(../images/checked.png); background-size: cover; border: 0; }

#join .joinForm .bottom ul li{ position: relative; overflow: hidden;  align-items: center; border-bottom: 1px solid #e1e1e1; padding: 5.2632vw 4.6053vw; box-sizing: border-box; font-size: 0; }
#join .joinForm .bottom ul li:last-child{border-bottom: none;}
#join .joinForm .bottom ul li .more{color: #333; float: right; background: url(../images/arrow04.png) no-repeat center right; background-size: 2.5000vw; font-size: 3.9473vw; padding-right: 3.9474vw; margin-top: 1vw;}
#join .joinForm .bottom label{ display: inline-block; vertical-align: middle; font-size: 3.9473vw; color: #333; padding-left: 2.3684vw; }
#join .joinForm .bottom label span{ color: red; }
#join .joinForm .bottom label span.blue{ color: #167ad8; }

#join .joinForm .bottom .all-btn-box {
    margin: 47.3684vw auto 7.6316vw;
    padding: 0 1.9737vw;
    background-color: #daedff;
    width: 30.6579vw;
    height: 10.9211vw;
    line-height: 9.9211vw;
    border-radius: 50px;
    box-sizing: border-box;
}
#join .joinForm .bottom .all-btn-box #chk-all {
    border-radius: 50%;
    width: 6.5789vw;
    height: 6.5789vw;
} 
#join .joinForm .bottom .all-btn-box label {
    color: #333;
    font-weight: 500;
}

#join .joinForm .next-btn-box {padding: 0 4.6053vw; box-sizing: border-box;}
#join .joinForm .join{ font-weight: 500; width: 100%; height: 13.8158vw; border-radius: 1.3157vw; border: none; background-color: #AA9164; line-height: 13.8158vw; text-align: center; font-size: 3.9473vw; color: #fff;  display: block; letter-spacing: 1.2px; }

/* ================================================= 이용약관 / 개인정보취급방침 ================================================= */
#join .agreeBg{ display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); z-index: 9; }

#join .agree{ display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 94.7368vw; height: 480px; overflow: hidden; padding: 15px 0 56px; background-color: #fff; border-radius: 1.3157vw; z-index: 10; }
#join .agree .wrap{ height: 100%; overflow-y: auto; }
#join .agree .wrap::-webkit-scrollbar{ display: none; }
#join .agree h5{ padding-top:30px; font-weight: 700; font-size: 18px; text-align: center; color: #333; }
#join .agree p{ padding: 0 20px; line-height: 20px; padding-top:30px; font-size: 14px; }

#join .close{ position: absolute; left: 0; bottom: 0; width: 100%; height: 56px; line-height: 56px; background-color: #fff; text-align: center;  }
#join .close a{ font-weight: 600; font-size: 16px; color: #009eff; }


@media only screen and (min-width:650px) {
    #contents {height: auto; overflow: visible;}
    .bg {padding-bottom: 25.0000vw; }
}