/* color */

.st_font-gray {
    color: #787c7b;
}

.st_bg-gray {
    background-color: #eeebe9;
}

.st_font-green {
    color: #008371;
}

.st_bg-green {
    background-color: #3ca899;
}

.st_link-green {
    color: #008371;
    text-decoration: underline;
}

.st_bg-orange {
    background-color: #fa8f12;
}

.st_font-orange {
    color: #fa8f12;
}

.st_link-orange {
    color: #ff5201;
}

.st_link-orange:hover {
    color: #ff5201;
    text-decoration: underline;
}

.st_link-blue {
    color: #69a9ee;
}

.st_link-blue:hover {
    color: #69a9ee;
    text-decoration: underline;
}


.st_required {
    color: #ff0000;
    font-style: normal;
}


/* button */


/* 
    <button class="st_btn-addGreen">新增联系人</button>
    <a href="javascript:;" class="st_btn-addGreen">新增联系人</a>
    <button class="st_btn-deleteGreen"></button>
    <a href="javascript:;" class="st_btn-deleteGreen"></a>
    <button class="st_btn-orange">查询</button>
    <button class="st_btn-white">暂缓提交审批</button>
    <button class="st_btn-anomaly">提交审批</button>
    <button class="st_btn-green">下载电子保单</button>
    <button class="st_btn-primary">关闭</button>
    <button class="st_btn-search">查询</button>
*/

.st_btn-addGreen,
.st_btn-anomaly,
.st_btn-deleteGreen {
    background: url(../images/global/new-booking.png) no-repeat;
}

.st_btn-addGreen {
    display: inline-block;
    height: 25px;
    line-height: 25px;
    padding: 0 5px 0 25px;
    color: #3ca899;
    border: 1px solid #3ca899;
    background-position: 5px -94px;
    background-color: #fff;
}

.st_btn-addGreen:hover {
    background-position: 5px -124px;
    background-color: #3ca899;
    color: #fff;
    text-decoration: none;
}

.st_btn-deleteGreen {
    display: inline-block;
    width: 21px;
    height: 21px;
    background-position: 0 -160px;
    border: 0;
}

.st_btn-orange {
    padding: 3px 10px;
    background-color: #fa9511;
    border: none;
    color: #fff;
}

.st_btn-search {
    display: inline-block;
    width: 70px;
    height: 27px;
    border: 0;
    padding-left: 25px;
    background: #f8910e url(../images/member/myshinetour.png) no-repeat;
    background-position: 10px -18px;
    color: #fff;
    line-height: 27px;
    font-size: 14px;
    cursor: pointer;
    border-radius: 3px;
    text-align: left;
}

.st_btn-search:hover {
    background: #F8A53D url(../images/member/myshinetour.png) no-repeat;
    background-position: 10px -18px;
}

.st_btn-white {
    display: inline-block;
    height: 42px;
    margin: 0 20px;
    padding: 0 20px;
    border: 1px solid #e5e1df;
    background: #fff;
    text-align: center;
    line-height: 42px;
    font-size: 14px;
    cursor: pointer;
}

.st_btn-white:hover {
    background: #3ca899;
    border-color: #3ca899;
    color: #fff;
    text-decoration: none;
}

.st_btn-anomaly {
    position: relative;
    display: inline-block;
    width: 120px;
    height: 42px;
    line-height: 42px;
    padding: 0 20px;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    background-color: #fa9511;
    background-position: 98px -245px;
    border: 0;
    cursor: pointer;
}

.st_btn-anomaly:hover {
    color: #fff;
}


/* .st_btn-primary {
    display: inline-block;
    width: 142px;
    height: 33px;
    margin: 0 10px;
    line-height: 33px;
    color: #fff;
    background: #f8900d;
    text-decoration: none;
    border:0;
}
.st_btn-primary:hover,.st_btn-orange:hover{
    background: #ffb250;
    color: #fff;
    text-decoration: none;
} */

.st_btn-green {
    display: inline-block;
    width: 140px;
    height: 33px;
    margin: 0 10px;
    line-height: 33px;
    border: 1px solid #69b6ab;
    color: #008371;
    background: #fff;
}

