header {
    position: absolute;
    top: 0;
    background: #fed700;
    width: 100%;
    height: 55px
}

.wrap-main {
    max-width: 1200px;
    min-width: 1024px;
    width: 100%;
    height: 55px;
    background: #000;
    margin: auto;
    position: relative;
    display: block
}

[class^="icontgdd-"], [class*="icontgdd-"], [class^="iconmobile-"], [class*="iconmobile-"] {
    background-image: url(https://cdn.thegioididong.com/v2015/Content/desktop/images/V4/icondesktop@1x.png);
    background-repeat: no-repeat;
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    vertical-align: middle
}

@media all and (-webkit-min-device-pixel-ratio: 1.5) {
    [class^="icontgdd-"], [class*="icontgdd-"], [class^="iconmobile-"], [class*="iconmobile-"] {
        background-image: url(https://cdn.thegioididong.com/v2015/Content/desktop/images/V4/icondesktop@2x.png);
        background-size: 500px 100px
    }
}

.icontgdd-logo {
    background-position: 0 0;
    width: 156px;
    height: 30px;
    display: block;
    margin: auto
}

.icontgdd-topsearch {
    background-position: -160px 0;
    width: 20px;
    height: 20px;
    display: block;
    margin: 1px auto 0
}

.icontgdd-mobile {
    background-position: -190px 0;
    width: 16px;
    height: 25px;
    display: block;
    margin: 2px auto 3px
}

.icontgdd-tablet {
    background-position: -209px 0;
    display: block;
    margin: 0 auto 5px;
    width: 33px;
    height: 22px
}

.icontgdd-laptop {
    background-position: -245px 0;
    display: block;
    margin: 0 auto 5px;
    width: 39px;
    height: 21px
}

.icontgdd-phukien {
    background-position: -288px 0;
    display: block;
    margin: 0 auto 5px;
    width: 22px;
    height: 22px
}

.icontgdd-maydoitra {
    background-position: -315px 0;
    display: block;
    margin: 0 auto 4px;
    width: 34px;
    height: 26px
}

.icontgdd-simcard {
    background-position: -355px 0;
    display: block;
    margin: 0 auto 5px;
    width: 18px;
    height: 23px
}

.icontgdd-news {
    background-position: -375px 0;
    display: block;
    margin: 0 auto 2px;
    width: 29px;
    height: 24px
}

.icontgdd-ask {
    background-position: -410px 0;
    display: block;
    margin: 0 auto 3px;
    width: 25px;
    height: 25px
}

.icontgdd-gameapp {
    background-position: -439px 0;
    display: block;
    margin: 0 auto 5px;
    height: 20px;
    width: 32px
}

.icontgdd-promo {
    background-position: -475px 0;
    display: block;
    margin: 0 auto 3px;
    width: 22px;
    height: 24px
}

.rowfoot1 {
    display: block;
    overflow: hidden;
    width: 100%;
    min-width: 1024px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 15px 0
}

.colfoot {
    float: left;
    width: 28%;
    margin: 0;
    position: relative
}

.collast {
    width: 11%;
    float: right
}

.colfoot li {
    float: none;
    position: relative;
    font-size: 13px;
    color: #444
}

.colfoot li a {
    display: block;
    color: #288ad6;
    font-size: 14px;
    line-height: 25px;
    padding-top: 5px
}

.colfoot li a:hover {
    color: #666
}

.colfoot li a.bct, .colfoot li a.dmca-badge {
    display: inline-block
}

.colfoot li p {
    display: block;
    padding-top: 5px;
    line-height: 25px;
    font-size: 14px;
    color: #666
}

.colfoot li p a {
    display: inline;
    font-weight: 600;
    color: #333;
    padding: 0 5px
}

.colfoot li.showmore {
    font-weight: bold
}

.colfoot li.showmore a:after {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 5px solid #288ad6;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    margin: 0 0 0 5px;
    position: relative;
    top: -2px
}

.colfoot li.showmore a:hover:after {
    border-top: 5px solid #666
}

.colfoot li.hidden {
    display: none
}

.colfoot li a.linkfb {
    float: left;
    padding: 0 10px 0 0;
    margin: 9px 0 2px;
    border-right: 1px solid #e9e9e9;
    font-size: 12px;
    line-height: 1;
    color: #288ad6
}

.colfoot li a.linkyt {
    float: left;
    padding: 0 0 0 10px;
    margin: 9px 0 2px;
    font-size: 12px;
    color: #288ad6;
    line-height: 1
}

.colfoot li a.dmx {
    display: block;
    overflow: hidden;
    clear: both;
    padding: 5px 0
}

.rowfoot2 {
    width: 100%;
    min-width: 980px;
    overflow: hidden;
    background: #f8f8f8;
    padding: 10px 0
}

.rowfoot2 p {
    display: block;
    width: 100%;
    margin: auto;
    font-size: 10px;
    color: #999;
    text-align: center
}

.rowfoot2 a {
    color: #999
}

.icontgdd-share1 {
    background-position: 0 -30px;
    width: 13px;
    height: 13px;
    margin-right: 3px
}

.icontgdd-share3 {
    background-position: -16px -30px;
    width: 17px;
    height: 13px;
    margin-right: 3px
}

.icontgdd-dmx {
    background-position: -36px -30px;
    width: 100px;
    height: 19px
}

.icontgdd-bct {
    background-position: 0 -50px;
    width: 123px;
    height: 38px
}

.stickcart {
    position: fixed;
    right: 70px;
    bottom: 42px;
    background: #fff;
    border-radius: 40px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15);
    font-size: 14px;
    color: #288ad6;
    padding: 0 10px 0 0;
    width: 130px;
    z-index: 99
}

.stickcart div {
    float: left;
    width: 38px;
    height: 38px;
    border-radius: 40px;
    background: #ffde31;
    margin: 2px 5px 2px 2px
}

.stickcart span {
    display: block;
    padding: 4px 0 0;
    white-space: nowrap
}

.stickcart strong {
    display: block;
    white-space: nowrap
}

.icontgdd-cartstick {
    background-position: -265px -30px;
    width: 22px;
    height: 18px;
    display: block;
    margin: 11px 0 0 6px
}

[class^="iconlogo-"], [class*="iconlogo-"] {
    background-image: url(/Content/desktop/images/V4/logosite2018.png);
    background-repeat: no-repeat;
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    vertical-align: middle
}

@media (-webkit-min-device-pixel-ratio: 1.5) {
    [class^="iconlogo-"], [class*="iconlogo-"] {
        background-image: url(/Content/desktop/images/V4/logosite2018@2x.png);
        background-size: 517px 20px
    }
}

.iconlogo-bhx {
    background-position: -220px 0;
    width: 110px;
    height: 19px
}

.iconlogo-dmx {
    background-position: -109px 0;
    width: 111px;
    height: 19px
}

.iconlogo-vv {
    background-position: -330px 0;
    width: 74px;
    height: 19px
}

.iconlogo-ta {
    background-position: -409px 0;
    width: 100px;
    height: 19px
}

.group {
    display: block;
    overflow: hidden;
    clear: both
}

.group label {
    display: block;
    font-size: 12px;
    color: #888;
    margin-top: 10px
}

.group a {
    display: block;
    vertical-align: top;
    padding-top: 0 !important
}

.breadcrumb {
    display: block;
    overflow: hidden;
    margin: 0;
    background: #fff;
    line-height: 32px;
    padding-top: 5px
}

.breadcrumb li {
    display: inline-block;
    vertical-align: middle;
    overflow: hidden
}

.breadcrumb li a {
    display: inline-block;
    white-space: nowrap;
    font-size: 14px;
    color: #288ad6;
    padding: 0 10px 0 0
}

.breadcrumb span {
    display: inline-block;
    font-size: 20px;
    color: #999;
    padding: 2px 5px 0 0;
    line-height: 1
}

.breadcrumb li h1, .breadcrumb li h2 {
    display: inline-block;
    font-size: 14px;
    color: #288ad6;
    font-weight: normal;
    line-height: 32px
}

.breadcrumb li h1 a {
    color: #288ad6
}

.breadcrumb li h2 a {
    padding-left: 2px;
    color: #288ad6
}

#back-top {
    display: none;
    z-index: 99
}

