@charset "UTF-8";
/*-------------------------------------------------------------------
	파일정의 : login
	작성날짜 : 2020-06-18 김하연
	참고사항 : 이 파일은 로그인에 대한 스타일을 정의한다.
	분류순서 : 기본정책 > 유틸리티 > 사용자정의(컬러, 폰트, 보더, 간격 등)
	속성순서 : 표시 > 위치 > 넘침/흐름 > 크기/간격 > 박스모양 > 폰트/정렬 > 기타
-------------------------------------------------------------------*/

.login_form {width: 500px; text-align: center;} /*Dev:210707 ROBOT-195*/ /*Dev:210716 ROBOT-195-3*/
.login_form form{margin-top: 60px;}
.login_form .logo_area .img_box{display: inline-block; width: 195px; height: 82px; background: url(../img/lgcloi_l.png)center no-repeat;}
.login_form .input_area.checkbox{margin-top: 16px;}
.login_form .input_area.checkbox .input_box label{font-size: 18px;}
.login_form .btn_area.login{padding-bottom: 30px;}
.login_form .btn_area.option{padding: 0;}
.login_form .btn_area.option li:first-child{float: left;}
.login_form .btn_area.option li:last-child{float: right;}
.login_form .btn_area.option li a{display: block; font-size: 16px; color: #333;}
.login_form .input_area.has_btn .btn{padding: 0;}/*Dev: 220103 ROBOT-1*/
.login .error_txt{display: none; margin: 14px 0 0;}
.login .error_txt p{font-size: 18px; color: #0f8385;}
#container.login{overflow: hidden; min-height: 0; /*height: 100%; Dev:210716 삭제*/}
#contents.login{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; background: #fff;}/*Dev:210707 ROBOT-195*/ /*Dev:211119 bg white 추가 ROBOT-353*/
#contents.login .page_body{margin: -40px 0 0; padding: 100px 0; height: auto!important;/*Dev:210715 height 추가 ROBOT-195-2*/} /*Dev:210707 ROBOT-195*/
#modal_logout .input_area{margin-top: 15px;}
#modal_logout .input_box{display: inline-block;}
#modal_logout .input_box label{color: rgba(255,255,255,.6);}
#modal_logout .modal_body{padding-bottom: 30px;}

#modal_join .input_area>label{min-width: 125px; width: 125px; box-sizing: border-box;}
#modal_join form{margin-bottom: 0;}
#modal_join .authority_wrap{padding-top: 25px; border-top: 1px solid #52545e;}
.input_area.horizontal.inline .input_wrap.birth .input_box{width: auto;}
#modal_join .error_txt{margin: 8px 0 0;}
#modal_join .error_txt p{padding-left: 125px; font-size: 14px; color: #0f8385;}
#modal_join .input_area.error+.error_txt{display: block;}
#modal_join .input_area.error .input_box, #modal_join .input_area.error .input_box.focus{border-color: #a50034!important;}

#modal_join_agree .all_agree_wrap {padding-bottom: 10px; border-bottom: 1px solid #dcdcdc;}
#modal_join_agree .modal_cnt .input_group>div {margin-top: 10px;}
/*--Dev: info_area 추가 220627 ROBOT-519 --*/
#modal_join_agree .modal_cnt .input_group > .info_area {
    padding-top: 20px; border-top: 1px solid #000; color:#333;}
#modal_join_agree .modal_cnt .input_group > .info_area > p  {
    padding-left: 10px;}

#modal_join_agree .modal_cnt .input_area label {font-weight: 500; color: #333;}
#modal_join_agree .input_area.checkbox .input_box input:before {top: 8px;}
#modal_join_agree .modal_cnt .input_area button {position: absolute; right: 0; top: 0; margin-top: 9px; line-height: 22px; color: #94949d; border-bottom: 1px solid #94949d;}/*Dev:220103 ROBOT-1*/
#modal_terms .terms_contents{color: #333; background: #fff; border: 1px solid #dcdcdc;}
#modal_join_agree .modal_cnt .input_area:last-child label{cursor: default;}

.reason_info {padding-bottom: 20px; margin-bottom: 9px; border-bottom: 1px solid rgba(255,255,255,.2);}
.reason_info .reason_part {margin-bottom: 15px;}
.modal_body .reason_info .txt {font-size: 15px;}
.reason_wrap .input_area.horizontal label {width: 300px;}
.modal .reason_wrap .input_area .input_box {display: table-cell;}
#modal_password_edit .input_area>label {width: 160px;}
#modal_chk_password_withid .input_area.horizontal label {width: 140px;}
#change_manager_modal .modal_body {text-align: left;}
#change_manager_modal .modal_body .txt{margin-top: 30px;}
#change_manager_modal .modal_cnt{margin-top: 10px;}

/*Dev s:210615 ROBOT-148*/
#modal_join_agree .input_area.checkbox .input_box input:before,
#modal_join_agree .input_area.checkbox .input_box input:checked:after{
    top: 10px;
}
#modal_join_agree .input_area.checkbox .input_box>p{
    display: inline-block;
    vertical-align: top; /*Dev:220103 ROBOT-1*/
    height: auto; /*Dev:220103 ROBOT-1*/
    line-height: 1.4; /*Dev:220103 ROBOT-1*/
    font-size: 16px;
    color: #333;
    font-weight: 500;
}