.st_btn-green:hover {
    background: #f8900d;
    border: 1px solid #f8900d;
    color: #fff;
}


/* input */


/* 
    <input type="text" class="st_ipt-md st_ipt-lg" />
    <input type="text" class="st_ipt-md" />
    <input type="text" class="st_ipt-md st_ipt-sm" />
*/

.st_ipt-md {
    display: inline-block;
    width: 100px;
    height: 17px!important;
    padding: 3px 5px!important;
    line-height: 17px;
    border: 1px solid #d0d0d0;
    border-radius: 0!important;
    margin-bottom: 0!important;
    box-sizing: content-box;
}

.st_ipt-lg {
    width: 150px;
}

.st_ipt-sm {
    width: 70px;
}


/* select */


/*
    <select class="st_slt-md st_slt-lg"></select>
    <select class="st_slt-md"></select>
    <select class="st_slt-md st_slt-sm"></select>
 */

.st_slt-md {
    width: 112px;
    height: 24px;
    line-height: 20px;
    border: 1px solid #d0d0d0;
    border-radius: 0;
    margin-bottom: 0!important;
    padding: 0;
}

.st_slt-lg {
    width: 162px;
}

.st_slt-sm {
    width: 82px;
}


/* tabs */


/* 
<div class="st_a_listTabs">
    <ul class="st_clf st_m-0">
        <li class="active"><a href="javascript:;"><span>综合<em>920</em></span></a></li>
        <li><a href="javascript:;"><span>申请中<em>4</em></span></a></li>
        <li><a href="javascript:;"><span>暂缓订单<em>69</em></span></a></li>
        <li><a href="javascript:;"><span>审批中<em>41</em></span></a></li>
        <li><a href="javascript:;"><span>待支付<em>0</em></span></a></li>
        <li><a href="javascript:;"><span>出票中<em>17</em></span></a></li>
        <li><a href="javascript:;"><span>已出票<em>733</em></span></a></li>
        <li><a href="javascript:;"><span>已取消<em>56</em></span></a></li>
    </ul>
</div>
 */

.st_a_listTabs {
    margin-bottom: 10px;
    border-bottom: 2px solid #3ca899;
    overflow: hidden;
}

.st_a_listTabs li {
    height: 32px;
    margin-left: -1px;
    float: left;
    display: inline;
    font-size: 14px;
}

.st_a_listTabs li a {
    display: block;
    padding: 0 15px;
    float: left;
    vertical-align: middle;
}

.st_a_listTabs li span {
    display: block;
    height: 32px;
    float: left;
    line-height: 32px;
    cursor: pointer;
}

.st_a_listTabs li span em {
    color: #ff5400;
    cursor: pointer;
    font-style: normal;
}

.st_a_listTabs .active {
    background: #3ca899;
    position: relative;
    z-index: 2;
    font-weight: bold;
}

.st_a_listTabs .active span {
    background: #3ca899;
    color: #fff;
    border-radius: 15px;
}

.st_a_listTabs .active span em {
    color: #fff;
    font-weight: normal;
}


/* progress */


/* 
<div class="st_a_progress">
    <ul class="st_clf st_m-0">
        <li class="first-li current">
            <span class="st_bar"></span>
            <div class="st_round">
                <span>待提交</span>
                <i>（<em class="st_required st_m-r-5">*</em>因公司欠款逾期，无法提交审批。）</i>
            </div>
        </li>
        <li>
            <span class="st_bar"></span>
            <div class="st_round">
                <span>提交订单</span>
            </div>
        </li>
        <li>
            <span class="st_bar"></span>
            <div class="st_round">
                <span>审批中</span>
            </div>
        </li>
        <li>
            <span class="st_bar"></span>
            <div class="st_round">
                <span>购保中</span>
            </div>
        </li>
        <li>
            <span class="st_bar"></span>
            <div class="st_round">
                <span>已购保</span>
            </div>
        </li>
    </ul>
</div>
 */

.st_a_progress {
    height: 40px;
    background: #fff;
    padding: 20px 50px;
    text-align: center;
}

.st_a_progress ul {
    display: inline-block;
    *width: 90%;
}

.st_a_progress li {
    float: left;
}

