@charset "utf-8";
@import url("./common.css");

html,body{height:100%; }
.member_group{width:100%; height:100%; min-height:100vh; background:url(../lsquick/images/login.jpg) top no-repeat; position:relative; animation: animatedBackground 15s linear infinite;-moz-animation: animatedBackground 15s linear infinite;-webkit-animation: animatedBackground 15s linear infinite;-ms-animation: animatedBackground 15s linear infinite;-o-animation: animatedBackground 15s linear infinite; }
.member_group.join_group{height:auto; background-size:cover; }

@keyframes animatedBackground {
    0% { background-position: 35% 100% }
    50% { background-position: center 100%; }
	100% { background-position: 35% 100% }
}
.member_group .box{width:90%; max-width:640px; height:100%; background:rgb(7,52,68,.6); display:table; margin:auto;}
.member_group .inner{padding:0% 15%;display:table-cell; vertical-align:middle;}
.member_group .inner.box_pwd{text-align:center; }
.member_group .inner.box_main{padding:8% 10% 6%; }
.member_group .inner.box_agree{display:none;}
.member_group .inner .logo{width:140px; height:23px; margin:auto; margin-bottom:25px; display:block; }
.member_group .inner .line{border:1px solid rgb(255,255,255,.5); margin:35px 0 40px; }
.member_group .inner .tit{margin-bottom:30px; position:relative; }
.member_group .inner .tit .btn_back{position:absolute; right:0; top:-9px; }
.member_group .inner .tit-sm{margin-bottom:20px;}
.member_group .inner h2{font-size:22px; line-height: 30px; margin:0 0 10px; padding-left:0; letter-spacing:-0.8px; word-break:keep-all;  font-weight:500; color:#fff; text-shadow:0px 0px 6px #073444;}
.member_group .inner h3{font-size:18px; line-height: 30px; margin:20px 0px 13px; letter-spacing:-0.8px; word-break:keep-all;  font-weight:400; color:#fff;text-shadow:0px 0px 6px #073444;}
.member_group .inner h4{font-size:14px; font-size:16px\0; line-height:22px; font-weight:400; letter-spacing:-0.8px; color:#fff;text-shadow:0px 0px 6px #073444; }
.member_group .inner h4 strong{text-decoration:underline}
.member_group .inner h4.tt{margin:40px 0 50px; }
.member_group .inner .f_select{margin-bottom:20px; position: relative;}
.member_group .inner .f_select .input_check{width: 0px;margin: 0;padding: 0;opacity: 0; }
.member_group .inner .f_select input[type=radio] + label { color:#eff0f1; display: inline-block;margin-left: -5px;padding-left: 28px;font-size: 13px;line-height: 24px; line-height: 24px; font-size: 13px; background: url(../images/common/radio.png) no-repeat 0 -1px; cursor: pointer;}
.member_group .inner .f_select input[type=radio] + label:last-child{margin-left:10px; }
.member_group .inner .f_select input[type=radio]:checked + label { background-position : 0 -49px;}
.member_group .inner .tel_chk{display:none}
.member_group .inner textarea {display:block;padding:15px;font-size:14px; font-size:16px\0; width:100%; max-height:150px; margin-bottom:40px; background-color: rgb(232,240,254,.4); color:#000;border:0;line-height:1.6em}
.member_group .inner textarea:focus{outline:none;}
.member_group .inner .tbl_head01 {margin:0 0 10px}
.member_group .inner .tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.member_group .inner .tbl_head01 thead th {font-size:14px; font-size:16px\0; padding:20px 0;font-weight:normal;text-align:center;border-bottom:1px solid #ececec;height:40px}
.member_group .box_agree .tbl_head01 thead th{padding:10px 0;}
.member_group .inner .tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.member_group .inner .tbl_head01 tfoot th, 
.member_group .inner .tbl_head01 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.member_group .inner .tbl_head01 tbody th {padding:8px 0;border-bottom:1px solid #e8e8e8}
.member_group .inner .tbl_head01 td {font-size:14px; font-size:16px\0; color:#666;padding:10px 5px;border-top:1px solid #ecf0f1;border-bottom:1px solid #ecf0f1;line-height:1.4em;height:60px;word-break:break-all}
.member_group .inner .tbl_head01 tbody tr:hover td {background:#fafafa}
.member_group .inner #result_email {margin:20px 0;padding:10px;border-top:1px solid #e9e9e9;border-bottom:1px solid #dde4e9;background:#fff;line-height:2em}
.member_group .inner .input_tit{font-size:13px; font-size:15px\0; margin-bottom:5px; letter-spacing:-0.5px; position:relative; color:#fff; font-weight:300; display:block; }
.member_group .inner .input_tit label{font-family: "Poppins"; text-shadow:0px 0px 6px #333; }
.member_group .inner .error{color:#ff0000}
.member_group .inner .input-group{margin-bottom:14px;}
.member_group .inner .form-control{width:100%; border-radius: 0.25rem; font-weight:300; color:#fff; background-color: rgb(232,240,254,.4); border:0; margin-bottom:5px; }
.member_group .inner .form-control::placeholder{color:#eee; font-weight:100; }
.member_group .inner .form-control::-moz-placeholder{color:#eee;font-weight:100; }
.member_group .inner .form-control::-webkit-placeholder{color:#eee; font-weight:100; }
.member_group .inner .form-control.form-sm{width:150px; display:inline-block; }
.member_group .inner .form-control.form-md{width:250px; display:inline-block; }
.member_group .inner .f_top{margin-top:25px; }
.member_group .inner .f_btm{margin-bottom:15px; }
.member_group .inner .btn_addr,
.member_group .inner .btn_id{width:50px; height:38px; font-size:14px; margin-left:5px; background:#18b7f1; color:#fff; border:2px solid #18b7f1; border-radius: 0.25rem; font-weight:600; }
.member_group .inner .btn_addr:focus,
.member_group .inner .btn_addr:hover,
.member_group .inner .btn_id:focus,
.member_group .inner .btn_id:hover{background-color: rgb(24,183,241,.6); border-color:rgb(24,183,241,.6);outline:none;}
.member_group .inner .btn_id{width:100px;}
.member_group .inner .btn_id.ok,
.member_group .inner .btn_id.ok:focus{background:rgb(24,183,241,.2);border-color:rgb(24,183,241,.2);}
.member_group .inner #password_lost{border:0; color:#18b7f1; font-family: "Poppins"; font-weight:500; padding:0; position:absolute; right:0; top:2px; letter-spacing:-0.5px; text-shadow:0px 0px 6px #073444;}
.member_group .inner #password_lost:focus,
.member_group .inner #password_lost:hover{color:#18b7f1; text-decoration:underline; outline:none;}
.member_group .inner .login_if_auto{font-size:14px; font-size:16px\0; color:#fff; margin-bottom:15px; text-shadow:0px 0px 6px #333;}
.member_group .inner .chk_box input[type="checkbox"] + label span{position:relative; top:3px; top:5px\0; margin-right:6px; font-family: "Poppins";}
.member_group .inner .chk_box input[type="checkbox"]:checked + label span{background: url(./img/chk.png) no-repeat 50% 50% #7775f1; border-color: #7775f1;}
.member_group .inner .chk_box input[type="checkbox"] + label:hover{text-decoration:underline;}
.member_group .inner .chk_box a{cursor:pointer; text-decoration:none; color:#18b7f1}
.member_group .inner .btn_submit{width:100%; padding:8px 0px; font-size:14px; border-radius: 0.25rem; background:rgba(24,183,241,.6); color:#fff; border:0; font-family: "Poppins"; font-weight:600;}
.member_group .inner .btn_submit:focus,
.member_group .inner .btn_submit:hover{background:rgba(24,183,241,.8); outline:none;}
.member_group .inner .join_r{font-size:14px; text-align:right; margin-top:10px; }
.member_group .inner .join_r a{color:#18b7f1; font-family: "Poppins"; font-weight:600; text-shadow:0px 0px 6px #073444; border-bottom:1px solid #18b7f1; }
.member_group .inner .join_r a:focus,
.member_group .inner .join_r a:hover{color:rgba(24,183,241,.8); text-decoration:none; outline:none;}
.member_group .inner .agree_b{cursor:pointer; margin-bottom:15px;}
.member_group .inner .btns{text-align:center; margin-bottom:15px; }
.member_group .inner .btns:last-child{margin-bottom:0;}
.member_group .inner .btn_back{font-size:14px; margin:auto; margin-top: 20px; cursor:pointer; font-family: "Poppins"; font-weight:600; color: #18b7f1; display:inline-block; }
.member_group .inner .btn_back i{display:inline-block; margin-right:10px; }
.member_group .inner .btn_back:hover{text-decoration:underline;}

@media (max-width: 900px) {
	.member_group .box{width:100%; max-width:100%; }
	.member_group{width:100%; margin:auto; }
}
@media (max-width: 450px) {
	.member_group .inner {padding: 0px 10%;}
	.member_group .inner h2{padding:0; margin-bottom:1rem;}
	.member_group .inner h4{word-break:keep-all;}
}