@charset "utf-8";

.fw700 {font-weight:700 !important;}

.join_tab{display:table;margin-bottom:60px;width:100%;table-layout:fixed;border-spacing:1px;border-collapse:collapse}
.join_tab .btn{display:table-cell;height:57px;line-height:57px;vertical-align:middle;text-align:center;font-size:1.8em;color:#222;border:1px solid #cecfd0;background:#f5f5f5}
.join_tab .btn.active{line-height:54px;font-weight:700;color:#222;border-top:3px solid #0075c2;border-bottom:1px solid #fff;background:#fff}

h2.join-title {font-size:3em;color:#222;font-weight:500;padding-bottom:20px;}

.join-info-wrap .process-wrap {display:flex;gap:120px;margin-bottom:40px;}
.join-info-wrap .process-wrap .item {text-align:center;}
.join-info-wrap .process-wrap .item .img {position:relative;width:160px;aspect-ratio: 1/1;display:flex;align-items: center; justify-content: center;border-radius: 50%;}
.join-info-wrap .process-wrap .item .img:after {content:'';position:absolute;right:-50%;top:50%;transform:translateY(-50%);background-image:url('../img/join/join-process-arrow.png'); width:27px;aspect-ratio:27/51;background-size:cover;}
.join-info-wrap .process-wrap .item.item-5 .img:after {content:none;}
.join-info-wrap .process-wrap .item.item-1 .img {background-color: #29b889; }
.join-info-wrap .process-wrap .item.item-2 .img {background-color: #09a6cd; }
.join-info-wrap .process-wrap .item.item-3 .img {background-color: #0075c2; }
.join-info-wrap .process-wrap .item.item-4 .img {background-color: #0550b7; }
.join-info-wrap .process-wrap .item.item-5 .img {background-color: #0b3188; }
.join-info-wrap .process-wrap .item strong {display:block;font-size:2.2em;color:#0075c2;padding-top:18px;}
.join-info-wrap .process-wrap .item .txt-1 {font-size:2.2em;color:#222;font-weight: 700;padding:5px 0;}
.join-info-wrap .process-wrap .item .txt-2 {font-size:1.6em;color:#555;font-weight: 500;}
.join-info-wrap .process-wrap .arrow {margin-top:50px;}

.join-info-wrap .type-wrap {background-color: #f7f7f7;padding:33px 75px;display: flex;}
.join-info-wrap .type-wrap > .box {width:50%;display:flex; align-items:center;gap:35px}
.join-info-wrap .type-wrap > .box .img {width:200px;aspect-ratio: 1/1;background-color:#fff;display:flex;align-items: center; justify-content: center;border-radius: 50%;}
.join-info-wrap .type-wrap > .box .text {flex:1;}
.join-info-wrap .type-wrap > .box .text .tit {font-size:2.4em;font-weight: 700;color:#222;padding-bottom:20px;}
.join-info-wrap .type-wrap > .box .text .desc {font-size:2em;color:#333;}

.join-info-wrap .benefit-table {border-top:2px solid #0075c2;}
.join-info-wrap .benefit-table table {width:100%;border-collapse:collapse;}
.join-info-wrap .benefit-table th {padding:20px 10px;font-size:1.8em;color:#222;font-weight:700;text-align:center;background:#f7f7f7;border-bottom:1px solid #ddd;}
.join-info-wrap .benefit-table th:first-child {width:27%;}
.join-info-wrap .benefit-table td {padding:22px 30px;vertical-align:middle;border-bottom:1px solid #eee;}
.join-info-wrap .benefit-table tr:first-child td {padding-top:26px;}
.join-info-wrap .benefit-table td:first-child {font-size:1.8em;color:#0075c2;font-weight:700;}
.join-info-wrap .benefit-table td:last-child {font-size:1.6em;color:#555;font-weight:400;}
.join-info-wrap .benefit-table td:last-child ul li {position:relative;padding-left:14px;line-height:1.6em;}
.join-info-wrap .benefit-table td:last-child ul li + li {margin-top:2px;}

.join-info-wrap .section-3 {margin-top:110px;}
.join-info-wrap .section-3 .join_tab { border-top:1px solid #cecfd0;border-bottom:1px solid #cecfd0; }
.join-info-wrap .section-3 .join_tab .btn {border:0;background-color:transparent;}
.join-info-wrap .section-3 .join_tab .btn.active {border-bottom:3px solid #0075c2;border-top:0;color:#0075c2;}

.join-info-wrap .join-box {display:flex;gap:40px;}
.join-info-wrap .join-box .box {width:50%;border:1px solid #ddd;display:flex;flex-direction:column;}
.join-info-wrap .join-box .box .top { min-height:250px;background-color:#fff; display:flex;flex-direction:column; align-items:center; justify-content: flex-start; padding:50px 0 0 0;}
.join-info-wrap .join-box .box .top h3 {font-size:3em;font-weight: 700;color:#222;padding-bottom:20px;}
.join-info-wrap .join-box .box .bottom { flex:1;background-color: #f9f9f9; padding:25px 48px; display:flex; flex-direction:column; justify-content:center;}
.join-info-wrap .join-box .box .bottom .tit {font-size:1.8em;color:#222;font-weight: 700;padding-bottom:8px;}
.join-info-wrap .join-box .box .bottom .desc {font-size:1.6em;color:#555;}
.join-info-wrap .join-box .btn-wrap {display:flex;gap:10px;margin-top:18px;}
.join-info-wrap .join-box .btn-wrap .link-btn {margin-top:0;}
.join-info-wrap .link-btn {padding:6px 30px;border:2px solid #0c7bc5;display:flex;align-items: center;justify-content: center;gap:10px;font-size:1.6rem;color:#0075c2;font-weight: 700;margin-top:18px;}

.join-info-wrap .join-box-info .btn_join {width:300px;height:60px;margin:90px auto 30px auto;display:flex;align-items: center;justify-content: center;gap:10px;background-color: #0c7bc5; color:#fff;font-size:2.2em;font-weight: 700;}
.join-info-wrap .join-box-info .mngr{margin: 0 auto;width: 300px;text-align: left;white-space: nowrap;padding-left:50px;line-height:40px;font-size:2em;color:#222;background:url("../img/introduce/mngr.png") no-repeat left center;}
.join-info-wrap .join-box-info .mngr b{font-size:1.05em;font-weight:700}


.step-progress{margin-bottom:60px;}
.step-progress ul{display:flex; padding:0 200px;}
.step-progress li{position:relative;flex:1;text-align:center;}
.step-progress li:before{content:'';position:absolute;top:37px;left:-50%;width:100%;height:1px;background:#dde1e8;z-index:1;}
.step-progress li:first-child:before{content:none;}
.step-progress li .num{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;width:70px;height:70px;margin:0 auto;border-radius:50%;background:#dee0ed;color:#fff;font-size:3em;font-weight:700;}
.step-progress li .txt{margin-top:14px;font-size:1.8em;color:#999;font-weight:700;}
.step-progress li.on .num{background:#0075c2;}
.step-progress li.on .txt{color:#0075c2;}




.login-wrap .join_top_text {border-bottom:2px solid #222;padding-bottom:40px;}
.login-wrap .join_top_text p {font-size:2.5em;color:#222;font-weight:700;}

.login-wrap .check_box {color:#000;font-weight:500;}
.login-wrap .all_agree {background-color:#f7f7f7;padding:20px 10px;text-align:center;margin-top:50px;}
.login-wrap .all_agree .check_box {font-weight:700;}

.login-wrap .agreebx {height:500px;border:1px solid #ddd;overflow-y:auto;padding:35px 32px;} 

.login-wrap .form_area .form_title {font-size:2.6rem;font-weight:700;}
.login-wrap .form_area .form_title_box .important {position:static;text-align:right;}
.login-wrap .table_list th span {display:block;position:relative;padding-right:15px;}
.login-wrap .table_list th span i {position:absolute;width: 10px;height: 9px;top: 50%;right:0;transform: translateY(-50%);}
.login-wrap .table_list th span i img {vertical-align:top;}
.login-wrap .table_list tbody th {font-weight:500;font-size:1.6rem;}
.login-wrap .table_list tbody th em {font-style:normal;font-size:0.9em;}
.login-wrap .table_list tbody th.vta_top {vertical-align:top;}
.login-wrap .table_list tbody td.txt span {font-size: 1.6rem;vertical-align: middle;margin-right:30px;}

.login-wrap .form_area .td-wrap {display:flex;align-items:center;}
.login-wrap .form_area .input_text.input_small {width:420px;}
.login-wrap .form_area td .btn_line {margin-right:0;min-width:120px;height:35px;line-height:35px;}
.login-wrap .small_tit {font-size:1.6rem;color:#222;font-weight:500;padding-right:25px;}
.login-wrap .small_box {display:flex;align-items:center;}
.login-wrap .small_box .input_text { width:327px;margin-right:5px; }

/* join_new_3 */
.login-wrap .form_area .half_td {display:flex;}
.login-wrap .form_area .half_td .input_text {width:340px;}
.login-wrap .form_area .half_td .td-wrap {width:50%;}
.login-wrap .form_area .half_td .small_tit {width:81px;}

.login-wrap .check_area.flex {display:flex;flex-wrap:wrap;}
.login-wrap .check_area.flex > div {display:flex;}

/* 회비 안내 표 */
.fee-table-wrap{margin-bottom:40px;}
.fee-table{width:100%;border-collapse:collapse;border-top:2px solid #111;}
.fee-table th, .fee-table td {font-size:1.6em;text-align:center;border-bottom:1px solid #ddd;border-right:1px solid #ddd;}
.fee-table th:last-child, .fee-table td:last-child {border-right:0;}
.fee-table th{padding:18px 10px;font-weight:700;color:#111;background:#f7f7f7;;}
.fee-table td{padding:16px 30px;color:#333;vertical-align:middle;}
.fee-table td:last-child{text-align:left;line-height:1.7;}

.fee-notice{padding:40px 0;}
.fee-notice .txt {position:relative;font-size:1.8em;color:#333;padding-left:10px;margin-bottom:3px; }
.fee-notice .txt.blue {color:#0075c2; font-weight:700}
.fee-notice .txt:after {content:'-';position:absolute;left:0;top:0;color:#333;}
.fee-notice .txt.no-dot:after {content:none;}
.fee-notice .txt:last-child {margin-top:40px;}

.file-upload-row{display:flex;align-items:center;border-top:1px solid #222;border-bottom:1px solid #ddd;}
.file-upload-row .label{flex:0 0 290px;font-size:1.6em;color:#222;font-weight:500;background-color:#f9f9f9;padding:25px 15px;}
.file-upload-row .label span {display:block;position:relative;padding-right:15px;}
.file-upload-row .label span i {position: absolute; width: 10px;height: 9px;top: 50%; right: 0; transform: translateY(-50%);}
.file-upload-row .label span i img {vertical-align:top;}
.file-upload-row .file-box {flex:1;padding:0 36px;}

.file-box{display:flex;}
.file-box .file-name{width:calc(100% - 126px);height:36px;border:1px solid #959595;background:#fff;padding:0 23px;font-size:1.4em;}
.file-box .btn-file{width:116px;height:36px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:1.6em;font-weight:500;color:#222;border:1px solid #222;margin-left:10px;cursor:pointer;white-space:nowrap;}
.file-box .btn-file input[type="file"]{display:none;}




/* ===== 비밀번호 수정 팝업 ===== */
.password-pop { display: none; position: fixed; inset: 0; z-index: 1000; align-items: center; justify-content: center; padding: 16px; }
.password-pop.show { display: flex; }
.password-pop .dim { position: absolute; inset: 0; background: rgba(0, 0, 0, .3); }
.password-pop .pop-inner { position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width: 100%; max-width: 600px; padding: 50px 46px 56px; background: #fff; border-radius: 16px; box-sizing: border-box;}

.password-pop .pop-head { padding-bottom: 36px; border-bottom: 2px solid #111; }
.password-pop .pop-head h2 { font-size: 3em; font-weight: 700; letter-spacing: -.5px; }
.password-pop .btn-close { position: absolute; top: 50px; right: 46px; width: 26px; height: 26px; background: none; border: 0; }
.password-pop .btn-close::before,
.password-pop .btn-close::after { content: ''; position: absolute; top: 50%; left: 50%; width: 32px; height: 1.5px; background: #aaa; }
.password-pop .btn-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.password-pop .btn-close::after { transform: translate(-50%, -50%) rotate(-45deg); }

.password-pop .form-row { display: flex; align-items: center; padding: 20px 0; border-bottom: 1px solid #e5e5e5; }
.password-pop .form-row label { flex: 0 0 125px; font-size: 1.6em; font-weight: 700; }
.password-pop .form-row .field { flex: 1; min-width: 0; }
.password-pop .form-row input { width: 100%; height: 40px; padding: 0 12px; font-size: 1.6em; border: 1px solid #ddd; border-radius: 8px;box-sizing: border-box; outline: none; }
.password-pop .form-row input:focus { border-color: #0075c2; }
.password-pop .form-row .hint { margin-top: 10px; font-size: 1.6em; line-height: 1.6; color: #333; }

.password-pop .pop-btns { display: flex; justify-content: center; gap: 11px; margin-top: 50px; }
.password-pop .pop-btns button { width: 150px; height: 58px; font-size: 2em; font-weight: 700; }
.password-pop .btn-confirm { color: #fff; background: #0075c2; border: 1px solid #0075c2; }
.password-pop .btn-cancel { color: #222; background: #fff; border: 1px solid #555; }



@media screen and (max-width:1400px) {
	.join-info-wrap .process-wrap {flex-wrap: wrap;justify-content: center;gap:50px 100px;padding:0 200px;}
    .join-info-wrap .process-wrap .item {width:calc((100% - 200px)/3);}
	.join-info-wrap .process-wrap .item .img {width:100%;}
	.join-info-wrap .process-wrap .item .img:after {right:-60px;}

	.join-info-wrap .type-wrap {flex-direction:column;gap:30px;}
	.join-info-wrap .type-wrap > .box { width:100%;}

}

@media screen and (max-width:1200px) {
	.join-info-wrap .process-wrap {padding:0 80px;}

	.join-info-wrap .join-box {flex-direction:column;}
	.join-info-wrap .join-box .box {width:100%;}
	.join-info-wrap .join-box .box .top {min-height:auto;padding:50px 0;}

	
	.login-wrap .form_area .half_td {flex-direction: column; height: auto;gap:10px;}
	.login-wrap .form_area .half_td .td-wrap {width:100%;}
	.login-wrap .form_area .half_td .input_text {width:70%;}
	
}

@media screen and (max-width:1000px) {
	.step-progress ul {padding:0 100px;}
}


@media screen and (max-width:768px) {

	.mo-none {display:none;}
	.join_tab {margin-bottom:40px;}
    .join_tab .btn{font-size: 1.6em;height: 50px;line-height: 48px;}

	.join-info-wrap .process-wrap {gap:50px;padding:0 40px;margin-bottom:20px;}
    .join-info-wrap .process-wrap .item {width:calc((100% - 100px)/3);}
	.join-info-wrap .process-wrap .item .img:after {right:-32px;width:20px;}
	.join-info-wrap .process-wrap .item .img img {height:9vw;}

	.join-info-wrap .type-wrap {padding:20px 40px;gap:15px;}
	.join-info-wrap .type-wrap > .box {gap:20px;}
	.join-info-wrap .type-wrap > .box .img {width:120px;}
	.join-info-wrap .type-wrap > .box .img img {height:70px;}
	.join-info-wrap .type-wrap > .box .text .tit {padding-bottom:10px;}

	.join-info-wrap .join-box .btn-wrap {flex-direction:column;}
	.join-info-wrap .join-box .box .top {padding:30px 0;}
	.join-info-wrap .join-box .box .top i img {height:88px;}
	.join-info-wrap .join-box .box .bottom {padding:25px 20px;}
	.join-info-wrap .link-btn {padding:6px 26px;}

	.join-info-wrap .join-box-info .btn_join {width:260px;height:45px;margin:50px auto 30px auto;}

	.login-wrap .small_box .input_text {width:60%;}
	.login-wrap .form_area .input_text.input_small {width:100%;}

	.step-progress ul {padding:0;}
	.step-progress li .num{width:52px;height:52px;}
	.step-progress li:before {top:29px;}

	.file-upload-row .label {flex:0 0 150px;}

	/* ===== 비밀번호 수정 팝업 ===== */
	.password-pop .pop-inner {width: 70%; max-width: none; padding:30px;}
	.password-pop .pop-head {padding-bottom:25px;}
	.password-pop .btn-close { top: 39px; right:30px; }
	.password-pop .btn-close::before,
	.password-pop .btn-close::after {width: 26px;}
	.password-pop .form-row input {height:38px;}
	.password-pop .pop-btns { margin-top: 30px; }
	.password-pop .pop-btns button { width: 100px; height: 48px;}

}


@media screen and (max-width:480px) {
	.join-info-wrap .process-wrap {gap:25px;padding:0;}
    .join-info-wrap .process-wrap .item {width:calc((100% - 50px)/3);}
	.join-info-wrap .process-wrap .item .img:after {right:-19px;width:12px;}
	.join-info-wrap .process-wrap .item .img img {height:11vw;}

	.join-info-wrap .type-wrap {padding:20px 30px;}
	.join-info-wrap .type-wrap > .box .img {width:80px;}
	.join-info-wrap .type-wrap > .box .img img {height:40px;}
}