@charset "utf-8";
/* --------------------------------------------------
* Version	: 1.0
* Date		: 2018.06
* Author	: SangKi Park / pak81@saerom.co.kr, seon81.park@gmail.com
* Note    : 자주 바뀌므로 클래스를 추가하여 사용할 것을 권장
\* -------------------------------------------------- */


/** Wptheme
===================================*/
#layoutContainers .component-container { width:100%; }


/** Login
===================================*/
/* Layout */
.loginPage { display:table; table-layout:fixed; min-width:920px; width:100%; height:100%; }
.loginPage > .inner { display:table-cell; width:100%; text-align:center; vertical-align:middle; }

/* Header */
.loginHeader { margin:0 auto; padding:24px 0; width:920px; text-align:left; }
.loginHeader .logo { padding:0 8px; }

/* Container */
.loginContainer { margin:0 auto; padding:10px 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; width:920px; }
.loginContainer:after { content:''; clear:both; display:table; }
.loginBanner { float:left; width:420px; }
.loginForm { float:left; padding:50px 40px 0 60px; width:400px; text-align:left; }
.loginForm .loginBox { position:relative; padding:0 9px; border:1px solid #e0e0e0; border-radius:9px; }
.loginForm .inputText { position:relative; padding:0 0 0 42px; border-bottom:1px solid #e0e0e0; }
.loginForm .inputText + .inputText { border-bottom:0; }
.loginForm .inputText label { overflow:hidden; position:absolute; top:50%; left:4px; margin-top:-15px; width:30px; height:30px; background:url(../images/login/sp_login.png) no-repeat; text-indent:-9999px; }
.loginForm .inputText label[for="userID"] { background-position:0 0; }
.loginForm .inputText label[for="userPW"] { background-position:0 -40px; }
.loginForm .inputText input { float:left; border:0; width:186px; height:58px; font-size:13px; color:#333; }
.loginForm .inputText input::-webkit-input-placeholder { color:#999; }
.loginForm .inputText input::-moz-placeholder { color:#999; }
.loginForm .inputText input:-ms-input-placeholder { color:#999; }
.loginForm .inputText input:-moz-placeholder { color:#999; }
.loginForm .inputText .txt { display:block; float:left; width:25px; font-size:14px; line-height:58px; color:#363636; text-align:center; }
.loginForm .inputText .domain { display:block; float:left; margin-top:16px; }
.loginForm .inputText .domain select { padding-left:8px; border:1px solid #e3e3e3; width:120px; height:26px; background:#f8f8f8; }
.loginForm .inputText:after { content:''; display:table; clear:both; }
.loginForm .saveID { position:absolute; top:78px; right:16px; font-size:14px; line-height:20px; color:#363636; }
.loginForm .util { position:relative; margin-top:16px; }
.loginForm .util .lang { padding:0 6px; }
.loginForm .util .lang label { display:inline-block; margin-right:32px; padding-left:4px; font-size:14px; line-height:20px; color:#363636; vertical-align:top; }
.loginForm .util .linkHelp { display:block; position:absolute; top:0; right:0; font-size:14px; line-height:20px; color:#508e0d; text-decoration:underline !important; }
.loginForm .btnLogin { display:block; margin-top:20px; width:100%; font-size:22px; line-height:65px; font-weight:bold; color:#fff; text-align:center; background:#508e0d; }

/* Footer */
.loginFooter { padding:20px 0 67px; }


/** Login Popup
===================================*/
.loginPopupPage { min-width:900px; }

/* Header */
.loginPopupHeader { position:relative; padding:20px; background:#004483; }
.loginPopupTitle { padding:8px 0; font-size:18px; line-height:24px; color:#fff; }
.loginPopupHeader .linkHelp { position:absolute; top:50%; right:20px; margin-top:-15px; padding:5px 0; border:1px solid rgba(255,255,255,.5); width:118px; font-size:12px; line-height:18px; font-weight:bold; color:#fff; text-align:center; }

/* Container */
.loginPopupContainer { padding:20px; }
.loginPopupContainer .msgBox { padding:8px; }
.loginPopupContainer .msgBox { font-size:12px; line-height:22px; color:#666; }
.loginPopupContainer .msgBox p:before { content:'*'; display:inline; margin:0 4px 0 -2px; }
.loginPopupContainer .msgBox .import { color:#ff6c0f; }
.loginPopupContainer .inputUserNmKo { width:180px; }
.loginPopupContainer .inputBirthDt { width:100px; }
.loginPopupContainer .inputBirthDt + label[for="birthDt"] { margin-left:9px; }
.loginPopupContainer .msg { margin-top:8px; font-size:13px; line-height:23px; color:#666; }
.loginPopupContainer .btnCert { display:inline-block; margin-top:-1px; padding:6px 10px; min-width:100px; font-size:13px; line-height:24px; color:#fff; text-align:center; background:#8dc73f; vertical-align:middle; }
.loginPopupContainer .formGroup:after { content:''; clear:both; display:table; }
.loginPopupContainer .formGroup .sSelect,
.loginPopupContainer .formGroup .sInput,
.loginPopupContainer .formGroup .mark { float:left; }
.loginPopupContainer .formGroup .sInput { width:70px; }
.loginPopupContainer .formGroup .mark { margin:0 8px; font-size:13px; line-height:36px; color:#333; text-align:center; }
.loginPopupContainer .formGroup .btnFindID { margin-left:10px; }
.loginPopupContainer .formGroup .cellPhoneNo1 { width:88px; }
.loginPopupContainer .formGroup .cellPhoneNo1 select { width:116px; }
.loginPopupContainer .formGroup .email1,
.loginPopupContainer .formGroup .email2 { width:160px; }
.loginPopupContainer .formGroup .emailSelect { margin-left:10px; width:138px; }
.loginPopupContainer .formGroup .emailSelect select { width:166px; }
.loginPopupContainer .btnCellPhone,
.loginPopupContainer .btnIpin { margin-right:6px; width:140px; }
.loginPopupContainer .formButtons { margin-top:28px; text-align:center; }
.loginPopupContainer .formButtons .btnCancel { display:inline-block; margin:0 3px; padding:11px 10px; width:140px; font-size:13px; line-height:24px; color:#fff; text-align:center; background:#004483; vertical-align:top; }

/* Footer */
.loginPopupFooter { padding:8px 20px 20px; }
.loginPopupFooter .contact { padding:15px 0; font-size:13px; line-height:20px; color:#666; text-align:center; background:#f6f4f4; }


/** Web Login Page
===================================*/
.webLoginPage .loginHeader { width:600px; }
.webLoginPage .loginContainer { width:600px; }
.webLoginPage .loginForm { padding:50px 100px; }
