@charset "UTF-8";

/* COMMON AREA */
html,
body {
  height: 100%;
  font-size: 16px;
}
/* 섹션크기 세팅 */
.container {
  padding: 60px 40px 40px 40px;
}
.container.containerType2{padding:30px;}

.container.containerType3{padding:42px 30px 0px;}

.wrap {
  display: flex;
  min-width: 1680px;
  height: 860px; /* legacy browser */
  /* height: calc(100% - 130px); 선에 높이가 짧아져서 지움*/
}
.wrap.fullWrap{height:calc(100vh - 70px);}
.op_section {
  width: 430px;
  border-right: 1px solid #ecf0f2;
  position: relative;
  background: #fff;
  height: 100%;
}
.op_section.side_section{
  display:none;
  width:530px;
}
.op_section.side_section.on{display:block;}
/* 섹션 닫기버튼 */
.close,.scClose {
  display: block;
  background-color: #fff;
  border-radius: 0 0 0 10px;
  position: absolute;
  width:23px;
  right:-23px;
  top:50%;
  transform:translateY(-50%);
  text-align: center;
  z-index:5;
  height:48px;
  padding-top:14px;
  border-radius:0px 6px 6px 0px;
}
.table_title {
  margin-top:20px;
  font-size: 18px;
  font-family:"malgunB";
}
.table_title + h4{
  font-size:16px;
  font-family:'malgunB';
  color:#4b5057;
}
.table_caption {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin: 10px 0;
  font-family:"malgunB";
}
.search {
  width: 100%;
  position: relative;
}
.car_num_search {
  width: 100%;
  height:44px;
  border: 1px solid #2f2f2f;
  border-radius: 4px;
  padding-left:15px;
  font-size:14px;
}
.car_num_search::placeholder {
  color: #c3c3c3;
}
.search img {
  position: absolute;
  right: 14px;
  top: 10px;
}
/* 탭영역 */
.tab_area ul.tab_btn {
  display: flex;
  border-top: 14px solid #e9ecef;
  margin-bottom: 15px;
  border-bottom:1px solid #ecf0f2;
}
.tab_area ul.tab_btn li {
  width: 50%;
}
.tab_area ul.tab_btn li a {
  display: block;
  font-size:15px;
  font-family:'malgunB';
  color:#4b5057;
  padding: 14px 0;
  text-align: center;
}
.tab_area ul.tab_btn li a.on {
  font-family:'malgunB';
  color: #246ced;
  box-shadow:inset 0px -2px 0px #246ced;
}
.tab_area .tab_cont {
  position: relative;
}
.tab_area .tab_cont .tab_cont_1 {
  display: none;
}
.tab_area .tab_cont .tab_cont_1.on {
  display: block;
}
.table_caption_date {
  margin: 10px 0;
}
.table_caption_date .pin_btn{
  display:inline-block;
  padding:10px 20px;
}
.table_caption_date input[type="text"] {
  padding: 10px 20px;
  border: 1px solid #c3c3c3;
  border-radius: 4px;
  margin-right: 6px;
}
/* .table_caption_date input[type="button"] {
  padding: 9px 20px;
  border: 1px solid #62a0ff;
  border-radius: 4px;
  background: transparent;
  color: #62a0ff;
  cursor: pointer;
} */
.sub_dis {
  font-size: 14px;
  margin-top: 5px;
}
/* 공통테이블표 영역 */
.fixed_thead_container {
  position: relative;
}
.fixed_thead_container .fixed_thead {
  width: 460px;
  /* 원하는 tbody 높이 */
  overflow-x: hidden;
  overflow-y: auto;
  margin-top: 20px;
}
table {
  text-align: center;
  width: 100%;
}
table span {
  display: block;
}
table thead.visible_thead {
  /*position: absolute;*/
  top: 0;
  background: #fff;
}
table thead.hidden_thead {
	visibility: collapse;
}
table thead tr {
  width: 100%;
}
table thead tr th,
table tbody tr td {
  vertical-align: middle;
}
table{
  border-top: 2px solid #000;
}
table tr th {
  border-bottom: 1px solid #cdd8da;
  height:50px;
  padding:0px;
  font-size:14px;
  color:#4b5057;
  font-family:"malgunB";
  background:rgba(36,108,237,0.04);
  box-sizing:border-box;
  vertical-align: middle;
} 
table thead tr th {
  font-size:15px;
}



table tbody tr td {
  border-bottom: 1px solid #ccc;
  color:#4b5057;
  font-size:15px;
  height:52px;
}
table tbody tr td a.send{
  display:block;
  width:80px;
  height:32px;
  line-height:32px;
  background:#246ced;
  color:#fff;
  font-size:15px;
  font-family:"malgunB";
  border-radius:4px;
  margin:0 auto;
}
/* table tbody tr:hover td { */
/*     background: #dfecff; */
/* } hover를 공통으로 걸면 표가 위가 아닌 왼쪽이 타이틀일때 오류감 */
table tbody tr.abnormal td {
  background: rgba(255, 67, 58,0.04);
  cursor: pointer;
}
table tbody tr.selected td {
  background: rgba(36, 108, 237,0.1);
  cursor: pointer;
}

.table_common {
  text-align: center;
  width: 100%;
  height: 200px;
}
.table_common span {
  display: block;
}
.table_common thead.visible_thead {
  /*position: absolute;*/
  top: 0;
  background: #fff;
}
.table_common thead.hidden_thead {
  visibility: collapse;
}
.table_common thead tr {
  width: 100%;
}
.table_common tbody{
	height: 300px;
  overflow-x: hidden;
  overflow-y: auto;
}
	
.table_common thead tr th,
.table_common tbody tr td {
  padding: 14px 10px;
  vertical-align: middle;
  overflow-x: hidden;
  overflow-y: auto;
}
.table_common thead tr th {
  border-top: 1px solid #181818;
  border-bottom: 1px solid #181818;
}
.table_common tbody tr td {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
/* table tbody tr:hover td {
    background: #dfecff;
} hover를 공통으로 걸면 표가 위가 아닌 왼쪽이 타이틀일때 오류감 */
.table_common  tbody tr.abnormal:hover td {
  background: #f6d4d5;
  cursor: pointer;
}

/* 버튼 색상별 */
button.btn_type_blue {
  padding: 9px 10px;
  border: 1px solid #62a0ff;
  border-radius: 4px;
  color: #62a0ff;
  cursor: pointer;
}
button.btn_type_blue:hover {
  background: #62a0ff;
  color: white;
}
button.btn_type_white {
  padding: 9px 10px;
  border: 1px solid #62a0ff;
  border-radius: 4px;
  background: #fff;
  color: #62a0ff;
  cursor: pointer;
}
button.btn_type_white:hover {
  background-color: #62a0ff;
  color: white;
}

button.btn_lodin {
  width: 100%;
  height: 50px;
  padding: 9px 10px;
  border: 1px solid #6495ed;
  background: #6495ed;
  border-radius: 4px;
  color: #fff;
  opacity:0.5;
}

/* 지도 차량정보 */
.info .car_info .car_img {
  text-align: center;
  position: relative;
  margin-left:30px;
}

.info .car_info .car_img img{
  width: 117.5px;
  height: 86.5px;
}

.carinfo_container{padding:40px 30px 0px;}
.info .car_info .car_img:after {
  content: "운행중";
  display: block;
  width: 90px;
  height: 30px;
  line-height: 30px;
  border-radius: 16px;
  font-size: 15px;
  text-align: center;
  font-family:'malgunB';
  color: #fff;
  margin:7px auto 0px;
  background: #246ced;
}
.info .car_info .car_img.type2::after{
  position:absolute;
  top:0px;
  right:-125px;
}
.car_info .car_img.over:after {
  content: "운행종료";
  background: #3f3f3f;
}
 #op_map .info table {
   border-top:1px solid #cdd8da;
  text-align: left;
}
#op_map .info table tr th {
  vertical-align: middle;
  border: 0;
}
#op_map .info table tr td {
  border: 0;
}
#op_map .info table tr:hover td {
  background: transparent;
}
/* 팝업 */
.pop_up {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
}
.pop_up_02 {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
}
.pop_bg {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
}
.pop_bg_02 {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
}

/* HEADER AREA */
#header {
  height: 70px;
}
#header .header_wrap {
  width: 100%;
  height: inherit;
  position: fixed;
  z-index: 900;
  background: #2f2f2f;
}
#header .header_wrap .header_container {
  display: flex;
  min-width: 1680px;
  height: 100%;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
}
#header .logo img {
  display:none;
}
#header .logo a{
  margin-left:21.5px;
  display:block;
  width:142px;
  height:37px;
  background:url('../images/ta_img_logo_sub.png')no-repeat;
  font-size:0px;
}
#header .nav {
}
#header .nav > ul {
  display: flex;
}

