.header-top  {
    padding:15px 0;
}
.header-top .gnb {
    float: right;
    list-style: none;
    padding:0;
    margin:20px 0 0;
}
.header-top .gnb li {
    display: inline-block;
}
.header-top .gnb li a,
.header-top .gnb li button{
    font-size:13px;
    color:#fff;
    text-transform: uppercase;
    text-align: center;
    display: block;
    width:89px;
    height:36px;
    line-height: 36px;
    background-color: #5f5f5f;
    border-radius: 2px;
}
.header-top .gnb li.login button{
    background-color: #0b3779;
    border:0;
}
.header-bottom {
    background-color: #0b3779;
    height:50px;
}
.header-bottom .lnb {
    list-style: none;
    padding:0;
    margin:0;
    float: right;
}
.header-bottom .lnb li {
    float: left;
    padding-top:4px;
    position: relative;
}
.header-bottom .lnb li:after{
    content: '';
    width:1px;
    height:27px;
    background-color: #4a6b9c;
    position: absolute;
    right:0;
    top:50%;
    margin-top:-13px;
}
.header-bottom .lnb li a {
    display: block;
    color:#fff;
    font-size:15px;
    text-align: center;
    padding:13px 30px;
    height:46px;
    text-transform: uppercase;
}
.header-bottom .lnb li.active a,
.header-bottom .lnb li a:focus,
.header-bottom .lnb li a:active,
.header-bottom .lnb li a:hover{
    background-color: #fff;
    color:#0b3779;
    font-weight: bold;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}
.header-bottom .lnb li.active:after,
.header-bottom .lnb li:focus:after,
.header-bottom .lnb li:active:after,
.header-bottom .lnb li:hover:after{
    background-color: #fff;
}
.header-fixed {
    display: none;
}

#footer {
    background-color: #222222;
    padding:13px 0;
    color:#fff;
    font-size:11px;
}
#footer a {
    text-transform: uppercase;
    color:#fff;
    float: right;
    display: block;
}
#footer a img {
    vertical-align: middle;
    margin-right:5px;
}

#dialog-login form{
    padding:0 45px;
}
#dialog-login form fieldset {
    margin-bottom:19px;
}
#dialog-login form label {
    display: block;
    font-size:11px;
    color:#b7b7b7;
    text-transform: uppercase;
    font-weight: normal;
    margin-top: 5px;
}
#dialog-login form .form-control{
    background-color:#ebebeb;
    border-radius: 2px;
    box-shadow: none;
    border:0;
}
#dialog-login form .btn-login {
    background-color: #0b3779;
    color:#fff;
    font-size:13px;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    width:136px;
    border-radius: 2px;
    padding:10px;
}
#dialog-login form a {
    font-size:12px;
    text-transform: uppercase;
    color:#333;
    display: block;
    padding: 12px 0;
    text-align: right;
}
#dialog-login .col-xs-6 {
    padding:0;
}
#dialog-login .bottom {
    margin-top:32px;
    background-color: #0b3779;
    padding:22px 45px;
    text-align: center;
    text-transform: uppercase;
    color:#fff;
    font-size:12px;
}
#dialog-login .bottom div:first-child{
    padding:12px 10px;
    text-align: left;
}
#dialog-login .bottom .btn-signup {
    border:1px solid #fff;
    width:136px;
    padding:10px;
    display: block;
    color:#fff;
    border-radius: 2px;
    margin-right: 0;
    margin-left: auto;
}
#dialog-contact{
    padding:0 45px;
    max-width:418px;
}
#dialog-contact form fieldset{
    margin-bottom:25px;
}
#dialog-contact .col-xs-6:first-child {
    padding-right:0;
}
#dialog-contact form label {
    display: block;
    font-size:11px;
    color:#b7b7b7;
    text-transform: uppercase;
    font-weight: normal;
    margin-top: 5px;
}
#dialog-contact form .form-control{
    background-color:#ebebeb;
    border-radius: 2px;
    box-shadow: none;
    border:0;
}
#dialog-contact p {
    font-size:12px;
    color:#666666;
    text-transform: uppercase;
    margin:23px 0;
}
#dialog-contact p a {
    color:#0b3779;
}


/* 서브페이지 공통 */
.location {
    margin:10px 0;
}
.location .breadcrumb{
    background:none;
}
.location .breadcrumb>li {
    display: inline-block;
}
.location .breadcrumb>li a {
    color:#999999;
    text-transform: uppercase;
    font-size:11px;
    vertical-align: middle;
}
.location .breadcrumb>li a img {
    margin-right:5px;
}
.location .breadcrumb li.active a{
    color:#333333
}
.location .breadcrumb > li + li:before {
    content: "-";
    color: #999999;
    padding: 0 5px;
}