.st_a_progress .st_round {
    position: relative;
    float: left;
    width: 14px;
    height: 17px;
    background: url(../images/member/progress_bar02.png) center 0px no-repeat;
}

.st_a_progress .st_round span {
    position: absolute;
    left: 50%;
    top: 17px;
    display: inline-block;
    /* margin-left: -23px;*/
    background: #c7c7c7;
    color: #fff;
    padding: 2px 5px;
    border-radius: 3px;
    white-space: nowrap;
}

.st_a_progress .st_round i {
    position: absolute;
    left: 50%;
    top: -23px;
    display: inline-block;
    margin-left: -100px;
    color: #333;
    padding: 2px 5px;
    white-space: nowrap;
    font-style: normal;
}

.st_a_progress .st_round .font-red {
    color: #f00;
}

.st_a_progress .st_bar {
    float: left;
    width: 120px;
    *width: 100px;
    height: 4px;
    background: #c7c7c7;
    margin-top: 5px;
}

.st_a_progress .first-li .st_bar {
    display: none;
}

.st_a_progress .current .st_round {
    background: url(../images/member/progress_bar01.png) center 0px no-repeat;
}

.st_a_progress .current .st_round span,
.st_a_progress .current .st_bar {
    background: #fa9511;
}

.w980 .st_a_progress .st_bar {
    width: 90px;
}


/* 列表页的table */


/* 
<div class="">
    <table cellspacing="0" cellpadding="0" class="st_tb-front">
        <thead>
            <tr>
                <td>订单号</td>
                <td>用车类型</td>
                <td>行程</td>
                <td>乘车人</td>
                <td>费用</td>
                <td>预订人/预定时间</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <i class="st_link-no"><a href="#" target="_blank">IO1500000309</a></i>
                    <strong class="st_a_order-type">待提交</strong>
                </td>
                <td><i>接机</i></td>
                <td class="st_t-l">
                    <i>起：广州，花地湾地铁站</i>
                    <i>终：广州，建滔广场</i>
                    <i>2017/03/16 12:52</i>
                </td>
                <td>
                    <i>张三</i>
                    <i>12541256325</i>
                    <i>李四</i>
                    <i>36523145214</i>
                </td>
                <td><i><strong class="st_link-orange st_blod">¥875</strong>（预估）</i></td>
                <td>
                    <i>李四</i>
                    <i>2017/03/15 11:16</i>
                </td>
                <td>
                    <a href="#" class="st_link">提交审批</a>
                    <a href="#" class="st_link">取消订单</a>
                </td>
            </tr>
        </tbody>
    </table>
</div>
 */

.st_tb-front {
    width: 100%;
    text-align: center;
    border-top: 1px solid #3ca899;
}

.st_tb-front thead {
    background: #e3f3f1;
}

.st_tb-front thead td {
    padding: 7px 0;
    line-height: 18px;
}

.st_tb-front tbody td {
    padding: 10px 0;
    word-break: break-all;
    background-color: #fff;
    border-bottom: 1px solid #e1dcd9;
}

.st_tb-front i {
    display: block;
    font-style: normal;
}

.st_tb-front .st_link-no a {
    color: #008371;
}

.st_tb-front .st_link-no a:hover {
    color: #ff5201;
    text-decoration: underline;
}

.st_tb-front .st_link {
    text-decoration: underline;
}

.st_tb-front .st_link:hover,
.st_tb-front .st_link-dot:hover {
    color: #ff5201;
}

.st_tb-front .st_link-dot {
    margin: 0 5px;
    color: #008371;
    border-bottom: 1px dotted #008371;
    white-space: nowrap;
}


/* 详情页的div */


/* 
<div class="st_a_module">
    <div class="st_mHd st_clf">
        <span class="st_sMark">乘车人信息</span>
        <span class="st_subMark"><a class="st_aShow st_aHide" href="javascript:;">展开</a></span>
    </div>
    <div class="st_mBd">
        <div class="st_divHead">
            <span class="st_w-p24 st_il-bl">序号</span>
            <span class="st_w-p24 st_il-bl">部门</span>
            <span class="st_w-p24 st_il-bl">乘车人姓名</span>
            <span class="st_w-p24 st_il-bl">手机号</span>
        </div>
        <div class="st_divBody st_t-c">
            <span class="st_w-p24 st_il-bl">1</span>
            <span class="st_w-p24 st_il-bl">前端研发部</span>
            <span class="st_w-p24 st_il-bl">张三（联系人）</span>
            <span class="st_w-p24 st_il-bl">15241256325</span>
        </div>
    </div>
</div>
 */

