﻿@charset "utf-8";

/*=================================================================================
* login
=================================================================================*/
html{height:100%;}
body {background-color: #ececee; margin:0px; font-family: 'Noto Sans KR'; height: 100%;}
main{height: 100%;}

p {margin:0px !important; }

h1 {margin: 0px;}

input:focus {outline: none;}
textarea:focus {outline: none;}
select:focus {outline: none;}

#loginWrap {height:100%;max-width: 700px;margin: 0 auto;background: #fff;text-align: center;border-left: 1px solid #c6c6c6;border-right: 1px solid #c6c6c6;}
#loginWrap .login_header{padding-bottom: 45px;box-sizing: border-box;}
#loginWrap .login{padding-top:200px;}
.header_inner{position: relative;margin: 0 auto;text-align: center;box-sizing: border-box;}
.header_inner .lang{position: absolute;top: 20px;right: 23px;}
.sel {position: relative;font-size: 12px;font-weight: 400;line-height: 18px;width: 100%;min-width: 95px;height: 30px;padding: 4px 10px 6px 8px;color: #333;border: 1px solid #ccc;border-radius: 0;/*-webkit-appearance: none;*/cursor: pointer;z-index: 1;}
.lang::after {content: '';position: absolute;top: 8px;right: 8px;background-position: -180px -156px;background-repeat: no-repeat;height: 14px;z-index: 1;}
.icon_voice, .chatbot .icon_chatbot, .icon_delete, .id_pw_wrap .input_row .icon_cell .icon_id, .id_pw_wrap .input_row .icon_cell .icon_pw, .id_pw_wrap .input_row.on .icon_cell .icon_id, .id_pw_wrap .input_row.on .icon_cell .icon_pw, .img_lock, .img_wowpoint, .ip_relogin_box .relogin_close::after, .ip_relogin_box .relogin_tip::before, .keep_check .keep_text::before, .keep_check input:checked + .keep_text::before, .lang::after::before {
    background-image: url(/resource/solt/images/m_sp_01_login.png);
    background-size: 229px 196px;
    background-repeat: no-repeat;
}
/* 탭 전체 스타일 */
.login_wrap .tabs {padding-bottom: 20px;background-color: #ffffff;width: 490px;margin: 0 auto;box-sizing: border-box;border-radius: 6px;}
.login_wrap .tabs span{padding-left:30px;}
/* 탭 스타일 */
.tab_item {width: 243px; height: 50px;line-height: 50px;font-size: 16px;text-align: center;color: #333333;display: block;float: left;text-align: center;}
.tabtab01 {border-top-left-radius: 6px;border-bottom-right-radius: 6px;color:#787e85;border-bottom: 1px solid #c6c6c6;border-right: 1px solid #c6c6c6;/*background: url(/resource/solt/images/login_id_off.png) no-repeat 69px 14px;*/background-color: #f8f9fa;}
.tabtab02 {border-top-right-radius: 6px;border-bottom-left-radius: 6px;color:#787e85;border-bottom: 1px solid #c6c6c6;border-left: 1px solid #c6c6c6;/*background: url(/resource/solt/images/login_menu_off.png) no-repeat 90px 14px;*/background-color: #f8f9fa;}

/* 라디오 버튼 UI삭제*/
input[name="tab_item"] {display: none;}

/* 탭 컨텐츠 스타일 */
.login_wrap .tab_content {display: none;padding: 20px 20px 0;clear: both;overflow: hidden;}

/* 선택 된 탭 콘텐츠를 표시 */
#all:checked ~ #all_content,#programming:checked ~ #programming_content {display: block;}

/* 선택된 탭 스타일 */
.tabs input:checked + .tab_item {background-color: #ffffff;color: #000;font-weight: 600;border-bottom: none;border-left: none;border-right: none;}
.tabs input:checked + .tabtab01 {/*background: url(/resource/solt/images/login_id.png) no-repeat 69px 14px;*/ display:none;}
.tabs input:checked + .tabtab02 {/*background: url(/resource/solt/images/login_menu.png) no-repeat 90px 14px*/}

/* 아이디, 패스워드 폼 */s
.id_pw_wrap .input_row { display: table; table-layout: fixed; width: 100%;}
.id_pw_wrap .input_row:first-child {border-radius: 6px 6px 0 0;box-shadow: none;}
.id_pw_wrap .input_row:last-child {border-radius: 0 0 6px 6px;margin-top:-1px;}
.id_pw_wrap .input_row .icon_cell {display: table-cell;width: 26px;vertical-align: middle;}
.id_pw_wrap .input_row .icon_cell .icon_id, .id_pw_wrap .input_row .icon_cell .icon_pw {position: absolute;top: 50%;left: 18px;margin-top: -10px;background-position: -206px -141px;background-repeat: no-repeat;width: 20px;height: 20px;}
.id_pw_wrap .input_row .icon_cell .icon_pw {background-position: -206px -97px;background-repeat: no-repeat;width: 20px;height: 20px;}
.blind {position: absolute;clip: rect(0 0 0 0);width: 1px;height: 1px;margin: -1px;overflow: hidden;}
.id_pw_wrap .input_row .input_text {display: table-cell;padding-right: 30px;}
.input_text {position: relative;display: block;width: 100%;font-size: 18px;font-weight: 400;line-height: 24px;color: #222;box-sizing: border-box;z-index: 4;}
.btn_delete {position: absolute;top: 13px;right: 8px;width: 35px;height: 35px;z-index: 5;background-color: #fff;padding-left:0px !important;}
.input_row {position: relative;display: block;height: 100%;border: 1px solid #dadada;padding: 17px 18px 17px 19px;border-radius: 6px;box-sizing: border-box;text-align: left;box-shadow: 0 2px 6px 0 rgb(68 68 68 / 8%);}
.icon_delete {display: inline-block;margin: 8px 0 0 8px;background-position: -178px -172px;background-repeat: no-repeat;height: 18px;}

.bullet_help, .captcha_form .image::after, .captcha_form .reload::after, .captcha_form .voice::after, .captcha_wrap .voice_box .icon_voice, .chatbot .icon_chatbot, .icon_delete, .id_pw_wrap .input_row .icon_cell .icon_id, .id_pw_wrap .input_row .icon_cell .icon_pw, .id_pw_wrap .input_row.on .icon_cell .icon_id, .id_pw_wrap .input_row.on .icon_cell .icon_pw, .img_lock, .img_wowpoint, .ip_relogin_box .relogin_close::after, .ip_relogin_box .relogin_tip::before, .keep_check .keep_text::before, .keep_check input:checked + .keep_text::before, .lang::after, .menu_id .menu_text::before, .menu_id.on .menu_text::before, .menu_id.on::after, .menu_ones .menu_text::before, .menu_ones.on .menu_text::before, .menu_ones.on::after, .menu_ones.on::before, .menu_qr .menu_text::before, .menu_qr.on .menu_text::before, .menu_qr.on::before, .nudge_banner .nudge_close .icon_nudge_close, .ones_text .bullet_set, .pop_img_lock, .pop_ones_text .bullet_set, .qrcode_help_stepbox .popup_close::after, .qrcode_help_stepbox .step_title::before, .sns_wrap li:nth-child(1) .sns_text::before, .sns_wrap li:nth-child(2) .sns_text::before, .sns_wrap li:nth-child(3) .sns_text::before, .step_ask .ask_text::before, .sub_desc .bullet_greendot, .sub_desc .bullet_lens, .time_wrap .btn_renewal::before {
background-image: url(/resource/solt/images/m_sp_01_login.png);
background-size: 229px 196px;
background-repeat: no-repeat;
}

/* 로그인상태유지 */
.login_keep_wrap {position: relative;margin-top: 12px;float:left;width:50%;}
.keep_check {position: relative;padding-left: 29px;float:left;}
.keep_check .input_keep {position: absolute;top: 2px;left: 3px;width: 15px;height: 15px;}
.keep_check .keep_text {display: inline-block;font-size: 15px;font-weight: 500;line-height: 19px;color: #777;}
.keep_check .keep_text::before {content: '';position: absolute;top: 3px;left: 0;background-position: -155px -139px;background-repeat: no-repeat;width: 23px;height: 23px;background-color: #fff;}
.keep_check input:checked+.keep_text::before {background-position: -206px 0;background-repeat: no-repeat;width: 23px;}
/* 비밀번호 찾기 */
.pannel {display:inline-flex;width:100%;}
.pw_find{margin-top:22px; float:right; width:50%;justify-content: end;display: grid;}
.pw_find span{font-size:15px; font-weight:500; line-height:19px; color:#777777; padding-left:0px !important; padding-right:6px; padding-top:2px;}
.pw_find_help{display:flex;}
/* 로그인 버튼 */
.btn_login_wrap{margin-top:20px;}
.btn_login_wrap button{display: block;width: 100%;padding: 13px 0 13px;border-radius: 6px;border: solid 1px rgba(0,0,0,.15);}
.btn_login_wrap button span {padding-left: 0px !important;}
.btn_login_wrap button:hover{opacity:0.8;}

/* footer 텍스트 */
.form-control {display: block;width: 90%;font-size: 1rem;font-weight: 400;line-height: 1.5;background-color: #fff;border: 1px solid #fff;border-radius: 0rem;padding-left: 5px;margin-left:24px;}
.form-control-a {display: block;width: 100%;height: calc(1.5em + -0.25rem + 9px);font-size: 1rem;font-weight: 400;line-height: 1.5;background-color: #fff;border: 1px solid #fff;border-bottom: 1px solid #d5d5d5;margin-top: 10px;margin-bottom: 18px;}
.jbGrad01 {width: 452px;margin: 0 auto;line-height:19px;}
.jbGrad01 p{background: url(/resource/solt/images/ico_hyphen.png) no-repeat 0px 9px;padding-left:9px;}
.jbGrad01 p:first-child{text-align: left;font-size: 13px;margin-top: 30px;color: #898989;}
.jbGrad01 p:nth-child(2){text-align: left;font-size: 13px;color: #898989;margin-top: 2px;}
.jbGrad01 p:nth-child(3){text-align: left;font-size: 13px;color: #898989;margin-top: 2px;}
.jbGrad01 strong{color:#1e588e; font-weight:500;}
.btn-success {color: #fff;background-color: #1e588e !important;border-color: #1e588e !important;font-weight: bold;font-size: 19px;}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: #444444 !important;
}

/* 메뉴 */
.box_first{display:flex;width:100%;border-bottom:1px solid #e9e9e9;height: 118px;}
.box_call{width:50%; border-right:1px solid #e9e9e9;cursor: pointer;}
.box_call img:last-child {display: none}
.box_call:hover img:first-child {display: none}
.box_call:hover img:last-child {display: inline-block;}
.box_call p{padding-top:2px;color: #1e1e23;font-weight: bold;}
.box_bookmark{width:50%;cursor: pointer;}
.box_bookmark img:last-child {display: none}
.box_bookmark:hover img:first-child {display: none}
.box_bookmark:hover img:last-child {display: inline-block;}
.box_bookmark p{padding-top:2px;color: #1e1e23;font-weight: bold;}
.box_second{display:flex;width:100%;height: 138px;}
.box_homepage{width:50%; border-right:1px solid #e9e9e9;padding-top:20px;cursor: pointer;}
.box_homepage img:last-child {display: none}
.box_homepage:hover img:first-child {display: none}
.box_homepage:hover img:last-child {display: inline-block;}
.box_homepage p{padding-top:2px;color: #1e1e23;font-weight: bold;}
.box_short{width:50%;padding-top:20px;cursor: pointer;}
.box_short img:last-child {display: none}
.box_short:hover img:first-child {display: none}
.box_short:hover img:last-child {display: inline-block;}
.box_short p{padding-top:2px;color: #1e1e23;font-weight: bold;}

/* copyright */
.cr_info{bottom:0; position:fixed; margin-bottom:10px; width:701px;}
.info_list{display:flex; justify-content:center;}
.cr_info .info01{text-align: left;font-size: 11px;color: #ababab;margin-top: 2px;padding-left: 4px; padding-top: 2px;}

/* 모바일 */
@media screen and (max-width: 540px) {
    #loginWrap .login_header {padding-bottom: 20px; box-sizing: border-box;}
    #loginWrap .login {padding-top: 150px;}
    .jbGrad01{display:none;}
}
@media screen and (max-width: 414px) {
    .login_wrap .tabs {width: 380px;}
    .tab_item{width:188px;}
    .tabs input:checked + .tabtab01 {background: url(/resource/solt/images/login_id.png) no-repeat 40px 14px;}
    .tabtab01{background: url(/resource/solt/images/login_id_off.png) no-repeat 40px 14px;}
    .tabs input:checked + .tabtab02 {background: url(/resource/solt/images/login_menu.png) no-repeat 63px 14px;}
    .tabtab02{background: url(/resource/solt/images/login_menu_off.png) no-repeat 63px 14px;}
    .cr_info{display:none;}
}
@media screen and (max-width: 375px) {
    .login_wrap .tabs {width: 346px;}
    .tab_item{width:171px;}
    .tabs input:checked + .tabtab01 {background: url(/resource/solt/images/login_id.png) no-repeat 33px 14px;}
    .tabtab01{background: url(/resource/solt/images/login_id_off.png) no-repeat 33px 14px;}
    .tabs input:checked + .tabtab02 {background: url(/resource/solt/images/login_menu.png) no-repeat 55px 14px;}
    .tabtab02{background: url(/resource/solt/images/login_menu_off.png) no-repeat 55px 14px;}
}
@media screen and (max-width: 360px) {
    .login_wrap .tabs {width: 330px;}
    .tab_item{width:163px;}
    .tabs input:checked + .tabtab01 {background: url(/resource/solt/images/login_id.png) no-repeat 29px 14px;}
    .tabtab01{background: url(/resource/solt/images/login_id_off.png) no-repeat 29px 14px;}
    .tabs input:checked + .tabtab02 {background: url(/resource/solt/images/login_menu.png) no-repeat 50px 14px;}
    .tabtab02{background: url(/resource/solt/images/login_menu_off.png) no-repeat 50px 14px;}
    .box_first p{font-size:14px;}
    .box_second p{font-size:14px;}
    #loginWrap .login {padding-top: 106px;}
    .login h1 img{width:64%;}
    .login_wrap .tabs {width: 288px;}
    .tab_item{width:142px;}
    .tabs input:checked + .tabtab01 {background: url(/resource/solt/images/login_id.png) no-repeat 20px 14px;}
    .tabtab01{background: url(/resource/solt/images/login_id_off.png) no-repeat 20px 14px;}
    .tabs input:checked + .tabtab02 {background: url(/resource/solt/images/login_menu.png) no-repeat 42px 14px;}
    .tabtab02{background: url(/resource/solt/images/login_menu_off.png) no-repeat 42px 14px;}
    .login_wrap .tab_content{padding:16px 0px;}
}






















/*=================================================================================
mobile
=================================================================================*/
/*@media screen and (max-width: 360px) {
    body {
        background: #fff;
    }

    .login {
        margin-top: -159px;
    }
}

@media screen and (max-width: 375px) {
    body {
        background: #fff;
    }

    .login {
        margin-top: -192px;
    }
}

@media screen and (max-width: 414px) {
    body {
        background: #fff;
    }

    .jbGrad01 {
        display: none;
    }

    .login {
        margin-top: -145px;
        height: 400px !important;
    }
}*/