@charset "UTF-8";

body{
	margin: 0;
    padding: 0;
    height:100vh;
    resize: none;
    line-height: 1;    
    background-position: 50;
    background-repeat: no-repeat;
    font-family: Noto Sans KR;
    letter-spacing: -1px;
}

input[type="button"]{
    cursor:pointer;
}

.login_header{
	background: #fff;
    box-shadow: 0 0 5px 5px rgb(0 0 0 / 10%);
    display: block;
    height: 60px;
   	margin: 0 auto;
    position: relative;
    width: 100%;
    z-index: 2;
}

.hd{
	display: flex;
    height: inherit;
    justify-content: space-between;
    margin: 0 30px;
    padding: 0;
    resize: none;
    background-position: 50%;
    background-repeat: no-repeat;
    font-family: Noto Sans KR;
    letter-spacing: -1px;
}

.hd_left{
	align-items: center;
    display: flex;
    justify-content: center;
    text-decoration: none;
    color: #0860A8;
    font-size: 26px;
    font-weight: 600;
}

.wrap{
	display: flex;
    /*height: 100%;
    margin-bottom: 50px;*/
    height:calc(100vh - 60px - 150px);
    max-height: 80vh;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 1;
}

.content_box_1{
   	width: 60%;
    height:100%;
    overflow: hidden;
}

.content_box_2{
    width: 40%;
    display:flex;    
	flex-direction:column;
	align-items:center;
	justify-content:center;
}

.content_box_2_contbox{
    width: 60%;
    margin:0 auto;
    display:flex;    
	flex-direction:column;
	align-items:center;
	justify-content:center;
}

.content_box_2_contbox *{
    width:100%;
}

.content_box_2_contbox > div{
    margin:10px 0;
}

.content_box_2 > .deco_line{
    width:100%;
    border: 1px dashed #ddd;
    margin:50px 0;
}

.form_title{
	font-size:30px;
	text-align:center;
	padding: 10px;
	color:#196BAE;
	font-weight:600;
	height: 10%;
}

.form_input{
	display: flex;
	flex-direction: row;
	/*height: 10%;*/
    height:auto;
}

.form_login{
	/*height: 20%;*/
    height:auto;
}

.form_link{
	/*margin:100px;*/
	/*height: 20%;*/
    height:auto;
    display:flex;
    flex-direction: column;
}

.login_footer{
    display: flex;
    /*align-items: center;*/
    background: #fff;
    height: 150px;
    justify-content: flex-end;
    left: 0;
    line-height: 40px;
    position: fixed;
    width: 100%;
    z-index: 2;
}

.ft{
	color: #888;
    letter-spacing: 0;
    width: 100%;
    height:auto;
    display: inline-block;
}

.ft_top{
	height:40px;
    background: #EEEEEE;
}

.ft_top_menu{
	height:100%;
    width:calc(100% - 40px);
    padding:0 20px;
}

.ft_top_menu_input{
    border:0;
    color:#666666;
    font-size:12px;
    font-weight:700;
    padding:5px;
}

.ft_bottom{
	width:100%;
    height:calc(100% - 40px);
    display:flex;
    align-items: center;
}

.ft_bottom_text{
    color:#aaaaaa;
    font-size:12px;
    line-height:2em;
    width:calc(100% - 40px);
    padding:20px;
    height:auto;
}





@media(min-width:1801px){
    
    .content_box_2_contbox{
        width: 40%;
    }
    
    
}

@media(max-width:1800px){
    
    .content_box_2_contbox{
        width: 60%;
    }
    
    
}


@media(max-width:1280px){
    
    .content_box_1,
    .content_box_2{
        width:50%;
    }
    
    .content_box_2_contbox{
        width: 80%;
    }
    
}


@media(max-width:880px){
    
    body{
        height:100%;
    }
    
    .wrap{
        justify-content: center;
        flex-direction: column;
        height: calc(100vh - 60px - 200px);
        
    }
    
    .content_box_1{
        display:none;
    }
    
    .content_box_2{
        width:100%;
        margin:30px auto;
    }
    
    .content_box_2_contbox{
        width:80%;
    }
    
    /*.form_link{
        flex-direction: row;
    }*/
    
    .login_footer{
        height: auto;
        /*position: relative;*/
    }