#back-top span:before {
    cursor: pointer;
    background: #fdd504;
    width: 40px;
    position: fixed;
    right: 20px;
    bottom: 45px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    -o-transition: all .2s linear;
    -transition: all .2s linear;
    color: #000;
    content: "▲";
    opacity: .7;
    z-index: 8;
    border-radius: 5px
}

#back-top span:hover:before {
    opacity: 1
}

#dlding, #imgtrack, .none {
    display: none
}

.wrap-suggestion {
    display: block;
    border: 1px solid #e2e2e2;
    background: #fff;
    position: absolute;
    left: 0;
    width: 345px;
    top: 45px;
    z-index: 9
}

.wrap-suggestion:after, .wrap-suggestion:before {
    bottom: 100%;
    left: 80px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute
}

.wrap-suggestion:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 8px;
    margin-left: -8px
}

.wrap-suggestion:before {
    border-color: rgba(218, 218, 218, 0);
    border-bottom-color: #dadada;
    border-width: 9px;
    margin-left: -9px
}

.wrap-suggestion li {
    display: block;
    background: #fff;
    overflow: hidden;
    list-style: none;
    border-bottom: 1px dotted #ccc
}

.wrap-suggestion li:last-child {
    border-bottom: 0
}

.wrap-suggestion li:hover, .wrapp-producthome .wrap-suggestion li.selected, .wrap-main .wrap-suggestion li.selected {
    background: #f8f8f8
}

.wrap-suggestion li a {
    display: block;
    overflow: hidden;
    padding: 6px;
    color: #333;
    font-size: 12px
}

.wrap-suggestion li a img {
    float: left;
    width: 50px;
    height: auto;
    margin: 0 6px 0 0
}

.wrap-suggestion li a h3 {
    display: block;
    width: auto;
    color: #333;
    font-size: 14px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.wrap-suggestion li a h6 {
    font-size: 12px;
    color: #e67e22
}

.wrap-suggestion li a span {
    float: left;
    font-size: 13px;
    color: #333
}

.wrap-suggestion li a span.price {
    font-size: 12px;
    color: #c70100;
    float: none
}

.wrap-suggestion li a label {
    display: block;
    font-size: 12px;
    color: #999;
    padding-left: 56px
}

.wrap-suggestion li a label strong {
    font-size: 12px;
    color: #d0021b
}

.wrap-suggestion li.samsung img {
    display: inline-block;
    vertical-align: middle;
    width: 80px
}

.wrap-suggestion li.samsung b {
    display: inline-block;
    vertical-align: middle;
    color: #333
}

.wrap_rts {
    overflow: hidden;
    position: fixed;
    z-index: 11;
    bottom: 0;
    right: 10%
}

.wrap_rts .pop {
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
    max-width: 400px;
    margin: auto;
    background: #fff;
    margin-top: 20%;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: solid 1px #ccc
}

.wrap_rts .pop .hdpop {
    padding: 10px 0 10px 10px;
    border-bottom: solid 1px #ccc;
    font-size: 15px;
    background: #f89406;
    color: #fff
}

.wrap_rts .pop .hdpop .closehd {
    float: right;
    color: #fff;
    border: solid 1px #fff;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 13px;
    text-align: center;
    cursor: pointer;
    font-style: normal;
    box-sizing: border-box;
    padding-top: 3px
}

.wrap_rts .pop .if {
    display: block;
    padding: 10px 10px 0
}

.wrap_rts .pop .if .price {
    color: #d0021b
}

.wrap_rts .pop .ivt {
    display: block;
    padding: 10px 10px 0;
    text-align: center
}

.wrap_rts .pop ul.ol {
    padding: 10px;
    border-bottom: 1px solid #ddd
}

.wrap_rts .pop ul.ol li {
}

.wrap_rts .pop ul.ol li .iprn {
    color: #288ad6
}

.wrap_rts .pop ul.ol li .iprn:before {
    content: '•';
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
    color: #999;
    margin-right: 5px
}

.wrap_rts .pop ul.ol li .iprp {
    color: #d0021b;
    float: right
}

.wrap_rts .pop ul.rtt {
    padding: 10px;
    overflow: hidden
}

.wrap_rts .pop ul.rtt li {
    text-align: center;
    float: left;
    width: 33%;
    color: #288ad6;
    cursor: pointer
}

.wrap_rts .pop ul.rtt li img {
    display: block;
    width: 40px;
    height: 40px;
    margin: 0 auto 10px
}

.wrap_rts .pop .chsRtUstf {
    border-radius: 5px;
    border: solid 1px #ccc;
    overflow: hidden;
    margin: 10px;
    padding: 10px
}

.wrap_rts .pop .chsRtUstf span {
    display: block;
    text-align: center;
    margin: 0 0 10px
}

.wrap_rts .pop .chsRtUstf a.chbUt {
    display: block;
    width: 50%;
    float: left;
    color: #288ad6;
    padding: 10px 0
}

.wrap_rts .pop .chsRtUstf a.chbUt i {
    margin: 0 8px
}

.wrap_rts .pop .chsRtUstf a.chbUt span {
    display: inline
}

.wrap_rts .pop .chsRtUstf a.btnRsUs {
    padding: 8px;
    background: #288ad6;
    color: #fff;
    border-radius: 5px;
    text-align: -webkit-center;
    width: 75px;
    margin: 10px auto 0;
    display: -webkit-box
}

.wrap_rts .pop .msg {
    margin: 10px 0 20px
}

.wrap_rts .pop .btnRs {
    padding: 8px;
    background: #fff;
    color: #288ad6;
    border: solid 1px #288ad6;
    border-radius: 5px;
    text-align: -webkit-center;
    width: 75px;
    margin: 10px auto 0;
    display: -webkit-box
}

.wrap_rts .iconmobile-uncheckbox {
    background-position: -145px -30px;
    width: 16px;
    height: 16px;
    vertical-align: sub
}

.wrap_rts .iconmobile-checkbox {
    background-position: -165px -30px;
    width: 16px;
    height: 16px;
    vertical-align: sub
}

.hide {
    display: none !important
}

@media screen and (max-width: 1220px) {
    .wrap-main {
        width: 1024px
    }
    .icontgdd-logo {
        width: 28px
    }

    .topinput {
        width: 152px
    }

    nav {
        width: 764px
    }

    nav a {
        font-size: 11px
    }

    .colfoot li a {
        padding: 0 0 0 5px;
        line-height: 30px
    }

    .colfoot {
        width: 26.5%
    }

    .collast {
        width: 13%
    }

    .colfoot li a.bct {
        padding: 0
    }

    .breadcrumb {
        margin: 0 10px
    }
}

/* 01:45:46 21/05/2018 */
.show {
    display: block
}

.none {
    display: none
}

.note_address, .note_market {
    background: #fff;
    border: 1px dashed #c10017;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    margin: 5px 0 10px 0;
    padding: 10px;
    font-size: 13px;
    color: #c10017;
    margin-top: 10px
}

#wrap_cart, #wrap_cart section {
    background: #fff
}

