html, body { padding:0; margin:0; box-sizing: border-box; width:100vw; height:100vh; font-family:'noto sans kr'; color:#2b2b2b; overflow: hidden;}

/* html, body { width:100vw; height:100vh; margin:0; padding:0; } */
form { width:100%; }

#wrapper { display:flex; justify-content:center; align-items:center; width:100%; max-width:100vw; height:inherit; min-height:calc(93vh); background:rgba(54,53,62, 1.0) url(../../../img/login_bg.png) no-repeat center / cover; padding:0; }
#section_login { position:relative; width:350px; height:400px; padding:36px 20px; border-radius:17px; background:#ffffff; }
#section_login h1 { font-size:30px; line-height:36px; color:#797979; font-weight:500; text-align:center; margin:0; margin-bottom:30px; text-shadow: 3px 3px 4px;}

#section_login .login_content { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }
#section_login .login_content label { font-size:16px; color:#797979; line-height:24px; margin-bottom:5px; font-weight:500; width:100%; }
#section_login .login_content label.lb_pw { margin-top:15px; }
#section_login .login_content input { width:100%; padding:0 15px; }
#section_login .login_content input:focus { border:1px solid #5142CE; }
#section_login .login_content button { margin:25px 5px 0; width:145px; }
#section_login .login_content #login_chk { background:#5142CE; color:#ffffff; }
#section_login .login_content #register { background:#E8E9EB; color:#797979; }
#section_login .login_content .login_failure { font-size:13px; color:red; text-align:center; padding:15px; }
/* #section_login .logout { position:absolute; right:15px; bottom:15px; }
#section_login .logout a { font-size: 12px; background: rgba(81, 66, 206, 0.9); color:#ffffff; padding:2px 10px; border-radius: 5px;} */


/** 로그인 **/
#wrapper1 { display:flex; justify-content:center; align-items:center; width:100%; max-width:100vw; height:inherit; min-height:calc(93vh); 
    /*background:#3861b3; */
    background: linear-gradient(180deg, #223d82 0%, #4367b1 50%, #223d82 100%);
    padding:0; }
     /*background-image: linear-gradient(125deg, #3861b3 0%, navy 100%);*/
#section_login1 { position:relative; display:inline-flex; justify-content: center; height:420px; padding:0; }    /*height:483px;*/
#section_login1 > div { width:429px; background:#ffffff; }
#section_login1 .login_wrap { padding:40px 30px 0; }
#section_login1 .login_wrap h1 { display:none; font-size:28px; color:#35405c; font-weight:700; text-align:center; margin:0; margin-bottom:40px; letter-spacing: 10px;}
#section_login1 .login_wrap form { height:auto;}
#section_login1 .logo_wrap { background:url(/img/hosp_logo.jpg) no-repeat center / cover; height:50px; margin-bottom: 30px;}
#section_login1 .logo_text { font-size:32px; text-align:center; height:50px; margin-bottom:30px; font-weight:500; letter-spacing:5px; background:#3861b3; color:white; }
/* #section_login1 .img_wrap { background:url(/img/login_bg1.jpg) no-repeat 60% center / cover; }
#section_login1 .img_wrap { background:url(/img/login_bg2.jpg) no-repeat 30% center / cover; } */
#section_login1 .img_wrap .item { height:420px; }
#section_login1 .img_wrap .bg1 { background:url(/img/login_bg3.jpg) no-repeat 30% center / cover; }
#section_login1 .img_wrap .bg2 { background:url(/img/login_bg4.jpg) no-repeat 20% center / cover; }
#section_login1 .img_wrap .bg3 { background:url(/img/login_bg5.jpg) no-repeat 30% center / cover; }
#section_login1 .img_wrap .bg4 { background:url(/img/login_bg6.jpg) no-repeat 70% center / cover; }

#section_login1 .login_content { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }
#section_login1 .login_content label { font-size:16px; color:#797979; line-height:24px; margin-bottom:5px; font-weight:500; width:100%; }
#section_login1 .login_content label i { margin-right:5px; }
#section_login1 .login_content label.lb_pw { margin-top:15px; }
#section_login1 .login_content input { width:100%; padding:0 15px; }
#section_login1 .login_content input:focus { border:1px solid #35405c; }
#section_login1 .login_content button { margin:0; width:100%; border-radius: 6px;}

#section_login1 .login_content .btn_wrap { display:flex; justify-content: center; align-items: center; width:100%; gap:10px; margin-top: 40px;}
#section_login1 .login_content #login_chk { flex:1; background:#35405c; color:#ffffff; }
#section_login1 .login_content #register { flex:1; background:#E8E9EB; color:#797979; }
#section_login1 .login_content #hls_down { flex:1; background:#6554AF; color:#ffffff; }
#section_login1 .login_content .login_failure { font-size:13px; color:red; text-align:center; padding:15px; }

input {
    height:40px;
    outline: none;
    border: 1px solid #E8E9EB;
    border-radius: 7px;
    color: #80838F;
    margin-bottom: 0 !important;
}

/* 등록하기 */
#section_regist { position:relative; display:flex; justify-content: center; align-items: center; flex-direction: column; width:500px; padding:0px; border-radius:17px; background: #fff;}    /*height:483px;*/
#section_regist > div,
#section_regist > form { width:100%; }
#section_regist.login_wrap h1 { font-size:24px; color:#3b2250; font-weight:600; }
#section_regist.login_wrap .header_wrap { width:100%; background: rgba(81, 66, 206, 0.3); padding:20px 0 15px;}
#section_regist.login_wrap .footer_wrap { width:100%; background: rgba(81, 66, 206, 0.3); padding:15px 0;}
#section_regist.login_wrap .content_wrap { padding:20px; }
#section_regist.login_wrap .content_wrap label { font-size:16px; color:#797979; line-height:24px; margin-bottom:5px; font-weight:500; width:100%; }
#section_regist.login_wrap .content_wrap input,
#section_regist.login_wrap .content_wrap select { width:100%; padding:0 15px; height:35px; line-height: 35px; margin-bottom:10px  !important; background: var(--main-color1); }
#section_regist.login_wrap .footer_wrap button { margin:25px 5px 0; width:80px; height:35px; line-height: 35px; margin:0 10px; }
#section_regist.login_wrap .explain { font-size:13px; color:red; opacity: 0.8; text-align: center;}



@media screen and (max-width:1024px) {
	#section_login1 { height:auto; padding: 0 30px; }
    #section_login1 .login_wrap { padding: 40px 30px 40px;}
}

@media screen and (max-width:768px) {
	.img_wrap { display:none; }
    
    #section_login1 > div { width:100%; }
}