#header .nav > ul > li > a {
  display: block;
  position:relative;
  /* margin-right: 8rem; */
  /* margin: 0 auto; */
  font-size: 15px;
}
#header .nav > ul > li {
  width:190px;
  text-align:center;
  font-family:"malgunB";
  color:#fff;
  position: relative;
  line-height:70px;
  box-sizing:border-box;
}
#header .nav > ul > li > a::after {
  content:"";
  position:absolute; 
  bottom:0px;
  display:block;
  width:0%;
  height:6px;
  border-bottom:6px solid #246ced;
  transition-duration:0.2s;
  
}
#header .nav > ul > li:not(:first-child) > a::before{
  content:"";
  position:absolute;
  left:0px;
  display:block;
  width:1px;
  height:16px;
  background:#000;
}
#header .nav > ul > li:hover > a::after {
  width:100%;
  
}
#header .nav > ul > li:hover > ul {
  display:block;
  cursor: pointer;
}
#header .nav > ul > li > ul {
  display:none;
  position: absolute;
  top: 70px;
  z-index: 900;
  transition-duration: 0.3s;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 1px 1px 0 rgba(183, 183, 183, 0.5);
  border:1px solid #cdd8da;
}
#header .nav > ul > li > ul > li {
  border-bottom: 1px solid #fff;
}
#header .nav > ul > li > ul > li a {
  display: block;
  width: 190px;
  background: #fff;
  text-align: center;
  color:#4b5057;
  font-family:"malgunB";
  line-height:58px;
  border-bottom:1px solid #cdd8da;
}
#header .nav > ul > li > ul > li:last-child a{
  border-bottom:0px;
}

#header .nav > ul > li > ul > li a:hover {
  cursor: pointer;
  color:#246ced;
}
#header .my_menu {
  position:relative;
}
#header .my_menu::before{
  content:"";
  position:absolute;
  left:0px;
  top:-20px;
  display:block;
  width:1px;
  height:70px;
  background:#565656;
}
#header .my_menu ul {
  display: flex;
}
#header .my_menu img{
  width:36px;
  height:36px;
  border-radius:50%;
  margin-right:38px;
  border:1px solid #636363;
}
#header .my_menu ul li a {
  display: flex;
  align-items: center;  
  font-size: 13px;
  height: 32px;
}
#header .my_menu ul li a.img_icon {
  display: block;
  width: 32px;
  height: 32px;
  position: relative;
}
#header .my_menu ul li a.img_icon:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
#header .my_menu ul li a.img_icon.alarm:before {
  background: center / contain no-repeat url(../images/alarm.png);
}
#header .my_menu ul li a .my_txt {
  display: block;
  text-align: center;
  margin: 0 4px;
  height: 32px;
  line-height: 32px;
  font-size: 13px;
  color:#dfdfdf;
 
}
#header .my_menu ul li a .tri_btn {
  display: block;
  /* border-top: 14px solid #fff; */
  /* border-left: 10px solid transparent; */
  border-right: 10px solid transparent;
  width: 12px;
  height: 12px;
  margin-right: 20px;
  border: 3px solid #fff;
  border-top: 0px;
  border-left: 0px;
  transform: rotate(45deg);
  margin-top:-5px;
  margin-left:7px;
}

/* FMS_PAGE_1 */
/* 차량 운행 현황 페이지 */

/* OP_STATUS AREA */
#op_status {
  z-index: 10;
}
#op_status .fixed_thead {
  height: 322px;
}
#op_status .fixed_thead_container td {
  padding: 18px 10px;
}
#op_status .over {
  color: #3f3f3f;
  position: relative;
}
.over_pink:hover td {
  background-color: #f6d4d5;
  cursor: pointer;
}
.blue:hover td {
  background-color: #dfecff;
  cursor: pointer;
}
.invasion {
  opacity: 0;
  width: 72px;
  height: 24px;
  line-height: 24px;
  background-color: #dd6f6f;
  font-size: 13px;
  color: white;
  position: absolute;
  left: -170%;
  top: -20%;
}
.over_pink:hover .invasion {
  opacity: 100%;
}

/* OP_MAP AREA */
#op_map {
  width: calc(100vw - 430px);
}
#op_map form {
  position:relative;
  display: flex;
  height: 100%;
}
#op_map .side_section {
  left: 0;
}
#op_map .side_section .fixed_thead {
  height: 270px;
}
#op_map .side_section .info .car_info {
  position:relative;
  display: flex;
  align-items: center;
}
#op_map .side_section .info .car_info .car_img {
  margin-right: 43.5px;
}
#op_map .side_section .info .car_info .car_num {
  display: flex;
  width: 70%;
}
#op_map .side_section .info .car_info ul{
  position:absolute; top:0px;
  right:46.5px;
}
#op_map .side_section .info .car_info ul.sliceMenu{
  left:180px;
  top:45px;
}
#op_map .side_section .info .car_info ul.sliceMenu li{
  margin-bottom:8px;
  width:130px;
}
#op_map .side_section .info .car_info ul.sliceMenu + ul{width:470px; display:flex; top:111px; left:4px; line-height:18px;}
#op_map .side_section .info .car_info ul.sliceMenu + ul li{display:block; text-align:center;}
#op_map .side_section .info .car_info ul.sliceMenu + ul li:first-child{border-right:1px solid #cdd8da;}
#op_map .side_section .info .car_info ul.sliceMenu + ul li b{
  display:block;
  margin-bottom:5px;
}

#op_map .side_section .info .car_info ul li{display:flex;
  width:233px;
justify-content: space-between;
font-size:18px;
margin-bottom:13px;
font-family:'malgunB';
color:#4b5057;}

#op_map .side_section .info .car_info ul li b{
  font-size:15px; 
  font-family:'malgun';
}
#op_map .side_section .info .car_info ul li button.fullBtn{
  font-size:15px;
  font-family:'malgunB';
  color:#246ced;
  border:1px solid #246ced;
  border-radius:4px;
  height:40px;
  width:100% !important;
}
#op_map .side_section .fuel{display:flex;
border-top:1px solid #cdd8da; margin-top:30px;
padding-top:16.5px;
color:#4b5057;
margin-bottom:21.5px;
font-size:15px;
line-height:18px;}
#op_map .side_section .fuel li p{
  font-size:18px;
  font-family:'malgunB';
}
#op_map .side_section .fuel li{width:33.3333%; text-align:center;
  border-right:1px solid #cdd8da;}
  #op_map .side_section .fuel li:last-child{border-right:0px;}



#op_map .side_section .info .car_info .car_num ul li:nth-child(2n-1) {
  margin-bottom: 10px;
  font-size: 0.8rem;
  color: #7f7f7f;
}
#op_map .side_section .info .current_info {
  margin: 28px 0 50px;
}

.current_info table th{
  position:relative;

  background:none;
color:#4b5057;
font-size:15px;
height:auto;
text-align:left;
padding-left:55px;}
.current_info table th::before{content:"";
  position:absolute;
  top:50%;
  left:19px;
  transform:translateY(-50%);
  display:inline-block;
width:24px;
height:24px;
margin-right:12px;
vertical-align: middle;
}
#op_map .current_info table tbody tr:not(:last-child) td,#op_map .current_info table tbody tr:not(:last-child) th{
  border-bottom:1px solid #cdd8da;
}
.current_info table td{
  padding:19.5px 0px 19.5px;
  font-size:15px;
  color:#4b5057;
  height:auto;
}
.current_info table tr:nth-of-type(1) th::before{background:url('../images/ta_icon_s_01.png')no-repeat;}
.current_info table tr:nth-of-type(2) th::before{background:url('../images/ta_icon_s_02.png')no-repeat;}
.current_info table tr:nth-of-type(3) th::before{background:url('../images/ta_icon_s_03.png')no-repeat;}


#op_map .fixed_thead_container td {
  font-size: 0.9em;
  line-height: 20px;
  letter-spacing: -1px;
}
/* .table_caption_date button[type="submit"] img {
  width: 20px;
  margin-right: 8px;
} */