.content-wrap {
    position: relative;
}
.title-head{
    margin:40px 0 10px 0;
}
h3.title {
    font-size:26px;
    color:#333333;
    font-weight: bold;
    margin:0;
    text-transform: uppercase;
    padding-left:0;
}

@media (min-width: 992px){
    .title-head{
        height:30px;
        position: relative;
    }
}
@media (min-width: 769px){

    #dialog-login{
        min-width:418px;
    }
}
@media (max-width: 768px){
    .header-top,
    .header-bottom {
        display: none;
    }
    .header-fixed{
        display: block;
        background-color: #0b3779;
    }
    .header-fixed .top{
        margin:20px 0;
    }
    .header-fixed .top .logo{
        padding:0;
    }
    .header-fixed .top .logo img{
        max-width:200px;
        width:100%;
    }
    .header-fixed .top .gnb {
        list-style: none;
        padding:0;
        margin:0;
        text-align: right;
    }
    .header-fixed .top .gnb li{
        display: inline-block;
        margin-left:10px;
    }
    .header-fixed .top .gnb li a,
    .header-fixed .top .gnb li button{
        color:#fff;
        display: block;
        max-width:48px;
        padding: 0;
        background: none;
        border: none;
    }
    .header-fixed .lnb {
        list-style: none;
        padding:0;
        margin:0;
        text-align: center;
    }
    .header-fixed .lnb li {
        display: inline-block;
    }
    .header-fixed .lnb li a {
        display: block;
        color:#fff;
        font-size:13px;
        text-align: center;
        padding:15px 20px;
        text-transform: uppercase;
    }
    .header-fixed .lnb li.active a,
    .header-fixed .lnb li a:focus,
    .header-fixed .lnb li a:active,
    .header-fixed .lnb li a:hover{
        background-color: #fff;
        color:#0b3779;
        font-weight: bold;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
    }
    .header-fixed .side-menu  {
        width: 90%;
        position: fixed;
        z-index: 1;
        height: 100%;
        top: 0;
        bottom:0;
        right: -100%;
        background-color: #323a45;
        overflow-x: hidden;
        transition: 0.5s;
    }
    .header-fixed .side-menu a {
        color:#fff;
        font-size:15px;
        font-weight: bold;
        text-transform: uppercase;
    }
    .header-fixed .side-menu .top {
        border-bottom:1px solid #525861;
        padding:20px 10px;
        margin:0;
        position: relative;
    }
    .header-fixed .side-menu .top a img {
        max-width:30px;
        margin-right:10px;
        display: inline-block;
    }
    .header-fixed .side-menu .top .btn-close {
        position: absolute;
        top: 50%;
        margin-top:-20px;
        right: 0;
        padding:10px;
        background: none;
        border:none;
    }
    .header-fixed .side-menu .top .btn-close img{
        margin-right:0;
        max-width:20px;
    }
    .header-fixed .side-menu .menu-list {
        border-bottom:1px solid #525861;
        padding:20px 10px;
        text-align: center;
    }
    .header-fixed .side-menu .menu-list a {
        display: block;
        margin-bottom:20px;
        font-weight: normal;
    }
    .header-fixed .side-menu .links {
        border-bottom:1px solid #525861;
        padding:20px 10px;
        margin:0;
        position: relative;
    }
    .header-fixed .side-menu .links a {
        display: block;
        position: relative;
    }
    .header-fixed .side-menu .links a:after {
        content: '';
        background: url('../media/images/arrow.png') no-repeat center;
        background-size: contain;
        width:10px;
        height:18px;
        position: absolute;
        right:0;
        top:50%;
        margin-top:-9px;
    }
    #footer {
        text-align: center;
        padding:30px 0;
    }
    #footer a{
        float: none;
        margin-top:15px;
    }
    #dialog-login form,
    #dialog-contact{
        padding:0 20px;
    }
    #dialog-login .bottom{
        padding:20px;
    }
}
@media (max-width: 480px){
    .header-fixed .lnb li a{
        padding:10px 8px;
        font-size:12px;
    }

    #dialog-login{
        min-width:300px;
    }
    #dialog-login form .btn-login,
    #dialog-login .bottom .btn-signup{
        width:100%;
    }
    #dialog-login form a{
        padding:6px 0;
    }
}

