@charset "utf-8";

/* ### 기본 스타일 커스터마이징 시작 ### */
.mbskin {text-align:center;margin:0 auto; min-height:100%; background: #fff;}
.mbskin h1 {font-size:1.75em;margin:40px 0 25px}
.mbskin p {padding-bottom:20px;border-bottom:1px solid #c8c8c8}
.mbskin p strong {color:#000;padding-bottom:5px;display:block;font-size:1.083em}
.mbskin .btn_submit {
	display:block;width:100%;height:46px;line-height:46px;padding:0 10px;border:0;font-weight:bold;
	background:#206041;color:#fff;border-radius:5px
}
/* ### 기본 스타일 커스터마이징 끝 ### */

/* 회원가입 공통 */
.register {padding:0 17px 15px; background: #fff;}

/* 회원가입 약관 */
#fregister section {position:relative;background:#fff;padding:0}
#fregister_chkall {position:relative;font-weight:bold;text-align:left;background:#fff;padding:15px;border-top:1px solid #e5e9f0;border-bottom:1px solid #e5e9f0;border-radius:3px}
#fregister h2 {text-align:left;padding-bottom:15px;line-height:1.7em;font-size:1.4em}
#fregister textarea {
	display:block;width:100%;height:100px;padding:10px;background:#fff;
	border:1px solid #AAAAAA80;line-height:1.5em;color:#555; border-radius: 5px;
	margin-bottom: 10px; resize: none; overflow: auto;
}
#fregister p {position:relative;text-align:left;color:#fff;line-height:18px;padding:15px;font-size:1.1em;background:#f2838f;margin:15px;border-radius:5px}
#fregister p:before {content:"";position:absolute;top:0;left:0;width:5px;height:100%;border-radius:5px 0 0 5px;background:#da4453}
#fregister p i {font-size:1.2em;vertical-align:middle}
#fregister .btn_confirm {margin:15px 10px}
#fregister_private .tbl_head01 {margin:0 0 10px}
#fregister_private .tbl_head01 caption {position:absolute;font-size:0;line-height:0;overflow:hidden;top:0;color:#fff}

/* 회원가입 입력 */
#fregisterform .btn_confirm {text-align:center;margin:20px 0 0}
#fregisterform .btn_confirm .btn_submit {
	width:100%;height:50px;padding:0 30px;font-weight:bold;font-size:1.3em;
	background: #206041; border-radius: 5px; color:#fff; border:0
}
#fregisterform .btn_confirm .btn_cancel {width:49%;line-height:45px;height:45px;padding:0 30px;font-weight:bold;border-radius:3px;border:1px solid #dcdcdc;font-size:1.083em;background:#fff}
#fregisterform .cert_req {margin-left:5px;line-height:28px;}

#fregisterform #reg_mb_email, #fregisterform .frm_address {width:100%}
#fregisterform #msg_certify {margin:5px 0;padding:5px;border:1px solid #dbecff;background:#eaf4ff;text-align:center}
#fregisterform .frm_address,
#fregisterform .password {margin:-1px 0 0}
#fregisterform #mb_addr3 {display:block;margin:5px 0 0}
#fregisterform #mb_addr_jibeon {display:block;margin:5px 0 0}
#fregisterform .form_01 {margin-bottom:30px}
#fregisterform .form_01 h2 {font-size:1.6em;padding:20px 0; text-align: center; color:#206041}
#fregisterform .frm_label {display:block;font-size:14px;padding:8px 0;color:#206041; font-weight:700}
#fregisterform .btn_frmline {margin-bottom:5px;width:auto;height:30px;line-height:30px;padding:0 10px;font-weight:bold}
#fregisterform .rgs_name_li button {margin:5px 0 0;width:auto}
#fregisterform .reg_mb_img_file {margin-bottom:30px}
#fregisterform .reg_mb_img_file img {max-width:100%;height:auto}
#fregister_private .fregister_agree {margin-bottom:30px;}

.filebox .fileName {display:inline-block;position:relative;width:100%;height:45px;padding-left:10px;margin-right:5px;line-height:30px;border: 1px solid #d0d3db;background-color:#fff;color:red;vertical-align:middle}
.filebox .btn_file {display:inline-block;position:absolute;right:8px;top:8px;border:1px solid #3a8afd;border-radius:3px;width:70px;height:30px;color:#3a8afd;font-size:1em;line-height:30px;font-weight:bold;text-align:center;vertical-align:middle}
.filebox input[type="file"] {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

.adress {background:red;width:100%}
.adress #reg_mb_zip {width:100%;position:relative}
.adress .btn_frmline {position:absolute;top:8px;right:15px;height:40px;padding:0 10px;border-radius:3px}

.chk_box {position:relative}
input[type="checkbox"] + label {padding-left:22px;color:#206041; font-weight: 500; position: relative;}
input[type="checkbox"] + label:hover{color:#206041}
input[type="checkbox"] + label span {position:absolute;top:0;left:0;width:15px;height:15px;display:block;background:#fff;border:1px solid #20604180;border-radius:4px}
input[type="checkbox"]:checked + label {color:#206041}
input[type="checkbox"]:checked + label span {
	background:url('./img/chk.png') no-repeat 50% 50% #206041;border:0;border-radius:3px;
	background-size: 70% auto;
}
.chk_li {padding-left:10px;line-height:20px}

.selec_chk {position:absolute;top:0;left:0;width:0;height:0;opacity:0;outline:0;z-index:-1;overflow:hidden}
.fregister_agree.chk_all input[type="checkbox"] + label span {top:15px}


/* 회원가입 완료 */
#reg_result {padding:20px 10px 10px}
#reg_result #result_email {margin:20px 0;padding:10px 50px;border-top:1px solid #eee;border-bottom:1px solid #eee;background:#fff;line-height:2em}
#reg_result #result_email span {display:inline-block;width:150px}
#reg_result #result_email strong {color:#e8180c;font-size:1.2em}
#reg_result h2 {text-align:center;font-size:1.25em;margin:0 0 10px}
#reg_result h2 strong {color:#ed6478}
#reg_result p {line-height:1.7em}
#reg_result .btn_confirm {margin:20px 0 30px}
#reg_result .reg_result_wr {background:#fff;padding:10px 20px}
#reg_result .reg_cong {margin:10px 0;font-size:1.083em;font-weight:bold}
#reg_result .reg_cong strong {color:#3497d9}
#reg_result .btn_confirm a {display:inline-block;padding:0 20px;height:40px;line-height:38px;border:1px solid #ed6478;color:#ed6478;border-radius:3px;font-weight:bold}

/* 아이디/비밀번호 찾기 */
#find_info h3 {display:none;margin-bottom:30px;text-align:center;font-size:1.1em;}
#find_info.cert h3 {display:block;}
#find_info #info_fs p {margin:0 0 10px;line-height:1.5em;font-size:0.92em;color:#4162ff}
#find_info #info_fs #mb_email {width:100%}
#find_info #captcha {margin:5px 0}
#find_info .find_btn .btn_submit {margin:5px 0;width:100%;}

/* 비밀번호 재설정 */
#pw_reset #info_fs {margin-bottom: 10px}
#pw_reset .frm_input {margin:10px 0 0}

/* 기존 회원 본인인증 */
#member_cert_refresh section {position:relative;background:#fff;border-bottom:1px solid #e5e9f0;padding:15px}
#member_cert_refresh_chkall {position:relative;font-weight:bold;text-align:left;background:#fff;padding:15px;border-top:1px solid #e5e9f0;border-bottom:1px solid #e5e9f0;border-radius:3px}
#member_cert_refresh h2 {text-align:left;padding-bottom:15px;line-height:1.7em;font-size:1.4em}
#member_cert_refresh textarea {display:block;width:100%;height:180px;padding:10px;background:#fbfbfb;border:1px solid #d1d7d8;line-height:1.5em;color:#555}
#member_cert_refresh p {position:relative;text-align:left;color:#fff;line-height:18px;padding:15px;font-size:1.1em;background:#f2838f;margin:15px;border-radius:5px}
#member_cert_refresh p:before {content:"";position:absolute;top:0;left:0;width:5px;height:100%;border-radius:5px 0 0 5px;background:#da4453}
#member_cert_refresh p i {font-size:1.2em;vertical-align:middle}
#member_cert_refresh .btn_confirm {margin:15px 10px}
#member_cert_refresh_private .tbl_head01 {margin:0}
#member_cert_refresh_private .tbl_head01 caption {position:absolute;font-size:0;line-height:0;overflow:hidden;top:0;color:#fff}
.member_cert_refresh_agree input[type="checkbox"] + label {color:#676e70}
.member_cert_refresh_agree input[type="checkbox"] + label:hover {color:#2172f8}
.member_cert_refresh_agree input[type="checkbox"] + label span {position:absolute;top:20px;right:15px;width:17px;height:17px;display:block;background:#fff;border:1px solid #999;border-radius:3px}
.member_cert_refresh_agree input[type="checkbox"]:checked + label {color:#000}
.member_cert_refresh_agree input[type="checkbox"]:checked + label span {background:url('./img/chk.png') no-repeat 50% 50% #3a8afd;border-color:#1471f6;border-radius:3px}
.member_cert_refresh_agree.chk_all input[type="checkbox"] + label span {top:15px}

#member_cert_refresh #find_info .find_btn > div {margin:10px 0;padding:0}

/* 로그인 */
#mb_login {}
#mb_login h1 {
	font-size:2em;text-align:center;padding:18% 0 0; margin:0; color:#206041;
	font-weight: 700;
}
#mb_login h2 {margin:0}
#mb_login p {padding:10px 0;line-height:1.5em}
#mb_login #login_frm {position:relative;padding:20px 0 10px}
#mb_login #login_frm div {margin:10px 0 20px;text-align:left}
#mb_login .frm_input {
	width:100%;margin:5px 0; border:1px solid #20604180; border-radius: 5px; padding:5px 13px;
	color:#555; font-size:13.5px;
}
#mb_login .frm_input::placeholder {color:#20604199}
#mb_login .frm_input.no_login_view {font-weight: 700; color:#206041; font-size:1.1em; margin-top:8px}
#mb_login #login_info label {padding-left:21px; color:#20604199; font-weight: 500; font-size:0.9em}
#mb_login .btn_submit {
	width:100%;border-radius:5px;height:46px;margin:10px 0 0;font-size:1.2em;font-weight:bold
}
#mb_login .mb_login_join {padding:0 0 15px}
#mb_login .mb_login_join:after {display:block;visibility:hidden;clear:both;content:""}
#mb_login .mb_login_join h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#mb_login .mb_login_join a {display:block;float:left;width:auto;color:#206041CC; font-weight:600; font-size:1.05em}
#mb_login .mb_login_join a:last-child {float: right; border-bottom: 1px solid #206041CC;}
#login_password_lost {border-right:1px solid #cdcdcd}

#flogin {background:#fff;margin:10px 0}

#mb_login_notmb {background:#fff;border-bottom:0;padding:50px 0}
#mb_login_notmb h2 {font-size:19px; color:#206041}
#mb_login_notmb p {border:0;padding:0;margin:10px;}
#mb_login_notmb p.greentext {color:#206041; font-weight:500; margin-bottom:30px; font-size:12px;} 
.privacy_in h3 {text-align: left; color:#206041; font-size:14px;}
#guest_privacy {
	border:1px solid #ddd;text-align:left;line-height:1.6em;color:#666;
	background:#fff;padding:3px 6px;height:125px;margin:10px 0;overflow-y:auto;
	border-radius: 7px; overflow-x: hidden;
}
#guest_privacy::-webkit-scrollbar-track {background: transparent; overflow: hidden; margin:2px;}
#guest_privacy::-webkit-scrollbar {width:10px; display:block; }
#guest_privacy::-webkit-scrollbar-thumb {
    background: #BCCFC5; /* 스크롤바 막대 색상 */
    border: 2px solid #fff; /* 스크롤바 막대 테두리 설정  */
    border-radius: 5px;
	width:10px;
	margin:2px;
}
.bottom_cs_btn {
	position: fixed; bottom:18px; left:50%; transform: translateX(-50%);
	color:#20604199; text-decoration: underline; font-weight: 500; font-size:14px
}
.no_login_agree {
	display:flex; flex-wrap:wrap; justify-content: space-between;
	padding:0 0 5px; font-size:12.5px; color:#206041;
	align-items: center;
}
.no_login_agree input {
	appearance: none;
	border:1px solid #ddd;
	width:15px; height: 15px;
	border-radius: 5px;
}
.no_login_agree input:checked {
	background: url(../../../../img/check_i.png) no-repeat #206041 center center;
	background-size: 9px auto;
	border:0
}

#mb_login_notmb .btn_submit {
	width:100%;display:block;height:45px;line-height:45px;
	background: #fff; color:#206041; border:1px solid #a6bfb3;
	font-size:15px
}
#mb_login_notmb .btn_goto_login {
	width:100%; display:block; margin:10px 0;
	background: #206041; color:#fff; height:45px; line-height: 45px;
	border-radius: 5px;font-size:15px

}

#mb_login_od_wr {background:#fff;border-bottom:1px solid #ccc;padding:20px}
#mb_login_od_wr p {border:0;text-align:left}
#mb_login_od_wr p strong {display:inline}
#mb_login_odinfo {margin:10px 0 0 ;background:#f3f3f3;padding:10px}
#mb_login_odinfo h2 {font-size:1.167em}

#mb_login #sns_login {margin-top:0;padding:0}
#mb_login #sns_login:after {display:block;visibility:hidden;clear:both;content:""}
#mb_login #sns_login h3 {font-size:1em; font-weight:400; color:#000000B2; margin-bottom:10px}
#mb_login #sns_login .sns-wrap {margin:0 !important; text-align: center;}
#mb_login #sns_login .sns-icon {
	width:40px !important;display:inline-block; height:40px; margin:0 4px;
	border-radius: 50%; overflow: hidden;
}
#mb_login #sns_login .txt {font-size:0.95em;padding-left:5px !important;border-left:0 !important}


/* 쪽지 */
.memo_list {border-top:1px solid #ececec;}
.memo_list li {border-bottom:1px solid #ececec;background:#fff;padding:10px 15px;list-style:none;position:relative}
.memo_list li:after {display:block;visibility:hidden;clear:both;content:""}
.memo_list li.read {background:#f6f6f6}
.memo_list li.empty_li {text-align:center;padding:20px 0;color:#666}

.memo_list .memo_li {float:left}
.memo_list .profile_big_img {position:relative;margin-right:15px}
.memo_list .profile_big_img img {border-radius:50%;width:52px;height:52px}
.memo_list .memo_name {padding-top:5px;float:none}
.memo_list .memo_preview a{display:block;margin-right:30px;padding-top:10px;font-weight:normal !important;font-size:1.2em}
.memo_list .memo_preview a:hover{text-decoration:underline}
.memo_list .memo_name a,
.memo_list .memo_name .sv_wrap {font-weight:bold}
.memo_list .no_read {position:absolute;bottom:0;right:0;display:inline-block;background:#3a8afd;border:1px solid #e1edff;text-indent:-9999px;border-radius:10px;width:10px;height:10px;box-shadow:0 0 10px 3px #9ec3f9}
.memo_list .no_read {animation:blinker 1s linear infinite}

@keyframes blinker {
	50% {opacity:0}
	}

#memo_list h1#win_title {padding:10px 10px 10px 20px}
#memo_list .memo_datetime {font-size:0.92em;color:#888d92}
#memo_list .memo_del {position:absolute;right:15px;top:15px;padding:10px;color:#c7c9cb;font-size:1.4em}
#memo_list .memo_cnt {margin-top:5px;font-weight:normal;display:inline-block;font-size:1.2em}

#memo_view_contents {margin-bottom:20px;border-top:1px solid #ececec;border-bottom:1px solid #ececec}
#memo_view_contents h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#memo_view_ul {margin:0;list-style:none;background:#f6f6f6}
#memo_view_ul:after {display:block;visibility:hidden;clear:both;content:""}
.memo_view_li {position:relative;/*padding:10px;float:left;width:50%*/}

.memo_view_li .profile_img img {display:none}
.memo_from {position:relative;background:#fff;border-bottom:1px solid #ececec;padding:15px 20px}
.memo_from li {float:left}
.memo_from li.memo_profile img {width:40px;height:40px;border-radius:50%}
.memo_from li:first-child {margin-right:10px}
.memo_from li.memo_view_nick {width:80%}
.memo_from li.memo_view_nick a {font-weight:bold !important}
.memo_from li.memo_view_date {display:block;color:#555;line-height:24px}
.memo_from li.memo_op_btn {position:absolute}
.memo_from li.list_btn {right:53px;}
.memo_from li.del_btn {right:15px;padding}
.memo_from:after {display:block;visibility:hidden;clear:both;content:""}

.memo_btn {width:100%}
.memo_btn a {display:inline-block;width:50%;font-size:1em;color:#888d92;padding:20px}
.memo_btn a.btn_right {float:right;text-align:right}
.memo_btn a i {font-size:1.2em;color:#acabab;vertical-align:bottom}

#memo_view p {padding:10px;min-height:150px;height:auto !important;height:150px;background:#fff;line-height:1.8em}
#memo_view textarea {height:100px}

#memo_write .form_01 {padding:20px;border-top:1px solid #ececec}

.reply_btn {display:inline-block;width:150px;height:45px;line-height:50px;padding:0 10px;font-weight:bold;background:#3a8afd;color:#fff;border-radius:3px;vertical-align:bottom;margin-right:5px}
#memo_write .reply_btn {font-size:1em}

/* 스크랩 */
#scrap li:after {display:block;visibility:hidden;clear:both;content:""}
#scrap li {position:relative;padding:20px;border-bottom:1px solid #ececec}
#scrap .scrap_tit {font-weight:bold;display:block;font-size:1.083em;margin-bottom:10px;line-height:1.3em}
#scrap .scrap_cate {float:left;display:block;color:#ac92ec;background:#eeeaf8;padding:3px;border-radius:3px;font-size:0.92em;margin-right:10px}
#scrap .scrap_datetime {color:#777;line-height:18px}
#scrap .scrap_del {position:absolute;top:15px;right:15px;font-size:18px;color:#c7c9cb}
#scrap .scrap_del:hover {color:#3a8afd}

#scrap_do textarea {width:100%;height:100px}
#scrap_do .scrap_tit {margin-bottom:10px;background:#f3f3f3;padding:10px 15px;font-size:1.2em;font-weight:bold}
#scrap_do label {display:block;margin:0 0 5px;font-size:1em}
#scrap_do .win_btn:after {display:block;visibility:hidden;clear:both;content:""}
#scrap .win_btn, #scrap_do .win_btn {margin:20px 0;text-align:center}
#scrap_do .win_btn .btn_submit {float:inherit}
#scrap_do .win_desc {margin:0 20px}

/* 포인트 */
#point {text-align:center}
#point h1 {text-align:left}
#point .point_all {margin:15px;border-radius:5px;background:#edf3fc;border:1px solid #d6e2f4;color:#485172;font-size:1.083em}
#point .point_all:after {display:block;visibility:hidden;clear:both;content:""}
#point .point_all li {float:left;width:50%;padding:20px;text-align:left}
#point .point_all li span {float:right;color:#485172;font-weight:bold}
#point .point_all li:last-child {border-left:1px solid #d6e2f4}
#point .point_all .full_li {width:100%;border-bottom:1px solid #d6e2f4;text-align:left}
#point .point_all .full_li span {color:#000;font-weight:bold;font-size:1.2em}
#point .point_status{background:#737373;border:0;color:#fff;font-weight:bold;font-size:1.083em;text-align:left}
#point .point_status:after {display:block;visibility:hidden;clear:both;content:""}
#point .point_status span{margin-left:10px;float:right}

.point_list {margin-bottom:20px}
.point_list li:first-child {border-top:1px solid #ececec}
.point_list li {border-bottom:1px solid #ececec;background:#fff;padding:15px;list-style:none;position:relative}
.point_list li:after {display:block;visibility:hidden;clear:both;content:""}

.point_list .point_use {background:#f6f6f6}
.point_list .point_use .point_num {font-size:1.25em;color:#ff4f76;font-weight:bold;float:right}
.point_list .point_num {font-size:1.25em;color:#3a8afd;font-weight:bold;position:absolute;right:15px;top:25px}
.point_list .point_top {line-height:15px;margin:0 0 5px}
.point_list .point_top:after {display:block;visibility:hidden;clear:both;content:""}
.point_list .point_tit {font-weight:bold;float:left;font-size:1.083em;display:block}
.point_list .point_date1 {float:left;color:#888d92}
.point_list .point_date {float:left;color:#888d92}
.point_list .txt_expired {color:red;margin-left:5px}

#point .pg_wrap {width:100%;float:inherit;text-align:center}
#point .btn_close {margin:20px auto}

/* 회원 비밀번호 확인 */
#mb_confirm {margin:30px auto; padding:17px;}
#mb_confirm h1 {margin:0 0 15px;padding:0 10px;font-size:1.3em}
#mb_confirm p {padding:15px 10px;border-bottom:1px solid #cfded8;border-bottom:0;background:#fff}
#mb_confirm p strong {display:block}
#mb_confirm fieldset {position:relative;margin:20px 0;text-align:left;color:#555}
#mb_confirm_id {font-weight:bold;display:block;font-size:1.083em;margin:5px 0}
#mb_confirm_pw {display:block;margin-top:10px;width:100%; padding:0 12px; border-radius: 5px;}
#mb_confirm .btn_submit {
	width:100%;height:46px;border-radius:3px;margin:13px 0; font-size:16px;
}

/* 비밀글 비밀번호 확인 */
#pw_confirm fieldset {position:relative;margin:0 0 5px;padding:15px 0;border-top:1px solid #fffefe}
#pw_wr_password {width:100%}
#pw_confirm .btn_submit {margin:5px 0;width:100%;border-radius:3px;height:45px;font-weight:bold;font-size:1.083em}

/* 폼메일 */
#formmail #subject {width:100%}
#formmail textarea {width:100%;height:100px}
#formmail .frm_file {padding-left:50px}
#formmail .file_wr {border:1px solid #ccc;background:#fff;color:#000;vertical-align:middle;border-radius:3px;padding:5px;height:40px}
#formmail .lb_icon {position:absolute;top:1px;left:1px;border-radius:3px 0 0 3px;height:38px;line-height:38px;width:40px;background:#fff;text-align:center;color:#b2b2b2}

.chk_box input[type="radio"] {position:absolute;top:0;left:0;width:0;height:0;opacity:0;outline:0;z-index:-1;overflow:hidden}
.chk_box input[type="radio"] + label {position:relative;padding-left:23px;display:inline-block;color:#676e70}
.chk_box input[type="radio"] + label span {position:absolute;top:0;left:0;width:15px;height:15px;display:block;background:#f7f8f9;border:1px solid #cdd6df;border-radius:50%}
.chk_box input[type="radio"]:checked + label {color:#3a8afd}
.chk_box input[type="radio"]:checked + label span {border-color:#3a8afd}
.chk_box input[type="radio"]:checked + label span:before {width:7px;height:7px;background:#3a8afd;content:'';position:absolute;top:3px;left:3px;border-radius:50%}


/* 자기소개 */
#profile section {margin:10px}
#profile h2 {margin:0}
#profile .sv_wrap a {}
#profile .profile_img img {border-radius:50%}
#profile table {width:100%;border-collapse:collapse}
#profile table th {background:#fff;padding:10px;width:90px;text-align:left;border-bottom:1px solid #eee}
#profile table td {background:#fff;padding:10px;border-bottom:1px solid #eee}
#profile p {color:#6794d3;background:#fff;padding:10px;border:1px solid #eee;margin:10px 0}



/*로그인*/
.login_head {
	display: flex; padding:10px 0 0; justify-content: space-between; align-items: center;
}
.top_left_logo {height:38px; width:auto; margin-right:auto; display:block}
.top_colse_btn {
	background: url(../../../../img/close.svg) no-repeat center center; width:38px; height: 38px;
	border:0; text-indent: -9999px; background-size: cover; margin-right:-10px
}
.cs_link_btn {text-align: center; margin-top:10%; padding-bottom: 10px;}
.cs_link_btn a {color:#20604199; text-decoration: underline; font-weight: 500; font-size:1.1em}

/*회원가입 유형 선택*/
#hd {display:none}
#container_title {display:none}
.reg_select {text-align: center; padding:20% 0 10%}
.reg_select h1 {
	font-size: 2em;
	margin-bottom: 20px;
	color: #206041;
}
.reg_select p {
	font-size: 14px;
	margin-bottom: 0;
	color: #206041;
}
.reg_select .card-wrapper {
	display: flex;
	justify-content: center;
	gap: 15px;
	margin-bottom: 30px;
	margin-top:70px;
}
.reg_select .card {
	flex: 1;
	background-color: #fff;
	border: 1px solid #20604180;
	border-radius: 6px;
	padding: 17px 15px;
	cursor: pointer;
	transition: all 0.3s ease;
}
.reg_select .card.selected {
	border-color: #2c6d44;
	background-color: #e6f2ec;
}
.reg_select .card.inactive {
	opacity: 0.3;
}
.reg_select .card .mem_imgbox {
	display: block;
	padding:5px;
	width:90px; height:45px;
	border: 1px solid #20604180;
	margin:-62px auto 0;
	border-radius: 45px 45px 0 0;
	background: #fff;
	border-bottom: 0;
}
.reg_select .card img {
	width: 100%;
	height:auto;
	margin-bottom: 10px;
	display: inline-block;
}
.reg_select .card .title {
	font-weight: bold;
	margin-bottom: 17px;
	margin-top:50px;
	color:#206041;
	font-size:1.1em
}
.card .desc {
	font-size: 13px;
	color: #666;
	background: #D2DFD9;
	padding:13px 10px;
	border-radius: 17px;
	font-size:1em;
	color:#206041CC;
	font-weight:500;
	position: relative;
}
.card .desc:before {
	position: absolute;
	content:'';
	top:-13px;
	left:50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-bottom: 8px solid #D2DFD9;
	border-top: 8px solid transparent;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
}
.reg_select .next-btn {
	background-color: #206041;
	color: #fff;
	border: none;
	border-radius: 5px;
	height:50px;
	line-height: 50px;
	width: 100%;
	font-size: 16px;
	cursor: pointer;
	font-weight:600
}
.reg_select .next-btn:disabled {
	background-color: #ccc;
	cursor: not-allowed;
}

/*회원가입*/
.head_back {margin-left:-12px}
.head_back img {width:38px; height:auto}
.email_li .email_box {display:flex; flex-wrap: wrap; justify-content: space-between; align-items: center; font-size:1em}
.email_li div input {width:calc(100% - 153px)}
.email_li select {width:130px;}
.register .frm_input {
	border-radius: 5px; color:#888; border:1px solid #20604180; padding:5px 12px; font-size:13.5px;
	height:42px; outline:none
}
.register select {
   -webkit-appearance:none; /* for chrome */
   -moz-appearance:none; /*for firefox*/
   appearance:none;
	background:url("../../../../img/sel1.svg") no-repeat center right 11px/12px auto;
	padding:0 11px;
	font-size:1em;color:#888
}
.register select::-ms-expand{
   display:none;/*for IE10,11*/
}
.register li {margin:0 0 20px}
.register li span {color:#206041CC}
.register .phone_box {display: flex; flex-wrap: wrap; justify-content: space-between; margin:0 0 10px}
.register .phone_box .frm_label {width:100%}
.register .phone_box select {width:78px}
.register #fregisterform li button {
	width:100px; height:42px; display: inline-block;
	background: #206041; color:#fff; font-weight:500; font-size: 1.1em;
	border-radius: 5px; border:0; margin-bottom: 0;
}
.register .phone_box input {width:calc(100% - 106px);}
.register .cert_number {display:flex; gap:6px; flex-wrap: wrap;}
.register .cert_number .frm_input {width:calc(100% - 106px)}
.register .cert_number .num_time {width:auto; font-size:0.9em; font-weight:500; color:#F44A44}
.register #fregisterform .cert_number button:disabled, .register #fregisterform .cert_number button[disabled]{
	background: #0000004D;
}
.register li.nick_li {display: flex; flex-wrap: wrap; position: relative;}
.register li.nick_li .frm_label {width:100%}
.register li.nick_li .frm_input {width:calc(100% - 106px); margin-right:6px}
.register li .nick_num {position: absolute; top:10px; right:0; font-size:0.85em; font-weight:500}
.register li .nick_text {
	border:1px solid #20604180; border-radius: 5px; padding:12px 15px; font-size:.95em; width:100%;
	color:#206041; line-height: 1.4; margin-top:10px
}
.register li .nick_text p {margin-bottom:2px; font-weight:500}
.register li .nick_text p:last-child {margin-bottom: 0;}
#fregister {text-align: left;}
.register #fregister h2 {text-align: left; font-size:14px; margin:10px 0 0; padding-bottom:5px}
.register #fregister section label {position: relative; font-size:13px; width:100%; display:block;}
.register #fregister section label.agree_top {margin:5px 0 0}
.register #fregister section .fregister_agree label {padding-left:0}
#fregister .fregister_agree input[type="checkbox"] + label span {
	left:auto; right:0; width:14px; height:14px;
	background-size: 9px auto;
}
.register #fregister section#fregister_private {padding-top:5px}
.register li.wrong .frm_input {border:1px solid #F44A44}
.register li .wrong_text {padding-top:6px; font-size:.95em; color:#F44A44; display: none;}
.register li.password .frm_info  {display:block; color:#206041; margin-top:0;}
.register li.password.wrong .wrong_text {color:#F44A44; }
.register li.wrong .wrong_text {display:block;}
.register #fregister p.wrong_text {
	margin:0; padding:3px 0 0; background: transparent; color:#F44A44; font-size:.95em;
	display: none;
}
.register #fregister section.wrong .wrong_text {display: block;}
.register #fregister p:before {display:none}
.cert_bottom {display:flex; align-items: center;}
.register li .cert_bottom .wrong_text {padding-top: 0; font-size:0.9em;}
.register li.password .pass_eye, .register li.password2 .pass_eye {
	text-indent: -9999px;
	background: url(../../../../img/pass_i.png) no-repeat center center;
	display: block;
	width:20px; height:20px;
	background-size: cover;
	position: absolute;
	top:43px;
	right:10px
}
.register li.password .pass_eye.active, .register li.password2 .pass_eye.active {
	background: url(../../../../img/pass_i_no.png) no-repeat center center;
	background-size: cover;
}
.register li.password2 .pass_eye {top:11px}
.register li.password .frm_input, .register li.password2 .frm_input {padding-right:32px}
.register #fregisterform li.address input {margin-bottom:8px}
.addr_top {display:flex; flex-wrap:wrap;}
.addr_top .frm_label {width:100%;}
.addr_top .frm_input {width:calc(100% - 106px); margin-right:6px}



/*앱접근권한 안내*/
.service_guide {
  margin: 0 auto;
  padding:15px 17px;
  background: #fff;
}
.service_guide h1 {
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 20px;
  border-bottom:1px solid #ddd;
  padding:15px 15px 20px
}
.service_guide h1 span {
  color: #206041; /* NINETREE 강조 색 */
  font-weight: bold;
}
.service_guide h2 {
  font-size: 16px;
  margin: 20px 0 10px;
  font-weight: bold;
  color:#206041
}
.service_guide .ser_ul_wrap {padding:0 15px; border-bottom: 1px solid #ddd; padding-bottom: 30px;}
.service_guide ul {
  list-style: none;
  padding:0
}
.service_guide ul li {
  margin-top: 17px;
}
.service_guide ul li img {width:11.5px; height:auto; vertical-align: -3px; margin-right:9px}
.service_guide ul li img.camera {width:14px; vertical-align: -1px; margin-right:6.5px}
.service_guide ul li p {font-size:14.5px; font-weight: 500; color:#333}
.service_guide ul li p:last-child {
  color: #666;
  font-size: 13px;
  line-height: 1.4;
  padding-left:20.5px;
  margin-top:3px;
  font-weight:400
}
.service_guide div > h2 {
  margin-top: 30px;
}
.service_guide div > div > input[type="checkbox"] {
  margin-right: 8px;
  transform: scale(1.2);
}
.service_guide div > div > label {
  font-size: 14px;
}
.service_guide div > span {
  display: block;
  margin-top: 20px;
  color: #999;
  font-size: 12px;
  line-height: 1.5;
}
.service_guide .btn_agree {
  position:fixed;
  bottom:15px;
  max-width:470px;
  left:17px;
  right:17px;
  margin:0 auto;
  margin-top: 30px;
  background-color: #206041;
  color: white;
  height:50px;
  line-height: 50px;
  font-size: 16px;
  font-weight: bold;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}
.service_guide .ad_agree {padding:25px 15px;border-bottom: 1px solid #ddd;}
.service_guide .ad_agree h3 {font-size:14.5px; font-weight: 500;padding-bottom: 4px; color:#111}
.service_guide .ad_agree p {font-size:13px; color:#555; margin-bottom:12px}
.service_guide .ad_agree .ad_check {padding:5px 0}
.service_guide .ad_agree .ad_check label {color:#555; font-size:13.5px}
.service_guide .ad_agree .ad_check span {top:1px}
.service_guide .ad_gray_text {padding:15px 15px 80px; display:block; color:#999; font-size:13px; line-height: 1.35;}


/*프로필 설정*/
.profile {text-align: center;}
.register_image_content {padding:20% 0}
.register_image_title {font-size:2em; color:#333; padding-bottom:50px}
.register_image_content_title h2 {font-size:18px; color:#206041; margin-bottom:15px}
.register_image_content_title p {color:#206041; font-size:14px;}
.register_image_content_image {margin:50px 0 30px; display:flex; flex-wrap:wrap; gap:5%; justify-content: center;}
.register_image_content_image li {width:27%}
.register_image_content_image li .profile_img_box {
	width:100%;
	height:0; padding-bottom: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border:1px solid rgba(0, 0, 0, 0.1)
}
.register_image_content_image li .profile_img_box img {
	position: absolute;
	top:5px; left:5px; right:5px; bottom:5px; border-radius: 50%;
	width:calc(100% - 10px); height:calc(100% - 10px); object-fit: cover;
	box-shadow: 0 0 3px 2px rgba(16,50,33,0.08);
}
.register_image_content_image li:last-child .profile_img_box img {box-shadow: none;}
.register_image_content_image li input {margin-top:12px}
.register_image_content_image li input[type="checkbox"] + label span  {
	position: initial;
	margin:15px auto
}
.register_bottom_button {position: fixed; bottom:40px;margin:0 auto; left:0; right:0; max-width:500px; padding:0 17px}
.register_bottom_button button {
	background: #206041; color:#fff; height: 50px; line-height: 50px; border-radius: 10px;
	width:100%; display:block; border:0; font-size:17px; font-weight:500
}
.blackbox {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	max-width: 500px;
	margin: 0 auto;
	z-index: 9998;
	display: none;
}
.modal_container {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	background: #fff;
	padding:15px 0
}
.modal_container:before {
	position: absolute; content:''; display: block; left:50%; transform: translateX(-50%);
	top:10px; height:5px; width:8%; border-radius: 3px; background: #D1D1D1;
}
.modal_container h4 {font-size:14px; color:#777; text-align: center; font-weight:400; padding-top:17px}
.modal_container button {
	width: calc(100% - 40px);
	border-radius: 0;
	display: block;
	line-height: 50px;
	background: #fff;
	font-size: 15px;
	color: #333;
	border:0;
	border-bottom: 1px solid #ddd;
	margin: 5px auto 0;
	text-align: left;
	position: relative;
	font-weight: 500;
}
.modal_container button img {
	position: absolute; right:0; top:50%; transform: translateY(-50%);
	width:15px; height:auto
}
.modal_container div {
	padding: 5px 0;
}
.modal_container div button:last-child {border-bottom: 0;}

.croppie_modal {
	position: fixed;
	z-index: 9999;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	display: none;
	max-width: 500px;
	margin: 0 auto;
}
.croppie_modal_title {
	height: 60px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px;
	background: black;
	color: white;
	font-size: 1.2em;
}
#croppie_view {
	background: black;
	width: 100%;
	height: 100%;
}
#croppie_view_image {
	width: 100%;
	height: 100%;
	padding-bottom: 10px;
}
#croppie_buttons {
	display: flex;
	justify-content: center;
}
#crop_confirm {
	width: 100%;
	background: #000;
	color: #fff;
	border: none;
	padding: 10px;
	border-radius: 5px;
	cursor: pointer;
}
.croppie-container .cr-boundary {
	width: 100% !important;
	height: 100% !important;
}
.close-btn {
	margin-top: 10px;
	background: #f00;
	color: white;
	border: none;
	padding: 6px 12px;
	border-radius: 5px;
	cursor: pointer;
}
.croppie_modal_title {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/*회원가입 후 가이드 스와이프*/
.guide_swipe .swiper-container {
    width: 100%;
    height: 100vh;
	overflow: hidden;
	position: relative;
}
.guide_swipe .swiper-slide {
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 0;
	margin-top:15%;
	height:auto;
}
.guide_swipe .swiper-slide .guide_img {text-indent: -99999px; width:100%; height:84%; position: relative; z-index: 1;}
.guide_swipe .swiper-slide .guide_img.after1 {
	background: url(../../../../img/guide1.jpg) no-repeat top center; 
	background-size: 100% auto;
}
.guide_swipe .swiper-slide .guide_img.after2 {
	background: url(../../../../img/guide2.jpg) no-repeat top center; 
	background-size: 100% auto;
}
.guide_swipe .swiper-slide .guide_img.after3 {
	background: url(../../../../img/guide3.jpg) no-repeat top center; 
	background-size: 100% auto;
}
.guide_swipe .swiper-slide .back3 {
	position: absolute;
	height:60%; bottom:0; left:0; right:0;
	background: #EEF3F0; z-index: 0;
}
.guide_swipe .swiper-slide .guide_img.after4 {
	background: url(../../../../img/guide4.jpg) no-repeat top center; 
	background-size: 100% auto;
}
.guide_swipe .swiper-slide .back4 {
	position: absolute;
	height:20%; bottom:0; left:0; right:0;
	background: #fff;
}

.guide_swipe .welcome-message, .guide_swipe .profile-setup, .guide_swipe .marketing-consent {
    max-width: 80%;
}
.guide_swipe .btn-profile, .guide_swipe .btn-consent {
    display: inline-block;
    padding: 10px 20px;
    margin: 10px;
    border-radius: 5px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border: none;
    cursor: pointer;
}
.guide_swipe .consent-buttons {
    margin-top: 20px;
}
.guide_swipe .swiper-container .swiper-pagination {bottom:5%; z-index: 5;}
.guide_swipe .swiper-button-box {
	position: absolute; bottom:0; padding:0 17px; width:100%; z-index: 5;height:16%;
}
.guide_swipe .swiper-button-box div {
	height:50px; line-height: 50px; border-radius: 10px; background: #206041;
	width:100%; text-align: center; color:#fff; font-size:17px; font-weight:500;
}
.guide_swipe .swiper-button-box div img {margin-left:5px; vertical-align: 0; height:13px; width:auto}
.guide_swipe .swiper-container .swiper-pagination-bullet {background: rgba(0,0,0,0.45); margin:0 5px}
.guide_swipe .swiper-container .swiper-pagination-bullet-active {
	width:22px; border-radius: 4px; background: rgba(32,96,65,0.5);
}

@media screen and (max-height: 670px) {
	.guide_swipe .swiper-slide {margin-top:12%}
	.guide_swipe .swiper-button-box {height:17%}
	.guide_swipe .swiper-container .swiper-pagination {bottom:4%}
}