@charset "utf-8";

/****************************
	PC웹 : LG ID
****************************/

/* lgid color */
.color-primary-lgid {color:#b71256;}

.size-m20 {font-size:20px;}

/* button */
.btn-underline-b {border-bottom: 1px solid #000;}
.btn-lgid-p {color: #fff;background:#b71256; width: 100%; height: 58px; padding-top: 3px;  border: 0; /* border-radius: 3px; */ text-align: center;}
.btn-lgid-w {color: #b71256; background:#fff; width: 100%; height: 58px; padding-top: 1px;  border: 3px solid #b71256; border-radius: 3px; text-align: center;}
a.btn-lgid-p:focus, a.btn-lgid-p:hover ,button.btn-lgid-p:focus, button.btn-lgid-p:hover  {color: #fff;background:#b71256; border:0}
a.btn-lgid-w:focus, a.btn-lgid-w:hover ,button.btn-lgid-w:focus, button.btn-lgid-w:hover {border: 3px solid #b71256; border-radius: 3px;}

.btn-lgid-p i {display: inline-block; width: 181px; height: 19px; background: url(//image.uplus.co.kr/images/renewal/images/cm/ico/ico_45_lgid.png) no-repeat;}
.btn-round.btn-lgid-p {height:62px; padding-top: 5px; border-radius: 30px;}

#header.ver-202008 #launcher a.btn-underline-b { border-bottom: 1px solid #000; padding: 0; font-size: 16px;}

/*아이콘*/
.ico.ico-mylgid-119-21 {width: 119px;  height: 21px; background-image: url(../images/lgid/mylgid-119-21.png);}
.ico.ico-mylgid-login-white {width: 143px;  height: 15px; background-image: url(../images/lgid/mylgid-login-white.png);}
.ico.ico-mylgid-login-join {width: 143px;  height: 16px; background-image: url(../images/lgid/mylgid-login-join.png);}

.ico-radio-gray-on {background-image: url(../images/lgid/icon-radio-gray.png); background-position: left top; margin:0 6px 4px 0;}
.ico-radio-gray {background-image: url(../images/lgid/icon-radio-gray.png); background-position: right top; margin:0 6px 4px 0;}
.ico.ico-lgid-step01 {width:80px; height:34px; background-image: url(../images/lgid/icon-lgid-step01.png); margin-bottom: 20px;}
.ico.ico-lgid-step02 {width:80px; height:34px; background-image: url(../images/lgid/icon-lgid-step02.png); margin-bottom: 20px;}
.icon-lgid-phone-65 {width:65px; height:65px; background-image: url(../images/lgid/icon-lgid-phone-65.png);}

/*레이아웃*/
.lglogin-wrap {/* min-height: calc(100% - 447px);  */padding-bottom: 60px;}
.lglogin-content-inner {width:720px; margin: 0 auto;}
.lglogin-content-inner + .lglogin-content-inner {margin-top:30px}
.lglogin-footer {height:447px}

/*타이틀*/
.lgid-title1 {font-size:24px}

/*밑줄*/
.border-bnm-b {border-bottom: 1px solid #000;}
.border-bnm-p {border-bottom: 1px solid #b71256;}

/*로그인 캡챠*/ 
.login-area .welcome.lgid-welcome {margin-bottom:25px;}
.login-area .lgid-login-input { float:left; }

.login-area .lgid-help {margin-top:25px;}
.login-area .lgid-help li {display:inline-block; vertical-align:middle; line-height:28px;}
.login-area .lgid-help li label, .login-area .help li a {display:inline-block; vertical-align:top;}
.login-area .lgid-help li+li:before {display:inline-block; content:''; width:1px; height:14px; margin:-3px 12px 0 10px; vertical-align:middle; background-color:#cecece;}

.login-area .new-capcha-wrap {position:relative; height: 80px; text-align:left;}
.login-area .new-capcha-area { width: 460px;  padding-right: 60px;}
.login-area .new-capcha-area .new-img-capcha {position:absolute; top:50px;left:0;width:195px; height:50px; border:1px solid #d2d2d2; border-radius: 3px;}
.login-area .new-capcha-area .btn {position:absolute; top:50px; left:199px; width: 24px; height: 24px; margin:0; padding:0; text-align:left;}
.login-area .new-capcha-area .btn-listen {top:76px;}
.login-area .new-capcha-area .btn .ico {width:24px; height:24px; margin:-22px 0 0 -1px; background-size:58%; background-position: center 0;}
.login-area .new-capcha-area .btn-listen.btn .ico {background-size:66%;}
.login-area .new-capcha-area .i-capcha {margin:30px 0 0; width: 165px;position: absolute; top: 20px;right: 0;}

.login-area .lgid-login-area { position:relative; float:right; }

/*가입인증*/
#header.lgid-head {height:90px;}
.lgid-main-title {font-size:28px; margin-bottom:20px;} 
.lglogin-info-txt {font-size:16px; color:#848684; font-weight: 500;}
.lgid-sub-title {font-size:22px}
.lglogin-content-inner {width:574px; margin: 0 auto;}
.lglogin-content-inner + .lglogin-content-inner {margin-top:65px}
.lgid-logo {text-align: center; margin-top:22px;}
.view-head + .view-head {margin-top:20px; display:flex;}
.lglogin-wrap .btn-group {margin-top:30px;}

/*가입인증 - footer관련 수정*/
html.ui-lgid, body.ui-lgid-body {height: 100%;margin: 0;}

.lgid_new_wrapper {min-height: 100%; padding-bottom: 500px;}
.lgid_new_footer {margin-top: -377px;  /* height: 377px; */}
.lglogin-email-wrap>input {width: 188px; margin-right:3px}
.lglogin-email-wrap>input + input {width: 189px; margin-right:5px; margin-left:3px;}
.lglogin-email-wrap>select {/* float: right; */}

/* 로그인팝업 수정*/
.login-area-layer .new-capcha-wrap {position:relative; text-align: left; height: 110px;}
.login-area-layer .new-capcha-wrap .error-message-lgid {color: #ed174d; margin: 5px 0 20px;} 
.login-area-layer .new-capcha-wrap .error-message-lgid .ico.ico-warning-primary {width:24px; height:24px; vertical-align: text-top;}
.login-area-layer .new-capcha-area {position:relative; }
.login-area-layer .new-capcha-area .new-img-capcha {position:absolute; top:0;left:0;width:195px; height:50px; border:1px solid #d2d2d2; border-radius: 3px;}
#launcher .login-area-layer .login-input .btn.new-capcha-pop {margin-top: 0;}
.login-area-layer .new-capcha-area .btn {position:absolute; top:0; left:199px; width: 24px; height: 24px; margin:0; padding:0; text-align:left;}
.login-area-layer .new-capcha-area .btn-listen {top:27px;}
.login-area-layer .new-capcha-area .btn .ico {width:24px; height:24px; margin:-22px 0 0 -1px; background-size:58%; background-position: center 0;}
.login-area-layer .new-capcha-area .btn-listen.btn .ico {background-size:66%;}
#launcher .login-area-layer .new-capcha-area input.i-capcha {width: 162px; position: absolute; top: 0;right: 0;}
#launcher .login-area-layer ul.help.lgid-popup {margin-top:8px;}
#header.ver-202008 #launcher a.btn-lgid-p-pop , #header.ver-202008 #launcher a.btn-lgid-p-pop:hover, #header.ver-202008 #launcher a.btn-lgid-p-pop:active {padding: 0;  border: 0;}
.btn-lgid-p-pop {color: #fff;  background: #b71256; width: 100%; height: 50px; padding-top: 3px; border: 0;  text-align: center;}
.btn .ico.ico-mylgid-login-white {margin:0}

/* 로그인 수정 */
.section-login { margin: 60px 0; line-height: 1; text-align: center; }
.section-login .box { display: block; margin: 0 auto; max-width: 1052px; padding: 70px 0 70px; }
.section-login .module { margin: 0 60px; }
.section-login input[type="text"],
.section-login input[type="password"] { box-sizing: border-box; width: 100%; margin-bottom: 10px; }
.section-login label { cursor: pointer; }
.section-login .title { margin: 0 0 35px; padding: 0; font-size: 24px; font-weight: 300; color: #000; }
.section-login .col-a { overflow: hidden; }
.section-login .logos { margin: 2px 0 39px; }
.section-login .subject { margin: 50px 0 15px; font-size: 18px; font-weight: 400; color: #000; }
.section-login .subject strong { font-weight: bold; }
.section-login .btn-group { margin: 0; }
.section-login .col-a .btn-group { margin-top: 15px; }
.section-login .lgid-help { margin: 10px 0 0; float: left; }
.section-login .lgid-help::after { clear: both; content: ''; display: table; overflow: hidden; }
.section-login .col-a { width: 50%; }
.section-login .col-a .subject.nth-1 { margin-top: 60px; }
.section-login .col-a .btn-group.nth-2 { margin-top: 10px; }
.section-login .col-b { width: 50%; position: relative; }
.section-login .col-b::before { display: block; content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 1px; background-color: #ddd; }
.section-login .new-capcha-wrap { height: 110px; }
.section-login .warning { margin: 93px 0 0; font-size: 18px; font-weight: 500; color: #ee214c; }
.section-login .action { margin-top: 23px; }
.section-login .action a { display: block; padding: 10px 0; font-weight: 400; font-size: 16px; color: #000; }
.section-login .action a:hover { color: #ed174d; }
.section-login .action a strong { font-weight: 500; } 