.bar-top {
    display: block;
    overflow: hidden;
    width: 100%;
    max-width: 600px;
    margin: auto
}

.provision {
    display: block;
    overflow: hidden;
    font-size: 11px;
    color: #999;
    text-align: center;
    line-height: 50px
}

.provision a {
    color: #999
}

#wrap_cart {
    padding: 0 15px;
}
.wrap_cart {
    display: block;
    width: 100%;
    /*max-width: 600px;*/
    margin:15px auto 30px;
    background: #fff;
    border: 1px solid #d8d8d8;
    box-shadow: 0 0 20px rgba(0, 0, 0, .15);
}

.buymore {
    float: left;
    overflow: hidden;
    position: relative;
    line-height: 40px;
    font-size: 14px;
    color: #288ad6;
    padding: 15px 0 0 15px
}

.buymore:before, .buymore:after {
    content: '';
    width: 0;
    height: 0;
    border-right: 7px solid #288ad6;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    position: absolute;
    left: 0;
    top: 28px
}

.buymore:after {
    margin-left: 2px;
    border-width: 9px;
    border-right-color: #f0f0f0;
    top: 26px
}

.yourcart {
    display: block;
    overflow: hidden;
    background: #fff;
    text-align: right;
    color: #333;
    line-height: 40px;
    padding-top: 15px
}

.listorder {
    display: block;
    overflow: visible;
    background: #fff;
    clear: both;
    padding: 10px 30px 0 30px
}

.listorder li {
    display: block;
    border-bottom: 1px solid #e8e8e8;
    margin:0 0 10px 0;
    padding: 10px 0;
}

.listorder li:last-child {
    margin-bottom: 0
}

.listorder li a {
    display: block;
    overflow: hidden
}

.listorder li img {
    display: inline-block;
    width: 75px;
    margin: 5px 0 10px
}

.listorder li .colimg {
    float: left;
    overflow: hidden;
    width: 85px;
    text-align: center
}

.listorder li .colimg button {
    display: block;
    text-align: center;
    font-size: 12px;
    color: #616161;
    width: 40px;
    border: 0;
    background: #fff;
    margin: auto;
    cursor: pointer
}
.listorder li .colimg button:hover,.listorder li .colimg button:focus{
    color: #c10808;
    outline: 0;
}
.listorder li .colimg button span {
    float: left;
    width: 12px;
    height: 12px;
    background: #ccc;
    border-radius: 10px;
    position: relative;
}

.listorder li .colimg button span:before, .listorder li .colimg button span:after {
    top: 2px;
    left: 5px
}

.listorder li .colimg button span:before {
    content: '';
    width: 2px;
    height: 8px;
    background: #fff;
    position: absolute;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg)
}

.listorder li .colimg button span:after {
    content: '';
    width: 2px;
    height: 8px;
    background: #fff;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg)
}

.listorder li .colinfo {
    display: inline-block;
    overflow: visible;
    padding-left: 5px
}

.listorder li .colinfo a {
    display: inline-block;
    font-size: 14px;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    width: 62%
}

.listorder li .colinfo a:hover {
    color: #f46d35;
    text-decoration: underline;
}

.listorder li .colinfo > a {
    font-weight: bold
}

.listorder li .colinfo strong {
    font-weight: normal;
    font-size: 14px;
    color: #c10017;
    float: right
}
.listorder li .colinfo strong span {
    display: block;
    font-size: 12px;
    color: #666;
    text-decoration: line-through
}

.listorder li .colinfo .saleacc {
    display: block;
    overflow: hidden;
    font-size: 12px;
    color: #c10017;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    width: 62%;
    margin-top: 5px;
    line-height: normal
}

.cartone .listorder li .promotion {
    background: #fff
}

.cartone .listorder li .promotion span {
    color: #333
}

.listorder li .promotion span .infoend {
    display: none
}

.cartone .listorder li .promotion span:before {
    color: #999
}

.listorder li .promotion {
    width: 100%;
    background: #fff;
    height: auto;
    display: block;
    overflow: hidden
}

.listorder li .promotion .title {
    display: none
}

.listorder li .promotion .title label {
    color: #288ad6;
    font-size: 12px
}

.listorder li .promotion.many span {
    display: none
}

.listorder li .promotion.many .title {
    display: block;
    cursor: pointer
}

.listorder li .promotion.many .title label {
    cursor: pointer;
    position: relative
}