.st_a_module .st_sMark {
    float: left;
    color: #008371;
    font-size: 14px;
    line-height: 30px;
}

.st_a_module .st_subMark {
    padding: 7px 0;
    float: right;
    line-height: 16px;
}

.st_a_module .st_subMark a {
    display: inline-block;
    padding-right: 15px;
    color: #008371;
    text-decoration: none;
    background: url(../images/member/myshinetour.png) no-repeat;
}

.st_a_module .st_subMark a:hover {
    color: #008371;
}

.st_a_module .st_subMark .st_aShow {
    background-position: 27px -125px;
}

.st_a_module .st_subMark .st_aHide {
    background-position: 27px -99px;
}

.st_a_module .st_mBd {
    border-top: 1px solid #3ca899;
}

.st_a_module .st_divHead {
    width: 100%;
    text-align: center;
    background: #e3f3f1;
    padding: 5px 0;
    line-height: 22px;
}

.st_a_module .st_divBody {
    border-bottom: 1px solid #e1dcd9;
    /*padding: 5px;*/
    line-height: 22px;
    background-color: #fff;
}

.st_a_module .st_divBody:hover {
    background-color: #FFF3E3;
}


/* 填写页的div */


/* 
<div class="st_a_area">
    <div class="st_mHd st_clf">
        <span class="st_sMark">联系人信息</span>
        <span class="st_subMark"><a href="javascript:;" class="st_btn-addGreen">新增</a></span>
    </div>
    <div class="st_mBd">
        <div class="st_divHead">
            <span class="st_w-p24 st_il-bl">序号</span>
            <span class="st_w-p24 st_il-bl">部门</span>
            <span class="st_w-p24 st_il-bl">乘车人姓名</span>
            <span class="st_w-p24 st_il-bl">手机号</span>
        </div>
        <div class="st_divBody st_t-c st_p-5">
            <span class="st_w-p24 st_il-bl">1</span>
            <span class="st_w-p24 st_il-bl">前端研发部</span>
            <span class="st_w-p24 st_il-bl">张三（联系人）</span>
            <span class="st_w-p24 st_il-bl">15241256325</span>
        </div>
    </div>
</div>
 */

.st_a_area .st_sMark {
    float: left;
    width: 100px;
    height: 33px;
    color: #fff;
    line-height: 33px;
    background: #3ca899;
    font-size: 14px;
    text-align: center;
}

.st_a_area .st_subMark {
    float: right;
    line-height: 16px;
}

.st_a_area .st_mBd {
    border-top: 2px solid #3ca899;
    border-left: 1px solid #e1dcd9;
    border-right: 1px solid #e1dcd9;
}

.st_a_area .st_divHead {
    width: 100%;
    text-align: center;
    background-color: #eeebe9;
    padding: 5px 0;
    line-height: 22px;
}

.st_a_area .st_divBody {
    border-bottom: 1px solid #e1dcd9;
    /*padding: 5px;*/
    line-height: 22px;
    background-color: #fff;
}


/* 右侧浮动栏 */


/*
<div class="st_a_side-bar">
    <div class="st_a_costBox">
        <ul class="st_a_total-cost">
            <li>
                <div class="left"><strong>订单总金额</strong></div>
                <div class="right"><strong class="money">¥1516</strong></div>
            </li>
            <li>
                <div class="psg-num">共<em>6</em>名乘客</div>
            </li>
        </ul>
        <div class="st_a_total-detail">
            <ul>
                <!-- <li class="type"><strong>车辆一</strong></li> -->
                <li class="header">
                    <div class="left"><strong>接机</strong></div>
                    <div class="right">车辆一</div>
                </li>
                <li>
                    <div class="left">预估车费</div>
                    <div class="right">¥1045/辆</div>
                </li>
                <li>
                    <div class="left">服务费</div>
                    <div class="right">¥5/辆</div>
                </li>
            </ul>
            <ul>
                <li class="header">
                    <div class="left"><strong>接机</strong></div>
                    <div class="right">车辆二</div>
                </li>
                <li>
                    <div class="left">预估车费</div>
                    <div class="right">¥1045/辆</div>
                </li>
                <li>
                    <div class="left">服务费</div>
                    <div class="right">¥5/辆</div>
                </li>
            </ul>
        </div>
    </div>
</div>
 */