/* shipment */
#shipmentBtn{
    display: none;
}
.shipment-btns{
    text-align: right;
    padding-right:0;
    margin-top:10px;
}
.shipment-btns a,
.shipment-btns button,
#profile-wrap .address-title a,
#profile-wrap .address-title button{
    font-size:13px;
    color:#777777;
    font-weight: bold;
    text-transform: uppercase;
    display: inline-block;
    margin-left:20px;
    background: none;
    border: 0;
    padding:0;
    outline: 0;
}
.shipment-btns .icon-new,
.shipment-btns .icon-delete,
.shipment-btns .icon-void,
.shipment-btns .icon-return,
#profile-wrap .address-title .icon-new,
#profile-wrap .address-title .icon-delete{
    color:#23558a;
}
.shipment-btns .icon-new:before,
#profile-wrap .address-title .icon-new:before{
    content: '';
    width:14px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -2px 0;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns .icon-delete,
.shipment-btns .icon-return{
    position: relative;
    margin-right:10px;
}
.shipment-btns .icon-delete:before,
#profile-wrap .address-title .icon-delete:before{
    content: '';
    width:14px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -23px 0;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns .icon-delete:after,
.shipment-btns .icon-return:after{
    content: '';
    width:1px;
    height:13px;
    background-color:#ababab;
    position: absolute;
    right: -15px;
    top:50%;
    margin-top:-7px;
}
.shipment-btns a.icon-export:before{
    content: '';
    width:17px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -42px 0;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns a.icon-create:before{
    content: '';
    width:14px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -63px 0;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns .icon-print:before{
    content: '';
    width:14px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -82px 0;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns .icon-batch:before{
    content: '';
    width:17px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -102px 0;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns .icon-void:before{
    content: '';
    width:17px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -81px -21px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
.shipment-btns .icon-return:before{
    content: '';
    width:17px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -102px -21px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}

.filter-wrap {
    position: absolute;
    right:0px;
    /*top:40px;*/
    top:126px;
    z-index: 10;
}
#filter{
    border:none;
    padding:15px;
    background: #fff;
    outline: none;
    border-right:1px solid #a3c441;
    border-top:1px solid #a3c441;
    height:56px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}
#filter span{
    width:24px;
    height:24px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -58px -19px;
    display: inline-block;
    vertical-align: middle;
}
#filterBox{
    display: none;
    position: absolute;
    padding: 15px;
    list-style: none;
    width: 370px;
    right: 0;
    background-color: #fff;
    border:1px solid #a3c441;
    border-top:0;
}
.filter-wrap ul li {
    border-bottom: 1px solid #e1e1e1;
    padding: 10px;
    list-style: none;
}
#filterBox .custom-checkbox{
    padding-right:25px;
    padding-left:0;
    font-weight: bold;
    color:#666666;
    margin-bottom:0;
}
#filterBox .custom-checkbox span {
    left:auto;
    right:0;
}
#filterBox .custom-checkbox input:checked ~ span{
    background-color: #bfbfbf;
}
#filterBox button {
    font-weight: bold;
    text-transform: uppercase;
    width:100%;
    margin-top:15px;
    padding:10px;
}

table.table thead th {
    background-color: #a3c441;
    color:#fff;
    border:none;
    text-align: left;
    padding:20px 10px;
    position: relative;
    font-weight: bold;
}
table.table thead th:first-child,
table.table tbody td:first-child{
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
table.table thead th:last-child,
table.table tbody td:last-child{
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}
table.table thead th:after {
    content: '';
    width:1px;
    height:28px;
    background-color: #c3d983;
    position: absolute;
    right:0;
    top:50%;
    margin-top:-14px;
}
table.table thead th:first-child:after,
table.table thead th:last-child:after,
table.table thead th:nth-last-child(2):after{
    display: none;
}
table.table tbody td{
    padding:8px;
}
table.table-click-active tbody tr.active td {
    background-color: #f0ece3 !important;
}
/* upload list css */
#dialog-upload,
#dialog-print{
    min-width:340px;
}
.ui-dialog .ui-dialog-titlebar{
    padding:20px 25px;
}
.ui-dialog .ui-dialog-titlebar-close{
    right:25px;
}
#dialog-upload form {
    padding:0 25px;
}
#dialog-upload form .row {
    margin-top:20px;
    margin-bottom:40px;
}
#dialog-upload form .row .col-xs-7{
    padding-right:0;
}
#dialog-upload .btn-send,
#dialog-print .btn-send{
    background-color: #0079b4;
}
#dialog-upload .btn-cancel,
#dialog-print .btn-cancel{
    background-color: #ffffff;
}
#dialog-upload .file-load{
    margin:20px 0;
}
#dialog-upload .file-load p{
    color:#999999;
    font-size: 11px;
    text-transform: uppercase;
    margin-bottom:5px;
}
#dialog-upload .file-load .progress {
    float: left;
    width: 90%;
    height: 2px;
    background-color: #e1e1e1;
    margin:5px 0;
}
#dialog-upload .file-load .progress .bar {
    width: 20%;
    height: 2px;
    background-color: #0079b4;
}
#dialog-upload .file-load .icon{
    float: right;
    width:14px;
    height:14px;
    background: url('../media/images/common_small_sprites.png') no-repeat;
    background-position: -44px -22px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
}
#dialog-upload .file-load .icon.del{
    background-position: -122px 2px;
}
#dialog-upload .file-wrap{
    padding:12px 0;
    width: 100%;
    height: 95px;
    border: 2px dashed #e1e1e1;
    background-color: #f6f6f6;
    text-align: center;
    position: relative;
    border-radius: 2px;
}
#dialog-upload .file-wrap p{
    color: #999999;
    font-size:11px;
    margin-top:12px;
    text-transform: uppercase;
}
#dialog-upload .file-wrap input{
    position: absolute;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    outline: none;
    opacity: 0;
    left:0;
    right:0;
    top:0;
    cursor: pointer;
}
#dialog-upload .bottom,
#dialog-print .bottom{
    padding:12px 25px;
    background-color: #f0ece3;
    text-align: center;
}
#dialog-upload .bottom  a,
#dialog-print .bottom a{
    font-weight: bold;
    color:#999999;
    text-transform: uppercase;
}
#dialog-upload .bottom img,
#dialog-print .bottom img{
    margin-right:10px;
}
#dialog-print .wrap {
    padding:0 25px;
}
#dialog-print .wrap .row {
    margin:20px -6px 40px -6px
}
#dialog-print .wrap .row .col-xs-6{
    padding:0 6px;
}
#dialog-print .preview-wrap{
    background-color: #f6f6f6;
    padding:8px;
    border-radius: 2px;
    text-align: left;
    min-height:176px;
}

