@charset "utf-8";

/* 배달종합현황 */
.marker_group {width: 120px; text-align: center; word-break:break-all; white-space:normal;}
.marker_group li {background-size: 30px; width: 30px; height: 24px; display: inline-block; margin: 3px; color: #fff; padding-top: 6px;}
.marker_group .gray {background: url(../images/dominos/dominos_dot_gray.png) no-repeat;}
.marker_group .blue {background: url(../images/dominos/dominos_dot_blue.png) no-repeat;}
.marker_group .red {background: url(../images/dominos/dominos_dot_red.png) no-repeat;}
.marker_group .yellow {background: url(../images/dominos/dominos_dot_yellow.png) no-repeat;}

/* 등하원 확인 */
.date_select {}
.date_select .btn2 {font-size: 10px}
.date_select ul {width: 950px; margin-bottom: 3px}
.date_select li {float: left; height: 23px; width: 178px; padding-top:7px; text-align: center;  border: 1px solid #ccc; margin-right: -1px; background: #f5f5f5; cursor: pointer}
.date_select .selected {background: #fff; font-weight: bold; border-bottom: none}
.date_select .uncomplete {color: #e8437b;}

.date_select_g {}
.date_select_g .btn2 {font-size: 10px}
.date_select_g ul {width: 320px; margin-bottom: 3px}
.date_select_g li {float: left; height: 23px; width: 47px; padding-top:7px; text-align: center;  border: 1px solid #ccc; margin-right: -1px; background: #f5f5f5; cursor: pointer}
.date_select_g .selected {background: #fff; font-weight: bold; border-bottom: none}
.date_select_g .uncomplete {color: #e8437b;}

/*도미노  도착알림 */
.arrive_alarm_wrap {position: fixed; padding-bottom: 20px; bottom:0px; right:0px; z-index:500; overflow:auto;}
.arrive_alarm_wrap  .alarm_box {width: 160px; background: #fe4382; color:#ffffff; border-radius: 4px; padding: 7px 10px; margin-bottom: 5px;position: relative}
.arrive_alarm_wrap  .alarm_box a {position: absolute;top:9px; right: 7px;}
.arrive_alarm_wrap  .alarm_box2 {width: 160px; background: #65adcf; color:#ffffff; border-radius: 4px; padding: 7px 10px; margin-bottom: 5px;position: relative}
.arrive_alarm_wrap  .alarm_box2 a {position: absolute;top:9px; right: 7px;}
.arrive_alarm_wrap  dt {font-size: 14px; font-weight: 600 ; margin-bottom: 3px; text-align: center}
.arrive_alarm_wrap  dd span {margin-left: 10px}

.dominos_dps_marker {width: 180px; height: 100px;z-index:500;text-align: center}
.dominos_dps_marker .infor {border-radius: 50px; width: 180px; height: 38px; background: #111111; color: #fff;font-size: 12px; display:table-cell; vertical-align:middle ;text-align: center; overflow:hidden; word-break:break-word;}
.dominos_dps_marker .line {text-align: center}
.dominos_dps_marker .circle {text-align: center; margin-top: -8px}

/* 콜드체인 2020-11-11 */
.btn_close02 {background: url("../images/ico_delete.png") no-repeat; background-size: 30px}

@media screen and (min-width:800px){
.map_layer_modal02 {width: 600px; border: 1px solid #cccccc; background:#fafafa; position: absolute; left: 621px; bottom: 0px; z-index: 999}
.map_layer_modal02 .tit {border-bottom: 1px solid #cccccc; padding: 10px 10px 2px 10px;}
}

@media screen and (max-width:800px){
.map_layer_modal02 {width: 100%; border: 1px solid #cccccc; background:#fafafa; position: absolute; left: 0px;  bottom: 0px; z-index: 999}
.map_layer_modal02 .tit {border-bottom: 1px solid #cccccc; padding: 10px 10px 2px 10px;}	
}

/*화면분할¸ 2021-01-15 */

.split_screen {padding-left: 220px; height: 100%}
.split_screen .left_top {width:50%; height:50%; float:left; border-right: 1px #555 solid; border-bottom: 1px #555 solid; box-sizing: border-box;}
.split_screen .right_top {width:50%; height:50%; float:right; border-left: 1px #555 solid; border-bottom: 1px #555 solid; box-sizing: border-box;}
.split_screen .left_bottom {width:50%; height:50%; float:left; border-right: 1px #555 solid; border-top: 1px #555 solid; box-sizing: border-box;}
.split_screen  .right_botom {width:50%; height:50%; float:right; border-left: 1px #555 solid; border-top: 1px #555 solid; box-sizing: border-box;}
.split_screen  .right_botom {width:50%; height:50%; float:right}
.split_screen  .left {width:50%; height:100%; float:left; border-right: 1px #555 solid; box-sizing: border-box;}
.split_screen  .right {width:50%; height:100%; float:right; border-left: 1px #555 solid; box-sizing: border-box;}

.split_map_funtion_wrap input {width: 150px; border: none; text-align: center;}
.map_view {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.split_funtion {position: absolute; bottom: 0px; right: 80px; width: 152px; z-index:1000;}

.split_funtion li {width: 50px; height: 52px; cursor: pointer; float: left}
.split_funtion .split1 {background: url("../images/ico_1split.png") no-repeat; background-size: 50px 52px;}
.split_funtion .split2 {background: url("../images/ico_2split.png") no-repeat; background-size: 50px 52px;}
.split_funtion .split4 {background: url("../images/ico_4split.png") no-repeat; background-size: 52px 52px;}

.split_funtion .split1_on {background: url("../images/ico_1split_on.png") no-repeat; background-size: 50px 52px;}
.split_funtion .split2_on {background: url("../images/ico_2split_on.png") no-repeat; background-size: 50px 52px;}
.split_funtion .split4_on {background: url("../images/ico_4split_on.png") no-repeat; background-size: 52px 52px;}

/*대시보드¸ 2021-01-15 */
.dashboard_map {}
.dashboard_map .btn_positive {margin-bottom: 15px}
.dashboard_map .map {height: 100%; border: 1px solid #ccc; position: relative; float: inherit}
.dashboard_map .map button {position: absolute; top: 60px; left: 10px; z-index: 100}

/* Pick Up Service 2021-10-14 */

.pickup_history {width:260px; background:#f0f0f0; border-right:1px solid #a1a1a1; position:fixed; left:220px; top:0px; height:100%; z-index:100; padding:15px 20px 15px 20px}
.pickup_history .window_close {position: absolute; top: 20px; right:-30px; cursor: pointer}
.pickup_history .window_expand {position: absolute; top:50%; right: -24px; margin-top: -50px; cursor: pointer}
.history_list { overflow: auto; height: calc(100% - 115px);  }
.pickup_history h3 {font-size: 18px; margin-bottom: 30px}
.pickup_history h4 {font-size: 14px; margin-bottom: 10px}
.pickup_history article {width: 100%; background: #fff ; border: 1px solid #a1a1a1; cursor: pointer; margin-top: 5px; margin-right: 15px; box-sizing: border-box;}
.pickup_history article table {margin: 10px}
.pickup_history article th {text-align: left; vertical-align: top; color: #a5a5a5; font-size: 14px; width: 80px; padding-bottom: 5px}
.pickup_history article td {text-align: left; vertical-align: top; color: #1f1f1f; font-size: 14px; padding-bottom: 5px; font-weight: 700}

.notice_setting {width: 320px; background:#f0f0f0; border:1px solid #a1a1a1; padding: 25px 30px 20px 30px; z-index: 1000; position: absolute; top: 20px; left: 50%; margin-left: 40px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3)}
.notice_setting form {font-size: 20px; font-weight: 500;}
.notice_setting span {margin-right: 10px}
.notice_setting button {background:#e8437b; color: #fff; padding: 6px 15px; font-size: 14px}
.notice_setting .status {height: 100px; overflow: auto; overflow-x: hidden; font-size: 14px;}
.notice_setting select {background: none; border: none; border-bottom: 1px solid #333; font-size: 20px; padding: 0px 20px; height: 35px; margin-top: -7px}
.notice_setting article {width: 100%; margin-top: 15px; box-sizing: border-box;}
.notice_setting article table {}
.notice_setting article th {text-align: left; vertical-align: top; color: #8c8c8c; font-size: 14px; width: 80px; padding-bottom: 5px}
.notice_setting article td {text-align: left; vertical-align: top; color: #1f1f1f; font-size: 14px; padding-bottom: 5px; font-weight: bold;}

.arrive_notice {width: 260px; position: fixed; bottom: 20px; right: 20px; z-index: 1000;}
.arrive_notice h4 {width: 100%; padding: 7px 0px; background: #e8437b; color: #fff; text-align: center; font-size: 14px}
.arrive_notice .close {position: absolute; top: 0px; right: 0px; display: block; width: 32px; height: 32px; cursor: pointer; background: url(../images/pickup/btn_noticeclose.png) center no-repeat; background-size: 15px;}
.arrive_notice article {width: 100%; background: #fff ; border: 1px solid #a1a1a1; margin-top: 5px; margin-right: 15px; box-sizing: border-box; position: relative;}
.arrive_notice article table {margin: 10px}
.arrive_notice article th {text-align: left; vertical-align: top; color: #a5a5a5; font-size: 14px; width: 80px; padding-bottom: 5px}
.arrive_notice article td {text-align: left; vertical-align: top; color: #1f1f1f; font-size: 14px; padding-bottom: 5px; font-weight: 700}

.map_notice_box {width: 250px; height: 130px; z-index: 1000;}
.map_notice_box .basic_infor {background: #333; color: #fff; text-align: center; font-weight: 700; width: 250px; padding: 15px 0; border: 2px solid #fff; border-radius: 10px; z-index: 2; position: relative; cursor: pointer;}
.map_notice_box .basic_infor h3 {margin-bottom: 5px; font-size: 14px;}
.map_notice_box .basic_infor p {font-size: 14px;}
.map_notice_box .bg_img {position: absolute; bottom: 0px; left: 50%; margin-left: 0px; z-index: 1}

.map_notice_box .detail_infor { position: absolute; top: -90px; left: -45px; background: #333; color: #fff; text-align: center; font-weight: 700; padding: 15px; border: 2px solid #fff; border-radius: 10px; width: 320px; z-index: 2;}
.map_notice_box .detail_infor h3 {margin-bottom: 10px; font-size: 18px;}
.map_notice_box .detail_infor p {font-size: 14px;}
.map_notice_box .detail_infor th {text-align: left; vertical-align: top; color: #9b9b9b; font-size: 14px; width: 80px; padding-bottom: 5px}
.map_notice_box .detail_infor td {text-align: left; vertical-align: top; color: #fff; font-size: 14px; padding-bottom: 5px; font-weight: bold;}
.map_notice_box .detail_infor ul {width: 100%; display: flex; margin-top: 10px}
.map_notice_box .detail_infor ul li {width: 50%; padding: 10px 0; cursor: pointer;}
.map_notice_box .detail_infor .close {background: #555;}
.map_notice_box .detail_infor .complete {background: #e8437b;}

.dropbtn_down {display: block; background: url(../images/ico_drop_down.png) no-repeat; background-size: 20px; background-position: center; width: 50px; height: 50px; position: absolute; top: 20px; right: 15px;}
.dropbtn_up {display: block; background: url(../images/ico_drop_up.png) no-repeat; background-size: 20px; background-position: center; width: 50px; height: 50px; position: absolute; top: 18px; right: 15px;}

/* 쿠팡버스모니터 2024-07-26 */
.width_110px {width: 110px;}
.width_120px {width: 120px;}
.coupang_table {width: 100%; background-color:#34292d;}
.coupang_table th {text-align: center; font-size:12px; padding:5px 0; line-height:1.2em}

.coupang_bus_monitor {width: 519px; height: 100%; background-color: #fafafa; z-index: 100; border-right: 1px solid #CCC; position: fixed; left: 220px; top: 0px; height: 100%; z-index: 100; padding: 0px 20px;}
.coupang_bus_monitor .sec_01 {margin: 15px 0 5px 0; padding-bottom:0px}
.coupang_bus_monitor .sec_01 .driving {font-size: 16px; width: 150px; float: left;}
.coupang_bus_monitor .sec_01 h4 {color: #272727; float: left; margin-right: 15px; margin-top: 3px;}
.coupang_bus_monitor .sec_01 .driving input {width:17px; margin-right: 5px; float: left;}
.coupang_bus_monitor .sec_01 p {padding-left: 10px; margin-top: 3px;font-size: 16px;}
.coupang_bus_monitor .sec_01 .number {font-size: 16px;}

.coupang_bus_monitor .sec_02 {margin: 0 0 15px 0; padding-bottom:0px}

.busmonitor_guide {display: flex}
.busmonitor_guide li { padding:3px 0px 3px 23px; margin: 10px 15px 0 0;}
.busmonitor_guide .black {background: url(../images/coupang/bus_guide_black.png) no-repeat; background-size: 20px; background-position: left;}
.busmonitor_guide .orange {background: url(../images/coupang/bus_guide_orange.png) no-repeat; background-size: 20px; background-position: left;}
.busmonitor_guide .green {background: url(../images/coupang/bus_guide_green.png) no-repeat; background-size: 20px; background-position: left;}
.busmonitor_guide .blue {background: url(../images/coupang/bus_guide_blue.png) no-repeat; background-size: 20px; background-position: left;}
.busmonitor_guide .red {background: url(../images/coupang/bus_guide_red.png) no-repeat; background-size: 20px; background-position: left;}

.coupang_situation {z-index: 98; position: absolute; cursor: pointer;}
.coupang_situation_basic {background: url(../images/coupang/bus_onmap_black.png) no-repeat; background-position: center top; background-size: 40px; padding-top: 50px;}
.coupang_situation_driving {background: url(../images/coupang/bus_onmap_green.png) no-repeat; background-position: center top; background-size: 40px; padding-top: 50px;}
.coupang_situation_complete {background: url(../images/coupang/bus_onmap_blue.png) no-repeat; background-position: center top; background-size: 40px; padding-top: 50px;}
.coupang_situation_abnormal {background: url(../images/coupang/bus_onmap_red.png) no-repeat; background-position: center top; background-size: 40px; padding-top: 50px;}
.coupang_situation span {background: #fafafa; border: 1px solid #000; padding: 3px 5px ; border-radius: 3px;}

.coupang_detail_popup {position: absolute; background: #fff; padding: 10px 15px; width: 230px; box-shadow: 2px 2px 2px 1px rgb(0 0 0 / 20%);}
.coupang_detail_popup th {color: #787878; text-align: left; font-size: 12px; padding: 5px 10px 5px 0; width: 80px;}
.coupang_detail_popup td {font-weight: 600;}

.driving_detail_wrap {width: 600px; background: #ebebeb; padding-left: 220px; float: left;}
.driving_detail_wrap h3 {width: 100%; padding: 10px 0; background: #e8447a; text-align: center; color: #fff; font-size: 16px; position: relative;}
.driving_detail_wrap .close {display: block; background: url(../images/coupang/ico_window_close.png) no-repeat; background-size: 15px; background-position: center; position: absolute; top: 50%; right: 3px; margin-top: -17px; width: 15px; height: 15px; padding: 10px; cursor: pointer;}
.driving_detail_wrap .driving_detail {padding: 20px;}
.driving_detail_wrap .driving_detail .situation {display: flex; margin-bottom: 15px;}
.driving_detail_wrap .driving_detail .situation li {padding: 1px 0 5px 33px; font-size: 16px; font-weight: bold; margin-right: 20px;}
.driving_detail_wrap .driving_detail .situation .bus_basic {background: url(../images/coupang/bus_guide_black.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_orange {background: url(../images/coupang/bus_guide_orange.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_green {background: url(../images/coupang/bus_guide_green.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_blue {background: url(../images/coupang/bus_guide_blue.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_red {background: url(../images/coupang/bus_guide_red.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .driver_basic {background: url(../images/coupang/bus_driver_black.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .driver_orange {background: url(../images/coupang/bus_driver_orange.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .driver_driving {background: url(../images/coupang/bus_driver_green.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .driver_complete {background: url(../images/coupang/bus_driver_blue.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .driver_abnormal {background: url(../images/coupang/bus_driver_red.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_ready {background: url(../images/coupang/bus_guide_orange.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_driving {background: url(../images/coupang/bus_guide_green.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_complete {background: url(../images/coupang/bus_guide_blue.png) no-repeat; background-size: 25px;}
.driving_detail_wrap .driving_detail .situation .bus_abnormal {background: url(../images/coupang/bus_guide_red.png) no-repeat; background-size: 25px;}
.driving_notice { background: #fff; border-radius: 3px;}
.driving_notice .destination {display: flex;  border-radius: 3px; background: url(../images/coupang/arrow_destination.png) no-repeat #34292d; background-size: 20px; background-position: center;}
.driving_notice .destination li {color: #fff; text-align: center; width: 50%; padding: 15px 20px; font-size: 14px; font-weight: bold;}

.driving_notice .list {display: flex; padding-left: 40px; background: url(../images/coupang/bus_route.png) no-repeat; background-size: 50px; background-position: left; height: 50px; border-bottom: 1px solid #ebebeb;}
.driving_notice .list_current {display: flex; padding-left: 55px; background: url(../images/coupang/bus_route_current.png) no-repeat; background-size: 50px; background-position: left; height: 50px; border-bottom: 1px solid #ebebeb;}
.driving_notice .list h4 {padding-top: 10px; width: 180px; padding-right: 10px;}
.driving_notice .list ol {display: flex; padding-top: 15px;}
.driving_notice .list li { font-size: 13px;}
.driving_notice .list .line { color: #bebebe; margin: 0 4px;}

.driving_notice .list_current h4 {padding-top: 10px; width: 180px; padding-right: 10px;}
.driving_notice .list_current ol {display: flex; padding-top: 15px;}
.driving_notice .list_current li { font-size: 13px; font-weight: bold;}
.driving_notice .list_current .line { color: #bebebe; margin: 0 4px;}

.driving_detail_data_tit { width: 100%;  border-radius: 3px; background: #34292d; height:30px; margin-top: 10px;}
.driving_detail_data_tit th { border-radius: 3px; background: #34292d; text-align: center; color: #fff; font-size: 14px; }

.driving_detail_data { width: 100%;}
.driving_detail_data td { text-align: center; font-size: 14px; background: #fff; padding: 10px 0; border: 1px solid #e6e6e6; }
.driving_detail_dat_wrap {height: 136px; overflow: auto;}

.bus_stop_list {position: absolute; cursor: pointer;}