.st_a_side-bar {
    width: 270px;
    float: right;
    z-index: 2;
}

.st_a_side-bar ul {
    margin: 0;
}

.st_a_costBox {
    padding: 5px 0 0;
    border: 1px solid #e1dcd9;
    border-top: 2px solid #3ca899;
    background: #fff;
    font-family: arial;
}

.st_a_costBox .left {
    display: inline-block;
    padding: 0 3px;
    float: left;
    background: #fff;
}

.st_a_costBox .right {
    display: inline-block;
    padding: 0 3px;
    float: right;
    background: #fff;
}

.st_a_total-cost li {
    padding: 0 25px;
    height: 24px;
    /*line-height:24px;*/
}

.st_a_total-cost .psg-num {
    color: #008371;
    text-align: right;
}

.st_a_total-cost .psg-num em {
    font-style: normal;
    padding: 0 3px;
}

.st_a_total-cost .left strong {
    font-size: 14px;
}

.st_a_total-cost .money {
    font-size: 24px;
    color: #fa9511;
}

.st_a_total-detail ul {
    padding: 5px 35px;
    border-top: 1px solid #e1dcd9;
}

.st_a_total-detail li {
    height: 20px;
    line-height: 20px;
    overflow: hidden;
}

.st_a_total-detail .type {
    margin: 0 -15px;
}

.st_a_total-detail .type strong {
    padding-right: 5px;
    font-size: 14px;
}

.st_a_total-detail .header {
    margin: 8px -10px 0;
    background: url(../images/global/icon-dot.jpg) left 12px repeat-x;
    font-size: 14px;
}

.st_link-dot {
    background-color: #fff;
    color: #008371;
    border: 0;
    border-bottom: 1px dotted #008371;
}

.st_bdr-none {
    border-radius: 0;
}

.st_of-a {
    overflow: auto;
}

.st_v-m {
    vertical-align: middle;
}


/* 管理中心列表查询时用到<span class="st_ipt-label"></span><input type="text" /> */

.st_front-ipt-label {
    display: inline-block;
    width: 72px;
    padding-right: 8px;
    vertical-align: middle;
    text-align: right;
}


/* 灰色的边框 */

.st_a_bd-1 {
    border: 1px solid #e1dcd9;
}

.st_a_bd-1t {
    border-top: 1px solid #e1dcd9;
}

.st_a_bd-1b {
    border-bottom: 1px solid #e1dcd9;
}

.st_a_bd-1r {
    border-right: 1px solid #e1dcd9;
}

.st_a_bd-1l {
    border-left: 1px solid #e1dcd9;
}

.st_a_bd-0 {
    border: 0!important;
}

.st_a_bd-0t {
    border-top: 0!important;
}

.st_a_bd-0b {
    border-bottom: 0!important;
}

.st_a_bd-0r {
    border-right: 0!important;
}

.st_a_bd-0l {
    border-left: 0!important;
}


/* 用div伪装table时可用 */

.st_ds-tb {
    display: table;
}

.st_ds-tb .st_a_td {
    display: table-cell;
    vertical-align: middle;
}


/*分页使用格式
<div class="st_pagenav st_p-v-10">
    <span class="st_msg st_t-c st_p-h-10">第<em>1</em>页 共<em>50</em>页 每页<em>20</em>条 共<em>1000</em>条数据</span>
    <div class="st_page">
        <a class="st_page-grey" href="javascript:;">首页</a>
        <a class="st_page-grey" href="javascript:;">上一页</a>
        <a class="st_page-cur" href="javascript:;">1</a>
        <a href="javascript:;" data="2">2</a>
        <a href="javascript:;" data="3">3</a>
        <a href="javascript:;" data="4">4</a>
        <span>...</span>
        <a href="javascript:;" data="50">50</a>
        <a href="javascript:;" data="2">下一页</a>
        <a href="javascript:;" data="50">末页</a>
    </div>
</div>
*/