#op_map form .side_section.on + #op_map_area{

  width: calc(100% - 530px);
}
#op_map #op_map_area {
  width: 100%;
  height: 100%;
  position: relative;
}
#op_map #op_map_area .location_info {
  display: flex;
  width: auto;
  box-shadow: 0 3px 4px 0 rgba(149, 149, 149, 0.5);
  border: solid 1px #ecf0f2;
  border-radius: 4px;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 100;
  background: #fff;
}
#op_map #op_map_area .location_info li a {
  display: block;
  width:70px;
  text-align:center;
  padding: 8px 0px 10px;
  border-right: 1px solid #f7f7f7;
  font-size: 13px;
  font-family:"malgunB";
  text-align: center;
  letter-spacing: -1px;
  background: transparent;
}
#op_map #op_map_area .location_info li:last-child a{
  border-right:0px;
}
#op_map #op_map_area .location_info li a img {
  display: block;
  height: 60%;
  margin: 0 auto 8px;
}
/* 지도좌표영역 */
.location_pin {
  width: 124px;
  height:63px;
  border-radius: 8px;
  position: absolute;
  font-size: 13px;
  font-family:'malgunB';
  text-align: center;
  color: #fff;
  line-height:48px;


}
.location_pin.pin_green {
  top:20%;
  left:40%;
  background:url('../images/ta_pos_green.png')no-repeat;
}
.location_pin.pin_red {
  background:url('../images/ta_pos_red.png')no-repeat;
  top: 30%;
  left: 40%;
}
.location_pin.pin_black {
  background:url('../images/ta_pos_black.png')no-repeat;
  top: 60%;
  left: 30%;
}
/* send to car 팝업 */
.pop_sendexpend .expend {
  width: 520px;
  height: 750px;
  border-radius: 10px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
}
.pop_sendexpend .expend h4 {
  font-size: 20px;
  font-family:"malgunB";
  border-bottom: 1px solid #ccc;
  padding: 20px 40px;
}
.pop_sendexpend .expend .expend_cont {
  padding: 40px;
  text-align: left;
}
.pop_sendexpend .expend .expend_cont > div {
  text-align: center;
  /* margin: 40px 0; */
}
.pop_sendexpend .expend .expend_cont .input_data input {
  border: 0;
  border-bottom: 1px solid #3c3c3c;
  margin-left: 10px;
}
.pop_sendexpend .expend .expend_cont .input_data input.distance {
  width: 100px;
}
.pop_sendexpend .expend .expend_cont .input_data input.note {
  width: 300px;
}
.pop_sendexpend .expend .expend_cont .input_data label:nth-child(2) {
  margin-left: 30px;
}
.pop_sendexpend .expend .expend_cont .expend_btn {
  position: absolute;
  top: 90%;
  left: 50%;
  transform: translateX(-50%);
}
.expend_btn input {
  padding: 8px 30px;
  border: 0;
  margin: 0 10px;
  background: #ccc;
}

.expend_btn input[type="button"]:hover {
  color: #fff;
  background: #62a0ff;
  cursor: pointer;
}
.pop_sendexpend .desti_wrap {
  width: 450px;
  height: 353px;
  border: 1px solid black;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.pop_sendexpend .desti_wrap .destination {
  height: 230px;
  width: 390px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid black;
}
.pop_sendexpend .desti_wrap .destination .desti_up {
  display: flex;
  justify-content: space-between;
  width: 300px;
  height: 40px;
  margin-top: 20px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.pop_sendexpend .desti_wrap .destination .search {
  width: 50px;
  height: 30px;
  margin-left: 10px;
  border-radius: 3px;
  background-color: #dfecff;
  color: #61a1ff;
}
.carnum_wrap {
  display: flex;
  justify-content: space-between;
  margin:15px 0px;
}
.car_num {
  font-size:15px;
  line-height:40px;
}
.recipient {
  display: flex;
  line-height:40px;
}
.recipient select{margin-right:0px;}
.recipient p {
  margin-right: 10px;

}
.tit_massage input{
  width: 100%;
  height:40px;
  border-radius:4px;
  border:1px solid #cdd8da;
  font-size:15px;
  font-family:'malgun';
  color:#4b5057;
  padding-left:15px;
  box-sizing:border-box;
}
.tit_massage textarea {
  width: 100%;
  height:100px;
  font-size:15px;
  border-radius:4px;
  border:1px solid #cdd8da;
  font-size:15px;
  font-family:'malgun';
  color:#4b5057;
  padding:15px;
  margin-top: 10px;
  box-sizing:border-box;
  resize:none;
}
/* sned 팝업 표 */
.pop_sendexpend .tb_sm {
  clear: both;
  width: 346px;
  margin: 70px auto 0 auto;
}
.pop_sendexpend .st_02_sm {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.pop_sendexpend .tb_sm th {
  height: 38px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  vertical-align: middle;
  font-size: 14px;
}
.pop_sendexpend .tb_sm td {
  height: 38px;
  border-bottom: 1px solid #ccc;
  vertical-align: middle;
  cursor: pointer;
  font-size: 14px;
  text-align: left;
}
.pop_sendexpend .tb_sm tr:not(:first-child):hover {
  background-color: #dfecff;
  cursor: pointer;
}

/* FMS_PAGE_2 */
/* 운행이력 페이지 */

/* OP_HISTORY */
#op_history {
  z-index: 10;
}
#op_history .fixed_thead {
  height: 280px;
}
.cal_month_all {
  display: none;
}
.calendar {
  padding-bottom: 50px;
}
.calendar h3{
  font-size:24px;
  font-family:'malgunB';
  margin-top:0px;
}
.calendar h3 span{display:block;
font-family:'helve';
text-align:center;
font-size:15px;
margin-top:12px;}
.calendar .table_title {
  position: relative;
}
.calendar .month_title {
  display: flex;
  position: absolute;
  width:50%;
  justify-content: space-between;;
  top: 43px;
  left:50%;
  transform:translateX(-50%);
}
.month_title a {
  display:block;
  width:9px;
  height:15px;
  font-size:0px;
}
/* .month_title a:nth-of-type(1){ */
  /* background:url('../images/arrow_left_2.png')no-repeat;
}
.month_title a:nth-of-type(2){
  background:url('../images/arrow_right_2.png')no-repeat;
} */
.month_title a{opacity:0.7; transition-duration:0.2s;}
.month_title a:hover{opacity:1;}
.month_title a:nth-of-type(1){
  background:url('../images/arrow_left_2_s.png')no-repeat;
}
.month_title a:nth-of-type(2){
  background:url('../images/arrow_right_2_s.png')no-repeat;
}
.calendar .btn_type_white {
  font-size:14px;
  border:1px solid #246ced;
  color:#246ced;
  padding:5px 7px;
}
.calendar .btn_type_white:hover {
  background: #246ced;
  color:#fff;
}
.cal_month {
  margin: 20px 0;
}
.cal_month table{border-top:0px;}
.cal_month table tr th,
.cal_month table tr td {
  padding: 0;
  border: 0;
  font-family:"malgunB";
  background:none;
}
.cal_month table tr th{
  font-size:13px;
}
.cal_month table tr td{
  font-size:15px;
}
.cal_month table tr th {
  height: 30px;
  vertical-align: middle;
}
.cal_month table tr td {
  height: 50px;
  padding-top: 10px;
  padding-bottom: 6px;
  vertical-align: top;
  position: relative;
  color:#181818;
}
.cal_month table tr:hover td {
  background: transparent;
}
.cal_month table tr th:first-child,
.cal_month table tr td:first-child {
  color: #f65c55;
}

.cal_month table tr td span {
  display: block;
  width: 37px;
  height: 19px;
  line-height:19px;
  font-size: 12px;
  margin:1.9px auto 0px;
  border-radius:2px;
}
.cal_month table tr td span.num {
  position:relative;
  color: #fff;
  background: #3d93f5;
}
.cal_month table tr td.today{color:#f65c55;}
.cal_month table tr td span.today {
  color: #f65c55;
  font-size:12px;
  font-family:'malgunB';
  background: #fff;
}
.cal_month table tr td span.choice {
  background: #3d93f5;
}
.cal_month table tr td.day_none{font-size:0px;}
.cal_month table tr td.today:after {
  content: "";
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 3px;
  border: 1px solid #f65c55;
  position: absolute;
  top: 0px;
  left: 0px;
}

.cal_month table tr td.choice:after {  content: "";
  display: block;
  width: 52px;
  height: 52px;
  border-radius: 3px;
  background:rgba(246, 175, 70,0.1);
  position: absolute;
  top: 0px;
  left: 0px;
}
.cal_month table tr td.choice span{
background:#f6af46;
}

/* 달력팝업 */
.cal_month_all .fixed_thead_container_pop {
  width:1551px;
  /* border-radius: 10px; */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  padding:35px;
  border-radius:9px;
}
.fixed_thead_container_pop .fixed_thead {
  width: 100%;
  height: 400px;
  overflow-x: hidden;
  overflow-y: auto;
}
.fixed_thead_container_pop th{
  background:none;
}
.fixed_thead_container_pop table{
  margin-top:14px;
}
.cal_month_all .fixed_thead_container_pop .fixed_thead table {
  width: 100%;
}
.fixed_thead_container_pop .table_title{padding-left:22px;
font-size:18px;
font-family:'malgunB';
margin-right:30px;
display:inline-block;}

.fixed_thead_container_pop .month_title{
  display:inline-block;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  margin-top:5px;
}
.fixed_thead_container_pop .month_title span{
  font-size:22px;
  position:relative;
  top:13px;
  font-family:'malgunB';
  color:#181818;
  margin:0px 33px;
}
.fixed_thead_container_pop .month_title a{
  display:inline-block;
}
.cal_month_all .fixed_thead_container_pop .fixed_thead thead {
  width: 100%;
  z-index: 100;
}
.cal_month_all .search {
  display:inline-block;
  width:300px;
}
.cal_month_all table thead tr th.pop_title {
  border:0px;
  padding: 20px 40px;
  text-align: left;
  
}
.cal_month_all table thead tr th.pop_month {
  padding: 20px 40px;
  font-size: 20px;
  font-family:"malgunB";
  position: relative;
}
.pop_close {
  font-size: 0px;
  position: absolute;
  top: 43px;
  display:block;
  width:21px;
  height:21px;
  background:url('../images/xx.png')no-repeat;
  right: 42px;
}
.pop_close_02 {
  font-size: 30px;
  position: absolute;
  top: 18px;
  right: 40px;
}
.cal_month_all table thead tr th{

}
.cal_month_all table tbody tr td {
  padding: 0;
  border: 1px solid #cdd8da;
}
.cal_month_all table tbody tr td input[type="checkbox"] + label{
  margin:0px 10px 0px 18px;
}
.cal_month_all table thead tr th:first-child{
  border-right:1px solid #cdd8da;
  font-family:'malgun';
  color:#181818;
}
.cal_month_all table thead tr th {
  padding: 17px 0;
  font-size: 15px;
  font-family:"malgunB";
}
.cal_month_all table thead tr th span {
  font-size:13px;
  color: #4b5057;
  margin-bottom:3px;
  font-family:'malgun';
}
/* .cal_month_all table thead tr th:nth-child(7n),
.cal_month_all table thead tr th:nth-child(7n) span {
  color: #dd6f6f;
} */
.cal_month_all table thead tr th.holiday{position:relative;}
.cal_month_all table thead tr th.holiday span,.cal_month_all table thead tr th.holiday p{z-index:3;
position:relative;
color:#fff;}
.cal_month_all table thead tr th.holiday::before{
  content:"";
  position:absolute;
  width:39px;
  height:50px;
  border-radius:5px;
  left:50%;
  transform:translateX(-50%);
  top:8px;
  background:#ff433a;
}
.cal_month_all table tbody tr td {
  height: 40px;
  font-size: 12px;
  position: relative;
}
.cal_month_all table tbody tr:hover td {
  background: transparent;
}
.cal_month_all tr .pop_car_num{border-top:0;
border-left:0px;}
.cal_month_all tr td:last-child{
  border-right:0px;
}
.cal_month_all .pop_car_num {
  display: flex;
  align-items: center;
  border-right: 0;
  font-family:"malgun";
  font-size: 15px;
  color:#181818;
}
.cal_month_all .pop_car_num input[type="checkbox"] {
  margin-right: 6px;
}
.cal_month_all .pop_car_num span.circle {
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 50%;
  margin-left: 5px;
  font-size: 12px;
  color: #fff;
}
.cal_month_all .pop_car_num span.circle.cr_blue {
  background: #3d93f5;
}
.cal_month_all .pop_car_num span.circle.cr_navy {
  background: #42d7bb;
}
.cal_month_all .pop_car_num span.circle.cr_purple {
  background: #9e67f7;
}
.cal_month_all .pop_car_num span.circle.cr_green {
  background: #53e169;
}
.cal_month_all .pop_car_num span.circle.cr_yellow {
  background: #f6af46;
}
.schedule_check {
  width: 42.53px;
  height: 28px;
  text-align: left;
  position: absolute;
  top: 5px;
  border-radius:16px;
  color:#fff;
}
.schedule_check:hover{
  height:auto;
  padding:10px 0px;
  border:1px solid rgba(205, 216, 218,0.5);
  z-index:5;
}
.schedule_check ul{
  display:table;
  height:28px;
  float:left;
  width:42.53px;
}
.schedule_check ul li{
  display:table-cell;
  text-align:center;;
  font-size:9px;
  vertical-align: middle;
}
.schedule_check.check_blue {
  background: #3d93f5;
}
.schedule_check.check_purple {
  background: #9e67f7;
}
.schedule_check.check_navy {
  background: #42d7bb;
}
.schedule_check.check_yellow {
  background: #f6af46;
}
.schedule_check.check_green {
  background: #53e169;
}
#op_history .search{width:300px}
#op_history .search + div{height:44px; line-height:50px;
color:#4b5057;
font-size:14px;
font-family:'malgunB';}

/* OP_MAP_HISTORY */
#op_map .side_section .info .car_info .car_img {
  margin-right: 30px;
}
#op_map .side_section .tab_cont {
  text-align: right;
}
#op_map .side_section .tab_cont .tab_cont_1:nth-child(1) .fixed_thead {
  height: 360px;
}
#op_map .side_section .info .car_info table .car_img {
  font-weight: normal;
}
#op_map .side_section .info .car_info table tr:nth-child(5) {
  border-top: 1px dashed #3f3f3f;
}
#op_map .side_section .info .car_info table tr th {
  padding: 14px 12px 6px;
  color: #3f3f3f;
  font-size: 14px;
}
#op_map .side_section .info .car_info table tr td {
  padding: 6px 12px 14px;
  font-family:"malgunB";
}
#op_map .graph_area {
  width: 100%;
  height: 100px;
  margin-top: 30px;
  background: #ccc;
  text-align: center;
  font-size: 20px;
}

