@charset "UTF-8";
/*로그인*/
.loginWrap {position: relative;padding: 20px 0px 5px;margin-top: 25px; background-color: #f9f5f5;}
.login .top-title{position: relative; width:100%;width: 100%;text-align: right;padding-right: 240px;}
.login .top-title:after{content: "";position: absolute;top: -40px;right: 0;width: 232px;height: 186px;background:url(/images/kor/sub06/sub06_05_02_img01.png) no-repeat center;z-index: 10;}
.login .top-title p{font-size:14px;line-height: 1.4;margin-top: 5px;}
.login .top-title strong{display:block;font-family: 'score';font-size: 50px;font-weight: bold;color: #fff;text-shadow: -1px 0 #f8f8f8, 0 1px #f8f8f8, 1px 0 #f8f8f8, 0 -1px #f8f8f8;letter-spacing: 10px;text-indent: 30px;line-height: 1;}
.login .top-title p b{display:block;color:#449a97 ;line-height: 1;margin-top: -2px;margin-bottom: 3px;}
.loginWrap_con,.login_forget{max-width:477px; margin:0 auto; width:100%;}

.loginWrap_con{position:relative;padding:0 120px 20px 10px; border-bottom: 1px dashed #ddd;}
.loginWrap_con input{box-sizing:border-box;display:block;width:100%;min-height:38px;height:auto;padding:0 5px;vertical-align:middle;border:1px solid #DDD;}
.loginWrap_con dl{display:table;width:100%; margin:10px 0; position:relative; padding-left:77px}
.loginWrap_con dl dt,
.loginWrap_con dl dd{display:table-cell;vertical-align:middle;}
.loginWrap_con dl dt{width:72px; font-weight:500; position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
.loginWrap_con dl dd{width:100%;}
.loginWrap_con .btn_login{width:100px;height:85px;background: #449a97 ;color:#FFF;border:0;position:absolute;right:10px;top:0;font-weight: bold;border-radius: 5px;}
.login_forget{margin: 20px auto;}
.login_forget span{vertical-align: middle;}
.login_forget a{display:inline-block;float:right;margin-left:3px;padding: 10px 0 7px;width:120px;text-align:center;background:#9a9a9a;color:#FFF !important;font-size: 14px;border-radius: 5px;line-height: 1.2;}
.loginWrap_con .btn_login:hover,
.loginWrap_con .btn_login:focus,
.login_forget a:hover,
.login_forget a:focus{background:#52575c;transition: all 0.2s cubic-bezier(0.2, 0, 0.3, 1);}

@media only screen and (max-width:1145px){

	.login .top-title:after{width: 140px; height: 140px; background-size: 100%; top: 10px; }
	.login .top-title{padding-right: 156px;}
	.login .top-title strong{font-size: 45px;}
}

@media only screen and (max-width:1023px){

	.login .top-title:after{top: -40px; right: 0; width: 232px; height: 186px; }
	.login .top-title{padding-right: 240px;}
	.login .top-title strong{font-size: 50px;}
}

@media only screen and (max-width:860px){

	.login .top-title:after{width: 140px; height: 140px; background-size: 100%; top:10px }
	.login .top-title{padding-right: 156px;}
	.login .top-title strong{font-size: 40px;}
}

@media only screen and (max-width:730px){

	.loginWrap_con{width:80%;}
	.login_forget{text-align:center;width:80%;}
	.login_forget span{display:block;margin-bottom:20px;}
	.login_forget a{float:none;}

}

@media only screen and (max-width:670px){

	.login .top-title:after{display:none }
	.login .top-title{padding-right: 0}

}

@media only screen and (max-width:540px){

	.login .top-title{text-align: center;}
	.login .top-title strong{font-size: 30px;}

}


@media only screen and (max-width:480px){
	.loginWrap{padding:15px;}
	.loginWrap_con{width:100%; padding-right:0; padding-bottom:30px}
	.login_forget{width:100%}
	.loginWrap_con dl{display:block;width:100%;}
	.loginWrap_con dl dt,
	.loginWrap_con dl dd{display:block;width:100%;}

	.loginWrap_con .btn_login{width:100%;padding:10px 0;height:auto;position:relative;top:10px; right:0}

}

@media only screen and (max-width:340px){

	.login_forget a{width:100%; display:block}
	.login_forget a:first-of-type{margin-bottom: 5px;}

}


@media only screen and (max-width:320px){
	.login_forget a{display:block;margin-left:0;margin-bottom:5px;width:100%;}
}



.ui-topbox .sns-btn{margin-top:10px;text-align: center;}
.ui-topbox .sns-btn button{display:table;width:100%;margin-top: 5px;text-align:
center;border-radius: 30px;}
.ui-topbox .sns-btn button >
span{color:#fff;font-size:15px;display:table-cell;vertical-align:middle;height:50px;text-align:center;width: 100%;/*
display: block; *//* padding: 0 30px; */line-height: 50px;font-weight: bold;}
.ui-topbox .sns-btn button > span i{margin-right: 10px;display:
inline-block;width: 30px;height: 30px;background-repeat: no-repeat;background-size:100%;margin-top: -2px;}


.ui-topbox .sns-btn button > span *{vertical-align:middle}
.ui-topbox .sns-btn button > span em{display:inline-block;vertical-align: top;}

.ui-topbox .sns-btn button.naver{background:#00c300;}
.ui-topbox .sns-btn button.kakao{background:#fae332;}
.ui-topbox .sns-btn button.facebook{background:#3b5a9a;}
.ui-topbox .sns-btn button.google{background:#fff;/* border:1px solid #ddd; */box-sizing: border-box;}
.ui-topbox .sns-btn button.kakao span{color:#3a2020}
.ui-topbox .sns-btn button.google span{color:#333;border: 1px solid #e4e4e4;padding-left: 10px;padding-right: 18px;}
.ui-topbox .sns-btn button.naver > span > i{background-image: url(/pcms/common/images/ir/sns/naver.svg);}
.ui-topbox .sns-btn button.kakao > span > i{background-image: url(/pcms/common/images/ir/sns/kakao_talk.svg);}
.ui-topbox .sns-btn button.facebook > span i{background-image: url(/pcms/common/images/ir/sns/facebook.svg);
    background-position: -4px -2px;}
.ui-topbox .sns-btn button.google > span  > i{ background-image: url(/pcms/common/images/ir/sns/google.svg);}

.ui-topbox .sns-btn button:hover > span em,
.ui-topbox .sns-btn button:focus > span em{color:#449a97}