@charset "utf-8";

/*
#mb_login_2 {display: flex;justify-content: center;align-items: center;}
#mb_login_2 > .login {margin-right: 5%}
#mb_login_2 > .banner {padding:5%}
*/

.login-wrap {display: block;margin: 0 auto;padding: 40px 0;width: 100%;max-width: 1000px}
.login-wrap > div:nth-child(1) {}
.login-wrap > div:nth-child(1) strong {display: block;margin: 0;padding: 0;font-size: 1.5rem;font-weight: 700;text-align: center}
.login-wrap > div:nth-child(1) p {display: block;margin: 1% 0 5%;padding: 0;font-size: 1.2rem;font-weight: 300;text-align: center;color: #666}
.login-wrap > div:nth-child(2) {display: flex;justify-content: center;align-items: center;padding: 30px 0}
.login-wrap .login {width:100%;margin-right: 5%}
.login-wrap .banner {width:100%}
.login-wrap .banner > div {display: flex;flex-direction: column;padding: 10px}
.login-wrap .banner > div > a {margin-bottom: 5%}
.login-wrap .banner > div > a:last-child {margin-bottom:0}
.login-wrap .banner > div > a > img {width: 100%}
#login_fs {display: flex;flex-direction: column;}
#login_fs > legend {display: none;}
#login_fs > input {margin-bottom:5%;padding:17px 20px;border: 0;border-radius: 5px;background-color: #fff;border: 1px solid #ccc;width: 100%;box-sizing: border-box;}
#login_fs > input::placeholder {color: #999;opacity: 1;  /* 일부 브라우저에서 흐리게 나오는 것 방지 */}
#login_fs > input:focus {outline: none;color: #333;border: 1px solid #333}
#login_fs .password-box {margin-bottom:5%;}
#login_fs .inp {padding:17px 20px;border: 0;border-radius: 5px;background-color: #fff;border: 1px solid #ccc;width: 100%;box-sizing: border-box;}
#login_fs .inp::placeholder {color: #999;opacity: 1;  /* 일부 브라우저에서 흐리게 나오는 것 방지 */}
#login_fs .inp:focus {outline: none;color: #333;border: 1px solid #333}
#login_fs > button {border: 0;border-radius: 5px;color:#fff;background-color:#333;text-align: center;padding: 20px 0;font-size: 1.3rem;font-weight: 700;margin: 0 0 5%}
#login_fs .btn-wrap {display: flex;flex-direction: row;align-items:center;}
#login_fs .btn-wrap > div:nth-child(1) {width:50%}
#login_fs .btn-wrap > div:nth-child(2) {display: flex;justify-content: flex-end;width:50%}
#login_fs .btn-wrap > div:nth-child(2) > a {padding: 10px 0}
#login_fs .btn-wrap > div:nth-child(2) > a:nth-child(2) {margin-left: 5%}

#find_info {display:block;margin: 0;padding: 0px}
#find_info > h1 {display:block;margin: 0 0 0px;padding: 20px;font-size: 1.3rem;border-bottom:1px solid #ddd}
#find_info #info_fs {display:block;margin: 0;padding: 20px}
#find_info #info_fs > p {margin: 0 0 20px;}
#find_info #info_fs > input {padding:20px;width:calc( 100% - 40px );border:1px solid #ddd;border-radius: 50px;background-color:#f6f6f6}
#find_info #info_fs > input:focus {outline: none;color: #333;border: 1px solid #333}
#find_info > .btn-wrap {display:flex;justify-content: center;align-items: center;padding:20px;border-top:1px solid #ddd}
#find_info > .btn-wrap > button {padding:7px 19px;color:#333;font-size:1.3rem;border:1px solid #ccc;border-radius:5px;background-color:#fff}
#find_info > .btn-wrap > button:hover,
#find_info > .btn-wrap > button:focus,
#find_info > .btn-wrap > button:active {background-color:#f6f6f6}
#find_info > .btn-wrap > button:nth-child(1) {margin-right:2%}
#find_info > .btn-wrap > button:nth-child(2) {}
#find_info #captcha {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:20px}
#find_info #captcha > img {width:150px;border:1px solid #ccc}
#find_info #captcha > input {width:calc( 100% - 210px );padding:15px}
#find_info #captcha_info {display:block;margin:20px 0 0;padding:0;width:100%}

/*** 회원가입 ***/
.register-wrap {display: block;margin: 0 auto;padding: 40px 0;width: 100%;max-width: 1000px}
.register-wrap > div:nth-child(1) {}
.register-wrap > div:nth-child(1) strong {display: block;margin: 0;padding: 0;font-size: 1.5rem;font-weight: 700;text-align: center}
.register-wrap > div:nth-child(1) p {display: block;margin: 1% 0 5%;padding: 0;font-size: 1.2rem;font-weight: 300;text-align: center;color: #666}
.register-wrap p.txt-alert {text-align: center;border: 1px solid var(--font-color-sty04);color: var(--font-color-sty04);margin: 0;padding: 15px;border-radius: 10px;font-size: var(--font-size-sty02);}
.register-wrap #fregister_chkall {margin: 20px 0 20px 20px;}
.register-wrap #fregister_term {border: 1px solid #ccc;border-radius: 10px;margin-top: 30px;margin-bottom: 30px;}
.register-wrap #fregister_term label {display: block;padding: 20px;font-size: var(--font-size-sty0);}
.register-wrap #fregister_term textarea {width: 100%;border: 1px solid #ccc;border-left: 0;border-right: 0;box-sizing: border-box;min-height: 200px;margin-bottom: 12px;padding: 20px;background-color: #f0f0f0;}
.register-wrap #fregister_term textarea:focus {outline: none}
.register-wrap #fregister_private {border: 1px solid #ccc;border-radius: 10px;margin-bottom: 30px;}
.register-wrap #fregister_private label {display: block;padding: 20px;font-size: var(--font-size-sty0);}
#fregister_private table{width:100%;border-collapse:collapse;margin-bottom: 11px;}
#fregister_private table caption {position:absolute;font-size:0;line-height:0;overflow:hidden}
#fregister_private table th {background:#646982;width:33.33%;color:#fff;padding:10px;/*border:1px solid #555971*/}
#fregister_private table td {border:1px solid #ddd;padding:10px;}
#fregister_private table td:first-child {border-left: 0;}
#fregister_private table td:last-child {border-right: 0;}

/*** 회원가입폼 ***/
.register-form-wrap {display: block;margin: 0 auto;padding: 40px 0;width: 100%;max-width: 1000px}
.register-form-wrap > div:nth-child(1) {display: flex;flex-direction: column;border-top: 2px solid #333;padding-top: 15px;}
.register-form-wrap > div:nth-child(1) > div {display: flex;flex-direction: row;align-items: center;margin-bottom: 15px;padding-bottom: 15px;border-bottom: 1px solid #ddd;}
.register-form-wrap > div:nth-child(1) > div > div:nth-child(1) {flex: 0 0 190px;}
.register-form-wrap > div:nth-child(1) > div > div:nth-child(1) label {font-size: 1.2rem;}
.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) {flex: 1;}
.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) input[type='text'],
.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) input[type='password'] {padding: 10px;border: 1px solid #ccc;border-radius: 7px;box-sizing: border-box;}
.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) input[type='text']:focus,
.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) input[type='password']:focus {outline: none;border: 1px solid #333}
.register-form-wrap .frm_info {display: block;margin-top: 5px;color: var(--font-color-sty01);}
.register-form-wrap .is_captcha_use {}
.register-form-wrap .is_captcha_use .captcha {}


.btn_confirm {display: flex;justify-content: center;}
.btn_confirm button {flex: 1;border: 0;
    border-radius: 5px;
    color: #fff;
    background-color: #333;
    text-align: center;
    padding: 20px 0;
    font-size: 1.3rem;
    font-weight: 700;}

/***** 반응형 CSS *****/
@media all and (max-width: 900px){
	.register-form-wrap > div:nth-child(1) > div {flex-direction: column;align-items: flex-start;gap: 5px;}
	.register-form-wrap > div:nth-child(1) > div > div:nth-child(1) {flex: 1;margin-left: 2px;}
	.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) {width: 100%;}
	.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) input[type='text'],
	.register-form-wrap > div:nth-child(1) > div > div:nth-child(2) input[type='password'] {width: 100%;}
}
@media all and (max-width: 800px){
	.login-wrap > div:nth-child(2) {display: flex;flex-direction:column;justify-content: unset;align-items: unset;}
	.login-wrap .login {margin-right: 0;margin-bottom: 20%}
	.login-wrap .banner > div {padding:0}
}
@media all and (max-width: 500px){
	#login_fs > div {flex-direction: column;}
	#login_fs > div > div:nth-child(1) {width:100%;text-align: center;}
	#login_fs > div > div:nth-child(2) {width:100%;justify-content:center;margin-top:5%}
}