/* FMS_PAGE_3 */
/* 차량관리 페이지 */
#op_management {
  z-index: 10;
}
#op_map #op_map_management .car_info {
  margin-bottom: 30px;
}
#op_map #op_map_management .fixed_thead {
  height: 400px;
}
#op_map #op_map_management .car_info th {
  padding: 12px 0px 4px;
  color: #3f3f3f;
  font-size: 14px;
}
#op_map #op_map_management .car_info td {
  padding: 4px 0px 12px;
  font-family:"malgunB";
}
#op_map #op_map_management .car_info button {
  display: block;
  width: 80%;
}
#op_map #op_map_management .tab_cont_1:nth-child(2) {
  text-align: right;
}
.nd_check {
  color: #ff433a;
}
#op_map #op_train {
  width: 770px;
  height: 100%;
  margin: 30px auto 0 auto;
}
#op_train .container > div {
  margin-bottom: 20px;
}
#op_train .train_title .txt {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
#op_train .train_title .check_result .check_el .circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin: 0 auto 10px;
  background: #62a0ff;
}
.train_result{display:flex;
  width:770px;
justify-content: space-between;}
.train_result h1{
  font-size:22px;
  font-family:'malgunB';
}
.train_result ul{display:flex;
  width:472px;
  justify-content: space-between;;
}
.train_result ul li{width:143px;
  cursor:pointer;
  padding-top:13px;
text-align:center;
height:80px;
border-radius:4px;
border:1px solid #ff433a;
background:rgba(255, 67, 58, 0.04);
font-size:15px;
}
.train_result ul li.good{
  border:1px solid #246ced;
  background:rgba(36, 108, 237, 0.04);
}
.train_result ul li.good::before{content:"";
display:block;
width:30px;
height:31px;
background:url('../images/ch.png')no-repeat; margin:0 auto 6.5px;}

.train_result ul li.good p{display:none;font-size:0px;}
.train_result ul li p{
  font-size:30px;
  font-family:'malgunB';
  margin-bottom:6.5px;
  color:#ff433a;
}
.train_result time{
  font-size:18px;
  color:#333;
  opacity:0.5;
  text-align:right;
  padding-top:8px;
}
#op_train .train_img {
  width: 100%;
   height: 607px;
  margin-top: 50px;
  text-align: center;
  position: relative;
}
.train_img .left{
  position:absolute;
  font-family:'malgunB';
  font-size:15px;
  color:#4b5057;
  display:flex;
  left:90px;
}
.train_img .right{
  position:absolute;
  font-family:'malgunB';
  font-size:15px;
  color:#4b5057;
  display:flex;
  right:90px;
}
.train_img .right.dbWheel{
  right:-55px;
}
.train_img .left.dbWheel{
  left:-55px;
}
.train_img span.err,.train_img span.err strong{
  color:#ff433a;
}
.train_img .left::before{
  content:"";
  position:absolute;
  right:-85px;
  top:21px;
  display:block;
  width:80px;
  border-top:1px solid #9e67f7;
}
.train_img .left::after{
  content:"";
  display:block;
  position:absolute;
  right:-114px;
  top:6px;
  width:27px;
  height:27px;
  border:2px solid #9e67f7;
  background:rgba(158, 103, 247, 0.2);
  border-radius:50%;
}
.train_img .right::after{
  content:"";
  display:block;
  position:absolute;
  left:-114px;
  top:6px;
  width:27px;
  height:27px;
  border:2px solid #9e67f7;
  background:rgba(158, 103, 247, 0.2);
  border-radius:50%;
}
.train_img .left.err::after,.train_img .right.err::after{border:2px solid #ff433a;
  background:rgba(255, 67, 58, 0.2);}
