body { max-width: 520px; min-width:320px; margin: 0 auto; padding: 0; font-size: 14px; }
.no-spinners { -moz-appearance:textfield; }
.no-spinners::-webkit-outer-spin-button,
.no-spinners::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.container { padding: 0; }
/******************************************************************************************************************************************************************
    로그인 화면
******************************************************************************************************************************************************************/
#content1 { margin: 0 auto; width: 80%; text-align: center; padding: 150px 0; }
#content1 .logo { margin: 0 0 50px 0; }

#content1 .login_box { width:100%; }
#content1 .login_box .login_form {  }
#content1 .login_box .login_form .form-control { margin-bottom: 3px; }
#content1 .login_box .login_form #login_btn { width:100%; background-color: #003366; }

/******************************************************************************************************************************************************************
    메인(index) 화면
******************************************************************************************************************************************************************/
#content2 { margin: 0 auto; width: 100%; text-align: center; }
#content2 .logo { margin: 100px 0 150px 0; }
#content2 .logo img { width: 225px; }
/*
#content2 .menu_box { margin: 0 auto; display: flex; width:100%; text-align: center; background-position: center center; background-image: url("../img/main_btn.jpg"); background-repeat: no-repeat; }
#content2 .menu_box a { display: block; height: 150px; width: 150px; margin: 0 auto; }
#content2 .menu_box a:nth-child(1) { margin-right: 10px; }
#content2 .menu_box a:nth-child(2) { margin-left: 10px;  }
*/
#content2 .menu_box { clear: both; width: 320px; height: 150px; margin: 0 auto; }
#content2 .menu_box a { float: left; display: block; width: 150px; height: 150px; background: #f2f2f2; border-radius: 5px; border: solid 1px #999; text-decoration: none; }
#content2 .menu_box a.a1 { margin: 0 20px 0 0; }
#content2 .menu_box a .icon { display: block; width: 100%; height: 110px; line-height: 110px; font-size: 60px; color: #26b295; text-align: center; }
#content2 .menu_box a .text { display: block; width: 100%; height: 30px; line-height: 30px; font-size: 20px; text-align: center; color: #000; font-weight: bold; }
#content2 .logout { display: block; width: 320px; margin: 0 auto; height: 40px; line-height: 40px; color: #fff; background: #26b295; font-size: 16px; font-weight: bold; border-radius: 5px; text-decoration: none; }

/******************************************************************************************************************************************************************
    배차정보 리스트 화면
******************************************************************************************************************************************************************/
#contents { margin: 0 auto; width: 100%; text-align: center; }
#contents .top_menu { background-color: #26b295; text-align: left; padding: 0px; width: 100%; height: 50px; }
#contents .top_menu span.home_icon img { height: 30px; width: 30px; margin: 10px 0 0 10px; vertical-align: unset; float: left; }
#contents .top_menu span.top_text { color: white; font-size: 25px;  margin:10px 0 0 10px; float: left; display: block; height: 30px; line-height: 30px; }
#contents .top_menu span.back_icon { cursor: pointer; color: white; margin:10px 10px 0 0; float: right; display: block; height: 30px; line-height: 30px; }

#contents .search_box { text-align: center; width: 100%; padding: 10px; border-bottom: 1px solid #dfdfdf; height: 50px; }
#contents .search_box span { width: 20%; float: left; display: inline-block; height: 30px; line-height: 30px; font-weight: bold; }
#contents .search_box .input_date { height: 30px; width: 50%; vertical-align: middle; float: left; margin: 0 10px 0 10px; }
#contents .search_box .btn { width: 15%; float: left; background-color: #26b295; border: none; }

#contents .dispatch_list_box { width: 100%; padding: 10px; }
#contents .dispatch_list_box a { color: black; display: block; clear: both; border: 1px solid #b1b9bb; margin-bottom: 10px; height: 150px; }
#contents .dispatch_list_box .list_box {  }
#contents .dispatch_list_box .list_box .header_box { height: 30px; width: 100%; background-color: #f4f6f7; border-bottom: 1px solid #b1b9bb; padding: 4px; }
#contents .dispatch_list_box .list_box .header_box span { float: left; display: block; }
#contents .dispatch_list_box .list_box .header_box img { float: right; }
#contents .dispatch_list_box .list_box ul { list-style: none; margin: 0; padding: 0; height: 120px; }
#contents .dispatch_list_box .list_box ul li { float: left; width: 33%; padding: 0 10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#contents .dispatch_list_box .list_box ul li span { display: block; clear: both; height: 30px; margin: 7px 0; }
#contents .dispatch_list_box .list_box ul li span.title {  border-bottom: 2px solid #26b295; color: #26b295; font-weight: bolder; width: 60px; margin: 7px auto; }