@media (max-width:768px){
    .title-head{
        position: relative;
    }
    .btns-wrap {
        display: inline-block;
        float: right;
        position: relative;
    }
    #shipmentBtn{
        display: inline-block;
        border:none;
        outline: none;
        background: #fff;
    }
    #shipmentBtn span{
        width:36px;
        height:36px;
        background: url('../media/images/m-btns-icon.png') no-repeat;
        background-position: 0 0;
        background-size: cover;
        display: inline-block;
        vertical-align: middle;
    }
    #shipmentBtn.active span{
        background: url('../media/images/m-btns-icon.png') no-repeat;
        background-position: -38px 0;
        background-size: cover;
    }
    .shipment-btns{
        display: none;
        position: absolute;
        width: 185px;
        top: 48px;
        right: 0;
        background: #fff;
        border: 1px solid #a3c441;
        margin-top:0;
        text-align: left;
        padding: 0 15px;
        z-index: 10;
    }
    .shipment-btns a,
    .shipment-btns button{
        display: block;
        margin-left: 0;
        padding:10px 0;
        width: 100%;
        text-align: left;
    }
    .shipment-btns .icon-new,
    .shipment-btns .icon-delete{
        color: #777777;
    }
    .shipment-btns .icon-new:before{
        background-position: -2px -22px;
    }
    .shipment-btns .icon-delete:before{
        background-position: -23px -22px;
    }
    .shipment-btns .icon-delete:after,
    .shipment-btns .icon-return:after{
        display: none;
    }
    .shipment-btns .icon-delete,
    .shipment-btns .icon-return{
        border-bottom:1px solid #e1e1e1
    }
    .filter-wrap {
        position: static;
        right:0px;
        top:0;
        display: inline-block;
        float: right;
    }
    #filterBox {
        width: 100%;
        max-width:371px;
        top: 48px;
        border-top: 1px solid #a3c441;
        z-index: 100;
        padding:10px;
    }
    /*
    #filterBox ul {
        display: flex;
        flex-wrap: wrap;
    }*/
    #filterBox .custom-checkbox{
        padding-right:20px;
    }
    #filter{
        border:none;
        padding:0;
        background: #fff;
        outline: none;
        height:auto;
    }
    #filter span{
        width:36px;
        height:36px;
        background: url('../media/images/m-filter-icon.png') no-repeat;
        background-position: 0 0;
        background-size: cover;
        display: inline-block;
        vertical-align: middle;
    }
    #filter.active span{
        background: url('../media/images/m-filter-icon.png') no-repeat;
        background-position: -38px 0;
        background-size: cover;
    }
    #dialog-upload,
    #dialog-print{
        min-width:308px;
    }
}

