/* global */
* {word-break:break-all;font-family:"Microsoft Yahei",Verdana,Arial;-webkit-text-size-adjust:none; outline: none;box-sizing: border-box;}/*"Microsoft Yahei",*/
html,body{height: 100%;}
body {margin:0;font-size:12px;color:#333;background:#f2f3f5;line-height: 1.42857143;}
img {border:none;}
ul li {list-style-type:none;}
ol li {list-style-type:decimal;}
ul,form ,p{margin:0px;padding:0px;}

.fl {float:left;}
.fr {float:right;}
i{ font-style: normal;}
.clear{ clear:both;}
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } 

.input-contrl,
.select-contrl,
.txt-control{display: inline-block; width: 188px; padding: 6px 12px;  font-size: 14px; border: 1px solid #e1e1e1;  border-radius: 4px;}


.track_main{ height: 100%;}
	
.layout_left{width: 400px;padding: 331px 20px 20px 20px;height:100%;background-color: #Fff;margin-right: 20px;position: relative;overflow-y: auto;overflow-x: hidden;}
.no-scrollbar{scrollbar-width: none; /* firefox */
  -ms-overflow-style: none; /* IE 10+ */}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.track-search{position: absolute;top: 0;left: 0;width: 100%;padding: 20px 20px 0;padding-top:8px;width: 400px;}
.track-search textarea{ display:block; width: 100%; height:150px; padding:10px; border:1px solid #e1e1e1; border-radius:5px; background-color: #f2f3f5; transition:all .3s; -webkit-transition:all .3s; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075);}
.track-search textarea:focus{ border-color: #3399FF; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);}
.search-btn-row {
    display: flex;
    justify-content: space-between; margin-top:20px;
}
#editor_info{ position:absolute; left:20px; bottom: 80px}

.search-btn-row .submit_btn{ color: #fff; float:right; position:relative; background-color: #3399FF; border-radius: 5px;}
.search-btn-row .submit_btn:hover{ background-color:#2f86dd;}
.search-btn-row .submit_btn input{ color:#fff; transition:all .3s; -webkit-transition:all .3s; cursor: pointer;padding: 6px 12px 6px 30px; border: none; background:none; position:relative; z-index:2;}
.search-btn-row .submit_btn .icon-sousuo{position:absolute; left:10px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%);}


.order-cont{ width: 320px;}

.status-cont{padding-top: 10px;}
.status-row{border: 1px solid #eee;border-radius: 50px;display: flex; overflow: hidden;}
.status-row li{ flex: 1; display: flex; justify-content: center; align-items: center; padding: 5px 0; cursor: pointer; transition:all .3s; -webkit-transition:all .3s;-webkit-transition: color 1s,background-color 1s;
    transition: color 1s,background-color 1s;}
.status-row li:hover{ background-color: #f2f3f5;}
.status-row li .iconfont{ margin-right: 3px;}
.status-row li.sel{background-color: #3399FF; color: #fff; cursor: default;}
.icon-quanbu{ color: #003a9b;}
.icon-feijichangtianchong{ color: #2196f3;}
.icon-duigoux{ color: #43a047;}
.icon-yichangguanli{ color: #ff6f00;}
.icon-cuowu{ color: #f44336;}
.status-row li.sel .iconfont{ color: #fff;}

.order-list li{margin-top: 12px;
    padding: 14px 16px 8px 58px;
    background-color: #f7f8fa;
    border-radius: 4px;
    border-bottom: 0;
    -webkit-transition: color 1s,background-color 1s;
    transition: color 1s,background-color 1s; position: relative;}
.order-status{  position: absolute; left: 5px;top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); min-width:48px; text-align:center;}
.t-status-h{ display:block; text-align:center;}
.transit .order-status{color: #2196f3;}
.delivered .order-status{color: #43a047;}
.unusual .order-status{color: #ff6f00;}
.error .order-status{color: #f44336;}

.order_status_tag.transit{ border: 1px solid #2196f3;color: #2196f3;}
.transit .order-status .iconfont:before,
.order_status_tag.transit .iconfont:before{content: "\e67c";}

.order_status_tag.delivered{ border: 1px solid #43a047;  color: #43a047; margin-right:45px;}
.delivered .order-status .iconfont:before,
.order_status_tag.delivered .iconfont:before{content: "\ec9e";}

.order_status_tag.unusual{ border: 1px solid #ff6f00; color: #ff6f00;}
.unusual .order-status .iconfont:before,
.order_status_tag.unusual .iconfont:before {content: "\e688";}

.order_status_tag.error{ border: 1px solid #f44336;  color: #f44336; }
.order_status_tag.error .iconfont{position: relative; top: 1px;}
.error .order-status .iconfont:before,
.order_status_tag.error .iconfont:before{content: "\e628";}

.empty-notrack{ margin-top:10px; margin-bottom:-10px;}

.order-other-info {
    margin-top: 5px;
}
.order-num{font-size: 14px;
    line-height: 14px;}
.dest-area{
    font-weight: 700;
    line-height: 12px;}
.order-new-track{ margin-top: 5px;}
.order-phone{ color: #999;}
.order-new-track p {color: #999;}

.order-list li:hover{ background-color:#dfe4eb;}
.order-list li.sel{ background-color: #3399FF; color: #fff;}
.order-list li.sel .order-status{ border-color: #fff; color: #fff;}
.order-list li.sel .order-phone{ color: #fff; opacity: 0.6;}
.order-list li.sel .order-new-track p {color: #fff; opacity: 0.6;}

.layout_right{overflow:hidden; height: 100%; padding: 20px 20px 20px 0px;}
.layout_right_wrapper {
    background-color: #fff;
    -webkit-box-shadow: 0 0 10px rgb(0 0 0 / 5%);
    box-shadow: 0 0 10px rgb(0 0 0 / 5%);
    border-radius: 4px;
    height: 100%;position:relative;
    
}

.layout_right_cont {
    height: 100%;
    overflow: auto;
    padding-bottom:40px;
}
.empty-cont-hint{ display:flex; justify-content:center; align-items:center; font-size:30px; color:#999; height:100%;}
.rtb{ position:absolute; right:10px; bottom:10px; text-align:right; font-size:16px; z-index:10;}
.rtb a {color: #999;}
	
.order_cont_wrapper{background-color: #fff;
    -webkit-box-shadow: 0 3px 10px rgb(0 0 0 / 5%);
    box-shadow: 0 3px 10px rgb(0 0 0 / 5%);
    border-radius: 4px 4px 0 0;
    padding: 20px 50px 20px 30px;position: relative;}
.order_big_info{ font-size: 28px;}
.order_status_tag{ padding: 3px 5px; font-size: 14px; border-radius: 50px; vertical-align: middle; position: relative; top: -2px;}
.order_status_tag.transit::after{ content: "运输中";}
.order_status_tag.delivered::after{ content: "已签收";}
.order_status_tag.unusual::after{ content: "可能异常";}
.order_status_tag.error::after{ content: "查询不到";}
.order_status_tag .iconfont{ margin-right: 3px;}
.order_dest_area_tag{ white-space:nowrap;}

.order_other_info-row{ margin-top: 10px;font-weight: 500; font-size: 14px;}
.order_other_info-row span{ margin-right: 40px;}

.order_right_info{
	position: absolute;
	right: 50px;
	top: 50%;
	transform: translateY(-50%); -webkit-transform: translateY(-50%);
	padding: 10px 0 10px 40px;
	border-left: 1px solid #eee;
	color: #999;
	font-size: 14px;
    line-height:20px;
}

.order_track{
	padding: 30px;
}
.order_track table{border-spacing: 0px;border-collapse: collapse; width: 100%;}
.order_track table thead{ background-color: #f5f5f5;}
.order_track table td{ border: 1px solid #eee; padding: 5px 10px; font-size: 14px;}

.dropdown_cont {position: relative;}
.dropdown_cont .title_txt{display: inline-block; height: 31px; line-height: 31px; padding: 0 5px;font-size: 14px; border: 1px solid #ccc; border-radius: 5px; cursor: default;}
.title_txt .iconfont{font-size: 14px; margin-right: 3px;}
.dropdown_cont .caret{
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid\9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
	margin-left: 10px;
	color: #959795;
}

.dropdown_cont:hover .dropdown_item_wrapper{ display: block;}
.dropdown_item_wrapper {
	display: none;
	position: absolute;
	left: 0;top: 100%;
	padding-top: 10px;z-index:99;
}
.dropdown_item_wrapper ul{border: 1px solid #ccc;background-color: #fff;font-size: 14px;
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);padding: 5px 0; text-align: left;}
.dropdown_item_wrapper ul li{display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap; cursor: pointer;    -webkit-transition: color 1s,background-color 1s;
    transition: color 1s,background-color 1s;}
	.dropdown_item_wrapper ul li:hover{ background-color: #dfe4eb;}
	

.order-list li.error{ cursor: not-allowed;}

.empty-track{ text-align: center; font-size: 14px; padding: 20px 0; color: #999;}

.track-editor-box.editor-box .CodeMirror .CodeMirror-placeholder{ top:-4px;}
.track-editor-box.editor-box{ height: 215px;}
.editor-box .CodeMirror-line{ line-height: 36px; height: 36px;}
.editor-box .CodeMirror-gutters, .editor-box .CodeMirror-linenumber{line-height: 36px; padding: 0;}
.track-editor-box .CodeMirror{ border:none;}
.track-editor-box .editor-border-box{ border:none;}
.delete-line-box{top: 4px;}
#delete_line li {
    font-family: "iconfont" !important;
    font-size: 12px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 36px;
    line-height: 36px;
    padding: 0;
}
#delete_line li:before {
    content: "\ed1e";
  }
#editor_error_box{ text-align: right;}
#editor_clear .iconfont{ font-size:14px;}

.hideOp{ display:none !important;}
#bigImg {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    display: flex;
    justify-content: center;
    align-items: center;
}
#bigImg img{ max-height:70%; max-width:70%;}
.top-img-op{ text-align:center; padding:20px 0; width:100%; position:absolute; top:0;left:0;}
#closeBigImg{ font-size:30px; color:#Fff; cursor:pointer;}
.pod_img{ display:inline-block; width:50px; cursor:pointer;}
#btnClear{padding:0; border:none; background:none;}
.txt-href:hover, a.href-title:hover {
    text-decoration: none;
}
@media screen and (max-width: 750px) {

    .layout_left{ width:100%; height:auto;}
    .track-search{ right:0; width:100%;}
    .order-list{ max-height:400px; overflow-y:auto;}
    .layout_right{ padding:1px 0 0; height:auto; width:100%;}
    .layout_right_wrapper{ height:auto;}
    .layout_right_cont{ height:auto}
    .order_big_info{ font-size:16px;}
    .order_cont_wrapper{ padding:20px;}
    .order_track{ padding:20px;}
    .order_other_info-row span{ float:left;}
    .order_track{ overflow-x:auto;}
        .order_track table td{ white-space:nowrap;}
    .empty-cont-hint{ padding:40px 0; font-size:20px;}
    .rtb{ font-size:12px;}
    .order_right_info {
        position: static;
        transform: none;
        -webkit-transform: none;
        padding:0; border-left:none;
    }
}