/******************************************************************************************************************************************************************
    배차정보 디테일 화면
******************************************************************************************************************************************************************/
#contents .dispatch_detail_box { width: 100%; padding: 10px 0px; }
#contents .dispatch_detail_box table { border: 1px solid #b1b9bb; font-size: 12px; }
#contents .dispatch_detail_box table thead { border: 1px solid #b1b9bb; }
#contents .dispatch_detail_box table thead tr { border: 1px solid #b1b9bb; }
#contents .dispatch_detail_box table thead tr td { height: 30px; width: 100%; background-color: #f4f6f7; border-bottom: 1px solid #b1b9bb; padding: 4px; vertical-align: middle; border-top: 1px solid #b1b9bb; }
#contents .dispatch_detail_box table thead tr td span:nth-child(1) { float: left; display: block; }
#contents .dispatch_detail_box table thead tr td span:nth-child(2) { float: right; }
#contents .dispatch_detail_box table tbody tr td { vertical-align: middle; padding: 7px 0px; border-bottom: 1px solid #b1b9bb; }
#contents .dispatch_detail_box table tbody tr td:nth-child(1) span { font-weight: bolder; border: 1px solid #b1b9bb; padding: 1px; width: 90%; display: inline-block; border-radius: 5px; }
#contents .dispatch_detail_box table tbody tr td:nth-child(2) { text-align: left; }
#contents .dispatch_detail_box .button_box { width: 100%; }
#contents .dispatch_detail_box .button_box a { width: 22%; background-color: #26b295; border-color: #26b295; padding: 7px 3px; margin: 0 3px; }

/******************************************************************************************************************************************************************
    배차정보 내용입력 화면
******************************************************************************************************************************************************************/
#contents .dispatch_edit_box { width: 100%; padding: 10px 0px; }
#contents .dispatch_edit_box form { width: 100%; text-align: center; }
#contents .dispatch_edit_box form table { border: 1px solid #b1b9bb; font-size: 12px; }
#contents .dispatch_edit_box form table thead { border: 1px solid #b1b9bb; }
#contents .dispatch_edit_box form table thead tr { border: 1px solid #b1b9bb; }
#contents .dispatch_edit_box form table thead tr td { height: 30px; width: 100%; background-color: #f4f6f7; border-bottom: 1px solid #b1b9bb; padding: 4px; vertical-align: middle; border-top: 1px solid #b1b9bb; }
#contents .dispatch_edit_box form table thead tr td span:nth-child(1) { float: left; display: block; }
#contents .dispatch_edit_box form table thead tr td span:nth-child(2) { float: right; }
#contents .dispatch_edit_box form table tbody tr td { vertical-align: middle; padding: 7px 0px; border-bottom: 1px solid #b1b9bb; }
#contents .dispatch_edit_box form table tbody tr td:nth-child(1) span { font-weight: bolder; border: 1px solid #b1b9bb; padding: 1px; width: 90%; display: inline-block; border-radius: 5px; }
#contents .dispatch_edit_box form table tbody tr td:nth-child(2) { text-align: left; }
#contents .dispatch_edit_box form table tbody tr td input { vertical-align: middle; height: 20px; width: 20%; }
#contents .dispatch_edit_box form table tbody tr td input[type="file"] { height: 20px; width: 75%; }
#contents .dispatch_edit_box form input[type="submit"] { width: 22%;  background-color: #26b295; border-color: #26b295; }


/******************************************************************************************************************************************************************
    공지사항 리스트 화면
******************************************************************************************************************************************************************/
#contents .board_list_box { width: 100%; }
#contents .board_list_box table { font-weight: bolder; }
#contents .board_list_box table tbody tr { cursor: pointer; }
#contents .board_list_box table tbody tr td { vertical-align: middle; border-bottom: 1px solid #f4f6f7; padding: 10px; }
#contents .board_list_box table tbody tr td:nth-child(1) { text-align: left; }
#contents .board_list_box table tbody tr td:nth-child(1) img { margin-right: 10px; }
#contents .board_list_box table tbody tr td:nth-child(2) { text-align: right; }

/******************************************************************************************************************************************************************
    공지사항 디테일 화면
******************************************************************************************************************************************************************/
#contents .board_detail_box { width: 100%; margin: 0 auto; }
#contents .board_detail_box .detail_box { width: 100%; margin: 0 auto; padding: 10px; }
#contents .board_detail_box .detail_box .board_subject { width: 100%; border: 1px solid #b1b9bb; padding: 5px; height: 40px; }
#contents .board_detail_box .detail_box .board_subject span:nth-child(1) { float: left; line-height: 30px; }
#contents .board_detail_box .detail_box .board_subject span:nth-child(2) { float: right; line-height: 30px; }
#contents .board_detail_box .detail_box .board_text { height: 300px; width: 100%; border: 1px solid #b1b9bb; padding: 5px; text-align: left; }
#contents .board_detail_box .detail_box .board_file { width: 100%; border: 1px solid #b1b9bb; padding: 5px; text-align: left; }
#contents .board_detail_box .detail_box .board_file ul { margin: 0; padding: 0; list-style: none; }
#contents .board_detail_box .detail_box .button { margin: 10px; }
#contents .board_detail_box .detail_box .button a { background-color: #26b295; border-color: #26b295; }

/******************************************************************************************************************************************************************
    배차 버튼 색상 바꾸기
******************************************************************************************************************************************************************/

#contents .dispatch_detail_box .button_box #driveStart.active { background-color:#1a1a1a; }
#contents .dispatch_detail_box .button_box #drivePause.active { background-color:#1a1a1a; }
#contents .dispatch_detail_box .button_box #driveFinish.active { background-color:#1a1a1a; }

#contents .dispatch_detail_box table .gps { background-color: #F0FFE3; }