/* create */
.create-wrap ul li {
    margin-bottom:10px;
}
.create-wrap .accordion {
    height:60px;
    background-color: #0079b4;
    font-size:18px;
    color:#fff;
    border:0;
    border-radius: 2px;
    padding:15px 35px;
    position: relative;
    width: 100%;
    text-align: left;
    outline: 0;
    text-transform: uppercase;
}
.create-wrap .accordion:after{
    content: '';
    width:24px;
    height:14px;
    position: absolute;
    right:35px;
    top:50%;
    margin-top:-7px;
    background: url('../media/images/accordian_arrow.png') no-repeat;
    background-position: -27px 0;
}
.create-wrap .accordion.active:after{
    background-position: 0 0;
}

.create-wrap .panel{
    margin-left:-4px;
    margin-right:-4px;
    margin-bottom:30px;
    display: flex;
    flex-wrap: wrap;
}
.create-wrap .cell-wrap {
    padding-left:4px;
    padding-right:4px;
    margin:10px 0 0 0;
}
.create-wrap .cell {
    background-color: #f0ece3;
    padding:30px 35px;
    border-radius: 2px;
    height:100%;
}
.create-wrap .cell .inner{
    max-width:680px;
    margin:0 auto;
}

.create-wrap .form-group>div {
    padding-left:4px;
    padding-right:4px;
}
.create-wrap .form-group label {
    font-size:11px;
    color:#999999;
    text-transform: uppercase;
    font-weight: normal;
    position: relative;
}
.create-wrap .form-group input[type=text]  {
    border:1px solid #fff;
    box-shadow: none;
}
.create-wrap .form-address input[type=text]{
    margin-bottom:8px;
}
.create-wrap .form-group select.custom-select {
    background-color: #fff;
    border:1px solid #fff;
    width:100%;
    border-radius: 2px;
}
.create-wrap .form-group .form-control::placeholder{
    font-style: italic;
}
.create-wrap .form-group .valid-feedback {
    color:#f2705b;
    font-size:11px;
    text-transform: uppercase;
}
.create-wrap .from-row{
    margin-left:-4px;
    margin-right:-4px;
}
.required .form-control {
    border:1px solid #f2705b !important;
    position: relative;
}
.required .form-control{
    background-image: url('../media/images/requredmdpi.png') !important;
    padding-right: calc(1.5em + .75rem);
    background-repeat: no-repeat;
    background-position: center right calc(0.375em + 0.1875rem);
}
.form-group .required-span {
    width:4px;
    height:4px;
    background-color: #0079b4;
    border-radius: 2px;
    display: inline-block;
    margin-left:5px;
    margin-top:-2px;
    vertical-align: middle;
}
.create-wrap .txt {
    font-size:13px;
    color:#999999;
    line-height: 30px;
    text-transform: uppercase;
}
.create-wrap .required-txt {
    color:#0079b4;
    padding-left:10px;
    position: relative;
}
.create-wrap .required-txt:before {
    content:"";
    width:4px;
    height:4px;
    background-color: #0079b4;
    border-radius: 2px;
    display: inline-block;
    left:0;
    top: 50%;
    margin-top: -2px;
    position: absolute;
}
.return-address-wrap {
    background-color: #f0f0f0;
    margin-bottom:10px;
    padding:11px 35px;
    border-radius: 2px;
}

.package-wrap .title-wrap{
    background-color: #999999;
    color:#fff;
}
.package-wrap .title-wrap .title {
    max-width:710px;
    margin:0 auto;
    padding:13px 15px;
}
.package-wrap .title-wrap h3 {
    font-size:18px;
}
.package-wrap .title-wrap a{
    font-size:13px;
    font-weight: bold;
    color:#fff;
    margin-left:10px;
    text-transform: uppercase;
}
.package-wrap .title-wrap a:before{
    content: '';
    margin-right:5px;
    background: url('../media/images/create_small_sprites.png') no-repeat;
    background-position: -50px 0px;
    display: inline-block;
    width: 12px;
    height: 12px;
}
.package-wrap .title-wrap .btn-del:before{
    background-position: -72px 0;
}
.package-wrap .title-wrap .btn-duplicate:before{
    background-position: -28px 0;
}
.package-wrap .inner-wrap {
    background-color: #f0ece3;
}
.package-wrap .inner-wrap2{
    background-color: #fff;
}
.package-wrap .inner-wrap .inner {
    max-width:710px;
    margin:0 auto;
    padding:25px 15px;
}
.package-wrap .inner-wrap .inner p {
    margin:0;
    font-size:15px;
    color:#666666;
}
.package-wrap .inner-wrap .inner p span {
    color:#0079b4;
}
.package-wrap .input-group{
    display: block;
}
.package-wrap .input-group input[type=text]{
    padding-right:3em;
}
.package-wrap .input-group .input-group-text{
    position: absolute;
    right: 10px;
    top: 6px;
    z-index: 100;
    font-size: 14px;
    color: #666666;
}
.package-wrap .btn-default{
    background-color: #cac1af;
    display: block;
    width: 100%;
    padding:13px 10px;
    text-transform: uppercase;
    margin-top:50px;
}
.package-form-wrap{
    margin-top:50px;
}
.package-form-wrap .txt{
    min-height:30px;
}
.package-form-wrap .txt span {
    display: inline-block;
    background-color: #f0ece3;
    position: absolute;
    padding-right:20px;
    color:#333333;
}
.package-form-wrap .txt:before{
    content: '';
    width:90%;
    height:1px;
    background-color: #cdcdcd;
    position: absolute;
    right:0;
    top:50%;
}
.package-form-wrap .active .txt span{
    color:#0079b4;
    font-weight: bold;
}
.package-form-wrap .txt:nth-child(4):before{
    width:85%;
}
.package-form-wrap .package-label {
    position: relative;
    margin: 10px 0 0 0;
}
.package-form-wrap .package-label input[type=checkbox]{
    position: absolute;
    left:0;
    margin-top:0;
}
.package-form-wrap .package-label span {
    padding-left:20px;
    display: block;
}
.package-form-wrap .hide-package {
    display: none;
}

