@charset "utf-8";

/*! buttons */
.button-signin {display:inline-block;width:110px;height:40px;line-height: 38px;padding:0;border:0;border-radius:2px;font-weight:400;color:#fff;font-size:18px;background-color: #6930b8;cursor:pointer;text-align:center;vertical-align:middle}
.button-signin-200 {display:inline-block;width:198px;height:40px;line-height: 38px;padding:0;border:0;border-radius:2px;font-weight:400;color:#fff;font-size:18px;background-color: #6930b8;cursor:pointer;text-align:center;vertical-align:middle}
.button-signin2-200 {display:inline-block;width:198px;height:40px;line-height: 38px;padding:0;border:1.5px solid #6930b8;color:#6930b8;border-radius:2px;font-weight:400;background-color:#fff;font-size:18px;background-color: #fff;cursor:pointer;text-align:center;vertical-align:middle}
/* button */
.button.button-h40 {height:37px;padding:0;color:#fff;border-radius:2px;border:1.5px solid #6930b8;background-color:#6930b8;font-size:17px;text-align:center;font-weight:400;line-height:36px;box-shadow:0 0 8px 2px #f2f2f2;}
.button.button-h40.wh {background-color:#fff;border:1.5px solid #6930b8;color:#6930b8 !important;font-weight:500}

.sign-in.right {text-align: right;}

/*! icon common */
.ico-eye {background-image:url('../image/login/hide-pw.svg');opacity:1}
.ico-eye.on {background-image:url('../image/login/show-pw.svg');opacity:1}
.ico-setting {background-image:url('../image/login/setting.svg')}
.ico-help {background-image:url('../image/login/help.svg')}
.ico-email {background-image:url('../image/login/email.svg')}
.ico-search {background-image:url('../image/login/search.svg')}
.ico-phone {background-image:url('../image/login/phone.svg')}
.ico-global {background-image:url('../image/login/global.svg')}

.ico {display:inline-block;width:16px;height:16px;background-repeat:no-repeat;background-position:center center;background-size:100%;vertical-align:-3px}
.ico[role] {margin-right:5px}
.ico.w24 {width:24px;height:24px;background-size:24px 24px;vertical-align:middle}
.ico.w32 {width:32px;height:32px;background-size:32px 32px;vertical-align:middle}
.ico.w40 {width:40px;height:40px;background-size:40px 40px;vertical-align:middle}
.ico.w48 {width:48px;height:48px;background-size:48px 48px;vertical-align:middle}

/* form */
.input-text {display:block;position:relative;width:100%}
.input-text input {display:inline-block;width:100%;height:37px;padding:7px 10px 3px;border:1px solid #d0d0d0;border-radius:3px;background-color: #ffffff;color:#363636;font-size:15px;font-weight:500;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
}
.input-text button {position:absolute;right:0;bottom:0;height:37px;padding:0 8px;border:0;background:none}
.input-text.date {position:relative;}
.input-text.type2 {position:relative;margin-top:30px;padding-top:16px}
.input-text.type2 label {bottom:37px;left:0;color:#717781;font-weight:400;font-size:13px;padding:0}
.input-text.type2 input {border:0;border-bottom:1px solid #979797;border-radius:0;}

.input-text.type3 {position:relative;}
.input-text.type3 label {position:absolute;bottom:37px;left:0;color:#717781;font-weight:400;font-size:13px;padding:0}
.input-text.type3 input {border:0;border-bottom:1px solid #979797;border-radius:0;}

.input-text.valid-ok input {border-bottom-color:#2e68ff}
.input-text.valid-ok em {position:absolute;right:0;bottom:7px;padding:0 8px;color:#2e68ff;font-size:14px;letter-spacing:-0.5px;}

.select-wrap{display:inline-block;vertical-align:middle}
.select-wrap select{font-size:14px;font-weight:400;display:inline-block;width:100%;height:37px;padding:0 25px 0 8px;text-align:left;vertical-align:top;text-overflow:'';color:#363636;border:1px solid #d0d0d0;border-radius:3px;background:url('../image/login/select-down.svg') right center no-repeat #fff;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.select-wrap select::-ms-expand{display:none}
.select-wrap select[multiple],.select-wrap select[size]:not([size='1']){height:auto;padding-right:0;background:0 0}
/*! line type */
.select-wrap.type2{position:relative;margin-top:30px;padding-top:16px}
.select-wrap.type2 select{font-size:16px;font-weight:500;position:relative;z-index:1;border:0;border-bottom:1px solid #979797;border-radius:0;background-color:transparent}
.select-wrap.type2 label{font-size:14px;font-weight:400;position:absolute;bottom:37px;left:0;padding:0;color:#717781}
.select-wrap.type2+.input-text.type2,.select-wrap.type2+.select-wrap.type2{margin-top:30px}

/*! Sign In */
.sign-in-wrap {display:table;width:400px;height:100vh;min-height:100vh;margin:0 auto;}
.sign-in {display:table-cell;vertical-align:middle;/*margin:0 auto;padding-top:100px*/}
.sign-in .logo {width:225px;margin:0 0 80px 0}
.sign-in .logo img {width:100%}
.sign-in .logo-perceptive {width:225px;margin:0 0 80px 0}
.sign-in .logo-perceptive img {height:40px}
.sign-in .tit-wrap {margin:0 0 55px 0;color:#191919;font-size:33px;letter-spacing:-1.1px}
.sign-in .tit-h1 {color:#191919;font-weight:400;font-size:33px;letter-spacing:-1.1px}
.sign-in .tit-info {margin:15px 0 0 0;color:#717781;font-size:16px;letter-spacing:-0.4px;font-weight:300}
.sign-in .btn-area {margin-top:48px; text-align: right}
.sign-in .btn-area2 {margin-top:90px;}
.sign-in-form .input-text label {}
.sign-in-form .input-text input {font-size:15px;font-weight:400;border-bottom:1px solid #979797}
.sign-in-form .find-link {margin:11px 0 0 0;text-align: right}
.sign-in-form .find-link a {color:#b4b4b4;font-size:13px;font-weight:400;}
.sign-in-form .find-link a + a {margin-left:30px}
.sign-in-form .btn-primary {padding:0 25px}
.sign-in-form .input-text input,
.sign-in-form .select-wrap select {font-size:15px}
.sign-in-form label {font-size: 13px;letter-spacing: -0.4px;color: #b4b4b4;}
.sign-help {position:relative;margin-top:13px}
.sign-help li {display:inline-block;position:relative;margin-right:24px}
.sign-help li:last-child {position:absolute;right:0;margin-right:0}
.sign-help a {color:#7045de;font-size:13px;;letter-spacing:-0.4px}
.sign-help a .ico {margin-right:4px}
.sign-help .tooltip-box {display:block}
.pwd-success {text-align:center}

/* error msg */
.valid-error {margin:10px 0 30px 0;color:#fa2710;font-size:13px;line-height: 1.53;letter-spacing: -0.2px;}
.valid-error.flexbox .ico {margin-right:4px;margin-top:4px;}
.valid-error.bar {position:relative;margin:32px 0 48px 0;padding-left:12px;line-height:23px}
.valid-error.bar::before {display:block;content:'';position:absolute;top:0;left:0;width:4px;height:100%;background-color: #343a74}
.valid-error.bar span {display:block;color:#717781;font-weight:300;letter-spacing: -0.2px;}

.find-pwd {height:214px;margin:120px 0 0 0}
.find-id {height:214px;margin:120px 0 0 0}
.find-id .result-id {display:block;height: 37px;padding: 5px 10px;border-bottom:1px solid #979797;color: #363636;font-size: 16px;font-weight: 500;}

/*! tooltip */
.tooltip-box {position:absolute;top:100%;left:50%;margin-top:10px;box-shadow:0 5px 10px 0 rgba(192,192,192,0.2);transform: translateX(-50%);}
.tooltip-box::before {display:block;content:'';position:absolute;top:-8px;left:50%;width:10px;height:9px;margin-left:-5px;background:url('../image/login/box-arrow.svg') no-repeat 0 0;background-size:100%}
.tooltip {min-width:100px;max-width:370px;padding:20px 12px 17px;border:solid 1px #6930b8;color:#363636;font-size:13px;line-height:1.5;background-color:#fff}
.tooltip-link {width:280px;padding:20px 0 14px;color:#000;font-size:16px;font-weight:400;letter-spacing:-0.7px}
.tooltip-link .role-txt {margin:0 10px 13px;padding:0 10px 15px;border-bottom:1px solid #dde0e4}
.tooltip-link .role-txt em {display:inline-block;margin-right:5px;color:#3e4377}
.tooltip-link .link a {display:block;margin-bottom:2px;padding:14px 26px;color:#000;}
.tooltip-link .link a:hover {background-color:#f2f5ff}

.tooltip-access {width:370px;letter-spacing:-0.4px}
.tooltip-help {width:370px;padding-bottom:34px}
.tooltip-help .contact {margin-top:11px}
.tooltip-help .contact,
.tooltip-help .contact span {display:inline-block;color:#363636;}
.tooltip-help .contact span + span {margin-left:23px;}
.tooltip-help .contact span .ico {margin-right:8px;vertical-align:middle}
.tooltip-help .copy {position:absolute;right:8px;bottom:6px;text-align:right;color:#6930b8;font-size:10px}
.tooltip-lang {width:176px}
.tooltip-lang div a {display:block;text-align:center;color:#363636;font-size:11px}
.tooltip-lang div + div {margin-top:10px}

/* popup (new) */
.confirm-layer-popup {overflow:hidden;position:absolute;top:0;bottom:0;left:0;right:0;z-index:200}
.confirm-layer-popup::before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;background-color: #fff;opacity: .85;}
.confirm-layer-popup .layer-wrap {top:50%;left:50%;padding-top:15px;margin:0;transform:translate(-50%,-50%);z-index:202}
.confirm-layer-popup .layer-title {padding:15px 20px;background-color:#e5e3f4;color:#363636;font-size:17px;font-weight:500;line-height: 1.5;}
.confirm-layer-popup .layer-content {padding:50px 25px 70px;color:#363636;font-size:17px;font-weight:500;text-align:center}
.confirm-layer-popup .layer-content .img {display:block;margin:0 auto 18px;}
.confirm-layer-popup .layer-button {padding:25px;
  display: -webkit-box;
  display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;}
.confirm-layer-popup .layer-button a {
  -webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}
.confirm-layer-popup .layer-button a + a {margin-left:25px}