.listorder li .promotion.many .title label:after {
    content: '';
    width: 0;
    right: -20px;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    display: inline-block;
    vertical-align: middle;
    float: right;
    position: absolute;
    top: 5px
}

.listorder li .promotion span {
    display: block;
    overflow: hidden;
    padding-left: 10px;
    color: #333;
    font-size: 12px
}

.listorder li .promotion span:before {
    content: '•';
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
    color: #999;
    margin: 0 3px 0 -10px
}

.listorder li .promotion span a {
    display: inline;
    font-size: 12px;
    color: #288ad6
}

.listorder li .promotion span * {
    font-size: 12px
}

.listorder li .promotion ul {
    display: inline-block;
    vertical-align: top
}

.listorder li .promotion ul li {
    min-height: 0;
    border-bottom: 0;
    padding: 0;
    margin: 0
}

.choosecolor {
    float: left;
    position: relative;
    width: 140px;
    border: 1px solid #dfdfdf;
    background: #fff;
    border-radius: 3px;
    line-height: 32px;
    font-size: 14px;
    color: #288ad6;
    padding: 0 5px;
    margin: 5px 10px 0 0
}

.choosecolor span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 91%;
    cursor: pointer
}

.choosecolor:after {
    content: '';
    width: 0;
    right: 0;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    display: inline-block;
    vertical-align: middle;
    margin: 13px 5px 0 0;
    float: right;
    position: absolute;
    top: 0
}

.listcolor {
    display: none;
    overflow: visible;
    position: absolute;
    top: 36px;
    min-width: 130px;
    left: 0;
    z-index: 9;
    background: #fff;
    border: 1px solid #d9d9d9;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 0 10px;
    -moz-box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1)
}

.listcolor:before, .listcolor:after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #ccc;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.listcolor:after {
    border-width: 9px;
    margin-left: 1px;
    border-bottom-color: #fff
}

.listorder li .listcolor a {
    width: auto;
    margin: 0;
    overflow: visible;
    padding: 7px 0 10px 0;
    display: block;
    height: 30px;
    color: #288ad6;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    white-space: nowrap
}

.listorder li .listcolor a:last-child {
    border: 0
}

.listorder li .listcolor img {
    width: 30px;
    height: 30px;
    margin: 0 0 0 -4px;
    display: inline-block;
    vertical-align: middle
}

.choosenumber {
    float: right;
    overflow: hidden;
    position: relative;
    width: 25%;
    border: 1px solid #dfdfdf;
    background: #fff;
    border-radius: 3px;
    line-height: 32px;
    font-size: 14px;
    color: #333;
    margin: 5px 0 5px 0
}

.abate {
    float: left;
    border-right: 1px solid #dfdfdf;
    background: #fff;
    width: 32%;
    height: 32px;
    position: relative;
    cursor: pointer;
    pointer-events: none
}

.abate:before {
    content: '';
    width: 12px;
    height: 2px;
    background: #ccc;
    display: block;
    margin: 15px auto
}

.abate.active {
    pointer-events: auto
}

.abate.active:before {
    background: #288ad6
}

.number {
    font-size: 14px;
    color: #333;
    float: left;
    width: 33%;
    height: 32px;
    text-align: center
}

.augment {
    float: right;
    border-left: 1px solid #dfdfdf;
    background: #fff;
    width: 32%;
    height: 32px;
    position: relative;
    cursor: pointer
}

.augment:before {
    content: '';
    width: 12px;
    height: 2px;
    background: #288ad6;
    display: block;
    margin: 15px auto
}

.augment:after {
    content: '';
    width: 2px;
    height: 12px;
    background: #288ad6;
    display: block;
    margin: 0 auto;
    position: absolute;
    top: 10px;
    left: 0;
    right: 0
}

.augment.disable {
    pointer-events: none
}

.augment.disable:before, .augment.disable:after {
    background: #ccc
}

.onecolor {
    float: left;
    position: relative;
    width: 48%;
    background: #fff;
    line-height: 32px;
    font-size: 14px;
    color: #333;
    margin: 5px 0
}

.onecolor span {
    color: #999
}

.area_total {
    display: block;
    overflow: hidden;
    padding: 10px 30px 10px;
    border-bottom: 1px solid #d8d8d8;
    background: #fff
}

.area_total a {
    color: #288ad6;
    display: inline-block;
    cursor: pointer
}

.area_total div {
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #333;
    line-height: 22px
}

.area_total div span {
    float: left
}

.area_total div span:nth-child(2) {
    float: right
}

.area_total div.total {
    display: block
}

.area_total div.total b {
    float: left
}

.area_total div.total strong {
    float: right;
    font-size: 16px;
    color: #c10017
}

.textcode {
    color: #288ad6 !important;
    cursor: pointer;
    text-align: right
}

.inputcode {
    display: block;
    overflow: hidden;
    margin: 10px 0
}

.inputcode input {
    display: block;
    width: 40%;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding: 9px;
    float: right;
    margin-right: 10px
}

.inputcode button {
    float: right;
    background: #288ad6;
    border-radius: 4px;
    border: 0;
    height: 40px;
    font-size: 14px;
    color: #fff;
    width: 90px;
    text-align: center;
    cursor: pointer
}

.inputerror, input.error {
    border-color: #dd4b39 !important
}

.texterror, label.success, label.error {
    display: inline-block;
    font-size: 12px;
    color: #dd4b39;
    margin-bottom: 5px
}
label.success {
    color: green;
}
label.warning {
    color: #f46d35;
}

#txtCode {
    float: right;
    margin: 10px 10px 0 0
}
.boxCouponCode{
    margin-top: 5px;
}

label#BillingAddress_DistictId-error {
    float: right;
    width: 47%
}

.infouser {
    display: block;
    overflow: hidden;
    background: #fff;
    padding: 0 30px
}

.infouser.none {
    display: none
}

.malefemale {
    display: block;
    overflow: hidden;
    padding: 20px 0 0;
    background: #fff
}

.malefemale label {
    float: left;
    margin-right: 30px;
    cursor: pointer
}

.icontgdd-opt, .iconmobile-opt {
    background-position: -380px -30px;
    width: 16px;
    height: 16px;
    vertical-align: sub
}

.areainfo {
    display: block;
    padding: 0
}

.areainfo.none {
    display: none
}

.areainfo input {
    display: block;
    padding: 18px 0 !important;
    height: 20px;
    border: 1px solid #d9d9d9;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    margin: 10px 0 5px;
    text-indent: 10px;
    width: 99.6%
}