.service-wrap .inner>p {
    font-size:18px;
    color:#666666;
    position: relative;
    margin-bottom:30px;
}
.service-wrap .inner>p:after{
    content: '';
    width:60%;
    height:1px;
    top:50%;
    right:0;
    position: absolute;
    background-color: #cdcdcd;
}
.service-wrap .card {
    border:1px solid #adadad;
    cursor: pointer;
    border-radius: 2px;
}
.service-wrap .card .card-header {
    background-color: #adadad;
    font-size:14px;
    font-weight: bold;
    color:#fff;
    text-align: center;
    text-transform: uppercase;
    padding:20px 10px;
}
.service-wrap .card .card-body{
    text-align: center;
    padding:15px;
    color:#adadad;
    font-size:13px;
    background-color: #fff;
}
.service-wrap .card .card-body .card-title{
    font-size:28px;
    font-weight: bold;
    margin-bottom:10px;
}
.service-wrap .card.active {
    border-color:#a3c441;
    position: relative;
}
.service-wrap .card.active:after{
    content: '';
    width:100%;
    height:100%;
    display: block;
    position: absolute;
    border:2px solid #a3c441;
    left:0;
    top:1px;
    border-radius: 2px;
}
.service-wrap .card.active .card-header{
    background-color: #a3c441;
}
.service-wrap .card.active .card-header:before{
    content: '';
    width:18px;
    height:15px;
    background: url('../media/images/create_small_sprites.png') no-repeat;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}
.service-wrap .card.active .card-body{
    color:#a3c441
}
.service-wrap .btn-default{
    background-color: #cac1af;
    display: block;
    width: 100%;
    padding:13px 10px;
    text-transform: uppercase;
    margin-top:50px;
}

.create-wrap .btn-wrap{
    margin:40px 0;
}
.create-wrap .btn-wrap button {
    color:#fff;
    width:160px;
    padding:8px;
    font-weight: bold;
}
.create-wrap .btn-wrap button.btn-save {
    background-color: #0079b4;
}
.create-wrap .btn-wrap button.btn-label {
    background-color: #666666;
}

@media (max-width:678px){
    .create-wrap .accordion{
        padding:15px;
    }
    .create-wrap .accordion:after{
        right:15px;
    }
    .create-wrap .cell{
        padding:10px;
    }
    .return-address-wrap{
        padding:10px;
    }
    .create-wrap .txt{
        line-height: 15px;
    }

    .package-wrap .title-wrap .title{
        padding:13px 10px
    }
    .package-wrap .inner-wrap .inner{
        padding:25px 10px
    }
    .package-wrap .title-wrap .text-right{
        padding-left:0;
    }
    .package-form-wrap .txt:before{
        display: none;
    }
    .package-form-wrap .txt span{
        padding-right:0;
        padding-left:10px
    }
    .package-form-wrap .txt {
        display: flex;
        align-items: center;
    }
    .service-wrap .inner>p:after{
        display: none;
    }
    .service-wrap .card .card-header {
        padding: 20px 5px;
    }
    .service-wrap .card.active .card-header:before{
        margin-right:5px;
    }
    .service-wrap .card .card-body{
        padding:10px;
    }
    .service-wrap .card .card-body .card-title{
        font-size:23px;
    }
    .create-wrap .btn-wrap button{
        width:136px;
    }

}

