@import url(/css/outer.css);
svg.error-icon {
	float: left;
    fill: #f2677d;
    margin: 5px 5px 0 0;
}
svg.error-icon + .error_entxt {display: inline-block; margin-left: 18px;}
svg.error-icon.checkboxError {
    position: relative;
    margin-top: 1px; 
    left:auto;
    top:auto;
}
svg.error-icon + label.error {font-size:13px; width:auto; margin-top: 5px;}
#member_wrap { margin:0px auto;padding:0px; overflow:auto;}
#member_wrap p.pass { text-align:center; padding:20px 0; border-top:#e4e4e4 1px dotted; }
#member_wrap p.pass a.home { padding:7px; font-size:15px; border:2px solid #ebebeb; }

/* login */
#login_msg {
	margin-bottom: 10px;
}
/*#login_msg { font-family: 'Raleway', 'Nanum Gothic'; padding:10px;text-align:center;font-size:12px; letter-spacing: -0.05em; line-height: 1.4; padding-bottom:0; }*/
input[type="checkbox"] { display:inline-block; width:20px; height: 20px; padding-right: 0; -webkit-appearance:none; vertical-align: middle; border-radius: 0; border:0; background:url(https://storage.googleapis.com/i.addblock.net/checkbox-off.png) no-repeat 0 0; }
input[type="checkbox"]:checked { background:url(https://storage.googleapis.com/i.addblock.net/checkbox-on.png) no-repeat 0 0; }

/*이용약관 및 개인정보취급방침 common css */
#termsShow .modal-content, #privacyShow .modal-content { padding: 40px 40px 60px; }
#termsShow .modal-header, #privacyShow .modal-header { min-height: 55px; padding:0 0 20px 0; }
#termsShow .modal-body, #privacyShow .modal-body { position: relative; overflow-y:auto; max-height: 699px; padding: 0;}

@media screen and (min-width: 768px){
 .modal-dialog{ width:60%; }
}

/*이용약관 - terms of service */
#termsShow .contentbox .terms_top h1 { font-size:25px; letter-spacing:0.05em; color:#42464c; margin:10px 0 40px 0; }
#termsShow .contentbox .terms_content dd { margin: 15px 0 30px 0; font-size:12px; color:#797f86; letter-spacing:0.075em; }
#termsShow .contentbox .terms_content .content dd a { text-decoration:underline; color:#222528; }
#termsShow .contentbox .terms_content .content dt { font-size:13px; color:#42464c; text-transform: uppercase; }

/*개인정보취급방침 - privacy content*/
#privacyShow .contentbox .privacy_top h1 { font-size: 25px; font-weight: 300; letter-spacing: 0.05em; color:#42464c; margin-top:10px;}
#privacyShow .contentbox .privacy_content h3 { font-size:13px; color:#42464c; font-weight:400; letter-spacing:0.075em; text-transform: uppercase; margin:60px 0 10px;}
#privacyShow .contentbox .privacy_content dd { font-weight:400; letter-spacing:0.05em; font-size:12px; color:#797f86; margin:5px 0 0 0; -webkit-padding-start: 15px;}

/* confirm */
#conf_title { padding:15px 0; border-bottom:2px solid #ebebeb; }
#conf_cont { padding:30px 0px; margin:0px;  }
#conf_cont p { width:350px; height:30px; }
#conf_cont p label { float:left; width:100px; }
#conf_cont li.infor { float:left; padding:0 0 10px 0px; }
#conf_cont li.infor span { float:left; width:100px;  }
#conf_msg { clear:both; text-align:center; border-top:#e4e4e4 1px dotted; }

/* join_check */
#joinChk { padding:5px 40px 0 40px; }
#joinChk p { height:40px; }
#joinChk li.infor { margin-bottom:15px; border-bottom:1px solid #eeeeee; }
#joinChk li.infor p label { float:left; width:100px; }
#joinChk li.infor p span { color:#66a2c8; }
#joinChk textarea { width:98%; height:100px; margin:10px 0; }


.btn-primary:hover,
.btn-primary:focus,
.pf-join-form .btn-info:hover, 
.pf-join-form .btn-info:focus,
.pf-join-form .pw-reset-btn:hover,
.pf-join-form .pw-reset-btn:focus {
	background-color: #3c4451 !important; 
	border:none!important;
}
/*.join li .msg_tip { margin-left:10px;position:absolute; background:#E0E0E0 url(https://storage.googleapis.com/i.addblock.net/tip_arrow.gif) center left no-repeat; top:30px; display:none; border-left:none; padding:15px; color:#666; }*/
#mb_profile { height:55px; }
#jmore { cursor:pointer; text-decoration:underline; }
#joption { display:none; }
#join_ad { position:absolute; top:30px; left:320px; width:400px; }
#join_ad p b { font-size:20px; line-height:30px; }
/* join_result */
#joinRes,.joinCertifyMail { padding:0; font-size: 12px; }
#joinRes h3,
.joinCertifyMail h3 {     
    font-size: 24px;
    margin-top: 40px;
    text-align: center;
    color: #222428;
    text-align: left;
    letter-spacing: normal;
    margin: 0 0 30px 0;
    line-height: 1.4;
}
#joinRes p,
.joinCertifyMail p { 
    text-align: left;
    color: #696c71;
    font-size: 13px;
    margin: 0 0 40px 0;
    line-height: 1.47;
    word-break: keep-all;
}


/* modify_password */
#modifyPwd_title { padding:15px 0px; border-bottom:2px solid #ebebeb; } 
#modifyPwd { margin:0px; padding:20px 0px 10px 0px; background:#ccc; }
#modifyPwd li { padding:10px 0; }
#modifyPwd li input { margin-top:0px; width:250px; }
#modifyPwd li label { float:left; width:150px; }
#modifyPwd li.under {  }
#modifyPwd li.wrkey { height:60px; }
#modifyPwd li label.error { width:340px; margin:0; border:none; }

/* point */
#pnt_title { padding:15px 0; border-bottom:2px solid #ebebeb; }
#pnt_list { padding:20px; }
#pnt_list col.po_date { width:70px; }
#pnt_list col.po_give { width:70px; }
#pnt_list col.po_use { width:70px; }
#pnt_list th { height:24px; background-color:#f6f6f6; border-top:2px solid #e1e1e1; }
#pnt_list tr.po_row { height:24px; text-align:center; }
#pnt_list tr.po_sum { height:24px; text-align:center; background-color:#f6f6f6; }
#pnt_list p.po_none { text-align:center; padding:20px 0; }
#pnt_list p.po_paging { text-align:center; padding:5px 0; }
#pnt_list p.po_total { text-align:center; padding:20px 0; border-top:#e4e4e4 1px dotted; }

/* modify */
.modi { margin:5px 20px 0 10px; overflow:visible; }
.modi #btn_id, #btn_nick, #btn_email { cursor:pointer; }
.modi li { position:relative; overflow:visible; height:100%; padding:10px 0; }
.modi li label { float:left; width:150px; margin-right:25px; }
.modi li label span { color:#DD4B39; }
.modi li label.error { width:300px; margin:0; border:none;margin-left:175px; }
.modi li p.title { margin-left:0px;margin-bottom:5px; }
.modi li select { width:262px;padding:5px;border:1px solid #D9D9D9; }
.modi li input { margin-top:0px; width:250px; }
.modi li input.check { width:15px; }
.modi li.mb_img { margin-left:175px; background:#eee;}
.modi li.last { border:none; }
.modi li .msg_tip { margin-left:10px;position:absolute; background:#E0E0E0; top:0px; display:none; border-left:none; padding:15px; color:#666; }

.error {overflow: hidden; width: 100%; margin:0; position: relative;}
.error label {margin:0;}

/* 로그인, 회원가입 *************************************************************/

.memberIn { 
	position: relative; 
	width: 100%; 
	overflow: hidden; 
	overflow-y: auto;
	 -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    min-height: 100%;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.memberIn #flogin .snslogin { margin: 80px auto;}
.memberIn.emberIn_pwdReset ~ #goto-top-m {display: none;}
.memberIn .cl-common-form-wrap {overflow: hidden; }
.memberIn.memberIn_pwdReset .memberIn_title {font-size:28px; margin: 40px 0 15px 0;}
.memberIn.memberIn_pwdReset #fjoin .join li:last-child { margin-top:22px; }
.memberIn .memberIn_Form {
   	max-width: 500px;
    width: 100%;
    overflow: hidden;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0 40px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    margin: 0 auto;
  	-ms-flex-preferred-size: 1000px;
}
.memberIn.memberIn_pwdReset .memberIn_title {font-size:28px;}
.memberIn.memberIn_pwdReset #fpwd_change .memberIn_tip {margin-bottom: 8px;}
.memberIn.memberIn_pwdReset #fpwd_change .memberIn_infoSubmit {margin-top: 37px;}
.memberIn .memberIn_title {font-size:34px; color:#222428;margin: 40px 0 20px 0; }
.memberIn .memberIn_subTitle {
    margin-bottom: 8px;
    max-width: 278px;
    width: 100%;
    line-height: 1.4;
    display: inline-block;
    color: #8e9095;
}
.memberIn .memberIn_subTitle + .join li {float:left; width: 100%; margin-top: 22px;}
.memberIn .memberIn_subTitle + .join li:last-child {margin-top: 0px;}
.memberIn .memberIn_input {display: block;}
.memberIn .cl-common-form-group { background-color:#f3f4f5;}
.memberIn .memberIn_infoSubmit {text-align: center;}
.memberIn #fjoin .cl-common-form-wrap.cl-form-border-none,
.memberIn.memberIn_pwdReset .cl-common-form-wrap.cl-form-border-none {margin-bottom: 3px;}
.memberIn .memberIn_infoInput,
.memberIn .memberIn_infoSubmit,
.memberIn_infoSubmit li,
.memberIn_infoInput li,
.memberIn_infoInput ~ div {position: relative; width: 100%; float: left;}
.memberIn .creatorlink-top-logo {
    /*text-align: center;*/
    display: inline-block;
    padding:30px 0 0 40px;
    position: fixed;
   /* -webkit-order: 5;
    -ms-flex-order: 5;
    order: 5;*/
}
.memberIn .marginTop-0 {margin-top:0px !important;}
.memberIn .marginbt-8 {margin-bottom:8px !important;}
.memberIn .join + .memberIn_infoSubmit {margin-top:40px;}
.pf-login-body .memberJoin_infoDo {
    float: right;
    width: 100%;
    margin: 2px 0 40px 0;
}
.memberIn .memberJoin_link { 
    margin: 25px 0 0 0;
    color: #8e9095;
    font-size: 14px;
}
.memberIn .memberJoin_link span.memberJoin_text {margin-right: 10px;}
.memberIn .memberJoin_link a.memberJoin_text {color: #4789e7;}

.memberIn .memberIn_btn {
	height: 52px;
    width: 100%;
    background-color: #4789e7;
    color: #fff;
    border-radius: 26px;
    text-align: center;
    font-size: 16px;
    display: inline-block;
    line-height: 49px;
}
.memberIn .submitBtn {width: 100%; overflow: hidden;}
.memberIn .memberIn_btn#login_btn_submit,
.memberIn .memberIn_btn#join_btn_movepage {width:100%;}
.memberIn .memberIn_btn#login_btn_submit { max-width: 60%; float: left;}
.memberIn .memberIn_btn#join_btn_movepage { 
    max-width: 37%; 
    float: right; 
    margin-left: 10px;
    background-color: #ee445f;
}

.pf-login-body .memberJoin_infoDo span {color:#8e9095; font-size: 14px;}
.pf-login-body .memberJoin_infoDo .keep-hint { fill: #4789e7; margin-left: 5px; }
.pf-login-body .memberJoin_infoDo .memberJoin_infoDo_l {float: left;}
.pf-login-body .memberJoin_infoDo .memberJoin_infoDo_r {float: right;}
.pf-login-body .memberJoin_infoDo a { font-size:14px; color:#8e9095; }
.pf-login-body .memberJoin_infoDo .forget { position: relative;}
.pf-login-body .memberJoin_infoDo .register {margin-left: 15px; float: right;}
/*.pf-login-body .memberJoin_infoDo .forget:after {
	content:' ';
	position: absolute;
	width: 1px;
	height: 15px;
	background-color:#dbdcdf;
	margin-left: 15px;
	top: 50%;
    transform: translateY(-50%);
}*/
.memberIn_infoSubmit .snsbtn-logo {
    width: 56px;
    height: 56px;
    background-color: #fff;
    border: 1px solid #e7e8e9;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    position: relative;
}
.memberIn_infoSubmit .snsbtn-logo svg {
	transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    position: absolute;
}
.memberIn_infoSubmit .snsbtn-login {
	float: left;
    margin: 0 15px;
    max-width: 56px;
    width: 100%;
}
.memberIn_infoSubmit .snsbtn-login:first-child {margin-left:0;}
.memberIn_infoSubmit .snsbtn-login:last-child {margin-right:0;}
.memberIn_infoSubmit .snsbtn-naver svg {fill:#1ec800;}
.memberIn_infoSubmit .snsbtn-kakao svg {fill:#391b1b;}
.memberIn_infoSubmit .snsbtn-facebook svg {fill:#436bb7;}
.memberIn_infoSubmit .snsbtn-text {
	display: inline-block;
    color: #8e9095;
    font-size: 12px;
    margin-top: 10px;
}
.memberIn .memberIn_infoSubmit .snslogin {
    max-width: 228px;
    width: 100%;
    margin: 80px auto;
    overflow: hidden;
}
.pf-login-body.memberIn .snslogin {margin:50px auto 80px auto;}
.join li div label.forget,
.join li div label.forget a { 
	color: #2d343e; 
	text-decoration: underline;  
	padding-left:18px;
	color:#797a7d;
	text-align: right;
	letter-spacing: 0.01em;
	float: right;/*keep login*/
	margin-bottom:0;
}
.memberIn_infoInput .cl-common-form-group input { background-color: #f3f4f5 !important;}
.memberIn_infoInput .cl-common-form-group select, .memberIn_infoInput .cl-common-form-group input:focus, 
.memberIn_infoInput .cl-common-form-group input:valid, .memberIn_infoInput .cl-common-form-group input.form-file, 
.memberIn_infoInput .cl-common-form-group input.has-value, .memberIn_infoInput .cl-common-form-group textarea:focus, 
.memberIn_infoInput .cl-common-form-group textarea:valid, .memberIn_infoInput .cl-common-form-group textarea.form-file, 
.memberIn_infoInput .cl-common-form-group textarea.has-value {color:#484b50; font-weight: 400;}
.memberIn .memberIn_tip {
	float: left;
    width: 100%;
    color: #8e9095;
    font-size: 13px;
    margin-top: 2px;
}
.memberIn #recaptcha {margin-top:22px;}
.memberIn #recaptcha + .newcheckbox {margin:40px 0; text-align: center;}
.memberIn #recaptcha + .newcheckbox label {float: none;}
.memberIn #recaptcha + .newcheckbox .error label {display: inline-block; width:auto; height: 17px;}
.memberIn .wr_agree_link {display: inline-block; border-bottom: 1px solid #8e9095; padding-bottom: 2px;}

.memberIn .use-check {
	position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    margin-top: -1px;
}
.memberIn_input.error {color:#484b50 !important;}
.memberIn .use-check svg {fill:#00bc39;}
.memberIn .checkmsg {float: left;width: 100%; margin: -3px 0 8px 0;}

.memberIn .pf-join-form {max-width: 500px;}

/* 비밀번호 재설정 *************************************************************/

#fidp_title { border-bottom:1px solid #ddd; font-size:13px; font-family:'Raleway', 'Nanum Gothic'; font-weight:bold; padding-bottom:10px; } 
#fidp { padding:30px 0px 0px 0px }
#fidp p { height:40px; }
#fidp p label { float:left; width:100px; }
#fidp p label.answer { width:150px; }
#fidp p.wrkey { height:60px; }

#kcaptcha {	float:left;	border-radius: 5px; width: 100%;}
.memberIn .captcha_img {
    max-width: 135px;
    height: 70px;
    float: left;
    margin-right: 15px;
}
.memberIn .captcha_text {float: left; width: calc(100% - 150px);}
.memberIn .captcha_text * {color:#b1b3b7; font-size:14px;}
.memberIn .captcha_reset {font-size:13px; color:#8e9095; margin-top: 5px;}
.memberIn .captcha_reset svg { fill:#8e9095; float:left; margin-right: 2px;}

.errormsg { padding:5px 0px;}
.err { 
    overflow: hidden;
    width: 100%;
    margin: 0;
    position: relative;
}
.err p { color: #ee445f !important}
.agree_text { font-size:12px;}
.agree_text.b { color:#cc0000; font-weight: bold; text-decoration: underline;}
body { overflow: auto;}

/*password_reset*/
.join .pw-reset-btn { 
	margin-top:5px;
}

#reg_mb_email{padding-right: 110px;}
.join li .email-overlay{display: none; position:absolute; width:100%; height: 100%; top:0; left:0; margin-top: 0;}
.join li .email-overlay.show{display: block;}

@keyframes spinner {
  to {transform: rotate(360deg);}
}
 
.spinner:before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    top: 25px;
    right: 15px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border: 2px solid #ccc;
    border-top-color: #3C4450;
    animation: spinner .9s linear infinite;
    z-index: 99;
}
li.check-email { position: relative; }
@media only screen and (max-width: 767px) {
	.pf-login-form { max-width: 95%; }
	.pf-login-form .panel-body { padding: 65px 20px 20px; }
	.pf-join-form { max-width: 100%;  margin-top: 30px;}
	.pf-join-form .panel-body { padding: 50px 40px 45px; font-size: 12px; }
	.pf-join-form .panel-body img { max-height: 30px; max-width: 100% }
	.pf-join-form .panel { max-width: 80%; margin: 0 auto; }
	.pf-join-form input.form-control { padding: 8px 11px; }  
	.pf-join-form .logo-box { margin-bottom: 20px;} 
	.join li h5 { margin-top: 10px; line-height: 1.8; }
	.join li h3 { font-size: 14px; font-weight: bold; margin-top:0; margin-bottom:0;}

    .memberIn #flogin .snslogin { margin: 70px auto 80px auto;}
    .memberIn .memberIn_Form {padding : 0 20px;}
	.memberIn .memberIn_title {margin-top:20px; font-size:28px;}
	.memberIn .memberIn_infoSubmit .snslogin {margin:70px auto 80px auto;}
	.memberIn #fjoin .memberIn_infoSubmit .snslogin {margin-top: 40px;}
	.memberIn.memberIn_pwdReset .memberIn_title {margin-top:20px;}
	.memberIn .memberIn_Form { position: relative; margin: 50px auto 0 auto; justify-content: unset;}
	/*.memberIn .memberIn_Form {margin: 11vh auto 0 auto;}
	.memberIn:not(.memberIn_pwdReset) .memberIn_Form#fjoin {margin: 1vh auto 0 auto;}*/
	.memberIn .creatorlink-top-logo {
		display: inline-flex;
	    top: 0;
	    width: 100%;
	    height: auto;
	    background-color: #fff;
	    z-index: 2;
	    padding: 10px 20px;
	    border-bottom: 1px solid #eeeff0;
	}
	.memberIn .memberIn_btn {height:48px; line-height: 46px;}
	.memberIn_infoSubmit .snsbtn-logo {width:48px; height:48px;}
	.memberIn_infoSubmit .snsbtn-logo svg {width:22px !important; height:22px !important;}
    #joinRes,.joinCertifyMail {margin-top:20px;}
    #joinRes h3,.joinCertifyMail h3 {font-size: 20px; word-break: keep-all; }
}

@media only screen and (max-width: 479px) {
	.pf-login-form .submit { margin: 0; }
	.pf-login-form .bottom-box { margin-top: 10px; margin-bottom:25px; }
	.pf-login-form .panel-body .btn-primary { line-height: 22px; padding: 10px 0; }
	.pf-login-form .submit .btn-fblogin,
	.pf-join-form .submit .btn-fblogin { padding:0; line-height: 42px; }
	.pf-join-form { margin-top: 30px;}
	.pf-join-form .panel { max-width: 94%; }
	.pf-join-form .panel-body { padding: 50px 15px 45px; }
	.pf-join-form .btn { margin-top: 0; padding:12px 0;}
	.join li h5 { font-size: 13px; margin-top: 10px; line-height: 1.8; }
	.join li div label.forget { width: 100%; }
}
@media only screen and (max-width: 380px) {
.memberIn .memberIn_btn#login_btn_submit { max-width: 59%;}
/*
@media only screen and (max-width: 479px) {
.main-login.modal .modal-dialog .modal-content { min-height: 400px; }
.main-login.modal .modal-header .close { margin-top:0; margin-right: 0; }
.main-login.modal .modal-dialog { margin-top: 30px; }
.main-login.modal .modal-header { padding:20px 20px 0; }
.main-login.modal .modal-dialog .modal-body { padding: 20px; }
.main-login.modal .login { margin-top: 20px;  }
.main-login.modal .btn-wrap { margin: 0; }
.main-login.modal .bottom-box { margin-top: 10px; }
.main-login.modal .btn-primary { padding: 10px 0; }
}*/