@charset "utf-8";
/* CSS Document */

/* reset */
.total_login_wrap *{font-family:"NotoSans"; }
* { margin:0; padding:0;} 
ol, ul {list-style:none;}
hr {display:none;}
a {color:inherit;}
a:link, a:visited, a:hover, a:active, a:focus { text-decoration:none; color:inherit; cursor:pointer; }
label{position: absolute;width: 1px;height: 1px;margin: -1px;overflow: hidden;clip-path: polygon(0 0, 0 0, 0 0);}

/*알림창*/
/* .alert{left:85% !important;top:85% !important;position:relative; width:270px; height:140px; background:rgba(255, 255, 255, 0.9); border-radius:5px;} */
.alert{left:85% !important;top:85% !important;position:relative; width:300px; height:500px; background:rgba(255, 255, 255, 0.9); border-radius:5px;}
.alert .top_bar{position:relative; background-color:#2b55a2;  border-radius:5px 5px 0 0;}
.alert .top_bar h3{padding-left:20px; line-height:36px; font-size:15px; color:#fff;  font-family:'NanumBold';}
.alert .top_bar p{position:absolute; top:7px; right:20px; }
.login {position:relative;}
.login .user_img{width:57px; height:57px; padding:20px 0 0 20px;}
.login .user_img img{width:100%; height:100%;}
.login .user_txt{position:absolute; top:29px; left:90px; font-size:14px; letter-spacing:-1px; font-family:'Nanum';}
.login .user_txt span{font-size:16px; }
.alert .btn_more{position:absolute; right: 20px; bottom:15px; width:40px; line-height:20px; text-align:center; color:#000; background-color:#ddd; font-size:13px; font-family:'Nanum';}

.alert2{background:rgba(255, 255, 255, 0.9); border-radius:5px;}
.alert2 .top_bar{position:relative; background-color:#2b55a2;  border-radius:5px 5px 0 0;}
.alert2 .top_bar h3{padding-left:20px; line-height:36px; font-size:15px; color:#fff;  font-family:'NanumBold';}
.alert2 .top_bar p{position:absolute; top:7px; right:20px; }
.alert2 .btn_more{position:absolute; right: 20px; bottom:15px; width:40px; line-height:20px; text-align:center; color:#000; background-color:#ddd; font-size:13px; font-family:'Nanum';}

/* 통합로그인 */
.total_login{position:relative;width:100%;height:auto; min-height:100vh;padding:3.5rem 0 2rem;}
.total_login:before{position:absolute;top:50%;left:50%;width:100vw;height:100%;-webkit-transform:translate(-50%, -50%) scale(1.5);transform:translate(-50%, -50%) scale(1.5);background:url('/images/co/lo/total_login_bg.png') no-repeat center/cover;content:"";z-index:-1;-webkit-transition:transform 3s;transition:transform 3s;}
.shOn .total_login:before{-webkit-transform:translate(-50%, -50%) scale(1);transform:translate(-50%, -50%) scale(1);}
.total_login_wrap{opacity:0;-webkit-transform:translateY(2.5rem);transform:translateY(2.5rem);-webkit-transition:opacity .5s, transform .5s;transition:opacity .5s, transform .5s;}
.shOn .total_login_wrap{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}
.total_login_wrap h1{display:block;text-align:center;font-weight:500;font-size:1.75rem;color:#fff;text-align:center;}
.total_login_wrap .login_tab_wrap{position:relative;width:45rem;height:25.5rem;margin:2rem auto 0;background:#fff;border-radius:2.5rem;overflow:hidden;}
.total_login_wrap .login_tab_wrap h2[class^="login_tab"]{height:4rem;background:#f3f4f4;color:#555;font-size:1rem;font-weight:500;word-break:keep-all;text-align:center;float:left;width:50%;}
.total_login_wrap .login_tab_wrap h2[class^="login_tab"]:not(.on) +  .login_con + h2[class^="login_tab"]:not(.on){border-left:1px dotted #bfc1c6;}
.total_login_wrap .login_tab_wrap h2.on{background:#fff;}
.total_login_wrap .login_tab_wrap h2 > a{display:table;table-layout:fixed;width:100%;height:100%;padding:0 .5rem;}
.total_login_wrap .login_tab_wrap h2 > a > span{display:table-cell;width:100%;vertical-align:middle;}
.total_login_wrap .login_tab_wrap h2 > div{display:table;table-layout:fixed;width:100%;height:100%;padding:0 .5rem;}
.total_login_wrap .login_tab_wrap h2 > div > span{display:table-cell;width:100%;vertical-align:middle;}
.total_login_wrap .login_con{position:absolute;top:4rem;left:0;width:100%;height:calc(100% - 4rem);display:none;}
.total_login_wrap .login_con.on{display:block;}
.total_login_wrap .login_box{position:relative;height:100%;padding:3.5rem 3rem 0 26rem;}
.total_login_wrap .login_box:before{position:absolute;left:0;bottom:0;width:19.95rem;height:18.1rem;background:url('/images/co/lo/total_login_deco.png') no-repeat center/cover;content:"";}
.total_login_wrap .login_box .box h3{display:block;font-size:1.75rem;font-weight:700;color:#28304a;text-align:center;line-height:1;}
.total_login_wrap .login_box .login_frm{margin-top:1.75rem;}
.total_login_wrap .login_box .login_frm > li{position:relative;padding:.25rem 0;}
.total_login_wrap .login_box .login_frm > li input{position:relative;display:block;width:100%;height:2.5rem;padding:0 .5rem 0 2.5rem;background:#f5f7f8;color:#555;font-size:.7rem;border-radius:.5rem;overflow:hidden;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:0;}
.total_login_wrap .login_box .login_frm > li input::-ms-expand{display:none;}
.total_login_wrap .login_box .login_frm > li:before{position:absolute;z-index:1;top:50%;left:.75rem;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:20px;height:20px;background-image:url(/images/co/lo/login_frm_ico.png);background-size:40px 20px;background-position:0 0;background-repeat:no-repeat;content:"";}
.total_login_wrap .login_box .login_frm > li.login_pw:before{background-position:-20px 0;}
.total_login_wrap .login_box .login_frm2{margin:1.75rem auto;text-align:center;}
.total_login_wrap .login_box .login_frm2 > li > a{display:inline-block; }
.total_login_wrap .login_box .login_frm2 > li > a > img{display:block; max-width:100%; }
.total_login_wrap .login_box .btn_login{position:relative;display:block;width:100%;height:2.5rem;margin-top:.25rem;background:#465cbd;color:#fff;font-size:.7rem;line-height:2.5rem;text-align:center;border-radius:.5rem;overflow:hidden;}
.total_login_wrap .login_box .btn_login:before{position:absolute;top:0;left:110%;width:150%;height:100%;background:#2d3654;-webkit-transform:skewX(-0.06turn);transform:skewX(-0.06turn);-webkit-transition:left .3s;transition:left .3s;content:"";}
.total_login_wrap .login_box .btn_login > span{position:relative;z-index:1;}
.total_login_wrap .login_box .login_until{margin-top:1rem;text-align:center;}
.total_login_wrap .login_box .login_until > li{position:relative;display:inline-block;padding:0 1rem;color:#333;font-size:.7rem;}
.total_login_wrap .login_box .login_until > li + li:before{position:absolute;top:50%;left:0;width:1px;height:.85rem;-webkit-transform:translateY(-50%);transform:translateY(-50%);border-left:1px dotted #c9c9c9;content:"";}
.total_login_wrap .login_box .login_until > li > a{display:block;}
.total_login_wrap .copy{display:block;margin-top:1.5rem;color:#fff;font-size:.7rem;text-align:center;}
.total_login_wrap .login_box .btn_back {background: #59658e;} /* 240628 */
.total_login_wrap .login_box .btn_back:before {background: #4d5369;} /* 240628 */
/* 로그인 영역 버튼 */
.total_login_wrap [class^="btn_"]{position:relative;display:inline-block;width:100%;height:2.5rem;margin-top:.25rem;color:#fff;font-size:.7rem;line-height:2.5rem;text-align:center;border-radius:.5rem;overflow:hidden;}
.total_login_wrap [class^="btn_"]:before{position:absolute;top:0;left:110%;width:150%;height:100%;-webkit-transform:skewX(-0.06turn);transform:skewX(-0.06turn);-webkit-transition:left .3s;transition:left .3s;content:"";}
.total_login_wrap [class^="btn_"] > span{position:relative;z-index:1;}
.total_login_wrap [class^="btn_"] > span > i {margin-right: 0.5rem; vertical-align: middle; font-size: 1rem;}
.total_login_wrap .btn_login {background: #465cbd;}
.total_login_wrap .btn_login:before {background: #2d3654;}
.total_login_wrap .btn_back {background: #59658e;}
.total_login_wrap .btn_back:before {background: #4d5369;}
.total_login_wrap .btns {margin-top: 1.25rem;}
.total_login_wrap .btns [class^="btn_"] {max-width: 10rem;}

/* id pw 찾기 */
.total_login_wrap.find_login_wrap .login_box{padding:2rem 3rem 0 3rem; }
.total_login_wrap.find_login_wrap .login_box:before{display:none; }
.total_login_wrap.find_login_wrap .login_tab_wrap{max-width:90%; height:37.5rem; }
.total_login_wrap.find_login_wrap .login_tab_wrap h2[class^="find_tab"]{height:4rem;background:#f3f4f4;color:#555;font-size:1rem;font-weight:500;word-break:keep-all;text-align:center;float:left;width:50%;}
.total_login_wrap.find_login_wrap .login_tab_wrap h2[class^="find_tab"]:not(.on) +  .login_con + h2[class^="login_tab"]:not(.on){border-left:1px dotted #bfc1c6;}
.total_login_wrap.find_login_wrap .login_tab_wrap h2.on{background:#fff;}
.total_login_wrap.find_login_wrap .login_tab_wrap h2 > a{display:table;table-layout:fixed;width:100%;height:100%;padding:0 .5rem;}
.total_login_wrap.find_login_wrap .login_tab_wrap h2 > a > span{display:table-cell;width:100%;vertical-align:middle;}
.total_login_wrap.find_login_wrap .find_con{position:absolute;top:4rem;left:0;width:100%;height:calc(100% - 4rem);display:none;}
.total_login_wrap.find_login_wrap .find_con.on{display:block;}
.total_login_wrap.find_login_wrap .login_box .notice{margin-bottom:1rem; padding-bottom:1rem; border-bottom:1px dashed #ddd; }
.total_login_wrap.find_login_wrap .login_box table{text-align:left; }
.total_login_wrap.find_login_wrap .login_box .box h3{margin-bottom:1rem; font-size:1rem; text-align:left; }
.total_login_wrap.find_login_wrap .login_box .blue{display:inline-block; padding:.5rem 1rem; background:#1f41b5; color:#fff; border-radius:.5rem; overflow:hidden; }
.total_login_wrap.find_login_wrap .login_box .grey{display:inline-block; padding:0 1rem; background:#4e4e4e; line-height:38px; color:#fff; border-radius:.25rem; overflow:hidden; vertical-align:middle; }

/* 회원가입 */
.total_join_wrap .login_tab_wrap{padding:2rem; height:auto !important; }
.total_join_wrap [class^="btn_style"]{color:#fff; }
.total_join_wrap .btn_style7{color:#000 !important; }
.total_join_wrap .sbscrbStep{padding:0; }
.total_join_wrap .TypeBox{float:none; }
.total_join_wrap .sbscrbStep .crtfcBtn a{padding:.5rem; }

.total_login_wrap .login_tab_wrap{height: 21.5rem;}
.total_login_wrap .login_con{top: 4rem;}
.total_login_wrap .login_box{padding: 0.5rem 3rem 0 26rem;}

@media(max-width:1200px){
	/* 통합로그인 */
	.total_login_wrap .login_tab_wrap{width:96%;}
	.total_login_wrap .login_box{padding-left:20rem;}
	.total_login_wrap .login_box:before{width:16.5rem;height:15rem;}
	
	/* id pw 찾기 */
	.total_login_wrap.find_login_wrap .login_tab_wrap{width:90%; }
	
}
@media(min-width:769px){
	/* 통합로그인 */	
	.total_login_wrap [class^="btn_"]:hover:before,
	.total_login_wrap [class^="btn_"]:focus:before{left:-10%;}
	.total_login_wrap .login_box .login_until > li > a:hover,
	.total_login_wrap .login_box .login_until > li > a:focus{color:#465cbd;}
}
@media(max-width:768px){
	/* 통합로그인 */
	.total_login{padding:2rem 0; }
	.total_login_wrap h1{font-size:1.5rem;}
	.total_login_wrap .login_tab_wrap{height:24rem;border-radius:1.5rem;}
	.total_login_wrap .login_tab_wrap h2[class^="login_tab"]{font-size:.8rem;}
	.total_login_wrap .login_box{padding:2.5rem 2rem 0;}
	.total_login_wrap .login_box:before{display:none;}
	.total_login_wrap .login_box .box h3{font-size:1.4rem;}
	
	/* id pw 찾기 */
	.total_login_wrap.find_login_wrap .login_box{padding:1.5rem 1rem; }
	.total_login_wrap.find_login_wrap .tbl_st table th,
	.total_login_wrap.find_login_wrap .tbl_st table td{padding:.25rem; }
	.total_login_wrap.find_login_wrap .tbl_st table td select,
	.total_login_wrap.find_login_wrap .tbl_st table td input{height:30px; }
	.total_login_wrap.find_login_wrap .login_box .grey{line-height:30px;}
	
	/* 회원가입 */
	.total_login_wrap .login_tab_wrap{padding:1.5rem 1rem; }
	.total_join_wrap .sbscrbStep > ul.stepList{padding:.5rem; }
	.total_join_wrap .sbscrbStep > ul.stepList li{width:33.333%; background-size:10%; }
	.total_join_wrap .sbscrbStep > ul.stepList li img{width:50px; padding:10px; }
	.total_join_wrap .sbscrbStep > ul.stepList li p span{font-size:.75rem; }
	.total_join_wrap .TypeBox ul.customersType > li a{padding:.75rem .5rem; }
	.total_join_wrap .TypeBox ul.customersType > li span{font-size:.9rem; }
	.total_join_wrap .TypeBox ul.customersType > li img{display:none; }
	.total_join_wrap .TypeBox ul.customersType > li a div{height:30px; line-height:30px; font-size:.75rem; }
	.total_join_wrap .tbl_st_row colgroup{display:none; }
	.total_join_wrap .tbl_st_row table,
	.total_join_wrap .tbl_st_row table tbody,
	.total_join_wrap .tbl_st_row table tr,
	.total_join_wrap .tbl_st_row table th,
	.total_join_wrap .tbl_st_row table td{display:block; }
	.total_join_wrap .succesBox img{width:5rem; }
}
@media(max-width:480px){
	/* 통합로그인 */
	.total_login_wrap .login_tab_wrap{height:22.5rem;}
	.total_login_wrap .login_box{padding:2rem 1rem 0;}
	.total_login_wrap .login_box .login_frm{margin-top:1.5rem;}
	.total_login_wrap .login_box .login_until > li{font-size:.65rem;}
	
	/* 회원가입 */
	.total_join_wrap .sbscrbStep > ul.stepList li{width:50%; margin:.5rem 0; background-size:7%; }
	.total_join_wrap .tbl_st_row table select, table input{width:100%; }
	.total_join_wrap .tbl_st_row table input + select,
	.total_join_wrap .tbl_st_row table select + select{margin-top:.25rem; }
	.total_join_wrap .sbscrbStep .tbl_st_row table td .btn_line_style2{width:100%; text-align:center; }
}