/* shipment edit */
#shipment-edit>.container>div.edit-row{
    margin-left:-15px;
    margin-right:-15px;
    clear: both;
    position: relative;
    overflow: hidden;
}
#shipment-edit>.container>div.edit-row::before{
    display: table;
    content: " ";
}
#shipment-edit>.container>div.edit-row::after{
    content: '';
    dispaly: table;
    clear: both;
}
#shipment-edit .table-responsive{
    width: 100%;
    overflow-y: hidden;
}
#shipment-edit .table-responsive>.table>tbody>tr>td,
#shipment-edit .table-responsive>.table>thead>tr>td,
#shipment-edit .table-responsive>.table>thead>tr>th {
    white-space: nowrap;
}
#shipment-edit .btns-wrap {
    display: none;
}
#shipment-edit #create_new{
    padding-top:30px;
}
#shipment-edit #create_new h4.title {
    font-size:20px;
    color:#666666;
    font-weight: bold;
    text-transform: uppercase;
    padding:0;
}
#shipment-edit #create_new h4 .edit-close{
    float: right;
    border:0;
    padding:0;
}
#shipment-edit .edit-wrap table th {
    background-color: #8c8c8c;
    color:#fff;
}
#shipment-edit .edit-wrap table td {
    background-color: #f4f4f4;
    color:#666666;
}
#shipment-edit .pagination-wrap{
    text-align: left;
}
@media (min-width:769px){
    #shipment-edit .edit-wrap table th,
    #shipment-edit .edit-wrap table td{
        padding: 8px 25px;
    }
}

/* status */
#status-wrap .filter-wrap{
    /*top:144px;*/
    top:230px;
}
.status-ul {
    display: flex;
    border-left:1px solid #e3e3e3;
    margin-bottom:14px !important;
}
.status-ul li{
    border:1px solid #e3e3e3;
    border-left:0;
    width:16.666%;
    display: inline-block;
}
.status-ul li a {
    padding:12px;
    display: block;
    font-size:13px;
    color:#999999;
    text-transform: uppercase;
    line-height: 12px;
    background-color: #f9f9f9;
    height:100%;
    position: relative;
}
.status-ul li a .img {
    display: block;
    margin-bottom:15px;
    width: 30px;
    height: 30px;
    margin-left:auto;
    margin-right:auto;
}
.status-ul li a .count {
    position: absolute;
    right: 12px;
    bottom: 15px;
    border-radius: 50px;
    font-size:14px;
    color:#fff;
    background-color:#999999;
    font-weight: bold;
    text-align: center;
    width: 22px;
    height: 22px;
    line-height: 22px;
}
.status-ul li a .img.img-label{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: 0 0;
}
.status-ul li a .img.img-transit{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -51px 0;
}
.status-ul li a .img.img-delivered{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -102px 0;
}
.status-ul li a .img.img-delivery{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -152px 0;
    margin-bottom:10px;
}
.status-ul li a .img.img-voided{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -203px 0;
}
.status-ul li a .img.img-all{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -254px 0;
}
.status-ul li.active a{
    background-color: #0079b4;
    color:#fff;
    font-weight: bold;
}
.status-ul li.active a .count {
    color:#0079b4;
    background-color: #fff;
}
.status-ul li.active a .img.img-label{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: 0 -53px;
}
.status-ul li.active a .img.img-transit{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -51px -53px;
}
.status-ul li.active a .img.img-delivered{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -102px -53px;
}
.status-ul li.active a .img.img-delivery{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -152px -53px;
}
.status-ul li.active a .img.img-voided{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -203px -53px;
}
.status-ul li.active a .img.img-all{
    background: url('../media/images/status_sprites.png') no-repeat;
    background-position: -254px -53px;
}
@media (max-width:768px){
    .status-ul{
        flex-wrap: wrap;
        border-top:1px solid #e3e3e3
    }
    .status-ul li {
        width: 33.333%;
        border-top:0;
    }
    .status-ul li a{
        text-align: center;
    }
    .status-ul li a .count{
        top:4px;
        right:4px;
        bottom:auto;
        width: 18px;
        height: 18px;
        line-height: 18px;
        font-size:11px;
    }
}