.areainfo .left {
    float: left;
    width: 49%;
    margin-bottom: 5px
}

.areainfo .right {
    float: right;
    width: 49%;
    margin-bottom: 5px
}

.infoold.infooldemail {
    padding: 0 30px 10px 30px
}

.infoold {
    display: block;
    overflow: hidden;
    padding: 20px 30px 10px 30px;
    background: #fff
}

.infoold span {
    color: #288ad6;
    display: inline-block;
    margin-left: 10px;
    vertical-align: top;
    border-bottom: 1px dotted #288ad6;
    cursor: pointer
}

.area_other {
    display: block;
    overflow: visible;
    padding: 15px 30px 0;
    background: #fff
}

.area_other .textnote {
    display: block;
    overflow: hidden;
    margin-bottom: 10px
}

.address {
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
    color: #288ad6
}

.address.none {
    display: none
}

.address label, .supermarket label {
    color: #288ad6;
    cursor: pointer
}

.address label.choose, .supermarket label.choose {
    color: #333
}

.supermarket {
    display: inline-block;
    vertical-align: top;
    color: #288ad6
}

.choose .icontgdd-opt, .choose .iconmobile-opt {
    background-position: -400px -30px
}

.area_address {
    overflow: visible;
    background: #f0f0f0;
    margin-top: 15px;
    padding: 20px 20px 0 20px;
    position: relative
}

.area_address.show {
    display: block
}

.area_address:before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 65px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #f0f0f0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}
.area_address.stores:before {
    left: 200px;
}

.area_address.onlyhome {
    display: block;
    margin-top: 0
}

.area_address.onlyhome:before {
    border: none
}

.boxCompany {
    overflow: visible;
    background: #f0f0f0;
    padding: 10px 20px 0;
    position: relative;
    border-bottom: 1px solid #f0f0f0
}

.citydis {
    display: block;
    /*height: 40px;*/
    position: relative;
    margin-bottom: 5px
}

.city {
    float: left;
    position: relative;
    width: 42%;
    /*border: 1px solid #d9d9d9;*/
    background: #fff;
    /*border-radius: 3px;*/
    font-size: 14px;
    color: #288ad6;
    /*padding: 10px 1.5% 6px*/
}

.city span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    width: 88%;
    cursor: pointer
}

.city:after {
    content: '';
    width: 0;
    right: 0;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    /*display: inline-block;*/
    display: none !important;
    vertical-align: middle;
    margin: 7px 5px 0 0;
    float: right;
    position: absolute
}

.listcity {
    display: none;
    overflow: visible;
    position: absolute;
    z-index: 15;
    top: 43px;
    left: 0;
    width: 300px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding-bottom: 10px
}

.listcity:before, .listcity:after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #ccc;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.listcity:after {
    border-width: 9px;
    margin-left: 1px;
    border-bottom-color: #fff
}

.listcity aside {
    float: left;
    width: 50%
}

.searchlocal {
    display: block;
    overflow: hidden;
    padding: 10px 10px 0
}

.searchlocal div {
    display: block;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: #fff;
    height: 34px;
    position: relative
}

.searchlocal input {
    display: block;
    border: 0;
    background: #fff;
    padding: 5px;
    height: 24px;
    border-radius: 4px;
    width: 90%
}

.searchlocal .submit {
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px 10px;
    background: #fff;
    border-radius: 0 3px 3px 0;
    border: 0;
    height: 34px;
    cursor: pointer
}

.icontgdd-search, .iconmobile-search {
    background-position: -355px -30px;
    width: 16px;
    height: 16px
}

.checkexist .scroll {
    display: block;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 220px
}

.area_address .scroll, .area_market .scroll {
    float: left;
    width: 100%;
    max-height: 170px;
    overflow: auto
}

.listcity a {
    display: block;
    padding: 10px 10px 0;
    font-size: 14px;
    color: #288ad6;
    cursor: pointer
}

.wardId{
    padding-top: 5px;
}
.dist {
    float: right;
    position: relative;
    width: 47%;
    background: #fff;
    font-size: 14px;
    color: #288ad6;
    /*border: 1px solid #d9d9d9;*/
    /*border-radius: 3px;*/
    /*padding: 10px 1.5% 6px*/
}

.dist span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    width: 88%;
    cursor: pointer
}

.dist:after {
    content: '';
    width: 0;
    right: 0;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    /*display: inline-block;*/
    display: none;
    vertical-align: middle;
    margin: 7px 5px 0 0;
    float: right;
    position: absolute
}

.listdist {
    display: none;
    overflow: visible;
    position: absolute;
    z-index: 15;
    top: 43px;
    right: 0;
    width: 300px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding-bottom: 10px
}

.listdist:before, .listdist:after {
    content: '';
    position: absolute;
    bottom: 100%;
    right: 70px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #ccc;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.listdist:after {
    border-width: 9px;
    margin-right: 1px;
    border-bottom-color: #fff
}

.listdist a {
    display: block;
    padding: 10px 10px 0;
    font-size: 14px;
    color: #288ad6;
    cursor: pointer
}

.checkexist .scroll {
    display: block;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 220px
}

.listdist aside {
    float: left;
    width: 50%
}

.area_market {
    display: none;
    overflow: visible;
    background: #f0f0f0;
    margin-top: 15px;
    padding: 20px;
    position: relative
}

.area_market.show {
    display: block
}

.area_market:before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 210px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #f0f0f0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.area_market.onlystore {
    display: block;
    margin-top: 0
}

.area_market.onlystore:before {
    border: none
}

.area_market .listmarket {
    padding: 10px 0
}

.area_market .areainfo input {
    margin-top: 5px
}

.searchstore {
    display: block;
    overflow: hidden;
    padding: 0;
    position: relative;
    border: 1px solid #d9d9d9;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px
}

.searchstore input {
    display: block;
    border: 0;
    background: #fff;
    padding: 5px;
    height: 24px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    width: 92%
}

.searchstore .submit {
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px 10px;
    background: #fff;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: 0;
    height: 34px;
    cursor: pointer
}

.listmarket {
    display: block;
    overflow: auto;
    clear: both;
    max-height: 200px
}

.listmarket li {
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #333;
    padding: 0 0 10px 20px;
    cursor: pointer
}

.listmarket.searchs li.s {
    display: block
}

.listmarket.searchs li {
    display: none
}

.listmarket.searchs .viewmarket {
    display: none
}

.listhours.layer {
    max-height: 160px;
    overflow: auto
}

.listhours span.none, .listmarket li.none, .viewmarket.none {
    display: none
}

