/* login */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

/*
* {
	font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
}

html, body, h1, h2, h3, h4, h5, h6, input, button, a, p {font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;}
*/

html, body, h1, h2, h3, h4, h5, h6, input, label, button, a, div, p, span {font-family: 'Noto Sans KR', sans-serif;}
html, body, h1, h2, h3, h4, h5, h6, input, button, a, p {margin-bottom:0 !important;}

body{width:100%;height:100%;}
a{text-decoration:none !important;}

.pretendard {font-family:Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;}
.mbskin{}
.mbskin_box{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;}

.sub_banner .container{max-width:1640px;margin:0 auto;padding:0 20px;}


.logo_img{text-align:center;margin-bottom:100px;cursor:pointer;}
.logo_img img{max-width:260px;width:70%;}

.login_forms_box{width:868px;margin:0 auto}
.login_forms_box > div{margin-bottom:15px;}
.login_forms_box > .box2{margin-bottom:30px}
.login_forms_box div:last-child{margin-bottom:0;}
.box1 input{width:100%;height:65px;background:#fff;border:1px solid #eaeaea;border-radius:8px;line-height:55px;padding:0 15px;font-size:25px;color:#2b2b2b;font-weight:500;box-sizing:border-box;
-webkit-box-sizing:border-box;-o-box-sizing:border-box;-moz-box-sizing:border-box;}
#login_fs{width: 100%;padding: 0 20px;}
.box1 input::-input-placeholder{font-size:25px;color:#cecece;}
.box1 input::-moz-input-placeholder{font-size:25px;color:#cecece;}
.box1 input::-ms-input-placeholder{font-size:25px;color:#cecece;}
.box1 input::-webkit-input-placeholder{font-size:25px;color:#cecece;}
input[type=text]:focus,
input[type=password]:focus{box-shadow:none !important;border:1px solid #cecece !important;}

.box2 button{width:100%;height:55px;background:#d70a30;border:none;border-radius:8px;padding:0 15px;font-size:24px;color:#fff;font-weight:600;cursor:pointer;transition:all 0.3s ease;}
.box2 button:hover{background:#ad0827;}
.box2 button:active{}

.box3{display:flex;justify-content:center;gap:30px;}
.box3 a{font-size:20px;color:#b6b6b6;font-weight:500;letter-spacing:-1px;text-decoration:none;transition:all 0.3s ease;}
.box3 a:hover{color:#666;}

.box3 > p{position:relative;}			 
.box3 > p:after{content:"";position:absolute;top:6px;right:-15px;width:1px;height:50%;background:#ddd;}
.box3 > p:last-child:after{display:none;}

.login_title{margin:100px 0 60px;text-align:center;}
.login_title h3{font-size:51px;color:#000;font-weight:800;letter-spacing:-0.03rem;} 

.chk_id{margin-bottom:30px !important;}
.chk_id label{position:relative;padding-left:28px;transition:all 0.3s ease;margin-bottom:0;}
.chk_id label input{position:absolute;z-index:-1;opacity:0;}
.chk_id label p{font-size:24px;color:#3b3b3b;font-weight:500;margin-left: 5px;margin-top: -4px;}
.chk_id label > span{position:absolute;top:2px;left:0;width:26px;height:26px;border-radius:5px;border:1px solid #cecece;}
.chk_id label > span:after{content:'';position:absolute;display:none;top:50%;left:50%;margin-left: -4px;margin-top: -9px;width: 8px; height: 13px;border-width:0 2px 2px 0 !important;transform:rotate(45deg);}
.chk_id label > span:after{border:solid #fff;}
.chk_id label input:checked ~ span:after{display:block;}

.chk_id label input:checked ~ span{background:#d70a30;border:1px solid #d70a30;}


@media (max-width:991px){
	.login_title{margin:40px 0 60px;}
	.login_title h3{font-size:41px;}
	.box1 input{font-size: 20px;height: 55px;}
	.box1 input::-input-placeholder{font-size:20px;}
	.box1 input::-moz-input-placeholder{font-size:20px;}
	.box1 input::-ms-input-placeholder{font-size:20px;;}
	.box1 input::-webkit-input-placeholder{font-size:20px;}
	.chk_id label p {font-size: 20px;margin-top: -2px;}
	.box2 button{font-size: 20px;}
	.box3 a {font-size: 18px;}
	.login_forms_box{width:100%}
}
@media(max-width:767px){
	.login_title h3 {font-size: 35px;}
	.box1 input{font-size: 18px;height: 45px;}
	.chk_id label p {font-size: 17px; margin-top: 0px;}
	.chk_id label > span{width: 24px; height: 24px;}
    .box2 button {font-size: 18px;}
	.box3 a {font-size: 16px;}
}

@media (max-width:575px){
	.box1 input {height:35px;}
	.box1 input {font-size: 15px;border-radius: 5px;}
	.box1 input::-input-placeholder{font-size:15px;}
	.box1 input::-moz-input-placeholder{font-size:15px;}
	.box1 input::-ms-input-placeholder{font-size:15px;;}
	.box1 input::-webkit-input-placeholder{font-size:15px;}
	.box2 button {height:40px;font-size:15px}
	.box3 a {font-size:15px;}	
	.chk_id label{padding-left:22px;}
	.chk_id label > span {width: 20px;height: 20px;}
	.chk_id label p {font-size: 15px;}

	.login_forms_box > div{margin-bottom:10px;}
	.login_forms_box > .box2 {margin-bottom: 15px;}
}
@media(max-width:393px){
	.login_title h3 {font-size: 30px;}
	.box1 input { height: 26px; font-size: 12px;}
	.box1 input::-input-placeholder{font-size:12px;}
	.box1 input::-moz-input-placeholder{font-size:12px;}
	.box1 input::-ms-input-placeholder{font-size:12px;;}
	.box1 input::-webkit-input-placeholder{font-size:12px;}
	.box2 button {height: 30px;font-size: 12px;border-radius: 5px;}
	.box3 a {font-size: 12px;}
	.login_forms_box > .box2 {margin-bottom: 10px;}
	.chk_id {margin-bottom: 15px !important;}
	.chk_id label > span {width: 15px; height: 15px;}
	.chk_id label > span:after{margin-left:-3px;margin-top:-7px;width:5px;height:10px;}
	.chk_id label{padding-left: 15px;}
	.chk_id label p {font-size: 12px;}
	
}
@media (max-width:340px){
	.box1 input{padding:0 12px;}
	.box1 input::-input-placeholder{font-size:13px;color:#ccc;}
	.box1 input::-moz-input-placeholder{font-size:13px;color:#ccc;}
	.box1 input::-ms-input-placeholder{font-size:13px;color:#ccc;}
	.box1 input::-webkit-input-placeholder{font-size:13px;color:#ccc;}
	/*.box3{display:block;}
	.box3 > p:first-child{margin-bottom:0;}*/
}