/* profile */
#profile-wrap .credit-wrap {
    background-color: #f0ece3;
    padding:30px 0;
    font-size:12px;
    color:#999999;
    margin-bottom:30px;
    text-transform: uppercase;
}
#profile-wrap .credit-wrap h4 {
    font-size:36px;
    color:#0b3779;
    font-weight: bold;
}
#profile-wrap .credit-wrap .btn-credit {
    font-size:13px;
    color:#0b3779;
    border:1px solid #0b3779;
    border-radius: 2px;
    text-align: center;
    padding:10px 30px;
    text-transform: uppercase;
    font-weight: bold;
    margin-top:10px;
}
#profile-wrap .content-wrap{
    margin-bottom:80px;
}
#profile-wrap .from-row,
#dialog-change .from-row{
    margin-left: -4px;
    margin-right: -4px;
}
#profile-wrap .form-group>div,
#dialog-change .from-row>div{
    padding-left: 4px;
    padding-right: 4px;
}
#profile-wrap form label,
#dialog-change form label{
    font-size:11px;
    color:#999999;
    text-transform: uppercase;
}
#profile-wrap form .form-control,
#dialog-change form .form-control{
    background-color: #ebebeb;
    border-color:#ebebeb;
    color:#666666;
    box-shadow: none;
}
#profile-wrap form .form-control::placeholder{
    color:#666;
}
#profile-wrap .btn-wrap button.btn-save {
    background-color: #0b3779;
    color:#fff;
    text-transform: uppercase;
    width: 160px;
    padding: 9px;
}
#profile-wrap .btn-wrap button.btn-change {
    color:#333333;
    float: right;
    background: none;
    border:none;
    text-transform: uppercase;
    margin-top:7px;
}
#profile-wrap .address-wrap {
    background-color: #f5f5f5;
    padding:35px 0;
}
#profile-wrap .address-wrap .address-title{
    margin-bottom:20px
}
#profile-wrap .address-wrap .address-title h5,
#profile-wrap .address-form h5{
    font-size:20px;
    color:#666666;
    font-weight: bold;
    text-transform: uppercase;
}
#profile-wrap .address-wrap ul li {
    border:1px solid #d5d5d5;
    border-radius: 2px;
    padding:15px 20px;
    color:#666666;
    text-transform: uppercase;
    background-color: #fff;
    margin-bottom:8px;
}
#profile-wrap .address-wrap ul li label {
    color:#666666;
    text-transform: uppercase;
    margin:0;
    font-size:15px;
    font-weight: normal;
}
#profile-wrap .address-wrap ul li input[type=checkbox]{
    margin:0 10px 0 0;
}
#profile-wrap .address-wrap ul li.active {
    background-color: #0079b4;
    border-color:#0079b4;
    color:#fff;
    position: relative;
}
#profile-wrap .address-wrap ul li.active:after {
    content: '';
    background: url('../media/images/arrow-white.png') no-repeat;
    width:14px;
    height:24px;
    display: inline-block;
    position: absolute;
    right:23px;
    top:50%;
    margin-top:-12px;
}
#profile-wrap .address-wrap ul li.active label{
    color:#fff;
}
#profile-wrap .address-form .inner{
    background-color: #fff;
    border:1px solid #d5d5d5;
    border-radius: 2px;
    padding:25px;
}
#profile-wrap .address-form h5 {
    margin:5px 0 30px 0;
}
#profile-wrap .form-address input{
    margin-bottom:8px;
}
#profile-wrap .address-form button.btn-save {
    background-color: #0079b4;
    color:#fff;
    text-transform: uppercase;
    width: 160px;
    padding: 9px;
}
#profile-wrap .address-form button.btn-cancel {
    background-color: #666666;
    color:#fff;
    text-transform: uppercase;
    margin-left:10px;
    width: 160px;
    padding: 9px;
}
#dialog-change{
    min-width:418px
}
.dialog-change-ui .wrap{
    padding:10px 25px;
}
.dialog-change-ui .ui-dialog-buttonpane{
    padding:.3em 20px .5em 20px;
}
.dialog-change-ui .ui-dialog-buttonpane button.btn-send{
    background-color: #0b3779;
    width:136px;
}
@media (max-width:768px){
    #dialog-change{
        min-width:308px
    }
    #profile-wrap .btn-wrap button.btn-save,
    #profile-wrap .address-form button.btn-save,
    #profile-wrap .address-form button.btn-cancel{
        width:auto;
    }
}

#overlay{	
	position: fixed;
	top: 0;
	z-index: 100;
	width: 100%;
	height:100%;
	display: none;
	background: rgba(0,0,0,0.6);
}
.cv-spinner {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;  
}
.spinner {
	width: 40px;
	height: 40px;
	border: 4px #ddd solid;
	border-top: 4px #2e93e6 solid;
	border-radius: 50%;
	animation: sp-anime 0.8s infinite linear;
}
@keyframes sp-anime {
	100% { 
		transform: rotate(360deg); 
	}
}
.overlay-content{color:white;text-transform:uppercase;letter-spacing:.4em;font-size:1.15em;font-weight:700;text-align:center;display:table-cell;vertical-align:middle}
.is-hide{
	display:none;
}
/* fixed Footer */
footer {
    position: fixed;
    height: 42px;
    bottom: 0;
    width: 100%;
}