.train_img .right::before{
  content:"";
  position:absolute;
  left:-85px;
  top:21px;
  display:block;
  width:80px;
  border-top:1px solid #9e67f7;
}
.train_img .err::before{
  border-top:1px solid #ff433a;
}
.train_img .left img{position:relative;}
.train_img .left span{text-align:right;}
.train_img .right span{text-align:left;}
.train_img .left span::after{content:""; display:block;
  position:absolute;
  right:-80px; top:19px;
width:5px;
height:5px;
background:#9e67f7;
border-radius:50%;}
.train_img .right span::after{content:""; display:block;
  position:absolute;
  left:-80px; top:19px;
width:5px;
height:5px;
background:#9e67f7;
border-radius:50%;}
.train_img .right.dbWheel span:nth-of-type(2)::after,.train_img .left.dbWheel span:nth-of-type(1)::after{display:none;}
.train_img .err span::after{
  background:#ff433a;
}
.train_img .left1,.train_img .right1{
  top:220px;
}
.train_img .left2,.train_img .right2{
  top:280px;
}
.train_img .left3,.train_img .right3{
  top:410px;
}
.train_img .left4,.train_img .right4{
  top:470px;
}
.train_img .left5,.train_img .right5{
  top:530px;
}
.train_img span{
  width:75px;
  position:relative;
}
.train_img strong{
  display:block;  
  font-size:22px;
  color:#9e67f7;
  font-family:'malgunB';
  line-height:26px;
}
.train_img strong i{
  font-size:18px;
  font-family:'malgun';
  margin-left:1.5px;
}
#op_train .train_img p img{margin:-4px 13px 0px;}
#op_train .train_img img{
  display:block;
  margin:0 auto;
}
#op_train .train_img .car_left_blue {
  position: absolute;
  width: 55px;
  height: 65px;
  top: 8%;
}
#op_train .train_img .car_left_blue .up_num {
  position: absolute;
  top: 20%;
  left: 85%;
}
#op_train .train_img .car_left_blue .down_num {
  position: absolute;
  top: 70%;
  left: 85%;
}
#op_train .train_img .car_right_blue {
  position: absolute;
  width: 55px;
  height: 65px;
  top: 8%;
  right: 5%;
}
#op_train .train_img .car_right_blue .up_num {
  position: absolute;
  top: 20%;
  right: 40%;
}
#op_train .train_img .car_right_blue .down_num {
  position: absolute;
  top: 70%;
  right: 40%;
}
#op_train .train_gage {
  display: flex;
  justify-content: space-between;
  margin-top: 28px;
}
#op_train .train_gage div{
  width:173px;
}
#op_train .train_gage h4 {
  display:flex;
  justify-content: space-between;
  font-size:15px;
  font-family:'malgunB';
}
#op_train .train_gage h4 i{
  font-size:22px;
  margin-right:1px;
}
#op_train .train_gage h4 .unit {
  font-size: 18px;
  margin-left: 6px;
}
#op_train .train_gage .gage_bar {
  width: 100%;
  height: 12px;
  border-radius: 9px;
  background: #e7eff1;
  margin-top: 8px;
}
#op_train .train_gage .gage_bar div{
  height:12px;
  background:#f53d40;
  border-radius:9px;
}
#op_train .train_gage .gage_tit {
  display: flex;
  align-items: center;
  margin-top: 8px;
  padding-bottom: 30px;
}
#op_train .train_gage .gage_tit .gage_icon {
  width: 24px;
  height: 24px;
  margin-right: 6px;
}
#op_train .train_gage .fuel .gage_tit .gage_icon {
  background: center / contain no-repeat url(../images/Fuel_quantity.png);
}
#op_train .train_gage .urea .gage_tit .gage_icon {
  background: center / contain no-repeat url(../images/urea.png);
}
#op_train .train_gage .battery .gage_tit .gage_icon {
  background: center / contain no-repeat url(../images/Voltage.png);
}
.pop_expend .expend {
  width: 800px;
  height: 280px;
  border-radius: 10px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
}
.pop_expend .expend h4 {
  font-size: 20px;
  font-family:"malgunB";
  border-bottom: 1px solid #ccc;
  padding: 20px 40px;
}
.pop_expend .expend .expend_cont {
  padding: 40px;
  text-align: left;
}
.pop_expend .expend .expend_cont > div {
  text-align: center;
  margin: 40px 0;
}
.pop_expend .expend .expend_cont .input_data input {
  border: 0;
  border-bottom: 1px solid #3c3c3c;
  margin-left: 10px;
}
.pop_expend .expend .expend_cont .input_data input.distance {
  width: 100px;
}
.pop_expend .expend .expend_cont .input_data input.note {
  width: 300px;
}
.pop_expend .expend .expend_cont .input_data label:nth-child(2) {
  margin-left: 30px;
}
.pop_expend .expend .expend_cont .expend_btn input {
  padding: 8px 30px;
  border: 0;
  margin: 0 10px;
  background: #ccc;
}
.pop_expend .expend .expend_cont .expend_btn input[type="submit"]:hover {
  color: #fff;
  background: #62a0ff;
  cursor: pointer;
}
.pop_expend .expend .expend_cont .expend_btn input[type="button"]:hover {
  color: #fff;
  background: #3f3f3f;
  cursor: pointer;
}


/* 환경설정 시작 */
.container_confi {
  width: 1050px;
  margin: 0 auto;
}
.flex-space .container_confi{
  margin:40px 70px 0px;
}
.detailInfo{
  padding-top:40px;
  border-left:1px solid #707070;
  position:relative;
  width:calc(100vw - 1270px);
  min-width:650px;
  padding:40px 70px 40px;
 
}
.detailInfo h1{font-size:22px;
font-family:"malgunB";
margin-bottom:40px;
color:#333;
padding-left:15px;
}
.detailInfo h1 input[type="button"]{
  
  display:inline-block; margin-left:236px;
  margin-top:0px;
}
.detailInfo h2{
  font-size:18px;
  color:#333;
  font-family:"malgunB";
  margin:40px 0px 20px 15px;
}
.detailInfo h2 input[type="button"]{
  display:inline-block; margin-left:10px;
  margin-top:0px;
}

.detailInfo table{width:100%;}
.container_confi .table_title {
  margin-top: 60px;
}
.container_confi table {
  margin-top: 30px;
  width: 100%;
  text-align: left;
}
.container_confi table.mt60{
  margin-top:60px;
}
#op_configuration .confi_useset table .title {
  padding-left: 50px;
  width: 200px;
  height: 50px;
  font-size: 16px;
  background-color: #dfecff;
}
#op_configuration .confi_useset table td {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

#op_configuration .confi_useset table tr td {
  padding: 5px 5px;
}
#op_configuration .confi_useset table tbody tr td {
  padding: 2px 2px;
}
.check_box {
  width: 15px;
  height: 15px;
}
#op_configuration .confi_useset .text_border {
  border: none;
  width: 70%;
  height: 30px;
  margin-left: 10px;
}
#op_configuration .confi_useset table input[type="button"] {
  width: 128px;
  height: 40px;
  border-radius: 5px;
  margin-left: 35px;
  background-color: #61a1ff;
  border: none;
  font-size: 17px;
  color: white;
  margin-right: 20px;
  cursor: pointer;
}
.btn_shape {
  padding: 5px 10px;
  background-color: #61a1ff;
  color: white;
  border-radius: 4px;
  margin: 0 20px;
  font-size: 13px;
}
.infor_btn {
  display: block;
  padding: 9px 10px;
  border-radius: 4px;
  border: 1px solid #61a1ff;
  background-color: white;
  color: #61a1ff;
  font-size: 16px;
  margin: 40px auto;
  cursor: pointer;
}
.infor_btn:hover {
  background-color: #61a1ff;
  color: white;
  cursor: pointer;
}
#op_configuration_02 {
  padding-top: 40px;
  padding-bottom: 100px;
}
#op_configuration_02.pb0{
  padding-bottom:0px;
}
.title:not(:first-child){margin-top: 80px;}
.btnTitle{display:flex; justify-content: space-between;}
.btnTitle + p {margin:20px 0px 10px 0px; float:right;}
.btnTitle + p input[type="text"]{height:40px; box-sizing:border-box; position:relative; top:-1px; margin-left:10px;}
.btnTitle + p input[type="button"]{
  display:inline-block; 
  margin-left:5px;
  margin-top:0px;
}
.table_title_02 {
  font-size: 22px;
  padding-left:20px;
  font-family:"malgunB";
}
.op_configuration_size tr {
  height: 50px;
  text-align: center;
  font-size: 16px;
}

.add_title {
  display: flex;
  height: 40px;
  justify-content: space-between;
  align-items: center;
}
#op_configuration_03 {
  padding-bottom: 60px;
}
.adddel_btn {
  display: flex;
}
.add_02 {
  display: block;
  padding: 9px 20px;
  border-radius: 4px;
  background-color: #61a1ff;
  border: none;
  color: white;
  cursor: pointer;
}
.adddel_btn .del {
  display: block;
  padding: 9px 20px;
  border-radius: 4px;
  background-color: #61a1ff;
  border: none;
  color: white;
  cursor: pointer;
}
.adddel_btn button:nth-child(1) {
  margin-right: 15px;
}
.pin_btn {
  display: block;
  padding: 10px 40px;
  border-radius: 4px;
  background-color: #246ced;
  color: #fff;
  margin-top: 30px;
  margin-left:auto;
  cursor: pointer;
  border:0;
  font-family:"malgun";
  font-size:15px;
}
.pin_btn.fr{
  float:right;
}
.flex-space{display:flex;
  margin-top:-40px;
justify-content: space-between;}
.pin_btn + table{
  margin-top:60px;
}
.save_02 {
  display: block;
  padding: 9px 20px;
  border-radius: 4px;
  border: 1px solid #61a1ff;
  background-color: white;
  color: #61a1ff;
  margin-top: 40px;
  float: right;
  cursor: pointer;
}

