@charset "utf-8";
@import url("/css/reset.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,900;1,100&display=swap');

html { width:100%; height:100%; }
body { width:100%; height:100%; }

#loginwrap { position:relative; width:100%; height:100%; background:#f8f6f6; }
#loginfrom { position:relative; width:100%; max-width:560px; margin:0 auto; }

#titletxt { width:100%; padding-top:130px; text-align:center; font-weight:900; font-size:50px; color:#000; font-family: 'Roboto', sans-serif; line-height:1; letter-spacing:-1px; }
#titletxt span { color:#dd0707; }
#contxt { margin-top:14px; font-size:16px; font-weight:200; color:#000; text-align:center; letter-spacing:-1px; }

#contents { clear:both; width:90%; padding:15% 10%; border:1px solid #e6e6e6; background:#fff; margin:0 auto; margin-top:30px; box-sizing:border-box; }
#contents ul { width:90%; margin:0 auto; }
#contents ul li label { display:none; }
#contents ul li input { margin-bottom:10px; width:100%; height:54px; border:1px solid #b3b3b3; padding-left:8px;  font-size:14px; letter-spacing:1px; line-height:3; }
#contents ul li input::placeholder { color:#555; }

#contents .id_chk { width:90%; margin:0 auto; font-size:13px; color:#999;  }
#contents .id_chk span { margin-right:4px; }

#contents div.loginbt { padding-top:20px; width:90%; margin:0 auto; }
#contents div.loginbt input { width:100%; height:50px; margin:0 auto; background:#000; border:0; color:#fff; font-size:18px; font-weight:300; font-family: 'Roboto', sans-serif; cursor:pointer; }

#copy { width:100%; text-align:center; padding-top:10px; }
#copy div { display:inline-block; margin:0 5px; font-size:12px; }
#copy div a { color:red; }
#copy div span { color:#000; font-weight:500; }


input[type="checkbox"]:checked + label {

}
input[type="checkbox"] {
 display:none;
}
input[type="checkbox"] + label span {
 display:inline-block;
 width:14px;
 height:14px;
 vertical-align:middle;
 background:#fff;
border:1px solid #000;
 cursor:pointer;
}
input[type="checkbox"]:checked + label span {
background:#000;
border:1px solid #000;
}


input[type="radio"]:checked + label {

}
input[type="radio"] {
 display:none;
}
input[type="radio"] + label span {
 display:inline-block;
 width:14px;
 height:14px;
 vertical-align:middle;
 background:#fff;
border:1px solid #000;
 cursor:pointer;
}
input[type="radio"]:checked + label span {
background:#000;
border:1px solid #000;
}


@media all and (min-width:320px) and (max-width:780px) {

	#titletxt { width:100%; padding-top:20%; text-align:center; font-weight:900; font-size:34px; color:#000; font-family: 'Roboto', sans-serif; line-height:1; letter-spacing:-1px; }
	#titletxt span { color:#dd0707; }
	#contxt { margin-top:10px; font-size:12px; font-weight:200; color:#000; text-align:center; letter-spacing:-1px; }

	#contents { clear:both; width:90%; padding:15% 10%; border:1px solid #e6e6e6; background:#fff; margin:0 auto; margin-top:20px; box-sizing:border-box; }
	#contents ul { width:90%; margin:0 auto; }
	#contents ul li label { display:none; }
	#contents ul li input { margin-bottom:10px; width:100%; height:40px; border:1px solid #b3b3b3; padding-left:4px;  font-size:13px; letter-spacing:1px; line-height:3; }
	#contents ul li input::placeholder { color:#555; }

	#contents .id_chk { width:90%; margin:0 auto; font-size:13px; color:#999;  }
	#contents .id_chk span { margin-right:4px; }

	#contents div.loginbt { padding-top:20px; width:90%; margin:0 auto; }
	#contents div.loginbt input { width:100%; height:50px; margin:0 auto; background:#000; border:0; color:#fff; font-size:14px; font-weight:bold; font-family: 'Roboto', sans-serif; cursor:pointer; }

	#copy { width:100%; text-align:center; padding-top:10px; }
	#copy div { display:inline-block; width:100%; margin:2px 0px; font-size:12px; }
	#copy div a { color:red; }
	#copy div span { color:#000; font-weight:500; }




}