.st_pagenav .st_msg {
    float: left;
    width: 30%;
}

.st_pagenav .st_msg em {
    color: #3ca899;
    padding: 0 2px;
    font-style: normal;
}

.st_pagenav .st_page a {
    display: inline-block;
    height: 16px;
    margin: 0 2px;
    padding: 2px 7px;
    line-height: 16px;
    overflow: hidden;
    vertical-align: top;
    border: 1px solid #3ca899;
    color: #3ca899;
    text-decoration: none;
    background: #fff;
}

.st_pagenav .st_page .st_page-cur,
.st_pagenav .st_page a:hover {
    background-color: #3ca899;
    color: #fff;
}

.st_pagenav .st_page .st_page-grey,
.st_pagenav .st_page .st_page-grey:hover {
    border-color: #bbb;
    color: #bbb;
    background: #fff;
    cursor: default;
}


/*tabs标签内容使用格式：
<div tabset class="st_r_tab_reset">
    <div tab heading="标签一">
        <div class="tab-pane active tab-content st_tab-content st_p-v-10 st_p-h-5"></div>
    </div>
    <div tab heading="标签二">
        <div class="tab-pane tab-content st_tab-content st_p-v-10 st_p-h-5"></div>
    </div>
</div>
*/

.st_tab-content {
    border: 1px solid #ddd;
    border-top: 1px solid transparent;
    background-color: #F4FBFA;
}


/* 产品子类型**/

.st_r_info-block {
    margin-bottom: 30px;
}

.st_r_info-body {
    border-right: 1px solid #ddd;
    border-top: 1px solid #ddd;
    width: 100%;
    display: table;
}

.st_r_info-body input,
.st_r_info-body select {
    margin-bottom: 0px;
}

.st_r_title {
    height: 28px;
    color: #333;
    line-height: 28px;
    font-size: 14px;
    font-weight: 600;
}

.st_r-row {
    display: table-row;
}

.st_r-row>div {
    display: table-cell;
    vertical-align: middle;
    border-bottom: 1px solid #ddd;
    text-align: center;
    padding: 5px;
    min-width: 129px;
}

.st_r_3 .st_r-row>div {
    width: 16.666666%;
}

.st_r_2 .st_r-row>div {
    width: 25%;
}

.st_r_info-left {
    background-color: #D0EFEB;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

.st_r_info-right {
    text-align: left!important;
    background-color: #fff;
}


/* 
<div class="st_a_info-block">
    <div class="st_a_info-title st_ds-tb st_w-p98">
        <span class="st_a_td st_w-p25">类型</span>
        <span class="st_a_td st_w-p25"><span class="st_required st_m-r-2">*</span>姓名</span>
        <span class="st_a_td st_w-p25"><span class="st_required st_m-r-2">*</span>手机号码</span>
        <span class="st_a_td st_w-p25">邮箱</span>
    </div>
    <div class="st_a_info-body st_ds-tb st_w-p98">
        <span class="st_a_td st_w-p25"><input type="text" class="st_m-0 st_ipt-md"></span>
        <span class="st_a_td st_w-p25"><input type="text" class="st_m-0 st_ipt-md"></span>
        <span class="st_a_td st_w-p25"><input type="text" class="st_m-0 st_ipt-md"></span>
        <span class="st_a_td st_w-p25"><input type="text" class="st_m-0 st_ipt-md"></span>
    </div>
</div>
 */

.st_a_info-block {
    margin: 16px 0px;
}

.st_a_info-block>div {
    /* display:table-cell; */
    vertical-align: middle;
    border: 1px solid #ddd;
    border-top: 0;
    text-align: center;
    line-height: 20px;
    padding: 5px;
}

div.st_a_info-title {
    background-color: #D0EFEB;
    border-top: 1px solid #ddd;
}

.st_a_info-block .st_ipt-90 {
    width: 90px;
}