/*마이페이지 > 내 강의 > 중지하기 팝업*/
#loginArea{position:fixed; z-index:1000; width: 100%; height:100%; top:0; left:0;}
#loginArea .bg_000{display: block; opacity: 1; z-index:101;}
#loginPopup .login_close_btn{width: 18px; position: absolute; top: 20px; right: 20px; cursor: pointer;}
#loginPopup {position:absolute; z-index:102; width: 100%; max-width:420px; height:auto; top:50%; left:50%; margin-left:-210px; margin-top:-252px; background:#fff;padding:60px 40px;}
#loginPopup .login_inner_wrap{ vertical-align: middle; width: 100%; margin: 0 auto; overflow: hidden;text-align:center;}
#loginPopup .login_inner_wrap:after{display: block; content: ''; clear: both;}

#loginPopup .login_inner_wrap input:focus{outline: none; box-shadow:inset 0 0 0 1px var(--keycolor); border:none;}

#loginPopup .login_inner_wrap .login_wrap{border-bottom: none;}
#loginPopup .login_inner_wrap .login_wrap{width: 100%; height: 100%; text-align: center; display:inline-block;position: relative;}
#loginPopup .login_inner_wrap .login_wrap .login_middle_wrap {width: 100%;}
#loginPopup .login_inner_wrap .login_wrap h3{margin:0 0 27px; font-weight: 500; font-size: 28px;}
#loginPopup .login_inner_wrap .login_wrap p{margin-bottom: 2.5em;}
#loginPopup .login_inner_wrap .login_wrap .login_form{width: 100%; max-width: 420px; margin: auto;}
#loginPopup .login_inner_wrap .login_wrap .login_form input{width: 100%; height: 46px; border-color:#ddd; border-radius: 2px;}
#loginPopup .login_inner_wrap .login_wrap .login_form input::placeholder{color:#999; padding-top: 1px; font-size: 13px;}

#loginPopup .login_inner_wrap .login_wrap .login_form .save_id{text-align: left; margin-bottom: 14px;}
#loginPopup .login_inner_wrap .login_wrap .login_form .save_id label{font-size: 14px; color: #555;}

#loginPopup .login_inner_wrap .login_wrap p.btnarea{margin-bottom: 18px;}
#loginPopup .login_inner_wrap .login_wrap p button{display: block; border: none; width: 100%; height:46px; font-size: 18px; transition:0.4s;}
#loginPopup .login_inner_wrap .login_wrap .login_sch{margin-bottom: 40px;}
#loginPopup .login_inner_wrap .login_wrap .login_sch ul{text-align: center;}
#loginPopup .login_inner_wrap .login_wrap .login_sch ul li{display: inline-block;}
#loginPopup .login_inner_wrap .login_wrap .login_sch ul li:first-child:after{content: ''; clear: both; width: 1px; height: 12px; float:right; background-color: #ddd; margin-top: 3px}
#loginPopup .login_inner_wrap .login_wrap .login_sch ul li:last-child:after{content: ''; clear: both; width: 1px; height: 12px; float:left; background-color: #ddd; margin-top: 3px}
#loginPopup .login_inner_wrap .login_wrap .login_sch ul li a{font-size: 14px; color:#777; padding: 0px 9px 0 8px;}
#loginPopup .login_inner_wrap .adBanner_wrap{width: 50%;float:right;}
#loginPopup .login_inner_wrap .adBanner_wrap img{width:100%;}
#loginPopup .login_inner_wrap .adBanner_wrap .mobile{display: none;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer h5{color: #111; font-size: 15px; margin-bottom: 20px; font-weight: 500;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer h5:before{content: ''; width: calc(50% - 50px); height: 1px; background: #ddd; float: left; margin-top: 7px;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer h5:after{content: ''; width: calc(50% - 50px); height: 1px; background: #ddd; float: right; margin-top: 7px;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul{}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul:after{display: block; content: ''; clear: both;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li{float: left; width: calc(50% - 5px); margin-right: 10px; border-radius: 2px; padding: 11px 26px 10px;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li:last-child{margin-right: 0px;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li.kakao{background:#ffe800;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li.naver{background:#1ec800;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li a{font-size: 14px; padding-left: 10px; line-height: 1.2;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li.kakao a{color: #381e1f;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li.kakao a:before{
    content: '';
    background: url(../images/member/login_kakao.svg) no-repeat center;
    background-size: 21px auto;
    float: left;
    width: 21px;
    height: 19px;
}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li.naver a{color: #fff;}
#loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li.naver a:before{
    content: '';
    background: url(../images/member/login_naver.svg) no-repeat center;
    background-size:21px auto;
    float: left;
    width: 21px;
    height: 19px;
}
#loginPopup .login_inner_wrap .login_wrap .go_join{display: block; height: 44px; font-size: 15px; line-height:40px; box-sizing:border-box; background-color: none; border: 1px solid #ddd; text-align: center; transition:0.4s;}
#loginPopup .login_inner_wrap .login_wrap .go_join:hover{background-color: none; border-color:#555555;}
#loginPopup .login_inner_wrap .login_wrap .input_area{margin-bottom: 10px;}
#loginPopup .login_inner_wrap .login_wrap .wrong_span{
    font-size:13px;
    color: var(--keycolor);
    position: relative;
    padding-left: 19px;
    top: 8px;
    width: 100%;
    line-height: 1.4;
    text-align: left;
    margin-bottom: 10px;
}
#loginPopup .login_inner_wrap .login_wrap .wrong_span:before{
    content: '';
    background: url(../../data/customImages/iconMark.svg) no-repeat center;
    background-size: 14px 14px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top:1px;
}

#loginPopup .login_inner_wrap .login_wrap input:checked + label.chkbox:before{background: var(--keycolor); border: none;}
#loginPopup .login_inner_wrap .login_wrap input:checked + label.chkbox:after{background: url(../../images/common/icon_check_fff.png) 50% 44% no-repeat;background-size: 100% !important;}


@media screen and (max-width:599px){
}

@media screen and (max-width: 460px){
    #loginPopup{max-width: 330px; margin-left: -165px; padding: 43px 20px;margin-top:-260px;}
    #loginPopup .login_inner_wrap .login_wrap h3{margin:0 0 20px; font-size: 25px;}
    #loginPopup .login_inner_wrap .login_wrap .login_form input{height: 42px;}
    #loginPopup .login_inner_wrap .login_wrap .login_form input::placeholder{padding-top: 0px;}
    #loginPopup .login_inner_wrap .login_wrap p button{height: 42px; font-size: 16px;}
    #loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li{float: none; width: 100% !important; margin-right: 0;  padding: 11px 26px 13px;   margin-bottom: 8px;}
    #loginPopup .login_inner_wrap .login_wrap .login_snsVer ul li:last-child{margin-bottom: 0px;}
}

@media screen and (max-width: 360px){
    #loginPopup{max-width: 290px; margin-left: -145px;}
    #loginPopup .login_inner_wrap .login_wrap .login_sch ul li a{font-size: 13px;}
}