@charset "utf-8";
@import url("base.css");
@import url("btn.css");

body { width:100%; height:100%; background:#ebebeb }
body.esp { background:#fff }

/* Start : Operation */
#loginwrap { position:absolute; top:50%; width:100%; height:458px; margin-top:-229px; background:#ebebeb }
#loginwrap #login { width:100%; height:458px; vertical-align:middle }
#loginwrap #login .administratorW { width:100%; height:458px; margin:0 auto; background:url(/static/image/login/bg_login.jpg) repeat-x 0 50% }
#loginwrap #login .administrator { position:relative; width:489px; height:458px; margin:0 auto; background:url(/static/image/login/bg_login_administrator.jpg) no-repeat 0 0 }
#loginwrap #login .administrator h1 { padding:115px 0 0 172px }
#loginwrap #login .administrator div { position:absolute; top:209px; left:96px }
#loginwrap #login .administrator div h2 { vertical-align:middle; line-height:100% }
#loginwrap #login .administrator div h2 input { width:206px; margin:0 0 10px 10px; padding:12px 0 12px 10px; font-size:12px; font-family:verdana; color:#ebebeb; vertical-align:middle; line-height:12px; border:1px solid #8e97b6; background:#2e4087 }
#loginwrap #login .administrator div p { padding:3px 0 0 84px }
#loginwrap #login .userW { width:100%; height:458px; margin:0 auto; background:url(/static/image/login/bg_login.jpg) repeat-x 0 50% }
#loginwrap #login .user { position:relative; width:489px; height:458px; margin:0 auto; background:url(/static/image/login/bg_login_user.jpg) no-repeat 0 0 }
#loginwrap #login .user h1 { padding:105px 0 0 172px }
#loginwrap #login .user p { padding:18px 0 0 105px }
#loginwrap #login .user div { position:absolute; top:209px; left:96px }
#loginwrap #login .user div h2 { vertical-align:middle; line-height:100% }
#loginwrap #login .user div h2 input { width:206px; margin:0 0 10px 10px; padding:12px 0 12px 10px; font-size:12px; font-family:verdana; color:#ebebeb; vertical-align:middle; line-height:12px; border:1px solid #838384; background:#3e3e3e }
#loginwrap #login .user div p { padding:3px 0 0 84px }
/* End : Operation */


.tabmenu ul{list-style:none;}
.tabmenu{max-width:600px; position:relative;}
.tabmenu ul{position: relative;}
.tabmenu ul li{display:  inline-block; width:50%; float:left; text-align:center; background :#fff; line-height:40px;}
.tabmenu label{display:block;width:100%; height:40px;line-height:40px;}
.tabmenu label:hover{cursor: pointer;}
.tabmenu #selCorp:hover{cursor: pointer;}
.tabmenu input{display:none;}
.tabCon{display:none;  width: 100%; text-align:left; position:absolute; left:0; top:40px; box-sizing: border-box;}
.tabmenu input:checked ~ label{background:#fff; border-top: 3px solid #3f7bb3; border-left: 1px solid #ddd; border-right: 1px solid #ddd;  font-weight: bold; color:#3E7AB1;}
.tabmenu input:not(:checked) ~ label{background:#fff; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; color:#757575;}
.tabmenu input:checked ~ .tabCon{display:block;}
.tabmenu input:checked ~ .tabCon input{display:block;}

/* Start : ESP */
/* LAYOUT */
/* .esp #loginwrap { position:absolute; top:50%; width:100%; height:350px; margin:-147px 0 0 0; background:#32588c; } */
.esp #loginwrap { position:absolute; top:45%; width:100%; height:350px; margin:-145px 0 0 0; background:url(/static/image/login/login_bg.png); }
.esp #loginwrap #login { width:408px; height:340px; margin:0 auto }
.esp #loginwrap #login #login_header { overflow:hidden; height:125px; /* background:url(/static/image/login/bg_login_header.gif) no-repeat 406px 3px */ }
.esp #loginwrap #login #login_content { overflow:hidden; width:100% }
.esp #loginwrap #login #login_footer { overflow:hidden }

/* HEADER */
.esp #loginwrap #login #login_header h1 { /* float:left; */ /* padding:0 0 0 35px; */ text-align:center; }
.esp #loginwrap #login #login_header p { float:right; padding:2px 90px 0 0 }

/* CONTENT : LOGIN_AREA */
/* .esp #loginwrap #login #login_content .login_area { position:relative; overflow:hidden; float:left; width:408px; height:225px; background:url(/static/image/login/bg_login_area.gif) no-repeat 0 0 } */

#loginForm #memberLoginDiv, #loginForm2{
	display: flex;
    flex-direction: column;
    align-items: center;
}

.esp #loginwrap #login #login_content .login_area { position:relative; overflow:hidden; float:left; width:406px; height:250px; border: solid 1px #aaaaaa; background-color: #ffffff;}
.esp #loginwrap #login #login_content .login_area h2 { /* height:25px; */ padding:55px 0 0 57px }
.esp #loginwrap #login #login_content .login_area #tab2 h2 { /* height:25px; */ padding:35px 0 0 57px }
.esp #loginwrap #login #login_content .login_area h3 { overflow:hidden; width:200px; margin:0 0 5px 100px }
.esp #loginwrap #login #login_content .login_area label { float:left }
.esp #loginwrap #login #login_content .login_area input { float:left; width:195px; height:30px; margin:0 0 0 0; padding:0; vertical-align:top; line-height:100%; border:1px solid #c4cad5 }
.esp #loginwrap #login #login_content .login_area img { vertical-align:top; line-height:100% }
/* .esp #loginwrap #login #login_content .login_area p.login_btn { float:left; position:absolute; top:55px; right:60px } */
.esp #loginwrap #login #login_content .login_area p.login_btn { overflow: hidden; width: 200px; margin: 0 0 5px 0px; }
.esp #loginwrap #login #login_content .login_area p.membership { position:absolute; top:170px; left:345px }
.esp #loginwrap #login #login_content .login_area p.nonMemberLogin { position:absolute; top:170px; left:15px }
.esp #loginwrap #login #login_content .login_area p.findUsrInfo { position:absolute; top:170px; left:15px }
.esp #loginwrap #login #login_content .login_area #tab2 p.membership { position:absolute; top:170px; left:345px }
.esp #loginwrap #login #login_content .login_area p.membership a {font-weight: normal; color: #444; text-decoration: underline;}
.esp #loginwrap #login #login_content .login_area p.nonMemberLogin a {font-weight: normal; color: #444; text-decoration: underline;}
.esp #loginwrap #login #login_content .login_area p.findUsrInfo a {font-weight: normal; color: #444; text-decoration: underline;}
.esp #loginwrap #login #login_content .login_area p.attention { position:absolute; top:165px; left:50px }
.esp #loginwrap #login #login_content .login_area input.logininput { width:197px; height:34px; border:0 none; background-color: #32588c; color: #fff;}
.esp #loginwrap #login #login_content .login_area input.logininput:hover {cursor: pointer;}

/* add : 2011-09-19 cgm */
.esp #loginwrap #login #login_content .login_area ul.division_user { position:absolute; top:136px; left:107px; overflow:hidden; width:165px; height:16px }
.esp #loginwrap #login #login_content .login_area ul.division_user li { float:left; width:80px; font-weight:normal; font-size:11px; color:#777 }
.esp #loginwrap #login #login_content .login_area ul.division_user label { float:none }
.esp #loginwrap #login #login_content .login_area ul.division_user input { float:none; width:12px; height:12px; margin:0; padding:0; vertical-align:middle; line-height:100%; border:0 none }

/* CONTENT : 1 JOIN */
.esp #loginwrap #login #login_content .join { float:left; width:149px; height:225px; background:url(/static/image/login/bg_join.gif) no-repeat 0 0 }
.esp #loginwrap #login #login_content .join .txt { height:59px; padding:94px 0 0 8px }
.esp #loginwrap #login #login_content .join .btn { padding:0 0 0 26px }

/* CONTENT : 2 ID SEARCH */
.esp #loginwrap #login #login_content .idsearch { float:left; width:150px; height:225px; background:url(/static/image/login/bg_idsearch.gif) no-repeat 0 0 }
.esp #loginwrap #login #login_content .idsearch .txt { height:59px; padding:94px 0 0 8px }
.esp #loginwrap #login #login_content .idsearch .btn { padding:0 0 0 26px }

/* CONTENT : 3 PASSWORD SEARCH */
.esp #loginwrap #login #login_content .pwsearch { float:left; width:150px; height:225px; background:url(/static/image/login/bg_pwsearch.gif) no-repeat 0 0 }
.esp #loginwrap #login #login_content .pwsearch .txt { height:59px; padding:94px 0 0 8px }
.esp #loginwrap #login #login_content .pwsearch .btn { padding:0 0 0 26px }

/* FOOTER */
.esp #loginwrap #login #login_footer { float:right; padding:12px 0 0 0 }
/* End : ESP */

/* Loginfo Join Member */
.esp #loginfowrap { position:absolute; top:50%; width:100%; margin:-145px 0 0 0 }
.esp #loginfowrap2 { position:absolute; top:28%; width:100%; margin:-145px 0 0 0 }
.bg_find_id { height:265px }
.bg_find_id #loginfo { height:265px; background:url(/static/image/login/bg_loginfo_findid.gif) no-repeat 50% 30px }
.bg_find_pw { height:295px }
.bg_find_pw #loginfo { height:295px; background:url(/static/image/login/bg_loginfo_findpw.gif) no-repeat 50% 30px }
.bg_find_jointype { height:265px }
.bg_find_jointype #loginfo { height:265px; background:url(/static/image/login/bg_loginfo_jointype.gif) no-repeat 50% 30px }
.esp #loginfo { width:857px; margin:0 auto }
.esp #loginfo_header { position:relative; overflow:hidden; height:32px }
.esp #loginfo_content { overflow:hidden; width:100% }

.esp #loginfo_header h1 { position:absolute; top:3px; right:35px }
.esp #loginfo_header h2 img { padding:2px 0 0 9px }
.esp #loginfo_header ul { width:100%; zoom:1 }
.esp #loginfo_header ul:after { display:block; clear:both; content:"" }
.esp #loginfo_header li { float:left; margin:0 3px 0 0 }
.esp #loginfo_content .loginfo_guidance { width:100%; height:45px; text-align:center }
.esp #loginfo_content .find_loginfowrap { overflow:hidden; width:100% }
.esp #loginfo_content .find_loginfo { float:left; width:334px; padding:0 52px 0 42px }
.esp #loginfo_content .find_loginfo h3 { height:31px; padding:0 0 0 7px; background:url(/static/image/login/line_loginfo.gif) repeat-x 0 100% }
.esp #loginfo_content .find_loginfo h3 span { display:block; padding:8px 0 0 0 }
.esp #loginfo_content .find_loginfo h3 span.h_icon { display:block; background:url(/static/image/login/bg_h_icon.gif) no-repeat 0 0 }
.esp #loginfo_content .find_loginfo h3 span.h_icon.emailicon { padding:8px 0 2px 31px; background-position:0 7px }
.esp #loginfo_content .find_loginfo h3 span.h_icon.phoneicon { padding:8px 0 2px 20px; background-position:0 -35px }
.esp #loginfo_content .section { width:100%; padding:22px 0; background:url(/static/image/login/line_loginfo.gif) repeat-x 0 100%; zoom:1 }
.esp #loginfo_content .section:after { display:block; clear:both; content:"" }
.esp #loginfo_content .section ul,
.esp #loginfo_content .section li input,
.esp #loginfo_content .section label,
.esp #loginfo_content .section p.bt_confirm{ float:left }
.esp #loginfo_content .section ul { width:188px; padding:0 0 0 26px }
.esp #loginfo_content .section li { overflow:hidden; width:100%; height:27px }
.esp #loginfo_content .section label { width:41px; padding:4px 0 0 }
.esp .bg_find_pw #loginfo_content .section p.bt_confirm { padding:15px 0 0 }
.esp #loginfo_content .section div { height:49px; padding:6px 0 3px; text-align:center }
.esp #loginfo_content .section div p{ font-size:14px; color:#2f3743 }
.esp #loginfo_content .section div p.firstchild { height:37px }
.esp #loginfo_content .section .input_text { width:138px; height:20px; padding:0; line-height:20px; border:1px solid #c4cad5 }
.esp #loginfo_content .email_guide { padding:6px 0 0 17px }
.esp #loginfo_content .reissue { padding:14px 0 0; text-align:center }
.esp #loginfo_content .find_loginfo .join_type { padding:35px 0 0 0; text-align:center }

.esp .back_joining { position:absolute; z-index:0; width:50%; height:60px; background:url(/static/image/login/bg_joining_leftline.gif) repeat-x 0 100% }
.esp #joining { z-index:10 }
.esp .bg_joining { height:265px }
.esp .bg_joining #loginfo { width:985px; min-height:530px; height:auto !important; height:530px; background:url(/static/image/login/bg_joining.gif) no-repeat 50% 58px }

.esp .bg_joining #loginfo_header { position:relative; overflow:hidden; height:58px }
.esp .bg_joining #loginfo_content { overflow:hidden; width:100% }
.esp .bg_joining #loginfo_header h1 { position:absolute; top:28px; right:35px }
.esp .bg_joining #loginfo_content { width:auto; padding:45px 0 0 20px }
.esp .bg_joining ol.joining_step { overflow:hidden; width:100%; height:61px; margin:0 0 70px; padding-left:80px }
.esp .bg_joining ol.joining_step.fourStep { overflow:hidden; width:100%; height:61px; margin:0 0 70px; padding-left:0; }
.esp .bg_joining ol.joining_step li { float:left; width:220px; height:61px; margin:0 20px 0 0; text-indent:-9999em; background:url(/static/image/login/btn_joinstep.gif) no-repeat }
.esp .bg_joining ol.joining_step li.step0 { background-position:0 0 }
.esp .bg_joining ol.joining_step li.step0.now0 { background-position:0 -101px }
.esp .bg_joining ol.joining_step li.step1 { background-position:-241px 0 }
.esp .bg_joining ol.joining_step li.step1.now1 { background-position:-241px -101px }
.esp .bg_joining ol.joining_step li.step2 { background-position:-479px 0 }
.esp .bg_joining ol.joining_step li.step2.now2 { background-position:-479px -101px }
.esp .bg_joining ol.joining_step li.step3 { background-position:-717px 0 }
.esp .bg_joining ol.joining_step li.step3.now3 { background-position:-717px -101px }

.esp .bg_joining .joiningSectionW { padding:7px 0 50px 121px; background:url(/static/image/login/bg_joining_section.gif) no-repeat 80px 0; zoom:1 }
.esp .bg_joining .joiningSectionW:after { display:block; clear:both; content:"" }
.esp .bg_joining .joiningSectionW h2 { height:30px; padding:0 0 0 5px }
.esp .bg_joining .joiningSectionW p.titletext { height:37px; padding:0 0 0 5px }
.esp .bg_joining .joiningSection { padding:28px 0 0 19px }
.esp .bg_joining .joining_formW { overflow:hidden; width:100% }
.esp .bg_joining .joiningForm { float:left; width:595px; padding:27px 0 22px; border:1px solid #d9dfe8; border-width:1px 0 }
.esp .bg_joining .joiningForm2 { float:left; width:780px; padding:27px 0 22px; border:1px solid #d9dfe8; border-width:1px 0 }
.esp .bg_joining .joiningForm p { overflow:hidden; width:100%; height:27px }
.esp .bg_joining .joiningForm p label { float:left; width:60px; margin:5px 0 0; padding:0 0 0 19px }
.esp .bg_joining .joiningForm p input.text_input { float:left; width:138px; height:20px; padding:0; line-height:20px; border:1px solid #c4cad5 }
.esp .bg_joining .joiningForm p span { float:left; margin:5px 5px 0 }
.esp .bg_joining .joiningSubmit { float:left; padding:35px 0 0 21px }
.esp .bg_joining .joiningstep1_guide { padding:26px 0 0 16px }
.esp .bg_joining .joiningstep1_guide p { height:23px }
.esp .bg_joining .joiningstep1_guide ol li { height:18px; vertical-align:top }
.esp .bg_joining .okcertify { padding-top:139px; background:url(/static/image/login/bg_okcertify.gif) no-repeat 50% 33px }
.esp .bg_joining .okcertify p { height:30px; text-align:center }
.esp .bg_joining .joining_complete { background:url(/static/image/login/txt_done_joining.gif) no-repeat 145px 33px }
.esp .bg_joining .joining_complete p.firstchild { width:100%; height:210px; text-indent:-9999em }
.esp .bg_joining .joining_complete p { text-align:center }

#emailConfirm { overflow:hidden; width:652px; margin:0 auto }
#emailConfirm #emailConfirm_header { overflow:hidden; width:100%; height:74px/*143px*/; padding:69px 76px 0; background:url(/static/image/login/bg_emailconfirm_header.gif) no-repeat 0 0 }
#emailConfirm #emailConfirm_header p { padding:23px 0 0 13px }
#emailConfirm #emailConfirm_content { min-height:275px; height:auto !important; height:275px; padding:32px 84px 0; color:#2f3743; background:url(/static/image/login/bg_emailconfirm_content.gif) no-repeat 0 100% }
#emailConfirm .joiningEmail { line-height:1.5 }
#emailConfirm .joiningEmail p { margin:0 0 10px }
#emailConfirm #joiningEmail_address { margin:0; padding:15px 0 0 }
#emailConfirm #joiningEmail_address a { color:#659ae9 }
#emailConfirm .joiningEmail_info { padding:65px 35px 55px }
#emailConfirm .joiningEmail_info table { width:100%; margin:0 0 30px; line-height:1.2; vertical-align:middle; border:0 none }
#emailConfirm .joiningEmail_info table th,
#emailConfirm .joiningEmail_info table td{ height:22px; vertical-align:middle; border:0 none }
#emailConfirm .joiningEmail_info p { text-align:center }

.joiningstep2_guide { width:100% }
.joiningstep2_guide .btn { overflow:hidden; width:auto; padding:9px 58px 0 0 } /* psh : padding-right:1px*//* 2011-05-23 _ gm : add width:100% */
.joiningstep2_guide .btn ul { float:right }
.joiningstep2_guide .btn li { float:left; margin:0 0 0 2px }
.joiningstep2_guide p { padding:8px 0 5px }
.joiningstep0_agreeBtn { width:700px; padding:20px 0 0; text-align:center }

.esp .bg_joining .agreePolicyW { overflow:hidden; width:100% }
.esp .bg_joining .agreePolicy { overflow-x:hidden; overflow-y:auto; float:left; width:595px; height:75px; padding:15px 20px 15px; border:1px solid #d9dfe8 }
.esp .bg_joining .agreeTextView { float:left; padding:0 0 0 10px; }
.esp .bg_joining .agreeHeading { margin:0 0 5px; padding:0 0 0 3px }
.esp .bg_joining .agreeOk { margin:0 0 30px; padding:5px 0 0 8px }

/* basic_table */
.basic_table table { width:100%; margin:0 0 25px 0; font-size:11px; color:#464646; border-top:1px solid #ccc; border-bottom:1px solid #ccc; background:#fff }
.basic_table table th,
.basic_table table td{ height:24px; text-align:left; padding:3px 0 3px 6px; line-height:1.2; vertical-align:middle; border-bottom:1px solid #e1e1e1 }
.basic_table table th { padding:0 0 0 10px; color:#0f3c74; background:#f4f4f4 }
.basic_table table th img,
.basic_table table td img { vertical-align:middle; line-height:100% } /* psh : top-> middle */
.basic_table table th.lastchild,
.basic_table table td.lastchild{ border-bottom:0 none }

/* #container #content .article .basic_table table td a { padding:0 0 0 5px } */
.basic_table table td.searchIco a,
.basic_table table td.calIco a { float:left }
.basic_table table td.searchIco img,
.basic_table table td.calIco img { vertical-align:top; line-height:100% }
.basic_table table select { width:85%; font-size:11px; border:1px solid #ccc }
.basic_table table td span.txt_won { display:block; padding:3px 0 0 0 }
.basic_table table td span.txt { float:left; padding-top: 4px; padding-right: 5px; }
.basic_table table input.assetInput { float:left; width:84%; height:18px; padding:0; line-height:18px; border:1px solid #ccc }
.basic_table table input.assetInput2 { float:left; width:84%; height:18px; padding:0; line-height:18px; border:1px solid #ccc }
.basic_table table textarea { width:98% }
#add { width:60%; margin:0 6px 0 0 }
.basic_table table .caution { display:block; clear:both; width:100%; padding:5px 0 0; color:#6ca2d1 }

/* joining_formW table */
.joining_formW .basic_table table { margin:0 }
.joining_formW .basic_table table .text_input { float:left; border:1px solid #ccc }
.joining_formW .basic_table table span.text_input { margin:4px 2px 0 0; border:0 none }
.company_paragraph { overflow:hidden; width:100%; margin:0 0 5px; line-height:100%; vertical-align:middle }
.company_paragraph .text,
.company_paragraph label{ float:left; padding:5px 5px 0 }
.company_paragraph input{ float:left }

/* LOGOUT */
.esp #logoutwrap{ position:absolute; top:50%; width:100%; height:294px; margin:-147px 0 0 0 }
.esp #logoutwrap #logout { width:860px; height:294px; margin:0 auto }
.esp #logoutwrap #logout #logout_header { overflow:hidden; height:45px; background:url(/static/image/login/bg_login_header.gif) no-repeat 406px 3px }
.esp #logoutwrap #logout #logout_content .logout_area { position:relative; overflow:hidden; text-align:center; float:left; width:100%; height:225px; background:url(/static/image/login/bg_logout_area.gif) no-repeat 0 0 }
.esp #logoutwrap #logout #logout_footer { float:right; padding:12px 0 0 0 }

.esp #logoutwrap #logout #logout_header h1 { float:left; padding:0 0 0 200px }
.esp #logoutwrap #logout #logout_header p { float:right; padding:2px 175px 0 0 }
.esp #logoutwrap #logout #logout_content .logout_area h2 { padding:35px 0 20px 0 }
.esp #logoutwrap #logout #logout_content .logout_area p.attention1 { text-align:left; padding:35px 0 9px 270px; vertical-align:top; line-height:100%; font-size:0 }
.esp #logoutwrap #logout #logout_content .logout_area p.attention2 { text-align:left; padding:0 0 0 270px; vertical-align:top; line-height:100%; font-size:0 }
.esp #logoutwrap #logout #logout_content .logout_area img { vertical-align:top; line-height:100%; font-size:0 }