/* BASIC css start */
/* button */
select {background-position:95% center;}
.cbtn{display:inline-block;font-size:11px;color:#000;min-width:98px;height:31px;line-height:32px;border:1px solid #000;text-align:center;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.cbtn.form{}
.cbtn.form.action{background-color:#000;color:#fff;}
.cbtn.form:hover{background-color:#000;color:#fff;}
.cbtn.form.action:hover{background-color:#fff;color:#000;}

.btnArea{}
.btnArea:after{content:"";display:block;clear:both;}
.btnArea .left{float:left;width:50%;}
.btnArea .right{float:right;width:50%;}
.btnArea .center{text-align:center;}

#join .page-body { width: 820px; margin: 50px auto 0;}
#join .page-tit {border-bottom:2px solid var(--pri-black); padding-bottom:20px; margin-bottom:32px;}
#join .join-form {padding-bottom:12px; border-bottom:1px solid var(--pri-black); margin-bottom:32px;}
#join .join-form > dl {display:flex; align-items:center; margin-bottom:20px;}
#join .join-form > dl > dt {width:136px; font-size:14px; font-weight:600;}
#join .join-form > dl > dt.required:after {content:'*'; display:inline-block; font-size:14px; font-weight:600; color:var(--pri-brand);}
#join .join-form > dl > dd {flex:1;}
#join .join-form > dl > dd.flex {gap:8px;}
#join .join-form > dl > dd .noti {color:var(--pri-brand); line-height:20px; font-size:13px; margin-top:6px;}
#join .join-form dl.birth dl {display:flex; align-items:center; gap:8px;}
#join .join-form dl.birth dl dd {width:120px;}
#join .join-form dl.gender {height:42px;}
#join .join-form dl.gender dd {font-size:0;}
#join .join-form dl.gender label {margin-right:8px; font-size:14px; width: 120px; display: inline-block;}
#join .join-form dl.gender label:first-child {display:none;}
#join .join-form dl.gender label:nth-of-type(2),
#join .join-form dl.gender label:nth-of-type(3) {font-size:0;}
#join .join-form dl.gender label:nth-of-type(2):after {content:'남성'; display:inline-block; font-size:14px; vertical-align: middle; line-height: 1;}
#join .join-form dl.gender label:nth-of-type(3):after {content:'여성'; display:inline-block; font-size:14px; vertical-align: middle; line-height: 1;}
#join .join-form dl.gender label input {margin-right:4px;}
#join .join-form dl.gender label input[type="radio"]:checked {background: url(/design/xexymix/new_xexy/img/pc/radio-on3.svg) transparent no-repeat center / 16px;}
#etcphone {width:376px;}
input.MS_input_sms {width:376px;}
#join .join-msg {margin-bottom:80px;}
#join .join-msg li { padding-left:2px; color:var(--gray-50); }
#join .join-msg li label { font-size:14px; font-weight:700; color:var(--pri-black); }
#join .join-msg li p {font-size:13px; line-height:19px;}
#join .join-msg li:last-child {margin-top:20px;}
#join .bottom-btn { padding:40px 0; text-align:center; }
#join .bottom-btn a { display:block; height:58px; line-height:62px; margin:0 auto; font-weight:bold; color:#fff; font-size:24px; text-align:center; letter-spacing:-1px; }

#sms_btn a,
.sms_num a,
#resms_btn a {width:96px;}

/* 약관 동의 */
#join .tb-l { text-align: left; }
#join .tb-c { text-align: center; }
#join .pl-30 { padding-left: 15px; }
#join .pl-6 { padding-left: 6px; }
#join .pt-10 { padding-top:10px; }
#join .pb-10 { padding-bottom:10px; }
#join .ml-30 { margin-left:0px !important; }
#join .p10 { padding:10px; }
#join .input-cbox { width:12px; height:12px; padding:0; margin:0; margin-top:-3px; *margin-top:1px; vertical-align:middle; *vertical-align:top; }
#join .new-btn-area { text-align: center; margin:20px 0 0; padding-bottom:30px; border-bottom:1px solid #ececec; }
#join .new-btn-area a { display:block; width:234px; height:64px; line-height:66px; margin:0 auto; font-size:22px; font-weight:bold; color:#fff; background:#0549bb; border:1px solid #053688; }
#chkwrap { border:1px solid #dedede; }
#chkwrap .all-chk { height:43px; line-height:45px; padding-left:20px; font-size:14px; font-weight:bold; color:#000; border-bottom:1px solid #dedede; }
#chkwrap .all-chk .input-cbox { width:14px; height:14px; padding:0; margin:0; margin-top:-3px; *margin-top:0; vertical-align:middle; *vertical-align:top; }
#chkwrap .cont ul:after { clear: both; content: ""; display: block; }
#chkwrap .cont ul {  width: 500px; padding-left: 30px !important; padding-bottom:15px; }
#chkwrap .cont ul li { float:left; width:220px !important; padding-left:0px; line-height:18px; letter-spacing:-1px; }
#chkwrap .cont ul li.w240 { width:240px; padding-left:0; }
#chkwrap .cont ul li a { display:inline-block; width:50px !important; height:16px; line-height:20px; *line-height:18px; font-weight:normal; font-size:11px; border:1px solid #bdbec7; background:#fafafa; text-align:center; }
#chkwrap .cont strong { color:#000; }
#chkwrap .cont label { font-weight:bold; }
#chkwrap .cont .marketing { padding-left:30px; border-top:1px dashed #dadada; line-height:18px; position: repative; }
#chkwrap .cont .marketing .mk-wrap { height:44px; line-height:46px; }
h4.tit {}

#join .form-wrap {padding:21px 20px; box-shadow: 2px 2px 9px 0px #0000001F; margin:0 0 20px; border:none; border-radius:8px;}
#join .form-wrap.active {padding:28px 20px;}
#join .form-wrap:last-child {margin-bottom:0;}
#join .form-wrap h4.form-title {font-size:14px; font-weight:700; font-family: inherit;}
#join .form-wrap h4.form-title .btn-toggle img {display:none;}
#join .form-wrap h4.form-title .btn-toggle:before {content: ""; display: inline-block; width: 7px; height: 7px; transform: rotate(135deg); border-top: 1px solid var(--pri-black); border-right: 1px solid var(--pri-black); margin: 0 0 3px 10px;}
#join .form-wrap h4.form-title.on .btn-toggle:before {transform:rotate(-45deg); margin-bottom:-2px;}
#join .form-wrap .title-wrap {position: relative;}
#join .form-wrap .title-wrap .checkbox {position: absolute; right: 0; top: 0;}
#join .form-wrap .title-wrap .checkbox label {font-size:14px; font-weight:700;}

/* 이용 약관 */
#join .privercy-contract {display:none;}
#join .privercy-contract textarea { margin-top:21px; width:100%; height:158px; }
/* 개인정보 수집이용, 제3제공, 취급위탁 테이블 */
#join .privacy-cont {padding:28px; box-shadow: 2px 2px 9px 0px #0000001F; border-radius: 8px;}
#join .privacy-cont .tit {font-size:14px; font-weight:700; margin-bottom:20px; padding-top:32px;}
#join .privacy-cont .tit:first-child {padding-top:0;}
#join .new-privercy-contract .privacy-cont input {margin:-2px 0 0 2px;}
#join .contract-tbl { width:100%; border-spacing:0; border-collapse:collapse; }
#join .contract-tbl th,
#join .contract-tbl td { border:1px solid var(--gray-15);; text-align:center; font-size:13px; color:var(--gray-40);}
#join .contract-tbl th {background:var(--gray-01);}
#join .contract-tbl td .p10 {padding:13px 8px;}
#join .contract-tbl th div { height:28px; line-height:26px; font-weight:700;}
#join .contract-tbl tbody th { font-weight:normal; }

#join .btm-msg { padding-top:30px; line-height:18px; }

.join-footer{text-align:center;padding-top:15px;}
.join-footer .cbtn.form{width:288px;height:58px;line-height:58px;font-size:16px;margin:0 5px;}


.new-privercy-contract {margin:0 auto;}
.new-privercy-contract .form-title {cursor:pointer;}
.new-privercy-contract h3 { position:relative; font-weight: bold; margin:30px 0 5px 0; text-align: left; }
.new-privercy-contract h3 span { color:#0f6efc; }
.new-privercy-contract h3 .check { position:absolute; top:0; right:0; width:70px; }
.new-privercy-contract h3 .check input { width:12px; height:12px; vertical-align:top; }
.new-privercy-contract h3.w-normal { font-weight: normal }
.new-privercy-contract .p10 {padding:10px;}
.new-privercy-contract .period {font-size:13px; font-weight:700;}
.new-privercy-contract .privacy-noti {padding:12px 0 32px; color:var(--gray-50); font-size:13px; border-bottom:1px solid var(--gray-15); margin:0;}
.new-privercy-contract .privacy-noti:last-child {border-bottom:none; padding-bottom:0;}
.new-privercy-contract input {vertical-align:middle;}
.new-privercy-contract .privercy-chk {margin-top:10px; text-align:right;}
.new-privercy-contract .privercy-chk label {color:#666;}
.privercy-contract-tap { height:35px; }
.privercy-contract textarea { width:600px; height:150px; color:var(--gray-40); }
.btn-agree {margin-top:80px;}
.btn-agree a {width:268px; margin:0 auto;}

#join_privacy_ad colgroup col:nth-of-type(1),
#join_privacy_ad colgroup col:nth-of-type(3) {width:104px !important;}

/* BASIC css end */

