html {font-size: 10px}
body {font-family: 'NanumSquare', sans-serif; color:#222; margin:0px; padding:0px; height:100%;}
form {margin:0; padding:0;}
ul, dl,dt,dd,p {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img,a {vertical-align:middle;}
input[type="submit"] {cursor:pointer}
button {cursor:pointer; background:#fff; border:1px solid #d3d3d3;}
input::placeholder{color:#bababa}
a {color:#222; text-decoration:none}
a:hover {color:#222}

ol li{margin-left:15px;}

.form-control:focus { color: #212529; background-color: #fff; border-color: #fff; border:2px solid #4e4e4e; outline: 0; box-shadow:none;}
.form-check {border-radius:0;}
.form-check:checked {background:#4e4e4e;}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

.mt15 {margin-top:15px}


/* 로그인 */
.container .login {width:100%; max-width:450px; margin:0 auto; margin-top:120px; margin-bottom:150px; text-align:center; font-size:1.6rem; font-weight: 300;}
.container .login h3 {font-size:3rem; margin-bottom:40px; font-weight:600}
.container .login .form-control {width:100%; max-width:450px; height:40px;  margin-bottom:10px}
.container .login .form-control.pw{font-family: none;}
.container .login button {width:100%; height:50px; font-size:1.4rem; color:#fff; border:0px; background:#4e4e4e; border-radius:5px;}
.container .login .frm_btn {margin-top:20px; margin-left:2px; letter-spacing:-1px; text-align:left; color:#4e4e4e; }
.container .login .frm_btn input {width:20px; height:20px; display:inline; vertical-align:middle}
.container .login .frm_btn label {margin-left:10px; margin-right:70px}
.container .login .frm_btn a {color:#4e4e4e;}
.container .login .frm_btn span {padding:0 5px; vertical-align:middle; color:#d3d3d3}
.container .login .frm_sns_login {margin-top:50px; font-size:1.4rem;}
.container .login .frm_sns_login label {display:block; padding-top:8px;}
.container .login .frm_sns_login ul {display:flex;flex-direction: row;justify-content: center;}
.container .login .frm_sns_login li {margin-right:40px; float:left;}
.container .login .frm_sns_login li:last-child {margin-right:0px;}

@media (max-width:680px) {
.container .login {padding:0 35px; margin-top:120px;}
.container .login .frm_btn {margin-left:0;}
.container .login .frm_btn span {padding:0 3px}
.container .login .frm_btn label {margin-left:0px; margin-right:20px}
.container .login .frm_sns_login li {margin-right:8%;}
}

/* 회원가입 */
.container .join {width:100%; max-width:550px; margin:0 auto; overflow:hidden; margin-top:60px; margin-bottom:90px; font-size:1.6rem; font-weight: 300;}
.container .join h3 {font-size:3rem; margin-bottom:40px; font-weight:600; text-align:center;}
.container .join li {height:auto; overflow:hidden; clear:both; margin-bottom:20px;}
.container .join li .join_name {width:96px; height:auto; float:left; font-weight:700; line-height:48px;}
.container .join li .join_item {float:left}
.container .join li .form-control {width:450px; height:48px; font-size:1.6rem; padding-left:20px; font-family: "Noto Sans KR";}
.container .join li .form-control2 {width:255px; height:48px; font-size:1.6rem; padding-left:20px; font-family: "Noto Sans KR";}
.container .join li .form-control:focus,
.container .join li .form-control2:focus {border:2px solid #333;}
.container .join li .btn_insert,
.container .join li .btn_name_chk {width:100%; height:48px; margin-top:10px; background:#000; border:0; color:#fff; border-radius:5px}
.container .join li .btn_zip_chk {width:180px; height:48px; text-align:center; margin-left:10px; background:#000; border:0; color:#fff; border-radius:5px}
.container .join li p {font-size:1.4rem}
.container .join li .check {margin-top:20px; vertical-align:middle}
.container .join li .check input[type='checkbox'] {width:20px; height:20px;vertical-align:middle; border:1px solid #bababa}
.container .join li .check a {float:right; font-size:12px; padding-top:5px; vertical-align:bottom}
.container .join li .btn_insert {margin-top:50px}

/* 회원가입 완료  */
.page-join .success-section{width: 100%; margin: 140px 0 120px; display: flex; flex-wrap: wrap; flex-direction: column; align-items: center;}
.page-join .success-section img{width: 100px;}
.page-join .success-section p{font-size: 30px; font-weight: bold; display: inline-block; line-height: 38px;}
.page-join .success-section p.tip{font-size: 18px; color: #868e96; margin: 30px 0 60px;}
.page-join .success-section .button-box{width: 100%; display: flex; justify-content: center;}
.page-join .success-section .button-box button{width: 200px; height: 50px; font-size: 20px; font-weight: 500; border-radius: 5px; text-align: center; align-content: center; border: 1px solid #868e96; color:#212529; margin: 0 10px;}
.page-join .success-section .button-box button.btn-black{border: 0; color:white; background-color: #212529;}


/* 이용 약관 */
.policy {display:none; position:fixed; top:0; left:0; width:100%; height:100vh; background:rgba(0,0,0,0.5); z-index:11}
.policy .policy-box {width:640px; height:600px; margin:0 auto; position:relative; margin-top:120px; padding:40px; background:#fff; border-radius:15px;}
.policy .policy-close {position:absolute; border:0px; top:40px; right:40px;}
.policy .policy-box h5 {font-size:2.4rem; text-align:center; font-weight:600}
.policy .policy-box h5 .mo-br{display: none;}
.policy .policy-box .txt {border:0; border-top:3px solid #2d2c2c; border-bottom:3px solid #2d2c2c; padding:30px 0; padding-right:25px; margin-top:35px; overflow-y:auto; height:450px; width:100%; font-size:16px; line-height: 18px;}
.policy .policy-0, .policy .policy-1, .policy .policy-2 {display:none}


@media (max-width:800px) {
.container .join {padding:0 35px; margin-top:60px;}
.container .join li .join_name {width:20%}
.container .join li .join_item {width:80%}
.container .join li .form-control {width:100%;}
.container .join li .form-control2 {width:59%}
.container .join li .btn_zip_chk {width:39%;margin-left:1%; }

}


@media (max-width:600px) {
.container .join li .join_name {width:24%}
.container .join li .join_item {width:76%}
.container .join li .btn_zip_chk {width:38%;margin-left:1%; }
.container .join li .check {font-size:1.2rem;}
.container .join li .check a {letter-spacing:-1px}
}

/* 모바일 */
@media (max-width: 575px) {
	.policy .policy-box {width:90%; height: auto; padding: 40px 20px; margin-top: 180px;}
	.policy .policy-close {height: 18px; right: 20px; top: 42px;}
	.policy .policy-close img{height: 100%;}
	.policy .policy-box h5 {font-size: 18px; line-height: 22px;}
	.policy .policy-box h5 .mo-br{display: block;}
	.policy .policy-box .txt {height: 300px; padding-right: 0; font-size: 13px; line-height: 16px;}
	.policy .policy-0, .policy .policy-1,
	.policy .policy-2 {display:none}

	.page-join .success-section{font-family: Pretendard,"sans-serif"; margin: 40px 0 80px;}
	.page-join .success-section img{width: 70px;}
	.page-join .success-section p{font-size: 20px; line-height: 24px;}
	.page-join .success-section p.tip{font-size: 14px; margin: 20px 0 40px; }
	.page-join .success-section .button-box button{width: 40%; height: 46px; font-size: 16px; margin: 0 10px;}
}

@media (max-width: 340px) {
	.page-join .success-section p{font-size: 16px; line-height: 20px;}
	.page-join .success-section p.tip{font-size: 13px; }
	.page-join .success-section .button-box button{width: 40%; height: 40px; font-size: 15px; margin: 0 8px;}
}

/* 마이 페이지 */
.contents .mypage {width:100%; margin:0 auto; overflow:hidden; margin-top:100px; margin-bottom:90px; font-size:1.6rem;}
.contents .mypage .mypage-title {width:100%; height:auto; border-bottom:1px solid #e8e8e8}
.contents .mypage .mypage-title span {width:100%; max-width:1200px; margin:0 auto; display:block; font-size:3rem; margin-bottom:12px; font-weight:600; }
.contents .mypage h3 {font-size:3rem; margin-bottom:12px; font-weight:600; }
.contents .mypage .mypage-form {width:100%; max-width:1200px; margin:0 auto;  }
.contents .mypage .profile {width:100%; margin-top:10px; margin-bottom:60px; overflow:hidden; border-top:3px solid #4e4e4e; border-bottom:1px solid #e8e8e8; padding:50px 40px;}
.contents .mypage .profile .photo {width:100px; height:100px; float:left;}
.contents .mypage .profile .nick {float:left; margin:5px 40px; font-size:30px; font-weight:700}
.contents .mypage .profile .nick input[type='button'] {width:140px; height:40px; border:1px solid #d3d3d3; background:#fff; border-radius:5px; font-size:1.6rem;}
.contents .mypage .profile .nick input[type='button']:last-child {margin-left:5px;}
.contents .mypage h5 {clear:both;font-size:2rem; font-weight:700}
.contents .mypage .ul_form {border-top:3px solid #4e4e4e; margin-top:10px;}
.contents .mypage .ul_form li {height:74px; padding:16px 0px; border-bottom:1px solid #e8e8e8}
.contents .mypage .ul_form li .mypage_name {width:107px; display:inline-block; font-weight:700; line-height:40px}
.contents .mypage .ul_form li .mypage_item {display:inline-block;}
.contents .mypage .ul_form li .form-control {width:276px; height:40px; border:1px solid #d3d3d3; background:#f6f7f7; font-size:1.6rem; padding-left:10px;display:inline-block; }
.contents .mypage .ul_form li .form-control2 {width:370px; height:40px; border:1px solid #d3d3d3; background:#f6f7f7; font-size:1.6rem; padding-left:10px; display:inline-block;}
.contents .mypage .ul_form li input[type='button'] {width:130px; height:40px; margin-left:10px; font-weight:700; border:1px solid #d3d3d3; background:#fff; border-radius:5px; font-size:1.6rem; display:inline-block;}
.contents .mypage .ul_form li input[type='radio'] {width:18px; height:18px; margin-left:5px; margin-right:20px;vertical-align:middle; margin-bottom:3px;}
.contents .mypage .myMenu {margin-top:10px; margin-bottom:60px; width:100%; overflow:hidden;}
.contents .mypage .myMenu li {width:256px; height:116px; overflow:hidden; border:1px solid #d3d3d3; border-radius:5px; margin-right:10px; margin-bottom: 10px; float:left; text-align:center;  }
.contents .mypage .myMenu li:last-child {margin-right:0px;}
.contents .mypage .myMenu li a {display:block; width:100%; height:100%; padding-top:70px; font-weight:700;}
.contents .mypage .myMenu li.mymenu1 {background:url('/resources/user/img/ico_mypage1.png') center 25px  no-repeat; }
.contents .mypage .myMenu li.mymenu2 {background:url('/resources/user/img/ico_mypage2.png') center 20px  no-repeat; }
.contents .mypage .myMenu li.mymenu3 {background:url('/resources/user/img/ico_mypage3.png') center 25px  no-repeat; }
.contents .mypage .myMenu li.mymenu4 {background:url('/resources/user/img/ico_mypage4.png') center 20px  no-repeat; background-size: 30px;}
.contents .mypage .myMenu li.mymenu5 {background:url('/resources/user3/image/icon/ico_mypage5.png') center 20px  no-repeat; background-size: 50px;}
.contents .mypage .myMenu li.mymenu6 {background:url('/resources/app/img/icon/icon-heart.png') center 25px  no-repeat; background-size: 40px;}
.contents .mypage .myMenu li.mymenu7 {background:url('/resources/app/img/icon/icon-gift.png') center 15px  no-repeat; background-size: 35px;}
.contents .mypage .myMenu li.mymenu8 {background:url('/resources/app/img/icon/icon-basket.png') center 15px  no-repeat; background-size: 55px;}
.contents .mypage .myMenu li.mymenu9 {background:url('/resources/app/img/icon/icon-jewelry.png') center 15px  no-repeat; background-size: 55px;}
.contents .mypage .mypage-btn {width:100%; height:auto; position:relative; margin-top:50px; text-align:center; }
.contents .mypage .mypage-btn .leaveId {display:inline-block; height:25px; position:absolute; left:0; top:0px;  font-size:1.4rem; color:#767676; border-bottom:1px solid #767676}
.contents .mypage .mypage-btn .cancel {border:1px solid #9a9a9a; margin-right:7px}
.contents .mypage .mypage-btn .save {background:#4e4e4e; color:#fff}
.contents .mypage .mypage-btn .btn {display:inline-block; width:130px; height:50px; line-height:40px; font-size:1.6rem; }

.contents .mypage .myMenu.m-myMenu{display: none;}

@media (max-width:1200px) {
.contents {padding:0 20px;}
}

@media (max-width:830px) {
.contents .mypage .myMenu li {width:32%; margin-right:1.5%}

}

@media (max-width:720px) {
.contents .mypage .profile .nick input[type='button'] {width:100px;}
.contents .mypage .ul_form li .mypage_name {width:30%; float:left;}
.contents .mypage .ul_form li .mypage_item {width:70%;}
.contents .mypage .ul_form li .form-control {width:70%;}
.contents .mypage .ul_form li .form-control2 {width:70%;}
.contents .mypage .ul_form li input[type='button']  {width:20%; font-size: 1.4rem;}
.contents .mypage .mypage-btn .btn {width:48% }
.contents .mypage .mypage-btn {padding-bottom:50px;}
.contents .mypage .mypage-btn .leaveId {top:70px;}
}

@media (max-width:600px) {
.contents .mypage .profile {padding:5%;}
.contents .mypage .profile .photo {width:80px; height:80px;}
.contents .mypage .myMenu{display: none;}
.contents .mypage .myMenu.m-myMenu{display: block; padding-bottom: 35px; margin-bottom: 20px;}
}