.listmarket li .icontgdd-opt, .listmarket li .iconmobile-opt {
    margin-left: -20px
}

.listmarket li.choosemarket .icontgdd-opt, .listmarket li.choosemarket .iconmobile-opt {
    background-position: -400px -30px
}

.listmarket li * {
    cursor: pointer
}

.listmarket li span {
    color: #14b61b;
    font-size: 12px;
    cursor: pointer
}

.listmarket li .two-7date {
    color: #e67e22
}

.viewmarket {
    display: block;
    overflow: hidden;
    position: relative;
    font-size: 14px;
    color: #288ad6;
    cursor: pointer
}

.viewmarket:after {
    content: '';
    width: 0;
    right: 0;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 5px
}

.otheradd {
    display: block;
    overflow: hidden;
    position: relative;
    font-size: 14px;
    color: #288ad6;
    margin: 0 10px 10px 20px;
    cursor: pointer
}

.homenumber {
    display: block;
    padding: 9px 0 !important;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    margin: 5px 0;
    text-indent: 10px;
    width: 99.8%
}

.timeship {
    display: block;
    padding: 9px 0;
    font-size: 14px;
    color: #333;
    margin: 0
}

.area_market .timeship {
    padding: 0
}

.timereceive {
    float: left;
    padding: 9px 0;
    font-size: 14px;
    color: #333;
    margin-right: 10px
}

.area_market .date {
    float: left;
    position: relative;
    width: 100%;
    border: 1px solid #d9d9d9;
    background: #fff;
    border-radius: 3px;
    font-size: 14px;
    color: #333;
    padding: 10px 1.5% 10px;
    box-sizing: border-box
}

.area_market .date span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #288ad6;
    display: inline
}

.date {
    float: left;
    position: relative;
    width: 42%;
    border: 1px solid #d9d9d9;
    background: #fff;
    border-radius: 3px;
    font-size: 14px;
    color: #288ad6;
    padding: 10px 1.5% 6px
}

.date span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    width: 88%;
    cursor: pointer
}

.date:after {
    content: '';
    width: 0;
    right: 0;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    display: inline-block;
    vertical-align: middle;
    margin: 7px 5px 0 0;
    float: right;
    position: absolute
}

.listdate {
    display: none;
    overflow: visible;
    position: absolute;
    z-index: 15;
    top: 43px;
    left: 0;
    right: 0;
    width: 46%;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1)
}

.listreceive {
    left: 110px
}

.listdate span {
    display: block;
    padding: 10px 0;
    margin: 0 10px;
    font-size: 14px;
    color: #288ad6;
    border-bottom: 1px solid #d9d9d9;
    cursor: pointer
}

.listdate span:last-child {
    border: 0
}

.listdate:before, .listdate:after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #ccc;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.listdate:after {
    border-width: 9px;
    margin-left: 1px;
    border-bottom-color: #fff
}

.hours {
    float: right;
    position: relative;
    width: 47%;
    border: 1px solid #d9d9d9;
    background: #fff;
    border-radius: 3px;
    font-size: 14px;
    color: #288ad6;
    padding: 10px 1.5% 6px
}

.hours span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    width: 88%;
    cursor: pointer
}

.hours:after {
    content: '';
    width: 0;
    right: 0;
    border-top: 6px solid #288ad6;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    display: inline-block;
    vertical-align: middle;
    margin: 7px 5px 0 0;
    float: right;
    position: absolute
}

.listhours {
    display: none;
    overflow: visible;
    position: absolute;
    z-index: 15;
    top: 43px;
    right: 0;
    width: 50%;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1)
}

.listhours:before, .listhours:after {
    content: '';
    position: absolute;
    bottom: 100%;
    right: 70px;
    width: 0;
    height: 0;
    border-bottom: 10px solid #ccc;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent
}

.listhours:after {
    border-width: 9px;
    margin-right: 1px;
    border-bottom-color: #fff
}

.listhours span {
    display: block;
    padding: 10px 0;
    margin: 0 10px;
    font-size: 14px;
    color: #288ad6;
    border-bottom: 1px solid #d9d9d9;
    cursor: pointer
}

.listhours span:last-child {
    border: 0
}

.cathe {
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #333;
    padding: 10px 0;
    cursor: pointer
}

.htkt {
    display: block;
    overflow: hidden;
    font-size: 14px;
    color: #333;
    padding: 10px 0 0;
    cursor: pointer
}

.icontgdd-checkbox, .iconmobile-checkbox {
    background-position: -145px -30px;
    width: 16px;
    height: 16px;
    vertical-align: sub
}

.cathe.check .icontgdd-checkbox, .cathe.check .iconmobile-checkbox, .notemoreproduct.check .icontgdd-checkbox, .notemoreproduct.check .iconmobile-checkbox, .htkt.check .icontgdd-checkbox, .htkt.check .iconmobile-checkbox {
    background-position: -165px -30px
}

.billvat {
    display: block;
    overflow: hidden;
    margin: 0 0 10px 0
}

.billvat label {
    display: block;
    cursor: pointer
}

.vat.check .icontgdd-checkbox, .vat.check .iconmobile-checkbox {
    background-position: -165px -30px
}

.infocompany {
    display: none;
    overflow: hidden
}

.infocompany input:first-child {
    margin-top: 10px
}

.infocompany input {
    display: block;
    padding: 9px 0 !important;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    margin: 5px 0;
    text-indent: 10px;
    width: 99%
}

.infocompany textarea {
    display: block;
    padding: 9px 0;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    margin-top: 10px;
    text-indent: 10px;
    width: 99%
}

.requestother {
    display: block;
    padding: 9px 0;
    height: 20px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    margin: 10px 0;
    text-indent: 10px;
    width: 99.8%
}

.area_secur {
    display: block;
    overflow: hidden;
    margin: 0 30px;
    background: #fff
}

.area_secur span {
    display: block;
    overflow: hidden;
    margin: 10px 0
}

.area_secur .capcha {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    width: 130px;
    float: left
}

.area_secur .changecode {
    display: block;
    color: #288ad6;
    padding: 5px 0;
    cursor: pointer
}

.area_secur .entercapcha {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    width: 30.5%;
    float: left;
    margin-left: 10px
}

.area_secur input {
    display: block;
    padding: 9px 0;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    height: 20px;
    text-indent: 10px;
    width: 98%;
    margin-bottom: 8px
}