.add {
  display: block;
  padding: 9px 20px;
  border-radius: 4px;
  background-color: #61a1ff;
  border: none;
  color: white;
  cursor: pointer;
}
#op_configuration_04 {
  margin-top: 60px;
}
#op_configuration_05 {
  padding-top: 60px;
  padding-bottom: 100px;
}
.op_configuration_size_05 th:nth-child(1) {
  width: 10%;
}
.op_configuration_size_05 tr:nth-child(1) {
  width: 20%;
}
.op_configuration_size_05 tr {
  /* height: 70px; */
  padding: 5px 5px;
  text-align: center;
}
.op_configuration_size_05 tbody tr td {
  padding-left: 0;
  padding-right: 0;
}
.table_sep {
  display: flex;
  clear: both;
}
.table_sep table{
  margin-top:0px;
  display:inline-block;
}
.direct {
  margin-top: 90px;
}
.direction {
  display: block;
  width:70px;
  height:36px;
  box-sizing:border-box;
  border-radius: 4px;
  border: 1px solid #246ced;;
  cursor: pointer;
  margin: 5px 30px;
  font-size:0px;
  background:#fff;
}
.direction:nth-of-type(1){
  background:#fff url('../images/arrow_left.png')no-repeat 50% 50%;
}
.direction:nth-of-type(2){
  background:#fff url('../images/arrow_right.png')no-repeat 50% 50%;
}
#op_configuration_05 .adddel_btn p {
  margin-top: 12px;
  margin-right: 15px;
}
#op_configuration_05 .adddel_btn .callnumber {
  margin-right: 15px;
  border: 1px solid #c3c3c3;
  width: 200px;
  font-size: 17px;
}
.op_configuration_size_09 tr {
  /* height: 70px; */
  text-align: center;
}
.text_border_use {
  width: 150px;
  /*수정한 부분임 15->25*/
  height: 25px;
  border: 1px solid #c3c3c3;
  font-size: 17px;
  border-radius: 3px;
}
.fir_input {
  background: #ccc;
  border: none;
  margin-right: 10px;
}
.title + h5{margin-right:15px;}
.title + h5 + h5{float:right;}
.title + h5,.title + h5 + h5 {
  display: inline-block;
  margin-top: 20px;
  margin-bottom:20px;
  width:calc((100% - 160px)/2);
  padding-left:20px;
  font-family:"malgunB";
  font-size:18px;
}
.halfTable:first-child{
  margin-right:30px;
}
.halfTable{width:calc(50% - 15px);
  
}
.tblWrite.halfTable td input{width:80px;}

.select {
  width: 200px;
  height: 40px;
  border: 1px solid #c3c3c3;
  margin-right: 10px; 
  border-radius: 5px;
  padding: 0 10px;
}
h3 + .select{
  margin-bottom:15px;
}
.input {
  font-size: 15px;
}
.table_caption_date .cal_boxsize {
  height: 17px;
  font-size: 15px;
  background:url('../images/icon_calendar.png')no-repeat right 10px; 
  width:200px;
  box-sizing:border-box;
  height:40px;
}

.table_caption_date .cal_boxsize:focus{
  border:1px solid #246ced;
  outline:0;
}
.btn_type_blue_02 {
  margin-left: 5px;
  font-size: 15px;
}
.select_part {
  margin-top: 20px;
}
.select_part .pin_btn{margin-top:10px;}
.sub_btn {
  margin-left:auto;
  display: flex;
  justify-content: right;
}
.sub_btn.center{
  justify-content: center;
}
.sub_btn.center .pin_btn{
  width:auto;
  padding:10px;
}
.sub_btn input[type="button"]{
  display:block;
  margin-left:0px;
  width:90px;
  text-align:center;
  padding:10px 0px;
}
.sub_btn input[type="button"]:not(:last-child){
  margin-right:5px;
}

.submit {
  display: block;
  padding: 9px 20px;
  border-radius: 4px;
  border: 1px solid #61a1ff;
  background-color: white;
  color: #61a1ff;
  margin-top: 40px;
  text-align: center;
  font-size: 15px;
}
.submit:hover {
  background-color: #61a1ff;
  color: white;
  cursor: pointer;
}
.eTas_btn {
  margin-right: 20px;
}
.title_01 {
  width: 570px;
}
.title_02 {
  width: 330px;
}
z
/* 환경설정 팝업 */
.op_con .expend {
  width: 574px;
  height: auto;
  padding-bottom: 40px;
}
.pop_table {
  margin: 50px auto 0 auto;
  width: 470px;
}
.pop_table .left_tit {
  width: 160px;
  height: 50px;
  background-color: #dfecff;
  text-align: left;
  padding: 0 30px;
}
.right_cont input[type="text"] {
  width: 260px;
  height: 34px;
  border: none;
}
.right_cont textArea {
  width: 260px;
  height: 60px;
  border: none;
}
.right_cont input[type="password"] {
  width: 260px;
  height: 34px;
  border: none;
}
.pop_table tr {
  padding: 70px;
}
.op_btn {
  margin-top: 40px;
  text-align: center;
}
.op_pin_con .expend {
  width: 574px;
  height: 270px;
}
.right_cont textarea::placeholder {
  color: #ff6565;
  opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */
}
textarea::-webkit-input-placeholder {
  color: #ff6565;
}
textarea:-ms-input-placeholder {
  color: #ff6565;
}
textarea:-mos-input-placeholder {
  color: #ff6565;
}


.tblCls {
	overflow-y:auto;
}
.tblCls table {
    width: 100%;
    display:block;
}
.tblCls thead {
    display: inline-block;
    width: 100%;
    height: 40px;
}
.tblCls tbody {
    height: 200px;
    display: inline-block;
    width: 100%;
    overflow: auto;
}

.tblWrite thead th{height:50px;
width:auto;}
.tblWrite th:first-child{
  width:auto;
}
.tblWrite.halfTable input{width:200px;

  margin-left:30px;
  margin-right:20px;}
.tblWrite th.ac{
  text-align:center;
  border-right:0px;
  padding:0px;
}
.tblWrite th.brn{
  border-right:none;
}
.tblWrite th.plus,.tblWrite th.minus{
  position:relative;
  padding-left:65px;
}
.tblWrite th.minus::before{content:"";
  position:absolute;
  top:20px;
  left:30px;
display:inline-block;
width:18px;
height:18px;
border:1px solid #cdd8da; margin-right:15px;
background:url(../images/minus.png)no-repeat 3px 3px;
}
.tblWrite th.plus::before{content:"";
  
  position:absolute;
  top:20px;
  left:30px;
display:inline-block;
width:18px;
height:18px;
border:1px solid #cdd8da; margin-right:15px;
background:url(../images/plus.png)no-repeat 3px 3px;
}
.tblWrite th{
  text-align:left;
  padding-left:30px;  
  font-size:15px;
  font-family:"malgunB";
  border-right:1px solid #cdd8da;
}
.tblWrite th:last-child{
  border-right:0px;
}
.tblWrite.not td{height:52px;}
.tblWrite td.ac{text-align:center;}
.tblWrite td{
  text-align:left;
  padding-left:30px;
  font-size:15px;
  font-family:"malgun";
  color:#4b5057;
  height:60px;
}
.tblWrite td input.ar{
  text-align:right;
  margin-right:5px;
  margin-left:0px;
}
.tblWrite td input{
  width:250px;
  height:40px;
  border:1px solid #cdd8da;
  border-radius:4px;
  margin:10px 0px;
  padding:0px 11px;
  font-size:15px;
  box-sizing:border-box;
}

.tblWrite td input.slideInp{
  width:200px;  
  margin-right:11px;
}
.tblWrite td input::placeholder{
  color:#4b5057;
  opacity:0.5;
}
.tblWrite td button{
  padding:0px 20px;
  height:40px;
  color:#246ced;
  border-radius:4px;
  border:1px solid #246ced;
  font-size:15px;
  font-family:"malgun";
  margin-right:15px;
}
table input[type="checkbox"]{
  display:none;
}
table input[type="checkbox"] + label{
  display:block; width:18px; height:18px; 
  margin:0 auto;
border:1px solid #cdd8da;
border-radius:2px;}
table input[type="checkbox"]:checked + label{
  border:0px;
  background:url('../images/ta_img_check_on.png')no-repeat;
}