form.login .input_area.has_btn.v2 .input_box{ /*Dev: 210811 robot-278*/
    padding-right: 0;
    padding-left: 20px;
}

.modal_wrap#modal_join .input_area.error .input_box.focus{/*Dev:210817 robot-301*/
    border-color: #a50034!important;
}
/*Dev s: 220103 ROBOT-1*/
#modal_join_agree .input_area.checkbox .input_box{
    height: auto;
}
#modal_join_agree .input_area.checkbox .input_box>p{
    position: relative;
    max-width: 85%;
}
#modal_join_agree .input_area.checkbox .input_box>p>a{
    display: inline-block;
    line-height: 1.4;
    vertical-align: top;
    padding-top: 9px;
}
/*Dev e: 220103 ROBOT-1*/

.all_agree_wrap .input_box>p{ /*Dev:220112 ROBOT-381*/
    padding-top: 9px;
}

@media screen and (max-width:500px) {
	/* login */
    /* .login_form{width: 90%; margin-top: -250px;}Dev:210707 삭제 ROBOT-195*/
	.login_form .input_area.checkbox .input_box label{font-size: 13px;}
	.login_form .input_area.checkbox{margin-top: 5px;}
	.login_form .btn_area.login{padding: 10px 0 25px;}
	.login_form .btn_area.option li a{font-size: 12px;}
	.login_form .logo_area .img_box{display: inline-block; width: 112px; height: 49px; background-size: contain;}
	.login .error_txt p{font-size: 13px;}
	#modal_denied .modal_body{padding: 10px 0 30px;}
	#modal_denied .grid.grid_10{margin: 0 -8px;}
	#modal_denied .grid.grid_10>.col{padding: 0 8px;}
	#modal_not_approved .ttl br:last-child{display: none;}

    #modal_join .grid.grid_7{margin-left: -5px; margin-right: -5px;}
    #modal_join .grid.grid_7 > .col{padding: 0 5px;}
    #modal_join .input_area.horizontal .input_wrap.birth{display: block;}
    #modal_join .modal_body{padding-bottom: 30px;}
    #modal_join .authority_wrap{padding-top: 15px;}
    #modal_join .error_txt{margin: 6px 0 0;}
    #modal_join .error_txt p{padding-left: 0; font-size: 12px;}
    #modal_join_agree .modal_cnt .input_area button {font-size: 12px;}

    /*Dev s:210615 ROBOT-148*/
    #modal_join_agree .input_area.checkbox .input_box input:before,
    #modal_join_agree .input_area.checkbox .input_box input:checked:after{
        top: 7px;
    }
    #modal_join_agree .input_area.checkbox .input_box>p{
        height: 30px;
        line-height: 30px;
        font-size: 13px;
    }
    /*Dev e:210615 ROBOT-148*/
    #contents.login{min-height: calc(100vh - 80px);}/* Dev:210707 ROBOT-195*/
    #contents.login .page_body{margin: 0; padding: 0;} /* Dev:210707 ROBOT-195*/

    form.login .input_area.has_btn.v2 .input_box{ /*Dev: 210811 robot-278*/
        padding-left: 12px;
    }
}

@media screen and (max-width:500px) {/* Dev:210707 ROBOT-195*/
    .login_form{
      width: 100%; /* dev: ROBOT-249 */
      max-width: 90%;
      margin: 0 auto;
    }
}



/*  모바일 가로모드  */
@media screen and (max-width: 820px) and (max-height: 500px) and (orientation: landscape) {
    #container.login {overflow: auto}
    #contents.login {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
    #contents.login .page_body {height: auto; margin: 50px 0 100px;}
    /*.login_form {position: static; margin-top: 0;} Dev:210707 삭제 ROBOT-195*/


}