@charset "utf-8";

#login_login_wrap {margin:0 auto;}
#login_container { width: 958px;margin:0 auto; height: 500px; background: #fff; border: 1px #dadee5 solid; overflow: hidden; border-radius: 10px; margin-top:200px;}
#login_header { float: left; width: 280px; height: 500px; position: relative; }
#contents { float: right; width: 676px; }
#footer { overflow: hidden; }


h1.title { margin-top: 30px; width: 200px; height: 55px; background: url(./img/login_title.png) no-repeat right; font-size: 0; text-indent: -10000em; overflow: hidden }
.msg { margin: 0 auto 30px; padding-bottom: 25px; width: 616px; line-height: 20px; border-bottom: 1px #ddd solid; overflow: hidden; }
h2.greeting { padding-bottom: 25px; display: block; margin-bottom: 5px; padding: 30px 20px 3px 0; font-size: 20px; font-weight: bold; }
.conarea { margin-bottom: 15px; padding-bottom: 25px; overflow: hidden; padding: 15px 35px; }
.section { padding-top: 25px; }


.loginarea { float: left; width: 355px; border-right: 1px solid #e5e5e5; padding-right: 20px; height: 310px; }
.loginarea li { margin-bottom: 7px; overflow: hidden; }
*:first-child + html .loginarea li { margin-bottom: 6px; }
.loginarea label { float: left; font-weight: bold; line-height: 35px; }
.loginarea label.pw { letter-spacing: -0.1em; }
.loginarea input.login { padding-left: 30px; height: 35px; width: 260px; font-family: Tahoma; font-size: 14px; line-height: 30px; background: transparent; border: none; }
.loginarea .input { border: 1px solid #d8e2e7; float: right; width: 290px; height: 35px; text-align: right; background: #f5f8f8 url('./img/login_icon.png') no-repeat 10px 13px; }
.loginarea .input_id { background-position: 10px -32px; }
.loginarea .input_pw { background-position: 10px -77px; }
.loginarea .chkarea { float: left; padding-left: 58px; line-height: 45px; }
.loginarea .chkarea input { margin-right: 4px; vertical-align: middle; }


.captcha_area { margin-top: 10px; }
.captcha { float: right; width: 290px; height: 50px; text-align: right; border: 1px solid #ccc; }
.captcha_tit { float: right; width: 290px; text-align: left; margin-bottom: 5px; color: #777; font-size: 13px; }
.captcha_img { width: 75%; float: left; height: 100%; border-right: 1px solid #ccc; }
.captcha_img img { width: 100%; height: 100%; }
.captcha_txt { float: right; height: 100%; width: 24%; }
.captcha_txt span { display: block; height: 24px;}
.captcha_txt span a { color: #777; font-size: 12px; font-weight: bold; margin-top: 3px; display: inline-block; letter-spacing: -1px; padding-right: 5px; }
.captcha_txt span a:hover { color: #000; text-decoration: underline; }
.captcha_txt .voice i { background: url(./img/ico-voice.png) no-repeat; width: 16px; height: 12px; display: inline-block; vertical-align: middle; }
.captcha_txt .refresh i { background: url(./img/ico-refresh.png) no-repeat; width: 16px; height: 12px; display: inline-block; vertical-align: middle; }

.loginBT_h { float: right; width: 168px; height: 50px; background: url(./img/login_btn_h.png) no-repeat; cursor: pointer; margin-top: 5px; line-height: 45px; color: #fff; font-size: 15px; font-weight: bold; text-align: center; }*/
.loginBT_c { float: right; width: 168px; height: 50px; background: url(./img/login_btn_c.png) no-repeat; cursor: pointer; margin-top: 5px; line-height: 45px; color: #fff; font-size: 15px; font-weight: bold; text-align: center; }
.loginBT_b { float: right; width: 168px; height: 50px; background: url(./img/login_btn_b.png) no-repeat; cursor: pointer; margin-top: 5px; line-height: 45px; color: #fff; font-size: 15px; font-weight: bold; text-align: center; }*/

/*로그인버튼*/
.loginBT_h {float:right; width:168px; height:50px;  background:url(./img/login_btn_h.png) no-repeat; cursor:pointer; margin-top:5px; line-height:45px; color:#fff; font-size:15px; font-weight:bold; text-align:center;}
.loginBT_b {float:right; width:168px; height:50px;  background:url(./img/login_btn_b.png) no-repeat; cursor:pointer; margin-top:5px; line-height:45px; color:#fff; font-size:15px; font-weight:bold; text-align:center;}

/*230228 간편 로그인 버튼 추가*/
.loginBT_c {float:right; width:290px; height:50px;  background:url(./img/login-fullbtn.png) no-repeat; cursor:pointer; margin-top:5px; line-height:45px; color:#fff; font-size:15px; font-weight:bold; text-align:center;}
.loginBT_k {float:right; width:290px; height:50px;  background:url(./img/login-kakaobtn.png) no-repeat; cursor:pointer; margin-top:8px; line-height:45px; color:#fff; font-size:15px; font-weight:bold; text-align:center;}
.kakao_quick{position:relative; padding-top: 12px;}
.tooltip_box{position:absolute; z-index:1; margin:25px auto 0px; text-align:center; left:115px;}

/*230208 로그인 링크*/
.box_login_link{clear:both; width:290px; float:right; text-align:center; font-size: 12px;}
.box_login_link .tit {margin-top:12px; line-height:20px; color:#333; text-decoration: underline; cursor: pointer;}
.box_login_link .txt{position: relative; display: inline-block; margin-top:20px; font-size:13px; line-height:20px; }
.box_login_link .txt .link_1{color:#999; margin-right: 12px; cursor: pointer;}
.box_login_link .txt .link_2{color:#333; margin-left:12px; cursor: pointer;}
.box_login_link .txt .line{color:#ddd;}

.banner { background: #fcfcfc; width: 100%; height: 72px; display: inline-block; clear: both; margin-top: 50px; border: 1px solid #e5e5e5; }
.left_banner { width: 50%; border-right: 1px solid #e5e5e5; height: 100%; float: left; position: relative; }
.left_banner:hover { background: #f6f5f3; }
.inner { padding-top: 18px; padding-left: 15px; }
.left_banner .more { position: absolute; right: 10px; font-size: 18px; font-weight: bold; color: #bababa; }
.left_banner .tit { display: inline-block; width: 100%; font-size: 13px; font-weight: bold; color: #4995c5; }
.left_banner .txt { font-size: 13px; color: #444; }
.left_banner:hover .txt { text-decoration: underline; }
.right_banner { width: 49.5%; height: 100%; float: right; position: relative; }
.right_banner:hover { background: #f6f5f3; }
.right_banner .more { position: absolute; right: 10px; font-size: 18px; font-weight: bold; color: #bababa; }
.right_banner .tit { display: inline-block; width: 100%; font-size: 13px; font-weight: bold; color: #008f62; }
.right_banner .txt { font-size: 13px; color: #444; }
.right_banner:hover .txt { text-decoration: underline; }

.ad { float: right; width: 215px; height: 310px; text-align: center; }
.ad img { width: 100%; height: 100%; }
.ad .ad_banner { height: 152px; background: #ddd; }
.login_find { text-align: left; font-weight: bold; background: #fcfcfc; text-decoration: underline; margin-top: 11px; height: 44px; border: 1px solid #e5e5e5; }
.login_find .text { padding-left: 25px; margin-top: 12px; display: inline-block; }
.login_find .text img { vertical-align: middle; width: 16px; height: 16px; margin-right: 5px; }
.login_find:hover .text { text-decoration: underline; }
.slider_banner { float: right; width: 215px; height: 310px; text-align: center; }


.cs_area { clear: both; padding: 0 30px; }
.cs_area .btn_area { overflow: hidden; margin-top: 30px; border-top: 1px solid #e5e5e5; }

.btn_area div { width: 116px; float: left; height: 50px; border: 1px solid #ccc; display: inline-block; margin-top: 25px; margin-right: 7px; line-height: 50px; border-radius: 4px; }
.btn_area div.last { float: right; margin-right: 0; }
.btn_area div:hover { border: 1px solid #444; }

.btn_area div span { font-size: 13px; display: inline-block; height: 50px; line-height: 50px; color: #000; font-weight: bold; }
.btn_area div img { vertical-align: middle; width: 35px; margin-left: 7px; border:0px;}
.btn_area div img.idfind { padding-left: 6px; }

/*IE 모드 안내 20230210*/
.login_header_content li.is-emphasis {opacity:1; filter:alpha(opacity=100);}
.login_header_content li.is-emphasis,
.login_header_content li.is-emphasis a {color:#faff00}

/*띠배너*/
.line-banner {position:fixed;top:0;right:0;left:0;box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);background-color:#fff;}
.line-banner-contents {position:relative;width:960px;margin:0 auto;padding:12px 0;}
.line-banner-contents::after {content:"";clear:both;display:table;width:100%;height:0;}
.line-banner-contents > p {float:left;height:36px;font-weight:bold;font-size:15px;line-height:36px;color:#000;}
.line-banner-contents > p > em {font-style:normal;font-size:15px;color:#0075ff;}
.banner-view-btn {float:left;height:36px;margin-left:50px;padding:0 20px;border-radius:100px;font-weight:bold;font-size:14px;line-height:36px;color:#fff;background-color:#000;}
.banner-close-btn {position:absolute;top:50%;right:0;height:30px;margin-top:-15px;padding-right:35px;font-weight:bold;font-size:12px;line-height:30px;color:#888;}
.banner-close-btn::after {content:'';position:absolute;top:0;right:0;width:30px;height:30px;background: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.285 6.033a.7.7 0 0 1 .99 0L23.962 22.72a.7.7 0 0 1 0 .99l-.247.248a.7.7 0 0 1-.99 0L6.037 7.27a.7.7 0 0 1 0-.99l.248-.247z' fill='%23888'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.037 23.709a.7.7 0 0 1 0-.99L22.724 6.032a.7.7 0 0 1 .99 0l.247.248a.7.7 0 0 1 0 .99L7.275 23.956a.7.7 0 0 1-.99 0l-.248-.247z' fill='%23888'/%3E%3C/svg%3E%0A") no-repeat;}

.cs_call { position: absolute; bottom: 45px; width: 250px; height: auto; }
.css_inner { margin-top: 18px; }
.cs_call span { display: block; margin-left: 24px; }
.cs_tit { color: #fff; font-weight: bold; font-size: 18px; }
.cs_txt { color: #fff; font-size: 12px; margin-top: 5px; opacity: .7; filter: alpha(opacity=70); }
.login_header_content { margin-right: 40px; margin-top: 130px; }
.login_header_content ul { margin-left: 30px; margin-top: 0px; }
.login_header_content li { color: #fff; font-size: 13px; margin-top: 5px; font-weight: bold; opacity: .7; filter: alpha(opacity=70); }
.login_header_content li:hover { color: #fff; cursor: pointer; opacity: 1; filter: alpha(opacity=100); }


.wmsys_c { background: url(./img/wmsys_c.jpg) no-repeat; }
.wmsys_b { background: url(./img/wmsys_b.jpg) no-repeat; }
.wmsys_h { background: url(./img/wmsys_h.jpg) no-repeat; }