.popup{display:none;}
.popup.on{display:block; position:fixed; top:0px; left:0px; width:100vw; height:100vh; background:rgba(0,0,0,0.4); z-index:1000;}
.popupLayer{position:absolute; left:50%; top:50%; transform:translateX(-50%)translateY(-50%); width:670px; padding:35px; background:#fff;  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.23); border: solid 1px rgba(89, 127, 133, 0.3); border-radius:9px; box-sizing:border-box; max-height:95vh; overflow-y:auto;}
.popup.trbPop .popupLayer{height:600px;}
.popupLayer h3{font-size:18px; font-family:"malgunB"; margin-bottom:20px; margin-left:10px;}
.popup.trbPop .popupLayer h3{display: flex; justify-content: space-between; font-family:'malgun';}
.popup.trbPop .popupLayer h3 span b,.popup.trbPop .popupLayer h3 span i{font-family:'malgunB';}
.popup.trbPop .popupLayer h3 ul{display:flex;}
.popup.trbPop .popupLayer h3 ul li{width:10px; margin-left:15px;}
.popup.trbPop .popupLayer h3 ul li a{font-size:0px; display:block; width:10px; height:10px; transform:rotate(45deg); opacity:0.5; transition-duration:0.3s;}
.popup.trbPop .popupLayer h3 ul li a.next{border-right:2px solid #000; border-top:2px solid #000; }
.popup.trbPop .popupLayer h3 ul li a.prev{border-bottom:2px solid #000; border-left:2px solid #000; }
.popup.trbPop .popupLayer h3 ul li a:hover{opacity:1;}
.popup.trbPop .popupLayer strong{display:block; margin:20px 0px 10px 23px; font-size:15px; font-family:'malgunB';}
.popup.trbPop .popupLayer p{margin-left:23px;}
.popup.trbPop .popupLayer{display:none;}
.popup.trbPop .popupLayer.on{display:block;}  
.popupLayer h3:not(:first-child){margin-top:20px; color:#333;}
.popupLayer h3:not(:first-child) select{margin-left:174px; margin-right:0px;}
.popupLayer h3:not(:first-child) input[type="text"],.detailInfo h2 input[type="text"]{height:40px; border-radius:4px; border:1px solid #c3c3c3; height:40px; padding-left:10px; box-sizing:border-box; margin-left:70px;}
.detailInfo h2 input[type="text"]{margin-left:119px;}
.detailInfo h2 select{margin-left:222px; margin-right:0px;}
.popupLayer h3:not(:first-child) input[type="text"] + .pin_btn{display:inline-block; margin-top:10px; margin-left:10px;}
.popupLayer h3:not(:first-child) input[type="text"] + .pin_btn + table{margin-top:15px;}
.popupLayer h3 + p{margin:20px 0px 20px 10px; font-size:15px;}
.popupLayer .tblWrite input{max-width:220px;}
.popupLayer .tblWrite td{padding-left:30px;}
.popupLayer .tblWrite th,.popupLayer .tblWrite td{height:60px; line-height:60px;}
.popupLayer .pin_btn{margin-top:20px;}
.elPop h3 + p{line-height:19px; font-size:16px; text-align: center;}
.elPop ol{display:flex; justify-content: center;}
.elPop ol li{width:30%; text-align: center;}
.elPop ol li input{margin-right:5px;}
.popupLayer .pin_btn:first-child{
  background:#fff;


  color:#246ced;
  border:1px solid #246ced;
}
.detailInfo .popClose {
  background:#fff;
  color:#246ced;
  border:1px solid #246ced;
}

.ui-datepicker{
  border-radius:4px;
  border:1px solid #246ced !important;
}
.ui-datepicker-calendar{width:161px !important;
border-top:0px;}
.ui-datepicker thead{display:none;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{
  border:0px;
  background:none;
  width:25px;
  height:23px;
  text-align:center;
  font-size:12px;
  box-sizing:border-box;
  padding:0px;
  font-family:"malgun";
}
.popup .del{
  display:block;
  font-size:0px;
  width:13px; height:13px;
  background:url('../images/x.png')no-repeat;
}
.popup .del:hover{
  background:url('../images/x_hover.png')no-repeat;
}
.ui-datepicker td{width:20px; height:20px;
  line-height:20px;
box-sizing:border-box;
padding:0px;}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{
  background:#246ced;
  border-radius:3px;
}
.ui-datepicker{width:200px; padding:12px; margin-top:6px;}
.ui-datepicker-year{display:none;}
.ui-datepicker-title{font-size:16px;}
.ui-widget-header{background:none; border:0px; height:20px;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-prev span{background:url('../images/cal_arrow_left.png')no-repeat;}
.ui-datepicker .ui-datepicker-next span, .ui-datepicker .ui-datepicker-next span{background:url('../images/cal_arrow_right.png')no-repeat;}
.ui-datepicker-next-hover,.ui-datepicker-prev-hover{background:none !important; border:none !important; cursor:pointer;}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{margin-left:0px; width:7px; height:12px;}
.ui-datepicker .ui-datepicker-prev span{left:0px;}
.ui-datepicker .ui-datepicker-next span{right:0px; left:inherit;}

.ui-datepicker .ui-datepicker-next{right:1px; top:-2px;}
.ui-datepicker .ui-datepicker-prev{left:1px; top:-2px;}
.ui-datepicker-month{position:relative; top:-7.5px;}
.ui-datepicker .ui-datepicker-title{margin:0px auto;}
.ui-datepicker table{margin-top:7px;}

.tb_fms{margin-top:17px;}

.scrTbl{border-collapse:collapse; width:100%;}
.scrTbl thead{float:left; width:369px;}
.scrTbl tbody{overflow-y:auto; overflow-x:hidden; float:left; width:369px; height:265px;}
.scrTbl.type6 tbody,.scrTbl.type1 tbody{height:650px;}
.scrTbl.type7 tbody{height:485px;}
.scrTbl tr{display:table; width:369px;}
.scrTbl td:nth-of-type(1),.scrTbl td:nth-of-type(3),.scrTbl th:nth-of-type(1),.scrTbl th:nth-of-type(3){width:20%;}
.scrTbl td:nth-of-type(2),.scrTbl td:nth-of-type(4),.scrTbl th:nth-of-type(2),.scrTbl th:nth-of-type(4){width:30%;}
.scrTbl.type2 th:nth-of-type(1),.scrTbl.type2 td:nth-of-type(1){width:10%;}
.scrTbl.type2 th:nth-of-type(3),.scrTbl.type2 td:nth-of-type(3){width:30%}
.scrTbl.type2 td:nth-of-type(2),.scrTbl.type2 td:nth-of-type(4),.scrTbl.type2 th:nth-of-type(2),.scrTbl.type2 th:nth-of-type(4){width:30%;}

.scrTbl.type3 tr,.scrTbl.type3 tbody,.scrTbl.type3 thead{width:469px;}
.scrTbl.type3 th:nth-of-type(1),.scrTbl.type3 td:nth-of-type(1){width:32.5px;}
.scrTbl.type3 th:nth-of-type(2),.scrTbl.type3 td:nth-of-type(2){width:38px;}
.scrTbl.type3 th:nth-of-type(3),.scrTbl.type3 td:nth-of-type(3){width:300px;}
.scrTbl.type3 th:nth-of-type(4),.scrTbl.type3 td:nth-of-type(4){width:95px;}


.scrTbl.type4 th:nth-of-type(1),.scrTbl.type4 td:nth-of-type(1){width:10%;}
.scrTbl.type4 th:nth-of-type(2),.scrTbl.type4 td:nth-of-type(2){width:17%}
.scrTbl.type4 th:nth-of-type(3),.scrTbl.type4 td:nth-of-type(3){width:19%}
.scrTbl.type4 th:nth-of-type(4),.scrTbl.type4 td:nth-of-type(4){width:21%}
.scrTbl.type4 th:nth-of-type(4),.scrTbl.type4 td:nth-of-type(5){width:19%}
.scrTbl.type4 th:nth-of-type(4),.scrTbl.type4 td:nth-of-type(6){width:24%}


.scrTbl.type5 th:nth-of-type(1),.scrTbl.type5 td:nth-of-type(1){width:10%;}
.scrTbl.type5 th:nth-of-type(2),.scrTbl.type5 td:nth-of-type(2){width:18%}
.scrTbl.type5 th:nth-of-type(3),.scrTbl.type5 td:nth-of-type(3){width:18%}
.scrTbl.type5 th:nth-of-type(4),.scrTbl.type5 td:nth-of-type(4){width:18%}
.scrTbl.type5 th:nth-of-type(4),.scrTbl.type5 td:nth-of-type(5){width:18%}
.scrTbl.type5 th:nth-of-type(4),.scrTbl.type5 td:nth-of-type(6){width:18%}


.scrTbl.type6 th:nth-of-type(1),.scrTbl.type6 td:nth-of-type(1){width:5%;}
.scrTbl.type6 th:nth-of-type(2),.scrTbl.type6 td:nth-of-type(2){width:25%}
.scrTbl.type6 th:nth-of-type(3),.scrTbl.type6 td:nth-of-type(3){width:20%}
.scrTbl.type6 th:nth-of-type(4),.scrTbl.type6 td:nth-of-type(4){width:25%}
.scrTbl.type6 th:nth-of-type(4),.scrTbl.type6 td:nth-of-type(5){width:25%}

.scrTbl.type7 th:nth-of-type(1),.scrTbl.type7 td:nth-of-type(1){width:20%;}
.scrTbl.type7 th:nth-of-type(2),.scrTbl.type7 td:nth-of-type(2){width:40%}
.scrTbl.type7 th:nth-of-type(3),.scrTbl.type7 td:nth-of-type(3){width:40%}

.scrTbl.type8 th:nth-of-type(1),.scrTbl.type8 td:nth-of-type(1),
.scrTbl.type8 th:nth-of-type(2),.scrTbl.type8 td:nth-of-type(2),
.scrTbl.type8 th:nth-of-type(3),.scrTbl.type8 td:nth-of-type(3),
.scrTbl.type8 th:nth-of-type(3),.scrTbl.type8 td:nth-of-type(4){width:25%; line-height:1.2;}


.scrTbl.type3 td ul{display:flex; justify-content: space-between; max-width:295px; margin:5px auto 0px;}
.scrTbl.type3 td ul li{width:50%; text-align:left;}
.scrTbl.type3 td ul li p{display:inline-block; }
.scrTbl.type3 td ul li i{font-family:'malgunB'; margin-left:5px; color:#246ced;}
.scrTbl.type2 tbody{height:265px;}
.scrTbl.type4 tbody,.scrTbl.type4 tr,.scrTbl.type5 thead,.scrTbl.type5 tbody,.scrTbl.type5 tr,.scrTbl.type7 thead,.scrTbl.type7 tbody,.scrTbl.type7 tr
,.scrTbl.type8 thead,.scrTbl.type8 tbody,.scrTbl.type8 tr{width:470px;}
/* 차량관리-소모품관리 테이블 높이 추가 */
.scrTbl.type8 tbody{height:520px;}

.scrTbl.type9 tbody{height:155px; width:435px;}
.scrTbl.type9 thead,.scrTbl.type9 tr{width:435px;}
.scrTbl.type9 td:nth-of-type(1),.scrTbl.type9 th:nth-of-type(1){width:10%;}
.scrTbl.type9 td:nth-of-type(2),.scrTbl.type9 th:nth-of-type(2){width:80%;}
.scrTbl.type9 td:nth-of-type(3),.scrTbl.type9 th:nth-of-type(3){width:10%;}


.scrTbl.type14 tbody{height:155px; width:509px;}
.scrTbl.type14 thead,.scrTbl.type14 tr{width:509px}
.scrTbl.type14 td:nth-of-type(1),.scrTbl.type14 th:nth-of-type(1){width:10%;}
.scrTbl.type14 td:nth-of-type(2),.scrTbl.type14 th:nth-of-type(2){width:80%;}
.scrTbl.type14 td:nth-of-type(3),.scrTbl.type14 th:nth-of-type(3){width:10%;}


.scrTbl.type14 a.del{display:block;
font-size:0px;
width:13px; height:13px;
background:url('../images/x.png')no-repeat;}

.scrTbl.type14 a.del:hover{
  background:url('../images/x_hover.png')no-repeat;
}

.scrTbl.type10 tbody{height:100px}
.scrTbl.type10 tr,.scrTbl.type10 tbody{width:463px;}
.scrTbl.type10 td:nth-of-type(1),.scrTbl.type10 th:nth-of-type(1){width:20%;}
.scrTbl.type10 td:nth-of-type(2),.scrTbl.type10 th:nth-of-type(2){width:70%;}
.scrTbl.type10 td:nth-of-type(3),.scrTbl.type10 th:nth-of-type(3){width:10%;}

.scrTbl.type11 tbody{height:310px}
.scrTbl.type11 thead,.scrTbl.type11 tr,.scrTbl.type11 tbody{width:335px;}
.scrTbl.type11 td:nth-of-type(1),.scrTbl.type11 th:nth-of-type(1){width:45%;}
.scrTbl.type11 td:nth-of-type(2),.scrTbl.type11 th:nth-of-type(2){width:55%;}


.scrTbl.type12 tbody{height:300px}
.scrTbl.type12 thead,.scrTbl.type12 tr,.scrTbl.type12 tbody{width:600px;}
.scrTbl.type12 td:nth-of-type(1),.scrTbl.type12 th:nth-of-type(1){width:45%;}
.scrTbl.type12 td:nth-of-type(2),.scrTbl.type12 th:nth-of-type(2){width:55%;}

.scrTbl.type13 tbody{height:200px}
.scrTbl.type13 thead,.scrTbl.type13 tr,.scrTbl.type13 tbody{width:460px;}
.scrTbl.type13 td:nth-of-type(1),.scrTbl.type13 th:nth-of-type(1){width:15%;}
.scrTbl.type13 td:nth-of-type(2),.scrTbl.type13 th:nth-of-type(2){width:85%;}

.scrTbl.type15 tbody{height:265px}
.scrTbl.type15 thead,.scrTbl.type15 tr,.scrTbl.type15 tbody{width:469px;}
.scrTbl.type15 td:nth-of-type(1),.scrTbl.type15 th:nth-of-type(1){width:10%;}
.scrTbl.type15 td:nth-of-type(2),.scrTbl.type15 th:nth-of-type(2){width:30%;}
.scrTbl.type15 td:nth-of-type(3),.scrTbl.type15 th:nth-of-type(3){width:35%;}
.scrTbl.type15 td:nth-of-type(4),.scrTbl.type15 th:nth-of-type(4){width:20%;}


.op_history_tab .table_caption_date .hasDatepicker{width:132px; height:40px; background:url('../images/icon_calendar.png')no-repeat right 10px; box-sizing:border-box; margin-right:11px;} 
.op_history_tab .table_caption_date .hasDatepicker.type2{width:165px;}
.op_history_tab .table_caption_date .hasDatepicker.type2:nth-of-type(1){margin-right:12.5px;}
.op_history_tab .table_caption_date .hasDatepicker.type2:nth-of-type(2){margin-left:12.5px;}
.op_history_tab .table_caption_date .hasDatepicker.type2 + .pin_btn{width:90px;}
.op_history_tab .table_caption_date .hasDatepicker:nth-of-type(2){margin-left:4px;}
.popupLayer .hasDatepicker{width:102px;}
.op_history_tab .pin_btn{margin-top:0px;}
.op_history_tab .twBtn{display:flex; justify-content:space-between;}
.op_history_tab .twBtn .pin_btn{width:230px;}
.op_history_tab table td img{margin:16px 23px;}
.op_history_tab table tr.detailOn + tr.detailTr{display:block;}
.op_history_tab table tr.detailTr{display:none;}
.op_history_tab table td.detailExp{text-align:left; vertical-align: top; padding-top:23.5px;}
.op_history_tab table td.detailExp strong{font-size:15px; font-family:'malgunB';}
.op_history_tab table td.detailExp p{margin:3px 0px 8.5px;}
.op_history_tab table td.detailExp span{display:block; padding:10px 15px; width:100%; font-size:13px; background:rgba(36, 108, 237,0.06); line-height:16px; margin-bottom:15px;}
.fileSel .select{width:148px;}
.fileSel.table_caption_date input[type="text"].hasDatepicker {width:138px;}
.fileSub .pin_btn:nth-of-type(1){width:200px;}
.fileSub .pin_btn:nth-of-type(2){width:192px;}
.tblWrite.tblMin td input{width:90px;}

.sendPop .popupLayer{width:1300px;}
.sendPop .map{display:flex; position:relative; border-radius:6px; border:1px solid #cdd8da; width:100%; height:450px; overflow:hidden;}
.sendPop .searchTbl{width:30%; border-right:1px solid #cdd8da; border-bottom:1px solid #cdd8da; padding:15px; background:#fff; transition-duration: 0.3s;}
.sendPop .searchTbl.on{left:0px;}
.sendPop .searchTbl:not(.on) a.scClose img{transform:rotate(180deg);} 
.sendPop .searchTbl tr{cursor:pointer;}
.sendPop .searchTbl tr:hover td{background:#dfecff; color:#000;}
.sendPop .searchTbl div{display:inline-block;}
.sendPop .searchTbl span{font-size:15px; font-family:'malgunB'; line-height:40px;}
.sendPop .searchTbl div input[type="text"]{width:203px; height:40px; border:1px solid #2f2f2f; border-radius:4px; font-size:14px; padding-left:14px; box-sizing:border-box;}
.sendPop .searchTbl .pin_btn{display:inline-block; width:auto; margin-top:0px; padding:0px 15px; height:40px;}
.sendPop .searchTbl table{margin-top:20px;}
.sendPop .searchTbl table tr:last-child td{border-bottom:0px;}
.sendPop input + p,.sendPop textarea + p{position:absolute; right:50px; margin-top:-27px; font-size:14px; color:rgba(0,0,0,0.4);}
.paging{display:flex; justify-content: center; margin-top:35px;}
.paging li.first a,.paging li.prev a,.paging li.next a,.paging li.last a{position:relative; top:3px; display:block; width:10px; height:10px; font-size:0px; opacity:1;}
.paging li.first a{width:12px; height:12px; background:url('../images/page_prev2.png')no-repeat;}
.paging li.prev a{width:7px; height:12px; background:url('../images/page_prev.png')no-repeat;}
.paging li.next a{width:7px; height:12px; background:url('../images/page_next.png')no-repeat;}
.paging li.last a{width:12px; height:12px; background:url('../images/page_next2.png')no-repeat;}
.paging li.first,.paging li.next{margin-right:20px;}
.paging li.prev{margin-right:35px;}
.paging li:not(.first,.prev,.next,.last){margin-right:40px;}
.paging li a{font-size:15px; font-family:'malgun'; opacity:0.6; }
.paging li.on a{font-weight:500; opacity:1; font-family:'malgunB'; color:#0092ff;}
.mt80{margin-top:80px !important;}