@charset "utf-8"; 
/* CSS Document */
@import url("common.css");



body{background:url("../images/bg.gif") no-repeat left top #3b77bf;}
.wrap{width:1024px; margin:0 auto; text-align:center;}

/* loginArea */
.loginArea{width:1024px; background:#fff; margin-top:50px;}
.loginArea:after{clear:both; display:block; content:"";}
/*.loginArea > div {float:left; width:382px; height:206px; text-align:left; margin:35px 0 35px 9px; padding:0 60px;}*/
.loginArea .loginId {float:left; width:382px; height:206px; text-align:left; margin:35px 0 35px 9px; padding:0 60px;}
.loginArea .certi {float:left; width:382px; height:206px; text-align:left; margin:35px 0 35px 9px; padding:0 60px;}
.loginArea div fieldset{position:relative; margin-bottom:10px;}

h1{margin-top:130px;}
h2{font-size:18px; font-family:NGB; font-weight:normal; text-align:left; margin:20px 0 12px 0; color:#23a74f;}
p{font-size:12px; color:#666; margin-bottom:14px;}
/* txt_btn */
/*.txt_btn{float:right; font-size:13px; color:#666; text-decoration:underline !important;}*/
.txt_btn{float:right; font-size:13px; color:#666; }
/* input */
input[type="text"], input[type="password"]{display:block; width:228px; height:36px; line-height:36px; font-family:NanumGothic,ngwoff,ngeot,sans-serif; background:none; border:1px solid #cdcdcd; color:#999; padding-left:46px;}
input[type="checkbox"]{width:12px; height:12px; line-height:12px; font-size:13px; font-family:NanumGothic,ngwoff,ngeot,sans-serif; background:none; border:1px solid #cdcdcd; margin-right:6px;}
label{font-size:13px; color:#666; margin:0; padding:0;}
input.id{background:url("../images/icon_id.gif") no-repeat 12px center; *float:left;}
input.pw{background:url("../images/icon_pw.gif") no-repeat 13px center; margin-top:6px; *margin-top:5px;}

/* login */
p.saveid{float:left; font-size:13px;}
a.btn_login{position:absolute; display:inline-block; right:0px; top:0px; width:100px; height:82px; line-height:82px; background:#23a74f; text-align:center;}
a.btn_login span{font-size:14px; font-family:NGB; color:#fff;}

/* certi */
.certi{position:relative; margin:35px 9px 35px 0 !important; border-left:1px solid #f0f0f0;}
.certi h2{color:#225695;}
/*모듈다운로드화면이 보이게- .certi_download{display:block;} / .certi_login{display:none;}으로*/
.certi_download{display:none;}
.certi_download2{display:block;}
.certi_download_off{display:none;}
.certi_download2{display:none;}
.certi_download2_off{display:none;}
.btn_download{display:block; width:382px; height:72px; line-height:72px; text-align:center; background:#225695; margin-top:10px;}
.btn_download span{font-size:14px; font-family:NGB; color:#fff; background:url('../images/icon_download.png') no-repeat left center; padding-left:26px;}
.btn_download2{display:block; width:382px; height:72px; line-height:72px; text-align:center; background:#225695; margin-top:10px;}
.btn_download2 span{font-size:14px; font-family:NGB; color:#fff; background:url('../images/login.png') no-repeat left center; padding-left:26px;}
/*인증서로그인화면이 보이게- .certi_download{display:none;} / .certi_login{display:block;}으로*/
.certi_login{display:none; position:absolute; top:56px; left:60px; width:382px;}
.certi_login input[type="text"]{width:334px;}

.certi_login_on{display:block; position:absolute; top:56px; left:60px; width:382px;}
.certi_login_on input[type="text"]{width:334px;}
.btn_certi_login{display:block; width:382px; height:38px; line-height:38px; text-align:center; background:#225695; margin-top:6px;}
.btn_certi_login span{color:#fff; font-size:14px; font-family:NGB;}

/* notice_bottom */
.notice_bottom{float:left; width:1024px; text-align:center; background:#f0f0f0; padding:20px 0;}
.notice_bottom li{height:24px; line-height:24px;font-size:13px;}
.notice_bottom li a{font-family:NGB;}
.notice_bottom li a:hover{text-decoration:underline;}

/*popup (200212 추가)*/
.popupWrap {width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-color: rgba(0,0,0,0.3);display:none; z-index:99999;}
.popup {background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); box-sizing: border-box; padding: 30px 20px;}

/*otpInput*/
.otp {width: 400px; }
.btn_close {float: right; width: 38px; height: 38px; background-color: #f0f0f0; box-sizing: border-box; padding: 11px;}
.btnArea {margin-top: 18px;}
.inputArea {margin-top: 18px;}
.inputArea h3 {background: url(../images/icon_pw02.gif) left center no-repeat; box-sizing: border-box; padding-left: 18px; font-size: 16px; color: #225695;}

.otpInput {font-size: 16px; width: 360px; height: 60px; background-color: #3b77bf; box-sizing: border-box; padding: 10px; margin-top: 10px;}
.otpInput input {width: 260px; height: 40px; display: inline-block; padding: 0; border: 0; background-color: #fff; border-radius: 5px;}
.otpInput span {float: right; color: #fff; margin-right: 14px; line-height: 40px;}
.otpBtn {display: block;  font-size: 16px; color: #fff !important; font-family: NGB; width: 360px; height: 60px; background-color: #3b77bf; box-sizing: border-box; line-height: 60px; margin-top: 25px;}
.otpBtn_gray {display: block;  font-size: 16px; color: #fff !important; font-family: NGB; width: 360px; height: 60px; background-color: #aaa; box-sizing: border-box; line-height: 60px; margin-top: 25px;}
.popupBtn .btn {display: inline-block; width: 176px; height: 40px; font-size: 0; margin-top: 10px; box-sizing: border-box; vertical-align: middle; line-height: 40px;}
.btn.green {background-color: #23a74f; color: #fff; border: 0; font-size: 15px;}
.btn.gray {background-color: #fff; border: 1px solid #cdcdcd; color: gray; font-size: 15px; float:right;}

/* 인증 확인 버튼 */
.complete { width: 394px;  height: 77px;  line-height: 77px;  font-size: 18px;  color: #3b77bf;  font-family: NGB; display: none;}
.complete h3 {display: inline-block;}
.btn_check {float: right;  background-color: #3b77bf; box-sizing: border-box; padding: 11px; margin-top:21px;}
.btn_check::after {content: ""; clear: both; display: block;}
.popup2 {background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); box-sizing: border-box; padding:0  20px;}

/* footer */
.footer{margin-top:60px;}
.footer li{height:26px; line-height:26px; font-size:13px; color:#fff;}