@charset "utf-8";

.signin-box{ height:100%;min-height:900px;}

/*로그인 버튼*/
.signin{position:relative;background:url(../images/signin_bg_hynix_20250910.jpg) center center no-repeat;background-size:cover;width:100%;height:100vh;font-family: 'NotoKrR';}
.signin h1{position:absolute;top:30px;left:30px;}
.signin-wrap{width:500px;position:absolute;top:50%;left:50%;transform:translate(-150%,-50%)}
.signin-contents{position:relative;height:690px;/*전체높이*/border-radius: 0px;background-color: #ffffff;border: 2px solid #ffffff;padding: 0px;box-shadow: 8px 8px 12px 0 rgba(0, 0, 0, 0.1), -8px -8px 12p 0 rgba(0, 0, 0, 0.1);}
.signin-rsa-wrap{width:460px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.signin-rsa-contents{position:relative;height:340px;/*전체높이*/border-radius: 0px;background-color: #ffffff;border: 2px solid #ffffff;padding: 0px;box-shadow: 8px 8px 12px 0 rgba(0, 0, 0, 0.1), -8px -8px 12p 0 rgba(0, 0, 0, 0.1);}
/* .signin-logo{position: relative;float: left; height:100%;width:49%;background:url(../images/signin_bg.png) 0 0 no-repeat;background-size:560px 700px;text-align:center;margin-right: 10px;} */
.signin-logo{position: relative;float: left; height:100%;width:49%;background-color:#4747b3;background-size:560px 700px;text-align:center;margin-right: 10px;}
.signin-logo h2{margin-top:90px;}
.signin-logo h3{color:#fff;font-size:20px;font-weight:normal;margin-top:10px;}
.signin-area {float: right; position: relative; height:100%; margin: 0 auto; padding: 0px 0 0 0px;}
.signin-form{float: right; position:relative;width:50%;}
.signin-btn {width:70%;margin:0 auto;padding: 50px 0;}
.signin-btn a{display:block;font-size:16px;text-align:center;padding:17px 0 17px 13px;font-weight:bold;border-radius:3px;margin-bottom:10px}
.btn-inside{color:#fff}
.btn-outside{color:#fff}
.btn-faq{color:#222;background-color:#eee}
.signin-title{color:#333;font-size:23px;text-align:center;margin-bottom:20px;margin-top:40px;}
.btn-back{color:#555;font-size:15px;padding:0 0 0 24px;}
.signin-form .change_lang{position:absolute;right:27px;top:27px;}
.signin h3{font-size: 26px;margin: 0 0px 20px 0;font-weight: normal;text-indent:-3px;color: #ffffff;}
.signin-contents:after {content: '';position: absolute;left: -37px;bottom: -1px;width: 412px;height: 39px;display: block;z-index:-1;}

#logoImg{margin: 20px;position: absolute;z-index: 1;}
.signin-form {float: right; position: relative; width: 100%; height:100%; margin: 0 auto; padding: 0px 0 0 0px;}
.signin-form .ci {position: relative; float: left; width:102px; height:53px; text-indent: -9999px; background: url(../images/eSecurity/common/main/login_ci.png) center center no-repeat;}

/*로그인 폼*/
.signin-wrap form{margin:0 auto;}
.signin-wrap input[type=text],.signin-wrap input[type=password]{height:50px;margin-bottom:10px;border:1px solid #ddd;border-radius:3px;color:#333;font-size:16px;padding-left:60px;}
.signin-wrap input[type=text]{background:url(../images/signin_id.png) 20px center no-repeat;background-size:30px 30px;width: calc(100% - 72px);}
.signin-wrap input[type=password]{background:url(../images/signin_pw.png) 20px center no-repeat;background-size:30px 30px;width: calc(100% - 72px);}
.signin-wrap form div{position:relative;height:auto;line-height: 18px;}
.signin-wrap input[type=checkbox]{position:absolute;opacity:0;}
.signin-wrap input[type=checkbox] + span{display:block;border:1px solid #ddd;width:25px;height:25px;border-radius:3px;float:left;}
.signin-wrap label strong{display:block;float:left;font-weight:normal;font-size:15px;color:#333;margin:5px 0 0 10px;}
.signin-wrap input[type=checkbox]:checked + span{background-color:white;position:relative;}
.signin-wrap input[type=checkbox]:checked + span:after{content:'';display:block;border:1px solid red;border-radius:10%;border-radius:3px;width: 100%;    height: 100%;top: 0%;left: 0%;position: absolute; background: url(../images/checked.png) center center no-repeat;    background-size: 14px 10px;background-color:#fe3c16;}
.signin-wrap input::placeholder {color: #333;}

.signin-wrap form div.signin-find {margin:0 auto;padding-top:0px;height:40px;display:table;}
.signin-find a {float:left;color:#666;font-size:14px;font-weight:normal;padding:0;}
.signin-find .line {float:left;font-size:0;border-left:1px solid #bbb;height:9px;margin:6px 15px 0 15px}
.btn-outside:hover {background: #2e2e96 !important; cursor: pointer;}
.login-user-submitbox{width:100%;}
.login-user-submitbox .btn-back{width:calc(50% - 4px);margin-right:4px;    color: rgba(0, 0, 0, 0.8);border: 1px solid #d0d1d6;color: #555;font-size: 16px;padding:17px 0px 17px 0px;display: block;text-align: center;border-radius: 3px;line-height: 1;}
.login-user-submitbox .btn-submit{color:white;color: rgba(255, 255, 255, 1);width:calc(50% - 4px);border: 1px solid #4747B3 ;font-size: 16px;padding: 17px 17px 17px 17px;display: block;text-align: center;border-radius: 3px;display:block;line-height: 1; padding: 17px 0 17px 0;border-radius: 3px;position: absolute;right: 0;top: 0;rgba(255, 255, 255, .87);}
.signin-wrap form div.id_save_cnt{height:40px;}
.signin-wrap form div.id_save_cnt label{display: inline-block;margin-right:10px;}
.signin-wrap input[type=text]:focus, .signin-wrap input[type=password]:focus{ border-color: #000;}
.btn-find-id:hover, .btn-change-pw:hover { color:#fe3c16;}
.id_save_cnt strong:hover{color:#fe3c16; cursor:pointer}

/*아이디 찾기, 비밀번호 변경*/
.btn-password{width:180px;display:block;height:50px;font-size:15px;color:#fff;margin:30px 0 0 126px;border-radius:3px;}
.input-form{padding:30px 30px 0 30px;}
.input-form div{position:relative;margin-bottom:20px;}
.input-form label{font-size:15px;color:#333;display:inline-block;width:120px;font-weight:bold;}
.input-form input{border:1px solid #ddd;display:inline-block;width:280px;height:50px;padding:0 15px;border-radius:3px;font-size:14px;}
.input-form input.phone{width:170px;}
.input-form input.phone-check{margin-left:125px;margin-top:10px}
.input-form a{position:absolute;right:0;width: 105px;height: 50px;line-height:50px;border-radius:3px;background-color: #d2e3f9;font-size:13px;color:#222;text-align:center;}
.input-form .phone-time{position:absolute;right:20px;color:#645b4c;font-size:14px;bottom:19px;}
.input-form input::placeholder {color: #aaa;}
.find-id{display:block}
.find-success{display:none;text-align:center;}
.find-success span{color:#666;font-size:15px;display:block;margin-top:65px;}
.find-success strong{font-size:32px;color:#222;display:block;font-weight:normal;margin:40px 0 60px 0}
.find-success a{color:#222;font-size:16px;width:320px;height:55px;line-height:55px;border-radius:3px;display:block;margin:0 auto;margin-bottom:15px;}
.find-success .btn-change-pw{color:#fff;}

/*
	원정인 : 로그인 추가 CSS
*/
.btns-login-attention{display:block;background-color:#918cd9;margin-top:30px;color:#fff;padding:16px;transition:.2s;border-radius:3px}
.login-user-submitbox button:hover{background:#2e2e96!important}
.btns-login-attention h4{font-size:14px;font-weight:400;margin-top: 4px;margin-bottom:4px;margin-left:16px;text-indent:-16px;font-family:NotoKrL}
.loginmarker{content:'';display:inline-block;vertical-align:middle;margin-right:9px;width:4px;height:4px;border-radius:2px;background:#d6d6d6}
/*.login-tlt{color:#333;padding:5px 0 4px;display:inline-block}*/
.login-tlt{color:#333;padding:5px 0 5px;display:inline-block}
.btn-login{display:block;font-size:16px;text-align:center;padding:17px 0 17px 13px;font-weight:700;border-radius:3px;margin-bottom:10px;background-color:#4747b3!important;opacity:1;color:#fff;width:100%}

/*
	원정인 : 다국어
*/
.login-localizing-lang {position: fixed; right: 20px; top: 20px; }
.login-localizing-lang li {position: relative; float: left; display: inline-block;margin: 0 0 0 3px;}
.login-localizing-lang li a {position: relative; width: auto; background: #646e75; color:#fff; padding: 0 15px; line-height: 30px; display: block; border-radius: 30px; transition:all .2s;font-size:14px;}
.login-localizing-lang li a:hover {background: #fe3c16;}
.login-localizing-lang li a.on {background: #fe3c16;}