body {background:#fff;}
.login {height:100%; width:100%; max-height:1030px; max-width:1920px;}
.login:after {content:''; clear:both; display:table;}

.login .img_box .logo {position: absolute; left:90px; bottom:90px; filter:brightness(100); width:180px;}
.login .img_box {float:left; margin:15px; width:calc(50% - 30px); height:calc(100% - 30px); background:url('../img/login_bg.jpg')no-repeat center; background-size:cover;border-radius:20px; position: relative; padding:90px; z-index: 1; overflow: hidden;}

.login .img_box p {font-size: 18px; color:#fff;}
.login .img_box h2 {font-size:45px; color:#fff; font-weight:600; margin-top:18px; margin-left:-4px; line-height:1.18em;}


.login .img_box svg {
  width:100%;
  height: 100%;
   position: absolute; left:0; top:0; z-index: -1;
}

.login .img_box .link {margin-top:30px; height:47px; background:#fff; color:#222; font-weight:500; border:none; font-size:16px;  padding:0 22px; border-radius:10px; width:175px;}
.login .img_box .link img {filter:invert(1);  width:19px; margin:-2px 5px 0 0;}


.login .cont {float:right; width:50%; position: relative; height:100%;}
.login .cont .logo {position: absolute; left:40px; top:30px;  width:180px;}
.login .cont .copy {position: absolute; right:50px; bottom:40px; color:#888; font-weight:400; font-size:13px;}
.login .cont .help {position: absolute; left:50px; bottom:40px; border:none; background:none; color:#888; font-size:13px;}
.login .cont .help img {margin:-2px 4px 0 0; filter:invert(1); opacity: .4;}

.login .txt_box { max-width:460px; position: relative; height:100%; width:100%; display: flex; flex-direction: column; justify-content: center; margin:0 auto;}

.login .txt_box h2 {font-size:38px;  color:#111; font-weight: 800; margin-left:-1px; margin-top:-20px;} 
.login .txt_box h3 {margin-top:13px; font-size:16px; color:#777; font-weight: 400; margin-bottom:5px;}

.login .txt_box .input_box {position: relative; margin-top:30px; }
.login .txt_box .input_box input {height:48px; border:1px solid #e4e4e4; margin-top:8px; padding:0 15px; font-size:15px; width:100%;border-radius:8px; background:none; color:#222; transition: .3s;}
.login .txt_box .input_box .tit {font-size:14px; color:#777; font-weight:400;}
.login .txt_box .input_box .tit:after {contnet:''; clear:both; display: table}
.login .txt_box .input_box .tit button {float:right; border:none; background:none; font-size:13px; color:#8DAFD7; font-weight:600;}
.login .txt_box .input_box .secret {position: absolute; right:13px; bottom:16px; border:none; background:none; opacity: .5;}
.login .txt_box .input_box .secret .show {display: none;}
.login .txt_box .input_box .secret .hide {display: block; position: relative; top:1px;}
.login .txt_box .input_box .secret.active .hide {display: none;}
.login .txt_box .input_box .secret.active .show {display: block;}
.login .txt_box .input_box .pw::placeholder {font-size:7px; letter-spacing: 3px;}
.login .txt_box .input_box.no input {border:1px solid #f12323;}
.login .txt_box .input_box input:focus {border:1px solid #222;}
.login .txt_box .input_box .no_txt {display: none;}
.login .txt_box .input_box.no .no_txt {display:block; color:#f12323;  position: absolute; right:0; bottom:-22px; font-size:14px;}
/* 재전송 성공 등 오류가 아닌 안내 메시지 (F3, .no/.no_txt 와 동일 패턴) */
.login .txt_box .input_box .info_txt {display: none;}
.login .txt_box .input_box.info .info_txt {display:block; color:#2166dd; position: absolute; right:0; bottom:-22px; font-size:14px;}

.login .txt_box .forgot {float:right; font-size:14px; color:#111; margin-top:-18px; font-weight:500;}

.login .txt_box .bt {margin-top:10px; height:50px; border-radius:10px; float:left; width:100%; border:1px solid #111; font-size:17px; letter-spacing: .5px; color:#111; background:#fff; padding-bottom:1px; font-weight:500;} 
.login .txt_box .bt.on {background:#111; color:#fff; border:none; margin-top:40px; }

.login .txt_box input[type="checkbox"] {display: none;}
.login .txt_box .ck_box {margin-top:25px; }
.login .txt_box .ck_box .ck_label {position:relative; display: inline-block; padding-left:27px; font-size:14px; color:#111;  line-height:1.3em;  cursor: pointer;}
.login .txt_box .ck_box .ck_label span {position: absolute; left:1px; top:0px; width:18px; height:18px; border:1px solid #444;border-radius:3px; background:none; }
.login .txt_box .ck_box input[type="checkbox"]:checked + .ck_label span {background:url('../img/check.svg')no-repeat center #111; border:1px solid #111;}
.login .txt_box .ck_box input[type="checkbox"]:checked + .ck_label {color:#111; font-weight:400;}

.login .txt_box .link {display: inline-block; width:100%; margin-top:40px; font-size:15px; color:#999; text-align:center;}

.login .img {position: absolute; right:30px; top:30px; height:calc(100% - 60px); max-height:1030px;}

