@charset "utf-8"; 

.social_info_guide { background:#f3f3f3; border:1px solid #ddd; margin:0 10px 10px; padding:10px 15px; line-height:1.5em } 
.bg-warning { margin:0 10px 10px; padding:10px 15px; line-height:1.5em } 
.bg-warning1 { background:#f7dfe4; border:1px solid #eac3cb } 
.bg-warning2 { background:#deeabf; border:1px solid #bde498 } 
.bg-warning3 { background:#fff8dc; border:1px solid #f1e4b2 } 

/* SNS LOGIN */
.login-sns { display: flex; flex-direction: column; gap: 40px; } 
.login-sns h3 { padding-top:10px; text-align:center; color:#777; font-weight:normal } 
.sns-wrap { text-align:center } 
.sns-icon { display:inline-block; vertical-align:middle; text-decoration:none } 
.sns-icon:hover { text-decoration:none } 
.sns-icon .ico { display:block; vertical-align:middle } 
/*.sns-icon .txt { position:absolute; line-height:0; font-size:0; vertical-align:middle; overflow:hidden } */
.sns-icon .txt i { font-style:normal } 

#fregisterform .form_01 .reg-form { margin-bottom:20px } 
#fregisterform .form_01 .reg-form .sns-wrap { margin:10px 0 0; text-align:left } 
.reg-form .sns-icon { display:inline-block; vertical-align:middle; text-decoration:none; border-width:1px; border-style:solid; overflow:hidden; margin:0 1px } 
.reg-form .sns-icon:hover { text-decoration:none } 
.reg-form .sns-icon .ico { display:block; background:url('./img/sns_logo.png') no-repeat; vertical-align:middle; width:24px; height:24px } 
.reg-form .sns-icon-not .ico { display:block; background:url('./img/sns_logo_not.png') no-repeat; vertical-align:middle } 
.reg-form .sns-icon .txt { position:absolute; line-height:0; font-size:0; vertical-align:middle; overflow:hidden } 
.reg-form .sns-icon .txt i { font-style:normal } 

.sns-wrap-reg .sns-naver { border-color:#18a400; background:#2db400 } 
.sns-wrap-reg .sns-naver .ico { background-position:-29px 0; } 
.sns-wrap-reg .sns-google { border-color:#ca2c19; background:#4285F4 } 
.sns-wrap-reg .sns-google .ico { background-position:-58px 0 } 
.sns-wrap-reg .sns-facebook { border-color:#2e5393; background:#3a5897 } 
.sns-wrap-reg .sns-facebook .ico { background-position:0 0 } 

.sns-wrap-reg .sns-icon { border-color:#dcdcdc } 
.sns-wrap-reg .sns-icon-not { border-color:#8b8b8b } 
.sns-wrap-reg .sns-naver { border-color:#18a400 } 
.sns-wrap-reg .sns-naver .ico { background-position:-29px 0; } 
.sns-wrap-reg .sns-google .ico { background-position:-58px 0 } 
.sns-wrap-reg .sns-google { border-color:#ca2c19 } 
.sns-wrap-reg .sns-facebook .ico { background-position:0 0 } 
.sns-wrap-reg .sns-facebook { border-color:#2e5393 } 
.sns-wrap-reg .sns-kakao .ico { background-position:-87px 0 } 
.sns-wrap-reg .sns-twitter { border-color:#488FC9 } 
.sns-wrap-reg .sns-twitter .ico { background-position:-145px 0 } 
.sns-wrap-reg .sns-payco { border-color:#C44646 } 
.sns-wrap-reg .sns-payco .ico { background-position:-116px 0 } 
.sns-wrap-reg .sns-kakao { border-color:#f2df00 } 

/* SNS by COLOR */
.sns-wrap-over .sns-naver { background:url('./img/sns_naver_s.png') no-repeat } 
.sns-wrap-over .sns-google { } 
.sns-wrap-over .sns-facebook { background:url('./img/sns_fb_s.png') no-repeat } 
.sns-wrap-over .sns-twitter { background:url('./img/sns_twitter_s.png') no-repeat } 
.sns-wrap-over .sns-payco { background:url('./img/sns_payco_s.png') no-repeat } 
.sns-wrap-over .sns-kakao { background:url('./img/sns_kakao_s.png') no-repeat } 
.reg-form .sns-icon-not { border-color:#8b8b8b } 

.social-login-loading { width:100%; height:auto; text-align:center } 
.social-login-loading p { display:inline-block; margin-top:10px; padding:40px 0 0; line-height:30px } 

/* 아웃로그인 */
#sns_outlogin .sns-icon { overflow:hidden; margin:0 1px } 
#sns_outlogin .sns-icon .txt { position:absolute; line-height:0; font-size:0; vertical-align:middle; overflow:hidden } 
#sns_outlogin .sns-icon .ico { width:30px; height:30px } 

/*로그인 */
#sns_login { border:0; margin-top:15px; border-top:1px solid #edeaea } 
#sns_login h3 { padding:10px 0 0; text-align:left; font-weight:bold } 
#sns_login .sns-icon { position:relative; display:block; height:40px; line-height:40px; width:100%; margin:0 0 5px; padding-left:40px; text-align:left; color:#fff; border-radius:2px } 
/* #sns_login .sns-naver { background-color:#1fc800; background-position:5px 5px; border-bottom:1px solid #1ea505 } 
#sns_login .sns-kakao { background-color:#ffeb00; background-position:5px 5px; border-bottom:1px solid #e2c10a } 
#sns_login .sns-kakao { color:#3c1e1e } */
#sns_login .sns-facebook { background-color:#3b579d; background-position:5px 5px; border-bottom:1px solid #28458f } 
#sns_login .sns-google { background-color:#4285F4; background-position:5px 5px; border-bottom:1px solid #3567c6; letter-spacing:-0.5px } 
#sns_login .sns-google .ico { position:absolute; top:3px; left:3px; width:33px; height:33px; background:url('./img/sns_gp_s.png') no-repeat center center; background-color:#fff; background-size:28px 28px!important; border-radius:2px } 
#sns_login .sns-twitter { background-color:#1ea1f2; background-position:5px 5px; border-bottom:1px solid #1e82c0 } 
#sns_login .sns-payco { background-color:#df0b00; background-position:5px 5px; border-bottom:1px solid #9d0800 } 
#sns_login .txt { text-align:left; padding-left:10px; border-left:1px solid rgba(0,0,0,0.1); display:block; font-weight:bold } 
#sns_login .txt:hover { background:rgba(0,0,0,0.07) } 

#sns_login .sns-icon { margin: 10px 0 0; padding: 0; display: flex; align-items: center; padding: 0 20px; justify-content: space-between; width: 100%; height: 54px; max-height: unset; line-height: 54px; border: 1px; border-radius: 10px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 17px; font-weight: 500; text-align: center; cursor: pointer; } 
#sns_login .sns-icon .ico { min-width: 24px; } 
#sns_login .login-sns a:not(:first-child) { margin-top: 10px; } 
#sns_login .sns-kakao { margin-top: 0; background-color: #fee500; font-size: 17px; color: #111; } 
#sns_login .sns-naver { background-color: #02c659; font-size: 16px; color: #fff; } 


/*회원가입 */
#sns_register { } 
#sns_register h2 { text-align: center; color: var(--Colors-Grey-Color-Light-Base1, #2D2D2D); font-size: 18px; font-weight: 400; line-height: 26px; } 
#sns_register .sns-wrap { display: flex; flex-direction: column; gap: 20px; } 
#sns_register .sns-icon { display: flex; width: 100%; height: 54px; align-items: center; justify-content: space-between; padding: 0 30px; border-radius: 4px; } 
#sns_register .sns-icon .txt { color: var(--Color-Grey-Color-Black, #000); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; } 
#sns_register .sns-icon .ico { min-width: 24px; } 
#sns_register .sns-naver { background: #03C75A; } 
#sns_register .sns-kakao { background: var(--Colors-SNS-Color-Light-kakao, #FEE500); } 
#sns_register .sns-naver .txt { color: var(--Color-Grey-Color-White, #FFF); } 

#sns_register .sns-facebook { background-color:#3b579d; background-position:0 0 } 
#sns_register .sns-google { background-color:#fff; background-position:0 0; border-radius:2px; border:1px solid #999 } 
#sns_register .sns-google .ico { background:url('./img/sns_gp_s.png') no-repeat; height:30px } 
#sns_register .sns-twitter { background-color:#1ea1f2; background-position:0 0 } 
#sns_register .sns-payco { background-color:#df0b00; background-position:0 0 } 

/* 회원가입 약관 */
.register { margin:0 auto; max-width: 420px; padding: 120px 20px 60px; } 
.register:after { display:block; visibility:hidden; clear:both; content:"" } 
.register .btn_confirm { display: flex; gap: 8px; } 
.register .btn_confirm .btn_submit,
.register .btn_confirm .btn_close { border: 0; display: flex; height: 48px; justify-content: center; align-items: center; gap: 10px; flex: 1 0 0; color: var(--Colors-Grey-Color-Light-Base3, #666); text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; border-radius: 4px; background: var(--Colors-Grey-Color-Light-Base9, #F4F4F4); } 
.register .btn_confirm .btn_submit { background: var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); color: var(--Colors-Grey-Color-Light-Base10, #FFF); } 
.register .btn_confirm .btn_home { border: 0; display: flex; height: 48px; justify-content: center; align-items: center; gap: 10px; flex: 1 0 0; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; border-radius: 4px; color: var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); border: 1px solid var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); } 

#fregister p { margin-bottom: 60px;; color: #000; text-align: center; font-size: 28px; font-weight: 700; line-height: 36px; } 
#fregister textarea { padding: 0; resize: none; display:block; width:100%; height:150px; background:#fff; border:0; line-height:1.6em } 
#fregister .btn_confirm { padding: 12px 0 0; } 
.fregister_terms table { width:100%; border-collapse:collapse; font-size:1em; } 
.fregister_terms table caption { position:absolute; font-size:0; line-height:0; overflow:hidden } 
.fregister_terms table th { background:#f7f7f9; width:33.33%; color:#000; padding:10px; border:1px solid #d8dbdf } 
.fregister_terms table td { border:1px solid #e7e9ec; padding:10px; border-top:0 } 


.fregister_agree { display: flex; align-items: center; justify-content: space-between; padding: 12px 0 6px 0; } 
.fregister_agree label { display: flex; align-items: center; gap: 8px; align-self: stretch; color: var(--Colors-Grey-Color-Light-Base0, #000); font-size: 15px; font-weight: 400; line-height: 22px; margin: 0; } 
.fregister_agree label span { cursor: pointer; display: block; width: 24px; height: 24px; background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='17' height='17' rx='3.5' stroke='%23DCDCDC'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: center; } 
.fregister_agree input:checked + label span { background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2' y='2' width='20' height='20' rx='6' fill='%23F48673'/%3E%3Cpath d='M9.59978 14.604L16.6558 7.54796C17.1238 7.07996 17.8918 7.07996 18.3598 7.54796C18.8278 8.01596 18.8278 8.77196 18.3598 9.23996L10.4518 17.148C9.98378 17.616 9.22778 17.616 8.75978 17.148L5.65178 14.04C5.18378 13.572 5.18378 12.816 5.65178 12.348C6.11978 11.88 6.87578 11.88 7.34378 12.348L9.59978 14.604Z' fill='white'/%3E%3C/svg%3E%0A"); } 
#fregister_chkall { padding: 0 0 12px 0; border-bottom: 1px solid var(--Colors-Grey-Color-Light-Base8, #E0E0E0); } 
#fregister_chkall label { padding: 0; } 
.chk_li { padding-left:20px } 

#sns_register .login-sns,
#sns_register h2 { border:0 !important } 
.register .text-center { margin-top: 6px; color: var(--Colors-Grey-Color-Light-Base5, #A4A4A4); font-size: 18px; font-weight: 400; line-height: 26px; display: flex; justify-content: center; align-items: center; gap: 12px; } 
.register .text-center a { font-weight: 500; color: var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); } 



/* 회원가입 입력 */
#register_form { display: flex; flex-direction: column; gap: 28px; } 
#register_form > div { position: relative; } 
#register_form label { display: block; color: var(--Colors-Grey-Color-Light-Base0, #000); font-size: 15px; font-weight: 400; line-height: 22px; margin-bottom: 8px; } 

#fregisterform .cert_desc { color:#3a8afd; } 
#fregisterform .cert_req { margin-left:5px; line-height:35px; } 
#fregisterform #msg_certify { margin:5px 0; padding:5px; border:1px solid #dbecff; background:#eaf4ff; text-align:center } 
#fregisterform #mb_addr3 { display:inline-block; margin:5px 0 0; vertical-align:middle } 
#fregisterform #mb_addr_jibeon { display:block; margin:5px 0 0 } 
#fregisterform .captcha { display:block; margin:5px 0 0 } 
#fregisterform .reg_mb_img_file img { max-width:100%; height:auto } 
#reg_mb_icon, #reg_mb_img { float:right } 
#fregisterform .consent-line { display: flex; margin: 0 !important; } 
#fregisterform .consent-line .chk_li { padding-left: 0; } 
#fregisterform .consent-date { margin: 5px 0 0 20px !important; } 
#fregisterform .consent-group .sub-consents { padding: 0 20px 0px } 
#fregisterform .js-open-consent { display: block; margin-left: 10px; font-size: 12px; color: #3f51b5; background: none; border: none; cursor: pointer; text-decoration: underline; } 
#fregisterform input[type=text], 
#fregisterform input[type=password] { font-size: 16px; font-weight: 400; line-height: 24px; width: 100%; box-shadow:unset; height: 48px; padding: 0 14px; border-radius: 6px; border: 1px solid var(--Colors-Grey-Color-Light-Base8, #E0E0E0); background: var(--Colors-Grey-Color-Light-Base10, #FFF); } 
#fregisterform .add { display: flex; flex-direction: column; gap: 8px; } 
#fregisterform .add .sound_only { display: none !important; } 

.tooltip_icon { display:inline-block; vertical-align:baseline; color:#b3b5b8; border:0; font-size:1.4em; background:transparent; cursor:pointer } 
.tooltip_icon:hover { color:#448bf5 } 
.tooltip { position:relative; width:auto; color:#fff; background:#000; padding:10px; font-size:small; line-height:18px; display:none; position:absolute; z-index:9; font-weight:normal; margin-left:15px; margin-top:10px } 
.tooltip:before { content:""; position:absolute; top:0; left:-10px; width:0; height:0; border-style:solid; border-top:0px solid transparent; border-bottom:10px solid transparent; border-left:0; border-right:10px solid #000 } 

/*기존 계정에 연결하기*/

/* Styles for Accordion */

.mbskin .toggle { position:relative; display:block; border:1px solid #c6cacc; margin-top:-1px; background-color:#fcfcfc } 
.mbskin .toggle .toggle-title { padding:13px 15px; line-height:20px } 
.mbskin .toggle .title-name { display:block } 
.mbskin .toggle .toggle-inner { padding:15px; line-height:1.5em; display:none; background:#fff; border-top:1px solid #e2e2e2 } 
.mbskin .toggle .toggle-inner div { max-width:100% } 
.mbskin .right_i { position:absolute; font-size:0.92em; top:10px; right:10px; padding:0 10px 0 0; border-radius:3px; display:inline-block; z-index:2; background:#3497d9; color:#fff; border-bottom-color:#1977b5; cursor:pointer } 
.mbskin .toggle .toggle-title .right_i i { background:url("./img/plus_minus.png") 0 -24px no-repeat; width:20px; height:24px; display:inline-block; vertical-align:middle } 
.mbskin .toggle .toggle-title.active .right_i i { background:url("./img/plus_minus.png") 0 0 no-repeat } 
.mbskin .all_agree { position:relative; display:block; margin-bottom:6px; background:#fff; border:1px solid #c6cacc; border-top:0; padding:13px 15px; line-height:20px } 

.sns_tbl { background:#fff; margin:10px 0; border:1px solid #c6cacc } 
.sns_tbl table { border:0 } 
.sns_tbl caption { padding:0 20px; line-height:45px; font-size:1.083em; border-bottom:1px solid #e2e2e2; color:#253dbe; background:#fcfcfc } 
.sns_tbl th { width:100px; text-align:right; padding:10px } 
.sns_tbl td { padding:10px } 
.sns_tbl .email_msg { color:#777; margin:5px 0 0 } 


#sns-link-pnl .connect-close { position:absolute; top:10px; right:10px; margin:0; padding:0; width:30px; height:30px; border:0; background:transparent; color:#383838; cursor:pointer; font-size:15px } 
#sns-link-pnl .connect-close:hover { color:#ff5191 } 
#sns-link-pnl .connect-close .fa { margin:0 0 0 1px } 
#sns-link-pnl .connect-close .txt { position:absolute; line-height:0; font-size:0; overflow:hidden } 

#sns-link-pnl #login_fs { margin:0 auto; width:100%; text-align:left } 
#sns-link-pnl #login_fs label { display:block; display:block; font-size:0.93em; color:#7a7a7a; margin:5px 0 } 
#sns-link-pnl #login_fs .lg_id,#sns-link-pnl #login_fs .lg_pw { width:100%; margin-bottom:5px } 
#sns-link-pnl #login_id,#sns-link-pnl #login_pw { width:100% } 
#sns-link-pnl #login_fs .login_submit { width:100%; height:44px; font-size:1.167em; margin:10px auto 0; font-weight:bold; cursor:pointer; display:block } 
#sns-link-pnl .connect-fg { height:320px; text-align:left } 
#sns-link-pnl .login_fs { margin:0 auto; width:260px } 
#sns-link-pnl .connect-fg .connect-desc { margin:0 0 10px; padding:15px; border:1px solid #d6e9c6; background:#dff0d8; color:#3c763d } 
#sns-link-pnl .connect-fg .connect-title { margin-top:25px; margin-bottom:10px; font-size:1.667em; font-weight:bold; text-align:center } 




.social_register { width:100%; max-width:400px; padding:80px 20px 160px; margin:0 auto; } 
.social_register .tit { margin-bottom: 60px;; color: #000; text-align: center; font-size: 28px; font-weight: 700; line-height: 36px; } 
.social_register .btn_confirm { display: flex; gap: 8px; padding: 0 0 60px; } 
.social_register .btn_confirm .btn_submit,
.social_register .btn_confirm .btn_close { width: 100%; border: 0; display: flex; height: 48px; justify-content: center; align-items: center; gap: 10px; flex: 1 0 0; color: var(--Colors-Grey-Color-Light-Base3, #666); text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; border-radius: 4px; background: var(--Colors-Grey-Color-Light-Base9, #F4F4F4); } 
.social_register .btn_confirm .btn_submit { background: var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); color: var(--Colors-Grey-Color-Light-Base10, #FFF); } 
.social_register .btn_frmline { color: var(--Colors-Grey-Color-Light-Base10, #FFF); text-align: center; font-size: 15px; font-style: normal; font-weight: 700; line-height: 22px; display: flex; width: 176px; height: 48px; justify-content: center; align-items: center; gap: 10px; border-radius: 4px; background: #434A54; margin: 40px auto; } 
.member_connect { display: flex; flex-direction: column; text-align: center; gap: 20px; } 
.member_connect .strong { color: var(--Colors-Grey-Color-Light-Base1, #2D2D2D); font-size: 15px; font-weight: 400; line-height: 22px; } 
.member_connect button { display: flex; height: 48px; justify-content: center; align-items: center; border-radius: 4px; border: 1px solid var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); background: #FFF; color: var(--Colors-Brand-Color-Light-Primary-Variant, #F48673); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; } 
.social_register .form_01 ul { margin:40px 0 0 } 
.social_register .form_01 li { margin: 0 0 28px; } 
.social_register .form_01 ul:after,
.social_register .form_01 li:after { display: none; } 
.social_register .tbl_frm01 { margin: 0; } 











html.remodal-is-locked { overflow-y:scroll !important } 

@media only screen and (min-width:641px) { 
#sns-link-pnl.remodal { max-width:400px; padding:50px } 
 } 

/* Modal Styles */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); z-index: 1040; } 
.modal-dialog { display: none; position: fixed; top: 0; left: 50%; transform: translateX(-50%); background: #fff; border-radius: 8px; width: 90%; max-width: 600px; z-index: 1050; opacity: 0; transition: top 0.3s ease-out, opacity 0.3s ease-out; } 
.modal-dialog.active { top: 10%; opacity: 1; } 
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 15px; border-bottom: 1px solid #e5e5e5; } 
.modal-header h2 { margin: 0; font-size: 1.25em; } 
.modal-body { position: relative; padding: 20px; max-height: 70vh; overflow-y: auto; } 

.modal-body .connect-desc {margin-bottom: 24px; font-size: 14px; line-height: 20px;}
.modal-body label { display: block; color: var(--Colors-Grey-Color-Light-Base0, #000); font-size: 15px; font-weight: 400; line-height: 22px; margin-bottom: 8px; } 
.modal-body .login_pw {margin-top: 16px;}
.modal-body .frm_input { color: #353535; font-size: 16px; font-weight: 400; line-height: 24px; width: 100%; box-shadow: unset; height: 48px; padding: 0 14px; border-radius: 6px; border: 1px solid var(--Colors-Grey-Color-Light-Base8, #E0E0E0); background: var(--Colors-Grey-Color-Light-Base10, #FFF); } 
.modal-body .btn_submit { text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; border-radius: 4px; border: 0; display: flex; height: 48px; justify-content: center; align-items: center; gap: 10px; flex: 1 0 0; width:100%; margin-top: 24px; background-color: #F48673;}