@charset "utf-8";

/* 마이페이지 */
.mypage-title {font-size:28px; font-weight:500; line-height:1.2em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom:40px;}

.leave-wrap {display:flex; justify-content:space-between; padding:var(--size35) var(--size30); background:#000; border-radius:5px; align-items:center; margin-top:var(--size50);}
.leave-wrap p {position:relative; font-size:var(--font-size-14); line-height:1.2em; letter-spacing:-0.04em; color:#eee;}
.leave-wrap.ver2 {padding:40px; margin-top:0; margin-bottom:40px;}

/* 쇼핑내역 */

.order-list {border-top:1px solid #686868;}
.order-list ul li {display:flex; align-items:center; padding:30px 0; border-bottom:1px solid #ddd;}
.order-list ul li .order-img {width:150px; margin-right:25px;}
.order-list ul li .order-img a {display:block; position:relative; padding-bottom:100%; overflow:hidden;}
.order-list ul li .order-img a img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.order-list ul li .order-img a:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}

.order-list ul li .order-info {flex: 1 1 auto; min-width: 0; width: 1%;}
.order-list ul li .order-range {font-size:18px; font-weight:600; letter-spacing:-0.03em; line-height:1.2em; color:#242424; text-align:center;}
.order-list ul li .order-range a {display:block; margin-top:8px; text-decoration:underline; color:#e61e44;}
.order-list ul li .more {margin-left:80px;}
.order-list ul li .more a {padding:14px 24px; display:inline-block; border:1px solid #686868; border-radius:5px; font-size:18px; font-weight:500; line-height:1em; letter-spacing:-0.03em; color:#454545;}
.order-list ul li .more a:hover {border-color:#e61e44; color:#fff; background:#e61e44;}
.order-list ul li dl {display:flex; align-items:center; line-height:1.2em; letter-spacing:-0.03em; color:#454545; font-weight:400; margin-bottom:12px;}
.order-list ul li dl:last-child {margin-bottom:0;}
.order-list ul li dt {min-width:80px;}
.order-list ul li dd {font-weight:500; color:#242424;}
.order-list ul li.none {display:block; padding:100px 0; text-align:center; border-bottom:none;}
.order-list ul li.none .img {margin-bottom:17px;}
.order-list ul li.none .tt {font-size:20px; font-weight:400; line-height:1.2em; letter-spacing:-0.03em; color:#686868;}



/* 내정보 */

.leave-table .table-cap {position:relative;font-size:17px; font-weight:600; line-height:1.2em; letter-spacing:-0.03em; color:#e61e44; margin-bottom:13px;}

.leave-table table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:1px solid #ddd;}
.leave-table th {font-size:18px; font-weight:700; line-height:1.2em; letter-spacing:-0.03em; color:#242424; padding:25px 0; padding-left:40px; text-align:left;}
.leave-table td {font-size:16px; font-weight:400; line-height:1.2em; letter-spacing:-0.03em; color:#242424; padding:15px 20px;}
.leave-table th,
.leave-table td {border-bottom:1px solid #ddd;}
.leave-table td input {border-radius:5px;}


/* 로그인 */
.login-area {max-width:500px; margin:0 auto;}

.login-area .wrap {}
.login-area .group {margin-bottom:10px;}
.login-area .group:last-child {margin-bottom:0;}
.login-area .group .input {display:block; width:100%; border:0; height:50px; border-radius:4px; background:#373737; color:#eee;}
.login-area .links {display:flex; justify-content:space-between; margin-top:40px; color:#505050; font-weight:500; line-height:1.2em;}
.login-area .links a:hover {text-decoration:underline;}
.login-area .links .bar {display:inline-block; vertical-align:middle; margin:-.2em 12px 0; width:1px; height:18px; background:#a8a8a8;}
.login-area .btn-pack {display:block; width:100%; margin-top:40px;}
.login-area .btn-pack:last-child {margin-top:10px;}

.login-area .btn-pack.white {margin-top:40px;}
.login-area .btn-pack.xlarge {line-height:32px; height:34px; font-size:var(--font-size-16);}

/* 로그인 2차 */
.login-wrap {max-width:400px; margin:0 auto;}
.login-box {}
.login-box .input-group {position:relative; margin-bottom:12px;}
.login-box .input-group .input {display:block; width:100%; height:50px; border-color:#6e6e73; border-radius:4px; background:#262628; color:#eee; font-size:16px; font-family:inherit; transition:0.4s;}
.login-box .input-group .input::placeholder {color:#777;}
.login-box .input-group .input:focus {outline:0; border-color:#494db1;}
.login-box .code-box {text-align:center;}
.login-box .code-items {display:flex; gap:25px; margin-bottom:24px;}
.login-box .code-item {flex:1; text-align:center;}
.login-box .code-item .input {display:block; width:100%; height:54px; border-color:#6e6e73; border-radius:4px; background:#262628; padding:0; color:#eee; font-size:18px; font-weight: 600; font-family:inherit; transition:0.4s; text-align:center;}
.login-box .code-item .input::placeholder {color:#777;}
.login-box .code-item .input:focus {outline:0; border-color:#494db1;}
.login-box .resend-btn {display:inline-block; padding:10px 20px; border:1px solid #6e6e73; border-radius:50px; font-size:14px; line-height:1.2em; letter-spacing:0em; color:#eee; background:#262628; cursor:pointer; transition:0.4s;}
.login-box .resend-btn:hover {background:#000;}
.login-box .submit {display:block; width:100%; height:48px; margin-top:24px; border:0; border-radius:50px; font-size:16px; font-weight:700; line-height:1.2em; letter-spacing:0em; color:#fff; background:#494db1; cursor:pointer; transition:0.4s;}
.login-box .submit:hover {background:#282eba;}
.login-etc {text-align:center; margin-top:36px; padding:32px 0; color:#eee; font-size:16px; line-height:1.5em; border-top:1px solid #343434;}
.login-etc a:hover {opacity:.7;}
.sns-login {display:flex; flex-direction:column; gap:8px;}
.sns-login .link-item {position:relative; display:flex; align-items:center; justify-content:center; padding:14px 60px; background:transparent; border:1px solid #7c7c7c; border-radius:50px; font-size:16px; font-weight:700; line-height:1.2em; letter-spacing:0; color:#eee; cursor:pointer; transition:0.4s;}
.sns-login .link-item .icon {position:absolute; left:22px; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:24px;}
.sns-login .link-item .text {flex:1; text-align:center;}
.sns-login .link-item:hover {background:#343434;}

.password-toggle {position: absolute; right: 12px; top: 50%; transform: translateY(-50%); background: none; border: none;  cursor: pointer; color: #eee;}
.password-toggle .icon-eye-off {display: block;}
.password-toggle .icon-eye-on {display: none;}
.password-toggle.active .icon-eye-off {display: none;}
.password-toggle.active .icon-eye-on {display: block;}


/* 약관동의 */
.agree-wrap {max-width:680px; margin:0 auto 50px;}
.agree-wrap .group {margin-top:40px;}
.agree-wrap .group:first-child {margin-top:0;}
.agree-wrap .agree-tit {color:#eee; font-size:20px; font-weight:500; line-height:1.3em; letter-spacing:-.03em;}
.agree-wrap .agree-tit .checkbox label:before {width:24px; height:24px; background:#373737 url("../images/member/checkbox.png") 50% 50% no-repeat; border:2px solid #373737; border-radius:100%;}
.agree-wrap .agree-tit .checkbox input:checked + label:before {background-color:#0047ab; border-color:#0047ab; background-image:url("/images/member/checkbox_on.png");}
.agree-wrap .agree-box {position:relative; max-height:175px; margin-top:17px; padding:16px 20px; background: #262628; border:1px solid #6e6e73; border-radius:8px; overflow:auto;}
.agree-wrap .agree-box::-webkit-scrollbar {width:6px; height:6px; border-radius:3px; background-color:transparent;}
.agree-wrap .agree-box::-webkit-scrollbar-thumb {background: rgba(255,255,255,0.2); border-radius:3px;}
.agree-wrap .agree-box .terms-wrap {color:#888; font-size:14px;}
.agree-wrap .agree-box .terms-wrap .sec {margin-bottom:20px;}
.agree-wrap .agree-box .terms-wrap .sec h3 {color:#767676; font-size:14px; font-weight:400; margin-bottom:0;}
.agree-wrap .agree-box .terms-wrap .sec strong {font-weight:400;}

.terms-wrap {font-weight:300; color:#666; line-height:1.75em; letter-spacing:-.03em;}
.terms-wrap .sec {margin-bottom:40px;}
.terms-wrap .sec h3 {color:#222; font-size:1.1em; font-weight:500; margin-bottom:7px;}
.terms-wrap .sec p {margin-bottom:1em;}
.terms-wrap .sec strong {font-weight:500;}
.terms-wrap .sec ol li {padding-left:1em; text-indent:-1em;}
.terms-wrap .sec ol li ol li {padding-left:1.35em; text-indent:-1.35em;}
.terms-wrap .policy-contact {display:flex; padding:20px 0; background:#fafafa; border:1px solid #e5e5e5; margin-bottom:1em;}
.terms-wrap .policy-contact dl {flex:1; padding:0 20px; border-left:1px solid #e5e5e5;}
.terms-wrap .policy-contact dl:first-child {border-left:0;}
.terms-wrap .policy-contact dt {font-weight:500; color:#333; margin-bottom:12px;}
.terms-wrap .table {margin:10px 0;}
.terms-wrap .table table {width:100%; border-collapse:collapse; border-spacing:0px;}
.terms-wrap .table th {padding:10px; border:1px solid #dfdfdf; background:#fafafa; font-weight:500; color:#333;}
.terms-wrap .table td {padding:10px; border:1px solid #dfdfdf; text-align:center; font-weight:300; color:#666;}
.terms-wrap .table td b {font-weight:500;}


/* 회원가입 */
.join-form {position:relative;}

.join-form-wrap .join-title {margin-bottom:10px; padding:0 var(--container-space);}
.join-form-wrap .join-title h3 {font-size:18px; font-weight:700; line-height:1.2em; letter-spacing:-0.04em; color:#888;}
.join-form-wrap .join-title p {letter-spacing:-0.04em; color:#888;}
.join-form-wrap .table-cap {margin-bottom:var(--size40); font-weight:400; color:#eee; text-align:right;}
.join-form .join-form-txt {color:#505050; font-weight:300; line-height:1.4em; margin-bottom:12px;}
.join-form {padding-bottom:var(--size40); border-bottom:1px solid #343434;}
.join-form table {width:100%; border-collapse:collapse; border-spacing:0px;}
.join-form table th {padding:5px var(--size30); height:50px; font-weight:700; letter-spacing:-0.04em; color:#eee; text-align:left;}
.join-form table th small {font-weight:400; color:#686868; line-height:1.3em;}
.join-form table td {padding:5px; font-weight:400; line-height:1.4em; letter-spacing:-0.04em; color:#999;}
.join-form input[readonly] {background:#000; color:#999;}
.join-form .input {border:0; border-radius:5px; height:50px; color:#777; background:#373737;}
.join-form .input::placeholder {color:#878787}
.join-form .item {margin-top:10px; display:inline-block;}
.join-form .radiobox {margin-right:30px; font-weight:500;}
.join-form .help-text {display:inline-block; margin-left:10px; color:#767676;}
.join-form + .buttons {margin-top:50px;}

.join-tit-wrap {display:flex; justify-content:space-between; width:100%; max-width:800px; margin:45px auto 20px auto;}
.required {color:#0047ab !important;}

/* 회원가입 2차 */
.sign-in {max-width:400px; margin:0 auto;}
.sign-in .title {margin-bottom:32px; color:#888;}
.sign-in .title h3 {margin-bottom:10px; font-size:18px; font-weight:700; line-height:1.3em;}
.sign-in .title p {line-height:1.33em; letter-spacing:-0.03em; color:#888;}
.sign-in .form {padding:32px 0; border-top:1px solid #343434; border-bottom:1px solid #343434;}
.sign-in .form .input-group {position:relative; margin-bottom:12px;}
.sign-in .form .input-group .input {display:block; width:100%; height:50px; border-color:#6e6e73; border-radius:4px; background:#262628; color:#eee; font-size:16px; font-family:inherit; transition:0.4s;}
.sign-in .form .input-group .input::placeholder {color:#777;}
.sign-in .form .input-group .input:focus {outline:0; border-color:#494db1;}
.sign-in .form .input-group .input.datepicker2 {padding-right:40px; background:#262628 url('/images/bbs/calendar.svg') right 10px center no-repeat;}
.sign-in .btns {margin-top:50px; display:flex; gap:10px; justify-content:center;}
.sign-in .btn {display:inline-flex; justify-content:center; align-items:center; min-width:90px; height:34px; padding:0 20px; text-align:center; border:0; border-radius:50px; font-size:16px; font-weight:500; line-height:1.2em; letter-spacing:0em; color:#fff; background:#494db1; cursor:pointer; transition:0.4s;}
.sign-in .btn:hover {background:#282eba;}

/* 가입완료 */
.join-complete {text-align:center;}
.join-complete .tit {color:#eee; font-size:28px; font-weight:500; line-height:1.4em; letter-spacing:-.03em; margin-bottom:30px;}
.join-complete .txt {color:#eee; font-size:18px; line-height:1.8em; letter-spacing:-.03em;}
.join-complete .icon {width:180px; height:180px; background:#333 url("../images/member/complete.png") 50% 50% no-repeat; border-radius:100%; margin:36px auto 45px;}
.join-complete .buttons {margin:0;}


/* 게정찾기 */
.find-area {max-width:470px; margin:20px auto 0;}
.find-tab {text-align:center; margin-bottom:20px;}
.find-tab ul {display:flex;}
.find-tab ul li {flex:1;}
.find-tab ul li a {display:flex; align-items:center; justify-content:center; height:50px; background:#373737; font-size:15px; font-weight:400; line-height:1.2em; letter-spacing:-0.03em; color:#eee; position:relative; border:1px solid #343434;}
.find-tab ul li.active a {background:#000;}
.find-tab ul li:first-child a {border-radius:0.5em 0 0 0.5em;}
.find-tab ul li:last-child a {border-radius:0 0.5em 0.5em 0;}

.find-content .group {margin-bottom:8px;}
.find-content .group .input {display:block; width:100%; background:#373737; border:0;}
.find-content .btn-pack {display:block; width:100%; margin-top:20px;}
.find-content .btn-pack.focus {margin-top:30px;}
.find-content .btn-pack.xlarge {font-weight:500;}
.find-result {text-align:center; padding:34px 42px; color:#eee; font-size:18px; font-weight:300; line-height:1.75em; letter-spacing:-.03em; background:#373737;}
.find-result h4 {font-size:22px; font-weight:500; line-height:1.4em; letter-spacing:-.03em; margin-bottom:20px;}
.find-result p:first-child {margin-bottom:10px;}
.find-result .name {color:#eee; font-size:30px; font-weight:700; line-height:1.5em;}

/* 회원탈퇴 */
.mypage-leave .sub-txt {font-size:17px; font-weight:400; line-height:1.7em; letter-spacing:-0.03em; color:#454545; margin-bottom:48px;}
.leave-info {display:flex; align-items:center; padding:40px 45px; border-radius:5px; background:#f5f5f5; margin-bottom:80px;}
.leave-info .icon {margin-right:30px;}
.leave-info ul {flex: 1 1 auto; min-width: 0; width: 1%;}
.leave-info ul > li {margin-bottom:5px;}
.myinfo-info {display:flex; justify-content:space-between; margin-top:150px; background:#f5f5f5; padding:45px; border-radius:5px; align-items:center;}
.myinfo-info .list02 {margin-top:0;}

.member-leave .txt {text-align:center; color:#eee; line-height:1.7em; letter-spacing:-.03em; margin-bottom:40px;}
.member-leave .txt .tit {color:#eee; font-size:20px; line-height:1.5em; margin-bottom:15px;}
.member-leave .form {max-width:470px; margin:0 auto 40px; padding:50px; color:#eee; font-size:16px; line-height:1.5em; background:#373737; border:1px solid #343434; border-radius:10px;}
.member-leave .form .group {display:flex; align-items:center; margin-bottom:20px;}
.member-leave .form .group:last-child {margin-bottom:0;}
.member-leave .form .group .label-tt {width:90px; color:#eee; font-weight:500;}
.member-leave .form .group .text-id,
.member-leave .form .group .input {flex:1 1 auto; min-width:0; width:1%;}