.payoffline {
    cursor: pointer;
    float: left;
    overflow: hidden;
    width: 100%;
    max-width: 538px;
    padding: 9px 0;
    margin: 10px 0 20px 30px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    background: #fd6e1d;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fd6e1d), to(#f59000));
    background: -webkit-linear-gradient(top, #f59000, #fd6e1d);
    background: -moz-linear-gradient(top, #f59000, #fd6e1d);
    background: -ms-linear-gradient(top, #f59000, #fd6e1d);
    background: -o-linear-gradient(top, #f59000, #fd6e1d)
}

.payoffline.full {
    width: 90%
}

.payoffline span {
    display: block;
    font-size: 12px;
    color: #fff;
    text-transform: none;
    font-weight: normal
}

.align {
    float: none;
    display: block;
    margin: 10px auto;
    width: 265px
}

.payonline {
    float: right;
    overflow: hidden;
    margin: 10px 30px 20px 0;
    position: relative;
    width: 260px
}

.payonline div {
    display: block;
    overflow: hidden;
    cursor: pointer;
    padding: 9px 0;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    background: #0e74c2;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0e74c2), to(#288ad6));
    background: -webkit-linear-gradient(top, #288ad6, #0e74c2);
    background: -moz-linear-gradient(top, #288ad6, #0e74c2);
    background: -ms-linear-gradient(top, #288ad6, #0e74c2);
    background: -o-linear-gradient(top, #288ad6, #0e74c2)
}

.payonline span {
    display: block;
    font-size: 12px;
    color: #fff;
    text-transform: none;
    font-weight: normal
}

.onlinemethod {
    display: none;
    text-align: center
}

.onlinemethod .rechoose {
    display: block;
    text-align: center;
    padding: 10px;
    color: #288ad6
}

.atm {
    text-align: center;
    text-transform: uppercase;
    margin-right: 1px;
    padding: 9px 3px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    font-size: 12px;
    line-height: 1.3em;
    background: #4a90e2;
    color: #fff;
    border-color: #2465c7;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#205db6), to(#2a71d8));
    background: -webkit-linear-gradient(top, #2a71d8, #205db6);
    background: -moz-linear-gradient(top, #2a71d8, #205db6);
    background: -ms-linear-gradient(top, #2a71d8, #205db6);
    background: -o-linear-gradient(top, #2a71d8, #205db6);
    display: inline-block;
    vertical-align: middle;
    width: 200px
}

a {
    text-decoration: none
}

.atm span {
    display: block;
    text-transform: none;
    font-size: 12px
}

.visa {
    text-align: center;
    text-transform: uppercase;
    padding: 18px 3px 15px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    font-size: 12px;
    line-height: 1.3em;
    background: #0037a0;
    color: #fff;
    border-color: #001f5b;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00308a), to(#0037a0));
    background: -webkit-linear-gradient(top, #0037a0, #00308a);
    background: -moz-linear-gradient(top, #0037a0, #00308a);
    background: -ms-linear-gradient(top, #0037a0, #00308a);
    background: -o-linear-gradient(top, #0037a0, #00308a);
    display: inline-block;
    vertical-align: middle;
    width: 200px
}

.paytext {
    display: none;
    overflow: hidden;
    padding: 10px 0;
    color: #288ad6;
    float: none;
    margin-left: 216px;
    text-align: center;
    line-height: 40px
}

.paytext:hover {
    color: #333
}

.message {
    color: red;
    text-align: center;
    margin: 2%
}

.itemfull .colimg {
    float: left;
    overflow: hidden;
    width: 75px;
    text-align: center
}

.itemfull .colinfo {
    display: block;
    overflow: visible;
    font-size: 13px;
    padding: 20px
}

.itemfull {
    background: #fff;
    border: 1px solid #ccc;
    -moz-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin: 10px;
    padding: 10px
}

.itemfull .colimg button {
    display: block;
    text-align: center;
    font-size: 12px;
    color: #999;
    width: 60px;
    border: 0;
    background: #fff;
    margin: auto
}

.itemfull .colimg button span {
    float: left;
    width: 12px;
    height: 12px;
    background: #ccc;
    border-radius: 10px;
    position: relative;
    margin-top: 3px
}

.itemfull .colimg button span:before, .itemfull .colimg button span:after {
    top: 2px;
    left: 5px
}

.itemfull .colimg button span:before {
    content: '';
    width: 2px;
    height: 8px;
    background: #fff;
    position: absolute;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg)
}

.itemfull .colimg button span:after {
    content: '';
    width: 2px;
    height: 8px;
    background: #fff;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg)
}

.shipping_store.none {
    display: none
}

.existEmail {
    font-size: 13px;
    color: #333;
    margin-top: 5px
}

.existEmail a {
    color: #288ad6
}

/* 09:47:44 06/10/2016 */
.htmlloading {
}

.overlay {
    display: none;
    width: 100%;
    height: 100%;
    max-height: 100vh;
    background: rgba(255, 255, 255, .5);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100000;
    clear: both;
    text-align: center;
    overflow: hidden
}

.loading-cart {
    display: none;
    width: 100%;
    height: 100%;
    max-height: 100vh;
    background: rgba(255, 255, 255, .5);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100000;
    clear: both;
    text-align: center;
    overflow: hidden
}

.loading-cart .csdot, .overlay .csdot {
    width: 8px;
    height: 8px;
    border: 1px solid #288ad6;
    background: #288ad6;
    border-radius: 50%;
    float: left;
    margin: 0 2px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-animation: fx 1000ms ease infinite 0ms;
    animation: fx 1000ms ease infinite 0ms;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .1)
}

.loading-cart .cswrap, .overlay .cswrap {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.csdot:nth-child(2) {
    -webkit-animation: fx 1000ms ease infinite 300ms;
    animation: fx 1000ms ease infinite 300ms
}

.csdot:nth-child(3) {
    -webkit-animation: fx 1000ms ease infinite 600ms;
    animation: fx 1000ms ease infinite 600ms
}

@-webkit-keyframes fx {
    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes fx {
    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

/* 04:41:32 12/06/2017 */
.listorder li .promotion .pro-title {
    padding: 5px 0;
    margin: 0
}

.listorder li .promotion.webnote .pro-title {
    padding: 10px 0;
    border-top: 1px solid #ddd
}

.listorder li .promotion .pro-chosse {
    padding-left: 0;
    cursor: pointer
}

.listorder li .promotion .pro-title:before, .listorder li .promotion .pro-chosse:before {
    content: none
}

.listorder li .promotion .check .icontgdd-opt, .listorder li .promotion .check .iconmobile-opt {
    background-position: -400px -30px
}

.listorder .icontgdd-opt, .listorder .iconmobile-opt {
    margin-right: 5px
}

.listorder li .listcombo.check .iconmobile-checkbox {
    background-position: -165px -30px;
}

.listorder li .listcombo {
    overflow: hidden;
    background: white;
}

.listorder li .listcombo .tit {
    padding: 10px 0px;
    cursor: pointer;
}

.listorder li .listcombo .tit b {
    font-weight: normal;
    color: #c10017;
}

.listorder li .listcombo.check .pitem {
    display: block;
}

.listorder li .listcombo .pitem {
    display: none;
    border-top: 1px solid #dfdfdf;
    padding: 5px 0px;
}

.listorder li .listcombo a {
    margin-bottom: 10px;
}

.listorder li .listcombo .img {
    float: left;
    width: 35px;
    height: 35px;
}

.listorder li .listcombo img {
    width: 35px;
    height: 35px;
}

.listorder li .listcombo .info {
    display: block;
    overflow: hidden;
    margin-left: 40px;
}

.listorder li .listcombo .info strong {
    margin-right: 0px;
    margin-top: 5px;
}

.listorder li .listcombo h3 {
    font-size: 12px;
    margin-top: 5px;
    color: #333;
    float: left;
    width: 70%;
}

.listorder li .listcombo span {
    float: right;
    font-size: 12px;
    color: #666;
    width: 20%;
    text-align: right;
    text-decoration: line-through;
}

.listorder li .listcombo span + span {
    width: 5%;
    margin-right: 10px;
    text-align: center;
}

#showfirtcombo[value=true] ~ .listorder li .listcombo .pitem {
    display: block;
}
#showonehour[value=true] ~ .area_other .area_address .onehour {
    display: block !important;
}

/********************************** Custom *************************************/
#formCheckOut .alert{
    margin-bottom: 0;
}
.wrap_cart label{
    font-weight: normal;
}
.cartItem{
    display: inline-block;
    width: 100%;
    clear: both;
}
.item-first{
    display: inline-block;
    width: 100%;
    margin-bottom: 5px;
}
.item-first a{
    font-weight: bold;
    font-size: 15px;
}
.colinfo .promotion label{
    font-weight: normal;
}
.itemColor{
    display: block;
    margin-top: 5px;
}
.itemColor strong{
    float: none  !important;
    margin-right: 0;
}
.payment-list input[type="radio"]:not(.paymentBanks){
    display: none;
}
.b.select_bank label {
    display: flex;
    column-gap: 5px;
}
.item-Bank .float-left>label {
    display: flex;
    flex-direction: column;
}
/********************************** Media *************************************/
@media (min-width: 1200px) {
    .listorder li .colinfo{
        width: 450px;
    }
}
@media (max-width: 767px) {
    .areainfo .right, .areainfo .left{
        width: 100%;
    }
    .area_total{
        padding: 10px 15px;
    }
    .infouser{
        padding: 0 15px;
    }
    .area_other{
        padding: 15px 15px 0 15px;
    }
    .choosepayment{
        padding: 15px;
    }
    .inputcode input{
        width: 60%;
    }
    .areainfo .left, .areainfo .left input{
        margin-bottom: 0;
    }
    #formCheckOut .formError{
        left: auto !important;
        right: 0 !important;
    }
    #formCheckOut .formError .formErrorArrow {
        margin: -2px 0 0 80%;
    }
}
@media (max-width: 550px) {
    .city,.dist{
        width: 100%;
        margin-bottom: 10px;
    }
    .choosepayment{
        display: inline-block;
        width: 100%;
    }
    .payoffline, .payonline{
        width: 100%;
        margin: 0 0 10px 0;
    }
    #txtCode {
        margin: 10px 0 0 0;
        width: 100%;
        text-align: right;
    }
}

.check .listBank {
    display: block;
}
.listBank>span {
    padding: 0 1px;
    width: 50px;
    height: 35px;
    border: 1px dashed #ccc;
    display: inline-block;
    margin: 2px;
    cursor: pointer;
}
.listBank>span.active {
    border: 2px dashed #e32124;
}
#showCarrier,#tableShipFee{
    display: block !important;
}
#tableShipFee div{
    overflow: auto;
}
.number {
    border: none;
}
@media (min-width: 992px){
  #formCheckOut .detail_cart{
      order: 2;
  }
}
@media (max-width: 550px){
    .wardId{
        padding: 0;
        margin-bottom: 10px;
    }
}
#cusUsedPoint{
    border-radius: 25px;
    border: 1px solid rgba(112, 112, 112, 0.75);
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-indent: 5px;
    font-size: 0.875rem;
}
.area_total .order-summary-emphasis {
    float: right;
    font-size: 14px;
}
label.provision {
    text-align: start;
}

label.provision input {
    width: 16px !important;
    height: 16px !important;
}

label.provision {
    font-size: 14px;
    font-weight: 700;
    color: #000;
}
.listBankWrp{
    position: relative;
}
.listBankWrp .form-group{
    border: 1px solid #dedede;
    border-radius: 5px;
    cursor: pointer;
}
.listBankWrp.deactive_bank{
    pointer-events:none !important;
}
.listBankWrp .form-group.active{
    border: 1px solid #009cf6;
    background: #f5f5f5;
}
.form-group.active .resultQr{
    display: block !important;
}
@media screen and (max-width: 900px){
    .listBankWrp .col-12{
        padding: 0 15px !important;
    }
}

@media screen and (max-width: 768px){
    .text-banks-title {
        display: inline-block;
        max-width: 45%;
    }
    .listBankWrp .form-group{
        padding-top: 10px;
        padding-bottom: 10px;
    }
}
.deactive_bank .loaderWrp{
    display: block;
}
.loaderWrp{
    display: none;
}
.loaderWrp .loader {
    margin-top: 7%;
    width: 48px;
    height: 48px;
    border: 3px solid #FFF;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}
.loaderWrp .loader::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 3px solid;
    border-color: #FF3D00 transparent;
}
.loaderWrp{
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    bottom: 0;
    background: #cbcbcbba;
    top: 0;
    z-index: 999;
}
@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotate {
    0%   {transform: rotate(0deg)}
    100%   {transform: rotate(360deg)}
}

@keyframes prixClipFix {
    0%   {clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}
    50%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}
    75%, 100%  {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}
}
label.provision p {
    margin: 0;
}
label.provision {
    display: flex;
    align-items: center;
    gap: 10px;
}
.product-promotion-content{
    display: flex;
    align-items: center;
}
.listorder li .colinfo .product-promotion-content a{
    width: 100%;
}